/* Ride / Don't Ride theme – Green (ride) & Red (don't ride) */
:root[data-theme="ride-dont-ride"] {
    --primary-orange: #86efac;   /* Light green – borders, soft UI */
    --primary-red: #fecaca;      /* Light red – secondary UI */
    --accent-orange: #22c55e;    /* Green – primary actions, "ride" */
    --accent-red: #dc2626;       /* Red – "don't ride", danger */
    --dark-orange: #15803d;      /* Dark green – text, emphasis */
    --title-gradient: none;      /* Title uses two-part green/red, not gradient */
    --ride-green: #16a34a;
    --ride-green-dark: #15803d;
    --dont-red: #dc2626;
    --dont-red-dark: #b91c1c;
}

/* Light background with subtle green and red tints */
body[data-theme="ride-dont-ride"]:not(.dark-mode) {
    background:
        radial-gradient(900px 600px at 20% 15%, rgba(34, 197, 94, 0.08), rgba(249, 250, 251, 0) 55%),
        radial-gradient(800px 520px at 80% 20%, rgba(220, 38, 38, 0.06), rgba(249, 250, 251, 0) 60%),
        linear-gradient(180deg, #f9fafb 0%, #f3f4f6 100%);
}

body[data-theme="ride-dont-ride"]:not(.dark-mode) .card {
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 4px 16px rgba(34, 197, 94, 0.08);
}

body[data-theme="ride-dont-ride"] .btn-primary {
    background: linear-gradient(135deg, var(--ride-green), var(--ride-green-dark)) !important;
    color: white !important;
}

body[data-theme="ride-dont-ride"] .btn-primary:hover {
    background: linear-gradient(135deg, #22c55e, #16a34a) !important;
    box-shadow: 0 3px 12px rgba(34, 197, 94, 0.3);
}

body[data-theme="ride-dont-ride"] .input-group input[type="time"],
body[data-theme="ride-dont-ride"] .input-group input[type="number"],
body[data-theme="ride-dont-ride"] #origin-search input,
body[data-theme="ride-dont-ride"] #destination-search input {
    border-color: var(--ride-green) !important;
    color: #1f2937;
    background: white;
}

body[data-theme="ride-dont-ride"] .input-group input[type="time"]:focus,
body[data-theme="ride-dont-ride"] .input-group input[type="number"]:focus,
body[data-theme="ride-dont-ride"] #origin-search input:focus,
body[data-theme="ride-dont-ride"] #destination-search input:focus {
    border-color: var(--ride-green-dark) !important;
    box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.15);
}

/* Title: Ride (green) / Don't Ride (red) – overrides text-style when this theme is active */
body[data-theme="ride-dont-ride"] #main-title.title-text {
    background: none !important;
    -webkit-background-clip: unset !important;
    -webkit-text-fill-color: unset !important;
    background-clip: unset !important;
    color: inherit !important;
}

body[data-theme="ride-dont-ride"] #main-title .title-ride {
    color: var(--ride-green) !important;
    -webkit-text-fill-color: var(--ride-green) !important;
}

body[data-theme="ride-dont-ride"] #main-title .title-dont {
    color: var(--dont-red) !important;
    -webkit-text-fill-color: var(--dont-red) !important;
}

/* Nav/header accents in this theme */
body[data-theme="ride-dont-ride"] [style*="var(--dark-orange)"],
body[data-theme="ride-dont-ride"] [style*="color: var(--dark-orange)"] {
    color: var(--ride-green-dark) !important;
}

/* Dark mode for ride-dont-ride */
body[data-theme="ride-dont-ride"].dark-mode {
    background: linear-gradient(180deg, #0f172a 0%, #1e293b 100%);
}

body[data-theme="ride-dont-ride"].dark-mode .card {
    background: rgba(30, 41, 59, 0.95);
    border-color: #334155;
}

body[data-theme="ride-dont-ride"].dark-mode #main-title .title-ride {
    color: #4ade80 !important;
    -webkit-text-fill-color: #4ade80 !important;
}

body[data-theme="ride-dont-ride"].dark-mode #main-title .title-dont {
    color: #f87171 !important;
    -webkit-text-fill-color: #f87171 !important;
}