/* SADAF V42 — FINAL UNIFIED UI
   Last-loaded compatibility layer. Keeps existing PHP/functionality selectors intact. */
:root{
 --v42-bg:#f3f6fa; --v42-surface:#fff; --v42-surface-soft:#f8fafc; --v42-text:#0f172a; --v42-muted:#64748b;
 --v42-border:#e2e8f0; --v42-primary:#4f46e5; --v42-primary2:#7c3aed; --v42-dark:#0b1220;
 --v42-radius:16px; --v42-shadow:0 10px 30px rgba(15,23,42,.055); --v42-shadow2:0 20px 55px rgba(15,23,42,.09);
}
*{box-sizing:border-box}
html{background:var(--v42-bg)!important;scroll-behavior:smooth}
body.cb-v10{background:var(--v42-bg)!important;color:var(--v42-text)!important;font-family:Inter,"Noto Sans Arabic",system-ui,sans-serif!important}
.cb-shell{background:var(--v42-bg)!important;min-height:100vh}
#cb-sidebar{width:248px!important;background:linear-gradient(180deg,#09111f 0%,#0d1728 100%)!important;border-right:1px solid rgba(255,255,255,.08)!important;box-shadow:16px 0 45px rgba(2,8,23,.12)!important}
[dir=rtl] #cb-sidebar{border-right:0!important;border-left:1px solid rgba(255,255,255,.08)!important}
.cb-brandbar{height:72px!important;padding:0 18px!important}
.cb-brand-logo img{max-height:52px!important;max-width:178px!important}
.cb-sidebar-nav{padding:14px 10px!important}
.cb-nav-section{margin:18px 7px 7px!important;font-size:9px!important;letter-spacing:.14em!important;color:#64748b!important}
.cb-nav-link{min-height:40px!important;margin:2px 0!important;padding:0 11px!important;border-radius:11px!important;color:#9aa8ba!important;font-size:10.5px!important;font-weight:700!important;gap:9px!important}
.cb-nav-link:hover{background:rgba(255,255,255,.07)!important;color:#fff!important}
.cb-nav-link.cb-nav-active{background:linear-gradient(135deg,#4f46e5,#6d28d9)!important;color:#fff!important;box-shadow:0 8px 22px rgba(79,70,229,.25)!important}
.cb-nav-icon{width:21px!important;font-size:12px!important}
.cb-shell>header{height:66px!important;background:rgba(255,255,255,.9)!important;border-bottom:1px solid var(--v42-border)!important;box-shadow:0 3px 18px rgba(15,23,42,.035)!important}
.cb-shell>header>div{height:66px!important}
.cb-shell main.wrap{margin-left:0!important;margin-right:0!important;padding:22px clamp(14px,2.5vw,36px) 42px!important}
.cb-shell main.wrap>.page-head{max-width:1600px!important;margin:0 auto 18px!important;padding:0 0 15px!important;border-bottom:1px solid var(--v42-border)!important}
.page-head h1{font-size:clamp(22px,1.8vw,29px)!important;line-height:1.15!important;font-weight:850!important;letter-spacing:-.035em!important;color:var(--v42-text)!important}
.page-head h1:after{content:"";display:block;width:32px;height:3px;margin-top:8px;border-radius:99px;background:linear-gradient(90deg,var(--v42-primary),var(--v42-primary2))!important}
.page-head .muted{font-size:10px!important;color:var(--v42-muted)!important}
.cb-content,.cb-main-wrap,.dv-page{max-width:1600px!important;margin-inline:auto!important}
/* Universal surfaces */
.cb-v10 .card,.cb-v10 .form,.cb-v10 .panel,.cb-v10 .table-wrap,.cb-v10 .vr-card,.cb-v10 .dv-panel,.cb-v10 .s31-card{
 background:var(--v42-surface)!important;border:1px solid var(--v42-border)!important;border-radius:var(--v42-radius)!important;box-shadow:var(--v42-shadow)!important;color:var(--v42-text)!important
}
.cb-v10 .card{padding:20px!important}
.cb-v10 .card:hover{transform:none!important;box-shadow:var(--v42-shadow)!important}
.cb-v10 h1,.cb-v10 h2,.cb-v10 h3,.cb-v10 h4{color:var(--v42-text)!important}
.cb-v10 .muted{color:var(--v42-muted)!important}
/* grids */
.cb-auto-grid,.kpi-grid,.stats-grid,.health-grid,.s31-kpi-grid{gap:12px!important}
.cb-auto-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))!important}
/* KPI */
.cb-v10 .kpi,.cb-v10 .stat,.cb-v10 .vr-stat,.s31-kpi-card{border:1px solid var(--v42-border)!important;border-radius:14px!important;box-shadow:var(--v42-shadow)!important;background:#fff!important}
.cb-v10 .kpi{padding:16px!important}
.stat-title,.kpi-title{font-size:9px!important;font-weight:800!important;color:#64748b!important;text-transform:uppercase!important;letter-spacing:.06em!important}
.num,.kpi-value{font-size:25px!important;font-weight:850!important;color:#0f172a!important}
/* buttons */
.cb-v10 .btn{min-height:39px!important;padding:0 13px!important;border-radius:10px!important;font-size:10px!important;font-weight:800!important;border:1px solid #dbe2ea!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;transition:transform .15s,box-shadow .15s,background .15s!important}
.cb-v10 .btn.dark{background:linear-gradient(135deg,#4f46e5,#6d28d9)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 7px 18px rgba(79,70,229,.16)!important}
.cb-v10 .btn.dark:hover{transform:translateY(-1px)!important;filter:brightness(1.04)!important}
.cb-v10 .btn.gray,.cb-v10 .btn:not(.dark){background:#fff!important;color:#475569!important}
.cb-v10 .btn.gray:hover,.cb-v10 .btn:not(.dark):hover{background:#f8fafc!important;border-color:#cbd5e1!important;color:#334155!important}
.cb-v10 .actions{gap:8px!important;display:flex!important;flex-wrap:wrap!important}
/* forms */
.cb-v10 .field{min-width:0!important}
.cb-v10 .field label{font-size:9px!important;font-weight:800!important;color:#334155!important;margin-bottom:6px!important}
.cb-v10 input:not([type=checkbox]):not([type=radio]),.cb-v10 select,.cb-v10 textarea,.cb-v10 .field input,.cb-v10 .field select,.cb-v10 .field textarea,.cb-v10 .inline input,.cb-v10 .inline select{
 min-height:40px!important;width:100%!important;border:1px solid #dbe2ea!important;border-radius:10px!important;background:#fff!important;color:#172033!important;box-shadow:none!important;font-size:11px!important
}
.cb-v10 textarea{min-height:90px!important}
.cb-v10 input:focus,.cb-v10 select:focus,.cb-v10 textarea:focus{border-color:#818cf8!important;box-shadow:0 0 0 3px rgba(99,102,241,.1)!important;outline:none!important}
/* tables */
.cb-v10 .table-wrap{overflow:auto!important;padding:0!important}
.cb-v10 .table{width:100%!important;min-width:720px!important;border-collapse:separate!important;border-spacing:0!important}
.cb-v10 .table th,.cb-v10 .table td{padding:11px 13px!important;border-bottom:1px solid #edf1f5!important;text-align:start!important}
.cb-v10 .table th{background:#f8fafc!important;color:#64748b!important;font-size:8.5px!important;font-weight:800!important;text-transform:uppercase!important;letter-spacing:.06em!important;white-space:nowrap!important}
.cb-v10 .table td{font-size:10px!important;color:#334155!important;background:#fff!important}
.cb-v10 .table tbody tr:hover td{background:#f8faff!important}
.cb-v10 .badge{display:inline-flex!important;align-items:center!important;border-radius:999px!important;padding:5px 8px!important;font-size:8px!important;font-weight:800!important;white-space:nowrap!important}
/* dashboard sections */
.fleet-health-card,.s31-compliance-card{overflow:hidden!important}
.s31-card-head,.vr-head,.dv-title-row{gap:14px!important}
.s31-kpi-grid{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important}
.s31-kpi-card{min-height:108px!important;padding:15px!important}
/* vehicle registry */
.cb-v10 .vr-head{padding:17px 19px!important;background:#fff!important;border-bottom:1px solid #edf1f5!important}
.cb-v10 .vr-stats{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important;gap:10px!important}
.cb-v10 .vr-stat{min-height:88px!important;padding:14px!important}
.cb-v10 .vr-table-wrap{overflow:auto!important}
.cb-v10 .vr-table{min-width:900px!important}
/* Document Vault */
.dv-hero{border-radius:18px!important;box-shadow:var(--v42-shadow2)!important}
.dv-kpis{gap:12px!important}
.dv-kpi,.dv-doc-card{border:1px solid var(--v42-border)!important;box-shadow:var(--v42-shadow)!important;border-radius:15px!important}
.dv-panel{overflow:hidden!important}
.dv-doc-grid{gap:12px!important}
.dv-doc-card{background:#fff!important}
/* modal / overlays */
.cb-modal,.modal,.overlay-card,[role=dialog]{border-radius:16px!important}
/* alerts */
.cb-v10 .flash,.cb-v10 .alert,.cb-v10 .gps-status{border-radius:11px!important;border:1px solid var(--v42-border)!important;box-shadow:var(--v42-shadow)!important}
/* footer */
.cb-v10 footer{background:#fff!important;border-top:1px solid var(--v42-border)!important;color:#94a3b8!important;padding:15px 24px!important;font-size:9px!important}
/* login */
.cb-login-page{background:radial-gradient(900px 500px at 0 0,rgba(79,70,229,.18),transparent 55%),radial-gradient(800px 500px at 100% 100%,rgba(124,58,237,.15),transparent 55%),#09111f!important}
.cb-login-card{border:1px solid rgba(255,255,255,.1)!important;border-radius:22px!important;box-shadow:0 30px 80px rgba(0,0,0,.3)!important}
/* avoid accidental horizontal overflow */
html,body{max-width:100%;overflow-x:hidden}
img,svg,video{max-width:100%}
@media(max-width:1100px){
 .s31-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:900px){
 #cb-sidebar{width:280px!important}
 .cb-shell main.wrap{padding:18px 14px 34px!important}
 .s31-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .cb-auto-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:640px){
 .cb-shell>header,.cb-shell>header>div{height:60px!important}
 .cb-shell main.wrap{padding:14px 10px 30px!important}
 .cb-shell main.wrap>.page-head{margin-bottom:14px!important}
 .page-head h1{font-size:21px!important}
 .cb-v10 .card{padding:15px!important;border-radius:14px!important}
 .cb-auto-grid,.s31-kpi-grid{grid-template-columns:1fr 1fr!important}
 .cb-v10 .actions{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important}
 .cb-v10 .actions .btn{width:100%!important}
 .dv-kpis{grid-template-columns:1fr 1fr!important}
 .dv-doc-grid{grid-template-columns:1fr!important}
 .dv-hero{padding:18px!important;flex-direction:column!important;align-items:stretch!important}
 .dv-hero-actions{width:100%!important;display:grid!important;grid-template-columns:1fr 1fr!important}
 .dv-hero-actions .btn{width:100%!important}
 .cb-v10 .table{min-width:680px!important}
 .cb-v10 .vr-table{min-width:860px!important}
}
@media(max-width:420px){
 .cb-auto-grid,.s31-kpi-grid,.dv-kpis{grid-template-columns:1fr!important}
 .cb-v10 .actions,.dv-hero-actions{grid-template-columns:1fr!important}
 .cb-profile-top{padding:0 8px!important}
}
@media print{
 .cb-v10 #cb-sidebar,.cb-v10 header,.cb-v10 footer{display:none!important}
 .cb-shell main.wrap{padding:0!important}
 .cb-v10 .card,.cb-v10 .form,.cb-v10 .panel,.cb-v10 .table-wrap{box-shadow:none!important}
}
