/* pestix-dark.css v1.0 — dark theme for pestIX (nginx-injected overlay, app untouched).
 * Trigger: <html class="dark"> (set pre-paint by the theme-boot snippet in sub_filter).
 * Strategy:
 *   1) The app already compiles Tailwind `dark:` variants bound to `.dark *` — adding the
 *      class activates native dark styles for inputs/buttons (30 rules).
 *   2) Remap semantic shadcn tokens + neutral ramps (stone/gray). All utilities reference
 *      var(--color-*), so prefixed variants (hover:, md:…) follow automatically.
 *   3) Override .bg-white (kept white in tokens because text-white must stay white).
 *   4) --px-* variables feed the patched overlays (geo-enhance, calc-menu, prices-panel).
 *   5) Targeted overrides for mobile-nav drawer (.mnv-*) which uses hardcoded colors.
 * Colored families (teal/amber/rose/…) intentionally keep light pastel chips — readable
 * on dark surfaces (GitHub-label style); solid accent buttons are untouched.
 * Rollback: remove <link> from nginx sub_filter. */

html.dark {
  color-scheme: dark;

  /* shadcn semantic tokens */
  --background: #0c0a09;
  --foreground: #e7e5e4;
  --card: #1c1917;
  --card-foreground: #e7e5e4;
  --popover: #221f1d;
  --popover-foreground: #e7e5e4;
  --primary: #0d9488;
  --primary-hover: #0f766e;
  --primary-foreground: #ffffff;
  --secondary: #292524;
  --secondary-foreground: #e7e5e4;
  --muted: #292524;
  --muted-foreground: #a8a29e;
  --accent: #292524;
  --accent-foreground: #f5f5f4;
  --border: #33302c;
  --input: #3a3632;
  --ring: #0d9488;
  --sidebar: #141210;
  --sidebar-foreground: #e7e5e4;

  /* neutral ramps (utilities reference these vars, incl. hover:/md: variants) */
  --color-stone-50: #161311;
  --color-stone-100: #221f1d;
  --color-stone-200: #33302c;
  --color-stone-300: #44403c;
  --color-stone-400: #8f8a85;
  --color-stone-500: #a8a29e;
  --color-stone-600: #c8c2bd;
  --color-stone-700: #dedad6;
  --color-stone-800: #e7e5e4;
  --color-stone-900: #f5f5f4;
  --color-gray-500: #a3a3a3;
  --color-gray-700: #d4d4d4;
  --color-gray-900: #f5f5f5;

  /* vars for patched overlays (geo-enhance / calc-menu / prices-panel) */
  --px-surface: #1c1917;
  --px-surface-50: #141210;
  --px-surface-100: #292524;
  --px-tint: #123f3a;
  --px-line: #33302c;
  --px-line-2: #44403c;
  --px-ink: #e7e5e4;
  --px-ink-2: #d6d3d1;
  --px-ink-3: #c8c2bd;
  --px-ink-4: #b8b2ad;
  --px-mute: #a8a29e;
  --px-mute-2: #8f8a85;
  --px-accent: #2dd4bf;
}

/* surfaces that hardcode white via utility class */
html.dark .bg-white { background-color: #1c1917; }
html.dark body { background-color: #0c0a09; color: #e7e5e4; }
html.dark img[alt=""], html.dark .bg-black\/5 { background-color: rgba(255,255,255,.04); }

/* ---------- mobile-nav drawer (hardcoded palette) ---------- */
html.dark .mnv-drawer { background: #1c1917; color: #e7e5e4; }
html.dark .mnv-head { border-color: #33302c; }
html.dark .mnv-head-title, html.dark .mnv-name { color: #f5f5f4; }
html.dark .mnv-label { color: #a8a29e; }
html.dark .mnv-item { color: #d6d3d1; }
html.dark .mnv-item:hover { background: #292524; }
html.dark .mnv-item.mnv-active { background: #14201d; color: #5eead4; }
html.dark .mnv-foot { border-color: #33302c; }
html.dark .mnv-user { border-color: #33302c; }
html.dark .mnv-logout { color: #f87171; }
html.dark .mnv-arrow { color: #8f8a85; }
html.dark .mnv-ava { background: #292524; color: #5eead4; }
html.dark .mnv-close, html.dark .mnv-burger { color: #d6d3d1; }

/* ---------- generic softening ---------- */
html.dark input, html.dark select, html.dark textarea { color-scheme: dark; }
html.dark ::placeholder { color: #8f8a85; opacity: 1; }