/* ==========================================================================
   eATOM — Design Tokens
   Sistem Aplikasi Jabatan Tenaga Atom
   --------------------------------------------------------------------------
   Satu-satunya tempat untuk menukar identiti visual sistem.
   Semua fail CSS lain HANYA menggunakan token di bawah.
   ========================================================================== */

:root {
  /* ---------- Brand ---------- */
  --atom-primary:            #A21A0B;
  --atom-primary-600:        #BC2010;
  --atom-primary-700:        #8C1709;
  --atom-primary-800:        #751307;
  --atom-primary-900:        #560E05;
  --atom-primary-light:      #FDF1EF;
  --atom-primary-soft:       #F8DAD5;

  --atom-accent:             #17365D;
  --atom-accent-dark:        #102748;
  --atom-accent-light:       #EDF3FA;

  /* ---------- Status ---------- */
  --atom-success:            #15803D;
  --atom-success-light:      #E9F7EE;
  --atom-warning:            #B45309;
  --atom-warning-light:      #FDF3E7;
  --atom-danger:             #B91C1C;
  --atom-danger-light:       #FDECEC;
  --atom-info:               #1D6FB8;
  --atom-info-light:         #EAF3FB;
  --atom-neutral:            #475569;
  --atom-neutral-light:      #F1F5F9;

  /* ---------- Surface ---------- */
  --atom-body:               #F5F7FA;
  --atom-card:               #FFFFFF;
  --atom-surface-alt:        #F8FAFC;
  --atom-surface-sunken:     #EEF2F7;
  --atom-border:             #E2E8F0;
  --atom-border-strong:      #CBD5E1;
  --atom-border-subtle:      #EDF1F6;

  /* ---------- Ink ---------- */
  --atom-text:               #172033;
  --atom-text-secondary:     #475569;
  --atom-text-muted:         #7A879B;
  --atom-text-inverse:       #FFFFFF;

  /* ---------- Sidebar ---------- */
  --atom-sidebar-bg:         #58100A;
  --atom-sidebar-bg-alt:     #470C07;
  --atom-sidebar-text:       #E2C6C1;
  --atom-sidebar-text-hover: #FFFFFF;
  --atom-sidebar-active-bg:  rgba(255, 255, 255, .11);
  --atom-sidebar-hover-bg:   rgba(255, 255, 255, .07);
  --atom-sidebar-border:     rgba(255, 255, 255, .10);
  --atom-sidebar-heading:    #C29A93;
  --atom-sidebar-accent:     #E8A33D;
  --atom-sidebar-accent-ink: #4A0D06;

  /* ---------- Chart (validated: OKLCH band, chroma floor, CVD ΔE, contrast) ---------- */
  --atom-chart-1:            #C2410C;
  --atom-chart-2:            #2A6FB0;
  --atom-chart-1-soft:       rgba(194, 65, 12, .12);
  --atom-chart-2-soft:       rgba(42, 111, 176, .12);
  --atom-chart-grid:         #EDF1F6;
  --atom-chart-axis:         #7A879B;

  /* ---------- Layout metrics ---------- */
  --atom-sidebar-width:      272px;
  --atom-sidebar-collapsed:  76px;
  --atom-navbar-height:      64px;
  --atom-content-max:        1440px;
  --atom-gutter:             1.5rem;

  /* ---------- Radius ---------- */
  --atom-radius-sm:          6px;
  --atom-radius:             8px;
  --atom-radius-md:          10px;
  --atom-radius-lg:          14px;
  --atom-radius-pill:        999px;

  /* ---------- Elevation (halus sahaja — elak shadow tebal) ---------- */
  --atom-shadow-xs:          0 1px 2px rgba(74, 22, 12, .05);
  --atom-shadow-sm:          0 1px 3px rgba(15, 38, 71, .06), 0 1px 2px rgba(74, 22, 12, .05);
  --atom-shadow-md:          0 4px 12px rgba(74, 22, 12, .09);
  --atom-shadow-lg:          0 12px 32px rgba(74, 22, 12, .13);
  --atom-shadow-focus:       0 0 0 3px rgba(162, 26, 11, .15);

  /* ---------- Type ---------- */
  --atom-font: "Inter", "Public Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --atom-fs-xs:              .75rem;    /* 12px */
  --atom-fs-sm:              .8125rem;  /* 13px */
  --atom-fs-base:            .875rem;   /* 14px */
  --atom-fs-md:              .9375rem;  /* 15px */
  --atom-fs-lg:              1.0625rem; /* 17px */
  --atom-fs-xl:              1.25rem;   /* 20px */
  --atom-fs-2xl:             1.5rem;    /* 24px */
  --atom-fs-3xl:             1.875rem;  /* 30px */

  /* ---------- Motion (minimal) ---------- */
  --atom-transition:         160ms cubic-bezier(.4, 0, .2, 1);
  --atom-transition-slow:    240ms cubic-bezier(.4, 0, .2, 1);

  /* ---------- Bootstrap override bridge ---------- */
  --bs-body-bg:              var(--atom-body);
  --bs-body-color:           var(--atom-text);
  --bs-body-font-family:     var(--atom-font);
  --bs-body-font-size:       var(--atom-fs-base);
  --bs-border-color:         var(--atom-border);
  --bs-border-radius:        var(--atom-radius);
  --bs-primary:              #A21A0B;
  --bs-primary-rgb:          162, 26, 11;
  --bs-link-color:           #A21A0B;
  --bs-link-color-rgb:       162, 26, 11;
  --bs-link-hover-color:     #751307;
  --bs-focus-ring-color:     rgba(162, 26, 11, .18);
}

/* Kurangkan animasi untuk pengguna yang memilih reduced-motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}
