/*
 * TOURGANIQ System Design 1.1 / V57
 * Final visual layer for the complete Ride application.
 */

@font-face {
  font-family: "Inter";
  src: url("./fonts/Inter-Regular.woff2?v=58") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("./fonts/Inter-Medium.woff2?v=58") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("./fonts/Inter-SemiBold.woff2?v=58") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("./fonts/Inter-Bold.woff2?v=58") format("woff2");
  font-weight: 700 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("./fonts/Inter-Italic.woff2?v=58") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

:root {
  --font-ui: "Inter", Arial, sans-serif;
  --tq-navy: #142131;
  --tq-navy-deep: #101b29;
  --tq-green: #159447;
  --tq-green-dark: #0d7f3b;
  --tq-lime: #8bd52e;
  --tq-blue: #2477e8;
  --tq-orange: #f28a1a;
  --tq-purple: #7b55ef;
  --tq-red: #df3e3e;
  --tq-ink: #151b26;
  --tq-text: #354052;
  --tq-muted: #6a7485;
  --tq-line: #dfe4eb;
  --tq-line-soft: #edf0f4;
  --tq-canvas: #f7f8fa;
  --tq-panel: #fff;
  --tq-radius: 7px;
  --tq-control-height: 40px;
  --tq-shadow: 0 2px 9px rgba(20, 33, 49, .035);
}

html,
body,
button,
input,
select,
textarea {
  font-family: var(--font-ui) !important;
  font-variant-numeric: tabular-nums;
}

html { background: var(--tq-canvas); }

body {
  color: var(--tq-text);
  font-size: 13px;
  font-weight: 430;
  letter-spacing: -.006em;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body.has-app-shell { background: var(--tq-canvas) !important; }
body.has-app-shell .container { max-width: none; }

body.has-app-shell h1,
body.has-app-shell h2,
body.has-app-shell h3,
body.has-app-shell h4,
body.has-app-shell h5,
body.has-app-shell h6 {
  color: var(--tq-ink);
  font-family: var(--font-ui) !important;
  letter-spacing: -.025em;
}

body.has-app-shell h1 { font-size: 22px; line-height: 1.2; }
body.has-app-shell h2 { font-size: 16px; line-height: 1.25; }
body.has-app-shell h3 { font-size: 14px; line-height: 1.3; }
body.has-app-shell p { line-height: 1.55; }

/* Global application frame */
body.has-app-shell .app-topbar {
  border-bottom-color: var(--tq-line) !important;
  box-shadow: 0 1px 0 rgba(20, 33, 49, .02) !important;
}

body.has-app-shell .app-brand__logo {
  width: 190px !important;
  max-width: calc(100% - 30px);
}

body.has-app-shell .app-page-context strong {
  color: #171c25;
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -.018em;
}

body.has-app-shell .app-nav.app-nav--dropdown {
  scrollbar-color: rgba(255,255,255,.18) transparent;
  scrollbar-width: thin;
}

body.has-app-shell .app-nav__link,
body.has-app-shell .app-nav__toggle,
body.has-app-shell .app-nav__sublink {
  font-size: 12px;
  letter-spacing: -.004em;
}

body.has-app-shell .app-nav__link,
body.has-app-shell .app-nav__toggle { min-height: 39px; }
body.has-app-shell .app-nav__sublink { min-height: 33px; }

body.has-app-shell .app-user__meta strong { font-size: 11.5px; font-weight: 680; }
body.has-app-shell .app-user__meta span { font-size: 10px; }

body.has-app-shell .container {
  padding-top: 24px;
  padding-right: 22px;
  padding-bottom: 48px;
  padding-left: 22px;
}

body.has-app-shell .app-footer {
  color: #7b8493;
  font-size: 10px;
}

/* One visual grammar for cards, controls and tables */
body.has-app-shell .card,
body.has-app-shell .page-section,
body.has-app-shell .table-wrapper,
body.has-app-shell [class$="-panel"],
body.has-app-shell [class*="-panel "] {
  border-color: var(--tq-line) !important;
  border-radius: var(--tq-radius) !important;
  box-shadow: var(--tq-shadow) !important;
}

body.has-app-shell .page-section,
body.has-app-shell .card { background: var(--tq-panel); }

body.has-app-shell .page-section__header {
  min-height: 58px;
  padding: 15px 18px;
  border-bottom-color: var(--tq-line-soft);
}

body.has-app-shell .page-section__title {
  color: var(--tq-ink);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -.018em;
}

body.has-app-shell .page-section__intro,
body.has-app-shell .muted,
body.has-app-shell .empty-state-text { color: var(--tq-muted); }

body.has-app-shell .section-kicker,
body.has-app-shell .settings-kicker {
  margin-bottom: 5px;
  color: var(--tq-green) !important;
  font-size: 9px !important;
  font-weight: 760 !important;
  letter-spacing: .105em !important;
  text-transform: uppercase;
}

body.has-app-shell .btn,
body.has-app-shell button:not(.app-nav-trigger):not(.app-nav__toggle):not(.trip-actions-toggle):not(.trip-detail-panel__close):not(.vehicle-form-panel__close) {
  min-height: 36px;
  border-radius: 5px !important;
  font-size: 11px;
  font-weight: 640;
  line-height: 1.1;
  letter-spacing: -.005em;
}

body.has-app-shell .btn { padding: 9px 14px; }
body.has-app-shell .btn-sm { min-height: 31px; padding: 7px 10px; font-size: 10px; }

body.has-app-shell .btn-primary,
body.has-app-shell .button-primary {
  border-color: var(--tq-green) !important;
  background: var(--tq-green) !important;
  color: #fff !important;
  box-shadow: 0 1px 2px rgba(13, 127, 59, .1) !important;
}

body.has-app-shell .btn-primary:hover,
body.has-app-shell .button-primary:hover {
  border-color: var(--tq-green-dark) !important;
  background: var(--tq-green-dark) !important;
}

body.has-app-shell .btn-ghost {
  border-color: #d7dde5 !important;
  background: #fff !important;
  color: #344054 !important;
}

body.has-app-shell .btn-ghost:hover { border-color: #aeb8c6 !important; background: #fafbfc !important; }
body.has-app-shell .btn-danger { border-color: #efaaaa !important; background: #fff !important; color: #d63838 !important; }
body.has-app-shell .btn-danger:hover { border-color: #df3e3e !important; background: #fff3f3 !important; }

body.has-app-shell label,
body.has-app-shell legend,
body.has-app-shell .form-field label {
  color: #485365;
  font-size: 10px;
  font-weight: 640;
  letter-spacing: .005em;
}

body.has-app-shell input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
body.has-app-shell select,
body.has-app-shell textarea {
  min-height: var(--tq-control-height);
  border: 1px solid #d8dee7 !important;
  border-radius: 5px !important;
  background-color: #fff !important;
  color: #283447 !important;
  font-size: 11.5px !important;
  font-weight: 440;
  box-shadow: none !important;
}

body.has-app-shell textarea { min-height: 92px; line-height: 1.5; resize: vertical; }

body.has-app-shell input:not([type="checkbox"]):not([type="radio"]):focus,
body.has-app-shell select:focus,
body.has-app-shell textarea:focus {
  border-color: #55ae74 !important;
  outline: 3px solid rgba(21, 148, 71, .11) !important;
  outline-offset: 0;
}

body.has-app-shell input::placeholder,
body.has-app-shell textarea::placeholder { color: #9aa4b2; opacity: 1; }

body.has-app-shell input:disabled,
body.has-app-shell select:disabled,
body.has-app-shell textarea:disabled { background: #f3f5f7 !important; color: #7d8795 !important; }

body.has-app-shell .form-helper-text,
body.has-app-shell .settings-field small { color: var(--tq-muted); font-size: 9.5px; }

body.has-app-shell .table-wrapper { overflow: auto; background: #fff; }
body.has-app-shell .table,
body.has-app-shell .data-table { color: var(--tq-text); font-size: 11px; }

body.has-app-shell .table thead th,
body.has-app-shell .data-table thead th {
  padding: 10px 12px;
  border-color: var(--tq-line) !important;
  background: #fafbfc !important;
  color: #667184 !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: .045em !important;
  line-height: 1.3;
  text-transform: uppercase;
}

body.has-app-shell .table td,
body.has-app-shell .data-table td {
  padding: 11px 12px;
  border-color: var(--tq-line-soft) !important;
  color: #354052;
  font-size: 10.5px;
  line-height: 1.4;
}

body.has-app-shell .table tbody tr:hover td,
body.has-app-shell .data-table tbody tr:hover td { background: #fafdfb; }

body.has-app-shell .badge,
body.has-app-shell [class*="status"]:where(span, strong),
body.has-app-shell [class*="state"]:where(span, strong) {
  border-radius: 4px;
  font-size: 9px;
  font-weight: 650;
  letter-spacing: .005em;
  text-transform: none;
}

body.has-app-shell .badge { padding: 5px 8px; }
body.has-app-shell .flash { border-radius: 5px; font-size: 11px; }
body.has-app-shell .empty-state { border-color: var(--tq-line); border-radius: 6px; background: #fbfcfd; }

/* Dashboard */
body.page-dashboard .dashboard-container { gap: 17px; max-width: none; }
body.page-dashboard .dashboard-hero {
  min-height: 86px;
  padding: 18px 20px;
  border: 1px solid var(--tq-line) !important;
  border-radius: var(--tq-radius) !important;
  background: #fff !important;
  color: var(--tq-ink) !important;
  box-shadow: var(--tq-shadow) !important;
}

body.page-dashboard .dashboard-hero h1 { margin-bottom: 5px; color: var(--tq-ink) !important; font-size: 22px; }
body.page-dashboard .dashboard-hero p { color: var(--tq-muted) !important; font-size: 11.5px; }
body.page-dashboard .dashboard-role-badge { border: 1px solid #bee2c9; border-radius: 4px; background: #eef8f1; color: var(--tq-green-dark); }

body.page-dashboard .dashboard-kpi-section { border: 0 !important; background: transparent !important; box-shadow: none !important; }
body.page-dashboard .kpi-row { gap: 14px; }
body.page-dashboard .kpi-card {
  min-height: 104px;
  padding: 17px 18px;
  border: 1px solid var(--tq-line) !important;
  border-radius: var(--tq-radius) !important;
  background: #fff !important;
  box-shadow: none !important;
}

body.page-dashboard .kpi-card::before { display: none; }
body.page-dashboard .kpi-icon { width: 42px; height: 42px; padding: 9px; border-radius: 6px; background: #eef8ea; color: #42a632; }
body.page-dashboard .kpi-card:nth-child(2) .kpi-icon { background: #edf4ff; color: var(--tq-blue); }
body.page-dashboard .kpi-card:nth-child(3) .kpi-icon { background: #fff4e7; color: var(--tq-orange); }
body.page-dashboard .kpi-card:nth-child(4) .kpi-icon { background: #f3edff; color: var(--tq-purple); }
body.page-dashboard .kpi-label { color: var(--tq-muted); font-size: 10px; font-weight: 540; text-transform: none; letter-spacing: 0; }
body.page-dashboard .kpi-value { color: var(--tq-ink); font-size: 20px; font-weight: 720; }
body.page-dashboard .kpi-unit { color: var(--tq-muted); font-size: 9px; }
body.page-dashboard .next-trip-card { border-color: var(--tq-line); border-radius: 6px; background: #fff; box-shadow: none; }
body.page-dashboard .next-trip-card__date { border-radius: 5px 0 0 5px; background: var(--tq-navy); }
body.page-dashboard .next-trip-card__route { font-size: 14px; }
body.page-dashboard .dashboard-all-trips { color: var(--tq-green); font-size: 10px; font-weight: 650; }

/* Master data: customers, drivers, addresses and vehicles */
body:is(.page-customers,.page-drivers,.page-addresses,.page-vehicles) .masterdata-section,
body.page-vehicles .vehicle-register-panel { overflow: hidden; background: #fff; }

body:is(.page-customers,.page-drivers,.page-addresses,.page-vehicles) .masterdata-section__header,
body.page-vehicles .vehicle-register-head {
  padding: 0 0 18px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--tq-ink) !important;
}

body:is(.page-customers,.page-drivers,.page-addresses,.page-vehicles) .masterdata-section__header .page-section__title,
body.page-vehicles .vehicle-register-head h1 { color: var(--tq-ink) !important; font-size: 22px !important; }

body:is(.page-customers,.page-drivers,.page-addresses,.page-vehicles) .masterdata-toolbar,
body.page-vehicles .vehicle-register-tools {
  gap: 10px;
  margin: 0;
  padding: 13px 14px;
  border-top: 1px solid var(--tq-line);
  border-bottom: 1px solid var(--tq-line);
  background: #fbfcfd;
}

body.has-app-shell .masterdata-directory,
body.has-app-shell .vehicle-register-table-wrap { border-color: var(--tq-line); background: #fff; }

body.has-app-shell .masterdata-directory__head,
body.has-app-shell .vehicle-register-table th {
  min-height: 41px;
  background: #fafbfc !important;
  color: #667184 !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: .045em !important;
}

body.has-app-shell .masterdata-directory__row { min-height: 61px; border-color: var(--tq-line-soft); }
body.has-app-shell .masterdata-identity strong,
body.has-app-shell .masterdata-vehicle strong,
body.has-app-shell .vehicle-register-name strong { color: #222c3b; font-size: 11px; }
body.has-app-shell .masterdata-identity small,
body.has-app-shell .masterdata-value span,
body.has-app-shell .masterdata-value small,
body.has-app-shell .vehicle-register-name span { color: var(--tq-muted); font-size: 9px; }
body.has-app-shell .masterdata-value strong,
body.has-app-shell .masterdata-value a { color: #354052; font-size: 10.5px; }
body.has-app-shell .masterdata-action { min-height: 29px; border-radius: 4px; font-size: 9.5px; }
body.has-app-shell .masterdata-form-panels { margin-top: 17px; }
body.has-app-shell .masterdata-form-section { overflow: hidden; }
body.has-app-shell .masterdata-form-section .app-form { padding: 17px 18px 19px; }

body.page-customers .customer-kpi-strip,
body.page-vehicles .vehicle-register-summary,
body.page-vehicles .vehicle-record-kpis { border-color: var(--tq-line); border-radius: 6px; background: #fff; }
body.page-customers .customer-kpi-strip strong,
body.page-vehicles .vehicle-register-summary strong,
body.page-vehicles .vehicle-record-kpis strong { color: var(--tq-ink); font-size: 17px; }
body.page-customers .customer-kpi-strip span,
body.page-vehicles .vehicle-register-summary span,
body.page-vehicles .vehicle-record-kpis span { color: var(--tq-muted); font-size: 9px; letter-spacing: .04em; }

body.page-vehicles .vehicle-register-head > div:first-child > p:last-child { color: var(--tq-muted); font-size: 11.5px; }
body.page-vehicles .vehicle-register-panel__head { padding: 15px 17px; border-color: var(--tq-line-soft); }
body.page-vehicles .vehicle-register-panel__head h2 { font-size: 15px; }
body.page-vehicles .vehicle-register-tabs { border-color: var(--tq-line); border-radius: 5px; }
body.page-vehicles .vehicle-register-tabs a { min-height: 36px; color: #566174; font-size: 10px; }
body.page-vehicles .vehicle-register-tabs a.is-active { color: var(--tq-green); background: #f0f8f2; }
body.page-vehicles .vehicle-register-tabs a.is-active::after { background: var(--tq-green); }
body.page-vehicles .vehicle-register-table td { height: 58px; color: #354052; font-size: 10.5px; }
body.page-vehicles .vehicle-state.is-active { background: #eef8f1; color: var(--tq-green-dark); border: 1px solid #b9dfc5; }
body.page-vehicles .vehicle-state.is-inactive { background: #f2f4f6; color: #697386; border: 1px solid #d8dde4; }
body.page-vehicles .vehicle-record-body { background: var(--tq-canvas); }
body.page-vehicles .vehicle-record-card { border-color: var(--tq-line); border-radius: 6px; overflow: hidden; }

/* Events and structured operational forms */
body.page-events .events-page-section,
body.page-event-view .event-panel,
body.page-fahrt-kalkulieren .fare-simple-section,
body.has-app-shell .structured-form-section {
  border-color: var(--tq-line) !important;
  border-radius: var(--tq-radius) !important;
  background: #fff !important;
  box-shadow: var(--tq-shadow) !important;
}

body.page-events .events-page-section > header,
body.page-event-view .event-panel > header,
body.has-app-shell .structured-form-section__head {
  padding: 14px 17px;
  border-color: var(--tq-line-soft);
  background: #fbfcfd !important;
}

body.has-app-shell .structured-form-section__head h4 { color: var(--tq-ink); font-size: 13px; }
body.has-app-shell .structured-form-section__icon { border-radius: 5px; background: #eef8f1; color: var(--tq-green); }
body.page-events .event-kpi-grid { gap: 13px; }
body.page-events .event-kpi-card,
body.page-event-view .event-kpi-card { border-color: var(--tq-line); border-radius: 6px; background: #fff; box-shadow: none; }
body.page-events .event-kpi-card strong,
body.page-event-view .event-kpi-card strong { color: var(--tq-ink); font-size: 18px; }
body.page-events .event-kpi-card span,
body.page-event-view .event-kpi-card span { color: var(--tq-muted); font-size: 9px; }

/* Fare calculator */
body.page-fahrt-kalkulieren .fare-app { max-width: none; }
body.page-fahrt-kalkulieren .fare-page-head {
  margin-bottom: 17px;
  padding: 0;
  border: 0;
  background: transparent;
}
body.page-fahrt-kalkulieren .fare-page-head h1 { color: var(--tq-ink); font-size: 22px; }
body.page-fahrt-kalkulieren .fare-page-head p { color: var(--tq-muted); font-size: 11.5px; }
body.page-fahrt-kalkulieren .fare-simple-section { overflow: hidden; }
body.page-fahrt-kalkulieren .fare-result,
body.page-fahrt-kalkulieren [class*="fare-result"] { border-color: var(--tq-line); border-radius: 6px; box-shadow: none; }

/* Reports and revenue */
body.page-umsaetze .revenue-page { max-width: none; }
body.page-umsaetze .revenue-hero,
body:is(.page-notifications,.page-driver-locations) .notification-page__head {
  min-height: 84px;
  padding: 18px 20px;
  border: 1px solid var(--tq-line);
  border-radius: var(--tq-radius);
  background: #fff;
  color: var(--tq-ink);
  box-shadow: var(--tq-shadow);
}
body.page-umsaetze .revenue-hero h1,
body:is(.page-notifications,.page-driver-locations) .notification-page__head h1 { color: var(--tq-ink); font-size: 22px; }
body.page-umsaetze .revenue-hero p:last-child,
body:is(.page-notifications,.page-driver-locations) .notification-page__head p { color: var(--tq-muted); font-size: 11.5px; }
body:is(.page-notifications,.page-driver-locations) .notification-page__counter { border-color: var(--tq-line); }
body:is(.page-notifications,.page-driver-locations) .notification-page__counter strong { color: var(--tq-ink); }
body:is(.page-notifications,.page-driver-locations) .notification-page__counter span { color: var(--tq-muted); }

body.page-umsaetze .revenue-filter,
body.page-umsaetze .revenue-kpi,
body.page-umsaetze .revenue-surcharges,
body.page-umsaetze .revenue-ranking,
body.page-umsaetze .revenue-details { border-color: var(--tq-line); border-radius: var(--tq-radius); background: #fff; box-shadow: var(--tq-shadow); }
body.page-umsaetze .revenue-filter__summary { border-radius: var(--tq-radius); background: #fff; }
body.page-umsaetze .revenue-filter[open] .revenue-filter__summary { border-radius: var(--tq-radius) var(--tq-radius) 0 0; background: #fbfcfd; }
body.page-umsaetze .revenue-kpis { gap: 14px; }
body.page-umsaetze .revenue-kpi { min-height: 104px; padding: 17px 18px; }
body.page-umsaetze .revenue-kpi::before { display: none; }
body.page-umsaetze .revenue-kpi--primary { background: #fff; color: inherit; }
body.page-umsaetze .revenue-kpi > span { color: var(--tq-muted); font-size: 10px; font-weight: 540; letter-spacing: 0; text-transform: none; }
body.page-umsaetze .revenue-kpi > strong { color: var(--tq-ink); font-size: 20px; }
body.page-umsaetze .revenue-kpi > small { color: var(--tq-muted); font-size: 9.5px; }
body.page-umsaetze .revenue-ranking > header { border-color: var(--tq-line-soft); background: #fbfcfd; }
body.page-umsaetze .revenue-ranking h2 { font-size: 14px; }
body.page-umsaetze .revenue-ranking__item i { background: var(--tq-green); }

body.page-driver-log-reports .page-section,
body.page-trip-log-view .page-section,
body.page-trip-log .proto-block { overflow: hidden; }
body.page-trip-log .trip-log-page { max-width: 940px; }
body.page-trip-log .proto-block { border-color: var(--tq-line); border-radius: 6px; background: #fff; box-shadow: none; }
body.page-trip-log .proto-block__title { color: var(--tq-ink); font-size: 13px; }

/* Settings, permissions and licence */
body:is(.page-settings,.page-users,.page-license) .settings-shell {
  display: grid;
  grid-template-columns: 214px minmax(0, 1fr);
  gap: 17px;
  max-width: none;
}

body:is(.page-settings,.page-users,.page-license) .settings-sidebar {
  align-self: start;
  overflow: hidden;
  border: 1px solid var(--tq-line);
  border-radius: var(--tq-radius);
  background: #fff;
  box-shadow: var(--tq-shadow);
}

body:is(.page-settings,.page-users,.page-license) .settings-sidebar__head {
  padding: 16px;
  border-bottom: 1px solid var(--tq-line);
  background: #fbfcfd;
}
body:is(.page-settings,.page-users,.page-license) .settings-sidebar__head h1 { color: var(--tq-ink); font-size: 17px; }
body:is(.page-settings,.page-users,.page-license) .settings-sidebar__head p { color: var(--tq-muted); font-size: 10px; }
body:is(.page-settings,.page-users,.page-license) .settings-nav-item { min-height: 51px; padding: 10px 12px; border-color: var(--tq-line-soft); color: #4c586a; }
body:is(.page-settings,.page-users,.page-license) .settings-nav-item svg { width: 18px; height: 18px; color: #697587; }
body:is(.page-settings,.page-users,.page-license) .settings-nav-item strong { font-size: 11px; font-weight: 630; }
body:is(.page-settings,.page-users,.page-license) .settings-nav-item small { margin-top: 2px; color: #7f8997; font-size: 8.5px; }
body:is(.page-settings,.page-users,.page-license) .settings-nav-item.is-active { border-left: 3px solid var(--tq-green); background: #f0f8f2; color: var(--tq-green-dark); }

body:is(.page-settings,.page-users) .settings-content__head,
body.page-users .users-access-hero {
  min-height: 85px;
  margin-bottom: 16px;
  padding: 18px 20px;
  border: 1px solid var(--tq-line);
  border-radius: var(--tq-radius);
  background: #fff;
  color: var(--tq-ink);
  box-shadow: var(--tq-shadow);
}
body:is(.page-settings,.page-users) .settings-content__head h2,
body.page-users .users-access-hero h1 { color: var(--tq-ink); font-size: 21px; }
body:is(.page-settings,.page-users) .settings-content__head p,
body.page-users .users-access-hero__identity p:last-child { color: var(--tq-muted); font-size: 11px; }
body.page-settings .settings-save-state { border-color: #bee2c9; border-radius: 4px; background: #eef8f1; color: var(--tq-green-dark); }

body:is(.page-settings,.page-users) .settings-section-card,
body:is(.page-settings,.page-users) .settings-logo-panel,
body.page-users :is(.users-create-section,.users-profile-section,.users-list-section,.users-edit-section) {
  overflow: hidden;
  border: 1px solid var(--tq-line);
  border-radius: var(--tq-radius);
  background: #fff;
  box-shadow: var(--tq-shadow);
}
body:is(.page-settings,.page-users) .settings-section-card__head { padding: 14px 17px; border-color: var(--tq-line-soft); background: #fbfcfd; }
body:is(.page-settings,.page-users) .settings-section-card__head h3 { color: var(--tq-ink); font-size: 14px; }
body:is(.page-settings,.page-users) .settings-section-card__head p { color: var(--tq-muted); font-size: 10px; }
body:is(.page-settings,.page-users) .settings-field-grid { gap: 14px; padding: 17px; }
body:is(.page-settings,.page-users) .settings-actionbar { border-radius: 6px; background: var(--tq-navy); }
body:is(.page-settings,.page-users) .settings-system-action { border-color: var(--tq-line-soft); }
body:is(.page-settings,.page-users) .settings-system-action:hover { background: #f2f9f4; box-shadow: inset 3px 0 0 var(--tq-green); }
body.page-users .users-access-stats { border-color: var(--tq-line); }
body.page-users .users-access-stat strong { color: var(--tq-ink); font-size: 17px; }
body.page-users .users-access-stat span { color: var(--tq-muted); font-size: 8.5px; }
body.page-users .users-create-summary { background: #fbfcfd; }
body.page-users .settings-permission-group label:has(input:checked) { border-color: #8dcc9f; background: #f1f8f3; box-shadow: inset 3px 0 0 var(--tq-green); }

body.page-license .license-page,
body.page-license .license-shell { max-width: none; }
body.page-license [class*="license-"][class*="card"],
body.page-license [class*="license-"][class*="panel"] { border-color: var(--tq-line); border-radius: var(--tq-radius); box-shadow: var(--tq-shadow); }

/* Profile, notifications, search, tracking and messages */
body.page-profile .profile-hero {
  border: 1px solid var(--tq-line);
  border-radius: var(--tq-radius);
  background: #fff;
  color: var(--tq-ink);
  box-shadow: var(--tq-shadow);
}
body.page-profile .profile-hero h1 { color: var(--tq-ink); }
body.page-profile .profile-hero p { color: var(--tq-muted); }
body.page-profile .profile-avatar { border-radius: 50%; background: var(--tq-navy); color: #fff; }
body.page-profile .profile-role-badge { border: 1px solid #bee2c9; border-radius: 4px; background: #eef8f1; color: var(--tq-green-dark); }
body.page-profile .profile-card { border-color: var(--tq-line); border-radius: var(--tq-radius); box-shadow: var(--tq-shadow); }

body.page-notifications .notification-toolbar,
body.page-notifications .notification-item,
body.page-driver-locations .tracking-card { border-color: var(--tq-line); border-radius: 6px; box-shadow: none; }
body.page-notifications .notification-toolbar nav a { border-radius: 4px; color: #566174; font-size: 10px; }
body.page-notifications .notification-toolbar nav a.is-active { border-color: #b9dfc5; background: #eef8f1; color: var(--tq-green-dark); }
body.page-notifications .notification-item__title strong { color: var(--tq-ink); font-size: 12px; }
body.page-notifications .notification-item p { color: #596577; font-size: 10.5px; }
body.page-driver-locations .tracking-privacy-note { border-color: var(--tq-green); border-radius: 5px; background: #eef8f1; }
body.page-driver-locations .tracking-card__head { border-color: var(--tq-line-soft); background: #fbfcfd; }

body.page-search .search-page,
body.page-driver-messages .driver-message-page { max-width: none; }
body.page-search [class*="search-"][class*="card"],
body.page-driver-messages [class*="message-"][class*="card"] { border-color: var(--tq-line); border-radius: var(--tq-radius); box-shadow: var(--tq-shadow); }

/* Billing exports and legacy billing helper pages */
body.page-billing-export .billing-head { margin-bottom: 17px; padding: 0; background: transparent; }
body.page-billing-export .billing-head h1 { color: var(--tq-ink); font-size: 22px; }
body.page-billing-export .billing-head p { color: var(--tq-muted); font-size: 11.5px; }
body.page-billing-export .billing-export-period,
body.page-billing-export .billing-export-card,
body.page-billing-export .billing-export-notice { border-color: var(--tq-line); border-radius: var(--tq-radius); box-shadow: var(--tq-shadow); }
body.page-billing-export .billing-kpis { gap: 14px; }
body.page-billing-export .billing-kpis article { border-color: var(--tq-line); border-radius: var(--tq-radius); background: #fff; box-shadow: none; }
body.page-billing-export .billing-kpis article strong { color: var(--tq-ink); font-size: 19px; }

/* Dense modules: readable sizes and reference-compatible status colors */
body.page-trips .trips-overview-table thead th { font-size: 9.5px !important; }
body.page-trips .trip-cell-date strong,
body.page-trips .trip-cell-customer strong,
body.page-trips .trip-cell-trip strong,
body.page-trips .trip-cell-disposition strong,
body.page-trips .trip-cell-billing strong { font-size: 11.5px !important; line-height: 1.35; }
body.page-trips .trip-cell-date > span,
body.page-trips .trip-cell-customer > span,
body.page-trips .trip-cell-trip > span,
body.page-trips .trip-cell-disposition > span,
body.page-trips .trip-cell-billing > span { font-size: 10px !important; line-height: 1.35; }
body.page-trips .trip-cell-route .route-summary-btn__place { font-size: 11px !important; }
body.page-trips .trip-cell-route .route-summary-btn__meta { font-size: 9.5px !important; }
body.page-trips .trip-cell-status .badge { font-size: 9.5px !important; }
body.page-trips .trip-detail-tabs a { font-size: 10.5px !important; }
body.page-trips .trip-detail-summary > span { font-size: 9.5px !important; }
body.page-trips .trip-detail-summary > span strong { font-size: 10.5px !important; }
body.page-trips .trip-detail-section h4 { font-size: 11.5px !important; }
body.page-trips .trip-detail-grid > div > span,
body.page-trips .trip-detail-route p span { font-size: 9.5px !important; }
body.page-trips .trip-detail-grid > div > strong,
body.page-trips .trip-detail-route p strong { font-size: 11px !important; }
body.page-trips .trip-detail-panel__body { scrollbar-color: #c8d0da transparent; scrollbar-width: thin; }
body.page-trips .trip-detail-panel__footer { gap: 9px; }

body.has-app-shell .badge-success { border-color: #acdcb9 !important; background: #eef9f1 !important; color: #147d3a !important; }
body.has-app-shell .badge-info,
body.has-app-shell .badge-ended { border-color: #b9d2f9 !important; background: #edf5ff !important; color: #216bd0 !important; }
body.has-app-shell .badge-request { border-color: #f1c78e !important; background: #fff7e9 !important; color: #c96d09 !important; }
body.has-app-shell .badge-danger { border-color: #f0b2b2 !important; background: #fff1f1 !important; color: #d53b3b !important; }
body.has-app-shell .badge-neutral { border-color: #d6dce4 !important; background: #f3f5f7 !important; color: #697386 !important; }

body.has-app-shell .wa-table th { font-size: 9px !important; }
body.has-app-shell .wa-table td { font-size: 10.5px !important; }
body.has-app-shell .wa-panel__header h2,
body.has-app-shell .wa-editor-card > header h3 { font-size: 15px !important; }
body.has-app-shell .wa-panel__header p { font-size: 10px !important; }
body.has-app-shell .wa-filterbar label { font-size: 9.5px !important; }

body.has-app-shell .fibu-table th { font-size: 9px !important; }
body.has-app-shell .fibu-table td { font-size: 10.5px !important; }
body.has-app-shell .fibu-table td > small,
body.has-app-shell .fibu-cell-link { font-size: 9px !important; }
body.has-app-shell .fibu-table-footer { font-size: 9px !important; }
body.has-app-shell .fibu-panel__head > div:first-child > span { font-size: 9px !important; }
body.has-app-shell .fibu-panel__head p { font-size: 10px !important; }
body.has-app-shell .fibu-status-card strong { font-size: 11px !important; }
body.has-app-shell .fibu-status-card em,
body.has-app-shell .fibu-status-card small { font-size: 9px !important; }
body.has-app-shell .fibu-entry-form label,
body.has-app-shell .fibu-posting-form label,
body.has-app-shell .fibu-settings-form label { font-size: 9.5px !important; }
body.has-app-shell .fibu-entry-form label small,
body.has-app-shell .fibu-posting-form label small,
body.has-app-shell .fibu-settings-form label small { font-size: 8.5px !important; }
body.has-app-shell .fibu-entry-form input,
body.has-app-shell .fibu-entry-form select,
body.has-app-shell .fibu-entry-form textarea,
body.has-app-shell .fibu-posting-form input,
body.has-app-shell .fibu-posting-form select,
body.has-app-shell .fibu-settings-form input,
body.has-app-shell .fibu-settings-form select { font-size: 10.5px !important; }
body.has-app-shell .fibu-row-menu > div > a,
body.has-app-shell .fibu-row-menu > div > details > summary { font-size: 10px !important; }
body.has-app-shell .fibu-drawer { top: var(--tq-topbar) !important; bottom: 0; border-color: var(--tq-line); }
body.has-app-shell .fibu-drawer-backdrop { top: var(--tq-topbar) !important; left: var(--tq-sidebar) !important; }

body.page-events :is(.event-status,.event-version-marker,.event-kpi-pill),
body.page-event-view :is(.event-status,.event-version-marker,.event-kpi-pill,.pickup-status) { border-radius: 4px !important; }
body.page-event-view .event-subline { color: var(--tq-muted) !important; font-size: 11px !important; }
body.page-event-view .event-kpi-card__value { color: var(--tq-ink) !important; font-size: 21px !important; }
body.page-event-view .event-kpi-card__label { color: var(--tq-muted) !important; font-size: 10px !important; }
body.page-event-view :is(.event-occupancy,.event-pickup-control,.pickup-mini-kpi,.event-trip-card) { border-color: var(--tq-line) !important; border-radius: 6px !important; background: #fff !important; }

body.has-app-shell .trip-form-panel,
body.has-app-shell .vehicle-form-panel,
body.has-app-shell .wa-drawer,
body.has-app-shell .fibu-drawer {
  border-radius: 0 !important;
  box-shadow: -10px 0 32px rgba(20,33,49,.16) !important;
}

body.has-app-shell .trip-form-panel__head,
body.has-app-shell .vehicle-form-panel__head,
body.has-app-shell .wa-drawer > header,
body.has-app-shell .fibu-drawer > header { border-color: var(--tq-line) !important; background: #fff !important; color: var(--tq-ink) !important; }
body.has-app-shell .trip-form-panel__head h2,
body.has-app-shell .vehicle-form-panel__head h2,
body.has-app-shell .wa-drawer > header h2,
body.has-app-shell .fibu-drawer > header h2 { color: var(--tq-ink) !important; font-size: 18px !important; }
body.has-app-shell .trip-form-panel__head p,
body.has-app-shell .vehicle-form-panel__head p,
body.has-app-shell .wa-drawer > header p,
body.has-app-shell .fibu-drawer > header p { color: var(--tq-muted) !important; }

/* Customer portal, driver PWA and request flow */
body.page-driver-app .driver-pwa-page,
body.page-trip-request .dashboard-container { max-width: 1180px; margin-right: auto; margin-left: auto; }
body.page-driver-app .driver-pwa-hero,
body.page-trip-request .dashboard-hero {
  border: 1px solid var(--tq-line);
  border-radius: var(--tq-radius);
  background: #fff;
  color: var(--tq-ink);
  box-shadow: var(--tq-shadow);
}
body.page-driver-app .driver-pwa-hero h1,
body.page-trip-request .dashboard-hero h1 { color: var(--tq-ink); }
body.page-driver-app .driver-pwa-hero p,
body.page-trip-request .dashboard-hero p { color: var(--tq-muted); }
body.page-driver-app .driver-pwa-kicker { color: var(--tq-green); }
body.page-driver-app .driver-network-state { border: 1px solid #bee2c9; border-radius: 4px; background: #eef8f1; color: var(--tq-green-dark); }
body.page-driver-app .driver-pwa-setup,
body.page-driver-app .driver-trip-card,
body.page-trip-request .page-section { border-color: var(--tq-line); border-radius: var(--tq-radius); background: #fff; box-shadow: var(--tq-shadow); }
body.page-driver-app .driver-trip-card.is-priority { border-color: #9bd0ac; box-shadow: inset 3px 0 0 var(--tq-green), var(--tq-shadow); }
body.page-driver-app .driver-trip-date { border-radius: 5px; background: var(--tq-navy); }
body.page-driver-app .driver-pwa-tabbar { border-color: var(--tq-line); background: rgba(255,255,255,.96); }

/* Login */
body.has-auth-shell {
  min-height: 100vh;
  background:
    radial-gradient(circle at 77% 15%, rgba(139, 213, 46, .11), transparent 27%),
    linear-gradient(120deg, var(--tq-navy) 0 38%, #f7f8fa 38% 100%) !important;
}

body.has-auth-shell .container { min-height: calc(100vh - 42px); padding: 0; }
body.has-auth-shell .login-wrap { min-height: calc(100vh - 42px); padding: 36px 20px; }
body.has-auth-shell .login-box {
  width: min(100%, 430px);
  overflow: hidden;
  border: 1px solid var(--tq-line);
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(11, 23, 38, .18);
}
body.has-auth-shell .login-box__header { display: grid; gap: 22px; padding: 28px 30px 20px; border-bottom: 1px solid var(--tq-line-soft); text-align: left; }
body.has-auth-shell .login-logo { width: 210px; max-width: 100%; height: auto; max-height: none; object-fit: contain; object-position: left center; }
body.has-auth-shell .login-eyebrow { display: block; margin-bottom: 6px; color: var(--tq-green); font-size: 9px; font-weight: 760; letter-spacing: .11em; text-transform: uppercase; }
body.has-auth-shell .login-title { margin: 0; color: var(--tq-ink); font-size: 23px; font-weight: 720; letter-spacing: -.03em; }
body.has-auth-shell .login-form { gap: 15px; padding: 22px 30px 28px; }
body.has-auth-shell .login-form label { color: #485365; font-size: 10px; font-weight: 650; text-transform: none; letter-spacing: 0; }
body.has-auth-shell .login-form input { min-height: 43px; border: 1px solid #d8dee7; border-radius: 5px; background: #fff; color: #283447; font-size: 12px; box-shadow: none; }
body.has-auth-shell .login-form input:focus { border-color: #55ae74; outline: 3px solid rgba(21, 148, 71, .11); }
body.has-auth-shell .btn-login { min-height: 43px; border-radius: 5px; background: var(--tq-green) !important; font-size: 11.5px; }
body.has-auth-shell .login-error { margin: 18px 30px 0; border: 1px solid #f2b4b4; border-radius: 5px; background: #fff3f3; color: #bd2929; font-size: 10.5px; }
body.has-auth-shell .login-help { color: var(--tq-muted); font-size: 9.5px; }
body.has-auth-shell .app-footer { width: 100%; margin: 0; padding: 0 24px 18px; color: #768092; }

/* Standalone reservation and chat pages */
body.tq-public-page,
body.chat-page {
  background: var(--tq-canvas) !important;
  color: var(--tq-text);
}

body.chat-page .chat-shell { min-height: 100vh; padding: 28px 18px; }
body.chat-page .chat-layout,
body.chat-page .chat-state-card {
  overflow: hidden;
  border: 1px solid var(--tq-line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 16px 45px rgba(20,33,49,.09);
}
body.chat-page .chat-header-panel { border: 0; border-bottom: 1px solid var(--tq-line); border-radius: 0; background: var(--tq-navy); color: #fff; box-shadow: none; }
body.chat-page .chat-header-panel__eyebrow { color: var(--tq-lime); font-size: 9px; letter-spacing: .12em; }
body.chat-page .chat-header-panel__title { color: #fff; font-size: 20px; letter-spacing: -.025em; }
body.chat-page .chat-header-panel .badge { border: 1px solid rgba(255,255,255,.2); border-radius: 4px; background: rgba(255,255,255,.08); color: #fff; font-size: 9px; }
body.chat-page .chat-box { background: #f8f9fb; }
body.chat-page .chat-msg { border-radius: 6px 6px 6px 2px; background: #fff; color: #354052; box-shadow: 0 1px 4px rgba(20,33,49,.08); }
body.chat-page .chat-me { border-radius: 6px 6px 2px 6px; background: #eaf7ee; color: #17572e; }
body.chat-page .chat-input-bar { border-color: var(--tq-line); background: #fff; }
body.chat-page .chat-input-field { min-height: 42px; border-color: #d8dee7; border-radius: 5px; font-size: 12px; }
body.chat-page .chat-send-button { min-height: 42px; border-radius: 5px; background: var(--tq-green); font-size: 11px; }

body.page-trip-public .page { width: min(100%, 1180px); margin: 0 auto; padding: 30px 18px 44px; }
body.page-trip-public .header,
body.page-trip-public .card { border-color: var(--tq-line); border-radius: var(--tq-radius); box-shadow: var(--tq-shadow); }
body.page-trip-public .header { padding: 24px; border-top: 4px solid var(--tq-green); }
body.page-trip-public .public-company-logo { max-width: 210px; }
body.page-trip-public .eyebrow { color: var(--tq-green); font-size: 9px; letter-spacing: .11em; }
body.page-trip-public h1 { color: var(--tq-ink); font-size: 25px; letter-spacing: -.03em; }
body.page-trip-public h2 { color: var(--tq-ink); font-size: 15px; }
body.page-trip-public .badge { border: 1px solid #bee2c9; border-radius: 4px; background: #eef8f1; color: var(--tq-green-dark); font-size: 10px; }
body.page-trip-public .row { border-color: var(--tq-line-soft); font-size: 11.5px; }
body.page-trip-public .route-step__number { border-radius: 50%; background: var(--tq-green); color: #fff; }

/* Responsive system corrections */
@media (max-width: 1180px) {
  body:is(.page-settings,.page-users,.page-license) .settings-shell { grid-template-columns: 190px minmax(0,1fr); }
  body.page-dashboard .kpi-row,
  body.page-umsaetze .revenue-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 900px) {
  body.has-app-shell .container { padding: 20px 16px 78px; }
  body:is(.page-settings,.page-users,.page-license) .settings-shell { display: block; }
  body:is(.page-settings,.page-users,.page-license) .settings-sidebar { margin-bottom: 16px; }
  body:is(.page-settings,.page-users,.page-license) .settings-sidebar__head { display: none; }
  body:is(.page-settings,.page-users,.page-license) .settings-sidebar nav { display: flex; overflow-x: auto; }
  body:is(.page-settings,.page-users,.page-license) .settings-nav-item { min-width: 160px; border-right: 1px solid var(--tq-line-soft); border-bottom: 0; }
  body:is(.page-settings,.page-users,.page-license) .settings-nav-item.is-active { border-left: 0; border-bottom: 3px solid var(--tq-green); }
  body.page-driver-locations .tracking-grid { grid-template-columns: 1fr; }
  body.has-app-shell .wa-drawer,
  body.has-app-shell .fibu-drawer { top: 0 !important; width: 100vw !important; }
  body.has-app-shell .wa-drawer-backdrop,
  body.has-app-shell .fibu-drawer-backdrop { inset: 0 !important; }
}

@media (max-width: 700px) {
  body.has-app-shell { font-size: 12px; }
  body.has-app-shell .container { padding: 17px 12px 82px; }
  body.has-app-shell .page-section__header { padding: 14px; }
  body.has-app-shell .row { column-gap: 10px; }
  body.page-dashboard .dashboard-hero,
  body.page-umsaetze .revenue-hero,
  body:is(.page-notifications,.page-driver-locations) .notification-page__head,
  body:is(.page-settings,.page-users) .settings-content__head,
  body.page-users .users-access-hero { padding: 16px; }
  body.page-dashboard .kpi-row,
  body.page-umsaetze .revenue-kpis { grid-template-columns: 1fr; }
  body.page-dashboard .kpi-card { min-height: 88px; }
  body.page-dashboard .next-trip-card { display: block; }
  body.page-dashboard .next-trip-card__date { min-height: 72px; border-radius: 5px 5px 0 0; }
  body.has-app-shell .masterdata-toolbar,
  body.page-vehicles .vehicle-register-tools { align-items: stretch; flex-direction: column; }
  body:is(.page-settings,.page-users) .settings-field-grid { grid-template-columns: 1fr; padding: 14px; }
  body:is(.page-settings,.page-users) .settings-field--wide { grid-column: auto; }
  body.page-notifications .notification-item { grid-template-columns: 4px minmax(0,1fr); gap: 12px; padding: 14px; }
  body.page-notifications .notification-item__actions { grid-column: 2; }
  body.page-trip-public .grid { grid-template-columns: 1fr; }
  body.page-trip-public .header,
  body.page-trip-public .card { padding: 18px; }
}

@media (max-width: 520px) {
  body.has-auth-shell { background: var(--tq-canvas) !important; }
  body.has-auth-shell .login-wrap { padding: 16px 12px; }
  body.has-auth-shell .login-box__header { padding: 24px 22px 18px; }
  body.has-auth-shell .login-form { padding: 20px 22px 24px; }
  body.has-auth-shell .login-error { margin-right: 22px; margin-left: 22px; }
  body.chat-page .chat-shell { padding: 0; }
  body.chat-page .chat-layout { min-height: 100vh; border: 0; border-radius: 0; }
  body.page-trip-public .page { padding: 12px 10px 28px; }
}

@media print {
  body.has-app-shell .app-topbar,
  body.has-app-shell .app-nav,
  body.has-app-shell .app-footer { display: none !important; }
  body.has-app-shell .container { width: 100% !important; margin: 0 !important; padding: 0 !important; }
}