/* ========================================
   CYBERPUNK / RETROWAVE SKIN
   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-cyberpunk,
body.login.dwh-skin-cyberpunk {
    --dwh-background: #170826;
    --dwh-surface: #240c3d;
    --dwh-surface-hover: #34145a;
    --dwh-text: #f2eaff;
    --dwh-text-secondary: #d9b8ff;
    --dwh-text-muted: #9a7ab8;
    --dwh-primary: #ff2d95;
    --dwh-primary-hover: #ff6ec7;
    --dwh-border: #00fff0;
    --dwh-border-muted: #4a2c6d;
    --dwh-error: #ff2d55;
    --dwh-success: #00ffb3;
    --dwh-warning: #ffe066;

    /* Chromatic double-glow (pink + cyan) for that outrun-grid look */
    --dwh-glow: 0 0 8px rgba(255, 45, 149, 0.7);
    --dwh-glow-strong: 0 0 14px rgba(255, 45, 149, 0.8), 0 0 26px rgba(0, 255, 240, 0.5);
    --dwh-form-shadow: 0 0 20px rgba(255, 45, 149, 0.3), inset 0 0 20px rgba(0, 255, 240, 0.05);

    --dwh-font-primary: 'Share Tech Mono', 'Courier New', monospace;
    --dwh-font-heading: 'Orbitron', 'Share Tech Mono', monospace;

    --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-cyberpunk {
        --dwh-font-size-base: 14px;
    }
}

/* Orbitron is a wide geometric display font - give headings extra breathing
   room so it doesn't feel cramped at the terminal-style default spacing */
body.dwh-skin-cyberpunk h1,
body.dwh-skin-cyberpunk h2,
body.dwh-skin-cyberpunk h3,
body.dwh-skin-cyberpunk h4,
body.dwh-skin-cyberpunk h5,
body.dwh-skin-cyberpunk h6 {
    letter-spacing: 3px;
    line-height: 1.5;
}

/* Recolor the select-arrow SVG (style.css hardcodes a green fill) to match */
body.dwh-skin-cyberpunk select,
body.login.dwh-skin-cyberpunk .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='%23ff2d95' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
}