/* Tema mengikuti Pedoman Identitas Kementerian Kesehatan
   Turqoise #02B8A5 · Turqoise Medium #17BCCC · Turqoise Gelap #0B7D85
   Hijau-Kuning #D7DF23 · Abu-abu #6B6A68
   Font: VAG Rounded (pengganti web: Varela Round) + Segoe UI */
:root{
  --kemkes-dark:#0B7D85;
  --kemkes:#02B8A5;
  --kemkes-medium:#17BCCC;
  --kemkes-lime:#D7DF23;
  --kemkes-lime-dark:#A9B312;
  --kemkes-gray:#6B6A68;
  --ink:#23373a;
  --danger:#E5484D;
}
body{ background:#eef4f3; color:var(--ink);
  font-family:"Segoe UI",system-ui,Roboto,Arial,sans-serif; }
h1,h2,h3,h4,h5,.brand-font{ font-family:"Varela Round","Segoe UI",sans-serif; }

.app-navbar{ background:linear-gradient(90deg,var(--kemkes-dark) 0%,var(--kemkes) 55%,var(--kemkes-medium) 100%);
  box-shadow:0 2px 8px rgba(11,125,133,.25); }
.navbar-brand strong{ font-family:"Varela Round","Segoe UI",sans-serif; letter-spacing:.2px; }

.filter-bar{ background:#fff; border-bottom:2px solid var(--kemkes); position:sticky; top:0; z-index:20; }
.filter-bar .form-select{ min-width:150px; border-color:#cfe0df; }
.filter-bar .form-select:focus{ border-color:var(--kemkes); box-shadow:0 0 0 .2rem rgba(2,184,165,.18); }
.filter-bar .form-label{ color:var(--kemkes-gray); font-weight:600; }

.card{ border:none; border-radius:.7rem; box-shadow:0 1px 5px rgba(11,125,133,.08); }
.card-header{ background:#fff; border-bottom:1px solid #e6efee; font-weight:600; font-size:.92rem;
  color:var(--kemkes-dark); font-family:"Varela Round","Segoe UI",sans-serif; }

/* KPI cards */
.kpi{ border-radius:.7rem; background:#fff; padding:.85rem 1rem; box-shadow:0 1px 5px rgba(11,125,133,.10);
  border-left:5px solid var(--kemkes); height:100%; position:relative; }
.kpi .kpi-label{ font-size:.74rem; color:var(--kemkes-gray); text-transform:uppercase; letter-spacing:.3px; font-weight:700; }
.kpi .kpi-value{ font-size:1.6rem; font-weight:700; line-height:1.1; color:var(--ink);
  font-family:"Varela Round","Segoe UI",sans-serif; }
.kpi .kpi-sub{ font-size:.72rem; color:#8a96a3; }
.kpi .kpi-icon{ position:absolute; right:.7rem; top:.6rem; font-size:1.3rem; opacity:.20; color:var(--kemkes-dark); }
.kpi.dummy{ border-left-color:var(--kemkes-lime-dark); background:#fcfdf0; }
.kpi.c-blue{ border-left-color:var(--kemkes); }
.kpi.c-green{ border-left-color:var(--kemkes-medium); }
.kpi.c-teal{ border-left-color:var(--kemkes-dark); }
.kpi.c-purple{ border-left-color:var(--kemkes-gray); }
.kpi.c-orange{ border-left-color:var(--kemkes-lime-dark); }
.kpi.c-red{ border-left-color:var(--danger); }
.badge.dummy-badge{ position:absolute; right:.6rem; bottom:.5rem; }
.badge.bg-warning{ background:var(--kemkes-lime)!important; color:#4a4f00!important; }

.loading-overlay{ position:fixed; inset:0; background:rgba(255,255,255,.6); display:none;
  align-items:center; justify-content:center; z-index:1050; }
.loading-overlay.show{ display:flex; }
.loading-overlay .spinner-border{ color:var(--kemkes)!important; }

table#rs-table th{ font-size:.78rem; color:var(--kemkes-dark); }
table#rs-table td{ font-size:.82rem; }
table#rs-table tbody tr:hover{ background:#eafaf8; }
.table .badge.bg-light{ color:var(--kemkes-dark)!important; }
a, .text-primary{ color:var(--kemkes-dark); }
