/**
 * Detail akce — úvod (.dau-*) + podrobnosti (.dap-*) — frontend
 * Samostatný versovaný soubor (filemtime enqueue, docs/08 §F).
 * html{font-size:14px} → px. Breakpointy 991/767/479.
 */

/* ===== Úvodní sekce ===== */
/* Bez hero pruhu nese offset pod fixní menu sekce; kontejner drží jen designové odsazení. */
.wp-block-custom-detail-akce-uvod.dau-section { padding: var(--abf-navbar-height, 120px) var(--abf-gutter, 8%) 0; margin: 0; }
.wp-block-custom-detail-akce-uvod .dau-container {
    /* 64 px nahoře: nadpis byl nalepený na menu (hlášeno klientem 25. 8.) */
    max-width: var(--abf-content-max, 1280px); margin: 0 auto; padding: 64px 0 48px;
}
.wp-block-custom-detail-akce-uvod .dau-breadcrumb ol {
    list-style: none; margin: 0 0 28px; padding: 0;
    display: flex; flex-wrap: wrap; gap: 6px; font-size: 13px;
}
.wp-block-custom-detail-akce-uvod .dau-breadcrumb li + li::before {
    content: "/"; margin-right: 6px; color: #9a9a9a;
}
.wp-block-custom-detail-akce-uvod .dau-breadcrumb a {
    color: var(--red, #d91920); text-decoration: none;
}
.wp-block-custom-detail-akce-uvod .dau-breadcrumb a:hover { text-decoration: underline; }
.wp-block-custom-detail-akce-uvod .dau-breadcrumb [aria-current] { color: #6e6e6e; }

.wp-block-custom-detail-akce-uvod .dau-head {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 28px;
}
.wp-block-custom-detail-akce-uvod .dau-title {
    margin: 0; font-size: 40px; line-height: 1.1; font-weight: 800; color: var(--black, #191919);
    text-transform: uppercase; overflow-wrap: break-word; min-width: 0;
}
.wp-block-custom-detail-akce-uvod .dau-logo {
    max-height: 64px; max-width: 220px; width: auto; flex-shrink: 0;
}
.wp-block-custom-detail-akce-uvod .dau-grid {
    display: grid; grid-template-columns: minmax(0, 320px) minmax(0, 1fr);
    gap: 48px; align-items: start; margin-top: 20px; /* větší odstup nadpisu od obsahu */
}
.wp-block-custom-detail-akce-uvod .dau-grid--no-main { grid-template-columns: minmax(0, 1fr); max-width: 560px; }
.wp-block-custom-detail-akce-uvod .dau-main {
    display: flex; flex-direction: column; gap: 24px; min-width: 0;
}
.wp-block-custom-detail-akce-uvod .dau-perex {
    font-size: 16px; line-height: 1.65; color: var(--black, #191919); margin: 0;
}
.wp-block-custom-detail-akce-uvod .dau-perex p { margin: 0 0 8px; }
.wp-block-custom-detail-akce-uvod .dau-perex p:last-child { margin-bottom: 0; }
.wp-block-custom-detail-akce-uvod .dau-meta { margin: 0; }
.wp-block-custom-detail-akce-uvod .dau-meta-item { margin-bottom: 22px; }
.wp-block-custom-detail-akce-uvod .dau-meta-value {
    display: block; margin: 0; font-size: 22px; font-weight: 700; color: var(--black, #191919);
}
.wp-block-custom-detail-akce-uvod .dau-meta-value--place { font-size: 17px; }
.wp-block-custom-detail-akce-uvod .dau-meta-label {
    display: block; font-size: 13px; color: #6e6e6e; margin-top: 2px; font-weight: 400;
}
.wp-block-custom-detail-akce-uvod .dau-badge-past {
    display: inline-block; background: #f0f0f0; color: #6e6e6e;
    font-size: 13px; font-weight: 600; border-radius: 4px; padding: 5px 10px; margin: 0 0 16px;
}
.wp-block-custom-detail-akce-uvod .dau-actions {
    display: flex; flex-direction: column; align-items: stretch; gap: 10px; max-width: 300px;
}
.wp-block-custom-detail-akce-uvod .dau-actions .button { text-align: center; }
/* Fotka v přirozeném poměru (pvaexpo 15. 10.): nikdy ořez, nikdy zvětšení nad
   skutečnou velikost souboru. Dřív aspect-ratio 4/3 + cover + width 100 % fotku
   ořízly a roztáhly (744×479 → 837×627) a při 1440×900 byla vidět jen ona.
   Fotky z IS jsou všechny na šířku (1,39–1,78). Strop výšky drží nadpis
   „Podrobnosti o akci“ na první obrazovce: fotka začíná na y≈360–380 (podle
   loga v hlavičce) a nadpis končí ~71 px pod ní → při 900 px výšky smí mít
   fotka nejvýš ~448 px. 47vh = 423 px nechá rezervu na dvouřádkový perex;
   při 1366×768 (361 px) je celá fotka na první obrazovce. Figure se ve flex
   sloupci roztáhne do šířky sloupce, fotka v něm sedí vlevo (block +
   width:auto), zarovnaná s perexem. Při width/height auto a max-* drží
   prohlížeč poměr stran. */
.wp-block-custom-detail-akce-uvod .dau-hero { margin: 0; }
.wp-block-custom-detail-akce-uvod .dau-hero img {
    width: auto; height: auto;
    max-width: min(100%, 720px); max-height: min(47vh, 520px);
    border-radius: var(--button-radius, 6px); display: block;
}

/* ===== Podrobnosti ===== */
.wp-block-custom-detail-akce-podrobnosti.dap-section { padding: 0; margin: 0; }
.wp-block-custom-detail-akce-podrobnosti .dap-container {
    max-width: 1280px; margin: 0 auto; padding: 24px 8% 64px;
}
/* Na desktopu zarovnat do pravého sloupce úvodu (levý rail 320px + gap 48px) */
@media (min-width: 992px) {
    .wp-block-custom-detail-akce-podrobnosti .dap-container {
        padding-left: calc(8% + 368px);
    }
    .wp-block-custom-detail-akce-podrobnosti .dap-body,
    .wp-block-custom-detail-akce-podrobnosti .dap-title,
    .wp-block-custom-detail-akce-podrobnosti .dap-map { max-width: 720px; } /* mapa v jedné linii s textem a fotkou */
}
.wp-block-custom-detail-akce-podrobnosti .dap-title { margin: 0 0 24px; }
.wp-block-custom-detail-akce-podrobnosti .dap-body {
    font-size: 16px; line-height: 1.7; color: var(--black, #191919);
}
.wp-block-custom-detail-akce-podrobnosti .dap-body p { margin: 0 0 14px; }
.wp-block-custom-detail-akce-podrobnosti .dap-body a { color: var(--red, #d91920); }
.wp-block-custom-detail-akce-podrobnosti .dap-map { margin: 28px 0 0; }
.wp-block-custom-detail-akce-podrobnosti .dap-map img {
    max-width: 100%; height: auto; border-radius: var(--button-radius, 6px); display: block;
}
.wp-block-custom-detail-akce-podrobnosti .dap-actions {
    display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin-top: 32px;
}

/* Fokus */
.wp-block-custom-detail-akce-uvod a:focus-visible,
.wp-block-custom-detail-akce-podrobnosti a:focus-visible {
    outline: 2px solid var(--red, #d91920); outline-offset: 2px;
}

/* Responsive */
@media (max-width: 991px) {
    .wp-block-custom-detail-akce-uvod .dau-grid,
    .wp-block-custom-detail-akce-uvod .dau-grid--no-main { grid-template-columns: minmax(0, 1fr); gap: 28px; }
    /* Pořadí v jednom sloupci (pvaexpo 15. 10.): fotka → levý sloupec (datum, čas,
       místo, „proběhlo“, Doprava/Vstupenky/Mapa) → perex → Podrobnosti. Dřív šel
       celý pravý sloupec (order: -1) před levý a Vstupenky byly až pod celým textem.
       Šablona (DOM) se nemění: .dau-main se rozpustí (display: contents), jeho děti
       jsou přímo položkami mřížky a řadí je order; mezery drží gap mřížky. Bez fotky
       začíná levým sloupcem. Pořadí tabulátoru a čtečky (DOM: levý sloupec → perex →
       fotka → Podrobnosti) dál sedí s tím, co je vidět – fotka nemá nic k fokusu.
       order na .dau-main platí jen v prohlížeči bez display: contents (levý sloupec
       pak zůstane nahoře). */
    .wp-block-custom-detail-akce-uvod .dau-main { display: contents; order: 3; }
    .wp-block-custom-detail-akce-uvod .dau-main > * { order: 3; }
    .wp-block-custom-detail-akce-uvod .dau-main > .dau-hero { order: 1; }
    .wp-block-custom-detail-akce-uvod .dau-side { order: 2; }
    .wp-block-custom-detail-akce-uvod .dau-main > .dap-inline { order: 4; }
    .wp-block-custom-detail-akce-uvod .dau-title { font-size: 32px; }
    /* Jeden sloupec: fotka smí na plnou šířku, ale ne přes celou výšku displeje. */
    .wp-block-custom-detail-akce-uvod .dau-hero img { max-width: 100%; max-height: 70vh; }
}
@media (max-width: 767px) {
    .wp-block-custom-detail-akce-uvod .dau-container { padding: 36px 0 36px; }
    .wp-block-custom-detail-akce-podrobnosti .dap-container { padding: 16px 6% 48px; }
    .wp-block-custom-detail-akce-uvod .dau-head { flex-direction: column-reverse; gap: 12px; }
    .wp-block-custom-detail-akce-uvod .dau-logo { max-height: 48px; }
}
@media (max-width: 479px) {
    .wp-block-custom-detail-akce-uvod .dau-title { font-size: 26px; }
    .wp-block-custom-detail-akce-uvod .dau-meta-value { font-size: 19px; }
    .wp-block-custom-detail-akce-uvod .dau-actions { max-width: none; }
}

/* Podrobnosti vnořené v pravém sloupci úvodu (dap-inline, 2026-08) — kontejner
   nesmí uplatňovat vlastní šířku/odsazení sekce (padding-left calc(8% + 368px)
   patří jen samostatné sekci pod gridem). Specificita 0,3,0 > 0,2,0 původních pravidel. */
.wp-block-custom-detail-akce-uvod .dap-inline .dap-container {
    max-width: none;
    margin: 0;
    padding: 8px 0 0;
}
@media (min-width: 992px) {
    .wp-block-custom-detail-akce-uvod .dap-inline .dap-container {
        padding-left: 0;
    }
}