/*
 * KKSPEINE ClubManager – Design-Tokens (Kobra)
 * Anthrazit · Hintergrund/Weiß · Kobra-Rot · Sport-Blau · Gold
 * Icons: static/icons/clubmanager (inaktiv #526273 · aktiv #DC1726)
 */
:root {
  /* Kernpalette */
  --anthrazit: #1a1f2b;
  --anthrazit-2: #242b3a;
  --hintergrund: #e6e8ed;
  --weiss: #ffffff;
  --kobra-rot: #DC1726;
  --sport-blau: #1f6feb;
  --gold: #c4a35a;
  --icon-idle: #526273;
  --ink: #1a1f2b;
  --muted: #5c6570;
  --line: #c4cad3;

  /* Shell-Maße */
  --sidebar-width: 272px;
  --topbar-height: 56px;
  --bottom-nav-height: 64px;
  --radius: 12px;
  --touch-min: 44px;
  --focus-ring: 0 0 0 3px rgba(31, 111, 235, 0.28);

  /* Typo */
  --font-display: "Outfit", system-ui, sans-serif;
  --font-body: "Source Sans 3", system-ui, sans-serif;
  --text-scale: 1.0625;

  /* Icon-Basis (Flask: url_for ergänzt den Pfad in Templates) */
  --cm-icon-base: /static/icons/clubmanager/svg;

  /* Abwärtskompatibel zu vereinsfarben.css */
  --verein-gelb: var(--gold);
  --verein-rot: var(--kobra-rot);
  --verein-grau: var(--anthrazit);
  --verein-gelb-hell: #e8d7a8;
  --verein-grau-hell: #3a4254;
  --text-dark: var(--ink);
  --text-light: var(--muted);
  --text-white: var(--weiss);
  --bg-light: var(--hintergrund);
  --bg-white: var(--weiss);
  --border-light: var(--line);
  --status-success: #2f7d4a;
  --status-danger: var(--kobra-rot);
  --status-secondary: #6c757d;
  --status-info: var(--sport-blau);
  --status-warning: var(--gold);

  /* Semantik Buttons / Flächen */
  --btn-primary: var(--kobra-rot);
  --btn-primary-hover: #b91420;
  --btn-secondary: var(--anthrazit-2);
  --btn-secondary-hover: #323a4d;
  --btn-outline: var(--anthrazit);
  --surface: var(--weiss);
  --surface-elevated: var(--weiss);
  --shadow-soft: 0 2px 8px rgba(26, 31, 43, 0.07), 0 8px 22px rgba(26, 31, 43, 0.06);
  --shadow-card: 0 4px 12px rgba(26, 31, 43, 0.09), 0 12px 28px rgba(26, 31, 43, 0.08);
}

html[data-text-size="m"] { --text-scale: 1.0625; }
html[data-text-size="l"] { --text-scale: 1.1875; }
html[data-text-size="xl"] { --text-scale: 1.3125; }

html {
  font-size: calc(100% * var(--text-scale));
}

body.portal-body {
  margin: 0;
  min-height: 100vh;
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--hintergrund);
  line-height: 1.45;
}

/* Utility: ClubManager-Icon (Größe über width/height am img) */
.cm-ico {
  width: 22px;
  height: 22px;
  object-fit: contain;
  display: inline-block;
  flex-shrink: 0;
  vertical-align: middle;
}
.cm-ico-sm { width: 18px; height: 18px; }
.cm-ico-lg { width: 28px; height: 28px; }
