/* ===== Remedi Design-Tokens · v1.1 =====
   ERZEUGT aus tokens/remedi.tokens.json durch doku/skripte/build_tokens.py.
   Nicht von Hand ändern: Werte in der JSON-Datei anpassen und das Skript neu ausführen. */
:root{
  /* Schrift */
  --rm-font-sans:"Atkinson Hyperlegible Next","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --rm-font-mono:"Atkinson Hyperlegible Mono",ui-monospace,"SF Mono","Cascadia Mono",Consolas,monospace;
  --rm-type-display:clamp(2.75rem,2.134rem + 2.629vw,4.5rem); --rm-type-h1:clamp(2.25rem,1.81rem + 1.878vw,3.5rem); --rm-type-h2:clamp(1.75rem,1.486rem + 1.127vw,2.5rem); --rm-type-h3:clamp(1.5rem,1.412rem + 0.376vw,1.75rem); --rm-type-h4:clamp(1.25rem,1.206rem + 0.188vw,1.375rem); --rm-type-body-lg:1.25rem; --rm-type-body:1.125rem; --rm-type-body-sm:1rem; --rm-type-label:1rem; --rm-type-label-lg:1.125rem; --rm-type-caption:0.875rem; --rm-type-eyebrow:0.875rem; --rm-type-data:1rem; --rm-type-price:1.75rem;

  /* Abstände, Radien, Größen */
  --rm-space-1:4px; --rm-space-2:8px; --rm-space-3:12px; --rm-space-4:16px; --rm-space-5:20px; --rm-space-6:24px; --rm-space-8:32px; --rm-space-10:40px; --rm-space-12:48px; --rm-space-16:64px; --rm-space-20:80px; --rm-space-24:96px; --rm-space-32:128px;
  --rm-radius-sm:6px; --rm-radius-md:10px; --rm-radius-lg:16px; --rm-radius-xl:24px; --rm-radius-full:9999px;
  --rm-target-min:48px; --rm-input-h:52px; --rm-container:1200px; --rm-measure:68ch;

  /* Schatten, Bewegung, Ebenen */
  --rm-shadow-e1:0 1px 2px rgba(31,30,28,0.06),0 1px 1px rgba(31,30,28,0.04);
  --rm-shadow-e2:0 4px 12px rgba(31,30,28,0.08);
  --rm-shadow-e3:0 12px 32px rgba(31,30,28,0.12);
  --rm-duration-fast:120ms; --rm-duration-base:200ms; --rm-duration-slow:300ms; --rm-duration-signature:480ms;
  --rm-ease-standard:cubic-bezier(0.2,0,0,1); --rm-ease-enter:cubic-bezier(0,0,0,1); --rm-ease-exit:cubic-bezier(0.3,0,1,1);
  --rm-z-base:0; --rm-z-raised:10; --rm-z-sticky:100; --rm-z-dropdown:200; --rm-z-overlay:300; --rm-z-modal:400; --rm-z-toast:500; --rm-z-skiplink:600;

  /* Primitives: Rohwerte. Nur für Paletten-Darstellungen und feste Medien wie Folien.
     Komponenten nutzen ausschließlich die Rollen darunter. */
  --rm-color-petrol-50:#EEF6F5; --rm-color-petrol-100:#D3EAE7; --rm-color-petrol-200:#A6D3CD; --rm-color-petrol-300:#6FB6AD; --rm-color-petrol-400:#3A968C; --rm-color-petrol-500:#187A71; --rm-color-petrol-600:#0F625B; --rm-color-petrol-700:#0B4E49; --rm-color-petrol-800:#093D39; --rm-color-petrol-900:#072E2B; --rm-color-petrol-950:#041B19;
  --rm-color-neutral-0:#FFFFFF; --rm-color-neutral-25:#FBFAF8; --rm-color-neutral-50:#F6F4F0; --rm-color-neutral-100:#EDEAE4; --rm-color-neutral-200:#DEDAD2; --rm-color-neutral-300:#C5C0B6; --rm-color-neutral-350:#A39D93; --rm-color-neutral-400:#8C877D; --rm-color-neutral-450:#77726A; --rm-color-neutral-500:#6E6A62; --rm-color-neutral-600:#57534D; --rm-color-neutral-700:#46433E; --rm-color-neutral-750:#3A3834; --rm-color-neutral-800:#302E2B; --rm-color-neutral-850:#2A2926; --rm-color-neutral-900:#1F1E1C; --rm-color-neutral-950:#141412; --rm-color-neutral-1000:#0B0B0A;
  --rm-color-champagner-50:#FAF6EC; --rm-color-champagner-100:#F2EAD6; --rm-color-champagner-200:#E5D5B2; --rm-color-champagner-300:#D3BC8A; --rm-color-champagner-400:#BC9F67; --rm-color-champagner-500:#9E8149; --rm-color-champagner-600:#7D6536; --rm-color-champagner-700:#5E4C29; --rm-color-champagner-950:#2A2519;
  --rm-color-success-50:#E9F5EC; --rm-color-success-300:#6FCF97; --rm-color-success-600:#1C7A3E; --rm-color-success-700:#155F30; --rm-color-success-950:#10291A;
  --rm-color-warning-50:#FFF5E1; --rm-color-warning-300:#F2B860; --rm-color-warning-500:#C77800; --rm-color-warning-600:#9A5B00; --rm-color-warning-700:#7A4700; --rm-color-warning-950:#2E2108;
  --rm-color-error-50:#FCEBEA; --rm-color-error-300:#F28B82; --rm-color-error-600:#B3261E; --rm-color-error-700:#8F1D17; --rm-color-error-950:#33150F;
  --rm-color-info-50:#EAF1FB; --rm-color-info-300:#8AB4F0; --rm-color-info-600:#2558A8; --rm-color-info-700:#1C4585; --rm-color-info-950:#10213A;
  --rm-color-data-schiefer-400:#6C8FA7; --rm-color-data-schiefer-600:#466CB9; --rm-color-data-pflaume-500:#8D5E89; --rm-color-data-pflaume-700:#6F447E;

  /* Farben – HELL (Standard) */
  color-scheme:light;
  --rm-bg-canvas:#F6F4F0; --rm-bg-surface:#FFFFFF; --rm-bg-sunken:#EDEAE4; --rm-bg-raised:#FFFFFF;
  --rm-bg-brand:#0B4E49; --rm-bg-brand-subtle:#D3EAE7; --rm-bg-accent-subtle:#F2EAD6; --rm-bg-stage:#1F1E1C;
  --rm-bg-inverse:#1F1E1C;
  --rm-text-primary:#1F1E1C; --rm-text-secondary:#46433E; --rm-text-muted:#57534D; --rm-text-on-action:#FFFFFF;
  --rm-text-on-inverse:#F6F4F0; --rm-text-link:#0F625B; --rm-text-link-hover:#0B4E49; --rm-text-accent:#7D6536;
  --rm-border-subtle:#DEDAD2; --rm-border-default:#C5C0B6; --rm-border-strong:#8C877D; --rm-border-focus:#0F625B;
  --rm-action-primary-bg:#0F625B; --rm-action-primary-bg-hover:#0B4E49; --rm-action-primary-bg-pressed:#093D39;
  --rm-action-secondary-border:#0F625B; --rm-action-secondary-text:#0B4E49; --rm-action-secondary-bg-hover:#D3EAE7;
  --rm-action-secondary-bg-pressed:#A6D3CD; --rm-action-inverse-bg:#F6F4F0; --rm-action-inverse-text:#1F1E1C;
  --rm-action-destructive-bg:#B3261E; --rm-action-destructive-text:#FFFFFF; --rm-action-disabled-bg:#EDEAE4;
  --rm-action-disabled-text:#57534D;
  --rm-on-dark-text:#F6F4F0; --rm-on-dark-text-secondary:#C5C0B6; --rm-on-dark-accent:#D3BC8A;
  --rm-on-dark-border:#A39D93; --rm-on-dark-focus:#F6F4F0;
  --rm-success-tint:#E9F5EC; --rm-success-icon:#1C7A3E; --rm-success-text:#155F30;
  --rm-warning-tint:#FFF5E1; --rm-warning-icon:#C77800; --rm-warning-text:#7A4700;
  --rm-error-tint:#FCEBEA; --rm-error-icon:#B3261E; --rm-error-text:#8F1D17;
  --rm-info-tint:#EAF1FB; --rm-info-icon:#2558A8; --rm-info-text:#1C4585;
  --rm-chart-1:#0F625B; --rm-chart-2:#9E8149; --rm-chart-3:#6C8FA7; --rm-chart-4:#6F447E; --rm-chart-5:#302E2B;
}

/* Farben – DUNKEL: folgt dem System, außer im Konto ist „hell“ gewählt */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --rm-bg-canvas:#141412; --rm-bg-surface:#1F1E1C; --rm-bg-sunken:#0B0B0A; --rm-bg-raised:#2A2926;
    --rm-bg-brand:#093D39; --rm-bg-brand-subtle:#072E2B; --rm-bg-accent-subtle:#2A2519; --rm-bg-stage:#0B0B0A;
    --rm-bg-inverse:#F6F4F0;
    --rm-text-primary:#F6F4F0; --rm-text-secondary:#C5C0B6; --rm-text-muted:#A39D93; --rm-text-on-action:#041B19;
    --rm-text-on-inverse:#1F1E1C; --rm-text-link:#6FB6AD; --rm-text-link-hover:#A6D3CD; --rm-text-accent:#D3BC8A;
    --rm-border-subtle:#3A3834; --rm-border-default:#46433E; --rm-border-strong:#77726A; --rm-border-focus:#6FB6AD;
    --rm-action-primary-bg:#6FB6AD; --rm-action-primary-bg-hover:#A6D3CD; --rm-action-primary-bg-pressed:#D3EAE7;
    --rm-action-secondary-border:#6FB6AD; --rm-action-secondary-text:#6FB6AD; --rm-action-secondary-bg-hover:#072E2B;
    --rm-action-secondary-bg-pressed:#093D39; --rm-action-inverse-bg:#F6F4F0; --rm-action-inverse-text:#1F1E1C;
    --rm-action-destructive-bg:#F28B82; --rm-action-destructive-text:#1F1E1C; --rm-action-disabled-bg:#2A2926;
    --rm-action-disabled-text:#A39D93;
    --rm-on-dark-text:#F6F4F0; --rm-on-dark-text-secondary:#C5C0B6; --rm-on-dark-accent:#D3BC8A;
    --rm-on-dark-border:#A39D93; --rm-on-dark-focus:#F6F4F0;
    --rm-success-tint:#10291A; --rm-success-icon:#6FCF97; --rm-success-text:#6FCF97;
    --rm-warning-tint:#2E2108; --rm-warning-icon:#F2B860; --rm-warning-text:#F2B860;
    --rm-error-tint:#33150F; --rm-error-icon:#F28B82; --rm-error-text:#F28B82;
    --rm-info-tint:#10213A; --rm-info-icon:#8AB4F0; --rm-info-text:#8AB4F0;
    --rm-chart-1:#6FB6AD; --rm-chart-2:#D3BC8A; --rm-chart-3:#466CB9; --rm-chart-4:#8D5E89; --rm-chart-5:#F6F4F0;
    --rm-shadow-e1:none; --rm-shadow-e2:none; --rm-shadow-e3:none;
  }
}
/* Farben – DUNKEL: im Konto fest gewählt */
:root[data-theme="dark"]{
  color-scheme:dark;
  --rm-bg-canvas:#141412; --rm-bg-surface:#1F1E1C; --rm-bg-sunken:#0B0B0A; --rm-bg-raised:#2A2926;
  --rm-bg-brand:#093D39; --rm-bg-brand-subtle:#072E2B; --rm-bg-accent-subtle:#2A2519; --rm-bg-stage:#0B0B0A;
  --rm-bg-inverse:#F6F4F0;
  --rm-text-primary:#F6F4F0; --rm-text-secondary:#C5C0B6; --rm-text-muted:#A39D93; --rm-text-on-action:#041B19;
  --rm-text-on-inverse:#1F1E1C; --rm-text-link:#6FB6AD; --rm-text-link-hover:#A6D3CD; --rm-text-accent:#D3BC8A;
  --rm-border-subtle:#3A3834; --rm-border-default:#46433E; --rm-border-strong:#77726A; --rm-border-focus:#6FB6AD;
  --rm-action-primary-bg:#6FB6AD; --rm-action-primary-bg-hover:#A6D3CD; --rm-action-primary-bg-pressed:#D3EAE7;
  --rm-action-secondary-border:#6FB6AD; --rm-action-secondary-text:#6FB6AD; --rm-action-secondary-bg-hover:#072E2B;
  --rm-action-secondary-bg-pressed:#093D39; --rm-action-inverse-bg:#F6F4F0; --rm-action-inverse-text:#1F1E1C;
  --rm-action-destructive-bg:#F28B82; --rm-action-destructive-text:#1F1E1C; --rm-action-disabled-bg:#2A2926;
  --rm-action-disabled-text:#A39D93;
  --rm-on-dark-text:#F6F4F0; --rm-on-dark-text-secondary:#C5C0B6; --rm-on-dark-accent:#D3BC8A;
  --rm-on-dark-border:#A39D93; --rm-on-dark-focus:#F6F4F0;
  --rm-success-tint:#10291A; --rm-success-icon:#6FCF97; --rm-success-text:#6FCF97;
  --rm-warning-tint:#2E2108; --rm-warning-icon:#F2B860; --rm-warning-text:#F2B860;
  --rm-error-tint:#33150F; --rm-error-icon:#F28B82; --rm-error-text:#F28B82;
  --rm-info-tint:#10213A; --rm-info-icon:#8AB4F0; --rm-info-text:#8AB4F0;
  --rm-chart-1:#6FB6AD; --rm-chart-2:#D3BC8A; --rm-chart-3:#466CB9; --rm-chart-4:#8D5E89; --rm-chart-5:#F6F4F0;
  --rm-shadow-e1:none; --rm-shadow-e2:none; --rm-shadow-e3:none;
}

/* Dunkle Flächen (bg.brand, bg.stage): Die Klasse belegt die Rollen um.
   Jede Komponente darin bekommt automatisch lesbaren Text, sichtbare Links und einen sichtbaren Fokusring. */
.rm-on-dark{
  --rm-text-primary:var(--rm-on-dark-text); --rm-text-secondary:var(--rm-on-dark-text-secondary);
  --rm-text-muted:var(--rm-on-dark-text-secondary); --rm-text-accent:var(--rm-on-dark-accent);
  --rm-text-link:var(--rm-on-dark-text); --rm-text-link-hover:var(--rm-on-dark-accent);
  --rm-border-strong:var(--rm-on-dark-border); --rm-border-focus:var(--rm-on-dark-focus);
  color:var(--rm-text-primary);
}

/* Basis */
html{ -webkit-text-size-adjust:100%; }
body{ margin:0; background:var(--rm-bg-canvas); color:var(--rm-text-primary);
  font:400 var(--rm-type-body)/1.6 var(--rm-font-sans); }
a{ color:var(--rm-text-link); text-decoration:underline; text-underline-offset:.2em; }
a:hover{ color:var(--rm-text-link-hover); }
:focus-visible{ outline:3px solid var(--rm-border-focus); outline-offset:2px; }
@media (prefers-reduced-motion:reduce){ *,*::before,*::after{ animation-duration:.01ms!important; transition-duration:.01ms!important; } }
