/* tokens.css — Design-Tokens handily networks (AS47526) für rpki.as47526.net
   Abgeleitet aus www.handily.network (Farben, Radius, Akzent). Systemschriften,
   keine Webfonts. Dunkel ist das Markenbild; hell folgt prefers-color-scheme.
   Kontraste (WCAG): Text ≥ 12:1, gedämpfter Text ≥ 4.5:1, Akzent als Text ≥ 4.5:1. */
:root{
  color-scheme: light dark;

  /* Schrift */
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "SFMono-Regular", "Cascadia Mono", "DejaVu Sans Mono", Menlo, Consolas, monospace;

  /* Maße */
  --maxw: 1080px;
  --gutter: 24px;
  --radius: 14px;
  --radius-s: 8px;
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px; --s8: 72px;

  /* Dunkel (Standard, Markenbild) */
  --bg:        #0a0f1a;   /* Seite */
  --bg-2:      #0f1626;   /* Karten, Tabellenkopf */
  --bg-3:      #141d31;   /* Hover, Code */
  --line:      #1f2a44;   /* Haarlinien */
  --line-2:    #2c3a5a;   /* stärkere Linie, Eingabefelder */
  --text:      #e7ecf5;
  --text-dim:  #93a0b8;
  --accent:    #ffb454;   /* einzige Akzentfarbe (Amber) */
  --accent-ink:#0a0f1a;   /* Text auf Akzentfläche */
  --focus:     #ffb454;

  /* Status – immer zusammen mit Text/Symbol verwenden */
  --ok:        #4ade80;  --ok-bg:   rgba(74,222,128,.10);  --ok-line:   rgba(74,222,128,.35);
  --bad:       #f87171;  --bad-bg:  rgba(248,113,113,.10); --bad-line:  rgba(248,113,113,.38);
  --none:      #a8b3c7;  --none-bg: rgba(168,179,199,.08); --none-line: rgba(168,179,199,.30);
}

@media (prefers-color-scheme: light){
  :root{
    --bg:        #f6f7fa;
    --bg-2:      #ffffff;
    --bg-3:      #eef1f6;
    --line:      #dde2eb;
    --line-2:    #c3cad8;
    --text:      #0f1626;
    --text-dim:  #4b5568;
    --accent:    #9a5800;   /* Amber, abgedunkelt für Kontrast auf Weiß */
    --accent-ink:#ffffff;
    --focus:     #9a5800;

    --ok:        #13703a;  --ok-bg:   #e8f6ee;  --ok-line:   #9fd5b4;
    --bad:       #b42318;  --bad-bg:  #fdecea;  --bad-line:  #f1aaa3;
    --none:      #4b5568;  --none-bg: #eef1f6;  --none-line: #c3cad8;
  }
}