
/* V17 ULTRA UI */
:root{
  --ui-bg:#060b16;
  --ui-surface:#0f172a;
  --ui-card:#111c35;
  --ui-border:rgba(255,255,255,.08);
  --ui-text:#e5eefc;
  --ui-muted:#94a3b8;
  --ui-primary:#00d2ff;
  --ui-accent:#7c3aed;
  --ui-success:#10b981;
  --ui-warning:#f59e0b;
}
body{background:linear-gradient(180deg,#050812,#0b1220)!important;color:var(--ui-text)!important}
.content-wrapper,.main-sidebar,.navbar,.main-header{background:transparent!important}
.wrapper,.content,.content-wrapper{overflow-x:hidden}
.card,.small-box,.info-box,.modal-content{
  border-radius:20px!important;
  border:1px solid var(--ui-border)!important;
  background:linear-gradient(180deg,rgba(17,28,53,.92),rgba(10,18,34,.94))!important;
  box-shadow:0 18px 40px rgba(0,0,0,.25)!important;
}
.card-header,.modal-header,.small-box-footer{border-color:var(--ui-border)!important;background:transparent!important}
.card-title,h1,h2,h3,h4,h5,h6,.navbar-brand,.nav-link,.brand-text{color:var(--ui-text)!important}
.text-muted,small,.small{color:var(--ui-muted)!important}
.btn{
  border-radius:14px!important;
  font-weight:700!important;
  box-shadow:none!important;
}
.btn-primary,.bg-primary{background:linear-gradient(90deg,var(--ui-primary),#4f46e5)!important;border:none!important}
.btn-success,.bg-success{background:linear-gradient(90deg,#10b981,#059669)!important;border:none!important}
.btn-warning,.bg-warning{background:linear-gradient(90deg,#f59e0b,#d97706)!important;border:none!important;color:#111827!important}
.btn-outline-primary{border-color:rgba(0,210,255,.4)!important;color:#7dd3fc!important}
.btn-outline-secondary,.btn-outline-light{border-color:var(--ui-border)!important}
.table{
  color:var(--ui-text)!important;
  background:transparent!important;
}
.table thead th{border-bottom:1px solid var(--ui-border)!important;color:#c7d2fe!important}
.table td,.table th{border-top:1px solid rgba(255,255,255,.06)!important;vertical-align:middle}
.badge{
  border-radius:999px!important;
  padding:.5rem .8rem!important;
}
.form-control,.custom-select,.select2-selection,.note-editor,.input-group-text,textarea{
  background:#0b1328!important;
  color:var(--ui-text)!important;
  border:1px solid rgba(255,255,255,.08)!important;
  border-radius:14px!important;
}
.form-control:focus,.custom-select:focus,textarea:focus{
  border-color:rgba(0,210,255,.45)!important;
  box-shadow:0 0 0 .2rem rgba(0,210,255,.12)!important;
}
.main-sidebar{
  background:linear-gradient(180deg,#08101f,#050812)!important;
  border-right:1px solid rgba(255,255,255,.06)!important;
}
.nav-sidebar .nav-link{
  border-radius:14px!important;
  margin:.15rem .4rem!important;
  color:#dbeafe!important;
}
.nav-sidebar .nav-link.active,
.nav-sidebar .nav-link:hover{
  background:linear-gradient(90deg,rgba(0,210,255,.18),rgba(124,58,237,.18))!important;
}
.content-header{padding-top:1rem}
.table-responsive,.content,.container,.container-fluid{max-width:100%;overflow-x:hidden}
.calendar-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.day-card{
  padding:16px;border-radius:18px;
  background:linear-gradient(180deg,#111827,#0f172a);
  border:1px solid rgba(255,255,255,.08);
}
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.kpi-card{padding:20px}
.kpi-label{font-size:12px;color:var(--ui-muted);text-transform:uppercase;letter-spacing:.06em}
.kpi-value{font-size:34px;font-weight:800;line-height:1.1}
.hero-panel{
  padding:24px;border-radius:24px;
  background:
    radial-gradient(800px 300px at 0% 0%,rgba(0,210,255,.14),transparent 55%),
    radial-gradient(800px 300px at 100% 0%,rgba(124,58,237,.14),transparent 55%),
    linear-gradient(180deg,rgba(15,23,42,.96),rgba(10,18,34,.96));
  border:1px solid rgba(255,255,255,.08);
}
.fleet-map-shell{padding:14px;border-radius:22px;background:linear-gradient(180deg,#0f172a,#0b1328);border:1px solid rgba(255,255,255,.08)}
#fleetMap,.map-premium{height:560px;border-radius:18px;overflow:hidden}
@media(max-width:767px){
  .container,.container-fluid{padding-left:12px;padding-right:12px}
  .btn-group,.d-flex{flex-wrap:wrap}
  .btn,.btn-group>.btn{width:100%}
  .kpi-value{font-size:28px}
  #fleetMap,.map-premium{height:360px}
}


/* V75 RESPONSIVE TABLES */
@media (max-width:768px){
table thead{display:none}
table tr{
display:block;
margin-bottom:12px;
background:#111827;
border-radius:12px;
padding:12px;
border:1px solid rgba(255,255,255,.05)
}
table td{
display:flex;
justify-content:space-between;
padding:6px 0;
font-size:14px
}
table td:before{
content:attr(data-label);
font-weight:600;
opacity:.7
}
}


/* V76 UNIFIED STABLE READY */
:root{--v76-cyan:#14d7ff;--v76-green:#10b981}
.card,.small-box,.info-box,.modal-content{border-radius:18px!important;border:1px solid rgba(255,255,255,.08)!important;box-shadow:0 18px 40px rgba(0,0,0,.22)!important}
.card-header{background:transparent!important;border-bottom:1px solid rgba(255,255,255,.06)!important}
.content-wrapper{background:#0b1321!important;overflow-x:hidden}
.btn-primary{background:var(--v76-cyan)!important;border-color:var(--v76-cyan)!important;color:#03111a!important;font-weight:700}
.btn-success{background:var(--v76-green)!important;border-color:var(--v76-green)!important}
@media (max-width:768px){
.table-mobile-cards thead{display:none!important}
.table-mobile-cards tbody tr{display:block;margin-bottom:12px;background:#111827;border-radius:14px;border:1px solid rgba(255,255,255,.06);padding:12px}
.table-mobile-cards tbody td{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border:none!important}
.table-mobile-cards tbody td:before{content:attr(data-label);font-weight:700;opacity:.72;min-width:96px}
.content-header h1{font-size:1.8rem!important}
}



/* V90 Voice Toggle UI */
#navVoiceBtn{
 position:absolute;
 top:14px;
 right:14px;
 z-index:9999;
 background:rgba(15,23,42,0.85);
 backdrop-filter:blur(6px);
 border:1px solid rgba(255,255,255,0.1);
 color:#fff;
 padding:8px 14px;
 border-radius:12px;
 font-size:13px;
 cursor:pointer;
 transition:all .2s ease;
}
#navVoiceBtn:hover{
 background:#1e293b;
}



/* V91 Elegant Voice Button */
.nav-voice-btn{
 position:absolute;
 top:14px;
 right:14px;
 z-index:9999;
 padding:10px 16px;
 border-radius:14px;
 border:1px solid rgba(255,255,255,0.12);
 backdrop-filter:blur(8px);
 font-size:13px;
 cursor:pointer;
 transition:all .2s ease;
}

.nav-voice-btn.on{
 background:rgba(16,185,129,0.15);
 color:#10b981;
}

.nav-voice-btn.off{
 background:rgba(239,68,68,0.15);
 color:#ef4444;
}

.nav-voice-btn:hover{
 transform:scale(1.05);
}
