/*
 * Modal de cookies: colores propios con contraste garantizado (WCAG AA, 4,5:1).
 *
 * Los temas (Impact, Anyar, OnePage) fuerzan en su custom.css
 *   .btn { background-color: var(--secondary); }
 * pero el texto de los botones es el de Bootstrap, así que el contraste dependía
 * del color que cada web tuviera configurado como secundario. Aquí todo cuelga de
 * --ccs-brand, que cookie-consent.js calcula a partir del color secundario de la
 * web oscureciéndolo hasta llegar a 4,5:1 con texto blanco. Si no hay color o no se
 * puede leer, se usa un gris oscuro neutro.
 *
 * Todo va acotado a #cookies-modal (especificidad mayor que la de los temas).
 */
#cookies-modal {
    --ccs-brand: #212529;
    --ccs-text: #212529;
}

#cookies-modal .modal-content {
    color: var(--ccs-text);
    font-size: 0.875rem;
    line-height: 1.45;
}

/* Escala del modal: 14 px para todo el contenido (texto, categorías, botones) y 20 px el título */
#cookies-modal .modal-title {
    font-size: 1.25rem;
}

/* Enlaces: nunca el --link-color de la web (puede ser un amarillo ilegible sobre blanco) */
#cookies-modal a {
    color: var(--ccs-brand);
    text-decoration: underline;
}

#cookies-modal a:hover,
#cookies-modal a:focus {
    color: var(--ccs-brand);
    filter: brightness(0.85);
}

#cookies-modal .btn {
    font-weight: 600;
    font-size: 0.875rem;
    padding: 0.4rem 0.9rem;
    border-width: 2px;
    border-style: solid;
}

/* Acciones principales (Rechazar y Aceptar / Aceptar todas): mismo peso visual */
#cookies-modal .btn-primary,
#cookies-modal .btn-outline-primary,
#cookies-modal .btn-primary:hover,
#cookies-modal .btn-outline-primary:hover,
#cookies-modal .btn-primary:focus,
#cookies-modal .btn-outline-primary:focus,
#cookies-modal .btn-primary:active,
#cookies-modal .btn-outline-primary:active {
    background-color: var(--ccs-brand);
    border-color: var(--ccs-brand);
    color: #fff;
}

#cookies-modal .btn-primary:hover,
#cookies-modal .btn-outline-primary:hover {
    filter: brightness(0.9);
}

/* Acciones secundarias (Personalizar y Grabar selección) */
#cookies-modal .btn-secondary,
#cookies-modal .btn-outline-secondary,
#cookies-modal .btn-secondary:focus,
#cookies-modal .btn-outline-secondary:focus,
#cookies-modal .btn-secondary:active,
#cookies-modal .btn-outline-secondary:active {
    background-color: #fff;
    border-color: var(--ccs-brand);
    color: var(--ccs-brand);
}

#cookies-modal .btn-secondary:hover,
#cookies-modal .btn-outline-secondary:hover {
    background-color: #f1f3f5;
    border-color: var(--ccs-brand);
    color: var(--ccs-brand);
}

/* Foco visible en cualquier fondo */
#cookies-modal .btn:focus-visible,
#cookies-modal a:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px #fff, 0 0 0 5px #212529;
}

#cookies-modal .form-check-input:checked {
    background-color: var(--ccs-brand);
    border-color: var(--ccs-brand);
}

#cookies-modal .form-check-input:focus {
    box-shadow: 0 0 0 2px #fff, 0 0 0 5px #212529;
}