/* Loaded in <head>, before React, so browser/WebView controls and page background
   use the effective theme from the first paint. Internal/admin routes are excluded. */
html.lodging-results-theme {
  color-scheme: light;
  --lodging-page: #f6f8fa;
  --lodging-card: #ffffff;
  --lodging-surface: #eef3f7;
  --lodging-text: #19232f;
  --lodging-muted: #526174;
  --lodging-border: #d8e0e8;
  --lodging-price: #08754d;
  background: var(--lodging-page);
}
html[data-lodging-theme="dark"] {
  color-scheme: dark;
  --lodging-page: #101923;
  --lodging-card: #19232f;
  --lodging-surface: #22303f;
  --lodging-text: #f4f7fb;
  --lodging-muted: #b8c4d1;
  --lodging-border: #354252;
  --lodging-price: #6bdeb0;
  /* This project's Tailwind colors use var(--token), not hsl(var(--token)).
     Tokens must therefore be complete CSS colors. */
  --background: #101923;
  --foreground: #f4f7fb;
  --card: #19232f;
  --card-foreground: #f4f7fb;
  --popover: #19232f;
  --popover-foreground: #f4f7fb;
  --muted: #22303f;
  --muted-foreground: #b8c4d1;
  --border: #354252;
  --input: #354252;
}
.lodging-results-theme body {
  background-color: var(--lodging-page);
  color: var(--lodging-text);
}
/* Only semantic surfaces/controls; never filter or recolor photographs or maps. */
html[data-lodging-theme="dark"] :is(.bg-white, .bg-white\/95, .bg-white\/90, [role="dialog"], [role="listbox"], [data-radix-popper-content-wrapper] > *) {
  background-color: var(--lodging-card);
  color: var(--lodging-text);
}
html[data-lodging-theme="dark"] :is(.bg-slate-50, .bg-gray-50) {
  background-color: var(--lodging-page);
}
html[data-lodging-theme="dark"] :is(.bg-slate-100, .bg-slate-100\/70, .bg-gray-100, .bg-slate-200, .bg-gray-200, .bg-slate-50\/80, .bg-slate-50\/95) {
  background-color: var(--lodging-surface);
}
html[data-lodging-theme="dark"] :is(.text-slate-900, .text-slate-800, .text-slate-700, .text-gray-900, .text-gray-800, .text-gray-700) {
  color: var(--lodging-text);
}
html[data-lodging-theme="dark"] :is(.text-slate-600, .text-slate-500, .text-slate-400, .text-gray-600, .text-gray-500, .text-gray-400) {
  color: var(--lodging-muted);
}
html[data-lodging-theme="dark"] :is(.border-slate-100, .border-slate-200, .border-slate-300, .border-gray-100, .border-gray-200, .border-gray-300) {
  border-color: var(--lodging-border);
}
html[data-lodging-theme="dark"] :is(input, select, textarea) {
  color: var(--lodging-text);
  background-color: var(--lodging-card);
  border-color: var(--lodging-border);
}
html[data-lodging-theme="dark"] :is(input, textarea)::placeholder {
  color: var(--lodging-muted);
}
html[data-lodging-theme="dark"] :is(.bg-blue-50, .bg-sky-50, .bg-emerald-50, .bg-amber-50) {
  background-color: var(--lodging-surface);
}
html[data-lodging-theme="dark"] :is(.text-blue-600, .text-blue-700, .text-blue-800, .text-sky-600) {
  color: #63c9f3;
}
html[data-lodging-theme="dark"] :is(.text-emerald-500, .text-emerald-600, .text-emerald-700) {
  color: var(--lodging-price);
}
html[data-lodging-theme="dark"] .text-teal-800 {
  color: var(--lodging-price);
}
html[data-lodging-theme="dark"] :is(.hover\:bg-slate-50, .hover\:bg-gray-50, .hover\:bg-slate-100):hover {
  background-color: var(--lodging-surface);
}