/* ============================================================
   Kuwait GPS — "New Look" theme
   Loaded AFTER the app's inline styles, so it takes precedence.
   Backend logic & database schema are unchanged (backup-safe).
   ============================================================ */

:root{
  --gps-radius:14px;
  --gps-radius-sm:10px;
  --gps-border:rgba(15,23,42,.08);
  --gps-shadow-sm:0 1px 2px rgba(15,23,42,.06),0 2px 6px rgba(15,23,42,.06);
  --gps-shadow:0 12px 32px rgba(15,23,42,.12);
}

body{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }

/* ---------- Sidebar ---------- */
#SB{
  background:linear-gradient(180deg,var(--sbg) 0%,#0b1220 100%) !important;
  box-shadow:4px 0 24px rgba(0,0,0,.25);
}
#SB .brand{ padding:1.15rem 1.25rem; }
#SB .brand h5{ letter-spacing:.2px; }
#SB .nl{
  padding:.7rem 1.3rem .4rem;
  letter-spacing:.14em;
  font-size:.6rem;
  color:rgba(255,255,255,.34);
}
#SB a.lnk{
  margin:.12rem .7rem;
  padding:.52rem .85rem;
  border-radius:10px;
  border-left:3px solid transparent;
  font-weight:500;
  color:rgba(255,255,255,.66);
}
#SB a.lnk:hover{ background:rgba(255,255,255,.08); color:#fff; }
#SB a.lnk.on{
  background:linear-gradient(90deg,rgba(255,255,255,.16),rgba(255,255,255,.05));
  border-left-color:var(--pri);
  color:#fff;
  font-weight:600;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);
}
#SB a.lnk i{ opacity:.92; }
#SB .sbu{ border-top:1px solid rgba(255,255,255,.1); }

/* ---------- Topbar ---------- */
#TB{
  background:rgba(255,255,255,.88) !important;
  backdrop-filter:blur(12px) saturate(160%);
  -webkit-backdrop-filter:blur(12px) saturate(160%);
  box-shadow:0 1px 0 rgba(15,23,42,.05),0 6px 24px rgba(15,23,42,.05);
  min-height:58px;
}

/* ---------- Wrapper / page ---------- */
#WR{ background:linear-gradient(180deg,#f8fafc 0%,#eef2f7 100%); }
.pw{ padding:1.5rem; }

/* ---------- Cards ---------- */
.card{
  border-radius:var(--gps-radius) !important;
  border:1px solid var(--gps-border) !important;
  box-shadow:var(--gps-shadow-sm);
}
.card-header,.card-footer{ background:transparent; border-color:var(--gps-border); }

/* stat icon boxes */
.ic{
  border-radius:12px;
  background:rgba(100,116,139,.12);
  color:var(--pri);
}

/* ---------- Buttons ---------- */
.btn{ border-radius:var(--gps-radius-sm) !important; font-weight:600; }
.btn-primary{ box-shadow:0 6px 16px rgba(15,23,42,.18); }
.btn-primary:hover{ filter:brightness(1.06); }

/* ---------- Badges ---------- */
.badge{ border-radius:999px !important; font-weight:600; padding:.45em .8em; letter-spacing:.2px; }

/* ---------- Forms ---------- */
.form-control,.form-select{ border-radius:var(--gps-radius-sm) !important; border-color:rgba(15,23,42,.14); }
.form-control:focus,.form-select:focus{ border-color:var(--pri); box-shadow:0 0 0 3px rgba(37,99,235,.15); }
.input-group-text{ border-radius:var(--gps-radius-sm) !important; }

/* ---------- Tables ---------- */
.table thead th{
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:#64748b;
  background:#f8fafc;
  border-bottom:1px solid var(--gps-border);
}
.table-hover tbody tr:hover{ background-color:rgba(15,23,42,.025); }

/* ---------- Modals / dropdowns ---------- */
.modal-content{ border-radius:var(--gps-radius) !important; border:1px solid var(--gps-border); }
.dropdown-menu{ border-radius:var(--gps-radius-sm); box-shadow:var(--gps-shadow); border:1px solid var(--gps-border); }

/* ---------- Login ---------- */
.lc{ border-radius:20px !important; border:1px solid rgba(255,255,255,.55); box-shadow:0 30px 90px rgba(0,0,0,.5) !important; }
.btn-pri{ border-radius:12px !important; }

/* ---------- Dark mode refinements ---------- */
[data-theme=dark] #WR{ background:linear-gradient(180deg,#0b1220,#0f172a); }
[data-theme=dark] #TB{ background:rgba(30,41,59,.9) !important; }
[data-theme=dark] .card{ border-color:rgba(255,255,255,.08) !important; }
[data-theme=dark] .table thead th{ background:#1e293b; color:#94a3b8; }

/* ---------- Scrollbar ---------- */
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-thumb{ background:#cbd5e1; border-radius:6px; border:2px solid transparent; background-clip:content-box; }
::-webkit-scrollbar-thumb:hover{ background:#94a3b8; background-clip:content-box; }

/* ============================================================
   v9.7.30 — BOLD PROFESSIONAL UPGRADE (New Look only)
   ============================================================ */
body, h1, h2, h3, h4, h5, h6, .fw-bold{ font-family:'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important; }
body{ letter-spacing:.1px; }

/* richer gradient sidebar */
#SB{
  background:linear-gradient(180deg, var(--sbg) 0%, #1e293b 42%, #0b1220 100%) !important;
  box-shadow:6px 0 30px rgba(15,23,42,.28);
  border-right:1px solid rgba(255,255,255,.07);
}
#SB .brand{ padding:1.3rem 1.3rem; border-bottom:1px solid rgba(255,255,255,.09); }
#SB .brand h5{ font-weight:800; letter-spacing:.2px; }
#SB .nl{ color:rgba(255,255,255,.42); letter-spacing:.18em; font-size:.56rem; font-weight:800; padding:.9rem 1.35rem .4rem; }
#SB a.lnk{ margin:.16rem .8rem; padding:.6rem .95rem; border-radius:11px; font-weight:600; }
#SB a.lnk.on{ background:linear-gradient(90deg, rgba(255,255,255,.2), rgba(255,255,255,.05)); box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); }
#SB .sbu{ border-top:1px solid rgba(255,255,255,.12); }

/* page background */
#WR{ background:linear-gradient(180deg,#f8fafc 0%, #eef2f7 100%); }

/* elevated topbar */
#TB{ background:rgba(255,255,255,.92) !important; backdrop-filter:blur(16px) saturate(180%); box-shadow:0 1px 0 rgba(15,23,42,.05), 0 10px 34px rgba(15,23,42,.06); min-height:62px; padding:.6rem 1.3rem !important; }

/* soft elevated cards */
.card{ border-radius:18px !important; border:1px solid var(--gps-border) !important; box-shadow:0 1px 2px rgba(15,23,42,.04), 0 4px 16px rgba(15,23,42,.06); transition:box-shadow .2s ease, transform .2s ease; }
.card:hover{ box-shadow:0 12px 36px rgba(15,23,42,.12); }

/* gradient primary buttons */
.btn{ border-radius:10px !important; font-weight:600; }
.btn-primary{ background:linear-gradient(135deg, var(--pri), #1d4ed8) !important; border:none !important; box-shadow:0 6px 18px rgba(37,99,235,.3); }
.btn-primary:hover{ filter:brightness(1.07); transform:translateY(-1px); }

/* pill badges */
.badge{ border-radius:999px !important; font-weight:700; padding:.45em .85em; }

/* modern tables */
.table thead th{ background:#f8fafc; text-transform:uppercase; letter-spacing:.08em; font-size:.68rem; color:#64748b; font-weight:700; }
.table-hover tbody tr:hover{ background-color:rgba(37,99,235,.04); }

/* modern forms */
.form-control, .form-select{ border-radius:10px !important; border-color:rgba(15,23,42,.16); }
.form-control:focus, .form-select:focus{ border-color:var(--pri); box-shadow:0 0 0 3px rgba(37,99,235,.16); }

/* modals & dropdowns */
.modal-content{ border-radius:18px !important; box-shadow:0 24px 70px rgba(15,23,42,.3); }
.dropdown-menu{ border-radius:12px; box-shadow:0 12px 36px rgba(15,23,42,.14); }

/* login */
.lc{ border-radius:24px !important; }
.btn-pri{ border-radius:12px !important; background:linear-gradient(135deg, var(--pri), #1d4ed8) !important; }

/* dark mode refinements */
[data-theme=dark] #WR{ background:linear-gradient(180deg,#0b1220,#0f172a); }
[data-theme=dark] #TB{ background:rgba(15,23,42,.88) !important; }
[data-theme=dark] .table thead th{ background:#1e293b; color:#94a3b8; }
[data-theme=dark] #SB{ background:linear-gradient(180deg, #1e293b 0%, #0b1220 100%) !important; }