/*
 * Stopy v srdci v2.0 – stories-v2.css
 * PŘÍDAVNÁ vrstva nad stories.css (ten se neupravuje). Sdílená pro
 * /pribehy i /pribehy/{slug} – stories.php i story.php načítají tenhle
 * jeden soubor, oba mají tytéž třídy (stories.css je sám o sobě ze dvou
 * skoro duplicitních polovin pro výpis/detail, ale třídy se jmenují stejně).
 *
 * stories.css nikde neimportuje theme-variables.css – var(--primary-color,
 * #b08968) se proto vždycky vyhodnotí na fallback #b08968. Stačí
 * --primary-color/--primary-hover/--secondary-color/--text-secondary na
 * body.v2 předefinovat (napojené na v2-base.css tokeny) a naváže se to na
 * desítky míst v souboru najednou – stejný trik jako u grave-navigation-v2.css.
 *
 * Sémantické/stavové barvy (zelený odznak admin komentáře, červená u
 * nahlášení, zlatá u zvýrazněných příběhů, error/success box formuláře)
 * se NEPŘEBARVUJÍ – nesou vlastní význam, ne barvu značky.
 */
body.v2{
  --primary-color: var(--accent);
  --primary-hover: var(--accent-hi);
  --primary-light: var(--accent-soft);
  --secondary-color: var(--ink-3);
  --text-secondary: var(--ink-2);
}

/* Rámování stránky – dřív vlastní .card (app.css, 8px radius, barevný
   okraj, nechtěný "nadskočí" hover na celé stránce), teď stejný
   .page-frame jako na landing/obsahových stránkách (pages-v3.css).
   stories.css k tomu ale ještě natvrdo stanovuje typografii odstavců
   přes .container p/li (1,1rem, tučnější, 1,8 řádkování, prostrkání) –
   to je zbytek z doby, kdy .container obalovalo přímo .card; teď stejné
   .container obaluje .page-frame, tak by text uvnitř vypadal jinak než
   na ostatních stránkách. Vracíme na výchozí typografii z v2-base.css. */
body.v2 #main-content .container p,
body.v2 #main-content .container li{
  font-size: 1rem; font-weight: 400; line-height: var(--lh-body); letter-spacing: normal;
}

/* Skutečné nadpisy (h1–h4: .story-title, .additional-images-title,
   .sharing-title, .card-title) dostanou Inter i barvu automaticky z
   pravidla `body.v2 #main-content h1,h2,h3,h4` ve v2-base.css – má vyšší
   specificitu než třídy v stories.css, není potřeba nic dalšího.
   Rukopisný font zůstává jen na formulářových/tlačítkových prvcích,
   které to pravidlo nezasáhne (nejsou nadpisy) – ty je třeba opravit
   ručně. */
body.v2 #main-content .filter-input,
body.v2 #main-content .filter-select,
body.v2 #main-content .filter-clear,
body.v2 #main-content .story-expand-btn,
body.v2 #main-content .story-btn,
body.v2 #main-content .back-to-stories{font-family:var(--sans)}

/* Hover barva odesílacího tlačítka komentáře je v základním souboru
   natvrdo (ne přes proměnnou), proto se nenapojí na --primary-hover výše. */
body.v2 #main-content .comment-submit-btn-compact:hover:not(:disabled){
  background:var(--accent-hi);
}

/* Prázdný stav při ŽÁDNÝCH příbězích (vykreslený rovnou z PHP) – .no-results
   má v základu display:none (pro klientský filtr přes #no-results), tahle
   konkrétní instance (.is-visible) potřebuje být vidět hned. */
body.v2 #main-content .no-results.is-visible{display:block}

/* Přesun zbylých statických inline stylů ze šablon (viz stories.php a
   story.php) – JS (stories.js) dál řídí stav přes id + style.display,
   tady je jen výchozí stav před jeho zásahem. */
body.v2 #main-content .story-image img,
body.v2 #main-content .additional-image-item img{cursor:pointer}
body.v2 #main-content .comments-section,
body.v2 #main-content .comments-pagination{display:none}
body.v2 #main-content .story-meta-desc{margin-top:1.5rem}

/* v2-base.css dává odkazům uvnitř #main-content `color:inherit` (kvůli
   odkazům-nadpisům, aby nezůstaly modré) – tady je to ale odkaz stylovaný
   jako plné tlačítko/ikona, potřebuje barvu vrátit zpátky natvrdo. */
body.v2 #main-content .back-to-stories{color:#fff}
body.v2 #main-content .share-icon{
  color:var(--accent);background-color:var(--accent-soft);
}
body.v2 #main-content .share-icon:hover{color:#fff}

/* Filtr kategorie měl pevnou šířku 200px, do které se "Všechny kategorie"
   nevešlo (viz zpětná vazba) – stejně pružná šířka jako u vyhledávání.
   V media dotazu (min-width), ať nepřebije mobilní flex:1 1 100% ze
   stories.css vyšší specificitou mimo media dotaz. */
@media (min-width:769px){
  body.v2 #main-content .filter-category{flex:1 1 230px}
}

/* Zvýrazněné příběhy – žlutá korunka a postranní lišta byly v nové
   paletě příliš křiklavé. Korunka: nebarevná obrysová SVG (stejný
   princip jako ostatní ikony webu - fill:none, barva textu) místo
   barevné Font Awesome ikony (viz stories.php/story.php). Lišta a
   pozadí: tlumenější zlatá #e2c069 (stejná jako VIP odznak jinde na
   webu) místo syté #ffd700. */
body.v2 #main-content .featured-crown-badge{color:var(--ink-2)}
body.v2 #main-content .featured-crown-badge svg{
  width:1.2rem;height:1.2rem;vertical-align:-3px;
}
body.v2 #main-content .featured-crown-badge:hover{filter:none}
body.v2 #main-content .story-item.featured{
  border-left-color:#e2c069;
  background:linear-gradient(145deg,#FBF6E9,#ffffff);
}