h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

/* --- Apskaitos kainodara: bendras puslapio karkasas --- */

:root {
    --ak-ink: #1c2530;
    --ak-muted: #5b6472;
    --ak-border: #dde2e8;
    --ak-accent: #2a5d8f;
    --ak-accent-dark: #1f4569;
    --ak-bg: #f6f7f9;
    --ak-surface: #ffffff;
    --ak-error: #b3261e;
    --ak-error-bg: #fdecea;
    --ak-ok-bg: #eaf5ec;
    --ak-ok: #1e6b34;
    /* 2026-09-13 audito ratas (Balance.razor "Buhalterių mini-kabinetai" įspėjimo dėžutė,
       vartotojo prašymu) - GINTARINĖ ("caution", NE "error") pora - veiksmas (paslaugos
       aktyvavimas) NĖRA klaida/pavojus, TIK reikalauja SĄMONINGO dėmesio PRIEŠ paspaudžiant
       (realaus finansinio įsipareigojimo rizika, žr. ".balance-commitment-warning" žemiau). */
    --ak-warning: #8a5a00;
    --ak-warning-bg: #fff6e5;
    --ak-warning-border: #f0c975;

    /* Švelnūs, tarpusavyje skirtingi rezultatų langelių ("calc-result__tile") fonai - vartotojo
       pastebėta, kad visi langeliai VIENODOS (baltos) spalvos sunkiai atskiriami vienas nuo
       kito iš karto. Ciklas kas 4 langelius (žr. .calc-result__tile:nth-child). */
    --ak-tile-bg-1: #eef4fb;
    --ak-tile-bg-2: #eef7ef;
    --ak-tile-bg-3: #fdf3e7;
    --ak-tile-bg-4: #f4eef9;
}

body {
    margin: 0;
    background: var(--ak-bg);
    color: var(--ak-ink);
    font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
}

.app-shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* Neprisijungusio vartotojo (viešo) puslapio viršutinė juosta - TA PATI tamsi navy gradiento
   dizaino kalba, kaip AuthLayout.razor prekės ženklo skydelis (žr. ".auth-brand" žemiau), kad
   pirmas įspūdis (šis puslapis) ir Prisijungimo/Registracijos ekranai atrodytų VIENOS programos
   dalimi, o ne dviem skirtingais produktais. */
.topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.9rem 1.5rem;
    background: linear-gradient(160deg, var(--ak-accent-dark) 0%, #16324a 60%, #0f2436 100%);
}

.topbar__brand {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    font-family: "Outfit", system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.05rem;
    color: #fff;
    text-decoration: none;
}

.topbar__logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.22);
    font-family: "Outfit", system-ui, sans-serif;
    font-size: 0.8rem;
    letter-spacing: 0.02em;
    flex-shrink: 0;
}

.topbar__nav {
    display: flex;
    align-items: center;
    gap: 1.1rem;
}

/* Pavadinta klasė (NE bendras ".topbar__nav a" žymos žymiklis) - kad specifiškumas NESUSIKIRSTŲ
   su ".btn-primary" (baltu tekstu ant mėlyno mygtuko) tuoj pat dešinėje, žr. Registruotis mygtuką
   markup'e. */
.topbar__nav-link {
    color: rgba(255, 255, 255, 0.85);
    text-decoration: none;
    font-size: 0.92rem;
}

/* PATAISYMAS: ".topbar" pati NEturi "color" savybės, taigi ".lang-switcher" (color:inherit,
   žr. app.css aukščiau) paveldėjo NUMATYTĄJĮ TAMSŲ tekstą - beveik nematomą tamsiai
   mėlyname fone (vartotojo pastebėta - jungiklis "trūksta" pradiniame ekrane, nors iš
   tikro TIK nematomas). Eksplicitiška spalva ČIA, TA PATI, kaip .topbar__nav-link. */
.topbar .lang-switcher {
    color: rgba(255, 255, 255, 0.85);
}

.topbar__nav-link:hover {
    color: #fff;
    text-decoration: underline;
}

/* 4 ratas, Fazė E - kalbos (LT/ENG) jungiklis (žr. Components/Layout/LanguageSwitcher.razor).
   SĄMONINGAI "color: inherit" - komponentas naudojamas ir tamsiame fone (topbar/auth-brand),
   ir šviesiame (sidebar__footer), TODĖL spalva turi paveldėti iš aplinkos, ne būti fiksuota. */
.lang-switcher {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
    font-weight: 600;
}

.lang-switcher__sep {
    opacity: 0.4;
}

.lang-switcher__link {
    color: inherit;
    text-decoration: none;
    opacity: 0.55;
}

.lang-switcher__link:hover {
    opacity: 0.85;
}

.lang-switcher__link--active {
    opacity: 1;
    text-decoration: underline;
}

.topbar__user {
    color: var(--ak-muted);
    font-size: 0.9rem;
}

.app-main {
    flex: 1;
    max-width: 960px;
    width: 100%;
    margin: 0 auto;
    padding: 2rem 1.5rem 3rem;
    box-sizing: border-box;
}

/* Leidžia ".home-landing" (žr. žemiau) ištrūkti iš 960px pločio ribos ir nusidažyti per VISĄ
   ekrano plotį, NEKEIČIANT ".app-main" pačios (kad likusios šio konteinerio vidinės sekcijos
   toliau būtų ribotos - žr. Home.razor "Sparčiosios nuorodos" ir pan.). Naudojamas TIK
   MainLayout.razor NotAuthorized šakoje (žr. ".app-main--landing"). */
.app-main--landing {
    max-width: none;
    padding: 0;
}

/* Apatinė svetainės juosta (žr. MainLayout.razor NotAuthorized šaką) - TA PATI navy gradiento
   dizaino kalba, kaip ".topbar"/".home-landing" - vieninga viešo puslapio "aplinka". */
.site-footer {
    background: linear-gradient(160deg, #16324a 0%, #0f2436 100%);
    color: rgba(255, 255, 255, 0.75);
    padding: 1.75rem 1.5rem;
    text-align: center;
}

.site-footer__links {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1.25rem;
    margin-bottom: 0.75rem;
}

.site-footer__links a {
    color: rgba(255, 255, 255, 0.82);
    text-decoration: none;
    font-size: 0.88rem;
}

.site-footer__links a:hover {
    color: #fff;
    text-decoration: underline;
}

.site-footer__social {
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.site-footer__social a {
    color: rgba(255, 255, 255, 0.65);
    text-decoration: none;
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.site-footer__social a:hover {
    color: #fff;
}

.site-footer__copy {
    margin: 0;
    font-size: 0.78rem;
    color: rgba(255, 255, 255, 0.45);
}

/* Vieši teisinio turinio puslapiai (Kontaktai/Paslaugų teikimo sąlygos/Privatumo politika/
   Slapukų nustatymai, žr. Contact.razor ir kt.) - reikia SAVO paraštės/pločio, nes tėvinis
   ".app-main--landing" (žr. aukščiau) šiems puslapiams NETURI paraščių (skirtas TIK Home.razor
   pilno pločio "hero" sekcijai). Autentifikuotam vartotojui (šoninio meniu ".app-main" JAU turi
   savo paraštę) šis papildomas sluoksnis tiesiog truputi susiaurina turinį - nekritiška. */
.legal-page {
    max-width: 42rem;
    margin: 0 auto;
    padding: 2.5rem 1.5rem 3rem;
    box-sizing: border-box;
    line-height: 1.6;
}

.app-main h1 {
    margin-top: 0;
}

/* Vartotojo pageidautas "Atsijungti" viršuje (be esamo šoninio meniu apačios varianto) - žr.
   MainLayout.razor Authorized šaką. SĄMONINGAI viduje ".app-main" (nekeičiant sidebar/grid
   struktūros) - paprasčiausias, mažiausios rizikos sprendimas. */
.content-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding-bottom: 0.9rem;
    border-bottom: 1px solid var(--ak-border);
}

/* 5 ratas, Fazė B - grupuoja HelpDropdown + "Atsijungti" į VIENĄ dešinės pusės bloką, kad
   .content-topbar liktų su LYGIAI 2 vaikais (justify-content:space-between veiktų teisingai). */
.content-topbar__actions {
    display: flex;
    align-items: center;
    gap: 1rem;
}

/* Pagalbos (DUK) dropdown mygtukas (žr. Components/Layout/HelpDropdown.razor) - IŠORINIS
   <details>/<summary>, SSR-saugus (be JS atvėrimui/uždarymui). */
.help-dropdown {
    position: relative;
}

.help-dropdown > summary {
    cursor: pointer;
    list-style: none;
    color: var(--ak-accent-dark);
    font-size: 0.9rem;
    font-weight: 600;
}

.help-dropdown > summary::-webkit-details-marker {
    display: none;
}

.help-dropdown__panel {
    position: absolute;
    top: calc(100% + 0.5rem);
    right: 0;
    z-index: 50;
    width: 340px;
    max-height: 420px;
    overflow-y: auto;
    background: var(--ak-surface);
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    padding: 0.75rem;
}

.help-dropdown__item {
    border-top: 1px solid var(--ak-border);
    padding: 0.5rem 0;
}

.help-dropdown__item:first-of-type {
    border-top: none;
    margin-top: 0.6rem;
}

.help-dropdown__item summary {
    cursor: pointer;
    font-weight: 600;
    color: var(--ak-ink);
    font-size: 0.9rem;
}

.help-dropdown__item p {
    margin: 0.4rem 0 0.2rem;
    color: var(--ak-muted);
    font-size: 0.85rem;
    white-space: pre-wrap;
}

/* Naujienų dropdown mygtukas (9 ratas, žr. Components/Layout/NewsDropdown.razor) - TA PATI
   ".help-dropdown" schema/pozicionavimas, TIK platesnis skydelis (talpina paveikslėlį) IR
   raudonas "neperžiūrėta" ženklelis prie mygtuko - vartotojo reikalavimas "turi būti
   pastebimas, bet neturi trukdyti": TIK skaičius, JOKIO automatinio iššokimo/pop-up'o. */
.news-dropdown {
    position: relative;
}

.news-dropdown > summary {
    cursor: pointer;
    list-style: none;
    color: var(--ak-accent-dark);
    font-size: 0.9rem;
    font-weight: 600;
}

.news-dropdown > summary::-webkit-details-marker {
    display: none;
}

.news-dropdown__badge {
    display: inline-block;
    background: #d64545;
    color: #fff;
    border-radius: 999px;
    padding: 0.05rem 0.45rem;
    font-size: 0.72rem;
    font-weight: 700;
    margin-left: 0.3rem;
}

.news-dropdown__panel {
    position: absolute;
    top: calc(100% + 0.5rem);
    right: 0;
    z-index: 50;
    width: 380px;
    max-height: 480px;
    overflow-y: auto;
    background: var(--ak-surface);
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    padding: 0.6rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.news-card {
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    overflow: hidden;
}

.news-card__image {
    display: block;
    width: 100%;
    max-height: 160px;
    object-fit: cover;
}

.news-card__body {
    padding: 0.6rem 0.7rem;
}

.news-card__title {
    font-weight: 700;
    color: var(--ak-ink);
    font-size: 0.92rem;
    margin-bottom: 0.3rem;
}

.news-card__text {
    color: var(--ak-muted);
    font-size: 0.85rem;
    white-space: pre-wrap;
    margin: 0 0 0.4rem;
}

.news-card__link {
    display: inline-block;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--ak-accent-dark);
    text-decoration: none;
    margin-bottom: 0.3rem;
}

.news-card__link:hover {
    text-decoration: underline;
}

.news-card__date {
    font-size: 0.72rem;
    color: var(--ak-muted);
    opacity: 0.8;
}

/* Verslo metrikos - Pajamų/Sąnaudų/Pelno grafikas (9 ratas, žr. BusinessMetrics.razor
   BuildTrendChartSvg) - SVG plotis apibrėžtas viewBox'e, čia TIK apgaubianti kortelė + horizontali
   slinktis, kai mėnesių daug (TA PATI ".table-scroll" idėja, kaip lentelėms). */
.metrics-chart-wrap {
    background: var(--ak-surface);
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    padding: 0.75rem;
    overflow-x: auto;
}

.metrics-chart {
    display: block;
    height: 220px;
    max-width: 100%;
}

/* 25 ratas - antrieji Verslo metrikų grafikai (pyrago/donato + lūžio taško) - TA PATI
   .metrics-chart-wrap konteinerio schema aukščiau, TIK atskira klasė aukščiui, nes šie du
   grafikai VIZUALIAI aukštesni/kvadratiškesni nei stulpelinė diagrama. */
.metrics-chart--donut {
    display: block;
    height: 260px;
    max-width: 100%;
}

.metrics-chart--breakeven {
    display: block;
    height: 260px;
    max-width: 100%;
}

.metrics-charts-row {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.metrics-charts-row > .metrics-chart-wrap {
    flex: 1 1 320px;
}

/* 25 ratas - "akademijos" paaiškinimo blokas (žr. BusinessMetrics.razor <details>) - TA PATI
   .calc-result surface/border stilistika, TIK be tile grid'o (ilgas skaitomas tekstas). */
.metrics-academy {
    margin: 1rem 0;
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    background: var(--ak-surface);
    overflow: hidden;
}

.metrics-academy > summary {
    cursor: pointer;
    padding: 0.75rem 1rem;
    font-weight: 600;
    list-style: none;
}

.metrics-academy > summary::-webkit-details-marker {
    display: none;
}

/* 2026-09-11 audito ratas - bendra "sulankstoma forma" schema (žr. Managers.razor "Pridėti
   vadybininką") - summary atrodo kaip PAPRASTAS mygtukas (.btn-primary jau suteikia foną/
   paddingą), TIK reikia nuslopinti numatytąjį <details> trikampio/taško žymeklį, kad tai
   NEATRODYTŲ kaip sąrašo elementas. */
.collapsible-form {
    margin: 1rem 0;
    display: inline-block;
}

/* 2026-09-11 audito ratas (2-ras/3-as patikrinimas, vartotojo pastebėta DU kartus - "pagražinti
   VISĄ mygtukų bloką") - kai DU (ar daugiau) ".collapsible-form" (aukščiau) elementai stovi
   VIENAS PO KITO (pvz. AccountantWorkspace.razor "Kopijuoti..." + "+ Pridėti darbo eilutę" +
   "🗑 Pašalinti"), jie SUSIGLAUSDAVO - VIEN "inline-block" + vertikalus margin NEDUODA tarpo
   horizontaliai, TIK atsitiktinis HTML tarpo simbolis tarp žymų. PIRMA pataisa (tik tarpas +
   viršutinė linija) vartotojui atrodė nepakankamai "pagražinta" - DABAR TIKRA, aiškiai
   atskirta "kortelė" (TA PATI ".worked-hours-panel" bendra idėja, žr. aukščiau), NE vien
   plona skiriančioji linija. */
.collapsible-form-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 1.25rem;
    margin-top: 1rem;
    background: var(--ak-bg);
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    padding: 1rem 1.25rem;
}

/* Bloko viduje esantis "🗑 Pašalinti šio laikotarpio įrašus" - SAVO, atskira <form>, NE
   ".collapsible-form" (nereikia išplečiamo turinio - vien mygtukas), TODĖL reikalauja SAVO
   vertikalaus lygiavimo su GRETA esančiais ".collapsible-form" <summary> mygtukais/nuorodomis
   (kurie turi papildomą aukštį dėl <details> struktūros). */
.collapsible-form-row__standalone-action {
    display: flex;
    align-items: center;
    margin-top: 0.35rem;
}

.collapsible-form > summary {
    cursor: pointer;
    list-style: none;
    display: inline-block;
}

.collapsible-form > summary::-webkit-details-marker {
    display: none;
}

.collapsible-form > summary::marker {
    content: "";
}

.collapsible-form[open] {
    display: block;
}

.collapsible-form__body {
    margin-top: 1rem;
}

.metrics-academy__body {
    padding: 0 1rem 1rem;
}

.metrics-academy__body h3 {
    font-size: 0.95rem;
    margin: 1rem 0 0.25rem;
}

.metrics-academy__body p {
    margin: 0;
    color: var(--ak-muted);
    line-height: 1.5;
}

/* 30 ratas - Analitikos puslapio horizontalios "juostinės" diagramos (žr. Analytics.razor
   RenderBarList) - TA PATI ".onboarding-progress__bar/__fill" idėja (žr. aukščiau), tik
   pakartota per kelias eilutes vienam sąrašui, nes bucket'ų/vardų kiekis kintamas. */
.analytics-bars {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin: 0.75rem 0 1.5rem;
}

/* 2026-09-11 audito ratas - vartotojo pastebėta: "Analitika" rodė TIK bendrus skaičius,
   BE galimybės pereiti prie konkrečių klientų (drill-down) - dabar KIEKVIENA juostinė
   eilutė yra <details>/<summary> (žr. Analytics.razor RenderBarList), atsidaranti paspaudus
   TIESIOG ant paties bar'o, be jokio papildomo mygtuko. */
.analytics-bar-row {
    border-bottom: 1px solid var(--ak-border);
}

.analytics-bar-row:last-child {
    border-bottom: none;
}

.analytics-bar-row > summary {
    display: grid;
    grid-template-columns: minmax(9rem, 16rem) 1fr minmax(4.5rem, auto);
    align-items: center;
    gap: 0.75rem;
    padding: 0.4rem 0;
    cursor: pointer;
    list-style: none;
}

.analytics-bar-row > summary::-webkit-details-marker {
    display: none;
}

.analytics-bar-row > summary:hover .analytics-bar-row__label {
    color: var(--ak-accent-dark);
}

.analytics-bar-row__label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.analytics-bar-row__track {
    height: 0.6rem;
    background: var(--ak-border);
    border-radius: 999px;
    overflow: hidden;
}

.analytics-bar-row__fill {
    height: 100%;
    background: var(--ak-accent);
    border-radius: 999px;
    transition: width 0.2s ease;
}

.analytics-bar-row__value {
    font-weight: 600;
    color: var(--ak-accent-dark);
    white-space: nowrap;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* 2026-09-12 audito ratas (40 ratas, 7 punktas) - Analytics.razor RenderAccountantReport
   NETURI vidurinio ".analytics-bar-row__track" elemento (nėra procentinės juostos šiai
   ataskaitai) - BE šios klasės, numatytasis 3-jų stulpelių grid (žr. ".analytics-bar-row >
   summary" aukščiau) automatiškai sudėtų TIK DU vaikus (label/value) į PIRMAS DVI skiltis,
   paliekant "value" per plačiai/be savo ribų. */
.analytics-bar-row--no-track > summary {
    grid-template-columns: minmax(9rem, 16rem) 1fr;
}

.analytics-bar-row__value--pills {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.35rem;
    font-weight: normal;
}

/* Bendras "mažas apvalus ženklelis" - TA PATI idėja, kaip ".status-pill"/".period-quicklink",
   pritaikyta el. pašto/telefono/klientų skaičiaus reikšmėms, kad jos NESUSILIETŲ į vieną
   nepertraukiamą teksto liniją (žr. RenderAccountantReport komentarą). */
.analytics-pill {
    display: inline-block;
    padding: 0.15rem 0.55rem;
    border-radius: 999px;
    background: #eef1f5;
    color: var(--ak-muted);
    font-weight: 500;
    font-size: 0.78rem;
    white-space: nowrap;
}

.analytics-pill--accent {
    background: var(--ak-accent);
    color: #fff;
    font-weight: 600;
}

/* 42 ratas (gyvo testavimo atsiliepimas, 6 punktas) - "rekomenduojama peržiūra" grupė ("Kainos
   peržiūros aktualumas", žr. Analytics.razor RenderPriceReviewReport) paryškinta raudonai - JI
   yra praktiškai svarbiausia šios ataskaitos eilutė (kuriems klientams VERTA pasiūlyti kainos
   peržiūrą), taigi turi IŠSISKIRTI iš kitų (neutralių) eilučių, TA PATI --ak-error/--ak-error-bg
   spalvų pora, kaip ".package-card__section--danger". */
.analytics-bar-row--urgent > summary .analytics-bar-row__label {
    color: var(--ak-error);
    font-weight: 600;
}

.analytics-bar-row--urgent > summary .analytics-bar-row__fill {
    background: var(--ak-error);
}

.analytics-bar-row--urgent > summary .analytics-bar-row__value {
    color: var(--ak-error);
}

.analytics-drilldown {
    margin: 0 0 0.75rem 1rem;
    padding-left: 0.75rem;
    border-left: 2px solid var(--ak-border);
    overflow-x: auto;
}

.analytics-drilldown .data-table {
    font-size: 0.85rem;
}

/* 2026-09-11 audito ratas (2-ras patikrinimas) - Analitikos buhalterio filtras (žr.
   Analytics.razor <form method="get">) - paprasta GET forma, pasirinkimas iškart perkrauna
   puslapį (BE JS, native <select onchange> pateikimas). */
.analytics-filter {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin: 1rem 0;
}

.analytics-filter label {
    font-size: 0.85rem;
    color: var(--ak-muted);
}

.analytics-filter select {
    padding: 0.4rem 0.6rem;
    border: 1px solid var(--ak-border);
    border-radius: 6px;
    background: var(--ak-surface);
    color: inherit;
}

.content-topbar__user {
    color: var(--ak-muted);
    font-size: 0.9rem;
}

/* --- Šoninis meniu (prisijungusiam vartotojui) - atkartoja desktop programos išdėstymą --- */

.app-shell--sidebar {
    flex-direction: row;
    align-items: stretch;
}

.app-shell--sidebar .app-main {
    max-width: none;
    margin: 0;
    flex: 1;
    min-width: 0;
}

.sidebar {
    --sidebar-bg: #16283b;
    --sidebar-bg-active: #24405c;
    --sidebar-text: #cfd8e3;
    --sidebar-text-muted: #8695a7;
    width: 240px;
    flex-shrink: 0;
    background: var(--sidebar-bg);
    color: var(--sidebar-text);
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.sidebar__brand {
    font-family: "Outfit", system-ui, sans-serif;
    color: #fff;
    font-weight: 700;
    font-size: 1.15rem;
    line-height: 1.3;
    padding: 1.25rem 1.25rem 1rem;
}

/* Vartotojo pastebėta (telefone šoninis meniu neužsiveria, reikia scrollinti pro VISUS
   punktus, kad pasiektum turinį) - "hamburger" mygtukas, žr. .sidebar-toggle click žemiau
   (site.js) ir 780px media query. Paslėptas darbalaukyje (rodomas TIK ≤780px, žr. media
   query žemiau) - .sidebar__nav/.sidebar__footer telefone/planšetėje LIEKA paslėpti, kol
   mygtukas paspaudžiamas (.sidebar--open klasė). */
.sidebar-toggle {
    display: none;
    background: none;
    border: none;
    color: #fff;
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
    padding: 1.25rem 1.25rem 1rem;
}

.sidebar__nav {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 0.5rem 0.75rem;
    flex: 1;
}

.sidebar__link {
    display: block;
    padding: 0.6rem 0.75rem;
    border-radius: 6px;
    color: var(--sidebar-text);
    text-decoration: none;
    font-size: 0.92rem;
}

/* 27 ratas - "Priminimai" meniu punkto skaičiukas (žr. MainLayout.razor reminderBadgeCount) -
   TA PATI raudona "pill" stilistika, kaip .news-dropdown__badge, TIK plūduriuojantis dešinėje
   šoninio meniu eilutės pusėje (ne po tekstu), kad iškart matytųsi be papildomo skaitymo. */
.sidebar__badge {
    display: inline-block;
    float: right;
    background: #d64545;
    color: #fff;
    border-radius: 999px;
    padding: 0.05rem 0.45rem;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.3;
}

.sidebar__link:hover {
    background: rgba(255, 255, 255, 0.06);
}

.sidebar__link.active {
    background: var(--sidebar-bg-active);
    color: #fff;
    font-weight: 600;
}

/* Šoninio meniu apačios pagalbinė nuoroda (naudojimo vadovas) - vizualiai atskirta nuo
   pagrindinės navigacijos, kaip desktop programoje. */
.sidebar__link--utility {
    padding: 0.3rem 0.75rem;
    font-size: 0.82rem;
    color: var(--sidebar-text-muted);
}

.sidebar__link--utility:hover {
    color: var(--sidebar-text);
}

/* Būdama aktyvi, pagalbinė nuoroda vis tiek turi likti vizualiai "tylesnė" už pagrindinę
   navigaciją (jokio fono/paryškinimo) - tik šviesesnė teksto spalva parodo "esate čia".
   Specifiškumas TURI būti bent toks pat, kaip .sidebar__link.active (dvi klasės), kitaip
   pastaroji taisyklė (fonas + paryškintas šriftas) tyliai "laimėtų" per CSS cascade. */
.sidebar__link--utility.active {
    background: none;
    color: var(--sidebar-text);
    font-weight: 400;
}

.sidebar__footer {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding: 1rem 1.25rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.sidebar__user {
    font-size: 0.82rem;
    color: var(--sidebar-text-muted);
    word-break: break-all;
}

.sidebar__logout {
    background: none;
    border: none;
    color: var(--sidebar-text);
    text-decoration: underline;
    cursor: pointer;
    padding: 0;
    font-size: 0.85rem;
    text-align: left;
}

.sidebar__logout:hover {
    color: #fff;
}

.sidebar__version {
    font-size: 0.72rem;
    color: var(--sidebar-text-muted);
    line-height: 1.4;
}

@media (max-width: 780px) {
    .app-shell--sidebar {
        flex-direction: column;
    }

    .sidebar {
        width: 100%;
    }

    .sidebar__nav {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .sidebar__brand {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .sidebar-toggle {
        display: block;
    }

    /* Numatytai PASLĖPTA - vartotojas PATS atveria per .sidebar-toggle (žr. site.js), kad
       nereikėtų scrollinti pro visą meniu kaskart, kai atsidaro puslapį telefone/planšetėje. */
    .sidebar__nav,
    .sidebar__footer {
        display: none;
    }

    .sidebar--open .sidebar__nav {
        display: flex;
    }

    .sidebar--open .sidebar__footer {
        display: flex;
    }
}

.muted {
    color: var(--ak-muted);
}

.btn-primary {
    display: inline-block;
    background: var(--ak-accent);
    color: #fff;
    border: none;
    padding: 0.55rem 1.1rem;
    border-radius: 6px;
    font-size: 0.95rem;
    text-decoration: none;
    cursor: pointer;
}

.btn-primary:hover {
    background: var(--ak-accent-dark);
}

.btn-primary--small {
    padding: 0.35rem 0.8rem;
    font-size: 0.85rem;
}

.btn-link {
    background: none;
    border: none;
    color: var(--ak-accent-dark);
    text-decoration: underline;
    cursor: pointer;
    padding: 0;
    font-size: 0.9rem;
}

/* --- Prisijungimo/Registracijos ekranai (žr. Layout/AuthLayout.razor) ---
   Pilno aukščio dviejų stulpelių išdėstymas: kairėje prekės ženklo skydelis (paslėptas
   siaurame ekrane), dešinėje - forma. Spalvos - TOS PAČIOS --ak-* kintamosios, kaip visoje
   programoje (žr. :root aukščiau), kad prisijungimas neatrodytų kaip "kitas produktas". */
.auth-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    background: var(--ak-surface);
}

.auth-brand {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 3rem 3.5rem;
    background: linear-gradient(160deg, var(--ak-accent-dark) 0%, #16324a 55%, #0f2436 100%);
    color: rgba(255, 255, 255, 0.92);
}

.auth-brand__content {
    position: relative;
    z-index: 1;
    max-width: 26rem;
}

.auth-brand__mark {
    display: inline-flex;
    align-items: center;
    gap: 0.85rem;
    text-decoration: none;
    color: #fff;
}

.auth-brand__logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.22);
    font-family: "Outfit", system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.05rem;
    letter-spacing: 0.02em;
    flex-shrink: 0;
}

.auth-brand__wordmark {
    font-family: "Outfit", system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.35rem;
    line-height: 1.15;
}

.auth-brand__tagline {
    margin-top: 1.75rem;
    font-size: 1.05rem;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.82);
}

.auth-brand__points {
    margin-top: 1.75rem;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.auth-brand__points li {
    position: relative;
    padding-left: 1.6rem;
    font-size: 0.92rem;
    color: rgba(255, 255, 255, 0.75);
    line-height: 1.4;
}

.auth-brand__points li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.4rem;
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #6fb1e0, #3d7fb3);
}

.auth-brand__art {
    position: absolute;
    right: -8rem;
    bottom: -8rem;
    width: 32rem;
    height: 32rem;
    z-index: 0;
    pointer-events: none;
}

.auth-brand__footer {
    position: relative;
    z-index: 1;
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.55);
    margin: 0;
}

.auth-main {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 1.5rem;
    color: var(--ak-ink);
}

/* 4 ratas, Fazė E - Login/Register ekranų kalbos jungiklis, žr. AuthLayout.razor. */
.auth-main__lang {
    position: absolute;
    top: 1.25rem;
    right: 1.5rem;
}

.auth-card {
    width: 100%;
    max-width: 400px;
}

.auth-card__title {
    font-family: "Outfit", system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.7rem;
    color: var(--ak-ink);
    margin: 0 0 0.4rem;
}

.auth-card__lead {
    color: var(--ak-muted);
    font-size: 0.92rem;
    line-height: 1.5;
    margin: 0 0 1.25rem;
}

.auth-card__submit {
    width: 100%;
    justify-content: center;
    padding: 0.7rem 1rem;
    font-size: 0.98rem;
}

/* SVARBU: šis "@media" blokas TURI būti PO visų aukščiau esančių ".auth-shell"/".auth-brand"
   taisyklių (NE prieš, kaip buvo iš pradžių - pastebėta gyvo testavimo metu, kad tada
   VĖLESNĖ, besąlyginė ".auth-brand { display: flex }" taisyklė (dėl LYGIOS specifiškumo ir
   VĖLESNĖS eilės faile) tyliai "nugalėjo" šio bloko "display: none", net kai media sąlyga
   TIKRAI atitikdavo - žr. panašią pastabą prie ".row-input"/".form-field" aukščiau faile). */
@media (max-width: 900px) {
    .auth-shell {
        grid-template-columns: 1fr;
    }

    .auth-brand {
        display: none;
    }
}

.account-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: 1rem;
}

.qr-code-box {
    display: inline-flex;
    padding: 1rem;
    background: #fff;
    border: 1px solid var(--ak-border);
    border-radius: 0.5rem;
    margin: 0.75rem 0;
}

.manual-key {
    font-size: 1rem;
    letter-spacing: 0.05em;
    background: var(--ak-bg);
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    display: inline-block;
    margin-top: 0.25rem;
}

.recovery-codes {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
    font-size: 1.05rem;
    letter-spacing: 0.03em;
    background: var(--ak-bg);
    border: 1px solid var(--ak-border);
    border-radius: 0.5rem;
    padding: 1rem 1.25rem;
    margin: 1rem 0;
    max-width: 420px;
}

.recovery-codes code {
    background: transparent;
    padding: 0;
}

.form-field {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.form-field label {
    font-size: 0.85rem;
    color: var(--ak-muted);
}

/* 2026-09-11 audito ratas (2-ras patikrinimas) - smulkus paaiškinimo tekstas PO lauko (žr.
   ClientEdit.razor "Dokumentų aplanko nuoroda") - mažesnis IR švelnesnis, nei "label" virš
   lauko, kad neatrodytų kaip antra etiketė. */
.form-field__hint {
    font-size: 0.78rem;
    color: var(--ak-muted);
    line-height: 1.4;
}

/* 21 ratas - registracijos "honeypot" laukas (žr. Register.razor) - VIZUALIAI NEMATOMAS
   tikram vartotojui (position:absolute + kraštinė UŽ ekrano + 0 dydis), BET NE
   "display:none"/"visibility:hidden" (kai kurie paprasti botai TIKRINA šias dvi savybes ir
   praleidžia tokius laukus - liekant "matomam" DOM medžiui/CSS aprašui, tik fiziškai už
   ekrano, apgaulė patikimesnė). */
.hp-field {
    position: absolute;
    left: -9999px;
    top: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* Slaptažodžio laukas su "akies" mygtuku (žr. site.js .pwd-toggle click handler) - vartotojo
   pageidavimu galimybė patikrinti įvestą slaptažodį prisijungimo/registracijos formose. */
.pwd-field {
    position: relative;
    display: block;
}

/* 28 ratas (36 punktų sąrašo 26 p.), PATAISYTA IŠ NAUJO 2026-09-11 audito (2-ras patikrinimas) -
   partnerystės programos nuorodos laukelis + "Kopijuoti" mygtukas (žr. Balance.razor). PIRMAS
   bandymas ("copy-link-btn { margin-left: 0.6rem }" ant ".pwd-field", kuri PATI naudoja
   "position:relative;display:block" BE flex) vartotojui TEBEPASIRODĘ per siauras - dabar VISAS
   konteineris pakeistas į TIKRĄ flex eilutę su "gap" (NE .pwd-field, kuri semantiškai skirta
   slaptažodžio AKIES mygtukui SUSILIETI su lauku, ne atskiram "Kopijuoti" mygtukui) - aiškesnis,
   didesnis, NELIŪ priklausantis nuo vieno elemento "margin" pataisos. */
.input-with-button {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.input-with-button .row-input {
    flex: 1;
}

/* 28 ratas (36 punktų sąrašo 30 p.) - partnerystės taškų veikimo paaiškinimo žingsniai
   (žr. Balance.razor) - TA PATI ".muted" spalva, kaip likęs puslapio informacinis tekstas,
   TIK su numeracija (SVARBI - tai TIKRAS, eiliškumu priklausantis procesas, ne sąrašas). */
.referral-explainer {
    color: var(--ak-muted);
    font-size: 0.92rem;
    line-height: 1.5;
    margin: 0.25rem 0 1rem;
    padding-left: 1.4rem;
}

.referral-explainer li {
    margin-bottom: 0.35rem;
}

/* SVARBU (specifiškumas): ".form-field input:not(...):not(...):not(...)" aukščiau turi
   DAUG :not() sąlygų (aukštas specifiškumas) - paprastas ".pwd-field input" jo NELAIMĖTŲ
   nepriklausomai nuo eilės. Todėl čia PAKARTOTA ta pati :not() grandinė, kad specifiškumas
   būtų DIDESNIS (papildoma ".pwd-field" klasė) - ta pati pamoka, kaip .calc-result__tile
   aukščiau.
   SVARBU (10 ratas, vartotojo pastebėta): trūko "width:100%" - INPUT pats savaime turi TIK
   savo numatytąjį (siaurą) plotį, o ".pwd-field" (position:relative apgaubėjas) ISTEMPIA IKI
   viso savo konteinerio pločio (ypač pastebima ".form-field--wide" plačiuose laukuose, pvz.
   Site.pro API rakto lauke) - TAD ".pwd-toggle" (position:absolute; right:0.4rem SAVO ATŽVILGIU
   ".pwd-field") atsidurdavo TOLI DEŠINĖJE, palikdamas didelį tuščią tarpą tarp trumpo INPUT
   ir mygtuko. Dabar INPUT UŽPILDO visą ".pwd-field" plotį, mygtukas atsiduria TIESIOG prie
   INPUT dešinio krašto - taip, kaip ir turėtų atrodyti. */
.form-field .pwd-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]) {
    padding-right: 2.5rem;
    width: 100%;
    box-sizing: border-box;
}

.pwd-toggle {
    position: absolute;
    right: 0.4rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1rem;
    line-height: 1;
    padding: 0.3rem;
    color: var(--ak-muted);
}

.pwd-toggle:hover {
    color: var(--ak-accent);
}

/* Bendras, VIENODAS visų teksto-tipo įvesties laukų stilius visame projekte - anksčiau šis
   sąrašas apėmė TIK text/password/email, todėl date/number/tel/search/url laukai (pvz. Kliento
   kortelės "Paslaugų pradžios data", skaičiuoklės "Kiekis") liko nepaliesti ir atrodė kitaip
   (naršyklės numatytasis, dažnai tamsesnis kontūras) - vartotojo pastebėta kaip "kontūras juodas".
   Taip pat aukštesnis/patogesnis paspaudimo plotas ir švelnus šešėlis gyliui. */
.form-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.form-field select,
.form-field textarea,
.row-input {
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--ak-border);
    border-radius: 6px;
    font-size: 0.95rem;
    font-family: inherit;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    /* 2026-09-13 audito ratas (ŠAKNINĖ priežastis "mygtukas užlipa ant langelio" bug'ui,
       vartotojo pastebėtam PAKARTOTINAI/4-tą kartą, žr. ServiceCatalog.razor "Pervardinti
       komplektą") - NĖRA visuotinio "*{box-sizing:border-box}" atstatymo šiame projekte, taigi
       <input>/<select>/<textarea> NAUDOJA naršyklės numatytąjį "content-box": ".row-input--wide"
       (žr. žemiau) duoda "width:100%", O TADA šis padding (0.6rem 0.75rem = 24px horizontaliai)
       + border (2px) PRIDEDAMI VIRŠUJE - lauko TIKRAS plotis tampa 26px PLATESNIS už savo tėvinį
       konteinerį, todėl jis VIZUALIAI persidengia su greta esančiu mygtuku (kurio vieta
       skaičiuojama pagal TEISINGĄ, NEpapildytą "form-field"/".row-input" pločio pasidalinimą,
       žr. ".package-card__rename-row" app.css komentarą prieš tai). "border-box" - VIENINTELIS
       saugus taisymas ČIA (visiems šio bendro rato laukams vienu sykiu), nes jis TIK MAŽINA,
       NIEKADA nepadidina jokio lauko vaizdinio pločio - nulinė rizika kitiems, jau tinkamai
       tilpusiems laukams. */
    box-sizing: border-box;
}

.form-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
.form-field select:focus,
.form-field textarea:focus,
.row-input:focus {
    outline: none;
    border-color: var(--ak-accent);
    box-shadow: 0 0 0 3px rgba(42, 93, 143, 0.12);
}

.form-field--checkbox {
    flex-direction: row;
    align-items: center;
}

.form-field--checkbox label {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--ak-ink);
}

.account-alt-action {
    margin-top: 1.25rem;
    font-size: 0.9rem;
    color: var(--ak-muted);
    text-align: center;
}

.status-message {
    padding: 0.6rem 0.9rem;
    border-radius: 6px;
    font-size: 0.9rem;
    margin: 0.75rem 0;
}

.status-message--error {
    background: var(--ak-error-bg);
    color: var(--ak-error);
}

.status-message--ok {
    background: var(--ak-ok-bg);
    color: var(--ak-ok);
}

/* Švelnus įspėjimo (NE klaidos, NE "atlikta") žymėjimas - pvz. Priminimų "AML/KYC dar
   neatlikta" eilutė. Tas pats švelnus raudonas tonas, kaip status-message--error, bet kaip
   pilulė (status-pill), ne visos eilutės pranešimas. */
.status-pill--warning {
    background: var(--ak-error-bg);
    color: var(--ak-error);
}

/* --- Puslapio navigacijos nuorodos, atrodančios kaip mygtukai (pvz. "← Atgal", "Kainodaros
   skaičiuoklė →") - anksčiau buvo paprastas pabrauktas tekstas, sunkiai pastebimas. --- */
.page-nav {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin: 0.75rem 0;
}

.page-nav a {
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 0.85rem;
    border-radius: 6px;
    background: var(--ak-surface);
    border: 1px solid var(--ak-border);
    color: var(--ak-accent-dark);
    text-decoration: none;
    font-size: 0.88rem;
    font-weight: 500;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05);
    transition: background 0.15s ease, border-color 0.15s ease;
}

.page-nav a:hover {
    background: var(--ak-bg);
    border-color: var(--ak-accent);
}

/* --- Duomenų redagavimo formos (pvz. Įmonės profilis) --- */

.profile-form {
    max-width: 720px;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 1.5rem;
    margin-top: 0.5rem;
}

.form-field--wide {
    grid-column: 1 / -1;
}

/* 2026-09-12 audito ratas (40 ratas, gyvo testavimo atsiliepimas, 4 punktas) - ClientEdit.razor
   numatytoji "vitrina" (read-only) būsena, PRIEŠ paspaudžiant "Redaguoti" - saugo nuo netyčinių
   korekcijų. TA PATI ".form-grid" 2 stulpelių tvarka, kaip redagavimo forma (žr. aukščiau),
   TIK reikšmės rodomos kaip TEKSTAS, ne įvesties laukai. */
.client-card-view__field {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.client-card-view__label {
    font-size: 0.78rem;
    color: var(--ak-muted);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.client-card-view__value {
    font-size: 1rem;
}

/* 2026-09-13 audito ratas (41 ratas, gyvo testavimo atsiliepimas, PAKARTOTA DU kartus
   skirtinguose puslapiuose - ClientEdit.razor "Redaguoti" per arti "vitrinos" reikšmės
   virš jo, Accountants.razor "Išsaugoti pakeitimus" per arti lentelės virš jo) - BENDRA,
   pakartotinai naudojama papildomo viršutinio tarpo klasė, PRIDEDAMA PRIE ".form-actions"
   (NE PAKEIČIANTI jos - žr. ".form-actions" komentarą aukščiau, KODĖL jos PAČIOS
   "margin-top" negalima keisti: paveiktų VISUS kitus puslapius, kurie tos klasės naudoja
   TIK vieną mygtuką be šio "per arti" simptomo).
   SVARBU: sudėtinis (compound) žymiklis ".form-actions.form-actions--top-gap" (NE vien
   ".form-actions--top-gap") - BŪTINA didesniam specifiškumui, nei paprastas ".form-actions",
   kitaip (gyvo patikrinimo metu RASTAS TIKRAS bug'as) šios klasės VIENODO specifiškumo,
   BET vėliau faile esanti ".form-actions" taisyklė TYLIAI PERRAŠYTŲ šią - NEPRIKLAUSOMAI nuo
   dviejų klasių sąraše eilės tvarka <div class="..."> žymoje. */
.form-actions.form-actions--top-gap {
    margin-top: 1.25rem;
}

/* Kliento kortelės "Dokumentų aplanko nuoroda" laukas (15 ratas) - URL įvestis + "Pereiti"
   mygtukas viena eilute, TA PATI flex+gap logika, kaip kitur programoje. */
.doc-folder-field {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.doc-folder-field input {
    flex: 1;
}

/* Vartotojo pastebėta: 3 laukų forma (pvz. "Naujos sąnaudų eilutės pavadinimas"/"Tipas"/"Suma")
   fiksuotame 2 stulpelių tinklelyje palikdavo DIDELĮ, netvarkingą tuščią plotą trečio lauko
   šalia (2 stulpeliai, 3 laukai = 4 vietos, ketvirta lieka tuščia). 3 stulpelių tinklelis
   tokioms formoms užpildo eilutę tvarkingai, be tuščios vietos. */
.form-grid--3col {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 640px) {
    .form-grid,
    .form-grid--3col {
        grid-template-columns: 1fr;
    }
}

/* "resize" - textarea savybė, kurios NĖRA bendrame taisyklės sąraše aukščiau (žr. pastabą
   prie ".row-input" dėl kodėl padding/border/box-shadow apibrėžti TIK vienoje vietoje). */
.form-field textarea {
    resize: vertical;
}

.form-actions {
    margin-top: 0.25rem;
    /* 4 ratas, Fazė B: BE šito kelių mygtukų grupės (pvz. ServiceTimer.razor "Pradėti"/
       "Atstatyti") "susiklijuoja" - žr. vartotojo pastebėjimą. Vienam mygtukui poveikio
       nedaro (flex viena eilute užima tik turinio plotį). */
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.btn-danger {
    background: none;
    border: 1px solid var(--ak-error);
    color: var(--ak-error);
    padding: 0.5rem 1rem;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
}

.btn-danger:hover {
    background: var(--ak-error-bg);
}

.btn-danger:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.btn-danger:disabled:hover {
    background: none;
}

/* "Užtaisyta" (pirmas paspaudimas) naikinančio veiksmo mygtuko būsena - žr. site.js
   "data-confirm" mechanizmą. Ryškiai raudonas fonas VISIEMS mygtukų stiliams (.btn-link/
   .btn-danger/.btn-star ir t. t.), kad vartotojas AIŠKIAI pastebėtų, kad reikia paspausti
   dar kartą - VIETOJE naršyklės gimtojo confirm() dialogo, kuris ilgai testuojant gali būti
   naršyklės tyliai užblokuotas (žr. site.js komentarą). */
.confirm-armed {
    background: var(--ak-error) !important;
    color: #fff !important;
    border-color: var(--ak-error) !important;
    text-decoration: none !important;
    border-radius: 4px;
    padding: 0.15rem 0.4rem;
}

/* "Pavojaus zona" (žr. Admin/OrganizationDetail.razor - organizacijos pilnas pašalinimas) -
   ryškiai atskirta raudona dėžė, kad šis NEGRĮŽTAMAS veiksmas VIZUALIAI aiškiai skirtųsi nuo
   likusio puslapio įprastų formų. */
.danger-zone {
    border: 1px solid var(--ak-error);
    border-radius: 8px;
    padding: 1.25rem 1.5rem;
    background: var(--ak-error-bg);
}

.danger-zone .form-field {
    max-width: 28rem;
}

.section-heading {
    font-family: "Outfit", system-ui, sans-serif;
    font-weight: 600;
    margin-top: 2.5rem;
    font-size: 1.15rem;
    border-top: 1px solid var(--ak-border);
    padding-top: 1.5rem;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
}

/* 2026-09-11 audito ratas (3-io gyvo patikrinimo radinys) - "Excel ataskaita prie kiekvienos
   [Analitikos] pozicijos" - maža nuoroda ŠALIA sekcijos antraštės (žr. Analytics.razor
   RenderSectionHeading) - PLONESNIS šriftas nei antraštė, kad NEATITRAUKTŲ dėmesio. */
.section-heading__export {
    font-family: inherit;
    font-weight: 400;
    font-size: 0.85rem;
    white-space: nowrap;
}

/* 42 ratas (gyvo testavimo atsiliepimas, 6 punktas) - "Kainos peržiūros aktualumas" (žr.
   Analytics.razor) YRA VISAS <details> blokas (ne <h2>), skirtingai nuo kitų sekcijų (žr.
   ".section-heading" aukščiau) - vartotojo pastebėta, kad šis sąrašas per didelis, kad liktų
   VISADA atskleistas. TA PATI ".section-heading" vizualinė schema (viršutinė riba/tarpas/flex),
   BET šriftas/paryškinimas EKSPLICITIŠKAI pakartotas ČIA, nes "h1,h2,h3" CSS taisyklė (žr. žemiau)
   taikoma pagal ELEMENTO PAVADINIMĄ - <summary> jos NEGAUNA automatiškai. */
.analytics-section-collapsible {
    margin-top: 2.5rem;
    border-top: 1px solid var(--ak-border);
    padding-top: 1.5rem;
}

.analytics-section-collapsible > summary {
    font-family: "Outfit", system-ui, sans-serif;
    font-weight: 600;
    font-size: 1.15rem;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    cursor: pointer;
    list-style: none;
    /* 2026-09-13 "kitų puslapių" audito ratas - BE šio padding'o eilutės aukštis buvo TIK
       ~25px (vien teksto eilutės aukštis), ties WCAG 2.5.8 (AA) 24px minimalaus prisilietimo
       tikslo riba - TA PATI pataisa/priežastis, kaip ".coef-item"/".btn-star" (žr. 49 rato
       komentarus žemiau šiame faile). */
    padding: 0.3rem 0;
}

.analytics-section-collapsible > summary::-webkit-details-marker {
    display: none;
}

/* Rankiniu būdu nubraižytas atskleidimo ženklelis (NE naršyklės numatytasis) - <summary>
   su "display:flex" naršyklėse PRARANDA numatytąjį trikampį žymeklį, taigi jis pridedamas
   PAČIAME etiketės <span> (NE tiesiai <summary>), kad NESUTRIKDYTŲ "justify-content:
   space-between" DVIEJŲ flex vaikų (etiketė + pilis) išdėstymo. */
.analytics-section-collapsible__caret {
    display: inline-block;
    margin-right: 0.4rem;
    font-size: 0.8em;
    color: var(--ak-muted);
    transition: transform 0.15s ease;
}

.analytics-section-collapsible[open] > summary .analytics-section-collapsible__caret {
    transform: rotate(90deg);
}

/* "Outfit" antraštėms VISOJE programoje (žr. App.razor Google Fonts nuorodą) - vieninga,
   labiau atpažįstama prekės ženklo tipografija, be poveikio skaitomo teksto šriftui. */
h1, h2, h3 {
    font-family: "Outfit", system-ui, sans-serif;
    font-weight: 700;
}

/* --- Puslapio antraštė su veiksmo mygtuku dešinėje (pvz. Klientai, Paslaugų katalogas) --- */
.page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.page-header h1 {
    margin: 0;
}

.page-header__actions {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* Vartotojo pastebėta: neapipavidalintas <input type="file"> šalia stilizuotų mygtukų
   atrodydavo "netvarkingai" (svetimas naršyklės elementas be jokio grupavimo). Dabar visa
   "įkėlimo" grupė (failo laukelis + mygtukas) turi savo aiškų, atskirą fono/kontūro rėmelį -
   iškart matoma, kad tai VIENAS veiksmas, atskirtas nuo "Eksportuoti" mygtuko. */
.inline-upload-form {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--ak-surface);
    border: 1px solid var(--ak-border);
    border-radius: 6px;
    padding: 0.3rem 0.5rem 0.3rem 0.75rem;
}

.inline-upload-form input[type="file"] {
    font-size: 0.82rem;
    max-width: 220px;
}

.import-preview {
    margin-top: 1.5rem;
    padding: 1rem;
    background: var(--ak-surface-muted, #f7f8fa);
    border: 1px solid var(--ak-border);
    border-radius: 8px;
}

/* --- Įmonės logotipas (Įmonės profilis) --- */
.logo-panel {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin: 1rem 0 2rem;
}

.logo-panel__preview {
    max-width: 160px;
    max-height: 120px;
    object-fit: contain;
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    padding: 0.5rem;
    background: #fff;
}

.logo-panel__placeholder {
    width: 160px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 0.85rem;
    color: var(--ak-muted);
    border: 1px dashed var(--ak-border);
    border-radius: 8px;
    padding: 0.5rem;
}

.logo-panel__actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
}

/* --- Duomenų lentelės (pvz. Klientų sąrašas) --- */

.table-scroll {
    overflow-x: auto;
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    background: var(--ak-surface);
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.92rem;
}

.data-table th {
    text-align: left;
    padding: 0.65rem 0.9rem;
    background: var(--ak-bg);
    color: var(--ak-muted);
    font-weight: 600;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-bottom: 1px solid var(--ak-border);
}

.data-table--sortable th {
    cursor: pointer;
    user-select: none;
}

.data-table--sortable th:hover {
    color: var(--ak-accent-dark);
}

/* 17 ratas (36 punktų sąrašo 6 p.) - kategorijos antraštės eilutė ilgame Paslaugų katalogo/
   Kainodaros skaičiuoklės sąraše (žr. GroupBy ServiceCatalog.razor/ClientCalculator.razor).
   2026-09-11 audito ratas - vartotojo pastebėta, kad šis grupavimas buvo TIK vizualus (statinis),
   BE tikro išskleidimo/suskleidimo (accordion) - dabar antraštė TIKRAI veikia kaip mygtukas
   (žr. site.js deleguotą klausytoją ant ".data-table__group-header"), kuris perjungia
   ".data-table__group--collapsed" klasę ant TĖVINIO <tbody> (žr. žemiau). Grynas CSS/JS,
   BE serverio užklausos, veikia identiškai desktop/tablet/mobile (nėra media-query priklausomybės). */
.data-table__group-header {
    cursor: pointer;
    user-select: none;
}

.data-table__group-header td {
    background: var(--ak-bg);
    color: var(--ak-accent-dark);
    font-weight: 700;
    font-size: 0.85rem;
    padding: 0.5rem 0.9rem;
    border-bottom: 1px solid var(--ak-border);
    border-top: 1px solid var(--ak-border);
}

.data-table__group-header:hover td {
    background: var(--ak-border);
}

.data-table__group-header td::before {
    content: "▾";
    display: inline-block;
    width: 1rem;
    margin-right: 0.3rem;
    transition: transform 0.15s ease;
}

.data-table__group--collapsed .data-table__group-header td::before {
    transform: rotate(-90deg);
}

.data-table__group--collapsed tr:not(.data-table__group-header) {
    display: none;
}

/* 4 ratas, Fazė D - pasirinkto žurnalo failo eilutės paryškinimas, žr. Admin/KlaiduZurnalas.razor. */
.data-table__row--selected {
    background: var(--ak-bg);
    font-weight: 600;
}

.data-table td {
    padding: 0.65rem 0.9rem;
    border-bottom: 1px solid var(--ak-border);
    /* FINAL PRE-PRODUCTION AUDITO ratas (kraštutinių atvejų testas) - BE šios taisyklės,
       vienas NEPERTRAUKIAMAS ilgas žodis (pvz. netyčia įklijuotas ar importuotas kliento
       pavadinimas be tarpų) PRIVERSDAVO VISĄ puslapio <body> išsiplėsti horizontaliai
       (patvirtinta gyvai: 10 000 simbolių pavadinimas → document.body.scrollWidth ~93000px),
       NEPAISANT ".table-scroll" konteinerio "overflow-x:auto" (jis nepadeda, kai patį nulaužti
       neįmanoma). "overflow-wrap:anywhere" leidžia lentelės langeliui laužti TOKĮ žodį bet
       kurioje vietoje, kaip paskutinę priemonę - normaliam tekstui su tarpais elgesys nesikeičia. */
    overflow-wrap: anywhere;
}

.data-table tr:last-child td {
    border-bottom: none;
}

.data-table a {
    color: var(--ak-accent-dark);
}

/* 2026-09-14 ratas (Verslo metrikos, vartotojo pastebėjimas ekrano nuotraukoje - lentelė
   "atrodo netvarkingai") - ŠAKNIS: ".data-table" turi "width:100%", todėl LABAI plačioje
   lentelėje (Verslo metrikos istorijos lentelė - 22 stulpeliai) naršyklė PRIVERSTA visus
   stulpelius sugrūsti į konteinerio plotį, NET jei turinys netelpa - o kadangi ".data-table td"
   turi "overflow-wrap:anywhere" (žr. aukščiau, FINAL PRE-PRODUCTION ratas - apsauga nuo VIENO
   nepertraukiamo 10 000 simbolių žodžio), naršyklė TADA laužia trumpus, statinius elementus
   (pvz. "Pašalinti" nuorodą, pinigų sumas) RAIDĘ PO RAIDĖS/SIMBOLĮ PO SIMBOLIO, VIETOJE to,
   kad tiesiog PLATĖTŲ ir įsijungtų JAU ESANTIS ".table-scroll" horizontalus slinkimas (kuris
   TAM IR SUKURTAS). Pataisa - modifikatorius ".data-table--wide" TIK ypač plačioms lentelėms
   (22 Verslo metrikų stulpeliai) - "width:max-content" leidžia lentelei užimti REIKIAMĄ,
   TURINIO nulemtą plotį (niekada ne mažesnį už "min-width:100%", kad neatrodytų dirbtinai
   siaura, kai eilučių mažai) - likusios (dažniausiai NAMAŽO stulpelių skaičiaus) lentelės,
   naudojančios TIK ".data-table" BE šio modifikatoriaus, elgesio NEKEIČIA. */
.data-table--wide {
    width: max-content;
    min-width: 100%;
}

/* Papildoma apsauga BET KURIAI ".data-table" - veiksmų nuorodos/mygtukai (pvz. "Pašalinti",
   "Redaguoti") YRA trumpi, statiniai žodžiai, kurie NIEKADA neturėtų būti laužomi per raides -
   "overflow-wrap:normal" PERRAŠO paveldėtą "anywhere" TIK šiems elementams (laisvo teksto
   duomenų langeliams, pvz. kliento pavadinimams, apsauga NIEKUR nepašalinama). */
.data-table td .btn-link,
.data-table td > a {
    overflow-wrap: normal;
    white-space: nowrap;
}

.status-pill {
    display: inline-block;
    padding: 0.15rem 0.6rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
}

.status-pill--aktyvus {
    background: var(--ak-ok-bg);
    color: var(--ak-ok);
}

.status-pill--sustabdytas {
    background: var(--ak-error-bg);
    color: var(--ak-error);
}

.status-pill--potencialus {
    background: #eef1f5;
    color: var(--ak-muted);
}

/* 2026-09-11 audito ratas (9 punktų atsiliepimo 1-as punktas) - AccountantWorkspace.razor
   "laikotarpiai su įrašais" greito šuolio nuorodos - TA PATI ".status-pill" bendra idėja
   (mažas, apvalus ženklelis), TIK kaip <a> nuoroda, NE statuso žyma. */
.period-quicklink {
    display: inline-block;
    margin: 0 0.3rem 0.3rem 0;
    padding: 0.15rem 0.6rem;
    border-radius: 999px;
    font-size: 0.82rem;
    background: #eef1f5;
    color: var(--ak-accent-dark);
    text-decoration: none;
}

.period-quicklink--active {
    background: var(--ak-accent);
    color: #fff;
    font-weight: 600;
}

.data-table__actions {
    display: flex;
    gap: 0.9rem;
    white-space: nowrap;
}

/* 2026-09-14 ratas (MessageTemplates.razor, vartotojo prašymas) - gavėjo pasirinkimo forma
   TIESIOGIAI "Siųsti" veiksmo vietoje ".data-table__actions" eilutėje - TA PATI horizontali
   išdėstymo idėja, kaip tėvinė ".data-table__actions", TIK papildomai centruoja elementus
   pagal aukštį (select/button skirtingo natūralaus aukščio) ir riboja "select" plotį, kad
   ilgas el. pašto adresas neišstumtų kitų stulpelių/mygtukų. */
.inline-send-form {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.inline-send-form select {
    max-width: 11rem;
    font-size: 0.85rem;
}

/* 2026-09-12 audito ratas (vartotojo pasiūlymas, "noriu pasitarti" 4-as punktas - ekrano
   nuotrauka su apibrėžtu "PRIEIGOS BŪSENA" stulpeliu) - Accountants.razor "Prieigos būsena"
   stulpelis anksčiau naudojo BENDRĄ ".data-table__actions" (horizontali eilutė, 0.9rem tarpas)
   trims mygtukams + statuso žymai + <br/> - per ankšta/netvarkinga su tiek elementų viename
   stulpelyje. NAUJA, DEDIKUOTA klasė (NE ".data-table__actions" pakeitimas - ta klasė
   naudojama plačiai kitur, jos keisti NEGALIMA nerizikuojant kitų puslapių išvaizda): vertikalus
   flex stack (statusas viršuje, veiksmų mygtukai apačioje savo eilutėje su mažesniu tarpu ir
   žodžių laužymu, kad netilpę mygtukai nueitų į kitą eilutę, o ne apkarpytų stulpelį). */
.accountant-access-column {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
}

.accountant-access-column__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 0.7rem;
}

/* 2026-09-12/13 audito ratas (40/41 ratai, gyvo testavimo atsiliepimas PAKARTOTINAI) -
   ServiceCatalog.razor "Paslaugų komplektai" - PIRMA pataisa (viena bendra bordered juosta
   viršuje + plika linija apačioje) BUVO nepakankama ("Viskas susilieja, nėra tikslios
   struktūros") - DABAR VISAS komplekto turinys VIENAME, aiškiai apibrėžtame ".package-card"
   konteineryje, PADALINTAS į PAVADINTAS ".package-card__section" pastraipas (žr.
   ServiceCatalog.razor markup komentarą). */
.package-card {
    margin-top: 0.5rem;
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    padding: 0 1.25rem;
    background: var(--ak-surface);
}

.package-card__section {
    padding: 1rem 0;
    border-top: 1px solid var(--ak-border);
}

.package-card__section:first-child {
    border-top: none;
}

.package-card__section-title {
    margin: 0 0 0.6rem;
    font-size: 0.78rem;
    color: var(--ak-muted);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.package-card__rename-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.75rem;
}

/* "min-width: 0" YRA BŪTINAS - vartotojo pastebėtas TIKRAS bug'as ("mygtukas užlipa ant
   langelio"): flex elementas PAGAL NUTYLĖJIMĄ turi "min-width: auto", kuris PRIVERSTINAI
   paima jo VIDINIO turinio (šiuo atveju ".row-input--wide" įvesties lauko) natūralų plotį,
   NEPRIKLAUSOMAI nuo "flex-shrink" - tai gali priversti ŠĮ elementą "persiristi" už savo
   priskirtos vietos ir VIZUALIAI persidengti su GRETA (mygtukų puse) esančiu elementu
   siauresniuose languose/konteineriuose. "flex-shrink: 0" mygtukams - jie NIEKADA neturi
   susispausti/persidengti su kaimynais, VISADA laiko savo natūralų plotį. */
.package-card__rename-row .form-field {
    flex: 1 1 16rem;
    min-width: 0;
    margin: 0;
}

/* Mygtukai (Išsaugoti/Atšaukti) SUGRUPUOTI Į VIENĄ flex elementą - TIK DU flex vaikai
   šioje eilutėje (laukas + šis konteineris), NE trys nepriklausomi, kurie kiekvienas
   galėjo laužtis/persidengti savarankiškai. */
.package-card__rename-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

/* Naikinimo pastraipa - SĄMONINGAI raudonai paryškinta (TA PATI ".status-pill--sustabdytas"
   spalvų pora, kaip visur kitur šiame projekte žymima "dėmesio reikalaujanti" būsena) IR
   "pratęsta" iki paties kortelės apatinio krašto/kampų (neigiamas paraštės kompensavimas),
   kad naikinimo veiksmas atrodytų AKIVAIZDŽIAI atskiras nuo konstruktyvių veiksmų aukščiau. */
.package-card__section--danger {
    margin: 1rem -1.25rem -0.01rem;
    padding: 0.75rem 1.25rem;
    border-top: 1px solid var(--ak-error);
    border-radius: 0 0 7px 7px;
    background: var(--ak-error-bg);
}

/* Aiškus tarpas/linija PRIEŠ "+ Naujas komplektas" skydelį - kad jis NIEKADA nebūtų
   suvokiamas kaip DAR VIENA paskutinio komplekto "kortelės" pastraipa. */
.package-card-list-end {
    margin-top: 1.5rem;
    padding-top: 0.5rem;
    border-top: 1px dashed var(--ak-border);
}

.data-table__row--highlighted {
    background: #fff9e6;
}

/* --- Pradžios puslapis (prisijungusiam vartotojui) --- */
.home-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--ak-border);
}

.home-hero__eyebrow {
    margin: 0 0 0.2rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--ak-accent);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.home-hero__title {
    margin: 0;
    font-size: 2rem;
}

.home-hero__company {
    margin: 0.35rem 0 0;
    color: var(--ak-muted);
    font-size: 0.98rem;
}

.home-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0.85rem;
    margin: 1.5rem 0;
}

.home-stats__tile {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding: 1rem 1.15rem;
    background: var(--ak-surface);
    border: 1px solid var(--ak-border);
    border-left: 3px solid var(--ak-accent);
    border-radius: 8px;
    text-decoration: none;
    color: inherit;
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.home-stats__tile:hover {
    box-shadow: 0 2px 8px rgba(16, 24, 40, 0.08);
}

.home-stats__tile--warning {
    border-left-color: var(--ak-error);
}

.home-stats__value {
    font-family: "Outfit", system-ui, sans-serif;
    font-size: 1.9rem;
    font-weight: 700;
    line-height: 1;
    color: var(--ak-ink);
    font-variant-numeric: tabular-nums;
}

.home-stats__tile--warning .home-stats__value {
    color: var(--ak-error);
}

.home-stats__label {
    font-size: 0.82rem;
    color: var(--ak-muted);
}

.home-quicklinks {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 1rem;
    margin-top: 1.25rem;
}

.home-quicklinks__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6rem;
    padding: 1.5rem 0.75rem;
    background: var(--ak-surface);
    border: 1px solid var(--ak-border);
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    text-align: center;
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.home-quicklinks__item:hover {
    border-color: var(--ak-accent);
    box-shadow: 0 4px 14px rgba(16, 24, 40, 0.1);
    transform: translateY(-2px);
}

.home-quicklinks__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 999px;
    background: var(--ak-bg);
    font-size: 1.3rem;
}

.home-quicklinks__label {
    font-size: 0.88rem;
    font-weight: 600;
}

/* --- Viešas pradžios puslapis (NEprisijungusiam vartotojui, žr. Home.razor NotAuthorized
   šaką) - pilno pločio tamsus "hero", TA PATI gradiento/monogramos dizaino kalba, kaip
   AuthLayout.razor ".auth-brand" (žr. aukščiau) - vartotojo pastebėjimu, ankstesnis plikas
   baltas variantas ("home-splash" žemiau) atrodė kito, prasčiau apipavidalinto produkto
   dalimi. SVARBU: SĄMONINGAI NAUJA, ATSKIRA klasė (NE ".home-splash" pakeitimas) - ".home-splash"
   toliau naudojamas balanso blokavimo ekrane (žr. MainLayout.razor), kurio dizainas
   NEKEIČIAMAS šiuo pakeitimu. */
.home-landing {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - 4.2rem);
    padding: 3.5rem 1.5rem;
    text-align: center;
    background: linear-gradient(160deg, var(--ak-accent-dark) 0%, #16324a 55%, #0f2436 100%);
    color: rgba(255, 255, 255, 0.92);
    box-sizing: border-box;
}

.home-landing__content {
    max-width: 34rem;
}

.home-landing__logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.25rem;
    height: 3.25rem;
    margin: 0 auto 1.5rem;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.22);
    font-family: "Outfit", system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.2rem;
    letter-spacing: 0.02em;
}

.home-landing__eyebrow {
    margin: 0 0 0.5rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.65);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.home-landing__title {
    margin: 0 0 0.85rem;
    font-family: "Outfit", system-ui, sans-serif;
    font-size: 2.3rem;
    color: #fff;
}

.home-landing__lead {
    color: rgba(255, 255, 255, 0.82);
    font-size: 1.05rem;
    line-height: 1.55;
    margin: 0 0 1.75rem;
}

.home-landing__points {
    margin: 0 0 2rem;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
    text-align: left;
}

.home-landing__points li {
    position: relative;
    padding-left: 1.6rem;
    font-size: 0.92rem;
    color: rgba(255, 255, 255, 0.75);
    line-height: 1.4;
}

.home-landing__points li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.4rem;
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #6fb1e0, #3d7fb3);
}

.home-landing__actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.25rem;
    flex-wrap: wrap;
}

/* Baltas mygtukas ant tamsaus fono - bendras ".btn-primary" (mėlynas ant balto fono) čia
   nebūtų pakankamai kontrastingas, žr. komentarą aukščiau apie ".home-landing" foną. */
.home-landing__actions .btn-primary {
    background: #fff;
    color: var(--ak-accent-dark);
}

.home-landing__actions .btn-primary:hover {
    background: rgba(255, 255, 255, 0.88);
}

.home-landing__login {
    color: rgba(255, 255, 255, 0.85);
    text-decoration: underline;
    font-size: 0.92rem;
}

.home-landing__login:hover {
    color: #fff;
}

/* --- Balanso blokavimo ekranas (PRISIJUNGUSIAM, bet sustabdytam/baigusiam balansą vartotojui,
   žr. MainLayout.razor) - TOLIAU naudoja ŠITĄ, senesnę, šviesią stilistiką (NEKEIČIAMA). --- */
.home-splash {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    text-align: center;
}

.home-splash__content {
    max-width: 34rem;
}

.home-splash__eyebrow {
    margin: 0 0 0.5rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--ak-accent);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.home-splash__title {
    margin: 0 0 0.85rem;
    font-size: 2.1rem;
}

.home-splash__lead {
    color: var(--ak-muted);
    font-size: 1.05rem;
    line-height: 1.55;
    margin: 0 0 1.75rem;
}

.home-splash__actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.25rem;
    flex-wrap: wrap;
}

/* --- Naudojimo vadovo apatinis blokas --- */
.guide-footer {
    margin-top: 2.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--ak-border);
}

/* --- Paslaugų katalogo paieška ir žymėjimo (★) mygtukas --- */
.catalog-search {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 1rem 0;
    flex-wrap: wrap;
}

.btn-star {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.1rem;
    color: #d4a72c;
    /* 2026-09-13 audito ratas (suderinamumo patikros ataskaita, 6.1 radinys) - vizualus ★/☆
       ženklas pats YRA mažas (~15×18px), be "padding:0" tikras paspaudimo plotas SUTAPO su juo -
       ant lietimui jautrių ekranų (telefonai/planšetės), TARP glaudžiai išdėstytų lentelės
       eilučių, sunku pataikyti tiksliai. Papildomas "padding" PLEČIA PASPAUDIMO PLOTĄ (≥24×24px,
       žr. WCAG 2.5.8), NEKEIČIANT vizualaus ženklo dydžio - nulinė rizika, grynas UX pagerinimas. */
    padding: 0.35rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-star:hover {
    transform: scale(1.15);
}

/* --- Kliento kainodaros skaičiuoklė --- */

.calc-result {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 0.75rem;
    margin: 1.25rem 0;
}

.calc-result__tile {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    background: var(--ak-surface);
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    padding: 0.85rem 1rem;
}

/* Švelnūs, besikartojantys fonai kas 4 langelius - žr. :root kintamųjų komentarą aukščiau. */
.calc-result__tile:nth-child(4n+1) { background: var(--ak-tile-bg-1); }
.calc-result__tile:nth-child(4n+2) { background: var(--ak-tile-bg-2); }
.calc-result__tile:nth-child(4n+3) { background: var(--ak-tile-bg-3); }
.calc-result__tile:nth-child(4n+4) { background: var(--ak-tile-bg-4); }

/* SVARBU: SPECIFIŠKUMAS - ".calc-result__tile:nth-child(4n+X)" aukščiau turi DVI dalis
   (klasė+pseudoklasė), taigi lygiai tokį patį specifiškumą turinti (irgi DVI klasės) TAISYKLĖ
   ŽEMIAU laimi VIEN DĖL VĖLESNĖS eilės faile (žr. ankstesnę šio failo pamoką apie
   .auth-brand/.row-input kaskados eiliškumą) - vien ".calc-result__tile--warning" (VIENA
   klasė) PRALAIMĖTŲ prieš nth-child nepriklausomai nuo eilės, nes jo specifiškumas mažesnis. */
.calc-result__tile.calc-result__tile--warning {
    background: var(--ak-error-bg);
}

.calc-result__label {
    font-size: 0.78rem;
    color: var(--ak-muted);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.calc-result__value {
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--ak-accent-dark);
    font-variant-numeric: tabular-nums;
}

.coef-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 0.6rem 1.5rem;
    margin: 0.75rem 0 1.5rem;
}

.coef-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.92rem;
    /* 2026-09-13 audito ratas (suderinamumo patikros ataskaita, 6.2 radinys) - VISA eilutė
       (varnelė + tekstas) YRA paspaudžiama (žr. <label> apgaubimą markup'e), BET be šio
       "padding" jos aukštis buvo TIK ~20px - nežymiai žemiau WCAG 2.5.8 (AA) 24px minimumo
       tarpams tarp gretimų eilučių lietimui jautriuose ekranuose. */
    padding: 0.3rem 0;
}

/* 2026-09-11 audito ratas (9 punktų atsiliepimo 5-as punktas) - registracijos/buhalterio
   aktyvacijos "sutinku su sąlygomis" varnelė - TA PATI ".coef-item" bendra idėja
   (flex, varnelė + tekstas eilutėje), TIK su viršutiniu lygiavimu (varnelė), nes tekstas
   ilgesnis ir gali užsilenkti į kelias eilutes. */
.consent-checkbox {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    font-size: 0.9rem;
    margin: 0.9rem 0;
}

.consent-checkbox input[type="checkbox"] {
    margin-top: 0.2rem;
}

.calc-table select,
.calc-table .calc-qty {
    padding: 0.35rem 0.5rem;
    border: 1px solid var(--ak-border);
    border-radius: 5px;
    font-size: 0.88rem;
}

.calc-qty {
    width: 5.5rem;
    font-variant-numeric: tabular-nums;
}

.calc-table {
    font-size: 0.85rem;
}

/* "+ Pridėti paslaugą klientui" skleidžiamas blokas (žr. ClientCalculator.razor punktas 5) -
   sąmoningai paprastas <details>/<summary>, be JS, kad būtų suderinamas su puslapio statiniu
   (SSR) atvaizdavimu (žr. failo viršuje esantį komentarą apie <form>). */
.service-picker {
    margin: 1rem 0;
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    padding: 0.75rem 1rem;
    background: var(--ak-surface);
}

.service-picker summary {
    cursor: pointer;
    font-weight: 600;
    color: var(--ak-accent-dark);
}

.service-picker summary::marker {
    color: var(--ak-accent);
}

.service-picker[open] summary {
    margin-bottom: 0.75rem;
}

.doc-links {
    background: var(--ak-surface);
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    padding: 0.75rem 1rem;
    display: flex;
    gap: 0.5rem;
    align-items: center;
    font-size: 0.92rem;
}

.doc-links a {
    color: var(--ak-accent-dark);
    text-decoration: none;
}

.doc-links a:hover {
    text-decoration: underline;
}

/* PVM sąskaitos faktūros forma (žr. ClientEdit.razor) - vienintelis "doc-links" elementas su
   rankiniu tekstiniu lauku, todėl reikia truputi platesnio įvesties (nei .row-input 6rem) ir
   leidimo suspausti į kitą eilutę mažame ekrane. */
.doc-links--invoice {
    flex-wrap: wrap;
}

.doc-links__invoice-input {
    width: 11rem;
}

/* Kompaktiška "PDF" nuoroda šalia kiekvieno ".docx" dokumento - žr. LibreOfficePdfConverter. */
.doc-links__pdf {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    padding: 0.1rem 0.4rem;
    border: 1px solid var(--ak-border);
    border-radius: 4px;
    color: var(--ak-muted) !important;
    margin-left: -0.25rem;
}

.doc-links__pdf:hover {
    border-color: var(--ak-accent);
    color: var(--ak-accent-dark) !important;
    text-decoration: none !important;
}

/* Balansas - papildymo sumų mygtukai (žr. Balance.razor) - vartotojo pastebėta, kad esamas
   ".btn-primary--small" + ".doc-links__pdf" derinys buvo per mažas, dėmesys nevalingai
   krypdavo į šalia esančią ".docx" nuorodą. Šios klasės TAIKOMOS TIK Balance.razor kontekste
   (naujos, atskiros nuo bendrų ".btn-primary--small"/".doc-links__pdf", kad nepaveiktų kitur
   programoje naudojamų tų pačių bendrų klasių). */
.balance-topup {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.balance-topup__primary {
    padding: 0.7rem 1.4rem;
    font-size: 1.05rem;
    font-weight: 600;
}

.balance-topup__secondary {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    padding: 0.1rem 0.35rem;
    border: 1px solid var(--ak-border);
    border-radius: 4px;
    color: var(--ak-muted) !important;
    text-decoration: none;
}

.balance-topup__secondary:hover {
    border-color: var(--ak-accent);
    color: var(--ak-accent-dark) !important;
    text-decoration: none !important;
}

/* 2026-09-13 audito ratas (Balance.razor "Buhalterių mini-kabinetai", vartotojo prašymu -
   "gražiai patalpintas [tekstas], gal su šauktukų... nes yra rizika netyčia paspausti mygtuką").
   Aiškiai atskirta, gintarinės spalvos "dėmesio" dėžutė (žr. --ak-warning* aukščiau) PRIEŠ
   patį aktyvavimo/išjungimo mygtuką - TA PATI "aiškiai atskirtas nuo įprasto teksto" idėja,
   kaip ".package-card__section--danger", BET gintarinė (caution), NE raudona (error/danger) -
   veiksmas savaime nėra klaida, tik reikalauja SĄMONINGO dėmesio prieš paspaudžiant. */
.balance-commitment-warning {
    margin: 1rem 0;
    padding: 1rem 1.25rem;
    border: 1px solid var(--ak-warning-border);
    border-radius: 8px;
    background: var(--ak-warning-bg);
    color: var(--ak-ink);
}

.balance-commitment-warning__title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: "Outfit", system-ui, sans-serif;
    font-weight: 700;
    color: var(--ak-warning);
    margin-bottom: 0.5rem;
}

.balance-commitment-warning p {
    margin: 0.4rem 0;
}

.balance-commitment-warning ul {
    margin: 0.4rem 0 0.4rem 1.2rem;
    padding: 0;
}

.balance-commitment-warning li {
    margin: 0.25rem 0;
}

.balance-commitment-warning strong {
    color: var(--ak-warning);
}

/* 2026-09-14 ratas (Templates.razor, vartotojo pastebėjimas - žymų {{tokiu formatu}} nekeisti
   perspėjimas) - TA PATI gintarinė "dėmesio" dėžutės struktūra/spalvos, kaip
   ".balance-commitment-warning" aukščiau, TIK pervadinta šiam, visai kitokiam kontekstui
   (šablonų žymos, ne finansinis įsipareigojimas) - taisyklės TYČIA dubliuojamos (ne
   sujungiamos į vieną bendrą klasę), kad kiekvienas kontekstas liktų nepriklausomas, jei
   vėliau prireiktų juos keisti atskirai. */
.template-tag-warning {
    margin: 1rem 0;
    padding: 1rem 1.25rem;
    border: 1px solid var(--ak-warning-border);
    border-radius: 8px;
    background: var(--ak-warning-bg);
    color: var(--ak-ink);
}

.template-tag-warning__title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: "Outfit", system-ui, sans-serif;
    font-weight: 700;
    color: var(--ak-warning);
    margin-bottom: 0.5rem;
}

.template-tag-warning p {
    margin: 0.4rem 0;
}

.template-tag-warning ul {
    margin: 0.4rem 0 0.4rem 1.2rem;
    padding: 0;
}

.template-tag-warning li {
    margin: 0.25rem 0;
}

.template-tag-warning strong {
    color: var(--ak-warning);
}

/* 2026-09-13 audito ratas (nemokamas bandomasis periodas, vartotojo klausimas "O jei norės
   iš pradžių išbandyti?", "1 variantas") - TA PATI dėžutės struktūra, kaip
   ".balance-commitment-warning" aukščiau, BET ŽALIA/teigiama (--ak-ok*) spalva - Organizacijos
   PIRMAM aktyvavimui realaus finansinio pavojaus NĖRA, taigi griežtas gintarinis įspėjimas
   čia būtų KLAIDINANTIS - vietoj to draugiškas, kviečiantis tonas. */
.balance-trial-offer {
    margin: 1rem 0;
    padding: 1rem 1.25rem;
    border: 1px solid var(--ak-ok);
    border-radius: 8px;
    background: var(--ak-ok-bg);
    color: var(--ak-ink);
}

.balance-trial-offer__title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: "Outfit", system-ui, sans-serif;
    font-weight: 700;
    color: var(--ak-ok);
    margin-bottom: 0.5rem;
}

.balance-trial-offer ul {
    margin: 0.4rem 0 0 1.2rem;
    padding: 0;
}

.balance-trial-offer li {
    margin: 0.25rem 0;
}

.balance-trial-offer strong {
    color: var(--ak-ok);
}

/* Plotis - "Kiekis" tipo siaurų lentelės langelių savybė. Kontūras/aukštis/šešėlis apibrėžti
   VIENAME bendrame taisyklės sąraše aukščiau (žr. ".row-input" kartu su .form-field įvestimis),
   kad NEDUBLIUOTŲSI ir NESUSIKIRSTŲ per CSS "cascade" tvarką. */
.row-input {
    width: 6rem;
}

/* Vartotojo pastebėta: TA PATI 6rem plotis, tinkanti trumpiems skaičiams ("Kiekis", "Data"),
   sukėlė "netvarkingą" atrodymą <select> laukams su ilgesniu tekstu (pvz. "Į paslaugų kainą
   neįtraukta", "(numatytoji: Vykdytojas)") - tekstas nutrūkdavo/nesimatė. "auto" + min-width
   leidžia <select> laukui prisitaikyti prie savo turinio, bet neapsiriboti 6rem. */
select.row-input {
    width: auto;
    min-width: 11rem;
    max-width: 100%;
}

/* 28 ratas (36 punktų sąrašo 13 p.) - TA PATI priežastis/schema, kaip select.row-input
   aukščiau: bendras 6rem plotis TINKAMAS trumpiems skaičiams, BET "yyyy-mm-dd" tekstas +
   naršyklės savo kalendoriaus piktograma (AML/KYC vertinimo datos laukai) į 6rem NETELPA -
   data/piktograma persidengia arba nusikirpsta. */
input[type="date"].row-input {
    width: auto;
    min-width: 9.5rem;
}

.row-input--wide {
    width: 100%;
    min-width: 220px;
}

.calc-preview {
    font-size: 1.15rem;
    color: var(--ak-accent-dark);
    font-variant-numeric: tabular-nums;
}

/* Aiškiai atskirta "kortelė" "Darbo valandų per mėnesį" + "Apskaičiuota savikaina" laukams -
   žr. Parameters.razor komentarą, kodėl šis blokas anksčiau "pasimesdavo" tarp lentelės/mygtukų. */
.worked-hours-panel {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    align-items: flex-end;
    background: var(--ak-bg);
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    padding: 0.85rem 1rem;
    margin: 1rem 0;
}

.data-table tfoot td {
    font-weight: 600;
    border-top: 2px solid var(--ak-border);
    border-bottom: none;
}

.criterion-block {
    background: var(--ak-surface);
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
}

/* 2026-09-11 audito ratas (4-as punktas, "Kliento klasifikavimo nustatymai" akordiono
   prašymas) - .criterion-block DABAR yra <details>, o šis header - jo <summary> - VIS TIEK
   turi tą pačią header'io išvaizdą, kai <details> ATVERTAS (žr. [open] taisyklę žemiau), TIK
   UŽDARYTAS rodo VIENOS eilutės santrauką (žr. .criterion-block__summary-line). */
.criterion-block > summary {
    cursor: pointer;
    list-style: none;
}

.criterion-block > summary::-webkit-details-marker {
    display: none;
}

.criterion-block__summary-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    font-weight: 600;
}

.criterion-block__summary-line::before {
    content: "▸";
    color: var(--ak-muted);
    margin-right: 0.5rem;
    display: inline-block;
    transition: transform 0.15s ease;
}

.criterion-block[open] > summary .criterion-block__summary-line::before {
    transform: rotate(90deg);
}

.criterion-block__count {
    color: var(--ak-muted);
    font-weight: 400;
    font-size: 0.85rem;
    white-space: nowrap;
}

.criterion-block__header {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin: 0.75rem 0 0.75rem;
}

.criterion-block__header .row-input--wide {
    font-weight: 600;
}

/* Bendra didesnė "akordiono" schema - TOP-LEVEL puslapio sekcijos (žr. ClassificationSettings.razor
   "Kriterijai ir pasirinkimai"/"Kliento kategorijos"/"Health Score kriterijai") - PATI TA
   PATI idėja, kaip .criterion-block aukščiau, TIK vienu lygiu didesnė (kortelė KIEKVIENAI
   didelei sekcijai, o ne kiekvienam kriterijui). Uždaryta pagal nutylėjimą - vartotojo aiškiai
   paprašyta "atskirų blokų akordiono", nes visas ekranas iš karto buvo per sudėtingas. */
.settings-section {
    background: var(--ak-surface);
    border: 1px solid var(--ak-border);
    border-radius: 10px;
    padding: 0 1.5rem;
    margin: 1.5rem 0;
}

.settings-section > summary {
    cursor: pointer;
    list-style: none;
    padding: 1.25rem 0;
    font-family: "Outfit", system-ui, sans-serif;
    font-size: 1.1rem;
    font-weight: 600;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
}

.settings-section > summary::-webkit-details-marker {
    display: none;
}

.settings-section > summary::before {
    content: "▸";
    color: var(--ak-accent);
    margin-right: 0.65rem;
    display: inline-block;
    transition: transform 0.15s ease;
}

.settings-section[open] > summary::before {
    transform: rotate(90deg);
}

.settings-section__hint {
    font-size: 0.85rem;
    font-weight: 400;
    color: var(--ak-muted);
}

.settings-section__body {
    padding-bottom: 1.5rem;
    border-top: 1px solid var(--ak-border);
    padding-top: 1.25rem;
}

.task-row--done td {
    color: var(--ak-muted);
    text-decoration: line-through;
}

/* 18 ratas (36 punktų sąrašo 18 p.) - Užduočių "board" (lengvesnis Kanban-panašus vaizdas
   pagal Prioritetą, BE vilkimo), žr. ClientCrm.razor. */
.task-board {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-bottom: 1rem;
}

@media (max-width: 780px) {
    .task-board {
        grid-template-columns: 1fr;
    }
}

.task-board__column {
    background: var(--ak-bg);
    border: 1px solid var(--ak-border);
    border-radius: 10px;
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.task-board__column-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 0.25rem;
    font-size: 0.95rem;
}

.task-board__count {
    color: var(--ak-muted);
    font-weight: 400;
}

.task-board__empty {
    margin: 0;
}

.task-card {
    background: var(--ak-surface);
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    padding: 0.6rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.task-card--done {
    opacity: 0.65;
}

.task-card--done .task-card__done span {
    text-decoration: line-through;
    color: var(--ak-muted);
}

.task-card__done {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    cursor: pointer;
}

.task-card__meta {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    font-size: 0.85rem;
}

.task-card__due {
    color: var(--ak-muted);
}

/* --- Pradinis diegimas (Onboarding checklist, 15 ratas) --- */

.onboarding-progress {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 1rem 0 1.5rem;
}

.onboarding-progress__bar {
    flex: 1;
    height: 0.6rem;
    background: var(--ak-border);
    border-radius: 999px;
    overflow: hidden;
}

.onboarding-progress__fill {
    height: 100%;
    background: var(--ak-accent);
    border-radius: 999px;
    transition: width 0.2s ease;
}

.onboarding-progress__label {
    font-weight: 600;
    color: var(--ak-accent-dark);
    white-space: nowrap;
}

.onboarding-list {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.onboarding-list__item {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.6rem 0.8rem;
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    cursor: pointer;
}

.onboarding-list__text {
    flex: 1;
}

.onboarding-list__text--done {
    color: var(--ak-muted);
    text-decoration: line-through;
}

.onboarding-list__date {
    font-size: 0.85rem;
    color: var(--ak-muted);
}

/* 2026-09-13 audito ratas ("Išsaugotos ataskaitos" / "Saved Reports") - vieno kliento vieno
   periodo checklisto kortelė (žr. SavedReports.razor/SavedReportsAdmin.razor) - TA PATI
   bordered-card + <details>/<summary> idėja, kaip ".package-card" (žr. ServiceCatalog.razor),
   TIK "summary" atvaizduoja klientą + statuso ženklelį + progresą VIENOJE eilutėje (analogiška
   ".analytics-bar-row > summary" grid schema). */
.monthly-checklist-card {
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    margin: 0.75rem 0;
    overflow: hidden;
}

.monthly-checklist-card > summary {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    cursor: pointer;
    list-style: none;
    background: var(--ak-bg);
}

.monthly-checklist-card > summary::-webkit-details-marker {
    display: none;
}

.monthly-checklist-card__client {
    font-weight: 600;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.monthly-checklist-card .collapsible-form__body {
    margin-top: 0;
    padding: 0.85rem 1rem 1rem;
    border-top: 1px solid var(--ak-border);
}

.monthly-checklist-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.monthly-checklist-list__item {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.4rem 0;
    border-bottom: 1px solid var(--ak-border);
}

.monthly-checklist-list__item:last-child {
    border-bottom: none;
}

.monthly-checklist-list__item label {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    cursor: pointer;
}

.monthly-checklist-list__text--done {
    color: var(--ak-muted);
    text-decoration: line-through;
}

.monthly-checklist-list__meta {
    margin-left: auto;
    font-size: 0.8rem;
    white-space: nowrap;
}

/* --- Paslaugos laikmatis --- */

.timer-layout {
    display: grid;
    grid-template-columns: minmax(240px, 320px) 1fr;
    gap: 1.5rem;
    align-items: start;
}

@media (max-width: 720px) {
    .timer-layout {
        grid-template-columns: 1fr;
    }
}

.timer-layout__list {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.timer-service-list {
    max-height: 480px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    padding: 0.4rem;
    background: var(--ak-surface);
}

.timer-service-row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.15rem;
    width: 100%;
    text-align: left;
    background: none;
    border: 1px solid transparent;
    border-radius: 6px;
    padding: 0.5rem 0.6rem;
    cursor: pointer;
    font-family: inherit;
}

.timer-service-row:hover {
    background: var(--ak-bg);
}

.timer-service-row--selected {
    background: var(--ak-bg);
    border-color: var(--ak-accent);
}

.timer-service-row__name {
    font-size: 0.9rem;
    color: var(--ak-ink);
}

.timer-service-row__meta {
    font-size: 0.78rem;
    color: var(--ak-muted);
}

.timer-custom-name {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    border-top: 1px solid var(--ak-border);
    padding-top: 0.6rem;
}

.timer-custom-name label {
    font-size: 0.82rem;
    color: var(--ak-muted);
}

.timer-layout__panel {
    background: var(--ak-surface);
    border: 1px solid var(--ak-border);
    border-radius: 8px;
    padding: 1.25rem 1.5rem;
}

.timer-display {
    font-size: 3rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--ak-accent-dark);
    margin: 0.75rem 0;
}

/* 2026-09-13 audito ratas (gyvo testavimo atsiliepimas, 2 punktas - "didžiulis laisvas tarpas
   Įmonės profilio puslapyje... šitą plotą galima naudoti kaip reklaminį banerį"). DVIEJŲ
   stulpelių išdėstymas - PAGRINDINIS turinys kairėje (siauresnis, kaip anksčiau, žr.
   ".profile-form" aukščiau), reklaminis skydelis dešinėje LAISVOJE vietoje (žr.
   ".app-shell--sidebar .app-main" komentarą, KODĖL ta vieta anksčiau buvo tuščia).
   "flex-wrap:wrap" - siaurame ekrane skydelis PATS nukrenta ŽEMIAU pagrindinio turinio
   (NEREIKIA atskiros media taisyklės). */
.page-with-banner {
    display: flex;
    gap: 2rem;
    align-items: flex-start;
    flex-wrap: wrap;
    margin-top: 1.5rem;
}

.page-with-banner__main {
    flex: 3 1 560px;
    min-width: 0;
    max-width: 760px;
}

.page-with-banner__side {
    flex: 2 1 280px;
    min-width: 0;
    max-width: 380px;
}

/* "Neerzinantis, bet parduodantis" reklaminis skydelis (vartotojo TIKSLIAI tokiais žodžiais
   apibrėžtas reikalavimas) - švelnus akcentinis rėmelis/fonas (TA PATI ".calc-result__tile"
   pilka-melsva atspalvio idėja, NE ryškus/šaukiantis dizainas), "sticky" - kaireje ilgai
   slenkant formą, skydelis LIEKA matomas (bet NIEKADA neuzblokuoja turinio - tik minkštas
   "prilipimas" prie viršaus). */
.promo-banner {
    border: 1px solid var(--ak-accent);
    border-radius: 10px;
    background: var(--ak-tile-bg-1);
    padding: 1.25rem 1.5rem;
    position: sticky;
    top: 1rem;
}

.promo-banner__title {
    font-family: "Outfit", system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--ak-accent-dark);
    margin-bottom: 0.6rem;
}

.promo-banner__body {
    white-space: pre-wrap;
    color: var(--ak-ink);
    line-height: 1.55;
    margin: 0 0 1rem;
}

.promo-banner__cta {
    display: inline-block;
}

/* 2026-09-13 audito ratas (suderinamumo patikros ataskaita, 6.3 radinys - "Blazor Server
   nutrūkusio ryšio atstatymo langas nestilizuotas/nelokalizuotas"). Blazor Server (žr.
   Program.cs .AddInteractiveServerRenderMode()) PATS (per _framework/blazor.web.js, KLASĖ
   "ReconnectDisplay") sukuria <div id="components-reconnect-modal"> su INLINE stiliais
   (position:fixed visą ekraną, fonas #fff, opacity 0.8) IR PATS prideda/nuima klases
   "components-reconnect-show/-hide/-failed/-rejected" - ŠIE PAVADINIMAI YRA STABILUS,
   DOKUMENTUOTAS Microsoft viešas customizavimo API (patikrinta TIESIOGIAI faktiniame
   /_framework/blazor.web.js turinyje, NE spėta iš atminties), taigi šis CSS blokas SAUGUS
   naudoti. TEKSTO lokalizaciją (JS "textContent" pakeitimas, kadangi Blazor pats įrašo
   ANGLIŠKĄ tekstą per JS, NE per CSS "content") žr. site.js "reconnect-lt" IIFE.
   "!important" BŪTINAS TIK toms savybėms, kurias Blazor PATS nustato INLINE (background-color/
   opacity) - inline stilius visada laimėtų prieš paprastą CSS taisyklę. */
#components-reconnect-modal {
    background: rgba(28, 37, 48, 0.55) !important;
    opacity: 1 !important;
    font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
}

#components-reconnect-modal h5 {
    display: inline-block;
    max-width: 26rem;
    margin: 0 !important;
    padding: 1.5rem 2rem;
    background: var(--ak-surface);
    color: var(--ak-ink);
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(16, 24, 40, 0.18);
    font-family: "Outfit", system-ui, sans-serif;
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.5;
}

#components-reconnect-modal h5 a {
    color: var(--ak-accent);
    text-decoration: underline;
    cursor: pointer;
}

#components-reconnect-modal button {
    display: inline-block;
    margin-top: 0.75rem !important;
    background: var(--ak-accent);
    color: #fff;
    border: none;
    padding: 0.5rem 1.1rem;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
}

/* Sukimosi indikatorius ("this.loader" blazor.web.js) - inline-block ŠALIA h5 kortelės (JIS
   NĖRA jos viduje, žr. "this.message.after(this.loader)" faktiniame turinyje) - spalvos
   nustatytos INLINE (mėlynas #3498db), taigi TIK vertikalus lygiavimas/tarpas keičiamas ČIA. */
#components-reconnect-modal h5 + div {
    vertical-align: middle;
    margin-left: 0.75rem;
}
