/*
  Drivers area (boards: canvas-drivers DriversList, Main, AddDriver, InviteDriver, EditDriver, AssignTruck,
  AssignTrailer, AssignDispatcher, EndRelationship, RevealPii).
  Scoped under .pui-drv (the page body of the list and the detail) and prefixed pui-drv-.
*/

.pui-page.pui-drv { padding: 24px 28px 40px; gap: 20px; }

/* ── Cards, tables, dialogs: the board measures ───────────────────────────────────────────── */
.pui-drv .cn-card { gap: 0; padding: 0; border-radius: 12px; box-shadow: none; }
.pui-drv .cn-card-header { padding: 16px 20px 0; gap: 2px 12px; align-items: flex-start; }
.pui-drv .cn-card-title { font-size: 15px; font-weight: 600; line-height: 1.3; }
.pui-drv .cn-card-description { font-size: 13px; margin-top: 2px; line-height: 1.4; }
.pui-drv .cn-card-content { padding: 16px 20px; display: flex; flex-direction: column; gap: 14px; }
.pui-drv .cn-card-action { align-self: flex-start; }

/* ── Drivers list ─────────────────────────────────────────────────────────────────────────── */
.pui-drv-list.cn-card { overflow: hidden; }
.pui-drv-list .pui-list-toolbar { padding: 14px 16px; border-bottom: 1px solid var(--border); gap: 12px; }
.pui-drv-list .cn-tabs-list {
    display: flex; gap: 2px; padding: 3px; background: var(--muted); border-radius: 9px; width: max-content;
    max-width: 100%; height: auto;
}
.pui-drv-list .cn-tabs-trigger {
    height: 30px; padding: 0 12px; border-radius: 7px; font-size: 13px; font-weight: 500; gap: 6px; box-shadow: none;
    border: 0; color: var(--muted-foreground);
}
.pui-drv-list .cn-tabs-trigger[aria-selected="true"] {
    background: var(--card); color: var(--foreground); box-shadow: 0 1px 2px oklch(0.2 0.02 258 / .08);
}
.pui-drv-count { font-family: var(--font-mono); font-size: 11px; font-weight: 500; color: var(--muted-foreground); }

.pui-drv-list .pui-filter-bar { align-items: center; gap: 8px; }
.pui-drv-list .pui-filter-bar > .pui-drv-search { position: relative; flex: 1 1 280px; max-width: 420px; }
.pui-drv-list .pui-drv-search > .cn-input { height: 36px; width: 100%; padding-left: 34px; border-radius: 8px; font-size: 14px; }
.pui-drv-search-icon {
    position: absolute; left: 10px; top: 50%; margin-top: -8px; color: var(--muted-foreground); pointer-events: none; z-index: 1;
}
.pui-drv-list .pui-filter-bar > .pui-drv-select { flex: 0 0 auto; min-width: 150px; }
.pui-drv-list .pui-drv-select { height: 32px; border-radius: 7px; font-size: 13px; }

.pui-drv-list .pui-list-table { padding: 0; }
.pui-drv-list table { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 940px; }
.pui-drv-list thead th {
    height: 38px; padding: 0 12px; font-size: 12px; font-weight: 500; color: var(--muted-foreground);
    border-bottom: 1px solid var(--border); white-space: nowrap; text-align: left; background: var(--card);
}
.pui-drv-list tbody td { padding: 10px 12px; border-bottom: 1px solid var(--border); vertical-align: middle; font-size: 13px; }
.pui-drv-list tbody tr:last-child td { border-bottom: 0; }
.pui-drv-list tbody tr:hover td { background: oklch(0.98 0.004 250); }
.pui-drv-name { color: var(--foreground); }
.pui-drv-unread { display: inline-flex; align-items: center; gap: 3px; font-size: 12px; color: var(--primary); }
.pui-drv-list .pui-list-footer { padding: 0; border-top: 0; }
.pui-drv-list .cn-empty { gap: 16px; padding: 40px 16px; }

/* Net pay sparkline: eight bars, the last week on the right. */
.pui-drv-spark { display: flex; align-items: flex-end; gap: 2px; height: 28px; width: 72px; }
.pui-drv-spark > span { flex: 1; background: var(--primary); opacity: .75; border-radius: 1px; min-height: 2px; display: block; }
.pui-drv-spark > span:last-child { opacity: 1; }

/* The row menu trigger stays quiet until hovered. */
.pui-drv-list td .cn-button[data-testid="driver-row-menu"] { color: var(--muted-foreground); }

/* Needs you chips (board: pill toggles, tone count first). */
.pui-drv-needs-label {
    font-size: 12px; font-weight: 500; text-transform: uppercase; letter-spacing: .05em;
    color: var(--muted-foreground); margin-right: 4px;
}
.pui-drv .cn-button.pui-drv-chip {
    height: 32px; padding: 0 12px; border-radius: 999px; background: var(--card); border: 1px solid var(--border);
    font-size: 13px; font-weight: 500; color: var(--foreground); box-shadow: none; gap: 8px;
}
.pui-drv .cn-button.pui-drv-chip:hover { background: var(--accent); }
.pui-drv .cn-button.pui-drv-chip[aria-pressed="true"] { border-color: var(--primary); background: var(--tone-info-bg); }
.pui-drv .cn-badge.pui-drv-chip-count { height: 20px; }
.pui-drv .cn-badge.pui-drv-chip-count::before { display: inline-block; }

/* Avatars: 32px circle, secondary fill, 12px semibold initials. */
.pui-drv .cn-avatar { width: 32px; height: 32px; background: var(--secondary); color: var(--secondary-foreground); font-size: 12px; font-weight: 600; }
.pui-drv .cn-avatar-fallback { font-size: 12px; font-weight: 600; color: var(--secondary-foreground); }
.pui-drv .pui-drv-avatar-lg .cn-avatar-fallback { font-size: 18px; }
.pui-drv .cn-card-header { align-items: center; }

/* ── Driver detail ───────────────────────────────────────────────────────────────────────── */
.pui-drv .pui-detail { gap: 20px; }
.pui-drv .pui-detail-main { gap: 20px; flex: 999 1 560px; }
.pui-drv .pui-detail-rail { gap: 20px; flex: 1 1 320px; max-width: 100%; }
.pui-drv .cn-avatar.pui-drv-avatar-lg, .pui-drv-avatar-lg { width: 56px; height: 56px; font-size: 18px; flex: none; }

/* Section tabs: the board's underline strip. */
.pui-drv .cn-tabs-line { display: flex; border-bottom: 1px solid var(--border); }
.pui-drv .cn-tabs-line .cn-tabs-list { display: flex; gap: 20px; background: transparent; padding: 0; height: auto; width: max-content; border-radius: 0; }
.pui-drv .cn-tabs-line .cn-tabs-trigger {
    border-radius: 0; height: 40px; padding: 0 2px; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px;
    background: transparent; box-shadow: none; font-size: 13px; font-weight: 500; color: var(--muted-foreground); gap: 6px;
}
.pui-drv .cn-tabs-line .cn-tabs-trigger[aria-selected="true"] { border-bottom-color: var(--primary); color: var(--foreground); background: transparent; box-shadow: none; }

/* Needs you. */
.pui-drv-needs .cn-card-content { padding-top: 8px; padding-bottom: 8px; gap: 0; }
.pui-drv-need { padding: 10px 0; border-bottom: 1px solid var(--border); gap: 12px; }
.pui-drv-need:last-child { border-bottom: 0; }

/* Profile facts. */
.pui-drv-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); gap: 16px 24px; }
.pui-drv-fact-label { font-size: 12px; color: var(--muted-foreground); }

/* Loads card: the table runs to the card edge. */
.pui-drv-card-flush.cn-card { overflow: hidden; }
.pui-drv-card-flush .cn-card-header { padding-bottom: 12px; }
.pui-drv .pui-drv-card-body-flush { padding: 0; }
.pui-drv-loads, .pui-drv-table { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 620px; }
.pui-drv-loads thead th, .pui-drv-table thead th { height: 38px; padding: 0 12px; font-size: 12px; font-weight: 500; color: var(--muted-foreground); border-bottom: 1px solid var(--border); text-align: left; }
.pui-drv-loads tbody td, .pui-drv-table tbody td { padding: 10px 12px; border-bottom: 1px solid var(--border); font-size: 13px; vertical-align: middle; }
.pui-drv-loads tbody tr:hover td, .pui-drv-table tbody tr:hover td { background: oklch(0.98 0.004 250); }
.pui-drv-loads-footer { padding: 12px 16px; border-top: 1px solid var(--border); flex-wrap: wrap; }

/* Rail tiles. */
.pui-drv-tile { width: 32px; height: 32px; border-radius: 8px; background: var(--secondary); color: var(--secondary-foreground); display: inline-flex; align-items: center; justify-content: center; flex: none; }

/* ── Dialogs ─────────────────────────────────────────────────────────────────────────────── */
.pui-drv-dialog .cn-dialog { padding: 0; gap: 0; border-radius: 14px; background: var(--card); border: 1px solid var(--border); max-height: calc(100vh - 48px); overflow: auto; }
.pui-drv-dialog-narrow .cn-dialog { width: min(460px, calc(100vw - 32px)); }
.pui-drv-dialog-wide .cn-dialog { width: min(560px, calc(100vw - 32px)); }
.pui-drv-dialog-reveal .cn-dialog { width: min(480px, calc(100vw - 32px)); }
.pui-drv-dialog .cn-dialog-header { padding: 20px 56px 0 24px; gap: 4px; display: flex; flex-direction: column; }
.pui-drv-dialog .cn-dialog-title { font-size: 17px; font-weight: 600; line-height: 1.3; }
.pui-drv-dialog .cn-dialog-description { font-size: 13px; color: var(--muted-foreground); line-height: 1.45; }
.pui-drv-dialog .pui-drv-dialog-body { padding: 16px 24px; }
.pui-drv-dialog .cn-dialog-footer { padding: 16px 24px; border-top: 1px solid var(--border); display: flex; justify-content: space-between; gap: 8px; }
.pui-drv-dialog .cn-dialog [data-slot="dialog-close"] { position: absolute; top: 14px; right: 14px; }
.pui-drv-dialog .cn-label { font-size: 13px; font-weight: 500; }
.pui-drv-dialog .cn-field-description { font-size: 12px; color: var(--muted-foreground); }
.pui-drv-dialog .cn-field { gap: 6px; }
.pui-drv-dialog .cn-input { height: 36px; border-radius: 8px; font-size: 14px; }

/* Radio choice cards (assign truck / trailer). */
.pui-drv-choices { display: flex; flex-direction: column; gap: 8px; }
.pui-drv-choices label {
    display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--input); border-radius: 10px; cursor: pointer;
}
.pui-drv-choices label:has(input:checked) { border-color: var(--primary); background: var(--tone-info-bg); }

/* Segmented control (assignment type, tax ID, drug test result). */
.pui-drv-segmented.cn-toggle-group { display: inline-flex; padding: 3px; gap: 2px; background: var(--muted); border-radius: 9px; width: max-content; }
.pui-drv-segmented .cn-toggle-button { height: 30px; padding: 0 12px; border-radius: 7px; font-size: 13px; font-weight: 500; border: 0; box-shadow: none; color: var(--muted-foreground); background: transparent; }
.pui-drv-segmented .cn-toggle-button[aria-pressed="true"] { background: var(--card); color: var(--foreground); box-shadow: 0 1px 2px oklch(0.2 0.02 258 / .08); }

/* Alerts inside dialogs and sheets. */
.pui-drv .pui-drv-alert-info, .pui-drv-alert-info {
    background: var(--tone-info-bg); border: 1px solid oklch(0.88 0.05 250); color: var(--tone-info-fg); border-radius: 10px; font-size: 13px;
}
.pui-drv .pui-drv-alert-warning, .pui-drv-alert-warning {
    background: var(--tone-warning-bg); border: 1px solid oklch(0.88 0.08 80); color: var(--tone-warning-fg); border-radius: 10px; font-size: 13px;
}

/* End relationship: the "Still open" box. */
.pui-drv-checklist { border: 1px solid var(--border); border-radius: 10px; padding: 14px 16px; font-size: 13px; gap: 10px; }

/* ── Sheets ──────────────────────────────────────────────────────────────────────────────── */
.pui-drv-sheet .cn-label { font-size: 13px; font-weight: 500; }
.pui-drv-sheet .cn-field-description { font-size: 12px; color: var(--muted-foreground); }
.pui-drv-sheet .cn-field { gap: 6px; }
.pui-drv-sheet .cn-input, .pui-drv-sheet .cn-select-trigger { height: 36px; border-radius: 8px; font-size: 14px; }
.pui-drv-sheet .cn-textarea { border-radius: 8px; font-size: 14px; }
.pui-drv-sheet .pui-sheet-header { padding: 20px 24px 16px; border-bottom: 1px solid var(--border); gap: 4px; display: flex; flex-direction: column; }
.pui-drv-acc .cn-collapsible-trigger { width: 100%; height: auto; padding: 0; justify-content: space-between; background: transparent; box-shadow: none; text-align: left; }
.pui-drv-acc .cn-collapsible-trigger:hover { background: transparent; }
.pui-drv-acc.pui-sheet-section { gap: 14px; }
.pui-drv-acc-body { padding-top: 14px; }
.pui-drv-onfile { flex: 1; display: inline-flex; align-items: center; justify-content: center; height: 36px; border: 1px solid var(--input); border-radius: 8px; background: var(--muted); color: var(--muted-foreground); font-size: 13px; }
.pui-drv-readonly { display: flex; align-items: center; min-height: 36px; padding: 0 12px; border: 1px solid var(--border); border-radius: 8px; background: var(--muted); font-size: 14px; }
.pui-drv-rate { display: flex; align-items: center; gap: 6px; height: 36px; border: 1px solid var(--input); border-radius: 8px; padding: 0 10px; background: var(--card); }
.pui-drv-rate .cn-input { border: 0; box-shadow: none; padding: 0; height: 34px; background: transparent; }
.pui-drv-sample { background: var(--muted); border-radius: 10px; padding: 12px 14px; }
.pui-drv .cn-button.pui-drv-endorsement { border-radius: 999px; font-size: 13px; height: 30px; }
.pui-drv .cn-button.pui-drv-endorsement[aria-pressed="true"] { border-color: var(--primary); background: var(--tone-info-bg); color: var(--tone-info-fg); }

.pui-drv-help { font-size: 12px; color: var(--muted-foreground); line-height: 1.45; }
.pui-drv-sheet.cn-sheet, .pui-drv-sheet .cn-sheet, .cn-sheet.pui-drv-sheet { background: var(--card); }
.pui-drv-acc.pui-sheet-section { padding: 14px 24px; }

/* ── Section tabs: Pay and ledger, Compliance, Equipment, Documents ───────────────────────── */
.pui-drv-table tbody tr:last-child td { border-bottom: 0; }
.pui-drv-table { min-width: 560px; }
.pui-drv-callout {
    gap: 12px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 10px; font-size: 13px; align-items: flex-start;
}
.pui-drv-callout-info { background: var(--tone-info-bg); border-color: oklch(0.88 0.05 250); color: var(--tone-info-fg); }
.pui-drv-callout-warning { background: var(--tone-warning-bg); border-color: oklch(0.88 0.08 80); color: var(--tone-warning-fg); }
.pui-drv-callout-danger { background: var(--tone-danger-bg); border-color: oklch(0.88 0.06 25); color: var(--tone-danger-fg); }

.pui-drv-money { font-size: 13px; gap: 12px; }
.pui-drv-money-rule { padding-top: 8px; border-top: 1px solid var(--border); }

.pui-drv-summary {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(min(120px, 100%), 1fr)); gap: 12px 24px;
    padding: 0 20px 16px; border-bottom: 1px solid var(--border);
}
.pui-drv-summary .pui-num { font-size: 14px; }

.pui-drv-list-row { padding: 10px 0; border-top: 1px solid var(--border); gap: 12px; align-items: center; flex-wrap: wrap; }
.pui-drv-deductions .pui-drv-list-row:last-child { border-bottom: 1px solid var(--border); }
.pui-drv-charge-row { padding: 12px 0; border-top: 1px solid var(--border); gap: 8px; }
.pui-drv-form-box {
    padding: 16px; border: 1px solid var(--border); border-radius: 10px; background: var(--background); gap: 14px;
}
.pui-drv-form-box .pui-fields { gap: 14px; }

.pui-drv-checks { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 12px 24px; }

.pui-drv-facts-4 { grid-template-columns: repeat(auto-fit, minmax(min(170px, 100%), 1fr)); }
.pui-drv-facts .pui-num { font-size: 14px; }

.pui-drv-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); gap: 16px; }
.pui-drv-tile-card { padding: 16px; border: 1px solid var(--border); border-radius: 12px; background: var(--card); }
.pui-drv-tile.pui-drv-tile-lg { width: 40px; height: 40px; border-radius: 10px; }

.pui-drv-uploader { padding: 16px 20px; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--card); }
.pui-drv-doc-table td { vertical-align: middle; }
.pui-drv-row-editing td { background: var(--tone-info-bg); }
.pui-drv-doc-table .cn-select-trigger, .pui-drv-doc-table .cn-input { height: 36px; border-radius: 8px; font-size: 13px; }

.pui-drv-sample { background: var(--muted); border-radius: 10px; padding: 12px 14px; }

/* Sheets with one untitled section (Record advance, Record charge). */
.pui-drv-plain-sheet .pui-sheet-section-title:empty { display: none; }
.pui-drv-plain-sheet .pui-sheet-section { border-bottom: 0; padding: 20px 24px; }

.pui-drv .cn-card-header { grid-template-rows: auto; }
.pui-drv .cn-label { font-size: 13px; font-weight: 500; }
.pui-drv .cn-field-description { font-size: 12px; color: var(--muted-foreground); line-height: 1.45; }
.pui-drv .cn-field { gap: 6px; min-width: 0; }
.pui-drv-plain-sheet .pui-sheet-section > .sc-vstack:first-child { display: none; }

.pui-drv-dialog-confirm .cn-dialog-header { padding-bottom: 20px; }
.pui-drv-dialog .cn-dialog-footer { margin: 0; }

.pui-drv-loads tbody tr:last-child td { border-bottom: 0; }
.pui-drv-acc .cn-collapsible-trigger { align-items: center; }
.pui-drv-sheet .pui-sheet-header { padding-right: 64px; }
.pui-drv-segmented.cn-toggle-group { width: fit-content !important; align-self: flex-start; }