/* Tema Biru (key visual "Satu sistem, semua terhubung"). Hanya warna, font, radius, bayangan. Tata letak tidak diubah. */
:root{
  --navy:#162868; --blue:#2563EB; --blue-light:#60A5FA; --blue-dark:#1D4ED8;
  --ink:#1E293B; --ink-2:#64748B; --ink-3:#66768C; --line:#E2E8F5; --line-2:#EDF1FA; --bg:#FFFFFF; --card:#fff;
  --deep:#162868; --deep-2:#1D4ED8; --teal:#2563EB; --teal-2:#1D4ED8; --mint:#EAF1FE; --mint-2:#CFE0FC; --sun:#2563EB;
  --green:#14825A; --green-bg:#E6F5EE; --red:#DC2626; --red-bg:#FDECEC;
  --r:20px; --shadow-card:0 10px 30px rgba(var(--accent-rgb,30,64,175),.08);
  --sans:'Inter',system-ui,sans-serif; --head:'Poppins','Inter',system-ui,sans-serif;
  --ag-group:#2563EB;
}
h1,h2,h3,.top h1,.brand-text b,.horizon h2{font-family:var(--head);color:var(--navy)}
.horizon h2{color:#fff}
.top h1{font-weight:700}
:focus-visible{outline-color:var(--blue)}

/* sidebar: putih, item aktif biru tipis dengan indikator biru */
.side{background:#fff;color:var(--ink);border-right:1px solid var(--line)}
.brand-text b{color:var(--navy)}
.brand-text span{color:var(--ink-2);letter-spacing:.1em;text-transform:uppercase;font-size:10.5px;font-weight:500}
.nav-label{color:var(--ink-2)}
.nav a,.nav-parent{color:var(--ink)}
@media (hover:hover) and (pointer:fine){.nav a:hover,.nav-parent:hover{background:var(--wash,#F3F6FC)}}
.nav a[aria-current=page]{background:var(--mint,#EAF1FE);color:var(--blue);font-weight:600}
.nav a[aria-current=page]::before{background:var(--blue)}
.nav-parent.has-current{color:var(--navy)}
.nav-parent:focus-visible,.nav a:focus-visible{outline-color:var(--blue)}
.sub-nav::before{background:var(--line)}
.sub-nav a[aria-current=page] .dot-i{background:var(--blue)}
.soon{background:#EEF1F7;color:var(--ink-2)}
.side-foot{border-top:1px solid var(--line)}
.collapse-btn{color:var(--ink-2)}
@media (hover:hover) and (pointer:fine){.collapse-btn:hover{background:var(--wash,#F3F6FC);color:var(--blue)}}

/* header */
.top{background:rgba(255,255,255,.9);border-bottom:1px solid var(--line)}
@media (hover:hover) and (pointer:fine){.icon-btn:hover,.user-btn:hover{background:var(--mint,#EAF1FE);color:var(--blue)}}
.avatar{background:linear-gradient(150deg,var(--blue-light),var(--blue-dark))}
.pop{box-shadow:0 24px 60px rgba(var(--accent-rgb,30,64,175),.18);border-radius:20px}
.notif.unread{background:var(--wash,#F3F7FE)}

/* tombol, input, pill */
.btn{border-radius:999px}
.btn.primary{background:var(--blue);border-color:var(--blue)}
@media (hover:hover) and (pointer:fine){.btn.primary:hover{background:var(--blue-dark);border-color:var(--blue-dark)}}
.field input,.field select,.field textarea,.toolbar select,.cell{border-color:var(--line);border-radius:12px}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--blue);outline-offset:0;border-color:var(--blue)}

/* kartu: bayangan lembut */
.panel,.card,.kpi,.stat,.tile,.ctile,.tbl-wrap,.agenda,.activity{box-shadow:var(--shadow-card)}
.toast{background:var(--navy)}
.layer .drawer,.layer .modal{box-shadow:0 24px 60px rgba(var(--accent-rgb,30,64,175),.2)}

/* header tabel */
th{background:var(--wash,#F3F6FC);color:var(--ink-2)}

/* hero Home: tetap pemandangan dengan waktu, warnanya digeser ke biru */
.t-day{--sky-a:var(--hero-a,#1D4ED8);--sky-b:var(--hero-b,#60A5FA);--sky-c:var(--hero-c,#DBEAFE);--mount:var(--hero-mount,#162868);--hill:var(--hero-hill,#1E40AF);--sea:var(--hero-sea,#2563EB)}
.t-dawn{--sky-a:var(--hero-dawn-a,#4F5FB5);--mount:var(--hero-dawn-mount,#1E2A63);--hill:var(--hero-dawn-hill,#1E3A8A);--sea:var(--hero-dawn-sea,#1D4ED8)}
.t-dusk{--sky-a:var(--hero-dusk-a,#2E3A8C);--mount:var(--hero-dusk-mount,#1B2358);--hill:var(--hero-dusk-hill,#1E3A8A);--sea:var(--hero-dusk-sea,#1E40AF)}
.t-night{--sky-a:var(--hero-night-a,#0A1433);--sky-b:var(--hero-night-b,#14306B);--sky-c:var(--hero-night-c,#1E4A9A);--mount:var(--hero-night-mount,#060D26);--hill:var(--hero-night-hill,#0B2150);--sea:var(--hero-night-sea,#0A1B45)}

/* detail */
.brand-mark{border:1px solid var(--line);box-shadow:var(--shadow-card)}
.strip .n,.fig .n{color:var(--navy);font-family:var(--head)}
.seg{background:#EEF2FA;border-radius:999px}
.seg button{border-radius:999px}
.seg button[aria-pressed=true]{background:var(--blue);color:#fff;box-shadow:none}

/* ---- token tambahan untuk dock & mode gelap (terang = nilai tema biru) ---- */
:root{--surface:#fff;--surface-2:#F4F7FC;--tint:#EAF1FE;--warn-bg:#FBEBCB;--bad-bg:#F8DDD9;--active-bg:#EAF1FE;--plate:rgba(255,255,255,.78);--top-bg:rgba(255,255,255,.9);--scrim:rgba(15,23,60,.42);--tip-bg:#162868;--tip-ink:#fff;--field:#fff}