/*
 * Frontend-Styling für den Geplanten Video Scheduler
 */

/* 1. Countdown-Timer Styling */
.gvs-countdown-timer {
    display: flex;
    justify-content: center;
    gap: 15px;
    text-align: center;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.gvs-timer-box {
    display: flex;
    flex-direction: column;
    padding: 10px 15px;
    background-color: #f0f0f0;
    border-radius: 5px;
    min-width: 70px;
}

.gvs-timer-value {
    font-size: 2.5em;
    font-weight: bold;
    line-height: 1.1;
    color: #333;
}

.gvs-timer-label {
    font-size: 0.8em;
    text-transform: uppercase;
    color: #777;
    letter-spacing: 1px;
}

/* 2. Responsive Video Wrapper */
.gvs-video-responsive-wrapper {
    position: relative;
    width: 100%; 
    overflow: hidden;
    /* aspect-ratio wird inline gesetzt */
}

/* KORREKTUR: position: absolute entfernt */
.gvs-video-responsive-wrapper iframe {
    position: relative; 
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* 3. Endzustand-Inhalt */
.gvs-end-state-content {
    padding: 20px;
    background-color: #fafafa;
    border: 1px solid #eee;
    border-radius: 4px;
}

/* 4. Countdown Headline */
.gvs-countdown-headline {
    text-align: inherit; /* Erbt Ausrichtung vom Wrapper */
    margin-bottom: 20px;
}

/* 5. Verzögerte Elemente */
body:not(.elementor-editor-active) .element-verzoegern {
    display: none;
}