/* Shared KinkKal color theme. Dark remains the no-JavaScript/default theme. */
:root {
    color-scheme: dark;
}

html[data-theme="light"] {
    color-scheme: light;
}

.theme-toggle {
    -webkit-tap-highlight-color: transparent;
}

.theme-toggle [data-theme-toggle-icon] {
    line-height: 1;
}

html[data-theme="light"] body {
    background-color: #f8fafc !important;
    color: #1f2937 !important;
}

/* Invert the neutral utility scale semantically: dark surfaces become light
   surfaces, while secondary and primary copy retain strong contrast. */
html[data-theme="light"] .bg-gray-950 { background-color: #e2e8f0 !important; }
html[data-theme="light"] .bg-gray-900 { background-color: #f8fafc !important; }
html[data-theme="light"] .bg-gray-800 { background-color: #ffffff !important; }
html[data-theme="light"] .bg-gray-750 { background-color: #f1f5f9 !important; }
html[data-theme="light"] .bg-gray-700 { background-color: #e2e8f0 !important; }
html[data-theme="light"] .bg-gray-600 { background-color: #cbd5e1 !important; }
html[data-theme="light"] .bg-gray-500 { background-color: #94a3b8 !important; }
html[data-theme="light"] .bg-gray-300 { background-color: #cbd5e1 !important; }
html[data-theme="light"] .bg-gray-200 { background-color: #e2e8f0 !important; }
html[data-theme="light"] .bg-gray-100 { background-color: #f1f5f9 !important; }

html[data-theme="light"] [class~="bg-gray-950/40"] { background-color: rgb(226 232 240 / .4) !important; }
html[data-theme="light"] [class~="bg-gray-950/50"] { background-color: rgb(226 232 240 / .5) !important; }
html[data-theme="light"] [class~="bg-gray-950/60"] { background-color: rgb(226 232 240 / .6) !important; }
html[data-theme="light"] [class~="bg-gray-950/80"] { background-color: rgb(226 232 240 / .8) !important; }
html[data-theme="light"] [class~="bg-gray-950/90"] { background-color: rgb(226 232 240 / .9) !important; }
html[data-theme="light"] [class~="bg-gray-900/20"] { background-color: rgb(248 250 252 / .2) !important; }
html[data-theme="light"] [class~="bg-gray-900/30"] { background-color: rgb(248 250 252 / .3) !important; }
html[data-theme="light"] [class~="bg-gray-900/50"] { background-color: rgb(248 250 252 / .5) !important; }
html[data-theme="light"] [class~="bg-gray-900/60"] { background-color: rgb(248 250 252 / .6) !important; }
html[data-theme="light"] [class~="bg-gray-900/70"] { background-color: rgb(248 250 252 / .7) !important; }
html[data-theme="light"] [class~="bg-gray-900/80"] { background-color: rgb(248 250 252 / .8) !important; }
html[data-theme="light"] [class~="bg-gray-900/95"] { background-color: rgb(248 250 252 / .95) !important; }
html[data-theme="light"] [class~="bg-gray-800/50"] { background-color: rgb(255 255 255 / .5) !important; }
html[data-theme="light"] [class~="bg-gray-800/70"] { background-color: rgb(255 255 255 / .7) !important; }
html[data-theme="light"] [class~="bg-gray-800/80"] { background-color: rgb(255 255 255 / .8) !important; }
html[data-theme="light"] [class~="bg-gray-800/90"] { background-color: rgb(255 255 255 / .9) !important; }
html[data-theme="light"] [class~="bg-gray-700/30"] { background-color: rgb(226 232 240 / .3) !important; }
html[data-theme="light"] [class~="bg-gray-700/50"] { background-color: rgb(226 232 240 / .5) !important; }

html[data-theme="light"] .text-white,
html[data-theme="light"] .text-gray-100,
html[data-theme="light"] .text-gray-200,
html[data-theme="light"] .text-gray-900,
html[data-theme="light"] .text-gray-950 { color: #111827 !important; }
html[data-theme="light"] .text-gray-300 { color: #1f2937 !important; }
html[data-theme="light"] .text-gray-400 { color: #334155 !important; }
html[data-theme="light"] .text-gray-500 { color: #475569 !important; }
html[data-theme="light"] .text-gray-600,
html[data-theme="light"] .text-gray-700 { color: #64748b !important; }
html[data-theme="light"] .text-gray-800 { color: #1f2937 !important; }

html[data-theme="light"] .border-gray-900,
html[data-theme="light"] .border-gray-800,
html[data-theme="light"] .border-gray-700 { border-color: #cbd5e1 !important; }
html[data-theme="light"] .border-gray-600,
html[data-theme="light"] .border-gray-500,
html[data-theme="light"] .border-gray-400 { border-color: #94a3b8 !important; }
html[data-theme="light"] .border-gray-300,
html[data-theme="light"] .border-gray-200 { border-color: #cbd5e1 !important; }
html[data-theme="light"] [class~="border-gray-700/30"] { border-color: rgb(148 163 184 / .3) !important; }
html[data-theme="light"] [class~="border-gray-700/50"] { border-color: rgb(148 163 184 / .5) !important; }
html[data-theme="light"] [class~="border-gray-700/90"] { border-color: rgb(148 163 184 / .9) !important; }
html[data-theme="light"] [class~="border-gray-600/50"] { border-color: rgb(100 116 139 / .5) !important; }

html[data-theme="light"] .from-gray-800 {
    --tw-gradient-from: #fff var(--tw-gradient-from-position) !important;
    --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position) !important;
}
html[data-theme="light"] .via-gray-800 {
    --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), #fff var(--tw-gradient-via-position), var(--tw-gradient-to) !important;
}
html[data-theme="light"] .via-gray-900 {
    --tw-gradient-to: rgb(248 250 252 / 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), #f8fafc var(--tw-gradient-via-position), var(--tw-gradient-to) !important;
}
html[data-theme="light"] [class~="via-gray-950/60"] {
    --tw-gradient-to: rgb(226 232 240 / 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), rgb(226 232 240 / .6) var(--tw-gradient-via-position), var(--tw-gradient-to) !important;
}
html[data-theme="light"] .to-gray-900 { --tw-gradient-to: #f8fafc var(--tw-gradient-to-position) !important; }
html[data-theme="light"] [class~="to-gray-950/40"] { --tw-gradient-to: rgb(226 232 240 / .4) var(--tw-gradient-to-position) !important; }

html[data-theme="light"] [class~="hover:bg-gray-900"]:hover { background-color: #f8fafc !important; }
html[data-theme="light"] [class~="hover:bg-gray-800"]:hover,
html[data-theme="light"] [class~="hover:bg-gray-750"]:hover { background-color: #f1f5f9 !important; }
html[data-theme="light"] [class~="hover:bg-gray-700"]:hover { background-color: #e2e8f0 !important; }
html[data-theme="light"] [class~="hover:bg-gray-700/30"]:hover { background-color: rgb(226 232 240 / .3) !important; }
html[data-theme="light"] [class~="hover:bg-gray-700/50"]:hover { background-color: rgb(226 232 240 / .5) !important; }
html[data-theme="light"] [class~="hover:bg-gray-600"]:hover { background-color: #cbd5e1 !important; }
html[data-theme="light"] [class~="hover:bg-gray-500"]:hover { background-color: #94a3b8 !important; }
html[data-theme="light"] [class~="hover:text-white"]:hover,
html[data-theme="light"] [class~="group-hover:text-white"] { color: #111827 !important; }
html[data-theme="light"] [class~="hover:text-gray-300"]:hover,
html[data-theme="light"] [class~="group-hover:text-gray-300"] { color: #1f2937 !important; }
html[data-theme="light"] [class~="group-hover:text-gray-200"] { color: #111827 !important; }
html[data-theme="light"] [class~="hover:border-gray-700"]:hover,
html[data-theme="light"] [class~="hover:border-gray-600"]:hover,
html[data-theme="light"] [class~="hover:border-gray-500"]:hover { border-color: #64748b !important; }
html[data-theme="light"] [class~="placeholder:text-gray-600"]::placeholder,
html[data-theme="light"] .placeholder-gray-600::placeholder,
html[data-theme="light"] .placeholder-gray-500::placeholder { color: #64748b !important; opacity: 1; }

/* Dark tinted status panels become pale tints, allowing their accent text to
   use stronger daylight-friendly shades. */
html[data-theme="light"] :is(
    .bg-indigo-900, [class~="bg-indigo-900/10"], [class~="bg-indigo-900/20"], [class~="bg-indigo-900/30"],
    [class~="bg-indigo-900/40"], [class~="bg-indigo-900/50"], [class~="bg-indigo-900/60"], [class~="bg-indigo-900/70"],
    [class~="bg-indigo-900/80"], [class~="bg-indigo-950/20"], [class~="bg-indigo-950/30"], [class~="bg-indigo-950/40"],
    [class~="bg-indigo-950/50"]
) { background-color: #eef2ff !important; }
html[data-theme="light"] :is(
    .bg-purple-900, [class~="bg-purple-900/10"], [class~="bg-purple-900/30"], [class~="bg-purple-900/40"],
    [class~="bg-purple-900/50"], [class~="bg-purple-900/80"], [class~="bg-purple-950/40"], [class~="bg-purple-950/50"]
) { background-color: #faf5ff !important; }
html[data-theme="light"] :is(.bg-pink-900, [class~="bg-pink-900/40"], [class~="bg-pink-950/40"]) { background-color: #fdf2f8 !important; }
html[data-theme="light"] :is(
    .bg-green-900, .bg-green-950, [class~="bg-green-900/10"], [class~="bg-green-900/20"], [class~="bg-green-900/30"],
    [class~="bg-green-900/40"], [class~="bg-green-900/50"], [class~="bg-green-900/70"], [class~="bg-green-900/80"],
    [class~="bg-green-950/60"], .bg-emerald-900, [class~="bg-emerald-900/20"], [class~="bg-emerald-900/30"],
    [class~="bg-emerald-900/50"], [class~="bg-emerald-950/10"], [class~="bg-emerald-950/20"],
    [class~="bg-emerald-950/40"], [class~="bg-emerald-950/50"], [class~="bg-emerald-950/60"]
) { background-color: #ecfdf5 !important; }
html[data-theme="light"] :is(
    .bg-amber-900, [class~="bg-amber-900/10"], [class~="bg-amber-900/20"], [class~="bg-amber-900/30"],
    [class~="bg-amber-900/50"], [class~="bg-amber-900/80"], [class~="bg-amber-950/20"], [class~="bg-amber-950/30"],
    [class~="bg-amber-950/40"], [class~="bg-amber-950/50"], .bg-yellow-900, [class~="bg-yellow-900/20"],
    [class~="bg-yellow-900/30"], [class~="bg-yellow-900/40"]
) { background-color: #fffbeb !important; }
html[data-theme="light"] :is(
    .bg-red-900, .bg-red-950, [class~="bg-red-900/5"], [class~="bg-red-900/10"], [class~="bg-red-900/20"],
    [class~="bg-red-900/30"], [class~="bg-red-900/40"], [class~="bg-red-900/50"], [class~="bg-red-900/70"],
    [class~="bg-red-900/80"], [class~="bg-red-950/10"], [class~="bg-red-950/20"], [class~="bg-red-950/30"],
    [class~="bg-red-950/50"], [class~="bg-red-950/60"], .bg-rose-900
) { background-color: #fef2f2 !important; }
html[data-theme="light"] :is(
    .bg-blue-900, [class~="bg-blue-900/20"], [class~="bg-blue-900/30"], [class~="bg-blue-900/40"], [class~="bg-blue-900/50"]
) { background-color: #eff6ff !important; }
html[data-theme="light"] :is([class~="bg-cyan-950/25"], [class~="bg-cyan-950/40"]) { background-color: #ecfeff !important; }
html[data-theme="light"] :is([class~="bg-orange-900/10"], [class~="bg-orange-900/30"]) { background-color: #fff7ed !important; }

html[data-theme="light"] :is(.text-indigo-100, .text-indigo-200, .text-indigo-300, .text-indigo-400, .text-indigo-500, .text-indigo-600) { color: #4338ca !important; }
html[data-theme="light"] :is(.text-purple-100, .text-purple-200, .text-purple-300, .text-purple-400, .text-purple-500, .text-purple-600) { color: #7e22ce !important; }
html[data-theme="light"] :is(.text-pink-100, .text-pink-200, .text-pink-300, .text-pink-400, .text-pink-500) { color: #be185d !important; }
html[data-theme="light"] :is(.text-green-100, .text-green-200, .text-green-300, .text-green-400, .text-green-500, .text-green-600, .text-emerald-200, .text-emerald-300, .text-emerald-400, .text-emerald-500) { color: #047857 !important; }
html[data-theme="light"] :is(.text-amber-100, .text-amber-200, .text-amber-300, .text-amber-400, .text-amber-500, .text-amber-600, .text-yellow-100, .text-yellow-200, .text-yellow-300, .text-yellow-400, .text-yellow-500) { color: #92400e !important; }
html[data-theme="light"] :is(.text-red-100, .text-red-200, .text-red-300, .text-red-400, .text-red-500, .text-red-600, .text-rose-200, .text-rose-400, .text-rose-500) { color: #b91c1c !important; }
html[data-theme="light"] :is(.text-blue-200, .text-blue-300, .text-blue-400, .text-blue-500) { color: #1d4ed8 !important; }
html[data-theme="light"] :is(.text-cyan-300, .text-cyan-400) { color: #0e7490 !important; }
html[data-theme="light"] :is(.text-orange-100, .text-orange-300, .text-orange-400, .text-orange-500) { color: #c2410c !important; }

/* Headings become dark in light mode, but text on saturated action buttons
   must remain white. Exact class-token matching avoids coloring hover-only states. */
html[data-theme="light"] :is(
    [class~="bg-indigo-500"], [class~="bg-indigo-600"], [class~="bg-indigo-800"],
    [class~="bg-purple-500"], [class~="bg-purple-600"], [class~="bg-purple-700"], [class~="bg-purple-800"],
    [class~="bg-pink-500"], [class~="bg-pink-600"], [class~="bg-pink-700"],
    [class~="bg-green-500"], [class~="bg-green-600"], [class~="bg-green-700"],
    [class~="bg-emerald-500"], [class~="bg-emerald-600"],
    [class~="bg-amber-500"], [class~="bg-amber-600"], [class~="bg-amber-700"],
    [class~="bg-yellow-600"], [class~="bg-orange-500"], [class~="bg-orange-600"],
    [class~="bg-red-500"], [class~="bg-red-600"], [class~="bg-red-700"], [class~="bg-red-800"],
    [class~="bg-blue-500"], [class~="bg-blue-600"], [class~="bg-blue-700"], [class~="bg-blue-800"],
    [class~="bg-cyan-600"], [class~="bg-teal-600"], [class~="bg-rose-500"], [class~="bg-rose-700"],
    [class*="from-indigo-"], [class*="from-purple-"]
).text-white,
html[data-theme="light"] :is(
    [class~="bg-indigo-500"], [class~="bg-indigo-600"], [class~="bg-indigo-800"],
    [class~="bg-purple-500"], [class~="bg-purple-600"], [class~="bg-purple-700"], [class~="bg-purple-800"],
    [class~="bg-pink-500"], [class~="bg-pink-600"], [class~="bg-pink-700"],
    [class~="bg-green-500"], [class~="bg-green-600"], [class~="bg-green-700"],
    [class~="bg-emerald-500"], [class~="bg-emerald-600"], [class~="bg-amber-500"], [class~="bg-amber-600"],
    [class~="bg-yellow-600"], [class~="bg-orange-600"], [class~="bg-red-500"], [class~="bg-red-600"],
    [class~="bg-red-700"], [class~="bg-red-800"], [class~="bg-blue-500"], [class~="bg-blue-600"],
    [class~="bg-blue-700"], [class~="bg-blue-800"], [class~="bg-cyan-600"], [class~="bg-teal-600"]
) .text-white {
    color: #fff !important;
}

html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea { color: #111827; }

html[data-theme="light"] .dropdown-menu {
    background: #fff !important;
    border-color: #cbd5e1 !important;
    box-shadow: 0 16px 30px rgb(15 23 42 / .16);
}

html[data-theme="light"] [class~="bg-[#050505]"],
html[data-theme="light"] [class~="bg-[#080808]"],
html[data-theme="light"] [class~="bg-[#0a0a0a]"],
html[data-theme="light"] [class~="bg-[#111]"],
html[data-theme="light"] [class~="bg-[#1a1a1a]"],
html[data-theme="light"] [class~="bg-[#1e1e1e]"] { background-color: #fff !important; }

/* Calendar and map components use their own non-Tailwind dark palette. */
html[data-theme="light"] .fc-toolbar-title,
html[data-theme="light"] .fc-col-header-cell-cushion,
html[data-theme="light"] .fc-list-day-text,
html[data-theme="light"] .fc-list-day-side-text { color: #111827 !important; }
html[data-theme="light"] .fc-col-header-cell,
html[data-theme="light"] .fc-list-day-cushion { background-color: #e2e8f0 !important; border-color: #94a3b8 !important; }
html[data-theme="light"] .fc-theme-standard td,
html[data-theme="light"] .fc-theme-standard th { border-color: #cbd5e1 !important; }
html[data-theme="light"] .fc-daygrid-day-number,
html[data-theme="light"] .fc-list-event-title a { color: #1f2937 !important; }
html[data-theme="light"] .fc-list-event-time { color: #475569 !important; }
html[data-theme="light"] .sidebar-promoted { background-color: #fffbeb !important; }
html[data-theme="light"] .sidebar-promoted-title { color: #92400e !important; }
html[data-theme="light"] .sidebar-promoted-text { color: #78350f !important; }
html[data-theme="light"] .sidebar-final { background-color: #eff6ff !important; }
html[data-theme="light"] .sidebar-final-title { color: #1d4ed8 !important; }
html[data-theme="light"] .sidebar-final-text { color: #1e3a8a !important; }

html[data-theme="light"] #map { background: #e5e7eb !important; }
html[data-theme="light"] .leaflet-popup-content-wrapper,
html[data-theme="light"] .leaflet-popup-tip { border-color: #94a3b8 !important; }
html[data-theme="light"] .pop-bg-standard { background-color: #fff !important; }
html[data-theme="light"] .pop-bg-past { background-color: #f1f5f9 !important; }
html[data-theme="light"] .pop-bg-promoted { background-color: #fffbeb !important; }
html[data-theme="light"] .pop-bg-live { background-color: #ecfdf5 !important; }
html[data-theme="light"] .pop-bg-final { background-color: #eff6ff !important; }
html[data-theme="light"] .pop-bg-final-past { background-color: #e2e8f0 !important; }
html[data-theme="light"] #geolocate-btn { background: #fff !important; border-color: #94a3b8 !important; color: #111827 !important; }

/* Admin directory cards have a bespoke palette, so they receive an explicit
   light treatment in addition to the shared utility mapping above. */
html[data-theme="light"] .directory-heading-stat { background: #eef2ff !important; color: #3730a3 !important; }
html[data-theme="light"] .directory-toolbar,
html[data-theme="light"] .directory-card { background: linear-gradient(145deg, #fff, #f8fafc) !important; border-color: #cbd5e1 !important; }
html[data-theme="light"] .directory-search input,
html[data-theme="light"] .directory-search input:focus { background: #fff !important; border-color: #94a3b8 !important; color: #111827 !important; }
html[data-theme="light"] .directory-result,
html[data-theme="light"] .directory-filter > span,
html[data-theme="light"] .directory-card-title,
html[data-theme="light"] .directory-schedule-value { color: #1f2937 !important; }
html[data-theme="light"] .directory-filter > span,
html[data-theme="light"] .directory-filter-count,
html[data-theme="light"] .directory-schedule,
html[data-theme="light"] .directory-delete,
html[data-theme="light"] .directory-meta code,
html[data-theme="light"] .directory-empty { background: #f1f5f9 !important; border-color: #cbd5e1 !important; }
html[data-theme="light"] .directory-filter input:checked + span { background: #eef2ff !important; color: #3730a3 !important; }
html[data-theme="light"] .directory-filter[data-tone="amber"] input:checked + span { background: #fffbeb !important; color: #92400e !important; }
html[data-theme="light"] .directory-filter[data-tone="red"] input:checked + span { background: #fef2f2 !important; color: #991b1b !important; }
html[data-theme="light"] .directory-filter[data-tone="pink"] input:checked + span { background: #fdf2f8 !important; color: #9d174d !important; }
html[data-theme="light"] .directory-filter-label,
html[data-theme="light"] .directory-location,
html[data-theme="light"] .directory-schedule-label,
html[data-theme="light"] .directory-meta,
html[data-theme="light"] .directory-meta code,
html[data-theme="light"] .directory-reset,
html[data-theme="light"] .directory-legend,
html[data-theme="light"] .directory-empty { color: #475569 !important; }
html[data-theme="light"] .directory-badge { background: #e2e8f0 !important; border-color: #94a3b8 !important; color: #334155 !important; }
html[data-theme="light"] .directory-badge.amber { background: #fffbeb !important; color: #92400e !important; }
html[data-theme="light"] .directory-badge.red { background: #fef2f2 !important; color: #991b1b !important; }
html[data-theme="light"] .directory-badge.pink { background: #fdf2f8 !important; color: #9d174d !important; }
html[data-theme="light"] .directory-badge.green { background: #ecfdf5 !important; color: #065f46 !important; }
html[data-theme="light"] .directory-badge.blue { background: #eff6ff !important; color: #1e40af !important; }
html[data-theme="light"] .directory-edit,
html[data-theme="light"] .directory-clear { color: #4338ca !important; }

html[data-theme="light"] ::-webkit-scrollbar-track { background: #e2e8f0; }
html[data-theme="light"] * { scrollbar-color: #4f46e5 #e2e8f0; }

@media (prefers-reduced-motion: reduce) {
    .theme-toggle { transition: none !important; }
}