/* ══ PAGE: FLEET — header, summary bar, empty state, no-results ══ */

.fleet-header {
  display: flex; align-items: flex-start;
  justify-content: space-between; margin-bottom: 20px;
}

/* ── Summary bar ── */
.fleet-summary-bar {
  display: flex; gap: 6px; margin-bottom: 16px; flex-wrap: wrap;
}

.fleet-summary-pill {
  display: flex; align-items: center; gap: 8px;
  background: #111620; border: 1px solid #1a2030; border-radius: 8px;
  padding: 10px 16px; cursor: pointer; transition: all 0.15s;
  font-family: 'Barlow Condensed', sans-serif;
}
.fleet-summary-pill:hover { border-color: #2a3040; background: #141820; }
.fleet-summary-pill.active {
  border-color: rgba(212,245,66,0.4); background: rgba(212,245,66,0.06);
}

.fleet-pill-dot {
  width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
}
.fleet-summary-pill.ready .fleet-pill-dot       { background: #22c55e; box-shadow: 0 0 6px rgba(34,197,94,0.4); }
.fleet-summary-pill.attention .fleet-pill-dot    { background: #ef4444; box-shadow: 0 0 6px rgba(239,68,68,0.4); }
.fleet-summary-pill.in_workshop .fleet-pill-dot  { background: #f59e0b; box-shadow: 0 0 6px rgba(245,158,11,0.4); }
.fleet-summary-pill.at_event .fleet-pill-dot     { background: #3b82f6; box-shadow: 0 0 6px rgba(59,130,246,0.4); }

.fleet-pill-value {
  font-size: 18px; font-weight: 800; color: #dce3ed; line-height: 1;
}
.fleet-pill-label {
  font-size: 10px; font-weight: 600; letter-spacing: 1px;
  text-transform: uppercase; color: #4a5568;
}

/* ── Filter tag pills ── */
.filter-tag {
  display: inline-flex; align-items: center; gap: 5px;
  background: rgba(212,245,66,0.1); border: 1px solid rgba(212,245,66,0.3);
  color: #d4f542; border-radius: 5px; padding: 3px 8px;
  font-size: 11px; font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase;
}
.filter-tag-x { cursor: pointer; opacity: 0.7; }
.filter-tag-x:hover { opacity: 1; }

/* ── Empty & no-results ── */
.no-results       { text-align: center; padding: 60px 20px; color: #7a8a9b; grid-column: 1 / -1; }
.no-results-title { font-family: 'Barlow Condensed', sans-serif; font-size: 16px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 4px; margin-top: 8px; }
.no-results-sub   { font-size: 12px; }

.fleet-empty       { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 80px 20px; color: #7a8a9b; text-align: center; }
.fleet-empty-icon  { font-size: 48px; margin-bottom: 16px; opacity: 0.4; }
.fleet-empty-title { font-family: 'Barlow Condensed', sans-serif; font-size: 18px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 6px; }
.fleet-empty-sub   { font-size: 13px; }

/* detail-mode hides fleet UI so car detail can take over */
#fleet.detail-mode .fleet-header,
#fleet.detail-mode .fleet-summary-bar,
#fleet.detail-mode .filter-bar,
#fleet.detail-mode .fleet-grid,
#fleet.detail-mode .fleet-empty { display: none !important; }

/* ── Light mode ── */
body.light-mode .fleet-summary-pill { background: #ffffff; border-color: #dde2ec; }
body.light-mode .fleet-summary-pill:hover { border-color: #b0b8c4; background: #f8f9fc; }
body.light-mode .fleet-summary-pill.active { border-color: rgba(90,122,0,0.4); background: rgba(90,122,0,0.04); }
body.light-mode .fleet-pill-value { color: #1a2030; }
body.light-mode .fleet-pill-label { color: #8899aa; }
body.light-mode .filter-tag { background: rgba(90,122,0,0.1); border-color: rgba(90,122,0,0.25); color: #5a7a00; }
