/* ==========================================================================
   consent.css
   Souhlasová lišta s cookies a tlačítko "Nastavení cookies" v patičce.

   Soubor se linkuje z head.php jen při zapnuté Google Analytics 4 (vyplněné
   ID v config/site.php), jinak se vůbec nestahuje. Všechny hodnoty jsou
   z tokens.css, nová barva ani nový rozměr tu nevzniká.
   ========================================================================== */

/* ================================ LIŠTA ==================================
   Světlá karta vlevo dole, na mobilu přes celou šířku. Plovoucí kolečko
   "Napište nám" je vpravo dole a na širších obrazovkách se s lištou
   nepotkají. Na úzkých ji lišta zakryje, dokud se návštěvník nerozhodne.
   Stránku nezakrývá ani neblokuje, je to jen karta nad obsahem.
   ========================================================================= */

.cookie-banner {
    position: fixed;
    left: var(--space-4);
    right: var(--space-4);
    bottom: max(var(--space-4), env(safe-area-inset-bottom));
    z-index: var(--z-overlay);
    max-width: 34rem;
    padding: var(--space-5);
    border: 1px solid var(--border);
    border-radius: var(--radius-card);
    background-color: var(--surface);
    color: var(--ink);
    box-shadow: var(--shadow-card);

    /* Výchozí stav animace. Třídu is-visible přidá consent.js. */
    opacity: 0;
    transform: translateY(var(--space-4));
    transition: opacity var(--dur-med) var(--ease-out),
                transform var(--dur-med) var(--ease-out);
}

.cookie-banner.is-visible {
    opacity: 1;
    transform: none;
}

.cookie-banner__title {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--size-h5);
    font-weight: var(--weight-semibold);
    letter-spacing: var(--tracking-sub);
    line-height: 1.2;
}

/* Červená tečka jako v logu. */
.cookie-banner__title::before {
    content: '';
    flex: none;
    width: var(--space-2);
    height: var(--space-2);
    border-radius: 50%;
    background-color: var(--red);
}

.cookie-banner__text {
    margin-top: var(--space-3);
    font-size: var(--size-small);
    line-height: var(--leading-body);
    color: var(--muted-2);
}

.cookie-banner__link {
    color: var(--ink);
    text-decoration: underline;
    text-underline-offset: .2em;
}

.cookie-banner__link:hover {
    color: var(--pink-ink);
}

/* Obě tlačítka dělí šířku napůl a mají stejnou podobu. */
.cookie-banner__actions {
    display: flex;
    gap: var(--space-3);
    margin-top: var(--space-5);
}

.cookie-banner__actions .btn {
    flex: 1 1 0;
    min-width: 0;
}

/* Tmavé tlačítko samo na najetí nic nedělá (šipka je tady vypnutá),
   proto lehké ztmavení, ať je znát, že reaguje. */
.cookie-banner__actions .btn--dark:hover .btn__bg,
.cookie-banner__actions .btn--dark:focus-visible .btn__bg {
    background-color: var(--ink);
    border-color: var(--ink);
}

@media (min-width: 48rem) {
    .cookie-banner {
        left: var(--space-5);
        right: auto;
        bottom: max(var(--space-5), env(safe-area-inset-bottom));
        width: 34rem;
        padding: var(--space-6);
    }
}

/* Omezený pohyb: karta se jen objeví, bez posunu a bez přechodu. Tokeny
   v tokens.css zkracují i trvání, ale tady se pohyb vypíná výslovně. */
@media (prefers-reduced-motion: reduce) {
    .cookie-banner {
        transform: none;
        transition: none;
    }
}

/* Na papír lišta nepatří. */
@media print {
    .cookie-banner {
        display: none;
    }
}

/* ===================== TLAČÍTKO V PATIČCE ================================
   Vypadá jako ostatní odkazy v patičce (barvu a najetí dává .footer__link),
   jen je to button. Reset písma a pozadí dělá base.css, tady zbývá zarovnání.
   ========================================================================= */

.footer__link--button {
    padding: 0;
    text-align: left;
    font-size: inherit;
}

/* Místo pro plovoucí kolečko "Napište nám" v dolní řadě patičky řeší
   layout.css (.footer__bottom), platí i bez zapnuté analytiky. */