/* =====================================================================
   Theme: azure — „Azure" (7.99.0), převzatý z naší parkovací aplikace
   (VZHLED_Azure/azure-theme.css). Nahradil vzhled „Čistá voda".
   Sytě modré boční menu na svislém přechodu se zářemi v rozích, bílá aktivní
   položka, karty s modrým (ne šedým) stínem, dlaždice čísel s barevným pruhem,
   hlavní tlačítka v přechodu modrá → indigo. Tmavý režim je tmavě modrý, ne šedý,
   a stavové barvy se v něm obracejí na světlé tóny.

   Jak to funguje: style.css definuje sémantické tokeny na :root; tady je
   PŘEPISUJEME v rozsahu <body class="theme-azure">, takže views ani komponenty
   nic nevědí — mění se jen hodnoty. Token nastavený na body přebije i tmavou
   hodnotu z :root, proto má každý token z prvního bloku pár v tmavém bloku.
   Úpravy komponent jsou pod :where(body.theme-azure) — specificita zůstane jako
   u základního pravidla ve style.css, takže kontextová pravidla stránek
   (.sidebar-footer .btn-ghost, .btn-outline.text-danger, utility) dál vyhrají.
   Kontrast textu min. 4,5:1 v obou režimech — hodnoty jsou z Azure spočítané,
   při změně barvy ho ověřit znovu.
   Načítá se jen pro uživatele s vzhled = 'azure' (header.php).
   ===================================================================== */

body.theme-azure {
    /* Modrá značky. -400/-300 mají v tmavém režimu vlastní (světlejší) hodnotu. */
    --brand-50:  #eff6ff;
    --brand-100: #dbeafe;
    --brand-300: #93c5fd;
    --brand-400: #5a95ef;
    --brand-500: #3b82f6;
    --brand-600: #2563eb;
    --brand-700: #1d4ed8;
    --brand-800: #1a3a9c;
    --brand-900: #13286b;

    /* Vlastní tokeny vzhledu (--az-*). Pevné barvy jen v přechodech a pod bílým textem. */
    --az-font: system-ui, -apple-system, "Segoe UI Variable Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --az-grad-primary: linear-gradient(135deg, #2563eb 0%, #1d4ed8 50%, #4f46e5 100%);
    --az-shadow-btn: 0 4px 14px rgba(37,99,235,.32);
    --az-shadow-btn-hover: 0 6px 18px rgba(37,99,235,.42);
    --az-sidebar-grad:
        radial-gradient(120% 45% at 0% 0%, rgba(56,189,248,.30), transparent 60%),
        radial-gradient(90% 40% at 100% 100%, rgba(129,140,248,.35), transparent 65%),
        linear-gradient(180deg, #13286b 0%, #1a3a9c 48%, #1d4ed8 100%);
    --az-sidebar-active: #ffffff;
    --az-ink: var(--brand-600);           /* ikony v hlavičkách karet */
    --az-active-ink: var(--brand-700);    /* aktivní položka spodní lišty, hover ikonových tlačítek */
    --az-btn-text: var(--brand-800);      /* text vedlejšího tlačítka a přepínače firmy */
    --az-focus: var(--brand-600);
    --az-table-head-bg: #eef4ff;
    --az-table-head-text: #1a3a9c;
    /* Plné výplně s bílým textem — v obou režimech sytě, světlý tón by bílý text nepřečetl. */
    --az-danger-solid: #d0283a;
    --az-danger-solid-hover: #a91d2d;
    --az-success-solid: #15803d;
    --az-success-solid-hover: #166534;
    /* Čísla v menu: plná výplň, číslo bílé (5,5:1 a 5,4:1). */
    --az-count-critical-bg: #c62d3b;
    --az-count-critical-fg: #ffffff;
    --az-count-action-bg: #9a5c00;
    --az-count-action-fg: #ffffff;

    /* Plocha a povrchy — světle modrošedé pozadí s jemnou září v horních rozích. */
    --bg:               #f3f7ff;
    --bg-gradient:
        radial-gradient(900px 420px at 100% -8%, rgba(56,189,248,.16), transparent 62%),
        radial-gradient(800px 380px at -6% -4%, rgba(99,102,241,.10), transparent 60%);
    --surface:          #ffffff;
    --surface-2:        #f6f9ff;
    --surface-3:        #e9f0fd;
    --border:           #dfe7f5;
    --border-strong:    #c3d1ea;
    --text:             #1b2640;
    --text-strong:      #0c1a45;
    --text-muted:       #55627e;
    --link:             #1d4ed8;
    --link-hover:       #1a3a9c;
    --primary-soft:     #e3edff;
    --primary-soft-text: #1a3a9c;
    --focus-ring:       rgba(37,99,235,.22);

    /* Stavové barvy — -600 slouží i jako text, drží 4,5:1 na bílé i na soft podkladu. */
    --success-600: #15803d; --success-700: #166534;
    --warning-600: #9a5c00; --warning-700: #8a4b00;
    --danger-600:  #c62d3b; --danger-700:  #9c1f2b;
    --info-600:    #0369a1;
    --soft-success-bg:  #dcfce7;
    --soft-warning-bg:  #fef3c7;
    --soft-danger-bg:   #ffe4e6;
    --soft-info-bg:     #e0f2fe;

    /* Boční menu — přechod nese --az-sidebar-grad, tady barva pod ním a texty.
       Nadpis skupiny #d4e0ff drží 4,5:1 i dole na přechodu (#1d4ed8). */
    --sidebar-bg:           #13286b;
    --sidebar-bg-2:         #13286b;
    --sidebar-border:       rgba(255,255,255,.12);
    --sidebar-text:         #dbe6ff;
    --sidebar-text-strong:  #ffffff;
    --sidebar-text-muted:   #d4e0ff;
    --sidebar-hover:        rgba(255,255,255,.13);
    --sidebar-active-text:  #1d4ed8;
    --sidebar-shadow:       none;
    --sidebar-glow:         transparent;

    /* Hlavička — průsvitná s rozmazáním. */
    --header-bg:        rgba(255,255,255,.82);
    --header-border:    #dfe7f5;

    /* Zaoblení: tlačítko a pole 10, zpráva a ikonové tlačítko 12, karta 16, přihlášení 22. */
    --radius-sm: 10px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 22px;
    /* Stíny jsou ve světlém režimu modré (z --brand-700) — velký kus dojmu „Azure". */
    --shadow-xs: 0 1px 2px rgba(29,78,216,.06), 0 6px 20px rgba(29,78,216,.07);
    --shadow-sm: 0 2px 4px rgba(29,78,216,.06), 0 8px 22px rgba(29,78,216,.09);
    --shadow-md: 0 12px 32px rgba(29,78,216,.16);
    --shadow-lg: 0 12px 32px rgba(29,78,216,.16);
    --shadow-xl: 0 24px 60px rgba(6,20,60,.30);
    --shadow-glow: 0 0 0 4px rgba(37,99,235,.22);

    font-family: var(--az-font);
}

:root[data-theme="dark"] body.theme-azure {
    --brand-400: #7cb3ff;
    --brand-300: #a5c8ff;

    --az-sidebar-grad:
        radial-gradient(120% 45% at 0% 0%, rgba(56,189,248,.18), transparent 60%),
        radial-gradient(90% 40% at 100% 100%, rgba(129,140,248,.22), transparent 65%),
        linear-gradient(180deg, #0b1640 0%, #13286b 55%, #1a3a9c 100%);
    --az-sidebar-active: #dbe7ff;
    --az-shadow-btn: 0 4px 14px rgba(37,99,235,.40);
    --az-ink: var(--brand-400);
    --az-active-ink: var(--brand-300);
    --az-btn-text: var(--text-strong);
    --az-focus: #60a5fa;
    --az-table-head-bg: #15244a;
    --az-table-head-text: #c5d8ff;
    /* Tmavý režim: světlé výplně s tmavým číslem (6,8:1 a 9,3:1). */
    --az-count-critical-bg: #ff6b78;
    --az-count-critical-fg: #0a1122;
    --az-count-action-bg: #f0a83a;
    --az-count-action-fg: #0a1122;

    --bg:               #0a1122;
    --bg-gradient:
        radial-gradient(900px 420px at 100% -8%, rgba(56,189,248,.10), transparent 62%),
        radial-gradient(800px 380px at -6% -4%, rgba(99,102,241,.10), transparent 60%);
    --surface:          #101a31;
    --surface-2:        #14213d;
    --surface-3:        #1a2a4b;
    --border:           #22345a;
    --border-strong:    #31476f;
    --text:             #dfe7f6;
    --text-strong:      #ffffff;
    --text-muted:       #9aabc8;
    --link:             #7cb3ff;
    --link-hover:       #a5c8ff;
    --primary-soft:     #172a55;
    --primary-soft-text: #c5d8ff;
    --focus-ring:       rgba(96,165,250,.30);

    /* Obrácená stavová škála: -600/-700 světlé tóny na tmavém podkladu, soft podklady tmavé. */
    --success-600: #3ccf7f; --success-700: #7fe0aa;
    --warning-600: #f0a83a; --warning-700: #f6c277;
    --danger-600:  #ff6b78; --danger-700:  #ff9aa3;
    --info-600:    #67c3f3;
    --soft-success-bg:  #0f3324;
    --soft-warning-bg:  #3a2a0a;
    --soft-danger-bg:   #3d141b;
    --soft-info-bg:     #0d2c47;

    --sidebar-bg:           #0b1640;
    --sidebar-bg-2:         #0b1640;
    --sidebar-border:       rgba(255,255,255,.10);
    --sidebar-text:         #c9d7f5;
    --sidebar-text-strong:  #ffffff;
    --sidebar-text-muted:   #8fb0f5;
    --sidebar-hover:        rgba(255,255,255,.10);
    --sidebar-active-text:  #13286b;

    --header-bg:        rgba(16,26,49,.82);
    --header-border:    #22345a;

    --shadow-xs: 0 1px 2px rgba(0,0,0,.35), 0 6px 20px rgba(0,0,0,.28);
    --shadow-sm: 0 2px 4px rgba(0,0,0,.40), 0 8px 22px rgba(0,0,0,.32);
    --shadow-md: 0 12px 32px rgba(0,0,0,.45);
    --shadow-lg: 0 12px 32px rgba(0,0,0,.45);
    --shadow-xl: 0 24px 56px rgba(0,0,0,.60);
    --shadow-glow: 0 0 0 4px rgba(96,165,250,.30);
}

body.theme-azure ::selection { background: var(--brand-100); color: var(--text-strong); }
:root[data-theme="dark"] body.theme-azure ::selection { background: var(--brand-800); color: #fff; }

/* === Boční menu === */
:where(body.theme-azure) .app-sidebar {
    background-color: var(--sidebar-bg);
    background-image: var(--az-sidebar-grad);
    border-right: 0;
}
:where(body.theme-azure) .app-sidebar .sidebar-brand { background: none; }
/* Logo v barevném čtverečku — tentýž přechod jako hlavní tlačítka; tenký světlý okraj ho odliší od modrého menu. */
:where(body.theme-azure) .sidebar-brand-icon {
    width: 34px; height: 34px; border-radius: 10px;
    background: var(--az-grad-primary);
    box-shadow: var(--az-shadow-btn), inset 0 0 0 1px rgba(255,255,255,.22);
}
:where(body.theme-azure) .sidebar-brand-name { font-weight: 800; font-size: 1.05rem; }
:where(body.theme-azure) .sidebar-nav { padding: .75rem .65rem; gap: .1rem; scrollbar-color: rgba(255,255,255,.28) transparent; }
:where(body.theme-azure) .sidebar-nav-section { font-size: .7rem; font-weight: 800; letter-spacing: .09em; padding: .9rem .8rem .3rem; }
:where(body.theme-azure) .nav-link {
    gap: .7rem; padding: .55rem .8rem; border: 0; border-radius: 12px; font-size: .93rem;
}
/* Aktivní položka = bílá „pilulka" s modrým textem. */
:where(body.theme-azure) .nav-link.active {
    background: var(--az-sidebar-active); color: var(--sidebar-active-text);
    border: 0; font-weight: 700; box-shadow: 0 6px 16px rgba(6,20,60,.28);
}
/* Ikony v menu jednobarevné (styl Lucide), barevné čtverečky jsou věc vzhledu Moderní. */
:where(body.theme-azure) .nav-icon { color: inherit; opacity: .9; }
:where(body.theme-azure) .nav-link.active .nav-icon { opacity: 1; }
/* Čísla v menu: plná výplň; kritické (červené) má navíc vnitřní okraj, aby barva nebyla jediný rozdíl. */
:where(body.theme-azure) .sidebar-nav .badge { border: 0; min-width: 20px; justify-content: center; padding: .1rem .4rem; font-weight: 800; }
:where(body.theme-azure) .sidebar-nav .badge-warning { background: var(--az-count-action-bg); color: var(--az-count-action-fg); box-shadow: none; }
:where(body.theme-azure) .sidebar-nav .badge-danger {
    background: var(--az-count-critical-bg); color: var(--az-count-critical-fg);
    box-shadow: inset 0 0 0 2px var(--az-count-critical-fg);
}
:where(body.theme-azure) .sidebar-footer { background: rgba(0,0,0,.12); }
/* Modrý obrys fokusu by na přechodu menu měl jen 1,3–2,6:1, bílý má 6,7:1 a víc. */
body.theme-azure .sidebar-nav .nav-link:focus-visible,
body.theme-azure .sidebar-footer .btn:focus-visible { outline-color: #fff; }

/* === Hlavička — průsvitná, rozmazaná === */
:where(body.theme-azure) .app-header {
    background: var(--header-bg);
    -webkit-backdrop-filter: saturate(1.6) blur(14px);
    backdrop-filter: saturate(1.6) blur(14px);
    border-bottom: 1px solid var(--header-border);
}
:where(body.theme-azure) .app-header h1 { font-weight: 800; }
:where(body.theme-azure) .header-btn { border-radius: 12px; }
:where(body.theme-azure) .header-btn:hover { background: var(--primary-soft); color: var(--az-active-ink); }
:where(body.theme-azure) .firma-switcher-btn {
    background: var(--surface); border-color: var(--border-strong); border-radius: var(--radius-sm);
    color: var(--az-btn-text); font-weight: 700;
}
:where(body.theme-azure) .firma-switcher-btn:hover { background: var(--primary-soft); border-color: var(--brand-400); color: var(--az-btn-text); }

/* Mobil: hlavička NEODLÉTÁ do plovoucí skleněné pilulky — zůstane průsvitná lišta na plnou šířku
   (jako v Azure). Selektor kopíruje specificitu dark varianty ve style.css, aby ji přebil v obou režimech. */
@media (max-width: 1024px) {
    body.theme-azure .app-header,
    :root[data-theme="dark"] body.theme-azure .app-header {
        background: var(--header-bg);
        -webkit-backdrop-filter: saturate(1.6) blur(14px);
        backdrop-filter: saturate(1.6) blur(14px);
        border: 0; border-bottom: 1px solid var(--header-border);
    }
    body.theme-azure .app-header.is-scrolled,
    :root[data-theme="dark"] body.theme-azure .app-header.is-scrolled {
        left: 0; right: 0; top: env(safe-area-inset-top, 0px);
        border-radius: 0;
        background: var(--header-bg);
        border-color: var(--header-border);
        box-shadow: none;
    }
}
/* Nabídka firem pod hlavičkou na plnou šířku (64 px), ne pod plovoucí pilulkou (82 px). */
@media (max-width: 640px) {
    :where(body.theme-azure) .firma-switcher-menu { top: calc(env(safe-area-inset-top, 0px) + 72px); }
}

/* === Titulek stránky — tučný, bullet v přechodu značky === */
:where(body.theme-azure) .page-header { border-bottom: 0; padding-bottom: 0; margin-bottom: 1.25rem; }
:where(body.theme-azure) .page-header h1 { font-size: 1.55rem; font-weight: 800; letter-spacing: -.01em; padding-left: 16px; }
:where(body.theme-azure) .page-header h1::before {
    width: 5px; height: 26px; border-radius: 3px;
    background: var(--az-grad-primary); box-shadow: 0 2px 8px rgba(37,99,235,.35);
}
:where(body.theme-azure) .spravovat-group h3::before { background: var(--az-grad-primary); }

/* === Karty — bílé, 16 px, modrý stín; hlavička s nenápadným přechodem a modrou ikonou === */
:where(body.theme-azure) .card-header h2,
:where(body.theme-azure) .card-header h3 { font-size: 1rem; font-weight: 700; }
:where(body.theme-azure) .card-header h2 > svg,
:where(body.theme-azure) .card-header h3 > svg { color: var(--az-ink); }

/* === Tlačítka === */
:where(body.theme-azure) .btn { font-weight: 700; }
:where(body.theme-azure) .btn-primary { background: var(--az-grad-primary); box-shadow: var(--az-shadow-btn); }
:where(body.theme-azure) .btn-primary:hover { filter: brightness(1.08) saturate(1.05); box-shadow: var(--az-shadow-btn-hover); }
:where(body.theme-azure) .btn-outline { color: var(--az-btn-text); }
:where(body.theme-azure) .btn-outline:hover { background: var(--primary-soft); border-color: var(--brand-400); color: var(--az-btn-text); }
:where(body.theme-azure) .form-input[type="file"]::file-selector-button { font-weight: 700; border-radius: 8px; color: var(--az-btn-text); }
:where(body.theme-azure) .form-input[type="file"]:hover::file-selector-button { background: var(--primary-soft); border-color: var(--brand-400); color: var(--az-btn-text); }
:where(body.theme-azure) .btn-ghost:hover { background: var(--primary-soft); }
:where(body.theme-azure) .btn-danger { background: var(--az-danger-solid); box-shadow: 0 4px 12px rgba(208,40,58,.25); }
:where(body.theme-azure) .btn-danger:hover { background: var(--az-danger-solid-hover); filter: none; }
:where(body.theme-azure) .btn-success { background: var(--az-success-solid); box-shadow: 0 4px 12px rgba(21,128,61,.25); }
:where(body.theme-azure) .btn-success:hover { background: var(--az-success-solid-hover); filter: none; }
:where(body.theme-azure) .btn-sm { border-radius: 8px; }

/* === Formuláře === */
:where(body.theme-azure) .form-label { font-weight: 700; color: var(--text-strong); }
:where(body.theme-azure) .form-input:hover,
:where(body.theme-azure) .form-select:hover,
:where(body.theme-azure) .form-textarea:hover { border-color: var(--brand-400); }
:where(body.theme-azure) .form-input:focus,
:where(body.theme-azure) .form-select:focus,
:where(body.theme-azure) .form-textarea:focus { border-color: var(--az-focus); }

/* === Tabulky — modrá hlavička verzálkami, bez zebry, hover řádku === */
:where(body.theme-azure) .table th {
    background: var(--az-table-head-bg); color: var(--az-table-head-text);
    font-weight: 800; font-size: .74rem; letter-spacing: .06em;
    border-bottom-color: var(--border-strong);
}
:where(body.theme-azure) .table tbody tr:nth-child(even) { background: transparent; }
:where(body.theme-azure) .table tbody tr:hover { background: var(--surface-2); }
@media (max-width: 640px) {
    :where(body.theme-azure) .table-stack td[data-label]:not([data-label=""])::before { color: var(--az-table-head-text); font-weight: 700; }
}

/* === Štítky a zprávy — obrys z vlastní barvy místo rámečku === */
:where(body.theme-azure) .badge {
    font-weight: 800; border-color: transparent;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 22%, transparent);
}
:where(body.theme-azure) .alert {
    border-radius: 12px; box-shadow: none;
    border-color: color-mix(in srgb, currentColor 18%, transparent);
    border-left-color: currentColor;
}

/* === Dlaždice čísel (KPI) — samostatné dlaždice se 4px pruhem nahoře; v řadě se střídá
   modrá, nebeská, fialová, tyrkysová. Výchozí a pořadové akcenty mají nulovou specificitu,
   takže je stavová varianta (.stat-card-warning…) vždy přebije. === */
:where(body.theme-azure) .stats-grid { gap: .85rem; background: transparent; border: 0; border-radius: 0; overflow: visible; }
:where(body.theme-azure .stat-card) { --az-kpi-a: #2563eb; --az-kpi-b: #4f46e5; }
:where(body.theme-azure .stats-grid > .stat-card:nth-child(4n+2)) { --az-kpi-a: #0ea5e9; --az-kpi-b: #2563eb; }
:where(body.theme-azure .stats-grid > .stat-card:nth-child(4n+3)) { --az-kpi-a: #7c3aed; --az-kpi-b: #4f46e5; }
:where(body.theme-azure .stats-grid > .stat-card:nth-child(4n+4)) { --az-kpi-a: #0d9488; --az-kpi-b: #0ea5e9; }
:where(body.theme-azure) .stat-card-success { --az-kpi-a: #16a34a; --az-kpi-b: #0d9488; }
:where(body.theme-azure) .stat-card-warning { --az-kpi-a: #f59e0b; --az-kpi-b: #f97316; }
:where(body.theme-azure) .stat-card-danger  { --az-kpi-a: #e11d48; --az-kpi-b: #f97316; }
:where(body.theme-azure) .stat-card {
    position: relative; overflow: hidden;
    background: linear-gradient(160deg, color-mix(in srgb, var(--az-kpi-a) 7%, var(--surface)) 0%, var(--surface) 55%);
    border: 1px solid var(--border); border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs);
}
:where(body.theme-azure) .stat-card::before {
    content: ''; position: absolute; left: 0; right: 0; top: 0; height: 4px;
    background: linear-gradient(90deg, var(--az-kpi-a), var(--az-kpi-b));
}
/* Statistiky mají vlastní plochý vzhled dlaždic (statistiky.css, rozsah .stats-nav ~) — pruh by v nich visel navíc. */
:where(body.theme-azure) .stats-nav ~ .stats-grid .stat-card::before,
:where(body.theme-azure) .stats-nav ~ * .stats-grid .stat-card::before { content: none; }

/* === Ikony v čtverečku (rychlé akce, profil) — jeden přechod značky místo duhy === */
body.theme-azure .quick-actions .quick-action-btn .quick-action-icon {
    background: var(--az-grad-primary); color: #fff; box-shadow: var(--az-shadow-btn);
}

/* === Spodní lišta (mobil) — plná šířka u spodního okraje, průsvitná jako hlavička; aktivní
   položka má „pilulku" za ikonou. view-transition-name drží stejný trik jako theme-moderni:
   lišta je persistentní shell a pilulka se při překliknutí posune (cross-document View Transitions). === */
@media (max-width: 1024px) {
    body.theme-azure .bottom-nav {
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: 1fr;
        position: fixed; left: 0; right: 0; bottom: 0;
        height: calc(64px + env(safe-area-inset-bottom, 0px));
        padding: 0 4px env(safe-area-inset-bottom, 0px);
        border-top: 1px solid var(--header-border);
        z-index: 30;
        view-transition-name: bottom-nav;
    }
    /* Sklo na pseudo-prvku, ne na fixní liště: iOS s position:fixed + backdrop-filter při posunu
       láme pozici (viz theme-moderni.css). */
    body.theme-azure .bottom-nav::before {
        content: ''; position: absolute; inset: 0; z-index: -1;
        background: var(--header-bg);
        -webkit-backdrop-filter: saturate(1.6) blur(14px);
        backdrop-filter: saturate(1.6) blur(14px);
    }
    body.theme-azure .bottom-nav-item {
        display: flex; flex-direction: column; align-items: center; justify-content: center;
        gap: 3px; min-width: 0; text-decoration: none; color: var(--text-muted);
        font-size: .7rem; font-weight: 600; position: relative;
        transition: color var(--transition-fast);
        -webkit-tap-highlight-color: transparent;
    }
    body.theme-azure .bottom-nav-item > svg {
        box-sizing: content-box; padding: 3px 14px; border-radius: 999px;
        transition: background var(--transition-fast);
    }
    body.theme-azure .bottom-nav-item.active { color: var(--az-active-ink); }
    body.theme-azure .bottom-nav-item.active > svg {
        background: var(--primary-soft);
        view-transition-name: nav-pill;
    }
    body.theme-azure .bottom-nav-item.ghost { visibility: hidden; }
    body.theme-azure .app-main { padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 80px); }
}