/* Farbtokens v2.2 — Rohwerte, Status, Daten. Neue Farben werden nicht eingefuehrt. */
:root{
  /* Marke */
  --wcmb-brand-blue:#16457E;
  --wcmb-brand-navy:#071724;
  --wcmb-brand-tint:#E7ECF3;
  --wcmb-brand-ice:#9FBDDC;

  /* Rohwerte hell */
  --wcmb-light-canvas:#FAFBFD;
  --wcmb-light-band:#F2F4F5;
  --wcmb-light-surface:#FFFFFF;
  --wcmb-light-subtle:#F4F6F8;
  --wcmb-light-text:#08161F;
  --wcmb-light-muted:#5C6A72;
  --wcmb-light-label:#5C6A72;
  --wcmb-light-line:#E4E8EE;
  --wcmb-light-line-soft:#EFF1F4;
  --wcmb-light-control:#7C8B94;
  --wcmb-light-action:#16457E;
  --wcmb-light-action-hover:#10365F;
  --wcmb-light-action-active:#0C2B4E;
  --wcmb-light-on-action:#FFFFFF;
  --wcmb-light-disabled:#E5EAF1;
  --wcmb-light-on-disabled:#536171;
  --wcmb-light-field-error:#AD2434;

  /* Rohwerte dunkel */
  --wcmb-dark-canvas:#071724;
  --wcmb-dark-band:#071724;
  --wcmb-dark-surface:#0F2634;
  --wcmb-dark-subtle:#16303F;
  --wcmb-dark-text:#FFFFFF;
  --wcmb-dark-muted:#BDCED8;
  --wcmb-dark-label:#8CA4B3;
  --wcmb-dark-line:rgba(255,255,255,.13);
  --wcmb-dark-control:#7890A7;
  --wcmb-dark-action:#FFFFFF;
  --wcmb-dark-action-hover:#EAF0FF;
  --wcmb-dark-action-active:#D5E1FF;
  --wcmb-dark-on-action:#071724;
  --wcmb-dark-disabled:#304759;
  --wcmb-dark-on-disabled:#B8C6D9;
  --wcmb-dark-field-error:#FFB4BF;

  /* Status, in beiden Flaechenmodi identisch */
  --wcmb-success:#176547;    --wcmb-success-bg:#EAF5EF;
  --wcmb-warning:#795100;    --wcmb-warning-bg:#FFF3D6;
  --wcmb-error:#AD2434;      --wcmb-error-bg:#FDEDF0;
  --wcmb-info:#16457E;       --wcmb-info-bg:#E7ECF3;
  --wcmb-delta-pos:#0E7C56;  --wcmb-delta-pos-bg:#E3F3EC;
  --wcmb-delta-neg:#B4432E;  --wcmb-delta-neg-bg:#F7E8E4;

  /* Datenreihen */
  --wcmb-data-primary:#16457E;
  --wcmb-data-comparison:#7C8B94;
  --wcmb-data-third:#0C2B4E;
  --wcmb-data-primary-dark:#9FBDDC;
  --wcmb-data-comparison-dark:#B8C6D9;
  --wcmb-data-third-dark:#FFFFFF;

  /* Fremdmarke: nur in Originalmaterial von LinkedIn, nie als Flaeche oder Button */
  --linkedin-blue:#0A66C2;
}

/* Semantische Rollen — Standard ist der helle Modus. */
:root{
  --wcmb-canvas:var(--wcmb-light-canvas);
  --wcmb-band:var(--wcmb-light-band);
  --wcmb-surface:var(--wcmb-light-surface);
  --wcmb-subtle:var(--wcmb-light-subtle);
  --wcmb-text:var(--wcmb-light-text);
  --wcmb-muted:var(--wcmb-light-muted);
  --wcmb-text-muted:var(--wcmb-light-muted);
  --wcmb-label:var(--wcmb-light-label);
  --wcmb-line:var(--wcmb-light-line);
  --wcmb-line-soft:var(--wcmb-light-line-soft);
  --wcmb-control:var(--wcmb-light-control);
  --wcmb-action:var(--wcmb-light-action);
  --wcmb-action-hover:var(--wcmb-light-action-hover);
  --wcmb-action-active:var(--wcmb-light-action-active);
  --wcmb-on-action:var(--wcmb-light-on-action);
  --wcmb-link:var(--wcmb-light-action);
  --wcmb-focus:var(--wcmb-light-action);
  --wcmb-selection:var(--wcmb-brand-tint);
  --wcmb-disabled:var(--wcmb-light-disabled);
  --wcmb-on-disabled:var(--wcmb-light-on-disabled);
  --wcmb-field-error:var(--wcmb-light-field-error);
  --wcmb-kpi:var(--wcmb-brand-blue);
  --wcmb-data-1:var(--wcmb-data-primary);
  --wcmb-data-2:var(--wcmb-data-comparison);
  --wcmb-data-3:var(--wcmb-data-third);
}

[data-surface="light"]{
  --wcmb-canvas:#FAFBFD;--wcmb-band:#F2F4F5;--wcmb-surface:#FFFFFF;--wcmb-subtle:#F4F6F8;
  --wcmb-text:#08161F;--wcmb-muted:#5C6A72;--wcmb-text-muted:#5C6A72;--wcmb-label:#5C6A72;
  --wcmb-line:#E4E8EE;--wcmb-line-soft:#EFF1F4;--wcmb-control:#7C8B94;
  --wcmb-action:#16457E;--wcmb-action-hover:#10365F;--wcmb-action-active:#0C2B4E;--wcmb-on-action:#FFFFFF;
  --wcmb-link:#16457E;--wcmb-focus:#16457E;--wcmb-selection:#E7ECF3;
  --wcmb-disabled:#E5EAF1;--wcmb-on-disabled:#536171;--wcmb-field-error:#AD2434;
  --wcmb-kpi:#16457E;--wcmb-data-1:#16457E;--wcmb-data-2:#7C8B94;--wcmb-data-3:#0C2B4E;
}

/* Dunkelregel: Primaerbutton weiss, Links und Daten in Ice Blue. */
[data-surface="dark"]{
  --wcmb-canvas:#071724;--wcmb-band:#071724;--wcmb-surface:#0F2634;--wcmb-subtle:#16303F;
  --wcmb-text:#FFFFFF;--wcmb-muted:#BDCED8;--wcmb-text-muted:#BDCED8;--wcmb-label:#8CA4B3;
  --wcmb-line:rgba(255,255,255,.13);--wcmb-line-soft:rgba(255,255,255,.13);--wcmb-control:#7890A7;
  --wcmb-action:#FFFFFF;--wcmb-action-hover:#EAF0FF;--wcmb-action-active:#D5E1FF;--wcmb-on-action:#071724;
  --wcmb-link:#9FBDDC;--wcmb-focus:#9FBDDC;--wcmb-selection:#16303F;
  --wcmb-disabled:#304759;--wcmb-on-disabled:#B8C6D9;--wcmb-field-error:#FFB4BF;
  --wcmb-kpi:#FFFFFF;--wcmb-data-1:#9FBDDC;--wcmb-data-2:#B8C6D9;--wcmb-data-3:#FFFFFF;
}