:root{--font:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;--radius-xl:28px;--radius-lg:20px;--radius-md:14px;--shadow:0 18px 46px rgba(15,23,42,.08);--shadow-light:0 8px 24px rgba(15,23,42,.05)}
html[data-theme="blue"]{--bg:#f6f8fc;--surface:#fff;--soft:#f8fafc;--line:#e4e9f2;--text:#162033;--muted:#6a7588;--primary:#1d4ed8;--primary-soft:#edf4ff;--sidebar:#101828;--sidebar-hover:#1d2939;--success:#11995d;--warning:#d97706;--danger:#dc2626;--cash:#11995d;--touch:#2563eb}
html[data-theme="green"]{--bg:#f5faf8;--surface:#fff;--soft:#f1f8f5;--line:#dbece4;--text:#15251f;--muted:#64766f;--primary:#087f5b;--primary-soft:#e7f6ef;--sidebar:#0b3029;--sidebar-hover:#124c41;--success:#087f5b;--warning:#c76b00;--danger:#c92a2a;--cash:#087f5b;--touch:#0f73d9}
html[data-theme="grey"]{--bg:#f7f8fa;--surface:#fff;--soft:#f3f5f7;--line:#e1e5ea;--text:#161b22;--muted:#6b7280;--primary:#334155;--primary-soft:#edf1f5;--sidebar:#111827;--sidebar-hover:#1f2937;--success:#15803d;--warning:#b45309;--danger:#b91c1c;--cash:#15803d;--touch:#2563eb}
*{box-sizing:border-box}body{margin:0;font-family:var(--font);background:var(--bg);color:var(--text);min-height:100vh}button,input,select,textarea{font:inherit}a{color:inherit}.app{min-height:100vh;display:grid;grid-template-columns:256px minmax(0,1fr)}.sidebar{background:var(--sidebar);color:#e5e7eb;padding:22px 16px;position:sticky;top:0;height:100vh;overflow-y:auto}.brand{display:flex;align-items:center;gap:12px;padding:8px 8px 22px;margin-bottom:14px;border-bottom:1px solid rgba(255,255,255,.1)}.brand-logo,.brand-icon{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,#60a5fa,var(--primary));color:#fff;flex:0 0 auto}.brand-logo img,.brand-icon img{width:100%;height:100%;object-fit:contain;border-radius:12px;background:#fff;padding:4px}.brand strong,.brand b{display:block;color:#fff;font-size:15px;line-height:1.1}.brand span{display:block;margin-top:4px;color:rgba(255,255,255,.64);font-size:12px}.sidebar svg,.brand svg{width:20px;height:20px}.nav-title{margin:18px 10px 8px;color:rgba(255,255,255,.45);font-size:11px;font-weight:850;letter-spacing:.1em;text-transform:uppercase}.nav-link,.sidebar nav a{display:flex!important;align-items:center;gap:11px;color:#e5e7eb;text-decoration:none;padding:11px 12px;border-radius:14px;margin-bottom:5px;font-size:14px;font-weight:750;transition:.18s ease}.nav-link:hover,.nav-link.active,.sidebar nav a:hover{background:var(--sidebar-hover);color:#fff}.nav-link svg,.sidebar nav a svg{width:19px;height:19px;opacity:.9}.content{min-width:0;padding:26px}.content.full{grid-column:1/-1;max-width:560px;margin:auto;width:100%}.mobile-header{display:none;align-items:center;justify-content:space-between;margin-bottom:16px}.icon-btn{width:42px;height:42px;border:1px solid var(--line);border-radius:14px;background:var(--surface);display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow-light)}.topbar{margin-bottom:22px}.topbar,.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-xl);box-shadow:var(--shadow)}.topbar{padding:22px}.topbar h1,.hero h1{margin:0;font-size:clamp(26px,3vw,38px);letter-spacing:-.05em;line-height:1}.topbar p,.hero p{margin:10px 0 0;color:var(--muted);font-size:14px;line-height:1.5;max-width:780px}.hero{margin-bottom:22px}.card{padding:22px;margin-bottom:22px}.grid{display:grid;gap:16px}.grid.stats,.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:22px}.grid.two,.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(330px,.75fr);gap:18px}.grid.form{grid-template-columns:repeat(2,minmax(0,1fr))}.stat{padding:20px;min-height:136px;display:flex;flex-direction:column;justify-content:space-between}.stat-top{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}.stat h3,.stat-label{color:var(--muted);font-size:13px;font-weight:850;margin:0 0 8px}.stat strong,.stat-value{font-size:28px;font-weight:920;line-height:1;letter-spacing:-.045em}.stat small,.stat-note{display:block;margin-top:12px;color:var(--muted);font-size:12px;font-weight:680}.stat-icon,.metric-icon,.quick-icon,.settings-icon,.big-icon{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary);flex:0 0 auto}.icon-card{display:flex;gap:14px;align-items:flex-start}.section-head,.panel-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:18px}.section-head h2,.panel-head h2{margin:0;font-size:19px;letter-spacing:-.03em}.section-head p,.panel-head p,.help{margin:7px 0 0;color:var(--muted);font-size:13px;line-height:1.45}.btn{height:42px;border:0;border-radius:14px;padding:0 15px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:850;cursor:pointer;white-space:nowrap;text-decoration:none;font-size:14px}.btn-primary{background:var(--primary);color:#fff;box-shadow:0 10px 22px color-mix(in srgb,var(--primary) 20%,transparent)}.btn-light,.btn-soft{background:var(--primary-soft);color:var(--primary);border:1px solid color-mix(in srgb,var(--primary) 12%,var(--line))}.btn-red{background:#fee2e2;color:#b91c1c}.btn-green{background:#dcfce7;color:#15803d}.toolbar,.actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.table-wrap{width:100%;overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface)}table{width:100%;min-width:900px;border-collapse:collapse;background:var(--surface)}th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);background:var(--soft);padding:14px;font-weight:900;white-space:nowrap}td{padding:15px 14px;border-top:1px solid var(--line);font-size:13px;font-weight:740;vertical-align:middle}tr:first-child td{border-top:0}.pill,.badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:7px 10px;font-size:11px;font-weight:900;white-space:nowrap}.pill-pending,.pill-km,.pill-high,.badge.warn{background:color-mix(in srgb,var(--warning) 13%,white);color:var(--warning)}.pill-reviewed,.badge.touch,.payment-touch{background:color-mix(in srgb,var(--touch) 11%,white);color:var(--touch)}.pill-approved,.pill-normal,.badge.good,.payment-cash{background:color-mix(in srgb,var(--success) 11%,white);color:var(--success)}.pill-rejected,.pill-critical,.pill-alert,.badge.danger{background:color-mix(in srgb,var(--danger) 11%,white);color:var(--danger)}.payment-manual{background:#fef3c7;color:#92400e}.payment-other{background:#f3f4f6;color:#374151}.cash-text{color:var(--cash)}.touch-text{color:var(--touch)}.good{color:var(--success)}.warn{color:var(--warning)}.danger{color:var(--danger)}input,select,textarea{width:100%;border:1px solid var(--line);border-radius:14px;padding:12px 13px;background:#fff;color:var(--text);outline:none}input:focus,select:focus,textarea:focus{border-color:color-mix(in srgb,var(--primary) 40%,var(--line));box-shadow:0 0 0 4px color-mix(in srgb,var(--primary) 10%,transparent)}label{font-size:13px;font-weight:850;color:var(--text);margin-bottom:7px;display:block}.field{margin-bottom:14px}.notice{padding:12px 14px;border-radius:14px;margin-bottom:15px;font-weight:750}.success{background:#dcfce7;color:#15803d}.error{background:#fee2e2;color:#b91c1c}.warning{background:#fef3c7;color:#92400e}.login-card{padding:28px}.chart-box,.chart-bars{height:270px;background:linear-gradient(to top,color-mix(in srgb,var(--primary) 7%,transparent),transparent),repeating-linear-gradient(to top,transparent 0,transparent 55px,var(--line) 56px),var(--soft);border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px 16px 12px;display:flex;align-items:end;gap:14px}.bar-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:10px;height:100%;min-width:34px}.bar{flex:1;width:100%;max-width:38px;border-radius:12px 12px 7px 7px;background:linear-gradient(180deg,color-mix(in srgb,var(--primary) 72%,#8ec5ff),var(--primary));min-width:28px}.bar-label{color:var(--muted);font-size:11px;font-weight:800}.split-list{display:grid;gap:13px}.split-row{padding:15px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--soft)}.split-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:10px;font-size:14px;font-weight:900}.progress{height:10px;border-radius:999px;background:#edf2f7;overflow:hidden}.progress span{display:block;height:100%;border-radius:999px}.progress.cash span{background:var(--cash)}.progress.touch span{background:var(--touch)}.status-list{display:grid;gap:10px;margin-top:16px}.status-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.status-row:last-child{border-bottom:0;padding-bottom:0}.quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.quick-card{padding:18px;display:flex;gap:12px;align-items:flex-start;border-radius:var(--radius-lg);border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow-light)}.quick-card h3{margin:0;font-size:15px}.quick-card p{margin:5px 0 0;color:var(--muted);font-size:12px;line-height:1.4}.vehicle-thumb-btn{border:0;background:transparent;padding:0;cursor:pointer}.vehicle-thumb-btn img,.vehicle-current-image img{width:54px;height:54px;object-fit:cover;border-radius:16px;border:1px solid var(--line)}.vehicle-no-image,.vehicle-thumb,.vehicle-no-badge{display:inline-flex;align-items:center;gap:6px}.vehicle-no-image{width:44px;height:44px;justify-content:center;background:var(--primary-soft);color:var(--primary);border-radius:15px}.expected-kml-badge,.fuel-type-badge{display:inline-flex;align-items:center;gap:6px}.current-logo{display:flex;align-items:center;gap:14px;margin:10px 0 16px}.current-logo img{width:78px;height:78px;object-fit:contain;border-radius:18px;background:var(--soft);border:1px solid var(--line);padding:8px}.import-note{background:var(--soft);border:1px solid var(--line);border-radius:16px;padding:14px;margin-top:12px}.copy-box{display:flex;gap:10px}.image-modal,.app-modal{display:none;position:fixed;inset:0;z-index:80}.image-modal.active,.app-modal.active{display:block}.image-modal-backdrop,.app-modal-backdrop{position:absolute;inset:0;background:rgba(16,24,40,.58);backdrop-filter:blur(6px)}.image-modal-card,.app-modal-card{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:26px;box-shadow:0 28px 90px rgba(16,24,40,.32);width:min(900px,calc(100% - 30px));max-height:90vh;overflow:auto;margin:5vh auto;padding:22px}.image-modal-card img{width:100%;border-radius:20px}.modal-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:16px}.summary-panel,.summary-list div{background:var(--soft);border:1px solid var(--line);border-radius:18px;padding:14px}.summary-list{display:grid;gap:10px}.summary-list span{display:block;color:var(--muted);font-size:11px;font-weight:900;text-transform:uppercase;margin-bottom:5px}.settings-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}.settings-tab{padding:10px 14px;border-radius:999px;background:var(--soft);border:1px solid var(--line);color:var(--muted);font-weight:850;text-decoration:none}.settings-tab.active{background:var(--primary);border-color:var(--primary);color:white}.settings-section{scroll-margin-top:20px}.privilege-table input[type="checkbox"]{width:auto;box-shadow:none}.backup-list{display:grid;gap:10px}.backup-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--soft)}.no-print{}@media print{.no-print,.sidebar,.mobile-header{display:none!important}.app{display:block}.content{padding:0}.card{box-shadow:none;border:0}.print-area{display:block}.table-wrap{overflow:visible;border:0}table{min-width:0}body{background:white}}@media(max-width:1180px){.grid.stats,.stats-grid,.quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.two,.dashboard-grid{grid-template-columns:1fr}}@media(max-width:900px){.app{grid-template-columns:1fr}.sidebar{position:fixed;left:0;top:0;width:256px;transform:translateX(-105%);transition:.2s ease;z-index:100;box-shadow:24px 0 70px rgba(15,23,42,.35)}body.sidebar-open .sidebar{transform:translateX(0)}.content{padding:16px}.mobile-header{display:flex}.grid.form,.grid.stats,.stats-grid,.quick-grid{grid-template-columns:1fr}.section-head,.panel-head,.topbar{flex-direction:column;align-items:stretch}.toolbar,.actions{width:100%}.btn{width:100%}.copy-box{flex-direction:column}.table-wrap{border:0;overflow:visible}table.responsive-table,table.responsive-table thead,table.responsive-table tbody,table.responsive-table tr,table.responsive-table th,table.responsive-table td{display:block;min-width:0;width:100%}table.responsive-table thead{display:none}table.responsive-table tr{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:12px;margin-bottom:12px;box-shadow:var(--shadow-light)}table.responsive-table td{border:0;padding:8px 2px;display:flex;justify-content:space-between;gap:14px;white-space:normal}table.responsive-table td::before{content:attr(data-label);color:var(--muted);font-size:11px;font-weight:900;letter-spacing:.05em;text-transform:uppercase}table.responsive-table td:first-child{display:block;border-bottom:1px solid var(--line);margin-bottom:6px;padding-bottom:12px}table.responsive-table td:first-child::before{content:""}.chart-box,.chart-bars{height:220px;gap:8px}.image-modal-card,.app-modal-card{margin:2vh auto;width:calc(100% - 20px);max-height:96vh}.modal-grid{grid-template-columns:1fr!important}}

/* User account management inside Settings */
.inline-form {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.inline-form input,
.inline-form select {
  min-width: 130px;
  height: 38px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 0 10px;
  background: var(--surface);
  color: var(--text);
}
.badge-success {
  background: rgba(17, 153, 93, 0.12);
  color: #11995d;
}
.badge-warning {
  background: rgba(217, 119, 6, 0.14);
  color: #d97706;
}
.mb-2 { margin-bottom: 18px; }
@media (max-width: 780px) {
  .inline-form { width: 100%; }
  .inline-form input,
  .inline-form select,
  .inline-form button { width: 100%; }
}

/* Fuel records and meter reading interaction upgrade */
.clickable-meter-row { cursor: pointer; transition: background-color .16s ease, transform .16s ease; }
.clickable-meter-row:hover { background: color-mix(in srgb, var(--primary) 6%, var(--surface)); }
.clickable-meter-row:active { transform: scale(.998); }
.fuel-records-table { min-width: 1180px; }
.mileage-table { min-width: 1350px; }
.meter-table { min-width: 1480px; }
.filter-card .compact-filter { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items:end; }
@media(max-width:900px){
  .filter-card .compact-filter { grid-template-columns: 1fr; }
  .clickable-meter-row:hover { background: var(--surface); }
}


/* Clutter cleanup v2: cleaner data tables */
.clean-table-card .section-head,
.dashboard-meter-card .section-head,
.meter-table-card .section-head { margin-bottom: 14px; }
.compact-data-table {
  min-width: 980px;
  table-layout: auto;
}
.fuel-records-table { min-width: 980px; }
.mileage-table { min-width: 1120px; }
.meter-table { min-width: 1180px; }
.consumption-summary-table { min-width: 1160px; }
.dashboard-meter-table { min-width: 1120px; }
.compact-data-table th {
  padding: 12px 12px;
  font-size: 10.5px;
  letter-spacing: .055em;
  color: #647084;
  background: #f4f6f9;
}
.compact-data-table td {
  padding: 13px 12px;
  font-size: 13px;
  font-weight: 620;
  line-height: 1.32;
  vertical-align: middle;
  white-space: normal;
}
.compact-data-table td strong { font-weight: 800; }
.compact-data-table tr:hover td { background: #fbfdff; }
.data-sub {
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 600;
  line-height: 1.35;
  margin-top: 3px;
}
.source-stack,
.status-stack { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.status-stack { max-width: 190px; }
.compact-data-table .pill,
.compact-data-table .badge {
  padding: 6px 9px;
  font-size: 10.5px;
  line-height: 1;
}
.vehicle-no-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  border-radius: 999px;
  background: var(--primary-soft);
  color: var(--primary);
  font-weight: 850;
  white-space: nowrap;
}
.clean-scroll {
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 transparent;
}
.clean-scroll::-webkit-scrollbar { height: 8px; }
.clean-scroll::-webkit-scrollbar-track { background: transparent; }
.clean-scroll::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 99px; }
.filter-card .compact-filter {
  grid-template-columns: minmax(240px, 1.2fr) minmax(180px,.8fr) minmax(160px,.7fr) minmax(160px,.7fr) auto;
  gap: 12px;
  align-items: end;
}
.filter-card .compact-filter .field { margin-bottom: 0; }
.fuel-records-table th:nth-child(3),
.fuel-records-table td:nth-child(3) { min-width: 240px; }
.fuel-records-table th:nth-child(8),
.fuel-records-table td:nth-child(8) { min-width: 210px; }
.consumption-summary-table th:nth-child(2),
.consumption-summary-table td:nth-child(2),
.meter-summary-table th:nth-child(2),
.meter-summary-table td:nth-child(2),
.dashboard-meter-table th:nth-child(1),
.dashboard-meter-table td:nth-child(1) { min-width: 190px; }
.consumption-summary-table th:nth-child(6),
.consumption-summary-table td:nth-child(6),
.meter-summary-table th:nth-child(6),
.meter-summary-table td:nth-child(6),
.dashboard-meter-table th:nth-child(5),
.dashboard-meter-table td:nth-child(5) { min-width: 160px; }
.clickable-meter-row:hover td { background: color-mix(in srgb, var(--primary) 5%, white); }
@media(max-width:900px){
  .filter-card .compact-filter { grid-template-columns: 1fr; }
  .compact-data-table { min-width: 0; }
  table.responsive-table.compact-data-table tr { padding: 14px; }
  table.responsive-table.compact-data-table td { padding: 9px 2px; font-size: 13px; }
  table.responsive-table.compact-data-table td:first-child { padding-bottom: 12px; }
  .source-stack,
  .status-stack { justify-content: flex-end; max-width: 55%; }
  .data-sub { font-size: 11px; }
}
@media print{
  .compact-data-table { min-width: 0; font-size: 10px; }
  .compact-data-table th,
  .compact-data-table td { padding: 6px; }
}

/* UI alignment + menu ordering + logo update */
.brand-logo.logo-image {
  background: #ffffff;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.24);
  box-shadow: 0 8px 20px rgba(0,0,0,.14);
}
.brand-logo.logo-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 5px;
  border-radius: 12px;
  background: #fff;
}
.topbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}
.topbar > div:first-child { min-width: 0; }
.topbar .actions { margin-left: auto; justify-content: flex-end; }
.menu-drag-note {
  margin: 8px 10px 12px;
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.72);
  font-size: 11px;
  font-weight: 750;
}
.nav-sortable { min-height: 4px; }
.admin-menu-drag .nav-link[draggable="true"] { cursor: grab; }
.admin-menu-drag .nav-link[draggable="true"]:active { cursor: grabbing; }
.nav-link.dragging { opacity: .55; transform: scale(.985); }
.nav-sortable.drag-over { border-radius: 14px; background: rgba(255,255,255,.035); }
.drag-handle {
  margin-left: auto;
  opacity: .48;
  font-size: 15px;
  letter-spacing: -4px;
  line-height: 1;
}
.nav-label-text { min-width: 0; flex: 1; }
body.menu-order-saved .menu-drag-note::after {
  content: ' · saved';
  color: #86efac;
}

/* Pending previous month trip sheet / meter alert */
.pending-trip-alert {
  border-color: color-mix(in srgb, var(--warning) 26%, var(--line));
  background: linear-gradient(135deg, color-mix(in srgb, var(--warning) 8%, white), var(--surface));
}
.pending-alert-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}
.pending-alert-title {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.pending-alert-icon {
  width: 44px;
  height: 44px;
  border-radius: 15px;
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--warning) 14%, white);
  color: var(--warning);
  flex: 0 0 auto;
}
.pending-alert-head h2 { margin: 0; font-size: 20px; letter-spacing: -.03em; }
.pending-alert-head p { margin: 6px 0 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.pending-trip-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.pending-trip-item {
  padding: 13px 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.72);
}
.pending-trip-item strong { display: block; font-size: 14px; }
.pending-trip-item span { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; line-height: 1.35; }

/* Fuel Records alignment cleanup */
.fuel-records-table {
  min-width: 1040px;
  table-layout: fixed;
}
.fuel-records-table th,
.fuel-records-table td {
  padding: 12px 10px;
  vertical-align: top;
}
.fuel-records-table th:nth-child(1), .fuel-records-table td:nth-child(1) { width: 110px; }
.fuel-records-table th:nth-child(2), .fuel-records-table td:nth-child(2) { width: 112px; }
.fuel-records-table th:nth-child(3), .fuel-records-table td:nth-child(3) { width: 230px; }
.fuel-records-table th:nth-child(4), .fuel-records-table td:nth-child(4) { width: 88px; text-align: right; }
.fuel-records-table th:nth-child(5), .fuel-records-table td:nth-child(5) { width: 122px; text-align: right; }
.fuel-records-table th:nth-child(6), .fuel-records-table td:nth-child(6) { width: 124px; }
.fuel-records-table th:nth-child(7), .fuel-records-table td:nth-child(7) { width: 150px; }
.fuel-records-table th:nth-child(8), .fuel-records-table td:nth-child(8) { width: 170px; }
.fuel-records-table .vehicle-no-badge {
  padding: 6px 9px;
  white-space: normal;
  line-height: 1.25;
}
.fuel-records-table .data-sub,
.consumption-summary-table .data-sub,
.meter-summary-table .data-sub,
.dashboard-meter-table .data-sub {
  overflow-wrap: anywhere;
}
.compact-data-table th,
.compact-data-table td {
  word-break: normal;
}

@media(max-width:1180px){
  .pending-trip-list { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media(max-width:900px){
  .topbar { flex-direction: column; align-items: stretch; }
  .topbar .actions { margin-left: 0; justify-content: flex-start; }
  .pending-alert-head { flex-direction: column; }
  .pending-trip-list { grid-template-columns: 1fr; }
  .fuel-records-table { min-width: 0; table-layout: auto; }
  .fuel-records-table th,
  .fuel-records-table td { width: auto !important; text-align: left !important; }
}

/* Global same-page popup actions */
body.modal-open{overflow:hidden}.ajax-modal-card{width:min(980px,calc(100% - 32px));padding:0;overflow:hidden}.ajax-modal-head{position:sticky;top:0;z-index:3;margin:0;padding:18px 20px;background:var(--surface);border-bottom:1px solid var(--line)}.ajax-modal-head h2{margin:0;font-size:20px;letter-spacing:-.03em}.ajax-modal-body{padding:20px;max-height:calc(90vh - 90px);overflow:auto}.ajax-modal-body>.topbar{box-shadow:none;border:0;border-bottom:1px solid var(--line);border-radius:0;margin:-20px -20px 18px;padding:18px 20px;background:var(--soft)}.ajax-modal-body>.topbar h1{font-size:24px}.ajax-modal-body>.topbar .actions,.ajax-modal-body>.topbar>a.btn{display:none!important}.ajax-modal-body .card{box-shadow:none;margin-bottom:0}.ajax-modal-body form .btn{margin-top:8px}.modal-loading{padding:30px;text-align:center;color:var(--muted);font-weight:800}.modal-error{padding:16px;border-radius:16px;background:#fee2e2;color:#991b1b;font-weight:800}.modal-close-btn{width:auto!important}.btn[data-modal-link],a[data-modal-link]{cursor:pointer}@media(max-width:900px){.ajax-modal-card{width:calc(100% - 14px);max-height:96vh;margin:2vh auto}.ajax-modal-body{padding:14px;max-height:calc(96vh - 84px)}.ajax-modal-body>.topbar{margin:-14px -14px 14px;padding:16px}.ajax-modal-body .grid.form{grid-template-columns:1fr}.ajax-modal-head{padding:15px}.modal-close-btn{width:auto!important}}


/* Menu drag toggle + adaptive screen fit upgrade */
.switch-field {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 48px;
  border: 1px solid var(--line);
  background: var(--soft);
  border-radius: 16px;
  padding: 10px 12px;
  cursor: pointer;
}
.switch-field input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  width: 1px;
  height: 1px;
}
.switch-ui {
  width: 50px;
  height: 28px;
  border-radius: 999px;
  background: #cbd5e1;
  position: relative;
  flex: 0 0 auto;
  transition: .18s ease;
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.08);
}
.switch-ui::after {
  content: '';
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #fff;
  position: absolute;
  top: 3px;
  left: 3px;
  transition: .18s ease;
  box-shadow: 0 3px 9px rgba(15,23,42,.18);
}
.switch-field input:checked + .switch-ui { background: var(--primary); }
.switch-field input:checked + .switch-ui::after { transform: translateX(22px); }
.switch-field strong { display: block; font-size: 13px; line-height: 1.2; }
.switch-field small { display: block; color: var(--muted); font-size: 11.5px; line-height: 1.35; margin-top: 3px; }
.switch-field input:disabled + .switch-ui { opacity: .55; }
body:not(.admin-menu-drag) .drag-handle { display: none; }
body:not(.admin-menu-drag) .nav-link[draggable="true"] { cursor: pointer; }

html, body { max-width: 100%; overflow-x: hidden; }
.app { grid-template-columns: clamp(224px, 14.5vw, 256px) minmax(0, 1fr); }
.content { min-width: 0; width: 100%; max-width: 100%; padding: clamp(14px, 1.5vw, 26px); overflow-x: hidden; }
.card, .topbar { max-width: 100%; }
.table-wrap, .clean-scroll { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
img, svg { max-width: 100%; }
.grid.form { grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); }
.filter-card .compact-filter { grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr)); }
.actions, .toolbar { min-width: 0; }
.actions .btn, .toolbar .btn { flex: 0 1 auto; }

@media (max-width: 1400px) {
  .content { padding: 20px; }
  .card, .topbar { border-radius: 22px; }
  th { padding: 12px 10px; }
  td { padding: 12px 10px; }
  .compact-data-table th { padding: 11px 10px; }
  .compact-data-table td { padding: 12px 10px; }
}
@media (max-width: 1280px) {
  .app { grid-template-columns: 232px minmax(0, 1fr); }
  .sidebar { padding: 18px 12px; }
  .nav-link, .sidebar nav a { padding: 10px 10px; font-size: 13px; gap: 9px; }
  .brand { gap: 10px; }
  .brand-logo, .brand-icon { width: 38px; height: 38px; }
  .topbar h1, .hero h1 { font-size: clamp(24px, 2.5vw, 34px); }
  .stat strong, .stat-value { font-size: 24px; }
  .stat { min-height: 120px; padding: 17px; }
  .grid.stats, .stats-grid { gap: 12px; }
}
@media (max-width: 1100px) {
  .app { grid-template-columns: 1fr; }
  .sidebar { position: fixed; left: 0; top: 0; width: min(280px, 84vw); transform: translateX(-105%); transition: .2s ease; z-index: 100; box-shadow: 24px 0 70px rgba(15,23,42,.35); }
  body.sidebar-open .sidebar { transform: translateX(0); }
  .mobile-header { display: flex; }
  .content { padding: 16px; }
}
@media (max-width: 680px) {
  .content { padding: 12px; }
  .topbar, .card { padding: 16px; border-radius: 20px; }
  .btn { min-height: 42px; height: auto; white-space: normal; }
  .grid.stats, .stats-grid { grid-template-columns: 1fr; }
  .section-head, .panel-head, .topbar { gap: 10px; }
  .settings-tabs { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
  .settings-tab { white-space: nowrap; flex: 0 0 auto; }
}
@media (max-height: 720px) and (min-width: 1101px) {
  .sidebar { padding-top: 14px; }
  .brand { padding-bottom: 14px; margin-bottom: 8px; }
  .nav-title { margin-top: 12px; }
  .nav-link, .sidebar nav a { padding-top: 8px; padding-bottom: 8px; }
}