:root {
    --bg: #f7f7f8;
    --surface: #ffffff;
    --border: #e5e7eb;
    --text: #111827;
    --muted: #6b7280;
    --primary: #2563eb;
    --success: #15803d;
    --warning: #b45309;
    --danger: #b91c1c;
}

html, body {
    background: var(--bg);
    color: var(--text);
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 15px;
}

body { line-height: 1.5; }

h1, h2, h3, h4, h5, h6 {
    color: var(--text);
    letter-spacing: -0.01em;
}

.page-title { font-size: 26px; font-weight: 700; margin-bottom: 4px; }
.page-subtitle { font-size: 14px; color: var(--muted); margin-bottom: 0; }

.card, .list-group-item, .modal-content {
    border-color: var(--border);
    box-shadow: none !important;
}

.card, .modal-content { background: var(--surface); border-radius: 12px; }

.table { color: var(--text); }
.table thead th {
    background: #f3f4f6;
    color: #374151;
    border-bottom: 1px solid var(--border);
    font-weight: 600;
}
.table td, .table th { border-color: var(--border); vertical-align: middle; }
.table-hover tbody tr:hover { background: #fafafa; }
.text-muted { color: var(--muted) !important; }

.btn {
    border-radius: 9px;
    min-height: 40px;
    border-width: 1px;
    box-shadow: 0 1px 0 rgba(255,255,255,.75) inset, 0 1px 2px rgba(15, 23, 42, .08);
    transform: translateY(0);
    transition: transform .08s ease, box-shadow .08s ease, filter .08s ease;
}
.btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 1px 0 rgba(255,255,255,.8) inset, 0 4px 10px rgba(15, 23, 42, .10);
}
.btn:active {
    transform: translateY(0);
    box-shadow: 0 1px 0 rgba(255,255,255,.7) inset, 0 1px 2px rgba(15, 23, 42, .12);
}
.btn-primary { background: linear-gradient(to bottom, #2f6df6, #255eea); border-color: #2457d3; }
.btn-success { background: linear-gradient(to bottom, #1d8b45, #15803d); border-color: #13713a; }
.btn-warning { background: linear-gradient(to bottom, #c47a12, #b45309); border-color: #9a4d08; color: #fff; }
.btn-danger { background: linear-gradient(to bottom, #c63d3d, #b91c1c); border-color: #9f1f1f; }
.btn-outline-primary, .btn-outline-secondary, .btn-outline-light, .btn-outline-danger { border-color: var(--border); background: #fff; }

.form-control, .form-select {
    border-color: var(--border);
    border-radius: 8px;
    min-height: 42px;
    background-color: #fff;
}
.form-control:focus, .form-select:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 .15rem rgba(37, 99, 235, .08);
}

.navbar { border-bottom: 1px solid rgba(0,0,0,.06); }
.navbar-brand { font-size: 1rem; }

.sidebar-shell {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}
.sidebar-panel {
    width: 240px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 16px;
    position: sticky;
    top: 16px;
}
.sidebar-brand {
    font-weight: 700;
    margin-bottom: 16px;
    font-size: 16px;
}
.sidebar-nav .nav-link {
    color: #374151;
    border-radius: 10px;
    padding: 10px 12px;
    margin-bottom: 4px;
}
.sidebar-nav .nav-link:hover,
.sidebar-nav .nav-link.active {
    background: #eff6ff;
    color: var(--primary);
}
.content-panel { flex: 1; min-width: 0; }

.badge { border-radius: 999px; font-weight: 600; }
.responsive-preview-img { max-width: 100%; height: auto; border-radius: 8px; margin-top: 8px; }
.touch-btn { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; }

@media (max-width: 768px) {
    html, body { font-size: 14px; }
    .container { padding-left: 12px; padding-right: 12px; }
    .page-title { font-size: 24px; }
    .sidebar-shell { display: block; }
    .sidebar-panel { display: none; }
    .content-panel { width: 100%; }
    .table-responsive { border: 1px solid var(--border); border-radius: 10px; background: var(--surface); }
    .card, .modal-content { border-radius: 10px; }
    .d-grid .btn, .btn.w-100 { width: 100%; }
}

.btn.btn-3d-secondary,
.btn.btn-3d-outline,
.btn.btn-3d-danger,
.btn.btn-3d-primary {
    box-shadow: 0 1px 0 rgba(255,255,255,.78) inset, 0 1px 2px rgba(15, 23, 42, .08) !important;
}
.btn.btn-3d-outline,
.btn.btn-3d-secondary {
    background: linear-gradient(to bottom, #ffffff, #f8fafc) !important;
    border-color: #d1d5db !important;
    color: #374151 !important;
}
.btn.btn-3d-outline:hover,
.btn.btn-3d-secondary:hover {
    background: linear-gradient(to bottom, #ffffff, #eff6ff) !important;
    border-color: #cbd5e1 !important;
    color: #1d4ed8 !important;
}
.btn.btn-3d-danger {
    background: linear-gradient(to bottom, #d64545, #b91c1c) !important;
    border-color: #9f1f1f !important;
    color: #fff !important;
}
.btn.btn-3d-danger:hover {
    background: linear-gradient(to bottom, #e14c4c, #c62828) !important;
    color: #fff !important;
}
.btn.btn-3d-primary {
    background: linear-gradient(to bottom, #2f6df6, #255eea) !important;
    border-color: #2457d3 !important;
    color: #fff !important;
}

.booking-panel .table { table-layout: fixed; }
.booking-panel thead th { padding: 14px 12px; }
.booking-panel tbody tr { background: #fff; }
.booking-panel tbody tr + tr td { border-top-width: 10px; border-top-color: #f7f7f8; }
.booking-panel tbody td { padding: 16px 12px; vertical-align: top; }
.booking-panel .booking-name-cell { width: 16%; }
.booking-panel .booking-driver-cell { width: 28%; }
.booking-panel .booking-notes-cell { width: 18%; }
.booking-panel .booking-driver-box { min-height: 128px; }
.booking-panel .booking-detail-btn { border-radius: 999px; }
.booking-panel pre { white-space: pre-wrap; word-break: break-word; line-height: 1.45; }
.booking-panel .badge { padding: .45rem .6rem; }
.booking-panel .booking-driver-cell .fw-bold { line-height: 1.2; }
.booking-panel .booking-driver-cell .text-muted.fw-bold { letter-spacing: .01em; }
@media (max-width: 767.98px) {
    .booking-panel .table { table-layout: auto; }
}
.booking-panel {
    overflow: hidden;
}
.booking-panel table {
    border-collapse: separate;
    border-spacing: 0 12px;
}
.booking-panel thead th {
    border-bottom: 0;
    background: #f8fafc;
}
.booking-panel tbody tr {
    box-shadow: 0 1px 2px rgba(15,23,42,.04);
}
.booking-panel tbody tr td:first-child {
    border-top-left-radius: 14px;
    border-bottom-left-radius: 14px;
}
.booking-panel tbody tr td:last-child {
    border-top-right-radius: 14px;
    border-bottom-right-radius: 14px;
}
.booking-panel tbody td {
    background: #fff;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}
.booking-panel tbody td:first-child {
    border-left: 1px solid var(--border);
}
.booking-panel tbody td:last-child {
    border-right: 1px solid var(--border);
}
.booking-panel .booking-driver-cell {
    line-height: 1.35;
}
.booking-panel .booking-driver-cell > .mb-1.small > div {
    margin-bottom: 2px;
}
.booking-panel .booking-driver-box {
    background: #f8fafc !important;
}
/* Pro polish */
body {
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 14.5px;
    font-weight: 400;
    letter-spacing: 0;
    color: #111827;
}

h1, h2, h3, h4, h5, h6,
.page-title,
.navbar-brand,
.sidebar-brand,
.card-header,
.modal-title,
.table thead th {
    font-weight: 700;
    letter-spacing: -0.02em;
}

strong, .fw-bold { font-weight: 700 !important; }
.text-muted { color: #6b7280 !important; }
.badge { font-weight: 600; letter-spacing: .01em; }
.table thead th { text-transform: none; font-size: .92rem; }
.table td { font-size: .95rem; }
.card-body p, .card-body div, .card-body span { line-height: 1.5; }
.btn { font-weight: 600; }
.form-label { font-weight: 600; color: #374151; }

.homepage-booking-card .card-title {
    font-size: 1.03rem;
    letter-spacing: -0.02em;
}
.homepage-booking-card .badge,
.booking-panel .badge {
    font-size: .78rem;
}
.homepage-booking-card .text-muted,
.booking-panel .text-muted {
    font-size: .92rem;
}
.homepage-booking-card pre,
.booking-panel pre {
    font-size: .9rem !important;
    line-height: 1.45;
}

/* cleaner hierarchy */
.card {
    border: 1px solid rgba(229,231,235,.9);
}
.card-header {
    background: #f9fafb;
    color: #111827;
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-bg-type: #fafafa;
}
/* ============ DESIGN SYSTEM OVERRIDE ============ */
:root {
    --vh: 100vh;
}

body {
    background: #f4f6f9;
    color: #0f172a;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
}

h1,h2,h3,h4,h5,h6 { color: #0f172a; letter-spacing: -0.02em; }

.page-title { font-size: 26px; font-weight: 800; margin-bottom: 2px; letter-spacing: -0.03em; }
.page-subtitle { font-size: 13px; color: #64748b; margin-bottom: 0; }

/* --- shell: sidebar dark + workspace --- */
.sidebar-shell {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}
.sidebar-panel {
    width: 244px;
    background: #101623;
    border: none;
    border-radius: 14px;
    padding: 18px 12px;
    position: sticky;
    top: 20px;
    min-height: calc(100vh - 140px);
    color: #cbd5e1;
}
.sidebar-brand {
    font-weight: 800;
    font-size: 15px;
    letter-spacing: .02em;
    color: #ffffff;
    padding: 2px 12px 16px;
    margin-bottom: 10px;
    border-bottom: 1px solid rgba(255,255,255,.08);
    text-transform: uppercase;
}
.sidebar-nav .nav-link {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #94a3b8;
    border-radius: 9px;
    padding: 9px 12px;
    margin-bottom: 2px;
    font-size: 13.5px;
    font-weight: 500;
    transition: background .12s ease, color .12s ease;
}
.sidebar-nav .nav-link:hover { background: rgba(255,255,255,.06); color: #ffffff; }
.sidebar-nav .nav-link.active { background: #2563eb; color: #ffffff; font-weight: 600; }
.sidebar-nav .nav-link.text-danger { color: #f87171; }
.sidebar-nav .nav-link.text-danger:hover { background: rgba(248,113,113,.12); color: #fca5a5; }

/* --- topbar --- */
.navbar { background: #ffffff !important; border-bottom: 1px solid #e2e8f0; }
.navbar-brand { font-weight: 800; letter-spacing: -.02em; color: #0f172a; }

/* --- content panel --- */
.content-panel { flex: 1; min-width: 0; }

/* --- page header / toolbar --- */
.page-header { margin-bottom: 20px; }
.toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

/* --- cards / panels --- */
.card {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(15,23,42,.04) !important;
}
.card-header {
    background: #f8fafc;
    border-bottom: 1px solid #eef2f7;
    font-weight: 600;
    color: #334155;
    padding: 12px 16px;
}
.card-body { padding: 16px; }

/* --- data table --- */
.table { font-size: 13.5px; color: #1e293b; }
.table thead th {
    background: #f8fafc;
    color: #475569;
    font-weight: 600;
    font-size: 12.5px;
    text-transform: uppercase;
    letter-spacing: .04em;
    border-bottom: 1px solid #e2e8f0;
    padding: 10px 14px;
    white-space: nowrap;
}
.table td {
    padding: 11px 14px;
    border-color: #eef2f7;
    vertical-align: middle;
}
.table-hover tbody tr:hover { background: #f8fafc; }
.table-striped > tbody > tr:nth-of-type(odd) > * { --bs-table-bg-type: #fbfcfe; }

/* --- buttons: hierarchy --- */
.btn {
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    padding: 7px 14px;
    min-height: 34px;
    border-width: 1px;
    box-shadow: none !important;
    transform: none !important;
    transition: background .12s ease, border-color .12s ease, color .12s ease;
}
.btn-sm { font-size: 12.5px; padding: 4px 10px; min-height: 28px; border-radius: 7px; }
.btn-xs { font-size: 11.5px; padding: 2px 8px; min-height: 24px; border-radius: 6px; }

.btn-primary { background: #2563eb; border-color: #2563eb; color: #fff; }
.btn-primary:hover { background: #1d4ed8; border-color: #1d4ed8; }
.btn-outline-primary { color: #2563eb; border-color: #bfdbfe; background: #ffffff; }
.btn-outline-primary:hover { background: #eff6ff; border-color: #93c5fd; }
.btn-outline-secondary { color: #475569; border-color: #cbd5e1; background: #ffffff; }
.btn-outline-secondary:hover { background: #f1f5f9; color: #1e293b; }
.btn-warning { background: #f59e0b; border-color: #f59e0b; color: #fff; }
.btn-warning:hover { background: #d97706; border-color: #d97706; }
.btn-danger { background: #dc2626; border-color: #dc2626; color: #fff; }
.btn-danger:hover { background: #b91c1c; border-color: #b91c1c; }
.btn-success { background: #16a34a; border-color: #16a34a; color: #fff; }
.btn-success:hover { background: #15803d; border-color: #15803d; }

/* --- badges --- */
.badge { border-radius: 999px; font-weight: 600; font-size: 11.5px; padding: .4em .7em; }
.bg-success { background: #15803d !important; }
.bg-warning { background: #d97706 !important; }
.bg-danger { background: #dc2626 !important; }
.bg-secondary { background: #64748b !important; }
.bg-dark { background: #1e293b !important; }

/* --- forms --- */
.form-control, .form-select {
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    min-height: 38px;
    font-size: 13.5px;
    background: #ffffff;
    padding: 6px 12px;
    transition: border-color .12s ease, box-shadow .12s ease;
}
.form-control:focus, .form-select:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37,99,235,.10);
}
.form-label { font-size: 12.5px; font-weight: 600; color: #475569; margin-bottom: 5px; }
.form-text { font-size: 12px; color: #64748b; }

/* --- modal --- */
.modal-content { border: none; border-radius: 12px; box-shadow: 0 20px 50px rgba(15,23,42,.18) !important; }
.modal-header { border-bottom: 1px solid #eef2f7; padding: 14px 18px; }
.modal-header .modal-title { font-weight: 700; font-size: 16px; }
.modal-footer { border-top: 1px solid #eef2f7; padding: 12px 18px; }
.modal-body { padding: 18px; }

/* --- stat strip --- */
.stat-strip .card { border-left: 3px solid transparent; }
.stat-strip .card .h3 { font-weight: 800; letter-spacing: -.03em; margin: 2px 0 0; }
.stat-strip .card .text-muted { font-size: 12px; }

/* --- pagination --- */
.pagination { --bs-pagination-border-radius: 7px; --bs-pagination-active-bg: #2563eb; --bs-pagination-active-border-color: #2563eb; --bs-pagination-font-size: 12.5px; }
.page-link { padding: 5px 10px; color: #475569; border-color: #e2e8f0; font-weight: 500; }
.page-link:hover { background: #f1f5f9; color: #1d4ed8; }
.page-item.active .page-link { background: #2563eb; border-color: #2563eb; font-weight: 600; }
.page-item.disabled .page-link { color: #94a3b8; }

/* --- empty state --- */
.empty-state { padding: 48px 16px; text-align: center; }
.empty-state .empty-title { font-size: 15px; font-weight: 600; color: #334155; }
.empty-state .empty-desc { font-size: 13px; color: #94a3b8; margin-top: 4px; }

/* --- homepage --- */
.homepage-booking-card { border: 1px solid #e2e8f0; border-radius: 12px; }
.booking-panel .table { border-collapse: separate; border-spacing: 0 10px; }
.booking-panel tbody tr { background: #ffffff; box-shadow: 0 1px 2px rgba(15,23,42,.05); border-radius: 10px; }
.booking-panel tbody td { border-top: 1px solid #eef2f7; border-bottom: 1px solid #eef2f7; }
.booking-panel tbody td:first-child { border-left: 1px solid #eef2f7; border-radius: 10px 0 0 10px; }
.booking-panel tbody td:last-child { border-right: 1px solid #eef2f7; border-radius: 0 10px 10px 0; }
.booking-name-cell { font-weight: 700; font-size: 14px; }

/* --- misc --- */
pre { white-space: pre-wrap; word-break: break-word; }
a { text-decoration: none; }
.text-muted { color: #64748b !important; }
strong, .fw-bold { font-weight: 700 !important; }

@media (max-width: 767.98px) {
    body { font-size: 13.5px; }
    .card-body { padding: 14px; }
    .table { font-size: 13px; }
    .btn { padding: 6px 12px; min-height: 36px; }
    .form-control, .form-select { min-height: 40px; }
    .modal-dialog { margin: 10px; }
    .modal-body { max-height: 70vh; overflow-y: auto; }
}
/* --- Guest/customer name emphasis --- */
.guest-name,
.customer-name {
    font-weight: 700;
    font-size: 14px;
    color: #0f172a;
    letter-spacing: -0.01em;
}
a.guest-name, a.customer-name, .guest-name a, .customer-name a {
    color: #2563eb;
    text-decoration: none;
    font-weight: 700;
}
a.guest-name:hover, a.customer-name:hover, .guest-name a:hover, .customer-name a:hover {
    color: #1d4ed8;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.table .guest-name, .table .customer-name { white-space: nowrap; }

/* --- Action cell: keep quiet, avoid rainbow --- */
.table .action-cell .btn { margin: 2px; }
.table .action-cell { white-space: nowrap; }
.action-cell .btn-outline-primary,
.action-cell .btn-outline-secondary {
    background: #ffffff;
}

/* --- Receipt Preview Modal --- */
.receipt-modal-body {
    text-align: center;
    padding: 15px;
    background: #f8fafc;
}
.receipt-preview {
    max-width: 100%;
    max-height: 75vh;
    object-fit: contain;
    border-radius: 6px;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);
}


/* Driver portal — professional responsive navigation and mobile cards */
.driver-body{
    background:#f5f7fb;
    color:#172033;
    min-height:100vh;
}
.driver-shell{min-height:100vh;display:flex;align-items:stretch}
.driver-sidebar{
    width:248px;
    flex:0 0 248px;
    background:#111827;
    color:#cbd5e1;
    padding:18px 14px;
    flex-direction:column;
    position:sticky;
    top:0;
    height:100vh;
    border-right:1px solid rgba(255,255,255,.04);
}
.driver-sidebar-brand{
    display:flex;
    align-items:center;
    gap:11px;
    color:#fff;
    text-decoration:none;
    padding:4px 8px 20px;
    margin-bottom:12px;
    border-bottom:1px solid rgba(255,255,255,.08);
}
.driver-sidebar-logo,.driver-mobile-brand-mark{
    width:38px;
    height:38px;
    border-radius:10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:#fff;
    color:#111827;
    font-weight:800;
    letter-spacing:-.04em;
    flex:0 0 auto;
}
.driver-sidebar-brand strong{display:block;font-size:.98rem;line-height:1.2}
.driver-sidebar-brand small{display:block;color:#94a3b8;font-size:.72rem;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:155px}
.driver-nav{display:flex;flex-direction:column;gap:5px}
.driver-nav-link{
    display:flex;
    align-items:center;
    gap:11px;
    min-height:46px;
    padding:10px 12px;
    border-radius:9px;
    color:#cbd5e1;
    text-decoration:none;
    font-size:.94rem;
    font-weight:600;
    transition:background-color .15s ease,color .15s ease;
}
.driver-nav-icon{width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 20px}
.driver-nav-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.driver-nav-link:hover{color:#fff;background:rgba(255,255,255,.07)}
.driver-nav-link.active{color:#fff;background:#2563eb}
.driver-nav-logout{margin-top:12px;color:#fca5a5}
.driver-nav-logout:hover{color:#fff;background:rgba(220,38,38,.2)}
.driver-main{flex:1 1 auto;min-width:0}
.driver-content{width:min(100%,900px);margin:0 auto;padding:30px 24px 48px}
.driver-content>.h4{font-weight:750;letter-spacing:-.02em}
.driver-content .page-subtitle{color:#64748b}
.driver-content .card{border:1px solid #e5eaf1;border-radius:14px;box-shadow:0 4px 16px rgba(15,23,42,.04)}
.driver-content .homepage-booking-card{overflow:hidden}
.driver-content .homepage-booking-card .card-body{padding:20px}
.driver-trip-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:9px}
.driver-trip-actions-secondary{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:9px}
.driver-trip-actions .btn,.driver-trip-actions-secondary .btn{display:flex;align-items:center;justify-content:center;min-height:44px;white-space:normal;line-height:1.2}
.driver-mobile-bar{
    min-height:60px;
    background:rgba(255,255,255,.98);
    border-bottom:1px solid #e5e7eb;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:8px 14px;
    z-index:1030;
    box-shadow:0 1px 8px rgba(15,23,42,.04);
}
.driver-mobile-brand{display:flex;align-items:center;gap:9px;color:#111827;text-decoration:none;font-weight:800}
.driver-mobile-brand-mark{width:34px;height:34px;border:1px solid #e5e7eb;background:#111827;color:#fff;border-radius:9px;font-size:.82rem}
.driver-mobile-brand-text{font-size:.98rem}
.driver-menu-btn{width:42px;height:42px;border:1px solid #dbe1e8;border-radius:10px;background:#fff;padding:10px;display:flex;flex-direction:column;justify-content:center;gap:4px}
.driver-menu-btn span{height:2px;width:100%;background:#1f2937;border-radius:99px;display:block}
.driver-offcanvas{width:min(86vw,310px)!important;background:#111827;color:#fff}
.driver-offcanvas .offcanvas-header{border-bottom:1px solid rgba(255,255,255,.08);padding:18px}
.driver-offcanvas .offcanvas-body{padding:14px}
.driver-offcanvas .btn-close{filter:invert(1);opacity:.8}
.driver-drawer-kicker{font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:#94a3b8;margin-bottom:2px}
.driver-offcanvas .driver-nav-link{color:#cbd5e1}
.driver-offcanvas .driver-nav-link.active{color:#fff}

@media(max-width:767.98px){
    .driver-shell{min-height:calc(100vh - 60px);display:block}
    .driver-content{width:100%;padding:18px 12px calc(32px + env(safe-area-inset-bottom))}
    .driver-content>.h4{font-size:1.2rem;margin-top:2px}
    .driver-content .page-subtitle{font-size:.9rem;margin-bottom:18px!important}
    .driver-content .card{border-radius:12px;box-shadow:0 2px 10px rgba(15,23,42,.04)}
    .driver-content .homepage-booking-card .card-body,.driver-content .card-body{padding:15px}
    .driver-content .badge{max-width:100%;white-space:normal;text-align:left;line-height:1.25}
    .driver-content .guest-name{font-size:1.02rem;line-height:1.3;white-space:normal}
    .driver-content .btn{min-height:44px;font-size:.91rem}
    .driver-trip-actions-secondary{grid-template-columns:1fr}
    .driver-content .modal-dialog{margin:10px;max-width:calc(100% - 20px)}
    .driver-content .modal-footer{gap:8px}
    .driver-content .modal-footer .btn{margin:0;min-width:0}
    .driver-content input,.driver-content select,.driver-content textarea{font-size:16px}
    .driver-content .list-group-item{padding:14px 12px}
}

@media(max-width:380px){
    .driver-mobile-brand-text{font-size:.9rem}
    .driver-content{padding-left:10px;padding-right:10px}
    .driver-content .homepage-booking-card .card-body{padding:13px}
}
.driver-page-heading{padding-bottom:2px}
.driver-content .list-group{border-radius:12px;overflow:hidden;box-shadow:0 2px 10px rgba(15,23,42,.03)}
.driver-content .list-group-item{border-color:#e5eaf1}

/* 24-hour time picker: consistent on desktop and mobile, no AM/PM native UI */
.time-picker-24h{display:grid;grid-template-columns:minmax(88px,1fr) auto minmax(88px,1fr);align-items:center;gap:8px;max-width:300px}
.time-picker-24h .form-select{min-height:42px;font-variant-numeric:tabular-nums}
.time-picker-separator{font-size:20px;font-weight:700;color:#64748b}
@media(max-width:575.98px){.time-picker-24h{max-width:none;width:100%;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}}