/* drivers screen — styles specific to this screen only; shared styles live in tiye.css */

/* ---------------------------------------------------------------- list */
.dv-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(440px, 1fr)); gap: 12px; }
.dv-card { display: flex; flex-direction: column; gap: 12px; padding: 12px 16px; color: var(--ink); text-decoration: none; transition: border-color .12s; }
a.dv-card:hover { border-color: var(--line-strong); text-decoration: none; }
.dv-card-head { display: flex; align-items: center; gap: 8px; font-size: 13.5px; }
.dv-card-head .spacer { flex: 1; }
.dv-card .progress-segs { gap: 5px; }
.dv-cap { font-size: 12.5px; }
.dv-search { flex: 0 1 344px; min-width: 260px; }
.dv-search .input { height: 32px; }
#dv-chips { gap: 8px; }
#dv-chips .chip { height: 30px; padding: 0 12px; font-size: 13px; border-radius: 15px; }
.dv-table-card { flex: 1; }
.dv-table td { height: 33px; }
.dv-table tbody tr:focus-visible { outline: 2px solid var(--blue); outline-offset: -2px; }

/* --------------------------------------------------------- driver page */
.content.dv-page { display: flex; flex-direction: column; gap: 12px; }
.dv-page > * { flex-shrink: 0; }
.dv-code { font-size: 13px; }
.dv-saved { font-size: 13px; white-space: nowrap; }
.dv-stepper { gap: 12px; }
.dv-stepper .st { padding: 10px 0 0; font: inherit; color: inherit; display: flex; flex-direction: column; align-items: flex-start; gap: 0; }
.dv-stepper .st .top { margin-bottom: 8px; }
.dv-stepper .st:hover .dv-st-label { text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px; }
.dv-stepper .st.viewed .dv-st-label { text-decoration: underline; text-decoration-color: var(--copper); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.dv-stepper .st:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.dv-stepper .st:disabled { cursor: default; opacity: .55; }
.dv-stepper .st:disabled:hover .dv-st-label { text-decoration: none; }
.dv-after { font-size: 13px; line-height: 20px; }

.dv-step { flex: 1; display: flex; flex-direction: column; gap: 12px; min-height: 0; }
.dv-heading { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-top: 2px; }
.dv-h { font-size: 15px; font-weight: 600; }
.dv-sum-grid { flex: 1; grid-auto-rows: minmax(200px, 1fr); }
.dv-sum { display: flex; flex-direction: column; }
.dv-sum .card-head { min-height: 44px; padding: 10px 16px; }
.dv-sum .card-body { flex: 1; }
.dv-one { display: flex; flex-direction: column; }
.dv-who { font-size: 12.5px; white-space: nowrap; }

.dv-p1 { display: flex; gap: 16px; align-items: flex-start; }
.dv-photo { text-align: center; line-height: 1.3; }
.dv-p1-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.dv-pairs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3px 16px; font-size: 13px; }
.dv-pairs.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.dv-pairs .full { grid-column: 1 / -1; }
.dv-docs { gap: 6px; }
.dv-emps { display: flex; flex-direction: column; gap: 12px; font-size: 13px; }
.dv-decl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; font-size: 13px; }
.dv-decl > div { display: flex; align-items: center; gap: 8px; min-width: 0; }
.dv-decl .full { grid-column: 1 / -1; }
.dv-notes { margin-top: 12px; font-size: 13px; }
.dv-train-head { display: flex; align-items: center; margin: 14px 0 8px; font-size: 13px; }
.dv-train-head .spacer { flex: 1; }
.dv-form .dv-train-head { margin-top: 0; }
.dv-mods { margin-top: 10px; font-size: 12.5px; line-height: 1.6; }

.dv-bar { margin-top: auto; position: sticky; bottom: 0; z-index: 2; box-shadow: 0 -6px 16px rgba(244,243,239,.9); }
.dv-bar-text { padding-left: 4px; }
.dv-bar .ico { width: 16px; height: 16px; vertical-align: -3px; }
.dv-err { font-size: 12.5px; color: var(--red); font-weight: 500; }

.dv-reject { align-items: flex-start; padding: 12px 16px; }
.dv-reject .ico { margin-top: 1px; }
.dv-reason { color: var(--ink); margin-top: 2px; }
.dv-red { color: var(--red); font-weight: 400; }

/* forms */
.dv-formwrap { display: flex; flex-direction: column; gap: 12px; }
.dv-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
.dv-ident { margin-bottom: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.dv-slots { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 16px; }
.dv-slots.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dv-slots > div { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.dv-slot { display: flex; flex-direction: column; gap: 6px; }
.dv-slot-label { font-size: 12.5px; font-weight: 500; }
.dv-noscan { border-style: dashed; border-color: var(--line-strong); background: var(--surface); cursor: not-allowed; padding: 10px 12px; }
.dv-noscan .ft { width: 36px; height: 36px; }
.dv-noscan .ft .ico { width: 16px; height: 16px; color: var(--ink3); }
.dv-noscan-t { min-width: 0; font-size: 12.5px; line-height: 1.4; }
.dv-noscan-t .strong { font-size: 13px; color: var(--ink3); }
.dv-q { border: 0; margin: 0; padding: 0; min-width: 0; }
.dv-q legend { padding: 0; margin-bottom: 6px; font-size: 12.5px; font-weight: 500; }
.dv-q .radio-row { flex-wrap: wrap; gap: 8px 22px; }
.dv-date { max-width: 220px; }
.dv-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; margin-top: 14px; }