/* =====================================================================
   Theme „NW+ Orga“ – angelehnt an das Design von dave-null/nwplus-orga
   (Next.js/Tailwind: Farben aus globals.css, Schriften Karla + Fjalla One,
   flache Karten mit feinen Rändern, rounded-md/-xl).
   Aktiv, wenn <html data-theme="nwplus"> gesetzt ist.
   ===================================================================== */

/* Schriften selbst gehostet (OFL), beim Docker-Build aus @fontsource kopiert */
@font-face { font-family: "Karla"; font-style: normal; font-weight: 400; font-display: swap; src: url("/vendor/fonts/karla-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Karla"; font-style: normal; font-weight: 600; font-display: swap; src: url("/vendor/fonts/karla-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Karla"; font-style: normal; font-weight: 700; font-display: swap; src: url("/vendor/fonts/karla-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Fjalla One"; font-style: normal; font-weight: 400; font-display: swap; src: url("/vendor/fonts/fjalla-one-latin-400-normal.woff2") format("woff2"); }

[data-theme="nwplus"] {
  /* Farben aus nwplus-orga/src/app/globals.css */
  --font: "Karla", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-display: "Fjalla One", ui-sans-serif, sans-serif;
  --page-bg: #f5f9fc;           /* --background */
  --ink: #1e2a33;               /* --foreground */
  --surface: #ffffff;           /* --color-paper */
  --surface-2: #eef4f9;
  --muted: #54646f;             /* --color-ink-soft */
  --line: #d9e4ec;              /* --color-line */
  --line-strong: #b9cad8;
  --primary: #163a5c;           /* --color-accent-deep: Primärknöpfe */
  --primary-hover: #2e6da4;     /* --color-accent: Hover */
  --primary-rgb: 46, 109, 164;
  --primary-soft: #e3eef7;
  --primary-softer: #f0f6fb;
  --primary-line: #9fc0dc;
  --danger: #b5432e;            /* --color-accent-warm */
  --heading: #2a4a79;           /* --color-heading */
  --brand-gradient: linear-gradient(135deg, #2e6da4 0%, #163a5c 100%);
  --radius: 12px;               /* rounded-xl der Karten */
  --shadow: 0 1px 2px rgba(22, 58, 92, .06), 0 4px 16px rgba(22, 58, 92, .10);
}

[data-theme="nwplus"] body { letter-spacing: .005em; }
[data-theme="nwplus"] h1,
[data-theme="nwplus"] h2,
[data-theme="nwplus"] h3 { font-weight: 400; letter-spacing: .01em; text-wrap: balance; }

/* Knöpfe & Eingaben: rounded-md, dezente Ränder */
[data-theme="nwplus"] .btn { border-radius: 6px; font-weight: 600; border-color: var(--line); }
[data-theme="nwplus"] .btn:hover { background: var(--surface-2); border-color: var(--primary-hover); }
[data-theme="nwplus"] .btn-primary { background: var(--primary); border-color: var(--primary); }
[data-theme="nwplus"] .btn-primary:hover { background: var(--primary-hover); border-color: var(--primary-hover); }
[data-theme="nwplus"] .btn-danger:hover { background: #963624; }
[data-theme="nwplus"] .input { border-radius: 6px; border-color: #cfd9e2; }
[data-theme="nwplus"] .input:focus { outline: 2px solid var(--primary-hover); outline-offset: 0; border-color: var(--primary-hover); }
[data-theme="nwplus"] .chip { border-radius: 6px; }
[data-theme="nwplus"] .chip:hover,
[data-theme="nwplus"] .chip.active { background: var(--primary); border-color: var(--primary); }
[data-theme="nwplus"] .round { border-radius: 8px; }
[data-theme="nwplus"] .btn-primary.round { border-radius: 8px; }

/* Login: heller Seitenhintergrund statt Verlauf, Karte mit Rand */
[data-theme="nwplus"] .login-page { background: var(--page-bg); }
[data-theme="nwplus"] .login-card { border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 1px 3px rgba(22, 58, 92, .06); }
[data-theme="nwplus"] .login-brand h1 { font-size: 2rem; }

/* Übersicht: Kopfleiste wie die TopNav (paper + border-b), Karten flach mit Rand */
[data-theme="nwplus"] .overview-top { background: var(--surface); backdrop-filter: none; border-bottom: 1px solid var(--line); }
[data-theme="nwplus"] .overview-brand b { font-size: 1.35rem; letter-spacing: .03em; }
[data-theme="nwplus"] .overview-head h1 { font-size: 1.9rem; }
[data-theme="nwplus"] .deck-card { border: 1px solid var(--line); box-shadow: 0 1px 2px rgba(22, 58, 92, .05); }
[data-theme="nwplus"] .deck-card:hover { border-color: var(--primary-line); box-shadow: 0 4px 14px rgba(22, 58, 92, .10); }
[data-theme="nwplus"] .deck-preview-wrap { background: #1e2a33; }
[data-theme="nwplus"] .mini-widget { border-radius: 3px; color: var(--primary-hover); }
[data-theme="nwplus"] .deck-new { border-color: var(--line-strong); border-radius: 12px; }
[data-theme="nwplus"] .deck-new:hover { background: var(--primary-softer); border-color: var(--primary-hover); color: var(--primary); }

/* Board: Kopfleiste & Navigation als flache weiße Elemente mit Rand */
[data-theme="nwplus"] .pill,
[data-theme="nwplus"] .slide-nav {
  border-radius: 8px; background: var(--surface); backdrop-filter: none;
  border: 1px solid var(--line); box-shadow: 0 1px 3px rgba(22, 58, 92, .10);
}
[data-theme="nwplus"] .pill:hover { border-color: var(--primary-hover); color: var(--primary); }
[data-theme="nwplus"] .overview-top .pill { background: var(--surface); }
[data-theme="nwplus"] .nav-btn,
[data-theme="nwplus"] .nav-counter { border-radius: 6px; }
[data-theme="nwplus"] .save-status { font-weight: 600; }

/* Widget-Leiste: einheitlich im Akzentblau statt bunter Gruppenfarben */
[data-theme="nwplus"] .dock {
  border-radius: 12px; background: var(--surface); backdrop-filter: none;
  border: 1px solid var(--line); box-shadow: 0 4px 18px rgba(22, 58, 92, .14);
}
[data-theme="nwplus"] .dock-icon { border-radius: 8px; background: var(--surface-2); color: var(--primary-hover); }
[data-theme="nwplus"] .dock-btn:hover .dock-icon { background: var(--primary); color: #fff; }
[data-theme="nwplus"] .dock-label { color: var(--muted); }
[data-theme="nwplus"] .dock-tab { background: var(--surface); border: 1px solid var(--line); border-bottom: 0; border-radius: 8px 8px 0 0; }

/* Widgets: Karten wie <Card> (rounded-xl, Rand, leichter Schatten) */
[data-theme="nwplus"] .widget { border: 1px solid var(--line); box-shadow: 0 2px 10px rgba(22, 58, 92, .14); }
[data-theme="nwplus"] .widget-head { color: var(--heading); }
[data-theme="nwplus"] .widget-title { font-family: var(--font-display); font-weight: 400; font-size: .9rem; letter-spacing: .02em; }
[data-theme="nwplus"] .widget.shared { box-shadow: 0 2px 10px rgba(22, 58, 92, .14), 0 0 0 2px var(--primary-hover); }
[data-theme="nwplus"] .widget-traffic { background: #1e2a33; border-color: #1e2a33; }
[data-theme="nwplus"] .widget-traffic .widget-head { color: #c9d6e0; }

/* Große Anzeigen in der Display-Schrift (schmal & gut lesbar auf dem Beamer) */
[data-theme="nwplus"] .big-digits,
[data-theme="nwplus"] .name-display,
[data-theme="nwplus"] .symbol-label,
[data-theme="nwplus"] .poll-question,
[data-theme="nwplus"] .meter-status { font-family: var(--font-display); font-weight: 400; letter-spacing: .02em; }
[data-theme="nwplus"] .big-digits { color: var(--ink); }
[data-theme="nwplus"] .timer-progress { background: var(--primary-hover); }
[data-theme="nwplus"] .name-display.pop { color: var(--primary-hover); }
[data-theme="nwplus"] .group-card { border-radius: 8px; }
[data-theme="nwplus"] .poll-option { border-radius: 6px; }

/* Menüs, Dialoge, Meldungen */
[data-theme="nwplus"] .popover { border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 8px 24px rgba(22, 58, 92, .16); }
[data-theme="nwplus"] .popover-item { border-radius: 6px; }
[data-theme="nwplus"] .modal { border-radius: 12px; border: 1px solid var(--line); }
[data-theme="nwplus"] .modal h2 { font-size: 1.35rem; }
[data-theme="nwplus"] .toast { background: var(--primary); border-radius: 6px; }
[data-theme="nwplus"] .toast-success { background: #2e7d4f; }   /* --color-ok */
[data-theme="nwplus"] .toast-error { background: var(--danger); }
[data-theme="nwplus"] .aspect-tile,
[data-theme="nwplus"] .layout-tile,
[data-theme="nwplus"] .theme-tile { border-radius: 8px; border-width: 1px; }
[data-theme="nwplus"] .aspect-tile.active,
[data-theme="nwplus"] .layout-tile.active,
[data-theme="nwplus"] .theme-tile.active { box-shadow: 0 0 0 1px var(--primary); }
[data-theme="nwplus"] .stat { border: 1px solid var(--line); background: var(--surface); border-radius: 8px; }
[data-theme="nwplus"] .stat b { font-family: var(--font-display); font-weight: 400; color: var(--heading); }
[data-theme="nwplus"] .badge-iserv { background: var(--primary-soft); color: var(--primary); }
