/* pages-fleet.css – vehicles, drivers, deadlines, customers (prefix fl-) */
.fl-search { position: relative; display: flex; align-items: center; flex: 1 1 260px; max-width: 360px; }
.fl-search .icon { position: absolute; left: 11px; color: var(--text-3); pointer-events: none; }
.fl-filters .fl-search .input { width: 100%; min-width: 0; padding-left: 34px; }
.fl-plate { font-weight: 700; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
.fl-plats { gap: 10px; flex-wrap: wrap; }
.fl-next { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.fl-red { color: var(--danger); font-weight: 650; } .fl-err { color: var(--danger); } .fl-warn { color: var(--warning) !important; }
.fl-tg { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--info-bg); color: #229ed9; flex: none; }
[data-mode="dark"] .fl-tg { color: #5cc2f2; }
.fl-tg .icon { width: 13px; height: 13px; }

/* list: table on desktop, cards on phones */
.fl-cards { display: none; list-style: none; margin: 0; padding: 0; }
.fl-cards li { border-bottom: 1px solid var(--border); } .fl-cards li:last-child { border-bottom: 0; }
.fl-cards > li > a, .fl-cardbox { display: flex; flex-direction: column; gap: 8px; padding: 14px 16px; color: var(--text); text-decoration: none !important; }
.fl-cards > li > a:active { background: var(--surface-2); }
.fl-cardnums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.fl-cardnums span { display: flex; flex-direction: column; } .fl-cardnums small { font-size: 11px; color: var(--text-3); } .fl-cardnums b { font-variant-numeric: tabular-nums; font-size: var(--fs); }
.fl-wrap { overflow-wrap: anywhere; }
@media (max-width: 720px) {
  .fl-desk { display: none; } .fl-cards { display: block; }
  .fl-search { max-width: none; flex-basis: 100%; }
  .fl-filters .chips { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; max-width: 100%; }
  .fl-filters .chip { flex: none; }
}

/* file header */
.fl-head { display: flex; align-items: center; gap: 14px; min-width: 0; }
.fl-head h1 { flex-wrap: wrap; min-width: 0; }
.fl-head .sub { gap: 6px 14px; margin-top: 6px; } .fl-head .sub a { display: inline-flex; align-items: center; gap: 5px; }
.fl-avatar { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; background: var(--primary-soft); color: var(--primary); flex: none; }
.fl-avatar .icon { width: 24px; height: 24px; }
.avatar.fl-avatar-lg { width: 48px; height: 48px; font-size: 16px; }
.fl-next-h { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-sm); color: var(--text-2); padding: 0 6px; }
.fl-actions { align-items: center; }
.fl-kpis { margin-bottom: 18px; }
.fl-tabn { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; margin-left: 4px; border-radius: 9px; background: var(--surface-3); color: var(--text-2); font-size: 11px; }
.tabs .active .fl-tabn { background: var(--primary-soft); color: var(--primary); }
@media (max-width: 720px) {
  .fl-head { align-items: flex-start; } .fl-avatar, .avatar.fl-avatar-lg { width: 40px; height: 40px; }
  .fl-actions { margin-left: 0 !important; width: 100%; }
  .fl-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .fl-kpis .kpi.hero { grid-column: 1 / -1; }
  .fl-kpis .kpi .val { font-size: 20px; }
}

/* deadline rows */
.fl-dls > li { padding: 0; } .fl-dls > li.fl-dl { padding: 12px 18px; }
.fl-dl, .fl-dlrow { display: flex; align-items: center; gap: 12px; padding: 12px 18px; color: var(--text); text-decoration: none !important; }
a.fl-dlrow:hover { background: var(--surface-2); }
.fl-dl-ic { width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; background: var(--primary-soft); color: var(--primary); flex: none; }
.fl-dl-ic.off { background: var(--surface-3); color: var(--text-3); }
.fl-dl-t { display: flex; flex-direction: column; min-width: 0; flex: 1; gap: 1px; } .fl-dl-t b { font-weight: 600; font-size: var(--fs-sm); }
.fl-dl-d { display: flex; align-items: center; gap: 8px; flex: none; justify-content: flex-end; }
@media (max-width: 520px) { .fl-dl, .fl-dlrow { flex-wrap: wrap; } .fl-dl-d { width: 100%; padding-left: 44px; justify-content: flex-start; } }
.fl-group + .fl-group { border-top: 1px solid var(--border); }
.fl-group-h { display: flex; align-items: center; gap: 8px; padding: 12px 18px 4px; }
.fl-facts .dl { margin: 0; }
.fl-note { margin-top: 14px; padding: 10px 12px; border-radius: 10px; background: var(--surface-2); font-size: var(--fs-sm); white-space: pre-wrap; }
.fl-tse-mini .icon { color: var(--primary); }

/* forms */
.fl-form { display: flex; flex-direction: column; gap: var(--gap); }
.fl-sec .card-body { padding-bottom: 20px; }
.fl-sw { justify-content: flex-end; padding-bottom: 8px; }
.fl-save { position: sticky; bottom: 12px; z-index: 5; display: flex; align-items: center; gap: 12px; padding: 12px 16px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter: blur(8px); box-shadow: var(--shadow); }
.fl-expl { margin-top: 14px; }

/* cash account */
.fl-cash { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.fl-cash > div { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--border); min-width: 0; }
.fl-cash small { font-size: 11.5px; color: var(--text-3); font-weight: 550; } .fl-cash b { font-size: var(--fs-md); font-variant-numeric: tabular-nums; white-space: nowrap; }
.fl-cash > div.fl-cash-bad { background: var(--danger-bg); border-color: transparent; color: var(--danger); } .fl-cash-bad small { color: inherit; }
@media (max-width: 420px) { .fl-cash { grid-template-columns: 1fr 1fr; } .fl-cash > div:last-child { grid-column: 1 / -1; } }
.fl-h3 { font-size: var(--fs-sm); color: var(--text-2); margin: 16px 0 4px; }
.fl-mw { display: flex; gap: 12px; align-items: flex-start; } .fl-mw > .icon { color: var(--primary); margin-top: 2px; }
.fl-merge { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; } .fl-merge > .icon { color: var(--primary); }

/* deadlines page */
.fl-countdown { display: flex; align-items: center; gap: 12px; margin-top: 10px; padding: 12px 14px; border-radius: 12px; background: var(--accent-50); }
.fl-countdown b { font-size: 26px; font-weight: 750; color: var(--accent-ink); line-height: 1; }
[data-mode="dark"] .fl-countdown b { color: var(--accent); }

/* customers */
.fl-kind { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-sm); color: var(--text-2); white-space: nowrap; }
.fl-kind .icon { color: var(--text-3); }