/* ============================================================
   ENTRETELAS — CSS COMÚN
   Variables, reset base, toast y spinner.
   Cargado por todas las páginas ANTES del CSS específico.
============================================================ */

:root {
    --terracota: #A64B2A;
    --terracota-oscuro: #7A3520;
    --terracota-claro: #C66B45;
    --crema: #FAF7F2;
    --crema-oscuro: #F0E9DC;
    --texto: #2A2118;
    --gris: #8A8078;
    --gris-claro: #BFB6AB;
    --borde: #E8E0D5;
    --verde: #2D8659;
    --verde-claro: #E4F4EC;
    --amarillo: #C99B2D;
    --amarillo-claro: #FBF1D7;
    --rojo: #C0392B;
    --rojo-claro: #FBE9E7;
    --azul: #2C6E91;
    --azul-claro: #E4EFF5;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: 'DM Sans', sans-serif;
    background: var(--crema);
    color: var(--texto);
}

/* ============================================
   TOAST (compartido)
============================================ */
.toast {
    position: fixed;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%) translateY(100px);
    background: var(--texto);
    color: white;
    padding: 12px 22px;
    border-radius: 8px;
    font-size: 0.9rem;
    opacity: 0;
    transition: all 0.3s;
    z-index: 1000;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.25);
    pointer-events: none;
    font-family: 'DM Sans', sans-serif;
}
.toast.show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* ============================================
   SPINNER (compartido)
============================================ */
.spinner {
    width: 38px;
    height: 38px;
    border: 3px solid var(--borde);
    border-top-color: var(--terracota);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}
@keyframes spin {
    to { transform: rotate(360deg); }
}

/* ============================================
   LOGO NAVBAR (compartido)
============================================ */
.navbar-logo-img {
    height: 60px;
    width: auto;
    display: block;
    object-fit: contain;
}

/* ── ACCESIBILIDAD: FOCO GLOBAL ─────────────────────────── */
*:focus { outline: none; }
*:focus-visible {
    outline: 2px solid var(--terracota);
    outline-offset: 2px;
    border-radius: 3px;
}

/* ── ACCESIBILIDAD: MOVIMIENTO REDUCIDO ─────────────────── */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ============================================
   FOOTER (compartido)
============================================ */
.site-footer {
    text-align: center;
    padding: 24px 20px;
    border-top: 1px solid var(--borde);
    font-size: 0.8rem;
    color: var(--gris);
    margin-top: 60px;
}
.site-footer a {
    color: var(--terracota);
    text-decoration: none;
}
.site-footer a:hover { text-decoration: underline; }