/* * BEVERLY HILLS NIGHTS theme — applied when * 80s summer night driving: warm coral, amber gold, tropical teal, deep navy. * Think Beverly Hills Cop, Miami Vice, GTA Vice City. */ /* ── variables ─────────────────────────────────────────────── */ body.theme-bevhills { --ink: #05080f; --panel: #080c18; --panel-2: #0c1122; --line: #162040; /* genre colors — warm palette */ --rock: #ff3860; --metal: #ff8c00; --indie: #00d4aa; --electronic: #00aadd; --pop: #ff6ec7; --other: #7a8aaa; /* theme accent tokens */ --bh-coral: #ff4d7a; --bh-teal: #00d4b4; --bh-gold: #ffaa40; --bh-cream: #ffe8b8; --bh-muted: #6a85b5; } /* ── scanlines (softer, warmer) ─────────────────────────────── */ body.theme-bevhills::before { content: ""; position: fixed; inset: 0; z-index: 9999; pointer-events: none; background: repeating-linear-gradient( to bottom, transparent 0px, transparent 3px, rgba(0,0,0,.11) 3px, rgba(0,0,0,.11) 4px ); } /* ── header ─────────────────────────────────────────────────── */ body.theme-bevhills header { background: linear-gradient(to bottom, rgba(5,8,15,.99), rgba(5,8,15,.88)); border-bottom: 1px solid rgba(255,77,122,.3); box-shadow: 0 0 20px rgba(255,77,122,.07), 0 0 50px rgba(255,140,0,.04); } body.theme-bevhills .logo { font-family: "Orbitron", monospace; letter-spacing: .14em; font-size: 24px; color: var(--bh-coral); text-shadow: 0 0 8px rgba(255,77,122,.5), 0 0 24px rgba(255,77,122,.22); filter: drop-shadow( 1px 0 0 rgba(255,140,0,.4)) drop-shadow(-1px 0 0 rgba(255,77,122,.4)); } body.theme-bevhills .logo span { color: var(--bh-gold); text-shadow: 0 0 8px rgba(255,170,64,.5), 0 0 24px rgba(255,170,64,.22); } body.theme-bevhills .tagline { font-family: "Share Tech Mono", monospace; font-size: 11px; color: var(--bh-muted); letter-spacing: .1em; } body.theme-bevhills .src-badge { font-family: "Share Tech Mono", monospace; border-radius: 4px; border-color: rgba(255,77,122,.2); background: rgba(255,77,122,.05); color: var(--bh-muted); } body.theme-bevhills .src-badge b { color: var(--bh-teal); } /* ── sidebar ────────────────────────────────────────────────── */ body.theme-bevhills aside { background: linear-gradient(to right, rgba(5,8,15,.99), rgba(8,12,24,.96)); border-right: 1px solid rgba(255,77,122,.2); box-shadow: 4px 0 24px rgba(255,77,122,.05); } body.theme-bevhills .panel-section { border-bottom-color: var(--line); } body.theme-bevhills .panel-section h2 { font-family: "Orbitron", monospace; font-size: 8px; letter-spacing: .28em; color: var(--bh-coral); text-shadow: 0 0 10px rgba(255,77,122,.35); } /* ── inputs ─────────────────────────────────────────────────── */ body.theme-bevhills input[type=text], body.theme-bevhills input[type=month], body.theme-bevhills select { font-family: "Share Tech Mono", monospace; background: rgba(8,12,24,.8); border-color: #1e3055; } body.theme-bevhills input:focus, body.theme-bevhills select:focus { outline-color: rgba(0,212,180,.6); box-shadow: 0 0 0 2px rgba(0,212,180,.1), 0 0 12px rgba(0,212,180,.12); } /* ── load button ────────────────────────────────────────────── */ body.theme-bevhills .btn { background: transparent; border: 1.5px solid var(--bh-coral); color: var(--bh-coral); font-family: "Orbitron", monospace; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; text-shadow: 0 0 8px rgba(255,77,122,.45); box-shadow: 0 0 10px rgba(255,77,122,.12), inset 0 0 10px rgba(255,77,122,.04); border-radius: 4px; } body.theme-bevhills .btn:hover { background: rgba(255,77,122,.09); box-shadow: 0 0 18px rgba(255,77,122,.28), inset 0 0 14px rgba(255,77,122,.07); } body.theme-bevhills .btn:disabled { background: transparent; border-color: var(--line); color: var(--bh-muted); box-shadow: none; text-shadow: none; } /* ── genre chips ─────────────────────────────────────────────── */ body.theme-bevhills .chip { font-family: "Share Tech Mono", monospace; font-size: 11px; border-radius: 3px; } body.theme-bevhills .chip.on { text-shadow: 0 0 8px var(--c, transparent); box-shadow: 0 0 8px rgba(255,255,255,.03); } /* ── show cards ─────────────────────────────────────────────── */ body.theme-bevhills .card .band { font-family: "Orbitron", monospace; font-size: 11.5px; letter-spacing: .07em; } body.theme-bevhills .card .meta, body.theme-bevhills .card .date { font-family: "Share Tech Mono", monospace; font-size: 11px; } body.theme-bevhills .card::before { box-shadow: 0 0 6px var(--c, transparent); } body.theme-bevhills .card:hover, body.theme-bevhills .card.active { background: rgba(255,255,255,.02); } body.theme-bevhills .card .date { text-shadow: 0 0 6px var(--c, transparent); } /* ── sidebar toggle ─────────────────────────────────────────── */ body.theme-bevhills .side-toggle { border-color: rgba(255,77,122,.4); color: var(--bh-coral); border-radius: 4px; box-shadow: 0 0 8px rgba(255,77,122,.1); text-shadow: 0 0 6px var(--bh-coral); } /* ── status ─────────────────────────────────────────────────── */ body.theme-bevhills .status { font-family: "Share Tech Mono", monospace; font-size: 11px; letter-spacing: .05em; } body.theme-bevhills .status strong { color: var(--bh-teal); } /* ── map — warm diagonal glow + subtle grid ─────────────────── */ body.theme-bevhills #map::after { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 500; background-image: linear-gradient(to right, rgba(255,140,0,.04) 1px, transparent 1px), linear-gradient(to bottom, rgba(255,140,0,.04) 1px, transparent 1px); background-size: 60px 60px; } /* warm bottom gradient — like streetlights reflecting on asphalt */ body.theme-bevhills #map::before { content: ""; position: absolute; bottom: 0; left: 0; right: 0; height: 140px; pointer-events: none; z-index: 501; background: linear-gradient(to top, rgba(255,100,0,.06) 0%, rgba(255,77,122,.03) 40%, transparent 100% ); } /* ── popups ─────────────────────────────────────────────────── */ body.theme-bevhills .leaflet-popup-content-wrapper { background: var(--panel); border-color: var(--line); } body.theme-bevhills .pop .band { font-family: "Orbitron", monospace; font-size: 18px; } /* ── theme toggle button ─────────────────────────────────────── */ body.theme-bevhills .theme-btn { font-family: "Orbitron", monospace; font-size: 9px; letter-spacing: .12em; border-color: rgba(255,170,64,.4); color: rgba(255,170,64,.85); border-radius: 4px; background: rgba(255,140,0,.05); box-shadow: 0 0 10px rgba(255,140,0,.08); text-shadow: 0 0 8px rgba(255,170,64,.35); } body.theme-bevhills .theme-btn:hover { background: rgba(255,140,0,.1); box-shadow: 0 0 16px rgba(255,140,0,.18); } /* ── Leaflet ─────────────────────────────────────────────────── */ body.theme-bevhills .leaflet-control-zoom a { border-color: var(--line) !important; }