/* ==========================================================================
   NXTG - tokens.css
   Font self-host + semantic tokens + pemetaan ke variabel Bootstrap 5.3.8.
   Pola visual mengikuti referensi (latar angkasa, partikel, cahaya planet,
   kartu bergaris tipis), tetapi WARNA tetap identitas NXTG: biru brand
   #006FFF, primary #005CE0, navy #14294F, hitam #0B0F14, putih - plus lima
   aksen divisi (config/nxtg.php). Tidak ada ungu/cyan milik referensi.
   Light = default dari server (data-bs-theme="light"), dark = pilihan user.
   ========================================================================== */

/* ---- Font (OFL-1.1, @fontsource 5.3.0, subset latin) --------------------- */
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:500;font-display:swap;src:url('../../fonts/plus-jakarta-sans/5.3.0/plus-jakarta-sans-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:600;font-display:swap;src:url('../../fonts/plus-jakarta-sans/5.3.0/plus-jakarta-sans-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:700;font-display:swap;src:url('../../fonts/plus-jakarta-sans/5.3.0/plus-jakarta-sans-latin-700-normal.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:800;font-display:swap;src:url('../../fonts/plus-jakarta-sans/5.3.0/plus-jakarta-sans-latin-800-normal.woff2') format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400;font-display:swap;src:url('../../fonts/dm-sans/5.3.0/dm-sans-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:500;font-display:swap;src:url('../../fonts/dm-sans/5.3.0/dm-sans-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:600;font-display:swap;src:url('../../fonts/dm-sans/5.3.0/dm-sans-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:700;font-display:swap;src:url('../../fonts/dm-sans/5.3.0/dm-sans-latin-700-normal.woff2') format('woff2')}

/* ---- Token yang sama di kedua tema ---------------------------------------- */
:root{
  --nxtg-font-display:'Plus Jakarta Sans',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --nxtg-font-body:'DM Sans',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;

  /* ---- Skala tipografi: SATU sumber ukuran teks -------------------------
     Sebelumnya ada 32 nilai font-size berbeda tersebar di components.css &
     pages.css, termasuk LIMA formula clamp() judul kartu yang nyaris sama
     (1.2->1.45, 1.3->1.65, 1.3->1.75, 1.45->1.9, 1.1->1.4rem). Beda kecil itu
     tidak terbaca sebagai variasi yang disengaja, hanya sebagai "font tidak
     rapi" - apalagi tiap clamp punya kemiringan vw sendiri, jadi urutan besar
     antar-judul BERUBAH mengikuti lebar layar. Enam langkah di bawah memakai
     satu keluarga formula; komponen memilih langkah, bukan menulis angka. */
  --nxtg-fs-micro:.75rem;      /* 12px - teks legal, hitungan kecil */
  --nxtg-fs-meta:.8125rem;     /* 13px - pill, tahun, penghitung tab */
  --nxtg-fs-caption:.875rem;   /* 14px - keterangan, meta kartu */
  --nxtg-fs-sm:.9375rem;       /* 15px - ringkasan kartu, teks sekunder */
  --nxtg-fs-base:1.0625rem;    /* 17px - isi (= --bs-body-font-size) */
  --nxtg-fs-md:1.125rem;       /* 18px - isi menonjol */
  --nxtg-fs-lead:clamp(1.0625rem,1rem + .3vw,1.25rem);

  /* Judul - satu keluarga formula, kemiringan naik bertahap agar URUTAN
     besarnya tetap sama di semua lebar layar. */
  --nxtg-fs-title-xs:clamp(1.0625rem,1.01rem + .24vw,1.2rem);
  --nxtg-fs-title-sm:clamp(1.125rem,1.06rem + .3vw,1.3rem);
  --nxtg-fs-title-md:clamp(1.2rem,1.11rem + .42vw,1.45rem);
  --nxtg-fs-title-lg:clamp(1.35rem,1.19rem + .72vw,1.75rem);
  --nxtg-fs-h2:clamp(1.75rem,1.33rem + 1.9vw,3rem);
  --nxtg-fs-h1:clamp(2rem,1.55rem + 2.05vw,3.6rem);
  --nxtg-fs-display:clamp(2.25rem,1.72rem + 2.4vw,4.5rem);

  /* Tinggi baris berpasangan dengan langkah di atas (judul rapat, isi lega). */
  --nxtg-lh-tight:1.14;
  --nxtg-lh-title:1.25;
  --nxtg-lh-body:1.7;

  --nxtg-radius-control:8px;
  --nxtg-radius-card:14px;
  --nxtg-radius-panel:24px;
  --nxtg-ease:cubic-bezier(.22,1,.36,1);

  --nxtg-header-h:76px;
  --nxtg-section-y:clamp(3.75rem,2rem + 5.6vw,7rem); /* 60px mobile -> 112px desktop */

  /* Gradasi tombol utama dari biru NXTG (teks putih; #005CE0 = 5.82:1). */
  --nxtg-grad-btn:linear-gradient(120deg,#2B86FF 0%,#005CE0 55%,#004CB8 100%);
  --nxtg-grad-btn-hover:linear-gradient(120deg,#1A78F5 0%,#004CB8 55%,#003E99 100%);

  /* z-index mengikuti skala Bootstrap (dropdown 1000, sticky 1020,
     fixed 1030, offcanvas 1045, modal 1055). Tombol WA = level fixed. */
  --nxtg-z-float:1030;

  --bs-font-sans-serif:var(--nxtg-font-body);
  --bs-body-font-family:var(--nxtg-font-body);
  --bs-body-font-size:var(--nxtg-fs-base);
  --bs-body-line-height:var(--nxtg-lh-body);
  --bs-border-radius:8px;
  --bs-border-radius-sm:6px;
  --bs-border-radius-lg:14px;
  --bs-border-radius-xl:24px;
  --bs-border-radius-xxl:24px;
  --bs-focus-ring-width:2px;
}
@media (min-width:992px){:root{--nxtg-header-h:88px}}

/* ---- LIGHT (default) ------------------------------------------------------
   Putih NXTG + tint #EEF4FF sebagai "awan" biru, kartu putih berbayang lembut,
   kata kunci judul bergradasi brand -> navy. */
:root,[data-bs-theme=light]{
  color-scheme:light;
  --nxtg-brand:#006FFF;
  --nxtg-primary:#005CE0;         /* link & teks aksen. 5.82:1 di putih */
  --nxtg-primary-hover:#004CB8;   /* 7.70:1 */
  --nxtg-accent:#006FFF;          /* garis, ikon, dekorasi */
  --nxtg-accent-soft:#EEF4FF;
  --nxtg-bg:#FFFFFF;
  --nxtg-bg-alt:#F6F8FB;
  --nxtg-bg-deep:#EEF4FF;
  --nxtg-surface:#FFFFFF;
  --nxtg-surface-2:#F6F8FB;
  --nxtg-text:#0B0F14;            /* 19.22:1 */
  --nxtg-text-muted:#57616F;      /* 6.28:1 putih - 5.69:1 tint */
  --nxtg-border:#E4E8EE;
  --nxtg-border-strong:#CBD3DE;
  --nxtg-control-border:#57616F;  /* batas input 6.28:1 */
  --nxtg-focus:#005CE0;
  --nxtg-on-primary:#FFFFFF;
  --nxtg-heading-grad:linear-gradient(95deg,#006FFF 0%,#005CE0 45%,#14294F 100%); /* 4.45-14.4:1, hanya judul besar */
  --nxtg-card-bg:#FFFFFF;
  --nxtg-card-border:#E4E8EE;
  --nxtg-card-shadow:0 24px 48px -30px rgba(20,41,79,.30),0 2px 6px -2px rgba(20,41,79,.06);
  --nxtg-card-shadow-hover:0 34px 60px -30px rgba(20,41,79,.40),0 2px 8px -2px rgba(20,41,79,.08);
  --nxtg-glow-1:rgba(0,111,255,.14);
  --nxtg-glow-2:rgba(0,111,255,.10);
  --nxtg-glow-3:rgba(20,41,79,.08);
  --nxtg-particle:0,111,255;      /* rgb partikel kanvas = brand */
  --nxtg-topo:rgba(0,92,224,.10);
  --nxtg-header-bg:rgba(255,255,255,.84);
  --nxtg-shadow-float:0 16px 36px -14px rgba(11,15,20,.35);

  --nxtg-success-text:#146C43;--nxtg-success-bg:#EAF6EF;  /* 5.81:1 */
  --nxtg-warning-text:#795700;--nxtg-warning-bg:#FFF5D6;  /* 6.07:1 */
  --nxtg-danger-text:#B42318;--nxtg-danger-bg:#FFF1F0;    /* 5.98:1 */
  --nxtg-info-text:#004CB8;--nxtg-info-bg:#EEF4FF;        /* 6.98:1 */

  /* Pemetaan Bootstrap */
  --bs-body-color:#0B0F14;--bs-body-color-rgb:11,15,20;
  --bs-body-bg:#FFFFFF;--bs-body-bg-rgb:255,255,255;
  --bs-emphasis-color:#0B0F14;--bs-emphasis-color-rgb:11,15,20;
  --bs-secondary-color:#57616F;--bs-secondary-color-rgb:87,97,111;
  --bs-secondary-bg:#F6F8FB;--bs-secondary-bg-rgb:246,248,251;
  --bs-tertiary-color:#57616F;--bs-tertiary-color-rgb:87,97,111;
  --bs-tertiary-bg:#F6F8FB;--bs-tertiary-bg-rgb:246,248,251;
  --bs-heading-color:#0B0F14;
  --bs-link-color:#005CE0;--bs-link-color-rgb:0,92,224;
  --bs-link-hover-color:#004CB8;--bs-link-hover-color-rgb:0,76,184;
  --bs-border-color:#E4E8EE;--bs-border-color-translucent:rgba(11,15,20,.1);
  --bs-primary:#005CE0;--bs-primary-rgb:0,92,224;
  --bs-primary-text-emphasis:#004CB8;--bs-primary-bg-subtle:#EEF4FF;--bs-primary-border-subtle:#B9D3FF;
  --bs-secondary:#14294F;--bs-secondary-rgb:20,41,79;
  --bs-success-text-emphasis:#146C43;--bs-success-bg-subtle:#EAF6EF;--bs-success-border-subtle:#9FD3B6;
  --bs-warning-text-emphasis:#795700;--bs-warning-bg-subtle:#FFF5D6;--bs-warning-border-subtle:#EBCB6B;
  --bs-danger-text-emphasis:#B42318;--bs-danger-bg-subtle:#FFF1F0;--bs-danger-border-subtle:#F2B8B2;
  --bs-info-text-emphasis:#004CB8;--bs-info-bg-subtle:#EEF4FF;--bs-info-border-subtle:#B9D3FF;
  --bs-focus-ring-color:rgba(0,92,224,.45);
  --bs-form-valid-color:#146C43;--bs-form-valid-border-color:#146C43;
  --bs-form-invalid-color:#B42318;--bs-form-invalid-border-color:#B42318;
  --bs-highlight-bg:#FFF5D6;
}

/* ---- DARK (pilihan pengguna) ----------------------------------------------
   Hitam NXTG #0B0F14 + navy #14294F sebagai cahaya angkasa, partikel biru
   muda, kartu transparan bergaris tipis. */
[data-bs-theme=dark]{
  color-scheme:dark;
  --nxtg-brand:#006FFF;
  --nxtg-primary:#66A8FF;         /* link di #0B0F14 7.88:1 */
  --nxtg-primary-hover:#8BBDFF;   /* 9.90:1 */
  --nxtg-accent:#66A8FF;
  --nxtg-accent-soft:rgba(102,168,255,.12);
  --nxtg-bg:#0B0F14;
  --nxtg-bg-alt:#101720;
  --nxtg-bg-deep:#14294F;         /* navy - banner & cahaya, dipakai hemat */
  --nxtg-surface:#151B23;
  --nxtg-surface-2:#1D2733;
  --nxtg-text:#FFFFFF;
  --nxtg-text-muted:#A7B2BE;      /* >= 6.68:1 di semua permukaan gelap */
  --nxtg-border:#2C394A;
  --nxtg-border-strong:#3B4A5E;
  --nxtg-control-border:#A7B2BE;  /* 8.04:1 di surface */
  --nxtg-focus:#66A8FF;
  --nxtg-on-primary:#FFFFFF;
  --nxtg-heading-grad:linear-gradient(95deg,#B7D6FF 0%,#66A8FF 45%,#2E86FF 100%);
  --nxtg-card-bg:linear-gradient(180deg,rgba(29,39,51,.62),rgba(21,27,35,.62));
  --nxtg-card-border:rgba(167,178,190,.14);
  --nxtg-card-shadow:none;
  --nxtg-card-shadow-hover:0 0 0 1px rgba(102,168,255,.32),0 30px 60px -30px rgba(0,111,255,.42);
  --nxtg-glow-1:rgba(0,111,255,.26);
  --nxtg-glow-2:rgba(20,41,79,.85);
  --nxtg-glow-3:rgba(0,92,224,.18);
  --nxtg-particle:175,210,255;
  --nxtg-topo:rgba(102,168,255,.14);
  --nxtg-header-bg:rgba(11,15,20,.8);
  --nxtg-shadow-float:0 16px 36px -14px rgba(0,0,0,.75);

  --nxtg-success-text:#8ED8AE;--nxtg-success-bg:#10291D;  /* 9.27:1 */
  --nxtg-warning-text:#F4D477;--nxtg-warning-bg:#2A230F;  /* 10.80:1 */
  --nxtg-danger-text:#FFB4AB;--nxtg-danger-bg:#331A1A;    /* 9.49:1 */
  --nxtg-info-text:#8BBDFF;--nxtg-info-bg:#14294F;        /* 7.41:1 */

  --bs-body-color:#FFFFFF;--bs-body-color-rgb:255,255,255;
  --bs-body-bg:#0B0F14;--bs-body-bg-rgb:11,15,20;
  --bs-emphasis-color:#FFFFFF;--bs-emphasis-color-rgb:255,255,255;
  --bs-secondary-color:#A7B2BE;--bs-secondary-color-rgb:167,178,190;
  --bs-secondary-bg:#151B23;--bs-secondary-bg-rgb:21,27,35;
  --bs-tertiary-color:#A7B2BE;--bs-tertiary-color-rgb:167,178,190;
  --bs-tertiary-bg:#101720;--bs-tertiary-bg-rgb:16,23,32;
  --bs-heading-color:#FFFFFF;
  --bs-link-color:#66A8FF;--bs-link-color-rgb:102,168,255;
  --bs-link-hover-color:#8BBDFF;--bs-link-hover-color-rgb:139,189,255;
  --bs-border-color:#2C394A;--bs-border-color-translucent:rgba(255,255,255,.12);
  --bs-primary:#66A8FF;--bs-primary-rgb:102,168,255;
  --bs-primary-text-emphasis:#8BBDFF;--bs-primary-bg-subtle:#14294F;--bs-primary-border-subtle:#2B4F86;
  --bs-secondary:#A7B2BE;--bs-secondary-rgb:167,178,190;
  --bs-success-text-emphasis:#8ED8AE;--bs-success-bg-subtle:#10291D;--bs-success-border-subtle:#2E6B4B;
  --bs-warning-text-emphasis:#F4D477;--bs-warning-bg-subtle:#2A230F;--bs-warning-border-subtle:#6B5A22;
  --bs-danger-text-emphasis:#FFB4AB;--bs-danger-bg-subtle:#331A1A;--bs-danger-border-subtle:#7A3A34;
  --bs-info-text-emphasis:#8BBDFF;--bs-info-bg-subtle:#14294F;--bs-info-border-subtle:#2B4F86;
  --bs-focus-ring-color:rgba(102,168,255,.5);
  --bs-form-valid-color:#8ED8AE;--bs-form-valid-border-color:#8ED8AE;
  --bs-form-invalid-color:#FFB4AB;--bs-form-invalid-border-color:#FFB4AB;
  --bs-highlight-bg:#2A230F;
}

/* ---- Aksen divisi ---------------------------------------------------------
   Nilai datang dari config/nxtg.php lewat inline style (helper division_vars):
   --div-light-accent (grafis), --div-light-strong (teks/tombol, >= 4.9:1 di
   putih/tint), --div-dark (teks/ikon di tema gelap, >= 6.19:1). */
.nxtg-div{
  --div-accent:var(--div-light-accent,#006FFF);
  --div-text:var(--div-light-strong,#005CE0);
}
[data-bs-theme=dark] .nxtg-div,
[data-bs-theme=dark].nxtg-div{
  --div-accent:var(--div-dark,#66A8FF);
  --div-text:var(--div-dark,#66A8FF);
}
/* Micro-site divisi: aksen divisi mengambil alih link & fokus. */
.nxtg-div-scope{
  --nxtg-primary:var(--div-text);
  --nxtg-accent:var(--div-accent);
  --nxtg-focus:var(--div-text);
  --bs-link-color:var(--div-text);
}
[data-bs-theme=dark] .nxtg-div-scope,
.nxtg-div-scope [data-bs-theme=dark]{
  --nxtg-primary:var(--div-dark,#66A8FF);
  --nxtg-accent:var(--div-dark,#66A8FF);
  --nxtg-focus:var(--div-dark,#66A8FF);
  --bs-link-color:var(--div-dark,#66A8FF);
}
