/* Mobile UI v5 — second real-device cleanup from iPhone review. */
@media (max-width: 760px) {
  *, *::before, *::after { box-sizing:border-box; }

  /* Native selects stay native, but keep the closed control compact. */
  select { min-height:40px !important; }

  /* System Health — make glance data a strip rather than dashboard-sized tiles. */
  .diagnostics-category-body { padding:7px !important; overflow-x:hidden !important; }
  .diagnostics-category .fleet-summary {
    display:grid !important;
    grid-template-columns:repeat(5,minmax(74px,1fr)) !important;
    gap:1px !important;
    overflow-x:auto !important;
    border:1px solid var(--m3-line) !important;
    border-radius:9px !important;
    background:var(--m3-line) !important;
    scrollbar-width:none;
  }
  .diagnostics-category .fleet-summary::-webkit-scrollbar { display:none; }
  .diagnostics-category .fleet-tile {
    min-height:56px !important;
    padding:6px !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
  }
  .diagnostics-category .fleet-tile-value { font-size:17px !important; line-height:1.05 !important; }
  .diagnostics-category .fleet-tile-label { font-size:8px !important; line-height:1.1 !important; }
  .diagnostics-category .fleet-tile-sub { display:none !important; }

  /* Alert feed: one compact operational line per warning. */
  .diagnostics-category .alert-panel { margin-top:6px !important; }
  .diagnostics-category .alert-list { display:grid !important; gap:4px !important; margin:0 !important; padding:0 !important; }
  .diagnostics-category .alert-list li { margin:0 !important; }
  .diagnostics-category .alert-row {
    display:grid !important;
    grid-template-columns:18px minmax(0,1fr) !important;
    gap:1px 5px !important;
    min-height:0 !important;
    padding:6px 7px !important;
    border-radius:8px !important;
  }
  .diagnostics-category .alert-severity { grid-row:1 / span 2; font-size:11px !important; }
  .diagnostics-category .alert-message { font-size:9.5px !important; line-height:1.25 !important; }
  .diagnostics-category .alert-time { font-size:8px !important; }

  /* Health overview/performance/inventory cards seen on device. */
  .diagnostics-category .diagnostics-overview-grid,
  .diagnostics-category .diagnostics-summary-grid,
  .diagnostics-category .diagnostics-performance-grid,
  .diagnostics-category .diagnostics-inventory-grid,
  .diagnostics-category .metric-grid,
  .diagnostics-category .stats-grid,
  .diagnostics-category .summary-grid {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:5px !important;
  }
  .diagnostics-category .diagnostics-overview-grid > *,
  .diagnostics-category .diagnostics-summary-grid > *,
  .diagnostics-category .diagnostics-performance-grid > *,
  .diagnostics-category .diagnostics-inventory-grid > *,
  .diagnostics-category .metric-grid > *,
  .diagnostics-category .stats-grid > *,
  .diagnostics-category .summary-grid > * {
    min-height:66px !important;
    padding:8px 9px !important;
    margin:0 !important;
  }

  /* Camera result inventory: dense scan rows instead of tall cards. */
  .diagnostics-category .device-status-grid,
  .diagnostics-category .camera-status-grid,
  .diagnostics-category .camera-results { display:grid !important; gap:4px !important; }
  .diagnostics-category .device-status-tile,
  .diagnostics-category .camera-status-card,
  .diagnostics-category .camera-result {
    min-height:0 !important;
    padding:7px 8px !important;
    margin:0 !important;
    border-radius:8px !important;
  }
  .diagnostics-category .device-status-tile strong,
  .diagnostics-category .camera-status-card strong,
  .diagnostics-category .camera-result strong { font-size:11px !important; }
  .diagnostics-category .device-status-tile p,
  .diagnostics-category .camera-status-card p,
  .diagnostics-category .camera-result p { margin:2px 0 !important; font-size:8.5px !important; }

  /* Poor performers table/cards: remove the label/value desktop card treatment. */
  .diagnostics-category .mobile-card-list tr {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    gap:2px 7px !important;
    padding:7px 8px !important;
    margin-bottom:4px !important;
  }
  .diagnostics-category .mobile-card-list td { padding:0 !important; border:0 !important; font-size:9px !important; }
  .diagnostics-category .mobile-card-list td::before { display:none !important; }
  .diagnostics-category .mobile-card-list td:first-child { grid-column:1 / -1 !important; }

  /* Motion setup diagnostics are status chips, not four large dashboard cards. */
  .motion-setup-page .motion-diagnostics-banner {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:5px !important;
    margin:7px 0 8px !important;
  }
  .motion-setup-page .motion-diagnostic {
    min-height:64px !important;
    padding:7px 9px !important;
    border-radius:9px !important;
    text-align:left !important;
  }
  .motion-setup-page .motion-diagnostic span { font-size:9px !important; line-height:1.15 !important; }
  .motion-setup-page .motion-diagnostic strong { font-size:22px !important; line-height:1 !important; margin:2px 0 !important; }
  .motion-setup-page .motion-diagnostic small { font-size:8px !important; }
  .motion-setup-page .filter-bar { margin-left:0 !important; margin-right:0 !important; }
  .motion-setup-page .motion-setup-group { margin:0 0 5px !important; border-radius:9px !important; }
  .motion-setup-page .motion-setup-group > summary { min-height:48px !important; padding:8px 10px !important; }
  .motion-setup-page .motion-setup-group > summary strong { font-size:13px !important; line-height:1.15 !important; }
  .motion-setup-page .motion-setup-group > summary span { font-size:10px !important; }
  .motion-setup-page .motion-setup-rows { gap:4px !important; padding:5px !important; }
  .motion-setup-page .motion-setup-row { min-height:58px !important; padding:7px 9px !important; gap:6px !important; }
  .motion-setup-page .motion-setup-row-info strong { font-size:11px !important; line-height:1.2 !important; }
  .motion-setup-page .motion-setup-row-info span { font-size:9px !important; }
  .motion-setup-page .motion-setup-row .ai-status { flex:0 0 auto; max-width:108px !important; padding:4px 7px !important; font-size:8px !important; line-height:1.1 !important; }

  /* Motion camera editor: retain the good sheet but tighten vertical rhythm. */
  .settings-modal .motion-setup-detail { gap:8px !important; }
  .settings-modal .motion-setup-camera-heading { gap:5px !important; }
  .settings-modal .motion-setup-controls { gap:7px !important; }
  .settings-modal .motion-setup-controls .feature-toggle { min-height:46px !important; padding:5px 0 !important; }
  .settings-modal .motion-analytics-tools { margin-top:2px !important; padding-top:8px !important; }

  /* All settings editors: force the sheet and its body to the viewport. This fixes
     Maps inheriting desktop form widths and rendering off the left edge. */
  .settings-modal-backdrop {
    padding:0 !important;
    align-items:flex-end !important;
    justify-content:center !important;
    overflow:hidden !important;
  }
  .settings-modal {
    position:relative !important;
    inset:auto !important;
    transform:none !important;
    width:100vw !important;
    max-width:100vw !important;
    min-width:0 !important;
    max-height:calc(100dvh - 58px) !important;
    margin:0 !important;
    border-radius:18px 18px 0 0 !important;
    overflow:hidden !important;
  }
  .settings-modal > header {
    width:100% !important;
    min-height:58px !important;
    padding:9px 12px !important;
  }
  .settings-modal > header h3 {
    min-width:0 !important;
    max-width:calc(100% - 52px) !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    font-size:17px !important;
  }
  .settings-modal-body {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    padding:10px !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
  }
  .settings-modal-body > *,
  .settings-modal-body form,
  .settings-modal-body .round-editor-panel,
  .settings-modal-body .map-edit-form {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-left:0 !important;
    margin-right:0 !important;
    transform:none !important;
  }

  /* Maps: compact selectors; never allow the 302 selected drivers to widen the sheet. */
  .map-edit-form { gap:8px !important; padding:0 !important; }
  .map-edit-form > label { margin:0 !important; }
  .map-edit-form .group-assignment-section {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:8px !important;
    overflow:hidden !important;
    border-radius:10px !important;
  }
  .map-edit-form .group-assignment-heading { gap:6px !important; }
  .map-edit-form .group-assignment-heading h4 { font-size:13px !important; }
  .map-edit-form .group-assignment-heading p { display:none !important; }
  .map-edit-form .group-assignment-tools { display:grid !important; grid-template-columns:1fr auto !important; gap:5px !important; }
  .map-edit-form .group-assignment-tools label { min-width:0 !important; }
  .map-edit-form .group-assignment-tools label > span { display:none !important; }
  .map-edit-form .group-assignment-tools input { width:100% !important; min-width:0 !important; }
  .map-edit-form .group-assignment-tools button { width:auto !important; white-space:nowrap; }
  .map-edit-form .assignment-picker,
  .map-edit-form .assignment-picker-list,
  .map-edit-form .assignment-selected { max-width:100% !important; min-width:0 !important; overflow-x:hidden !important; }
  .map-edit-form .assignment-selected { max-height:116px !important; overflow-y:auto !important; }
  .map-edit-form .assignment-chip,
  .map-edit-form .assignment-selected > * { max-width:100% !important; min-width:0 !important; }
  .map-edit-form .assignment-chip { overflow:hidden !important; text-overflow:ellipsis !important; white-space:nowrap !important; }
  .map-edit-form .assignment-picker-list { max-height:190px !important; overflow-y:auto !important; }
  .map-edit-form .assignment-picker-list > * { min-height:46px !important; padding:6px 8px !important; }

  /* Keep bottom nav above content but below modal sheets. */
  .settings-modal-backdrop { z-index:4000 !important; }
}