/* Fleet Integrity — unified portal presentation. No data or workflow changes. */
html:root {
  --fi-canvas:#f3f5f9; --fi-surface:#fff; --fi-soft:#f7f9fc;
  --fi-ink:#172439; --fi-muted:#5f6e83; --fi-border:#e1e7f0;
  --fi-accent:#245ee8; --fi-accent-hover:#194bc3; --fi-tint:#edf3ff;
  --fi-elevation:0 2px 4px #14244003,0 8px 28px #14244005;
}
html[data-theme="dark"] {
  --fi-canvas:#0a101c; --fi-surface:#111c2d; --fi-soft:#162235;
  --fi-ink:#edf3ff; --fi-muted:#a3b1c6; --fi-border:#263449;
  --fi-accent:#8aafff; --fi-accent-hover:#aec8ff; --fi-tint:#1c3053;
  --fi-elevation:0 2px 4px #00000008,0 8px 28px #00000014;
}
/* Alias existing component tokens so overlays and feature modules agree. */
body.fi-refined {
  --v4-bg:var(--fi-canvas); --v4-surface:var(--fi-surface); --v4-surface-2:var(--fi-soft);
  --v4-text:var(--fi-ink); --v4-muted:var(--fi-muted); --v4-line:var(--fi-border);
  --v4-blue:var(--fi-accent); --v4-blue-2:var(--fi-accent-hover); --v4-navy:#0b172c;
  --fi4-bg:var(--fi-canvas); --fi4-surface:var(--fi-surface); --fi4-surface2:var(--fi-soft);
  --fi4-text:var(--fi-ink); --fi4-muted:var(--fi-muted); --fi4-line:var(--fi-border);
  --fi4-blue:var(--fi-accent); --fi4-shadow:var(--fi-elevation);
  --bg:var(--fi-canvas); --surface:var(--fi-surface); --card:var(--fi-surface);
  --ink:var(--fi-ink); --text:var(--fi-ink); --muted:var(--fi-muted); --line:var(--fi-border);
  background:var(--fi-canvas); color:var(--fi-ink);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:16px; line-height:1.5; -webkit-font-smoothing:antialiased;
}
body.fi-refined :is(h1,h2,h3,strong) { text-wrap:pretty; }
body.fi-refined :is(h1,h2,h3) { color:var(--fi-ink); letter-spacing:-.035em; }
body.fi-refined :is(button,input,select,textarea) { font-family:inherit; }
body.fi-refined :is(button,a,input,select,textarea,[tabindex]):focus-visible {
  outline:3px solid var(--fi-accent)!important; outline-offset:3px;
}
body.fi-refined button { transition:background-color .16s,border-color .16s,box-shadow .16s; }
body.fi-refined button:hover { transform:none; }
body.fi-refined :is(main>header,.topbar) {
  height:auto; min-height:112px; gap:20px; padding-block:24px;
  border-bottom:1px solid var(--fi-border); margin-bottom:28px;
}
body.fi-refined main>header>div:first-child { min-width:0; }
body.fi-refined main>header h1 { font-size:clamp(1.5rem,2.2vw,2rem); line-height:1.2; font-weight:750; }
body.fi-refined :is(.header-sub,.section-head p,.toolbar p,.panel-head p) {
  font-size:.875rem!important; line-height:1.55; color:var(--fi-muted); margin-top:6px;
}
body.fi-refined .eyebrow { font-size:.75rem; letter-spacing:.12em; font-weight:700; }
body.fi-refined :is(.toolbar,.section-head) { gap:16px; margin-bottom:20px; }
body.fi-refined :is(.toolbar,.section-head) h2 { font-size:1.375rem; }
body.fi-refined .v4-header-tools { gap:10px; }
body.fi-refined :is(.v4-search-trigger,.v4-create-trigger,.fi-v4-search,#headerSignOut) {
  min-height:42px!important; border-radius:10px; font-size:.875rem!important; font-weight:600!important;
}
body.fi-refined :is(.v4-create-trigger,.toolbar>button,.modal-actions>button:not(.secondary),.sticky-submit) {
  background:#245ee8; border-color:#245ee8; color:#fff; box-shadow:0 3px 8px #245ee81a;
}
body.fi-refined :is(.v4-create-trigger,.toolbar>button,.sticky-submit):hover { background:#194bc3; }
body.fi-refined .v4-search-trigger { color:var(--fi-muted); background:var(--fi-surface); min-width:116px; }
body.fi-refined main>header #userEmail { font-size:.75rem; }
body.fi-refined .avatar { border:3px solid var(--fi-surface); box-shadow:0 0 0 1px var(--fi-border); }

/* A deep navy rail, deliberate active state and consistent outline icons. */
body.fi-refined .app>aside:not(.v4-record-drawer) {
  background:linear-gradient(180deg,#101f38 0%,#091426 100%)!important;
  border-right:1px solid #ffffff0a; padding:28px 16px 20px;
}
body.fi-refined :is(#v4Nav,#nav) { gap:6px; }
body.fi-refined #v4Nav { padding:14px 0; }
body.fi-refined :is(#v4Nav,#nav) button {
  position:relative; min-height:46px; padding:10px 14px; border-radius:10px;
  gap:12px; color:#a9bbd5; font-size:.875rem; font-weight:550; line-height:1.4;
}
body.fi-refined :is(#v4Nav,#nav) button:hover { background:#ffffff09; color:#fff; }
body.fi-refined :is(#v4Nav,#nav) button.active {
  background:#245ee8; color:#fff; box-shadow:0 4px 16px #00000012;
}
body.fi-refined :is(.v4-nav-icon,.nav-icon) {
  width:22px!important; height:22px!important; flex:0 0 22px!important;
  background:transparent!important; border:0!important; color:inherit!important;
}
body.fi-refined .nav-group>small { color:#8196b4; font-size:.75rem; letter-spacing:.09em; margin:12px 0 5px; }
body.fi-refined .signout { font-size:.875rem; padding:16px 14px 0; color:#a9bbd5; }
body.fi-refined .side-brand small { font-size:.75rem!important; letter-spacing:.1em; }

/* Metrics: typography carries the hierarchy; colour is reserved for action. */
body.fi-refined :is(.stats,.invoice-stats,.v4-grid-4) { gap:16px; margin-bottom:24px; }
body.fi-refined :is(.stats article,.invoice-stats article,.v4-stat,.client-tacho-stat) {
  padding:22px; border:1px solid var(--fi-border); border-radius:16px;
  background:var(--fi-surface)!important; color:var(--fi-ink); box-shadow:var(--fi-elevation);
}
body.fi-refined :is(.stats article,.invoice-stats article,.v4-stat,.client-tacho-stat)>span {
  font-size:.875rem!important; font-weight:550; letter-spacing:0; text-transform:none; color:var(--fi-muted)!important;
}
body.fi-refined :is(.stats article,.invoice-stats article,.v4-stat,.client-tacho-stat)>strong {
  font-size:2rem!important; font-weight:700; letter-spacing:-.045em; line-height:1.2;
  margin-top:12px; color:var(--fi-ink)!important; font-variant-numeric:tabular-nums;
}
body.fi-refined .stats article>small { display:block; font-size:.75rem; color:var(--fi-muted); margin-top:10px; }
body.fi-refined #dashboard>.stats article:first-child {
  background:linear-gradient(125deg,#142b51,#183d79)!important; border-color:#234774; box-shadow:0 6px 20px #12284b16;
}
body.fi-refined #dashboard>.stats article:first-child>strong { color:#fff!important; }
body.fi-refined #dashboard>.stats article:first-child>:is(span,small) { color:#c0d3f2!important; }
body.fi-refined .stats article[role="button"]:hover { border-color:var(--fi-accent); box-shadow:0 4px 18px #245ee812; }
body.fi-refined :is(.panel,.v4-panel,.table,.client-tacho-card) {
  border:1px solid var(--fi-border); border-radius:16px;
  background:var(--fi-surface); box-shadow:var(--fi-elevation);
}
body.fi-refined :is(.panel,.v4-panel,.client-tacho-card) { padding:24px; }
body.fi-refined :is(.panel h2,.v4-panel h3,.panel-head h2) { font-size:1.0625rem; font-weight:650; letter-spacing:-.025em; }
body.fi-refined .panel-head { gap:16px; align-items:flex-start; margin-bottom:20px; }
body.fi-refined .grid { gap:22px; }
body.fi-refined :is(.row,.activity-row,.history-row,.doc) {
  padding-block:15px; border-color:var(--fi-border); font-size:.875rem;
}
body.fi-refined :is(.row,.activity-row,.history-row,.doc) small { font-size:.75rem; line-height:1.5; }
body.fi-refined .row[role="button"]:hover { background:var(--fi-soft); }
body.fi-refined :is(.empty,.v4-inline-empty) { font-size:.875rem; line-height:1.65; padding-block:28px; }
body.fi-refined :is(.v4-pill,.badge,.client-tacho-pill) { font-size:.75rem; font-weight:600; padding:5px 10px; line-height:1.3; }
body.fi-refined .live-dot { font-size:.75rem; font-weight:600; letter-spacing:.06em; }

/* Registers and forms: quiet borders, legible labels, clear focus. */
body.fi-refined .table-wrap { padding:0; }
body.fi-refined table { font-size:.875rem; }
body.fi-refined th {
  background:var(--fi-soft)!important; color:var(--fi-muted)!important;
  padding:14px 18px; font-size:.75rem; font-weight:650; letter-spacing:.055em;
}
body.fi-refined td { padding:17px 18px; border-color:var(--fi-border); line-height:1.5; }
body.fi-refined td small { font-size:.75rem; color:var(--fi-muted); }
body.fi-refined tbody tr:hover { background:var(--fi-soft); }
body.fi-refined :is(.mini-btn,.mini) { font-size:.8125rem; font-weight:600; border-radius:8px; }
body.fi-refined :is(.filterbar,.v4-filter-row,.fi-searchbar) { gap:10px; }
body.fi-refined .fi-searchbar { background:var(--fi-surface); border-color:var(--fi-border); box-shadow:none; border-radius:12px; }
body.fi-refined :is(label,.v4-filter-row,.filterbar) { font-size:.875rem; font-weight:550; }
body.fi-refined :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea) {
  min-height:44px; border-radius:10px; border-color:var(--fi-border);
  background:var(--fi-surface); color:var(--fi-ink); font-size:1rem; line-height:1.4;
}
body.fi-refined :is(input,textarea)::placeholder { color:var(--fi-muted); opacity:.85; }
body.fi-refined .v4-filter-row :is(input,select,button) { font-size:.875rem!important; min-height:44px; }
body.fi-refined :is(.v4-subnav-buttons,.v4-workspace-tab-buttons) { gap:4px; padding:5px; }
body.fi-refined :is(.v4-subnav,.v4-workspace-tabs) button {
  border:1px solid transparent; background:transparent; color:var(--fi-muted);
  border-radius:9px; font-size:.875rem; font-weight:600; padding:9px 14px;
}
body.fi-refined :is(.v4-subnav,.v4-workspace-tabs) button.active {
  background:var(--fi-tint); color:var(--fi-accent); border-color:color-mix(in srgb,var(--fi-accent) 16%,transparent);
}
body.fi-refined :is(.v4-detail,.fi-v4-detail,.v4-mini-row) { border-radius:10px; background:var(--fi-soft); }
body.fi-refined :is(.v4-detail,.fi-v4-detail) span { font-size:.75rem; }
body.fi-refined :is(.v4-detail,.fi-v4-detail) strong { font-size:.875rem; }
body.fi-refined :is(.v4-drawer-head,.fi-v4-record-head) { padding:24px; }
body.fi-refined :is(.v4-drawer-head,.fi-v4-record-head) h2 { font-size:1.5rem; line-height:1.3; }
body.fi-refined :is(.v4-command-box,.fi-v4-palette-box,dialog) { border-radius:18px; border-color:var(--fi-border); box-shadow:0 24px 90px #050e2440; }
body.fi-refined :is(.v4-command-result,.fi-v4-result) { padding:14px!important; }
body.fi-refined dialog::backdrop { background:#06122588; backdrop-filter:blur(5px); }

/* Driver dashboard: a clear primary action and generous touch surfaces. */
body.fi-refined .hero { padding:14px 0 24px; }
body.fi-refined .hero h1 { font-size:clamp(1.75rem,4vw,2.5rem); letter-spacing:-.045em; }
body.fi-refined .quick-actions { gap:16px; }
body.fi-refined .action-card { border-radius:16px; padding:24px; min-height:148px; text-align:left; }
body.fi-refined .action-card strong { font-size:1.0625rem; font-weight:650; }
body.fi-refined .action-card small { font-size:.875rem; }
body.fi-refined.fi-v4-portal .action-card.primary { background:#245ee8!important; color:#fff!important; border-color:#245ee8!important; }
body.fi-refined .action-card.primary :is(strong,small,span) { color:#fff!important; }
body.fi-refined :is(.check-card,.summary-card) { border-radius:14px; }
body.fi-refined :is(.v4-bottom-nav,.bottom-nav,.mobile-nav) {
  background:var(--fi-surface)!important; border-top:1px solid var(--fi-border);
  box-shadow:0 -5px 24px #08172c08;
}
body.fi-refined :is(.v4-bottom-nav,.bottom-nav,.mobile-nav) button { color:var(--fi-muted); min-height:48px; }
body.fi-refined :is(.v4-bottom-nav,.bottom-nav,.mobile-nav) button.active { color:var(--fi-accent)!important; background:var(--fi-tint)!important; }
body.fi-refined :is(.v4-bottom-nav,.bottom-nav,.mobile-nav) button :is(small,span:last-child) { font-size:.75rem; }

/* Authentication uses the same surfaces; original image proportions are retained. */
body.fi-refined :is(.auth-shell,.login) { background:radial-gradient(ellipse at 75% 10%,#183765 0,transparent 52%),#091426; }
body.fi-refined :is(.auth-card,.login-card) { background:var(--fi-surface)!important; color:var(--fi-ink); border:1px solid var(--fi-border); border-radius:22px; padding:36px; }
body.fi-refined :is(.auth-card,.login-card) h1 { font-size:1.875rem; line-height:1.2; }
body.fi-refined :is(.auth-card,.login-card) .muted { font-size:.9375rem; line-height:1.6; }

@media(min-width:1100px) {
  body.fi-refined:not([data-fi-portal="driver"]) .app:has(>aside) { grid-template-columns:248px minmax(0,1fr); }
  body.fi-refined .app>aside+main { padding-inline:36px; }
}
@media(max-width:1150px) {
  body.fi-refined main>header { flex-wrap:wrap; gap:14px; }
  body.fi-refined main>header .user { margin-left:auto; }
  body.fi-refined .v4-header-tools { margin-left:0; }
  body.fi-refined :is(.stats article,.v4-stat) { padding:18px; }
}
@media(max-width:900px) {
  body.fi-refined main>header { min-height:unset; padding-block:20px; margin-bottom:22px; }
  body.fi-refined :is(.panel,.v4-panel,.client-tacho-card) { padding:18px; border-radius:14px; }
  body.fi-refined .table-wrap { padding:0; }
  body.fi-refined :is(.stats,.invoice-stats,.v4-grid-4) { gap:12px; margin-bottom:18px; }
  body.fi-refined .grid { gap:16px; }
  body.fi-refined :is(.v4-subnav-select,.v4-workspace-tab-select)>span { font-size:.75rem; }
  body.fi-refined .v4-subnav-select select { box-shadow:var(--fi-elevation); }
  body.fi-refined :is(.v4-bottom-nav,.bottom-nav,.mobile-nav) { padding-top:8px; }
  body.fi-refined .panel-head { flex-wrap:wrap; gap:10px; }
}
@media(max-width:600px) {
  body.fi-refined :is(.header-sub,.section-head p,.toolbar p) { font-size:.875rem!important; }
  body.fi-refined :is(.stats article,.v4-stat) { padding:16px; }
  body.fi-refined :is(.stats article,.v4-stat)>strong { font-size:1.75rem!important; }
  body.fi-refined .v4-search-trigger { min-width:44px; }
  body.fi-refined .v4-search-trigger :is(.label,kbd) { display:none; }
  body.fi-refined :is(.auth-card,.login-card) { padding:28px 22px; }
  body.fi-refined .action-card { min-height:120px; padding:20px; }
  body.fi-refined :is(.v4-drawer-head,.fi-v4-record-head) { padding:20px 16px; }
}
@media(prefers-reduced-motion:reduce) {
  body.fi-refined *,body.fi-refined *::before,body.fi-refined *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}
@media print {
  body.fi-refined { --fi-ink:#172439; --fi-muted:#5f6e83; --fi-surface:#fff; --fi-canvas:#fff; --fi-soft:#f7f9fc; --fi-border:#e1e7f0; }
  body.fi-refined :is(.panel,.v4-panel,.stats article) { box-shadow:none!important; }
}

/* Functional navigation icons, with labels retained in the DOM. */
body.fi-refined #v4Nav [data-v4-group="overview"] .v4-nav-icon {font-size:0;--fi-nav-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%223%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221.5%22/%3E%3Crect%20x%3D%2214%22%20y%3D%223%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221.5%22/%3E%3Crect%20x%3D%223%22%20y%3D%2214%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221.5%22/%3E%3Crect%20x%3D%2214%22%20y%3D%2214%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221.5%22/%3E%3C/svg%3E")}
body.fi-refined #v4Nav [data-v4-group="clients"] .v4-nav-icon {font-size:0;--fi-nav-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2021V5l8-2v18M12%209h8v12M2%2021h20M7%207h2M7%2011h2M7%2015h2M15%2012h2M15%2016h2%22/%3E%3C/svg%3E")}
body.fi-refined #v4Nav [data-v4-group="fleet"] .v4-nav-icon {font-size:0;--fi-nav-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%206h12v11H3zM15%2010h4l3%204v3h-7%22/%3E%3Ccircle%20cx%3D%227%22%20cy%3D%2218%22%20r%3D%222%22/%3E%3Ccircle%20cx%3D%2218%22%20cy%3D%2218%22%20r%3D%222%22/%3E%3C/svg%3E")}
body.fi-refined #v4Nav [data-v4-group="drivers"] .v4-nav-icon {font-size:0;--fi-nav-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%227%22%20r%3D%223%22/%3E%3Cpath%20d%3D%22M3%2021v-3a6%206%200%200%201%2012%200v3M16%204a3%203%200%200%201%200%206M18%2015a5%205%200%200%201%203%205%22/%3E%3C/svg%3E")}
body.fi-refined #v4Nav [data-v4-group="compliance"] .v4-nav-icon {font-size:0;--fi-nav-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203%204%206v6c0%205%208%209%208%209s8-4%208-9V6zM8%2012l3%203%205-6%22/%3E%3C/svg%3E")}
body.fi-refined #v4Nav [data-v4-group="documents"] .v4-nav-icon {font-size:0;--fi-nav-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14%203H5v18h14V8zM14%203v5h5M8%2012h8M8%2016h6%22/%3E%3C/svg%3E")}
body.fi-refined #v4Nav [data-v4-group="finance"] .v4-nav-icon {font-size:0;--fi-nav-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2214%22%20rx%3D%222%22/%3E%3Cpath%20d%3D%22M3%2010h18M7%2015h3%22/%3E%3C/svg%3E")}
body.fi-refined #v4Nav .v4-nav-icon::before {content:"";display:block;width:21px;height:21px;background:currentColor;mask:var(--fi-nav-icon) center/contain no-repeat;-webkit-mask:var(--fi-nav-icon) center/contain no-repeat}