/* IDI visual system: preserve brand and status palettes; improve hierarchy. */
:root { --muted: #526176; --text-small: 12px; --text-body: 14px; --touch-target: 44px; }
.data-table th { font-size: 11px; line-height: 1.5; }
.data-table td { font-size: 13px; }
.route-text strong, .person-cell strong { font-size: 13px; }
.route-text small, .person-cell small, .rides-table .ride-list-client small,
.rides-table .ride-list-remuneration small, .panel-title p, .activity-main small,
.ride-meta small, .ride-route-text small, .driver-pending-route span,
.driver-ride-reference small, .driver-payment-state, .driver-net-label,
.finance-controls small, .form-note, .field > label, .planning-help { font-size: var(--text-small); line-height: 1.5; }
.rides-table .ride-list-client-price strong, .rides-table .ride-list-remuneration strong { font-size: 13px; }
.table-action { width: var(--touch-target); height: var(--touch-target); min-width: var(--touch-target); }
:where(button,a,input,select,textarea,summary):focus-visible { outline: 3px solid #2864a8; outline-offset: 3px; }
[aria-invalid="true"] { border-color: #a5213c !important; }
.ride-list-legends-summary { padding: 12px 20px; font-size: 13px; font-weight: 700; cursor: pointer; }
.ride-list-legends:not([open]) .ride-list-legends-summary { border-bottom: 1px solid var(--line); }
.persistent-notification-alert { padding: 10px 18px; gap: 12px; }
.persistent-notification-copy > strong { font-size: 12px; }
.persistent-notification-copy .notification-ride-link { font-size: 13px; }
.persistent-alert-details { margin-top: 3px; }
.persistent-alert-details > summary { font-size: 12px; cursor: pointer; }
.persistent-alert-details > small { display: block; max-width: 65ch; font-size: 12px; line-height: 1.5; }
.persistent-notification-actions .secondary-button, .persistent-notification-actions .primary-button { min-height: 44px; }
.app-build-badge { font-size: 11px; color: var(--muted); padding: 4px 0; overflow-wrap: anywhere; }
.rides-filter-toolbar { scroll-margin-top: 150px; }
.rides-filter-toolbar .search-box { min-width: min(290px, 100%); }
.ride-results-count { color: var(--muted); font-size: 13px; margin: 0 0 12px; }
.planning-filter-count { align-self: center; color: var(--muted); font-size: 13px; }
.ride-list-passenger { display: grid; gap: 2px; margin-top: 6px; }
.ride-list-passenger small { font-size: 12px; color: var(--muted); }
.ride-list-passenger strong { font-size: 13px; }
.ride-list-stops { display: block; padding: 8px; margin: 7px 0; border-left: 3px solid #9a6100; border-radius: 4px; color: #594000; background: #fff6da; }
.ride-list-stops b { font-size: 12px; }
.ride-list-stops ol { margin: 4px 0 0; padding-left: 18px; white-space: normal; font-size: 12px; }
.ride-list-stops li { max-width: 28ch; overflow-wrap: anywhere; }
.ride-list-open span { display: none; }
.rides-table .route-cell { align-items: stretch; }
.rides-table .route-path { justify-content: space-between; padding: 5px 0; }
.driver-ride-client small { display: block; font-size: 12px; color: var(--muted); margin-top: 4px; }
.driver-rides-table tr.ride-status-row { background: var(--ride-row-bg, var(--surface-alt)); }
.driver-rides-table .ride-planned { --ride-row-bg: var(--ride-yellow-soft); --ride-row-accent: var(--ride-yellow); }
.driver-rides-table .ride-assigned { --ride-row-bg: var(--ride-blue-soft); --ride-row-accent: var(--ride-blue); }
.driver-rides-table .ride-accepted { --ride-row-bg: var(--ride-turquoise-soft); --ride-row-accent: var(--ride-turquoise); }
.driver-rides-table .ride-confirmed { --ride-row-bg: var(--ride-light-green-soft); --ride-row-accent: var(--ride-light-green); }
.driver-rides-table .ride-on-site { --ride-row-bg: var(--ride-brown-soft); --ride-row-accent: var(--ride-brown); }
.driver-rides-table .ride-pob { --ride-row-bg: var(--ride-green-soft); --ride-row-accent: var(--ride-green); }
.driver-rides-table .ride-drop { --ride-row-bg: var(--ride-grey-soft); --ride-row-accent: var(--ride-grey); }
.driver-rides-table .ride-paid { --ride-row-bg: var(--ride-purple-soft); --ride-row-accent: var(--ride-purple); }
.driver-rides-table .cancelled { --ride-row-bg: #f4f5f7; --ride-row-accent: #9aa3af; }
.driver-rides-table .ride-urgent-alert { --ride-row-bg: var(--ride-red-soft); --ride-row-accent: var(--ride-red); }
.client-ride-upcoming-head { flex-wrap: wrap; }
.client-ride-upcoming-head time { font-size: 14px; font-weight: 800; color: var(--ink); }
.client-ride-upcoming-head > span { font-size: 12px; white-space: normal; }
.client-ride-route strong,.client-ride-driver strong,.client-ride-history-route strong { font-size: 14px; }
.client-ride-route small,.client-ride-driver small,.client-ride-history-route small,.client-history-receipt small { font-size: 12px; line-height: 1.5; }
.client-ride-detail,.client-history-receipt button { min-height: 44px; font-size: 13px; }
.client-ride-amount small,.client-history-receipt > span,.client-history-status { font-size: 12px; }
.client-ride-amount strong { font-size: 16px; }
.client-rides-history-head { font-size: 11px; }
.client-ride-history-row > time strong { font-size: 14px; }
.client-ride-history-row > time small { font-size: 16px; font-weight: 800; color: var(--ink); }
.section-intro-actions > div { display: flex; flex-wrap: wrap; gap: 8px; }
:where(.primary-button,.secondary-button,.danger-button,.ghost-button,.icon-button,.filter-select,.search-box input,.nav-item,.driver-ride-open) { min-height: var(--touch-target); }
.icon-button,.driver-ride-open { min-width: var(--touch-target); }
.status-pill.offline,.status-pill.cancelled { color: #4e5b6d; }
.status-pill.pending,.status-pill.warning { color: #745000; }
.status-pill.available,.status-pill.completed,.status-pill.paid { color: #11664f; }
.ride-list-legends-summary,.persistent-alert-details > summary { min-height: 44px; align-content: center; }
.persistent-notification-alert .notification-ride-link { min-height: 44px; text-align: left; }
/* Lot 4: the operational decision comes before supporting information. */
.primary-button,.secondary-button,.danger-button,.dark-button { min-height: 44px; border-radius: 10px; gap: 8px; font-size: 13px; line-height: 1.4; }
.panel-title h3 { font-size: 16px; line-height: 1.4; }
.rides-table .ride-list-datetime { font-size: 17px; }
.ride-reference,.driver-mission-reference > span,.driver-pending-assignment time > span { font-weight: 400; font-size: 12px; }
.driver-mission-priority time strong,.driver-pending-assignment time > strong { font-size: 15px; font-weight: 800; line-height: 1.4; }
.driver-mission-priority time b,.driver-pending-assignment time > b { font-size: 28px; font-weight: 800; font-variant-numeric: tabular-nums; }
.driver-ride-reference .driver-ride-date,.driver-ride-reference .driver-ride-time { font-size: 15px; font-weight: 800; }
.driver-mission-priority .driver-mission-reference > span { font-size: 12px; font-weight: 400; }
.driver-mission-next-action { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; padding: 16px 22px; border-block: 1px solid #d6eaa7; background: #f5fbe8; }
.driver-mission-next-action > strong { color: var(--ink); font-size: 14px; }
.driver-mission-next-action > button { max-width: 100%; white-space: normal; text-align: left; }
.driver-availability-summary .driver-dashboard-status { min-height: 130px; display: flex; flex-direction: row; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; }
.driver-availability-summary .driver-dashboard-status h2 { font-size: 22px; }
.driver-availability-summary .driver-dashboard-status p,.driver-availability-summary .driver-dashboard-status .eyebrow { font-size: 12px; color: #c4d0df; }
.driver-availability-summary .driver-dashboard-status-foot { width: auto; min-width: 210px; gap: 24px; margin: 0; }
.driver-layout > .driver-dashboard-map { margin-top: 18px; overflow: hidden; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); }
.client-ride-follow { justify-self: start; max-width: 100%; white-space: normal; margin-top: 8px; }
.client-ride-upcoming-head time { font-size: 17px; }
.dispatch-priority-grid { grid-template-columns: minmax(0,1.3fr) minmax(0,1fr); align-items: start; }
.dispatch-priority-grid > .panel { min-width: 0; }
.dispatch-priority-grid .activity-list { max-height: none; }
.dispatch-priority-grid .dispatch-activity-row { padding: 16px; column-gap: 12px; row-gap: 10px; }
.dispatch-priority-grid .activity-main > strong { white-space: normal; font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.dispatch-priority-grid .activity-main > .status-pill { margin-bottom: 8px; font-size: 11px; }
.dispatch-priority-grid .activity-main > small { white-space: normal; overflow-wrap: anywhere; line-height: 1.5; }
.activity-datetime { min-width: 0; }
.activity-datetime span { font-size: 13px; }
.activity-datetime strong { font-size: 22px; }
.operator-alert-head p,.operator-alert-head .eyebrow { font-size: 12px; }
.operator-alert-head h3 { font-size: 18px; }
.operator-queue article > div > strong { display: block; font-size: 15px; line-height: 1.5; overflow-wrap: anywhere; }
.operator-queue article > div > small { display: block; font-size: 12px; line-height: 1.5; margin-top: 8px; }
.dispatch-queue-indicators { margin: 0 0 10px; }
.dispatch-pickup-time { font-size: 16px; }
.dispatch-deadline-badge { font-size: 12px; }
.ride-stops-badge { font-size: 13px; line-height: 1.4; }
.ride-service-summary small { font-size: 12px; line-height: 1.5; }
.ride-service-summary strong { font-size: 15px; line-height: 1.5; }
.ride-pricing-summary { gap: 12px; padding: 16px; }
.ride-pricing-summary > div { align-self: stretch; display: grid; align-content: start; gap: 5px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.8); }
.ride-pricing-summary > div.selected-payout { border-left: 4px solid var(--ink); }
.ride-pricing-summary small { font-size: 12px; line-height: 1.4; }
.ride-pricing-summary strong { margin: 0; font-size: 16px; font-variant-numeric: tabular-nums; }
.ride-pricing-summary .ride-list-client-price > span { font-size: 14px; }
.ride-pricing-summary > .status-pill { white-space: normal; font-size: 12px; }
.finance-priorities { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin-bottom: 22px; }
.finance-priority-card { min-width: 0; padding: 20px; display: flex; align-items: flex-start; flex-direction: column; gap: 12px; }
.finance-priority-icon { width: 40px; height: 40px; display: grid; place-items: center; color: var(--ink); background: #eef8db; border-radius: 10px; }
.finance-priority-card h3 { font-size: 20px; margin: 0; }
.finance-priority-card p { margin: 0; font-size: 14px; line-height: 1.5; }
.finance-priority-card > small { display: block; flex: 1; font-size: 12px; line-height: 1.5; color: var(--muted); }
.finance-priority-card button { max-width: 100%; white-space: normal; text-align: left; }
.finance-priority-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.finance-secondary-tools { max-width: 100%; }
.finance-secondary-tools > summary { cursor: pointer; min-height: 44px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); font-size: 13px; font-weight: 600; }
.finance-tools-menu { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 0; }
#accountingJournalSection { scroll-margin-top: 120px; }
/* Lane spacing is also used by the horizontal calendar's generated positions. */
.planning-horizontal-panel { --planning-lane-step: 50px; }
.planning-horizontal-bar { height: var(--touch-target); min-height: var(--touch-target); min-width: var(--touch-target); }
@media (max-width: 900px), (pointer: coarse) {
  .language-switch button,.currency-switch button { min-width: var(--touch-target); height: var(--touch-target); min-height: var(--touch-target); font-size: 12px; }
  .map-control,.maplibre-live-map .maplibregl-ctrl-group button,.driveco-map-marker { width: var(--touch-target); height: var(--touch-target); min-width: var(--touch-target); min-height: var(--touch-target); }
  .map-style-select,.map-locator-select { height: var(--touch-target); min-height: var(--touch-target); font-size: 12px; }
  .map-focus-card,.map-status-chip { top: 72px; }
  .maplibregl-popup-close-button { width: var(--touch-target); height: var(--touch-target); }
  .maplibregl-popup-content { padding-right: 48px; }
}
@media (max-width: 1100px) {
  .dispatch-priority-grid { grid-template-columns: minmax(0,1fr); }
  .finance-priorities { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 900px) {
  .rides-filter-toolbar.is-open { display: flex; }
  .rides-filter-toolbar.is-open .toolbar-left { width: 100%; min-width: 0; }
  .rides-filter-toolbar .toolbar-right { display: flex; flex-wrap: wrap; width: 100%; }
  .rides-filter-toolbar .toolbar-right > button { flex: 1; }
  .rides-filter-toolbar .filter-select { min-width: 0; font-size: 14px; }
  .rides-filter-toolbar .search-box { min-width: 0; width: 100%; }
  .rides-filter-toolbar .search-box input { width: 100%; font-size: 16px; }
  .dispatch-activity-row { gap: 10px; }
  .dispatch-activity-row .activity-main strong { font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
}
@media (max-width: 620px) {
  :root { --text-small: 14px; }
  .section-intro { margin-bottom: 12px; }
  .panel-head { padding: 16px; }
  .planning-period-controls { gap: 8px; margin-bottom: 12px; }
  .planning-period-controls .segmented button { min-height: 44px; font-size: 12px; }
  .rides-filter-toolbar.is-open .toolbar-left { width: 100%; }
  .rides-filter-toolbar .toolbar-right { display: flex; width: 100%; flex-wrap: wrap; }
  .rides-filter-toolbar .toolbar-right > button { min-height: 44px; flex: 1; }
  .rides-list-panel .data-table-wrap { overflow: visible; padding: 10px; }
  .rides-table { display: block; min-width: 0 !important; width: 100%; }
  .rides-table > thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .rides-table > tbody { display: grid; gap: 12px; }
  .rides-table > tbody > tr { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); min-width: 0; border: 1px solid var(--line); border-left: 4px solid var(--ride-row-accent); border-radius: 12px; padding: 14px; gap: 12px; }
  .rides-table > tbody > tr > td { display: block; min-width: 0; padding: 0; border: 0; height: auto; white-space: normal; font-size: 14px; }
  .rides-table > tbody > tr > td:first-child { grid-column: 1 / -1; box-shadow: none !important; }
  .rides-table > tbody > tr > td:nth-child(2) { grid-column: 1 / -1; }
  .rides-table > tbody > tr > td:nth-child(3) { grid-column: 2; grid-row: 3; }
  .rides-table > tbody > tr > td:nth-child(4) { grid-column: 1; grid-row: 3; }
  .rides-table > tbody > tr > td:last-child { grid-column: 1 / -1; justify-self: end; }
  .rides-table > tbody > tr > td[data-label]::before,
  .driver-rides-table td[data-label]::before { content: attr(data-label); display: block; color: var(--muted); font-size: 12px; font-weight: 600; margin-bottom: 6px; }
  .rides-table .ride-list-remuneration { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .rides-table .ride-list-datetime { font-size: 18px; }
  .rides-table .ride-reference { font-size: 12px; font-weight: 400; }
  .rides-table .ride-list-client strong, .rides-table .ride-list-client-price strong,
  .rides-table .ride-list-remuneration strong { font-size: 15px; }
  .rides-table .ride-list-passenger strong { font-size: 15px; }
  .rides-table .ride-list-client, .rides-table .ride-list-passenger { display: inline-grid; vertical-align: top; width: calc(50% - 6px); max-width: none; margin-top: 9px; padding-right: 6px; overflow-wrap: anywhere; }
  .rides-table .ride-list-remuneration > div { align-content: start; }
  .rides-table .ride-list-stops li { max-width: none; font-size: 14px; }
  .rides-table .ride-list-open { width: auto; padding: 0 12px; gap: 8px; }
  .rides-table .ride-list-open span { display: inline; font-size: 14px; }
  .rides-table .route-text strong, .rides-table .route-text small { max-width: none; font-size: 15px; white-space: normal; overflow: visible; overflow-wrap: anywhere; }
  .rides-table .person-cell strong, .rides-table .person-cell small { font-size: 14px; overflow-wrap: anywhere; }
  .rides-table .status-pill { font-size: 12px; white-space: normal; }
  .persistent-notification-alert { align-items: center; padding: 8px 12px; gap: 6px; flex-direction: row; }
  .persistent-notification-copy { min-width: 0; flex: 1; }
  .persistent-notification-copy > strong { font-size: 11px; }
  .persistent-notification-copy .notification-ride-link { font-size: 12px; }
  .persistent-notification-actions { gap: 4px; flex-wrap: wrap; max-width: 110px; }
  .persistent-notification-actions .secondary-button, .persistent-notification-actions .primary-button { padding: 6px 8px; font-size: 12px; }
  .persistent-notification-actions [data-action="notifications-open"] { display: none; }
  .persistent-alert-details > summary { font-size: 11px; }
  .persistent-alert-details[open] { max-width: 100%; }
  .persistent-notification-copy > strong { font-size: 12px; }
  .persistent-notification-copy .notification-ride-link { font-size: 13px; }
  .persistent-alert-details > summary { font-size: 13px; }
  .driver-rides-panel .data-table-wrap { overflow: visible; padding: 10px; }
  .driver-rides-table { display: block; min-width: 0 !important; width: 100%; }
  .driver-rides-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .driver-rides-table tbody { display: grid; gap: 12px; }
  .driver-rides-table tbody > tr { display: grid; grid-template-columns: minmax(0,1fr); padding: 14px; border: 1px solid var(--line); border-radius: 12px; border-left: 4px solid var(--ride-row-accent, #2864a8); }
  .driver-rides-table td { display: block; padding: 8px 0; min-width: 0; white-space: normal; border: 0; }
  .driver-rides-table .route-cell,.driver-rides-table .route-text { min-width: 0; }
  .driver-rides-table .route-text strong { max-width: none; white-space: normal; overflow-wrap: anywhere; font-size: 15px; }
  .driver-rides-table .driver-ride-vehicle { min-width: 0; }
  .driver-rides-table .driver-ride-open { margin-left: auto; }
  .driver-rides-table .driver-ride-date,.driver-rides-table .driver-ride-time { font-size: 18px; }
  .driver-rides-table .driver-ride-client strong,.driver-rides-table .driver-ride-client small { font-size: 14px; }
  .driver-rides-table .ride-intermediate-stops { padding: 10px; margin: 8px 0; }
  .driver-rides-table .ride-intermediate-stops strong { font-size: 14px; overflow-wrap: anywhere; }
  .client-ride-route strong,.client-ride-route small,.client-ride-history-route strong { white-space: normal; overflow-wrap: anywhere; }
  .client-ride-driver { flex-wrap: wrap; }
  .client-ride-history-row { grid-template-columns: minmax(0,1fr); }
  .client-ride-history-row > * { grid-column: 1; }
  .client-ride-history-row > time { display: flex; align-items: baseline; gap: 8px; }
  .dispatch-activity-row { grid-template-columns: minmax(0,1fr); }
  .dispatch-activity-row .activity-time { display: flex; gap: 10px; width: auto; }
  .dispatch-activity-row > button { justify-self: start; }
  .dispatch-priority-grid .activity-row.dispatch-activity-row { grid-template-columns: minmax(0,1fr); }
  .dispatch-priority-grid .activity-datetime { align-items: baseline; flex-wrap: wrap; }
  .operator-queue article { grid-template-columns: minmax(0,1fr); padding: 16px; }
  .operator-queue article > button { justify-self: start; }
  .driver-mission-next-action { padding: 16px; }
  .driver-mission-next-action > button { width: 100%; }
  .client-ride-follow { width: 100%; }
  .ride-pricing-summary { grid-template-columns: minmax(0,1fr); }
  .finance-priority-card { padding: 16px; }
  .finance-priority-card > small { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
