/* ============================================================
   WBR design tokens — colors, spacing, typography
   Change a value here and the whole client portal updates.
   The [data-theme="dark"] block flips the palette for dark mode,
   with NO markup changes anywhere else.
   ============================================================ */
:root{
  /* brand */
  --wbr-brand:#147a00;
  --wbr-brand-2:#155416;
  --wbr-brand-tint:rgba(20,122,0,.10);

  /* surfaces + text */
  --wbr-page:#f3f6f4;
  --wbr-card:#ffffff;
  --wbr-text:#16241c;
  --wbr-muted:#67746c;
  --wbr-border:rgba(15,40,28,.10);

  /* semantic */
  --wbr-ok:#147a00;        --wbr-ok-tint:rgba(20,122,0,.10);
  --wbr-info:#1f6ec0;      --wbr-info-tint:rgba(55,138,221,.16);
  --wbr-warn:#b9750f;      --wbr-warn-tint:rgba(239,159,39,.16);
  --wbr-danger:#cc3a39;    --wbr-danger-tint:rgba(226,75,74,.16);

  /* shape + depth */
  --wbr-radius:9px;
  --wbr-radius-lg:12px;
  --wbr-radius-xl:16px;
  --wbr-shadow:0 1px 2px rgba(16,40,28,.06),0 2px 10px rgba(16,40,28,.05);

  /* typography */
  --wbr-font:'Montserrat',system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;

  /* layout metrics */
  --wbr-sidebar-w:236px;
  --wbr-sidebar-collapsed:64px;
  --wbr-topbar-h:58px;
}

[data-theme="dark"]{
  --wbr-brand:#5cb646;
  --wbr-brand-2:#7cc96a;
  --wbr-brand-tint:rgba(92,182,70,.16);
  --wbr-ok:#5cb646;        --wbr-ok-tint:rgba(92,182,70,.16);

  --wbr-page:#0f1411;
  --wbr-card:#18211b;
  --wbr-text:#e9f0eb;
  --wbr-muted:#9baba0;
  --wbr-border:rgba(255,255,255,.10);

  --wbr-info:#5ea3ec;      --wbr-info-tint:rgba(55,138,221,.20);
  --wbr-warn:#ef9f27;      --wbr-warn-tint:rgba(239,159,39,.20);
  --wbr-danger:#ef8786;    --wbr-danger-tint:rgba(226,75,74,.20);

  --wbr-shadow:none;
}
