/* Final mode layer: restores a real light theme while preserving the existing dark theme. */
html[data-xboss-theme="light"]:not(.dark) {
  color-scheme: light;
  --background: 210 25% 97%;
  --foreground: 220 22% 15%;
  --card: 0 0% 100%;
  --card-foreground: 220 22% 15%;
  --popover: 0 0% 100%;
  --popover-foreground: 220 22% 15%;
  --primary: 190 78% 34%;
  --primary-foreground: 0 0% 100%;
  --secondary: 210 20% 96%;
  --secondary-foreground: 220 18% 23%;
  --muted: 210 20% 95%;
  --muted-foreground: 215 13% 42%;
  --accent: 190 22% 93%;
  --accent-foreground: 220 22% 18%;
  --border: 210 18% 88%;
  --input: 210 18% 80%;
  --ring: 190 78% 34%;
  --success: 158 64% 34%;
  --warning: 37 92% 43%;
  --destructive: 0 72% 51%;
  --destructive-foreground: 0 0% 100%;
  --danger: 0 72% 51%;
  --info: 205 78% 44%;
  --chart-1: 190 78% 34%;
  --chart-2: 158 64% 34%;
  --chart-3: 37 92% 43%;
  --chart-4: 254 62% 56%;
  --chart-5: 344 68% 49%;
  --sidebar-background: 0 0% 100%;
  --sidebar-foreground: 218 17% 31%;
  --sidebar-primary: 190 78% 34%;
  --sidebar-accent: 190 24% 93%;
  --sidebar-border: 210 18% 88%;
  --rhino-canvas: #f3f6f8;
  --rhino-surface: #ffffff;
  --rhino-surface-raised: #f8fafb;
  --rhino-surface-hover: #eef3f5;
  --rhino-line: #dce4e9;
  --rhino-line-strong: #c7d2da;
  --rhino-brand: #087f92;
  --rhino-brand-soft: rgb(8 127 146 / 0.1);
  --rhino-text: #182229;
  --rhino-text-muted: #5b6b78;
  --rhino-text-faint: #82909c;
  --rhino-shadow-overlay: 0 18px 48px rgb(15 23 42 / 0.1), 0 3px 12px rgb(15 23 42 / 0.06);
  background: var(--rhino-canvas);
  color: var(--rhino-text);
}

html[data-xboss-theme="light"]:not(.dark) body {
  background: var(--rhino-canvas);
  color: var(--rhino-text);
}

html[data-xboss-theme="light"]:not(.dark) body::before {
  background: var(--rhino-canvas);
  animation: none;
}

html[data-xboss-theme="light"]:not(.dark) .rhino-app-aside,
html[data-xboss-theme="light"]:not(.dark) .rhino-app-drawer,
html[data-xboss-theme="light"]:not(.dark) .rhino-app-aside > div,
html[data-xboss-theme="light"]:not(.dark) .rhino-app-drawer > div {
  border-color: hsl(var(--sidebar-border)) !important;
  background: hsl(var(--sidebar-background) / 0.97) !important;
  box-shadow: 1px 0 0 rgb(15 23 42 / 0.03);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

html[data-xboss-theme="light"]:not(.dark) .rhino-brand-name {
  background: none;
  color: var(--rhino-brand) !important;
}

html[data-xboss-theme="light"]:not(.dark) .rhino-app-aside a.bg-muted::before,
html[data-xboss-theme="light"]:not(.dark) .rhino-app-drawer a.bg-muted::before {
  background: var(--rhino-brand);
  box-shadow: none;
}

html[data-xboss-theme="light"]:not(.dark) .rhino-app-header {
  border-color: hsl(var(--border)) !important;
  background: rgb(255 255 255 / 0.98) !important;
  box-shadow: 0 1px 0 rgb(15 23 42 / 0.05);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* Frosted light surfaces stay subtle and scoped to light mode only. */
html[data-xboss-theme="light"]:not(.dark) body {
  background: linear-gradient(135deg, #eef4f6 0%, #f6f8fa 52%, #edf3f5 100%);
}

html[data-xboss-theme="light"]:not(.dark) .rhino-app-aside,
html[data-xboss-theme="light"]:not(.dark) .rhino-app-drawer,
html[data-xboss-theme="light"]:not(.dark) .rhino-app-header {
  background: rgb(255 255 255 / .82) !important;
  box-shadow: 0 1px 0 rgb(15 23 42 / .05), 0 8px 24px rgb(15 35 48 / .035);
  backdrop-filter: blur(16px) saturate(115%);
  -webkit-backdrop-filter: blur(16px) saturate(115%);
}

html[data-xboss-theme="light"]:not(.dark) :is(
  .xb-stat-card,
  .xb-trend-panel,
  .xb-day-trends-card,
  .xb-channel-board,
  .xb-orders-summary,
  .xb-v-toolbar,
  .xb-v-filter-head,
  .xb-v-surface,
  .xb-v-manager-summary,
  .xb-c-card,
  .xb-c-panel,
  .xb-profile-card,
  .xb-profile-panel,
  .xb-proxy-card
) {
  background: hsl(var(--card) / 0.99) !important;
  box-shadow: 0 1px 2px rgb(15 23 42 / 0.05), 0 6px 18px rgb(15 23 42 / 0.025) !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

html[data-xboss-theme="light"]:not(.dark) :is(input, select, textarea, .xb-select-button) {
  border-color: hsl(var(--input)) !important;
  background: hsl(var(--card)) !important;
  color: hsl(var(--foreground)) !important;
}

html[data-xboss-theme="light"]:not(.dark) :is(.xb-select-menu, [role="listbox"], [role="menu"], [role="dialog"], .xb-v-modal) {
  background: hsl(var(--popover) / 0.99) !important;
  box-shadow: var(--rhino-shadow-overlay) !important;
}

html[data-xboss-theme="light"]:not(.dark) :is(button.bg-primary, .xb-v-btn--primary, .xb-c-btn--primary) {
  background: hsl(var(--primary)) !important;
  box-shadow: 0 1px 2px rgb(15 23 42 / 0.12) !important;
}

html[data-xboss-theme="light"]:not(.dark) :is(button.bg-primary, .xb-v-btn--primary, .xb-c-btn--primary):hover:not(:disabled) {
  background: hsl(190 78% 29%) !important;
  box-shadow: 0 0 0 3px hsl(var(--primary) / 0.14) !important;
}

html[data-xboss-theme="light"]:not(.dark) :is(.shadow-sm, .shadow, .shadow-md, .shadow-lg) {
  box-shadow: 0 2px 12px rgb(15 23 42 / 0.09) !important;
}

html[data-xboss-theme="light"]:not(.dark) :is(thead th, .responsive-table.xb-orders-table thead th) {
  background: hsl(var(--muted) / 0.78) !important;
}

html[data-xboss-theme="light"]:not(.dark) tr.xb-order-reviewed--received > td,
html[data-xboss-theme="light"]:not(.dark) tr.xb-order-reviewed--received:hover > td {
  background: hsl(var(--success) / 0.1) !important;
}

html[data-xboss-theme="light"]:not(.dark) tr.xb-order-reviewed--not-received > td,
html[data-xboss-theme="light"]:not(.dark) tr.xb-order-reviewed--not-received:hover > td {
  background: hsl(var(--destructive) / 0.09) !important;
}

html[data-xboss-theme="light"]:not(.dark) .responsive-table tbody tr.xb-order-reviewed--received > td.sticky {
  background: #edf9f4 !important;
}

html[data-xboss-theme="light"]:not(.dark) .responsive-table tbody tr.xb-order-reviewed--not-received > td.sticky {
  background: #fdf0f0 !important;
}

html[data-xboss-theme="light"]:not(.dark) .xb-channel-board th.xb-channel-yesterday-head,
html[data-xboss-theme="light"]:not(.dark) td.xb-channel-money-yesterday {
  color: hsl(var(--muted-foreground)) !important;
}

html[data-xboss-theme="light"]:not(.dark) :is(.xb-xn-card, .xb-xn-panel, .xb-xn-panel.board-panel) {
  border-color: hsl(var(--border));
  background: hsl(var(--card));
  color: hsl(var(--foreground));
  box-shadow: 0 1px 3px rgb(15 23 42 / 0.06);
}

html[data-xboss-theme="light"]:not(.dark) .xb-xn-card:hover {
  border-color: hsl(var(--ring) / 0.45);
  background: hsl(var(--accent) / 0.55);
}

html[data-xboss-theme="light"]:not(.dark) :is(
  .xb-xn-card-label,
  .xb-xn-panel-sub,
  .xb-xn-panel-note,
  .xb-xn-donut-item span,
  .xb-xn-empty,
  .xb-xn-loading,
  .xb-xn-board-title span,
  .xb-xn-board-sort,
  .xb-xn-board-table tbody td.num.yesterday,
  .xb-xn-board-table tbody td.rate
) {
  color: hsl(var(--muted-foreground));
}

html[data-xboss-theme="light"]:not(.dark) :is(
  .xb-xn-card-value,
  .xb-xn-panel-title,
  .xb-xn-panel.board-panel .xb-xn-panel-title,
  .xb-xn-donut-item,
  .xb-xn-donut-item b,
  .xb-xn-table td,
  .xb-xn-board-title strong,
  .xb-xn-board-table tbody td,
  .xb-xn-board-table tbody td.name
) {
  color: hsl(var(--foreground));
}

html[data-xboss-theme="light"]:not(.dark) .xb-xn-panel-note {
  border-color: hsl(var(--border));
  background: hsl(var(--muted) / 0.68);
}

html[data-xboss-theme="light"]:not(.dark) :is(.xb-xn-table th, .xb-xn-board-table thead th) {
  border-color: hsl(var(--border));
  background: hsl(var(--muted) / 0.78);
  color: hsl(var(--muted-foreground));
}

html[data-xboss-theme="light"]:not(.dark) :is(.xb-xn-table td, .xb-xn-board-table tbody td) {
  border-color: hsl(var(--border) / 0.72);
}

html[data-xboss-theme="light"]:not(.dark) .xb-xn-rate-bar,
html[data-xboss-theme="light"]:not(.dark) .xb-xn-board-table tbody td.rank span {
  background: hsl(var(--muted));
}

html[data-xboss-theme="light"]:not(.dark) .xb-xn-board-sort button {
  border-color: hsl(var(--border));
  background: hsl(var(--card));
  color: hsl(var(--foreground));
}

html[data-xboss-theme="light"]:not(.dark) .xb-xn-board-sort button.active {
  border-color: hsl(var(--primary));
  background: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
}

html[data-xboss-theme="light"]:not(.dark) .xb-xn-board-title i::after {
  background: hsl(var(--primary-foreground));
  box-shadow: 7px 0 0 hsl(var(--primary-foreground));
}

html[data-xboss-theme="light"]:not(.dark) .xb-xn-dash-header p {
  color: hsl(var(--foreground)) !important;
}

html[data-xboss-theme="light"]:not(.dark) .xb-xn-trend-svg :is(line[stroke="#1D2635"], line[stroke="#1d2635"]) {
  stroke: hsl(var(--border));
}

html[data-xboss-theme="light"]:not(.dark) .xb-xn-trend-svg :is(text[fill="#5F6B7E"], text[fill="#5f6b7e"]) {
  fill: hsl(var(--muted-foreground));
}

html[data-xboss-theme="light"]:not(.dark) .xb-xn-donut-svg text[fill="#EDF2F9"] {
  fill: hsl(var(--foreground));
}

/* Keep the mode change coherent across the shell and the v9 overview. */
html,
body,
#root,
#root > *,
#root aside,
#root header,
#root main,
.xb-ops-shell,
.xb-ops-shell .xb-metric,
.xb-ops-shell .xb-panel {
  transition: background-color 220ms ease, color 220ms ease, border-color 220ms ease;
}

@media (prefers-reduced-motion: reduce) {
  html,
  body,
  #root,
  #root > *,
  #root aside,
  #root header,
  #root main,
  .xb-ops-shell,
  .xb-ops-shell .xb-metric,
  .xb-ops-shell .xb-panel {
    transition-duration: .01ms;
  }
}

/* Last-resort light guard. Several legacy theme layers are loaded for older
   routes and still contain dark literal values. Keep those layers from
   bleeding into the authenticated shell when the current mode is light. */
html[data-xboss-theme="light"]:not(.dark),
html[data-xboss-theme="light"]:not(.dark) body,
html[data-xboss-theme="light"]:not(.dark) .rhino-app,
html[data-xboss-theme="light"]:not(.dark) .rhino-app-main,
html[data-xboss-theme="light"]:not(.dark) .page-enter {
  background-color: var(--rhino-canvas) !important;
  color: var(--rhino-text) !important;
}

html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview {
  background-color: var(--rhino-canvas) !important;
  color: var(--xb-text) !important;
  filter: none !important;
}

html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-panel,
html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-metric,
html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-orders-wrap,
html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-channel-table-wrap {
  background-color: var(--rhino-surface) !important;
  color: var(--xb-text) !important;
  filter: none !important;
}

html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-panel-head,
html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-orders-table thead,
html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-channel-table thead {
  background-color: var(--rhino-surface-raised) !important;
}

html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-orders-table tbody tr,
html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-channel-table tbody tr {
  background-color: var(--rhino-surface) !important;
}

html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-segment,
html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-refresh-button,
html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-chart-tooltip {
  background-color: var(--rhino-surface-raised) !important;
  color: var(--rhino-text) !important;
}

html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-mini-track,
html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-channel-progress,
html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-ring-track {
  background-color: var(--rhino-surface-hover) !important;
}

html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview :is(
  .xb-panel-channels,
  .xb-panel-orders,
  .xb-channel-table,
  .xb-orders-table,
  .xb-channel-table tbody,
  .xb-orders-table tbody
) {
  background-color: var(--rhino-surface) !important;
}

html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview :is(.xb-channel-table, .xb-orders-table) td {
  background-color: transparent !important;
}

html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview :is(.xb-channel-table, .xb-orders-table) th,
html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-orders-table tr,
html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-segment,
html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-panel:hover {
  border-color: var(--rhino-line) !important;
}

html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-channel-table tr:nth-child(n + 4) .xb-rank {
  border: 1px solid #c7d1d7 !important;
  background: #dfe5e8 !important;
  color: #52616c !important;
}

html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview :is(.xb-rate-muted, .xb-status-refunded) {
  border-color: #c7d1d7 !important;
  background: #e2e7ea !important;
  color: #5b6972 !important;
}

html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-orders-table td:nth-child(1) {
  border-color: var(--rhino-line) !important;
}

html[data-xboss-theme="light"]:not(.dark) #xbOpsOverview .xb-ops-error button {
  border-color: var(--rhino-line-strong) !important;
  background: var(--rhino-surface-raised) !important;
  color: var(--rhino-text) !important;
}

/* Health alerts are created by a legacy script with inline dark colors. */
html[data-xboss-theme="light"]:not(.dark) #xboss-health-toasts > div {
  background: rgb(238 241 243 / 0.98) !important;
  border-color: #c8d2d8 !important;
  color: #26343d !important;
  box-shadow: 0 8px 24px rgb(55 67 75 / 0.18) !important;
  backdrop-filter: none !important;
}

html[data-xboss-theme="light"]:not(.dark) #xboss-health-toasts > div > div {
  color: #687780 !important;
}

/* Dark frosted surfaces: preserve contrast while adding depth to the night mode. */
html.dark[data-xboss-theme="dark"] body {
  background: linear-gradient(135deg, #0a1119 0%, #101923 52%, #091017 100%) !important;
}

html.dark[data-xboss-theme="dark"] .rhino-app-aside,
html.dark[data-xboss-theme="dark"] .rhino-app-drawer,
html.dark[data-xboss-theme="dark"] .rhino-app-header {
  background: rgb(12 18 27 / .78) !important;
  box-shadow: 0 1px 0 rgb(255 255 255 / .04), 0 8px 24px rgb(0 0 0 / .18);
  backdrop-filter: blur(16px) saturate(118%);
  -webkit-backdrop-filter: blur(16px) saturate(118%);
}