/* ==========================================================================
   SPOLEČNÁ DESIGNOVÁ VRSTVA VZHLEDŮ Z KNIHOVNY — ČLÁNKY
   Výpis a detail článku. Načítá se po clanky.css výchozího vzhledu jen na
   stránkách s články. Řídí se stejnými proměnnými jako bloky (--t-…, --vz-…).
   Kopíruje se ze `vzhledy/_spolecne/`.
   ========================================================================== */

/* Záhlaví detailu a výpisu: stejná plocha s ozdobným tvarem jako úvodní hlavička bloků. */
.article-detail-hero,
.event-detail-hero,
.sw-listing-head {
    position: relative;
    overflow: hidden;
    border-bottom: 0;
    background: var(--vz-hero-pozadi, var(--t-pozadi-jemne));
}
.article-detail-hero::before,
.event-detail-hero::before,
.sw-listing-head::before {
    content: "";
    position: absolute;
    top: -200px;
    right: -140px;
    width: 460px;
    height: 460px;
    border-radius: var(--vz-hero-tvar-zaobleni, 50%);
    background: var(--vz-hero-tvar, transparent);
    pointer-events: none;
}
.article-detail-hero > *, .event-detail-hero > *, .sw-listing-head > * { position: relative; }
.article-title-wrap h1, .event-title-wrap h1 { max-width: 22ch; margin-bottom: 0; }
/* Záhlaví výpisu (stránka jen s nadpisem) potřebuje vzduch nad i pod nadpisem. */
.sw-listing-head { padding-block: clamp(36px, 5vw, 64px); }
.sw-listing-head h1 { margin: 0; }
.article-meta, .event-detail-meta { color: var(--t-akcent); font-weight: 700; letter-spacing: 0.04em; }

/* Výpis: karty článků. */
.article-list-card {
    overflow: hidden;
    border-color: var(--t-linka-jemna);
    border-radius: var(--t-zaobleni);
    background: var(--t-pozadi);
    box-shadow: var(--vz-stin-karty, none);
    transition: transform var(--t-rychlost) var(--t-krivka), box-shadow var(--t-rychlost) var(--t-krivka), border-color var(--t-rychlost) ease;
}
.article-list-card:hover, .article-list-card:focus-within {
    border-color: var(--vz-karta-linka-hover, var(--t-akcent));
    box-shadow: var(--vz-stin-karty-hover, var(--vz-stin-karty, none));
    transform: translateY(var(--vz-karta-zdvih, -4px));
}
.article-list-card .article-image { border: 0; border-bottom: 1px solid var(--t-linka-jemna); border-radius: 0; background: var(--vz-akcent-jemny, var(--t-pozadi-jemne)); color: var(--t-akcent); }
.article-list-card .article-image img { transition: transform 0.5s var(--t-krivka); }
.article-list-card:hover .article-image img { transform: scale(1.04); }
.article-card-body :is(h2, h3) a { color: var(--t-text); text-decoration: none; }
.article-card-body :is(h2, h3) a:hover { color: var(--t-akcent); }

/* Odkazy se šipkou: bez podtržení, šipka při najetí popojede. */
.article-more, .side-all-link, .back-to-news, .event-calendar-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--t-akcent);
    font-weight: 700;
    text-decoration: none;
}
:is(.article-more, .side-all-link, .back-to-news, .event-calendar-link) i { font-size: 0.85em; transition: transform var(--t-rychlost) var(--t-krivka); }
:is(.article-more, .side-all-link, .event-calendar-link):hover i { transform: translateX(4px); }
.back-to-news:hover i { transform: translateX(-4px); }
:is(.article-more, .side-all-link, .back-to-news, .event-calendar-link):hover { color: var(--vz-akcent-tmavy, var(--t-akcent)); }

/* Čtený text článku. */
.article-body { font-size: 1.0625rem; line-height: 1.75; }
.article-body > :is(p, ul, ol, blockquote, h2, h3, h4) { max-width: 72ch; }
.article-body :is(h2, h3) { margin-top: 1.8em; }
.article-body img { border-radius: var(--vz-obrazek-zaobleni, var(--t-zaobleni)); }
.article-body blockquote { margin-inline: 0; padding: 18px 24px; border: 0; border-left: 4px solid var(--t-akcent); border-radius: 0 var(--t-zaobleni) var(--t-zaobleni) 0; background: var(--vz-akcent-jemny, var(--t-pozadi-jemne)); }
.article-body a:not(.back-to-news):not(.button) { color: var(--t-odkaz); text-decoration-thickness: 1px; text-underline-offset: 0.2em; }

/* Sdílení a další články. */
.article-share { border-color: var(--t-linka-jemna); }
.article-share-actions a, .sidebar-social-links a {
    border-radius: var(--vz-tlacitko-zaobleni, var(--t-zaobleni));
    border-color: var(--t-linka);
    color: var(--t-text);
    font-weight: 700;
    text-decoration: none;
    transition: border-color var(--t-rychlost) ease, color var(--t-rychlost) ease, background-color var(--t-rychlost) ease;
}
.article-share-actions a:hover, .sidebar-social-links a:hover { border-color: var(--t-akcent); background: var(--vz-akcent-jemny, var(--t-pozadi-jemne)); color: var(--t-akcent); }
.article-read-more a {
    border-color: var(--t-linka-jemna);
    border-radius: var(--t-zaobleni);
    color: var(--t-text);
    text-decoration: none;
    transition: transform var(--t-rychlost) var(--t-krivka), box-shadow var(--t-rychlost) var(--t-krivka), border-color var(--t-rychlost) ease;
}
.article-read-more a:hover { border-color: var(--t-akcent); box-shadow: var(--vz-stin-karty-hover, none); color: var(--t-akcent); transform: translateY(var(--vz-karta-zdvih, -4px)); }

/* Postranní panel detailu. */
.article-sidebar > section { border-color: var(--t-linka-jemna); border-radius: var(--t-zaobleni); background: var(--t-pozadi); }
.side-latest a:not(.side-all-link) { color: var(--t-text); font-weight: 700; text-decoration: none; }
.side-latest a:not(.side-all-link):hover { color: var(--t-akcent); }