/**
 * ═══════════════════════════════════════════════════════════════════════════
 * CIRCADIAN V3.0 - HORA + CLIMA REAL
 * ═══════════════════════════════════════════════════════════════════════════
 * 
 * Mesa de trabajo de arquitecto iluminada por luz natural + clima real
 * Cambio cada hora + modificadores de clima
 * 
 * FUTURÍSTICA® The.Archi.Designers
 * @version 3.0
 * @date 2026-02-05
 * 
 * ═══════════════════════════════════════════════════════════════════════════
 */

:root {
    --circadian-intensity: 0.60;
    --duration-circadian: 3s;
    --ease-circadian: cubic-bezier(0.4, 0, 0.2, 1);
}

body {
    position: relative;
    background: var(--warm-void);
    transition: background var(--duration-circadian) var(--ease-circadian);
}

body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: var(--circadian-intensity);
    transition: 
        background var(--duration-circadian) var(--ease-circadian),
        opacity var(--duration-circadian) var(--ease-circadian);
    pointer-events: none;
}

/* ═════════════════════════════════════════════════════════════════════════
   DAWN (5-6h) - Amanecer frío azul → rosa
   ═══════════════════════════════════════════════════════════════════════ */

body.circadian-dawn {
    background: #E8EAF6;
}

body.circadian-dawn::before {
    background: 
        radial-gradient(circle at 80% 10%, rgba(255, 182, 193, 0.6), transparent 50%),
        radial-gradient(circle at 20% 40%, rgba(138, 180, 248, 0.5), transparent 60%),
        linear-gradient(180deg, 
            rgba(63, 81, 181, 0.3) 0%,
            rgba(255, 182, 193, 0.4) 50%,
            transparent 100%
        );
}

/* ═════════════════════════════════════════════════════════════════════════
   EARLY MORNING (6-9h) - Mañana temprana amarillo suave
   ═══════════════════════════════════════════════════════════════════════ */

body.circadian-early-morning {
    background: #FFFEF7;
}

body.circadian-early-morning::before {
    background: 
        radial-gradient(circle at 70% 20%, rgba(255, 245, 157, 0.7), transparent 55%),
        radial-gradient(circle at 30% 60%, rgba(255, 224, 130, 0.5), transparent 50%),
        linear-gradient(135deg, 
            rgba(255, 235, 59, 0.2) 0%,
            rgba(255, 245, 157, 0.3) 60%,
            transparent 100%
        );
}

/* ═════════════════════════════════════════════════════════════════════════
   MIDDAY (9-12h) - Mediodía luz blanca brillante
   ═══════════════════════════════════════════════════════════════════════ */

body.circadian-midday {
    background: #FFFFFF;
}

body.circadian-midday::before {
    background: 
        radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.8), transparent 70%),
        radial-gradient(circle at 100% 50%, rgba(250, 250, 250, 0.6), transparent 60%),
        linear-gradient(180deg, 
            rgba(255, 255, 255, 0.4) 0%,
            transparent 50%,
            rgba(245, 245, 245, 0.3) 100%
        );
}

/* ═════════════════════════════════════════════════════════════════════════
   AFTERNOON (12-15h) - Tarde dorado cálido
   ═══════════════════════════════════════════════════════════════════════ */

body.circadian-afternoon {
    background: #FFF9F0;
}

body.circadian-afternoon::before {
    background: 
        radial-gradient(circle at 90% 40%, rgba(255, 215, 0, 0.6), transparent 60%),
        radial-gradient(circle at 10% 70%, rgba(255, 248, 220, 0.5), transparent 55%),
        linear-gradient(90deg, 
            transparent 0%,
            rgba(255, 215, 0, 0.35) 50%,
            rgba(255, 248, 220, 0.3) 100%
        );
}

/* ═════════════════════════════════════════════════════════════════════════
   GOLDEN HOUR (15-17h) - Hora dorada naranja intenso
   ═══════════════════════════════════════════════════════════════════════ */

body.circadian-golden {
    background: #FFF4E6;
}

body.circadian-golden::before {
    background: 
        radial-gradient(circle at 100% 60%, rgba(255, 152, 0, 0.7), transparent 50%),
        radial-gradient(circle at 50% 80%, rgba(255, 193, 7, 0.6), transparent 60%),
        linear-gradient(120deg, 
            rgba(255, 152, 0, 0.4) 0%,
            rgba(255, 193, 7, 0.5) 50%,
            rgba(255, 224, 130, 0.3) 100%
        );
}

/* ═════════════════════════════════════════════════════════════════════════
   DUSK (17-19h) - Atardecer magenta dramático
   ═══════════════════════════════════════════════════════════════════════ */

body.circadian-dusk {
    background: #FCE4EC;
}

body.circadian-dusk::before {
    background: 
        radial-gradient(circle at 100% 80%, rgba(255, 105, 180, 0.7), transparent 55%),
        radial-gradient(circle at 0% 20%, rgba(156, 39, 176, 0.6), transparent 60%),
        linear-gradient(225deg, 
            rgba(255, 105, 180, 0.5) 0%,
            rgba(186, 104, 200, 0.4) 50%,
            rgba(156, 39, 176, 0.3) 100%
        );
}

/* ═════════════════════════════════════════════════════════════════════════
   EVENING (19-22h) - Noche temprana azul profundo
   ═══════════════════════════════════════════════════════════════════════ */

body.circadian-evening {
    background: #283593;
    color: #F5F3EE;
}

body.circadian-evening::before {
    background: 
        radial-gradient(circle at 50% 0%, rgba(63, 81, 181, 0.6), transparent 60%),
        radial-gradient(circle at 100% 100%, rgba(26, 35, 126, 0.7), transparent 50%),
        linear-gradient(180deg, 
            rgba(63, 81, 181, 0.4) 0%,
            rgba(26, 35, 126, 0.5) 60%,
            rgba(13, 18, 63, 0.6) 100%
        );
}

/* ═════════════════════════════════════════════════════════════════════════
   NIGHT (22-5h) - Noche profunda violeta + proton green
   ═══════════════════════════════════════════════════════════════════════ */

body.circadian-night {
    background: #1A0F1F;
    color: #F5F3EE;
}

body.circadian-night::before {
    background: 
        radial-gradient(circle at 50% 0%, rgba(0, 255, 163, 0.25), transparent 50%),
        radial-gradient(circle at 100% 100%, rgba(138, 43, 226, 0.35), transparent 60%),
        radial-gradient(circle at 0% 50%, rgba(42, 31, 53, 0.5), transparent 55%),
        linear-gradient(180deg, 
            rgba(26, 15, 31, 0.6) 0%,
            rgba(0, 255, 163, 0.1) 50%,
            rgba(26, 15, 31, 0.8) 100%
        );
}

/* ═════════════════════════════════════════════════════════════════════════
   MODIFICADORES DE CLIMA
   ═══════════════════════════════════════════════════════════════════════ */

/* Soleado - Intensifica colores cálidos */
body[data-weather="clear"]::before {
    filter: brightness(1.15) saturate(1.3);
}

/* Nublado - Apaga, añade gris */
body[data-weather="clouds"]::before {
    filter: brightness(0.8) saturate(0.7) contrast(0.9);
}

/* Lluvia - Tonos fríos azulados */
body[data-weather="rain"]::before {
    filter: brightness(0.7) saturate(0.8) hue-rotate(-15deg);
}

body[data-weather="rain"]::after {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, transparent 0%, rgba(33, 150, 243, 0.1) 100%);
    z-index: -1;
    pointer-events: none;
}

/* Tormenta - Dramático oscuro */
body[data-weather="thunderstorm"]::before {
    filter: brightness(0.5) saturate(1.2) contrast(1.3);
}

/* Nieve - Fríos glaciales */
body[data-weather="snow"]::before {
    filter: brightness(1.1) saturate(0.5) hue-rotate(20deg);
}

/* Niebla - Difuminado bajo contraste */
body[data-weather="mist"],
body[data-weather="fog"]::before {
    filter: brightness(0.9) saturate(0.6) contrast(0.7) blur(2px);
}

/* ═════════════════════════════════════════════════════════════════════════
   TEXTOS ADAPTATIVOS NOCHE
   ═══════════════════════════════════════════════════════════════════════ */

body.circadian-evening,
body.circadian-night {
    --color-text-primary: #F5F3EE;
    --color-text-secondary: rgba(245, 243, 238, 0.7);
    --color-text-tertiary: rgba(245, 243, 238, 0.5);
}