body, html { background-color: #121826 !important; color: #E5E7EB !important; }
div, aside, section, form { background-color: transparent; }
.bg-white, [class*="bg-white"], [class*="bg-gray-"], [class*="bg-slate-"], [class*="bg-neutral-"] { background-color: #1C2333 !important; }
nav, header, footer { background-color: #1C2333 !important; border-color: #2D3548 !important; }
body * { color: #E5E7EB !important; }
a { color: #93C5FD !important; }
button, .btn, [class*="bg-orange"], [class*="bg-amber"] { color: #121826 !important; }
input, select, textarea { background-color: #0F172A !important; color: #E5E7EB !important; border-color: #2D3548 !important; }
hr, .border, .border-t, .border-b { border-color: #2D3548 !important; }

:root {
    --bg: #121826 !important;
    --bg-elevated: #1C2333 !important;
    --bg-card: #1C2333 !important;
    --fg: #E5E7EB !important;
    --muted: #94A3B8 !important;
    --border: #2D3548 !important;
    --accent-light: #3a2f14 !important;
}

.media-card h3.text-gray-900 {
    color: #F5C97B !important;
}

.media-card p.text-gray-500 {
    color: #94A3B8 !important;
}

.media-card {
    background-color: transparent !important;
}

.media-card > a > div.mt-3 {
    background-color: #121826 !important;
}

.media-card > a > div.mt-3 {
    background-color: #1C2333 !important;
    padding: 0.5rem 0.75rem !important;
    border-radius: 0 0 0.75rem 0.75rem !important;
    margin-top: 0 !important;
}

.media-card > a > div.relative {
    border-radius: 0.75rem 0.75rem 0 0 !important;
}

nav.hidden button,
nav.hidden a {
    color: #94A3B8 !important;
}

nav.hidden button:hover,
nav.hidden a:hover {
    color: #F5C97B !important;
}

.genre-tag {
    color: #CBD5E1 !important;
    background-color: transparent !important;
}

.genre-tag:hover {
    color: #F5C97B !important;
    border-color: #F5C97B !important;
}

.genre-tag.active,
.genre-tag[data-selected="true"] {
    color: #121826 !important;
    background-color: #2DD4BF !important;
}