@import url("./device-evidence.css");
/* Fleet UI refinement: softer surfaces, clearer hierarchy and mobile controls. */
#fleetView .flt-filters{display:flex;gap:7px;flex-wrap:wrap}#fleetView .flt-filters button{font-size:12px}#fleetView .flt-filters button[aria-pressed=true]{background:var(--fl-ink);color:var(--fl-paper);border-color:var(--fl-ink)}
#fleetView .flt-btn:focus-visible,#fleetView .flt-card--tap:focus-visible,#fleetView summary:focus-visible{outline:3px solid var(--fl-mint);outline-offset:3px}
#fleetView .flt-vehicle-list>.flt-card{display:grid;grid-template-columns:74px minmax(0,1fr);gap:18px;align-items:center}#fleetView .flt-vehicle-mini{display:grid;place-items:center;background:var(--fl-card-2);border-radius:12px;min-height:115px}#fleetView .flt-vehicle-mini svg{width:65px;height:110px;max-width:100%}#fleetView .flt-vehicle-content{display:flex;flex-direction:column;gap:12px;min-width:0}
#fleetView .flt-kicker{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--fl-text-2);display:block;margin-bottom:6px}
#fleetView .flt-device-intro{display:flex;justify-content:space-between;align-items:center;gap:18px}#fleetView .flt-device-intro h2{font-size:26px;letter-spacing:-.035em;margin:0;color:var(--fl-text)}#fleetView .flt-device-intro p{font-size:13px;color:var(--fl-text-2);margin:8px 0 0;max-width:550px}#fleetView .flt-device-intro>button{flex:none}
#fleetView .flt-device-list .flt-card{display:flex;flex-direction:column;gap:18px}#fleetView .flt-device-list h3{margin:0}#fleetView .flt-device-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding-bottom:16px;border-bottom:1px solid var(--fl-line)}#fleetView .flt-device-facts span{display:block;font-size:11px;color:var(--fl-text-2);margin-bottom:4px}#fleetView .flt-device-facts strong{font-size:13px;overflow-wrap:anywhere}
#fleetView .flt-device-settings{padding:0 16px}#fleetView .flt-device-settings summary{min-height:48px;display:flex;align-items:center;cursor:pointer;font-weight:600}#fleetView .flt-device-settings p{margin:0 0 14px;overflow-wrap:anywhere}
@media(max-width:600px){#fleetView .flt-device-intro{align-items:flex-start;flex-direction:column}#fleetView .flt-device-intro h2{font-size:24px}#fleetView .flt-device-facts{grid-template-columns:1fr 1fr}#fleetView .flt-device-facts>div:last-child{grid-column:1/-1}}
@media(max-width:420px){#fleetView .flt-vehicle-list>.flt-card{grid-template-columns:45px minmax(0,1fr);gap:11px}#fleetView .flt-vehicle-mini{min-height:90px}#fleetView .flt-vehicle-mini svg{width:44px;height:80px}#fleetView .flt-filters{gap:5px}#fleetView .flt-filters button{font-size:11px;padding:8px 10px}}
#fleetView.flt-polished {
  --fl-bg: #f4f6f2; --fl-card: #ffffff; --fl-card-2: #e8eee8;
  --fl-line: #dce5de; --fl-text: #122e34; --fl-text-2: #5b716c;
  --fl-mint-text: #0d7a6b; --fl-amber-text: #8a5a0a;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, sans-serif;
  font-size: 15px; line-height: 1.5; min-height: 100%;
}
[data-theme="dark"] #fleetView.flt-polished {
  --fl-bg: #10292e; --fl-card: #17373c; --fl-card-2: #21464b;
  --fl-line: #315057; --fl-text: #f4f6f2; --fl-text-2: #b7cbc5;
  --fl-mint-text: #00c3a9; --fl-amber-text: #f1aa3e;
}
#fleetView .flt-wrap {max-width:1180px;padding:22px 28px 28px;gap:22px;}
#fleetView .flt-topbar {display:flex;align-items:center;justify-content:space-between;gap:20px;}
#fleetView .flt-brand {padding:0;gap:11px;}
#fleetView .flt-brand svg {width:42px;height:42px;}
#fleetView .flt-brand-word {font-size:22px;letter-spacing:-.02em;}
#fleetView .flt-brand-sub {font-size:11px;margin-top:5px;letter-spacing:.02em;}
#fleetView .flt-top-actions {display:flex;gap:8px;align-items:center;}
#fleetView .flt-btn {border-width:1px;font-size:13px;border-radius:11px;min-height:48px;padding:11px 16px;font-weight:650;letter-spacing:0;}
#fleetView .flt-btn--primary {box-shadow:0 3px 8px #00c3a914;}
#fleetView .flt-btn--quiet {min-height:48px;}
#fleetView .flt-tabs {background:transparent;border:0;border-bottom:1px solid var(--fl-line);border-radius:0;padding:0;display:flex;gap:24px;}
#fleetView .flt-tab {min-height:48px;font-size:13px;border-radius:0;padding:0 3px;position:relative;}
#fleetView .flt-tab[aria-selected="true"] {background:transparent;color:var(--fl-text);}
#fleetView .flt-tab[aria-selected="true"]::after {content:"";position:absolute;bottom:-1px;left:0;right:0;height:3px;border-radius:3px;background:var(--fl-mint);}
#fleetView .flt-stats {gap:12px;}
#fleetView .flt-stat {border-radius:16px;padding:17px 18px;}
#fleetView .flt-stat b {font-size:29px;font-weight:650;letter-spacing:-.04em;}
#fleetView .flt-stat span {font-size:11px;margin-top:7px;letter-spacing:.07em;}
#fleetView .flt-stat.is-due {background:#fff3da;border-color:#efd8aa;}
#fleetView .flt-stat.is-due b,#fleetView .flt-stat.is-due span {color:#705015;}
#fleetView .flt-panel {display:flex;flex-direction:column;gap:20px;min-width:0;}
#fleetView .flt-detail-head {padding:2px 0 4px;gap:13px;}
#fleetView .flt-detail-head h2 {font-size:32px;font-weight:650;letter-spacing:-.045em;}
#fleetView .flt-detail-head .flt-row {justify-content:flex-start;}
#fleetView .flt-detail-head .flt-row>.flt-btn {flex:0 1 auto;}
#fleetView .flt-card-meta {font-size:12px;gap:10px;}
#fleetView .flt-card-meta b {font-weight:650;}
#fleetView .flt-meters {grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
#fleetView .flt-meter {padding:17px 16px;border-radius:16px;}
#fleetView .flt-meter b {font-size:24px;font-weight:650;letter-spacing:-.035em;line-height:1.15;}
#fleetView .flt-meter small {font-size:11px;white-space:normal;line-height:1.45;}
#fleetView .flt-list {gap:12px;}
#fleetView .flt-card {padding:18px 20px;border-radius:18px;gap:12px;}
#fleetView .flt-card--tap {border-width:1px;transition:border-color .15s,box-shadow .15s;}
#fleetView .flt-card--tap:hover {border-color:#8fb7a8;box-shadow:0 6px 20px #102a2e06;}
#fleetView .flt-card--due {border-color:#e9d6ac;}
#fleetView .flt-card-title {font-size:19px;font-weight:650;letter-spacing:-.025em;}
#fleetView .flt-pill {font-size:11px;font-weight:700;letter-spacing:.045em;border-width:1px;min-height:26px;padding:4px 9px;}
#fleetView .flt-pill.s-unknown {background:var(--fl-card-2);}
#fleetView .flt-comp {gap:11px 10px;}
#fleetView .flt-comp-name {font-size:16px;font-weight:650;white-space:normal;line-height:1.45;}
#fleetView .flt-comp-name small {font-size:11px;font-weight:500;margin-left:6px;}
#fleetView .flt-comp-big {font-size:27px;font-weight:650;letter-spacing:-.035em;margin:2px 0 0;}
#fleetView .flt-comp-big small {font-size:12px;letter-spacing:0;font-weight:400;line-height:1.5;margin-top:5px;}
#fleetView .flt-comp-reason {font-size:13px;font-weight:400;line-height:1.55;color:var(--fl-text-2);}
#fleetView .flt-comp-line {font-size:11px;line-height:1.5;gap:4px 14px;}
#fleetView .flt-comp-actions {grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding-top:7px;border-top:1px solid var(--fl-line);}
#fleetView .flt-comp-actions .flt-btn--quiet {grid-column:auto;}
#fleetView .flt-bar {height:6px;}
#fleetView .flt-criteria {grid-column:1/-1;display:flex;flex-direction:column;gap:7px;font-size:11px;color:var(--fl-text-2);}
#fleetView .flt-criteria>div {display:flex;gap:12px;justify-content:space-between;align-items:baseline;}
#fleetView .flt-criteria span {flex:none;font-weight:600;}
#fleetView .flt-criteria p {margin:0;text-align:right;line-height:1.45;}
#fleetView .flt-section h3 {font-size:11px;font-weight:650;letter-spacing:.09em;}
#fleetView .flt-event {font-size:13px;padding:12px 0;grid-template-columns:86px minmax(0,1fr);}
#fleetView .flt-event time {font-size:11px;font-weight:500;}
#fleetView .flt-event-kind {font-weight:650;}
#fleetView .flt-note {font-size:13px;line-height:1.6;border-left-width:3px;}
#fleetView .flt-empty {font-size:13px;border-width:1px;padding:30px 20px;}
#fleetView .flt-field input {font-size:16px;min-height:48px;}
#fleetView .nfv-inspector {--nv-ink:var(--fl-text);--nv-muted:var(--fl-text-2);--nv-paper:var(--fl-bg);--nv-card:var(--fl-card);--nv-line:var(--fl-line);}
#fleetView .nfv-heading {color:var(--fl-text);}
#fleetView .nfv-heading .nfv-eyebrow,#fleetView .nfv-heading .nfv-caption {color:var(--fl-text-2);}
#fleetView .nfv-hotspot {min-height:54px;}
#fleetView .nfv-controls .nfv-attention {min-height:48px;}
@media(max-width:760px){#fleetView .flt-wrap{padding:18px 18px 24px;gap:18px}#fleetView .flt-meters{grid-template-columns:1fr 1fr}#fleetView .flt-detail-head h2{font-size:29px}#fleetView .flt-card-row{flex-wrap:wrap}#fleetView .flt-card-meta{font-size:12px}#fleetView .flt-card-title{white-space:normal}#fleetView .flt-criteria>div{display:block}#fleetView .flt-criteria p{text-align:left;margin-top:2px}}
@media(max-width:420px){#fleetView .flt-wrap{padding:16px 12px 24px}#fleetView .flt-topbar{gap:8px}#fleetView .flt-brand-word{font-size:18px}#fleetView .flt-brand svg{width:33px;height:33px}#fleetView .flt-brand-sub{font-size:11px;max-width:140px}#fleetView .flt-top-actions .flt-btn--primary{font-size:12px;padding:9px}#fleetView .flt-top-actions{gap:5px}#fleetView .flt-card{padding:15px}#fleetView .flt-comp{grid-template-columns:minmax(0,1fr)}#fleetView .flt-comp>.flt-pill{justify-self:start}#fleetView .flt-stat{padding:14px}#fleetView .flt-meters{gap:8px}#fleetView .flt-meter{padding:14px 12px}#fleetView .flt-meter b{font-size:23px}}
@media(prefers-reduced-motion:reduce){#fleetView .flt-btn,#fleetView .flt-card--tap{transition:none;transform:none}}

@media(max-width:420px){#fleetView .flt-topbar{flex-wrap:wrap}#fleetView .flt-top-actions{margin-left:auto}}

/* One decision per component card; supporting records stay a tap away. */
#fleetView .flt-part-card .flt-comp{gap:9px 12px}
#fleetView .flt-part-card .flt-comp-big{font-size:25px;line-height:1.22;margin:2px 0}
#fleetView .flt-part-meta{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:3px 12px;font-size:11px;line-height:1.5;color:var(--fl-text-2);overflow-wrap:anywhere}
#fleetView .flt-part-meta .flt-inline-err{font:inherit;color:var(--fl-amber-text)}
#fleetView .flt-part-incomplete{grid-column:1/-1;font-size:12px;color:var(--fl-amber-text)}
#fleetView .flt-part-actions{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:8px;margin-top:4px}
#fleetView .flt-part-actions>.flt-btn{width:100%}
#fleetView .flt-part-more{min-width:0;border:1px solid var(--fl-line);border-radius:11px;background:var(--fl-card)}
#fleetView .flt-part-card summary{min-height:48px;cursor:pointer;font-size:12px;font-weight:600;padding:13px 12px;box-sizing:border-box;line-height:20px;overflow-wrap:anywhere}
#fleetView .flt-part-more>div{display:grid;gap:6px;padding:0 7px 7px}
#fleetView .flt-part-more .flt-btn{width:100%;min-width:0;min-height:48px;font-size:12px;padding:10px 8px}
#fleetView .flt-part-more .flt-btn--quiet{border-top:1px solid var(--fl-line);border-radius:0 0 7px 7px;font-weight:500}
#fleetView .flt-part-evidence{grid-column:1/-1;min-width:0;border-top:1px solid var(--fl-line)}
#fleetView .flt-part-evidence>summary{padding-left:0;padding-right:0;color:var(--fl-text-2)}
#fleetView .flt-part-evidence-body{display:grid;gap:12px;padding:0 0 5px;overflow-wrap:anywhere}
#fleetView .flt-part-evidence .flt-comp-reason{font-size:12px}
#fleetView .flt-part-evidence .flt-bar{height:5px}
@media(max-width:420px){#fleetView .flt-part-card .flt-comp-big{font-size:24px}#fleetView .flt-part-card{padding-bottom:4px}}

/* Per-vehicle device roles; report freshness is separate from ingest permission. */
#fleetView .flt-device-vehicle{margin:24px 0 32px}
#fleetView .flt-device-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:start}
#fleetView .flt-device-slot{min-width:0}
#fleetView .flt-device-slot>h4{font-size:15px;margin:0 0 12px;color:var(--fl-text)}
#fleetView .flt-device-slot>h4>span{color:var(--fl-text-2);font-size:12px;margin-right:5px}
#fleetView .flt-device-card{padding:18px;min-width:0}
#fleetView .flt-device-card+.flt-device-card{margin-top:12px}
#fleetView .flt-device-card .flt-card-row{align-items:flex-start;flex-direction:column;gap:9px}
#fleetView .flt-device-card .flt-device-facts{grid-template-columns:1fr;gap:12px}
#fleetView .flt-device-card .nf-device-evidence-grid{grid-template-columns:1fr}
#fleetView .flt-device-empty{padding:18px;border:1px dashed var(--fl-line);border-radius:16px;color:var(--fl-text-2);font-size:13px;min-height:160px}
#fleetView .flt-device-empty strong{display:block;color:var(--fl-text);font-weight:600}
#fleetView .flt-device-empty p{line-height:1.5;margin:10px 0 14px}
#fleetView .flt-device-manage{border-top:1px solid var(--fl-line);margin-top:14px}
#fleetView .flt-device-manage>summary{min-height:48px;display:flex;align-items:center;cursor:pointer;color:var(--fl-text-2);font-size:13px}
#fleetView .flt-device-manage>summary::after{content:'+';margin-left:auto}
#fleetView .flt-device-manage[open]>summary::after{content:'−'}
@media(max-width:850px){#fleetView .flt-device-slots{grid-template-columns:1fr}#fleetView .flt-device-card .flt-device-facts{grid-template-columns:repeat(2,minmax(0,1fr))}#fleetView .flt-device-card .nf-device-evidence-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:420px){#fleetView .flt-device-card .flt-device-facts,#fleetView .flt-device-card .nf-device-evidence-grid{grid-template-columns:1fr}}

/* ─── LANDSCAPE PHONES (owner, 2026-09-24: the app is used mostly sideways) ───
   A phone on its side is ~390px tall: the header, tabs and totals used to fill
   it before the first vehicle. Tighter spacing, the totals as one slim row.
   Controls keep the 48px phone floor. It lives here, last, because this file
   loads after fleet.css and restates .flt-stat. */
@media (max-height: 520px) and (orientation: landscape) {
  #fleetView .flt-wrap { gap: 8px; padding-top: 6px; }
  #fleetView .flt-logo { height: 28px; }
  #fleetView .flt-tagline { display: none; }
  #fleetView .flt-stat { min-height: 48px; padding: 6px 12px; display: flex; align-items: center; gap: 10px; border-radius: 10px; }
  #fleetView .flt-stat b { font-size: 22px; }
  #fleetView .flt-stat span { margin-top: 0; }
  #fleetView .flt-map { height: calc(100dvh - 150px); min-height: 220px; }
}