/**
 * Motivos opcionales: html[data-special-day="<id>"] (solo en días definidos en modulos/fechas_especiales.php).
 */

/* SVG tiling de huellas (solo cuando aplica día del animal; evita cargar otros días). */
html[data-special-day="dia-animal"] {
    --fe-paw-tile-li: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='%23059669' opacity='0.11'%3E%3Cellipse cx='28' cy='36' rx='10' ry='9'/%3E%3Ccircle cx='16' cy='20' r='6'/%3E%3Ccircle cx='28' cy='13' r='5'/%3E%3Ccircle cx='40' cy='20' r='6'/%3E%3Ccircle cx='12' cy='34' r='4'/%3E%3Ccircle cx='44' cy='34' r='4'/%3E%3C/g%3E%3C/svg%3E");
    --fe-paw-tile-da: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='%2334d399' opacity='0.14'%3E%3Cellipse cx='28' cy='36' rx='10' ry='9'/%3E%3Ccircle cx='16' cy='20' r='6'/%3E%3Ccircle cx='28' cy='13' r='5'/%3E%3Ccircle cx='40' cy='20' r='6'/%3E%3Ccircle cx='12' cy='34' r='4'/%3E%3Ccircle cx='44' cy='34' r='4'/%3E%3C/g%3E%3C/svg%3E");
}

@keyframes feDiaAnimalRibbonShift {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 200% 50%;
    }
}

/* --- Día del animal: franja + huellas; acento caliente va en fecha/hora (abajo), no en el chip. --- */
/* Línea bajo ubicación/fecha: guiones algo más tintados al tema (sin volver a usar puntitos). */
html[data-special-day="dia-animal"][data-theme="light"] .h-meta__dots-rule {
    border-top-color: rgba(5, 95, 70, 0.38);
    opacity: 0.62;
}

html[data-special-day="dia-animal"][data-theme="dark"] .h-meta__dots-rule {
    border-top-color: rgba(110, 231, 183, 0.35);
    opacity: 0.55;
}

html[data-special-day="dia-animal"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(
        95deg,
        #065f46 0%,
        #059669 18%,
        #16a34a 38%,
        #eab308 55%,
        #ea580c 72%,
        #dc2626 88%,
        #059669 100%
    );
    background-size: 260% 100%;
    animation: feDiaAnimalRibbonShift 16s linear infinite;
}

html[data-special-day="dia-animal"][data-theme="light"] .pwa-header {
    --h-accent: #059669;
    --h-accent-soft: #ecfdf5;
}

html[data-special-day="dia-animal"][data-theme="light"] .pwa-header-root {
    background-image: radial-gradient(circle at 12% 0%, rgba(5, 150, 105, 0.12) 0%, transparent 46%),
        radial-gradient(circle at 88% 10%, rgba(234, 88, 12, 0.08) 0%, transparent 42%),
        var(--fe-paw-tile-li);
    background-repeat: no-repeat, no-repeat, repeat;
    background-size: auto, auto, 56px 56px;
    background-position: 0 0, 100% 0, 14px -8px;
}

html[data-special-day="dia-animal"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(
        95deg,
        #065f46 0%,
        #059669 18%,
        #16a34a 38%,
        #eab308 55%,
        #ea580c 72%,
        #dc2626 88%,
        #059669 100%
    );
    background-size: 260% 100%;
    animation: feDiaAnimalRibbonShift 18s linear infinite reverse;
}

html[data-special-day="dia-animal"][data-theme="light"] .pwa-bottom-nav::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 3px;
    bottom: 0;
    background-image: var(--fe-paw-tile-li);
    background-size: 56px 56px;
    opacity: 0.65;
    pointer-events: none;
    z-index: 0;
}

html[data-special-day="dia-animal"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #047857;
    --nav-active-icon: #10b981;
}

html[data-special-day="dia-animal"][data-theme="light"] .pwa-nav-item.active .pwa-nav-item__icon {
    background: linear-gradient(155deg, #ecfdf5 0%, #bbf7d0 50%, #6ee7b7 100%);
    color: var(--nav-active-icon);
    box-shadow:
        0 2px 10px rgba(5, 150, 105, 0.22),
        0 0 0 1px rgba(255, 255, 255, 0.65) inset;
}

html[data-special-day="dia-animal"][data-theme="light"] .pwa-nav-item.active .pwa-nav-item__icon .bi {
    color: #047857;
}

html[data-special-day="dia-animal"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(
        95deg,
        #042f2e 0%,
        #047857 20%,
        #15803d 40%,
        #a16207 58%,
        #b45309 75%,
        #b91c1c 90%,
        #047857 100%
    );
    background-size: 260% 100%;
    animation: feDiaAnimalRibbonShift 16s linear infinite;
}

html[data-special-day="dia-animal"][data-theme="dark"] .pwa-header {
    --h-accent: #34d399;
    --h-accent-soft: rgba(52, 211, 153, 0.12);
    --h-pin: #f87171;
}

html[data-special-day="dia-animal"][data-theme="dark"] .pwa-header-root {
    background-image: radial-gradient(circle at 14% -10%, rgba(52, 211, 153, 0.15) 0%, transparent 50%),
        radial-gradient(circle at 90% 0%, rgba(248, 113, 113, 0.1) 0%, transparent 45%),
        var(--fe-paw-tile-da);
    background-repeat: no-repeat, no-repeat, repeat;
    background-size: auto, auto, 56px 56px;
    background-position: 0 0, 100% 0, 18px -6px;
}

html[data-special-day="dia-animal"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(
        95deg,
        #042f2e 0%,
        #047857 20%,
        #15803d 40%,
        #a16207 58%,
        #b45309 75%,
        #b91c1c 90%,
        #047857 100%
    );
    background-size: 260% 100%;
    animation: feDiaAnimalRibbonShift 18s linear infinite reverse;
}

html[data-special-day="dia-animal"][data-theme="dark"] .pwa-bottom-nav::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 3px;
    bottom: 0;
    background-image: var(--fe-paw-tile-da);
    background-size: 56px 56px;
    opacity: 0.45;
    pointer-events: none;
    z-index: 0;
}

html[data-special-day="dia-animal"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #34d399;
    --nav-active-icon: #6ee7b7;
}

html[data-special-day="dia-animal"][data-theme="dark"] .pwa-nav-item.active .pwa-nav-item__icon {
    background: linear-gradient(155deg, #064e3b 0%, #047857 50%, #059669 100%);
    color: #ecfdf5;
}

html[data-special-day="dia-animal"][data-theme="dark"] .pwa-nav-item.active .pwa-nav-item__icon .bi {
    color: #6ee7b7;
}

/**
 * Franja superior + nave (barra inferior) por familia visual.
 * `data-fe-visual` lo setea PHP; dia-animal usa bloque específico [data-special-day] arriba.
 */
html[data-fe-visual="provincia-sf"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #134e4a 0%, #14b8a6 40%, #d97706 100%);
    background-size: 260% 100%;
    animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="provincia-sf"][data-theme="light"] .pwa-header {
    --h-accent: #0f766e;
    --h-accent-soft: rgba(204, 251, 241, 0.55);
}

html[data-fe-visual="provincia-sf"][data-theme="light"] .pwa-header-root {
    background-image: radial-gradient(circle at 16% -4%, rgba(20, 184, 166, 0.12) 0%, transparent 42%),
        radial-gradient(circle at 90% 10%, rgba(217, 119, 6, 0.1) 0%, transparent 45%);
}

html[data-fe-visual="provincia-sf"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #134e4a 0%, #14b8a6 40%, #d97706 100%);
    background-size: 260% 100%;
    animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="provincia-sf"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #0f766e;
    --nav-active-icon: #2dd4bf;
}

html[data-fe-visual="provincia-sf"][data-theme="light"] .h-meta__dots-rule {
    border-top-color: rgba(15, 118, 110, 0.42);
    opacity: 0.58;
}

html[data-fe-visual="provincia-sf"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #042f2e 0%, #115e59 45%, #9a3412 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="provincia-sf"][data-theme="dark"] .pwa-header {
    --h-accent: #2dd4bf;
    --h-accent-soft: rgba(45, 212, 191, 0.1);
}

html[data-fe-visual="provincia-sf"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #042f2e 0%, #115e59 45%, #9a3412 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="provincia-sf"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #5eead4;
    --nav-active-icon: #99f6e4;
}

html[data-fe-visual="trabajo-patrio"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #b91c1c 0%, #eab308 45%, #1d4ed8 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="trabajo-patrio"][data-theme="light"] .pwa-header {
    --h-accent: #b45309;
    --h-accent-soft: rgba(254, 243, 199, 0.6);
}

html[data-fe-visual="trabajo-patrio"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #b91c1c 0%, #eab308 45%, #1d4ed8 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="trabajo-patrio"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #ca8a04;
    --nav-active-icon: #facc15;
}

html[data-fe-visual="trabajo-patrio"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #7f1d1d 0%, #713f12 48%, #1e40af 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="trabajo-patrio"][data-theme="dark"] .pwa-header {
    --h-accent: #fbbf24;
    --h-accent-soft: rgba(251, 191, 36, 0.09);
}

html[data-fe-visual="trabajo-patrio"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #7f1d1d 0%, #713f12 48%, #1e40af 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="trabajo-patrio"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #fcd34d;
    --nav-active-icon: #fef08a;
}

html[data-fe-visual="memoria-malvinas"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #1e40af 0%, #475569 50%, #7f1d1d 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="memoria-malvinas"][data-theme="light"] .pwa-header {
    --h-accent: #334155;
    --h-accent-soft: rgba(226, 232, 240, 0.72);
}

html[data-fe-visual="memoria-malvinas"][data-theme="light"] .pwa-header-root {
    background-image: radial-gradient(circle at 50% 0%, rgba(30, 64, 175, 0.12) 0%, transparent 50%);
}

html[data-fe-visual="memoria-malvinas"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #1e40af 0%, #475569 50%, #7f1d1d 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="memoria-malvinas"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #1e40af;
    --nav-active-icon: #93c5fd;
}

html[data-fe-visual="memoria-malvinas"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #172554 0%, #334155 52%, #450a0a 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="memoria-malvinas"][data-theme="dark"] .pwa-header {
    --h-accent: #94a3b8;
    --h-accent-soft: rgba(148, 163, 184, 0.1);
}

html[data-fe-visual="memoria-malvinas"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #172554 0%, #334155 52%, #450a0a 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="memoria-malvinas"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #93c5fd;
    --nav-active-icon: #bfdbfe;
}

html[data-fe-visual="bomberos-selva"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #92400e 0%, #dc2626 38%, #166534 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="bomberos-selva"][data-theme="light"] .pwa-header {
    --h-accent: #c2410c;
    --h-accent-soft: rgba(254, 215, 170, 0.45);
}

html[data-fe-visual="bomberos-selva"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #92400e 0%, #dc2626 38%, #166534 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="bomberos-selva"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #ea580c;
    --nav-active-icon: #fb923c;
}

html[data-fe-visual="bomberos-selva"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #422006 0%, #881337 42%, #14532d 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="bomberos-selva"][data-theme="dark"] .pwa-header {
    --h-accent: #fb923c;
    --h-accent-soft: rgba(251, 146, 60, 0.08);
}

html[data-fe-visual="bomberos-selva"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #422006 0%, #881337 42%, #14532d 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="bomberos-selva"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #fdba74;
    --nav-active-icon: #fed7aa;
}

html[data-fe-visual="grafica"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #1e293b 0%, #5b21b6 55%, #0f172a 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="grafica"][data-theme="light"] .pwa-header {
    --h-accent: #4c1d95;
    --h-accent-soft: rgba(237, 233, 254, 0.6);
}

html[data-fe-visual="grafica"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #1e293b 0%, #5b21b6 55%, #0f172a 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="grafica"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #6d28d9;
    --nav-active-icon: #a78bfa;
}

html[data-fe-visual="grafica"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #020617 0%, #581c87 50%, #0f172a 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="grafica"][data-theme="dark"] .pwa-header {
    --h-accent: #c4b5fd;
    --h-accent-soft: rgba(196, 181, 253, 0.1);
}

html[data-fe-visual="grafica"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #020617 0%, #581c87 50%, #0f172a 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="grafica"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #a78bfa;
    --nav-active-icon: #ddd6fe;
}

html[data-fe-visual="mariano"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #3730a3 0%, #60a5fa 48%, #e0e7ff 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="mariano"][data-theme="light"] .pwa-header {
    --h-accent: #4338ca;
    --h-accent-soft: rgba(238, 242, 255, 0.92);
}

html[data-fe-visual="mariano"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #3730a3 0%, #60a5fa 48%, #eef2ff 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="mariano"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #4f46e5;
    --nav-active-icon: #818cf8;
}

html[data-fe-visual="mariano"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #1e1b4b 0%, #3730a3 50%, #0f172a 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="mariano"][data-theme="dark"] .pwa-header {
    --h-accent: #a5b4fc;
    --h-accent-soft: rgba(165, 180, 252, 0.1);
}

html[data-fe-visual="mariano"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #1e1b4b 0%, #3730a3 50%, #0f172a 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="mariano"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #818cf8;
    --nav-active-icon: #c7d2fe;
}

html[data-fe-visual="patrio-az"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #1e3a8a 0%, #2563eb 45%, #fbbf24 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="patrio-az"][data-theme="light"] .pwa-header {
    --h-accent: #1d4ed8;
    --h-accent-soft: rgba(219, 234, 254, 0.75);
}

html[data-fe-visual="patrio-az"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #1e3a8a 0%, #2563eb 45%, #fbbf24 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="patrio-az"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #1d4ed8;
    --nav-active-icon: #60a5fa;
}

html[data-fe-visual="patrio-az"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #1e3a8a 0%, #31589c 50%, #a16207 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="patrio-az"][data-theme="dark"] .pwa-header {
    --h-accent: #60a5fa;
    --h-accent-soft: rgba(96, 165, 250, 0.1);
}

html[data-fe-visual="patrio-az"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #1e3a8a 0%, #31589c 50%, #a16207 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="patrio-az"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #93c5fd;
    --nav-active-icon: #bfdbfe;
}

html[data-fe-visual="salud-suave"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #0f766e 0%, #e11d48 42%, #f9a8d4 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="salud-suave"][data-theme="light"] .pwa-header {
    --h-accent: #0d9488;
    --h-accent-soft: rgba(204, 251, 241, 0.5);
}

html[data-fe-visual="salud-suave"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #0f766e 0%, #e11d48 42%, #f9a8d4 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="salud-suave"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #0f766e;
    --nav-active-icon: #2dd4bf;
}

html[data-fe-visual="salud-suave"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #134e4a 0%, #9f1239 48%, #831843 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="salud-suave"][data-theme="dark"] .pwa-header {
    --h-accent: #5eead4;
    --h-accent-soft: rgba(244, 63, 94, 0.08);
}

html[data-fe-visual="salud-suave"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #134e4a 0%, #9f1239 48%, #831843 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="salud-suave"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #f472b6;
    --nav-active-icon: #fbcfe8;
}

html[data-fe-visual="deporte"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #14532d 0%, #16a34a 40%, #fbbf24 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="deporte"][data-theme="light"] .pwa-header {
    --h-accent: #15803d;
    --h-accent-soft: rgba(220, 252, 231, 0.72);
}

html[data-fe-visual="deporte"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #14532d 0%, #16a34a 40%, #fbbf24 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="deporte"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #16a34a;
    --nav-active-icon: #4ade80;
}

html[data-fe-visual="deporte"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #052e16 0%, #166534 50%, #a16207 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="deporte"][data-theme="dark"] .pwa-header {
    --h-accent: #4ade80;
    --h-accent-soft: rgba(74, 222, 128, 0.1);
}

html[data-fe-visual="deporte"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #052e16 0%, #166534 50%, #a16207 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="deporte"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #86efac;
    --nav-active-icon: #bbf7d0;
}

html[data-fe-visual="historia-sf"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #78350f 0%, #a16207 45%, #57534e 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="historia-sf"][data-theme="light"] .pwa-header {
    --h-accent: #92400e;
    --h-accent-soft: rgba(254, 243, 199, 0.62);
}

html[data-fe-visual="historia-sf"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #78350f 0%, #a16207 45%, #57534e 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="historia-sf"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #b45309;
    --nav-active-icon: #fbbf24;
}

html[data-fe-visual="historia-sf"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #451a03 0%, #713f12 50%, #44403c 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="historia-sf"][data-theme="dark"] .pwa-header {
    --h-accent: #fcd34d;
    --h-accent-soft: rgba(252, 211, 77, 0.08);
}

html[data-fe-visual="historia-sf"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #451a03 0%, #713f12 50%, #44403c 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="historia-sf"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #fde68a;
    --nav-active-icon: #fef3c7;
}

html[data-fe-visual="armada-mar"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #0c4a6e 0%, #0369a1 50%, #38bdf8 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="armada-mar"][data-theme="light"] .pwa-header {
    --h-accent: #0369a1;
    --h-accent-soft: rgba(224, 242, 254, 0.82);
}

html[data-fe-visual="armada-mar"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #0c4a6e 0%, #0369a1 50%, #38bdf8 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="armada-mar"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #0369a1;
    --nav-active-icon: #38bdf8;
}

html[data-fe-visual="armada-mar"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #082f49 0%, #0c4a6e 50%, #0e7490 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="armada-mar"][data-theme="dark"] .pwa-header {
    --h-accent: #38bdf8;
    --h-accent-soft: rgba(56, 189, 248, 0.1);
}

html[data-fe-visual="armada-mar"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #082f49 0%, #0c4a6e 50%, #0e7490 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="armada-mar"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #7dd3fc;
    --nav-active-icon: #bae6fd;
}

html[data-fe-visual="patrio-celeste"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #0369a1 0%, #7dd3fc 38%, #e0f2fe 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="patrio-celeste"][data-theme="light"] .pwa-header {
    --h-accent: #0284c7;
    --h-accent-soft: rgba(224, 242, 254, 0.9);
}

html[data-fe-visual="patrio-celeste"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #0369a1 0%, #7dd3fc 38%, #bae6fd 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="patrio-celeste"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #0284c7;
    --nav-active-icon: #38bdf8;
}

html[data-fe-visual="patrio-celeste"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #0c4a6e 0%, #1e293b 50%, #0ea5e9 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="patrio-celeste"][data-theme="dark"] .pwa-header {
    --h-accent: #7dd3fc;
    --h-accent-soft: rgba(125, 211, 252, 0.1);
}

html[data-fe-visual="patrio-celeste"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #0c4a6e 0%, #1e293b 50%, #0ea5e9 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="patrio-celeste"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #bae6fd;
    --nav-active-icon: #e0f2fe;
}

html[data-fe-visual="transporte-logistica"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #57534e 0%, #d97706 50%, #a8a29e 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="transporte-logistica"][data-theme="light"] .pwa-header {
    --h-accent: #92400e;
    --h-accent-soft: rgba(254, 243, 199, 0.55);
}

html[data-fe-visual="transporte-logistica"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #57534e 0%, #d97706 50%, #a8a29e 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="transporte-logistica"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #ea580c;
    --nav-active-icon: #fb923c;
}

html[data-fe-visual="transporte-logistica"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #292524 0%, #9a3412 50%, #44403c 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="transporte-logistica"][data-theme="dark"] .pwa-header {
    --h-accent: #fdba74;
    --h-accent-soft: rgba(253, 186, 116, 0.08);
}

html[data-fe-visual="transporte-logistica"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #292524 0%, #9a3412 50%, #44403c 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="transporte-logistica"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #fdba74;
    --nav-active-icon: #fef3c7;
}

html[data-fe-visual="arte-cultura"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #581c87 0%, #c026d3 45%, #fbbf24 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="arte-cultura"][data-theme="light"] .pwa-header {
    --h-accent: #a21caf;
    --h-accent-soft: rgba(250, 245, 255, 0.85);
}

html[data-fe-visual="arte-cultura"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #581c87 0%, #c026d3 45%, #fbbf24 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="arte-cultura"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #a21caf;
    --nav-active-icon: #e879f9;
}

html[data-fe-visual="arte-cultura"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #3b0764 0%, #86198f 50%, #a16207 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="arte-cultura"][data-theme="dark"] .pwa-header {
    --h-accent: #e879f9;
    --h-accent-soft: rgba(232, 121, 249, 0.1);
}

html[data-fe-visual="arte-cultura"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #3b0764 0%, #86198f 50%, #a16207 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="arte-cultura"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #f5d0fe;
    --nav-active-icon: #fae8ff;
}

html[data-fe-visual="radio-onda"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #312e81 0%, #9333ea 48%, #22d3ee 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="radio-onda"][data-theme="light"] .pwa-header {
    --h-accent: #6d28d9;
    --h-accent-soft: rgba(237, 233, 254, 0.82);
}

html[data-fe-visual="radio-onda"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #312e81 0%, #9333ea 48%, #22d3ee 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="radio-onda"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #7c3aed;
    --nav-active-icon: #c4b5fd;
}

html[data-fe-visual="radio-onda"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #1e1b4b 0%, #581c87 52%, #0e7490 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="radio-onda"][data-theme="dark"] .pwa-header {
    --h-accent: #c4b5fd;
    --h-accent-soft: rgba(196, 181, 253, 0.1);
}

html[data-fe-visual="radio-onda"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #1e1b4b 0%, #581c87 52%, #0e7490 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="radio-onda"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #ddd6fe;
    --nav-active-icon: #ede9fe;
}

html[data-fe-visual="mayo-25"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #1e293b 0%, #dc2626 30%, #fbbf24 55%, #1d4ed8 85%, #0369a1 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="mayo-25"][data-theme="light"] .pwa-header {
    --h-accent: #b45309;
    --h-accent-soft: rgba(254, 252, 232, 0.85);
}

html[data-fe-visual="mayo-25"][data-theme="light"] .pwa-header-root {
    background-image: radial-gradient(circle at 12% -8%, rgba(220, 38, 38, 0.1) 0%, transparent 40%),
        radial-gradient(circle at 92% -4%, rgba(29, 78, 216, 0.1) 0%, transparent 42%);
}

html[data-fe-visual="mayo-25"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #1e293b 0%, #dc2626 30%, #fbbf24 55%, #1d4ed8 85%, #0369a1 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="mayo-25"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #b45309;
    --nav-active-icon: #fcd34d;
}

html[data-fe-visual="mayo-25"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #020617 0%, #991b1b 32%, #a16207 56%, #1e40af 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="mayo-25"][data-theme="dark"] .pwa-header {
    --h-accent: #fcd34d;
    --h-accent-soft: rgba(252, 211, 77, 0.1);
}

html[data-fe-visual="mayo-25"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #020617 0%, #991b1b 32%, #a16207 56%, #1e40af 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="mayo-25"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #fde68a;
    --nav-active-icon: #fef9c3;
}

html[data-fe-visual="jardin-infantil"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #ec4899 0%, #a78bfa 45%, #6ee7b7 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="jardin-infantil"][data-theme="light"] .pwa-header {
    --h-accent: #db2777;
    --h-accent-soft: rgba(252, 231, 243, 0.9);
}

html[data-fe-visual="jardin-infantil"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #ec4899 0%, #a78bfa 45%, #6ee7b7 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="jardin-infantil"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #db2777;
    --nav-active-icon: #f472b6;
}

html[data-fe-visual="jardin-infantil"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #831843 0%, #5b21b6 52%, #14532d 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="jardin-infantil"][data-theme="dark"] .pwa-header {
    --h-accent: #fbcfe8;
    --h-accent-soft: rgba(251, 207, 232, 0.08);
}

html[data-fe-visual="jardin-infantil"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #831843 0%, #5b21b6 52%, #14532d 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="jardin-infantil"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #f9a8d4;
    --nav-active-icon: #fce7f3;
}

html[data-fe-visual="ejercito-oliva"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #3f6212 0%, #84cc16 42%, #422006 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="ejercito-oliva"][data-theme="light"] .pwa-header {
    --h-accent: #4d7c0f;
    --h-accent-soft: rgba(236, 252, 203, 0.65);
}

html[data-fe-visual="ejercito-oliva"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #3f6212 0%, #84cc16 42%, #422006 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="ejercito-oliva"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #4d7c0f;
    --nav-active-icon: #bef264;
}

html[data-fe-visual="ejercito-oliva"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #1a2e05 0%, #365314 50%, #291505 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="ejercito-oliva"][data-theme="dark"] .pwa-header {
    --h-accent: #bef264;
    --h-accent-soft: rgba(190, 242, 100, 0.08);
}

html[data-fe-visual="ejercito-oliva"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #1a2e05 0%, #365314 50%, #291505 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="ejercito-oliva"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #d9f99d;
    --nav-active-icon: #ecfccb;
}

html[data-fe-visual="vida-solidaria"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #065f46 0%, #10b981 48%, #0ea5e9 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="vida-solidaria"][data-theme="light"] .pwa-header {
    --h-accent: #059669;
    --h-accent-soft: rgba(209, 250, 229, 0.78);
}

html[data-fe-visual="vida-solidaria"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #065f46 0%, #10b981 48%, #0ea5e9 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="vida-solidaria"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #059669;
    --nav-active-icon: #34d399;
}

html[data-fe-visual="vida-solidaria"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #022c22 0%, #047857 50%, #0c4a6e 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="vida-solidaria"][data-theme="dark"] .pwa-header {
    --h-accent: #6ee7b7;
    --h-accent-soft: rgba(110, 231, 183, 0.1);
}

html[data-fe-visual="vida-solidaria"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #022c22 0%, #047857 50%, #0c4a6e 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="vida-solidaria"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #6ee7b7;
    --nav-active-icon: #a7f3d0;
}

html[data-fe-visual="turismo-mapa"][data-theme="light"] .pwa-header::before {
    background: linear-gradient(95deg, #92400e 0%, #0ea5e9 52%, #facc15 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="turismo-mapa"][data-theme="light"] .pwa-header {
    --h-accent: #0f766e;
    --h-accent-soft: rgba(204, 251, 241, 0.55);
}

html[data-fe-visual="turismo-mapa"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #92400e 0%, #0ea5e9 52%, #facc15 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="turismo-mapa"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #0d9488;
    --nav-active-icon: #2dd4bf;
}

html[data-fe-visual="turismo-mapa"][data-theme="dark"] .pwa-header::before {
    background: linear-gradient(95deg, #78350f 0%, #0e7490 50%, #ca8a04 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-visual="turismo-mapa"][data-theme="dark"] .pwa-header {
    --h-accent: #2dd4bf;
    --h-accent-soft: rgba(45, 212, 191, 0.1);
}

html[data-fe-visual="turismo-mapa"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #78350f 0%, #0e7490 50%, #ca8a04 100%);
        background-size: 260% 100%;
        animation: feDiaAnimalRibbonShift 19s linear infinite reverse;
}

html[data-fe-visual="turismo-mapa"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #5eead4;
    --nav-active-icon: #ccfbf1;
}

/* Guión bajo ubicación/fecha: tintes según tema (solo no-animal tienen grupo arriba; default gris desde header.css). */
html[data-fe-visual]:not([data-fe-visual="dia-animal"]) .h-meta__dots-rule {
    opacity: 0.55;
}

/* Chip bajo la cabecera (texto configurado en PHP) */

html[data-special-day] .h-meta.h-meta--fe-especial {
    flex-wrap: wrap;
}

html[data-special-day] .h-meta__fe-chip:not(.h-meta__fe-chip--efemeride) {
    flex-basis: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 2px;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 0.6125rem;
    font-weight: 800;
    letter-spacing: 0.055em;
    text-transform: uppercase;
    box-sizing: border-box;
}

/* Estructura común efemérides (details o bloque sin acordeón) */

html[data-special-day] details.h-meta__fe-chip.h-meta__fe-chip--efemeride,
html[data-special-day] div.h-meta__fe-chip.h-meta__fe-chip--efemeride {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    margin-top: 2px;
    padding: 4px 4px 6px;
    border-radius: 0;
    border: none;
    box-shadow: none;
    text-transform: none;
    letter-spacing: 0;
    font-weight: 600;
    background: linear-gradient(180deg, rgba(248, 250, 252, 0.94) 0%, rgba(241, 245, 249, 0.52) 100%);
}

html[data-theme="dark"][data-special-day] details.h-meta__fe-chip.h-meta__fe-chip--efemeride,
html[data-theme="dark"][data-special-day] div.h-meta__fe-chip.h-meta__fe-chip--efemeride {
    background: linear-gradient(180deg, rgba(30, 41, 59, 0.74) 0%, rgba(15, 23, 42, 0.42) 100%);
}

html[data-special-day="dia-animal"][data-theme="light"] details.h-meta__fe-chip.h-meta__fe-chip--dia-animal,
html[data-special-day="dia-animal"][data-theme="light"] div.h-meta__fe-chip.h-meta__fe-chip--dia-animal {
    background: linear-gradient(180deg, rgba(236, 253, 245, 0.42) 0%, rgba(209, 250, 229, 0.12) 100%);
}

html[data-special-day="dia-animal"][data-theme="dark"] details.h-meta__fe-chip.h-meta__fe-chip--dia-animal,
html[data-special-day="dia-animal"][data-theme="dark"] div.h-meta__fe-chip.h-meta__fe-chip--dia-animal {
    background: linear-gradient(180deg, rgba(6, 78, 59, 0.32) 0%, rgba(4, 120, 87, 0.1) 100%);
}

/* Efeméride en <details>: cerrada = solo cabecera; extracto al expandir */
html[data-special-day] details.h-meta__fe-chip--efemeride:not([open]) .h-meta__fe-chip-msg {
    display: none;
}

html[data-special-day] div.h-meta__fe-chip.h-meta__fe-chip--sin-acc {
    cursor: default;
}

html[data-special-day] .h-meta__fe-chip-sum {
    list-style: none;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    outline: none;
}

html[data-special-day] .h-meta__fe-chip-sum::-webkit-details-marker {
    display: none;
}

html[data-special-day] .h-meta__fe-chip-sum:focus-visible .h-meta__fe-chip-vis {
    outline: 2px solid rgba(14, 116, 144, 0.5);
    outline-offset: 3px;
    border-radius: 12px;
}

html[data-theme="dark"][data-special-day] .h-meta__fe-chip-sum:focus-visible .h-meta__fe-chip-vis {
    outline-color: rgba(125, 211, 252, 0.5);
}

html[data-special-day="dia-animal"] .h-meta__fe-chip-sum:focus-visible .h-meta__fe-chip-vis {
    outline-color: rgba(5, 150, 105, 0.55);
}

html[data-special-day="dia-animal"][data-theme="dark"] .h-meta__fe-chip-sum:focus-visible .h-meta__fe-chip-vis {
    outline-color: rgba(52, 211, 153, 0.55);
}

html[data-special-day] .h-meta__fe-chip-vis {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 3px;
    text-align: center;
    max-width: 100%;
}

html[data-special-day] .h-meta__fe-chip-row {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-size: 1.05rem;
    line-height: 1;
    align-self: center;
}

html[data-special-day] .h-meta__fe-chip-head {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0 6px;
    line-height: 1.35;
}

html[data-special-day] .h-meta__fe-chip-head .h-meta__fe-chip-date {
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.034em;
    text-transform: uppercase;
    opacity: 0.95;
}

html[data-special-day] .h-meta__fe-chip-head .h-meta__fe-chip-j {
    opacity: 0.42;
    font-weight: 900;
    transform: translateY(-0.02em);
}

html[data-special-day] .h-meta__fe-chip-head .h-meta__fe-chip-cap {
    font-size: 0.8rem;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

html[data-theme="light"][data-special-day] .h-meta__fe-chip-head .h-meta__fe-chip-cap {
    color: #0f172a;
}

html[data-special-day="dia-animal"][data-theme="light"] .h-meta__fe-chip-head .h-meta__fe-chip-cap {
    color: #064e3b;
}

html[data-theme="dark"][data-special-day] .h-meta__fe-chip-head .h-meta__fe-chip-cap {
    color: #f1f5f9;
}

html[data-special-day="dia-animal"][data-theme="dark"] .h-meta__fe-chip-head .h-meta__fe-chip-cap {
    color: #ecfdf5;
    text-shadow: 0 0 20px rgba(52, 211, 153, 0.18);
}

html[data-special-day] .h-meta__fe-chip-msg {
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1.42;
    letter-spacing: 0.02em;
    opacity: 0.96;
    text-align: center;
    margin-top: 7px;
    max-width: 22rem;
    margin-left: auto;
    margin-right: auto;
}

html[data-theme="light"][data-special-day]:not([data-special-day="dia-animal"]) .h-meta__fe-chip-msg {
    color: #334155;
}

html[data-theme="dark"][data-special-day]:not([data-special-day="dia-animal"]) .h-meta__fe-chip-msg {
    color: #e2e8f0;
}

html[data-special-day="dia-animal"][data-theme="light"] .h-meta__fe-chip-msg {
    color: #065f46;
}

html[data-special-day="dia-animal"][data-theme="dark"] .h-meta__fe-chip-msg {
    color: #d1fae5;
    text-shadow: 0 1px 10px rgba(52, 211, 153, 0.12);
}

html[data-special-day] .h-meta__fe-acc-panel {
    margin-top: 6px;
    padding-top: 7px;
    border-top: 1px dashed rgba(100, 116, 139, 0.45);
    font-size: 0.5725rem;
    font-weight: 600;
    line-height: 1.52;
    letter-spacing: 0.025em;
    text-align: center;
    animation: feAccFade 0.2s ease;
}

/* Texto largo algo más legible cuando el chip está expandido a propósito */
.h-meta__fe-shell.fe-phase-expanded .h-meta__fe-acc-panel {
    font-size: 0.72rem;
    line-height: 1.55;
    text-align: left;
    max-height: none;
    overflow: visible;
}

.h-meta__fe-shell.fe-phase-expanded .h-meta__fe-chip-msg {
    font-size: 0.8rem;
    line-height: 1.45;
    max-width: 100%;
}

html[data-theme="dark"][data-special-day] .h-meta__fe-acc-panel {
    border-top-color: rgba(148, 163, 184, 0.42);
}

html[data-special-day="dia-animal"] .h-meta__fe-acc-panel {
    border-top-color: rgba(5, 150, 105, 0.35);
}

html[data-special-day="dia-animal"][data-theme="dark"] .h-meta__fe-acc-panel {
    border-top-color: rgba(52, 211, 153, 0.32);
}

@keyframes feAccFade {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

html[data-special-day] .h-meta__fe-chip-emoji {
    display: inline-block;
    transform: translateY(-0.06em);
    filter: drop-shadow(0 1px 2px rgba(15, 23, 42, 0.12));
}

html[data-theme="dark"][data-special-day] .h-meta__fe-chip-emoji {
    filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.4));
}

html[data-special-day] .h-meta__fe-chip-dot {
    opacity: 0.45;
    font-weight: 900;
    font-size: 0.55rem;
    transform: translateY(0.04em);
}

@media (prefers-reduced-motion: reduce) {
    html[data-special-day="dia-animal"] .pwa-header::before,
    html[data-special-day="dia-animal"] .pwa-bottom-nav::before,
    html[data-fe-visual]:not([data-fe-visual="dia-animal"]) .pwa-header::before,
    html[data-fe-visual]:not([data-fe-visual="dia-animal"]) .pwa-bottom-nav::before {
        animation: none;
        background-size: 100% 100%;
    }

    html[data-special-day] .h-meta__fe-acc-panel {
        animation: none;
    }
}

/* Chip pastilla sólo modo genérico (sin bloque efemérides detallado) */

html[data-special-day] .h-meta__fe-chip:not(.h-meta__fe-chip--efemeride) {
    color: var(--h-ink, #0f172a);
    background: var(--h-accent-soft, #f8fafc);
    border: 1px solid var(--h-line, #e2e8f0);
}

html[data-theme="dark"][data-special-day] .h-meta__fe-chip:not(.h-meta__fe-chip--efemeride) {
    color: #e2e8f0;
    background: rgba(51, 65, 85, 0.6);
    border-color: rgba(148, 163, 184, 0.45);
}

/* Miniatura opcional (efemérides con imagen) */
html[data-special-day] .h-meta__fe-chip-thumb-wrap {
    align-self: center;
    margin-bottom: 4px;
}

html[data-special-day] .h-meta__fe-chip-thumb {
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    object-fit: cover;
    box-shadow: 0 1px 5px rgba(15, 23, 42, 0.14);
}

html[data-theme="dark"][data-special-day] .h-meta__fe-chip-thumb {
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.35);
}

/* --- Efeméride: chip completo al inicio; luego modo compacto (misma línea de puntos + texto) --- */
.h-meta__fe-shell {
    width: 100%;
    max-width: 100%;
}

.h-meta__fe-shell.fe-phase-compact .h-meta__fe-shell-inner {
    display: none !important;
}

.h-meta__fe-compact-wrap {
    display: none;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    max-width: 100%;
    gap: 0;
}

.h-meta__fe-shell.fe-phase-compact .h-meta__fe-compact-wrap {
    display: flex;
}

.h-meta__fe-compact-dots {
    margin-top: 6px;
    margin-bottom: 0;
}

/* Línea fina extra bajo los puntos: pista de que el bloque es interactivo */
.h-meta__fe-compact-aff {
    height: 2px;
    width: 42%;
    max-width: 180px;
    margin: 4px auto 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, rgba(14, 116, 144, 0.45), transparent);
    opacity: 0.85;
}

html[data-theme="dark"] .h-meta__fe-compact-aff {
    background: linear-gradient(90deg, transparent, rgba(125, 211, 252, 0.4), transparent);
}

.h-meta__fe-compact-hit {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: stretch;
    gap: 0;
    width: 100%;
    margin: 0;
    padding: 6px 10px 10px;
    border: none;
    background: transparent;
    cursor: pointer;
    font: inherit;
    -webkit-tap-highlight-color: transparent;
    color: var(--h-muted, #64748b);
}

.h-meta__fe-compact-top {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.h-meta__fe-compact-emoji {
    font-size: 1.05rem;
    line-height: 1;
    flex-shrink: 0;
}

.h-meta__fe-compact-title {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--h-ink, #0f172a);
    text-align: left;
    line-height: 1.25;
}

.h-meta__fe-compact-chev-wrap {
    margin-left: auto;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

html[data-theme="dark"] .h-meta__fe-compact-title {
    color: #f1f5f9;
}

.h-meta__fe-compact-msg {
    width: 100%;
    max-width: 20rem;
    margin: 0 auto;
    padding: 0 6px;
    font-size: 0.66rem;
    font-weight: 650;
    line-height: 1.35;
    letter-spacing: 0.02em;
    text-align: center;
    color: var(--h-muted, #64748b);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.h-meta__fe-compact-hint {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.55rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.78;
}

@keyframes feCompactChevNudge {
    0%,
    100% {
        transform: translateY(0);
        opacity: 0.65;
    }

    50% {
        transform: translateY(3px);
        opacity: 1;
    }
}

.h-meta__fe-compact-chev {
    font-size: 0.95rem;
    flex-shrink: 0;
    animation: feCompactChevNudge 1.6s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
    .h-meta__fe-compact-chev,
    .h-meta__fe-hide-ico {
        animation: none;
    }
}

.h-meta__fe-compact-hit:focus-visible {
    outline: 2px solid rgba(14, 116, 144, 0.45);
    outline-offset: 2px;
    border-radius: 10px;
}

@keyframes feHideChevNudge {
    0%,
    100% {
        transform: translateY(0);
        opacity: 0.65;
    }

    50% {
        transform: translateY(-3px);
        opacity: 1;
    }
}

.h-meta__fe-hide-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    max-width: 16rem;
    margin: 0 auto 6px;
    padding: 0.4rem 0.6rem;
    border: none;
    background: transparent;
    cursor: pointer;
    font: inherit;
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--h-muted, #64748b);
    text-decoration: underline;
    text-underline-offset: 3px;
    -webkit-tap-highlight-color: transparent;
}

.h-meta__fe-hide-ico {
    font-size: 0.75rem;
    opacity: 0.85;
    line-height: 1;
    animation: feHideChevNudge 1.55s ease-in-out infinite;
}

.h-meta__fe-hide-btn:focus-visible {
    outline: 2px solid rgba(14, 116, 144, 0.45);
    outline-offset: 2px;
    border-radius: 6px;
}

html[data-special-day] .h-meta__fe-acc-close {
    display: block;
    width: 100%;
    margin-top: 0.65rem;
    padding: 0.45rem 0.5rem;
    border-radius: 10px;
    border: 1px dashed rgba(100, 116, 139, 0.45);
    background: rgba(248, 250, 252, 0.65);
    cursor: pointer;
    font: inherit;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--h-muted, #64748b);
    -webkit-tap-highlight-color: transparent;
}

html[data-theme="dark"][data-special-day] .h-meta__fe-acc-close {
    background: rgba(15, 23, 42, 0.35);
    border-color: rgba(148, 163, 184, 0.35);
    color: #cbd5e1;
}

/* --- Tono global `data-fe-tema` (admin efemérides): cabecera + barra inferior --- */
html[data-fe-tema="patria"][data-theme="light"] .pwa-header::before,
html[data-fe-tema="patria"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #0c4a6e 0%, #0ea5e9 32%, #f8fafc 58%, #eab308 100%);
    background-size: 260% 100%;
    animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-tema="patria"][data-theme="light"] .pwa-header {
    --h-accent: #0284c7;
    --h-accent-soft: rgba(224, 242, 254, 0.88);
}

html[data-fe-tema="patria"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #0369a1;
    --nav-active-icon: #38bdf8;
}

html[data-fe-tema="patria"][data-theme="dark"] .pwa-header::before,
html[data-fe-tema="patria"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #082f49 0%, #0ea5e9 40%, #1e293b 70%, #ca8a04 100%);
    background-size: 260% 100%;
    animation: feDiaAnimalRibbonShift 17s linear infinite;
}

html[data-fe-tema="patria"][data-theme="dark"] .pwa-header {
    --h-accent: #7dd3fc;
    --h-accent-soft: rgba(125, 211, 252, 0.12);
}

html[data-fe-tema="patria"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #38bdf8;
    --nav-active-icon: #bae6fd;
}

html[data-fe-tema="fiesta"][data-theme="light"] .pwa-header::before,
html[data-fe-tema="fiesta"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #be123c 0%, #c026d3 28%, #ea580c 55%, #facc15 100%);
    background-size: 260% 100%;
    animation: feDiaAnimalRibbonShift 16s linear infinite;
}

html[data-fe-tema="fiesta"][data-theme="light"] .pwa-header {
    --h-accent: #c026d3;
    --h-accent-soft: rgba(250, 232, 255, 0.75);
}

html[data-fe-tema="fiesta"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #c026d3;
    --nav-active-icon: #e879f9;
}

html[data-fe-tema="fiesta"][data-theme="dark"] .pwa-header::before,
html[data-fe-tema="fiesta"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #831843 0%, #86198f 35%, #9a3412 65%, #a16207 100%);
    background-size: 260% 100%;
    animation: feDiaAnimalRibbonShift 16s linear infinite;
}

html[data-fe-tema="fiesta"][data-theme="dark"] .pwa-header {
    --h-accent: #f472b6;
    --h-accent-soft: rgba(244, 114, 182, 0.1);
}

html[data-fe-tema="fiesta"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #e879f9;
    --nav-active-icon: #f5d0fe;
}

html[data-fe-tema="cultura"][data-theme="light"] .pwa-header::before,
html[data-fe-tema="cultura"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #1e293b 0%, #4338ca 45%, #64748b 100%);
    background-size: 260% 100%;
    animation: feDiaAnimalRibbonShift 18s linear infinite;
}

html[data-fe-tema="cultura"][data-theme="light"] .pwa-header {
    --h-accent: #4338ca;
    --h-accent-soft: rgba(238, 242, 255, 0.85);
}

html[data-fe-tema="cultura"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #4f46e5;
    --nav-active-icon: #818cf8;
}

html[data-fe-tema="cultura"][data-theme="dark"] .pwa-header::before,
html[data-fe-tema="cultura"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #0f172a 0%, #312e81 48%, #475569 100%);
    background-size: 260% 100%;
    animation: feDiaAnimalRibbonShift 18s linear infinite;
}

html[data-fe-tema="cultura"][data-theme="dark"] .pwa-header {
    --h-accent: #a5b4fc;
    --h-accent-soft: rgba(165, 180, 252, 0.1);
}

html[data-fe-tema="cultura"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #818cf8;
    --nav-active-icon: #c7d2fe;
}

html[data-fe-tema="naturaleza"][data-theme="light"] .pwa-header::before,
html[data-fe-tema="naturaleza"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #14532d 0%, #16a34a 42%, #84cc16 100%);
    background-size: 260% 100%;
    animation: feDiaAnimalRibbonShift 19s linear infinite;
}

html[data-fe-tema="naturaleza"][data-theme="light"] .pwa-header {
    --h-accent: #15803d;
    --h-accent-soft: rgba(220, 252, 231, 0.78);
}

html[data-fe-tema="naturaleza"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #15803d;
    --nav-active-icon: #4ade80;
}

html[data-fe-tema="naturaleza"][data-theme="dark"] .pwa-header::before,
html[data-fe-tema="naturaleza"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #052e16 0%, #166534 50%, #365314 100%);
    background-size: 260% 100%;
    animation: feDiaAnimalRibbonShift 19s linear infinite;
}

html[data-fe-tema="naturaleza"][data-theme="dark"] .pwa-header {
    --h-accent: #4ade80;
    --h-accent-soft: rgba(74, 222, 128, 0.1);
}

html[data-fe-tema="naturaleza"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #86efac;
    --nav-active-icon: #bbf7d0;
}

html[data-fe-tema="reflexion"][data-theme="light"] .pwa-header::before,
html[data-fe-tema="reflexion"][data-theme="light"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #4c1d95 0%, #64748b 48%, #94a3b8 100%);
    background-size: 260% 100%;
    animation: feDiaAnimalRibbonShift 20s linear infinite;
}

html[data-fe-tema="reflexion"][data-theme="light"] .pwa-header {
    --h-accent: #5b21b6;
    --h-accent-soft: rgba(237, 233, 254, 0.72);
}

html[data-fe-tema="reflexion"][data-theme="light"] .pwa-bottom-nav {
    --nav-active: #6d28d9;
    --nav-active-icon: #c4b5fd;
}

html[data-fe-tema="reflexion"][data-theme="dark"] .pwa-header::before,
html[data-fe-tema="reflexion"][data-theme="dark"] .pwa-bottom-nav::before {
    background: linear-gradient(95deg, #1e1b4b 0%, #334155 52%, #581c87 100%);
    background-size: 260% 100%;
    animation: feDiaAnimalRibbonShift 20s linear infinite;
}

html[data-fe-tema="reflexion"][data-theme="dark"] .pwa-header {
    --h-accent: #c4b5fd;
    --h-accent-soft: rgba(196, 181, 253, 0.1);
}

html[data-fe-tema="reflexion"][data-theme="dark"] .pwa-bottom-nav {
    --nav-active: #a78bfa;
    --nav-active-icon: #ddd6fe;
}

@media (prefers-reduced-motion: reduce) {
    html[data-fe-tema] .pwa-header::before,
    html[data-fe-tema] .pwa-bottom-nav::before {
        animation: none;
        background-size: 100% 100%;
    }
}