/**
 * Daily "win every day" intro popup (components/daily-win-popup.php)
 * ------------------------------------------------------------------
 * Velký uvítací banner, který popne doprostřed okna a láká na denní
 * soutěže o peníze / free spiny. Zobrazí se 1× za den nepřihlášeným
 * návštěvníkům (viz inline skript v komponentě). Barvy = site theme
 * (cyan / magenta / purple), žádné off-theme zlato.
 *
 * Cíl velikosti: na velkých monitorech NESMÍ působit maličký — proto
 * min(900px, 94vw) + clamp() typografie.
 */

.dwp-overlay {
    position: fixed;
    inset: 0;
    z-index: 9500; /* nad obsahem/toastem/cookie, pod --z-age-gate (99999) */
    display: none;               /* JS přepne na flex, když se má ukázat */
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: radial-gradient(ellipse at center, rgba(20, 8, 32, 0.78) 0%, rgba(6, 5, 12, 0.9) 70%);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    opacity: 0;
    transition: opacity 0.35s ease;
}

.dwp-overlay.dwp-visible {
    opacity: 1;
}

.dwp-box {
    position: relative;
    box-sizing: border-box;
    width: min(900px, 94vw);
    max-height: 92vh;
    overflow-y: auto;
    overflow-x: hidden;
    text-align: center;
    padding: clamp(30px, 5vw, 60px) clamp(22px, 5vw, 64px);
    border-radius: 26px;
    border: 1px solid rgba(var(--neon-magenta-rgb), 0.35);
    background:
        radial-gradient(circle at 18% 12%, rgba(var(--neon-magenta-rgb), 0.16), transparent 42%),
        radial-gradient(circle at 85% 90%, rgba(var(--neon-cyan-rgb), 0.14), transparent 45%),
        linear-gradient(150deg, rgba(24, 16, 38, 0.98), rgba(9, 8, 16, 0.99));
    box-shadow:
        0 30px 80px rgba(0, 0, 0, 0.6),
        0 0 60px rgba(var(--neon-magenta-rgb), 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
    transform: scale(0.92) translateY(24px);
    transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.25, 1);
}

.dwp-overlay.dwp-visible .dwp-box {
    transform: scale(1) translateY(0);
}

.dwp-close {
    position: absolute;
    top: 14px;
    right: 16px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.04);
    color: rgba(255, 255, 255, 0.6);
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    transition: all var(--transition-normal);
}

.dwp-close:hover {
    color: #fff;
    border-color: rgba(var(--neon-magenta-rgb), 0.6);
    background: rgba(var(--neon-magenta-rgb), 0.12);
    transform: rotate(90deg);
}

.dwp-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 16px;
    margin-bottom: 20px;
    border-radius: 999px;
    border: 1px solid rgba(var(--neon-magenta-rgb), 0.4);
    background: rgba(var(--neon-magenta-rgb), 0.1);
    font-family: var(--font-display, 'Exo 2', sans-serif);
    font-size: clamp(0.72rem, 1.4vw, 0.85rem);
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #fff;
}

.dwp-eyebrow .dwp-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--neon-green, #00ff88);
    box-shadow: 0 0 10px var(--neon-green, #00ff88);
    animation: dwpPulse 1.6s ease-in-out infinite;
}

@keyframes dwpPulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50%      { opacity: 0.4; transform: scale(0.7); }
}

.dwp-title {
    font-family: var(--font-display, 'Exo 2', sans-serif);
    font-size: clamp(1.7rem, 4.4vw, 3rem);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: -0.01em;
    color: #fff;
    margin: 0 0 16px;
    text-transform: uppercase;
}

.dwp-title .dwp-grad {
    background: var(--gradient-cyber, linear-gradient(135deg, #00f5ff, #ff00ff));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.dwp-sub {
    font-size: clamp(0.98rem, 2vw, 1.25rem);
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.78);
    max-width: 620px;
    margin: 0 auto 26px;
}

.dwp-sub strong {
    color: #fff;
    font-weight: 700;
}

/* Chip řada s druhy výher */
.dwp-chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-bottom: 30px;
}

.dwp-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.035);
    font-family: var(--font-display, 'Exo 2', sans-serif);
    font-size: clamp(0.85rem, 1.6vw, 1rem);
    font-weight: 700;
    color: #fff;
}

.dwp-chip .dwp-chip-ico {
    font-size: 1.2em;
    line-height: 1;
}

/* CTA */
.dwp-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
}

.dwp-cta-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: min(460px, 100%);
    padding: clamp(16px, 2.4vw, 20px) 32px;
    border: none;
    border-radius: 16px;
    background: var(--gradient-respinners, linear-gradient(135deg, #9147ff, #00f5ff));
    font-family: var(--font-display, 'Exo 2', sans-serif);
    font-size: clamp(1.02rem, 2.2vw, 1.3rem);
    font-weight: 800;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    text-decoration: none;
    color: #fff;
    cursor: pointer;
    box-shadow: 0 12px 34px rgba(var(--neon-purple-rgb), 0.4);
    transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}

.dwp-cta-primary:hover {
    transform: translateY(-2px) scale(1.015);
    box-shadow: 0 16px 44px rgba(var(--neon-purple-rgb), 0.55);
}

.dwp-cta-primary .dwp-arrow {
    font-size: 1.1em;
    transition: transform var(--transition-normal);
}

.dwp-cta-primary:hover .dwp-arrow {
    transform: translateX(4px);
}

.dwp-register-note {
    font-size: clamp(0.85rem, 1.7vw, 0.98rem);
    color: rgba(255, 255, 255, 0.6);
    margin: 0;
}

.dwp-register-link {
    background: none;
    border: none;
    padding: 0;
    color: var(--neon-cyan, #00f5ff);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.dwp-register-link:hover {
    color: #fff;
}

/* Body scroll lock, když je popup otevřený */
body.dwp-open {
    overflow: hidden;
}

@media (max-width: 520px) {
    .dwp-overlay { padding: 14px; }
    .dwp-box { border-radius: 20px; }
    .dwp-chips { gap: 8px; }
    .dwp-chip { padding: 8px 13px; }
}

/* Perf / reduced-motion: vypni animace */
:root[data-perf="low"] .dwp-overlay,
:root[data-perf="low"] .dwp-box,
:root[data-perf="low"] .dwp-eyebrow .dwp-dot {
    transition: none;
    animation: none;
}