/* === Aardvark theming ===
   Tenant může přes ThemeCssJson přepsat CSS proměnné (--aav-*),
   výchozí hodnoty jsou zde. Pro totální redesign se vymění theme RCL. */
:root {
    --aav-primary: #1b6ec2;
    --aav-navbar-fg: #ffffff;
}

.aav-navbar {
    background-color: var(--aav-primary);
}

.aav-navbar .navbar-brand,
.aav-navbar .nav-link,
.aav-navbar .btn-link.nav-link {
    color: var(--aav-navbar-fg);
}

.btn-primary {
    --bs-btn-bg: var(--aav-primary);
    --bs-btn-border-color: var(--aav-primary);
    --bs-btn-hover-bg: color-mix(in srgb, var(--aav-primary) 85%, black);
    --bs-btn-hover-border-color: color-mix(in srgb, var(--aav-primary) 85%, black);
    --bs-btn-active-bg: color-mix(in srgb, var(--aav-primary) 75%, black);
    --bs-btn-active-border-color: color-mix(in srgb, var(--aav-primary) 75%, black);
}

a {
    color: var(--aav-primary);
}

/* === Články: covery a avatary (média servíruje /media) === */
.aav-article-cover {
    width: 100%;
    max-height: 420px;
    object-fit: cover;
    border-radius: 0.75rem;
}

.aav-article-thumb {
    width: 140px;
    height: 94px;
    object-fit: cover;
    border-radius: 0.5rem;
}

.aav-author-avatar {
    width: 64px;
    height: 64px;
    flex-shrink: 0;
    object-fit: cover;
    border-radius: 50%;
}

/* === Formulářová validace (Blazor) === */
h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

/* === Blazor error UI === */
#blazor-error-ui {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

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

.blazor-error-boundary {
    background: #b32121;
    padding: 1rem;
    color: white;
}

.blazor-error-boundary::after {
    content: "Došlo k chybě.";
}

/* Šablona Clean — „bílá stránka": úzký sloupec, drobnější text, žádný chrom. */
.aav-tpl-clean {
    max-width: 720px;
    font-size: .875rem;
    line-height: 1.6;
}
.aav-tpl-clean h1, .aav-tpl-clean h2 { font-size: 1.25rem; }
.aav-tpl-clean h3, .aav-tpl-clean h4 { font-size: 1rem; }

/* === Skin NewsPortal — editorial news portál ===
   Teplý papír + hluboký inkoust + signální akcent. Paleta jde přeladit z DB
   theme proměnnými --aav-np-* (tenant ThemeCssJson / per-page theme). */
.aav-np {
    --np-bg: var(--aav-np-bg, #f6f4ef);
    --np-surface: var(--aav-np-surface, #fffdf8);
    --np-ink: var(--aav-np-ink, #1d1f24);
    --np-muted: var(--aav-np-muted, #6e6a61);
    --np-accent: var(--aav-np-accent, #d3451c);
    --np-rule: var(--aav-np-rule, #e3ded2);

    /* Paleta news modulu (varianta "news") se ve skinu sladí automaticky. */
    --aav-news-ink: var(--np-ink);
    --aav-news-muted: var(--np-muted);
    --aav-news-accent: var(--np-accent);
    --aav-news-rule: var(--np-rule);

    background: var(--np-bg);
    color: var(--np-ink);
    font-family: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, sans-serif;
}

.aav-np h1, .aav-np h2, .aav-np h3, .aav-np h4 {
    font-family: "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;
    font-weight: 800;
    letter-spacing: -.02em;
    color: var(--np-ink);
}

/* --- Masthead --- */
.aav-np-masthead {
    background: var(--np-surface);
    border-bottom: 3px solid var(--np-ink);
}

.aav-np-topbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: .45rem 0;
    border-bottom: 1px solid var(--np-rule);
    font-size: .78rem;
    color: var(--np-muted);
}

.aav-np-date {
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 600;
}

.aav-np-account {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.aav-np-account a,
.aav-np-account button {
    color: var(--np-muted);
    text-decoration: none;
    background: none;
    border: 0;
    padding: 0;
    font-size: inherit;
}

.aav-np-account a:hover,
.aav-np-account button:hover {
    color: var(--np-accent);
    text-decoration: underline;
    text-underline-offset: .2em;
}

.aav-np-brand {
    display: inline-block;
    padding: 1.1rem 0 .6rem;
    font-family: "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;
    font-size: clamp(1.9rem, 1.3rem + 2.5vw, 3rem);
    font-weight: 900;
    letter-spacing: -.035em;
    line-height: 1;
    color: var(--np-ink);
    text-decoration: none;
}

.aav-np-brand:hover {
    color: var(--np-ink);
}

.aav-np-brand-dot {
    color: var(--np-accent);
}

/* Rubriky — na užších displejích horizontální scroll místo hamburgeru. */
.aav-np-nav {
    display: flex;
    gap: 1.35rem;
    overflow-x: auto;
    padding: .1rem 0;
    scrollbar-width: none;
}

.aav-np-nav::-webkit-scrollbar {
    display: none;
}

.aav-np-nav a {
    padding: .5rem 0 .65rem;
    font-size: .82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .09em;
    white-space: nowrap;
    color: var(--np-ink);
    text-decoration: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -3px; /* linka aktivní položky sedí na hraně mastheadu */
}

.aav-np-nav a:hover,
.aav-np-nav a.active {
    color: var(--np-accent);
    border-bottom-color: var(--np-accent);
}

/* Druhá úroveň navigace — podstránky otevřené rubriky. */
.aav-np-subnav {
    display: flex;
    gap: 1.1rem;
    overflow-x: auto;
    padding: .45rem 0 .1rem;
    scrollbar-width: none;
    border-top: 1px solid var(--np-rule);
}

.aav-np-subnav::-webkit-scrollbar {
    display: none;
}

.aav-np-subnav a {
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .02em;
    white-space: nowrap;
    color: var(--np-muted);
    text-decoration: none;
}

.aav-np-subnav a:hover,
.aav-np-subnav a.active {
    color: var(--np-accent);
}

/* --- Obsah --- */
.aav-np-main {
    padding: 2rem 0 3rem;
}

.aav-np-title {
    font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.2rem);
    margin-bottom: 1.5rem;
    padding-bottom: .75rem;
    border-bottom: 1px solid var(--np-rule);
}

.aav-np-main a {
    color: var(--np-accent);
}

/* News modul i běžný obsah dědí inkoust; odkazy v článcích zůstávají akcentové. */
.aav-np-main .aav-news a {
    color: inherit;
}

.aav-np .text-muted {
    color: var(--np-muted) !important;
}

.aav-np .card {
    background: var(--np-surface);
    border-color: var(--np-rule);
}

/* --- Footer --- */
.aav-np-footer {
    background: var(--np-ink);
    color: color-mix(in srgb, var(--np-bg) 88%, transparent);
    padding: 1.75rem 0;
    margin-top: 3rem;
}

.aav-np-footer .container {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    flex-wrap: wrap;
}

.aav-np-footer-brand {
    font-family: "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;
    font-weight: 900;
    font-size: 1.15rem;
    letter-spacing: -.02em;
}

.aav-np-footer-note {
    font-size: .78rem;
    opacity: .65;
}

/* FAB — tužka pro editaci stránky (vpravo dole, jen pro uživatele s grantem Edit). */
.aav-fab {
    position: fixed;
    right: 1.25rem;
    bottom: 1.25rem;
    z-index: 1040;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    background: var(--aav-primary, #1b6ec2);
    color: #fff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .25);
    transition: transform .1s ease;
}
.aav-fab:hover { color: #fff; transform: scale(1.08); }

/* Inline editor stránky */
.aav-editor-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: sticky;
    top: 0;
    z-index: 1030;
    background: var(--bs-body-bg);
    padding: .5rem .75rem;
    border-bottom: 1px solid var(--bs-border-color);
}
.aav-editor-settings summary { cursor: pointer; color: var(--bs-secondary-color); }
.aav-editor-row {
    border: 1px dashed var(--bs-border-color);
    border-radius: .5rem;
    padding: .5rem;
    margin: .75rem 0;
}
.aav-editor-row-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: .5rem;
}
.aav-editor-cell {
    border: 1px solid var(--bs-border-color);
    border-radius: .375rem;
    padding: .5rem;
    min-height: 4.5rem;
    background: var(--bs-tertiary-bg);
}
.aav-editor-module {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: .375rem;
    margin-bottom: .5rem;
}
.aav-editor-module-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .375rem .5rem;
    cursor: pointer;
}
.aav-editor-module-body { padding: .5rem; border-top: 1px solid var(--bs-border-color); }
.aav-editor-addrow {
    display: flex;
    flex-wrap: wrap;
    gap: .375rem;
    align-items: center;
    margin-top: 1rem;
}
.aav-editor-custom { max-width: 7rem; }

/* ---------- HTML editor (html-editor.js — inline i modal) ---------- */
.aav-html-surface {
    min-height: 20rem;
    outline: none;
}
.aav-html-surface img { max-width: 100%; height: auto; }
.aav-html-modal .modal-body { min-height: 55vh; }
.aav-html-modal .aav-html-surface {
    flex: 1 1 auto;
    overflow-y: auto;
}
.aav-html-modal .aav-html-source {
    flex: 1 1 auto;
    resize: none;
    outline: none;
    box-shadow: none;
}

/* Výběr obrázku ze Souborů portálu */
.aav-html-picker {
    border-bottom: 1px solid var(--bs-border-color);
    background: var(--bs-tertiary-bg);
}
.aav-html-picker-head {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .375rem .5rem;
}
.aav-html-picker-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
    gap: .375rem;
    padding: 0 .5rem .5rem;
    max-height: 14rem;
    overflow-y: auto;
}
.aav-html-picker-item {
    display: flex;
    flex-direction: column;
    gap: .2rem;
    padding: .25rem;
    border: 1px solid var(--bs-border-color);
    border-radius: .375rem;
    background: var(--bs-body-bg);
    cursor: pointer;
    text-align: center;
}
.aav-html-picker-item:hover { border-color: var(--aav-primary, #1b6ec2); }
.aav-html-picker-thumb {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: .25rem;
    background: var(--bs-secondary-bg);
    font-size: 1.4rem;
}
.aav-html-picker-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.aav-html-picker-name {
    font-size: .72rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Koš a historie verzí v editoru stránek */
.aav-editor-trash-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    padding: .375rem .5rem;
    border: 1px dashed var(--bs-border-color);
    border-radius: .375rem;
    margin-bottom: .375rem;
    background: var(--bs-tertiary-bg);
}
.aav-editor-versions {
    list-style: none;
    margin: .25rem 0 0;
    padding: 0;
    font-size: .85rem;
}
.aav-editor-versions li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    padding: .15rem 0;
    border-bottom: 1px dotted var(--bs-border-color);
}

/* === Containery modulů (ModuleContainers) ===
   Obal instance modulu volitelný v editoru stránek: aav-mod--{key}.
   Staví na proměnných --aav-mod-*, které si skin přemapuje na svou paletu
   (viz .aav-np níž) — stejný princip jako --aav-news-*. */
.aav-mod--box,
.aav-mod--muted,
.aav-mod--accent {
    padding: 1.25rem;
    border-radius: var(--aav-mod-radius, .5rem);
}

.aav-mod--box {
    background: var(--aav-mod-surface, var(--bs-body-bg, #fff));
    border: 1px solid var(--aav-mod-rule, var(--bs-border-color, #dee2e6));
}

.aav-mod--muted {
    background: var(--aav-mod-muted-bg, var(--bs-tertiary-bg, #f8f9fa));
}

.aav-mod--accent {
    background: color-mix(in srgb, var(--aav-mod-accent, var(--aav-primary, #1b6ec2)) 7%, transparent);
    border-top: 3px solid var(--aav-mod-accent, var(--aav-primary, #1b6ec2));
    border-radius: 0 0 var(--aav-mod-radius, .5rem) var(--aav-mod-radius, .5rem);
}

/* Inverzní: teplá tmavě hnědá karta se světle hnedým písmem — má vlastní
   proměnné --aav-mod-invert-* (radius/padding si drží i ve skinech s ostrými
   hranami, je to záměrně "vystouplý" box). */
.aav-mod--invert {
    background: var(--aav-mod-invert-bg, #4a3a2b);
    color: var(--aav-mod-invert-fg, #e7d9c4);
    border: 1px solid var(--aav-mod-invert-border, #2b211a);
    border-radius: var(--aav-mod-invert-radius, .75rem);
    padding: 1.5rem;
    box-shadow: 0 2px 10px rgb(0 0 0 / .12);
}

.aav-mod--invert :is(h1, h2, h3, h4, h5) {
    color: var(--aav-mod-invert-heading, #f3e8d5);
}

.aav-mod--invert a {
    color: color-mix(in srgb, var(--aav-mod-accent, var(--aav-primary, #1b6ec2)) 45%, #f3e8d5);
}

.aav-mod--invert .text-muted {
    color: color-mix(in srgb, var(--aav-mod-invert-fg, #e7d9c4) 65%, transparent) !important;
}

/* Skin NewsPortal: containery v paletě papír/inkoust, ostré hrany (editorial);
   invert si nechává hnědou kartu se zaoblením — kontrastní prvek na papíru. */
.aav-np {
    --aav-mod-surface: var(--np-surface);
    --aav-mod-rule: var(--np-rule);
    --aav-mod-muted-bg: color-mix(in srgb, var(--np-rule) 45%, var(--np-bg));
    --aav-mod-accent: var(--np-accent);
    --aav-mod-radius: 0;
}

.aav-np .aav-mod--invert :is(h1, h2, h3, h4, h5) {
    color: var(--aav-mod-invert-heading, #f3e8d5);
}

/* === Chybové stránky 404/500 (OopsPanel) === */
.aav-oops {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 2.5rem;
    max-width: 54rem;
    margin: 3rem auto;
    padding: 1rem;
}

.aav-oops-art {
    flex: 0 1 260px;
    min-width: 200px;
}

.aav-oops-art svg {
    width: 100%;
    height: auto;
    display: block;
}

.aav-oops-body {
    flex: 1 1 20rem;
    max-width: 32rem;
}

.aav-oops-code {
    font-family: var(--bs-font-monospace);
    letter-spacing: 0.25em;
    color: #6c757d;
    margin: 0 0 0.25rem;
}

.aav-oops-title {
    font-size: 1.75rem;
    font-weight: 600;
    margin: 0 0 0.75rem;
}

.aav-oops-text {
    font-size: 1.05rem;
    margin-bottom: 0.75rem;
}

.aav-oops-en {
    color: #6c757d;
}

.aav-oops-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin: 1.25rem 0;
}

.aav-oops-id {
    font-size: 0.8rem;
    color: #6c757d;
    margin: 0;
}

.aav-oops-id code {
    user-select: all;
    word-break: break-all;
}

/* === Sekce stránky (řádky LayoutJson se vzhledem — SectionDesign) ===
   Struktura: <section class="aav-sec aav-sec--w-* aav-sec--tone-* aav-sec--space-* aav-sec--h-*">
     [.aav-sec-media > img] [.aav-sec-overlay] .aav-sec-inner(.container|.aav-sec-narrow|.aav-sec-edge) > .row
   Tóny sdílí paletu s containery modulů (--aav-mod-*), takže si je skin přeladí jednou.
   Šířky „přes celou šířku" v šabloně s kontejnerem vystupují třídou aav-sec--bleed. */
.aav-sec {
    position: relative;
    isolation: isolate;
}

.aav-sec-inner {
    position: relative;
    z-index: 1;
}

.aav-sec-narrow { max-width: 760px; }

.aav-sec-edge .row { --bs-gutter-x: 0; }

/* Rozestupy */
.aav-sec--space-none { padding-block: 0; }
.aav-sec--space-sm { padding-block: 1rem; }
.aav-sec--space-md { padding-block: 2rem; }
.aav-sec--space-lg { padding-block: 4rem; }
.aav-sec--space-xl { padding-block: 6rem; }

@media (max-width: 767.98px) {
    .aav-sec--space-lg { padding-block: 2.5rem; }
    .aav-sec--space-xl { padding-block: 3.5rem; }
}

/* Výška: hero sekce se svisle centrují */
.aav-sec--h-tall,
.aav-sec--h-screen {
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.aav-sec--h-tall { min-height: 60vh; }
.aav-sec--h-screen { min-height: 100vh; }

/* Tóny (barva podkladu jde přes --aav-sec-bg, aby ji šlo u tvarovaného okraje přesunout do ::before) */
.aav-sec--tone-muted {
    --aav-sec-bg: var(--aav-mod-muted-bg, var(--bs-tertiary-bg, #f8f9fa));
    background: var(--aav-sec-bg);
}

.aav-sec--tone-accent {
    --aav-sec-bg: color-mix(in srgb, var(--aav-mod-accent, var(--aav-primary, #1b6ec2)) 10%, transparent);
    background: var(--aav-sec-bg);
}

.aav-sec--tone-invert {
    --aav-sec-bg: var(--aav-sec-invert-bg, var(--aav-mod-invert-bg, #1d1f24));
    background: var(--aav-sec-bg);
    color: var(--aav-sec-invert-fg, var(--aav-mod-invert-fg, #f3f1ec));
}

.aav-sec--tone-invert :is(h1, h2, h3, h4, h5, h6) {
    color: var(--aav-sec-invert-heading, var(--aav-mod-invert-heading, #fff));
}

.aav-sec--tone-invert a:not(.btn) {
    color: color-mix(in srgb, var(--aav-mod-accent, var(--aav-primary, #1b6ec2)) 35%, #fff);
}

.aav-sec--tone-invert .text-muted {
    color: color-mix(in srgb, var(--aav-sec-invert-fg, #f3f1ec) 70%, transparent) !important;
}

/* Obrázek pozadí + ztmavení (proměnná --aav-sec-overlay = 0–0.9 z editoru) */
.aav-sec-media {
    position: absolute;
    inset: 0;
    z-index: -2;
    overflow: hidden;
}

.aav-sec-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.aav-sec-overlay {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: rgb(0 0 0 / var(--aav-sec-overlay, 0));
}

/* Okraje sekce (roztržený papír, vlna, oblouk, šikmý) — CSS maska pozadí, ne obrázek.
   Maska má tři vrstvy: horní tvar, plný obdélník uprostřed, spodní tvar; výšky vrstev
   dávají proměnné --aav-mask-top-h / --aav-mask-bottom-h (0 = vrstva neviditelná).
   Tvary jsou SVG v wwwroot/masks (viewBox 0 0 W 100, roztažené na šířku sekce).
   Podklad tónu se přesouvá do ::before, aby maska nesahala na obsah sekce. */
.aav-sec.aav-sec--masked { background: transparent; }

.aav-sec--masked::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -3;
    background: var(--aav-sec-bg, transparent);
}

.aav-sec--masked::before,
.aav-sec--masked > .aav-sec-media,
.aav-sec--masked > .aav-sec-overlay {
    --_mt: var(--aav-mask-top-h, 0px);
    --_mb: var(--aav-mask-bottom-h, 0px);
    -webkit-mask-image: var(--aav-mask-top-img, linear-gradient(#000, #000)), linear-gradient(#000, #000), var(--aav-mask-bottom-img, linear-gradient(#000, #000));
    mask-image: var(--aav-mask-top-img, linear-gradient(#000, #000)), linear-gradient(#000, #000), var(--aav-mask-bottom-img, linear-gradient(#000, #000));
    -webkit-mask-size: 100% var(--_mt), 100% calc(100% - var(--_mt) - var(--_mb) + 2px), 100% var(--_mb);
    mask-size: 100% var(--_mt), 100% calc(100% - var(--_mt) - var(--_mb) + 2px), 100% var(--_mb);
    -webkit-mask-position: center top, center calc(var(--_mt) - 1px), center bottom;
    mask-position: center top, center calc(var(--_mt) - 1px), center bottom;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

.aav-sec--mask-top-torn { --aav-mask-top-img: url(/masks/torn-top.svg); --aav-mask-top-h: 108px; }
.aav-sec--mask-top-wave { --aav-mask-top-img: url(/masks/wave-top.svg); --aav-mask-top-h: 56px; }
.aav-sec--mask-top-curve { --aav-mask-top-img: url(/masks/curve-top.svg); --aav-mask-top-h: 56px; }
.aav-sec--mask-top-tilt-left { --aav-mask-top-img: url(/masks/tilt-left-top.svg); --aav-mask-top-h: 56px; }
.aav-sec--mask-top-tilt-right { --aav-mask-top-img: url(/masks/tilt-right-top.svg); --aav-mask-top-h: 56px; }

.aav-sec--mask-bottom-torn { --aav-mask-bottom-img: url(/masks/torn-bottom.svg); --aav-mask-bottom-h: 108px; }
.aav-sec--mask-bottom-wave { --aav-mask-bottom-img: url(/masks/wave-bottom.svg); --aav-mask-bottom-h: 56px; }
.aav-sec--mask-bottom-curve { --aav-mask-bottom-img: url(/masks/curve-bottom.svg); --aav-mask-bottom-h: 56px; }
.aav-sec--mask-bottom-tilt-left { --aav-mask-bottom-img: url(/masks/tilt-left-bottom.svg); --aav-mask-bottom-h: 56px; }
.aav-sec--mask-bottom-tilt-right { --aav-mask-bottom-img: url(/masks/tilt-right-bottom.svg); --aav-mask-bottom-h: 56px; }

/* Tvarovaný okraj zabírá část výšky sekce — přidáme tam vnitřní odsazení, ať do něj nepadá obsah. */
.aav-sec--masked > .aav-sec-inner {
    padding-top: var(--aav-mask-top-h, 0px);
    padding-bottom: var(--aav-mask-bottom-h, 0px);
}

@media (max-width: 767.98px) {
    .aav-sec--mask-top-torn { --aav-mask-top-h: 64px; }
    .aav-sec--mask-bottom-torn { --aav-mask-bottom-h: 64px; }
    .aav-sec--mask-top-wave, .aav-sec--mask-top-curve, .aav-sec--mask-top-tilt-left, .aav-sec--mask-top-tilt-right { --aav-mask-top-h: 32px; }
    .aav-sec--mask-bottom-wave, .aav-sec--mask-bottom-curve, .aav-sec--mask-bottom-tilt-left, .aav-sec--mask-bottom-tilt-right { --aav-mask-bottom-h: 32px; }
}

/* Sekce s fotkou bez zvoleného tónu bývá se světlým textem — invert to řeší,
   pro default tón jen zajistíme čitelnost nadpisů nad tmavým overlayem. */
.aav-sec--bg.aav-sec--tone-default { color: #fff; }
.aav-sec--bg.aav-sec--tone-default :is(h1, h2, h3, h4, h5, h6) { color: #fff; }

/* Vystoupení z kontejneru šablony (Default/Clean/NewsPortal): šířka viewportu.
   100vw počítá i posuvník — html { overflow-x: clip } vodorovný posuv zahodí. */
.aav-sec--bleed {
    width: 100vw;
    margin-inline: calc(50% - 50vw);
}

html:has(.aav-sec--bleed) { overflow-x: clip; }

/* Moduly v sekci: poslední modul bez spodní mezery, ať rozestup dělá sekce. */
.aav-sec .col-12 > .aav-module:last-child { margin-bottom: 0 !important; }

/* === Skin Site — marketingový web (logo, světlá hlavička, obsah od kraje ke kraji) ===
   Paleta a písmo přes theme proměnné --aav-site-* (Nastavení → Vzhled webu), struktura
   má stabilní třídy aav-site-* pro vlastní CSS portálu. */
.aav-site {
    --site-bg: var(--aav-site-bg, #ffffff);
    --site-ink: var(--aav-site-ink, #1d1f24);
    --site-muted: var(--aav-site-muted, #6b6f76);
    --site-accent: var(--aav-site-accent, var(--aav-primary, #1b6ec2));
    --site-header-bg: var(--aav-site-header-bg, #ffffff);
    --site-header-fg: var(--aav-site-header-fg, #1d1f24);
    --site-footer-bg: var(--aav-site-footer-bg, #f4f4f2);
    --site-footer-fg: var(--aav-site-footer-fg, #3a3d42);
    --site-font: var(--aav-site-font, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
    --site-heading-font: var(--aav-site-heading-font, var(--site-font));
    --site-heading-weight: var(--aav-site-heading-weight, 600);
    --site-logo-height: var(--aav-site-logo-height, 44px);

    /* Sdílená paleta pro containery modulů a sekce */
    --aav-mod-accent: var(--site-accent);
    --aav-mod-muted-bg: var(--aav-site-muted-bg, #f4f4f2);
    --aav-mod-invert-bg: var(--aav-site-invert-bg, #1d1f24);
    --aav-mod-invert-fg: var(--aav-site-invert-fg, #f3f1ec);
    --aav-mod-invert-heading: #ffffff;
    --aav-mod-invert-border: transparent;
    --aav-mod-invert-radius: var(--aav-site-radius, .5rem);
    --aav-mod-radius: var(--aav-site-radius, .5rem);

    background: var(--site-bg);
    color: var(--site-ink);
    font-family: var(--site-font);
}

.aav-site :is(h1, h2, h3, h4, h5, h6) {
    font-family: var(--site-heading-font);
    font-weight: var(--site-heading-weight);
}

.aav-site a { color: var(--site-accent); }

.aav-site .btn-primary {
    --bs-btn-bg: var(--site-accent);
    --bs-btn-border-color: var(--site-accent);
    --bs-btn-hover-bg: color-mix(in srgb, var(--site-accent) 85%, black);
    --bs-btn-hover-border-color: color-mix(in srgb, var(--site-accent) 85%, black);
}

.aav-site-header {
    background: var(--site-header-bg);
    color: var(--site-header-fg);
    border-bottom: 1px solid color-mix(in srgb, var(--site-header-fg) 10%, transparent);
    position: sticky;
    top: 0;
    z-index: 1020;
}

.aav-site-header .navbar { padding-block: .6rem; }

.aav-site-brand { display: inline-flex; align-items: center; color: var(--site-header-fg); }
.aav-site-logo { height: var(--site-logo-height); width: auto; display: block; }
.aav-site-brand-text { font-family: var(--site-heading-font); font-weight: 700; font-size: 1.25rem; letter-spacing: .01em; }

.aav-site-nav .nav-link {
    color: color-mix(in srgb, var(--site-header-fg) 80%, transparent);
    font-weight: 500;
    padding-inline: .85rem;
}

.aav-site-nav .nav-link:hover,
.aav-site-nav .nav-link.active { color: var(--site-accent); }

.aav-site-nav .dropdown-menu { border-radius: var(--aav-site-radius, .5rem); }
.aav-site-admin-link { opacity: .7; }
.aav-site-header .navbar-toggler { border-color: color-mix(in srgb, var(--site-header-fg) 25%, transparent); }

.aav-site-main > .aav-sec:first-child.aav-sec--space-md { padding-top: 2rem; }
.aav-site-title { margin: 2rem 0 1rem; }

.aav-site-footer {
    background: var(--site-footer-bg);
    color: var(--site-footer-fg);
    padding: 2.5rem 0 1.5rem;
    font-size: .925rem;
}

.aav-site-footer a { color: inherit; }
.aav-site-footer-content { margin-bottom: 1.5rem; }
.aav-site-footer-content :is(h1, h2, h3, h4, h5, h6) { font-size: 1rem; margin-bottom: .5rem; }
.aav-site-footer-content p:last-child { margin-bottom: 0; }

.aav-site-footer-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 1.5rem;
    justify-content: space-between;
    padding-top: 1rem;
    border-top: 1px solid color-mix(in srgb, var(--site-footer-fg) 15%, transparent);
    color: color-mix(in srgb, var(--site-footer-fg) 75%, transparent);
    font-size: .85rem;
}

.aav-site-footer-account { display: inline-flex; gap: .75rem; align-items: baseline; }
.aav-site-footer-account .btn-link { color: inherit; font-size: inherit; text-decoration: underline; }

/* Editor sekcí (panel „Vzhled sekce" v editoru stránky) */
.aav-editor-design {
    background: var(--bs-tertiary-bg);
    border: 1px dashed var(--bs-border-color);
    border-radius: .375rem;
    padding: .5rem .75rem;
    margin: .25rem 0 .5rem;
}
.aav-editor-design .form-label { margin-bottom: .1rem; font-size: .75rem; color: var(--bs-secondary-color); }
.aav-editor-row-design { font-size: .75rem; color: var(--bs-secondary-color); }

/* === Centrální výběr souboru (file-picker.js) — modal nad .aav-html-picker-* mřížkou === */
.aav-file-picker-bar {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .5rem 1rem;
    border-bottom: 1px solid var(--bs-border-color);
    background: var(--bs-tertiary-bg);
    font-size: .875rem;
}
.aav-file-picker-crumbs { display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem; }
.aav-file-picker-grid {
    max-height: none;
    padding: 0;
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
}
.aav-file-picker .modal-body { min-height: 14rem; }