/* yobo-v3 — design system tokens (preserves today's dark v3 look) */
:root{
  /* Color */
  --paper:#222;--surface:#2a2a2a;--surface-2:#2c2c2c;
  --ink:#ffffff;--muted:#cccccc;--faint:#888888;
  --border:#555555;--border-soft:#444444;
  --brand:#f4181c;--link:#f4181c;--brand-rgb:244,24,28;
  --danger-bg:#f8d7da;--danger-text:#721c24;--danger-border:#f5c6cb;
  --success-bg:#d4edda;--success-text:#28a745;
  --warn-bg:#fff8e1;--warn-text:#f4a623;

  /* Typography */
  --font-body:inherit;
  --font-display:inherit;
  --label-font-size:14px;
  --label-font-weight:700;
  --label-text-transform:none;
  --label-letter-spacing:normal;
  --heading-font-weight:600;

  /* Info-card surface (light contrast cards on dark page — orders, settings) */
  --card-bg:#e8e8e8;
  --card-border:none;
  --card-shadow:none;
  --card-text:#222;
  --card-muted:#666;
  --card-header-bg:#ddd;
  --card-header-border-bottom:1px solid #ccc;

  /* Panel surface (login/register cards — dark surface containers) */
  --panel-border:1px solid #333;

  /* Nav active state (sidebar tab highlight) */
  --nav-active-bg:#ddd;
  --nav-active-text:#f4181c;

  /* Subtle divider inside info card (row separators) */
  --card-divider:#ddd;

  /* Display heading / section-title accent (v3 brand-red; indigo uses ink for elegance) */
  --display-heading-color:#f4181c;
  /* Form/filter label accent (v3 brand-red labels; indigo uses muted lavender) */
  --filter-label-color:#f4181c;

  /* Notice/warning panel (darker than --warn-text for body copy in alert panels) */
  --notice-text:#7a5a00;
  --notice-border:#f0c674;

  /* Success color as RGB triplet for rgba() transparency */
  --success-rgb:40,167,69;

  /* Inputs — dark page context (login, register, filter dropdowns) */
  --input-dark-bg:#3a3a3a;
  --input-dark-text:#ffffff;
  --input-dark-border:#555555;

  /* Inputs — light card context (settings form fields) */
  --input-light-bg:#ffffff;
  --input-light-text:#222222;
  --input-light-border:#cccccc;

  /* Input geometry (shared between dark/light contexts) */
  --input-padding:10px;
  --input-border-radius:4px;
  --input-border-width:1px;
}
