/* RNA Admin — Token-Layer, aus dem Design-Bundle (docs/design-bundle/tokens/).
   Quelle der Werte: rna-tokens.dtcg.json — dort ändern, hierher übernehmen.

   Abweichung vom Bundle (bewusst, Web-Deployment):
   Das Bundle schaltet Dark über [data-mode="dark"]. Die Web-App hat keinen
   Theme-Umschalter und kein JavaScript (CSP: script-src 'self', kein Inline),
   deshalb hängt Dark hier an prefers-color-scheme statt an einem Attribut.
   Kommt später ein Umschalter, wandert der Block zurück auf das Attribut.
   CSP-safe: keine Inline-Styles, keine Skripte. */

:root {
  color-scheme: light dark;

  /* Marke — wörtlich aus _ds/.../colors_and_type.css */
  --rna-primary-50:  #EFF9FF;
  --rna-primary-100: #DEF2FF;
  --rna-primary-200: #B6E8FF;
  --rna-primary-300: #75D8FF;
  --rna-primary-400: #2CC4FF;   /* dark-mode lifted accent */
  --rna-primary-500: #009EE0;   /* brand cyan */
  --rna-primary-600: #008AC4;   /* hover */
  --rna-primary-700: #006E9D;   /* press */
  --rna-primary-800: #005D83;
  --rna-primary-900: #064D6B;
  --rna-primary-950: #04314D;
  --rna-info-200:    #C2DEF5;   /* Herner Himmel */
  --rna-info-500:    #2B6FC4;   /* Bergkamener Blau */
  --rna-info-700:    #1A467F;
  --rna-info-800:    #1E2B46;   /* Dorstener Dunkel */
  --rna-success-400: #26CD97;
  --rna-success-500: #00CA88;
  --rna-success-600: #00A672;
  --rna-success-700: #0E6E75;
  --rna-danger-300:  #EE7585;
  --rna-danger-500:  #D9384B;   /* Bocholter Beere */
  --rna-danger-800:  #671722;
  --rna-warning-300: #FFE600;
  --rna-warning-500: #C2AF00;
  --rna-warning-600: #8F8000;
  --rna-warning-800: #463E00;
  --rna-warning-amber: #FFB800; /* flaky/warn dot */
  --rna-help-400:    #9F71E6;   /* Kamener Krokus */
  --rna-help-700:    #522E8A;

  /* Grautöne — wörtlich aus dem DS */
  --rna-ww-1: #333332; --rna-ww-2: #4D4D4C; --rna-ww-3: #696966; --rna-ww-4: #878784; --rna-ww-5: #A6A6A2;
  --rna-ww-6: #C1C2BE; --rna-ww-7: #D9D9D4; --rna-ww-8: #E8E8E3; --rna-ww-9: #F2F2ED; --rna-ww-10: #FAFAF5;
  --rna-kk-1: #303233; --rna-kk-2: #484B4D; --rna-kk-3: #636769; --rna-kk-4: #808587; --rna-kk-5: #9DA3A6;
  --rna-kk-6: #B8BFC2; --rna-kk-7: #CED6D9; --rna-kk-8: #DCE5E8; --rna-kk-9: #E6EFF2; --rna-kk-10: #EDF7FA;

  /* Links (DS) */
  --rna-link: var(--rna-info-500);
  --rna-link-hover: var(--rna-info-700);

  /* Umgebung */
  --rna-env-lokal: #8E8E93;
  --rna-env-staging: #FF9500;
  --rna-env-produktion: #D9384B;
  --rna-env-custom: #2B6FC4;

  /* Semantisch — Light (App-Schicht der Shell: Canvas-Verlauf + Glas-Chrome;
     Marken-/Statuswerte stammen unverändert aus den DS-Ramps oben) */
  --rna-canvas: linear-gradient(160deg, #F2F6F6, #FAFAF5 55%, #F4F2EC);
  --rna-canvas-flat: #FAFAF5;
  --rna-surface: #FFFFFF;
  --rna-pane: #EDEDEA;
  --rna-text: #1E2126;
  --rna-muted: #6B7280;
  --rna-border: rgba(0,0,0,.08);
  --rna-sep: rgba(0,0,0,.10);
  --rna-accent: var(--rna-primary-500);
  --rna-accent-tint: rgba(0,158,224,.12);
  --rna-chip: rgba(0,0,0,.05);
  --rna-active: rgba(0,0,0,.09);
  --rna-field: #FFFFFF;
  --rna-placeholder: #DFDFDA;
  --rna-glass: rgba(255,255,255,.60);
  --rna-glass-side: rgba(250,250,246,.66);
  --rna-web-sidebar: #FFFFFF;
  --rna-web-nav-fg: #4B5563;
  --rna-pass: var(--rna-success-600);
  --rna-fail: var(--rna-danger-500);

  /* Typografie */
  --rna-font-sans: "Atlas Grotesk", -apple-system, system-ui, sans-serif;
  --rna-font-serif: "Harrison Serif Pro", "Iowan Old Style", "Source Serif Pro", Georgia, serif;
  --rna-font-mono: ui-monospace, SFMono-Regular, "JetBrains Mono", Menlo, monospace;

  /* Maße */
  --rna-radius-sm: 4px;
  --rna-radius-md: 8px;
  --rna-radius-lg: 12px;
  --rna-radius-card: 14px;
  --rna-radius-capsule: 18px;
  --rna-radius-pill: 999px;
  --rna-sidebar-mac: 242px;
  --rna-sidebar-web: 232px;
  --rna-rail-ipad: 78px;
  --rna-toolbar-h: 46px;
  --rna-inspector-w: 320px;
  --rna-hit-min: 44px;

  /* Elevation */
  --rna-shadow-100: 0 2px 10px rgba(0,0,0,.08);
  --rna-shadow-200: 0 4px 16px rgba(0,0,0,.07);
  --rna-shadow-300: 0 8px 24px rgba(0,0,0,.10);
  --rna-shadow-400: 0 10px 30px rgba(0,0,0,.10);
  --rna-shadow-500: 0 12px 32px rgba(0,0,0,.18);
  --rna-shadow-window: 0 40px 90px rgba(0,0,0,.28);

  /* Glas */
  --rna-blur-toolbar: 26px;
  --rna-blur-sidebar: 30px;
  --rna-blur-bar: 22px;
  --rna-blur-actionbar: 28px;

  /* Motion */
  --rna-dur-fast: 120ms;
  --rna-dur-base: 200ms;
  --rna-dur-slow: 320ms;
  --rna-ease-out: cubic-bezier(.16, 1, .3, 1);
  --rna-ease-std: cubic-bezier(.4, 0, .2, 1);
}

@media (prefers-color-scheme: dark) {
  :root {
    --rna-canvas: linear-gradient(160deg, #20242B, #1E2126 55%, #1C2026);
    --rna-canvas-flat: #1E2126;  /* DS-Pendant: --rna-kk-1 */
    --rna-surface: #262A30;
    --rna-pane: #191C20;
    --rna-text: #F3F3F0;
    --rna-muted: #9AA0A8;
    --rna-border: rgba(255,255,255,.10);
    --rna-sep: rgba(255,255,255,.14);
    --rna-accent: var(--rna-primary-400);
    --rna-accent-tint: rgba(44,196,255,.14);
    --rna-chip: rgba(255,255,255,.06);
    --rna-active: rgba(255,255,255,.10);
    --rna-field: #1E2126;
    --rna-placeholder: #2E333A;
    --rna-glass: rgba(38,42,48,.60);
    --rna-glass-side: rgba(26,29,34,.72);
    --rna-web-sidebar: var(--rna-info-800);
    --rna-web-nav-fg: rgba(255,255,255,.72);
    --rna-pass: #26CD97;
    --rna-fail: #EE7585;
    --rna-shadow-window: 0 40px 90px rgba(0,0,0,.55);
  }
}

/* Die Glas-Regeln des Bundles fehlen hier absichtlich: Web hat laut
   component-specs (Plattform-Deltas) keine Glas-Schicht. */

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 1ms !important; transition-duration: 1ms !important; }
}
