/* Shared operator theme. Semantic tokens serve templates, islands and portals. */
:root,
html[data-theme="dark"] {
  color-scheme: dark;
  --background: 240 5% 6%;
  --foreground: 0 0% 96%;
  --card: 240 4% 11%;
  --card-foreground: 0 0% 96%;
  --popover: 240 4% 14%;
  --popover-foreground: 0 0% 96%;
  --primary: 158 64% 52%;
  --primary-foreground: 164 86% 8%;
  --secondary: 240 4% 16%;
  --secondary-foreground: 0 0% 96%;
  --muted: 240 4% 14%;
  --muted-foreground: 240 5% 72%;
  --accent: 164 35% 18%;
  --accent-foreground: 152 76% 80%;
  --border: 240 4% 25%;
  --input: 240 5% 55%;
  --ring: 158 64% 52%;
  --destructive: 0 90% 72%;
  --destructive-foreground: 0 0% 100%;
  --success: 158 64% 52%;
  --success-foreground: 158 64% 68%;
  --warning: 45 93% 60%;
  --warning-foreground: 45 93% 70%;
  --info: 158 64% 52%;
  --info-foreground: 158 64% 68%;
  --radius-md: 0.375rem;
  --radius: 0.375rem;
  --row-odd: 240 4% 14%;
  --row-even: 240 4% 11%;
  --row-hover: 240 4% 19%;
  --overlay: 240 5% 4%;
  --ce-neutral-50: 240 4% 98%;
  --ce-neutral-100: 240 4% 96%;
  --ce-neutral-200: 240 4% 90%;
  --ce-neutral-300: 240 4% 83%;
  --ce-neutral-400: 240 4% 72%;
  --ce-neutral-500: 240 4% 65%;
  --ce-neutral-600: 240 4% 60%;
  --ce-neutral-700: 240 4% 40%;
  --ce-neutral-800: 240 4% 24%;
  --ce-neutral-900: 240 4% 12%;
  --ce-neutral-950: 240 4% 6%;
  --ce-green-50: 160 65% 92%;
  --ce-green-100: 160 65% 87%;
  --ce-green-200: 160 65% 80%;
  --ce-green-300: 160 65% 72%;
  --ce-green-400: 160 65% 62%;
  --ce-green-500: 160 65% 52%;
  --ce-green-600: 160 65% 45%;
  --ce-green-700: 160 65% 35%;
  --ce-green-800: 160 65% 25%;
  --ce-green-900: 160 65% 18%;
  --ce-green-950: 160 65% 10%;
}
html[data-theme="light"] {
  color-scheme: light;
  --background: 220 20% 97%;
  --foreground: 220 20% 12%;
  --card: 0 0% 100%;
  --card-foreground: 220 20% 12%;
  --popover: 0 0% 100%;
  --popover-foreground: 220 20% 12%;
  --primary: 162 93% 24%;
  --primary-foreground: 0 0% 100%;
  --secondary: 220 16% 92%;
  --secondary-foreground: 220 20% 16%;
  --muted: 220 16% 94%;
  --muted-foreground: 220 10% 38%;
  --accent: 152 50% 91%;
  --accent-foreground: 162 93% 20%;
  --border: 220 14% 79%;
  --input: 220 10% 50%;
  --ring: 162 93% 24%;
  --destructive: 0 74% 38%;
  --destructive-foreground: 0 0% 100%;
  --success: 162 93% 24%;
  --success-foreground: 162 93% 24%;
  --warning: 35 90% 27%;
  --warning-foreground: 35 90% 27%;
  --info: 162 93% 24%;
  --info-foreground: 162 93% 24%;
  --row-odd: 220 16% 96%;
  --row-even: 0 0% 100%;
  --row-hover: 152 35% 91%;
  --ce-neutral-50: 220 10% 8%;
  --ce-neutral-100: 220 10% 12%;
  --ce-neutral-200: 220 10% 18%;
  --ce-neutral-300: 220 10% 27%;
  --ce-neutral-400: 220 10% 35%;
  --ce-neutral-500: 220 10% 40%;
  --ce-neutral-600: 220 10% 44%;
  --ce-neutral-700: 220 10% 55%;
  --ce-neutral-800: 220 10% 82%;
  --ce-neutral-900: 220 10% 100%;
  --ce-neutral-950: 220 10% 97%;
  --ce-green-50: 162 72% 13%;
  --ce-green-100: 162 72% 17%;
  --ce-green-200: 162 72% 20%;
  --ce-green-300: 162 72% 24%;
  --ce-green-400: 162 72% 27%;
  --ce-green-500: 162 72% 30%;
  --ce-green-600: 162 72% 27%;
  --ce-green-700: 162 72% 24%;
  --ce-green-800: 162 72% 80%;
  --ce-green-900: 162 72% 88%;
  --ce-green-950: 162 72% 94%;
}
html body {
  background: hsl(var(--background));
  color: hsl(var(--foreground));
}
html .ce-header,
html .ce-sidebar {
  background: hsl(var(--card));
  border-color: hsl(var(--border));
}
html .ce-sidebar a {
  color: hsl(var(--foreground));
}
html .ce-sidebar a:hover {
  background: hsl(var(--secondary));
}
html .ce-sidebar a[aria-current="page"] {
  background: hsl(var(--accent));
  color: hsl(var(--accent-foreground));
}
html .ce-sidebar h2,
html .ce-sidebar p {
  color: hsl(var(--muted-foreground));
}
html .ce-record-dialog {
  background: hsl(var(--card));
  color: hsl(var(--foreground));
  border-color: hsl(var(--border));
}
.ce-record-ids {
  padding: 12px 16px;
  border-radius: var(--radius-md);
  background: hsl(var(--muted));
}
.ce-record-ids summary {
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
}
.ce-record-ids[open] summary { margin-bottom: 12px; }
.ce-record-explanation {
  margin-top: 12px;
  overflow-wrap: anywhere;
}
.ce-record-explanation p { margin: 4px 0; }
.ce-record-ids > div > div { flex-direction: column; gap: 4px; }
.ce-record-ids > div > div > span:last-child {
  text-align: left;
  font-family: 'JetBrains Mono', monospace;
  overflow-wrap: anywhere;
  user-select: text;
}
.ce-record-actions {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px 24px;
  border-top: 1px solid hsl(var(--border));
  padding-top: 24px;
}
.ce-record-links { display: flex; flex-wrap: wrap; gap: 12px; }
.ce-record-action {
  display: inline-block;
  padding: 8px 16px;
  border: 1px solid transparent;
  border-radius: var(--radius-md);
  font-size: 14px;
  font-weight: 600;
}
.ce-record-action-secondary {
  border-color: hsl(var(--input));
  color: hsl(var(--foreground));
}
.ce-record-action-secondary:hover { background: hsl(var(--secondary)); }
.ce-record-action-primary {
  margin-left: auto;
  background: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
}
.ce-record-action-primary:disabled { opacity: .5; }
html .ce-skip {
  background: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
}
html input,
html select,
html textarea {
  color-scheme: inherit;
  accent-color: hsl(var(--primary));
}
html input:not([type="checkbox"]):not([type="radio"]),
html select,
html textarea {
  border-color: hsl(var(--input));
}
html :focus-visible {
  outline: 2px solid hsl(var(--ring));
  outline-offset: 2px;
}
html button:disabled {
  cursor: not-allowed;
}
html [data-sonner-toast] {
  --normal-bg: hsl(var(--popover));
  --normal-text: hsl(var(--foreground));
  --normal-border: hsl(var(--border));
}
html[data-theme="light"] [class~="text-white"] {
  color: hsl(var(--foreground));
}
html [class~="bg-blue-400"],
html [class~="bg-blue-500"],
html [class~="bg-blue-600"],
html [class~="bg-blue-700"],
html [class~="bg-primary"],
html [class~="bg-emerald-400"],
html [class~="bg-emerald-500"],
html [class~="bg-emerald-600"] {
  color: hsl(var(--primary-foreground));
}
html[data-theme="light"] [class*="text-amber-"],
html[data-theme="light"] [class*="text-yellow-"] {
  color: hsl(35 90% 27%);
}
html[data-theme="light"] [class*="text-red-"],
html[data-theme="light"] [class*="text-rose-"] {
  color: hsl(0 74% 38%);
}
html[data-theme="light"] [class*="text-sky-"],
html[data-theme="light"] [class*="text-blue-"],
html[data-theme="light"] [class*="text-teal-"] {
  color: hsl(162 93% 24%);
}
html[data-theme="light"] [class*="text-shadow"],
html[data-theme="light"] [class*="drop-shadow"] {
  text-shadow: none;
  filter: none;
}

/* Solid status badges use contrasting text; tinted badges keep status text. */
html [data-slot="badge"][class~="bg-success"],
html [data-slot="badge"][class~="bg-info"],
html [data-slot="badge"][class~="bg-warning"],
html [data-slot="badge"][class~="bg-destructive"] {
  color: hsl(var(--primary-foreground));
}