/* ==========================================================================
   Yerba Sell — warstwa projektowa panelu (ponad Bootstrap 4 / Windu)
   Paleta marki Yerbador (yerbador.pl):
     limonka  #c4fd02   •   ciemna zieleń #09371a   •   zieleń #5c904d
   Panel CSS jest ładowany też na ekranie logowania (panel_css w windu_admin).
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root {
    --sll-limonka: #c4fd02;
    --sll-limonka-ciemna: #aad402;
    --sll-limonka-tlo: #f3fcd8;
    --sll-zielony: #09371a;
    --sll-zielony-jasny: #14512a;
    --sll-zielen: #5c904d;
    --sll-zielen-tlo: #f2f8ee;
    --sll-obwodka: #e6ebe5;
    --sll-tlo: #f4f6f4;
    --sll-tekst: #2b3a31;
    --sll-tekst-slaby: #6b7a70;
}

/* ---------- Typografia ----------------------------------------------------
   Windu deklaruje Open Sans, ale plik fontu jest pusty — przeglądarka
   wpada w serifowy fallback. Wymuszamy Inter wszędzie. */

body,
.h1, .h2, .h3, .h4, .h5, .h6,
h1, h2, h3, h4, h5, h6,
.card-title, .card-header, .modal-title, .dropdown-item, .nav-link,
.btn, button, input, select, textarea, .form-control, .custom-select,
table, th, td, label, .badge, .alert, .toast, .page-link, .list-group-item,
.navbar-vertical, .header, .breadcrumb {
    font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif !important;
}

body {
    color: var(--sll-tekst);
    background-color: var(--sll-tlo);
    -webkit-font-smoothing: antialiased;
    font-size: .9rem;
    letter-spacing: -0.01em;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .card-title {
    font-weight: 700 !important;
    color: var(--sll-zielony);
    letter-spacing: -0.02em;
}

/* Tytuł strony w górnym pasku */
.header .header-title,
.header-title {
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--sll-zielony);
}

/* ---------- Przyciski ---------------------------------------------------- */

.btn {
    border-radius: .6rem;
    font-weight: 600;
    letter-spacing: 0;
    padding: .45rem 1rem;
    transition: all .15s ease;
}
.btn-sm, .btn-group-sm > .btn { border-radius: .5rem; padding: .3rem .7rem; }
.btn-xs { padding: .15rem .45rem; font-size: .75rem; border-radius: .4rem; }
.btn svg, .btn i { pointer-events: none; }

.btn-primary {
    background-color: var(--sll-zielony);
    border-color: var(--sll-zielony);
    color: #fff;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active {
    background-color: var(--sll-zielony-jasny);
    border-color: var(--sll-zielony-jasny);
    color: #fff;
}
.btn-primary:focus,
.btn-primary.focus {
    box-shadow: 0 0 0 .2rem rgba(196, 253, 2, .35);
}
.btn-primary.disabled, .btn-primary:disabled { background-color: var(--sll-zielony); border-color: var(--sll-zielony); }

.btn-outline-primary {
    color: var(--sll-zielony);
    border-color: #c4d2c2;
}
.btn-outline-primary:hover {
    background-color: var(--sll-zielony);
    border-color: var(--sll-zielony);
    color: var(--sll-limonka);
}
.btn-outline-primary:focus { box-shadow: 0 0 0 .2rem rgba(196, 253, 2, .35); }

.btn-outline-secondary { color: #55645a; border-color: #cfd8cf; }
.btn-outline-secondary:hover { background: #f0f3f0; color: var(--sll-zielony); border-color: #b9c6b8; }

.btn-outline-danger { color: #b3362b; border-color: #e5c2be; }
.btn-outline-danger:hover { background: #b3362b; border-color: #b3362b; }

/* Główny przycisk akcji w stylu sklepu: limonka + ciemna zieleń */
.btn-sll-limonka,
.btn-sll-limonka:hover {
    background-color: var(--sll-limonka);
    border-color: var(--sll-limonka);
    color: var(--sll-zielony);
    font-weight: 700;
}
.btn-sll-limonka:hover { background-color: var(--sll-limonka-ciemna); border-color: var(--sll-limonka-ciemna); }
.btn-sll-limonka:focus { box-shadow: 0 0 0 .2rem rgba(9, 55, 26, .25); }

/* ---------- Linki i akcenty ---------------------------------------------- */

a { color: var(--sll-zielony-jasny); font-weight: 500; }
a:hover { color: var(--sll-zielen); }

.text-primary { color: var(--sll-zielony) !important; }
.bg-primary { background-color: var(--sll-zielony) !important; }
.bg-sll-limonka { background-color: var(--sll-limonka) !important; }

/* ---------- Formularze --------------------------------------------------- */

/* Uniwersalna siatka pół formularza: równa kolumna po 220 px, bez dziur
   i rozjeżdżania niezależnie od liczby pól i szerokości ekranu. */
.form-grid,
.form-grid-kupujacy {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: .65rem 1rem;
}
.form-grid > .form-group,
.form-grid-kupujacy > .form-group,
.form-grid > .mb-3,
.form-grid-kupujacy > .mb-3 { margin-bottom: 0 !important; }

.form-control, .custom-select {
    border-color: #d9e0d7;
    border-radius: .55rem;
    padding: .42rem .75rem;
    font-size: .875rem;
    height: auto;
    color: var(--sll-tekst);
}
.form-control:focus, .custom-select:focus {
    border-color: var(--sll-zielen);
    box-shadow: 0 0 0 .22rem rgba(92, 144, 77, .16);
}
.form-control::placeholder { color: #9aa79d; }
.form-control-lg { padding: .6rem 1rem; font-size: 1rem; }

label { color: #43523f; font-weight: 600; font-size: .78rem; margin-bottom: .3rem; padding: 0; }
/* Gwiazdka pola wymaganego — wewnątrz etykiety, mała i limonkowa. */
label.required:after {
    content: "*";
    color: #6f9a00;
    font-weight: 700;
    margin-left: .15em;
    font-size: .85em;
    vertical-align: top;
}
.form-text { color: var(--sll-tekst-slaby); font-size: .76rem; margin-top: .2rem; }
.input-group-text { border-color: #d9e0d7; background: var(--sll-zielen-tlo); color: var(--sll-zielony); border-radius: .55rem; font-weight: 600; }

/* Wiersz pozycji zamówienia — spójna karta z linią, nie "pudełko w pudełku". */
.pozycja-wiersz {
    border: 1px solid #e3eae2;
    border-radius: .65rem;
    padding: .75rem .9rem .35rem;
    margin-bottom: .6rem;
    background: #fdfefd;
    transition: border-color .12s ease, box-shadow .12s ease;
}
.pozycja-wiersz:hover { border-color: #bcd8b4; box-shadow: 0 2px 8px -4px rgba(9, 55, 26, .25); }
.pozycja-wiersz .form-group { margin-bottom: .55rem; }

/* Filtry listy — inline select2 z sensowną szerokością, nie rozpychają paska */
.filtr-pasek .select2-container { min-width: 180px; }
.filtr-pasek input.form-control { max-width: 260px; }

.custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--sll-zielony);
    border-color: var(--sll-zielony);
}
.custom-switch .custom-control-input:checked ~ .custom-control-label::after { background-color: var(--sll-limonka); }
.custom-control-input:focus:not(:checked) ~ .custom-control-label::before { border-color: var(--sll-zielen); box-shadow: 0 0 0 .2rem rgba(196, 253, 2, .3); }

/* Select2 (motyw bootstrap-5 z Windu) w barwach marki */
.select2-container--bootstrap-5 .select2-selection {
    border-color: #d9e0d7;
    border-radius: .55rem;
    padding: .35rem .7rem;
    font-size: .875rem;
}
.select2-container--bootstrap-5.select2-container--focus .select2-selection,
.select2-container--bootstrap-5.select2-container--open .select2-selection {
    border-color: var(--sll-zielen);
    box-shadow: 0 0 0 .22rem rgba(92, 144, 77, .16);
}
.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__choice {
    background-color: var(--sll-limonka-tlo);
    border-color: var(--sll-limonka);
    color: var(--sll-zielony);
    border-radius: .45rem;
    font-weight: 600;
}
.select2-dropdown {
    border-color: #d9e0d7 !important;
    border-radius: .55rem !important;
    box-shadow: 0 .6rem 1.4rem rgba(9, 55, 26, .14);
    overflow: hidden;
}
.select2-container--bootstrap-5 .select2-results__option.select2-results__option--selected {
    background-color: var(--sll-limonka-tlo);
    color: var(--sll-zielony);
}
.select2-container--bootstrap-5 .select2-results__option.select2-results__option--highlighted {
    background-color: var(--sll-zielony);
    color: var(--sll-limonka);
}

/* ---------- Karty -------------------------------------------------------- */

.card {
    border: 1px solid var(--sll-obwodka);
    border-radius: .9rem;
    box-shadow: 0 1px 2px rgba(9, 55, 26, .05), 0 4px 14px -8px rgba(9, 55, 26, .12);
    margin-bottom: 1.25rem;
}
.card-header {
    background: #fff;
    border-bottom: 1px solid var(--sll-obwodka);
    border-radius: .9rem .9rem 0 0 !important;
    padding: .9rem 1.25rem;
}
.card-title, .card-header h1, .card-header h5 { color: var(--sll-zielony); font-weight: 700; }
.card-body { padding: 1.1rem 1.25rem; }
.card-footer { background: #fbfcfa; border-top: 1px solid var(--sll-obwodka); }

/* ---------- Tabele -------------------------------------------------------- */

.table { margin-bottom: 0; }
.table thead th {
    color: var(--sll-tekst-slaby);
    background-color: #fafbfa;
    border-bottom: 1px solid var(--sll-obwodka);
    border-top: 0;
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    padding: .7rem 1rem;
    white-space: nowrap;
}
.table td, .table th {
    padding: .6rem 1rem;
    border-top-color: #eef2ed;
    vertical-align: middle;
}
.table-hover tbody tr:hover { background-color: #f6faf3; }
.table td { font-size: .875rem; }

/* Wiersze grup statusów (tr.table-secondary) — zamiast szarego pasa */
tr.table-secondary th {
    background: var(--sll-zielen-tlo);
    color: var(--sll-zielony);
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .07em;
    padding: .5rem 1rem;
    border-top: 1px solid #dcead3;
    border-bottom: 1px solid #dcead3;
}
tr.table-secondary th i { color: var(--sll-zielen); }

/* ---------- Menu boczne i górny pasek ------------------------------------ */

/* Sidebar Windu jest ciemny — doklejamy markową zieleń zamiast grafitu. */
.navbar-vertical .navbar-vertical-aside,
.navbar-vertical-aside {
    background: linear-gradient(180deg, #0a3a1c 0%, #09371a 55%, #072c15 100%) !important;
    box-shadow: 1px 0 0 rgba(255, 255, 255, .06);
}
.navbar-vertical .navbar-brand,
.navbar-vertical-aside .navbar-brand { padding: 1.1rem .9rem; }

.navbar-vertical .navbar-brand-logo,
.navbar-vertical .navbar-brand-logo-mini {
    filter: brightness(0) invert(1);
    opacity: .98;
}
.navbar-vertical .navbar-brand-logo { max-height: 3rem; width: auto; max-width: 100%; }
.navbar-vertical .navbar-brand-logo-mini { max-height: 2.4rem; width: auto; }

.navbar-vertical .nav-link,
.navbar-vertical-aside .nav-link {
    color: rgba(255, 255, 255, .72) !important;
    font-weight: 500;
    font-size: .85rem;
    padding: .55rem .9rem !important;
    margin: .1rem .5rem;
    border-radius: .55rem;
    transition: background .12s ease, color .12s ease;
}
.navbar-vertical .nav-link:hover,
.navbar-vertical .nav-link:focus {
    color: #fff !important;
    background-color: rgba(255, 255, 255, .07);
}
.navbar-vertical .nav-link.active,
.navbar-vertical .show > .nav-link,
.navbar-vertical .active > .nav-link {
    color: var(--sll-limonka) !important;
    background-color: rgba(196, 253, 2, .13);
    box-shadow: inset 3px 0 0 var(--sll-limonka);
    font-weight: 700;
}
.navbar-vertical .navbar-nav .nav-sub .nav-link {
    margin: .05rem .4rem;
    font-size: .82rem;
    padding: .4rem .8rem !important;
}
.navbar-vertical .navbar-nav .nav-sub .nav-link.active {
    background-color: rgba(196, 253, 2, .12);
    box-shadow: none;
    border-radius: .45rem;
}
.navbar-vertical .nav-link .nav-icon { color: inherit; }

/* Chevron rozwijania grupy — jeden, wyraźny, obraca się przy rozwinięciu. */
.navbar-vertical-aside-has-menu > .nav-link-toggle {
    position: relative;
    padding-right: 2.2rem !important;
}
.navbar-vertical-aside-has-menu > .nav-link-toggle::after {
    content: "";
    position: absolute;
    right: 1rem;
    top: 50%;
    width: 7px;
    height: 7px;
    border-right: 2px solid rgba(255, 255, 255, .55);
    border-bottom: 2px solid rgba(255, 255, 255, .55);
    transform: translateY(-70%) rotate(45deg);
    transition: transform .18s ease, border-color .18s ease;
}
.navbar-vertical-aside-has-menu.show > .nav-link-toggle::after,
.navbar-vertical-aside-has-menu > .nav-link-toggle.active::after {
    transform: translateY(-30%) rotate(225deg);
    border-color: var(--sll-limonka);
}
.navbar-vertical-aside-has-menu > .nav-link-toggle:hover::after { border-color: #fff; }
/* Stare kropki-wskaźniki Windu przy pozycjach grup — usuwamy duplikację. */
.nav-sub .nav-indicator-icon { font-size: .45rem; opacity: .65; }

/* ---------- Paginacja, zakładki, listy ----------------------------------- */

.page-item.active .page-link {
    background-color: var(--sll-zielony);
    border-color: var(--sll-zielony);
    color: var(--sll-limonka);
}
.page-link { color: var(--sll-zielony-jasny); border-color: var(--sll-obwodka); }
.page-link:hover { color: var(--sll-zielony); background-color: var(--sll-limonka-tlo); border-color: var(--sll-limonka); }

.nav-tabs .nav-link.active { color: var(--sll-zielony); border-bottom: 2px solid var(--sll-limonka); }
.nav-pills .nav-link.active { background-color: var(--sll-zielony); color: var(--sll-limonka); }

.list-group-item.active {
    background-color: var(--sll-zielony);
    border-color: var(--sll-zielony);
    color: var(--sll-limonka);
}

.dropdown-item.active, .dropdown-item:active {
    background-color: var(--sll-limonka-tlo);
    color: var(--sll-zielony);
}
.dropdown-item:hover { background-color: var(--sll-zielen-tlo); }
.dropdown-menu { border-radius: .7rem; border-color: var(--sll-obwodka); box-shadow: 0 .8rem 1.6rem rgba(9, 55, 26, .12); }

/* ---------- Modale -------------------------------------------------------- */

.modal-content {
    border: 0;
    border-radius: 1rem;
    box-shadow: 0 1.5rem 3rem rgba(9, 55, 26, .25);
    overflow: hidden;
}
.modal-header {
    border-bottom: 1px solid var(--sll-obwodka);
    padding: 1.1rem 1.5rem;
}
.modal-title { color: var(--sll-zielony); font-weight: 700; }
.modal-footer {
    background-color: #fbfcfa;
    border-top: 1px solid var(--sll-obwodka);
    padding: .85rem 1.5rem;
}
.modal-backdrop.show { opacity: .55; }
.modal-body { padding: 1.4rem 1.5rem; }

/* Modal potwierdzenia (sllConfirm) */
.sll-confirm-ikona {
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.9rem;
    background: var(--sll-limonka-tlo);
    color: #5c8a00;
    margin: 0 auto 1rem;
}
.sll-confirm-ikona.sll-confirm-niebezpieczne { background: #fdeaea; color: #c0392b; }
.sll-confirm-tresc { color: #4c5a52; }

/* ---------- Pigułki statusów i badge ------------------------------------- */

.sll-status-pill, .badge {
    border-radius: 8px;
    padding: .28em .65em;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .01em;
}

/* ---------- Ekran logowania ---------------------------------------------- */

body.auth { background-color: var(--sll-tlo); }
.windu-admin-auth-bg {
    height: 24rem;
    background: linear-gradient(135deg, var(--sll-zielony) 0%, #0d4a24 55%, #1d6b36 100%);
}
body.auth .windu-admin-logo-big {
    width: 17rem;
    background: #fff;
    border-radius: 1.25rem;
    padding: .85rem 1.4rem;
}
body.auth .card { border-radius: 1.25rem; box-shadow: 0 1rem 2.5rem rgba(9, 55, 26, .18); }
body.auth .text-center a { color: var(--sll-zielony); font-weight: 600; }

/* ---------- Klasy panelu SellAssist -------------------------------------- */

.sll-karta-stats h3 { font-size: 1.85rem; font-weight: 800; color: var(--sll-zielony); letter-spacing: -0.03em; }
.sll-status-pill { display: inline-block; padding: .28em .65em; border-radius: 8px; font-size: .72rem; color: #fff; white-space: nowrap; }
.sll-tabela-zamowien td { vertical-align: middle; }
.sll-tabela-zamowien td:nth-child(3) { min-width: 300px; }
.sll-tabela-zamowien small, .sll-tabela-zamowien .small { font-size: .76rem; color: var(--sll-tekst-slaby); }
.sll-lewy-panel-statusow { max-height: 70vh; overflow-y: auto; }
.sll-lewy-panel-statusow .list-group-item { display: flex; justify-content: space-between; align-items: center; cursor: pointer; border-radius: .5rem; margin-bottom: .15rem; border: 0; }
.sll-lewy-panel-statusow .badge { min-width: 3.2rem; }
.badge-primary { background-color: var(--sll-zielony); color: var(--sll-limonka); }
.sll-wms-skan { font-size: 2rem; text-align: center; padding: 3rem 1rem; }
.sll-wms-skan input { font-size: 1.5rem; text-align: center; }

/* Ładne grupy pól w formularzach i modalach */
.form-group label { margin-bottom: .3rem; }
.was-validated .form-control:valid, .form-control.is-valid { border-color: var(--sll-zielen); }
.invalid-feedback { display: block; }

/* ---------- Suwaki przewijania ------------------------------------------- */

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #c4cec3; border-radius: 8px; border: 2px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-thumb:hover { background-color: #a9b6a8; }