/* Signal — restrained, ink-forward DaisyUI 5 themes for the microspec farm.
   "Ink is the brand": primary = base-content; colour is reserved for meaning
   (success / error / warning + secondary = the бронювання signal). Loaded via CDN, no build. */

/* The dock's total footprint above the safe area — its height plus the gap it floats over.
   ONE number, because four separate things must clear the dock: the scroll padding under <main>, the
   toast, and the tool apps that pin themselves between the header and the dock. Each used to carry its
   own guess (6rem / 5.5rem / 4rem / 4rem) — four constants for one measurement, silently drifting apart
   the moment the dock changed shape. Consumers add env(safe-area-inset-bottom) themselves. */
:root { --dock-h: 4.25rem; }

[data-theme="signal"] {
  color-scheme: dark;
  --color-base-100: #0A0A0B; --color-base-200: #141416; --color-base-300: #222225;
  --color-base-content: #ECECEE;
  --color-primary: #ECECEE;   --color-primary-content: #0A0A0B;   /* ink = brand */
  --color-secondary: #9F8CF6; --color-secondary-content: #0A0A0B; /* бронювання */
  --color-accent: #9F8CF6;    --color-accent-content: #0A0A0B;
  --color-neutral: #1B1B1E;   --color-neutral-content: #ECECEE;
  --color-success: #40C173;   --color-success-content: #06120B;
  --color-error: #F0655E;     --color-error-content: #180605;
  --color-warning: #D9973A;   --color-warning-content: #160D02;
  --color-info: #9AA0A6;      --color-info-content: #0A0A0B;
  --radius-box: 1rem; --radius-field: 0.7rem; --radius-selector: 0.5rem;
  --border: 1px; --depth: 0;
}

[data-theme="signal-light"] {
  color-scheme: light;
  --color-base-100: #FFFFFF; --color-base-200: #FAFAF9; --color-base-300: #E7E7E3;
  --color-base-content: #18181B;
  --color-primary: #18181B;   --color-primary-content: #FFFFFF;
  --color-secondary: #4B45B8; --color-secondary-content: #FFFFFF; /* бронювання */
  --color-accent: #4B45B8;    --color-accent-content: #FFFFFF;
  --color-neutral: #18181B;   --color-neutral-content: #FAFAF9;
  --color-success: #157F45;   --color-success-content: #FFFFFF;
  --color-error: #BE2F2A;     --color-error-content: #FFFFFF;
  --color-warning: #8A5A00;   --color-warning-content: #FFFFFF;
  --color-info: #6E6E76;      --color-info-content: #FFFFFF;
  --radius-box: 1rem; --radius-field: 0.7rem; --radius-selector: 0.5rem;
  --border: 1px; --depth: 0;
}

/* Signal conventions that ride on top of DaisyUI, farm-wide.
   Type system = the Geist superfamily (loaded per app in the head): Geist for body/UI, Geist Mono for every
   mono role below — one designed superfamily instead of Inter + an unrelated system-mono stack. Both carry
   Cyrillic, so the uk locale keeps its own type. The stack keeps ui-monospace/-sans fallbacks for offline. */
:root { --font-mono: "Geist Mono", ui-monospace, "SF Mono", "Cascadia Code", "Roboto Mono", Consolas, monospace; }
body { letter-spacing: -0.006em; }

/* The header wordmark — the app's name set as the top-of-screen echo of the dock labels: mono, uppercase,
   heavy, a touch of tracking. This is the header's identity; the title text-treatment lives here (like the
   dock labels below) so a header stays a wordmark no matter which shell renders it. */
[data-title] {
  font-family: var(--font-mono);
  text-transform: uppercase;
  letter-spacing: .05em;
  font-weight: 700;
  font-size: 1.02rem;
}

/* Stage B — instrument details. Global CSS over DaisyUI/render classes; no structural change.
   Badges become mono, uppercase, hairline tags — the "instrument" signal. Colour still means:
   solid ink = the strongest chip (bron), green outline = value (salary/points), hairline = meta. */
.badge {
  font-family: var(--font-mono);
  text-transform: uppercase;
  letter-spacing: .02em;
  font-weight: 500;
  font-size: .66rem;
  border-radius: .375rem;
  height: auto;
  padding: .16rem .42rem;
  gap: .28rem;
}
.badge-ghost {
  background: transparent;
  border: 1px solid var(--color-base-300);
  color: color-mix(in oklch, var(--color-base-content) 60%, transparent);
}

/* mono uppercase micro-labels: the status line under search + the bottom-nav labels */
#status {
  font-family: var(--font-mono);
  text-transform: uppercase;
  letter-spacing: .045em;
  font-size: .68rem;
}
nav[data-dock] button > span {
  font-family: var(--font-mono);
  text-transform: uppercase;
  letter-spacing: .03em;
  font-size: .58rem;
}

/* Liquid glass — the bottom sheets and modals only (cards stay solid ink, colour stays meaning). The
   material is a frosted panel: the page blurred and lifted behind it, plus a hairline top sheen so the blur
   reads as a pane of glass rather than a flat tint. Opacity is kept high (82%) so text contrast over the
   dimmed backdrop stays deterministic — the blur does the glass, not thin translucency the axe gate can't
   predict. A gentle overshoot on the open gives the sheet the "liquid" settle. */
.modal-box {
  background: color-mix(in oklch, var(--color-base-100) 82%, transparent);
  backdrop-filter: blur(22px) saturate(150%);
  -webkit-backdrop-filter: blur(22px) saturate(150%);
  box-shadow: 0 -10px 44px -12px rgba(0, 0, 0, .5), inset 0 1px 0 0 rgba(255, 255, 255, .09);
  transition-timing-function: cubic-bezier(.22, 1, .3, 1.12);
}
@media (prefers-reduced-motion: reduce) { .modal-box { transition-timing-function: ease-out; } }

/* skeleton → content reveal: a fast, smooth fade-in when real content replaces a skeleton (/_rt/skeleton.js
   Reveal). Frozen to its final state during the design-check axe pass, so contrast is measured on real text. */
@keyframes msReveal { from { opacity: 0 } to { opacity: 1 } }
.ms-reveal { animation: msReveal .28s ease-out both; }
@media (prefers-reduced-motion: reduce) { .ms-reveal { animation: none; } }

/* Native-app touch feel, farm-wide. The Web Interface Guidelines floor no axe/overflow gate can see:
   - kill the grey iOS/Android tap-flash (we own every :active state ourselves),
   - `manipulation` drops the legacy double-tap-zoom delay on anything tappable,
   - `overscroll-behavior: contain` stops a scrolled sheet/strip from chaining into the page body
     (rubber-band that scrolls the whole app behind an open modal). */
body { -webkit-tap-highlight-color: transparent; }
button, a, summary, [role="button"], label, input, select, textarea { touch-action: manipulation; }
.overflow-y-auto, .overflow-x-auto, .overflow-auto, .modal-box, dialog { overscroll-behavior: contain; }

/* Respect prefers-reduced-motion for the decorative Tailwind loops too (ping/pulse/spin/bounce), not just
   our own reveal — a live-dot pulse or a spinning glyph is motion a sensitive user asked us to still. */
@media (prefers-reduced-motion: reduce) {
  .animate-ping, .animate-pulse, .animate-spin, .animate-bounce { animation: none; }
}
