/* ============================================================================
 * maint-dir1.css — DIRECTION 1 "COMPACT LIST" (sim mockup, 2026-10-26)
 *
 * Tekmetric-dense direction for the Maintenance hub: a slim top tab bar,
 * requests as compact full-width rows (title · meta · status pill on one
 * line), Today as a tight summary strip over the same compact rows, minimal
 * padding everywhere. Same design language as the live redesign (light
 * pinned surfaces, white cards, #1D2733 ink, gold #C9A53F accent) — this
 * layer only changes ARRANGEMENT/DENSITY. No markup, ids, data or behavior
 * is touched; loaded after maint-redesign.css, scoped to the hub overlay.
 * ========================================================================== */

/* --- header: one tight line ---------------------------------------------- */
#maintenanceOverlay .parts-dash-header { padding-bottom: 8px; margin-bottom: 8px; }
#maintenanceOverlay .parts-dash-header h1 { font-size: calc(17px * var(--font-scale, 1)); }
#maintenanceOverlay .parts-dash-header .btn { padding: 5px 10px; }

/* --- hub tabs: slim top bar (no card, no segmented track) ----------------- */
#maintenanceOverlay #maintHubTabs {
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--border);
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  gap: 2px;
  margin: 0 0 10px;
}
#maintenanceOverlay #maintHubTabs .parts-tab {
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  box-shadow: none;
  padding: 7px 10px;
  font-size: calc(13px * var(--font-scale, 1));
  color: var(--muted);
}
#maintenanceOverlay #maintHubTabs .parts-tab:hover { background: transparent; color: var(--text); }
#maintenanceOverlay #maintHubTabs .parts-tab.is-active {
  background: transparent;
  box-shadow: none;
  color: var(--text);
  border-bottom-color: var(--gold);
}

/* --- secondary rows: compress the stacked chrome --------------------------- */
#maintenanceOverlay #maintMainTabs,
#maintenanceOverlay #maintTabs { margin-bottom: 6px; }
#maintenanceOverlay #maintMainTabs .parts-tab,
#maintenanceOverlay #maintTabs .parts-tab { padding: 5px 9px; font-size: calc(12.5px * var(--font-scale, 1)); }
#maintenanceOverlay #maintViewTabs { margin-bottom: 6px !important; }
#maintenanceOverlay #maintViewTabs .mgmt-viewtab { padding: 4px 10px; border-radius: 7px; }
#maintenanceOverlay #maintRequestsPanel select { padding: 4px 6px; }
#maintenanceOverlay #maint_countSummary { font-size: calc(11px * var(--font-scale, 1)); }

/* --- compact rows: requests, Today work, overdue assets -------------------- */
#maintenanceOverlay .maint-card {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 0;
  padding: 7px 10px 7px 9px;
  margin-bottom: 4px;
  border-radius: 8px;
  border-left: 3px solid var(--accent);
  box-shadow: none;
}
#maintenanceOverlay .maint-card-title {
  flex: 0 1 auto;
  max-width: 44%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: calc(13px * var(--font-scale, 1));
  font-weight: 700;
  letter-spacing: 0;
}
#maintenanceOverlay .maint-card-sub {
  flex: 1 1 auto;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 0;
  font-size: calc(11px * var(--font-scale, 1));
  line-height: 1.3;
}
#maintenanceOverlay .maint-card-flags {
  flex: 0 0 auto;
  flex-wrap: nowrap;
  margin-top: 0;
  gap: 4px;
}
#maintenanceOverlay .maint-card-flag { padding: 1px 7px; }

/* --- Today: summary strip + compact rows ----------------------------------- */
#maintenanceOverlay #maintTodayProgress {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px !important;
}
#maintenanceOverlay #maintTodayProgress > div:first-child {
  margin-bottom: 0 !important;
  white-space: nowrap;
  font-size: calc(12px * var(--font-scale, 1)) !important;
}
#maintenanceOverlay #maintTodayProgress > div:last-child { flex: 1; height: 6px !important; }
#maintenanceOverlay #hubTodayPane h2 { margin: 10px 0 5px !important; font-size: calc(11.5px * var(--font-scale, 1)) !important; }
#maintenanceOverlay #maintTodayDaily,
#maintenanceOverlay #maintTodayWork,
#maintenanceOverlay #maintTodayOverdue { margin-bottom: 12px !important; }
#maintenanceOverlay .maint-tick {
  min-height: 38px !important;
  padding: 6px 10px !important;
  margin-bottom: 4px !important;
  gap: 8px !important;
  line-height: 1.35;
  border-radius: 8px;
  box-shadow: none;
  font-size: calc(13px * var(--font-scale, 1));
}
#maintenanceOverlay .maint-tick > span:first-child { font-size: 16px !important; }
#maintenanceOverlay .maint-overdue-banner { padding: 6px; border-radius: 8px; }
#maintenanceOverlay .maint-overdue-banner .maint-card { margin-bottom: 3px; }

/* --- agenda rows follow the same density ----------------------------------- */
#maintenanceOverlay .maint-agenda-item { padding: 7px 10px; margin-bottom: 4px; border-radius: 8px; box-shadow: none; }
#maintenanceOverlay .maint-agenda-day { margin: 10px 0 4px; }

/* --- phone: slim bar stays one row, rows stay one line ---------------------- */
@media (max-width: 820px) {
  #maintenanceOverlay .modal-box { padding: 12px; }
  #maintenanceOverlay .maint-hub-pane > .modal-box { padding: 10px; }
  #maintenanceOverlay #maintHubTabs {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 0;
  }
  #maintenanceOverlay #maintHubTabs .parts-tab {
    flex: 0 0 auto;
    min-height: 36px;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 6px 9px;
    font-size: calc(12.5px * var(--font-scale, 1));
  }
  #maintenanceOverlay #maintHubTabs .parts-tab.is-active {
    background: transparent;
    border-color: transparent;
    border-bottom-color: var(--gold);
    color: var(--text);
  }
  #maintenanceOverlay .maint-card { min-height: 0; }
  #maintenanceOverlay .maint-card-title { max-width: 38%; }
}
