
/* ===== Telemetrix theme v2 (closer to mockup, all-blue) ===== */
:root{
  --tmx-bg:#eef1f6; --tmx-rail:#ffffff; --tmx-panel:#f8fafc;
  --tmx-surface:#ffffff; --tmx-surface2:#f1f4f9;
  --tmx-line:#e4e9f0; --tmx-line-soft:#eef1f6;
  --tmx-txt:#1b2331; --tmx-txt2:#586379; --tmx-mut:#8b94a6;
  --tmx-accent:#1f63e6; --tmx-accent2:#3f7cff; --tmx-accent-dim:#1f63e614;
  --tmx-off:#7e8a9c; --tmx-off-dim:#7e8a9c1a;
  --tmx-radius:14px; --tmx-radius-sm:11px;
  --tmx-display:"Space Grotesk","Inter",sans-serif;
}

/* base */
body{ background:var(--tmx-bg) !important; }
[class*="muiltr-1rz0of5-root"]{ background:var(--tmx-bg) !important; }

/* ===== LEFT RAIL ===== */
[class*="muiltr-nnudq-sidebar"]{
  background:var(--tmx-rail) !important;
  border-right:1px solid var(--tmx-line-soft) !important;
  padding-top:4px !important;
}
[class*="-brand"]{ padding:14px 14px 20px !important; }
[class*="-navItem"]{
  border-radius:11px !important; margin:2px 8px !important;
  color:var(--tmx-txt2) !important; font-weight:500 !important; min-height:44px !important;
  transition:background .16s,color .16s !important; position:relative !important; overflow:visible !important;
}
[class*="-navItem"] .MuiListItemIcon-root,[class*="-navItem"] svg{ color:var(--tmx-mut) !important; }
[class*="-navItem"]:hover{ background:rgba(22,30,46,.05) !important; color:var(--tmx-txt) !important; }
[class*="navItemActive"]{
  background:linear-gradient(90deg,var(--tmx-accent-dim),transparent 85%) !important;
  color:var(--tmx-accent) !important; font-weight:600 !important;
}
[class*="navItemActive"] svg,[class*="navItemActive"] .MuiListItemIcon-root{ color:var(--tmx-accent) !important; }
[class*="navItemActive"]::before{
  content:"" !important; position:absolute !important; left:-8px; top:9px; bottom:9px;
  width:3px; border-radius:0 3px 3px 0; background:var(--tmx-accent);
  box-shadow:0 0 12px var(--tmx-accent);
}
[class*="muiltr-nnudq-sidebar"] .MuiTypography-overline,
[class*="muiltr-nnudq-sidebar"] .MuiListSubheader-root{
  font-size:10.5px !important; font-weight:700 !important; letter-spacing:1.4px !important;
  color:var(--tmx-mut) !important; text-transform:uppercase !important; line-height:2.4 !important;
}

/* ===== FLEET PANEL ===== */
[class*="-c8xfd3-sidebar"]{ background:var(--tmx-panel) !important; }
[class*="-header"]{
  background:var(--tmx-panel) !important;
  border-bottom:1px solid var(--tmx-line-soft) !important; box-shadow:none !important;
}
[class*="-contentList"]{ background:var(--tmx-panel) !important; box-shadow:none !important; }

/* search field */
.MuiOutlinedInput-root{
  border-radius:var(--tmx-radius-sm) !important; background:var(--tmx-surface) !important;
}
.MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline{ border-color:var(--tmx-line) !important; }
.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline{
  border-color:var(--tmx-accent) !important; box-shadow:0 0 0 3px var(--tmx-accent-dim) !important;
}

/* ALL toolbar buttons -> blue accent (no orange) */
[class*="-toolbar"] .MuiIconButton-root{ border-radius:11px !important; color:var(--tmx-txt2) !important; }
[class*="-toolbar"] .MuiIconButton-edgeEnd.MuiIconButton-sizeMedium{
  background:var(--tmx-accent) !important; color:#fff !important; width:40px !important; height:40px !important;
}
[class*="-toolbar"] .MuiIconButton-edgeEnd.MuiIconButton-sizeMedium:hover{ background:var(--tmx-accent2) !important; }

/* ===== DEVICE CARDS (mockup style) ===== */
[class*="-list"]{ padding:12px 4px !important; }
[class*="-list"] .MuiListItemButton-root{
  background:var(--tmx-surface) !important;
  border:1px solid var(--tmx-line) !important;
  border-radius:var(--tmx-radius) !important;
  margin:0 8px 9px !important; padding:11px 12px 11px 18px !important;
  position:relative !important; overflow:hidden !important;
  transition:border .16s,background .16s,transform .12s !important;
}
/* colored left bar (offline grey by default) */
[class*="-list"] .MuiListItemButton-root::before{
  content:"" !important; position:absolute !important; left:0; top:0; bottom:0; width:3px;
  background:var(--tmx-off) !important;
}
[class*="-list"] .MuiListItemButton-root:hover{
  border-color:#c4cedc !important; background:var(--tmx-surface2) !important; transform:translateX(2px) !important;
}
[class*="-list"] .MuiListItemButton-root.Mui-selected{
  border-color:var(--tmx-accent) !important; background:var(--tmx-surface2) !important;
  box-shadow:0 0 0 1px var(--tmx-accent),0 10px 26px -14px rgba(31,99,230,.5) !important;
}
[class*="-list"] .MuiListItemButton-root.Mui-selected::before{ background:var(--tmx-accent) !important; }

/* avatar -> rounded square colored box (like .veh__ico) */
.MuiListItemAvatar-root .MuiAvatar-root{
  border-radius:12px !important; width:44px !important; height:44px !important;
  background:var(--tmx-off-dim) !important; border:1px solid var(--tmx-off) !important;
}
.MuiListItemAvatar-root .MuiAvatar-root img{ filter:none !important; opacity:.85 !important; }

/* primary/secondary text */
.MuiListItemText-primary{ font-weight:600 !important; color:var(--tmx-txt) !important; font-size:14px !important; }
.MuiListItemText-secondary{ color:var(--tmx-mut) !important; font-size:12px !important; font-family:"JetBrains Mono",ui-monospace,monospace !important; }

/* ===== MAP CONTROLS ===== */
.maplibregl-ctrl-group{ border-radius:11px !important; overflow:hidden !important; box-shadow:0 16px 44px -18px rgba(23,35,60,.20) !important; border:1px solid var(--tmx-line) !important; }

/* ===== DETAIL POPUP CARD ===== */
[class*="-card"].MuiCard-root{
  border-radius:16px !important; border:1px solid var(--tmx-line) !important;
  box-shadow:0 16px 44px -18px rgba(23,35,60,.30) !important; overflow:hidden !important;
}
[class*="-card"].MuiCard-root a,[class*="-card"].MuiCard-root .MuiLink-root{ color:var(--tmx-accent) !important; }

/* ===== Overview (Visão Geral) stat cards -> all blue accent ===== */
[class*="-root"] .MuiCardActionArea-root, .MuiPaper-root.MuiCard-root{ }

/* timestamp "error/late" colour -> neutral grey to match mockup */
[class*="-list"] .MuiListItemText-secondary [class*="-error"],
[class*="-list"] [class*="muiltr-z0vndf-error"]{ color:var(--tmx-mut) !important; }

/* "Frota" title above the toolbar */
.muiltr-1d5hu78-header{ position:relative !important; padding-top:46px !important; }
.muiltr-1d5hu78-header::before{
  content:"Frota" !important;
  position:absolute !important; left:18px; top:14px;
  font-family:var(--tmx-display) !important; font-size:17px !important; font-weight:600 !important;
  letter-spacing:-.3px !important; color:var(--tmx-txt) !important;
}
/* "AO VIVO" pill on the right of the title */
.muiltr-1d5hu78-header::after{
  content:"● AO VIVO" !important;
  position:absolute !important; right:18px; top:18px;
  font-size:10.5px !important; font-weight:700 !important; letter-spacing:.6px !important;
  color:#0e9d6c !important;
}

/* ==== v3 refinements ==== */
/* vehicle list item: blue left accent bar + lift */
[class*="-list"] .MuiListItemButton-root{
  position:relative !important;
  border-radius:14px !important;
  margin:0 10px 8px 10px !important;
  background:#ffffff !important;
  border:1px solid var(--tmx-line) !important;
  box-shadow:0 6px 18px -14px rgba(23,35,60,.35) !important;
  overflow:hidden !important;
}
[class*="-list"] .MuiListItemButton-root::before{
  content:"" !important;
  position:absolute !important; left:0; top:8px; bottom:8px; width:4px !important;
  border-radius:4px !important;
  background:var(--tmx-accent) !important;
  opacity:.55 !important;
}
[class*="-list"] .MuiListItemButton-root.Mui-selected{
  border-color:var(--tmx-accent) !important;
  box-shadow:0 10px 26px -14px rgba(31,99,230,.45) !important;
}
[class*="-list"] .MuiListItemButton-root.Mui-selected::before{ opacity:1 !important; }
/* icon box -> light blue tint, blue glyph */
.MuiListItemAvatar-root .MuiAvatar-root{
  background:rgba(31,99,230,.10) !important;
  border:1px solid rgba(31,99,230,.20) !important;
  color:var(--tmx-accent) !important;
}
.MuiListItemAvatar-root .MuiAvatar-root svg{ color:var(--tmx-accent) !important; opacity:.9 !important; }


/* ==== v4 augment elements ==== */
.tmx-summary{ display:flex !important; gap:8px !important; padding:6px 14px 10px 14px !important; }
.tmx-sc{ flex:1 1 0 !important; display:flex !important; flex-direction:column !important; gap:2px !important;
  padding:8px 10px !important; border-radius:12px !important; background:#fff !important;
  border:1px solid var(--tmx-line) !important; box-shadow:0 6px 16px -14px rgba(23,35,60,.4) !important;
  position:relative !important; overflow:hidden !important; }
.tmx-sc::before{ content:"" !important; position:absolute !important; left:0; top:0; bottom:0; width:3px !important; background:var(--tmx-accent) !important; }
.tmx-sc-n{ font-family:var(--tmx-display) !important; font-size:18px !important; font-weight:700 !important; color:var(--tmx-txt) !important; line-height:1 !important; }
.tmx-sc-l{ font-size:10px !important; font-weight:600 !important; letter-spacing:.2px !important; color:var(--tmx-mut) !important; text-transform:none !important; }
.tmx-sc-mov::before{ background:var(--tmx-accent) !important; }
.tmx-sc-idle::before{ background:#7d8aa3 !important; }
.tmx-sc-off::before{ background:#c2c9d6 !important; }
/* keep virtualized row exactly fitting; tighten internal spacing */
[class*="-list"] .MuiListItemButton-root{ align-items:flex-start !important; padding-top:9px !important; padding-bottom:9px !important; }
[class*="-list"] .MuiListItemAvatar-root{ margin-top:2px !important; }
[class*="-list"] .MuiListItemText-root{ margin:0 !important; }
[class*="-list"] .MuiListItemText-secondary{ margin-bottom:2px !important; }
/* per-row telemetry line: compact, single line */
.tmx-tel{ display:flex !important; align-items:center !important; gap:8px !important; margin-top:3px !important; white-space:nowrap !important; }
.tmx-plate{ font-family:"JetBrains Mono",ui-monospace,monospace !important; font-size:10.5px !important; font-weight:700 !important;
  letter-spacing:.4px !important; color:var(--tmx-accent) !important; background:rgba(31,99,230,.10) !important;
  border:1px solid rgba(31,99,230,.18) !important; border-radius:6px !important; padding:0 5px !important; line-height:15px !important; }
.tmx-kv{ font-size:10.5px !important; color:var(--tmx-mut) !important; font-family:"JetBrains Mono",ui-monospace,monospace !important; }
.tmx-kv b{ color:var(--tmx-txt) !important; font-weight:700 !important; }

/* ==== v5 status colors ==== */
:root{ --tmx-st-moving:#16a34a; --tmx-st-idle:#f5a623; --tmx-st-offline:#e5484d;
  --tmx-st-moving-dim:rgba(22,163,74,.10); --tmx-st-idle-dim:rgba(245,166,35,.12); --tmx-st-offline-dim:rgba(229,72,77,.10);
  --tmx-st-moving-bd:rgba(22,163,74,.22); --tmx-st-idle-bd:rgba(245,166,35,.28); --tmx-st-offline-bd:rgba(229,72,77,.22); }

/* left accent bar by status */
[class*="-list"] .MuiListItemButton-root[data-tmx-status="moving"]::before{ background:var(--tmx-st-moving) !important; opacity:1 !important; }
[class*="-list"] .MuiListItemButton-root[data-tmx-status="idle"]::before{ background:var(--tmx-st-idle) !important; opacity:1 !important; }
[class*="-list"] .MuiListItemButton-root[data-tmx-status="offline"]::before{ background:var(--tmx-st-offline) !important; opacity:1 !important; }

/* icon box tint by status */
[data-tmx-status="moving"] .MuiListItemAvatar-root .MuiAvatar-root{ background:var(--tmx-st-moving-dim) !important; border-color:var(--tmx-st-moving-bd) !important; color:var(--tmx-st-moving) !important; }
[data-tmx-status="moving"] .MuiListItemAvatar-root .MuiAvatar-root svg{ color:var(--tmx-st-moving) !important; }
[data-tmx-status="idle"] .MuiListItemAvatar-root .MuiAvatar-root{ background:var(--tmx-st-idle-dim) !important; border-color:var(--tmx-st-idle-bd) !important; color:var(--tmx-st-idle) !important; }
[data-tmx-status="idle"] .MuiListItemAvatar-root .MuiAvatar-root svg{ color:var(--tmx-st-idle) !important; }
[data-tmx-status="offline"] .MuiListItemAvatar-root .MuiAvatar-root{ background:var(--tmx-st-offline-dim) !important; border-color:var(--tmx-st-offline-bd) !important; color:var(--tmx-st-offline) !important; }
[data-tmx-status="offline"] .MuiListItemAvatar-root .MuiAvatar-root svg{ color:var(--tmx-st-offline) !important; }

/* SELECTED card -> border + glow by status */
[class*="-list"] .MuiListItemButton-root.Mui-selected[data-tmx-status="moving"]{ border-color:var(--tmx-st-moving) !important; box-shadow:0 10px 26px -14px rgba(22,163,74,.5) !important; background:var(--tmx-st-moving-dim) !important; }
[class*="-list"] .MuiListItemButton-root.Mui-selected[data-tmx-status="idle"]{ border-color:var(--tmx-st-idle) !important; box-shadow:0 10px 26px -14px rgba(245,166,35,.5) !important; background:var(--tmx-st-idle-dim) !important; }
[class*="-list"] .MuiListItemButton-root.Mui-selected[data-tmx-status="offline"]{ border-color:var(--tmx-st-offline) !important; box-shadow:0 10px 26px -14px rgba(229,72,77,.5) !important; background:var(--tmx-st-offline-dim) !important; }
[class*="-list"] .MuiListItemButton-root.Mui-selected[data-tmx-status] .MuiListItemButton-root.Mui-selected::before{ opacity:1 !important; }

/* ===== TMX Overview Donut (v6) ===== */
.tmx-ov-dist{display:flex;align-items:center;gap:40px;flex-wrap:wrap;margin:18px 0 6px}
.tmx-ov-donut{position:relative;width:140px;height:140px;flex:none}
.tmx-ov-donut svg{display:block;transform:rotate(-90deg)}
.tmx-ov-donut .tmx-ov-c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:2px}
.tmx-ov-c .tmx-ov-n{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:30px;font-weight:700;line-height:1;letter-spacing:-1px;color:#1b2331}
.tmx-ov-c .tmx-ov-l{font-size:10px;color:#8b94a6;margin-top:4px;letter-spacing:.3px;text-transform:uppercase;font-weight:600;line-height:1}
.tmx-ov-legend{flex:1;min-width:240px;display:flex;flex-direction:column;gap:2px}
.tmx-ov-lg{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:11px;transition:background .14s}
.tmx-ov-lg:hover{background:#f1f4f9}
.tmx-ov-lg .d{width:11px;height:11px;border-radius:4px;flex:none}
.tmx-ov-lg .nm{font-size:13.5px;color:#1b2331;font-weight:500;flex:1}
.tmx-ov-lg .vl{font-family:"JetBrains Mono",monospace;font-size:15px;font-weight:700;color:#1b2331}
.tmx-ov-lg .pc{font-family:"JetBrains Mono",monospace;font-size:12px;color:#8b94a6;width:48px;text-align:right}

/* === TMX Overview Donut framing v7 === */
.tmx-ov-dist{gap:28px;margin:18px 0 4px}
.tmx-ov-legend{flex:0 1 360px;min-width:0;max-width:360px}
.tmx-ov-lg{gap:10px;padding:9px 12px}
.tmx-ov-lg .nm{flex:1;min-width:120px}
.muiltr-uxb3yk-fleet > .muiltr-1jl0rzo-track{display:none}
.muiltr-uxb3yk-fleet > .muiltr-vaew2o-legend{display:none}
[class*="-fleet"] > [class*="-track"]{display:none}
[class*="-fleet"] > [class*="-legend"]{display:none}

/* === Telemetrix: melhor distribuicao da Visao Geral (layout full-width) === */
[class*="-page"] > [class*="MuiBox-root"][class*="-root"]{width:auto !important;max-width:1600px !important;margin-right:auto !important;}
[class*="-page"] [class*="-grid"]{grid-template-columns:repeat(5,minmax(0,1fr)) !important;}
@media (max-width:1200px){[class*="-page"] [class*="-grid"]{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}}
@media (max-width:760px){[class*="-page"] [class*="-grid"]{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}}
[class*="-fleet"]:not([class*="fleetTitle"]){max-width:none !important;width:100% !important;}
.tmx-ov-dist{align-items:center !important;gap:48px !important;}
.tmx-ov-legend{max-width:none !important;flex:1 1 auto !important;}
.tmx-ov-lg{display:grid !important;grid-template-columns:16px 1fr auto auto !important;align-items:center !important;gap:12px !important;padding:8px 0 !important;}

/* === Telemetrix: refinamentos da Distribuicao (donut + barras de progresso) === */
.tmx-ov-donut{flex:0 0 auto !important;}
.tmx-ov-donut svg{width:180px !important;height:180px !important;}
.tmx-ov-dist{align-items:center !important;gap:56px !important;}
.tmx-ov-legend{max-width:none !important;flex:1 1 auto !important;gap:0 !important;}
.tmx-ov-lg{display:grid !important;grid-template-columns:14px 190px 1fr 48px 64px !important;align-items:center !important;gap:18px !important;padding:15px 6px !important;border-bottom:1px solid rgba(125,140,170,0.12) !important;}
.tmx-ov-lg:last-child{border-bottom:none !important;}
.tmx-ov-lg .d{width:14px !important;height:14px !important;border-radius:50% !important;}
.tmx-ov-lg .nm{font-weight:600 !important;font-size:15px !important;}
.tmx-ov-lg .vl{text-align:right !important;font-weight:700 !important;font-size:17px !important;font-variant-numeric:tabular-nums !important;}
.tmx-ov-lg .pc{text-align:right !important;color:#7e8a9c !important;font-weight:600 !important;font-variant-numeric:tabular-nums !important;}
.tmx-bar-wrap{display:block !important;width:100% !important;height:8px !important;border-radius:6px !important;background:rgba(125,140,170,0.15) !important;overflow:hidden !important;}
.tmx-bar-fill{display:block !important;height:100% !important;border-radius:6px !important;min-width:2px !important;transition:width .4s ease !important;}
[class*="-page"] [class*="-grid"] [class*="-card"]{min-height:150px !important;}

/* === Telemetrix: realces nos cards de indicadores === */
[class*="-page"] [class*="-grid"] [class*="-value"]{font-size:38px !important;font-weight:700 !important;line-height:1.05 !important;margin-top:6px !important;}
[class*="-page"] [class*="-grid"] [class*="-label"]{font-size:12px !important;font-weight:600 !important;letter-spacing:.6px !important;text-transform:uppercase !important;opacity:.7 !important;margin-top:2px !important;}
[class*="-page"] [class*="-grid"] [class*="-card"]:first-child{background:linear-gradient(160deg, rgba(109,74,255,0.07), rgba(19,199,217,0.05)) !important;border-color:rgba(109,74,255,0.25) !important;}
[class*="-grid"] [class*="-card"]:nth-child(1) [class*="-bar"]{background:linear-gradient(180deg,#6D4AFF,#13C7D9) !important;}
[class*="-grid"] [class*="-card"]:nth-child(2) [class*="-bar"]{background:linear-gradient(180deg,#2D7CF6,#13C7D9) !important;}
[class*="-grid"] [class*="-card"]:nth-child(3) [class*="-bar"]{background:linear-gradient(180deg,#16a34a,#34d399) !important;}
[class*="-grid"] [class*="-card"]:nth-child(4) [class*="-bar"]{background:linear-gradient(180deg,#f59e0b,#fbbf24) !important;}
[class*="-grid"] [class*="-card"]:nth-child(5) [class*="-bar"]{background:linear-gradient(180deg,#8b5cf6,#a78bfa) !important;}
[class*="-grid"] [class*="-card"]:nth-child(6) [class*="-bar"]{background:linear-gradient(180deg,#0ea5e9,#38bdf8) !important;}
[class*="-grid"] [class*="-card"]:nth-child(7) [class*="-bar"]{background:linear-gradient(180deg,#ec4899,#f472b6) !important;}
[class*="-grid"] [class*="-card"] [class*="-bar"]{width:6px !important;}
[class*="-page"] [class*="-grid"] [class*="-card"]{transition:transform .18s ease, box-shadow .18s ease !important;}
