/* BOS look, tokens copied from agiens/crm_v2 src/index.css (dark theme only). */
@font-face { font-family: "IBM Plex Sans"; font-weight: 400 700; font-display: swap; src: url("/public/ibm-plex-sans-cyrillic.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "IBM Plex Sans"; font-weight: 400 700; font-display: swap; src: url("/public/ibm-plex-sans-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  color-scheme: dark;
  --background: 224 33% 8%;
  --foreground: 210 40% 96%;
  --card: 224 28% 11%;
  --primary: 215 75% 62%;
  --primary-foreground: 220 30% 8%;
  --muted: 224 25% 16%;
  --muted-foreground: 214 20% 70%;
  --accent: 215 40% 18%;
  --accent-foreground: 215 75% 80%;
  --destructive: 0 72% 51%;
  --destructive-foreground: 210 40% 96%;
  --border: 223 20% 24%;
  --input: 223 22% 18%;
  --radius: 0.5rem;
  --shadow-card: 0 18px 40px -20px hsl(224 60% 2% / 0.6);
}

* { box-sizing: border-box; }
body {
  margin: 0; min-height: 100vh;
  font: 15px/1.5 "IBM Plex Sans", system-ui, -apple-system, sans-serif;
  background: hsl(var(--background)); color: hsl(var(--foreground));
  -webkit-font-smoothing: antialiased;
}
a { color: hsl(var(--primary)); }

.topbar { display: flex; align-items: center; gap: 10px; height: 56px; padding: 0 20px; border-bottom: 1px solid hsl(var(--border)); background: hsl(var(--card)); }
.topbar img { width: 28px; height: 28px; display: block; border-radius: 7px; box-shadow: 0 0 0 1px hsl(var(--border)); }
.topbar .brand { font-weight: 700; letter-spacing: -0.01em; }

.card { background: hsl(var(--card)); border: 1px solid hsl(var(--border)); border-radius: calc(var(--radius) + 4px); box-shadow: var(--shadow-card); }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 40px; padding: 0 16px; border-radius: var(--radius);
  font: 500 14px/1 inherit; font-family: inherit; cursor: pointer; text-decoration: none; white-space: nowrap;
  border: 1px solid hsl(var(--border)); background: hsl(var(--card)); color: hsl(var(--foreground));
  transition: background .15s, border-color .15s, opacity .15s;
}
.btn:hover { background: hsl(var(--muted)); }
.btn:focus-visible { outline: 2px solid hsl(var(--primary)); outline-offset: 2px; }
.btn:disabled { opacity: .45; cursor: default; }
.btn-primary { background: hsl(var(--primary)); border-color: hsl(var(--primary)); color: hsl(var(--primary-foreground)); }
.btn-primary:hover { background: hsl(var(--primary) / .9); }
.btn-danger { background: hsl(var(--destructive)); border-color: hsl(var(--destructive)); color: hsl(var(--destructive-foreground)); }
.btn-danger:hover { background: hsl(var(--destructive) / .9); }
.btn-lg { height: 48px; padding: 0 22px; font-size: 15px; }

.input { height: 40px; padding: 0 12px; border-radius: var(--radius); border: 1px solid hsl(var(--border)); background: hsl(var(--input) / .5); color: inherit; font: inherit; font-size: 14px; min-width: 0; }
.muted { color: hsl(var(--muted-foreground)); }