/*
Theme Name: JPF články
Theme URI: https://www.jakprodatfirmuzamaximum.cz/clanky/
Author: Pavel Řehulka
Description: Lehká šablona jen pro články webu jakprodatfirmuzamaximum.cz. Vzhled, menu, patičku, písma a měření sdílí se statickým webem (/assets/css/v3.css, /assets/js/analytics.js), sama přidává jen styly článku. Bez Thrive, bez jQuery, bez blokových stylů.
Version: 1.1.0
Requires at least: 6.3
Tested up to: 7.1
Requires PHP: 7.4
License: Proprietární
Text Domain: jpf-clanky
*/

/* ============================================================
   Tady je jen to, co mají články navíc. Barvy, písmo, velikosti,
   hlavička, tmavý úvod stránky, sekce, tlačítka a patička jsou
   ve sdíleném /assets/css/v3.css. Nic z toho sem nekopírovat:
   změna vzhledu webu tak platí i pro články.
   Záměrně ne: kresby, kolečko s fotkou, číslování 01-06, zlatá
   (ta znamená jen peníze, které majitel nechává ležet).
   ============================================================ */

/* ---------- Přístupnost, lišta administrace ---------- */
.skip-link{position:absolute;left:16px;top:-200px;z-index:100;padding:12px 18px;background:#fff;color:var(--g);font-weight:500}
.skip-link:focus{top:12px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- Úvod článku: stejná tmavá plocha jako na ostatních stránkách ---------- */
.drobecky{margin:0 0 20px;font-size:16px;font-weight:300}
.drobecky ol{display:flex;min-width:0;margin:0;padding:0;list-style:none}
.drobecky li{margin:0;white-space:nowrap}
.drobecky li+li::before{content:"/";margin:0 .55em;opacity:.6}
.drobecky li:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis}
.page-hero .drobecky a{color:var(--ice);text-underline-offset:3px}

.clanek-meta{display:flex;flex-wrap:wrap;gap:2px 0;margin:20px 0 0;font-size:16px}
.clanek-meta span+span::before{content:"·";margin:0 .6em;opacity:.6}
.page-hero .clanek-meta a{color:#fff;font-weight:500;text-decoration:none}
.page-hero .clanek-meta a:hover{text-decoration:underline;text-underline-offset:3px}

/* ---------- Tělo článku a osnova ---------- */
.clanek-telo{display:grid;grid-template-columns:minmax(0,var(--text)) minmax(0,260px);justify-content:space-between;gap:48px;padding-block:56px 76px}
.clanek-sloupec{min-width:0}
.clanek-lista{position:sticky;top:32px;align-self:start}
.clanek-osnova{padding-top:12px;border-top:2px solid var(--g);font-size:16px}
.clanek-osnova-stitek{margin:0 0 8px;font-weight:500}
.clanek-osnova ol{margin:0;padding:0;list-style:none}
.clanek-osnova li{margin:0;border-bottom:1px solid var(--rule)}
.clanek-osnova a{display:block;padding:10px 0;line-height:1.35;color:var(--mut);text-decoration:none}
.clanek-osnova a:hover{color:var(--blue)}
@media (max-width:1040px){
  .clanek-telo{grid-template-columns:minmax(0,1fr)}
  .clanek-lista{display:none}
}

/* Krátká odpověď: stejná světlá plocha jako ostatní rámečky webu */
.kratka-odpoved{margin:0 0 40px;padding:24px 28px;background:var(--pale)}
.kratka-odpoved-stitek{margin:0 0 8px;font-weight:500}
.kratka-odpoved p:last-child{margin-bottom:0}

/* ---------- Typografie textu ---------- */
.clanek-obsah{line-height:1.6;color:var(--soft)}
.clanek-obsah>:first-child{margin-top:0}
.clanek-obsah strong{color:var(--g)}
.clanek-obsah p,.clanek-obsah ul,.clanek-obsah ol{margin:0 0 1em}
.clanek-obsah h2{margin:44px 0 12px;color:var(--g);font-size:clamp(25px,2.4vw,29px);line-height:1.2}
.clanek-obsah h3,.clanek-obsah h4{margin:32px 0 8px;color:var(--g);font-size:21px;font-weight:500;line-height:1.3;letter-spacing:0}
.clanek-obsah h2+h3{margin-top:16px}
.clanek-obsah ul,.clanek-obsah ol{padding-left:1.25em}
.clanek-obsah li{margin:.35em 0}
.clanek-obsah blockquote{margin:32px 0;font-size:21px;line-height:1.38;color:var(--g)}
.clanek-obsah img{height:auto}
.clanek-obsah figure{margin:32px 0}
.clanek-obsah figcaption,.clanek-obsah .wp-caption-text{margin-top:8px;font-size:16px;color:var(--mut)}
.clanek-obsah .wp-caption{max-width:100%}
.clanek-obsah .aligncenter{display:block;margin-left:auto;margin-right:auto}
.tabulka{overflow-x:auto;margin:24px 0}
.tabulka table{width:100%;border-collapse:collapse}
.tabulka th,.tabulka td{padding:12px 16px 12px 0;text-align:left;vertical-align:top;border-top:1px solid var(--rule)}
.tabulka th{font-weight:400;font-size:16px;color:var(--mut);border-top:0}

/* Rámeček „Jak to vidí kupující" */
.kupujici,.clanek-obsah blockquote.kupujici{margin:40px 0;padding:24px 28px;background:var(--pale);font-size:19px;line-height:1.55;color:var(--g)}
.kupujici::before{content:"Jak to vidí kupující";display:block;margin-bottom:8px;font-weight:500}
.kupujici>:last-child{margin-bottom:0}

/* Časté otázky */
.clanek-faq{margin-top:44px}
.clanek-faq .faq-polozka{padding:16px 0;border-top:1px solid var(--rule)}
.clanek-faq .faq-polozka:last-child{border-bottom:1px solid var(--rule)}
.clanek-obsah .clanek-faq h3{margin:0 0 6px}
.clanek-faq .faq-polozka>:last-child{margin-bottom:0}

/* ---------- Výzva pod článkem: jako závěr ostatních stránek ---------- */
.clanek-vyzva{margin-top:48px;padding:36px 32px;background:var(--g);color:#fff}
.clanek-vyzva h2{margin:0 0 12px}
.clanek-vyzva p{font-weight:300}
.clanek-vyzva .cta-row{margin-top:24px}
.clanek-vyzva .btn{background:#fff;color:var(--g)}
.clanek-vyzva .btn:hover{background:var(--ice)}
.clanek-vyzva-pozn{margin:14px 0 0;font-size:16px}
.clanek-vyzva-pozn a{color:var(--ice)}
.clanek-vyzva :focus-visible{outline-color:var(--ice)}

/* ---------- Autor: čtvercová fotka jako na ostatních stránkách ---------- */
.clanek-autor{display:grid;grid-template-columns:96px minmax(0,1fr);gap:20px;align-items:start;margin-top:48px}
.clanek-autor img{width:96px;height:96px;object-fit:cover}
.clanek-autor p{margin:0 0 6px;font-size:16px;line-height:1.5;color:var(--mut)}
.clanek-autor .clanek-autor-jmeno{font-size:19px;color:var(--g)}
.clanek-autor-odkazy{display:flex;flex-wrap:wrap;gap:0 24px}
.clanek-poznamka{margin:24px 0 0;font-size:16px;color:var(--mut)}

/* ---------- Výpis článků: řádky oddělené linkami, bez kartiček a obrázků ---------- */
.vypis-temata{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.vypis-temata a{display:inline-flex;align-items:center;min-height:44px;padding:8px 14px;border:1px solid rgba(255,255,255,.4);border-radius:3px;font-size:16px;color:#fff;text-decoration:none}
.vypis-temata a:hover{border-color:#fff}
.page-hero .vypis-temata a[aria-current]{background:#fff;border-color:#fff;color:var(--g)}
.vypis{border-top:2px solid var(--g)}
.polozka{padding:28px 0;border-bottom:1px solid var(--rule)}
.polozka-tema{margin:0 0 6px;font-size:16px;font-weight:500;color:var(--mut)}
.polozka-titulek{margin:0;font-size:clamp(25px,2.4vw,29px);line-height:1.2;max-width:30em}
.polozka--hlavni .polozka-titulek{font-size:clamp(29px,3vw,42px);line-height:1.15;max-width:21em}
.polozka-titulek a{color:var(--g);text-decoration:none}
.polozka-titulek a:hover{color:var(--blue);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.polozka-perex{margin:10px 0 0;max-width:var(--text);color:var(--soft)}
.polozka-meta{margin:10px 0 0;font-size:16px;color:var(--mut)}
.vypis-prazdny{padding:32px 0;border-top:2px solid var(--g)}

/* Stránkování */
.navigation.pagination{margin-top:32px}
.nav-links{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.nav-links .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 14px;border:1px solid var(--rule-strong);border-radius:3px;color:var(--g);text-decoration:none}
.nav-links a.page-numbers:hover{border-color:var(--g)}
.nav-links .page-numbers.current{background:var(--g);border-color:var(--g);color:#fff}
.nav-links .page-numbers.dots{border:0;min-width:0;padding:0 4px}

/* ---------- Související články a 404 ---------- */
.dalsi-hlava{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 24px;margin-bottom:8px}
.dalsi-hlava h2{margin:0}
.clanek-dalsi .dalsi-seznam{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 48px;margin:0;padding:0;list-style:none}
.clanek-dalsi .dalsi-seznam>li{margin:0;border-top:2px solid var(--g)}
.dalsi-seznam .polozka{padding:20px 0;border-bottom:0}
.dalsi-seznam .polozka-titulek{font-size:21px;line-height:1.3;font-weight:500;letter-spacing:0}
@media (max-width:980px){
  .clanek-dalsi .dalsi-seznam{grid-template-columns:minmax(0,1fr)}
  .clanek-telo{padding-block:40px 56px}
}

/* ---------- Stránka ---------- */
.stranka-obsah{max-width:var(--text)}

/* ---------- Malý displej ---------- */
@media (max-width:560px){
  .clanek-meta span:last-child{flex-basis:100%}
  .clanek-meta span:last-child::before{display:none}
  .kratka-odpoved,.kupujici,.clanek-obsah blockquote.kupujici{padding:20px 18px}
  .clanek-vyzva{padding:28px 18px}
  .clanek-autor{grid-template-columns:64px minmax(0,1fr);gap:14px}
  .clanek-autor img{width:64px;height:64px}
}

/* ---------- Tisk ---------- */
@media print{
  .site-top,.site-footer,.skip-link,.clanek-lista,.clanek-dalsi,.clanek-vyzva .cta-row,.drobecky{display:none}
  .page-hero{background:none;color:inherit;padding:0}
  .clanek-telo{display:block}
  .clanek-vyzva{background:none;color:inherit;padding:0}
}
