/* ============================================================
   BRAND PALETTE OVERRIDE
   Dimuatkan SELEPAS app.css. Guna !important supaya menang atas
   takrifan tema terbina (html.lazy[theme-accent=...]) tanpa perlu
   rebuild Tailwind.

   Palet:
     #0B1D36 navy gelap   #1061FF biru
     #00B8D3 cyan         #52D6B5 mint      #F2F4F7 kelabu terang
   ============================================================ */

:root,
html,
html.lazy {
  /* ── Aksen utama → biru jenama (#1061FF) ── */
  --color-accent-50:  #eaf1ff !important;
  --color-accent-100: #d6e4ff !important;
  --color-accent-200: #b7d2ff !important;
  --color-accent-300: #8bb4ff !important;
  --color-accent-400: #578bff !important;
  --color-accent-500: #2f6dff !important;
  --color-accent-600: #1061ff !important; /* butang / aktif */
  --color-accent-700: #0b4fd6 !important;
  --color-accent-800: #1140a8 !important;
  --color-accent-900: #143a85 !important;
  --color-accent-950: #0e2550 !important;

  /* ── Neutral 'cat' → latar navy gelap + kelabu terang ── */
  --color-cat-50:  #f2f4f7 !important; /* latar terang */
  --color-cat-700: #1c3a5e !important;
  --color-cat-750: #143152 !important; /* kad / hover gelap */
  --color-cat-800: #0f2643 !important;
  --color-cat-900: #0b1d36 !important; /* latar utama gelap */
}

/* ── Aksesori jenama: cyan & mint untuk highlight terpilih ── */
:root {
  --brand-cyan: #00b8d3;
  --brand-mint: #52d6b5;
  --brand-blue: #1061ff;
  --brand-navy: #0b1d36;
}

/* Suapan "WS - Connected" & lencana status hijau → mint jenama (pilihan halus) */
/* (dibiarkan default; hanya pemboleh ubah di atas mengubah keseluruhan tema) */

/* ============================================================
   TYPOGRAPHY — Space Grotesk (font jenama)
   ============================================================ */
:root,
html,
html.lazy {
  --font-sans: "Space Grotesk", "Inter", ui-sans-serif, system-ui, sans-serif !important;
  --default-font-family: "Space Grotesk", "Inter", ui-sans-serif, system-ui, sans-serif !important;
}

body,
button,
input,
select,
textarea,
.font-sans {
  font-family: "Space Grotesk", "Inter", ui-sans-serif, system-ui, sans-serif !important;
}