/* _content/Etiris.PosErp.BackOffice/Components/GuestForm.razor.rz.scp.css */
/* Isti idiomi kao obrasci u drawer-u plana soba (f-row2 / f-label), ali pod svojim imenom:
   scoped CSS stranice ne dopire u dijete-komponentu, pa obrazac nosi svoje. */

.gf[b-ixfprlhvd1] { display: block; }

.gf-row2[b-ixfprlhvd1] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

.gf-label[b-ixfprlhvd1] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--et-muted);
    margin: 0.55rem 0 0.25rem;
    display: block;
}

.gf-code[b-ixfprlhvd1] { text-transform: uppercase; }

/* Ime države ispod oznake — potvrda da je „DE" baš Njemačka, prazno kad oznake nema na spisku. */
.gf-country[b-ixfprlhvd1] {
    font-size: 0.72rem;
    color: var(--et-accent);
    font-weight: 600;
    min-height: 1rem;
    margin-top: 0.15rem;
}

/* Neobavezno polje — sitna riječ uz oznaku, da recepcionar ne traži zvjezdicu koje nema. */
.gf-optional[b-ixfprlhvd1] {
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
    color: var(--et-faint);
}

/* Žuta rečenica: JMB čija se kontrolna cifra ne slaže, ili broj koji nema 13 cifara.
   Ista boja kao ostale napomene u back-officeu, pa je i u tamnoj temi čitljiva. */
.gf-warn[b-ixfprlhvd1] {
    font-size: 0.78rem;
    line-height: 1.35;
    color: var(--et-warning-soft-fg);
    background: var(--et-warning-soft);
    border-radius: var(--et-radius-sm);
    padding: 0.35rem 0.55rem;
    margin-top: 0.3rem;
}

/* Polje koje server NIJE prepisao: okvir ostaje uz ukucanu vrijednost, jer se ona ne briše. */
.gf-clash[b-ixfprlhvd1] {
    border-color: var(--et-warning) !important;
    box-shadow: 0 0 0 1px var(--et-warning) inset;
}

.gf-clash-note[b-ixfprlhvd1] {
    font-size: 0.78rem;
    line-height: 1.35;
    color: var(--et-warning-soft-fg);
    background: var(--et-warning-soft);
    border-radius: var(--et-radius-sm);
    padding: 0.35rem 0.55rem;
    margin-top: 0.3rem;
}
/* _content/Etiris.PosErp.BackOffice/Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-240x708yon] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-240x708yon] {
    flex: 1;
    /* Bez ovoga nijedna tabela ne klizi (01.10.2026.): flex-dijete ne smije biti uže od
       svog sadržaja (min-width: auto), pa se umjesto omotača tabele (overflow-x: auto)
       širio cijeli <main> — na prozoru od 975 px bio je 1471 px i klizala je CIJELA
       stranica, a nijedan omotač. Nula vraća odluku omotaču. Čuvar: TabeleNaUskomEkranuTests. */
    min-width: 0;
}

/* Tamno-zelen, kao na dashboard referencama koje je vlasnik izabrao: zelena je
   identitet i nosi cijeli lijevi stub, sadržaj ostaje topao i svijetao. */
/* Admiro: bijeli sidebar, od sadržaja odvojen tankom linijom.
   (Boja preko --et-surface: u svijetloj temi i dalje čisto bijela, u tamnoj slate.) */
.sidebar[b-240x708yon] {
    background: var(--et-surface);
    border-right: 1px solid var(--et-border);
    display: flex;
    flex-direction: column;
}

.top-row[b-240x708yon] {
    background-color: var(--et-surface);
    border-bottom: 1px solid var(--et-border);
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-240x708yon]  a, .top-row[b-240x708yon]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-240x708yon]  a:hover, .top-row[b-240x708yon]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-240x708yon]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-240x708yon] {
        justify-content: space-between;
    }

    .top-row[b-240x708yon]  a, .top-row[b-240x708yon]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-240x708yon] {
        flex-direction: row;
    }

    .sidebar[b-240x708yon] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-240x708yon] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-240x708yon]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-240x708yon], article[b-240x708yon] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-240x708yon] {
    background: lightyellow;
}

[data-bs-theme="dark"] #blazor-error-ui[b-240x708yon] {
    background: #3A2F14;
    color: var(--et-text);
}

#blazor-error-ui[b-240x708yon] {
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-240x708yon] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

/* Gornji red stranice (16.10.2026.): lijevo „☰ Meni" kad je meni sklonjen, desno birač objekta.
   Lijevi rub je isti kao sadržaja ispod (article: 2rem), pa su „Meni" i naslov stranice u liniji. */
.glavna-traka[b-240x708yon] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 1rem 1.5rem 0;
}

/* Dugmad za meni: na uskom ekranu meni ima svoj hamburger, pa njih nema. */
.sidebar-toggle[b-240x708yon] {
    display: none;
}

/* =====================================================================
   TELEFON (vlasnik 22.10.2026.: „morat ćeš prilagoditi ovaj back office za mobitele kad uđem")
   Ispod 641 px — isti prekid kao kartice tabela u app.css. Do sada je stub na telefonu stajao IZNAD
   stranice cijelom visinom: brend, ime, „Odjavi se" i tema (oko 170 px) na vrhu svakog ekrana, a meni
   se otvarao u toku stranice i gurao sadržaj dolje.

   Sada je stub GORNJA TRAKA od 56 px koja ostaje na vrhu dok se stranica kliza: dugme menija lijevo,
   brend, inicijali korisnika desno — sve u jednom redu. Meni, ime, odjava i tema su u ladici koja
   izlazi preko stranice (NavMenu.razor.css, odjeljak „TELEFON"). Birač objekta je red ispod trake,
   cijelom širinom, s nazivom koji se skrati tri tačke umjesto da izađe van ekrana.
   ===================================================================== */
@media (max-width: 640.98px) {
    .sidebar[b-240x708yon] {
        position: sticky;
        top: 0;
        z-index: 1030;
        flex-direction: row;
        align-items: center;
        height: 56px;
        border-right: 0;
        border-bottom: 1px solid var(--et-border);
    }

    .glavna-traka[b-240x708yon] {
        padding: .75rem 1rem 0;
    }

    .outlet-picker[b-240x708yon] {
        flex: 1 1 auto;
        min-width: 0;
        margin-left: 0 !important;
    }

    .outlet-switch[b-240x708yon] {
        display: block;
        min-width: 0;
        width: 100%;
    }

    .outlet-card[b-240x708yon] {
        min-height: 52px;
        padding: 6px 36px 6px 6px;
        gap: 10px;
    }

    .outlet-card-icon[b-240x708yon] {
        width: 36px;
        height: 36px;
        border-radius: 10px;
    }

    .outlet-menu-item[b-240x708yon] {
        min-height: 44px;
    }

    /* Sadržaj stranice: 16 px do ruba umjesto 24 — na 375 px to je 32 px više za tabelu ili obrazac. */
    .content[b-240x708yon] {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}

@media (min-width: 641px) {
    .glavna-traka[b-240x708yon] {
        padding-left: 2rem;
    }

    .sidebar[b-240x708yon] {
        position: sticky;
        transition: width .2s ease, border-color .2s ease;
        overflow: hidden;
    }

    /* Dok se meni sklanja, sadržaj zadrži svoju širinu i samo odlazi iza ruba — bez ovoga
       bi se tekst stavki lomio u dva reda tokom klizanja. */
    .sidebar[b-240x708yon]  .top-row,
    .sidebar[b-240x708yon]  .nav-scrollable,
    .sidebar[b-240x708yon]  .sidebar-user {
        min-width: 250px;
    }

    .sidebar-toggle[b-240x708yon] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        border: 0;
        background: transparent;
        color: var(--et-muted);
        cursor: pointer;
        transition: background-color .15s ease, color .15s ease, border-color .15s ease;
    }

    .sidebar-toggle:focus-visible[b-240x708yon] {
        outline: 2px solid var(--et-accent);
        outline-offset: -2px;
    }

    /* Sakrij meni: cijela visina reda s brendom, uz desni rub menija — lako se pogodi. */
    .sidebar-collapse[b-240x708yon] {
        position: absolute;
        top: 0;
        right: 0;
        width: 48px;
        /* Do linije ispod brenda (76 px), bez svoje donje ivice — linija reda ostaje jedna. */
        height: 76px;
        border-left: 1px solid var(--et-border);
        border-radius: 0;
    }

    .sidebar-collapse:hover[b-240x708yon] {
        background: var(--et-accent-soft);
        color: var(--et-on-accent-soft);
    }

    /* Prikaži meni: pilula u gornjem redu, iste visine kao kartica objekta. */
    .sidebar-open[b-240x708yon] {
        height: 56px;
        padding: 0 18px 0 14px;
        border: 1px solid var(--et-border);
        border-radius: 14px;
        background: var(--et-surface);
        color: var(--et-text);
        box-shadow: var(--et-shadow);
    }

    .sidebar-open:hover[b-240x708yon] {
        background: var(--et-accent-soft);
        color: var(--et-on-accent-soft);
        border-color: var(--et-accent);
    }

    .sidebar-toggle-label[b-240x708yon] {
        font-size: 14px;
        font-weight: 600;
    }

    .page.sidebar-off .sidebar[b-240x708yon] {
        width: 0;
        border-right-color: transparent;
    }
}

/* Birač objekta kao kartica, a spisak koji se otvori je ISTE širine, boje i zaobljenja
   (vlasnik 15.10.2026.) — zato je spisak naš, ne preglednikov. */
.outlet-switch[b-240x708yon] {
    position: relative;
    display: inline-block;
    min-width: 280px;
    max-width: 100%;
}

.outlet-card[b-240x708yon] {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 8px 40px 8px 8px;
    border: 1px solid var(--et-border);
    border-radius: 14px;
    background: var(--et-surface);
    box-shadow: var(--et-shadow);
    color: var(--et-text);
    text-align: left;
    cursor: pointer;
    position: relative;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.outlet-card:hover[b-240x708yon],
.outlet-switch.open .outlet-card[b-240x708yon] {
    border-color: var(--et-accent);
    box-shadow: var(--et-shadow-soft);
}

.outlet-card:focus-visible[b-240x708yon] {
    outline: none;
    border-color: var(--et-accent);
    box-shadow: 0 0 0 3px var(--et-accent-soft);
}

.outlet-card-icon[b-240x708yon] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 11px;
    background: var(--et-gradient);
    color: #fff;
    flex: 0 0 auto;
}

.outlet-card-text[b-240x708yon] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.outlet-card-caption[b-240x708yon] {
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--et-faint);
    line-height: 1.3;
}

.outlet-card-name[b-240x708yon] {
    font-size: 15px;
    font-weight: 600;
    color: var(--et-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.outlet-card-chevron[b-240x708yon] {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--et-muted);
    display: flex;
    transition: transform .15s ease;
}

.outlet-switch.open .outlet-card-chevron[b-240x708yon] {
    transform: translateY(-50%) rotate(180deg);
    color: var(--et-accent);
}

/* Prozirna podloga preko cijelog ekrana: klik pored spiska ga zatvori. */
.outlet-backdrop[b-240x708yon] {
    position: fixed;
    inset: 0;
    z-index: 1040;
}

.outlet-menu[b-240x708yon] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    z-index: 1050;
    list-style: none;
    margin: 0;
    padding: 6px;
    border: 1px solid var(--et-accent);
    border-radius: 14px;
    background: var(--et-surface);
    box-shadow: var(--et-shadow-soft);
    max-height: 60vh;
    overflow-y: auto;
    animation: outlet-menu-in-b-240x708yon .12s ease-out;
}

@keyframes outlet-menu-in-b-240x708yon {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: none; }
}

.outlet-menu-item[b-240x708yon] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 8px 10px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--et-text);
    font-size: 14px;
    font-weight: 500;
    text-align: left;
    cursor: pointer;
}

.outlet-menu-item:hover[b-240x708yon],
.outlet-menu-item:focus-visible[b-240x708yon] {
    background: var(--et-surface-alt);
    outline: none;
}

.outlet-menu-item.current[b-240x708yon] {
    background: var(--et-accent-soft);
    color: var(--et-on-accent-soft);
    font-weight: 600;
}

.outlet-menu-dot[b-240x708yon] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: var(--et-surface-alt);
    color: var(--et-muted);
    font-size: 12px;
    font-weight: 700;
    flex: 0 0 auto;
}

.outlet-menu-item.current .outlet-menu-dot[b-240x708yon] {
    background: var(--et-gradient);
    color: #fff;
}

.outlet-menu-name[b-240x708yon] {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.outlet-menu-check[b-240x708yon] {
    color: var(--et-accent);
    flex: 0 0 auto;
}
/* _content/Etiris.PosErp.BackOffice/Components/Layout/NavMenu.razor.rz.scp.css */
/* Dugme menija na telefonu je kvačica (vidi NavMenu.razor): tri crtice dok je ladica zatvorena, X dok je
   otvorena. Od 641 px se ne crta (blok ispod). */
.navbar-toggler[b-mpn5gs6zns] {
    appearance: none;
    cursor: pointer;
    flex: 0 0 auto;
    order: -1;
    width: 44px;
    height: 44px;
    margin: 0 2px 0 10px;
    color: var(--et-text);
    border: 1px solid var(--et-border);
    border-radius: 12px;
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2847, 47, 59, 0.6%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.5rem var(--et-surface-alt);
}

.navbar-toggler:checked[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2847, 47, 59, 0.7%29' stroke-linecap='round' stroke-width='2.2' d='M8 8l14 14M22 8L8 22'/%3e%3c/svg%3e");
    border-color: var(--et-accent);
}

.navbar-toggler:focus-visible[b-mpn5gs6zns] {
    outline: 2px solid var(--et-accent);
    outline-offset: 2px;
}

/* Tamna tema: svijetle crtice hamburgera umjesto tamnih (SVG u pozadini ne
   nasljeđuje currentColor, pa mora druga slika). */
[data-bs-theme="dark"] .navbar-toggler[b-mpn5gs6zns] {
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28226, 232, 240, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.5rem var(--et-surface-alt);
}

[data-bs-theme="dark"] .navbar-toggler:checked[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28226, 232, 240, 0.8%29' stroke-linecap='round' stroke-width='2.2' d='M8 8l14 14M22 8L8 22'/%3e%3c/svg%3e");
}

/* Ladica: na širokom ekranu je ne postoji kao kutija (display: contents) — meni i blok s korisnikom su
   i dalje djeca stuba, kao prije 22.10.2026. Pozadina i inicijali u traci postoje samo na telefonu. */
.meni-ladica[b-mpn5gs6zns] {
    display: contents;
}

.meni-pozadina[b-mpn5gs6zns],
.meni-avatar[b-mpn5gs6zns] {
    display: none;
}

.top-row[b-mpn5gs6zns] {
    height: auto;
    padding: 1.05rem 0 .8rem;
    background-color: transparent;
}

/* Na širokom ekranu desno u redu brenda stoji dugme za sklanjanje menija (MainLayout). */
@media (min-width: 641px) {
    .top-row[b-mpn5gs6zns] {
        padding: 1.05rem 52px .9rem 0;
        border-bottom: 1px solid var(--et-border);
        margin-bottom: .25rem;
    }
}

.navbar-brand[b-mpn5gs6zns] {
    display: flex !important;
    align-items: center;
    gap: .65rem;
    font-size: .95rem;
    font-weight: 600;
    /* Bijela je ostatak iz doba tamnozelenog sidebara. Stub je odavno --et-surface
       (bijel u svijetloj temi), pa je „Back Office" bio bijelo na bijelom. Tinta ide na
       token, da prati obje teme. */
    color: var(--et-text) !important;
    letter-spacing: .01em;
    line-height: 1.2;
}

/* Gradijentni logo-kvadrat iz Lovable dizajna. */
.navbar-brand[b-mpn5gs6zns]  .brand-mark, .brand-mark[b-mpn5gs6zns] {
    display: flex; align-items: center; justify-content: center;
    width: 36px; height: 36px; border-radius: 12px;
    background: var(--et-gradient);
    color: #fff; font-weight: 700; font-size: 1rem;
    flex: 0 0 auto;
}

/* „powered by ETIRIS" — svijetlozelena na tamnom stubu. */
.navbar-brand[b-mpn5gs6zns]  .brand-sub, .brand-sub[b-mpn5gs6zns] {
    display: block;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--et-accent);
}

[data-bs-theme="dark"] .navbar-brand[b-mpn5gs6zns]  .brand-sub, [data-bs-theme="dark"] .brand-sub[b-mpn5gs6zns] {
    color: var(--et-accent-glow);
}

.bi[b-mpn5gs6zns] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

/* Ikone su data-URI SVG-ovi s upisanim tamnim fill-om (#565f66) — u tamnoj temi bi
   nestale. invert(1) ih pretvara u svijetlosivu bez diranja četrdesetak URI-ja. */
[data-bs-theme="dark"] .bi[b-mpn5gs6zns] {
    filter: invert(1) brightness(1.05);
}

/* Aktivna pilula je i u tamnoj temi svijetlozelena, pa njena ikona ostaje tamna. */
[data-bs-theme="dark"] .nav-item[b-mpn5gs6zns]  a.active .bi {
    filter: brightness(0.25);
}

.bi-house-door-fill-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-mpn5gs6zns] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-mpn5gs6zns] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-mpn5gs6zns] {
        padding-bottom: 1rem;
    }

    /* Pilule ostaju — vlasniku je raspored „predobar" — boje po Admiro temi. */
    .nav-item[b-mpn5gs6zns]  .nav-link {
        color: var(--et-nav-fg);
        background: none;
        border: none;
        border-radius: 9px;
        height: 2.5rem;
        display: flex;
        align-items: center;
        line-height: 2.5rem;
        width: calc(100% - 16px);
        margin: 0 8px;
        padding-left: .85rem;
        font-weight: 500;
        min-width: 0;
    }

    /* Natpis stavke (vlasnik 29.10.2026.: dugi natpisi su izlazili iz stuba). Uvijek jedan red; ako
       ipak ne stane (uži stub, veći font), završi se s „…" umjesto da pređe preko ruba. Ikona se ne
       sužava. Skraćene stavke nose puni naziv u title. */
    .nav-item[b-mpn5gs6zns]  .nav-tekst {
        flex: 1 1 auto;
        min-width: 0;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .nav-item[b-mpn5gs6zns]  .nav-link .bi {
        flex-shrink: 0;
    }

/* Aktivna stavka po Lovable dizajnu: svijetlozelena podloga, taman tekst — svjetlija
   od svega oko sebe, pa oko ide pravo na nju. */
.nav-item[b-mpn5gs6zns]  a.active {
    background-color: #4EC17E;
    color: #12291F;
    font-weight: 600;
}

/* Tamna ikona na svijetloj aktivnoj pilulu — bijela bi se utopila. */
.nav-item[b-mpn5gs6zns]  a.active .bi {
    filter: brightness(0.25);
}

.nav-item[b-mpn5gs6zns]  .nav-link:hover {
    background-color: var(--et-surface-alt);
    color: var(--et-text);
}

/* =====================================================================
   TELEFON (vlasnik 22.10.2026.) — ispod 641 px, isti prekid kao MainLayout.razor.css i app.css.
   Stub je tu gornja traka visine 56 px (MainLayout.razor.css): dugme menija, brend, inicijali.
   Ladica izlazi slijeva ISPOD trake, pa dugme (sada X) ostaje vidljivo i zatvara je; pozadina
   preko ostatka ekrana je labela iste kvačice — dodir pored zatvori ladicu.
   ===================================================================== */
@media (max-width: 640.98px) {
    .top-row[b-mpn5gs6zns] {
        flex: 1 1 auto;
        min-width: 0;
        height: 100%;
        padding: 0 !important;
        border: 0;
    }

    .top-row .container-fluid[b-mpn5gs6zns] {
        padding: 0 6px;
        min-width: 0;
    }

    .navbar-brand[b-mpn5gs6zns] {
        margin: 0;
        min-width: 0;
        gap: .55rem;
    }

    .navbar-brand[b-mpn5gs6zns]  .brand-mark, .brand-mark[b-mpn5gs6zns] {
        width: 32px;
        height: 32px;
        border-radius: 10px;
    }

    .meni-avatar[b-mpn5gs6zns] {
        display: flex;
        align-items: center;
        justify-content: center;
        order: 1;
        flex: 0 0 auto;
        width: 40px;
        height: 40px;
        margin: 0 12px 0 4px;
        border-radius: 12px;
        background: var(--et-gradient);
        color: #fff;
        font-size: 13px;
        font-weight: 700;
        cursor: pointer;
        user-select: none;
    }

    .meni-ladica[b-mpn5gs6zns] {
        display: flex;
        flex-direction: column;
        position: fixed;
        top: 56px;
        left: 0;
        bottom: 0;
        width: min(86vw, 330px);
        z-index: 1045;
        background: var(--et-surface);
        border-right: 1px solid var(--et-border);
        box-shadow: 0 16px 40px rgba(15, 23, 42, .22);
        transform: translateX(-102%);
        visibility: hidden;
        transition: transform .22s ease, visibility 0s linear .22s;
    }

    .navbar-toggler:checked ~ .meni-ladica[b-mpn5gs6zns] {
        transform: none;
        visibility: visible;
        transition: transform .22s ease;
    }

    .navbar-toggler:checked ~ .meni-pozadina[b-mpn5gs6zns] {
        display: block;
        position: fixed;
        top: 56px;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1044;
        background: rgba(15, 23, 42, .45);
        cursor: pointer;
    }

    .nav-scrollable[b-mpn5gs6zns] {
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        overscroll-behavior: contain;
        padding-bottom: .25rem;
    }

    /* Stavke i dugmad u ladici su za prst: 44 px. */
    .nav-item[b-mpn5gs6zns]  .nav-link {
        height: 2.75rem;
        line-height: 2.75rem;
    }

    .nav-section[b-mpn5gs6zns] {
        min-height: 2.75rem;
        padding-top: .5rem;
        padding-bottom: .5rem;
    }

    .sidebar-logout[b-mpn5gs6zns] {
        min-height: 44px;
    }

    .theme-toggle[b-mpn5gs6zns] {
        width: 44px;
    }
}

@media (max-width: 640.98px) and (prefers-reduced-motion: reduce) {
    .meni-ladica[b-mpn5gs6zns],
    .navbar-toggler:checked ~ .meni-ladica[b-mpn5gs6zns] {
        transition: none;
    }
}

@media (min-width: 641px) {
    .navbar-toggler[b-mpn5gs6zns] {
        display: none;
    }

    .nav-scrollable[b-mpn5gs6zns] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Harmonika drži meni kratkim; flex gura korisnički blok na dno.
           overflow ostaje kao osigurač za vrlo niske ekrane. */
        flex: 1;
        min-height: 0;
        overflow-y: auto;

        /* Nativni scrollbar je debeo i svijetao pa strši uz sidebar (naročito u
           tamnoj temi) — tanka, prigušena verzija u obje teme. */
        scrollbar-width: thin;
        scrollbar-color: rgba(148, 163, 184, 0.35) transparent;
    }

    .nav-scrollable[b-mpn5gs6zns]::-webkit-scrollbar {
        width: 6px;
    }

    .nav-scrollable[b-mpn5gs6zns]::-webkit-scrollbar-track {
        background: transparent;
    }

    .nav-scrollable[b-mpn5gs6zns]::-webkit-scrollbar-thumb {
        background: rgba(148, 163, 184, 0.35);
        border-radius: 3px;
    }

    .nav-scrollable[b-mpn5gs6zns]::-webkit-scrollbar-thumb:hover {
        background: rgba(148, 163, 184, 0.55);
    }
}

/* Section heading — a real button, so it is reachable by keyboard and reads as clickable to a
   screen reader. Quiet enough not to compete with the links it groups. */
.nav-section[b-mpn5gs6zns] {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0.9rem 1.5rem 0.3rem;
    background: none;
    border: 0;
    text-align: left;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--et-faint);
    cursor: pointer;
    user-select: none;
}

.nav-section:hover[b-mpn5gs6zns] {
    color: var(--et-text);
}

/* Chevron, drawn from two borders rather than another SVG — it has to animate, and a rotating
   background-image cannot. Points right when the group is shut, down when it is open. */
.nav-section[b-mpn5gs6zns]::after {
    content: "";
    margin-left: auto;
    width: 0.4rem;
    height: 0.4rem;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(-45deg);
    transition: transform 0.15s ease;
}

.nav-section.open[b-mpn5gs6zns]::after {
    transform: rotate(45deg);
}

/* The first heading follows a link directly, so it needs less air above than the rest. */
.nav-section:first-of-type[b-mpn5gs6zns] {
    padding-top: 0.75rem;
}

/* Nav icons. Inline SVG data URIs like the three the Blazor template shipped with —
   self-contained, so the sidebar draws identically with no network and no icon font to
   ship. Every link used to wear the same generic 'list' glyph, which told you nothing. */
.bi-bell-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M8 16a2 2 0 0 0 2-2H6a2 2 0 0 0 2 2zm.995-14.901a1 1 0 1 0-1.99 0A5.002 5.002 0 0 0 3 6c0 1.098-.5 6-2 7h14c-1.5-1-2-5.902-2-7 0-2.42-1.72-4.44-4.005-4.901z'/%3E%3C/svg%3E");
}

.bi-broadcast-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M3.05 3.05a7 7 0 0 0 0 9.9.5.5 0 0 1-.707.707 8 8 0 0 1 0-11.314.5.5 0 0 1 .707.707zm2.122 2.122a4 4 0 0 0 0 5.656.5.5 0 1 1-.708.708 5 5 0 0 1 0-7.072.5.5 0 0 1 .708.708zm5.656-.708a.5.5 0 0 1 .708 0 5 5 0 0 1 0 7.072.5.5 0 1 1-.708-.708 4 4 0 0 0 0-5.656.5.5 0 0 1 0-.708zm2.122-2.12a.5.5 0 0 1 .707 0 8 8 0 0 1 0 11.313.5.5 0 0 1-.707-.707 7 7 0 0 0 0-9.9.5.5 0 0 1 0-.707zM10 8a2 2 0 1 1-4 0 2 2 0 0 1 4 0z'/%3E%3C/svg%3E");
}

.bi-card-list-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M14.5 3a.5.5 0 0 1 .5.5v9a.5.5 0 0 1-.5.5h-13a.5.5 0 0 1-.5-.5v-9a.5.5 0 0 1 .5-.5h13zm-13-1A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h13a1.5 1.5 0 0 0 1.5-1.5v-9A1.5 1.5 0 0 0 14.5 2h-13zM5 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 5 8zm0-2.5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm0 5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-1-5a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0zM4 8a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0zm0 2.5a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-clock-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71V3.5zM8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16zm7-8A7 7 0 1 1 1 8a7 7 0 0 1 14 0z'/%3E%3C/svg%3E");
}

.bi-swap-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M1 11.5a.5.5 0 0 0 .5.5h11.793l-3.147 3.146a.5.5 0 0 0 .708.708l4-4a.5.5 0 0 0 0-.708l-4-4a.5.5 0 0 0-.708.708L13.293 11H1.5a.5.5 0 0 0-.5.5zm14-7a.5.5 0 0 1-.5.5H2.707l3.147 3.146a.5.5 0 1 1-.708.708l-4-4a.5.5 0 0 1 0-.708l4-4a.5.5 0 1 1 .708.708L2.707 4H14.5a.5.5 0 0 1 .5.5z'/%3E%3C/svg%3E");
}

.bi-graph-up-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M0 0h1v15h15v1H0V0Zm14.817 3.113a.5.5 0 0 1 .07.704l-4.5 5.5a.5.5 0 0 1-.74.037L7.06 6.767l-3.656 5.027a.5.5 0 0 1-.808-.588l4-5.5a.5.5 0 0 1 .758-.06l2.609 2.61 4.15-5.073a.5.5 0 0 1 .704-.07Z'/%3E%3C/svg%3E");
}

.bi-globe-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8zm7.5-6.923c-.67.204-1.335.82-1.887 1.855A7.97 7.97 0 0 0 5.145 4H7.5V1.077zM4.09 4a9.267 9.267 0 0 1 .64-1.539 6.7 6.7 0 0 1 .597-.933A7.025 7.025 0 0 0 2.255 4H4.09zm-.582 3.5c.03-.877.138-1.718.312-2.5H1.674a6.958 6.958 0 0 0-.656 2.5h2.49zM4.847 5a12.5 12.5 0 0 0-.338 2.5H7.5V5H4.847zM8.5 5v2.5h2.99a12.495 12.495 0 0 0-.337-2.5H8.5zM4.51 8.5a12.5 12.5 0 0 0 .337 2.5H7.5V8.5H4.51zm3.99 0V11h2.653c.187-.765.306-1.608.338-2.5H8.5zM5.145 12c.138.386.295.744.468 1.068.552 1.035 1.218 1.65 1.887 1.855V12H5.145zm.182 2.472a6.696 6.696 0 0 1-.597-.933A9.268 9.268 0 0 1 4.09 12H2.255a7.024 7.024 0 0 0 3.072 2.472zM3.82 11a13.652 13.652 0 0 1-.312-2.5h-2.49c.062.89.291 1.733.656 2.5H3.82zm6.853 3.472A7.024 7.024 0 0 0 13.745 12H11.91a9.27 9.27 0 0 1-.64 1.539 6.688 6.688 0 0 1-.597.933zM8.5 12v2.923c.67-.204 1.335-.82 1.887-1.855.173-.324.33-.682.468-1.068H8.5zm3.68-1h2.146c.365-.767.594-1.61.656-2.5h-2.49a13.65 13.65 0 0 1-.312 2.5zm2.802-3.5a6.959 6.959 0 0 0-.656-2.5H12.18c.174.782.282 1.623.312 2.5h2.49zM11.27 2.461c.247.464.462.98.641 1.539h1.834a7.024 7.024 0 0 0-3.072-2.472c.218.284.418.598.597.933zM10.855 4a7.966 7.966 0 0 0-.468-1.068C9.835 1.897 9.17 1.282 8.5 1.077V4h2.355z'/%3E%3C/svg%3E");
}

.bi-cup-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M.5 1a.5.5 0 0 0 0 1h.71l.892 3.995a.5.5 0 0 0 .002.008l1.234 5.523c-.63.281-1.083.891-1.083 1.626 0 .961.784 1.748 1.75 1.748h9.5a.75.75 0 0 0 0-1.5H4.006a.25.25 0 0 1 0-.5H13.5a.5.5 0 0 0 .49-.402l1.5-7.5A.5.5 0 0 0 15 5H2.19l-.723-3.607A.5.5 0 0 0 .5 1Z'/%3E%3C/svg%3E");
}

.bi-tags-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M3 2v4.586l7 7L14.586 9l-7-7H3zM2 2a1 1 0 0 1 1-1h4.586a1 1 0 0 1 .707.293l7 7a1 1 0 0 1 0 1.414l-4.586 4.586a1 1 0 0 1-1.414 0l-7-7A1 1 0 0 1 2 6.586V2z'/%3E%3Cpath d='M5.5 5a.5.5 0 1 1 0-1 .5.5 0 0 1 0 1zm0 1a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3z'/%3E%3C/svg%3E");
}

.bi-sliders-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M11.5 2a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3zM9.05 3a2.5 2.5 0 0 1 4.9 0H16v1h-2.05a2.5 2.5 0 0 1-4.9 0H0V3h9.05zM4.5 7a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3zM2.05 8a2.5 2.5 0 0 1 4.9 0H16v1H6.95a2.5 2.5 0 0 1-4.9 0H0V8h2.05zm9.45 4a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3zm-2.45 1a2.5 2.5 0 0 1 4.9 0H16v1h-2.05a2.5 2.5 0 0 1-4.9 0H0v-1h9.05z'/%3E%3C/svg%3E");
}

.bi-journal-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M5 10.5a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1h-2a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zM3 0h10a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2zm0 1a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H3z'/%3E%3C/svg%3E");
}

.bi-box-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M8.186 1.113a.5.5 0 0 0-.372 0L1.846 3.5l2.404.961L10.404 2l-2.218-.887zm3.564 1.426L5.596 5 8 5.961 14.154 3.5l-2.404-.961zm3.25 1.7-6.5 2.6v7.922l6.5-2.6V4.24zM7.5 14.762V6.838L1 4.239v7.923l6.5 2.6zM7.443.184a1.5 1.5 0 0 1 1.114 0l7.129 2.852A.5.5 0 0 1 16 3.5v8.662a1 1 0 0 1-.629.928l-7.185 2.874a.5.5 0 0 1-.372 0L.63 13.09a1 1 0 0 1-.63-.928V3.5a.5.5 0 0 1 .314-.464L7.443.184z'/%3E%3C/svg%3E");
}

.bi-clipboard-check-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M10.854 7.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7.5 9.793l2.646-2.647a.5.5 0 0 1 .708 0z'/%3E%3Cpath d='M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1v-1z'/%3E%3Cpath d='M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5h3zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3z'/%3E%3C/svg%3E");
}

.bi-trash-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5Zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5Zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6Z'/%3E%3Cpath d='M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1ZM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118ZM2.5 3h11V2h-11v1Z'/%3E%3C/svg%3E");
}

.bi-truck-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M0 3.5A1.5 1.5 0 0 1 1.5 2h9A1.5 1.5 0 0 1 12 3.5V5h1.02a1.5 1.5 0 0 1 1.17.563l1.481 1.85a1.5 1.5 0 0 1 .329.938V10.5a1.5 1.5 0 0 1-1.5 1.5H14a2 2 0 1 1-4 0H5a2 2 0 1 1-3.998-.085A1.5 1.5 0 0 1 0 10.5v-7zm1.294 7.456A1.999 1.999 0 0 1 4.732 11h5.536a2.01 2.01 0 0 1 .732-.732V3.5a.5.5 0 0 0-.5-.5h-9a.5.5 0 0 0-.5.5v7a.5.5 0 0 0 .294.456zM12 10a2 2 0 0 1 1.732 1h.768a.5.5 0 0 0 .5-.5V8.35a.5.5 0 0 0-.11-.312l-1.48-1.85A.5.5 0 0 0 13.02 6H12v4zm-9 1a1 1 0 1 0 0 2 1 1 0 0 0 0-2zm9 0a1 1 0 1 0 0 2 1 1 0 0 0 0-2z'/%3E%3C/svg%3E");
}

.bi-file-text-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M5 4a.5.5 0 0 0 0 1h6a.5.5 0 0 0 0-1H5zm-.5 2.5A.5.5 0 0 1 5 6h6a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zM5 8a.5.5 0 0 0 0 1h6a.5.5 0 0 0 0-1H5zm0 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1H5z'/%3E%3Cpath d='M2 2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V2zm10-1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1z'/%3E%3C/svg%3E");
}

.bi-shop-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M2.97 1.35A1 1 0 0 1 3.73 1h8.54a1 1 0 0 1 .76.35l2.609 3.044A1.5 1.5 0 0 1 16 5.37v.255a2.375 2.375 0 0 1-4.25 1.458A2.371 2.371 0 0 1 9.875 8 2.37 2.37 0 0 1 8 7.083 2.37 2.37 0 0 1 6.125 8a2.37 2.37 0 0 1-1.875-.917A2.375 2.375 0 0 1 0 5.625V5.37a1.5 1.5 0 0 1 .361-.976l2.61-3.045zm1.78 4.275a1.375 1.375 0 0 0 2.75 0 .5.5 0 0 1 1 0 1.375 1.375 0 0 0 2.75 0 .5.5 0 0 1 1 0 1.375 1.375 0 1 0 2.75 0V5.37a.5.5 0 0 0-.12-.325L12.27 2H3.73L1.12 5.045A.5.5 0 0 0 1 5.37v.255a1.375 1.375 0 0 0 2.75 0 .5.5 0 0 1 1 0zM1.5 8.5A.5.5 0 0 1 2 9v6h1v-5a1 1 0 0 1 1-1h3a1 1 0 0 1 1 1v5h6V9a.5.5 0 0 1 1 0v6h.5a.5.5 0 0 1 0 1H.5a.5.5 0 0 1 0-1H1V9a.5.5 0 0 1 .5-.5zM4 15h3v-5H4v5zm5-5a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-2zm3 0h-2v2h2v-2z'/%3E%3C/svg%3E");
}

.bi-grid-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M1 2.5A1.5 1.5 0 0 1 2.5 1h3A1.5 1.5 0 0 1 7 2.5v3A1.5 1.5 0 0 1 5.5 7h-3A1.5 1.5 0 0 1 1 5.5v-3zm8 0A1.5 1.5 0 0 1 10.5 1h3A1.5 1.5 0 0 1 15 2.5v3A1.5 1.5 0 0 1 13.5 7h-3A1.5 1.5 0 0 1 9 5.5v-3zm-8 8A1.5 1.5 0 0 1 2.5 9h3A1.5 1.5 0 0 1 7 10.5v3A1.5 1.5 0 0 1 5.5 15h-3A1.5 1.5 0 0 1 1 13.5v-3zm8 0A1.5 1.5 0 0 1 10.5 9h3a1.5 1.5 0 0 1 1.5 1.5v3a1.5 1.5 0 0 1-1.5 1.5h-3A1.5 1.5 0 0 1 9 13.5v-3z'/%3E%3C/svg%3E");
}

.bi-calendar-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M11 6.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1z'/%3E%3Cpath d='M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4H1z'/%3E%3C/svg%3E");
}

.bi-qr-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M2 2h2v2H2V2Z'/%3E%3Cpath d='M6 0v6H0V0h6ZM5 1H1v4h4V1ZM4 12H2v2h2v-2Z'/%3E%3Cpath d='M6 10v6H0v-6h6Zm-5 1v4h4v-4H1Zm11-9h2v2h-2V2Z'/%3E%3Cpath d='M10 0v6h6V0h-6Zm5 1v4h-4V1h4ZM8 1V0h1v2H8v2H7V1h1Zm0 5V4h1v2H8ZM6 8V7h1V6h1v2h1V7h5v1h-4v1H7V8H6Zm0 0v1H2V8H1v1H0V7h3v1h3Zm10 1h-1V7h1v2Zm-1 0h-1v2h2v-1h-1V9Zm-4 0h2v1h-1v1h-1V9Zm2 3v-1h-1v1h-1v1H9v1h3v-2h1Zm0 0h3v1h-2v1h-1v-2Zm-4-1v1h1v-2H7v1h2Z'/%3E%3C/svg%3E");
}

.bi-people-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M7 14s-1 0-1-1 1-4 5-4 5 3 5 4-1 1-1 1H7Zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm-5.784 6A2.238 2.238 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.325 6.325 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1h4.216ZM4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5Z'/%3E%3C/svg%3E");
}

.bi-building-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M4 2.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm-6 3a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm-6 3a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Z'/%3E%3Cpath d='M2 1a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1h-3v-3.5a.5.5 0 0 0-.5-.5h-3a.5.5 0 0 0-.5.5V16H3a1 1 0 0 1-1-1V1Zm1 0v14h3v-3.5a1.5 1.5 0 0 1 1.5-1.5h1a1.5 1.5 0 0 1 1.5 1.5V15h3V1H3Z'/%3E%3C/svg%3E");
}

.bi-cash-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M1 3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1H1zm7 8a2 2 0 1 0 0-4 2 2 0 0 0 0 4z'/%3E%3Cpath d='M0 5a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1H1a1 1 0 0 1-1-1V5zm3 0a2 2 0 0 1-2 2v4a2 2 0 0 1 2 2h10a2 2 0 0 1 2-2V7a2 2 0 0 1-2-2H3z'/%3E%3C/svg%3E");
}

.bi-percent-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M13.442 2.558a.625.625 0 0 1 0 .884l-10 10a.625.625 0 1 1-.884-.884l10-10a.625.625 0 0 1 .884 0ZM4.5 6a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3Zm0 1a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5Zm7 7a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3Zm0 1a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5Z'/%3E%3C/svg%3E");
}

.bi-tablet-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M12 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h8zM4 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H4z'/%3E%3Cpath d='M8 14a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'/%3E%3C/svg%3E");
}

.bi-printer-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8a.5.5 0 1 0 0-1 .5.5 0 0 0 0 1z'/%3E%3Cpath d='M5 1a2 2 0 0 0-2 2v2H2a2 2 0 0 0-2 2v3a2 2 0 0 0 2 2h1v1a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2v-1h1a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-1V3a2 2 0 0 0-2-2H5zM4 3a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v2H4V3zm1 5a2 2 0 0 0-2 2v1H2a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1h-1v-1a2 2 0 0 0-2-2H5zm7 2v3a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-3a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1z'/%3E%3C/svg%3E");
}

.bi-person-badge-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1h-3zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0h-7zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.776-.492C11.392 12.387 10.063 12 8 12s-3.392.387-4.224.803a4.2 4.2 0 0 0-.776.492V2.5z'/%3E%3C/svg%3E");
}

.bi-gear-nav-menu[b-mpn5gs6zns] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23565f66' viewBox='0 0 16 16'%3E%3Cpath d='M8 4.754a3.246 3.246 0 1 0 0 6.492 3.246 3.246 0 0 0 0-6.492zM5.754 8a2.246 2.246 0 1 1 4.492 0 2.246 2.246 0 0 1-4.492 0z'/%3E%3Cpath d='M9.796 1.343c-.527-1.79-3.065-1.79-3.592 0l-.094.319a.873.873 0 0 1-1.255.52l-.292-.16c-1.64-.892-3.433.902-2.54 2.541l.159.292a.873.873 0 0 1-.52 1.255l-.319.094c-1.79.527-1.79 3.065 0 3.592l.319.094a.873.873 0 0 1 .52 1.255l-.16.292c-.892 1.64.901 3.434 2.541 2.54l.292-.159a.873.873 0 0 1 1.255.52l.094.319c.527 1.79 3.065 1.79 3.592 0l.094-.319a.873.873 0 0 1 1.255-.52l.292.16c1.64.893 3.434-.902 2.54-2.541l-.159-.292a.873.873 0 0 1 .52-1.255l.319-.094c1.79-.527 1.79-3.065 0-3.592l-.319-.094a.873.873 0 0 1-.52-1.255l.16-.292c.893-1.64-.902-3.433-2.541-2.54l-.292.159a.873.873 0 0 1-1.255-.52l-.094-.319zm-2.633.283c.246-.835 1.428-.835 1.674 0l.094.319a1.873 1.873 0 0 0 2.693 1.115l.291-.16c.764-.415 1.6.42 1.184 1.185l-.159.292a1.873 1.873 0 0 0 1.116 2.692l.318.094c.835.246.835 1.428 0 1.674l-.319.094a1.873 1.873 0 0 0-1.115 2.693l.16.291c.415.764-.42 1.6-1.185 1.184l-.291-.159a1.873 1.873 0 0 0-2.693 1.116l-.094.318c-.246.835-1.428.835-1.674 0l-.094-.319a1.873 1.873 0 0 0-2.692-1.115l-.292.16c-.764.415-1.6-.42-1.184-1.185l.159-.291A1.873 1.873 0 0 0 1.945 8.93l-.319-.094c-.835-.246-.835-1.428 0-1.674l.319-.094A1.873 1.873 0 0 0 3.06 4.377l-.16-.292c-.415-.764.42-1.6 1.185-1.184l.292.159a1.873 1.873 0 0 0 2.692-1.115l.094-.319z'/%3E%3C/svg%3E");
}

/* Dno sidebara: prijavljeni korisnik i odjava — uvijek vidljivi, van scrolla. */
.sidebar-user[b-mpn5gs6zns] {
    margin-top: auto;
    padding: 12px 12px 14px;
    border-top: 1px solid var(--et-border);
}

.sidebar-user-row[b-mpn5gs6zns] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 4px 6px 12px;
}

.sidebar-avatar[b-mpn5gs6zns] {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: var(--et-gradient);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    flex: 0 0 auto;
}

.sidebar-user-meta[b-mpn5gs6zns] { min-width: 0; }
.sidebar-user-meta b[b-mpn5gs6zns] {
    display: block;
    color: var(--et-text);
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.sidebar-user-meta small[b-mpn5gs6zns] {
    color: var(--et-muted);
    font-size: 11px;
}

.sidebar-logout[b-mpn5gs6zns] {
    width: 100%;
    padding: 9px 0;
    border: 1px solid var(--et-input-border);
    border-radius: 10px;
    background: transparent;
    color: var(--et-muted);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color .12s ease, color .12s ease;
}
.sidebar-logout:hover[b-mpn5gs6zns] {
    background: var(--et-accent-soft);
    color: var(--et-on-accent-soft);
}

/* Dno menija: odjava i tema u jednom redu — tema je malo kvadratno dugme s ikonom. */
.sidebar-actions[b-mpn5gs6zns] {
    display: flex;
    gap: 8px;
}

.sidebar-actions .sidebar-logout[b-mpn5gs6zns] {
    flex: 1;
}

.theme-toggle[b-mpn5gs6zns] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    flex: 0 0 auto;
    border: 1px solid var(--et-input-border);
    border-radius: 10px;
    background: transparent;
    color: var(--et-muted);
    cursor: pointer;
    transition: background-color .12s ease, border-color .12s ease;
}

.theme-toggle:hover[b-mpn5gs6zns] {
    background: var(--et-surface-alt);
    border-color: var(--et-input-border);
}

.theme-toggle-icon[b-mpn5gs6zns] {
    font-size: 15px;
    line-height: 1;
}
/* _content/Etiris.PosErp.BackOffice/Components/Pages/Articles.razor.rz.scp.css */
/* Izbornik sastojaka (01.10.2026.): spisak koji LEBDI iznad sadržaja, otvara se tek kad se nešto
   ukuca, i u kojem se vidi i gdje je kursor s tastature i šta je odabrano.

   Do sada je spisak bio blok u toku stranice s max-height 220 px: stajao je otvoren i kad polje
   nije imalo ništa ukucano (vraćao je do 25 nasumičnih zaliha) i gurao je „Količina", „Jedinica"
   i „Dodaj" u stranu. Vlasnik: „sad sve izlistano, nema logike nikakve."

   Tabele na ovoj stranici OVDJE nemaju ništa — one idu zajedničkim slojem iz wwwroot/app.css
   (odjeljak „TABELE KAD SE PROZOR SUZI"). Pravila ispod su samo za izbornik. */

/* Sidro za lebdeći spisak: polje i spisak dijele isti okvir, pa spisak stoji tačno ispod polja
   i prati njegovu širinu. */
.ing-polje[b-c1hg8bab5y] { position: relative; }

.ing-list[b-c1hg8bab5y] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 20;
    margin-top: .25rem;
    border: 1px solid var(--bs-border-color, var(--et-input-border));
    border-radius: .5rem;
    background: var(--et-surface);
    box-shadow: 0 10px 28px rgba(31, 35, 45, .18);
    overflow: hidden;
}

.ing-row[b-c1hg8bab5y] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .75rem;
    width: 100%;
    padding: .4rem .65rem;
    border: 0;
    border-bottom: 1px solid var(--et-surface-alt);
    background: transparent;
    /* <button> ne nasljeđuje tintu nego uzima sistemsku buttontext — a to koji browser
       kako veže na color-scheme nije isto svuda. Token, da red bude ista boja kao ostatak
       liste u obje teme. */
    color: var(--et-text);
    text-align: left;
    font-size: .85rem;
    cursor: pointer;
}

.ing-row:last-child[b-c1hg8bab5y] { border-bottom: 0; }
.ing-row:hover[b-c1hg8bab5y] { background: var(--et-surface-alt); }

/* Red pod kursorom s tastature. Mora se razlikovati od lebdenja mišem (hover) i od već odabranog
   reda (.on): strelice pomjeraju OVO, Enter uzima OVO. Oznaka je rub s lijeve strane, a ne
   druga podloga, da se vidi i kad je red ujedno i odabran i pod kursorom. */
.ing-row.cursor[b-c1hg8bab5y] {
    background: var(--et-accent-soft);
    box-shadow: inset 3px 0 0 var(--et-accent);
}

.ing-row.on[b-c1hg8bab5y] { font-weight: 600; }

.ing-name[b-c1hg8bab5y] { flex: 1 1 auto; }

.ing-meta[b-c1hg8bab5y] {
    flex: 0 0 auto;
    font-size: .72rem;
    color: var(--et-muted);
    white-space: nowrap;
}

.ing-more[b-c1hg8bab5y] {
    padding: .3rem .65rem;
    font-size: .72rem;
    font-style: italic;
    color: var(--et-muted);
    background: var(--et-surface-alt);
}

/* Rečenica ispod reda za dodavanje: tu stoji uputa, ili „izaberi s liste", ili šta je odabrano.
   Uvijek zauzima jedan red (min-height), da se polja iznad ne pomjeraju gore-dolje dok se stanje
   mijenja. */
.ing-status[b-c1hg8bab5y] {
    min-height: 1.6rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .35rem .75rem;
}

/* Odabrani sastojak — pilula s imenom, jedinicom i stanjem. Jedino mjesto s kojeg se vidi da JE
   nešto odabrano (ime u polju je pretraga, ne izbor). */
.ing-chosen[b-c1hg8bab5y] {
    display: inline-flex;
    align-items: baseline;
    gap: .4rem;
    padding: .2rem .65rem;
    border-radius: 999px;
    background: var(--et-accent-soft);
    color: var(--et-on-accent-soft);
    font-size: .8rem;
    white-space: nowrap;
}

.ing-chosen strong[b-c1hg8bab5y] { font-weight: 600; }

/* ---- Slika artikla (01.10.2026.) ----
   Pregled ~96 px na blago svjetlijoj zaobljenoj podlozi: slike iz biblioteke su PROZIRNI PNG,
   pa im treba podloga da se vide i obrisi (bijela flaša na bijeloj kartici nestane). Ista
   podloga stoji i iza sličica u biblioteci — jedna odluka, dva mjesta. U SPISKU slike nema
   (vlasnik, 01.10.2026.): vidi se tek kad se artikal otvori. Tabele OVDJE i dalje nemaju ništa.

   Mjere (96 px pregled, 80 px biblioteka) stoje i kao width/height ATRIBUTI na <img> u
   Articles.razor: ovaj fajl stiže u browser kroz bundle .styles.css?v=, koji se diže rukom u
   App.razor — kad se zaboravi, browser servira stari bundle bez ovih pravila i PNG od 512 px se
   iscrta u punoj veličini (tako je sličica u spisku prekrila pola ekrana). */
.slika-blok[b-c1hg8bab5y] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.slika-pregled[b-c1hg8bab5y] {
    flex: 0 0 auto;
    width: 96px;
    height: 96px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--et-radius-sm);
    background: var(--et-surface-alt);
    border: 1px solid var(--et-border);
    overflow: hidden;
}

.slika-pregled img[b-c1hg8bab5y] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.slika-prazno[b-c1hg8bab5y] {
    font-size: .72rem;
    color: var(--et-faint);
    text-align: center;
    padding: .25rem;
}

.slika-radnje[b-c1hg8bab5y] { flex: 1 1 auto; min-width: 0; }

/* Biblioteka: mreža sličica s nazivom ispod svake. Red sličica se sam prelama po širini modala. */
.biblioteka-mreza[b-c1hg8bab5y] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr));
    gap: .75rem;
}

.biblioteka-slika[b-c1hg8bab5y] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .4rem;
    padding: .5rem;
    border: 1px solid var(--et-border);
    border-radius: var(--et-radius-sm);
    background: var(--et-surface);
    color: var(--et-text);
    cursor: pointer;
}

.biblioteka-slika:hover[b-c1hg8bab5y],
.biblioteka-slika:focus-visible[b-c1hg8bab5y] {
    border-color: var(--et-accent);
    background: var(--et-accent-soft);
}

.biblioteka-slika:disabled[b-c1hg8bab5y] { opacity: .6; cursor: default; }

/* Slika koja je TRENUTNO na artiklu: okvir u boji akcenta i oznaka „trenutna" ispod naziva — da
   se u mreži od šesnaest sličica vidi od koje se kreće (pregled 01.10.2026.). */
.biblioteka-slika.biblioteka-trenutna[b-c1hg8bab5y] {
    border-color: var(--et-accent);
    box-shadow: inset 0 0 0 1px var(--et-accent);
}

.biblioteka-trenutna-oznaka[b-c1hg8bab5y] {
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--et-accent);
}

.biblioteka-okvir[b-c1hg8bab5y] {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--et-radius-sm);
    background: var(--et-surface-alt);
    overflow: hidden;
}

.biblioteka-okvir img[b-c1hg8bab5y] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.biblioteka-naziv[b-c1hg8bab5y] {
    font-size: .8rem;
    text-align: center;
    line-height: 1.2;
}
/* _content/Etiris.PosErp.BackOffice/Components/Pages/Boravci.razor.rz.scp.css */
.pg-head[b-8en89aukec] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.1rem;
}

.pg-title[b-8en89aukec] {
    font-size: 1.45rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--et-text);
    margin: 0;
}

.pg-sub[b-8en89aukec] {
    color: var(--et-muted);
    font-size: 0.85rem;
}

.filters[b-8en89aukec] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
}

/* Kućica pretrage: iste visine i oblika kao čip, da red filtera ostane jedan red. */
.search[b-8en89aukec] {
    background: var(--et-input-bg);
    border: 1px solid var(--et-input-border);
    border-radius: 999px;
    padding: 0.3rem 0.95rem;
    font-size: 0.8rem;
    color: var(--et-text);
    min-width: 15rem;
    outline: none;
}

.search[b-8en89aukec]::placeholder { color: var(--et-faint); }

.search:focus[b-8en89aukec] { border-color: var(--et-accent); }

.chip[b-8en89aukec] {
    background: var(--et-surface);
    border: 1px solid var(--et-border);
    border-radius: 999px;
    padding: 0.3rem 0.95rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--et-muted);
    cursor: pointer;
    transition: all 0.12s;
}

.chip:hover[b-8en89aukec] { border-color: var(--et-input-border); }

.chip.on[b-8en89aukec] {
    background: var(--et-text);
    border-color: var(--et-text);
    /* U svijetloj temi doslovno bijela; u tamnoj je podloga čipa svijetla
       (--et-text je tada svijetli slate), pa tinta postaje tamna površina. */
    color: var(--et-surface);
}

.stay-card[b-8en89aukec] {
    background: var(--et-surface);
    border: 1px solid var(--et-border);
    border-radius: 14px;
    box-shadow: 0 1px 3px rgb(15 23 42 / 0.06);
    overflow-x: auto;
    /* Tabela unutra klizi u svom omotaču (table-responsive, app.css „TABELE KAD SE PROZOR
       SUZI"). Boju podloge za sjenu klizanja (--et-tabela-pod) ovoj kartici daje app.css, uz
       .card i .modal-content — sloj tabela ima JEDNO mjesto, pa se ni izuzeci ne pišu ovdje. */
}

.stay-table[b-8en89aukec] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
}

/* Šta se smije lomiti odlučuju ćelijske klase iz app.css (cel-kratko, cel-naziv…), ne ovaj
   fajl: scoped pravilo `.stay-table td` ima VEĆU specifičnost od pravila sloja, pa je
   „white-space: nowrap" odavde nadjačavalo i kartice ispod 641 px — ime gosta u kartici nije
   smjelo u dva reda, a red je bio 400 px visok (izmjereno 01.10.2026.). Isto važi i za
   poravnanje: zaglavlje je ovdje bilo prikovano lijevo, a od 22.10.2026. ga (s podatkom ispod
   njega) po sredini drži app.css, odjeljak „PORAVNANJE". */
.stay-table th[b-8en89aukec] {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--et-faint);
}

.stay-table td[b-8en89aukec] { color: var(--et-text); }

/* Razmaci i linije redova važe samo dok je tabela tabela. Ispod 641 px red je kartica po
   app.css (border: 0, manji razmak) i ova pravila mu ne smiju smetati — isti prekid kao tamo. */
@media (min-width: 641px) {
    .stay-table th[b-8en89aukec] {
        padding: 0.7rem 1rem;
        border-bottom: 1px solid var(--et-border);
    }

    .stay-table td[b-8en89aukec] {
        padding: 0.65rem 1rem;
        border-bottom: 1px solid var(--et-surface-alt);
    }

    .stay-table tbody tr:last-child td[b-8en89aukec] { border-bottom: none; }
}

.stay-table tbody tr:hover td[b-8en89aukec] { background: var(--et-bg); }

.mono[b-8en89aukec] { font-variant-numeric: tabular-nums; }

.guest[b-8en89aukec] {
    font-weight: 600;
    color: var(--et-text);
}

.arr[b-8en89aukec] {
    color: var(--et-faint);
    padding: 0 0.3rem;
}

.pill[b-8en89aukec] {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-radius: 999px;
    padding: 0.22rem 0.7rem;
}

.pill-confirmed[b-8en89aukec] { background: var(--et-accent-soft); color: var(--et-on-accent-soft); }
.pill-in[b-8en89aukec] { background: var(--et-chip-green-bg); color: var(--et-chip-green-fg); }
.pill-inquiry[b-8en89aukec] { background: var(--et-chip-amber-bg); color: var(--et-chip-amber-fg); }
.pill-done[b-8en89aukec] { background: var(--et-surface-alt); color: var(--et-muted); }
.pill-off[b-8en89aukec] { background: var(--et-chip-red-bg); color: var(--et-chip-red-fg); }

/* prijava gostiju: kolona i čip filtera — isti zeleni/crveni par kao statusne pilule */
.pill-reg-ok[b-8en89aukec] { background: var(--et-chip-green-bg); color: var(--et-chip-green-fg); }
.pill-reg-missing[b-8en89aukec] { background: var(--et-chip-red-bg); color: var(--et-chip-red-fg); }

.reg-na[b-8en89aukec] { color: var(--et-faint); }

.filters-split[b-8en89aukec] {
    width: 1px;
    align-self: stretch;
    background: var(--et-border);
    margin: 0 0.3rem;
}

.chip-reg.on[b-8en89aukec] {
    background: var(--et-chip-red-fg);
    border-color: var(--et-chip-red-fg);
    color: var(--et-surface);
}

/* „Izmijeni" u redu — isti tihi stil kao gr-btn u drawer-u plana: tekst, akcentna tinta. */
.row-btn[b-8en89aukec] {
    background: none;
    border: 1px solid var(--et-border);
    border-radius: 6px;
    padding: 0.2rem 0.6rem;
    font-size: 0.76rem;
    font-weight: 600;
    color: var(--et-accent);
    cursor: pointer;
}

.row-btn:hover[b-8en89aukec] { border-color: var(--et-accent); }
.row-btn:disabled[b-8en89aukec] { opacity: 0.5; cursor: default; }
/* _content/Etiris.PosErp.BackOffice/Components/Pages/DnevniIzvjestaj.razor.rz.scp.css */
/* Dnevni izvještaj (F8). Isti oblik zaglavlja i izbora kao obrazac pristojbe — dvije stranice
   recepcije koje se čitaju jedna za drugom ne smiju izgledati kao dva proizvoda. */

.pg-head[b-0qh4e3n6uq] {
    margin-bottom: 1.1rem;
}

.pg-title[b-0qh4e3n6uq] {
    font-size: 1.45rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--et-text);
    margin: 0;
}

.pg-sub[b-0qh4e3n6uq] {
    color: var(--et-muted);
    font-size: 0.85rem;
}

.pick[b-0qh4e3n6uq] {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.pick-actions[b-0qh4e3n6uq] {
    display: flex;
    gap: 0.5rem;
}

.f-label[b-0qh4e3n6uq] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--et-muted);
    margin-bottom: 0.25rem;
    display: block;
}

/* Brojevi boravka i računa u monospace — spisak od dvadeset redova se čita kao kolona. */

.mono[b-0qh4e3n6uq] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* Traka zatvorenog dana: ZAMRZNUTI brojevi. Stoji umjesto dugmeta, da se dan ne nudi dvaput. */

.closed-banner[b-0qh4e3n6uq] {
    border: 1px solid var(--et-border);
    border-left: 4px solid var(--et-accent);
    border-radius: var(--et-radius);
    background: var(--et-surface);
    padding: 0.9rem 1rem;
    margin-bottom: 1.25rem;
}

.cb-head[b-0qh4e3n6uq] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.6rem;
    margin-bottom: 0.7rem;
}

.cb-badge[b-0qh4e3n6uq] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--et-accent);
}

.cb-when[b-0qh4e3n6uq] {
    color: var(--et-muted);
    font-size: 0.85rem;
}

.cb-grid[b-0qh4e3n6uq] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 0.6rem 1rem;
}

.cb-k[b-0qh4e3n6uq] {
    display: block;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--et-muted);
}

.cb-v[b-0qh4e3n6uq] {
    display: block;
    font-weight: 600;
    color: var(--et-text);
}

/* Potvrda zatvaranja: imenuje ono što je nepovratno prije nego što se dogodi. */

.confirm-card[b-0qh4e3n6uq] {
    border: 1px solid var(--et-border);
    border-radius: var(--et-radius);
    background: var(--et-surface);
    padding: 1rem;
    margin-bottom: 1.25rem;
    max-width: 720px;
}

.cc-title[b-0qh4e3n6uq] {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--et-text);
    margin: 0 0 0.6rem;
}

.cc-text[b-0qh4e3n6uq] {
    font-size: 0.9rem;
    color: var(--et-text);
    margin-bottom: 0.5rem;
}

.cc-list[b-0qh4e3n6uq] {
    margin: 0 0 0.75rem;
    padding-left: 1.2rem;
    font-size: 0.9rem;
}

.cc-actions[b-0qh4e3n6uq] {
    display: flex;
    gap: 0.5rem;
}

/* ---- papir ----
   Dnevni list se štampa i odlaže u fasciklu. Traka zatvorenog dana nosi konačne brojeve, pa mora
   ostati čitljiva i kad izgubi boju: globalno pravilo za štampu gasi boje samo karticama (.card),
   a ova traka nije kartica. Bez ovoga bi akcentna ivica i prigušeni naslovi ispali kao sivo na
   sivom, a traka bi se znala prelomiti na dvije strane. */

@media print {
    /* Zaglavlje izvještaja stoji unutar .pg-head, a .pg-head je u app.css flex red (naslov
       lijevo, dugmad desno). Dugmad na papiru nestanu, ali zaglavlje ostane FLEX STAVKA: otisne
       se kao uska kolona desno od naslova, a crta ispod njega stane tek preko te kolone umjesto
       preko cijelog lista. Na papiru zato red pada u blokove. */
    .pg-head[b-0qh4e3n6uq] {
        display: block !important;
    }

    .closed-banner[b-0qh4e3n6uq] {
        border: 1px solid #000;
        border-left: 1px solid #000;
        border-radius: 0;
        background: #fff;
        padding: 6px 8px;
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .cb-badge[b-0qh4e3n6uq],
    .cb-v[b-0qh4e3n6uq] {
        color: #000;
    }

    .cb-when[b-0qh4e3n6uq],
    .cb-k[b-0qh4e3n6uq] {
        color: #333;
    }
}
/* _content/Etiris.PosErp.BackOffice/Components/Pages/Domacinstvo.razor.rz.scp.css */
/* Telefon prvi: jedna kolona, kartice, dugmad koja se pogađaju palcem. Ispod 600 px nema ničega
   što bi tražilo tabelu; iznad se kartice samo slože u više kolona. */

.hk[b-m1u9la2xug] {
    max-width: 1100px;
}

.hk-head[b-m1u9la2xug] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.hk-title[b-m1u9la2xug] {
    font-size: 1.45rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--et-text);
    margin: 0;
}

.hk-sub[b-m1u9la2xug] {
    color: var(--et-muted);
    font-size: 0.85rem;
}

.hk-tools[b-m1u9la2xug] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.hk-refresh[b-m1u9la2xug] {
    min-width: 56px;
    min-height: 56px;
    border-radius: var(--et-radius-sm);
    border: 1px solid var(--et-border);
    background: var(--et-surface);
    color: var(--et-text);
    font-size: 1.4rem;
    cursor: pointer;
}

.hk-refresh:disabled[b-m1u9la2xug] {
    opacity: 0.5;
    cursor: default;
}

.hk-error[b-m1u9la2xug] {
    background: var(--et-danger-soft);
    color: var(--et-danger-soft-fg);
    border-radius: var(--et-radius-sm);
    padding: 0.7rem 0.9rem;
    margin-bottom: 1rem;
    font-size: 0.9rem;
}

.hk-empty[b-m1u9la2xug] {
    color: var(--et-faint);
    font-size: 0.9rem;
    padding: 0.5rem 0.2rem 1rem;
}

.hk-group[b-m1u9la2xug] {
    margin-bottom: 1.4rem;
}

.hk-group-title[b-m1u9la2xug] {
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--et-faint);
    margin: 0 0 0.6rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.hk-count[b-m1u9la2xug] {
    background: var(--et-surface-alt);
    color: var(--et-muted);
    border-radius: 999px;
    padding: 0.1rem 0.6rem;
    font-size: 0.75rem;
}

.hk-cards[b-m1u9la2xug] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.65rem;
}

@media (min-width: 600px) {
    .hk-cards[b-m1u9la2xug] {
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    }
}

.hk-card[b-m1u9la2xug] {
    background: var(--et-surface);
    border: 1px solid var(--et-border);
    border-left: 6px solid var(--et-border);
    border-radius: 14px;
    box-shadow: 0 1px 3px rgb(15 23 42 / 0.06);
    padding: 0.85rem 0.95rem;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

/* Boja lijeve ivice je stanje: crveno čeka, žuto se radi, zeleno gotovo, boja kuće pregledano. */
.hk-card.state-prljava[b-m1u9la2xug] { border-left-color: var(--et-chip-red-fg); }
.hk-card.state-u_ciscenju[b-m1u9la2xug] { border-left-color: var(--et-chip-amber-fg); }
.hk-card.state-cista[b-m1u9la2xug] { border-left-color: var(--et-chip-green-fg); }
.hk-card.state-pregledana[b-m1u9la2xug] { border-left-color: var(--et-accent); }

.hk-card-top[b-m1u9la2xug] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.hk-number[b-m1u9la2xug] {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.1;
    color: var(--et-text);
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.hk-floor[b-m1u9la2xug] {
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--et-muted);
}

.hk-badges[b-m1u9la2xug] {
    display: flex;
    gap: 0.35rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.hk-badge[b-m1u9la2xug] {
    border-radius: 999px;
    padding: 0.2rem 0.6rem;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.hk-badge.kind[b-m1u9la2xug] {
    background: var(--et-surface-alt);
    color: var(--et-muted);
}

.hk-badge.arrive[b-m1u9la2xug] {
    background: var(--et-secondary-soft);
    color: var(--et-secondary-soft-fg);
}

.hk-badge.svc[b-m1u9la2xug] {
    background: var(--et-danger-soft);
    color: var(--et-danger-soft-fg);
}

.hk-meta[b-m1u9la2xug] {
    font-size: 0.85rem;
    color: var(--et-muted);
}

.hk-state[b-m1u9la2xug] {
    font-weight: 600;
    color: var(--et-text);
}

.hk-reason[b-m1u9la2xug] {
    font-size: 0.85rem;
    color: var(--et-danger-soft-fg);
    background: var(--et-danger-soft);
    border-radius: var(--et-radius-sm);
    padding: 0.4rem 0.6rem;
}

.hk-actions[b-m1u9la2xug] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.hk-actions:empty[b-m1u9la2xug] {
    display: none;
}

/* Najmanje 56 px visine: dugme koje se pogađa palcem u hodu, ne mišem za stolom. */
.hk-btn[b-m1u9la2xug] {
    flex: 1 1 140px;
    min-height: 56px;
    border-radius: var(--et-radius-sm);
    font-size: 1.05rem;
    font-weight: 600;
    padding: 0.5rem 1rem;
    cursor: pointer;
    border: 1px solid transparent;
    transition: filter 0.12s;
}

.hk-btn:disabled[b-m1u9la2xug] {
    opacity: 0.55;
    cursor: default;
}

.hk-btn:not(:disabled):hover[b-m1u9la2xug] {
    filter: brightness(0.95);
}

.hk-btn.primary[b-m1u9la2xug] {
    background: var(--et-gradient);
    color: #fff;
}

.hk-btn.ghost[b-m1u9la2xug] {
    background: var(--et-surface);
    color: var(--et-text);
    border-color: var(--et-input-border);
}

.hk-btn.danger[b-m1u9la2xug] {
    background: var(--et-danger);
    color: #fff;
}

.hk-reason-form[b-m1u9la2xug] {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    background: var(--et-surface-alt);
    border-radius: var(--et-radius-sm);
    padding: 0.7rem;
}

.hk-reason-form label[b-m1u9la2xug] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--et-text);
}

.hk-reason-form textarea[b-m1u9la2xug] {
    width: 100%;
    border: 1px solid var(--et-input-border);
    border-radius: var(--et-radius-sm);
    background: var(--et-surface);
    color: var(--et-text);
    padding: 0.55rem 0.7rem;
    font-size: 1rem;
    resize: vertical;
}

.hk-field-error[b-m1u9la2xug] {
    font-size: 0.85rem;
    color: var(--et-danger);
}
/* _content/Etiris.PosErp.BackOffice/Components/Pages/IzvjestajPristojba.razor.rz.scp.css */
.pg-head[b-3jsrbjo5op] {
    margin-bottom: 1.1rem;
}

.pg-title[b-3jsrbjo5op] {
    font-size: 1.45rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--et-text);
    margin: 0;
}

.pg-sub[b-3jsrbjo5op] {
    color: var(--et-muted);
    font-size: 0.85rem;
}

/* izbor perioda: mjesec je prvi, od/do za onoga ko predaje polumjesec */

.pick[b-3jsrbjo5op] {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.pick-actions[b-3jsrbjo5op] {
    display: flex;
    gap: 0.5rem;
}

.f-label[b-3jsrbjo5op] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--et-muted);
    margin-bottom: 0.25rem;
    display: block;
}

/* blok za kopiranje: monospace da kolone obrasca stoje jedna ispod druge */

.copy-block[b-3jsrbjo5op] {
    max-width: 860px;
}

.copy-text[b-3jsrbjo5op] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.8rem;
    white-space: pre;
    overflow-x: auto;
}

.copy-actions[b-3jsrbjo5op] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.5rem;
}

/* ---- papir ----
   Zaglavlje izvještaja stoji unutar .pg-head, a .pg-head je u app.css flex red (naslov lijevo,
   dugmad desno). Dugmad na papiru nestanu, ali zaglavlje ostane FLEX STAVKA: otisne se kao uska
   kolona desno od naslova, a crta ispod njega stane tek preko te kolone umjesto preko cijelog
   lista. Na papiru zato red pada u blokove. */

@media print {
    .pg-head[b-3jsrbjo5op] {
        display: block !important;
    }
}
/* _content/Etiris.PosErp.BackOffice/Components/Pages/Kanali.razor.rz.scp.css */
/* Kanali — izgled prati Plan soba i Stanice: kartice na temu, ladica s desne strane za
   odluku koja se donosi nad jednom rezervacijom. Sve boje su tokeni (--et-*), pa tamna
   tema radi sama od sebe; nijedna vrijednost nije zakucana. */

.kan-kpis[b-f1qlsgzky3] {
    display: flex;
    gap: 1.4rem;
    align-items: flex-end;
}

.kan-kpi[b-f1qlsgzky3] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    line-height: 1.1;
}

.kan-kpi-num[b-f1qlsgzky3] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--et-text);
}

.kan-kpi.danger .kan-kpi-num[b-f1qlsgzky3] { color: var(--et-danger); }

.kan-kpi-of[b-f1qlsgzky3] {
    font-size: 0.85rem;
    color: var(--et-muted);
    margin-top: -0.35rem;
}

.kan-kpi-lbl[b-f1qlsgzky3] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--et-muted);
}

/* ---------- čipovi stanja ---------- */

.kan-chip[b-f1qlsgzky3] {
    display: inline-block;
    padding: 0.1rem 0.55rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    white-space: nowrap;
}

.kan-chip.ok[b-f1qlsgzky3] { background: var(--et-chip-green-bg); color: var(--et-chip-green-fg); }
.kan-chip.warn[b-f1qlsgzky3] { background: var(--et-chip-amber-bg); color: var(--et-chip-amber-fg); }
.kan-chip.bad[b-f1qlsgzky3] { background: var(--et-chip-red-bg); color: var(--et-chip-red-fg); }
.kan-chip.idle[b-f1qlsgzky3] { background: var(--et-surface-alt); color: var(--et-muted); }

/* ---------- kartica Veza ---------- */

.kan-facts[b-f1qlsgzky3] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.2rem 0.9rem;
    margin: 0;
    font-size: 0.85rem;
}

.kan-facts dt[b-f1qlsgzky3] {
    color: var(--et-muted);
    font-weight: 500;
}

.kan-facts dd[b-f1qlsgzky3] {
    margin: 0;
    color: var(--et-text);
}

/* ---------- rezervacije ---------- */

/* Neraspoređena rezervacija je jedini red na ekranu koji traži čovjeka danas — i tako izgleda. */
.kan-open[b-f1qlsgzky3] {
    background: var(--et-danger-soft);
}

.kan-open td[b-f1qlsgzky3] { color: var(--et-danger-soft-fg); }

.kan-detail[b-f1qlsgzky3] {
    background: var(--et-surface-alt);
}

.kan-detail td[b-f1qlsgzky3] { padding: 0.75rem 1rem; }

/* ---------- dnevnik ---------- */

.kan-recon[b-f1qlsgzky3] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.75rem;
    align-items: flex-end;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--et-border);
}

.kan-recon-cell[b-f1qlsgzky3] {
    display: flex;
    flex-direction: column;
    line-height: 1.15;
}

.kan-recon-num[b-f1qlsgzky3] {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--et-text);
}

.kan-recon-cell.danger .kan-recon-num[b-f1qlsgzky3] { color: var(--et-danger); }

.kan-recon-lbl[b-f1qlsgzky3] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--et-muted);
}

.kan-recon-note[b-f1qlsgzky3] {
    flex: 1;
    min-width: 14rem;
    font-size: 0.8rem;
    color: var(--et-muted);
}

.kan-sub[b-f1qlsgzky3] {
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--et-muted);
    margin: 1.1rem 0 0.5rem;
}

.kan-log[b-f1qlsgzky3] {
    max-height: 22rem;
    overflow-y: auto;
}

.kan-fail td[b-f1qlsgzky3] { color: var(--et-danger); }

/* ---------- ladica ---------- */

.drawer-veil[b-f1qlsgzky3] {
    position: fixed;
    inset: 0;
    background: rgb(15 23 42 / 0.35);
    z-index: 1040;
    animation: veil-in-b-f1qlsgzky3 0.15s ease-out;
}

@keyframes veil-in-b-f1qlsgzky3 {
    from { opacity: 0; }
}

.drawer[b-f1qlsgzky3] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(460px, 94vw);
    background: var(--et-surface);
    z-index: 1050;
    box-shadow: -12px 0 40px rgb(15 23 42 / 0.18);
    display: flex;
    flex-direction: column;
    animation: drawer-in-b-f1qlsgzky3 0.18s ease-out;
}

@keyframes drawer-in-b-f1qlsgzky3 {
    from { transform: translateX(30px); opacity: 0; }
}

.drawer-head[b-f1qlsgzky3] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1.35rem 1.5rem 1rem;
    border-bottom: 1px solid var(--et-surface-alt);
}

.drawer-kicker[b-f1qlsgzky3] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    color: var(--et-accent);
    margin-bottom: 0.15rem;
}

.drawer-title[b-f1qlsgzky3] {
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--et-text);
    margin: 0;
}

.drawer-x[b-f1qlsgzky3] {
    background: none;
    border: none;
    color: var(--et-faint);
    font-size: 1rem;
    cursor: pointer;
    padding: 0.25rem;
}

.drawer-x:hover[b-f1qlsgzky3] { color: var(--et-text); }

.drawer-body[b-f1qlsgzky3] {
    padding: 1.25rem 1.5rem;
    overflow-y: auto;
    flex: 1;
}

.drawer-foot[b-f1qlsgzky3] {
    display: flex;
    gap: 0.6rem;
    justify-content: flex-end;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--et-surface-alt);
}

/* ---------- izbor sobe ---------- */

.kan-rooms[b-f1qlsgzky3] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr));
    gap: 0.6rem;
}

.kan-room[b-f1qlsgzky3] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 0.6rem 0.7rem;
    border: 1px solid var(--et-input-border);
    border-radius: var(--et-radius-sm);
    background: var(--et-input-bg);
    color: var(--et-text);
    text-align: left;
    cursor: pointer;
}

.kan-room:hover[b-f1qlsgzky3] { border-color: var(--et-accent); }

.kan-room.on[b-f1qlsgzky3] {
    border-color: var(--et-accent);
    background: var(--et-accent-soft);
    color: var(--et-accent-soft-fg);
}

/* Soba drugog tipa nije zabranjena, ali se ne smije izabrati nehotice. */
.kan-room.other[b-f1qlsgzky3] { border-style: dashed; }

/* Rezervacija u drugoj valuti: iznos u KM je odluka koju recepcija donosi, pa stoji odvojeno. */
.kan-fx[b-f1qlsgzky3] {
    padding: 0.75rem 0.9rem;
    border-radius: var(--et-radius-sm);
    background: var(--et-warning-soft);
    color: var(--et-warning-soft-fg);
}

.kan-fx .form-label[b-f1qlsgzky3] { color: var(--et-warning-soft-fg); }

.kan-room-no[b-f1qlsgzky3] {
    font-size: 1.05rem;
    font-weight: 700;
}

.kan-room-type[b-f1qlsgzky3] {
    font-size: 0.78rem;
    color: var(--et-muted);
}

.kan-room.on .kan-room-type[b-f1qlsgzky3],
.kan-room.on .kan-room-state[b-f1qlsgzky3] { color: var(--et-accent-soft-fg); }

.kan-room-state[b-f1qlsgzky3] {
    font-size: 0.72rem;
    color: var(--et-faint);
}
/* _content/Etiris.PosErp.BackOffice/Components/Pages/PlanSoba.razor.rz.scp.css */
/* Plan soba — tape chart po docs/reports/2026-09-09-plan-soba-dizajn.md.

   Pravila koja se ne smiju pogaziti:
   · nijedna boja nije zakucana — sve ide kroz --et-* tokene (app.css nosi i svijetlu i tamnu);
   · oštre linije: radijus samo na karticama i na VANJSKIM krajevima trake, nigdje pilula;
   · sve mjere (visina reda, širina dana, visina trake) dolaze iz RoomPlanLayout kao --row-h,
     --day-w, --bar-h, --bar-top, --room-col, --total-w; ovaj fajl ih samo troši;
   · --day-w je NAJMANJA širina dana, ne konačna: plan zauzima čitavu širinu ekrana i kolone
     se šire dok ima mjesta (vidi .plan i grid-template-columns niže). */

/* ---------- zaglavlje ---------- */

.plan-head[b-65w7xpecx7] {
    display: flex;
    align-items: flex-end;
    gap: 2rem;
    flex-wrap: wrap;
    margin-bottom: 0.7rem;
}

.plan-id[b-65w7xpecx7] {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.plan-title[b-65w7xpecx7] {
    font-size: 1.45rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--et-text);
    margin: 0;
}

.plan-sub[b-65w7xpecx7] {
    color: var(--et-muted);
    font-size: 0.85rem;
    font-variant-numeric: tabular-nums;
}

.plan-kpis[b-65w7xpecx7] {
    display: flex;
    gap: 0.75rem;
    margin-left: auto;
}

.kpi[b-65w7xpecx7] {
    background: var(--et-surface);
    border: 1px solid var(--et-border);
    border-radius: var(--et-radius-sm);
    padding: 0.4rem 0.9rem;
    display: flex;
    align-items: baseline;
    gap: 0.35rem;
    box-shadow: var(--et-shadow);
}

.kpi-num[b-65w7xpecx7] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--et-text);
    font-variant-numeric: tabular-nums;
}

.kpi-of[b-65w7xpecx7] {
    color: var(--et-faint);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.kpi-lbl[b-65w7xpecx7] {
    color: var(--et-muted);
    font-size: 0.75rem;
}

/* ---------- alatna traka: raspon, gustoća, pomjeranje ---------- */

.plan-bar[b-65w7xpecx7] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
    margin-bottom: 0.6rem;
}

/* Prekidači su ravni — na ovom ekranu radijus nose samo kartice i krajevi trake. */
.seg[b-65w7xpecx7] {
    display: inline-flex;
    border: 1px solid var(--et-border);
    background: var(--et-surface);
}

.seg-btn[b-65w7xpecx7] {
    background: none;
    border: none;
    border-right: 1px solid var(--et-border);
    padding: 0.32rem 0.8rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--et-muted);
    cursor: pointer;
    font-variant-numeric: tabular-nums;
    transition: background 0.12s, color 0.12s;
}

.seg-btn:last-child[b-65w7xpecx7] { border-right: none; }
.seg-btn:hover[b-65w7xpecx7] { background: var(--et-surface-alt); color: var(--et-text); }

.seg-btn.on[b-65w7xpecx7] {
    background: var(--et-accent-soft);
    color: var(--et-on-accent-soft);
    font-weight: 700;
}

.plan-nav[b-65w7xpecx7] {
    display: flex;
    gap: 0.35rem;
    margin-left: auto;
}

.nav-btn[b-65w7xpecx7] {
    background: var(--et-surface);
    border: 1px solid var(--et-border);
    min-width: 2.1rem;
    height: 2.1rem;
    padding: 0 0.7rem;
    font-size: 0.95rem;
    color: var(--et-text);
    cursor: pointer;
    transition: background 0.12s, border-color 0.12s;
}

.nav-btn:hover[b-65w7xpecx7] {
    background: var(--et-surface-alt);
    border-color: var(--et-input-border);
}

.nav-today[b-65w7xpecx7] {
    font-size: 0.8rem;
    font-weight: 600;
}

/* ---------- mreža ---------- */

.plan-card[b-65w7xpecx7] {
    background: var(--et-surface);
    border: 1px solid var(--et-border);
    border-radius: var(--et-radius-sm);
    box-shadow: var(--et-shadow);
    overflow: hidden;
    /* Kartica ide preko CIJELE raspoložive širine — mreža se rasteže do nje, ne obrnuto.
       09.09.2026. je bilo naopako: da iza zadnjeg dana ne zjapi prazna traka, kartica je
       skupljena na širinu mreže (width: fit-content), pa je na širokom monitoru plan
       zauzimao nešto više od pola ekrana. Vlasnik je 10.09. s pravom rekao da to ne valja:
       prazninu rješava širenje kolona (minmax(...,1fr) niže), a ne skupljanje kartice. */
}

/* Jedan skrol za oba smjera — zalijepljeno zaglavlje i zalijepljena kolona sobe žive
   u odnosu na njega. Bez ovoga je 40 soba × 30 dana neupotrebljivo. */
.plan-scroll[b-65w7xpecx7] {
    overflow: auto;
    max-height: max(360px, calc(100vh - 19rem));
    overscroll-behavior: contain;
}

/* Mreža je široka koliko i skrol (dakle koliko i ekran), ali nikad uža od svog minimuma:
   --total-w je lijeva kolona plus najmanja širina dana puta broj dana. Čim taj minimum
   pređe raspoloživu širinu, .plan iskoči iz .plan-scroll i skrol se pojavi sam. */
.plan[b-65w7xpecx7] {
    position: relative;
    width: 100%;
    min-width: var(--total-w);
}

/* Kolone dana se ŠIRE dok ima mjesta: --day-w je najmanja mjera (iz gustoće), ne konačna,
   pa 1fr podijeli ostatak ekrana na jednake dane. Isto pravilo, u brojevima, računa i
   domen — RoomPlanLayout.EffectiveDayWidth / NeedsHorizontalScroll — pa kasa i back-office
   ne mogu dobiti različit dan. Zbog toga se trake NE mogu postaviti u pikselima (mreža svoju
   širinu ne zna u trenutku crtanja) nego u postocima; vidi BarStyle u .razor. */
.grid-head[b-65w7xpecx7],
.group-row[b-65w7xpecx7],
.room-row[b-65w7xpecx7] {
    display: grid;
    grid-template-columns: var(--room-col) repeat(var(--days), minmax(var(--day-w), 1fr));
}

/* Slojevi: ćelije (0) < trake (2) < linija „danas" (4) < lijeva kolona (6) < zaglavlje (7)
   < ugao (8). Linija danas mora biti ispod lijeve kolone, inače pri horizontalnom skrolu
   probije kroz zalijepljene brojeve soba. */

.grid-head[b-65w7xpecx7] {
    position: sticky;
    top: 0;
    z-index: 7;
    background: var(--et-surface);
    border-bottom: 1px solid var(--et-border);
}

.corner[b-65w7xpecx7] {
    position: sticky;
    left: 0;
    z-index: 8;
    background: var(--et-surface);
    border-right: 1px solid var(--et-border);
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--et-faint);
    padding: 0.5rem 0.7rem;
    display: flex;
    align-items: flex-end;
}

.day-head[b-65w7xpecx7] {
    text-align: center;
    padding: 0.35rem 0 0.3rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    border-left: 1px solid var(--et-table-line);
}

.day-head .dow[b-65w7xpecx7] {
    font-size: 0.62rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--et-faint);
}

.day-head .dnum[b-65w7xpecx7] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--et-text);
    font-variant-numeric: tabular-nums;
}

/* Vikend je JEDNA boja kroz cijelu kolonu — zaglavlje, red grupe i red sobe. Dok je ćelija
   sobe uzimala --et-bg a ćelija grupe --et-surface-alt, u svijetloj temi se to nije vidjelo
   (obje vrijednosti su skoro iste), ali u tamnoj je --et-bg tamniji od kartice a
   --et-surface-alt svjetliji: vikend se u redu grupe posvijetlio a u redu sobe potamnio, i
   stupac se prelamao na sredini. --et-surface-alt je „jedan korak od podloge" u obje teme. */
.day-head.weekend[b-65w7xpecx7] { background: var(--et-surface-alt); }

/* Danas: puna oznaka, ne obrub — vidi se preko cijele širine ekrana. */
.day-head.today .dnum[b-65w7xpecx7] {
    color: var(--et-plan-danas-fg);
    background: var(--et-plan-danas);
    border-radius: 3px;
    min-width: 1.5rem;
    padding: 0 0.25rem;
}

/* Tanka okomita linija kroz cijelu mrežu, ispod zalijepljenog zaglavlja i lijeve kolone. */
.today-line[b-65w7xpecx7] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2px;
    margin-left: -1px;
    background: var(--et-plan-danas);
    opacity: 0.55;
    z-index: 4;
    pointer-events: none;
}

/* ---------- grupa po tipu sobe ---------- */

.group-row[b-65w7xpecx7] {
    background: var(--et-bg);
    border-bottom: 1px solid var(--et-border);
    height: 34px;
}

/* Sklopljena grupa je odgovor na „šta kad bude 40 soba": pet redova umjesto četrdeset,
   a u svakom danu piše koliko je soba tog tipa slobodno. */
.group-row.is-collapsed[b-65w7xpecx7] { height: max(34px, var(--row-h)); }

.group-label[b-65w7xpecx7] {
    position: sticky;
    left: 0;
    z-index: 6;
    background: var(--et-bg);
    border: none;
    border-right: 1px solid var(--et-border);
    display: flex;
    align-items: center;
    gap: 0.35rem;
    width: 100%;
    padding: 0 0.5rem;
    text-align: left;
    cursor: pointer;
    color: var(--et-muted);
    /* Sažetak („Dvokrevetne (18) · 4 slobodne") mora stati u 180 px cijeli — verzal i
       razmaknuta slova su ga odsijecali baš na broju slobodnih, jedinom podatku zbog kojeg
       sklopljena grupa i postoji. Zato mala slova i prelom u dva reda. */
    font-size: 0.68rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.group-label:hover[b-65w7xpecx7] { color: var(--et-text); }

.group-caret[b-65w7xpecx7] {
    font-size: 0.6rem;
    color: var(--et-faint);
    flex-shrink: 0;
}

.group-name[b-65w7xpecx7] {
    line-height: 1.15;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.group-cell[b-65w7xpecx7] {
    border-left: 1px solid var(--et-table-line);
    display: flex;
    align-items: center;
    justify-content: center;
}

.group-cell.weekend[b-65w7xpecx7] { background: var(--et-surface-alt); }

.free-num[b-65w7xpecx7] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--et-muted);
    font-variant-numeric: tabular-nums;
}

.free-num.none[b-65w7xpecx7] { color: var(--et-plan-soba-prljava); }

/* ---------- red sobe ---------- */

.room-row[b-65w7xpecx7] {
    position: relative;
    height: var(--row-h);
    border-bottom: 1px solid var(--et-table-line);
}

.room-row:last-child[b-65w7xpecx7] { border-bottom: none; }

/* Lijeva kolona je dugme: klik otvara panel sobe (čišćenje, pogon, bilješka, istorija). */
.room-label[b-65w7xpecx7] {
    position: sticky;
    left: 0;
    z-index: 6;
    background: var(--et-surface);
    border: none;
    border-right: 1px solid var(--et-border);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 1px;
    width: 100%;
    padding: 0 0.7rem;
    text-align: left;
    cursor: pointer;
    overflow: hidden;
}

.room-label:hover[b-65w7xpecx7] { background: var(--et-surface-alt); }

.room-line[b-65w7xpecx7] {
    display: flex;
    align-items: baseline;
    gap: 0.35rem;
    max-width: 100%;
}

.room-num[b-65w7xpecx7] {
    font-weight: 700;
    color: var(--et-text);
    font-size: 0.92rem;
    font-variant-numeric: tabular-nums;
}

.room-state[b-65w7xpecx7] {
    font-size: 0.64rem;
    color: var(--et-muted);
    white-space: nowrap;
    /* Natpis stiže rečenično („U čišćenju") jer je to podatak koji dijelimo s kasom; ovdje stoji
       uz broj sobe kao dodatak, pa se malo slovo bira OVDJE, u izgledu, a ne u kodu. */
    text-transform: lowercase;
}

.room-meta[b-65w7xpecx7] {
    font-size: 0.66rem;
    color: var(--et-faint);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

/* Kompaktno: red je 32 px — druga linija ne stane, pa tip i sprat idu u naslov (title). Sam
   izbor („staje li drugi red") je u RoomPlanLayout.ShowsRoomSubline, jer isto pitanje ima i kasa;
   ovdje ostaje samo veličina slova. */
.plan-kompaktno .room-num[b-65w7xpecx7] { font-size: 0.85rem; }

/* Stanje sobe uz broj sobe: boja PLUS oblik, da daltonista ne ostane bez poruke.
   ● spremna · ▲ prljava · ◆ u čišćenju · ■ van pogona. */
.rs[b-65w7xpecx7] {
    font-style: normal;
    font-size: 0.58rem;
    line-height: 1;
    flex-shrink: 0;
}

.rs-spremna[b-65w7xpecx7] { color: var(--et-plan-soba-spremna); }
.rs-prljava[b-65w7xpecx7] { color: var(--et-plan-soba-prljava); }
.rs-u_ciscenju[b-65w7xpecx7] { color: var(--et-plan-soba-ciscenje); }
.rs-van_pogona[b-65w7xpecx7] { color: var(--et-plan-soba-van-pogona); }

/* Prazna ćelija je <button>, ne div: bez toga recepcionar na tastaturi ne može otvoriti ni
   mali meni ni ijedan boravak. Ostaje da izgleda kao ćelija — dugmetu se skida sve što
   preglednik sam dodaje. */
.cell[b-65w7xpecx7] {
    appearance: none;
    -webkit-appearance: none;
    background: transparent;
    border: none;
    border-left: 1px solid var(--et-table-line);
    padding: 0;
    margin: 0;
    min-width: 0;
    font: inherit;
    color: inherit;
    cursor: pointer;
    transition: background 0.1s;
}

.cell.weekend[b-65w7xpecx7] { background: var(--et-surface-alt); }
.cell:hover[b-65w7xpecx7] { background: var(--et-accent-soft); }

/* ---------- trake ---------- */

.bars[b-65w7xpecx7] {
    position: absolute;
    top: 0;
    bottom: 0;
    left: var(--room-col);
    right: 0;
    pointer-events: none;
    z-index: 2;
}

/* Traka je <button> iz istog razloga kao ćelija: bez toga se nijedan boravak ne otvara
   tastaturom. Ispune (.bar-*) niže postavljaju svoj obrub, pa ovdje stoji „bez obruba" kao
   polazište; iste su specifičnosti, a dolaze poslije, pa pobjeđuju. */
.bar[b-65w7xpecx7] {
    pointer-events: auto;
    position: absolute;
    top: var(--bar-top);
    height: var(--bar-h);
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0 4px;
    cursor: pointer;
    overflow: hidden;
    white-space: nowrap;
    border-radius: 0;
    transition: filter 0.1s;
    appearance: none;
    -webkit-appearance: none;
    border: none;
    margin: 0;
    font-family: inherit;
    text-align: left;
}

.bar:hover[b-65w7xpecx7] {
    filter: brightness(1.06);
    z-index: 3;
}

/* Zaobljuje se SAMO vanjski kraj. Odsječeni kraj ostaje ravan — po njemu se vidi da
   boravak izlazi iz prozora. Radijus je sitan, ne 999: vlasnik je 08.09. tražio oštre
   linije, a pilula je upravo ono što je izbačeno. Sam broj stiže kao --bar-r iz
   RoomPlanLayout.BarCornerRadius, da ga kasa i ovaj ekran ne mogu imati različitog. */
.bar:not(.clip-s)[b-65w7xpecx7] {
    border-top-left-radius: var(--bar-r);
    border-bottom-left-radius: var(--bar-r);
}

.bar:not(.clip-e)[b-65w7xpecx7] {
    border-top-right-radius: var(--bar-r);
    border-bottom-right-radius: var(--bar-r);
}

/* Sitne okomite crtice na odsječenom kraju: „nastavlja se van prozora". */
.bar.clip-s[b-65w7xpecx7]::before,
.bar.clip-e[b-65w7xpecx7]::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 5px;
    background-image: repeating-linear-gradient(90deg, currentColor 0 1px, transparent 1px 3px);
    opacity: 0.6;
}

.bar.clip-s[b-65w7xpecx7]::before { left: 0; }
.bar.clip-e[b-65w7xpecx7]::after { right: 0; }

/* Pet ispuna, tačno onoliko koliko RoomPlanLayout.StateKey zna. Ispuna nosi SAMO stanje
   boravka — novac ide na ugao, stanje sobe u lijevu kolonu. */

.bar-upit[b-65w7xpecx7] {
    background-color: var(--et-plan-upit-bg);
    color: var(--et-plan-upit-fg);
    border: 1px dashed var(--et-plan-upit-line);
}

.bar-potvrdjeno[b-65w7xpecx7] {
    background-color: var(--et-plan-potvrdjeno-bg);
    color: var(--et-plan-potvrdjeno-fg);
}

.bar-ukuci[b-65w7xpecx7] {
    background-color: var(--et-plan-ukuci-bg);
    color: var(--et-plan-ukuci-fg);
}

.bar-zavrseno[b-65w7xpecx7] {
    background-color: var(--et-plan-zavrseno-bg);
    color: var(--et-plan-zavrseno-fg);
}

.bar-blokada[b-65w7xpecx7] {
    background-color: var(--et-plan-blokada-bg);
    background-image: repeating-linear-gradient(135deg, transparent 0 5px, var(--et-plan-blokada-line) 5px 6px);
    color: var(--et-plan-blokada-fg);
    border: 1px solid var(--et-plan-blokada-line);
}

/* Ugao = novac. Narandžasti trougao gore desno znači „ima šta da se naplati"; bez ugla je
   plaćeno. Nikad druga ispuna, da se ne pomiješa sa stanjem boravka. Ugao je pozadinski
   sloj, ne pseudo-element — ::before/::after su zauzeti oznakama odsjecanja. */
.bar.unpaid[b-65w7xpecx7] {
    background-image: linear-gradient(225deg, var(--et-plan-neplaceno) 0 10px, transparent 10px);
    background-repeat: no-repeat;
    padding-right: 12px;
}

/* Prekoračen odlazak (H5): gost u kući čije je jutro odlaska prošlo. Ispuna ostaje „u kući"
   (ispuna nosi samo stanje boravka), a crveni rub kaže da soba iza trake stoji prodana nikome.
   Rub, ne boja — da se ne pomiješa ni s prljavom sobom ni s neplaćenim uglom. */
.bar.overstay[b-65w7xpecx7] {
    box-shadow: inset 0 0 0 2px var(--et-danger);
}

/* Traka je vlastiti kontejner, pa `@container` niže može mjeriti NJU a ne ekran. Otkad se
   kolone rastežu, širina trake se zna tek pri crtanju u pregledniku — server bi računao po
   najužoj mogućoj koloni i na širokom monitoru pisao inicijale gdje ime stane. */
.bar[b-65w7xpecx7] {
    container-type: inline-size;
}

/* Podrazumijevano: samo inicijali. Sve krupnije se otkriva kad traka to zaista podnese —
   granice su iste kao u RoomPlanLayout.ContentFor, da se dvije površine ne raziđu. */
.bar-name[b-65w7xpecx7],
.bar-meta[b-65w7xpecx7],
.bar-amount[b-65w7xpecx7] {
    display: none;
}

@container (min-width: 72px) {
    .bar-ini[b-65w7xpecx7] { display: none; }
    .bar-name[b-65w7xpecx7] { display: block; }
}

@container (min-width: 150px) {
    .bar-meta[b-65w7xpecx7] { display: block; }
    .bar-amount[b-65w7xpecx7] { display: block; }
}

.bar-name[b-65w7xpecx7] {
    font-size: 0.78rem;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.bar-meta[b-65w7xpecx7] {
    font-size: 0.67rem;
    opacity: 0.85;
    flex-shrink: 0;
    font-variant-numeric: tabular-nums;
}

.bar-amount[b-65w7xpecx7] {
    font-size: 0.67rem;
    font-weight: 700;
    flex-shrink: 0;
    font-variant-numeric: tabular-nums;
}

.bar-ini[b-65w7xpecx7] {
    font-size: 0.7rem;
    font-weight: 700;
    margin: 0 auto;
}

/* ---------- fokus u mreži ----------

   Sve četvoro je dugme (ćelija, traka, broj sobe, grupa), pa fokus mora imati svoj prsten —
   bez njega je ekran tastaturom neupotrebljiv. Prsten je UVUČEN (outline-offset: -2px): ćelije
   nemaju razmaka između sebe, pa bi vanjski prsten legao preko susjeda. Time ostaje unutar
   vlastite ćelije i ne treba mu ni z-index ni promjena položaja — a to je i bitno, jer je
   lijeva kolona sticky (z-index 6) i svako diranje slojeva bi je pustilo ispod traka.
   Boja je akcent, token koji app.css nosi istovjetno u obje teme. */
.cell:focus-visible[b-65w7xpecx7],
.bar:focus-visible[b-65w7xpecx7],
.room-label:focus-visible[b-65w7xpecx7],
.group-label:focus-visible[b-65w7xpecx7] {
    outline: 2px solid var(--et-accent);
    outline-offset: -2px;
}

/* Trake se međusobno mogu dodirivati, pa fokusirana ide navrh — ali samo unutar .bars, koje
   je i samo sloj (z-index 2), pa ne može iskočiti preko zalijepljene kolone. */
.bar:focus-visible[b-65w7xpecx7] { z-index: 5; }

/* ---------- legenda ---------- */

.legend[b-65w7xpecx7] {
    display: flex;
    gap: 1.6rem;
    flex-wrap: wrap;
    margin-top: 0.7rem;
    font-size: 0.75rem;
    color: var(--et-muted);
}

.lg-set[b-65w7xpecx7] {
    display: flex;
    gap: 0.9rem;
    flex-wrap: wrap;
}

.lg[b-65w7xpecx7] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.lg-swatch[b-65w7xpecx7],
.lg-corner[b-65w7xpecx7],
.lg-clip[b-65w7xpecx7] {
    width: 18px;
    height: 11px;
    display: inline-block;
    flex-shrink: 0;
}

.lg-corner[b-65w7xpecx7] {
    background-color: var(--et-plan-potvrdjeno-bg);
    background-image: linear-gradient(225deg, var(--et-plan-neplaceno) 0 7px, transparent 7px);
    background-repeat: no-repeat;
}

.lg-clip[b-65w7xpecx7] {
    background-color: var(--et-plan-potvrdjeno-bg);
    background-image: repeating-linear-gradient(90deg, var(--et-plan-potvrdjeno-fg) 0 1px, transparent 1px 3px);
    background-size: 6px 100%;
    background-repeat: no-repeat;
    background-position: right center;
}

/* ---------- mali meni na praznoj ćeliji ---------- */

.menu-veil[b-65w7xpecx7] {
    position: fixed;
    inset: 0;
    z-index: 1030;
}

.cell-menu[b-65w7xpecx7] {
    position: fixed;
    z-index: 1035;
    min-width: 13rem;
    background: var(--et-surface);
    border: 1px solid var(--et-border);
    border-radius: var(--et-radius-sm);
    box-shadow: var(--et-shadow-soft);
    overflow: hidden;
}

.cm-head[b-65w7xpecx7] {
    padding: 0.45rem 0.8rem;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--et-faint);
    border-bottom: 1px solid var(--et-surface-alt);
    font-variant-numeric: tabular-nums;
}

.cm-item[b-65w7xpecx7] {
    display: block;
    width: 100%;
    background: none;
    border: none;
    padding: 0.55rem 0.8rem;
    text-align: left;
    font-size: 0.85rem;
    color: var(--et-text);
    cursor: pointer;
}

.cm-item:hover[b-65w7xpecx7] {
    background: var(--et-accent-soft);
    color: var(--et-on-accent-soft);
}

.cm-alt[b-65w7xpecx7] {
    color: var(--et-muted);
    font-size: 0.8rem;
    border-top: 1px solid var(--et-surface-alt);
}

/* ---------- prazno stanje ---------- */

.empty-card[b-65w7xpecx7] {
    background: var(--et-surface);
    border: 1px dashed var(--et-input-border);
    border-radius: var(--et-radius);
    text-align: center;
    padding: 3.5rem 2rem;
    max-width: 480px;
    margin: 3rem auto;
}

.empty-icon[b-65w7xpecx7] { font-size: 2.4rem; margin-bottom: 0.75rem; }

.empty-card h2[b-65w7xpecx7] {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--et-text);
}

.empty-card p[b-65w7xpecx7] {
    color: var(--et-muted);
    font-size: 0.9rem;
    margin-bottom: 1.25rem;
}

/* ---------- drawer ---------- */

.drawer-veil[b-65w7xpecx7] {
    position: fixed;
    inset: 0;
    background: rgb(15 23 42 / 0.35);
    z-index: 1040;
    animation: veil-in-b-65w7xpecx7 0.15s ease-out;
}

@keyframes veil-in-b-65w7xpecx7 {
    from { opacity: 0; }
}

.drawer[b-65w7xpecx7] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(420px, 94vw);
    background: var(--et-surface);
    z-index: 1050;
    box-shadow: -12px 0 40px rgb(15 23 42 / 0.18);
    display: flex;
    flex-direction: column;
    animation: drawer-in-b-65w7xpecx7 0.18s ease-out;
}

@keyframes drawer-in-b-65w7xpecx7 {
    from { transform: translateX(30px); opacity: 0; }
}

.drawer-head[b-65w7xpecx7] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1.35rem 1.5rem 1rem;
    border-bottom: 1px solid var(--et-surface-alt);
}

.drawer-kicker[b-65w7xpecx7] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    color: var(--et-accent);
    margin-bottom: 0.15rem;
}

.drawer-title[b-65w7xpecx7] {
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--et-text);
    margin: 0;
    font-variant-numeric: tabular-nums;
}

.drawer-x[b-65w7xpecx7] {
    background: none;
    border: none;
    color: var(--et-faint);
    font-size: 1rem;
    cursor: pointer;
    padding: 0.25rem;
}

.drawer-x:hover[b-65w7xpecx7] { color: var(--et-text); }

.drawer-body[b-65w7xpecx7] {
    padding: 1.25rem 1.5rem;
    overflow-y: auto;
    flex: 1;
}

.drawer-foot[b-65w7xpecx7] {
    display: flex;
    gap: 0.6rem;
    justify-content: flex-end;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--et-surface-alt);
}

.drawer-foot .form-control[b-65w7xpecx7] { flex: 1; }

/* Nedolazak nema razlog za upisati — ima rečenicu koja kaže šta dugme radi sa sobom i računom. */
.drawer-foot .foot-hint[b-65w7xpecx7] {
    flex: 1;
    align-self: center;
    font-size: 0.78rem;
    color: var(--et-muted);
}

.drawer-alt[b-65w7xpecx7] {
    background: none;
    border: none;
    color: var(--et-muted);
    font-size: 0.8rem;
    text-decoration: underline;
    cursor: pointer;
    padding: 0 1.5rem 1.1rem;
    text-align: left;
}

.drawer-alt:hover[b-65w7xpecx7] { color: var(--et-accent); }

/* panel sobe */

.room-state-row[b-65w7xpecx7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.88rem;
    color: var(--et-text);
    margin-top: 0.3rem;
}

.room-state-row .rs[b-65w7xpecx7] { font-size: 0.7rem; }

/* drawer form bits */

.f-row2[b-65w7xpecx7] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

.f-label[b-65w7xpecx7] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--et-muted);
    margin-bottom: 0.25rem;
    display: block;
}

.f-hint[b-65w7xpecx7] {
    font-size: 0.75rem;
    color: var(--et-accent);
    font-weight: 600;
    margin: 0.35rem 0 0.9rem;
}

.guest-matches[b-65w7xpecx7] {
    border: 1px solid var(--et-border);
    border-radius: 10px;
    margin-top: 0.4rem;
    overflow: hidden;
}

.guest-match[b-65w7xpecx7] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    background: var(--et-surface);
    border: none;
    border-bottom: 1px solid var(--et-surface-alt);
    padding: 0.5rem 0.8rem;
    font-size: 0.85rem;
    color: var(--et-text);
    cursor: pointer;
    text-align: left;
}

.guest-match:last-child[b-65w7xpecx7] { border-bottom: none; }
.guest-match:hover[b-65w7xpecx7] { background: var(--et-bg); }
.guest-match.picked[b-65w7xpecx7] { background: var(--et-accent-soft); }

.gm-phone[b-65w7xpecx7] {
    color: var(--et-faint);
    font-size: 0.75rem;
}

.picked-chip[b-65w7xpecx7] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--et-accent-soft);
    color: var(--et-on-accent-soft);
    border: 1px solid var(--et-accent-soft);
    border-radius: 999px;
    padding: 0.3rem 0.9rem;
    font-size: 0.85rem;
    font-weight: 600;
    margin-top: 0.6rem;
}

.picked-chip button[b-65w7xpecx7] {
    background: none;
    border: none;
    color: var(--et-accent-glow);
    cursor: pointer;
    font-size: 0.75rem;
    padding: 0;
}

/* detail view */

.status-pill[b-65w7xpecx7] {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 999px;
    padding: 0.25rem 0.8rem;
    margin-bottom: 1rem;
}

.st-potvrdjeno[b-65w7xpecx7] { background: var(--et-accent-soft); color: var(--et-on-accent-soft); }
.st-ukuci[b-65w7xpecx7] { background: var(--et-chip-green-bg); color: var(--et-chip-green-fg); }
.st-upit[b-65w7xpecx7] { background: var(--et-chip-amber-bg); color: var(--et-chip-amber-fg); }
.st-zavrseno[b-65w7xpecx7] { background: var(--et-surface-alt); color: var(--et-muted); }
.st-blokada[b-65w7xpecx7] { background: var(--et-surface-alt); color: var(--et-muted); }

.detail-room[b-65w7xpecx7] {
    background: var(--et-bg);
    border: 1px solid var(--et-border);
    border-radius: 10px;
    padding: 0.8rem 1rem;
    margin-bottom: 0.75rem;
}

/* Soba čiju je traku recepcionar dodirnuo — nad njom rade premještaj i „dodaj saputnika".
   Kod boravka s jednom sobom se ne ističe ništa, jer nema šta razlikovati. */
.detail-room.is-touched[b-65w7xpecx7] {
    border-color: var(--et-accent);
    background: var(--et-accent-soft);
}

.dr-num[b-65w7xpecx7] {
    font-weight: 700;
    color: var(--et-text);
    margin-bottom: 0.1rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

/* Puna akcentna i njeno mastilo — isti par kojim se crta traka „potvrđeno", jedini par
   akcenta koji app.css nosi u OBJE teme. */
.dr-tag[b-65w7xpecx7] {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    background: var(--et-plan-potvrdjeno-bg);
    color: var(--et-plan-potvrdjeno-fg);
    border-radius: 999px;
    padding: 0.1rem 0.5rem;
}

.dr-dates[b-65w7xpecx7] {
    font-size: 0.85rem;
    color: var(--et-text);
    font-variant-numeric: tabular-nums;
}

.dr-meta[b-65w7xpecx7] {
    font-size: 0.75rem;
    color: var(--et-muted);
    margin-top: 0.15rem;
}

.detail-total[b-65w7xpecx7] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    border-top: 2px solid var(--et-text);
    margin-top: 1rem;
    padding-top: 0.6rem;
    font-size: 0.9rem;
    color: var(--et-text);
}

.detail-total strong[b-65w7xpecx7] {
    font-size: 1.25rem;
    color: var(--et-text);
    font-variant-numeric: tabular-nums;
}

.detail-line[b-65w7xpecx7] {
    display: flex;
    justify-content: space-between;
    font-size: 0.85rem;
    color: var(--et-muted);
    margin-top: 0.3rem;
    font-variant-numeric: tabular-nums;
}

/* folio */

.folio-head[b-65w7xpecx7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 1.25rem;
}

.folio-closed[b-65w7xpecx7] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    background: var(--et-chip-green-bg);
    color: var(--et-chip-green-fg);
    border-radius: 999px;
    padding: 0.2rem 0.7rem;
}

.folio-refresh[b-65w7xpecx7] {
    background: none;
    border: none;
    color: var(--et-faint);
    font-size: 0.95rem;
    cursor: pointer;
    padding: 0 0.25rem;
}

.folio-refresh:hover[b-65w7xpecx7] { color: var(--et-accent); }

.folio-lines[b-65w7xpecx7] {
    border: 1px solid var(--et-border);
    border-radius: 10px;
    margin-top: 0.4rem;
    overflow: hidden;
}

.folio-line[b-65w7xpecx7] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.45rem 0.8rem;
    font-size: 0.83rem;
    color: var(--et-text);
    border-bottom: 1px solid var(--et-surface-alt);
}

.folio-line:last-child[b-65w7xpecx7] { border-bottom: none; }

.folio-line.neg .fl-amount[b-65w7xpecx7] { color: var(--et-chip-red-fg); }

.fl-desc[b-65w7xpecx7] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fl-amount[b-65w7xpecx7] {
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

.folio-add[b-65w7xpecx7] {
    background: none;
    border: none;
    color: var(--et-accent);
    font-size: 0.8rem;
    cursor: pointer;
    padding: 0;
    margin-top: 0.75rem;
    display: block;
}

.folio-add:hover[b-65w7xpecx7] { text-decoration: underline; }
.folio-add:disabled[b-65w7xpecx7] { opacity: 0.5; cursor: default; text-decoration: none; }

.service-row[b-65w7xpecx7] {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    background: var(--et-surface);
    border: 1px solid var(--et-border);
    border-radius: 10px;
    padding: 0.55rem 0.8rem;
    margin-bottom: 0.4rem;
    cursor: pointer;
    text-align: left;
}

.service-row:hover:not(:disabled)[b-65w7xpecx7] {
    border-color: var(--et-accent);
    background: var(--et-bg);
}

.service-row:disabled[b-65w7xpecx7] { opacity: 0.5; cursor: default; }

.sr-name[b-65w7xpecx7] {
    font-size: 0.85rem;
    color: var(--et-text);
    font-weight: 600;
}

.sr-dur[b-65w7xpecx7] {
    font-size: 0.7rem;
    color: var(--et-faint);
    font-weight: 500;
    margin-left: 0.4rem;
}

.sr-price[b-65w7xpecx7] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--et-text);
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

.folio-form[b-65w7xpecx7] {
    background: var(--et-bg);
    border: 1px solid var(--et-border);
    border-radius: 10px;
    padding: 0.8rem;
    margin-top: 0.6rem;
}

.folio-form-foot[b-65w7xpecx7] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.7rem;
}

/* ---- Premještaj (20.10.2026.): soba koju je gost napustio i izbor cijene ---- */

/* Odspavane noći u staroj sobi: prigušeno, kao završena traka na planu. */
.detail-room.is-left[b-65w7xpecx7] {
    opacity: 0.75;
}

.dr-tag.dr-left[b-65w7xpecx7] {
    background: var(--et-plan-zavrseno-bg);
    color: var(--et-plan-zavrseno-fg);
}

.premjestaj .form-control[b-65w7xpecx7],
.premjestaj .form-select[b-65w7xpecx7] {
    margin-bottom: 0.35rem;
}

.premjestaj details summary[b-65w7xpecx7] {
    cursor: pointer;
}

.premjestaj-cijena[b-65w7xpecx7] {
    border: 0;
    margin: 0.4rem 0 0;
    padding: 0;
}

/* Dvije ponude kao kartice za klik — cijela kartica je labela radio dugmeta. */
.premjestaj-opcija[b-65w7xpecx7] {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 0.55rem;
    align-items: start;
    border: 1px solid var(--et-border);
    border-radius: 8px;
    padding: 0.5rem 0.65rem;
    margin-bottom: 0.4rem;
    background: var(--et-surface);
    cursor: pointer;
}

.premjestaj-opcija input[b-65w7xpecx7] {
    grid-row: span 2;
    margin-top: 0.2rem;
}

.premjestaj-opcija:has(input:checked)[b-65w7xpecx7] {
    border-color: var(--et-accent);
    background: var(--et-accent-soft);
}

.premjestaj-opcija.is-off[b-65w7xpecx7] {
    opacity: 0.6;
    cursor: default;
}

.po-naslov[b-65w7xpecx7] {
    font-weight: 600;
    font-size: 0.85rem;
}

.po-detalj[b-65w7xpecx7] {
    font-size: 0.78rem;
    color: var(--et-muted);
    font-variant-numeric: tabular-nums;
}

.detail-note[b-65w7xpecx7] {
    margin-top: 1rem;
    font-size: 0.85rem;
    color: var(--et-muted);
    background: var(--et-note-bg);
    border: 1px solid var(--et-note-border);
    border-radius: 8px;
    padding: 0.6rem 0.8rem;
    white-space: pre-wrap;
}

/* Quantity above the list: one number, applied to whatever is tapped next. */
.sr-qty-row[b-65w7xpecx7] {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: .35rem 0 .5rem;
    font-size: .78rem;
    color: var(--bs-secondary-color, var(--et-muted));
}

.sr-qty[b-65w7xpecx7] {
    width: 4.5rem;
    padding: .25rem .5rem;
    border: 1px solid var(--bs-border-color, var(--et-input-border));
    border-radius: .5rem;
    font-size: .9rem;
    font-weight: 600;
    text-align: center;
}

.sr-qty-hint[b-65w7xpecx7] { font-style: italic; }

.sr-unit[b-65w7xpecx7] {
    display: block;
    font-size: .68rem;
    font-weight: 400;
    opacity: .7;
}

/* gosti boravka i spremnost za prijavu — isti tokeni kao statusne pilule */

.reg-pill[b-65w7xpecx7] {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-radius: 999px;
    padding: 0.22rem 0.7rem;
}

.reg-pill.ok[b-65w7xpecx7] { background: var(--et-chip-green-bg); color: var(--et-chip-green-fg); }
.reg-pill.bad[b-65w7xpecx7] { background: var(--et-chip-red-bg); color: var(--et-chip-red-fg); }

.reg-missing[b-65w7xpecx7] {
    font-size: 0.78rem;
    color: var(--et-chip-red-fg);
    margin-top: 0.35rem;
}

/* Izmjena koju server nije prepisao, i upozorenje koje ne zaustavlja (npr. kontrolna cifra
   JMB-a): žuto, ne crveno — nije greška nego razlika koju neko mora pogledati. */
.reg-clash[b-65w7xpecx7] {
    font-size: 0.78rem;
    line-height: 1.4;
    color: var(--et-warning-soft-fg);
    background: var(--et-warning-soft);
    border-radius: var(--et-radius-sm);
    padding: 0.4rem 0.6rem;
    margin-top: 0.4rem;
}

.reg-saved[b-65w7xpecx7] {
    font-size: 0.78rem;
    color: var(--et-chip-green-fg);
    background: var(--et-chip-green-bg);
    border-radius: var(--et-radius-sm);
    padding: 0.4rem 0.6rem;
    margin-top: 0.4rem;
}

/* Sukob uz jednog gosta: iste boje kao zbir iznad (žuto — razlika, ne greška), sitnije, s
   dugmetom za potvrdu u istom okviru da se vidi ŠTA se potvrđuje. */
.gr-clash[b-65w7xpecx7] {
    font-size: 0.74rem;
    line-height: 1.4;
    color: var(--et-warning-soft-fg);
    background: var(--et-warning-soft);
    border-radius: var(--et-radius-sm);
    padding: 0.35rem 0.55rem;
    margin-top: 0.25rem;
}

.gr-clash .gr-btn[b-65w7xpecx7] {
    margin-top: 0.2rem;
    color: var(--et-warning-soft-fg);
    font-weight: 600;
}

.guest-rows[b-65w7xpecx7] {
    border: 1px solid var(--et-border);
    border-radius: 10px;
    margin-top: 0.5rem;
    overflow: hidden;
}

.guest-row[b-65w7xpecx7] {
    padding: 0.5rem 0.8rem;
    border-bottom: 1px solid var(--et-surface-alt);
}

.guest-row:last-child[b-65w7xpecx7] { border-bottom: none; }

.gr-top[b-65w7xpecx7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.gr-name[b-65w7xpecx7] {
    font-weight: 600;
    color: var(--et-text);
    font-size: 0.88rem;
}

.gr-tag[b-65w7xpecx7] {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    background: var(--et-accent-soft);
    color: var(--et-on-accent-soft);
    border-radius: 999px;
    padding: 0.1rem 0.5rem;
}

.gr-room[b-65w7xpecx7] {
    font-size: 0.72rem;
    color: var(--et-faint);
    margin-left: auto;
}

.gr-meta[b-65w7xpecx7] {
    font-size: 0.76rem;
    color: var(--et-muted);
    margin-top: 0.1rem;
}

.gr-missing[b-65w7xpecx7] {
    font-size: 0.74rem;
    color: var(--et-chip-red-fg);
    margin-top: 0.1rem;
}

.gr-actions[b-65w7xpecx7] {
    display: flex;
    gap: 0.9rem;
    margin-top: 0.25rem;
}

.gr-btn[b-65w7xpecx7] {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.76rem;
    color: var(--et-accent);
    cursor: pointer;
}

.gr-btn:hover[b-65w7xpecx7] { text-decoration: underline; }
.gr-btn.danger[b-65w7xpecx7] { color: var(--et-chip-red-fg); }
.gr-btn:disabled[b-65w7xpecx7] { opacity: 0.5; cursor: default; }
/* _content/Etiris.PosErp.BackOffice/Components/Pages/Prijavnica.razor.rz.scp.css */
/* Štampana prijavnica (20.10.2026.). List je .izvod-papir iz app.css (A4 na ekranu, goli papir
   u štampi); ovdje je samo ono što je prijavnici svoje: blok po gostu, polja kao crte za ruku i
   linije za potpis. Bez medijskog upita osim štampe — list se na telefonu suzi sam. */

.pr-objekat[b-ncbcnsj0o9] {
    margin-bottom: .75rem;
    line-height: 1.3;
}

.pr-gost[b-ncbcnsj0o9] {
    margin-top: 1rem;
    padding-top: .6rem;
    border-top: 1px solid var(--et-border);
    /* Gost se ne cijepa na dva lista: potpis mora stajati uz podatke koje potpisuje. */
    break-inside: avoid;
    page-break-inside: avoid;
}

.pr-gost-naslov[b-ncbcnsj0o9] {
    font-weight: 700;
    margin-bottom: .35rem;
}

.pr-polja[b-ncbcnsj0o9] {
    width: 100%;
    border-collapse: collapse;
}

.pr-polja th[b-ncbcnsj0o9] {
    width: 38%;
    padding: .28rem .5rem .28rem 0;
    font-weight: 500;
    color: var(--et-faint);
    vertical-align: bottom;
    white-space: nowrap;
}

/* Vrijednost stoji na crti — prazno polje je crta za ruku, iste visine kao popunjeno. */
.pr-polja td[b-ncbcnsj0o9] {
    padding: .28rem 0;
    min-height: 1.6rem;
    height: 1.6rem;
    border-bottom: 1px dotted var(--et-faint);
    vertical-align: bottom;
}

.pr-fali[b-ncbcnsj0o9] {
    margin-top: .35rem;
    font-size: .8rem;
    color: var(--et-warning-soft-fg);
}

.pr-izjava[b-ncbcnsj0o9] {
    margin: .6rem 0 .2rem;
    font-size: .78rem;
    color: var(--et-faint);
}

.pr-potpis[b-ncbcnsj0o9] {
    display: flex;
    align-items: flex-end;
    gap: .6rem;
    margin-top: .9rem;
}

.pr-potpis > span:first-child[b-ncbcnsj0o9] {
    white-space: nowrap;
}

.pr-crta[b-ncbcnsj0o9] {
    flex: 1;
    min-width: 8rem;
    border-bottom: 1px solid currentColor;
    height: 1.4rem;
}

.pr-dno[b-ncbcnsj0o9] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;
    gap: 1rem;
    margin-top: 1.6rem;
    padding-top: .6rem;
    border-top: 1.5px solid currentColor;
    break-inside: avoid;
    page-break-inside: avoid;
}

.pr-dno .pr-potpis[b-ncbcnsj0o9] {
    flex: 0 1 60%;
    margin-top: 0;
}

@media print {
    .pr-polja th[b-ncbcnsj0o9],
    .pr-izjava[b-ncbcnsj0o9] {
        color: #333 !important;
    }

    .pr-polja td[b-ncbcnsj0o9] {
        border-bottom: 1px dotted #555 !important;
    }

    .pr-gost[b-ncbcnsj0o9] {
        border-top: 1px solid #999 !important;
    }
}
/* _content/Etiris.PosErp.BackOffice/Components/Pages/SobeSifrarnici.razor.rz.scp.css */
.pg-head[b-dmmaxjwok9] {
    margin-bottom: 1.1rem;
}

.pg-title[b-dmmaxjwok9] {
    font-size: 1.45rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--et-text);
    margin: 0;
}

.pg-sub[b-dmmaxjwok9] {
    color: var(--et-muted);
    font-size: 0.85rem;
}

/* tabs */

.tabs[b-dmmaxjwok9] {
    display: inline-flex;
    background: var(--et-surface-alt);
    border-radius: 10px;
    padding: 3px;
    margin-bottom: 1.25rem;
    gap: 2px;
}

.tab[b-dmmaxjwok9] {
    border: none;
    background: none;
    padding: 0.42rem 1.1rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--et-muted);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.12s;
}

.tab:hover[b-dmmaxjwok9] { color: var(--et-text); }

.tab.on[b-dmmaxjwok9] {
    background: var(--et-surface);
    color: var(--et-text);
    box-shadow: 0 1px 2px rgb(15 23 42 / 0.08);
}

/* layout */

.two-col[b-dmmaxjwok9] {
    display: grid;
    grid-template-columns: minmax(300px, 1.4fr) minmax(280px, 1fr);
    gap: 1.25rem;
    align-items: start;
}

@media (max-width: 900px) {
    .two-col[b-dmmaxjwok9] { grid-template-columns: 1fr; }
}

.list-card[b-dmmaxjwok9] {
    background: var(--et-surface);
    border: 1px solid var(--et-border);
    border-radius: 14px;
    box-shadow: 0 1px 3px rgb(15 23 42 / 0.06);
    overflow: hidden;
}

.row-item[b-dmmaxjwok9] {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    width: 100%;
    background: var(--et-surface);
    border: none;
    border-bottom: 1px solid var(--et-surface-alt);
    padding: 0.7rem 1rem;
    font-size: 0.88rem;
    text-align: left;
    cursor: pointer;
    transition: background 0.1s;
}

.row-item:last-child[b-dmmaxjwok9] { border-bottom: none; }
.row-item:hover[b-dmmaxjwok9] { background: var(--et-bg); }
.row-item.sel[b-dmmaxjwok9] { background: var(--et-accent-soft); }
.row-item.static[b-dmmaxjwok9] { cursor: default; }

.ri-code[b-dmmaxjwok9] {
    font-weight: 700;
    color: var(--et-text);
    min-width: 3.2rem;
    font-variant-numeric: tabular-nums;
}

.ri-main[b-dmmaxjwok9] {
    color: var(--et-text);
    flex: 1;
}

.ri-meta[b-dmmaxjwok9] {
    color: var(--et-faint);
    font-size: 0.78rem;
}

.ri-price[b-dmmaxjwok9] {
    font-weight: 700;
    color: var(--et-text);
    font-variant-numeric: tabular-nums;
}

.ri-off[b-dmmaxjwok9] {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--et-chip-red-fg);
    background: var(--et-chip-red-bg);
    border-radius: 999px;
    padding: 0.15rem 0.6rem;
}

.ri-del[b-dmmaxjwok9] {
    background: none;
    border: none;
    color: var(--et-input-border);
    cursor: pointer;
    font-size: 0.85rem;
    padding: 0.2rem 0.4rem;
}

.ri-del:hover[b-dmmaxjwok9] { color: #dc2626; }

.mono[b-dmmaxjwok9] { font-variant-numeric: tabular-nums; }

/* stanje pogona sobe (F7): žuto je kvar (vraća se), crveno je van inventara (ne vraća se) */

.ri-state[b-dmmaxjwok9] {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    border-radius: 999px;
    padding: 0.15rem 0.6rem;
    white-space: nowrap;
}

.ri-state.van_pogona[b-dmmaxjwok9] {
    color: var(--et-chip-amber-fg);
    background: var(--et-chip-amber-bg);
}

.ri-state.van_inventara[b-dmmaxjwok9] {
    color: var(--et-chip-red-fg);
    background: var(--et-chip-red-bg);
}

.ri-state.u_pogonu[b-dmmaxjwok9] {
    color: var(--et-chip-green-fg);
    background: var(--et-chip-green-bg);
}

/* desna kolona: obrazac sobe i kartica stanja jedno ispod drugog */

.stack[b-dmmaxjwok9] {
    display: grid;
    gap: 1.25rem;
}

.state-now[b-dmmaxjwok9] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: var(--et-text);
    margin-bottom: 0.9rem;
}

.state-why[b-dmmaxjwok9] { color: var(--et-muted); }

.affected[b-dmmaxjwok9] {
    margin: 0.4rem 0 0;
    padding-left: 1.1rem;
    font-size: 0.85rem;
}

/* istorija sobe */

.hist-title[b-dmmaxjwok9] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--et-muted);
    margin: 1.25rem 0 0.4rem;
}

.hist[b-dmmaxjwok9] {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.8rem;
}

.hist li[b-dmmaxjwok9] {
    display: flex;
    gap: 0.6rem;
    padding: 0.35rem 0;
    border-top: 1px solid var(--et-surface-alt);
}

.hist-when[b-dmmaxjwok9] {
    color: var(--et-faint);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.hist-what[b-dmmaxjwok9] {
    color: var(--et-text);
    flex: 1;
}

.hist-who[b-dmmaxjwok9] {
    color: var(--et-muted);
    white-space: nowrap;
}

/* form card */

.form-card[b-dmmaxjwok9] {
    background: var(--et-surface);
    border: 1px solid var(--et-border);
    border-radius: 14px;
    box-shadow: 0 1px 3px rgb(15 23 42 / 0.06);
    padding: 1.25rem 1.4rem 1.4rem;
}

.form-card.narrow[b-dmmaxjwok9] { max-width: 460px; }

.fc-title[b-dmmaxjwok9] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--et-text);
    margin-bottom: 1rem;
}

.f-row2[b-dmmaxjwok9] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

.f-label[b-dmmaxjwok9] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--et-muted);
    margin-bottom: 0.25rem;
    display: block;
}

.check[b-dmmaxjwok9] {
    display: block;
    font-size: 0.85rem;
    color: var(--et-text);
    margin-top: 0.35rem;
}

/* Kvadratići su sad form-check-input (tema ih boji); Bootstrap im daje vertical-align:top,
   što ih uz jednoredni natpis podigne — vraćamo na sredinu reda. */
.check input[b-dmmaxjwok9] { margin-right: 0.45rem; vertical-align: middle; margin-top: 0; }

.fc-foot[b-dmmaxjwok9] {
    display: flex;
    justify-content: flex-end;
    gap: 0.6rem;
    margin-top: 1.1rem;
}

/* pristojba (F6): podnaslov unutar kartice objekta i objašnjenje ispod polja */

.fc-sub[b-dmmaxjwok9] {
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--et-text);
    margin: 1.25rem 0 0.6rem;
    padding-top: 0.9rem;
    border-top: 1px solid var(--et-surface-alt);
}

.fc-hint[b-dmmaxjwok9] {
    color: var(--et-muted);
    font-size: 0.78rem;
    margin: 0.6rem 0 0;
}
/* _content/Etiris.PosErp.BackOffice/Components/RealtimeDot.razor.rz.scp.css */
/* Tačkica veze uživo — samo tokeni (--et-*), pa tamna tema radi sama. Tiha po namjeri:
   sitno, uz naslov, ne takmiči se sa KPI-jevima. */

.rt[b-tko8ndhmqz] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.78rem;
    color: var(--et-muted);
    white-space: nowrap;
    cursor: default;
}

.rt-dot[b-tko8ndhmqz] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--et-faint);
    border: 1px solid var(--et-border);
    box-sizing: border-box;
}

.rt.on .rt-dot[b-tko8ndhmqz] {
    background: var(--et-success);
    border-color: var(--et-success);
}

.rt.on[b-tko8ndhmqz] {
    color: var(--et-text);
}
/* _content/Etiris.PosErp.BackOffice/Components/StayEditDrawer.razor.rz.scp.css */
/* Ista ladica kao u planu soba (.drawer), pod svojim imenom — scoped stil stranice ne dopire
   ovamo. Samo tokeni teme. */

.sed-veil[b-q2wmlg7z4e] {
    position: fixed;
    inset: 0;
    background: rgb(15 23 42 / 0.35);
    z-index: 1040;
    animation: sed-veil-in-b-q2wmlg7z4e 0.15s ease-out;
}

@keyframes sed-veil-in-b-q2wmlg7z4e {
    from { opacity: 0; }
}

.sed[b-q2wmlg7z4e] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(420px, 94vw);
    background: var(--et-surface);
    z-index: 1050;
    box-shadow: -12px 0 40px rgb(15 23 42 / 0.18);
    display: flex;
    flex-direction: column;
    animation: sed-in-b-q2wmlg7z4e 0.18s ease-out;
}

@keyframes sed-in-b-q2wmlg7z4e {
    from { transform: translateX(30px); opacity: 0; }
}

.sed-head[b-q2wmlg7z4e] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1.35rem 1.5rem 1rem;
    border-bottom: 1px solid var(--et-surface-alt);
}

.sed-kicker[b-q2wmlg7z4e] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    color: var(--et-accent);
    margin-bottom: 0.15rem;
}

.sed-title[b-q2wmlg7z4e] {
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--et-text);
    margin: 0;
}

.sed-x[b-q2wmlg7z4e] {
    background: none;
    border: none;
    color: var(--et-faint);
    font-size: 1rem;
    cursor: pointer;
    padding: 0.25rem;
}

.sed-x:hover[b-q2wmlg7z4e] { color: var(--et-text); }

.sed-body[b-q2wmlg7z4e] {
    padding: 1.25rem 1.5rem;
    overflow-y: auto;
    flex: 1;
}

.sed-link[b-q2wmlg7z4e] {
    display: block;
    margin-top: 1.1rem;
    font-size: 0.8rem;
    color: var(--et-muted);
    text-decoration: underline;
}

.sed-link:hover[b-q2wmlg7z4e] { color: var(--et-accent); }
/* _content/Etiris.PosErp.BackOffice/Components/StayEditForm.razor.rz.scp.css */
/* Isti idiomi kao obrasci u drawer-u plana soba (f-row2 / f-label / f-hint), ali pod svojim
   imenom: scoped CSS stranice ne dopire u dijete-komponentu, pa obrazac nosi svoje. Boje su
   samo tokeni teme — obrazac stoji i u svijetloj i u tamnoj. */

.se[b-32aqcx36iw] { display: block; }

.se-row2[b-32aqcx36iw] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

.se-label[b-32aqcx36iw] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--et-muted);
    margin: 0.55rem 0 0.25rem;
    display: block;
}

/* Živi red: „5 noći · promjena +2 noći" — akcentna tinta kao i ostali f-hint redovi. */
.se-hint[b-32aqcx36iw] {
    font-size: 0.75rem;
    color: var(--et-accent);
    font-weight: 600;
    margin: 0.35rem 0 0.2rem;
}

/* Zašto je obrazac ugašen (otkazan, nedolazak, odjavljen) — upozorenje; .soft je ograničenje
   (prijavljen gost: dolazak stoji), informativno. */
.se-reason[b-32aqcx36iw] {
    font-size: 0.8rem;
    color: var(--et-warning-soft-fg);
    background: var(--et-warning-soft);
    border: 1px solid var(--et-border);
    border-radius: 8px;
    padding: 0.5rem 0.7rem;
    margin-bottom: 0.4rem;
}

.se-reason.soft[b-32aqcx36iw] {
    color: var(--et-info-soft-fg);
    background: var(--et-info-soft);
}

.se-alert[b-32aqcx36iw] {
    font-size: 0.8rem;
    padding: 0.5rem 0.7rem;
    margin: 0.5rem 0;
}

.se-changes[b-32aqcx36iw] {
    margin: 0.35rem 0 0;
    padding-left: 1.1rem;
}

/* Šta boravak sada nosi; poslije snimanja isti blok dobija zeleni rub — „ovo je novo stanje". */
.se-state[b-32aqcx36iw] {
    margin-top: 0.75rem;
    background: var(--et-surface);
    border: 1px solid var(--et-border);
    border-radius: 8px;
    padding: 0.55rem 0.7rem;
}

.se-state.saved[b-32aqcx36iw] { border-color: var(--et-success); }

.se-state-head[b-32aqcx36iw] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--et-muted);
}

.se-state.saved .se-state-head span[b-32aqcx36iw] { color: var(--et-success); }

.se-state-head strong[b-32aqcx36iw] {
    color: var(--et-text);
    font-variant-numeric: tabular-nums;
}

.se-room[b-32aqcx36iw] {
    font-size: 0.78rem;
    color: var(--et-text);
    font-variant-numeric: tabular-nums;
    margin-top: 0.2rem;
}

.se-foot[b-32aqcx36iw] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.7rem;
}