/* Banner de consentimiento de cookies (ConsentBanner.php + consent.js). Solo variables de evoBase; sin fuentes, imágenes ni
   direcciones externas. La plantilla lo carga únicamente si el banner está activado en el estilo. */

/* El atributo hidden gana a las reglas de display de los componentes (esta regla pesa más que una clase). */
.evotheme-consent [hidden] {
    display: none;
}

.evotheme-consent__sr,
.evotheme-consent__status {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* ---- Banner ---- */
.evotheme-consent__banner {
    --evotheme-consent-gap: var(--evo-space-4);
    position: fixed;
    z-index: 900;
    box-sizing: border-box;
    max-block-size: calc(100dvh - 2 * var(--evotheme-consent-gap));
    overflow: auto;
    background: var(--evo-color-surface);
    color: var(--evo-color-text);
    border: var(--evo-border-width, 1px) solid var(--evo-color-border);
}

.evotheme-consent__banner--gap-none { --evotheme-consent-gap: 0px; }
.evotheme-consent__banner--gap-sm { --evotheme-consent-gap: var(--evo-space-2); }
.evotheme-consent__banner--gap-md { --evotheme-consent-gap: var(--evo-space-4); }
.evotheme-consent__banner--gap-lg { --evotheme-consent-gap: var(--evo-space-6); }

/* Tarjeta: una esquina, el centro inferior o el centro superior. */
.evotheme-consent__banner--card {
    inline-size: min(26rem, calc(100vw - 2 * var(--evotheme-consent-gap)));
    padding: var(--evo-space-5);
    border-radius: var(--evo-radius-md);
    box-shadow: var(--evo-shadow-md);
}

.evotheme-consent__banner--card.evotheme-consent__banner--bottom-start,
.evotheme-consent__banner--card.evotheme-consent__banner--bottom-center,
.evotheme-consent__banner--card.evotheme-consent__banner--bottom-end {
    inset-block-end: var(--evotheme-consent-gap);
}

.evotheme-consent__banner--card.evotheme-consent__banner--bottom-start { inset-inline-start: var(--evotheme-consent-gap); }
.evotheme-consent__banner--card.evotheme-consent__banner--bottom-end { inset-inline-end: var(--evotheme-consent-gap); }

.evotheme-consent__banner--card.evotheme-consent__banner--bottom-center,
.evotheme-consent__banner--card.evotheme-consent__banner--top {
    inset-inline: 0;
    margin-inline: auto;
}

.evotheme-consent__banner--card.evotheme-consent__banner--top { inset-block-start: var(--evotheme-consent-gap); }

/* Barra: a todo el ancho de la ventana, pegada arriba o abajo. */
.evotheme-consent__banner--section {
    inset-inline: 0;
    inset-block-end: 0;
    border-inline: 0;
    border-block-end: 0;
}

.evotheme-consent__banner--section.evotheme-consent__banner--top {
    inset-block: 0 auto;
    border-block: 0 var(--evo-border-width, 1px) solid var(--evo-color-border);
}

.evotheme-consent__inner {
    display: grid;
    gap: var(--evo-space-2);
}

.evotheme-consent__banner--section .evotheme-consent__inner {
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: var(--evo-space-6);
    align-items: center;
    max-inline-size: 72rem;
    margin-inline: auto;
    padding: var(--evo-space-4) var(--evo-space-5);
}

.evotheme-consent__banner--section .evotheme-consent__title,
.evotheme-consent__banner--section .evotheme-consent__text { grid-column: 1; }

.evotheme-consent__banner--section .evotheme-consent__actions {
    grid-column: 2;
    grid-row: 1 / span 2;
    margin-block-start: 0;
}

.evotheme-consent__title {
    margin: 0;
    font-family: var(--evo-font-heading, var(--evo-font-family-sans));
    font-size: var(--evo-font-size-lg);
    font-weight: 700;
    line-height: var(--evo-line-height-heading, 1.2);
}

.evotheme-consent__text p {
    margin: 0 0 var(--evo-space-2);
}

.evotheme-consent__text :where(p):last-child {
    margin-block-end: 0;
}

.evotheme-consent__link {
    color: inherit;
    text-decoration: underline;
}

/* Fondos de color: los botones rellenos se invierten para no desaparecer sobre el fondo. */
.evotheme-consent__banner--tone-primary .evo-button:where(:not(.evo-button--ghost, .evo-button--secondary, .evo-button--text)) {
    background: var(--evo-color-on-primary);
    color: var(--evo-color-primary);
    border-color: var(--evo-color-on-primary);
}

.evotheme-consent__banner--tone-secondary .evo-button:where(:not(.evo-button--ghost, .evo-button--secondary, .evo-button--text)) {
    background: var(--evo-color-surface);
    color: var(--evo-color-text);
    border-color: var(--evo-color-surface);
}

.evotheme-consent__banner--tone-primary .evo-button--ghost,
.evotheme-consent__banner--tone-primary .evo-button--secondary,
.evotheme-consent__banner--tone-primary .evo-button--text,
.evotheme-consent__banner--tone-secondary .evo-button--ghost,
.evotheme-consent__banner--tone-secondary .evo-button--secondary,
.evotheme-consent__banner--tone-secondary .evo-button--text {
    color: inherit;
}

.evotheme-consent__banner--tone-primary .evo-button--ghost,
.evotheme-consent__banner--tone-primary .evo-button--secondary,
.evotheme-consent__banner--tone-secondary .evo-button--ghost,
.evotheme-consent__banner--tone-secondary .evo-button--secondary {
    border-color: currentcolor;
}

/* ---- Cuadro de preferencias ---- */
.evotheme-consent__dialog {
    box-sizing: border-box;
    inline-size: min(40rem, calc(100vw - 2rem));
    max-block-size: calc(100dvh - 2rem);
    padding: var(--evo-space-5);
    overflow: auto;
    background: var(--evo-color-surface);
    color: var(--evo-color-text);
    border: var(--evo-border-width, 1px) solid var(--evo-color-border);
    border-radius: var(--evo-radius-md);
    box-shadow: var(--evo-shadow-md);
}

.evotheme-consent__dialog::backdrop {
    background: var(--evo-color-backdrop);
}

.evotheme-consent__dialog-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--evo-space-3);
}

.evotheme-consent__modal-title {
    margin: 0;
    font-size: var(--evo-font-size-2xl);
}

.evotheme-consent__intro {
    margin-block: var(--evo-space-2) var(--evo-space-4);
}

.evotheme-consent__cats {
    --evotheme-consent-check: 1.125rem;
    --evotheme-consent-cat-gap: var(--evo-space-4);
    display: grid;
    gap: var(--evotheme-consent-cat-gap);
    margin: 0;
    padding: 0;
    list-style: none;
}

.evotheme-consent__cats--large { --evotheme-consent-check: 1.5rem; }
.evotheme-consent__cats--gap-none { --evotheme-consent-cat-gap: 0px; }
.evotheme-consent__cats--gap-sm { --evotheme-consent-cat-gap: var(--evo-space-2); }
.evotheme-consent__cats--gap-md { --evotheme-consent-cat-gap: var(--evo-space-4); }
.evotheme-consent__cats--gap-lg { --evotheme-consent-cat-gap: var(--evo-space-6); }

.evotheme-consent__cat-head {
    display: flex;
    align-items: center;
    gap: var(--evo-space-3);
}

.evotheme-consent__check {
    flex: none;
    inline-size: var(--evotheme-consent-check);
    block-size: var(--evotheme-consent-check);
    margin: 0;
    accent-color: var(--evo-color-primary);
}

.evotheme-consent__cat-title {
    margin: 0;
    font-size: var(--evo-font-size-lg);
}

.evotheme-consent__cat-title label { cursor: pointer; }

.evotheme-consent__cat-title--h2 { font-size: var(--evo-font-size-2xl); }
.evotheme-consent__cat-title--h3 { font-size: var(--evo-font-size-xl); }
.evotheme-consent__cat-title--h4 { font-size: var(--evo-font-size-lg); }
.evotheme-consent__cat-title--h5 { font-size: var(--evo-font-size-base); }
.evotheme-consent__cat-title--h6 { font-size: var(--evo-font-size-sm); }

.evotheme-consent__always {
    margin-inline-start: auto;
    color: var(--evo-color-text-muted);
    font-size: var(--evo-font-size-sm);
}

.evotheme-consent__cat-desc,
.evotheme-consent__more {
    margin: var(--evo-space-1) 0 0;
    padding-inline-start: calc(var(--evotheme-consent-check) + var(--evo-space-3));
    color: var(--evo-color-text-muted);
}

.evotheme-consent__more summary {
    cursor: pointer;
    color: var(--evo-color-link);
    text-decoration: underline;
}

.evotheme-consent__more .evotheme-consent__cat-desc {
    margin: var(--evo-space-1) 0 0;
    padding-inline-start: 0;
}

.evotheme-consent__form > .evotheme-consent__actions {
    margin-block-start: var(--evo-space-5);
}

/* ---- Botón fijo para cambiar la elección ---- */
.evotheme-consent__reopen {
    position: fixed;
    z-index: 890;
    inset-inline-start: var(--evo-space-4);
    inset-block-end: var(--evo-space-4);
    background: var(--evo-color-surface);
    color: var(--evo-color-text);
    border-color: var(--evo-color-border);
    box-shadow: var(--evo-shadow-sm);
}

/* ---- Pantallas estrechas: la tarjeta pasa a ocupar el ancho, con su separación ---- */
@media (max-width: 40rem) {
    .evotheme-consent__banner--card {
        inline-size: auto;
        inset-inline: var(--evotheme-consent-gap);
        margin-inline: 0;
    }

    .evotheme-consent__banner--section .evotheme-consent__inner {
        grid-template-columns: minmax(0, 1fr);
    }

    .evotheme-consent__banner--section .evotheme-consent__actions {
        grid-column: 1;
        grid-row: auto;
        margin-block-start: var(--evo-space-3);
    }
}

/* Pantalla estrecha: los botones del banner se apilan a todo el ancho, como en YOOtheme. */
@media (max-width: 40rem) {
    .evotheme-consent__banner .evotheme-consent__actions {
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }

    .evotheme-consent__banner .evotheme-consent__actions .evo-button {
        inline-size: 100%;
    }
}

@media print {
    .evotheme-consent {
        display: none;
    }
}
