/*
 * /gsfestive/gsfestive.css
 * Core Styles for Festive Enhancements
 * Version 1.7
 */

/* ========================================================================= */
/* --- 1. MODAL WINDOW STYLES (Used by popupwindow.js) --------------------- */
/* ========================================================================= */

.gsfestive-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0); /* Start transparent */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    /* Transition for smooth fade-in/out of the overlay */
    transition: background-color 0.3s ease;
    visibility: hidden; /* Hide by default */
}

.gsfestive-modal-overlay.is-visible {
    background-color: rgba(0, 0, 0, 0.7); /* Opaque when visible */
    visibility: visible;
}

.gsfestive-modal-content {
    background: #fff;
    padding: 30px;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4);
    max-width: 90%;
    width: 400px;
    text-align: center;
    /* Ensure content starts invisible when animation class is applied */
    opacity: 0; 
    transform: scale(0.8);
}

.gsfestive-modal-overlay.is-visible .gsfestive-modal-content {
    /* Reset properties when overlay is visible, allowing animation to take over */
    opacity: 1; 
    transform: scale(1);
}

.gsfestive-modal-message {
    margin-bottom: 20px;
    font-size: 1.1rem;
    color: #333;
}

.gsfestive-modal-close-btn {
    background-color: #ff4500; /* Festive red-orange */
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 1rem;
    font-weight: bold;
    transition: background-color 0.2s;
}

.gsfestive-modal-close-btn:hover {
    background-color: #e03c00;
}

/* ========================================================================= */
/* --- 2. SNOW CANVAS STYLES (Used by snow.js) ----------------------------- */
/* ========================================================================= */

#gsfestive-snow-canvas {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none; /* Allows clicks to pass through */
    z-index: 999; /* Below the modal */
}

/* ========================================================================= */
/* --- 3. BASIC TICKET STYLES (Keyframes are injected by ticker.js) -------- */
/* ========================================================================= */

/* Note: The main styles for the ticker (#gs-ticker-wrapper, #gs-ticker-content, 
   and the keyframes) are now dynamically injected by themes/ticker.js 
   to ensure the CSS variables are calculated correctly before applying 
   the infinite animation. */