/* ================================================================
   DSGVO Video Consent – Frontend-Styles
   Version: 1.1.0
   ================================================================ */

/* ── Play-Buttons per Dienst ────────────────────────────────────── */
/*
 * Die Consent-Logik versteckt NICHT mehr den Play-Button.
 * Der Button ist immer sichtbar. Klick öffnet das Modal-Popup.
 * Enfold's .avia_playpause_icon wird pro Dienst mit dem
 * passenden Marken-Icon überschrieben.
 */

/* YouTube – roter Play-Button */
[data-gdpr-service="youtube"] .avia_playpause_icon,
[data-gdpr-service="youtube"]:hover .avia_playpause_icon {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDY4IDQ4Ij48cGF0aCBkPSJNNjYuNTIsNy43NGMtMC43OC0yLjkzLTIuNDktNS40MS01LjQyLTYuMTlDNTUuNzksMC4xMywzNCwwLDM0LDBTMTIuMjEsMC4xMyw2LjksMS41NUMzLjk3LDIuMzMsMi4yNyw0LjgxLDEuNDgsNy43NEMwLjA2LDEzLjA1LDAsMjQsMCwyNHMwLjA2LDEwLjk1LDEuNDgsMTYuMjZjMC43OCwyLjkzLDIuNDksNS40MSw1LjQyLDYuMTlDMTIuMjEsNDcuODcsMzQsNDgsMzQsNDhzMjEuNzktMC4xMywyNy4xLTEuNTVjMi45My0wLjc4LDQuNjQtMy4yNiw1LjQyLTYuMTlDNjcuOTQsMzQuOTUsNjgsMjQsNjgsMjRTNjcuOTQsMTMuMDUsNjYuNTIsNy43NHoiIGZpbGw9IiNmMDAiLz48cGF0aCBkPSJNIDQ1LDI0IDI3LDE0IDI3LDM0IiBmaWxsPSIjZmZmIi8+PC9zdmc+");
    background-repeat: no-repeat;
    background-size: contain;
}

/* Vimeo – dunkler Button (normal) */
[data-gdpr-service="vimeo"] .avia_playpause_icon {
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNjggNDgiPjxwYXRoIGQ9Ik02Myw0OEg1Yy0yLjgsMC01LTIuMi01LTVWNWMwLTIuOCwyLjItNSw1LTVoNThjMi44LDAsNSwyLjIsNSw1djM4QzY4LDQ1LjgsNjUuOCw0OCw2Myw0OHoiIGZpbGw9IiMzMzMiLz48cGF0aCBkPSJNNDUsMjRMMjcsMTR2MjAiIGZpbGw9IiNmZmYiLz48L3N2Zz4=");
    background-repeat: no-repeat;
    background-size: contain;
}

/* Vimeo – blauer Button (hover) */
[data-gdpr-service="vimeo"]:hover .avia_playpause_icon {
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNjggNDgiPjxwYXRoIGQ9Ik02Myw0OEg1Yy0yLjgsMC01LTIuMi01LTVWNWMwLTIuOCwyLjItNSw1LTVoNThjMi44LDAsNSwyLjIsNSw1djM4QzY4LDQ1LjgsNjUuOCw0OCw2Myw0OHoiIGZpbGw9IiMzMEFFRUIiLz48cGF0aCBkPSJNNDUsMjRMMjcsMTR2MjAiIGZpbGw9IiNmZmYiLz48L3N2Zz4=");
}

/* Play-Button immer sichtbar (auch ohne Consent) */
[data-gdpr-service] .av-click-to-play-overlay {
    pointer-events: auto;
    opacity: 1;
}

/* Vorschaubild sichtbar halten */
[data-gdpr-service] {
    background-size: cover;
    background-position: center;
}


/* ── Modal-Popup ────────────────────────────────────────────────── */

.dvc-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 99998;
    background: rgba(0, 0, 0, .6);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    box-sizing: border-box;
    animation: dvcFadeIn .18s ease;
}

@keyframes dvcFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.dvc-modal {
    position: relative;
    background: #fff;
    border-radius: 10px;
    padding: 32px 36px;
    max-width: 480px;
    width: 100%;
    box-shadow: 0 16px 48px rgba(0, 0, 0, .35);
    text-align: center;
    color: #222;
    font-size: 14px;
    line-height: 1.6;
    animation: dvcSlideUp .2s ease;
}

@keyframes dvcSlideUp {
    from { transform: translateY(12px); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}

/* Schließen-Button */
.dvc-modal__close {
    position: absolute;
    top: 12px;
    right: 14px;
    background: none;
    border: none;
    font-size: 20px;
    line-height: 1;
    color: #999;
    cursor: pointer;
    padding: 4px 6px;
    border-radius: 4px;
    transition: color .15s;
}
.dvc-modal__close:hover { color: #333; }

/* Service-Icon Zeile */
.dvc-modal__icon {
    width: 56px;
    height: 40px;
    margin: 0 auto 14px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.dvc-modal__icon--youtube {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDY4IDQ4Ij48cGF0aCBkPSJNNjYuNTIsNy43NGMtMC43OC0yLjkzLTIuNDktNS40MS01LjQyLTYuMTlDNTUuNzksMC4xMywzNCwwLDM0LDBTMTIuMjEsMC4xMyw2LjksMS41NUMzLjk3LDIuMzMsMi4yNyw0LjgxLDEuNDgsNy43NEMwLjA2LDEzLjA1LDAsMjQsMCwyNHMwLjA2LDEwLjk1LDEuNDgsMTYuMjZjMC43OCwyLjkzLDIuNDksNS40MSw1LjQyLDYuMTlDMTIuMjEsNDcuODcsMzQsNDgsMzQsNDhzMjEuNzktMC4xMywyNy4xLTEuNTVjMi45My0wLjc4LDQuNjQtMy4yNiw1LjQyLTYuMTlDNjcuOTQsMzQuOTUsNjgsMjQsNjgsMjRTNjcuOTQsMTMuMDUsNjYuNTIsNy43NHoiIGZpbGw9IiNmMDAiLz48cGF0aCBkPSJNIDQ1LDI0IDI3LDE0IDI3LDM0IiBmaWxsPSIjZmZmIi8+PC9zdmc+");
}
.dvc-modal__icon--vimeo {
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNjggNDgiPjxwYXRoIGQ9Ik02Myw0OEg1Yy0yLjgsMC01LTIuMi01LTVWNWMwLTIuOCwyLjItNSw1LTVoNThjMi44LDAsNSwyLjIsNSw1djM4QzY4LDQ1LjgsNjUuOCw0OCw2Myw0OHoiIGZpbGw9IiMzMEFFRUIiLz48cGF0aCBkPSJNNDUsMjRMMjcsMTR2MjAiIGZpbGw9IiNmZmYiLz48L3N2Zz4=");
}

.dvc-modal__service {
    font-weight: 700;
    font-size: 16px;
    margin: 0 0 8px;
}

.dvc-modal__purpose {
    margin: 0 0 14px;
    color: #555;
}

.dvc-modal__privacy {
    display: block;
    margin-bottom: 22px;
    font-size: 12px;
    color: #888;
    text-decoration: underline;
}
.dvc-modal__privacy:hover { color: #444; }

/* Buttons im Modal */
.dvc-modal__btn {
    display: block;
    width: 100%;
    margin-bottom: 8px;
    padding: 11px 16px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    transition: opacity .2s, transform .1s;
    line-height: 1.4;
}

.dvc-modal__btn:last-of-type { margin-bottom: 0; }
.dvc-modal__btn:hover  { opacity: .85; }
.dvc-modal__btn:active { transform: scale(.98); }

.dvc-modal__btn--once {
    /* Farbe per wp_add_inline_style */
    background: #2271b1;
    color: #fff;
}
.dvc-modal__btn--always {
    background: #eee;
    color: #333;
    border: 1px solid #ccc;
}


/* ── Revoke-Button (Shortcode [dvc_revoke_consent]) ─────────────── */

.dvc-revoke-btn--inline {
    display: inline-block;
    padding: 8px 16px;
    background: transparent;
    border: 1px solid currentColor;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    color: inherit;
    opacity: .7;
    transition: opacity .2s;
}
.dvc-revoke-btn--inline:hover { opacity: 1; }


/* ── Schwebendes Badge ──────────────────────────────────────────── */

.dvc-revoke-badge {
    position: fixed;
    bottom: 20px;
    left: 20px;
    z-index: 9999;
    width: 60px;
    height: 60px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 2px solid #aaa;
    color: #fff;
    cursor: pointer;
    opacity: .8;
    transition: opacity .2s, transform .2s;
    line-height: 1;
}

.dvc-revoke-badge:hover {
    opacity: 1;
    transform: scale(1.1);
}

.dvc-revoke-badge { display: none; }
.dvc-has-consent-videos .dvc-revoke-badge { display: flex; }


/* ── Responsive ─────────────────────────────────────────────────── */

@media (max-width: 480px) {
    .dvc-modal { padding: 24px 18px; }
}