/* ══════════════════════════════════════════
   DRAINQ CLOUD — Design System v2.0 (SA-Design, Welle 0)
   Fonts: Inter + JetBrains Mono (self-hosted, OFL — kein CDN, DSGVO)
   Farben: SA Amber / Dark-First — Parity-Vertrag siehe docs/SA-Design-Rollout_Spec.md §3
══════════════════════════════════════════ */

/* ── Self-hosted fonts (woff2, wwwroot/fonts/) ── */
@font-face {
  font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('/fonts/inter-400.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;
}
@font-face {
  font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('/fonts/inter-ext-400.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap;
  src: url('/fonts/inter-500.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;
}
@font-face {
  font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap;
  src: url('/fonts/inter-ext-500.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap;
  src: url('/fonts/inter-600.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;
}
@font-face {
  font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap;
  src: url('/fonts/inter-ext-600.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('/fonts/inter-700.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;
}
@font-face {
  font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('/fonts/inter-ext-700.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('/fonts/jetbrains-mono-400.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;
}
@font-face {
  font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('/fonts/jetbrains-mono-ext-400.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'JetBrains Mono'; font-style: normal; font-weight: 500; font-display: swap;
  src: url('/fonts/jetbrains-mono-500.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;
}
@font-face {
  font-family: 'JetBrains Mono'; font-style: normal; font-weight: 500; font-display: swap;
  src: url('/fonts/jetbrains-mono-ext-500.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ── Material Icons Round (self-hosted, ersetzt den Google-Fonts-Icon-CDN) ── */
@font-face {
  font-family: 'Material Icons Round'; font-style: normal; font-weight: 400; font-display: block;
  src: url('/fonts/material-icons-round.woff2') format('woff2');
}
.material-icons-round {
  font-family: 'Material Icons Round';
  font-weight: normal; font-style: normal; font-size: 24px; line-height: 1;
  letter-spacing: normal; text-transform: none; display: inline-block;
  white-space: nowrap; word-wrap: normal; direction: ltr;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility; font-feature-settings: 'liga';
}

/* ── CSS Custom Properties — Light Theme (SA Amber) ── */
:root{
  /* Brand — SA Amber */
  --primary:#FF9900; --primary-dark:#E68A00; --primary-container:#FFEACC; --on-primary:#1D1D1B; --accent:var(--primary);
  /* Surfaces */
  --bg:#FAFAFA; --surface:#FFFFFF; --surface2:#F4F4F5; --surface-elevated:#FFFFFF;
  --border:#E4E4E7; --border-strong:#D4D4D8;
  --text:#18181B; --muted:#71717A; --text-tertiary:#A1A1AA;
  --sidebar-bg:#F4F4F5; --topbar-bg:var(--surface);
  /* Status */
  --ok:#34C759; --warn:#FFD60A; --warn-on:#6B5200; --danger:#FF3B30; --info:#0A84FF;
  /* Radius + Shadow */
  --shadow:0 1px 2px rgba(0,0,0,.04),0 4px 16px rgba(0,0,0,.05);
  --shadow-md:0 4px 20px rgba(0,0,0,.10); --radius:8px; --radius-card:14px;
  /* Badge-Tints (SA-Container) */
  --badge-ok-bg:#E8F8EC; --badge-ok-c:#1F7A2E;
  --badge-warn-bg:#FFF8CC; --badge-warn-c:#6B5200;
  --badge-info-bg:#E5F1FF; --badge-info-c:#0040A8;
  --badge-muted-bg:#F4F4F5; --badge-muted-c:#52525B;
  --badge-danger-bg:#FFEFEF; --badge-danger-c:#B0231C;
  --badge-purple-bg:#F3E5F5; --badge-purple-c:#6A1B9A;
  /* ZK + Code-Familien (für spätere Module) */
  --zk0:#2E9E47; --zk1:#6F9E1F; --zk2:#C7891A; --zk3:#E0731C; --zk4:#D63B2B;
  --fam-leitung:#0A84FF; --fam-schacht:#5E5CE6; --fam-anschluss:#BF5AF2;
}

/* ── Dark Theme (SA Amber, Default) ── */
:root.dark{
  --primary:#FF9900; --primary-dark:#E68A00; --primary-container:#3D2500; --on-primary:#1D1D1B;
  --bg:#1C1C1E; --surface:#2C2C2E; --surface2:#242426; --surface-elevated:#3A3A3C;
  --border:#38383A; --border-strong:#48484A;
  --text:#F2F2F7; --muted:#98989D; --text-tertiary:#636366;
  --sidebar-bg:#242426;
  --ok:#30D158; --warn:#FFD60A; --warn-on:#FFF3A0; --danger:#FF453A; --info:#0A84FF;
  --badge-ok-bg:#0A3D1F; --badge-ok-c:#30D158;
  --badge-warn-bg:#3D3500; --badge-warn-c:#FFF3A0;
  --badge-info-bg:#0A2E5C; --badge-info-c:#0A84FF;
  --badge-muted-bg:#242426; --badge-muted-c:#98989D;
  --badge-danger-bg:#3D0A0A; --badge-danger-c:#FFD2CF;
  --badge-purple-bg:#1A0D2A; --badge-purple-c:#CE93D8;
  --zk0:#3FB950; --zk1:#9FCB36; --zk2:#E3A008; --zk3:#F0883E; --zk4:#F0533F;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 6px 20px rgba(0,0,0,.35);
  --shadow-md:0 4px 20px rgba(0,0,0,.45);
}

/* ── Reset & Base ── */
*, *::before, *::after { box-sizing: border-box; }

html {
  font-size: 14px;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: 'Inter', -apple-system, 'Segoe UI', system-ui, sans-serif;
  background: var(--bg);
  color: var(--text);
  margin: 0;
  padding: 0;
  min-height: 100vh;
  line-height: 1.5;
  transition: background .2s, color .2s;
}

a { color: var(--primary); text-decoration: none; }
a:hover { text-decoration: underline; }

code, .mono {
  font-family: 'JetBrains Mono', ui-monospace, Consolas, monospace;
  font-size: 0.9em;
}

/* ── Utilities ── */
.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}

.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ── Scrollbar ── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--muted); }

/* ── Animations ── */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes slideIn {
  from { opacity: 0; transform: translateX(-12px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* ── Blazor infrastructure ── */
.blazor-error-boundary {
  background: #b32121;
  padding: 1rem;
  color: white;
  border-radius: var(--radius);
}
.blazor-error-boundary::after {
  content: "Ein Fehler ist aufgetreten.";
}
#blazor-error-ui {
  background: var(--danger);
  color: white;
  padding: 0.6rem 1.25rem;
  display: none;
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 2000;
  font-family: 'Inter', sans-serif;
}

/* Mud-Kontrastfix (Amber-Flächen → dunkler Text) liegt seit W2 in css/mud-overrides.css. */