/**
 * Příchod – ŠABLONA PRVKŮ (Jakub 10. 10. 2026): jednotné velikosti tlačítek, ikon, skupin a štítků na celém webu.
 * Mobil je priorita: všechny ovládací prvky mají na telefonu dotykovou plochu aspoň 40 px.
 *
 * Načítá se ve vzhledu Příchod jako POSLEDNÍ (includes/header.php, za $lookStylesheets), takže řídí velikosti
 * i tam, kde je stránkové styly (čtečka, filtry) nastavily jinak. Barvy a tvary zůstávají v prichod*.css –
 * tady jen rozměry, písmo a zarovnání. Pravidla popsaná v STYLE-GUIDE.md (oddíl „Šablona prvků – Příchod“).
 *
 * Řada velikostí 24 / 36 / 48 px (Jakub 10. 10.); na telefonu a dotykových zařízeních 24 / 40 / 48 (prst).
 *   Hlavní tlačítko    48 px         zelená pilulka, 1rem / 600        Začít číst, Odeslat, Přihlásit se, kapitoly
 *   Vedlejší tlačítko  36 px (40)    obrysová pilulka, 0,95rem / 500   ← Zpět, Vymazat, Další filtry, Načíst další
 *   Ikona              36 px (40)    kruh                              Kapitoly, značky, oko, čtečka, mapa, sítě autora
 *   Ikona přes obrázek 48 px (40)    kruh                              šipky karuselu a bannerů; bublina značek 48 vždy
 *   Skupina            36 px (40)    poskládaná tlačítka               filtry, panel čtečky, legenda míst
 *   Štítek             24 px         pilulka, 0,8rem / 600             Povídka, 3 kapitoly, povaha postavy
 *   (v závorce = telefon / dotyk)
 * Bez verzálek u tlačítek (normální písmo), verzálky jen u drobných nadpisů skupin.
 */

/* klepnutí na telefonu: Safari / Chrome jinak na okamžik vybarví obdélník celého prvku (Jakub 10. 10.: „čtverec“ při
   klepnutí na knoflík v logu nebo „+“ u příběhu – tlačítka jsou kulatá, zvýraznění hranaté). Zpětnou vazbu dávají
   vlastní stavy :hover / :active / :focus-visible. */
:root[data-look="prichod"] :is(a, button, [role="button"], summary, label, input, select) {
    -webkit-tap-highlight-color: transparent;
}

:root[data-look="prichod"] {
    --pr-el-primary: 3rem;
    --pr-el-control: 2.25rem;
    --pr-el-icon-lg: 3rem;
    --pr-el-tag: 1.5rem;
}

/* telefon a dotyková zařízení: ovládací prvky 40 px (dotyková plocha), ikony přes obrázek také 40 px */
@media (max-width: 768px), (pointer: coarse) {
    :root[data-look="prichod"] {
        --pr-el-control: 2.5rem;
    }
}

@media (max-width: 768px) {
    :root[data-look="prichod"] {
        --pr-el-icon-lg: 2.5rem;
    }
}

/* ---------- Hlavní tlačítko (44 px) ---------- */
:root[data-look="prichod"] body :is(
    .story-row__cta,
    .page-main .auth-form .auth-form__submit,
    .page-main .auth-form button[type="submit"],
    .account-panel__cta,
    .site-utility-auth-form__submit
) {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    height: var(--pr-el-primary) !important;
    min-height: var(--pr-el-primary) !important;
    padding: 0 1.5em !important;
    font-family: var(--font-body) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    box-sizing: border-box;
}

/* tlačítka kapitol pod textem = dvojice (Předchozí obrys, Další zelená) ve velikosti hlavního tlačítka */
:root[data-look="prichod"] body.story-reader-body .story-chapter-btn {
    --pr-h: var(--pr-el-primary);
    height: var(--pr-el-primary) !important;
    min-height: var(--pr-el-primary) !important;
    padding: 0 1.4em !important;
    font-family: var(--font-body) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

/* ---------- Vedlejší tlačítko (40 px) ---------- */
:root[data-look="prichod"] body :is(
    .back-link,
    .character-back-link,
    .list-chip--signpost,
    .story-filters__reset,
    .page-list-filter__reset,
    .obrlobus-articles__load-more,
    .obrlobus-section__more:not(.obrlobus-section__more--icon),
    .account-preview__more
) {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 0.45em;
    height: var(--pr-el-control) !important;
    min-height: var(--pr-el-control) !important;
    padding: 0 1.25em !important;
    font-family: var(--font-body) !important;
    font-size: 0.95rem !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    box-sizing: border-box;
}

:root[data-look="prichod"] body .story-filters--quick {
    --pr-h: var(--pr-el-control);
}

/* karty deníku (Citát z vaší sbírky, Potkané postavy…): proklik = vedlejší tlačítko na střed dole, ne podtržený text */
:root[data-look="prichod"] body.page-account .account-preview__more {
    align-self: center;
    margin-top: auto;
    text-decoration: none !important;
}

:root[data-look="prichod"] body.page-account .account-preview > :not(.account-preview__more):nth-last-child(2) {
    margin-bottom: 1.1rem !important; /* pevná mezera nad tlačítkem i v nejvyšší kartě (dřív se tlačítko dotýkalo citátu a odznaků) */
}

:root[data-look="prichod"] body.page-account .account-preview__more:focus-visible {
    outline: 2px dashed var(--pr-ink);
    outline-offset: 3px;
}

:root[data-look="prichod"] body .story-filters--quick .story-filters__mobile-toggle.story-filters__more {
    height: var(--pr-el-control) !important;
}

/* ---------- Ikona (40 px) ---------- */
:root[data-look="prichod"] body :is(
    .story-row__chapters-toggle,
    .char-reveal-toggle,
    .map-tool,
    .story-reading-focus-btn,
    .author-page__social-link
),
:root[data-look="prichod"] body.story-reader-body .story-chapter-menu-btn {
    width: var(--pr-el-control) !important;
    min-width: var(--pr-el-control) !important;
    height: var(--pr-el-control) !important;
    min-height: var(--pr-el-control) !important;
    padding: 0 !important;
    box-sizing: border-box;
}

/* ikona s počtem (značky, záložky): výška ikony, šířka podle obsahu */
:root[data-look="prichod"] body .story-row__marks-toggle,
:root[data-look="prichod"] body.story-reader-body .story-bookmarks-toggle {
    min-width: var(--pr-el-control) !important;
    height: var(--pr-el-control) !important;
    min-height: var(--pr-el-control) !important;
    box-sizing: border-box;
}

/* ---------- Ikona přes obrázek (48 px, na telefonu 40 px) ---------- */
:root[data-look="prichod"] body :is(.char-catalog__arrow, .obrlobus-promo__nav) {
    width: var(--pr-el-icon-lg) !important;
    height: var(--pr-el-icon-lg) !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
}

/* bublina „Přidat značku“ ve čtečce = kulaté hlavní tlačítko 48 px (i na telefonu – palec) */
:root[data-look="prichod"] body.story-reader-body .rb-dial__main {
    width: 3rem !important;
    height: 3rem !important;
    border-radius: 50% !important;
    -webkit-mask: none !important;
    mask: none !important;
}

/* ---------- Skupina (40 px) – panel čtečky; filtry mají --pr-h v prichod-pages.css ---------- */
:root[data-look="prichod"] body.story-reader-body {
    --pr-h: var(--pr-el-control);
}

:root[data-look="prichod"] body.story-reader-body :is(.story-reading-theme-btn, .story-reading-size-btn) {
    min-width: 2.75rem !important;
}

:root[data-look="prichod"] body.story-reader-body .story-chapter-jump-btn {
    --pr-h: var(--pr-el-control);
}

/* ---------- Štítek (24 px) ---------- */
:root[data-look="prichod"] body :is(.story-tag, .story-type-badge) {
    display: inline-flex !important;
    align-items: center;
    height: var(--pr-el-tag) !important;
    min-height: 0 !important;
    padding: 0 0.7em !important;
    font-family: var(--font-body) !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    box-sizing: border-box;
}

/* telefon: štítky karty příběhu se vejdou do jednoho řádku (výška zůstává 24 px) */
@media (max-width: 640px) {
    :root[data-look="prichod"] body :is(.story-tag, .story-type-badge) {
        padding: 0 0.55em !important;
        font-size: 0.75rem !important;
    }
}

/* povaha postavy (dřív jen barevný text verzálkami) = obrysový štítek v barvě povahy */
:root[data-look="prichod"] body .nature-tag {
    display: inline-flex !important;
    align-items: center;
    width: fit-content !important;
    max-width: 100%;
    height: var(--pr-el-tag) !important;
    padding: 0 0.7em !important;
    border: 1px solid currentColor !important;
    border-radius: 999px !important;
    font-family: var(--font-body) !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    box-sizing: border-box;
}

/* ---------- Odkaz v textu („Nedočkám se“ u Postav) = jako ostatní odkazy ---------- */
:root[data-look="prichod"] body.page-characters-archive .char-reveal-note button {
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    color: var(--pr-link) !important;
    font: inherit !important;
    font-weight: 500 !important;
    text-decoration: underline !important;
    text-underline-offset: 0.2em;
    cursor: pointer;
}

/* ---------- Nadpis stránky: zarovnaný s obsahem i tam, kde stojí přímo ve stránce (Přihlášení, Kontakt, Autor…);
   na telefonu sedí už teď (okraj 16 px jako obsah) ---------- */
@media (min-width: 641px) {
    :root[data-look="prichod"] body .page-main > .page-heading {
        width: 100%;
        max-width: var(--content-shell-max, 1280px);
        margin-inline: auto !important;
        padding-inline: var(--page-gutter-left, 1.5rem) var(--page-gutter-right, 1.5rem) !important;
        box-sizing: border-box;
    }
}