/* SICODA-Theme für Particify (Marine & Mint, Tokens aus sicoda-design-system).
   Wird per nginx sub_filter nach den Particify-Styles eingebunden (siehe ../nginx/arsnova.conf).
   Particify setzt seine Paletten zur Laufzeit inline am <html> — daher !important.
   WCAG: Akzent für Text/Flächen ist mint-700, mint-500 nur für Kanten/Logo. */

@font-face { font-family: "Space Grotesk"; src: url("/sicoda/SpaceGrotesk-Variable.woff2") format("woff2"); font-weight: 300 700; font-display: swap; }
@font-face { font-family: "Inter"; src: url("/sicoda/Inter-Variable.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }

:root {
  --sicoda-navy: #2C4A73; --sicoda-steel: #3E5F8A; --sicoda-mint: #2EC4A9; --sicoda-mint-700: #15756B;
  --sicoda-ice: #F2F6F8; --sicoda-text: #22344E; --sicoda-text-2: #4A5D77; --sicoda-line: #DCE3EA;

  /* Primär = Navy */
  --palette-primary-50-no-rgb: 232, 237, 243 !important;  --palette-primary-100-no-rgb: 197, 209, 224 !important;
  --palette-primary-200-no-rgb: 159, 178, 203 !important; --palette-primary-300-no-rgb: 120, 147, 182 !important;
  --palette-primary-400-no-rgb: 62, 95, 138 !important;   --palette-primary-500-no-rgb: 44, 74, 115 !important;
  --palette-primary-600-no-rgb: 40, 67, 105 !important;   --palette-primary-700-no-rgb: 34, 57, 91 !important;
  --palette-primary-800-no-rgb: 28, 48, 77 !important;    --palette-primary-900-no-rgb: 20, 35, 56 !important;
  --palette-primary-A100-no-rgb: 159, 178, 203 !important; --palette-primary-A200-no-rgb: 120, 147, 182 !important;
  --palette-primary-A400-no-rgb: 62, 95, 138 !important;  --palette-primary-A700-no-rgb: 44, 74, 115 !important;
  --palette-primary-contrast-50-no-rgb: 34, 52, 78, 1 !important;  --palette-primary-contrast-100-no-rgb: 34, 52, 78, 1 !important;
  --palette-primary-contrast-200-no-rgb: 34, 52, 78, 1 !important; --palette-primary-contrast-300-no-rgb: 34, 52, 78, 1 !important;
  --palette-primary-contrast-400-no-rgb: 255, 255, 255, 1 !important; --palette-primary-contrast-500-no-rgb: 255, 255, 255, 1 !important;
  --palette-primary-contrast-600-no-rgb: 255, 255, 255, 1 !important; --palette-primary-contrast-700-no-rgb: 255, 255, 255, 1 !important;
  --palette-primary-contrast-800-no-rgb: 255, 255, 255, 1 !important; --palette-primary-contrast-900-no-rgb: 255, 255, 255, 1 !important;
  --palette-primary-contrast-A100-no-rgb: 34, 52, 78, 1 !important;  --palette-primary-contrast-A200-no-rgb: 34, 52, 78, 1 !important;
  --palette-primary-contrast-A400-no-rgb: 255, 255, 255, 1 !important; --palette-primary-contrast-A700-no-rgb: 255, 255, 255, 1 !important;

  /* Akzent = Mint (500 = textsicheres mint-700) */
  --palette-accent-50-no-rgb: 230, 244, 241 !important;  --palette-accent-100-no-rgb: 207, 232, 226 !important;
  --palette-accent-200-no-rgb: 163, 216, 204 !important; --palette-accent-300-no-rgb: 111, 203, 184 !important;
  --palette-accent-400-no-rgb: 46, 196, 169 !important;  --palette-accent-500-no-rgb: 21, 117, 107 !important;
  --palette-accent-600-no-rgb: 18, 106, 97 !important;   --palette-accent-700-no-rgb: 16, 94, 86 !important;
  --palette-accent-800-no-rgb: 13, 80, 73 !important;    --palette-accent-900-no-rgb: 9, 59, 54 !important;
  --palette-accent-A100-no-rgb: 163, 216, 204 !important; --palette-accent-A200-no-rgb: 111, 203, 184 !important;
  --palette-accent-A400-no-rgb: 46, 196, 169 !important;  --palette-accent-A700-no-rgb: 21, 117, 107 !important;
  --palette-accent-contrast-50-no-rgb: 34, 52, 78, 1 !important;  --palette-accent-contrast-100-no-rgb: 34, 52, 78, 1 !important;
  --palette-accent-contrast-200-no-rgb: 34, 52, 78, 1 !important; --palette-accent-contrast-300-no-rgb: 34, 52, 78, 1 !important;
  --palette-accent-contrast-400-no-rgb: 34, 52, 78, 1 !important; --palette-accent-contrast-500-no-rgb: 255, 255, 255, 1 !important;
  --palette-accent-contrast-600-no-rgb: 255, 255, 255, 1 !important; --palette-accent-contrast-700-no-rgb: 255, 255, 255, 1 !important;
  --palette-accent-contrast-800-no-rgb: 255, 255, 255, 1 !important; --palette-accent-contrast-900-no-rgb: 255, 255, 255, 1 !important;
  --palette-accent-contrast-A100-no-rgb: 34, 52, 78, 1 !important;  --palette-accent-contrast-A200-no-rgb: 34, 52, 78, 1 !important;
  --palette-accent-contrast-A400-no-rgb: 34, 52, 78, 1 !important;  --palette-accent-contrast-A700-no-rgb: 255, 255, 255, 1 !important;

  /* Particify setzt zusaetzlich die direkten Werte inline am <html> */
  --palette-primary-50: rgb(232, 237, 243) !important;
  --palette-primary-100: rgb(197, 209, 224) !important;
  --palette-primary-200: rgb(159, 178, 203) !important;
  --palette-primary-300: rgb(120, 147, 182) !important;
  --palette-primary-400: rgb(62, 95, 138) !important;
  --palette-primary-500: rgb(44, 74, 115) !important;
  --palette-primary-600: rgb(40, 67, 105) !important;
  --palette-primary-700: rgb(34, 57, 91) !important;
  --palette-primary-800: rgb(28, 48, 77) !important;
  --palette-primary-900: rgb(20, 35, 56) !important;
  --palette-primary-A100: rgb(159, 178, 203) !important;
  --palette-primary-A200: rgb(120, 147, 182) !important;
  --palette-primary-A400: rgb(62, 95, 138) !important;
  --palette-primary-A700: rgb(44, 74, 115) !important;
  --palette-primary-contrast-50: rgb(34, 52, 78) !important;
  --palette-primary-contrast-100: rgb(34, 52, 78) !important;
  --palette-primary-contrast-200: rgb(34, 52, 78) !important;
  --palette-primary-contrast-300: rgb(34, 52, 78) !important;
  --palette-primary-contrast-400: rgb(255, 255, 255) !important;
  --palette-primary-contrast-500: rgb(255, 255, 255) !important;
  --palette-primary-contrast-600: rgb(255, 255, 255) !important;
  --palette-primary-contrast-700: rgb(255, 255, 255) !important;
  --palette-primary-contrast-800: rgb(255, 255, 255) !important;
  --palette-primary-contrast-900: rgb(255, 255, 255) !important;
  --palette-primary-contrast-A100: rgb(34, 52, 78) !important;
  --palette-primary-contrast-A200: rgb(34, 52, 78) !important;
  --palette-primary-contrast-A400: rgb(255, 255, 255) !important;
  --palette-primary-contrast-A700: rgb(255, 255, 255) !important;
  --palette-accent-50: rgb(230, 244, 241) !important;
  --palette-accent-100: rgb(207, 232, 226) !important;
  --palette-accent-200: rgb(163, 216, 204) !important;
  --palette-accent-300: rgb(111, 203, 184) !important;
  --palette-accent-400: rgb(46, 196, 169) !important;
  --palette-accent-500: rgb(21, 117, 107) !important;
  --palette-accent-600: rgb(18, 106, 97) !important;
  --palette-accent-700: rgb(16, 94, 86) !important;
  --palette-accent-800: rgb(13, 80, 73) !important;
  --palette-accent-900: rgb(9, 59, 54) !important;
  --palette-accent-A100: rgb(163, 216, 204) !important;
  --palette-accent-A200: rgb(111, 203, 184) !important;
  --palette-accent-A400: rgb(46, 196, 169) !important;
  --palette-accent-A700: rgb(21, 117, 107) !important;
  --palette-accent-contrast-50: rgb(34, 52, 78) !important;
  --palette-accent-contrast-100: rgb(34, 52, 78) !important;
  --palette-accent-contrast-200: rgb(34, 52, 78) !important;
  --palette-accent-contrast-300: rgb(34, 52, 78) !important;
  --palette-accent-contrast-400: rgb(34, 52, 78) !important;
  --palette-accent-contrast-500: rgb(255, 255, 255) !important;
  --palette-accent-contrast-600: rgb(255, 255, 255) !important;
  --palette-accent-contrast-700: rgb(255, 255, 255) !important;
  --palette-accent-contrast-800: rgb(255, 255, 255) !important;
  --palette-accent-contrast-900: rgb(255, 255, 255) !important;
  --palette-accent-contrast-A100: rgb(34, 52, 78) !important;
  --palette-accent-contrast-A200: rgb(34, 52, 78) !important;
  --palette-accent-contrast-A400: rgb(34, 52, 78) !important;
  --palette-accent-contrast-A700: rgb(255, 255, 255) !important;

  /* Buttons als Pill */
  --mat-button-filled-container-shape: 999px; --mat-button-protected-container-shape: 999px;
  --mat-button-outlined-container-shape: 999px; --mat-button-text-container-shape: 999px;
  --mat-button-tonal-container-shape: 999px;
}

/* Hell-Theme: Flächen und Funktionsfarben */
.theme-light {
  --background: var(--sicoda-ice) !important; --surface: #fff !important; --dialog: #fff !important;
  --on-background: var(--sicoda-text) !important; --on-surface: var(--sicoda-text) !important;
  --on-surface-light: var(--sicoda-text-2) !important; --border: var(--sicoda-line) !important;
  --blue: var(--sicoda-navy) !important; --blue-light: var(--sicoda-steel) !important;
  --success: #1F7A3D !important; --warn: #B23A31 !important;
  --bar-blue: var(--sicoda-navy) !important; --bar-teal: var(--sicoda-mint-700) !important;
  --likert-strongly-agree: var(--sicoda-navy) !important; --likert-agree: #7893B6 !important;
}

/* Schrift: Inter für UI, Space Grotesk für Überschriften; Icon- und Formelschriften unangetastet */
body, body *:not(mat-icon):not(.mat-icon):not([class*="material-symbols"]):not([class*="material-icons"]):not([class*="katex"]):not(.katex *) {
  font-family: "Inter", system-ui, sans-serif !important;
}
h1, h2, h3, .mat-mdc-dialog-title, .mat-mdc-card-title, .mat-headline-5, .mat-headline-6 {
  font-family: "Space Grotesk", "Inter", sans-serif !important; letter-spacing: -0.01em;
}
a { color: var(--sicoda-mint-700); }

/* Karten: Radius 12, Mint-Kante oben, weicher Schatten */
.mat-mdc-card {
  border-radius: 0 0 12px 12px !important; border-top: 4px solid var(--sicoda-mint) !important;
  box-shadow: 0 2px 10px rgba(34, 52, 78, .08) !important;
}

/* Verschachtelte Karten (z. B. Typ-Kacheln in „Fragenserien") ohne Mint-Kante — Akzent sparsam */
.mat-mdc-card .mat-mdc-card {
  border-top: 1px solid var(--sicoda-line) !important; border-radius: 12px !important; box-shadow: none !important;
}

/* Logo: jedes Particify-Logo-SVG (Startseite, Anmeldung, Teilnehmer-Begrüßung) zeigt das SICODA-Logo.
   Erkannt am Pfad .logo-primary; das SVG behält seine Größe, nur der Inhalt wird ersetzt.
   Der Hinweis „by Particify" im Fuß bleibt. */
svg:has(.logo-primary) > * { display: none !important; }
svg:has(.logo-primary) { background: url("/sicoda/sicoda-logo.svg") no-repeat center / contain; }
