:root {
    --primary: #1769aa;
    --primary-dark: #104f83;
    --success: #198754;
    --warning: #d99500;
    --danger: #c83d4b;
    --info: #2878b8;
    --gray-100: #f6f8fb;
    --gray-200: #e8edf3;
    --gray-300: #d5dde7;
    --gray-500: #718096;
    --gray-700: #3f4b5b;
    --gray-900: #1e2936;
    --surface: #ffffff;
    --background: #f3f6fa;
    --border: #dce3eb;
    --radius: 12px;
    --shadow: 0 8px 24px rgba(25, 45, 70, .07);
    --font-stack: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    --space-1: .25rem;
    --space-2: .5rem;
    --space-3: .75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --sidebar-width: 260px;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }
body { margin: 0; color: var(--gray-900); background: var(--background); font-family: var(--font-stack); }
a { color: var(--primary); }
.text-primary { color: var(--primary) !important; }
.bg-primary { background-color: var(--primary) !important; }
.btn-primary { --bs-btn-bg: var(--primary); --bs-btn-border-color: var(--primary); --bs-btn-hover-bg: var(--primary-dark); --bs-btn-hover-border-color: var(--primary-dark); }
.btn-success { --bs-btn-bg: var(--success); --bs-btn-border-color: var(--success); }
.btn, .form-control, .form-select { min-height: 42px; border-radius: 9px; }
.form-control:focus, .form-select:focus { border-color: #8bb7dc; box-shadow: 0 0 0 .2rem rgba(23, 105, 170, .14); }
.btn-icon { width: 36px; min-width: 36px; min-height: 36px; display: inline-grid; place-items: center; padding: 0; }

/* Shared application shell */
.wrapper { display: flex; min-height: 100vh; }
.sidebar {
    position: sticky; top: 0; z-index: 1020; width: var(--sidebar-width); height: 100vh;
    flex: 0 0 var(--sidebar-width); display: flex; flex-direction: column;
    padding: var(--space-5) var(--space-3); color: #fff;
    background: linear-gradient(165deg, var(--primary), var(--primary-dark));
    box-shadow: 4px 0 18px rgba(26, 55, 88, .12);
}
.sidebar-brand, .sidebar .brand-title {
    display: flex; align-items: center; gap: var(--space-3); padding: var(--space-2) var(--space-3);
    margin: 0 0 var(--space-5); color: #fff; font-size: 1.08rem; font-weight: 750;
    line-height: 1.25; text-decoration: none;
}
.sidebar-brand .brand-mark, .brand-mark {
    width: 42px; height: 42px; flex: 0 0 42px; display: inline-grid; place-items: center;
    border: 1px solid rgba(255,255,255,.35); border-radius: 13px;
    background: rgba(255,255,255,.15); color: #fff; font-size: 1.15rem;
}
.sidebar-nav, .sidebar .nav { display: flex; flex-direction: column; gap: var(--space-2); padding: 0; margin: 0; }
.sidebar-nav .nav-link, .sidebar .nav-link {
    display: flex; align-items: center; gap: var(--space-3); padding: .72rem .85rem;
    border-radius: 9px; color: rgba(255,255,255,.88); font-weight: 600;
    text-decoration: none; transition: background .15s ease, color .15s ease;
}
.sidebar-nav .nav-link:hover, .sidebar-nav .nav-link.active,
.sidebar .nav-link:hover, .sidebar .nav-link.active { color: #fff; background: rgba(255,255,255,.17); }
.sidebar .nav-link i, .sidebar-nav .nav-link i { width: 1.15rem; text-align: center; }
.btn-logout {
    display: block; margin-top: auto; padding: .7rem 1rem; border: 1px solid rgba(255,255,255,.55);
    border-radius: 9px; background: #fff; color: var(--primary); font-weight: 700;
    text-align: center; text-decoration: none;
}
.main-panel { min-width: 0; flex: 1; display: flex; flex-direction: column; overflow: auto; }
.content-body, .main-content { min-width: 0; flex: 1; padding: var(--space-6); }
.mobile-topbar { display: none; }
.page-header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); margin-bottom: var(--space-5); }
.page-header h1, .page-header h2, .page-header h3, .page-header h4 { margin: 0 0 .2rem; font-size: 1.45rem; font-weight: 750; }
.page-header p { margin: 0; color: var(--gray-500); font-size: .9rem; }
.page-header-actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-2); }
.tab-content-section { display: none; }
.tab-content-section.active-tab { display: block; }
.view-section { display: none; }
.view-section.active { display: block; }
body.terminal-mode { min-height: 100vh; background: var(--gray-100); }
body.terminal-mode .mobile-topbar, body.terminal-mode .sidebar { display: none; }
body.terminal-mode .wrapper { display: block; min-height: 100vh; }
body.terminal-mode .main-panel { display: block; min-height: 100vh; overflow: visible; }
body.terminal-mode .content-body, body.terminal-mode .main-content { min-height: 100vh; padding: 1.25rem 1.5rem; }
body.terminal-mode #historyView { display: none !important; }
body.terminal-mode #terminalView { display: block; }
body.terminal-mode #terminalView .page-header { padding-bottom: 1rem; border-bottom: 1px solid var(--border); }

/* Shared surfaces, metrics and tables */
.metric-card, .panel-box, .util-card, .shared-card {
    border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow);
}
.metric-card { display: flex; align-items: center; gap: var(--space-3); height: 100%; min-height: 116px; padding: 1rem 1.1rem; border-left: 4px solid var(--primary); }
.metric-card.green-border { border-left-color: var(--success); }
.metric-card.warning-border { border-left-color: var(--warning); }
.metric-card.red-border { border-left-color: var(--info); }
.metric-icon { width: 42px; height: 42px; flex: 0 0 42px; display: grid; place-items: center; border-radius: 12px; background: #eaf3fb; color: var(--primary); font-size: 1.05rem; }
.metric-copy { min-width: 0; }
.metric-card .card-title-text { margin: 0 0 .25rem; color: var(--gray-500); font-size: .78rem; font-weight: 700; }
.metric-card .metric-val { color: var(--gray-900); font-size: 1.75rem; font-weight: 800; line-height: 1.15; }
.metric-card .metric-subtext { margin-top: .2rem; color: var(--gray-500); font-size: .72rem; }
.panel-box { padding: 1.2rem; }
.util-card { height: 100%; padding: 1.2rem; transition: transform .16s ease, box-shadow .16s ease; }
.util-card:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(25,45,70,.11); }
.util-progress { height: 9px; overflow: hidden; border-radius: 9px; background: var(--gray-200); }
.util-progress .progress-bar { height: 100%; border-radius: inherit; }
.summary-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3); margin-bottom: var(--space-4); }
.summary-item { padding: .85rem 1rem; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); }
.summary-item span { display: block; color: var(--gray-500); font-size: .78rem; }
.summary-item strong { display: block; margin-top: .15rem; font-size: 1.35rem; }
.driver-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3); }
.metric-card .metric-latest { width: fit-content; max-width: 100%; padding: .12rem .45rem; border-radius: 6px; font-size: .85rem; line-height: 1.5; white-space: nowrap; }
.history-filter { gap: var(--space-2); }
.history-filter select { width: 180px; }
#trendFilters .trend-filter-button { border-width: 1px; border-style: solid; font-weight: 650; }
#trendFilters [data-filter="all"] { color: var(--primary); border-color: var(--primary); }
#trendFilters [data-filter="ongoing"] { color: var(--success); border-color: var(--success); }
#trendFilters [data-filter="outgoing"] { color: var(--danger); border-color: var(--danger); }
#trendFilters [data-filter="all"].is-selected { color: #fff !important; background: var(--primary) !important; border-color: var(--primary) !important; }
#trendFilters [data-filter="ongoing"].is-selected { color: #fff !important; background: var(--success) !important; border-color: var(--success) !important; }
#trendFilters [data-filter="outgoing"].is-selected { color: #fff !important; background: var(--danger) !important; border-color: var(--danger) !important; }
#trendFilters .trend-filter-button:focus-visible { box-shadow: 0 0 0 .2rem rgba(23, 105, 170, .2); }
.table-responsive { border-radius: 9px; }
.table { --bs-table-bg: transparent; margin-bottom: 0; }
.table thead th { position: sticky; top: 0; z-index: 2; padding: .68rem .8rem; border-bottom: 1px solid var(--border); background: #edf3f8; color: #354b60; font-size: .8rem; font-weight: 700; white-space: nowrap; }
.table tbody td { padding: .58rem .8rem; border-color: #edf0f4; vertical-align: middle; }
.table tbody tr:nth-child(even) { background: #f8fafc; }
.table-zebra tbody tr:nth-child(even) { background: #f6f9fc; }
.table-scroll { max-height: 420px; overflow: auto; border: 1px solid var(--border); border-radius: 9px; }
.badge { font-weight: 650; }
.badge-status-in { background: #e5f4ec !important; color: #176b40 !important; }
.badge-status-out { background: #e5f0fb !important; color: #185d99 !important; }
.badge-status-auto { background: #edf0f3 !important; color: #596575 !important; }
.empty-state, .loading-state { padding: 2rem 1rem; color: var(--gray-500); text-align: center; }
.empty-state i, .loading-state i { display: block; margin-bottom: .55rem; color: #91a1b2; font-size: 1.4rem; }
.toast-container { z-index: 1100; }
.alert-inline { margin-bottom: 1rem; }
.login-page { background: #fff; }
.split-screen { display: flex; min-height: 100vh; }
.left-pane { flex: 1.1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; color: #fff; text-align: center; background: linear-gradient(145deg, #2479b8, #124d80); }
.right-pane { flex: .9; display: flex; align-items: center; justify-content: center; padding: 2.5rem; background: var(--gray-100); }
.form-box { width: 100%; max-width: 430px; padding: 2rem; border: 1px solid var(--border); border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
.password-toggle { min-width: 46px; color: var(--gray-600, #526273) !important; background: #f5f7f9 !important; border-color: var(--border) !important; }
.password-toggle:hover, .password-toggle:focus-visible { color: var(--primary) !important; background: #eaf3fb !important; border-color: var(--primary) !important; }
.form-container { display: none; }
.form-container.active { display: block; }
.logo-mark { width: 74px; height: 74px; display: inline-grid; place-items: center; border: 1px solid rgba(255,255,255,.35); border-radius: 22px; background: rgba(255,255,255,.15); font-size: 2rem; }
.scan-feedback { padding: 1.15rem; border: 1px solid; border-radius: 12px; font-size: 1rem; font-weight: 650; }
.scan-feedback.success { border-color: #a8d8bc; background: #e7f5ec; color: #176b40; }
.scan-feedback.error { border-color: #e6b8bd; background: #fff0f1; color: #a92f3d; }

/* SCANNER TERMINAL INPUT STYLING */
#barcodeInput,
#barcodeInput[readonly] {
    background-color: #ffffff !important;
    color: #212529 !important;
    cursor: default;
    caret-color: transparent !important;
    user-select: none;
    -webkit-user-select: none;
    font-weight: 500;
    letter-spacing: 0.05em;
}

#barcodeInput:focus,
#barcodeInput[readonly]:focus {
    background-color: #ffffff !important;
    border-color: #1a73e8 !important;
    box-shadow: 0 0 0 0.25rem rgba(26, 115, 232, 0.15) !important;
    outline: none;
}

/* BIG RFID TAP NOTIFICATION CARD */
.tap-notification-card {
    width: 100%;
    margin-top: 1.25rem;
    padding: 2.25rem 2rem 2.75rem;
    border-radius: 18px;
    border: 3.5px solid transparent;
    text-align: center;
    position: relative;
    overflow: hidden;
    animation: tapPopIn 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

@keyframes tapPopIn {
    from {
        opacity: 0;
        transform: scale(0.92) translateY(10px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.tap-notification-card.tap-success {
    background: linear-gradient(180deg, #f0fdf4 0%, #ffffff 100%);
    border-color: #198754;
    box-shadow: 0 20px 50px rgba(25, 135, 84, 0.22);
}

.tap-notification-card.tap-error {
    background: linear-gradient(180deg, #fef2f2 0%, #ffffff 100%);
    border-color: #dc3545;
    box-shadow: 0 20px 50px rgba(220, 53, 69, 0.22);
}

.tap-icon-wrap {
    width: 76px;
    height: 76px;
    margin: 0 auto 1.2rem;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 2.75rem;
}

.tap-success .tap-icon-wrap {
    background: #e1f7e8;
    color: #198754;
    border: 2px solid #a3e3b7;
}

.tap-error .tap-icon-wrap {
    background: #fde8e8;
    color: #dc3545;
    border: 2px solid #f8b4b4;
}

.tap-status-badge {
    display: inline-block;
    padding: 0.55rem 1.6rem;
    border-radius: 50px;
    font-size: 1.35rem;
    font-weight: 850;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 1rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.tap-status-badge.badge-ongoing {
    background: #198754;
    color: #ffffff;
}

.tap-status-badge.badge-outgoing {
    background: #0d6efd;
    color: #ffffff;
}

.tap-status-badge.badge-failed {
    background: #dc3545;
    color: #ffffff;
}

.tap-passenger-label {
    font-size: 0.85rem;
    font-weight: 750;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gray-500);
    margin-bottom: 0.25rem;
}

.tap-passenger-name {
    font-size: 2.35rem;
    font-weight: 850;
    color: var(--gray-900);
    line-height: 1.2;
    margin-bottom: 1.5rem;
    word-break: break-word;
}

.tap-details-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 14px;
    padding: 1.25rem;
    margin-top: 1rem;
}

.tap-detail-item {
    text-align: left;
    display: flex;
    flex-direction: column;
}

.tap-detail-label {
    font-size: 0.78rem;
    font-weight: 750;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--gray-500);
    margin-bottom: 0.2rem;
}

.tap-detail-val {
    font-size: 1.25rem;
    font-weight: 750;
    color: var(--gray-900);
    line-height: 1.25;
    word-break: break-word;
}

.tap-progress-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 6px;
    background: rgba(0, 0, 0, 0.08);
}

.tap-progress-fill {
    height: 100%;
    width: 100%;
    transform-origin: left;
    animation: tapCountdown 5s linear forwards;
}

.tap-success .tap-progress-fill {
    background: #198754;
}

.tap-error .tap-progress-fill {
    background: #dc3545;
}

@keyframes tapCountdown {
    from { transform: scaleX(1); }
    to { transform: scaleX(0); }
}

/* FLOATING BANNER NOTIFICATION (Active across all driver tabs) */
.driver-floating-tap-banner {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1090;
    width: min(650px, 92vw);
    padding: 1.25rem 1.6rem;
    border-radius: 16px;
    box-shadow: 0 16px 40px rgba(0,0,0,0.22);
    display: flex;
    align-items: center;
    gap: 1.25rem;
    animation: slideDownToast 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

@keyframes slideDownToast {
    from {
        opacity: 0;
        transform: translate(-50%, -25px);
    }
    to {
        opacity: 1;
        transform: translate(-50%, 0);
    }
}

.driver-floating-tap-banner.tap-success {
    background: #ffffff;
    border: 3px solid #198754;
    color: #14532d;
}

.driver-floating-tap-banner.tap-error {
    background: #ffffff;
    border: 3px solid #dc3545;
    color: #7f1d1d;
}

.driver-floating-tap-banner .banner-icon {
    font-size: 2.2rem;
    flex-shrink: 0;
}

.driver-floating-tap-banner .banner-content {
    flex: 1;
    min-width: 0;
}

.driver-floating-tap-banner .banner-title {
    font-size: 1.35rem;
    font-weight: 850;
    margin: 0 0 0.2rem;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.driver-floating-tap-banner .banner-meta {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--gray-700);
}

@media (max-width: 767.98px) {
    .tap-notification-card {
        padding: 1.5rem 1.15rem 2rem;
    }
    .tap-passenger-name {
        font-size: 1.65rem;
        margin-bottom: 1rem;
    }
    .tap-status-badge {
        font-size: 1.1rem;
        padding: 0.45rem 1.1rem;
    }
    .tap-icon-wrap {
        width: 60px;
        height: 60px;
        font-size: 2.2rem;
        margin-bottom: 0.9rem;
    }
    .tap-details-grid {
        grid-template-columns: 1fr;
        gap: 0.75rem;
        padding: 1rem;
    }
    .tap-detail-val {
        font-size: 1.1rem;
    }
    .driver-floating-tap-banner {
        padding: 1rem;
        gap: 0.9rem;
    }
    .driver-floating-tap-banner .banner-title {
        font-size: 1.15rem;
    }
    .driver-floating-tap-banner .banner-icon {
        font-size: 1.8rem;
    }
}
.scan-feedback.success { border-color: #a8d8bc; background: #e7f5ec; color: #176b40; }
.scan-feedback.error { border-color: #e6b8bd; background: #fff0f1; color: #a92f3d; }
.report-header { display: none; }
.signature-block { display: none; }
.chart-empty {
    position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: .55rem; color: var(--gray-500);
    background: rgba(255,255,255,.88); font-size: .9rem; font-weight: 650;
}
.chart-empty i { color: #a7b4c2; font-size: 1.5rem; }

@media (max-width: 991.98px) {
    .wrapper { display: block; }
    .mobile-topbar { position: sticky; top: 0; z-index: 1030; display: flex; align-items: center; justify-content: space-between; padding: .65rem 1rem; background: var(--primary); color: white; box-shadow: 0 3px 12px rgba(20,45,70,.18); }
    .mobile-topbar .btn { min-height: 38px; color: white; border-color: rgba(255,255,255,.5); }
    .sidebar { position: fixed; top: 0; left: 0; z-index: 1040; width: min(300px, 86vw); height: 100dvh; transform: translateX(-105%); transition: transform .2s ease; }
    .sidebar.is-open { transform: translateX(0); }
    .content-body, .main-content { padding: 1.15rem; }
}
@media (max-width: 767.98px) {
    .split-screen { min-height: 100vh; flex-direction: column; }
    .left-pane { min-height: 265px; flex: 0 0 auto; padding: 1.6rem 1.2rem; }
    .left-pane .logo-mark { width: 56px; height: 56px; border-radius: 16px; font-size: 1.5rem; }
    .right-pane { flex: 1; padding: 1.2rem; }
    .form-box { padding: 1.35rem; }
    .page-header { align-items: flex-start; flex-direction: column; }
    .summary-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .driver-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .history-filter { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto; }
    .history-filter label { display: none; }
    .history-filter select { width: 100%; min-width: 0; }
    .history-filter .btn { white-space: nowrap; }
    #recordsTable { width: 100%; table-layout: fixed; }
    #recordsTable th, #recordsTable td { padding: .48rem .35rem !important; font-size: .68rem; white-space: normal; overflow-wrap: anywhere; }
    #recordsTable th:nth-child(1), #recordsTable td:nth-child(1) { width: 12%; }
    #recordsTable th:nth-child(2), #recordsTable td:nth-child(2) { width: 22%; }
    #recordsTable th:nth-child(3), #recordsTable td:nth-child(3) { width: 23%; }
    #recordsTable th:nth-child(4), #recordsTable td:nth-child(4) { width: 18%; }
    #recordsTable th:nth-child(5), #recordsTable td:nth-child(5) { width: 25%; }
}

@page { size: A4 landscape; margin: 12mm; }
@page driver-history { size: A4 portrait; margin: 12mm; }
@media print {
    * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
    html, body { height: auto !important; min-height: 0 !important; overflow: visible !important; background: #fff !important; color: #222 !important; }
    body { font-size: 10pt; }
    .wrapper, .main-panel, .content-body, .main-content, .container-fluid { display: block !important; height: auto !important; min-height: 0 !important; overflow: visible !important; margin: 0 !important; padding: 0 !important; }
    .mobile-topbar, .sidebar, .btn-logout, button, .btn, input, select, .modal, .toast-container, .no-print, #trendFilters, #employeeSearch, .evaluation-actions, .employee-actions, .history-filter { display: none !important; }
    body.printing .tab-content-section:not(.print-active), body.print-native .tab-content-section:not(.active-tab),
    body.printing .view-section:not(.print-active), body.print-native .view-section:not(.active) { display: none !important; }
    body.printing .print-active, body.print-native .active-tab { display: block !important; position: static !important; width: auto !important; }
    body.printing .view-section.print-active { display: block !important; }
    body.printing .page-header, body.print-native .active-tab .page-header, body.print-native .view-section.active .page-header { display: none !important; }
    body.printing .report-header, body.print-native .active-tab .report-header, body.print-native .view-section.active .report-header { display: block !important; margin: 0 0 6mm; padding: 0 0 3mm; border-bottom: 2px solid #cfd5dc; }
    .report-header h2 { margin: 0 0 1.5mm; color: #202a34; font-size: 16pt; }
    .report-header p { margin: 0; color: #555; font-size: 9pt; }
    .metric-card, .panel-box, .util-card, .shared-card, .summary-item { border: 1px solid #d3d8de !important; border-radius: 0 !important; background: #fff !important; box-shadow: none !important; color: #222 !important; }
    .panel-box { padding: 3mm !important; }
    .metric-card { min-height: 0 !important; padding: 3mm !important; break-inside: avoid; page-break-inside: avoid; }
    .metric-card .metric-val { font-size: 17pt !important; }
    .metric-card .card-title-text, .metric-card .metric-subtext { color: #444 !important; }
    .metric-icon { display: none !important; }
    .table-scroll, .table-responsive { max-height: none !important; overflow: visible !important; border: 0 !important; }
    table { width: 100% !important; border-collapse: collapse !important; font-size: 9pt !important; }
    thead { display: table-header-group !important; }
    tfoot { display: table-footer-group; }
    tr { break-inside: avoid; page-break-inside: avoid; }
    th, td { padding: 1.5mm 2mm !important; border: 1px solid #d7dce2 !important; color: #222 !important; }
    .table thead th { position: static !important; background: #edf1f4 !important; color: #222 !important; }
    .badge { border: 1px solid currentColor; }
    .chart-block, .metric-card, .summary-item, h1, h2, h3, h4, h5 { break-inside: avoid; page-break-inside: avoid; }
    #tab-overview > .kpi-grid { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 3mm !important; margin: 0 0 4mm !important; }
    #tab-overview > .charts-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 4mm !important; margin: 0 0 4mm !important; }
    #tab-overview > .row > [class*="col-"] { width: auto !important; max-width: none !important; padding: 0 !important; }
    #tab-overview .panel-box { height: auto !important; }
    #tab-overview .chart-block { break-inside: avoid; page-break-inside: avoid; }
    #tab-overview .chart-area { height: 65mm !important; }
    #tab-overview .chart-area img { display: block; width: auto !important; max-width: 100% !important; height: auto !important; max-height: 65mm; margin: 0 auto; object-fit: contain; }
    #attendanceTrendsPanel { break-inside: auto !important; page-break-inside: auto !important; }
    #attendanceTrendsPanel > h5 { break-after: avoid-page !important; page-break-after: avoid !important; margin-bottom: 2mm !important; }
    #attendanceTrendsPanel .table-scroll { break-before: avoid-page !important; page-break-before: avoid !important; }
    #attendanceTrendsPanel table { break-before: avoid-page !important; page-break-before: avoid !important; }
    #tab-evaluation > .panel-box { padding: 0 !important; border: 0 !important; background: transparent !important; }
    #tab-evaluation .report-header, #tab-evaluation #evaluationSummary { break-inside: avoid; page-break-inside: avoid; }
    #tab-evaluation .table-responsive { break-before: avoid-page; page-break-before: avoid; }
    #tab-utilization .summary-strip { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
    .driver-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 3mm !important; margin-bottom: 4mm !important; }
    #tab-utilization #shuttleUtilizationCards { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 4mm !important; margin: 0 !important; }
    #tab-utilization #shuttleUtilizationCards > [class*="col-"] { width: auto !important; padding: 0 !important; }
    #tab-utilization .util-card { break-inside: avoid; page-break-inside: avoid; }
    #employeeRecordsTable th:last-child, #employeeRecordsTable td:last-child { display: none !important; }
    .signature-block { display: flex !important; justify-content: space-between; gap: 25mm; margin-top: 18mm; break-inside: avoid; page-break-inside: avoid; }
    .signature-item { width: 45%; color: #333; text-align: center; }
    .signature-line { height: 12mm; border-bottom: 1px solid #555; }
    .signature-label, .signature-date { margin: 2mm 0 0; font-size: 9pt; }
    body.page-driver { page: driver-history; }
    body.page-driver .main-content { padding: 0 !important; }
    body.page-driver #recordsTable { table-layout: auto !important; }
    body.page-driver #recordsTable th, body.page-driver #recordsTable td { font-size: 9pt !important; white-space: normal !important; }
    body.page-driver #terminalView { display: none !important; }
    body.page-driver #historyView, body.page-driver #historyView.print-active { display: block !important; }
    body.page-driver #historyView .report-header { display: block !important; }
    body.page-driver #historyView .page-header { display: none !important; }
    .page-number-fallback { display: block; margin-top: 5mm; color: #666; text-align: right; font-size: 8pt; }
}
@supports (page: driver-history) {
    .page-number-fallback { display: none; }
}
@page {
    @bottom-right { content: "Page " counter(page) " of " counter(pages); font: 8pt Arial, sans-serif; color: #666; }
}
