/* ========================================
   THE MATRIX SKIN
   Pure black background, digital "Matrix green," JetBrains Mono. The real
   signature of this skin is the falling-code canvas effect in
   assets/js/matrix-rain.js, not just the palette - see that file for how it
   starts/stops itself based on this body class.
   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-matrix,
body.login.dwh-skin-matrix {
    --dwh-background: #000000;
    --dwh-surface: #0d0d0d;
    --dwh-surface-hover: #1a1a1a;
    --dwh-text: #00ff41;
    --dwh-text-secondary: #00cc33;
    --dwh-text-muted: #008f2a;
    --dwh-primary: #00ff41;
    --dwh-primary-hover: #66ff8c;
    --dwh-border: #00ff41;
    --dwh-border-muted: #004d14;
    --dwh-error: #ff2929;
    --dwh-success: #00ff41;
    --dwh-warning: #baff29;

    --dwh-glow: 0 0 8px #00ff41;
    --dwh-glow-strong: 0 0 16px #00ff41, 0 0 28px rgba(0, 255, 65, 0.5);
    --dwh-form-shadow: 0 0 24px rgba(0, 255, 65, 0.25), inset 0 0 20px rgba(0, 255, 65, 0.05);

    --dwh-font-primary: 'JetBrains Mono', 'Courier New', 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-matrix {
        --dwh-font-size-base: 14px;
    }
}

/* Keep surfaces slightly transparent so the code-rain canvas (rendered
   behind everything at z-index -1) shows through in the gaps around cards */
body.dwh-skin-matrix .site-header,
body.dwh-skin-matrix .site-footer,
body.dwh-skin-matrix .card,
body.dwh-skin-matrix .collection-stats,
body.dwh-skin-matrix .collection-filters,
body.dwh-skin-matrix .single-media__details {
    background-color: rgba(13, 13, 13, 0.85);
}

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