/* FleetNow visual refresh. Existing navy, lime and green palette. */
:is(#app,#driver){font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Tahoma,Arial,sans-serif;line-height:1.6}
#app .main{padding:28px clamp(16px,2.5vw,40px) 40px;max-width:1680px}
#app .topbar{padding-bottom:20px;margin-bottom:24px;border-bottom:1px solid var(--border,#e1e7ec)}
#app .topbar h1{font-size:clamp(23px,2.2vw,30px);letter-spacing:-.035em;margin:0}
#app .topbar small{letter-spacing:.06em;font-size:11px}
#app .sidebar{background:var(--nav,#142536)}
#app .sidebar .nav{gap:5px}
#app .sidebar .nav button{border-radius:11px;min-height:42px;padding:9px 12px;font-weight:500;border:1px solid transparent}
#app .sidebar .nav button.active{background:var(--lime,#c4f477);color:#142536;box-shadow:0 4px 16px #00000012;font-weight:700}
#app .sidebar .nav button:not(.active):hover{background:#ffffff0d;border-color:#ffffff18}
#app .sidebar .nav button b{border-radius:7px}
:is(#app,#driver) :is(.panel,.card,.driver-action,.driver-stats article){border:1px solid var(--border,#e1e7ec);border-radius:18px;background:#fff;box-shadow:0 4px 18px #14253605,0 1px 2px #14253603}
#app .panel{padding:22px;margin-bottom:20px}
#app .panel h2{font-size:17px;line-height:1.4;margin-bottom:20px}
#app .cards{gap:16px;margin-bottom:22px}
#app .card{padding:21px;border-top:3px solid var(--lime,#c4f477)}
#app .card strong{font-size:34px;font-weight:700;letter-spacing:-.04em;margin:12px 0 6px;line-height:1.2}
:is(#app,#driver) :is(input,select,textarea){border-radius:11px;border-color:#ced9e0;box-shadow:0 1px 2px #14253604;min-height:44px}
:is(#app,#driver) :is(input[type=checkbox],input[type=radio]){min-height:20px}
:is(#app,#driver) label{font-size:13px;line-height:1.5}
:is(#app,#driver) button{border-radius:11px;font-size:14px;min-height:42px}
:is(#app,#driver) :is(button,a,input,select,textarea):focus-visible{outline:3px solid #538b74;outline-offset:3px}
#app .form-grid{gap:18px 22px}
#app .table-wrap{border:1px solid var(--border,#e1e7ec);border-radius:13px;overflow:auto}
#app table{margin:0;width:100%;font-size:13px}
#app th{padding:13px 15px;background:#f5f7f8;font-size:12px;font-weight:650}
#app td{padding:14px 15px;border-bottom:1px solid #edf1f4}
#app tbody tr:last-child td{border-bottom:0}
#app tbody tr:hover{background:#f5f7f8}
#app .tag{border-radius:20px;padding:5px 10px}
#app .login{margin:clamp(16px,4vh,48px) auto;border-radius:26px;box-shadow:0 20px 70px #1425360a;max-width:1080px}
#app .login .intro{padding:clamp(24px,4vw,50px)}
#app .login .intro h1{font-size:clamp(30px,3.3vw,44px);line-height:1.18;letter-spacing:-.035em}
#app .login .entry{padding:32px clamp(24px,4vw,48px)}
#app .entry h2{font-size:25px}
#driver .driver-shell{max-width:1180px;padding-top:28px}
#driver .driver-hero{border-radius:24px;padding:clamp(24px,4vw,42px);box-shadow:0 10px 32px #14253610}
#driver .driver-hero h1{font-size:clamp(26px,3vw,36px);line-height:1.25}
#driver .driver-stats{gap:14px}
#driver .driver-stats article{border-top:3px solid var(--lime,#c4f477);padding:20px}
#driver .driver-tabs{gap:8px;padding:7px;border-radius:16px;background:#eef2f4}
#driver .driver-tabs button{border-radius:11px;min-height:44px}
#driver .driver-action{padding:24px}
#driver .driver-login{border-radius:24px;box-shadow:0 20px 70px #1425360a}
html[lang=ar] :is(#app,#driver) :is(h1,h2,small){letter-spacing:0}
@media(max-width:760px){
 #app .main{padding:20px 12px 32px}#app .panel{padding:18px 15px;border-radius:16px}
 #app .topbar{margin-bottom:18px;padding-bottom:16px}#app .cards{gap:10px}
 #app .card{padding:16px 13px}#app .card strong{font-size:28px}
 #app .shell>.sidebar .nav{flex-wrap:nowrap;overflow-x:auto;padding-bottom:8px}
 #app .shell>.sidebar .nav button{flex:0 0 auto;min-height:44px}
 #app .login{margin:12px;border-radius:20px}#app .login .intro,#app .login .entry{padding:24px}
 :is(#app,#driver) :is(input,select,textarea){font-size:16px}
 :is(#app,#driver) button{min-height:44px}
 #driver .driver-shell{padding:18px 12px 110px}#driver .driver-action{padding:18px 15px}
 #driver .driver-tabs{padding:6px;gap:6px}#driver .driver-tabs button{font-size:13px}
}
