/* ============================================
   Динамический фон под месяц + время суток + погоду
   ============================================ */

/* Fallback: CSS-градиенты по месяцам (пока нет картинок) */
body.bg-month-january  { background: linear-gradient(180deg, #1a1f3a 0%, #2c3e50 100%); }
body.bg-month-february { background: linear-gradient(180deg, #1e2a4a 0%, #4a5f7f 100%); }
body.bg-month-march    { background: linear-gradient(180deg, #2c4a6b 0%, #7fa8d0 100%); }
body.bg-month-april    { background: linear-gradient(180deg, #3a6b8a 0%, #a0d0e8 100%); }
body.bg-month-may      { background: linear-gradient(180deg, #4a8a6b 0%, #b8e0c0 100%); }
body.bg-month-june     { background: linear-gradient(180deg, #4a8a4a 0%, #c8e8a0 100%); }
body.bg-month-july     { background: linear-gradient(180deg, #d88a3a 0%, #f8d0a0 100%); }
body.bg-month-august   { background: linear-gradient(180deg, #d8703a 0%, #f0b890 100%); }
body.bg-month-september{ background: linear-gradient(180deg, #c8783a 0%, #e0a870 100%); }
body.bg-month-october  { background: linear-gradient(180deg, #8a4a2c 0%, #c88a5a 100%); }
body.bg-month-november { background: linear-gradient(180deg, #3a2a3a 0%, #6a5a6a 100%); }
body.bg-month-december { background: linear-gradient(180deg, #1a2a4a 0%, #4a6a8a 100%); }

/* Базовая настройка body для фона */
body {
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    transition: background-image 1.5s ease-in-out;
}

/* ============================================
   Погодные оверлеи
   ============================================ */

/* Общая настройка оверлея */
body[class*="weather-"]::before {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

/* Дождь */
body.weather-rain::before,
body.weather-drizzle::before {
    background-image:
        linear-gradient(transparent 0%, rgba(174,194,224,0.15) 100%),
        repeating-linear-gradient(
            105deg,
            transparent,
            transparent 2px,
            rgba(200, 220, 255, 0.35) 2px,
            rgba(200, 220, 255, 0.35) 3px
        );
    background-size: 100% 100%, 100px 100px;
    animation: rain-fall 0.6s linear infinite;
    opacity: 0.5;
}

@keyframes rain-fall {
    0% { background-position: 0 0, 0 0; }
    100% { background-position: 0 0, 0 100px; }
}

/* Снег */
body.weather-snow::before {
    background-image:
        radial-gradient(circle, #fff 1.5px, transparent 1.5px),
        radial-gradient(circle, #fff 1px, transparent 1px),
        radial-gradient(circle, #fff 2px, transparent 2px);
    background-size: 80px 80px, 120px 120px, 160px 160px;
    background-position: 0 0, 40px 60px, 130px 270px;
    animation: snow-fall 8s linear infinite;
    opacity: 0.7;
}

@keyframes snow-fall {
    0% { background-position: 0 0, 40px 60px, 130px 270px; }
    100% { background-position: 0 80px, 40px 180px, 130px 430px; }
}

/* Гроза */
body.weather-thunder::before {
    background-image:
        linear-gradient(transparent 0%, rgba(40, 30, 60, 0.4) 100%),
        repeating-linear-gradient(
            105deg,
            transparent,
            transparent 2px,
            rgba(180, 200, 240, 0.4) 2px,
            rgba(180, 200, 240, 0.4) 3px
        );
    background-size: 100% 100%, 100px 100px;
    animation:
        rain-fall 0.4s linear infinite,
        lightning-flash 8s ease-in-out infinite;
    opacity: 0.6;
}

@keyframes lightning-flash {
    0%, 88%, 100% { filter: brightness(1); }
    90%, 94% { filter: brightness(2.2); }
}

/* Туман */
body.weather-fog::before {
    background: linear-gradient(
        180deg,
        transparent 0%,
        rgba(200, 210, 220, 0.4) 50%,
        rgba(200, 210, 220, 0.6) 100%
    );
    animation: fog-drift 20s ease-in-out infinite alternate;
}

@keyframes fog-drift {
    0% { transform: translateX(0); }
    100% { transform: translateX(30px); }
}

/* Ясно — ничего не накладываем */

/* ============================================
   Light theme — отключаем тёмные оверлеи
   ============================================ */
body.light-theme.weather-rain::before,
body.light-theme.weather-snow::before,
body.light-theme.weather-thunder::before,
body.light-theme.weather-fog::before {
    opacity: 0.3;
}


/* ============================================
   Гарантируем, что body покрывает весь экран
   ============================================ */
body {
    background-color: #0f172a;   /* fallback: тёмный, если картинка не загрузилась */
    min-height: 100vh;
}