/* ========================================
   VHS / VIDEO STORE SKIN
   Blockbuster-blue-and-yellow rental-counter nostalgia. Overrides the shared
   custom properties defined per-skin in assets/css/skin-fallout.css /
   inc/theme-skins.php.
   Selectors include the .login variant explicitly so this file wins on
   specificity regardless of stylesheet print order.
   ======================================== */
body.dwh-skin-vhs,
body.login.dwh-skin-vhs {
    --dwh-background: #0d2b4e;
    --dwh-surface: #163b64;
    --dwh-surface-hover: #1f4d7d;
    --dwh-text: #f5f0e1;
    --dwh-text-secondary: #c9d6e3;
    --dwh-text-muted: #7d93ab;
    --dwh-primary: #ffd200;
    --dwh-primary-hover: #ffe066;
    --dwh-border: #ffd200;
    --dwh-border-muted: #2c5480;
    --dwh-error: #ff5252;
    --dwh-success: #4caf50;
    --dwh-warning: #ffd200;

    /* Subtle chromatic-aberration fringe, like a mistracked tape signal */
    --dwh-glow: 1px 0 0 rgba(255, 0, 60, 0.5), -1px 0 0 rgba(0, 255, 255, 0.4);
    --dwh-glow-strong: 2px 0 0 rgba(255, 0, 60, 0.6), -2px 0 0 rgba(0, 255, 255, 0.5), 0 0 8px rgba(0, 0, 0, 0.4);
    --dwh-form-shadow: 0 0 20px rgba(0, 0, 0, 0.5), inset 0 0 15px rgba(255, 210, 0, 0.05);

    --dwh-font-primary: 'Oswald', 'Arial Narrow', sans-serif;
    --dwh-font-heading: 'Bebas Neue', 'Impact', sans-serif;

    --dwh-font-size-base: 16px;
    --dwh-font-size-sm: 14px;
    --dwh-font-size-lg: 18px;
    --dwh-font-size-xl: 24px;
    --dwh-font-size-2xl: 32px;
}

@media (max-width: 480px) {
    body.dwh-skin-vhs {
        --dwh-font-size-base: 14px;
    }
}

/* Bebas Neue is tall and very condensed - widen the letter tracking a touch
   more than the terminal-style default so headings don't feel cramped */
body.dwh-skin-vhs h1,
body.dwh-skin-vhs h2,
body.dwh-skin-vhs h3,
body.dwh-skin-vhs h4,
body.dwh-skin-vhs h5,
body.dwh-skin-vhs h6 {
    letter-spacing: 3px;
}

/* Repurpose the existing .flicker hook (already on .site-title in header.php)
   as a brief VHS tracking-jump glitch instead of the Pip-Boy blink */
@keyframes dwh-vhs-tracking {
    0%, 89%, 100% {
        transform: translate(0, 0);
        text-shadow: var(--dwh-glow-strong);
    }
    90% {
        transform: translate(-2px, 0);
        text-shadow: 2px 0 0 rgba(255, 0, 60, 0.7), -2px 0 0 rgba(0, 255, 255, 0.6);
    }
    92% {
        transform: translate(2px, 0);
    }
    94% {
        transform: translate(0, 0);
    }
}

body.dwh-skin-vhs .flicker {
    animation: dwh-vhs-tracking 6s infinite;
}

body.dwh-skin-vhs.scanlines::after {
    display: none;
}

/* Recolor the select-arrow SVG (style.css hardcodes a green fill) to match */
body.dwh-skin-vhs select,
body.login.dwh-skin-vhs .language-switcher select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23ffd200' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
}