.vehicle-location { box-sizing:border-box; position:fixed; inset:0; margin:0; width:100vw; height:100dvh; max-width:none; max-height:none; border:0; padding:0; background:#eef3f8; color:#25374a; font:13px "Microsoft YaHei","PingFang SC","Segoe UI",Arial,sans-serif; overflow:hidden; }
.vehicle-location[open] { display:flex; flex-direction:column; }
.vehicle-location::backdrop { background:#06172a; }
.vehicle-location * { box-sizing:border-box; }
.vehicle-location [hidden] { display:none!important; }
.vehicle-location button { cursor:pointer; border:1px solid #cad7e5; border-radius:6px; background:white; color:#234364; padding:8px 13px; font:inherit; white-space:nowrap; }
.vehicle-location button:hover { background:#e8f2ff; border-color:#438edb; }
.vehicle-location button:focus-visible, .vehicle-location input:focus-visible, .vehicle-location select:focus-visible { outline:2px solid #1688ff; outline-offset:2px; }
.vehicle-location-header { display:flex; align-items:center; gap:24px; background:#092745; color:#eaf6ff; padding:14px 24px; flex:none; }
.vehicle-location-heading { margin-right:auto; cursor:default; }
.vehicle-location h1 { margin:0 0 4px; font-size:24px; }
.vehicle-location-heading span { font-size:12px; color:#94b4d1; }
.vehicle-location .vehicle-pending { color:#f4c46b; font-size:12px; }
.vehicle-location .vehicle-clock { font-size:13px; }
.vehicle-location-filters { display:flex; flex-wrap:wrap; gap:12px; align-items:end; padding:14px 20px; border-bottom:1px solid #d4e0ec; background:white; flex:none; }
.vehicle-location .vehicle-field { display:flex; flex-direction:column; gap:5px; font-size:13px; }
.vehicle-location input, .vehicle-location select { font:13px "Microsoft YaHei","PingFang SC","Segoe UI",Arial,sans-serif; padding:8px; border:1px solid #cad7e5; border-radius:5px; background:#fff; color:#25374a; max-width:230px; }
.vehicle-location input[type=checkbox] { width:16px; height:16px; }
.vehicle-location button[type=submit] { background:#1677d8; color:white; border-color:#1677d8; }
.vehicle-location .vehicle-query-time { font-size:13px; color:#728298; padding-bottom:9px; margin-left:auto; }
.vehicle-location-body { display:flex; flex:1; min-height:0; }
.vehicle-location-sidebar { width:250px; flex:none; background:#fff; border-right:1px solid #d4e0ec; display:flex; flex-direction:column; min-height:0; }
.vehicle-location-sidebar h2 { padding:16px; margin:0; font-size:15px; border-bottom:1px solid #e4ebf3; }
.vehicle-location-list { overflow:auto; flex:1; }
.vehicle-location .vehicle-row { display:flex; flex-direction:column; gap:8px; text-align:left; width:100%; border:0; border-bottom:1px solid #e4ebf3; border-radius:0; padding:16px; }
.vehicle-location .vehicle-row.selected { background:#e6f1ff; border-left:4px solid #1677d8; }
.vehicle-location .vehicle-row span, .vehicle-location .vehicle-row small { font-size:12px; color:#60758a; }
.vehicle-location .vehicle-empty { padding:16px; color:#6a7e91; line-height:1.8; }
.vehicle-location-main { min-width:0; flex:1; display:flex; flex-direction:column; }
.vehicle-location-maparea { position:relative; flex:1; min-height:160px; background:#e6edf0; }
.vehicle-location .vehicle-road-map { position:absolute; inset:0; z-index:0; }
.vehicle-location-status { position:absolute; top:12px; left:14px; right:14px; z-index:500; display:flex; align-items:center; gap:12px; padding:9px 12px; border-radius:5px; background:rgba(255,255,255,.95); box-shadow:0 2px 8px #23436419; font-size:12px; }
.vehicle-location-tools { position:absolute; right:16px; top:74px; z-index:500; display:flex; flex-direction:column; gap:7px; }
.vehicle-location-details { background:#fff; flex:none; border-top:1px solid #cbd8e5; }
.vehicle-location .vehicle-detail-header { display:flex; align-items:center; justify-content:space-between; padding:8px 16px; }
.vehicle-location .vehicle-table-wrap { overflow:auto; max-height:180px; min-height:70px; }
.vehicle-location table { border-collapse:collapse; min-width:1450px; width:100%; font-size:11px; }
.vehicle-location th, .vehicle-location td { text-align:left; padding:10px 14px; border-bottom:1px solid #e7edf4; white-space:nowrap; }
.vehicle-location th { background:#eff4fa; color:#45627f; position:sticky; top:0; }
.vehicle-location tbody tr:hover { background:#edf5ff; cursor:pointer; }
.vehicle-location footer { padding:8px 20px; font-size:12px; color:#6f8397; border-top:1px solid #d4e0ec; flex:none; }
.vehicle-location-info { min-width:190px; line-height:1.6; }
.vehicle-location-info p { margin:5px 0; }
.chart-map-panel .vehicle-map-choice { position:absolute; z-index:10; top:50px; left:20%; right:20%; padding:18px; display:flex; flex-direction:column; gap:10px; background:#092745; border:1px solid #318bd7; color:white; border-radius:8px; max-height:70%; overflow:auto; }
.chart-map-panel .vehicle-map-choice[hidden] { display:none!important; }
/* Reference-matched navy navigation and light vehicle list. */
.vehicle-location { background:#082748; font-size:13px; }
.vehicle-location-header { height:64px; padding:8px 20px; gap:26px; background:#0b2f53; border-bottom:1px solid #24628c; }
.vehicle-location-heading { display:flex; align-items:center; gap:20px; min-width:0; }
.vehicle-location h1 { font-size:24px; line-height:1.2; margin:0; white-space:nowrap; }
.vehicle-location-heading > span { font-size:12px; font-weight:600; color:#d5eaff; border-left:1px solid #2c719e; padding-left:20px; white-space:nowrap; }
.vehicle-location-heading .vehicle-pending { background:#ffc020; color:#112b46; border:0; border-radius:5px; padding:5px 12px; font-size:12px; }
.vehicle-location .vehicle-clock { font-size:13px; white-space:nowrap; font-weight:600; }
.vehicle-location-header > .vehicle-return-dashboard { display:flex; align-items:center; justify-content:center; min-width:86px; height:40px; padding:0 14px; background:#082c4d; color:white; border-color:#00bdf6; font-size:13px; }
.vehicle-location-filters { min-height:68px; padding:12px 22px; gap:14px; align-items:center; flex-wrap:nowrap; overflow-x:auto; background:#082747; border-bottom:1px solid #24638e; color:#f0f7ff; }
.vehicle-location .vehicle-field { flex-direction:row; align-items:center; gap:16px; font-size:13px; white-space:nowrap; font-weight:600; }
.vehicle-location .vehicle-field:nth-child(2), .vehicle-location .vehicle-field:nth-child(3) { margin-left:14px; }
.vehicle-location input, .vehicle-location select { height:42px; background:#103455; color:#f3f8ff; border:1px solid #4081ae; border-radius:5px; padding:8px 14px; font-size:13px; }
.vehicle-location input::placeholder { color:#8ca8c0; }
.vehicle-location select { width:190px; }
.vehicle-location .vehicle-field:nth-child(3) select { width:150px; }
.vehicle-location input:not([type=checkbox]) { width:190px; }
.vehicle-location-filters > button { height:42px; min-width:95px; color:#f3f8ff; border:1px solid #4286b6; background:#133c60; font-size:13px; }
.vehicle-location button[type=submit] { background:#00bce9; border-color:#20d5fc; color:white; }
.vehicle-location button[type=submit]:hover { background:#00a6d6; }
.vehicle-location .vehicle-auto { margin-left:4px; padding-left:22px; border-left:1px solid #4383aa; gap:12px; }
.vehicle-location input[type=checkbox] { appearance:auto; width:46px; height:26px; accent-color:#008dff; }
.vehicle-location .vehicle-auto span { color:#9eb6cb; font-size:13px; }
.vehicle-location .vehicle-query-time { margin-left:6px; padding:0 0 0 22px; border-left:1px solid #4383aa; color:#e5f2ff; font-size:13px; white-space:nowrap; }
.vehicle-location-sidebar { width:clamp(280px,19.6vw,360px); background:#f0f8ff; border-right:1px solid #2a678e; }
.vehicle-location-sidebar h2 { display:flex; align-items:center; gap:20px; background:#0c3153; color:#f4faff; padding:14px 20px 10px; font-size:15px; border:0; }
.vehicle-location-sidebar h2 b { color:#00d1ef; font-size:28px; line-height:1; }
.vehicle-location-summary { display:flex; gap:18px; padding:6px 20px 16px; background:#0c3153; }
.vehicle-location-summary span { padding:8px 12px; flex:1; white-space:nowrap; border:1px solid #28628c; border-radius:10px; background:#153f62; color:#eef7ff; font-size:13px; }
.vehicle-location-summary .vehicle-located { color:#40df98; }
.vehicle-location .vehicle-company-group { border-bottom:1px solid #d4e5f2; }
.vehicle-location .vehicle-company-heading { display:flex; align-items:center; gap:8px; padding:9px 16px; color:#174c77; background:#e6f3fc; font-size:13px; }
.vehicle-location .vehicle-company-heading strong { flex:1; font-weight:700; font-size:15px; }
.vehicle-location .vehicle-company-heading small { color:#587997; }
.vehicle-location .vehicle-row { padding:10px 14px; min-height:46px; display:flex; flex-direction:row; flex-wrap:nowrap; align-items:center; gap:8px; background:#f8fcff; border:0; border-top:1px solid #dfedf8; color:#0a284b; }
.vehicle-location .vehicle-row-copy { min-width:0; flex:1; display:block; text-align:left; }
.vehicle-location .vehicle-row strong { display:block; font-size:12px; line-height:1.55; overflow-wrap:anywhere; word-break:break-word; }
.vehicle-location .vehicle-row-number { width:18px; flex:none; color:#4b7194; font-size:12px; text-align:right; }
.vehicle-location .vehicle-state-icon { width:16px; height:16px; flex:none; position:relative; display:block; font-size:0; line-height:1; }
.vehicle-location .vehicle-state-icon::before { content:""; position:absolute; inset:0; }
.vehicle-location .vehicle-state-icon.vehicle-state-离线::before, .vehicle-location .vehicle-state-icon.vehicle-state-暂无定位::before, .vehicle-location .vehicle-state-icon.vehicle-state-时间异常::before { border-radius:50%; background:#737373; }
.vehicle-location .vehicle-state-icon.vehicle-state-停车::before, .vehicle-location .vehicle-state-icon.vehicle-state-行驶中::before { inset:2px 0; background:currentColor; clip-path:polygon(100% 50%,0 0,22% 50%,0 100%); transform:rotate(0deg); }
.vehicle-location .vehicle-state-icon.vehicle-state-停车 { color:#1677ff; }
.vehicle-location .vehicle-state-icon.vehicle-state-行驶中 { color:#10ad39; }
.vehicle-location .vehicle-state-icon.vehicle-state-熄火::before { border-radius:50%; background:#1677ff; }
.vehicle-location .vehicle-state-icon.vehicle-state-熄火::after { content:""; position:absolute; left:3px; right:3px; top:7px; height:2px; border-radius:1px; background:#fff; }
.vehicle-location .vehicle-company-empty { margin:0; padding:11px 42px; color:#6a8298; font-size:12px; background:#f8fcff; }
.vehicle-location .vehicle-map-marker-wrap { background:transparent!important; border:0!important; }
.vehicle-location .vehicle-map-marker { display:inline-flex; align-items:center; gap:4px; transform:translate(-8px,-8px); white-space:nowrap; font:600 12px "Microsoft YaHei","PingFang SC",Arial,sans-serif; text-shadow:0 1px 2px #fff,1px 0 2px #fff,-1px 0 2px #fff; }
.vehicle-location .vehicle-map-marker i { width:16px; height:16px; flex:none; position:relative; display:block; font-style:normal; font-size:0; line-height:1; text-shadow:none; }
.vehicle-location .vehicle-map-marker i::before { content:""; position:absolute; inset:0; }
.vehicle-location .vehicle-map-marker b { color:#102b42; }
.vehicle-location .vehicle-map-marker-离线 i::before, .vehicle-location .vehicle-map-marker-暂无定位 i::before, .vehicle-location .vehicle-map-marker-时间异常 i::before { border-radius:50%; background:#737373; }
.vehicle-location .vehicle-map-marker-停车 i::before, .vehicle-location .vehicle-map-marker-行驶中 i::before { inset:2px 0; background:currentColor; clip-path:polygon(100% 50%,0 0,22% 50%,0 100%); transform:rotate(var(--vehicle-direction,0deg)); }
.vehicle-location .vehicle-map-marker-停车 i { color:#1677ff; }
.vehicle-location .vehicle-map-marker-行驶中 i { color:#10ad39; }
.vehicle-location .vehicle-map-marker-熄火 i::before { border-radius:50%; background:#1677ff; }
.vehicle-location .vehicle-map-marker-熄火 i::after { content:""; position:absolute; left:3px; right:3px; top:7px; height:2px; border-radius:1px; background:#fff; }
.vehicle-location .vehicle-row.selected { background:#dff2ff; border-left:5px solid #00bafa; }
.vehicle-location .vehicle-row span, .vehicle-location .vehicle-row small { font-size:12px; color:#4c7196; }
.vehicle-location .vehicle-empty { font-size:13px; color:#617e9c; }
.vehicle-location-details { background:#092b4e; border-top:1px solid #26658e; padding:0 12px 4px; }
.vehicle-location .vehicle-detail-header { color:#f1f7ff; padding:8px 8px; height:46px; font-size:15px; }
.vehicle-location .vehicle-detail-header button { color:#badcf5; background:transparent; border-color:#32749f; font-size:13px; padding:5px 12px; }
.vehicle-location .vehicle-table-wrap { height:150px; max-height:22vh; min-height:70px; background:#f6fbff; border:1px solid #357da8; border-radius:5px; }
.vehicle-location table { font-size:11px; color:#0d2c50; }
.vehicle-location th { background:#143e61; color:#e9f6ff; font-weight:600; border-right:1px solid #295a7d; }
.vehicle-location th, .vehicle-location td { padding:9px 16px; border-bottom:1px solid #d5e8f5; }
.vehicle-location td { border-right:1px solid #d1e3f1; }
.vehicle-location tbody tr:nth-child(odd) { background:#e8f5fe; }
.vehicle-location footer { background:#092b4d; color:#a8c8e3; padding:10px 24px; font-size:12px; border-color:#265777; }
.vehicle-location-tools { top:16px; right:16px; gap:10px; }
.vehicle-location-tools .vehicle-tool { width:76px; min-height:48px; padding:9px 5px; border:1px solid #d9e4ee; border-radius:8px; background:#fff; color:#183c5d; font-size:12px; font-weight:600; box-shadow:0 2px 7px #174d7726; }
.vehicle-location-tools .vehicle-tool-zoom-in, .vehicle-location-tools .vehicle-tool-zoom-out { width:58px; height:46px; min-height:46px; margin:0; padding:0; font-size:28px; font-weight:400; line-height:1; }
.vehicle-location-tools .vehicle-tool-zoom-in { border-radius:8px 8px 0 0; margin-bottom:-11px; }
.vehicle-location-tools .vehicle-tool-zoom-out { border-radius:0 0 8px 8px; }
.vehicle-location-tools .vehicle-tool-fit::before { content:"⛶"; display:block; margin-bottom:3px; font-size:19px; line-height:1; }
.vehicle-location-tools .vehicle-tool-follow { min-height:48px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; padding:6px 5px; line-height:1.2; }
.vehicle-location-tools .vehicle-tool-follow::before { content:""; display:block; width:18px; height:18px; background:radial-gradient(circle at center, #183c5d 0 2px, transparent 2.5px), radial-gradient(circle at center, transparent 0 6px, #183c5d 6.5px 7.5px, transparent 8px), linear-gradient(#183c5d,#183c5d) center/2px 18px no-repeat, linear-gradient(90deg,#183c5d,#183c5d) center/18px 2px no-repeat; border-radius:50%; }
.vehicle-location-tools .vehicle-tool-fit.active, .vehicle-location-tools .vehicle-tool-follow.active { background:#e2f5ff; border-color:#09afe2; color:#07618d; }
.vehicle-location-tools .vehicle-tool-fit.active::before, .vehicle-location-tools .vehicle-tool-follow.active::before { filter:sepia(.7) saturate(3) hue-rotate(145deg); }
.vehicle-location-status { top:auto; bottom:32px; left:14px; right:auto; max-width:calc(100% - 110px); font-size:12px; padding:6px 10px; }
.vehicle-location h1 { display:flex; align-items:center; gap:14px; }
.vehicle-location h1::before { content:""; width:32px; height:32px; background:url("./vendor/bootstrap-icons/geo-alt-fill.svg") center/26px no-repeat; filter:invert(67%) sepia(90%) saturate(1900%) hue-rotate(165deg); }
.vehicle-location button[type=submit]::before { content:""; display:inline-block; vertical-align:middle; width:19px; height:19px; margin-right:8px; background:url("./vendor/bootstrap-icons/search.svg") center/contain no-repeat; filter:invert(1); }
.vehicle-location .vehicle-clock::before { content:""; display:inline-block; vertical-align:middle; width:20px; height:20px; margin-right:10px; background:url("./vendor/bootstrap-icons/clock.svg") center/contain no-repeat; filter:invert(1); }
.vehicle-location .vehicle-detail-header strong::before { content:""; display:inline-block; vertical-align:middle; width:18px; height:18px; margin-right:10px; background:url("./vendor/bootstrap-icons/truck-front.svg") center/contain no-repeat; filter:invert(67%) sepia(90%) saturate(1900%) hue-rotate(165deg); }
.vehicle-location input[type=checkbox] { appearance:none; border:0; border-radius:0; padding:0; background:url("./vendor/bootstrap-icons/toggle-off.svg") center/contain no-repeat; filter:invert(72%) sepia(17%) saturate(732%) hue-rotate(165deg); width:52px; height:32px; cursor:not-allowed; }
.vehicle-location .vehicle-clock, .vehicle-location-heading > span, .vehicle-location .vehicle-field { font-weight:400; }
.vehicle-location-info { font-family:"Microsoft YaHei","PingFang SC","Segoe UI",Arial,sans-serif; font-size:12px; }
.vehicle-location-info strong { font-size:13px; }

/* Compact the top vehicle-location filter bar. */
.vehicle-location .vehicle-location-filters { min-height:56px; padding:8px 16px; gap:10px; }
.vehicle-location .vehicle-field { gap:10px; font-size:12px; }
.vehicle-location .vehicle-field:nth-child(2), .vehicle-location .vehicle-field:nth-child(3) { margin-left:6px; }
.vehicle-location input, .vehicle-location select { height:34px; padding:5px 9px; font-size:12px; }
.vehicle-location select { width:170px; }
.vehicle-location .vehicle-field:nth-child(3) select { width:135px; }
.vehicle-location input:not([type=checkbox]) { width:170px; }
.vehicle-location .vehicle-location-filters > button { height:34px; min-width:78px; padding:5px 9px; font-size:12px; }
.vehicle-location button[type=submit]::before { width:16px; height:16px; margin-right:5px; }
.vehicle-location .vehicle-auto { margin-left:2px; padding-left:12px; gap:7px; }
.vehicle-location input[type=checkbox] { width:42px; height:24px; }
.vehicle-location .vehicle-auto span, .vehicle-location .vehicle-query-time { font-size:12px; }
.vehicle-location .vehicle-query-time { padding-left:12px; }
.vehicle-location .vehicle-query-button, .vehicle-location .vehicle-realtime-button { background:#133c60 !important; border-color:#4286b6 !important; color:#f3f8ff !important; }
.vehicle-location .vehicle-query-button.vehicle-mode-active, .vehicle-location .vehicle-realtime-button.vehicle-mode-active { background:#00bce9 !important; border-color:#20d5fc !important; color:#fff !important; }
.vehicle-location .datetime-trigger { background:#00bce9; border-color:#20d5fc; color:#fff; }
/* 顶栏深色按钮和日期按钮不能继承通用白底悬停效果，避免文字、图标失去对比度。 */
.vehicle-location-header > .vehicle-return-dashboard:hover { background:#0f3b62; border-color:#35d0fc; color:#fff; }
.vehicle-location-header > .vehicle-return-dashboard + .vehicle-return-dashboard { margin-left:-12px; }
.vehicle-location .datetime-trigger:hover { background:#00a6d6; border-color:#20d5fc; color:#fff; }
.vehicle-location .vehicle-location-filters > button:not([type=submit]):not(.vehicle-query-button):not(.vehicle-realtime-button):hover { background:#1c4d75; border-color:#62a4d0; color:#f3f8ff; }
.vehicle-location .vehicle-location-filters { position:relative; z-index:1000; overflow:visible; }
.vehicle-location .vehicle-history-date-control, .vehicle-location .datetime-combo { position:relative; z-index:1100; }
.vehicle-location .datetime-picker-panel { z-index:2000; }
.vehicle-location .datetime-calendar-actions button, .vehicle-location .datetime-calendar-foot button, .vehicle-location .datetime-day { display:flex; align-items:center; justify-content:center; text-align:center; line-height:1; }
.vehicle-location .datetime-weekdays span, .vehicle-location .datetime-time-inline > span { display:flex; align-items:center; justify-content:center; text-align:center; }
.vehicle-location .datetime-title { align-items:center; justify-content:center; text-align:center; }
.vehicle-location .datetime-time-input { text-align:center; }

/* Compact the two highlighted areas: the sidebar summary and the scrollable detail table. */
.vehicle-location-sidebar h2 { padding:10px 16px 7px; font-size:13px; }
.vehicle-location-sidebar h2 b { font-size:24px; }
.vehicle-location-summary { gap:12px; padding:5px 16px 11px; }
.vehicle-location-summary span { padding:6px 9px; font-size:12px; }
.vehicle-location .vehicle-detail-header { padding:6px 8px; height:40px; font-size:13px; }
.vehicle-location .vehicle-detail-header button { font-size:12px; padding:4px 10px; }
.vehicle-location .vehicle-table-wrap { height:132px; max-height:19vh; min-height:60px; }
.vehicle-location table { min-width:1470px; table-layout:fixed; font-size:10px; }
.vehicle-location th, .vehicle-location td { padding:6px 10px; }
/* 定位明细按实际内容分配宽度，地址列优先保证显示空间。 */
.vehicle-location table th:nth-child(1), .vehicle-location table td:nth-child(1) { width:100px; }
.vehicle-location table th:nth-child(2), .vehicle-location table td:nth-child(2) { width:100px; }
.vehicle-location table th:nth-child(3), .vehicle-location table td:nth-child(3) { width:145px; }
.vehicle-location table th:nth-child(4), .vehicle-location table td:nth-child(4) { width:105px; }
.vehicle-location table th:nth-child(5), .vehicle-location table td:nth-child(5) { width:70px; }
.vehicle-location table th:nth-child(6), .vehicle-location table td:nth-child(6) { width:370px; }
.vehicle-location table th:nth-child(7), .vehicle-location table td:nth-child(7) { width:150px; }
.vehicle-location table th:nth-child(8), .vehicle-location table td:nth-child(8) { width:125px; }
.vehicle-location table th:nth-child(9), .vehicle-location table td:nth-child(9) { width:115px; }
.vehicle-location table th:nth-child(10), .vehicle-location table td:nth-child(10) { width:105px; }
.vehicle-location table th:nth-child(11), .vehicle-location table td:nth-child(11) { width:85px; }
.vehicle-location table td { overflow:hidden; text-overflow:ellipsis; }

.vehicle-location { transform-origin:50% 50%; }
.vehicle-location::backdrop { background:transparent; }

.vehicle-location-transitioning { will-change:transform,opacity; pointer-events:none; }

/* 车辆定位页响应式布局：只作用于定位页，保证地图与定位明细始终在当前视口内。 */
.vehicle-location {
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  max-width: none;
  max-height: none;
}
.vehicle-location-body,
.vehicle-location-main {
  min-width: 0;
  min-height: 0;
}
.vehicle-location-main { overflow: hidden; }
.vehicle-location-maparea { min-height: 0; }
.vehicle-location-details { min-height: 0; }
.vehicle-location .vehicle-table-wrap {
  height: clamp(96px, 18vh, 180px);
  max-height: none;
  min-height: 70px;
}

@media (max-width: 900px) {
  .vehicle-location-header {
    height: auto;
    min-height: 56px;
    padding: 8px 12px;
    gap: 10px;
    flex-wrap: wrap;
  }
  .vehicle-location-heading { flex: 1 1 auto; }
  .vehicle-location h1 { font-size: clamp(18px, 4vw, 24px); }
  .vehicle-location-heading > span { padding-left: 10px; }
  .vehicle-location .vehicle-clock { font-size: 11px; }
  .vehicle-location-header > .vehicle-return-dashboard { min-width: 78px; height: 34px; padding: 0 9px; }
  .vehicle-location-filters {
    min-height: 52px;
    padding: 7px 10px;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .vehicle-location .vehicle-field { gap: 6px; }
  .vehicle-location input:not([type=checkbox]),
  .vehicle-location select { width: 150px; min-width: 150px; }
  .vehicle-location-body { flex-direction: column; overflow: hidden; }
  .vehicle-location-sidebar {
    width: 100%;
    max-height: 34vh;
    flex: 0 1 34vh;
    border-right: 0;
    border-bottom: 1px solid #2a678e;
  }
  .vehicle-location-sidebar h2 { padding: 8px 12px 6px; }
  .vehicle-location-summary { padding: 4px 12px 8px; }
  .vehicle-location .vehicle-row { padding: 8px 10px; }
  .vehicle-location-main { flex: 1 1 auto; min-height: 0; }
  .vehicle-location-maparea { flex: 1 1 auto; min-height: 220px; }
  .vehicle-location-details { flex: 0 0 auto; }
  .vehicle-location .vehicle-detail-header { height: 36px; padding: 5px 8px; }
  .vehicle-location .vehicle-table-wrap { height: clamp(100px, 25vh, 180px); min-height: 80px; }
  .vehicle-location footer { padding: 7px 12px; }
}

@media (max-width: 600px) {
  .vehicle-location-heading { width: calc(100% - 90px); }
  .vehicle-location-heading > span { display: none; }
  .vehicle-location .vehicle-clock { order: 3; width: 100%; padding-left: 4px; }
  .vehicle-location-header > .vehicle-return-dashboard { margin-left: auto; }
  .vehicle-location-sidebar { max-height: 30vh; flex-basis: 30vh; }
  .vehicle-location-maparea { min-height: 180px; }
  .vehicle-location .vehicle-table-wrap { height: 24vh; min-height: 88px; }
  .vehicle-location th, .vehicle-location td { padding: 6px 8px; }
}

@media (orientation: landscape) and (max-height: 600px) {
  .vehicle-location-sidebar { max-height: 28vh; flex-basis: 28vh; }
  .vehicle-location .vehicle-table-wrap { height: 24vh; min-height: 78px; }
}