/**
 * Holiday Abstract Backgrounds
 * Static, elegant minimal abstract backgrounds inspired by modern design
 * Integrates with holiday-service.js
 */

/* === ABSTRACT BACKGROUND CONTAINER === */
.holiday-background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.8s ease-in-out;
}

.holiday-background.active {
    opacity: 1;
}

/* === STATIC ORGANIC SHAPES (No animation - elegant & minimal) === */
.gradient-orb {
    position: absolute;
    opacity: 0.4;
    transition: opacity 1.5s ease-in-out;
}

/* Dark theme - more subtle */
[data-theme="dark"] .gradient-orb {
    opacity: 0.28;
}

/* Large organic blob - top left */
.orb-1 {
    width: 650px;
    height: 650px;
    top: -18%;
    left: -12%;
    background: var(--holiday-color-1, #e8d5c4);
    border-radius: 48% 52% 61% 39% / 53% 58% 42% 47%;
}

/* Medium flowing shape - top right */
.orb-2 {
    width: 480px;
    height: 480px;
    top: 8%;
    right: -10%;
    background: var(--holiday-color-2, #c9d8e8);
    border-radius: 63% 37% 43% 57% / 56% 47% 53% 44%;
}

/* Large abstract form - bottom */
.orb-3 {
    width: 720px;
    height: 580px;
    bottom: -15%;
    left: 8%;
    background: var(--holiday-color-3, #d4c5d8);
    border-radius: 42% 58% 52% 48% / 61% 38% 62% 39%;
}

/* Medium accent blob - bottom right */
.orb-4 {
    width: 420px;
    height: 420px;
    bottom: 12%;
    right: 6%;
    background: var(--holiday-color-4, #e8d4c9);
    border-radius: 57% 43% 39% 61% / 44% 56% 44% 56%;
}

/* === HIDE ANIMATED ELEMENTS (Keep design clean and static) === */
.geo-shape,
.particle-container,
.wave-pattern {
    display: none;
}

/* === PASTEL COLOR SCHEMES (Elegant & Modern) === */

/* Default Theme - Neutral Pastels (Always On) */
.holiday-background[data-holiday="default"] {
    --holiday-color-1: #e8d5c4;   /* Warm beige */
    --holiday-color-2: #c9d8e8;   /* Soft blue */
    --holiday-color-3: #d4c5d8;   /* Lavender */
    --holiday-color-4: #e8d4c9;   /* Peachy beige */
}

/* Dark theme - lighter muted tones for visibility */
[data-theme="dark"] .holiday-background[data-holiday="default"] {
    --holiday-color-1: #6b5d56;   /* Lighter warm brown */
    --holiday-color-2: #556270;   /* Lighter blue-grey */
    --holiday-color-3: #5d5566;   /* Lighter lavender-grey */
    --holiday-color-4: #6b5d52;   /* Lighter peachy-brown */
}

/* Christmas / New Year - Festive Pastels */
.holiday-background[data-holiday="christmas"],
.holiday-background[data-holiday="new-year"] {
    --holiday-color-1: #e8c5c5;   /* Soft red */
    --holiday-color-2: #f5e6c8;   /* Warm gold */
    --holiday-color-3: #c5d8c5;   /* Mint green */
    --holiday-color-4: #f5d5c8;   /* Rose gold */
}

[data-theme="dark"] .holiday-background[data-holiday="christmas"],
[data-theme="dark"] .holiday-background[data-holiday="new-year"] {
    --holiday-color-1: #7d5555;   /* Lighter muted red */
    --holiday-color-2: #7d7055;   /* Lighter gold */
    --holiday-color-3: #557d55;   /* Lighter green */
    --holiday-color-4: #7d6255;   /* Lighter rose */
}

/* Chinese New Year - Red & Gold Pastels */
.holiday-background[data-holiday="chinese-new-year"] {
    --holiday-color-1: #f5c5c8;   /* Blush red */
    --holiday-color-2: #f5e6c8;   /* Soft gold */
    --holiday-color-3: #ffd5d5;   /* Light coral */
    --holiday-color-4: #ffe8c8;   /* Champagne */
}

[data-theme="dark"] .holiday-background[data-holiday="chinese-new-year"] {
    --holiday-color-1: #7d5558;   /* Lighter blush */
    --holiday-color-2: #7d7055;   /* Lighter gold */
    --holiday-color-3: #856262;   /* Lighter coral */
    --holiday-color-4: #857055;   /* Lighter champagne */
}

/* Hari Raya - Green & Gold Pastels */
.holiday-background[data-holiday="hari-raya"] {
    --holiday-color-1: #d5e8c5;   /* Soft sage */
    --holiday-color-2: #f5e6c8;   /* Gold */
    --holiday-color-3: #c5ddc5;   /* Mint */
    --holiday-color-4: #e8f5c8;   /* Light olive */
}

[data-theme="dark"] .holiday-background[data-holiday="hari-raya"] {
    --holiday-color-1: #627d55;   /* Lighter sage */
    --holiday-color-2: #7d7055;   /* Lighter gold */
    --holiday-color-3: #557055;   /* Lighter mint */
    --holiday-color-4: #707d55;   /* Lighter olive */
}

/* Deepavali - Warm Colorful Pastels */
.holiday-background[data-holiday="deepavali"] {
    --holiday-color-1: #ffd5c5;   /* Soft orange */
    --holiday-color-2: #e5c5f5;   /* Lavender */
    --holiday-color-3: #ffe8c8;   /* Gold */
    --holiday-color-4: #f5c5d8;   /* Pink */
}

[data-theme="dark"] .holiday-background[data-holiday="deepavali"] {
    --holiday-color-1: #856a55;   /* Lighter orange */
    --holiday-color-2: #6a5d85;   /* Lighter lavender */
    --holiday-color-3: #857a55;   /* Lighter gold */
    --holiday-color-4: #855d6a;   /* Lighter pink */
}

/* National Day - Patriotic Pastels */
.holiday-background[data-holiday="national-day"] {
    --holiday-color-1: #e8c5c5;   /* Soft red */
    --holiday-color-2: #c5d5e8;   /* Sky blue */
    --holiday-color-3: #f5c5c5;   /* Rose */
    --holiday-color-4: #c5e5f5;   /* Light blue */
}

[data-theme="dark"] .holiday-background[data-holiday="national-day"] {
    --holiday-color-1: #7d5555;   /* Lighter red */
    --holiday-color-2: #556a80;   /* Lighter blue */
    --holiday-color-3: #855555;   /* Lighter rose */
    --holiday-color-4: #558095;   /* Lighter sky blue */
}

/* Generic Holiday - Soft Multicolor */
.holiday-background[data-holiday="generic"] {
    --holiday-color-1: #c5e5f5;   /* Baby blue */
    --holiday-color-2: #c5f5e8;   /* Mint */
    --holiday-color-3: #d5c5f5;   /* Lavender */
    --holiday-color-4: #c5e8f5;   /* Sky blue */
}

[data-theme="dark"] .holiday-background[data-holiday="generic"] {
    --holiday-color-1: #558095;   /* Lighter baby blue */
    --holiday-color-2: #55857a;   /* Lighter mint */
    --holiday-color-3: #6a5d85;   /* Lighter lavender */
    --holiday-color-4: #557a85;   /* Lighter sky blue */
}

/* === RESPONSIVE ADJUSTMENTS === */

/* Mobile - slightly reduced shapes */
@media (max-width: 768px) {
    .orb-1 {
        width: 450px;
        height: 450px;
    }

    .orb-2 {
        width: 350px;
        height: 350px;
    }

    .orb-3 {
        width: 500px;
        height: 400px;
    }

    .orb-4 {
        width: 300px;
        height: 300px;
    }
}

/* === ACCESSIBILITY === */

/* Respect reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
    .holiday-background,
    .gradient-orb {
        transition: none !important;
    }
}

/* === SUBTLE TEXTURE OVERLAY === */
.holiday-background::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background:
        radial-gradient(circle at 20% 30%, rgba(255, 255, 255, 0.03) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(0, 0, 0, 0.02) 0%, transparent 50%);
    pointer-events: none;
}

[data-theme="dark"] .holiday-background::before {
    background:
        radial-gradient(circle at 20% 30%, rgba(255, 255, 255, 0.015) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(0, 0, 0, 0.03) 0%, transparent 50%);
}