/* ============================================================
   BLIT.ZONE — txAdmin frontend rework
   Flat / sharp / minimal. Verified against v8.0.x bundle.
   ============================================================ */

/* ---------- Palette ---------- */
.dark {
  --background: 225 30% 4%;
  --foreground: 220 14% 93%;
  --card: 224 22% 7%;
  --card-foreground: 220 14% 93%;
  --popover: 224 24% 6%;
  --popover-foreground: 220 14% 93%;
  --primary: 218 100% 65%;
  --primary-foreground: 224 45% 6%;
  --accent: 218 100% 65%;
  --accent-foreground: 224 45% 6%;
  --secondary: 222 16% 15%;
  --secondary-foreground: 220 14% 88%;
  --muted: 223 16% 10%;
  --muted-foreground: 220 9% 62%;
  --border: 221 16% 14%;
  --input: 221 16% 18%;
  --ring: 218 100% 65%;
  --destructive: 0 95% 62%;
  --destructive-foreground: 0 0% 100%;
  --destructive-hint: 0 70% 11%;
  --destructive-inline: 0 95% 66%;
  --warning: 42 100% 58%;
  --warning-foreground: 45 90% 7%;
  --warning-hint: 38 80% 10%;
  --warning-inline: 42 100% 60%;
  --success: 140 85% 55%;
  --success-foreground: 140 80% 6%;
  --success-hint: 142 70% 9%;
  --success-inline: 140 85% 58%;
  --info: 196 90% 60%;
  --info-foreground: 197 65% 4%;
  --info-hint: 200 60% 11%;
  --info-inline: 196 90% 62%;
  --radius: .125rem;              /* sharp edges everywhere */
}

/* ---------- Base: black canvas, faint grid ---------- */
.dark body {
  background-color: hsl(225 30% 4%);
  background-image:
    radial-gradient(900px 380px at 12% -8%, hsl(218 100% 65% / 0.07), transparent 60%),
    linear-gradient(hsl(220 40% 65% / 0.028) 1px, transparent 1px),
    linear-gradient(90deg, hsl(220 40% 65% / 0.028) 1px, transparent 1px);
  background-size: auto, 44px 44px, 44px 44px;
  background-attachment: fixed;
}
.dark .bg-background.pt-\[7\.5vh\] { background-color: transparent; }

/* ---------- Kill soft shadows: flat design ---------- */
.dark .shadow-sm, .dark .shadow-md { box-shadow: none; }

/* ---------- Navbar: black bar, hairline, speed line, blue logo ---------- */
.dark .sticky.top-0.z-10 {
  background-color: hsl(226 32% 3.5% / 0.92);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid hsl(221 16% 13%);
  position: sticky;
}
.dark .sticky.top-0.z-10::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 2px;
  background: linear-gradient(90deg, hsl(218 100% 65%), hsl(218 100% 65% / .4) 25%, transparent 55%);
  pointer-events: none;
}
/* txAdmin pink logo → blit blue */
.dark .sticky.top-0.z-10 img { filter: hue-rotate(237deg) saturate(0.95); }

/* ---------- Sidebar: mono rail ---------- */
.dark .w-sidebar a {
  text-transform: uppercase;
  font-family: var(--font-mono), ui-monospace, Menlo, Consolas, monospace;
  font-size: .72rem;
  letter-spacing: .09em;
  border-radius: 2px;
  transition: color 120ms ease, background-color 120ms ease, box-shadow 120ms ease;
}
.dark .w-sidebar a:hover {
  color: hsl(218 100% 80%);
  background-color: hsl(219 60% 15% / 0.5);
}
.dark .w-sidebar a[aria-current="page"],
.dark .w-sidebar a[data-active="true"],
.dark .w-sidebar a.active {
  color: hsl(218 100% 76%);
  background-color: hsl(219 65% 14% / 0.75);
  box-shadow: inset 3px 0 0 hsl(218 100% 65%);
}

/* ---------- Cards: flat panels, hairline, hover spine ---------- */
.dark .bg-card { background-image: none; }
.dark .md\:rounded-xl.bg-card,
.dark .md\:rounded-xl.border.bg-card {
  border-radius: 4px;
  border-color: hsl(221 16% 13%);
  transition: border-color 140ms ease, box-shadow 140ms ease;
}
.dark .md\:rounded-xl.bg-card:hover {
  border-color: hsl(218 70% 38% / 0.6);
  box-shadow: inset 3px 0 0 hsl(218 100% 65% / 0.8);
}

/* ---------- Page titles: apex slash ---------- */
.dark main h1 {
  position: relative;
  padding-left: 1.1rem;
  letter-spacing: .01em;
}
.dark main h1::before {
  content: "";
  position: absolute;
  left: 0; top: .18em; bottom: .18em;
  width: .4rem;
  background: hsl(218 100% 65%);
  transform: skewX(-14deg);
}

/* ---------- Buttons: solid flat blue ---------- */
.dark .bg-primary {
  background-color: hsl(218 100% 63%);
  background-image: none;
}
.dark .bg-primary:hover { background-color: hsl(218 100% 70%); }

/* ---------- Inputs ---------- */
.dark input, .dark select, .dark textarea {
  background-color: hsl(226 30% 4.5% / .75);
  border-color: hsl(221 16% 15%);
  border-radius: 2px;
}
.dark input:focus, .dark select:focus, .dark textarea:focus {
  border-color: hsl(218 100% 60% / .75);
  box-shadow: 0 0 0 3px hsl(218 100% 65% / .15);
}

/* ---------- Tables: timing tower ---------- */
.dark table { font-variant-numeric: tabular-nums; }
.dark thead th {
  font-family: var(--font-mono), ui-monospace, Menlo, Consolas, monospace;
  font-size: .66rem;
  text-transform: uppercase;
  letter-spacing: .09em;
  color: hsl(220 9% 55%);
}
.dark tbody tr { transition: background-color 100ms ease; }
.dark tbody tr:hover td { background-color: hsl(219 60% 15% / .35); }

/* ---------- Console: flat black terminal ---------- */
.dark pre {
  background-color: hsl(227 34% 3%);
  border: 1px solid hsl(221 18% 11%);
  border-radius: 2px;
}

/* ---------- Progress ---------- */
.dark [role="progressbar"] > div { background-color: hsl(218 100% 62%); }

/* ---------- Scrollbars / selection / focus ---------- */
.dark * { scrollbar-width: thin; scrollbar-color: hsl(221 16% 19%) transparent; }
.dark *::-webkit-scrollbar { width: 10px; height: 10px; }
.dark *::-webkit-scrollbar-track { background: transparent; }
.dark *::-webkit-scrollbar-thumb {
  background: hsl(221 16% 19%);
  border-radius: 5px;
  border: 2px solid hsl(225 30% 4%);
}
.dark *::-webkit-scrollbar-thumb:hover { background: hsl(218 70% 40%); }
.dark ::selection { background: hsl(218 100% 65% / .35); color: hsl(220 14% 97%); }
:focus-visible { outline: 2px solid hsl(218 100% 65% / .7); outline-offset: 2px; }

/* ---------- Links ---------- */
.dark a:not([class]) { color: hsl(218 100% 71%); }
.dark a:not([class]):hover { color: hsl(218 100% 82%); }

/* ---------- BLIT.ZONE watermark ---------- */
.dark body::after {
  content: "BLIT.ZONE";
  position: fixed;
  bottom: 10px;
  right: 14px;
  font-family: var(--font-mono), ui-monospace, Menlo, Consolas, monospace;
  font-size: 10px;
  letter-spacing: .38em;
  color: hsl(218 100% 65% / .3);
  pointer-events: none;
  z-index: 50;
}
