:root{
  --ng-primary:#c0392b;
  --ng-primary-dark:#a5281c;
  --ng-navy:#1f3a5f;
  --ng-bg:#f4f6f9;
}
body{background:var(--ng-bg);}

/* ---------- Navbar ---------- */
.ng-navbar{background:linear-gradient(90deg,var(--ng-navy),#26456e);box-shadow:0 2px 10px rgba(0,0,0,.15);}
.ng-navbar .navbar-brand{letter-spacing:.3px;}
.ng-accent{color:#ff8a75;}
.ng-navbar .nav-link{color:rgba(255,255,255,.82);border-radius:.4rem;padding:.4rem .7rem!important;}
.ng-navbar .nav-link:hover{color:#fff;background:rgba(255,255,255,.10);}
.ng-navbar .nav-link.active{color:#fff;background:rgba(255,255,255,.18);font-weight:600;}
.ng-badge-role{background:var(--ng-primary);font-weight:500;font-size:.68rem;vertical-align:middle;}
/* Bande tricolore du Senegal (vert-jaune-rouge) avec etoile verte centree */
.ng-flag-stripe{position:relative;height:9px;
  background:linear-gradient(90deg,#00853f 0 33.33%,#fdef42 33.33% 66.66%,#e31b23 66.66% 100%);
  box-shadow:0 1px 4px rgba(0,0,0,.12);}
.ng-flag-stripe::after{content:"\2605";position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%);color:#00853f;font-size:9px;line-height:1;pointer-events:none;}

/* ---------- Buttons / accents ---------- */
.ng-btn-primary{background:var(--ng-primary);border:none;color:#fff;}
.ng-btn-primary:hover{background:var(--ng-primary-dark);color:#fff;}
.text-ng{color:var(--ng-primary)!important;}
a{ text-decoration:none; }

/* ---------- Cards / KPI ---------- */
.ng-kpi{border:none;border-radius:.8rem;box-shadow:0 3px 12px rgba(31,58,95,.08);}
.ng-kpi .kpi-value{font-size:2.1rem;font-weight:700;line-height:1;}
.ng-kpi .kpi-icon{font-size:1.6rem;opacity:.85;}
.card{border:none;border-radius:.8rem;box-shadow:0 3px 12px rgba(31,58,95,.07);}
.card-header{background:#fff;border-bottom:1px solid #eef1f5;font-weight:600;color:var(--ng-navy);border-radius:.8rem .8rem 0 0!important;}

/* ---------- Section title ---------- */
.ng-page-title{color:var(--ng-navy);font-weight:700;}
.ng-page-title .bi{color:var(--ng-primary);}

/* ---------- Triage levels ---------- */
.tri-dot{display:inline-block;width:.85rem;height:.85rem;border-radius:50%;vertical-align:middle;}
.tri-1{background:#c0392b;} .tri-2{background:#e67e22;} .tri-3{background:#f1c40f;} .tri-4{background:#27ae60;}

/* ---------- Tables ---------- */
.table thead th{background:#eef2f7;color:var(--ng-navy);border-bottom:2px solid #dfe6ef;font-size:.85rem;text-transform:uppercase;letter-spacing:.3px;}
.table td{vertical-align:middle;}

/* ---------- Footer ---------- */
.ng-footer{background:#fff;border-top:1px solid #e7ebf1;color:#6b7280;}

/* ---------- Auth page ---------- */
.ng-auth-body{background:linear-gradient(135deg,#1f3a5f 0%,#c0392b 140%);min-height:100vh;}
.ng-auth-wrap{max-width:440px;margin:0 auto;padding:5vh 1rem;}
.ng-auth-card{background:#fff;border-radius:1rem;padding:2.2rem;}
.ng-auth-logo{width:66px;height:66px;margin:0 auto .6rem;border-radius:50%;background:var(--ng-primary);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:2rem;}
.ng-demo{background:#f7f9fc;border:1px dashed #d4dbe6;border-radius:.6rem;padding:.9rem;}
.ng-demo code{color:var(--ng-primary);}

/* ---------- Map ---------- */
#map{height:72vh;border-radius:.8rem;box-shadow:0 3px 12px rgba(31,58,95,.10);}
.legend{background:#fff;padding:8px 12px;border-radius:.5rem;box-shadow:0 1px 6px rgba(0,0,0,.2);font-size:.82rem;line-height:1.6;}
.legend .dot{display:inline-block;width:.8rem;height:.8rem;border-radius:50%;margin-right:.35rem;vertical-align:middle;}