/* ========================================
   RETRO STRIPE SKIN
   1970s sunbaked-poster palette: cream background, mustard/burnt-orange/
   blue/navy multi-color stripe as an actual recurring motif (not just a
   color source). 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-retrostripe,
body.login.dwh-skin-retrostripe {
    --dwh-background: #ede4d0;
    --dwh-surface: #e3d6b8;
    --dwh-surface-hover: #d9c9a0;
    --dwh-text: #1b2a4a;
    --dwh-text-secondary: #3d4f73;
    --dwh-text-muted: #8a7f68;
    --dwh-primary: #c94a1c;
    --dwh-primary-hover: #e35a2b;
    --dwh-border: #e0a83e;
    --dwh-border-muted: #cbb98c;
    --dwh-error: #a83232;
    --dwh-success: #4c7a53;
    --dwh-warning: #e0a83e;

    /* Flat retro design uses hard-edged offset "print misregistration"
       shadows instead of a neon glow */
    --dwh-glow: 2px 2px 0 var(--dwh-border-muted);
    --dwh-glow-strong: 2px 2px 0 var(--dwh-primary), 4px 4px 0 var(--dwh-border);
    --dwh-form-shadow: 6px 6px 0 var(--dwh-border);

    --dwh-font-primary: 'Poppins', 'Trebuchet MS', sans-serif;
    --dwh-font-heading: 'Righteous', 'Poppins', 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;

    /* The four-band stripe motif itself, reused as a decorative element
       below rather than just a source of colors */
    --dwh-stripe-gradient: linear-gradient(
        90deg,
        #e0a83e 0%, #e0a83e 25%,
        #c94a1c 25%, #c94a1c 50%,
        #2e5c8a 50%, #2e5c8a 75%,
        #1b2a4a 75%, #1b2a4a 100%
    );
}

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

/* No CRT flicker or scanlines in a flat sunbaked-poster aesthetic */
body.dwh-skin-retrostripe .flicker {
    animation: none;
    opacity: 1;
}

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

/* Stripe bar under the header, replacing the plain border/glow */
body.dwh-skin-retrostripe .site-header {
    border-bottom: none;
    box-shadow: none;
}

body.dwh-skin-retrostripe .site-header::after {
    content: "";
    display: block;
    height: 6px;
    margin: var(--dwh-spacing-md) calc(-1 * var(--dwh-spacing-xl)) calc(-1 * var(--dwh-spacing-md));
    background: var(--dwh-stripe-gradient);
}

/* Stripe bar above the footer, replacing the plain border */
body.dwh-skin-retrostripe .site-footer {
    border-top: none;
}

body.dwh-skin-retrostripe .site-footer::before {
    content: "";
    display: block;
    height: 6px;
    margin: calc(-1 * var(--dwh-spacing-lg)) calc(-1 * var(--dwh-spacing-xl)) var(--dwh-spacing-lg);
    background: var(--dwh-stripe-gradient);
}

/* Stripe bar capping the login form box */
body.login.dwh-skin-retrostripe form {
    position: relative;
    padding-top: 34px;
}

body.login.dwh-skin-retrostripe form::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 8px;
    background: var(--dwh-stripe-gradient);
}

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