/* ============================================================
   CUSTOMER THEME · RULMECA · Dark
   Red #e30613 · Black #1d1d1b · Grey #3d4548 (brand guide).
   In dark mode the red is brightened for legibility on near-black.
   Scoped to [data-bs-theme="dark"] — redefines the full token set so
   nothing leaks from the light customer theme.
   ============================================================ */

[data-bs-theme="dark"] {
  --ink-900: #f4f5f5;   /* headings — light */
  --ink-800: #171717;   /* sidebar top */
  --ink-700: #050505;   /* sidebar bottom */

  /* Brand — brightened Rulmeca red for dark backgrounds */
  --brand: #ff3341;
  --brand-600: #ff5560;
  --brand-700: #ff7c85;
  --brand-050: rgba(227, 6, 19, 0.18);

  /* Secondary accent — lightened cold grey */
  --gold: #8c979b;

  --read: #43c07f;
  --urgent: #ff3b30;

  /* Near-black canvas, charcoal (grey family) surfaces */
  --paper: #0e0f10;
  --paper-2: #17191a;
  --surface: #1a1c1d;
  --line: #2a2d2f;
  --line-strong: #3a3e40;
  --text: #e4e6e7;
  --text-muted: #9aa1a4;

  /* Decorative */
  --canvas-bg:
    radial-gradient(1100px 560px at 100% -10%, rgba(255, 51, 65, 0.10), transparent 60%),
    radial-gradient(900px 500px at -10% 110%, rgba(140, 151, 155, 0.05), transparent 55%);
  --sidebar-bg:
    radial-gradient(120% 60% at 50% -12%, rgba(255, 51, 65, 0.16), transparent 62%),
    linear-gradient(190deg, #141414 0%, #050505 100%);
  --rail-grad: linear-gradient(180deg, #ff3341, #7a0a10);
  --avatar-grad: linear-gradient(135deg, #e30613, #3d4548);
  --accent-grad: linear-gradient(90deg, #ff3341, #8c979b);
  --ring: rgba(255, 51, 65, 0.30);
  --row-hover: rgba(255, 51, 65, 0.08);
}

/* Keep the primary button Rulmeca-red in dark mode (base theme forces it blue). */
[data-bs-theme="dark"] .btn-primary {
  --bs-btn-bg: #e30613; --bs-btn-border-color: #e30613;
  --bs-btn-hover-bg: #ff3341; --bs-btn-hover-border-color: #ff3341;
  --bs-btn-active-bg: #c10510; --bs-btn-active-border-color: #c10510;
  --bs-btn-color: #fff; --bs-btn-hover-color: #fff;
}

[data-bs-theme="dark"] .user-avatar { color: #fff; }
