:root {
    --sidebar-link: #495057;
}

body {
    background: #f6f8fb;
    color: #1f2937;
}

.navbar-brand {
    letter-spacing: .2px;
}

.sidebar .nav-link,
.offcanvas .nav-link {
    color: var(--sidebar-link);
    padding: .7rem .8rem;
}

.sidebar .nav-link:hover,
.offcanvas .nav-link:hover {
    background: #f1f3f5;
}

.sidebar .nav-link.active,
.offcanvas .nav-link.active {
    background: #212529;
    color: #fff;
}

.stat-card {
    border: 0;
    box-shadow: 0 .25rem 1rem rgba(15,23,42,.06);
}

.table-card {
    border: 0;
    box-shadow: 0 .25rem 1rem rgba(15,23,42,.05);
}

.page-title {
    font-weight: 700;
    letter-spacing: -.4px;
}

.badge-soft-success { background: #dcfce7; color: #166534; }
.badge-soft-primary { background: #e8f1ff; color: #0d5bc7; }
.badge-soft-warning { background: #fef3c7; color: #92400e; }
.badge-soft-secondary { background: #e5e7eb; color: #374151; }
.badge-soft-danger { background: #fee2e2; color: #991b1b; }

.chart-wrap{position:relative;min-height:310px;height:310px}
.chart-wrap-wide{height:330px}
@media(max-width:767.98px){
  .chart-wrap,.chart-wrap-wide{min-height:260px;height:260px}
}

.report-chart{height:320px;min-height:320px}.report-vehicle-chart{height:360px;min-height:360px}@media(max-width:767.98px){.report-chart,.report-vehicle-chart{height:270px;min-height:270px}}

/* BRO TRANS Logistics branding */
.app-brand-logo{width:46px;height:46px;object-fit:contain;border-radius:10px}
.sidebar-logo-wrap{padding:.25rem .5rem .75rem;border-bottom:1px solid #eef1f4}
.sidebar-logo{display:block;width:min(150px,100%);max-height:132px;object-fit:contain;margin:0 auto;border-radius:14px}
.login-logo{width:180px;max-width:70%;height:auto;object-fit:contain;border-radius:16px}
.login-brand-title{color:#0d4fc4;font-weight:800;letter-spacing:.01em}
@media(max-width:575.98px){.app-brand-logo{width:40px;height:40px}.navbar-brand span{font-size:.95rem}}

/* Global sortable tables */
.sortable-th{
    cursor:pointer;
    user-select:none;
    white-space:nowrap;
}
.sortable-th:hover{
    background-color:rgba(0,0,0,.035);
}
.sortable-th:focus{
    outline:2px solid currentColor;
    outline-offset:-2px;
}
.sort-indicator{
    display:inline-block;
    min-width:1em;
    opacity:.6;
    font-size:.85em;
}

/* ===== BRO TRANS header refresh ===== */
:root {
    --bro-blue: #0d4fc4;
    --bro-blue-dark: #0a3f9f;
    --bro-blue-soft: #eef4ff;
}

body {
    background: #f8fafc;
}

.app-navbar {
    min-height: 108px;
    padding: .5rem 0;
    box-shadow: 0 1px 0 rgba(15, 23, 42, .03);
}

.app-navbar-grid {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 1rem;
}

.app-navbar-left {
    justify-self: start;
}

.app-navbar-right {
    justify-self: end;
}

.app-header-logo-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
    transform: translateX(20px);
}

.app-brand-logo {
    width: 86px;
    height: 86px;
    object-fit: contain;
    border-radius: 0;
    background: transparent;
}

.app-header-title {
    justify-self: center;
    display: flex;
    align-items: center;
    gap: 1.35rem;
    color: var(--bro-blue);
    white-space: nowrap;
}

.app-header-title:hover,
.app-header-title:focus {
    color: var(--bro-blue-dark);
}

.app-header-title-text {
    font-size: clamp(2rem, 3.25vw, 3.45rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: .02em;
}

.app-header-rule {
    display: block;
    width: clamp(56px, 9vw, 145px);
    height: 2px;
    background: linear-gradient(90deg, transparent 0%, var(--bro-blue) 20%, var(--bro-blue) 100%);
    position: relative;
}

.app-header-rule:first-child {
    background: linear-gradient(90deg, var(--bro-blue) 0%, var(--bro-blue) 80%, transparent 100%);
}

.app-header-rule::after {
    content: '';
    position: absolute;
    top: 50%;
    right: -1px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--bro-blue);
    transform: translateY(-50%);
}

.app-header-rule:first-child::after {
    right: auto;
    left: -1px;
}

.sidebar {
    padding-top: 1.35rem !important;
}

.sidebar .nav-link,
.offcanvas .nav-link {
    color: #334155;
    padding: .78rem .9rem;
    font-weight: 500;
    transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
}

.sidebar .nav-link:hover,
.offcanvas .nav-link:hover {
    background: var(--bro-blue-soft);
    color: var(--bro-blue-dark);
}

.sidebar .nav-link.active,
.offcanvas .nav-link.active {
    background: linear-gradient(135deg, #0d4fc4, #0757df);
    color: #fff;
    box-shadow: 0 .3rem .8rem rgba(13, 79, 196, .18);
}

.stat-card,
.table-card {
    border-radius: 14px;
}

@media (max-width: 991.98px) {
    .app-navbar {
        min-height: 76px;
    }

    .app-navbar-grid {
        grid-template-columns: auto 1fr auto;
        gap: .65rem;
    }

    .app-brand-logo {
        width: 54px;
        height: 54px;
    }

    .app-header-title {
        gap: .5rem;
    }

    .app-header-title-text {
        font-size: clamp(1.25rem, 4vw, 2rem);
    }

    .app-header-rule {
        display: none;
    }
}

/* ===== Premium multi-entry forms: Deposits and Expenses ===== */
.premium-form-page {
    --form-blue: #0757df;
    --form-blue-dark: #0646b6;
    --form-navy: #15243b;
    --form-muted: #6b778a;
    --form-border: #e2e8f1;
    --form-surface: #f7f9fc;
}

.premium-form-page .form-label,
.premium-form-heading .form-label {
    margin-bottom: .42rem;
    color: #344258;
    font-size: .86rem;
    font-weight: 700;
}

.premium-form-page .form-control,
.premium-form-page .form-select {
    min-height: 46px;
    border-color: #d9e1ec;
    border-radius: 10px;
    color: #1d2a3f;
    background-color: #fff;
}

.premium-form-page .form-control:focus,
.premium-form-page .form-select:focus {
    border-color: #6d9ef2;
    box-shadow: 0 0 0 4px rgba(7,87,223,.1);
}

.premium-form-page .input-group-text {
    border-color: #d9e1ec;
    color: #42516a;
    background: #f7f9fc;
}

.premium-back-btn {
    border-color: #cfd8e5;
    border-radius: 10px;
}

.premium-primary-btn {
    min-height: 44px;
    padding-right: 1.15rem;
    padding-left: 1.15rem;
    border: 1px solid #0757df;
    border-radius: 10px;
    color: #fff;
    background: #0757df;
    box-shadow: 0 8px 18px rgba(7,87,223,.18);
    font-weight: 700;
}

.premium-primary-btn:hover,
.premium-primary-btn:focus-visible {
    color: #fff;
    border-color: #0646b6;
    background: #0646b6;
    box-shadow: 0 10px 22px rgba(7,87,223,.24);
}

.premium-step-card {
    display: grid;
    grid-template-columns: 255px minmax(0,1fr);
    overflow: hidden;
    border: 1px solid var(--form-border);
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 9px 28px rgba(20,45,84,.065);
}

.premium-step-intro {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    padding: 24px 22px;
    border-right: 1px solid #e8edf4;
    background: linear-gradient(145deg,#fbfdff,#f6f9fe);
}

.premium-step-number {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    display: inline-grid;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: #0757df;
    box-shadow: 0 8px 16px rgba(7,87,223,.2);
    font-size: 1.08rem;
    font-weight: 800;
}

.premium-step-intro h2 {
    margin: 2px 0 6px;
    color: var(--form-navy);
    font-size: 1.02rem;
    font-weight: 800;
}

.premium-step-intro p {
    margin: 0;
    color: var(--form-muted);
    font-size: .86rem;
    line-height: 1.5;
}

.premium-step-content {
    min-width: 0;
    padding: 22px 24px;
}

.premium-form-alert {
    border-radius: 13px;
}

.premium-inline-help {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #4f6f9f;
    font-size: .84rem;
}

.premium-inline-help i {
    color: #0757df;
}

.premium-optional-panel {
    padding: 16px;
    border: 1px solid #e6ebf2;
    border-radius: 12px;
    background: #f9fbfd;
}

.premium-form-summary {
    position: sticky;
    z-index: 20;
    bottom: 12px;
    display: grid;
    grid-template-columns: minmax(190px,1fr) minmax(150px,.55fr) minmax(150px,.55fr) auto;
    align-items: center;
    gap: 20px;
    margin-top: 16px;
    padding: 15px 18px;
    border: 1px solid #dfe6f0;
    border-radius: 15px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 14px 38px rgba(15,38,80,.14);
    backdrop-filter: blur(10px);
}

.summary-primary {
    display: flex;
    align-items: center;
    gap: 12px;
}

.summary-icon {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    display: inline-grid;
    place-items: center;
    border-radius: 12px;
    color: #0757df;
    background: #eaf2ff;
    font-size: 1.08rem;
}

.summary-primary div,
.summary-metric {
    display: flex;
    flex-direction: column;
}

.summary-primary strong,
.summary-metric strong {
    color: #17253b;
    font-size: .95rem;
}

.summary-primary small,
.summary-metric small {
    color: #738096;
    font-size: .78rem;
}

.summary-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

/* New Deposits */
.deposit-period-grid {
    display: grid;
    grid-template-columns: minmax(180px,220px) minmax(180px,220px) minmax(260px,1fr) auto;
    align-items: end;
    gap: 16px;
}

.deposit-quick-select .btn {
    min-height: 46px;
    border-color: #d4dce8;
    border-radius: 10px;
    color: #33435b;
    background: #fff;
}

.deposit-load-btn {
    white-space: nowrap;
}

.premium-date-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.premium-date-chip {
    position: relative;
    min-width: 74px;
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    padding: 9px 11px;
    border: 1px solid #dce4ef;
    border-radius: 10px;
    color: #42516a;
    background: #fff;
    cursor: pointer;
    transition: border-color .14s ease, background .14s ease, box-shadow .14s ease;
}

.premium-date-chip input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.date-chip-check {
    flex: 0 0 21px;
    width: 21px;
    height: 21px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #d5ddea;
    border-radius: 50%;
    color: transparent;
    background: #fff;
}

.premium-date-chip > span:last-child {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.05;
}

.premium-date-chip small {
    font-size: .73rem;
}

.premium-date-chip strong {
    font-size: .85rem;
}

.premium-date-chip:has(input:checked) {
    border-color: #4f8df0;
    color: #0757df;
    background: #eff5ff;
    box-shadow: 0 0 0 3px rgba(7,87,223,.07);
}

.premium-date-chip input:checked + .date-chip-check {
    border-color: #0757df;
    color: #fff;
    background: #0757df;
}

.premium-date-chips.compact .premium-date-chip {
    min-width: 66px;
    padding: 7px 8px;
}

.deposit-bulk-toolbar {
    display: grid;
    grid-template-columns: minmax(150px,.75fr) minmax(160px,1fr) minmax(170px,1fr) minmax(220px,1.25fr) auto;
    align-items: center;
    gap: 12px;
    padding: 13px;
    border: 1px solid #e3e9f1;
    border-radius: 13px;
    background: #f9fbfd;
}

.premium-select-all {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    color: #26364f;
    font-size: .82rem;
    font-weight: 700;
}

.deposit-driver-list,
.premium-expense-list {
    display: grid;
    gap: 11px;
}

.deposit-driver-card {
    overflow: hidden;
    border: 1px solid #e3e9f1;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(15,38,80,.035);
    transition: border-color .15s ease, box-shadow .15s ease;
}

.deposit-driver-card.is-selected {
    border-color: #bdd2f6;
    box-shadow: 0 5px 17px rgba(7,87,223,.07);
}

.deposit-driver-main {
    display: grid;
    grid-template-columns: 24px 46px minmax(170px,1.25fr) minmax(165px,.8fr) minmax(205px,1fr) auto auto;
    align-items: center;
    gap: 14px;
    padding: 13px 15px;
}

.driver-avatar {
    width: 44px;
    height: 44px;
    display: inline-grid;
    place-items: center;
    border-radius: 50%;
    color: #0757df;
    background: #eaf2ff;
    font-size: .88rem;
    font-weight: 800;
}

.driver-vehicle-identity,
.driver-target-summary {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.driver-vehicle-identity strong {
    color: #17253b;
    font-size: .86rem;
}

.driver-vehicle-identity span,
.driver-target-summary span {
    overflow: hidden;
    color: #718096;
    font-size: .8rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.driver-target-summary small,
.driver-payment-field label {
    margin-bottom: 3px;
    color: #718096;
    font-size: .76rem;
}

.driver-target-summary strong {
    color: #1c2d47;
    font-size: .88rem;
}

.driver-payment-field .form-control,
.driver-payment-field .input-group-text {
    min-height: 42px;
}

.deposit-entry-status,
.expense-item-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px 9px;
    border-radius: 999px;
    color: #7a8494;
    background: #eef1f5;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .035em;
    white-space: nowrap;
}

.deposit-entry-status.is-ready,
.expense-item-status.is-complete {
    color: #16804a;
    background: #e5f7ed;
}

.deposit-entry-status.is-partial {
    color: #98600a;
    background: #fff3d5;
}

.deposit-entry-status.is-unpaid {
    color: #b42323;
    background: #ffeded;
}

.driver-details-toggle {
    min-height: 40px;
    border-color: #ccd6e4;
    border-radius: 9px;
    color: #344258;
    font-size: .84rem;
    white-space: nowrap;
}

.driver-details-toggle[aria-expanded="true"] i {
    transform: rotate(180deg);
}

.driver-details-toggle i {
    display: inline-block;
    transition: transform .18s ease;
}

.deposit-driver-details {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(190px,270px);
    gap: 20px;
    padding: 15px 18px 18px 83px;
    border-top: 1px solid #edf1f6;
    background: #fbfcfe;
}

/* New Expenses */
.expense-scope-content {
    max-width: 760px;
    display: grid;
    gap: 13px;
}

.premium-add-item-btn {
    min-height: 42px;
    border-color: #6b9df0;
    border-radius: 10px;
    color: #0757df;
    font-weight: 700;
}

.premium-expense-item {
    border: 1px solid #e1e7ef;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 5px 16px rgba(15,38,80,.04);
}

.premium-expense-item-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    border-bottom: 1px solid #edf1f5;
}

.premium-expense-item-header strong {
    color: #1b2940;
    font-size: .84rem;
}

.expense-item-number {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #d4e2fb;
    border-radius: 10px;
    color: #0757df;
    background: #edf4ff;
    font-size: .8rem;
    font-weight: 800;
}

.expense-item-grid {
    display: grid;
    grid-template-columns: minmax(160px,.8fr) minmax(260px,1.4fr) minmax(220px,1.15fr) minmax(170px,.85fr);
    gap: 14px 16px;
    padding: 14px;
}

.expense-category-combobox {
    position: relative;
}

.category-search-wrap {
    position: relative;
}

.category-search-wrap > .bi-search {
    position: absolute;
    top: 50%;
    left: 14px;
    z-index: 2;
    transform: translateY(-50%);
    color: #7d899b;
    pointer-events: none;
}

.category-search-input {
    padding-left: 41px;
    padding-right: 42px;
}

.category-search-input:focus {
    border-color: #6d9ef1;
    box-shadow: 0 0 0 3px rgba(7,87,223,.09);
}

.category-clear-btn {
    position: absolute;
    top: 50%;
    right: 7px;
    z-index: 3;
    width: 31px;
    height: 31px;
    display: inline-grid;
    place-items: center;
    transform: translateY(-50%);
    border: 0;
    border-radius: 8px;
    color: #8793a5;
    background: transparent;
    font-size: .72rem;
}

.category-clear-btn:hover,
.category-clear-btn:focus-visible {
    color: #0757df;
    background: #edf4ff;
}

.category-suggestions {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    z-index: 1080;
    max-height: 290px;
    overflow-y: auto;
    padding: 6px;
    border: 1px solid #dce4ef;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 18px 38px rgba(15,38,80,.16),0 4px 12px rgba(15,23,42,.06);
}

.category-suggestion-hint {
    padding: 6px 9px 7px;
    color: #8a5a0a;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.category-suggestion-option {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 10px;
    border: 0;
    border-radius: 9px;
    color: #24344e;
    background: transparent;
    text-align: left;
}

.category-suggestion-option:hover,
.category-suggestion-option.is-active {
    color: #0757df;
    background: #edf4ff;
}

.category-suggestion-name {
    overflow: hidden;
    font-size: .92rem;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.category-suggestion-type {
    flex: 0 0 auto;
    padding: 4px 7px;
    border-radius: 999px;
    color: #64748b;
    background: #f1f4f8;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .035em;
}

.category-suggestion-option:hover .category-suggestion-type,
.category-suggestion-option.is-active .category-suggestion-type {
    color: #0757df;
    background: #dfeaff;
}

.category-suggestion-empty {
    padding: 12px 10px;
    color: #7d899b;
    font-size: .86rem;
    text-align: center;
}

.category-search-help {
    margin-top: 5px;
    color: #8793a5;
    font-size: .76rem;
    line-height: 1.35;
}

.expense-category-combobox.is-invalid .category-search-input {
    border-color: #dc5a5a;
    box-shadow: 0 0 0 3px rgba(220,53,69,.08);
}

.expense-category-combobox.is-invalid .category-search-help {
    color: #b42323;
}

.expense-vendor-field {
    grid-column: 1 / 3;
}

.expense-payment-field {
    grid-column: 3 / 4;
}

.expense-form-summary {
    grid-template-columns: minmax(190px,1fr) minmax(180px,.8fr) auto;
}

@media (max-width: 1399.98px) {
    .deposit-period-grid {
        grid-template-columns: repeat(2,minmax(180px,1fr));
    }
    .deposit-load-btn {
        justify-self: start;
    }
    .deposit-bulk-toolbar {
        grid-template-columns: repeat(2,minmax(180px,1fr));
    }
    .deposit-bulk-toolbar .premium-primary-btn {
        justify-self: start;
    }
    .deposit-driver-main {
        grid-template-columns: 24px 46px minmax(160px,1fr) minmax(150px,.8fr) minmax(190px,1fr);
    }
    .deposit-entry-status {
        margin-left: 84px;
        justify-self: start;
    }
    .driver-details-toggle {
        grid-column: 4 / 6;
        justify-self: end;
    }
    .expense-item-grid {
        grid-template-columns: repeat(2,minmax(220px,1fr));
    }
    .expense-vendor-field,
    .expense-payment-field {
        grid-column: auto;
    }
}

@media (max-width: 991.98px) {
    .premium-step-card {
        grid-template-columns: 1fr;
    }
    .premium-step-intro {
        padding: 18px 20px;
        border-right: 0;
        border-bottom: 1px solid #e8edf4;
    }
    .premium-step-content {
        padding: 18px 20px;
    }
    .premium-form-summary {
        position: static;
        grid-template-columns: repeat(2,minmax(150px,1fr));
    }
    .summary-actions {
        grid-column: 1 / -1;
    }
    .deposit-driver-main {
        grid-template-columns: 24px 46px minmax(150px,1fr) minmax(165px,1fr);
    }
    .driver-target-summary {
        grid-column: 3 / 4;
    }
    .driver-payment-field {
        grid-column: 4 / 5;
    }
    .deposit-entry-status {
        grid-column: 3 / 4;
        margin-left: 0;
    }
    .driver-details-toggle {
        grid-column: 4 / 5;
    }
    .deposit-driver-details {
        padding-left: 20px;
    }
}

@media (max-width: 767.98px) {
    .deposit-period-grid,
    .deposit-bulk-toolbar,
    .expense-item-grid,
    .premium-form-summary,
    .deposit-driver-details {
        grid-template-columns: 1fr;
    }
    .deposit-driver-main {
        grid-template-columns: 24px 42px 1fr;
    }
    .driver-target-summary,
    .driver-payment-field,
    .deposit-entry-status,
    .driver-details-toggle {
        grid-column: 3 / 4;
    }
    .driver-details-toggle {
        justify-self: start;
    }
    .summary-actions {
        grid-column: auto;
    }
    .summary-actions .btn {
        flex: 1;
    }
    .premium-expense-item-header {
        align-items: flex-start;
        flex-direction: column;
    }
    .premium-expense-item-header > .d-flex:last-child {
        align-self: flex-end;
    }
}

/* V120 · Driver lifecycle and professional Asset Register */
.premium-eyebrow {
    display: block;
    margin-bottom: .38rem;
    color: #1468df;
    font-size: .7rem;
    font-weight: 850;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.asset-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.asset-stat-card {
    display: flex;
    min-height: 126px;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    border: 1px solid #e1e8f2;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(29, 54, 92, .055);
}

.asset-stat-icon,
.asset-row-icon,
.asset-empty-icon,
.replacement-context-icon,
.driver-history-avatar {
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
}

.asset-stat-icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    font-size: 1.15rem;
}

.asset-stat-icon.icon-blue { color: #1264db; background: #eaf2ff; }
.asset-stat-icon.icon-indigo { color: #6d44de; background: #f0ebff; }
.asset-stat-icon.icon-green { color: #087f4f; background: #e5f7ef; }
.asset-stat-icon.icon-red { color: #c33143; background: #fff0f1; }

.asset-stat-card > div {
    min-width: 0;
}

.asset-stat-card small,
.driver-history-stat-grid small,
.replacement-context-card small,
.driver-history-current > small,
.asset-source-banner small {
    display: block;
    color: #73849d;
    font-size: .66rem;
    font-weight: 850;
    letter-spacing: .075em;
}

.asset-stat-card strong {
    display: block;
    overflow: hidden;
    margin: .18rem 0 .05rem;
    color: #1c304e;
    font-size: clamp(1.08rem, 1.55vw, 1.42rem);
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.asset-stat-card > div > span,
.driver-history-stat-grid article > span {
    color: #8795aa;
    font-size: .75rem;
}

.asset-filter-card .form-label,
.asset-form-card .form-label {
    color: #62738c;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .035em;
}

.asset-row-icon {
    width: 42px;
    height: 42px;
    border: 1px solid #d8e5f8;
    border-radius: 12px;
    color: #1567dd;
    background: #f1f6ff;
}

.asset-empty-icon {
    width: 72px;
    height: 72px;
    margin: 0 auto;
    border: 1px solid #d8e5f8;
    border-radius: 22px;
    color: #1769e0;
    background: #f1f6ff;
    font-size: 1.75rem;
}

.asset-empty-icon.small-icon {
    width: 54px;
    height: 54px;
    border-radius: 16px;
    font-size: 1.25rem;
}

.asset-review-note,
.asset-source-banner {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.15rem;
    border: 1px solid #d5e4fa;
    border-radius: 16px;
    background: linear-gradient(135deg, #f2f7ff 0%, #fbfdff 100%);
}

.asset-review-note > span,
.asset-source-banner > span {
    display: grid;
    width: 44px;
    height: 44px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 13px;
    color: #1264db;
    background: #e1edff;
    font-size: 1.1rem;
}

.asset-review-note strong,
.asset-source-banner strong {
    display: block;
    color: #203552;
}

.asset-review-note p,
.asset-source-banner p {
    margin: .18rem 0 0;
    color: #71829a;
    font-size: .82rem;
}

.asset-register-table,
.asset-candidate-table {
    font-size: .84rem;
}

.replacement-context-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 1.1rem;
    padding: 1.25rem 1.4rem;
    border: 1px solid #d8e4f5;
    border-radius: 18px;
    background: linear-gradient(135deg, #f4f8ff 0%, #fff 70%);
}

.replacement-context-icon {
    width: 52px;
    height: 52px;
    border-radius: 15px;
    color: #1062d7;
    background: #e3edff;
    font-size: 1.3rem;
}

.replacement-context-card h2 {
    margin: .12rem 0 .2rem;
    color: #1b304e;
    font-size: 1.2rem;
    font-weight: 850;
}

.replacement-context-card h2 span,
.replacement-context-card p {
    color: #708199;
    font-size: .82rem;
    font-weight: 500;
}

.replacement-context-card p {
    margin: 0;
}

.replacement-context-target {
    min-width: 180px;
    padding-left: 1.25rem;
    border-left: 1px solid #dce5f2;
    text-align: right;
}

.replacement-context-target strong {
    display: block;
    margin-top: .15rem;
    color: #1c3150;
    font-size: 1.15rem;
}

.replacement-workflow {
    display: grid;
    gap: 1rem;
}

.replacement-step-card {
    overflow: visible;
}

.replacement-step-heading {
    display: flex;
    align-items: flex-start;
    gap: .85rem;
}

.replacement-step-heading > span {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 11px;
    color: #fff;
    background: #1769e0;
    font-size: .82rem;
    font-weight: 850;
}

.replacement-step-heading h2 {
    margin: 0 0 .18rem;
    color: #203451;
    font-size: 1.02rem;
    font-weight: 850;
}

.replacement-step-heading p {
    margin: 0;
    color: #7b8aa0;
    font-size: .8rem;
}

.replacement-mode-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

.replacement-mode-option {
    cursor: pointer;
}

.replacement-mode-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.replacement-mode-option > span {
    display: grid;
    min-height: 96px;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    align-content: center;
    column-gap: .8rem;
    padding: 1rem;
    border: 1px solid #dce4ef;
    border-radius: 15px;
    color: #72829a;
    background: #fff;
    transition: .16s ease;
}

.replacement-mode-option i {
    grid-row: 1 / 3;
    align-self: center;
    font-size: 1.3rem;
}

.replacement-mode-option strong {
    color: #243853;
    font-size: .88rem;
}

.replacement-mode-option small {
    font-size: .72rem;
}

.replacement-mode-option input:checked + span {
    border-color: #4c8fee;
    color: #1264db;
    background: #f2f7ff;
    box-shadow: 0 0 0 3px rgba(23, 105, 224, .09);
}

.replacement-submit-bar {
    position: sticky;
    z-index: 10;
    bottom: .75rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .9rem 1rem;
    border: 1px solid #d8e2ef;
    border-radius: 16px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 12px 35px rgba(27, 48, 78, .13);
    backdrop-filter: blur(10px);
}

.replacement-submit-bar > div:first-child {
    display: flex;
    align-items: center;
    gap: .75rem;
    color: #08794b;
}

.replacement-submit-bar span strong,
.replacement-submit-bar span small {
    display: block;
}

.replacement-submit-bar span strong {
    color: #283b55;
    font-size: .82rem;
}

.replacement-submit-bar span small {
    color: #7d8ba0;
    font-size: .7rem;
}

.driver-history-profile {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(210px, auto);
    align-items: center;
    gap: 1.15rem;
    padding: 1.4rem;
    border: 1px solid #dce5f1;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 8px 28px rgba(24, 49, 86, .055);
}

.driver-history-avatar {
    width: 64px;
    height: 64px;
    border-radius: 19px;
    color: #0f62d7;
    background: #e8f1ff;
    font-size: 1.45rem;
    font-weight: 850;
}

.driver-history-identity h2 {
    margin: 0;
    color: #1d314e;
    font-size: 1.35rem;
    font-weight: 850;
}

.driver-history-identity > p {
    margin: .24rem 0 0;
    color: #728199;
    font-size: .82rem;
}

.driver-resignation-note {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin-top: .7rem;
    padding: .55rem .7rem;
    border-radius: 11px;
    color: #b3293b;
    background: #fff0f2;
}

.driver-resignation-note span strong,
.driver-resignation-note span small {
    display: block;
}

.driver-resignation-note span strong { font-size: .76rem; }
.driver-resignation-note span small { color: #8b6470; font-size: .68rem; }

.driver-history-current {
    padding-left: 1.25rem;
    border-left: 1px solid #e1e7ef;
}

.driver-history-current strong,
.driver-history-current span,
.driver-history-current a {
    display: block;
}

.driver-history-current strong {
    margin-top: .2rem;
    color: #203451;
}

.driver-history-current span,
.driver-history-current a {
    color: #7b8aa0;
    font-size: .73rem;
}

.driver-history-current a {
    margin-top: .35rem;
    color: #1264db;
    font-weight: 750;
    text-decoration: none;
}

.driver-history-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .8rem;
}

.driver-history-stat-grid article {
    padding: 1rem 1.1rem;
    border: 1px solid #e1e8f2;
    border-radius: 15px;
    background: #fff;
}

.driver-history-stat-grid strong {
    display: block;
    overflow: hidden;
    margin: .15rem 0 .08rem;
    color: #203451;
    font-size: 1.05rem;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.driver-status-timeline {
    position: relative;
}

.driver-status-timeline::before {
    position: absolute;
    top: 7px;
    bottom: 12px;
    left: 5px;
    width: 2px;
    content: "";
    background: #dce6f4;
}

.driver-status-timeline article {
    position: relative;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: .65rem;
    padding-bottom: 1.1rem;
}

.driver-status-timeline article:last-child { padding-bottom: 0; }

.timeline-dot {
    z-index: 1;
    width: 12px;
    height: 12px;
    margin-top: 4px;
    border: 3px solid #fff;
    border-radius: 50%;
    background: #1769e0;
    box-shadow: 0 0 0 1px #aac7ee;
}

.driver-status-timeline small,
.driver-status-timeline strong,
.driver-status-timeline p {
    display: block;
}

.driver-status-timeline small { color: #8391a5; font-size: .68rem; }
.driver-status-timeline strong { margin: .08rem 0; color: #253852; font-size: .78rem; }
.driver-status-timeline p { margin: 0; color: #7a899f; font-size: .7rem; }

@media (max-width: 1399.98px) {
    .asset-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .asset-register-table { font-size: .74rem; }
    .asset-register-table th,
    .asset-register-table td { padding-right: .55rem; padding-left: .55rem; }
}

@media (max-width: 991.98px) {
    .driver-history-profile { grid-template-columns: auto minmax(0, 1fr); }
    .driver-history-current { grid-column: 1 / -1; padding: 1rem 0 0; border-top: 1px solid #e1e7ef; border-left: 0; }
    .driver-history-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767.98px) {
    .asset-stat-grid { grid-template-columns: 1fr; }
    .asset-stat-card { min-height: 110px; }
    .replacement-context-card { grid-template-columns: auto minmax(0, 1fr); }
    .replacement-context-target { grid-column: 1 / -1; padding: .8rem 0 0; border-top: 1px solid #dce5f2; border-left: 0; text-align: left; }
    .replacement-mode-grid { grid-template-columns: 1fr; }
    .replacement-submit-bar { position: static; align-items: stretch; flex-direction: column; }
    .replacement-submit-bar > div:last-child { display: grid !important; grid-template-columns: 1fr 1fr; }
    .driver-history-profile { grid-template-columns: 1fr; text-align: left; }
    .driver-history-current { grid-column: auto; }
    .driver-history-stat-grid { grid-template-columns: 1fr; }
}

/* ===== V101 Clickable unit maintenance timeline ===== */
.maintenance-history-accordion {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
    background: #f6f8fc;
}

.maintenance-unit-history {
    overflow: hidden;
    border: 1px solid #dce5f0;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 7px 20px rgba(15, 38, 80, .045);
}

.maintenance-unit-summary {
    min-height: 94px;
    display: grid;
    grid-template-columns: minmax(220px, 1.15fr) minmax(470px, 2fr) 24px;
    align-items: center;
    gap: 18px;
    padding: 15px 18px;
    color: #263750;
    background: linear-gradient(135deg, #fff, #fbfdff);
    cursor: pointer;
    list-style: none;
    transition: background-color .16s ease, box-shadow .16s ease;
}

.maintenance-unit-summary::-webkit-details-marker {
    display: none;
}

.maintenance-unit-history[open] .maintenance-unit-summary {
    background: linear-gradient(135deg, #f1f6ff, #fbfdff);
    box-shadow: inset 4px 0 #0864ec;
}

.maintenance-unit-summary:hover {
    background: #f4f8ff;
}

.maintenance-unit-vehicle {
    display: flex;
    align-items: center;
    gap: 13px;
    min-width: 0;
}

.maintenance-unit-vehicle > span:last-child,
.maintenance-unit-facts > span {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.maintenance-unit-vehicle strong {
    overflow: hidden;
    color: #1f304c;
    font-size: 1rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.maintenance-unit-vehicle small {
    margin-top: 4px;
    color: #78869b;
    font-size: .86rem;
}

.maintenance-unit-facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(130px, 1fr));
    gap: 18px;
}

.maintenance-unit-facts small {
    color: #7d8ba0;
    font-size: .69rem;
    font-weight: 850;
    letter-spacing: .065em;
}

.maintenance-unit-facts strong {
    margin-top: 5px;
    overflow: hidden;
    color: #243651;
    font-size: .94rem;
    font-weight: 780;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.maintenance-unit-facts em {
    margin-top: 3px;
    overflow: hidden;
    color: #8390a2;
    font-size: .74rem;
    font-style: normal;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.maintenance-unit-chevron {
    color: #2568bf;
    font-size: 1rem;
    transition: transform .18s ease;
}

.maintenance-unit-history[open] .maintenance-unit-chevron {
    transform: rotate(180deg);
}

.maintenance-unit-history-body {
    border-top: 1px solid #dfe7f1;
    background: #fbfcfe;
}

.maintenance-history-range {
    min-height: 56px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 11px 20px;
    border-bottom: 1px solid #e5ebf3;
    color: #345272;
    background: #f6f9fd;
}

.maintenance-history-range > span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: .84rem;
    font-weight: 750;
}

.maintenance-history-range > span i {
    color: #075fe5;
}

.maintenance-history-range small {
    color: #8090a5;
    font-size: .75rem;
}

.maintenance-unit-history .maintenance-record-list {
    max-height: 560px;
    padding: 4px 20px 14px;
}

.maintenance-unit-history .maintenance-record-item {
    grid-template-columns: 38px minmax(125px,.65fr) minmax(240px,1.65fr) minmax(150px,.85fr) 36px;
    min-height: 94px;
    gap: 14px;
    padding: 14px 0;
}

.maintenance-unit-history .maintenance-record-date strong,
.maintenance-unit-history .maintenance-record-detail > strong,
.maintenance-unit-history .maintenance-record-meta strong {
    font-size: .92rem;
}

.maintenance-unit-history .maintenance-record-date span,
.maintenance-unit-history .maintenance-record-detail > span,
.maintenance-unit-history .maintenance-record-meta span {
    font-size: .8rem;
}

.maintenance-unit-history.tone-warning {
    border-top: 3px solid #e2a532;
}

.maintenance-unit-history.tone-danger {
    border-top: 3px solid #d85462;
}

.maintenance-unit-history.tone-success {
    border-top: 3px solid #40a56f;
}

@media (max-width: 991.98px) {
    .maintenance-unit-summary {
        grid-template-columns: minmax(190px, .85fr) minmax(430px, 1.65fr) 22px;
    }

    .maintenance-history-accordion {
        overflow-x: auto;
    }

    .maintenance-unit-history {
        min-width: 760px;
    }
}

@media (max-width: 767.98px) {
    .maintenance-history-accordion {
        overflow-x: visible;
        padding: 10px;
    }

    .maintenance-unit-history {
        min-width: 0;
    }

    .maintenance-unit-summary {
        grid-template-columns: minmax(0,1fr) 22px;
        gap: 13px;
        padding: 15px;
    }

    .maintenance-unit-vehicle {
        grid-column: 1;
    }

    .maintenance-unit-chevron {
        grid-column: 2;
        grid-row: 1;
    }

    .maintenance-unit-facts {
        grid-column: 1 / -1;
        grid-template-columns: repeat(3, minmax(0,1fr));
        gap: 10px;
        padding-top: 12px;
        border-top: 1px solid #e6ecf4;
    }

    .maintenance-unit-facts strong {
        font-size: .82rem;
    }

    .maintenance-history-range {
        align-items: flex-start;
        flex-direction: column;
        padding: 12px 15px;
    }

    .maintenance-unit-history .maintenance-record-list {
        padding: 4px 15px 12px;
    }

    .maintenance-unit-history .maintenance-record-item {
        grid-template-columns: 34px minmax(100px,.7fr) minmax(170px,1.4fr) 34px;
    }

    .maintenance-unit-history .maintenance-record-meta {
        display: none;
    }
}

/* ===== Premium login page ===== */
.login-page {
    min-height: 100vh;
    margin: 0;
    display: grid;
    place-items: center;
    padding: 32px;
    overflow-x: hidden;
    background:
        radial-gradient(circle at 12% 14%, rgba(7, 87, 223, .12), transparent 31%),
        radial-gradient(circle at 90% 85%, rgba(13, 79, 196, .1), transparent 30%),
        linear-gradient(135deg, #f8fbff 0%, #eef4fc 48%, #f8fafc 100%);
}

.premium-login-shell {
    position: relative;
    width: min(1040px, 100%);
    min-height: 620px;
    display: grid;
    grid-template-columns: 43% 57%;
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, .22);
    border-radius: 28px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 30px 80px rgba(15, 38, 80, .16), 0 8px 24px rgba(15, 23, 42, .07);
}

.premium-login-brand {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 54px 46px 38px;
    color: #fff;
    background: linear-gradient(145deg, #0757df 0%, #0d4fc4 45%, #082e72 100%);
}

.premium-login-brand::before,
.premium-login-brand::after {
    content: '';
    position: absolute;
    z-index: -1;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .13);
}

.premium-login-brand::before {
    width: 420px;
    height: 420px;
    top: -180px;
    right: -210px;
    box-shadow: 0 0 0 42px rgba(255, 255, 255, .035), 0 0 0 84px rgba(255, 255, 255, .025);
}

.premium-login-brand::after {
    width: 250px;
    height: 250px;
    bottom: -150px;
    left: -120px;
    box-shadow: 0 0 0 34px rgba(255, 255, 255, .03);
}

.premium-login-brand-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.premium-login-logo-frame {
    width: 224px;
    height: 204px;
    display: grid;
    place-items: center;
    padding: 18px;
    margin-bottom: 28px;
    border: 1px solid rgba(255, 255, 255, .55);
    border-radius: 28px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 18px 42px rgba(2, 20, 58, .26), inset 0 1px 0 #fff;
}

.premium-login-logo {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: transparent;
}

.premium-login-wordmark {
    font-size: 2.05rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: .105em;
}

.premium-login-brand-subtitle {
    margin-top: 10px;
    color: rgba(255, 255, 255, .76);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .22em;
}

.premium-login-brand-copy {
    max-width: 330px;
    margin: 27px auto 0;
    color: rgba(255, 255, 255, .79);
    font-size: .92rem;
    line-height: 1.65;
}

.premium-login-feature-row {
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}

.premium-login-feature-row span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 12px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 999px;
    color: rgba(255, 255, 255, .86);
    background: rgba(255, 255, 255, .08);
    font-size: .76rem;
}

.premium-login-form-panel {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 62px 74px;
    background: rgba(255, 255, 255, .98);
}

.premium-login-mobile-brand {
    display: none;
}

.premium-login-heading {
    margin-bottom: 30px;
}

.premium-login-eyebrow {
    display: inline-block;
    margin-bottom: 11px;
    color: #0757df;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .16em;
}

.premium-login-heading h1 {
    margin: 0 0 10px;
    color: #14233c;
    font-size: clamp(2rem, 3vw, 2.65rem);
    font-weight: 800;
    letter-spacing: -.04em;
}

.premium-login-heading p {
    max-width: 410px;
    margin: 0;
    color: #69768a;
    line-height: 1.55;
}

.premium-login-alert {
    border: 1px solid #fecaca;
    border-radius: 13px;
    font-size: .9rem;
}

.premium-login-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.premium-login-field label {
    display: block;
    margin-bottom: 8px;
    color: #26364f;
    font-size: .86rem;
    font-weight: 700;
}

.premium-login-input-wrap {
    position: relative;
}

.premium-login-input-wrap > i {
    position: absolute;
    top: 50%;
    left: 17px;
    transform: translateY(-50%);
    color: #71809a;
    font-size: 1.05rem;
    pointer-events: none;
}

.premium-login-input-wrap input {
    width: 100%;
    height: 56px;
    padding: 0 48px;
    border: 1px solid #d8e0ec;
    border-radius: 14px;
    outline: 0;
    color: #17233a;
    background: #fbfdff;
    font-size: .96rem;
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.premium-login-input-wrap input::placeholder {
    color: #9aa6b8;
}

.premium-login-input-wrap input:focus {
    border-color: #4e8af2;
    background: #fff;
    box-shadow: 0 0 0 4px rgba(7, 87, 223, .11);
}

.premium-password-toggle {
    position: absolute;
    top: 50%;
    right: 9px;
    width: 38px;
    height: 38px;
    display: inline-grid;
    place-items: center;
    transform: translateY(-50%);
    border: 0;
    border-radius: 10px;
    color: #71809a;
    background: transparent;
}

.premium-password-toggle:hover,
.premium-password-toggle:focus-visible {
    color: #0757df;
    background: #eef4ff;
}

.premium-login-submit {
    width: 100%;
    height: 57px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    margin-top: 5px;
    border: 0;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(135deg, #0757df 0%, #0d4fc4 58%, #0a3d99 100%);
    box-shadow: 0 14px 28px rgba(7, 87, 223, .23);
    font-size: 1rem;
    font-weight: 700;
    transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

.premium-login-submit:hover,
.premium-login-submit:focus-visible {
    transform: translateY(-1px);
    filter: brightness(1.04);
    box-shadow: 0 17px 34px rgba(7, 87, 223, .3);
}

.premium-login-submit:active {
    transform: translateY(0);
}

.premium-login-security {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin-top: 30px;
    color: #8894a7;
    font-size: .76rem;
}

.premium-login-security i {
    color: #22a559;
}

.premium-login-footer {
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid #e7ecf3;
    color: #8a96a8;
    text-align: center;
    font-size: .72rem;
    line-height: 1.65;
}

.premium-login-footer div:last-child {
    color: #637087;
    font-weight: 600;
    letter-spacing: .035em;
}

@media (max-width: 899.98px) {
    .login-page {
        padding: 24px;
    }

    .premium-login-shell {
        width: min(520px, 100%);
        min-height: auto;
        display: block;
        border-radius: 24px;
    }

    .premium-login-brand {
        display: none;
    }

    .premium-login-form-panel {
        padding: 42px 48px 38px;
    }

    .premium-login-mobile-brand {
        display: flex;
        align-items: center;
        gap: 13px;
        margin-bottom: 36px;
    }

    .premium-login-mobile-brand img {
        width: 68px;
        height: 62px;
        object-fit: contain;
    }

    .premium-login-mobile-brand div {
        display: flex;
        flex-direction: column;
        gap: 4px;
    }

    .premium-login-mobile-brand strong {
        color: #0b438f;
        font-size: 1.02rem;
        letter-spacing: .05em;
    }

    .premium-login-mobile-brand span {
        color: #77849a;
        font-size: .6rem;
        font-weight: 700;
        letter-spacing: .13em;
    }
}

@media (max-width: 575.98px) {
    .login-page {
        align-items: stretch;
        padding: 0;
        background: #fff;
    }

    .premium-login-shell {
        min-height: 100vh;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .premium-login-form-panel {
        min-height: 100vh;
        padding: 32px 24px;
    }

    .premium-login-mobile-brand {
        margin-bottom: 34px;
    }

    .premium-login-heading {
        margin-bottom: 26px;
    }
}

/* ===== V96 Maintenance Control Center ===== */
.maintenance-control-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:18px;padding:24px 26px;border:1px solid #dce6f4;border-radius:20px;background:linear-gradient(135deg,#fff 0%,#f7faff 72%,#edf4ff 100%);box-shadow:0 12px 34px rgba(15,38,80,.07)}
.maintenance-control-title{display:flex;align-items:center;gap:16px;min-width:0}
.maintenance-control-icon{display:grid;place-items:center;flex:0 0 52px;width:52px;height:52px;border:1px solid #cfe0fb;border-radius:16px;color:#0757df;background:#eef5ff;font-size:1.35rem}
.maintenance-control-title h1{margin:0;color:#162641;font-size:1.7rem;font-weight:800;letter-spacing:-.035em}
.maintenance-control-title p{margin:.3rem 0 0;color:#738198;font-size:.97rem}
.maintenance-control-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.maintenance-control-actions .btn{min-height:44px;border-radius:11px;font-weight:700}

.maintenance-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}
.maintenance-kpi-card{display:flex;align-items:center;gap:14px;min-height:122px;padding:20px;border:1px solid #e0e8f3;border-radius:18px;background:#fff;box-shadow:0 9px 26px rgba(15,38,80,.055)}
.maintenance-kpi-icon{display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;border-radius:14px;font-size:1.35rem}
.maintenance-kpi-card div{display:flex;flex-direction:column;min-width:0}
.maintenance-kpi-card small{margin-bottom:2px;color:#64738b;font-size:.7rem;font-weight:800;letter-spacing:.09em}
.maintenance-kpi-card strong{color:#162641;font-size:1.65rem;line-height:1.15}
.maintenance-kpi-card div>span{margin-top:4px;color:#8490a2;font-size:.78rem}
.maintenance-kpi-card.tone-primary .maintenance-kpi-icon{color:#0757df;background:#eaf2ff}
.maintenance-kpi-card.tone-warning .maintenance-kpi-icon{color:#b66500;background:#fff3dd}
.maintenance-kpi-card.tone-success .maintenance-kpi-icon{color:#087443;background:#e7f8ef}
.maintenance-kpi-card.tone-danger .maintenance-kpi-icon{color:#ba2f3d;background:#ffeaed}
.maintenance-kpi-card.tone-warning strong{color:#9b5700}.maintenance-kpi-card.tone-success strong{color:#087443}.maintenance-kpi-card.tone-danger strong{color:#b62837}

.maintenance-panel{margin-bottom:18px;border:1px solid #dfe7f2;border-radius:18px;background:#fff;box-shadow:0 9px 28px rgba(15,38,80,.055);overflow:hidden;scroll-margin-top:18px}
.maintenance-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:19px 22px;border-bottom:1px solid #edf1f6}
.maintenance-panel-heading h2{margin:0;color:#172741;font-size:1.13rem;font-weight:800;letter-spacing:-.015em}
.maintenance-panel-heading p{margin:.25rem 0 0;color:#7b889c;font-size:.82rem}
.maintenance-section-count{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 12px;border:1px solid #d9e5f6;border-radius:999px;color:#285183;background:#f5f8fd;font-size:.75rem;font-weight:800;white-space:nowrap}

.maintenance-priority-list{padding:10px 14px 14px}
.maintenance-priority-item{position:relative;display:grid;grid-template-columns:38px minmax(155px,.75fr) minmax(230px,1.25fr) auto auto;align-items:center;gap:14px;margin-top:8px;padding:13px 14px;border:1px solid #e5eaf2;border-left-width:4px;border-radius:13px;background:#fbfcfe}
.maintenance-priority-item.tone-warning{border-color:#f0d49b;border-left-color:#eda823;background:#fffaf0}.maintenance-priority-item.tone-danger{border-color:#efc3ca;border-left-color:#d94b5a;background:#fff7f8}.maintenance-priority-item.tone-neutral{border-left-color:#8a99ae}
.maintenance-priority-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;font-size:1rem}
.maintenance-priority-item.tone-warning .maintenance-priority-icon{color:#a35b00;background:#ffefd2}.maintenance-priority-item.tone-danger .maintenance-priority-icon{color:#b22636;background:#ffe6ea}.maintenance-priority-item.tone-neutral .maintenance-priority-icon{color:#58677e;background:#edf1f6}
.maintenance-priority-vehicle,.maintenance-priority-issue{display:flex;flex-direction:column;min-width:0}
.maintenance-priority-vehicle strong,.maintenance-priority-issue strong{overflow:hidden;color:#1e2e48;font-size:.82rem;font-weight:800;text-overflow:ellipsis;white-space:nowrap}
.maintenance-priority-vehicle span,.maintenance-priority-issue span{margin-top:2px;color:#7e899a;font-size:.75rem}
.maintenance-priority-item .btn{border-radius:9px;font-size:.74rem;font-weight:750;white-space:nowrap}
.maintenance-all-clear{display:flex;align-items:center;gap:14px;margin:16px;padding:18px;border:1px solid #cfeadb;border-radius:14px;background:#f1fbf5}
.maintenance-all-clear>span{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;color:#087443;background:#dcf5e7;font-size:1.2rem}.maintenance-all-clear strong{color:#155f3b}.maintenance-all-clear p{margin:2px 0 0;color:#638073;font-size:.82rem}
.maintenance-more-notice{padding:0 22px 17px;color:#748197;font-size:.76rem;text-align:right}

.maintenance-status-pill{display:inline-flex;align-items:center;justify-content:center;min-height:27px;padding:0 10px;border:1px solid transparent;border-radius:999px;font-size:.67rem;font-weight:850;letter-spacing:.035em;white-space:nowrap}
.maintenance-status-pill.tone-primary{border-color:#bed6fa;color:#0757df;background:#edf4ff}.maintenance-status-pill.tone-success{border-color:#c9e7d6;color:#126b40;background:#eaf8f0}.maintenance-status-pill.tone-warning{border-color:#efd49d;color:#925400;background:#fff3db}.maintenance-status-pill.tone-danger{border-color:#ecc4ca;color:#ae2737;background:#ffeaed}.maintenance-status-pill.tone-neutral{border-color:#dfe4eb;color:#59677b;background:#f0f3f7}

.maintenance-readiness-table-wrap{max-width:100%}.maintenance-readiness-table{min-width:980px;font-size:.83rem}
.maintenance-readiness-table thead th,.maintenance-document-table thead th{padding:13px 18px;border:0;border-bottom:1px solid #e1e7f0;color:#5a6981;background:#f7f9fc;font-size:.67rem;font-weight:850;letter-spacing:.075em;text-transform:uppercase}
.maintenance-readiness-table tbody td{padding:12px 18px;border-color:#edf1f6;color:#293851}.maintenance-readiness-table tbody tr:nth-child(even){background:#fbfcfe}.maintenance-readiness-table tbody tr:hover{background:#f6f9fe}
.maintenance-vehicle-cell{display:flex;align-items:center;gap:11px;min-width:0}.maintenance-vehicle-mark{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border:1px solid #d3e2f7;border-radius:10px;color:#0757df;background:#f0f6ff}.maintenance-vehicle-cell>div{display:flex;flex-direction:column;min-width:0}.maintenance-vehicle-cell strong{overflow:hidden;color:#1d2c46;font-size:.82rem;font-weight:800;text-overflow:ellipsis;white-space:nowrap}.maintenance-vehicle-cell span:not(.maintenance-vehicle-mark){margin-top:1px;color:#7d899a;font-size:.72rem}
.maintenance-service-inline{display:flex;flex-direction:column}.maintenance-service-inline strong{color:#263650;font-size:.75rem}.maintenance-service-inline small{margin-top:2px;color:#8490a2;font-size:.68rem}

.maintenance-section-nav{display:flex;align-items:center;gap:5px;margin-bottom:18px;padding:6px;border:1px solid #dfe7f2;border-radius:14px;background:#fff;box-shadow:0 7px 20px rgba(15,38,80,.045);overflow-x:auto}
.maintenance-section-nav a{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:39px;padding:0 15px;border-radius:10px;color:#5f6e84;font-size:.79rem;font-weight:750;text-decoration:none;white-space:nowrap}.maintenance-section-nav a:hover{color:#0757df;background:#f2f6fd}.maintenance-section-nav a.is-active{color:#0757df;background:#eaf2ff;box-shadow:inset 0 0 0 1px #ccddf8}

.maintenance-history-heading{align-items:flex-end}.maintenance-history-search-input{position:relative;width:min(360px,100%);flex:0 1 360px}.maintenance-history-search-input>i{position:absolute;z-index:2;left:14px;top:50%;color:#7c899d;transform:translateY(-50%)}.maintenance-history-search-input .form-control{height:42px;padding-left:40px;border-color:#d9e3f1;border-radius:11px;background:#fafcff;font-size:.82rem}
.maintenance-history-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:16px}
.maintenance-history-vehicle-card{position:relative;display:flex;flex-direction:column;min-width:0;border:1px solid #e0e7f1;border-top-width:3px;border-radius:16px;background:#fff;box-shadow:0 7px 20px rgba(15,38,80,.045);overflow:hidden}.maintenance-history-vehicle-card.tone-success{border-top-color:#40a56f}.maintenance-history-vehicle-card.tone-warning{border-top-color:#e2a532}.maintenance-history-vehicle-card.tone-danger{border-top-color:#d85462}.maintenance-history-vehicle-card.tone-neutral{border-top-color:#94a1b4}
.maintenance-history-card-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 16px;border-bottom:1px solid #edf1f6;background:#fbfcfe}
.maintenance-history-service-summary{display:grid;grid-template-columns:minmax(150px,.75fr) minmax(190px,1.25fr);gap:14px;padding:14px 16px 8px}.maintenance-history-service-summary>div{display:flex;flex-direction:column;min-width:0}.maintenance-history-service-summary small,.maintenance-history-metrics small,.maintenance-history-card-footer small,.maintenance-filter-progress small{color:#8290a4;font-size:.62rem;font-weight:800;letter-spacing:.065em}.maintenance-history-service-summary strong{margin-top:3px;color:#24344f;font-size:.84rem}.maintenance-history-service-summary span{margin-top:2px;overflow:hidden;color:#7e8a9d;font-size:.71rem;text-overflow:ellipsis;white-space:nowrap}
.maintenance-service-tags{display:flex;flex-wrap:wrap;gap:6px;padding:0 16px 10px}.maintenance-mini-tag{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:8px;font-size:.65rem;font-weight:750}.maintenance-mini-tag.tone-warning{color:#965800;background:#fff1d7}.maintenance-mini-tag.tone-primary{color:#0757df;background:#eaf2ff}
.maintenance-history-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0 16px 13px;border:1px solid #e5ebf3;border-radius:12px;background:#f8fafc;overflow:hidden}.maintenance-history-metrics>div{display:flex;flex-direction:column;min-width:0;padding:12px;border-right:1px solid #e5ebf3}.maintenance-history-metrics>div:last-child{border-right:0}.maintenance-history-metrics strong{margin-top:4px;overflow:hidden;color:#21314c;font-size:.82rem;text-overflow:ellipsis;white-space:nowrap}.maintenance-history-metrics span{margin-top:2px;color:#8894a5;font-size:.65rem}.tone-text-success{color:#087443!important}.tone-text-warning{color:#9a5a00!important}.tone-text-danger{color:#b12838!important}.tone-text-neutral{color:#5f6c80!important}
.maintenance-filter-progress{display:flex;align-items:center;gap:10px;margin:0 16px 13px;padding:10px 12px;border:1px solid #dce7f6;border-radius:11px;background:#f5f9ff}.maintenance-filter-progress>span{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;color:#0757df;background:#e5efff}.maintenance-filter-progress>div:nth-child(2){display:flex;flex-direction:column;min-width:0}.maintenance-filter-progress strong{margin-top:2px;color:#25405f;font-size:.75rem}.maintenance-filter-progress.tone-danger{border-color:#efccd1;background:#fff4f5}.maintenance-filter-progress.tone-danger>span{color:#b22636;background:#ffe3e7}.maintenance-filter-progress.tone-danger strong{color:#a52735}
.maintenance-filter-dots{display:flex;gap:5px;margin-left:auto}.maintenance-filter-dots i{width:8px;height:8px;border:1px solid #bdd0ea;border-radius:50%;background:#fff}.maintenance-filter-dots i.is-filled{border-color:#2670df;background:#2670df}.maintenance-filter-progress.tone-danger .maintenance-filter-dots i.is-filled{border-color:#c54251;background:#c54251}
.maintenance-history-card-footer{display:grid;grid-template-columns:minmax(110px,1fr) minmax(110px,1fr) auto;align-items:end;gap:12px;margin-top:auto;padding:13px 16px;border-top:1px solid #edf1f6;background:#fbfcfe}.maintenance-history-card-footer>div:not(.maintenance-history-action){display:flex;flex-direction:column;min-width:0}.maintenance-history-card-footer strong{margin-top:3px;overflow:hidden;color:#2a3952;font-size:.75rem;text-overflow:ellipsis;white-space:nowrap}.maintenance-history-action .btn{border-radius:9px;font-size:.7rem;font-weight:750}
.maintenance-history-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:150px;margin:16px;padding:20px;border:1px dashed #d7e0ec;border-radius:14px;color:#78869a;background:#fafbfd;font-size:.82rem;text-align:center}.maintenance-history-empty i{color:#7f9bc5;font-size:1.5rem}[data-maintenance-row][hidden]{display:none!important}

.maintenance-document-table{min-width:960px;font-size:.82rem}.maintenance-document-table tbody td{padding:14px 18px;border-color:#edf1f6}.maintenance-document-table tbody tr:nth-child(even){background:#fbfcfe}.maintenance-document-table td>strong,.maintenance-document-table td>.badge,.maintenance-document-table td>small{display:block}.maintenance-document-table td>small{margin-top:4px;color:#818da0;font-size:.68rem}

@media(max-width:1199.98px){.maintenance-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.maintenance-history-grid{grid-template-columns:1fr}.maintenance-priority-item{grid-template-columns:38px minmax(150px,.75fr) minmax(210px,1.25fr) auto}.maintenance-priority-item .btn{grid-column:2/-1;justify-self:end}}
@media(max-width:767.98px){.maintenance-control-hero{align-items:flex-start;flex-direction:column;padding:20px}.maintenance-control-actions{justify-content:flex-start;width:100%}.maintenance-control-actions .btn{flex:1 1 210px}.maintenance-kpi-grid{grid-template-columns:1fr 1fr;gap:10px}.maintenance-kpi-card{min-height:108px;padding:15px}.maintenance-kpi-icon{flex-basis:42px;width:42px;height:42px}.maintenance-panel-heading,.maintenance-history-heading{align-items:flex-start;flex-direction:column}.maintenance-history-search-input{width:100%;flex-basis:auto}.maintenance-priority-item{grid-template-columns:34px 1fr auto;gap:10px}.maintenance-priority-issue{grid-column:2/-1}.maintenance-priority-item .maintenance-status-pill{grid-column:2}.maintenance-priority-item .btn{grid-column:3;grid-row:3}.maintenance-history-service-summary{grid-template-columns:1fr}.maintenance-history-metrics{grid-template-columns:1fr}.maintenance-history-metrics>div{border-right:0;border-bottom:1px solid #e5ebf3}.maintenance-history-metrics>div:last-child{border-bottom:0}.maintenance-history-card-footer{grid-template-columns:1fr 1fr}.maintenance-history-action{grid-column:1/-1}.maintenance-history-action .btn{width:100%}}
@media(max-width:479.98px){.maintenance-control-title{align-items:flex-start}.maintenance-control-icon{flex-basis:44px;width:44px;height:44px}.maintenance-control-title h1{font-size:1.35rem}.maintenance-kpi-grid{grid-template-columns:1fr}.maintenance-priority-item{grid-template-columns:34px 1fr}.maintenance-priority-item .maintenance-status-pill,.maintenance-priority-item .btn{grid-column:2;justify-self:start}.maintenance-history-grid{padding:10px}.maintenance-history-card-footer{grid-template-columns:1fr}.maintenance-history-action{grid-column:auto}}

/* ===== V71 Fleet Performance Insights ===== */
.fleet-insights {
    padding: 20px;
    border: 1px solid #e1e8f2;
    border-radius: 20px;
    background: linear-gradient(145deg, #f9fbff, #f3f7fd);
    box-shadow: 0 14px 38px rgba(15, 38, 80, .07);
}
.fleet-insights-heading {display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}
.fleet-period-badge {display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #d7e2f1;border-radius:10px;color:#314466;background:#fff;font-size:.76rem;font-weight:800;letter-spacing:.05em;white-space:nowrap}
.fleet-insight-card {height:100%;min-height:116px;display:flex;align-items:center;gap:16px;padding:18px;border:1px solid #e0e7f1;border-radius:16px;background:#fff;box-shadow:0 8px 20px rgba(15,38,80,.065)}
.fleet-insight-icon {width:58px;height:58px;flex:0 0 58px;display:grid;place-items:center;border-radius:50%;font-size:1.55rem}
.fleet-insight-card>div {min-width:0;display:flex;flex-direction:column;gap:3px}
.fleet-insight-label {font-size:.72rem;font-weight:800;letter-spacing:.055em}
.fleet-insight-card strong {color:#14243e;font-size:1rem}
.fleet-insight-card b {font-size:1.24rem;line-height:1.2;white-space:nowrap}
.insight-profit .fleet-insight-icon{color:#168344;background:#e8f8ee}.insight-profit .fleet-insight-label,.insight-profit b{color:#159447}
.insight-revenue .fleet-insight-icon{color:#0865e8;background:#e8f1ff}.insight-revenue .fleet-insight-label,.insight-revenue b{color:#0969ee}
.insight-expense .fleet-insight-icon{color:#e96b05;background:#fff1e4}.insight-expense .fleet-insight-label,.insight-expense b{color:#ef6d00}
.insight-roi .fleet-insight-icon{color:#7628d3;background:#f3eafe}.insight-roi .fleet-insight-label,.insight-roi b{color:#7227ce}
.fleet-ranking-table th {font-size:.75rem;letter-spacing:.045em;text-transform:uppercase;white-space:nowrap}
.fleet-ranking-table td {padding-top:12px;padding-bottom:12px}
.fleet-ranking-table .progress {min-width:110px;height:7px;background:#e7edf6}
.fleet-rank {width:30px;height:30px;display:inline-grid;place-items:center;border-radius:50%;background:#edf1f6;color:#34445f;font-weight:800}
.fleet-rank.rank-1{color:#6b4b00;background:#ffd85e;box-shadow:inset 0 0 0 2px #f0b800}.fleet-rank.rank-2{color:#4d5663;background:#dfe3e8}.fleet-rank.rank-3{color:#764014;background:#e9b57a}
.fleet-efficiency {display:inline-flex;padding:5px 11px;border-radius:999px;font-size:.74rem;font-weight:800;border:1px solid}
.fleet-efficiency.good{color:#15713a;background:#edf9f1;border-color:#bce8ca}.fleet-efficiency.average{color:#ad5b00;background:#fff7e8;border-color:#f6d294}.fleet-efficiency.poor{color:#c52d2d;background:#fff0f0;border-color:#f1bcbc}
@media(max-width:767.98px){.fleet-insights{padding:14px}.fleet-insights-heading{align-items:flex-start}.fleet-insight-card{min-height:100px}.fleet-ranking-table{min-width:900px}}

@media (max-width: 575.98px) {
    .app-navbar-grid {
        gap: .35rem;
    }

    .app-brand-logo {
        width: 44px;
        height: 44px;
    }

    .app-header-title-text {
        font-size: 1.2rem;
        letter-spacing: 0;
    }
}


/* ===== Monthly Deposit Status ===== */
.monthly-deposit-card{
    overflow:hidden;
    border:1px solid #e5eaf2;
    border-radius:18px;
    box-shadow:0 12px 34px rgba(15,38,80,.075);
}
.monthly-deposit-card .card-header{padding:1.2rem 1.35rem!important}
.monthly-deposit-picker{min-width:155px;border-color:#dbe3ee;border-radius:10px}
.monthly-deposit-legend{display:flex;flex-wrap:wrap;gap:.55rem .7rem;font-size:.84rem;color:#64748b}
.monthly-deposit-legend span{display:inline-flex;align-items:center;gap:.4rem;padding:.34rem .6rem;border:1px solid #e9edf4;border-radius:999px;background:#fbfcfe}
.legend-dot{width:8px;height:8px;border-radius:3px;display:inline-block}
.legend-dot.state-paid{background:#55b979}
.legend-dot.state-partial{background:#e7ab38}
.legend-dot.state-missing{background:#e76b6b}
.legend-dot.state-dayoff{background:#9271e8}
.legend-dot.state-future{background:#aeb8c7}
.monthly-deposit-scroll{max-width:100%;scrollbar-color:#cbd5e1 #f8fafc;scrollbar-width:thin}
.monthly-deposit-scroll::-webkit-scrollbar{height:9px}
.monthly-deposit-scroll::-webkit-scrollbar-track{background:#f8fafc}
.monthly-deposit-scroll::-webkit-scrollbar-thumb{background:#cbd5e1;border:2px solid #f8fafc;border-radius:999px}
.monthly-deposit-table{border-collapse:separate;border-spacing:0;font-size:.9rem;white-space:nowrap;background:#fff}
.monthly-deposit-table thead th{position:sticky;top:0;z-index:3;padding:.78rem .5rem;border-top:0;border-bottom:1px solid #dfe6ef;color:#344258;background:#f8fafc;box-shadow:0 3px 8px rgba(15,23,42,.025)}
.monthly-deposit-table tbody td{border-bottom:1px solid #edf1f6;background:#fff}
.monthly-deposit-table tbody tr:nth-child(even) td{background:#fbfcfe}
.monthly-deposit-table tbody tr:last-child td{border-bottom:0}
.monthly-deposit-table tbody tr:hover td{background:#f6f9fd}
.monthly-deposit-table .sticky-col{position:sticky;z-index:2;background:#fff}
.monthly-deposit-table tbody tr:nth-child(even) .sticky-col{background:#fbfcfe}
.monthly-deposit-table tbody tr:hover .sticky-col{background:#f6f9fd}
.monthly-deposit-table thead .sticky-col{z-index:5;background:#f8fafc}
.monthly-deposit-table .sticky-vehicle{left:0;min-width:155px;width:155px;padding-left:1rem}
.monthly-deposit-table .sticky-driver{left:155px;min-width:180px;width:180px;box-shadow:7px 0 13px rgba(15,23,42,.045)}
.monthly-deposit-table .day-head{min-width:44px;width:44px;padding:.78rem .2rem;color:#475569;font-weight:700}
.monthly-deposit-table .day-head.is-today{color:#0757df;background:#eef5ff;box-shadow:inset 0 3px 0 #3b82f6}
.monthly-deposit-table .deposit-day-cell{min-width:44px;width:44px;height:54px;padding:.35rem .2rem;border-left:1px solid #f2f4f8;font-weight:800;background:#fff}
.monthly-deposit-table tbody tr:nth-child(even) .deposit-day-cell{background:#fbfcfe}
.monthly-deposit-table tbody tr:hover .deposit-day-cell{background:#f6f9fd}
.monthly-deposit-table .deposit-day-cell.is-today{box-shadow:inset 1px 0 #dbeafe,inset -1px 0 #dbeafe}
.monthly-deposit-table .deposit-status-badge{display:inline-flex;align-items:center;justify-content:center;width:29px;height:29px;margin:auto;border-radius:8px;text-decoration:none;color:inherit;transition:transform .14s ease,box-shadow .14s ease}
.monthly-deposit-table button.deposit-status-badge{appearance:none;font:inherit;line-height:1;cursor:pointer;padding:0}
.monthly-deposit-table a.deposit-status-badge:hover,.monthly-deposit-table a.deposit-status-badge:focus-visible,.monthly-deposit-table button.deposit-status-badge:hover,.monthly-deposit-table button.deposit-status-badge:focus-visible{transform:translateY(-1px);box-shadow:0 5px 12px rgba(15,23,42,.11)}
.monthly-deposit-table .state-paid{color:#19713d}
.monthly-deposit-table .state-paid .deposit-status-badge{border:1px solid #d7eee0;background:#edf8f1}
.monthly-deposit-table .state-partial{color:#9a5a09}
.monthly-deposit-table .state-partial .deposit-status-badge{border:1px solid #f2dfae;background:#fff5d8}
.monthly-deposit-table .state-unpaid,.monthly-deposit-table .state-missing{color:#b42323}
.monthly-deposit-table .state-unpaid .deposit-status-badge,.monthly-deposit-table .state-missing .deposit-status-badge{border:1px solid #f4d3d3;background:#fff0f0}
.monthly-deposit-table .state-dayoff{color:#6d3bd1;font-size:.72rem}
.monthly-deposit-table .state-dayoff .deposit-status-badge{min-width:34px;width:auto;padding:0 .35rem;border:1px solid #e5dcfb;background:#f3efff;letter-spacing:.02em}
.monthly-deposit-table .state-sick{color:#a35b00;font-size:.68rem}
.monthly-deposit-table .state-sick .deposit-status-badge{min-width:38px;width:auto;padding:0 .35rem;border:1px solid #f2d7a7;background:#fff5df;letter-spacing:.02em}
.monthly-deposit-table .state-resign{color:#a12835;font-size:.62rem}
.monthly-deposit-table .state-resign .deposit-status-badge{min-width:52px;width:auto;padding:0 .3rem;border:1px solid #f0c9ce;background:#fff0f2;letter-spacing:.01em}
.monthly-deposit-legend .legend-dot.state-sick{background:#d99225}
.monthly-deposit-legend .legend-dot.state-resign{background:#c34a59}
.individual-status-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:860px;margin-bottom:.65rem}
.individual-status-heading span{color:#7a879c;font-size:.72rem}
.individual-status-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:.65rem;max-width:860px}
.individual-status-item{display:flex;align-items:center;gap:.65rem;padding:.62rem .7rem;border:1px solid #dfe7f3;border-radius:14px;background:#fff;box-shadow:0 5px 16px rgba(30,64,175,.055)}
.individual-status-item.is-global-off{opacity:.52;background:#f7f9fc}
.individual-status-date{min-width:42px;text-align:center;line-height:1.05;color:#53627a;border-right:1px solid #e8edf5;padding-right:.65rem}
.individual-status-date small,.individual-status-date strong{display:block}
.individual-status-date small{font-size:.66rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.individual-status-date strong{font-size:1.08rem;color:#1d2d47}
.individual-status-actions{display:flex;align-items:center;gap:.38rem;min-width:0;flex-wrap:wrap}
.individual-status-btn{display:inline-flex;align-items:center;justify-content:center;gap:.32rem;min-height:34px;border:1px solid #dbe3ef;background:#f8fafc;color:#526078;border-radius:9px;padding:.4rem .58rem;font-size:.67rem;font-weight:800;letter-spacing:.025em;line-height:1;box-shadow:0 2px 6px rgba(15,38,80,.025);transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease,background .15s ease,color .15s ease}
.individual-status-btn i{font-size:.78rem;line-height:1}
.individual-status-btn.status-off{border-color:#4f8df0;background:#eff5ff;color:#0757df}
.individual-status-btn.status-sick{border-color:#e5b75e;background:#fff5df;color:#955600}
.individual-status-btn.status-resign{border-color:#df929d;background:#fff0f2;color:#a12736}
.individual-status-btn:hover{transform:translateY(-1px);filter:saturate(1.08);box-shadow:0 5px 12px rgba(30,64,175,.08)}
.individual-status-btn.status-off.is-active{border-color:#4f8df0;background:#eff5ff;color:#0757df;box-shadow:0 0 0 3px rgba(7,87,223,.07)}
.individual-status-btn.status-sick.is-active{border-color:#e5b75e;background:#fff2d7;color:#955600;box-shadow:0 0 0 3px rgba(208,133,20,.07)}
.individual-status-btn.status-resign.is-active{border-color:#df929d;background:#ffecef;color:#a12736;box-shadow:0 0 0 3px rgba(180,50,67,.065)}
.individual-status-btn:disabled{cursor:not-allowed;opacity:.55}
@media(max-width:575.98px){.individual-status-heading{align-items:flex-start;flex-direction:column;gap:2px}.individual-status-grid{grid-template-columns:1fr}.individual-status-actions{flex-wrap:wrap}.individual-status-btn{padding:.42rem .5rem}}
.monthly-deposit-table .state-future{color:#9aa5b4}
.monthly-deposit-table .state-future .deposit-status-badge{border-color:transparent;background:transparent;font-size:1rem}
.monthly-deposit-table .state-na{color:#c5cdd8}
.monthly-deposit-table .state-na .deposit-status-badge{border-color:transparent;background:transparent}
#depositAbsenceModal{z-index:1095}
body.monthly-absence-open .modal-backdrop{z-index:1090}
.monthly-absence-modal{border:0;border-radius:20px;box-shadow:0 22px 60px rgba(15,38,80,.2);overflow:hidden}
.monthly-absence-kicker{display:inline-flex;color:#0d5de5;font-size:.68rem;font-weight:850;letter-spacing:.09em}
.monthly-absence-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}
.monthly-absence-option{display:flex;min-height:116px;align-items:center;justify-content:center;flex-direction:column;gap:.3rem;border:1px solid #dbe3ef;border-radius:15px;background:#f8fafc;color:#526078;padding:.8rem;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}
.monthly-absence-option i{font-size:1.35rem}
.monthly-absence-option strong{font-size:.83rem;letter-spacing:.05em}
.monthly-absence-option span{color:#7c899d;font-size:.68rem;text-align:center}
.monthly-absence-option:hover,.monthly-absence-option:focus-visible{transform:translateY(-2px);box-shadow:0 9px 22px rgba(30,64,175,.1)}
.monthly-absence-option.status-duty{border-color:#8fd0ad;background:#edf9f2;color:#147a49}
.monthly-absence-option.status-off{border-color:#9bc0f8;background:#eff5ff;color:#0757df}
.monthly-absence-option.status-sick{border-color:#edcf91;background:#fff7e5;color:#955600}
.monthly-absence-option.status-resign{border-color:#e8aeb6;background:#fff1f3;color:#a12736}
.monthly-absence-option.is-active{box-shadow:0 0 0 3px rgba(13,93,229,.12),0 9px 22px rgba(30,64,175,.1)}
.monthly-absence-note{display:flex;align-items:flex-start;gap:.55rem;border-radius:11px;background:#f4f7fb;color:#687790;padding:.7rem .8rem;font-size:.72rem}
@media(max-width:767.98px){.monthly-absence-options{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:575.98px){.monthly-absence-options{grid-template-columns:1fr}.monthly-absence-option{min-height:78px;display:grid;grid-template-columns:26px 72px 1fr;justify-content:initial;text-align:left}.monthly-absence-option span{text-align:left}}
.monthly-deposit-table .summary-head,.monthly-deposit-table .summary-cell{min-width:138px;padding-left:.8rem;padding-right:.8rem;border-left:1px solid #e9edf4;background:#fbfcfe}
.monthly-deposit-table tbody tr:nth-child(even) .summary-cell{background:#f8fafc}
.monthly-deposit-table tbody tr:hover .summary-cell{background:#f3f7fc}
.monthly-deposit-table thead .summary-head{background:#f4f7fb;color:#26364f}
@media(max-width:767.98px){
  .monthly-deposit-table .sticky-vehicle{min-width:125px;width:125px}
  .monthly-deposit-table .sticky-driver{left:125px;min-width:145px;width:145px}
}

/* ===== Professional grouped sidebar ===== */
.sidebar-shell {
    flex: 0 0 286px;
    width: 286px;
    max-width: 286px;
    padding: 0 14px 24px !important;
    overflow-x: hidden;
    transition: flex-basis .22s ease, width .22s ease, max-width .22s ease;
}

.main-shell {
    flex: 1 1 0;
    width: calc(100% - 286px);
    min-width: 0;
    transition: width .22s ease;
}

.sidebar-brand-panel {
    min-height: 88px;
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 -14px 12px;
    padding: 10px 13px;
    border-bottom: 1px solid #e8edf5;
    background: #fff;
}

.sidebar-brand-link {
    min-width: 0;
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #102447;
    text-decoration: none;
}

.sidebar-brand-link:hover,
.sidebar-brand-link:focus {
    color: #0757df;
}

.sidebar-brand-logo {
    flex: 0 0 62px;
    width: 62px;
    height: 62px;
    object-fit: contain;
    background: transparent;
}

.sidebar-brand-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    line-height: 1.15;
}

.sidebar-brand-name {
    color: #0c326f;
    font-size: .95rem;
    font-weight: 800;
    letter-spacing: .025em;
    white-space: nowrap;
}

.sidebar-brand-subtitle {
    color: #72809a;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .09em;
    white-space: nowrap;
}

.sidebar-collapse-btn {
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dde5f0;
    border-radius: 11px;
    color: #18335f;
    background: #fff;
    box-shadow: 0 3px 10px rgba(15, 23, 42, .04);
    transition: color .15s ease, background .15s ease, border-color .15s ease;
}

.sidebar-collapse-btn:hover,
.sidebar-collapse-btn:focus-visible {
    color: #0757df;
    border-color: #bdd0f5;
    background: #f4f7ff;
}

.sidebar-nav {
    gap: 4px;
}

.sidebar-nav-group {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 16px;
}

.sidebar-group-label {
    padding: 0 12px 6px;
    color: #7a879e;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .1em;
    line-height: 1;
}

.sidebar .sidebar-nav-link,
.offcanvas .sidebar-nav-link {
    position: relative;
    min-height: 48px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 7px 10px !important;
    border-radius: 13px !important;
    color: #2d3f5d;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
}

.sidebar .sidebar-nav-link::before,
.offcanvas .sidebar-nav-link::before {
    content: '';
    position: absolute;
    top: 9px;
    bottom: 9px;
    left: 0;
    width: 3px;
    border-radius: 0 4px 4px 0;
    background: transparent;
}

.sidebar .sidebar-nav-link.active,
.offcanvas .sidebar-nav-link.active {
    background: #edf4ff !important;
    color: #0757df !important;
}

.sidebar .sidebar-nav-link.active::before,
.offcanvas .sidebar-nav-link.active::before {
    background: #0757df;
}

.sidebar-nav-icon {
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e0e7f0;
    border-radius: 11px;
    color: #18335f;
    background: #fff;
    font-size: 1.08rem;
    box-shadow: 0 2px 6px rgba(15, 23, 42, .025);
}

.sidebar-nav-link.active .sidebar-nav-icon {
    color: #0757df;
    border-color: #c9dafe;
    background: #f7faff;
}

.sidebar-nav-label {
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sidebar-status-dot {
    flex: 0 0 9px;
    width: 9px;
    height: 9px;
    margin-right: 5px;
    border-radius: 50%;
    background: #23ba58;
    box-shadow: 0 0 0 3px rgba(35, 186, 88, .12);
}

body.sidebar-collapsed .sidebar-shell {
    flex-basis: 84px;
    width: 84px;
    max-width: 84px;
    padding-right: 10px !important;
    padding-left: 10px !important;
}

body.sidebar-collapsed .main-shell {
    width: calc(100% - 84px);
}

body.sidebar-collapsed .sidebar-shell .sidebar-brand-panel {
    min-height: 112px;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    margin-right: -10px;
    margin-left: -10px;
    padding: 8px 4px;
}

body.sidebar-collapsed .sidebar-shell .sidebar-brand-link {
    flex: 0 0 auto;
    justify-content: center;
}

body.sidebar-collapsed .sidebar-shell .sidebar-brand-logo {
    flex-basis: 52px;
    width: 52px;
    height: 52px;
}

body.sidebar-collapsed .sidebar-shell .sidebar-brand-copy,
body.sidebar-collapsed .sidebar-shell .sidebar-group-label,
body.sidebar-collapsed .sidebar-shell .sidebar-nav-label,
body.sidebar-collapsed .sidebar-shell .sidebar-status-dot {
    display: none;
}

body.sidebar-collapsed .sidebar-shell .sidebar-nav-group {
    margin-top: 10px;
}

body.sidebar-collapsed .sidebar-shell .sidebar-nav-link {
    justify-content: center;
    padding: 7px !important;
}

body.sidebar-collapsed .sidebar-shell .sidebar-nav-link::before {
    top: 10px;
    bottom: 10px;
}

.offcanvas .sidebar-collapse-btn {
    display: none;
}

.offcanvas .sidebar-brand-panel {
    margin-top: -1rem;
}

.offcanvas .sidebar-nav {
    padding-bottom: 1rem;
}

@media (max-width: 991.98px) {
    .main-shell {
        width: 100%;
    }

    .offcanvas .sidebar-brand-panel {
        margin-right: -1rem;
        margin-left: -1rem;
        padding-right: 1rem;
        padding-left: 1rem;
    }
}

/* ===== V64 unified premium interface ===== */
:root {
    --ui-navy: #12223b;
    --ui-text: #25344d;
    --ui-muted: #718096;
    --ui-blue: #0757df;
    --ui-blue-dark: #0647b8;
    --ui-blue-soft: #edf4ff;
    --ui-border: #e3e9f1;
    --ui-border-strong: #d7e0ec;
    --ui-surface: #ffffff;
    --ui-surface-soft: #f8fafd;
    --ui-shadow: 0 12px 34px rgba(15, 38, 80, .07);
    --ui-shadow-hover: 0 17px 42px rgba(15, 38, 80, .11);
}

body {
    min-width: 320px;
    color: var(--ui-text);
    background:
        radial-gradient(circle at 88% 5%, rgba(7, 87, 223, .045), transparent 24rem),
        linear-gradient(180deg, #f8fafe 0, #f6f8fc 100%);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

.main-shell {
    position: relative;
    min-height: calc(100vh - 116px);
    padding: 28px 30px 54px !important;
    background: transparent;
}

.app-page {
    width: 100%;
    animation: premium-page-in .26s ease-out both;
}

@keyframes premium-page-in {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}

.premium-page-header {
    position: relative;
    min-height: 96px;
    align-items: center !important;
    margin-bottom: 22px !important;
    padding: 20px 22px 20px 25px;
    overflow: hidden;
    border: 1px solid rgba(213, 224, 238, .92);
    border-radius: 18px;
    background:
        radial-gradient(circle at 94% 18%, rgba(7, 87, 223, .11), transparent 13rem),
        linear-gradient(135deg, #fff 0%, #fbfdff 70%, #f1f6ff 100%);
    box-shadow: var(--ui-shadow);
}

.premium-page-header::before {
    content: '';
    position: absolute;
    top: 16px;
    bottom: 16px;
    left: 0;
    width: 4px;
    border-radius: 0 6px 6px 0;
    background: linear-gradient(180deg, #2c75f2, #0757df);
}

.premium-page-header::after {
    content: '';
    position: absolute;
    top: -55px;
    right: 8%;
    width: 150px;
    height: 150px;
    border: 1px solid rgba(7, 87, 223, .08);
    border-radius: 50%;
    box-shadow: 0 0 0 28px rgba(7, 87, 223, .025);
    pointer-events: none;
}

.premium-page-header > * {
    position: relative;
    z-index: 1;
}

.premium-page-header .page-title,
.premium-page-header h1 {
    margin-bottom: 4px !important;
    color: var(--ui-navy);
    font-size: clamp(1.55rem, 2.1vw, 2rem) !important;
    font-weight: 800;
    letter-spacing: -.035em;
}

.premium-page-header p {
    color: var(--ui-muted) !important;
    font-size: .96rem;
}

.premium-page-kicker {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 6px;
    color: var(--ui-blue);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .13em;
}

.premium-page-kicker i {
    width: 25px;
    height: 25px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #d5e3fb;
    border-radius: 8px;
    background: #f2f7ff;
    font-size: .78rem;
}

.app-page .btn {
    min-height: 40px;
    border-radius: 10px;
    font-weight: 650;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background-color .15s ease;
}

.app-page .btn:hover,
.app-page .btn:focus-visible {
    transform: translateY(-1px);
}

.app-page .btn-dark,
.app-page .btn-primary {
    border-color: var(--ui-blue);
    background: linear-gradient(135deg, #1466ea, var(--ui-blue) 58%, #0647b8);
    box-shadow: 0 8px 18px rgba(7, 87, 223, .18);
}

.app-page .btn-dark:hover,
.app-page .btn-dark:focus-visible,
.app-page .btn-primary:hover,
.app-page .btn-primary:focus-visible {
    border-color: var(--ui-blue-dark);
    background: linear-gradient(135deg, #0d5bd8, var(--ui-blue-dark));
    box-shadow: 0 11px 23px rgba(7, 87, 223, .25);
}

.app-page .btn-outline-dark,
.app-page .btn-outline-primary {
    border-color: #b9ccec;
    color: #0b4ebf;
    background: #fff;
}

.app-page .btn-outline-dark:hover,
.app-page .btn-outline-dark:focus-visible,
.app-page .btn-outline-primary:hover,
.app-page .btn-outline-primary:focus-visible {
    border-color: #7ba6ee;
    color: #0757df;
    background: #edf4ff;
    box-shadow: 0 7px 16px rgba(7, 87, 223, .1);
}

.app-page .btn-outline-secondary {
    border-color: #d3dce8;
    color: #526178;
    background: rgba(255, 255, 255, .92);
}

.app-page .btn-outline-secondary:hover,
.app-page .btn-outline-secondary:focus-visible {
    border-color: #b8c5d6;
    color: #26364f;
    background: #f7f9fc;
}

.app-page .btn-sm {
    min-height: 34px;
    border-radius: 9px;
}

.app-page .table-card,
.app-page .stat-card {
    border: 1px solid var(--ui-border);
    border-radius: 17px;
    background: rgba(255, 255, 255, .98);
    box-shadow: var(--ui-shadow);
}

.app-page .table-card {
    overflow: visible;
}

.app-page .premium-data-card {
    overflow: hidden;
}

.app-page .premium-content-card,
.app-page .premium-form-card,
.app-page .premium-filter-card,
.app-page .premium-data-card {
    transition: border-color .18s ease, box-shadow .18s ease;
}

.app-page .premium-content-card:hover,
.app-page .premium-form-card:hover,
.app-page .premium-data-card:hover {
    border-color: #d6e0ed;
    box-shadow: var(--ui-shadow-hover);
}

.app-page .premium-content-card > .card-body > h2:first-child,
.app-page .premium-content-card > .card-body > .h5:first-child,
.app-page .premium-form-card > .card-body > h2:first-child,
.app-page .premium-form-card > .card-body > .h5:first-child {
    margin-bottom: 16px !important;
    color: #1a2941;
    font-weight: 800;
    letter-spacing: -.02em;
}

.app-page .premium-filter-card {
    margin-bottom: 19px !important;
    border-color: #dde6f1;
    background: linear-gradient(135deg, #fff, #fbfdff);
    box-shadow: 0 8px 22px rgba(15, 38, 80, .055);
}

.app-page .premium-filter-card .card-body {
    padding: 15px 17px;
}

.app-page .premium-filter-card form {
    align-items: center;
}

.app-page .form-label {
    margin-bottom: .42rem;
    color: #344258;
    font-size: .86rem;
    font-weight: 750;
}

.app-page .form-control,
.app-page .form-select {
    min-height: 43px;
    border-color: #d9e2ee;
    border-radius: 10px;
    color: #1d2b42;
    background-color: #fff;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, .015);
}

.app-page textarea.form-control {
    min-height: 84px;
}

.app-page .form-control::placeholder {
    color: #99a4b5;
}

.app-page .form-control:focus,
.app-page .form-select:focus {
    border-color: #6d9ef2;
    box-shadow: 0 0 0 4px rgba(7, 87, 223, .09);
}

.app-page .input-group-text {
    border-color: #d9e2ee;
    color: #526178;
    background: #f7f9fc;
}

.app-page .premium-form-card {
    overflow: hidden;
}

.app-page .premium-form-card > .card-body {
    padding: clamp(20px, 2.4vw, 32px) !important;
}

.app-page .premium-form-card > .card-footer {
    padding: 0 clamp(20px, 2.4vw, 32px) clamp(20px, 2.4vw, 28px) !important;
    background: #fff !important;
}

.app-page .card-header.premium-card-header {
    min-height: 68px;
    padding: 17px 20px !important;
    border-bottom: 1px solid #edf1f6 !important;
    background: linear-gradient(180deg, #fff, #fcfdff) !important;
}

.app-page .premium-card-header h2,
.app-page .premium-card-header h3,
.app-page .premium-card-header .h5,
.app-page .premium-card-header .h6 {
    color: #1a2941;
    font-weight: 800;
    letter-spacing: -.015em;
}

.app-page .table-responsive {
    scrollbar-width: thin;
    scrollbar-color: #c8d4e4 #f7f9fc;
}

.app-page .table-responsive::-webkit-scrollbar {
    width: 9px;
    height: 9px;
}

.app-page .table-responsive::-webkit-scrollbar-track {
    background: #f7f9fc;
}

.app-page .table-responsive::-webkit-scrollbar-thumb {
    border: 2px solid #f7f9fc;
    border-radius: 999px;
    background: #c8d4e4;
}

.app-page .premium-table {
    --bs-table-bg: transparent;
    margin-bottom: 0;
    color: #25344d;
    font-size: 1rem;
    line-height: 1.45;
}

.app-page .premium-table > thead > tr > th {
    padding: 13px 15px;
    border-top: 0;
    border-bottom: 1px solid #dfe6ef;
    color: #516078;
    background: #f7f9fc;
    font-size: .8rem;
    font-weight: 800;
    letter-spacing: .055em;
    text-transform: uppercase;
    vertical-align: middle;
}

.app-page .premium-table > tbody > tr > td {
    padding: 13px 15px;
    border-color: #edf1f5;
    color: #26344b;
    vertical-align: middle;
}

.app-page .premium-table > tbody > tr:nth-child(even) > td {
    background: #fcfdff;
}

.app-page .premium-table.table-hover > tbody > tr:hover > td {
    background: #f4f8ff;
}

.app-page .premium-table > tbody > tr:last-child > td,
.app-page .premium-table > tfoot > tr:last-child > * {
    border-bottom: 0;
}

.app-page .premium-table > tfoot > tr > * {
    padding: 14px 15px;
    border-top: 1px solid #dfe6ef;
    color: #17263e;
    background: #f5f8fc;
    font-weight: 800;
}

.app-page .premium-table .fw-semibold,
.app-page .premium-table .fw-bold {
    color: #17253b;
}

.app-page .premium-table .small {
    font-size: .88rem;
    line-height: 1.45;
}

.app-page .premium-table .badge {
    font-size: .75rem;
}

.app-page .badge {
    padding: .43em .72em;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .025em;
}

.app-page .badge-soft-success,
.app-page .bg-success-subtle {
    border-color: #ccebd8;
}

.app-page .badge-soft-warning,
.app-page .bg-warning-subtle {
    border-color: #f1dfaa;
}

.app-page .badge-soft-danger,
.app-page .bg-danger-subtle {
    border-color: #f2d0d0;
}

.app-page .badge-soft-secondary,
.app-page .bg-secondary-subtle {
    border-color: #e1e6ed;
}

.premium-stat-card {
    position: relative;
    min-height: 134px;
    overflow: hidden;
    background:
        radial-gradient(circle at 100% 0, rgba(7, 87, 223, .09), transparent 9rem),
        #fff !important;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.premium-stat-card:hover {
    transform: translateY(-2px);
    border-color: #cedcf0;
    box-shadow: var(--ui-shadow-hover);
}

.premium-stat-card .card-body {
    position: relative;
    padding: 20px 20px 18px;
}

.app-page .table-card.premium-stat-card {
    overflow: hidden;
    border-color: var(--ui-border);
}

.premium-stat-icon {
    width: 38px;
    height: 38px;
    display: inline-grid;
    place-items: center;
    float: right;
    margin: -2px 0 8px 12px;
    border: 1px solid #d6e4fb;
    border-radius: 12px;
    color: var(--ui-blue);
    background: #eef5ff;
    font-size: 1rem;
}

.premium-stat-card .small.text-secondary {
    color: #718096 !important;
    font-size: .8rem;
    font-weight: 750;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.premium-stat-card .h3,
.premium-stat-card .h4,
.premium-stat-card .display-6 {
    color: #14233b;
    font-weight: 800 !important;
    letter-spacing: -.035em;
}

.app-page .alert {
    border-width: 1px;
    border-radius: 13px;
    box-shadow: 0 8px 20px rgba(15, 38, 80, .05);
}

.main-shell > .alert {
    margin-bottom: 18px;
    border-width: 1px;
    border-radius: 13px;
    box-shadow: 0 8px 20px rgba(15, 38, 80, .05);
}

.premium-empty-state {
    padding-top: 42px !important;
    padding-bottom: 42px !important;
    color: #7c899c !important;
}

.premium-empty-icon {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    margin: 0 auto 10px;
    border: 1px solid #dce5f1;
    border-radius: 14px;
    color: #5f79a2;
    background: #f4f7fb;
    font-size: 1.15rem;
}

.app-page hr {
    border-color: #e4eaf2;
    opacity: 1;
}

.app-page .progress {
    overflow: hidden;
    border-radius: 999px;
    background: #e9eef5;
}

.app-page .progress-bar {
    border-radius: inherit;
    background: linear-gradient(90deg, #1b68e7, #0757df);
}

.app-page pre {
    border-color: #dfe6ef !important;
    border-radius: 11px !important;
    background: #f7f9fc !important;
}

.gps-monitor-page {
    margin: 0 !important;
}

.gps-monitor-frame-wrap {
    border-color: var(--ui-border-strong) !important;
    border-radius: 18px !important;
    box-shadow: var(--ui-shadow) !important;
}

.gps-monitor-frame {
    background: #f5f8fc !important;
}

.app-page > .d-flex.align-items-center.justify-content-between.gap-2.mb-2 {
    margin: 26px 2px 11px !important;
}

.app-page > .d-flex.align-items-center.justify-content-between.gap-2.mb-2 h2 {
    color: #1b2940;
    font-weight: 800;
}

.app-navbar-right > a:first-child {
    padding: 8px 11px;
    border: 1px solid transparent;
    border-radius: 10px;
    transition: border-color .15s ease, background-color .15s ease;
}

.app-navbar-right > a:first-child:hover,
.app-navbar-right > a:first-child:focus-visible {
    border-color: #e0e7f1;
    background: #f7f9fc;
}

@media (max-width: 991.98px) {
    .main-shell {
        min-height: calc(100vh - 78px);
        padding: 22px 18px 42px !important;
    }

    .premium-page-header {
        min-height: 88px;
        padding: 18px 18px 18px 21px;
    }
}

@media (max-width: 767.98px) {
    .premium-page-header {
        align-items: flex-start !important;
        flex-direction: column;
        gap: 14px !important;
    }

    .premium-page-header > .btn,
    .premium-page-header > div:last-child:not(:first-child) {
        align-self: stretch;
    }

    .premium-page-header > .btn {
        width: 100%;
    }

    .app-page .premium-filter-card .row > [class*='col-'] {
        margin-bottom: 2px;
    }

    .premium-stat-card {
        min-height: 122px;
    }
}

@media (max-width: 575.98px) {
    .main-shell {
        padding: 16px 12px 34px !important;
    }

    .premium-page-header {
        margin-bottom: 16px !important;
        border-radius: 15px;
    }

    .premium-page-kicker span {
        letter-spacing: .08em;
    }

    .app-page .table-card,
    .app-page .stat-card {
        border-radius: 14px;
    }

    .app-page .premium-table > thead > tr > th,
    .app-page .premium-table > tbody > tr > td,
    .app-page .premium-table > tfoot > tr > * {
        padding-right: 12px;
        padding-left: 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .app-page,
    .app-page *,
    .app-page *::before,
    .app-page *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

@media print {
    .app-page {
        animation: none;
    }

    .premium-page-header,
    .app-page .table-card,
    .app-page .stat-card {
        box-shadow: none !important;
    }
}

/* ===== V65 Maintenance History instant search ===== */
.maintenance-history-searchbar {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) auto;
    align-items: center;
    gap: 16px;
    padding: 13px 14px;
    border: 1px solid #dfe7f1;
    border-radius: 15px;
    background: linear-gradient(135deg, #fff, #fbfdff);
    box-shadow: 0 8px 22px rgba(15, 38, 80, .055);
}

.maintenance-history-search-input {
    position: relative;
}

.maintenance-history-search-input > i {
    position: absolute;
    top: 50%;
    left: 16px;
    z-index: 2;
    transform: translateY(-50%);
    color: #0757df;
    font-size: 1rem;
    pointer-events: none;
}

.maintenance-history-search-input .form-control {
    min-height: 50px;
    padding-right: 16px;
    padding-left: 46px;
    border-color: #d7e1ee;
    border-radius: 12px;
    font-size: 1rem;
}

.maintenance-fleet-count {
    min-height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 0 19px;
    border: 1px solid #cfddf2;
    border-radius: 12px;
    color: #1b345a;
    background: #f6f9ff;
    font-size: .92rem;
    font-weight: 750;
    white-space: nowrap;
}

.maintenance-fleet-count i {
    color: #0757df;
    font-size: 1.05rem;
}

.maintenance-history-card tbody tr[hidden] {
    display: none !important;
}

@media (max-width: 575.98px) {
    .maintenance-history-searchbar {
        grid-template-columns: 1fr;
    }

    .maintenance-fleet-count {
        justify-self: stretch;
    }
}

/* ===== V97 Vehicle Compliance separation ===== */
.compliance-control-hero .maintenance-control-icon{border-color:#c8e8dc;color:#087443;background:#eaf8f1}
.compliance-schedule-table{min-width:1120px}
.compliance-schedule-table tbody tr:first-child{background:#fffdf8}
.compliance-schedule-table td>.maintenance-status-pill{margin-top:5px}
.compliance-schedule-table .maintenance-service-inline small{font-size:.72rem}

/* ===== V98 Premium Vehicle Compliance schedule ===== */
.compliance-schedule-panel {
    overflow: hidden;
    border-color: #d7e1ee;
    box-shadow: 0 16px 38px rgba(22, 45, 85, .075);
}

.compliance-schedule-panel .maintenance-panel-heading {
    min-height: 104px;
    padding: 22px 26px;
    background: linear-gradient(135deg, #fff 0%, #fbfdff 68%, #f3f7ff 100%);
}

.compliance-schedule-panel .maintenance-panel-heading h2 {
    margin-bottom: 5px;
    font-size: 1.28rem;
    line-height: 1.25;
    letter-spacing: -.018em;
}

.compliance-schedule-panel .maintenance-panel-heading p {
    max-width: 720px;
    font-size: .95rem;
    line-height: 1.5;
}

.compliance-schedule-panel .maintenance-section-count {
    min-height: 38px;
    padding: 0 14px;
    border-color: #cdddf2;
    color: #234a78;
    background: #f4f8ff;
    font-size: .83rem;
}

.compliance-schedule-table {
    min-width: 1180px;
    table-layout: fixed;
    color: #22324d;
    font-size: 1rem;
}

.compliance-schedule-table .compliance-col-vehicle { width: 18%; }
.compliance-schedule-table .compliance-col-date { width: 14.5%; }
.compliance-schedule-table .compliance-col-kir { width: 20%; }
.compliance-schedule-table .compliance-col-nearest { width: 18%; }
.compliance-schedule-table .compliance-col-status { width: 15%; }

.compliance-schedule-table thead th {
    padding: 16px 20px;
    border-bottom-color: #d8e1ec;
    color: #4e607b;
    background: #f5f7fb;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .075em;
    white-space: nowrap;
}

.compliance-schedule-table tbody td {
    height: 124px;
    padding: 18px 20px;
    border-bottom-color: #e7ecf3;
    vertical-align: middle;
}

.compliance-schedule-table tbody tr:last-child td {
    border-bottom: 0;
}

.compliance-schedule-table .maintenance-vehicle-cell {
    gap: 13px;
}

.compliance-schedule-table .maintenance-vehicle-mark {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border-color: #cfe0f7;
    border-radius: 13px;
    color: #075fe5;
    background: #eff5ff;
    font-size: 1.05rem;
}

.compliance-schedule-table .maintenance-vehicle-cell strong {
    font-size: 1rem;
    line-height: 1.3;
    letter-spacing: .005em;
}

.compliance-schedule-table .maintenance-vehicle-cell div > span {
    margin-top: 4px;
    color: #758399;
    font-size: .86rem;
    line-height: 1.3;
}

.compliance-date-cell {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 7px;
}

.compliance-date-cell > strong {
    color: #20314d;
    font-size: 1rem;
    font-weight: 760;
    line-height: 1.3;
    white-space: nowrap;
}

.compliance-date-cell > small {
    color: #7a899f;
    font-size: .8rem;
    line-height: 1.4;
}

.compliance-schedule-table .maintenance-status-pill {
    min-height: 30px;
    padding: 0 11px;
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .045em;
}

.compliance-nearest-cell {
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 64px;
    padding: 10px 12px;
    border: 1px solid #e0e7f0;
    border-radius: 13px;
    background: #f8fafc;
}

.compliance-nearest-icon {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    border-radius: 10px;
    color: #1564dc;
    background: #eaf2ff;
    font-size: .95rem;
}

.compliance-nearest-cell div {
    min-width: 0;
}

.compliance-nearest-cell strong,
.compliance-nearest-cell small {
    display: block;
}

.compliance-nearest-cell strong {
    color: #263750;
    font-size: .88rem;
    font-weight: 780;
    line-height: 1.25;
}

.compliance-nearest-cell small {
    margin-top: 4px;
    color: #7d8ba0;
    font-size: .8rem;
    line-height: 1.3;
}

.compliance-status-cell {
    text-align: right;
}

.compliance-status-cell .maintenance-status-pill {
    min-width: 112px;
    justify-content: center;
    font-size: .78rem;
}

.compliance-row {
    transition: background-color .16s ease, box-shadow .16s ease;
}

.compliance-row:hover {
    background: #f8fbff;
}

.compliance-row.tone-warning {
    background: #fffdf8;
}

.compliance-row.tone-danger {
    background: #fff9f9;
}

.compliance-row.tone-warning td:first-child {
    box-shadow: inset 4px 0 #e9a427;
}

.compliance-row.tone-danger td:first-child {
    box-shadow: inset 4px 0 #df4d55;
}

@media (max-width: 767.98px) {
    .compliance-schedule-panel .maintenance-panel-heading {
        min-height: auto;
        padding: 19px 18px;
    }

    .compliance-schedule-panel .maintenance-panel-heading h2 {
        font-size: 1.18rem;
    }
}

/* ===== V99 Nearest-due tie handling ===== */
.compliance-nearest-cell.has-tie {
    position: relative;
    padding-right: 56px;
    border-color: #c9dcf7;
    background: linear-gradient(135deg, #f4f8ff, #fbfdff);
}

.compliance-nearest-cell.has-tie .compliance-nearest-icon {
    color: #075fe5;
    background: #dfeaff;
}

.compliance-nearest-cell em {
    display: block;
    margin-top: 5px;
    color: #657690;
    font-size: .72rem;
    font-style: normal;
    font-weight: 650;
    line-height: 1.35;
}

.compliance-tie-count {
    position: absolute;
    top: 9px;
    right: 9px;
    min-width: 39px;
    min-height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 7px;
    border: 1px solid #c7dafa;
    border-radius: 999px;
    color: #0757df;
    background: #fff;
    font-size: .62rem;
    font-weight: 850;
    letter-spacing: .055em;
    white-space: nowrap;
}

/* ===== V100 Last Oil Change and per-vehicle history ===== */
.maintenance-last-oil {
    position: relative;
    padding-left: 13px;
}

.maintenance-last-oil::before {
    content: '';
    position: absolute;
    top: 2px;
    bottom: 2px;
    left: 0;
    width: 3px;
    border-radius: 999px;
    background: linear-gradient(180deg, #0b65e8, #6aa3f6);
}

.maintenance-vehicle-history {
    border-top: 1px solid #e5ebf3;
    background: #fff;
}

.maintenance-vehicle-history > summary {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 16px;
    color: #29405f;
    background: linear-gradient(135deg, #fbfdff, #f6f9fe);
    cursor: pointer;
    list-style: none;
    user-select: none;
    transition: background-color .16s ease, color .16s ease;
}

.maintenance-vehicle-history > summary::-webkit-details-marker {
    display: none;
}

.maintenance-vehicle-history > summary:hover {
    color: #0757df;
    background: #f2f7ff;
}

.maintenance-history-summary-title,
.maintenance-history-summary-meta {
    display: inline-flex;
    align-items: center;
}

.maintenance-history-summary-title {
    gap: 9px;
    font-size: .9rem;
}

.maintenance-history-summary-title > i {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #cfe0f7;
    border-radius: 9px;
    color: #075fe5;
    background: #edf4ff;
}

.maintenance-history-summary-meta {
    gap: 9px;
    color: #708098;
    font-size: .82rem;
    font-weight: 750;
}

.maintenance-history-summary-meta i {
    color: #35669f;
    transition: transform .18s ease;
}

.maintenance-vehicle-history[open] .maintenance-history-summary-meta i {
    transform: rotate(180deg);
}

.maintenance-record-list {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0;
    max-height: 430px;
    padding: 6px 16px 14px;
    overflow-y: auto;
    border-top: 1px solid #edf1f6;
    background: #fbfcfe;
}

.maintenance-record-item {
    display: grid;
    grid-template-columns: 34px minmax(105px,.75fr) minmax(180px,1.7fr) minmax(110px,.85fr) 34px;
    align-items: center;
    gap: 11px;
    min-height: 82px;
    padding: 12px 0;
    border-bottom: 1px solid #e8edf4;
}

.maintenance-record-item:last-child {
    border-bottom: 0;
}

.maintenance-record-marker {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d5e2f4;
    border-radius: 10px;
    color: #1763cf;
    background: #eef5ff;
    font-size: .82rem;
}

.maintenance-record-date,
.maintenance-record-detail,
.maintenance-record-meta {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.maintenance-record-date strong,
.maintenance-record-detail > strong,
.maintenance-record-meta strong {
    overflow: hidden;
    color: #263750;
    font-size: .84rem;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.maintenance-record-date span,
.maintenance-record-detail > span,
.maintenance-record-meta span {
    margin-top: 3px;
    overflow: hidden;
    color: #7d8a9e;
    font-size: .74rem;
    line-height: 1.4;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.maintenance-record-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin: 0;
}

.maintenance-unit-history .maintenance-record-detail > .maintenance-record-title {
    display: -webkit-box;
    margin: 0 0 7px;
    overflow: hidden;
    color: #1f304a;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.35;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.maintenance-unit-history .maintenance-record-detail > .maintenance-record-description {
    display: -webkit-box;
    margin: 7px 0 0;
    overflow: hidden;
    color: #53647c;
    font-size: .9rem;
    font-weight: 750;
    line-height: 1.35;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.maintenance-unit-history .maintenance-record-meta > .maintenance-record-amount {
    order: 1;
    margin: 0 0 5px;
    color: #263750;
    font-size: .92rem;
    font-weight: 700;
}

.maintenance-unit-history .maintenance-record-meta > strong {
    order: 2;
    color: #1f304a;
    font-size: .9rem;
    font-weight: 800;
}

.maintenance-record-tags > span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 6px;
    border-radius: 6px;
    font-size: .64rem;
    font-weight: 800;
    line-height: 1;
}

.maintenance-record-tags .tone-warning {
    color: #955900;
    background: #fff0d2;
}

.maintenance-record-tags .tone-primary {
    color: #0757df;
    background: #e7f0ff;
}

.maintenance-record-tags .tone-maintenance {
    color: #087443;
    background: #e6f7ef;
}

.maintenance-record-edit {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #cfe0f7;
    border-radius: 9px;
    color: #075fe5;
    background: #fff;
    text-decoration: none;
    transition: color .15s ease, border-color .15s ease, background-color .15s ease;
}

.maintenance-record-edit:hover {
    border-color: #075fe5;
    color: #fff;
    background: #075fe5;
}

.maintenance-record-empty {
    min-height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    color: #8190a5;
    font-size: .82rem;
    text-align: center;
}

.maintenance-record-empty i {
    font-size: 1.25rem;
}

@media (max-width: 767.98px) {
    .maintenance-record-item {
        grid-template-columns: 32px minmax(90px,.75fr) minmax(160px,1.5fr) 32px;
    }

    .maintenance-record-meta {
        display: none;
    }
}

/* V108: balanced Vehicle Directory spacing and wrapped odometer headings. */
.vehicle-directory-table {
    width: 100%;
    min-width: 1900px;
    table-layout: fixed;
    font-size: .92rem;
}

.vehicle-directory-table thead th {
    padding-right: 12px;
    padding-left: 12px;
    padding-top: 14px;
    padding-bottom: 14px;
    line-height: 1.25;
    vertical-align: middle;
    white-space: nowrap;
}

.vehicle-directory-table tbody td {
    padding-right: 10px;
    padding-left: 10px;
    padding-top: 18px;
    padding-bottom: 18px;
}

.vehicle-directory-table .vehicle-identity-cell {
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.vehicle-directory-table .vehicle-plate {
    margin-top: 3px;
    color: #30425f;
    font-weight: 700;
}

.vehicle-directory-table .vehicle-odometer-value {
    color: #1e304c;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.vehicle-directory-table .vehicle-odo-header {
    white-space: normal;
}

.vehicle-directory-table .vehicle-header-lines {
    display: inline-block;
    vertical-align: middle;
}

.vehicle-directory-table .vehicle-status-cell {
    text-align: center;
}

.vehicle-directory-scroll {
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-behavior: auto;
    scrollbar-gutter: stable;
}

.vehicle-directory-table .vehicle-gps-header,
.vehicle-directory-table .vehicle-gps-cell {
    white-space: nowrap;
}

.vehicle-directory-table .vehicle-gps-cell {
    color: #1e304c;
    font-weight: 750;
    font-variant-numeric: tabular-nums;
    letter-spacing: .01em;
}

.vehicle-directory-table .vehicle-edit-button {
    display: flex;
    width: 34px;
    height: 34px;
    align-items: center;
    justify-content: center;
    margin: 9px auto 0;
}

.vehicle-directory-table th:nth-child(1) { width: 12%; }
.vehicle-directory-table th:nth-child(2) { width: 8%; }
.vehicle-directory-table th:nth-child(3) { width: 10%; }
.vehicle-directory-table th:nth-child(4) { width: 10%; }
.vehicle-directory-table th:nth-child(5) { width: 10%; }
.vehicle-directory-table th:nth-child(6) { width: 10%; }
.vehicle-directory-table th:nth-child(7) { width: 10%; }
.vehicle-directory-table th:nth-child(8) { width: 15%; }
.vehicle-directory-table th:nth-child(9) { width: 8%; }
.vehicle-directory-table th:nth-child(10) { width: 7%; }

.vehicle-directory-table td:nth-child(3),
.vehicle-directory-table td:nth-child(4),
.vehicle-directory-table td:nth-child(5),
.vehicle-directory-table td:nth-child(6),
.vehicle-directory-table td:nth-child(7) {
    font-variant-numeric: tabular-nums;
}

@media (max-width: 991.98px) {
    .vehicle-directory-table {
        min-width: 1900px;
        table-layout: fixed;
    }
}

/* V115 · dashboard operational action summary */
.dashboard-action-panel {
    overflow: hidden;
    border: 1px solid #dfe7f2;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .055);
}

.dashboard-action-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.2rem 1.35rem;
    border-bottom: 1px solid #edf1f7;
}

.dashboard-action-eyebrow {
    display: block;
    margin-bottom: .28rem;
    color: #075fe4;
    font-size: .73rem;
    font-weight: 850;
    letter-spacing: .12em;
}

.dashboard-action-heading h2 {
    margin: 0;
    color: #172a49;
    font-size: 1.25rem;
    font-weight: 800;
}

.dashboard-action-heading p {
    margin: .22rem 0 0;
    color: #74839a;
    font-size: .92rem;
}

.dashboard-action-total {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: .38rem .68rem;
    border-radius: 999px;
    font-size: .71rem;
    font-weight: 850;
    letter-spacing: .055em;
    white-space: nowrap;
}

.dashboard-action-total.has-action {
    color: #a72936;
    background: #fff0f2;
}

.dashboard-action-total.all-clear {
    color: #08754b;
    background: #e9f8f1;
}

.dashboard-action-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .85rem;
    padding: 1rem;
}

.dashboard-action-card {
    position: relative;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    gap: .8rem;
    align-items: center;
    min-width: 0;
    padding: 1rem;
    border: 1px solid #e2e8f2;
    border-radius: 15px;
    color: inherit;
    background: #fff;
    text-decoration: none;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.dashboard-action-card:hover {
    transform: translateY(-2px);
    border-color: #b9cff3;
    color: inherit;
    box-shadow: 0 10px 22px rgba(15, 23, 42, .07);
}

.dashboard-action-icon {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 13px;
    font-size: 1.15rem;
}

.dashboard-action-card.tone-danger .dashboard-action-icon {
    color: #c73549;
    background: #fff0f2;
}

.dashboard-action-card.tone-warning .dashboard-action-icon {
    color: #9a5d08;
    background: #fff5df;
}

.dashboard-action-card.tone-success .dashboard-action-icon {
    color: #08754b;
    background: #e9f8f1;
}

.dashboard-action-copy {
    min-width: 0;
}

.dashboard-action-copy small,
.dashboard-action-copy strong,
.dashboard-action-copy span {
    display: block;
}

.dashboard-action-copy small {
    color: #687991;
    font-size: .7rem;
    font-weight: 850;
    letter-spacing: .065em;
}

.dashboard-action-copy strong {
    margin-top: .2rem;
    color: #1a2c49;
    font-size: 1rem;
    font-weight: 800;
}

.dashboard-action-copy span {
    overflow: hidden;
    margin-top: .18rem;
    color: #7b879a;
    font-size: .82rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-action-arrow {
    color: #9aa8bb;
    font-size: .9rem;
}

@media (max-width: 1199.98px) {
    .dashboard-action-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .dashboard-action-heading {
        align-items: flex-start;
        flex-direction: column;
        padding: 1rem;
    }

    .dashboard-action-grid {
        padding: .75rem;
    }

    .dashboard-action-card {
        grid-template-columns: 42px minmax(0, 1fr);
        padding: .85rem;
    }

    .dashboard-action-icon {
        width: 42px;
        height: 42px;
    }

    .dashboard-action-arrow {
        display: none;
    }
}

/* V118 · dashboard collection and fleet control */
.dashboard-page-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.dashboard-page-eyebrow {
    display: block;
    margin-bottom: .3rem;
    color: #1267e6;
    font-size: .73rem;
    font-weight: 850;
    letter-spacing: .13em;
}

.dashboard-page-heading h1 {
    margin: 0;
    color: #142743;
    font-size: clamp(1.65rem, 2.1vw, 2.15rem);
    font-weight: 850;
    letter-spacing: -.035em;
}

.dashboard-page-heading p {
    margin: .3rem 0 0;
    color: #74849b;
    font-size: .96rem;
}

.dashboard-live-date {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    min-height: 38px;
    padding: .5rem .78rem;
    border: 1px solid #dbe5f3;
    border-radius: 11px;
    color: #52647f;
    background: #fff;
    font-size: .85rem;
    font-weight: 700;
    white-space: nowrap;
}

.dashboard-collection-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.dashboard-kpi-card {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: .95rem;
    align-items: center;
    min-width: 0;
    min-height: 132px;
    padding: 1.15rem 1.2rem;
    border: 1px solid #dfe7f2;
    border-radius: 19px;
    background: linear-gradient(145deg, #fff 0%, #fbfdff 100%);
    box-shadow: 0 11px 27px rgba(15, 35, 68, .055);
}

.dashboard-kpi-icon {
    display: grid;
    width: 52px;
    height: 52px;
    place-items: center;
    border-radius: 15px;
    font-size: 1.25rem;
}

.dashboard-kpi-card.tone-blue .dashboard-kpi-icon { color: #1769e0; background: #eaf2ff; }
.dashboard-kpi-card.tone-green .dashboard-kpi-icon { color: #078456; background: #e7f8f1; }
.dashboard-kpi-card.tone-red .dashboard-kpi-icon { color: #d33b4f; background: #fff0f2; }
.dashboard-kpi-card.tone-purple .dashboard-kpi-icon { color: #7054da; background: #f1edff; }

.dashboard-kpi-copy {
    min-width: 0;
}

.dashboard-kpi-copy small,
.dashboard-kpi-copy strong,
.dashboard-kpi-copy span {
    display: block;
}

.dashboard-kpi-copy small {
    color: #667892;
    font-size: .71rem;
    font-weight: 850;
    letter-spacing: .09em;
    white-space: nowrap;
}

.dashboard-kpi-copy strong {
    overflow: hidden;
    margin-top: .34rem;
    color: #142743;
    font-size: clamp(1.55rem, 2vw, 2rem);
    font-weight: 850;
    letter-spacing: -.04em;
    line-height: 1.08;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-kpi-copy span {
    overflow: hidden;
    margin-top: .42rem;
    color: #8290a5;
    font-size: .84rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-action-panel,
.dashboard-fleet-panel,
.dashboard-finance-panel {
    margin-bottom: 1.5rem;
}

.dashboard-action-grid {
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
}

.dashboard-action-copy span {
    white-space: normal;
}

.dashboard-fleet-panel,
.dashboard-finance-panel {
    overflow: hidden;
    border: 1px solid #dfe7f2;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .055);
}

.dashboard-fleet-heading,
.dashboard-finance-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.2rem 1.35rem;
    border-bottom: 1px solid #edf1f7;
}

.dashboard-fleet-heading h2,
.dashboard-finance-heading h2 {
    margin: 0;
    color: #172a49;
    font-size: 1.25rem;
    font-weight: 820;
    letter-spacing: -.02em;
}

.dashboard-fleet-heading p,
.dashboard-finance-heading p {
    margin: .24rem 0 0;
    color: #74839a;
    font-size: .87rem;
}

.dashboard-fleet-tools {
    display: flex;
    align-items: center;
    gap: .8rem;
}

.dashboard-fleet-counts {
    display: flex;
    align-items: center;
    gap: .45rem;
}

.dashboard-fleet-counts span {
    display: inline-flex;
    align-items: baseline;
    gap: .24rem;
    padding: .4rem .62rem;
    border: 1px solid #e0e8f4;
    border-radius: 999px;
    color: #687992;
    background: #f8fbff;
    font-size: .75rem;
    white-space: nowrap;
}

.dashboard-fleet-counts strong {
    color: #1d3558;
    font-size: .84rem;
}

.dashboard-fleet-table-wrap {
    width: 100%;
    overflow: hidden;
}

.dashboard-fleet-table {
    width: 100%;
    max-width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
}

.dashboard-fleet-table .fleet-col-vehicle { width: 21%; }
.dashboard-fleet-table .fleet-col-driver { width: 15%; }
.dashboard-fleet-table .fleet-col-today { width: 11%; }
.dashboard-fleet-table .fleet-col-deposit { width: 18%; }
.dashboard-fleet-table .fleet-col-odometer { width: 17%; }
.dashboard-fleet-table .fleet-col-health { width: 18%; }

.dashboard-fleet-table thead th {
    padding: .78rem 1rem;
    border-bottom: 1px solid #e5ebf4;
    color: #596a84;
    background: #f7f9fc;
    font-size: .69rem;
    font-weight: 850;
    letter-spacing: .065em;
    line-height: 1.25;
    text-transform: uppercase;
}

.dashboard-fleet-table tbody td {
    min-width: 0;
    padding: .92rem 1rem;
    border-bottom: 1px solid #e9eef5;
    color: #203451;
    font-size: .86rem;
    vertical-align: middle;
    overflow-wrap: anywhere;
}

.dashboard-fleet-table tbody tr:last-child td {
    border-bottom: 0;
}

.dashboard-fleet-table tbody tr:hover td {
    background: #fbfdff;
}

.dashboard-fleet-empty {
    padding: 2.25rem !important;
    color: #7a899f !important;
    text-align: center;
}

.fleet-vehicle-cell {
    display: flex;
    align-items: center;
    gap: .7rem;
    min-width: 0;
}

.fleet-vehicle-icon {
    display: grid;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid #d6e4fa;
    border-radius: 11px;
    color: #1267e6;
    background: #f0f6ff;
    font-size: 1rem;
}

.fleet-primary-copy {
    display: block;
    min-width: 0;
}

.fleet-primary-copy a,
.fleet-primary-copy strong {
    display: block;
    overflow: hidden;
    color: #1c304e;
    font-size: .88rem;
    font-weight: 800;
    line-height: 1.25;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fleet-primary-copy a:hover {
    color: #0b62df;
}

.fleet-primary-copy small,
.fleet-cell-note {
    display: block;
    overflow: hidden;
    margin-top: .24rem;
    color: #8190a5;
    font-size: .72rem;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fleet-status-badge {
    display: inline-flex;
    max-width: 100%;
    min-height: 27px;
    align-items: center;
    justify-content: center;
    gap: .28rem;
    padding: .3rem .56rem;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: .67rem;
    font-weight: 850;
    letter-spacing: .045em;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}

.fleet-status-badge i {
    font-size: .62rem;
}

.fleet-status-badge.tone-success { color: #08754b; border-color: #ccebdd; background: #eaf8f2; }
.fleet-status-badge.tone-warning { color: #9a5d08; border-color: #f3d9a1; background: #fff6e4; }
.fleet-status-badge.tone-danger { color: #bd3144; border-color: #f4c9cf; background: #fff0f2; }
.fleet-status-badge.tone-off { color: #1764ce; border-color: #cbdffc; background: #edf5ff; }
.fleet-status-badge.tone-neutral { color: #5f6f85; border-color: #dfe5ed; background: #f1f4f8; }

a.fleet-status-badge:hover {
    filter: brightness(.98);
    box-shadow: 0 3px 8px rgba(15, 23, 42, .07);
}

.fleet-cell-link {
    display: block;
    min-width: 0;
    color: inherit;
    text-decoration: none;
}

.fleet-health-stack {
    display: grid;
    gap: .35rem;
}

.fleet-health-line {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    gap: .35rem;
    color: #6f7f95;
    font-size: .7rem;
    text-decoration: none;
}

.fleet-health-line > span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fleet-health-line .fleet-status-badge {
    flex: 0 0 auto;
    min-height: 23px;
    padding: .25rem .45rem;
    font-size: .61rem;
}

.dashboard-finance-heading {
    align-items: flex-end;
}

.dashboard-chart-year {
    display: flex;
    align-items: center;
    gap: .55rem;
}

.dashboard-chart-year label {
    color: #718198;
    font-size: .76rem;
    font-weight: 750;
    white-space: nowrap;
}

.dashboard-chart-year .form-select {
    min-width: 96px;
    border-color: #d9e3f1;
    color: #263b59;
    font-weight: 700;
}

.dashboard-finance-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
    padding: 1rem 1.35rem 0;
}

.dashboard-finance-summary > span {
    padding: .72rem .85rem;
    border: 1px solid #e2e9f3;
    border-radius: 12px;
    background: #f9fbfe;
}

.dashboard-finance-summary small,
.dashboard-finance-summary strong {
    display: block;
}

.dashboard-finance-summary small {
    color: #75859b;
    font-size: .65rem;
    font-weight: 850;
    letter-spacing: .065em;
}

.dashboard-finance-summary strong {
    margin-top: .25rem;
    color: #203553;
    font-size: .98rem;
    font-weight: 800;
}

.dashboard-finance-summary .is-positive strong { color: #08754b; }
.dashboard-finance-summary .is-negative strong { color: #bd3144; }

.dashboard-finance-chart {
    height: 350px;
    padding: 1rem 1.2rem 1.2rem;
}

.dashboard-document-table-wrap {
    width: 100%;
    overflow: hidden;
}

.dashboard-document-table {
    width: 100%;
    table-layout: fixed;
}

@media (max-width: 1199.98px) {
    .dashboard-collection-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-action-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-fleet-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .dashboard-fleet-tools {
        width: 100%;
        justify-content: space-between;
    }

    .dashboard-fleet-table thead th,
    .dashboard-fleet-table tbody td {
        padding-right: .7rem;
        padding-left: .7rem;
    }

    .fleet-vehicle-icon {
        display: none;
    }
}

@media (max-width: 991.98px) {
    .dashboard-fleet-table .fleet-col-vehicle { width: 19%; }
    .dashboard-fleet-table .fleet-col-driver { width: 14%; }
    .dashboard-fleet-table .fleet-col-today { width: 12%; }
    .dashboard-fleet-table .fleet-col-deposit { width: 19%; }
    .dashboard-fleet-table .fleet-col-odometer { width: 18%; }
    .dashboard-fleet-table .fleet-col-health { width: 18%; }

    .dashboard-fleet-table thead th {
        padding: .68rem .48rem;
        font-size: .61rem;
        letter-spacing: .045em;
    }

    .dashboard-fleet-table tbody td {
        padding: .78rem .48rem;
        font-size: .77rem;
    }

    .fleet-primary-copy a,
    .fleet-primary-copy strong {
        font-size: .79rem;
    }

    .fleet-primary-copy small,
    .fleet-cell-note {
        font-size: .65rem;
    }

    .fleet-status-badge {
        min-height: 24px;
        padding: .27rem .42rem;
        font-size: .59rem;
        letter-spacing: .025em;
    }

    .fleet-health-line {
        font-size: .63rem;
    }

    .fleet-health-line .fleet-status-badge {
        font-size: .55rem;
    }
}

@media (max-width: 767.98px) {
    .dashboard-page-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .dashboard-collection-grid,
    .dashboard-action-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-kpi-card {
        min-height: 112px;
    }

    .dashboard-fleet-tools,
    .dashboard-fleet-counts {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .dashboard-fleet-table colgroup,
    .dashboard-fleet-table thead {
        display: none;
    }

    .dashboard-fleet-table,
    .dashboard-fleet-table tbody {
        display: block;
        width: 100%;
    }

    .dashboard-fleet-table tbody tr {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        margin: .75rem;
        border: 1px solid #e1e8f2;
        border-radius: 14px;
        overflow: hidden;
    }

    .dashboard-fleet-table tbody td {
        display: block;
        padding: .75rem;
        border-right: 1px solid #edf1f6;
        border-bottom: 1px solid #edf1f6;
        background: #fff;
    }

    .dashboard-fleet-table tbody td::before {
        display: block;
        margin-bottom: .42rem;
        color: #7b8aa0;
        content: attr(data-label);
        font-size: .58rem;
        font-weight: 850;
        letter-spacing: .06em;
        text-transform: uppercase;
    }

    .dashboard-fleet-table .dashboard-fleet-empty {
        grid-column: 1 / -1;
    }

    .dashboard-fleet-table .dashboard-fleet-empty::before {
        display: none;
    }

    .dashboard-fleet-table tbody td:nth-child(even) { border-right: 0; }
    .dashboard-fleet-table tbody td:nth-last-child(-n+2) { border-bottom: 0; }
    .dashboard-fleet-table tbody tr:hover td { background: #fff; }

    .fleet-primary-copy a,
    .fleet-primary-copy strong {
        font-size: .86rem;
    }

    .dashboard-finance-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .dashboard-finance-summary {
        grid-template-columns: 1fr;
    }

    .dashboard-finance-chart {
        height: 300px;
    }

    .dashboard-document-table {
        font-size: .72rem;
    }

    .dashboard-document-table th,
    .dashboard-document-table td {
        padding-right: .4rem;
        padding-left: .4rem;
        overflow-wrap: anywhere;
    }
}

@media (max-width: 479.98px) {
    .dashboard-fleet-table tbody tr {
        grid-template-columns: 1fr;
    }

    .dashboard-fleet-table tbody td,
    .dashboard-fleet-table tbody td:nth-child(even),
    .dashboard-fleet-table tbody td:nth-last-child(-n+2) {
        border-right: 0;
        border-bottom: 1px solid #edf1f6;
    }

    .dashboard-fleet-table tbody td:last-child {
        border-bottom: 0;
    }
}

/* V119 · Expenses monthly and custom date-range filters */
.expense-period-summary {
    overflow: hidden;
    color: #1b2f4d;
    font-size: clamp(1rem, 1.4vw, 1.28rem) !important;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.expense-filter-card .card-body {
    padding: 1rem 1.1rem 1.1rem;
}

.expense-filter-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .9rem;
    padding-bottom: .85rem;
    border-bottom: 1px solid #e9eef5;
}

.expense-filter-heading > div:first-child span,
.expense-filter-heading > div:first-child strong {
    display: block;
}

.expense-filter-heading > div:first-child span {
    color: #1769e0;
    font-size: .66rem;
    font-weight: 850;
    letter-spacing: .1em;
}

.expense-filter-heading > div:first-child strong {
    margin-top: .18rem;
    color: #203451;
    font-size: .98rem;
    font-weight: 800;
}

.expense-period-switch {
    display: inline-flex;
    gap: .25rem;
    padding: .25rem;
    border: 1px solid #dce5f2;
    border-radius: 11px;
    background: #f5f8fc;
}

.expense-period-switch a {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    padding: .42rem .72rem;
    border-radius: 8px;
    color: #687991;
    font-size: .78rem;
    font-weight: 750;
    text-decoration: none;
    white-space: nowrap;
}

.expense-period-switch a:hover {
    color: #155fc9;
}

.expense-period-switch a.active {
    color: #fff;
    background: #1769e0;
    box-shadow: 0 4px 10px rgba(23, 105, 224, .2);
}

.expense-filter-form .form-label {
    margin-bottom: .35rem;
    color: #697a92;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .045em;
    text-transform: uppercase;
}

.expense-filter-form .form-control,
.expense-filter-form .form-select {
    min-height: 43px;
    border-color: #dbe4f1;
    color: #263a58;
    font-size: .88rem;
}

.expense-filter-actions {
    display: flex;
    align-items: flex-end;
    gap: .5rem;
}

.expense-filter-actions .btn {
    min-height: 43px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

@media (max-width: 767.98px) {
    .expense-filter-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .expense-period-switch {
        width: 100%;
    }

    .expense-period-switch a {
        flex: 1 1 0;
    }
}

/* V122 · Premium, compact financial transaction ledger */
.report-transaction-card {
    overflow: hidden;
    border-color: #dfe7f2;
    box-shadow: 0 12px 34px rgba(25, 49, 85, .07);
}

.report-transaction-header {
    min-height: 94px;
    padding: 1.15rem 1.4rem;
    border-bottom: 1px solid #e8edf4 !important;
}

.report-transaction-icon {
    display: inline-grid;
    width: 48px;
    height: 48px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 14px;
    color: #087f4f;
    background: #e6f7ef;
    font-size: 1.15rem;
}

.report-transaction-count {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    padding: .45rem .78rem;
    border: 1px solid #dbe6f4;
    border-radius: 999px;
    color: #4f627e;
    background: #f8fbff;
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .065em;
}

.report-transaction-table {
    width: 100%;
    min-width: 900px;
    table-layout: fixed;
    color: #283b57;
    font-size: .84rem;
}

.report-transaction-table thead th {
    padding: .82rem .9rem;
    border-bottom: 1px solid #dfe6f0;
    color: #53647e;
    background: #f7f9fc;
    font-size: .66rem;
    font-weight: 850;
    letter-spacing: .075em;
    text-transform: uppercase;
    white-space: nowrap;
}

.report-transaction-table tbody td {
    height: 78px;
    padding: .88rem .9rem;
    border-color: #edf1f6;
    background: #fff;
    vertical-align: middle;
}

.report-transaction-table tbody tr:nth-child(even) td { background: #fbfcfe; }
.report-transaction-table tbody tr:hover td { background: #f5f8fc; }
.report-deposit-table th:nth-child(1) { width: 12%; }
.report-deposit-table th:nth-child(2) { width: 15%; }
.report-deposit-table th:nth-child(3) { width: 13%; }
.report-deposit-table th:nth-child(4) { width: 12%; }
.report-deposit-table th:nth-child(5) { width: 12%; }
.report-deposit-table th:nth-child(6) { width: 10%; }
.report-deposit-table th:nth-child(7) { width: 26%; }

.report-date-cell strong,
.report-date-cell span,
.report-vehicle-cell strong,
.report-vehicle-cell span,
.report-payment-meta,
.report-payment-note {
    display: block;
}

.report-date-cell strong,
.report-vehicle-cell strong,
.report-driver-cell strong {
    color: #203450;
    font-weight: 750;
}

.report-date-cell strong,
.report-money-cell { white-space: nowrap; }
.report-date-cell span,
.report-vehicle-cell span {
    margin-top: .16rem;
    color: #7b899d;
    font-size: .75rem;
}

.report-money-cell {
    color: #253955;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.report-money-cell.is-paid { color: #0d6844; font-weight: 850; }
.report-status-badge,
.report-payment-badge { padding: .42rem .65rem; font-size: .65rem; letter-spacing: .055em; }
.report-payment-cell { min-width: 0; }
.report-payment-meta { margin-top: .34rem; color: #708098; font-size: .71rem; }
.report-payment-meta strong { margin-right: .2rem; color: #455a78; font-size: .62rem; letter-spacing: .06em; }
.report-payment-note {
    overflow: hidden;
    margin-top: .26rem;
    color: #7a899e;
    font-size: .72rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.report-payment-empty { color: #9aa6b6; font-size: .76rem; }

.report-transaction-table tfoot th {
    padding: 1rem .9rem;
    border-top: 1px solid #dce4ef;
    color: #223752;
    background: #f5f8fc;
    font-size: .75rem;
    font-weight: 850;
    letter-spacing: .035em;
    white-space: nowrap;
}

@media (max-width: 1199.98px) {
    .report-transaction-table { min-width: 850px; font-size: .78rem; }
    .report-transaction-table thead th,
    .report-transaction-table tbody td,
    .report-transaction-table tfoot th { padding-right: .65rem; padding-left: .65rem; }
}

/* V123 · Premium Price Catalog */
.catalog-heading-icon,
.catalog-stat-icon,
.catalog-empty-icon {
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
}

.catalog-heading-icon {
    width: 54px;
    height: 54px;
    border: 1px solid #d9e6f8;
    border-radius: 16px;
    color: #155fc9;
    background: linear-gradient(145deg, #edf5ff, #f8fbff);
    font-size: 1.3rem;
}

.catalog-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.catalog-stat-card {
    display: flex;
    min-height: 116px;
    align-items: center;
    gap: .95rem;
    padding: 1.15rem;
    border: 1px solid #e0e8f3;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(25, 49, 85, .055);
}

.catalog-stat-icon {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    font-size: 1.05rem;
}

.catalog-stat-icon.tone-blue { color: #155fc9; background: #eaf2ff; }
.catalog-stat-icon.tone-indigo { color: #6842ce; background: #f0ebff; }
.catalog-stat-icon.tone-red { color: #bf3143; background: #fff0f1; }
.catalog-stat-icon.tone-green { color: #087a4b; background: #e5f7ef; }
.catalog-stat-card > div { min-width: 0; }
.catalog-stat-card small {
    display: block;
    color: #73839a;
    font-size: .65rem;
    font-weight: 850;
    letter-spacing: .075em;
}
.catalog-stat-card strong {
    display: block;
    margin: .18rem 0 .08rem;
    color: #203450;
    font-size: 1.45rem;
    line-height: 1.1;
}
.catalog-stat-card div > span { color: #8290a3; font-size: .72rem; }

.catalog-filter-card .form-label {
    margin-bottom: .36rem;
    color: #697b94;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.catalog-filter-card .form-control,
.catalog-filter-card .form-select,
.catalog-filter-card .btn { min-height: 43px; }

.catalog-table-card { overflow: hidden; }
.catalog-price-table {
    width: 100%;
    min-width: 900px;
    table-layout: fixed;
    color: #283b57;
    font-size: .79rem;
}
.catalog-price-table thead th {
    padding: .82rem .72rem;
    border-bottom: 1px solid #dfe6f0;
    color: #53647e;
    background: #f7f9fc;
    font-size: .63rem;
    font-weight: 850;
    letter-spacing: .07em;
    text-transform: uppercase;
    white-space: nowrap;
}
.catalog-price-table tbody td {
    height: 84px;
    padding: .82rem .72rem;
    border-color: #edf1f6;
    background: #fff;
}
.catalog-price-table tbody tr:nth-child(even) td { background: #fbfcfe; }
.catalog-price-table tbody tr:hover td { background: #f5f8fc; }
.catalog-price-table th:nth-child(1) { width: 12%; }
.catalog-price-table th:nth-child(2) { width: 18%; }
.catalog-price-table th:nth-child(3) { width: 11%; }
.catalog-price-table th:nth-child(4) { width: 12%; }
.catalog-price-table th:nth-child(5) { width: 17%; }
.catalog-price-table th:nth-child(6) { width: 10%; }
.catalog-price-table th:nth-child(7) { width: 11%; }
.catalog-price-table th:nth-child(8) { width: 9%; }

.catalog-primary,
.catalog-secondary,
.catalog-current-price,
.catalog-previous-price {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.catalog-primary { color: #243853; font-weight: 750; }
.catalog-secondary { margin-top: .22rem; color: #8491a3; font-size: .69rem; }
.catalog-category-pill,
.catalog-movement-pill {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    border-radius: 999px;
    font-weight: 800;
    white-space: nowrap;
}
.catalog-category-pill {
    overflow: hidden;
    padding: .36rem .58rem;
    color: #31527f;
    background: #edf3fb;
    font-size: .65rem;
    text-overflow: ellipsis;
}
.catalog-current-price,
.catalog-money {
    color: #203550;
    font-weight: 850;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.catalog-current-price { font-size: .86rem; }
.catalog-previous-price { margin-bottom: .32rem; color: #74839a; font-size: .68rem; }
.catalog-movement-pill { gap: .22rem; padding: .32rem .5rem; font-size: .59rem; letter-spacing: .025em; }
.catalog-movement-pill.tone-neutral { color: #59677b; background: #edf0f4; }
.catalog-movement-pill.tone-up { color: #a42b3a; background: #ffecef; }
.catalog-movement-pill.tone-down { color: #087247; background: #e5f7ee; }
.catalog-range {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: .35rem;
    color: #7a899d;
    font-size: .68rem;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.catalog-range strong { color: #2e435f; }
.catalog-empty-icon {
    width: 48px;
    height: 48px;
    margin: auto;
    border-radius: 14px;
    color: #6b84a8;
    background: #edf3fb;
    font-size: 1.15rem;
}

@media (max-width: 1199.98px) {
    .catalog-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .catalog-price-table { min-width: 860px; font-size: .73rem; }
    .catalog-price-table thead th,
    .catalog-price-table tbody td { padding-right: .52rem; padding-left: .52rem; }
    .catalog-range { align-items: flex-start; flex-direction: column; gap: .12rem; }
    .catalog-range i { display: none; }
}

@media (max-width: 767.98px) {
    .catalog-page-heading { align-items: flex-start !important; }
    .catalog-stat-grid { grid-template-columns: 1fr; }
    .catalog-stat-card { min-height: 104px; }
}

/* ===== V123 premium command workspace ===== */
.app-body {
    min-height: 100vh;
    overflow-x: hidden;
    background: #f3f6fb;
}

.app-shell {
    min-height: 100vh;
    display: flex;
    align-items: stretch;
}

.app-workspace {
    min-width: 0;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}

.app-sidebar.sidebar-shell {
    position: sticky;
    top: 0;
    z-index: 1035;
    flex: 0 0 238px;
    width: 238px;
    max-width: 238px;
    height: 100vh;
    padding: 0 14px 28px !important;
    overflow-x: hidden;
    overflow-y: auto;
    border: 0;
    color: #fff;
    background:
        radial-gradient(circle at 14% 2%, rgba(55, 124, 244, .4), transparent 18rem),
        linear-gradient(180deg, #0b2d68 0%, #071f4c 58%, #061a40 100%);
    box-shadow: 8px 0 30px rgba(15, 38, 80, .08);
}

.app-sidebar .sidebar-brand-panel {
    min-height: 84px;
    margin: 0 -14px 10px;
    padding: 11px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    background: transparent;
}

.app-sidebar .sidebar-brand-link {
    color: #fff;
}

.app-sidebar .sidebar-brand-link:hover,
.app-sidebar .sidebar-brand-link:focus {
    color: #fff;
}

.app-sidebar .sidebar-brand-logo {
    flex-basis: 49px;
    width: 49px;
    height: 49px;
    padding: 3px;
    border-radius: 13px;
    background: rgba(255, 255, 255, .97);
}

.app-sidebar .sidebar-brand-name {
    color: #fff;
    font-size: .96rem;
    font-weight: 800;
    letter-spacing: .07em;
}

.app-sidebar .sidebar-brand-subtitle {
    color: rgba(255, 255, 255, .57);
    font-size: .66rem;
    letter-spacing: .13em;
}

.app-sidebar .sidebar-collapse-btn {
    flex-basis: 31px;
    width: 31px;
    height: 31px;
    border-color: rgba(255, 255, 255, .15);
    color: rgba(255, 255, 255, .76);
    background: rgba(255, 255, 255, .07);
    box-shadow: none;
}

.app-sidebar .sidebar-collapse-btn:hover,
.app-sidebar .sidebar-collapse-btn:focus-visible {
    border-color: rgba(255, 255, 255, .26);
    color: #fff;
    background: rgba(255, 255, 255, .13);
}

.app-sidebar .sidebar-nav {
    gap: 3px;
}

.app-sidebar .sidebar-nav-group {
    gap: 3px;
    margin-top: 18px;
}

.app-sidebar .sidebar-group-label {
    padding: 0 12px 6px;
    color: rgba(255, 255, 255, .4);
    font-size: .71rem;
    letter-spacing: .15em;
}

.app-sidebar.sidebar .sidebar-nav-link {
    min-height: 48px;
    gap: 11px;
    padding: 6px 9px !important;
    border-radius: 12px !important;
    color: rgba(255, 255, 255, .7) !important;
    font-size: .94rem;
    font-weight: 600;
    line-height: 1.25;
}

.app-sidebar.sidebar .sidebar-nav-link:hover,
.app-sidebar.sidebar .sidebar-nav-link:focus {
    color: #fff !important;
    background: rgba(255, 255, 255, .08) !important;
}

.app-sidebar.sidebar .sidebar-nav-link.active {
    color: #fff !important;
    background: rgba(255, 255, 255, .14) !important;
    box-shadow: inset 3px 0 0 #72a7ff !important;
}

.app-sidebar.sidebar .sidebar-nav-link::before {
    display: none;
}

.app-sidebar .sidebar-nav-icon {
    flex-basis: 34px;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 9px;
    color: rgba(255, 255, 255, .78);
    background: rgba(255, 255, 255, .07);
    box-shadow: none;
    font-size: 1rem;
}

.app-sidebar .sidebar-nav-link.active .sidebar-nav-icon {
    color: #fff;
    border: 0;
    background: rgba(255, 255, 255, .13);
}

.app-navbar {
    z-index: 1025;
    min-height: 76px;
    padding: 0 !important;
    border-bottom: 1px solid #e2e8f1;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 5px 20px rgba(15, 38, 80, .045);
    backdrop-filter: blur(12px);
}

.app-navbar-grid {
    min-height: 76px;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.app-navbar-left,
.app-navbar-right {
    display: flex;
    align-items: center;
}

.app-navbar-left {
    min-width: 0;
    gap: 12px;
}

.app-navbar-right {
    flex: 0 0 auto;
    justify-content: flex-end;
    gap: 10px;
}

.app-workspace-heading {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.app-workspace-heading > span {
    color: #0757df;
    font-size: .59rem;
    font-weight: 800;
    letter-spacing: .16em;
    line-height: 1;
}

.app-workspace-heading > strong {
    overflow: hidden;
    color: #172741;
    font-size: 1rem;
    font-weight: 750;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-current-date {
    min-height: 39px;
    align-items: center;
    gap: 8px;
    padding: 0 12px;
    border: 1px solid #dfe6f0;
    border-radius: 11px;
    color: #718096;
    background: #f8fafd;
    font-size: .72rem;
}

.app-profile-link {
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 3px 9px 3px 4px;
    border-radius: 12px;
    color: #243650;
    text-decoration: none;
    transition: background-color .15s ease;
}

.app-profile-link:hover,
.app-profile-link:focus {
    color: #16365f;
    background: #f1f5fb;
}

.app-profile-avatar {
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    display: inline-grid;
    place-items: center;
    border-radius: 11px;
    color: #fff;
    background: linear-gradient(145deg, #1466ea, #0a3f9f);
    box-shadow: 0 7px 16px rgba(7, 87, 223, .2);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .04em;
}

.app-profile-copy {
    min-width: 0;
    flex-direction: column;
    line-height: 1.2;
}

.app-profile-copy strong {
    max-width: 130px;
    overflow: hidden;
    font-size: .72rem;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-profile-copy span {
    margin-top: 3px;
    color: #8290a3;
    font-size: .62rem;
}

.app-logout-link,
.app-mobile-menu {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 1px solid #dfe6f0;
    border-radius: 11px;
    background: #fff;
    font-size: 1rem;
    transition: color .15s ease, border-color .15s ease, background-color .15s ease;
}

.app-logout-link {
    display: inline-grid;
    color: #b72d3e;
    text-decoration: none;
}

.app-mobile-menu {
    display: inline-grid;
    color: #16365f;
}

.app-logout-link:hover,
.app-logout-link:focus {
    border-color: #efbdc4;
    color: #a82033;
    background: #fff4f5;
}

.app-mobile-menu:hover,
.app-mobile-menu:focus {
    border-color: #bdd0f5;
    color: #0757df;
    background: #f2f7ff;
}

.app-workspace .main-shell {
    min-height: calc(100vh - 76px);
    flex: 1 1 auto;
    width: 100%;
    padding: 26px 28px 54px !important;
}

body.sidebar-collapsed .app-sidebar.sidebar-shell {
    flex-basis: 78px;
    width: 78px;
    max-width: 78px;
    padding-right: 9px !important;
    padding-left: 9px !important;
}

body.sidebar-collapsed .app-sidebar .sidebar-brand-panel {
    min-height: 84px;
    margin-right: -9px;
    margin-left: -9px;
    padding: 9px 3px;
}

body.sidebar-collapsed .app-sidebar .sidebar-brand-logo {
    flex-basis: 47px;
    width: 47px;
    height: 47px;
}

body.sidebar-collapsed .app-sidebar .sidebar-collapse-btn {
    width: 28px;
    height: 28px;
}

body.sidebar-collapsed .app-workspace .main-shell {
    width: 100%;
}

#sidebarMobile {
    --bs-offcanvas-width: min(310px, 88vw);
    color: #fff;
    border: 0;
    background:
        radial-gradient(circle at 14% 2%, rgba(55, 124, 244, .4), transparent 18rem),
        linear-gradient(180deg, #0b2d68 0%, #071f4c 58%, #061a40 100%);
}

#sidebarMobile .offcanvas-header {
    min-height: 70px;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
}

#sidebarMobile .offcanvas-title {
    color: #fff;
    font-size: .9rem;
    font-weight: 800;
    letter-spacing: .07em;
}

#sidebarMobile .offcanvas-subtitle {
    margin-top: 3px;
    color: rgba(255, 255, 255, .5);
    font-size: .58rem;
    font-weight: 700;
    letter-spacing: .13em;
}

#sidebarMobile .sidebar-brand-panel {
    display: none;
}

#sidebarMobile .sidebar-group-label {
    color: rgba(255, 255, 255, .4);
    font-size: .71rem;
}

#sidebarMobile .sidebar-nav-link {
    min-height: 50px;
    color: rgba(255, 255, 255, .72) !important;
    background: transparent !important;
    font-size: .96rem;
}

#sidebarMobile .sidebar-nav-link:hover,
#sidebarMobile .sidebar-nav-link:focus,
#sidebarMobile .sidebar-nav-link.active {
    color: #fff !important;
    background: rgba(255, 255, 255, .12) !important;
}

#sidebarMobile .sidebar-nav-icon,
#sidebarMobile .sidebar-nav-link.active .sidebar-nav-icon {
    border: 0;
    color: rgba(255, 255, 255, .86);
    background: rgba(255, 255, 255, .08);
}

/* V123 approved login concept */
.login-page {
    min-height: 100vh;
    padding: 30px;
    background:
        radial-gradient(circle at 8% 8%, rgba(7, 87, 223, .13), transparent 30rem),
        radial-gradient(circle at 92% 92%, rgba(13, 79, 196, .1), transparent 28rem),
        linear-gradient(135deg, #f7faff, #edf3fc 55%, #f8fafc);
}

.premium-login-shell {
    width: min(1280px, 100%);
    min-height: 680px;
    grid-template-columns: minmax(0, 1.15fr) minmax(390px, .85fr);
    border: 1px solid rgba(135, 158, 194, .25);
    border-radius: 30px;
    background:
        radial-gradient(circle at 15% 0%, rgba(31, 111, 247, .74), transparent 35%),
        linear-gradient(145deg, #071f4c 0%, #0b2e6d 48%, #073e9f 100%);
    box-shadow: 0 34px 90px rgba(15, 38, 80, .21), 0 10px 30px rgba(15, 23, 42, .08);
}

.premium-login-brand {
    padding: 45px 48px 38px;
    background: transparent;
}

.premium-login-brand::before {
    width: 430px;
    height: 430px;
    top: 84px;
    right: -165px;
    box-shadow: 0 0 0 44px rgba(255, 255, 255, .025), 0 0 0 88px rgba(255, 255, 255, .018);
}

.premium-login-brand::after {
    width: 480px;
    height: 480px;
    bottom: -330px;
    left: -250px;
    box-shadow: none;
}

.premium-login-brand-content {
    flex-direction: row;
    align-items: center;
    gap: 14px;
    text-align: left;
}

.premium-login-logo-frame {
    flex: 0 0 76px;
    width: 76px;
    height: 76px;
    margin: 0;
    padding: 6px;
    border: 0;
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(2, 20, 58, .24);
}

.premium-login-wordmark {
    font-size: 1.12rem;
    letter-spacing: .09em;
}

.premium-login-brand-subtitle {
    margin-top: 5px;
    font-size: .58rem;
    letter-spacing: .17em;
}

.premium-login-story-copy {
    max-width: 630px;
    padding: 42px 0;
}

.premium-login-story-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 17px;
    color: #a9ccff;
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .18em;
}

.premium-login-story-copy h1 {
    max-width: 600px;
    margin: 0;
    color: #fff;
    font-size: clamp(2.7rem, 4.4vw, 4.55rem);
    font-weight: 800;
    line-height: 1.02;
    letter-spacing: -.05em;
}

.premium-login-story-copy p {
    max-width: 555px;
    margin: 23px 0 0;
    color: rgba(255, 255, 255, .74);
    font-size: 1rem;
    line-height: 1.68;
}

.premium-login-feature-row {
    justify-content: flex-start;
}

.premium-login-feature-row span {
    padding: 9px 13px;
    color: rgba(255, 255, 255, .82);
    background: rgba(255, 255, 255, .07);
}

.premium-login-form-panel {
    align-self: stretch;
    margin: 28px;
    padding: 54px;
    border-radius: 28px;
    background: rgba(255, 255, 255, .985);
    box-shadow: 0 24px 60px rgba(0, 0, 0, .18);
}

.premium-login-heading h1 {
    color: #10213f;
    font-size: clamp(2rem, 3vw, 2.45rem);
}

.premium-login-heading p {
    color: #70809a;
}

.premium-login-eyebrow {
    display: inline-flex;
    align-items: center;
    color: #0757df;
}

.premium-login-input-wrap input {
    background: #f7f9fd;
}

.premium-login-security {
    margin-top: 24px;
}

.premium-login-footer {
    margin-top: 22px;
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    .app-sidebar.sidebar-shell {
        flex-basis: 78px;
        width: 78px;
        max-width: 78px;
        padding-right: 9px !important;
        padding-left: 9px !important;
    }

    .app-sidebar .sidebar-brand-panel {
        min-height: 78px;
        justify-content: center;
        margin-right: -9px;
        margin-left: -9px;
        padding: 8px 3px;
    }

    .app-sidebar .sidebar-brand-link {
        flex: 0 0 auto;
        justify-content: center;
    }

    .app-sidebar .sidebar-brand-logo {
        flex-basis: 47px;
        width: 47px;
        height: 47px;
    }

    .app-sidebar .sidebar-brand-copy,
    .app-sidebar .sidebar-collapse-btn,
    .app-sidebar .sidebar-group-label,
    .app-sidebar .sidebar-nav-label,
    .app-sidebar .sidebar-status-dot {
        display: none;
    }

    .app-sidebar .sidebar-nav-group {
        margin-top: 9px;
    }

    .app-sidebar.sidebar .sidebar-nav-link {
        justify-content: center;
        padding: 6px !important;
    }
}

@media (max-width: 899.98px) {
    .premium-login-shell {
        width: min(560px, 100%);
        display: block;
        min-height: auto;
        border-radius: 25px;
        background: #fff;
    }

    .premium-login-brand {
        display: none;
    }

    .premium-login-form-panel {
        margin: 0;
        padding: 42px 48px 38px;
        border-radius: 25px;
        box-shadow: none;
    }
}

@media (max-width: 767.98px) {
    .app-navbar,
    .app-navbar-grid {
        min-height: 68px;
    }

    .app-navbar-grid {
        padding: 0 14px;
        gap: 10px;
    }

    .app-workspace-heading > span {
        font-size: .52rem;
    }

    .app-workspace-heading > strong {
        max-width: 42vw;
        font-size: .88rem;
    }

    .app-profile-link {
        padding-right: 3px;
    }

    .app-profile-avatar {
        width: 36px;
        height: 36px;
        flex-basis: 36px;
    }

    .app-logout-link,
    .app-mobile-menu {
        width: 38px;
        height: 38px;
        flex-basis: 38px;
    }

    .app-workspace .main-shell {
        min-height: calc(100vh - 68px);
        padding: 18px 14px 42px !important;
    }
}

@media (max-width: 575.98px) {
    .login-page {
        padding: 0;
        background: #fff;
    }

    .premium-login-shell,
    .premium-login-form-panel {
        min-height: 100vh;
        border-radius: 0;
    }

    .premium-login-form-panel {
        padding: 30px 23px;
    }

    .premium-login-mobile-brand {
        margin-bottom: 32px;
    }

    .premium-login-heading h1 {
        font-size: 1.9rem;
    }
}

/* ===== V125 sharp premium navy interface =====
   Visual-only refinement. Existing BRO TRANS logo asset/content is unchanged. */
:root {
    --v125-navy-950: #031634;
    --v125-navy-900: #052451;
    --v125-navy-850: #073069;
    --v125-royal: #0a63f3;
    --v125-royal-strong: #0757df;
    --v125-sky: #4b93ff;
    --v125-surface: #ffffff;
    --v125-canvas: #eef3fa;
    --v125-line: #dce5f1;
    --v125-text: #162844;
}

.app-body {
    background:
        radial-gradient(circle at 86% 7%, rgba(10, 99, 243, .09), transparent 25rem),
        linear-gradient(180deg, #f4f7fc 0%, #edf2f8 100%);
}

.app-sidebar.sidebar-shell {
    background:
        radial-gradient(circle at 10% -2%, rgba(75, 147, 255, .30), transparent 17rem),
        linear-gradient(180deg, var(--v125-navy-900) 0%, var(--v125-navy-950) 100%);
    box-shadow: 10px 0 34px rgba(3, 22, 52, .14);
}

.app-sidebar .sidebar-brand-panel {
    border-bottom-color: rgba(255, 255, 255, .13);
}

/* Preserve the original logo file; only its surrounding frame is refined. */
.app-sidebar .sidebar-brand-logo {
    box-shadow: 0 7px 18px rgba(0, 0, 0, .18);
}

.app-sidebar .sidebar-brand-name {
    color: #ffffff;
}

.app-sidebar .sidebar-brand-subtitle {
    color: rgba(210, 226, 255, .66);
}

.app-sidebar .sidebar-group-label {
    color: #76aaff;
}

.app-sidebar.sidebar .sidebar-nav-link {
    color: rgba(232, 240, 255, .78) !important;
}

.app-sidebar.sidebar .sidebar-nav-link:hover,
.app-sidebar.sidebar .sidebar-nav-link:focus {
    color: #ffffff !important;
    background: rgba(73, 139, 255, .13) !important;
}

.app-sidebar.sidebar .sidebar-nav-link.active {
    color: #ffffff !important;
    background: linear-gradient(135deg, #0b67f5 0%, #0757df 100%) !important;
    box-shadow:
        inset 3px 0 0 #80b2ff,
        0 9px 22px rgba(0, 62, 165, .30) !important;
}

.app-sidebar .sidebar-nav-icon {
    color: #dbe9ff;
    background: rgba(255, 255, 255, .075);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .035);
}

.app-sidebar .sidebar-nav-link.active .sidebar-nav-icon {
    color: #ffffff;
    background: rgba(255, 255, 255, .15);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .09);
}

.app-navbar {
    border-bottom: 1px solid rgba(100, 145, 214, .23);
    color: #ffffff;
    background:
        radial-gradient(circle at 82% -40%, rgba(45, 119, 255, .28), transparent 24rem),
        linear-gradient(90deg, #061c43 0%, #082b60 52%, #041a3d 100%);
    box-shadow: 0 8px 26px rgba(3, 22, 52, .15);
    backdrop-filter: none;
}

.app-workspace-heading > span {
    color: #7fb2ff;
}

.app-workspace-heading > strong {
    color: #ffffff;
}

.app-current-date {
    border-color: rgba(255, 255, 255, .14);
    color: rgba(232, 240, 255, .82);
    background: rgba(255, 255, 255, .075);
}

.app-profile-link {
    color: #ffffff;
}

.app-profile-link:hover,
.app-profile-link:focus {
    color: #ffffff;
    background: rgba(255, 255, 255, .09);
}

.app-profile-copy span {
    color: rgba(216, 228, 247, .68);
}

.app-profile-avatar {
    background: linear-gradient(145deg, #2d83ff, #0757df);
    box-shadow: 0 8px 18px rgba(0, 68, 190, .32);
}

.app-logout-link,
.app-mobile-menu {
    border-color: rgba(255, 255, 255, .17);
    background: rgba(255, 255, 255, .075);
}

.app-mobile-menu {
    color: #ffffff;
}

.app-mobile-menu:hover,
.app-mobile-menu:focus {
    border-color: rgba(126, 177, 255, .55);
    color: #ffffff;
    background: rgba(69, 135, 255, .18);
}

.app-logout-link {
    color: #ff8d9b;
}

.app-logout-link:hover,
.app-logout-link:focus {
    border-color: rgba(255, 141, 155, .48);
    color: #ffffff;
    background: rgba(217, 49, 72, .20);
}

.app-workspace .main-shell {
    background:
        radial-gradient(circle at 89% 4%, rgba(10, 99, 243, .055), transparent 25rem),
        linear-gradient(180deg, #f4f7fc 0%, #edf2f8 100%);
}

/* Sharper separation for existing premium cards without changing layout/content. */
.app-page .card,
.app-page .premium-page-header,
.app-page .annual-insight-shell,
.app-page .annual-performance-shell,
.app-page .table-card,
.app-page .stat-card {
    border-color: rgba(205, 217, 234, .92);
    box-shadow: 0 12px 30px rgba(18, 49, 94, .075);
}

#sidebarMobile {
    background:
        radial-gradient(circle at 10% -2%, rgba(75, 147, 255, .30), transparent 17rem),
        linear-gradient(180deg, var(--v125-navy-900) 0%, var(--v125-navy-950) 100%);
}

/* ===== V126 restore BRO TRANS masthead =====
   Keeps the premium navy palette while restoring the original top brand treatment. */
.app-navbar .app-header-title {
    justify-self: center;
    display: flex;
    align-items: center;
    gap: clamp(.9rem, 2vw, 1.55rem);
    min-width: 0;
    color: #ffffff;
    white-space: nowrap;
}

.app-navbar .app-header-title:hover,
.app-navbar .app-header-title:focus {
    color: #ffffff;
}

.app-header-title-copy {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 0;
    line-height: 1;
}

.app-navbar .app-header-title-text {
    color: #ffffff;
    font-size: clamp(2rem, 3.15vw, 3.45rem);
    font-weight: 800;
    line-height: .96;
    letter-spacing: .075em;
    text-shadow: 0 2px 10px rgba(0, 0, 0, .13);
}

.app-header-title-subtitle {
    margin-top: .62rem;
    color: rgba(226, 237, 255, .84);
    font-size: clamp(.56rem, .7vw, .72rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: .46em;
    padding-left: .46em;
}

.app-navbar .app-header-rule {
    width: clamp(62px, 10.5vw, 170px);
    height: 2px;
    background: #1482ff;
    box-shadow: 0 0 12px rgba(20, 130, 255, .22);
}

.app-navbar .app-header-rule:first-child {
    background: #1482ff;
}

.app-navbar .app-header-rule::after {
    width: 6px;
    height: 6px;
    background: #1482ff;
    box-shadow: 0 0 8px rgba(20, 130, 255, .34);
}

@media (max-width: 1199.98px) {
    .app-navbar .app-header-title {
        gap: .85rem;
    }
    .app-navbar .app-header-rule {
        width: clamp(42px, 7vw, 90px);
    }
    .app-navbar .app-header-title-text {
        font-size: clamp(1.7rem, 3vw, 2.55rem);
    }
    .app-header-title-subtitle {
        letter-spacing: .34em;
    }
}

@media (max-width: 991.98px) {
    .app-navbar .app-header-rule {
        display: none;
    }
    .app-navbar .app-header-title-text {
        font-size: 1.35rem;
        letter-spacing: .06em;
    }
    .app-header-title-subtitle {
        margin-top: .35rem;
        font-size: .48rem;
        letter-spacing: .22em;
    }
}

@media (max-width: 575.98px) {
    .app-navbar .app-header-title-text {
        font-size: 1.05rem;
    }
    .app-header-title-subtitle {
        display: none;
    }
}

/* ===== V127 compact centered BRO TRANS masthead =====
   Keeps the approved premium navy header, original BRO TRANS wordmark treatment,
   blue side rules, profile controls, and existing page content. Only the masthead
   scale/spacing is tightened so it feels proportional and professional. */
.app-navbar {
    min-height: 78px;
}

.app-navbar-grid {
    min-height: 78px;
    padding-top: 0;
    padding-bottom: 0;
}

.app-navbar .app-header-title {
    gap: clamp(.6rem, 1.2vw, .95rem);
}

.app-navbar .app-header-title-text {
    font-size: clamp(1.55rem, 2.15vw, 2.25rem);
    line-height: .98;
    letter-spacing: .08em;
}

.app-header-title-subtitle {
    margin-top: .38rem;
    font-size: clamp(.48rem, .56vw, .62rem);
    letter-spacing: .40em;
    padding-left: .40em;
}

.app-navbar .app-header-rule {
    width: clamp(118px, 17.6vw, 280px);
    height: 2px;
}

@media (max-width: 1199.98px) {
    .app-navbar .app-header-title {
        gap: .58rem;
    }
    .app-navbar .app-header-rule {
        width: clamp(82px, 11.8vw, 162px);
    }
    .app-navbar .app-header-title-text {
        font-size: clamp(1.4rem, 2.2vw, 1.85rem);
    }
    .app-header-title-subtitle {
        margin-top: .32rem;
        font-size: .48rem;
        letter-spacing: .30em;
        padding-left: .30em;
    }
}

@media (max-width: 991.98px) {
    .app-navbar,
    .app-navbar-grid {
        min-height: 70px;
    }
    .app-navbar .app-header-title-text {
        font-size: 1.18rem;
    }
    .app-header-title-subtitle {
        margin-top: .25rem;
        font-size: .43rem;
        letter-spacing: .20em;
        padding-left: .20em;
    }
}

/* ===== V129 unified OBD-blue page hero =====
   Visual-only: applies the BRO OBD Doctor blue treatment to page title/header areas
   while preserving existing page content, layout, buttons and behavior. */
.premium-page-header {
    border-color: rgba(20, 121, 255, .24) !important;
    background:
        radial-gradient(circle at 90% 5%, rgba(255,255,255,.12), transparent 13rem),
        linear-gradient(135deg, #0c2c5c 0%, #0d4fc4 58%, #1479ff 100%) !important;
    box-shadow: 0 16px 36px rgba(12, 44, 92, .18) !important;
}

.premium-page-header::before {
    background: linear-gradient(180deg, #7fc5ff 0%, #39a2ff 100%) !important;
    box-shadow: 0 0 16px rgba(73, 169, 255, .28);
}

.premium-page-header::after {
    border-color: rgba(255,255,255,.10) !important;
    box-shadow: 0 0 0 28px rgba(255,255,255,.035) !important;
}

.premium-page-header .page-title,
.premium-page-header h1,
.premium-page-header h2,
.premium-page-header h3 {
    color: #ffffff !important;
}

.premium-page-header p,
.premium-page-header .text-secondary,
.premium-page-header .text-muted,
.premium-page-header small {
    color: #dbeafe !important;
    opacity: .94;
}

.premium-page-header .premium-page-kicker {
    color: #a9d7ff !important;
}

.premium-page-header .premium-page-kicker i {
    border-color: rgba(255,255,255,.20) !important;
    color: #ffffff !important;
    background: rgba(255,255,255,.12) !important;
}

/* Keep page actions crisp and readable on the blue hero. */
.premium-page-header .btn-primary,
.premium-page-header .btn-dark {
    border-color: #ffffff !important;
    color: #0d4fc4 !important;
    background: #ffffff !important;
    box-shadow: 0 8px 18px rgba(5, 27, 68, .18) !important;
}

.premium-page-header .btn-primary:hover,
.premium-page-header .btn-primary:focus,
.premium-page-header .btn-dark:hover,
.premium-page-header .btn-dark:focus {
    border-color: #eaf4ff !important;
    color: #093b94 !important;
    background: #eaf4ff !important;
}

.premium-page-header .btn-outline-primary,
.premium-page-header .btn-outline-dark,
.premium-page-header .btn-outline-secondary {
    border-color: rgba(255,255,255,.55) !important;
    color: #ffffff !important;
    background: rgba(255,255,255,.08) !important;
}

.premium-page-header .btn-outline-primary:hover,
.premium-page-header .btn-outline-dark:hover,
.premium-page-header .btn-outline-secondary:hover {
    border-color: #ffffff !important;
    color: #0d4fc4 !important;
    background: #ffffff !important;
}

/* Purpose-built Maintenance / Compliance headers use their own hero class. */
.maintenance-control-hero,
.compliance-control-hero {
    border-color: rgba(20, 121, 255, .24) !important;
    background:
        radial-gradient(circle at 90% 0%, rgba(255,255,255,.12), transparent 13rem),
        linear-gradient(135deg, #0c2c5c 0%, #0d4fc4 58%, #1479ff 100%) !important;
    box-shadow: 0 16px 36px rgba(12, 44, 92, .18) !important;
    overflow: hidden;
}

.maintenance-control-hero .maintenance-control-title h1,
.compliance-control-hero .maintenance-control-title h1 {
    color: #ffffff !important;
}

.maintenance-control-hero .maintenance-control-title p,
.compliance-control-hero .maintenance-control-title p {
    color: #dbeafe !important;
}

.maintenance-control-hero .maintenance-control-icon,
.compliance-control-hero .maintenance-control-icon {
    border-color: rgba(255,255,255,.22) !important;
    color: #ffffff !important;
    background: rgba(255,255,255,.12) !important;
}

.maintenance-control-hero .btn-primary,
.maintenance-control-hero .btn-dark,
.compliance-control-hero .btn-primary,
.compliance-control-hero .btn-dark {
    border-color: #ffffff !important;
    color: #0d4fc4 !important;
    background: #ffffff !important;
}

.maintenance-control-hero .btn-outline-primary,
.maintenance-control-hero .btn-outline-dark,
.maintenance-control-hero .btn-outline-secondary,
.compliance-control-hero .btn-outline-primary,
.compliance-control-hero .btn-outline-dark,
.compliance-control-hero .btn-outline-secondary {
    border-color: rgba(255,255,255,.55) !important;
    color: #ffffff !important;
    background: rgba(255,255,255,.08) !important;
}


/* ===== V131 unified header sizing =====
   Normalizes page hero/header sizes across standard pages,
   Maintenance, Vehicle Compliance, and other special headers. */
:root {
    --bt-header-title-size: clamp(1.55rem, 2.1vw, 2rem);
    --bt-header-copy-size: .96rem;
    --bt-header-min-height: 96px;
    --bt-header-title-line: 1.08;
}

.premium-page-header {
    min-height: var(--bt-header-min-height);
}

.premium-page-header .page-title,
.premium-page-header h1,
.premium-page-header h2,
.premium-page-header h3 {
    font-size: var(--bt-header-title-size) !important;
    line-height: var(--bt-header-title-line) !important;
}

.premium-page-header p,
.premium-page-header .text-secondary,
.premium-page-header .text-muted,
.premium-page-header small {
    font-size: var(--bt-header-copy-size) !important;
    line-height: 1.55;
}

.maintenance-control-hero,
.compliance-control-hero {
    min-height: var(--bt-header-min-height);
    padding: 20px 24px 20px 24px;
}

.maintenance-control-title h1,
.compliance-control-hero .maintenance-control-title h1,
.maintenance-control-hero .maintenance-control-title h1 {
    font-size: var(--bt-header-title-size) !important;
    line-height: var(--bt-header-title-line) !important;
    font-weight: 800;
}

.maintenance-control-title p,
.compliance-control-hero .maintenance-control-title p,
.maintenance-control-hero .maintenance-control-title p {
    font-size: var(--bt-header-copy-size) !important;
    line-height: 1.55;
}

.maintenance-control-icon,
.compliance-control-hero .maintenance-control-icon,
.maintenance-control-hero .maintenance-control-icon {
    width: 50px;
    height: 50px;
    flex-basis: 50px;
}

@media (max-width: 767.98px) {
    .maintenance-control-hero,
    .compliance-control-hero {
        padding: 18px 20px;
    }
}


/* ===== V133 driver snapshot ===== */
.driver-snapshot-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 420px);
    gap: 20px;
    align-items: start;
}

.driver-snapshot-main {
    min-width: 0;
}

.driver-snapshot-profile-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 22px 24px;
    margin-bottom: 18px;
    border: 1px solid #e2eaf5;
    border-radius: 22px;
    background: linear-gradient(135deg, #ffffff 0%, #f9fbff 70%, #eff5ff 100%);
    box-shadow: var(--ui-shadow);
}

.driver-snapshot-profile {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
}

.driver-snapshot-avatar,
.driver-share-avatar {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: linear-gradient(135deg, #dceaff 0%, #7fb3ff 100%);
    color: #0b2f61;
    font-size: 1.7rem;
    font-weight: 800;
    box-shadow: inset 0 0 0 5px rgba(255,255,255,.5);
}

.driver-snapshot-identity h2 {
    margin: 0;
    color: var(--ui-navy);
    font-size: 1.6rem;
    font-weight: 800;
}

.driver-snapshot-identity p {
    margin: .35rem 0 0;
    color: var(--ui-muted);
}

.driver-snapshot-vehicle-card {
    min-width: 220px;
    padding: 16px 18px;
    border-radius: 18px;
    background: linear-gradient(135deg, #0c2c5c 0%, #0d4fc4 58%, #1479ff 100%);
    color: #fff;
    box-shadow: 0 12px 24px rgba(12, 44, 92, .18);
}

.driver-snapshot-vehicle-card small {
    display: block;
    margin-bottom: 6px;
    color: rgba(219, 234, 254, .92);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .14em;
}

.driver-snapshot-vehicle-card strong,
.driver-snapshot-vehicle-card span {
    display: block;
}

.driver-snapshot-vehicle-card strong {
    font-size: 1.15rem;
    letter-spacing: .02em;
}

.driver-snapshot-vehicle-card span {
    margin-top: 4px;
    font-size: 1rem;
    color: rgba(255,255,255,.92);
}

.driver-snapshot-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.driver-snapshot-metric {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 20px 18px;
    border-radius: 20px;
    border: 1px solid #e2eaf5;
    background: #fff;
    box-shadow: var(--ui-shadow);
}

/* V165: center the complete metric text block while keeping the icon tile fixed. */
.driver-snapshot-metric > div {
    flex: 1 1 auto;
    min-width: 0;
    text-align: center;
}


.driver-snapshot-icon {
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: #eef4ff;
    color: #0d4fc4;
    font-size: 2.55rem;
    overflow: hidden;
}

/* V163: make the icon glyph fill the tile more fully while staying centered. */
.driver-snapshot-metric .driver-snapshot-icon {
    margin-top: 0;
    font-size: 2.55rem;
    line-height: 1;
}

.driver-snapshot-icon i {
    display: block;
    font-size: 2.55rem;
    line-height: 1;
    transform: scale(1.08);
    transform-origin: center;
}

.driver-snapshot-metric small {
    display: block;
    margin-bottom: 6px;
    text-align: center;
    color: #6c7a92;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.driver-snapshot-metric strong {
    display: block;
    color: var(--ui-navy);
    font-size: 1.5rem;
    line-height: 1.12;
    text-align: center;
}

.driver-snapshot-metric span {
    display: block;
    margin-top: 6px;
    text-align: center;
    color: var(--ui-muted);
    font-size: .93rem;
    line-height: 1.45;
}

.driver-snapshot-metric.tone-success .driver-snapshot-icon { background: #eaf8f1; color: #087443; }
.driver-snapshot-metric.tone-warning .driver-snapshot-icon { background: #fff4e8; color: #cc6a00; }
.driver-snapshot-metric.tone-danger .driver-snapshot-icon { background: #feebed; color: #c43d4b; }
.driver-snapshot-metric.tone-secondary .driver-snapshot-icon { background: #f1f4f8; color: #6c7a92; }
.driver-snapshot-metric.tone-info .driver-snapshot-icon { background: #e7f0ff; color: #0d4fc4; }
.driver-snapshot-metric.tone-primary .driver-snapshot-icon { background: #eef4ff; color: #0d4fc4; }

.driver-snapshot-note {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 18px;
    padding: 14px 16px;
    border: 1px solid #dce7f5;
    border-radius: 16px;
    background: #f8fbff;
    color: #55657f;
    font-size: .92rem;
}

.driver-share-card {
    position: sticky;
    top: 92px;
    overflow: hidden;
    border-radius: 28px;
    padding: 20px 22px 22px;
    background:
        radial-gradient(circle at 100% 0%, rgba(255,255,255,.08), transparent 28%),
        linear-gradient(180deg, #041e47 0%, #08357a 48%, #0d4fc4 100%);
    color: #ffffff;
    box-shadow: 0 20px 46px rgba(7, 30, 71, .28);
}

.driver-share-brand {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 150px;
    padding: 10px 18px;
    margin-bottom: 18px;
    border-radius: 16px;
    background: rgba(20, 121, 255, .24);
    border: 1px solid rgba(255,255,255,.14);
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: .14em;
}

.driver-share-section {
    padding-bottom: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid rgba(219,234,254,.18);
}

.driver-share-person {
    display: flex;
    align-items: center;
    gap: 16px;
}

.driver-share-person h3 {
    margin: 0 0 8px;
    font-size: 2rem;
    font-weight: 800;
    line-height: 1.04;
}

.driver-share-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    border-radius: 999px;
    background: rgba(34, 197, 94, .18);
    color: #d7ffe6;
    font-size: .92rem;
    font-weight: 700;
}

.driver-share-status::before {
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #3ad37d;
}

.driver-share-vehicle-name {
    font-size: 1.95rem;
    font-weight: 800;
    line-height: 1.04;
}

.driver-share-plate {
    display: inline-flex;
    margin-top: 10px;
    padding: 8px 14px;
    border-radius: 12px;
    background: rgba(255,255,255,.96);
    color: #0b2f61;
    font-size: 1.3rem;
    font-weight: 800;
}

.driver-share-list {
    display: grid;
    gap: 12px;
}

.driver-share-row {
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(219,234,254,.14);
}

.driver-share-row:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.driver-share-row-label {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
    color: rgba(219,234,254,.92);
    font-size: .95rem;
}

.driver-share-row strong {
    display: block;
    font-size: 1.95rem;
    line-height: 1.05;
    letter-spacing: -.02em;
}

.driver-share-pill {
    display: inline-flex;
    align-items: center;
    margin-top: 10px;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: .86rem;
    font-weight: 700;
}

.driver-share-pill.tone-success { background: rgba(34, 197, 94, .18); color: #d8ffe7; }
.driver-share-pill.tone-warning { background: rgba(251, 146, 60, .2); color: #ffe4c7; }
.driver-share-pill.tone-danger { background: rgba(239, 68, 68, .18); color: #ffd7dc; }
.driver-share-pill.tone-secondary { background: rgba(148, 163, 184, .18); color: #e2e8f0; }
.driver-share-pill.tone-primary,
.driver-share-pill.tone-info { background: rgba(59, 130, 246, .20); color: #dbeafe; }

.driver-share-footer {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid rgba(219,234,254,.18);
}

.driver-share-footer strong,
.driver-share-footer span {
    display: block;
}

.driver-share-footer strong {
    font-size: 1.2rem;
    letter-spacing: .1em;
}

.driver-share-footer span {
    margin-top: 6px;
    color: rgba(219,234,254,.86);
    font-size: .9rem;
}

@media (max-width: 1199.98px) {
    .driver-snapshot-layout {
        grid-template-columns: 1fr;
    }

    .driver-share-card {
        position: relative;
        top: auto;
    }
}

@media (max-width: 767.98px) {
    .driver-snapshot-profile-card {
        flex-direction: column;
        align-items: stretch;
    }

    .driver-snapshot-grid {
        grid-template-columns: 1fr;
    }

    .driver-snapshot-note {
        flex-direction: column;
    }

    .driver-share-person h3,
    .driver-share-vehicle-name,
    .driver-share-row strong {
        font-size: 1.55rem;
    }
}

/* ===== V138 masthead line final override =====
   Force the top BRO TRANS left/right lines to render longer. */
.app-navbar .app-header-title .app-header-rule {
    width: clamp(135px, 20vw, 320px) !important;
    flex: 0 0 auto;
}
@media (max-width: 1199.98px) {
    .app-navbar .app-header-title .app-header-rule {
        width: clamp(95px, 14vw, 190px) !important;
    }
}
@media (max-width: 991.98px) {
    .app-navbar .app-header-title .app-header-rule {
        display: none !important;
    }
}

/* ===== V149 Xiaomi Pad 8 tablet sidebar =====
   Touch-tablet only. Desktop/laptop styling is intentionally unchanged. */
@media (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
    /* Expanded tablet state: make Xiaomi behave like the laptop sidebar. */
    .app-sidebar.sidebar-shell {
        flex-basis: 224px;
        width: 224px;
        max-width: 224px;
        padding-right: 12px !important;
        padding-left: 12px !important;
    }

    .app-sidebar .sidebar-brand-panel {
        min-height: 84px;
        flex-direction: row;
        justify-content: space-between;
        gap: 8px;
        margin-right: -12px;
        margin-left: -12px;
        padding: 10px 12px;
    }

    .app-sidebar .sidebar-brand-link {
        min-width: 0;
        flex: 1 1 auto;
        justify-content: flex-start;
    }

    .app-sidebar .sidebar-brand-logo {
        flex-basis: 46px;
        width: 46px;
        height: 46px;
    }

    .app-sidebar .sidebar-brand-copy {
        display: flex !important;
    }

    .app-sidebar .sidebar-group-label,
    .app-sidebar .sidebar-nav-label {
        display: block !important;
    }

    .app-sidebar .sidebar-status-dot {
        display: inline-block !important;
    }

    .app-sidebar .sidebar-collapse-btn {
        display: inline-grid !important;
        place-items: center;
        position: fixed !important;
        top: 50vh;
        left: 205px;
        transform: translateY(-50%);
        z-index: 1095;
        flex: 0 0 38px;
        width: 38px;
        height: 38px;
        border: 1px solid rgba(255,255,255,.42);
        border-radius: 12px;
        color: #fff;
        background: rgba(8,42,96,.94);
        box-shadow: 0 10px 28px rgba(4,24,62,.28), inset 0 0 0 1px rgba(255,255,255,.08);
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }

    .app-sidebar.sidebar .sidebar-nav-link {
        justify-content: flex-start;
        padding: 6px 9px !important;
    }

    .app-sidebar .sidebar-nav-group {
        margin-top: 16px;
    }

    /* Collapsed tablet state: keep the control visible so it can be expanded again. */
    body.sidebar-collapsed .app-sidebar.sidebar-shell {
        flex-basis: 78px;
        width: 78px;
        max-width: 78px;
        padding-right: 9px !important;
        padding-left: 9px !important;
    }

    body.sidebar-collapsed .app-sidebar .sidebar-brand-panel {
        min-height: 92px;
        flex-direction: column;
        justify-content: center;
        gap: 5px;
        margin-right: -9px;
        margin-left: -9px;
        padding: 7px 3px;
    }

    body.sidebar-collapsed .app-sidebar .sidebar-brand-link {
        flex: 0 0 auto;
        justify-content: center;
    }

    body.sidebar-collapsed .app-sidebar .sidebar-brand-copy,
    body.sidebar-collapsed .app-sidebar .sidebar-group-label,
    body.sidebar-collapsed .app-sidebar .sidebar-nav-label,
    body.sidebar-collapsed .app-sidebar .sidebar-status-dot {
        display: none !important;
    }

    body.sidebar-collapsed .app-sidebar .sidebar-collapse-btn {
        display: inline-grid !important;
        position: fixed !important;
        top: 50vh;
        left: 61px;
        transform: translateY(-50%);
        width: 34px;
        height: 34px;
        flex-basis: 34px;
        z-index: 1095;
    }

    body.sidebar-collapsed .app-sidebar.sidebar .sidebar-nav-link {
        justify-content: center;
        padding: 6px !important;
    }

    body.sidebar-collapsed .app-sidebar .sidebar-nav-group {
        margin-top: 9px;
    }
}


/* ===== V151 Xiaomi Pad viewport-fixed sidebar control =====
   Dedicated button lives directly under BODY, outside the sticky/scrolling sidebar.
   Activated only by JS on Android tablet-width devices; desktop/laptop is unchanged. */
.xiaomi-sidebar-floating-toggle {
    display: none;
}

body.xiaomi-tablet-sidebar .app-sidebar .sidebar-collapse-btn {
    display: none !important;
}

body.xiaomi-tablet-sidebar .xiaomi-sidebar-floating-toggle {
    position: fixed !important;
    display: grid !important;
    place-items: center;
    top: 50% !important;
    left: 205px;
    transform: translate(-50%, -50%) !important;
    z-index: 2147483000 !important;
    width: 46px;
    height: 54px;
    padding: 0;
    border: 1px solid rgba(255,255,255,.62);
    border-radius: 16px;
    color: #fff;
    background: linear-gradient(180deg, rgba(12,64,143,.98), rgba(7,35,84,.98));
    box-shadow: 0 12px 32px rgba(3,20,54,.34), inset 0 0 0 2px rgba(255,255,255,.10);
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

body.xiaomi-tablet-sidebar.sidebar-collapsed .xiaomi-sidebar-floating-toggle {
    left: 78px;
}

body.xiaomi-tablet-sidebar .xiaomi-sidebar-floating-toggle:active {
    transform: translate(-50%, -50%) scale(.96) !important;
}

@media (max-width: 767.98px) {
    body.xiaomi-tablet-sidebar .xiaomi-sidebar-floating-toggle {
        display: none !important;
    }
}

/* ===== V153 Xiaomi Pad 8 portrait + landscape hard fix =====
   Android-tablet class is added by JS, so desktop/laptop layout is untouched.
   These rules intentionally do not depend on viewport width or pointer media
   queries; Xiaomi landscape/desktop-site mode can report widths > 1366px. */
body.xiaomi-tablet-sidebar .app-sidebar.sidebar-shell {
    flex-basis: 224px !important;
    width: 224px !important;
    max-width: 224px !important;
    padding-right: 12px !important;
    padding-left: 12px !important;
}

body.xiaomi-tablet-sidebar .app-sidebar .sidebar-brand-panel {
    min-height: 84px !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    gap: 8px !important;
    margin-right: -12px !important;
    margin-left: -12px !important;
    padding: 10px 12px !important;
}

body.xiaomi-tablet-sidebar .app-sidebar .sidebar-brand-link {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    justify-content: flex-start !important;
}

body.xiaomi-tablet-sidebar .app-sidebar .sidebar-brand-logo {
    flex-basis: 46px !important;
    width: 46px !important;
    height: 46px !important;
}

body.xiaomi-tablet-sidebar .app-sidebar .sidebar-brand-copy {
    display: flex !important;
}

body.xiaomi-tablet-sidebar .app-sidebar .sidebar-group-label,
body.xiaomi-tablet-sidebar .app-sidebar .sidebar-nav-label {
    display: block !important;
}

body.xiaomi-tablet-sidebar .app-sidebar .sidebar-status-dot {
    display: inline-block !important;
}

body.xiaomi-tablet-sidebar .app-sidebar.sidebar .sidebar-nav-link {
    justify-content: flex-start !important;
    padding: 6px 9px !important;
}

body.xiaomi-tablet-sidebar .app-sidebar .sidebar-nav-group {
    margin-top: 16px !important;
}

body.xiaomi-tablet-sidebar.sidebar-collapsed .app-sidebar.sidebar-shell {
    flex-basis: 78px !important;
    width: 78px !important;
    max-width: 78px !important;
    padding-right: 9px !important;
    padding-left: 9px !important;
}

body.xiaomi-tablet-sidebar.sidebar-collapsed .app-sidebar .sidebar-brand-panel {
    min-height: 92px !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 5px !important;
    margin-right: -9px !important;
    margin-left: -9px !important;
    padding: 7px 3px !important;
}

body.xiaomi-tablet-sidebar.sidebar-collapsed .app-sidebar .sidebar-brand-link {
    flex: 0 0 auto !important;
    justify-content: center !important;
}

body.xiaomi-tablet-sidebar.sidebar-collapsed .app-sidebar .sidebar-brand-copy,
body.xiaomi-tablet-sidebar.sidebar-collapsed .app-sidebar .sidebar-group-label,
body.xiaomi-tablet-sidebar.sidebar-collapsed .app-sidebar .sidebar-nav-label,
body.xiaomi-tablet-sidebar.sidebar-collapsed .app-sidebar .sidebar-status-dot {
    display: none !important;
}

body.xiaomi-tablet-sidebar.sidebar-collapsed .app-sidebar.sidebar .sidebar-nav-link {
    justify-content: center !important;
    padding: 6px !important;
}

body.xiaomi-tablet-sidebar.sidebar-collapsed .app-sidebar .sidebar-nav-group {
    margin-top: 9px !important;
}

body.xiaomi-tablet-sidebar .app-sidebar .sidebar-collapse-btn {
    display: none !important;
}

body.xiaomi-tablet-sidebar .xiaomi-sidebar-floating-toggle {
    position: fixed !important;
    display: grid !important;
    place-items: center !important;
    /* JS writes exact visual-viewport center as inline !important. */
    top: 50% !important;
    left: 224px !important;
    transform: translate(-50%, -50%) !important;
    z-index: 2147483000 !important;
    width: 46px !important;
    height: 54px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(255,255,255,.62) !important;
    border-radius: 16px !important;
    color: #fff !important;
    background: linear-gradient(180deg, rgba(12,64,143,.98), rgba(7,35,84,.98)) !important;
    box-shadow: 0 12px 32px rgba(3,20,54,.34), inset 0 0 0 2px rgba(255,255,255,.10) !important;
    font-size: 1.25rem !important;
    line-height: 1 !important;
    cursor: pointer !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
}

body.xiaomi-tablet-sidebar.sidebar-collapsed .xiaomi-sidebar-floating-toggle {
    left: 78px !important;
}

body.xiaomi-tablet-sidebar .xiaomi-sidebar-floating-toggle:active {
    transform: translate(-50%, -50%) scale(.96) !important;
}



/* V164: center the main metric value inside Driver Snapshot cards. */
.driver-snapshot-metric strong { width: 100%; }


/* Keep the icon tile behavior intact after text centering. */
.driver-snapshot-metric > .driver-snapshot-icon {
    display: grid;
    place-items: center;
    text-align: center;
    margin-top: 0;
}


/* ===== V166 Driver Snapshot photo + download polish ===== */
.driver-snapshot-photo-wrap {
    flex: 0 0 auto;
}

.driver-snapshot-avatar {
    overflow: hidden;
}

.driver-snapshot-avatar.has-photo {
    background: #e9f2ff;
    box-shadow: 0 0 0 4px #d8eaff, 0 8px 22px rgba(15, 78, 196, .16);
}

.driver-snapshot-avatar img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.driver-snapshot-photo-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
}

.driver-snapshot-photo-actions form {
    margin: 0;
}

.driver-photo-btn {
    border-radius: 10px;
    font-weight: 700;
}

.driver-photo-hint {
    color: #8a99ad;
    font-size: .75rem;
}

@media (max-width: 767.98px) {
    .driver-snapshot-profile {
        align-items: flex-start;
    }

    .driver-snapshot-photo-actions {
        margin-top: 12px;
    }

    .driver-photo-hint {
        flex-basis: 100%;
    }
}

/* ===== V168 Driver Snapshot compact premium portrait ===== */
.driver-snapshot-profile-card {
    position: relative;
    overflow: hidden;
    min-height: 136px;
    padding: 22px 24px;
    background:
        radial-gradient(circle at 12% 22%, rgba(27,118,255,.07), transparent 28%),
        linear-gradient(135deg, #ffffff 0%, #fbfdff 72%, #f2f7ff 100%);
}

.driver-snapshot-profile {
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.driver-snapshot-photo-wrap {
    position: relative;
    flex: 0 0 92px;
    width: 92px;
    height: 92px;
    display: grid;
    place-items: center;
}

.driver-snapshot-photo-wrap::before {
    content: '';
    position: absolute;
    inset: -5px;
    border-radius: 50%;
    background: linear-gradient(145deg, rgba(71,157,255,.34), rgba(8,73,173,.08));
    box-shadow: 0 10px 24px rgba(24,82,160,.14);
}

.driver-snapshot-avatar,
.driver-snapshot-avatar.has-photo {
    position: relative;
    z-index: 1;
    width: 84px !important;
    height: 84px !important;
    min-width: 84px !important;
    min-height: 84px !important;
    max-width: 84px !important;
    max-height: 84px !important;
    flex: 0 0 84px !important;
    overflow: hidden !important;
    border: 3px solid #ffffff;
    border-radius: 50% !important;
    background: linear-gradient(145deg, #deecff, #77adf3);
    box-shadow:
        0 0 0 2px rgba(54,135,244,.72),
        0 8px 18px rgba(15,78,196,.15) !important;
}

.driver-snapshot-avatar img,
.driver-snapshot-avatar.has-photo img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: cover !important;
    object-position: 50% 34% !important;
    border-radius: 50% !important;
}

.driver-snapshot-identity {
    min-width: 0;
}

.driver-snapshot-identity h2 {
    font-size: 1.45rem;
    letter-spacing: -.025em;
    line-height: 1.1;
}

.driver-snapshot-identity p {
    margin-top: .3rem;
    font-size: .91rem;
}

.driver-snapshot-photo-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 9px;
}

.driver-snapshot-photo-actions .driver-photo-btn {
    min-height: 30px;
    padding: 5px 9px;
    border-radius: 9px;
    font-size: .76rem;
    font-weight: 800;
    line-height: 1.1;
    box-shadow: none;
}

.driver-snapshot-photo-actions .btn-outline-primary {
    background: rgba(15,93,214,.04);
    border-color: rgba(15,93,214,.26);
}

.driver-snapshot-photo-actions .btn-outline-secondary {
    background: rgba(100,116,139,.035);
    border-color: rgba(100,116,139,.20);
}

.driver-photo-hint {
    margin-left: 2px;
    color: #8798ad;
    font-size: .68rem;
    white-space: nowrap;
}

.driver-snapshot-vehicle-card {
    align-self: center;
}

@media (max-width: 767.98px) {
    .driver-snapshot-profile-card {
        align-items: flex-start;
        padding: 18px;
    }

    .driver-snapshot-photo-wrap {
        flex-basis: 78px;
        width: 78px;
        height: 78px;
    }

    .driver-snapshot-avatar,
    .driver-snapshot-avatar.has-photo {
        width: 72px !important;
        height: 72px !important;
        min-width: 72px !important;
        min-height: 72px !important;
        max-width: 72px !important;
        max-height: 72px !important;
        flex-basis: 72px !important;
    }

    .driver-photo-hint {
        flex-basis: 100%;
        margin-left: 0;
    }
}


/* ===== V170 Driver Snapshot download language ===== */
.driver-download-language-wrap {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 4px 6px 4px 11px;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 12px;
    background: rgba(255,255,255,.10);
    backdrop-filter: blur(10px);
}

.driver-download-language-label {
    display: inline-flex;
    align-items: center;
    margin: 0;
    color: rgba(255,255,255,.92);
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .02em;
    white-space: nowrap;
}

.driver-download-language {
    width: auto;
    min-width: 148px;
    border: 0;
    border-radius: 9px;
    background-color: rgba(255,255,255,.96);
    color: #12366f;
    font-weight: 750;
    box-shadow: none !important;
}

.driver-download-language:focus {
    border: 0;
    box-shadow: 0 0 0 2px rgba(255,255,255,.24) !important;
}

@media (max-width: 767.98px) {
    .driver-download-language-wrap {
        width: 100%;
        justify-content: space-between;
    }
    .driver-download-language {
        flex: 1 1 auto;
        min-width: 0;
    }
}


/* ===== V176 compact full-screen workspace =====
   Spacing-only update: page content, order, data and functionality are unchanged. */
@media (min-width: 768px) {
    .app-workspace .main-shell {
        padding: 12px 14px 26px !important;
    }

    .app-page > .row.g-4,
    .app-page .row.g-4 {
        --bs-gutter-x: .9rem;
        --bs-gutter-y: .9rem;
    }

    .app-page > .row.g-3,
    .app-page .row.g-3 {
        --bs-gutter-x: .75rem;
        --bs-gutter-y: .75rem;
    }

    .app-page > .mb-4 {
        margin-bottom: 1rem !important;
    }

    .app-page > .mb-3 {
        margin-bottom: .75rem !important;
    }
}

@media (min-width: 1200px) {
    .app-navbar-grid {
        padding-right: 14px;
        padding-left: 14px;
    }
}


/* ===== V176 wider sidebar patch =====
   Width only: keep menu content, order, icons, colors and behavior unchanged. */
@media (min-width: 1200px) {
    .app-sidebar.sidebar-shell {
        flex-basis: 264px !important;
        width: 264px !important;
        max-width: 264px !important;
        padding-right: 14px !important;
        padding-left: 14px !important;
    }

    .app-sidebar .sidebar-nav-label {
        white-space: nowrap;
        overflow: visible;
        text-overflow: clip;
    }

    .app-sidebar.sidebar .sidebar-nav-link {
        gap: 11px;
        padding-right: 10px !important;
        padding-left: 10px !important;
    }
}

/* Xiaomi Pad / Android tablet expanded state: slightly wider too. */
@media (min-width: 768px) and (max-width: 1199.98px) {
    .app-sidebar.sidebar-shell {
        flex-basis: 252px !important;
        width: 252px !important;
        max-width: 252px !important;
    }

    .app-sidebar .sidebar-nav-label {
        white-space: nowrap;
        overflow: visible;
        text-overflow: clip;
    }

    .app-sidebar .sidebar-collapse-btn {
        left: 233px !important;
    }
}

body.xiaomi-tablet-sidebar:not(.sidebar-collapsed) .app-sidebar.sidebar-shell {
    flex-basis: 252px !important;
    width: 252px !important;
    max-width: 252px !important;
}

body.xiaomi-tablet-sidebar:not(.sidebar-collapsed) .app-sidebar .sidebar-nav-label {
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

body.xiaomi-tablet-sidebar:not(.sidebar-collapsed) .xiaomi-sidebar-floating-toggle {
    left: 252px !important;
}

/* ===== V188 Xiaomi/tablet collapsed sidebar compact fix =====
   Final override after V176 wide-sidebar rules. The collapsed sidebar must
   actually shrink, and the active state must stay on the icon tile instead
   of stretching across the whole sidebar. */
body.sidebar-collapsed .app-sidebar.sidebar-shell {
    flex: 0 0 82px !important;
    flex-basis: 82px !important;
    width: 82px !important;
    max-width: 82px !important;
    padding-right: 10px !important;
    padding-left: 10px !important;
}

body.sidebar-collapsed .app-sidebar .sidebar-brand-panel {
    min-height: 88px !important;
    margin-right: -10px !important;
    margin-left: -10px !important;
    padding: 10px 5px !important;
}

body.sidebar-collapsed .app-sidebar .sidebar-brand-link {
    width: 100% !important;
    justify-content: center !important;
}

body.sidebar-collapsed .app-sidebar .sidebar-brand-logo {
    flex: 0 0 46px !important;
    width: 46px !important;
    height: 46px !important;
}

body.sidebar-collapsed .app-sidebar .sidebar-brand-copy,
body.sidebar-collapsed .app-sidebar .sidebar-group-label,
body.sidebar-collapsed .app-sidebar .sidebar-nav-label,
body.sidebar-collapsed .app-sidebar .sidebar-status-dot {
    display: none !important;
}

body.sidebar-collapsed .app-sidebar .sidebar-nav,
body.sidebar-collapsed .app-sidebar .sidebar-nav-group {
    width: 100% !important;
    align-items: center !important;
}

body.sidebar-collapsed .app-sidebar .sidebar-nav-group {
    margin-top: 10px !important;
}

body.sidebar-collapsed .app-sidebar.sidebar .sidebar-nav-link {
    flex: 0 0 46px !important;
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    min-height: 46px !important;
    height: 46px !important;
    justify-content: center !important;
    gap: 0 !important;
    margin-right: auto !important;
    margin-left: auto !important;
    padding: 6px !important;
    border-radius: 13px !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}

body.sidebar-collapsed .app-sidebar.sidebar .sidebar-nav-link::before {
    display: none !important;
}

body.sidebar-collapsed .app-sidebar.sidebar .sidebar-nav-link:hover,
body.sidebar-collapsed .app-sidebar.sidebar .sidebar-nav-link:focus {
    background: transparent !important;
    box-shadow: none !important;
}

body.sidebar-collapsed .app-sidebar .sidebar-nav-icon {
    flex: 0 0 36px !important;
    width: 36px !important;
    height: 36px !important;
    margin: 0 !important;
    border-radius: 10px !important;
    transition: background-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

body.sidebar-collapsed .app-sidebar.sidebar .sidebar-nav-link:hover .sidebar-nav-icon,
body.sidebar-collapsed .app-sidebar.sidebar .sidebar-nav-link:focus .sidebar-nav-icon {
    color: #fff !important;
    background: rgba(255,255,255,.14) !important;
}

body.sidebar-collapsed .app-sidebar.sidebar .sidebar-nav-link.active {
    color: #fff !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.sidebar-collapsed .app-sidebar.sidebar .sidebar-nav-link.active .sidebar-nav-icon {
    color: #fff !important;
    border-color: rgba(255,255,255,.34) !important;
    background: linear-gradient(145deg, #2d8cff, #0b63e7) !important;
    box-shadow: 0 7px 18px rgba(10,96,225,.34), inset 0 0 0 1px rgba(255,255,255,.12) !important;
}

/* Keep Xiaomi floating handle exactly on the new compact sidebar edge. */
body.xiaomi-tablet-sidebar.sidebar-collapsed .xiaomi-sidebar-floating-toggle {
    left: 82px !important;
}

@media (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
    body.sidebar-collapsed .app-sidebar .sidebar-collapse-btn {
        left: 65px !important;
    }
}

/* ===== Monthly Deposit Premium Search Only (V191) ===== */
.monthly-deposit-header-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:1rem 1.35rem;
}
.monthly-deposit-heading{min-width:0}
.monthly-deposit-header-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:.75rem;
    min-width:0;
}
.monthly-deposit-month-form{flex:0 0 auto;margin:0}

/* Search shell matches the premium BRO TRANS controls. */
.monthly-deposit-search{
    position:relative;
    display:flex;
    align-items:center;
    width:360px;
    max-width:36vw;
    min-width:300px;
    height:46px;
}
.monthly-deposit-search>i{
    position:absolute !important;
    left:8px !important;
    top:50% !important;
    z-index:3 !important;
    display:grid !important;
    place-items:center !important;
    width:30px !important;
    height:30px !important;
    margin:0 !important;
    transform:translateY(-50%) !important;
    border-radius:9px !important;
    background:var(--bro-blue-soft) !important;
    color:var(--bro-blue) !important;
    font-size:.92rem !important;
    line-height:1 !important;
    pointer-events:none !important;
    transition:background-color .18s ease,color .18s ease,box-shadow .18s ease !important;
}
.monthly-deposit-search .form-control{
    width:100% !important;
    height:46px !important;
    min-height:46px !important;
    margin:0 !important;
    padding:.62rem 2.65rem .62rem 3rem !important;
    border:1px solid #d9e3ef !important;
    border-radius:14px !important;
    outline:0 !important;
    background:#fff !important;
    color:#1d2f4b !important;
    font-size:.88rem !important;
    font-weight:650 !important;
    letter-spacing:.002em !important;
    box-shadow:0 6px 18px rgba(15,38,80,.05) !important;
    appearance:none !important;
    -webkit-appearance:none !important;
    transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease !important;
}
.monthly-deposit-search .form-control::-webkit-search-cancel-button,
.monthly-deposit-search .form-control::-webkit-search-decoration{
    -webkit-appearance:none !important;
    appearance:none !important;
    display:none !important;
}
.monthly-deposit-search .form-control::placeholder{
    color:#93a2b7 !important;
    font-weight:500 !important;
    opacity:1 !important;
}
.monthly-deposit-search .form-control:hover{
    border-color:#c4d4e7 !important;
    background:#fff !important;
}
.monthly-deposit-search .form-control:focus{
    border-color:rgba(13,79,196,.58) !important;
    background:#fff !important;
    box-shadow:0 0 0 3px rgba(13,79,196,.08),0 8px 22px rgba(15,38,80,.07) !important;
}
.monthly-deposit-search:focus-within>i{
    background:var(--bro-blue) !important;
    color:#fff !important;
    box-shadow:0 5px 12px rgba(13,79,196,.18) !important;
}
.monthly-deposit-search-clear{
    position:absolute !important;
    right:8px !important;
    top:50% !important;
    z-index:4 !important;
    display:none !important;
    align-items:center !important;
    justify-content:center !important;
    width:29px !important;
    height:29px !important;
    margin:0 !important;
    padding:0 !important;
    transform:translateY(-50%) !important;
    border:0 !important;
    border-radius:9px !important;
    background:#f1f5f9 !important;
    color:#64748b !important;
    box-shadow:none !important;
    line-height:1 !important;
    cursor:pointer !important;
    transition:background-color .15s ease,color .15s ease,transform .15s ease !important;
}
.monthly-deposit-search-clear:hover{
    background:#e7eef8 !important;
    color:var(--bro-blue) !important;
    transform:translateY(-50%) scale(1.03) !important;
}
.monthly-deposit-search-clear.is-visible{display:inline-flex !important}

/* Month picker uses the exact same visual language as Search. */
.monthly-deposit-picker{
    width:214px !important;
    min-width:214px !important;
    height:46px !important;
    min-height:46px !important;
    margin:0 !important;
    padding:.62rem 2.9rem .62rem 1rem !important;
    border:1px solid #d9e3ef !important;
    border-radius:14px !important;
    background-color:#fff !important;
    color:#1d2f4b !important;
    font-size:.88rem !important;
    font-weight:650 !important;
    box-shadow:0 6px 18px rgba(15,38,80,.05) !important;
    transition:border-color .18s ease,box-shadow .18s ease !important;
}
.monthly-deposit-picker:hover{border-color:#c4d4e7 !important}
.monthly-deposit-picker:focus{
    border-color:rgba(13,79,196,.58) !important;
    box-shadow:0 0 0 3px rgba(13,79,196,.08),0 8px 22px rgba(15,38,80,.07) !important;
}

@media(max-width:1199.98px){
    .monthly-deposit-search{width:330px;max-width:34vw;min-width:260px}
}
@media(max-width:991.98px){
    .monthly-deposit-header-grid{grid-template-columns:1fr}
    .monthly-deposit-header-actions{justify-content:space-between;width:100%}
    .monthly-deposit-search{width:auto;max-width:none;min-width:0;flex:1 1 auto}
}
@media(max-width:575.98px){
    .monthly-deposit-header-actions{align-items:stretch;flex-direction:column;gap:.65rem}
    .monthly-deposit-search{width:100%;max-width:none;min-width:0}
    .monthly-deposit-month-form{align-self:flex-end}
    .monthly-deposit-picker{width:204px !important;min-width:204px !important}
}


/* ===== Monthly Deposit Month Picker Visibility Fix (V192) ===== */
.monthly-deposit-picker{
    box-sizing:border-box !important;
    white-space:nowrap !important;
    overflow:visible !important;
    text-overflow:clip !important;
}
.monthly-deposit-picker::-webkit-calendar-picker-indicator{
    width:18px !important;
    height:18px !important;
    margin:0 0 0 .55rem !important;
    padding:2px !important;
    cursor:pointer !important;
    opacity:.9 !important;
}
@media(max-width:575.98px){
    .monthly-deposit-picker{width:210px !important;min-width:210px !important;padding-right:2.75rem !important}
}

/* V195 Expense Scope */
.expense-scope-selector{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
}
.expense-scope-option{
    display:flex;
    align-items:flex-start;
    gap:12px;
    min-width:0;
    padding:14px 15px;
    border:1px solid #dce5f0;
    border-radius:14px;
    background:#fff;
    cursor:pointer;
    transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.expense-scope-option:hover{border-color:#a8c6f7;background:#fbfdff}
.expense-scope-option.is-active{
    border-color:#4f8ff7;
    background:#f5f9ff;
    box-shadow:0 0 0 3px rgba(7,87,223,.08);
}
.expense-scope-option input{position:absolute;opacity:0;pointer-events:none}
.expense-scope-icon{
    flex:0 0 38px;
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:11px;
    color:#0757df;
    background:#eaf2ff;
    font-size:1rem;
}
.expense-scope-option strong{display:block;color:#1b2940;font-size:.9rem;font-weight:800}
.expense-scope-option small{display:block;margin-top:3px;color:#6f7f95;font-size:.72rem;line-height:1.38}
.expense-general-target{
    display:flex;
    align-items:center;
    gap:12px;
    padding:13px 15px;
    border:1px solid #dce5f0;
    border-radius:12px;
    background:#f8fafc;
}
.expense-general-target>span{
    width:38px;height:38px;display:grid;place-items:center;border-radius:10px;
    background:#edf1f6;color:#40516a;font-size:1rem;
}
.expense-general-target strong{display:block;color:#1b2940;font-size:.9rem}
.expense-general-target small{display:block;color:#718096;font-size:.78rem;margin-top:2px}
.expense-scope-badge{font-weight:800;letter-spacing:.02em}
@media (max-width:900px){.expense-scope-selector{grid-template-columns:1fr}.expense-scope-option{padding:12px 13px}}
.expense-scope-filter{display:flex;flex-wrap:wrap;gap:8px}
.expense-scope-filter a{padding:9px 14px;border:1px solid #dce5f0;border-radius:999px;background:#fff;color:#53657d;text-decoration:none;font-size:.78rem;font-weight:800;letter-spacing:.03em}
.expense-scope-filter a:hover{border-color:#a8c6f7;color:#0757df;background:#f8fbff}
.expense-scope-filter a.active{border-color:#0757df;color:#fff;background:#0757df;box-shadow:0 7px 16px rgba(7,87,223,.18)}

/* ===== V197 · PHONE COMPACT MODE =====
   Mobile-only responsive layer. Desktop/laptop and Xiaomi Pad layouts are
   intentionally untouched; all overrides are scoped below 768px. */
.mobile-only,
.dashboard-mobile-gps,
.gps-mobile-launch {
    display: none !important;
}

@media (max-width: 767.98px) {
    html,
    body.app-body {
        max-width: 100%;
        overflow-x: hidden !important;
    }

    body.app-body {
        font-size: .92rem;
        background: #f4f7fb;
    }

    .xiaomi-sidebar-floating-toggle {
        display: none !important;
    }

    /* Compact phone command bar */
    .app-navbar,
    .app-navbar-grid {
        min-height: 62px !important;
    }

    .app-navbar-grid {
        position: relative;
        padding: 0 10px !important;
        gap: 6px !important;
    }

    .app-navbar-left,
    .app-navbar-right {
        position: relative;
        z-index: 2;
    }

    .app-navbar-right {
        gap: 5px !important;
    }

    .app-header-title {
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 1;
        max-width: calc(100% - 150px);
        margin: 0 !important;
        gap: 0 !important;
        transform: translate(-50%, -50%);
    }

    .app-header-title-copy {
        min-width: 0;
        text-align: center;
    }

    .app-header-title-text {
        display: block;
        overflow: hidden;
        max-width: 100%;
        color: #0d326e;
        font-size: 1.16rem !important;
        font-weight: 850;
        letter-spacing: .055em;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .app-header-title-subtitle,
    .app-header-rule {
        display: none !important;
    }

    .app-mobile-menu,
    .app-logout-link {
        width: 38px !important;
        height: 38px !important;
        flex-basis: 38px !important;
        border-radius: 11px !important;
    }

    .app-profile-link {
        min-height: 38px !important;
        padding: 0 !important;
        background: transparent !important;
    }

    .app-profile-avatar {
        width: 38px !important;
        height: 38px !important;
        flex-basis: 38px !important;
        border-radius: 11px !important;
    }

    .app-workspace .main-shell,
    .main-shell {
        min-height: calc(100dvh - 62px) !important;
        padding: 12px 10px 30px !important;
    }

    .app-page {
        min-width: 0;
    }

    /* Phone navigation drawer */
    #sidebarMobile {
        --bs-offcanvas-width: min(330px, 88vw);
        box-shadow: 18px 0 50px rgba(1, 16, 47, .28);
    }

    #sidebarMobile .offcanvas-header {
        min-height: 64px;
        padding: 12px 14px;
    }

    #sidebarMobile .offcanvas-body {
        padding: 10px 10px calc(24px + env(safe-area-inset-bottom));
    }

    #sidebarMobile .sidebar-nav-group {
        margin-top: 13px;
    }

    #sidebarMobile .sidebar-group-label {
        padding: 0 10px 5px;
        font-size: .64rem;
        letter-spacing: .14em;
    }

    #sidebarMobile .sidebar-nav-link {
        min-height: 44px;
        gap: 10px;
        padding: 5px 8px !important;
        border-radius: 11px !important;
        font-size: .88rem;
    }

    #sidebarMobile .sidebar-nav-icon {
        flex-basis: 32px;
        width: 32px;
        height: 32px;
        border-radius: 9px;
        font-size: .96rem;
    }

    /* Global page density */
    .premium-page-header {
        min-height: auto !important;
        gap: 10px !important;
        margin-bottom: 12px !important;
        padding: 14px 14px 14px 17px !important;
        border-radius: 14px !important;
    }

    .premium-page-header::before {
        top: 12px;
        bottom: 12px;
        width: 3px;
    }

    .premium-page-header::after {
        display: none;
    }

    .premium-page-header h1,
    .premium-page-header .h1,
    .premium-page-header h2,
    .page-title {
        font-size: 1.35rem !important;
        line-height: 1.18 !important;
    }

    .premium-page-header p,
    .premium-page-header .text-secondary {
        margin-top: .25rem !important;
        font-size: .78rem !important;
        line-height: 1.42;
    }

    .app-page .card,
    .app-page .table-card,
    .app-page .stat-card,
    .app-page .premium-content-card,
    .app-page .premium-form-card,
    .app-page .premium-filter-card,
    .app-page .premium-data-card {
        border-radius: 14px !important;
        box-shadow: 0 7px 20px rgba(15, 38, 80, .05) !important;
    }

    .app-page .card-body,
    .app-page .premium-form-card > .card-body {
        padding: 14px !important;
    }

    .app-page .card-header.premium-card-header {
        min-height: 56px;
        padding: 13px 14px !important;
    }

    .app-page .premium-filter-card {
        margin-bottom: 12px !important;
    }

    .app-page .premium-filter-card .card-body {
        padding: 12px !important;
    }

    .app-page .form-label {
        margin-bottom: .3rem;
        font-size: .76rem;
    }

    .app-page .form-control,
    .app-page .form-select,
    .app-page .input-group-text {
        min-height: 42px !important;
        font-size: .86rem !important;
    }

    .app-page textarea.form-control {
        min-height: 78px !important;
    }

    .app-page .btn {
        min-height: 40px;
        border-radius: 10px;
        font-size: .82rem;
    }

    .app-page .btn-sm {
        min-height: 34px;
        font-size: .75rem;
    }

    .app-page .d-flex.justify-content-between,
    .app-page .d-flex.align-items-center.justify-content-between {
        min-width: 0;
        flex-wrap: wrap;
    }

    .app-page .btn-group,
    .app-page .nav,
    .app-page .expense-scope-filter {
        max-width: 100%;
        overflow-x: auto;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .app-page .btn-group::-webkit-scrollbar,
    .app-page .nav::-webkit-scrollbar,
    .app-page .expense-scope-filter::-webkit-scrollbar {
        display: none;
    }

    .app-page .alert {
        margin-bottom: 10px;
        padding: 10px 12px;
        border-radius: 11px;
        font-size: .8rem;
    }

    .app-page .row.g-4,
    .app-page > .row.g-4 {
        --bs-gutter-x: .7rem;
        --bs-gutter-y: .7rem;
    }

    .app-page .row.g-3,
    .app-page > .row.g-3 {
        --bs-gutter-x: .6rem;
        --bs-gutter-y: .6rem;
    }

    .app-page > .mb-4 { margin-bottom: .8rem !important; }
    .app-page > .mb-3 { margin-bottom: .65rem !important; }

    /* Automatic phone card tables (labels are injected by mobile-ui.js). */
    .app-page .table-responsive:has(> table.mobile-responsive-table) {
        overflow: visible !important;
    }

    table.mobile-responsive-table,
    table.mobile-responsive-table tbody {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    table.mobile-responsive-table thead {
        display: none !important;
    }

    table.mobile-responsive-table tbody tr {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0;
        width: 100%;
        margin: 0 0 10px !important;
        overflow: hidden;
        border: 1px solid #dfe7f2;
        border-radius: 13px;
        background: #fff;
        box-shadow: 0 5px 16px rgba(15, 38, 80, .045);
    }

    table.mobile-responsive-table tbody tr:last-child {
        margin-bottom: 0 !important;
    }

    table.mobile-responsive-table tbody td {
        display: block !important;
        min-width: 0 !important;
        width: auto !important;
        padding: 10px 11px !important;
        border: 0 !important;
        border-right: 1px solid #edf1f6 !important;
        border-bottom: 1px solid #edf1f6 !important;
        background: #fff !important;
        font-size: .8rem !important;
        line-height: 1.35 !important;
        white-space: normal !important;
        overflow-wrap: anywhere;
        vertical-align: top !important;
    }

    table.mobile-responsive-table tbody td:nth-child(even) {
        border-right: 0 !important;
    }

    table.mobile-responsive-table tbody td:nth-last-child(-n+2) {
        border-bottom: 0 !important;
    }

    table.mobile-responsive-table tbody td::before {
        display: block;
        margin-bottom: 5px;
        color: #8090a6;
        content: attr(data-mobile-label);
        font-size: .58rem;
        font-weight: 850;
        letter-spacing: .06em;
        line-height: 1.2;
        text-transform: uppercase;
    }

    table.mobile-responsive-table tbody td[data-mobile-label=""]::before,
    table.mobile-responsive-table tbody td.mobile-empty-cell::before {
        display: none;
    }

    table.mobile-responsive-table tbody td.mobile-full-cell {
        grid-column: 1 / -1;
        border-right: 0 !important;
        border-bottom: 0 !important;
        text-align: center;
    }

    table.mobile-responsive-table tfoot {
        display: block !important;
        margin-top: 8px;
        overflow: hidden;
        border: 1px solid #dce5f0;
        border-radius: 12px;
        background: #f7f9fc;
    }

    table.mobile-responsive-table tfoot tr {
        display: flex !important;
        flex-wrap: wrap;
    }

    table.mobile-responsive-table tfoot th,
    table.mobile-responsive-table tfoot td {
        flex: 1 1 50%;
        min-width: 0;
        padding: 9px 10px !important;
        border: 0 !important;
        font-size: .75rem !important;
        white-space: normal !important;
    }

    /* Matrix/calendar tables intentionally remain horizontal and swipeable. */
    .mobile-scroll-table-shell,
    .table-responsive:has(> table.mobile-scroll-table) {
        position: relative;
        overflow-x: auto !important;
        border-radius: 12px;
        -webkit-overflow-scrolling: touch;
    }

    table.mobile-scroll-table {
        width: max-content !important;
        min-width: 720px !important;
    }

    /* Dashboard: true phone composition, 2x2 KPI + fast GPS access. */
    .dashboard-page-heading {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: start !important;
        gap: 8px !important;
        margin-bottom: 10px !important;
    }

    .dashboard-page-eyebrow {
        margin-bottom: 3px;
        font-size: .59rem;
        letter-spacing: .1em;
    }

    .dashboard-page-heading h1 {
        font-size: 1.55rem !important;
        line-height: 1.08;
    }

    .dashboard-page-heading p {
        margin-top: .25rem;
        font-size: .76rem;
        line-height: 1.35;
    }

    .dashboard-live-date {
        min-height: 34px;
        gap: 5px;
        padding: 6px 8px;
        border-radius: 10px;
        font-size: .7rem;
    }

    .dashboard-collection-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        margin-bottom: 10px !important;
    }

    .dashboard-kpi-card {
        grid-template-columns: 38px minmax(0, 1fr) !important;
        gap: 8px !important;
        min-height: 94px !important;
        padding: 10px !important;
        border-radius: 14px !important;
    }

    .dashboard-kpi-icon {
        width: 38px !important;
        height: 38px !important;
        border-radius: 11px !important;
        font-size: .98rem !important;
    }

    .dashboard-kpi-copy small {
        overflow: hidden;
        font-size: .55rem !important;
        letter-spacing: .045em !important;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dashboard-kpi-copy strong {
        margin-top: 4px !important;
        font-size: clamp(1.08rem, 4.8vw, 1.38rem) !important;
        letter-spacing: -.035em !important;
    }

    .dashboard-kpi-copy span {
        margin-top: 4px !important;
        font-size: .64rem !important;
        line-height: 1.25;
    }

    .dashboard-mobile-gps {
        display: grid !important;
        grid-template-columns: 42px minmax(0, 1fr) auto;
        align-items: center;
        gap: 10px;
        margin-bottom: 10px;
        padding: 11px 12px;
        border: 1px solid #cfe0f7;
        border-radius: 14px;
        color: inherit;
        background: linear-gradient(135deg, #fff 0%, #f0f6ff 100%);
        box-shadow: 0 7px 20px rgba(15, 38, 80, .055);
        text-decoration: none;
    }

    .dashboard-mobile-gps-icon {
        display: grid;
        width: 42px;
        height: 42px;
        place-items: center;
        border-radius: 12px;
        color: #fff;
        background: linear-gradient(145deg, #1570ee, #0757df);
        box-shadow: 0 7px 16px rgba(7, 87, 223, .2);
        font-size: 1rem;
    }

    .dashboard-mobile-gps-copy {
        min-width: 0;
    }

    .dashboard-mobile-gps-copy small,
    .dashboard-mobile-gps-copy strong,
    .dashboard-mobile-gps-copy span {
        display: block;
    }

    .dashboard-mobile-gps-copy small {
        color: #1267e6;
        font-size: .56rem;
        font-weight: 850;
        letter-spacing: .09em;
    }

    .dashboard-mobile-gps-copy strong {
        margin-top: 2px;
        color: #173052;
        font-size: .88rem;
        font-weight: 820;
    }

    .dashboard-mobile-gps-copy span {
        overflow: hidden;
        margin-top: 2px;
        color: #74849a;
        font-size: .65rem;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dashboard-mobile-gps > i {
        color: #6e83a1;
    }

    .dashboard-action-panel,
    .dashboard-fleet-panel,
    .dashboard-finance-panel {
        margin-bottom: 10px !important;
        border-radius: 14px !important;
    }

    .dashboard-action-heading,
    .dashboard-fleet-heading,
    .dashboard-finance-heading {
        gap: 8px !important;
        padding: 11px 12px !important;
    }

    .dashboard-action-heading h2,
    .dashboard-fleet-heading h2,
    .dashboard-finance-heading h2 {
        font-size: 1rem !important;
    }

    .dashboard-action-heading p,
    .dashboard-fleet-heading p,
    .dashboard-finance-heading p {
        font-size: .7rem !important;
    }

    .dashboard-action-total {
        min-height: 27px;
        padding: 4px 7px;
        font-size: .59rem;
    }

    .dashboard-action-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 7px !important;
        padding: 8px !important;
    }

    .dashboard-action-card {
        grid-template-columns: 34px minmax(0, 1fr) !important;
        gap: 7px !important;
        min-height: 78px;
        padding: 8px !important;
        border-radius: 12px !important;
    }

    .dashboard-action-icon {
        width: 34px !important;
        height: 34px !important;
        border-radius: 10px !important;
        font-size: .9rem !important;
    }

    .dashboard-action-copy small { font-size: .53rem !important; }
    .dashboard-action-copy strong { font-size: .78rem !important; }
    .dashboard-action-copy span {
        display: -webkit-box;
        overflow: hidden;
        font-size: .64rem !important;
        line-height: 1.25;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .dashboard-fleet-tools {
        width: 100%;
        gap: 6px;
    }

    .dashboard-fleet-counts {
        gap: 4px;
    }

    .dashboard-fleet-counts span {
        padding: 4px 7px;
        font-size: .62rem;
    }

    .dashboard-fleet-table tbody tr,
    .dashboard-fleet-table tbody tr {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        margin: 8px !important;
        border-radius: 12px !important;
    }

    .dashboard-fleet-table tbody td,
    .dashboard-fleet-table tbody td:nth-child(even),
    .dashboard-fleet-table tbody td:nth-last-child(-n+2) {
        padding: 9px !important;
        border-right: 1px solid #edf1f6 !important;
        border-bottom: 1px solid #edf1f6 !important;
    }

    .dashboard-fleet-table tbody td:nth-child(even) {
        border-right: 0 !important;
    }

    .dashboard-fleet-table tbody td:nth-last-child(-n+2) {
        border-bottom: 0 !important;
    }

    .dashboard-finance-summary {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 6px !important;
        padding: 8px 8px 0 !important;
    }

    .dashboard-finance-summary > span {
        min-width: 0;
        padding: 7px !important;
        border-radius: 10px;
    }

    .dashboard-finance-summary small {
        overflow: hidden;
        font-size: .52rem !important;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dashboard-finance-summary strong {
        overflow: hidden;
        margin-top: 3px !important;
        font-size: .75rem !important;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dashboard-finance-chart {
        height: 245px !important;
        padding: 8px !important;
    }

    /* Phone GPS: retain embed, add a reliable direct launcher when Tracksolid
       blocks or renders poorly inside a mobile iframe. */
    .gps-mobile-launch {
        display: grid !important;
        grid-template-columns: 42px minmax(0, 1fr) auto;
        align-items: center;
        gap: 10px;
        margin-bottom: 8px;
        padding: 10px 11px;
        border: 1px solid #cfe0f7;
        border-radius: 13px;
        background: linear-gradient(135deg, #fff, #eff6ff);
        box-shadow: 0 6px 18px rgba(15, 38, 80, .05);
    }

    .gps-mobile-launch-icon {
        display: grid;
        width: 42px;
        height: 42px;
        place-items: center;
        border-radius: 12px;
        color: #fff;
        background: linear-gradient(145deg, #1570ee, #0757df);
    }

    .gps-mobile-launch-copy {
        min-width: 0;
    }

    .gps-mobile-launch-copy strong,
    .gps-mobile-launch-copy span {
        display: block;
    }

    .gps-mobile-launch-copy strong {
        color: #183150;
        font-size: .84rem;
    }

    .gps-mobile-launch-copy span {
        margin-top: 2px;
        color: #73849a;
        font-size: .64rem;
        line-height: 1.3;
    }

    .gps-mobile-launch .btn {
        min-height: 36px;
        padding: 0 10px;
        white-space: nowrap;
    }

    .gps-monitor-page {
        margin: 0 !important;
    }

    .gps-monitor-frame-wrap {
        height: 68dvh !important;
        min-height: 430px !important;
        border-radius: 13px !important;
    }

    .gps-monitor-open-link {
        top: 8px !important;
        right: 8px !important;
        width: 38px !important;
        height: 38px !important;
        border-radius: 10px !important;
    }

    /* Modals and charts */
    .modal-dialog {
        margin: 8px !important;
    }

    .modal-content {
        border-radius: 15px !important;
    }

    .chart-wrap,
    .chart-wrap-wide,
    .report-chart,
    .report-vehicle-chart {
        min-height: 230px !important;
        height: 230px !important;
    }

    /* Search/filter controls that previously consumed a full screen. */
    .monthly-deposit-header-actions {
        gap: 7px !important;
    }

    .monthly-deposit-search,
    .monthly-deposit-picker {
        height: 42px !important;
        min-height: 42px !important;
    }

    .monthly-deposit-search .form-control {
        height: 42px !important;
        min-height: 42px !important;
        font-size: .82rem !important;
    }

    .monthly-deposit-picker {
        width: 190px !important;
        min-width: 190px !important;
        font-size: .82rem !important;
    }

    .expense-scope-selector {
        gap: 7px !important;
    }

    .expense-scope-option {
        gap: 9px !important;
        padding: 10px 11px !important;
    }

    .expense-scope-icon {
        flex-basis: 34px;
        width: 34px;
        height: 34px;
    }

    .expense-scope-option strong { font-size: .82rem; }
    .expense-scope-option small { font-size: .66rem; }
}

@media (max-width: 399.98px) {
    .app-header-title {
        max-width: calc(100% - 142px);
    }

    .app-header-title-text {
        font-size: 1.03rem !important;
    }

    .dashboard-page-heading p {
        display: none;
    }

    .dashboard-kpi-card {
        grid-template-columns: 32px minmax(0, 1fr) !important;
        min-height: 86px !important;
        padding: 8px !important;
    }

    .dashboard-kpi-icon {
        width: 32px !important;
        height: 32px !important;
        font-size: .85rem !important;
    }

    .dashboard-kpi-copy strong {
        font-size: 1rem !important;
    }

    .dashboard-kpi-copy span {
        font-size: .58rem !important;
    }

    table.mobile-responsive-table tbody tr {
        grid-template-columns: 1fr !important;
    }

    table.mobile-responsive-table tbody td,
    table.mobile-responsive-table tbody td:nth-child(even),
    table.mobile-responsive-table tbody td:nth-last-child(-n+2) {
        border-right: 0 !important;
        border-bottom: 1px solid #edf1f6 !important;
    }

    table.mobile-responsive-table tbody td:last-child {
        border-bottom: 0 !important;
    }

    .dashboard-action-grid {
        grid-template-columns: 1fr !important;
    }

    .dashboard-finance-summary {
        grid-template-columns: 1fr !important;
    }
}

/* ===== V198 · MOBILE PREMIUM POLISH =====
   PHONE ONLY. Desktop/tablet remain untouched. No database or business logic changes. */
@media (max-width: 767.98px) {
    :root {
        --bt-mobile-gap: 9px;
        --bt-mobile-radius: 14px;
    }

    body.app-body {
        background: #f3f7fc !important;
    }

    .app-workspace,
    .app-page,
    .main-shell {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .main-shell {
        padding: 10px 9px calc(24px + env(safe-area-inset-bottom)) !important;
    }

    /* Header stays useful without consuming the first screen. */
    .app-navbar,
    .app-navbar-grid {
        min-height: 58px !important;
        height: 58px !important;
    }

    .app-navbar-grid {
        padding-inline: 9px !important;
    }

    .app-mobile-menu,
    .app-logout-link,
    .app-profile-avatar {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        flex-basis: 36px !important;
        border-radius: 10px !important;
    }

    .app-header-title {
        max-width: calc(100% - 142px) !important;
    }

    .app-header-title-text {
        font-size: 1.08rem !important;
        letter-spacing: .045em !important;
    }

    /* Page title/header: compact and consistent on every module. */
    .premium-page-header {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
        margin-bottom: 9px !important;
        padding: 12px 12px 12px 15px !important;
        border-radius: var(--bt-mobile-radius) !important;
    }

    .premium-page-header > div,
    .premium-page-header .premium-page-header-copy,
    .premium-page-header .premium-page-header-actions {
        width: 100% !important;
        min-width: 0 !important;
    }

    .premium-page-header .premium-page-header-actions,
    .premium-page-header > .d-flex {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 6px !important;
        overflow-x: auto !important;
        padding-bottom: 1px;
        scrollbar-width: none;
    }

    .premium-page-header .premium-page-header-actions::-webkit-scrollbar,
    .premium-page-header > .d-flex::-webkit-scrollbar {
        display: none;
    }

    .premium-page-header .premium-page-header-actions .btn,
    .premium-page-header > .d-flex .btn {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .premium-page-header h1,
    .premium-page-header .h1,
    .premium-page-header h2,
    .page-title {
        margin-bottom: 0 !important;
        font-size: 1.24rem !important;
        line-height: 1.15 !important;
    }

    .premium-page-header p,
    .premium-page-header .text-secondary {
        margin-bottom: 0 !important;
        font-size: .72rem !important;
        line-height: 1.35 !important;
    }

    /* Forms: one clean column and touch-friendly controls. */
    .app-page form .row,
    .app-page .premium-form-card .row {
        --bs-gutter-x: .55rem;
        --bs-gutter-y: .55rem;
    }

    .app-page .form-control,
    .app-page .form-select,
    .app-page .input-group-text {
        min-height: 41px !important;
        border-radius: 10px;
        font-size: .84rem !important;
    }

    .app-page .input-group > .form-control,
    .app-page .input-group > .form-select,
    .app-page .input-group > .input-group-text {
        border-radius: 0;
    }

    .app-page .input-group > :first-child {
        border-top-left-radius: 10px !important;
        border-bottom-left-radius: 10px !important;
    }

    .app-page .input-group > :last-child {
        border-top-right-radius: 10px !important;
        border-bottom-right-radius: 10px !important;
    }

    .app-page .form-text,
    .app-page small.text-muted,
    .app-page .text-secondary.small {
        font-size: .67rem !important;
        line-height: 1.35;
    }

    /* Generic toolbars/filters are swipeable rather than wrapping into tall blocks. */
    .app-page .mobile-toolbar,
    .app-page .card-header > .d-flex,
    .app-page .card-body > .d-flex.gap-2,
    .app-page .card-body > .d-flex.gap-3,
    .app-page .filter-actions,
    .app-page .report-actions,
    .app-page .page-actions {
        max-width: 100%;
        overflow-x: auto;
        flex-wrap: nowrap !important;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .app-page .mobile-toolbar::-webkit-scrollbar,
    .app-page .card-header > .d-flex::-webkit-scrollbar,
    .app-page .filter-actions::-webkit-scrollbar,
    .app-page .report-actions::-webkit-scrollbar,
    .app-page .page-actions::-webkit-scrollbar {
        display: none;
    }

    .app-page .card-header > .d-flex > *,
    .app-page .filter-actions > *,
    .app-page .report-actions > *,
    .app-page .page-actions > * {
        flex: 0 0 auto;
    }

    /* Cards across all menus: denser, less vertical whitespace. */
    .app-page .card,
    .app-page .table-card,
    .app-page .premium-content-card,
    .app-page .premium-form-card,
    .app-page .premium-filter-card,
    .app-page .premium-data-card,
    .app-page .stat-card {
        margin-bottom: 9px !important;
        border-radius: var(--bt-mobile-radius) !important;
    }

    .app-page .card-body,
    .app-page .premium-form-card > .card-body,
    .app-page .premium-filter-card > .card-body {
        padding: 11px !important;
    }

    .app-page .card-header,
    .app-page .card-header.premium-card-header {
        min-height: 50px !important;
        padding: 10px 11px !important;
    }

    /* Dashboard first screen: 4 KPIs + GPS without a long scroll. */
    .dashboard-page-heading {
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 7px !important;
        margin: 0 0 8px !important;
    }

    .dashboard-page-eyebrow {
        font-size: .54rem !important;
        letter-spacing: .09em !important;
    }

    .dashboard-page-heading h1 {
        margin-top: 2px !important;
        font-size: 1.38rem !important;
    }

    .dashboard-page-heading p {
        display: none !important;
    }

    .dashboard-live-date {
        min-height: 31px !important;
        padding: 5px 7px !important;
        font-size: .64rem !important;
    }

    .dashboard-collection-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 7px !important;
        margin-bottom: 8px !important;
    }

    .dashboard-kpi-card {
        display: grid !important;
        grid-template-columns: 32px minmax(0, 1fr) !important;
        gap: 7px !important;
        min-width: 0 !important;
        min-height: 82px !important;
        padding: 8px !important;
        border-radius: 13px !important;
    }

    .dashboard-kpi-icon {
        width: 32px !important;
        height: 32px !important;
        border-radius: 9px !important;
        font-size: .82rem !important;
    }

    .dashboard-kpi-copy {
        min-width: 0 !important;
    }

    .dashboard-kpi-copy small {
        font-size: .49rem !important;
        letter-spacing: .035em !important;
    }

    .dashboard-kpi-copy strong {
        display: block !important;
        overflow: hidden;
        margin-top: 3px !important;
        font-size: clamp(.9rem, 4.2vw, 1.16rem) !important;
        line-height: 1.08 !important;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dashboard-kpi-copy span {
        overflow: hidden;
        margin-top: 3px !important;
        font-size: .56rem !important;
        line-height: 1.2 !important;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dashboard-mobile-gps {
        margin-bottom: 8px !important;
        padding: 9px 10px !important;
        border-radius: 13px !important;
    }

    .dashboard-mobile-gps-icon {
        width: 36px !important;
        height: 36px !important;
        border-radius: 10px !important;
    }

    .dashboard-mobile-gps-copy small { font-size: .51rem !important; }
    .dashboard-mobile-gps-copy strong { font-size: .8rem !important; }
    .dashboard-mobile-gps-copy span { font-size: .59rem !important; }

    .dashboard-action-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 6px !important;
        padding: 7px !important;
    }

    .dashboard-action-card {
        grid-template-columns: 29px minmax(0, 1fr) !important;
        gap: 6px !important;
        min-height: 70px !important;
        padding: 7px !important;
    }

    .dashboard-action-icon {
        width: 29px !important;
        height: 29px !important;
        border-radius: 8px !important;
        font-size: .76rem !important;
    }

    .dashboard-action-arrow {
        display: none !important;
    }

    .dashboard-action-copy small { font-size: .48rem !important; }
    .dashboard-action-copy strong { font-size: .71rem !important; }
    .dashboard-action-copy span { font-size: .56rem !important; -webkit-line-clamp: 1 !important; }

    .dashboard-finance-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .dashboard-finance-chart {
        height: 210px !important;
    }

    /* Tables become readable cards. Matrix/calendar reports keep horizontal swipe. */
    table.mobile-responsive-table tbody tr {
        grid-template-columns: 1fr !important;
        margin-bottom: 8px !important;
        border-radius: 12px !important;
    }

    table.mobile-responsive-table tbody td,
    table.mobile-responsive-table tbody td:nth-child(even),
    table.mobile-responsive-table tbody td:nth-last-child(-n+2) {
        display: grid !important;
        grid-template-columns: minmax(92px, 36%) minmax(0, 1fr) !important;
        align-items: start;
        gap: 8px;
        padding: 8px 10px !important;
        border-right: 0 !important;
        border-bottom: 1px solid #edf1f6 !important;
        font-size: .76rem !important;
    }

    table.mobile-responsive-table tbody td:last-child {
        border-bottom: 0 !important;
    }

    table.mobile-responsive-table tbody td::before {
        margin: 1px 0 0 !important;
        font-size: .53rem !important;
        line-height: 1.25 !important;
    }

    table.mobile-responsive-table tbody td.mobile-full-cell {
        display: block !important;
        grid-column: auto !important;
    }

    table.mobile-scroll-table {
        min-width: 680px !important;
    }

    /* Search and date filters must never dominate the screen. */
    .monthly-deposit-header-actions {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 142px !important;
        width: 100% !important;
        gap: 6px !important;
    }

    .monthly-deposit-search,
    .monthly-deposit-picker,
    .monthly-deposit-search .form-control {
        width: 100% !important;
        min-width: 0 !important;
        height: 39px !important;
        min-height: 39px !important;
        font-size: .76rem !important;
    }

    /* Reports/charts: readable without creating a giant blank area. */
    .chart-wrap,
    .chart-wrap-wide,
    .report-chart,
    .report-vehicle-chart {
        min-height: 205px !important;
        height: 205px !important;
    }

    /* GPS on phone: direct action is always visible even if Tracksolid blocks iframe. */
    .gps-mobile-launch {
        position: sticky;
        top: 64px;
        z-index: 6;
        margin-bottom: 7px !important;
        padding: 9px 10px !important;
    }

    .gps-mobile-launch-icon {
        width: 36px !important;
        height: 36px !important;
        border-radius: 10px !important;
    }

    .gps-mobile-launch-copy strong { font-size: .78rem !important; }
    .gps-mobile-launch-copy span { font-size: .58rem !important; }
    .gps-mobile-launch .btn { min-height: 34px !important; padding: 0 9px !important; font-size: .7rem !important; }

    .gps-monitor-frame-wrap {
        height: calc(100dvh - 126px) !important;
        min-height: 440px !important;
        border-radius: 12px !important;
    }

    /* Modal and dropdown sizing on small screens. */
    .modal-dialog {
        width: auto !important;
        max-width: none !important;
        margin: 7px !important;
    }

    .modal-body,
    .modal-header,
    .modal-footer {
        padding: 11px !important;
    }

    .dropdown-menu {
        max-width: calc(100vw - 18px) !important;
    }

    .pagination {
        flex-wrap: nowrap !important;
        max-width: 100%;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .pagination::-webkit-scrollbar { display: none; }
}

@media (max-width: 379.98px) {
    .dashboard-collection-grid,
    .dashboard-action-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .dashboard-kpi-card {
        grid-template-columns: 28px minmax(0, 1fr) !important;
        min-height: 78px !important;
        padding: 7px !important;
    }

    .dashboard-kpi-icon {
        width: 28px !important;
        height: 28px !important;
    }

    .dashboard-kpi-copy strong {
        font-size: .86rem !important;
    }

    .dashboard-live-date {
        display: none !important;
    }
}

/* ===== V227 Odometer Update Center ===== */
.sidebar-count-badge{
    margin-left:auto;min-width:22px;height:20px;padding:0 6px;border-radius:999px;
    display:inline-flex;align-items:center;justify-content:center;background:#e9364f;color:#fff;
    font-size:10px;font-weight:900;line-height:1;box-shadow:0 3px 9px rgba(233,54,79,.24)
}
body.sidebar-collapsed .app-sidebar .sidebar-count-badge,
body.xiaomi-tablet-sidebar.sidebar-collapsed .app-sidebar .sidebar-count-badge{display:none}
.odo-update-panel{border:1px solid #e2e9f1;border-radius:22px;background:#fff;box-shadow:0 10px 30px rgba(20,43,73,.055);overflow:hidden}
.odo-update-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;border-bottom:1px solid #e8edf3;background:linear-gradient(180deg,#fff,#fbfdff)}
.odo-update-head h2{margin:0;color:#172d49;font-size:18px;font-weight:850}.odo-update-head p{margin:4px 0 0;color:#72849a;font-size:12px}
.odo-update-badges{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.odo-counter{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:999px;background:#edf4ff;color:#185fb8;font-size:10px;font-weight:900}.odo-counter.warning{background:#fff2d8;color:#996000}.odo-counter.clear{background:#e8f7ef;color:#177443}
.odo-recent-list{display:grid}.odo-recent-row{display:grid;grid-template-columns:minmax(160px,1.15fr) minmax(150px,1fr) minmax(220px,1.35fr) minmax(145px,.85fr);gap:16px;align-items:center;padding:15px 20px;border-bottom:1px solid #edf1f5}.odo-recent-row:last-child{border-bottom:0}
.odo-person strong,.odo-vehicle strong{display:block;color:#172d49;font-size:13px;font-weight:850}.odo-person span,.odo-vehicle span{display:block;color:#7a8ca1;font-size:10.5px;margin-top:3px}.odo-reading strong{color:#172d49;font-size:13px;font-weight:850;font-variant-numeric:tabular-nums}.odo-reading span{display:block;color:#6f8298;font-size:10.5px;margin-top:3px}.odo-time{color:#405873;font-size:11px;font-weight:750}.odo-time span{display:block;color:#8695a7;font-size:10px;margin-top:3px}
.odo-state-badge{display:inline-flex;align-items:center;border-radius:999px;padding:4px 7px;font-size:8.5px;font-weight:900;letter-spacing:.04em;margin-left:5px;vertical-align:1px}.odo-state-badge.new{background:#e9f2ff;color:#165fbd}.odo-state-badge.review{background:#fff0cf;color:#9a6100}.odo-state-badge.updated{background:#e7f8ef;color:#157448}.odo-state-badge.missing{background:#f0f3f6;color:#687b8f}
.vehicle-odo-daily{display:block;margin-top:5px;font-size:9px;font-weight:850;white-space:nowrap}.vehicle-odo-daily.updated{color:#147a49}.vehicle-odo-daily.missing{color:#8896a6}.vehicle-odo-review{display:block;margin-top:4px;font-size:9px;font-weight:850;color:#9a6100}
@media(max-width:900px){.odo-recent-row{grid-template-columns:1fr 1fr}.odo-reading,.odo-time{padding-top:4px}}
@media(max-width:575.98px){.odo-update-head{align-items:flex-start;flex-direction:column}.odo-recent-row{grid-template-columns:1fr;gap:8px;padding:14px 16px}}


/* ===== V231 Odometer + ETLE premium polish ===== */
.odo-recent-list{display:flex;flex-direction:column}
.odo-recent-row{display:grid;grid-template-columns:minmax(175px,1.1fr) minmax(175px,1.05fr) minmax(260px,1.45fr) minmax(170px,.95fr);gap:0;align-items:stretch;padding:0;border-bottom:1px solid #ebf0f6}
.odo-recent-row:last-child{border-bottom:0}
.odo-cell{display:flex;flex-direction:column;justify-content:center;gap:4px;padding:18px 20px;min-width:0}
.odo-cell + .odo-cell{border-left:1px solid #eef3f8}
.odo-kicker{display:block;color:#8a99ac;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.odo-person strong,.odo-vehicle strong,.odo-reading strong,.odo-time strong{display:block;color:#172d49;font-size:13px;font-weight:850;line-height:1.35;word-break:break-word}
.odo-person span:not(.odo-state-badge),.odo-vehicle span:not(.odo-state-badge),.odo-reading span:not(.odo-state-badge),.odo-time span:not(.odo-state-badge){display:block;color:#6f8298;font-size:11px;line-height:1.45;word-break:break-word}
.odo-time{align-items:flex-start}
.vehicle-checks-card{border:1px solid #dfe7f1;box-shadow:0 12px 32px rgba(20,43,73,.06);border-radius:22px;overflow:hidden}
.vehicle-checks-table{--bs-table-bg:transparent}
.vehicle-checks-table thead th{padding:16px 20px!important;border-bottom:1px solid #dfe7f1!important;background:#f8fbff!important;color:#5a6f89;font-size:.78rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.vehicle-checks-table tbody td{padding:20px!important;border-top:0!important;border-bottom:1px solid #e9eff6!important;vertical-align:middle;background:#fff}
.vehicle-checks-table tbody tr:last-child td{border-bottom:0!important}
.vehicle-check-main,.vehicle-check-stack{display:flex;flex-direction:column;gap:8px;min-width:0}
.vehicle-check-title{color:#172d49;font-size:1.02rem;font-weight:850;line-height:1.2}
.vehicle-check-plate{color:#233650;font-size:1rem;font-weight:700;letter-spacing:.01em}
.vehicle-check-meta{color:#8392a5;font-size:.83rem;font-weight:700}
.vehicle-check-line,.vehicle-check-schedule{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid #edf2f7;border-radius:14px;background:#fbfdff}
.vehicle-check-label{display:inline-block;color:#7d8da1;font-size:.73rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.vehicle-check-line strong,.vehicle-check-schedule-value{color:#213650;font-size:.92rem;font-weight:800;text-align:right}
.vehicle-check-schedule-value{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px}
.vehicle-check-badge{padding:.56rem .9rem;font-size:.84rem;font-weight:800}
.vehicle-check-link{color:#0d5bc7;text-decoration:none;font-size:.82rem;font-weight:800}
.vehicle-check-link:hover{text-decoration:underline}
.vehicle-check-alert{padding:8px 12px;border-radius:12px;background:#fff0f0;color:#b42318;font-size:.82rem;font-weight:800}
.vehicle-check-actions{display:inline-flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;max-width:100%}
.vehicle-check-copy-btn{width:44px;height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;border-color:#d8e1ec}
.vehicle-check-action-btn{min-height:40px;padding-inline:14px;border-radius:12px;font-weight:800;box-shadow:0 8px 18px rgba(14,30,56,.06)}
.vehicle-check-row:hover td{background:#fcfdff}
@media(max-width:1199.98px){.vehicle-checks-table thead th,.vehicle-checks-table tbody td{padding:16px!important}.vehicle-check-line,.vehicle-check-schedule{padding:9px 10px}}
@media(max-width:991.98px){.vehicle-checks-table thead th{font-size:.73rem}.vehicle-check-title{font-size:.96rem}.vehicle-check-plate{font-size:.95rem}.vehicle-check-line,.vehicle-check-schedule{flex-direction:column;align-items:flex-start}.vehicle-check-schedule-value{text-align:left;justify-content:flex-start}.vehicle-check-actions{justify-content:flex-start}}
@media(max-width:900px){.odo-recent-row{grid-template-columns:1fr 1fr}.odo-cell{padding:16px 18px}.odo-cell:nth-child(3),.odo-cell:nth-child(4){border-top:1px solid #eef3f8}.odo-cell:nth-child(3){border-left:0}}
@media(max-width:575.98px){.odo-recent-row{grid-template-columns:1fr}.odo-cell{padding:15px 16px}.odo-cell + .odo-cell{border-left:0;border-top:1px solid #eef3f8}.vehicle-checks-table thead th,.vehicle-checks-table tbody td{padding:14px!important}.vehicle-check-actions{display:flex;width:100%}.vehicle-check-copy-btn{flex:0 0 auto}.vehicle-check-action-btn{flex:1 1 auto;justify-content:center}}


/* ===== V236 Future Deposit Visibility + Remove ===== */
.monthly-deposit-table .deposit-day-cell.has-future-record{position:relative;background:#fffaf1}
.monthly-deposit-table tbody tr:nth-child(even) .deposit-day-cell.has-future-record{background:#fff9ef}
.monthly-deposit-table .deposit-day-cell.has-future-record .deposit-status-badge{position:relative;overflow:visible;margin-top:-7px}
.monthly-deposit-table .deposit-day-cell.has-future-record .deposit-status-main{display:inline-flex;align-items:center;justify-content:center;line-height:1}
.monthly-deposit-table .deposit-future-tag{position:absolute;left:50%;top:32px;transform:translateX(-50%);display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:13px;padding:0 4px;border:1px solid #f2c36b;border-radius:999px;background:#fff3d5;color:#9a5c00;font-size:6px;font-weight:900;letter-spacing:.045em;line-height:1;white-space:nowrap;box-shadow:0 1px 3px rgba(146,88,0,.08)}
.monthly-deposit-table .deposit-day-cell.has-future-record.state-paid .deposit-status-badge{border-color:#b7dfc6;background:#edf9f2;color:#137647}
.monthly-deposit-table .deposit-day-cell.has-future-record.state-partial .deposit-status-badge{border-color:#edcd7b;background:#fff7df;color:#8b5a00}
.monthly-deposit-table .deposit-day-cell.has-future-record.state-dayoff .deposit-status-badge,.monthly-deposit-table .deposit-day-cell.has-future-record.state-sick .deposit-status-badge,.monthly-deposit-table .deposit-day-cell.has-future-record.state-resign .deposit-status-badge{margin-top:-7px}
.monthly-status-footer{display:flex;align-items:center;width:100%}
#depositRemoveButton{font-weight:750}


/* ===== V250 Global Premium Grid Audit =====
   Unified compact, centered tables with subtle four-side separators.
   Applies across all operational menus through premium-ui.js. */
:root{
    --bro-grid-line:#e3eaf3;
    --bro-grid-line-soft:#edf2f7;
    --bro-grid-head:#f8faff;
    --bro-grid-hover:#f7faff;
}

.app-page .premium-audit-surface{
    border:1px solid #dfe7f1 !important;
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 28px rgba(20,43,73,.05);
}

.app-page table.premium-audit-grid{
    border-collapse:separate !important;
    border-spacing:0 !important;
    margin-bottom:0;
}

.app-page table.premium-audit-grid > thead > tr > th,
.app-page table.premium-audit-grid > tbody > tr > td,
.app-page table.premium-audit-grid > tfoot > tr > td,
.app-page table.premium-audit-grid > tfoot > tr > th{
    padding:.72rem .68rem !important;
    border-right:1px solid var(--bro-grid-line-soft) !important;
    border-bottom:1px solid var(--bro-grid-line) !important;
    text-align:center !important;
    vertical-align:middle !important;
}

.app-page table.premium-audit-grid > thead > tr:first-child > th{
    border-top:1px solid var(--bro-grid-line) !important;
    background:var(--bro-grid-head) !important;
}

.app-page table.premium-audit-grid > :is(thead,tbody,tfoot) > tr > :first-child{
    border-left:1px solid var(--bro-grid-line) !important;
}

.app-page table.premium-audit-grid > thead > tr > th{
    color:#53637b;
    font-weight:850;
    letter-spacing:.045em;
}

.app-page table.premium-audit-grid > tbody > tr:hover > td{
    background:var(--bro-grid-hover) !important;
}

/* Explicit alignment helpers still win when a page genuinely needs them. */
.app-page table.premium-audit-grid .text-start{ text-align:left !important; }
.app-page table.premium-audit-grid .text-end{ text-align:right !important; }

/* Compact Vehicle Directory: GPS No. lives inside Vehicle / Plate instead of a
   dedicated column, reducing horizontal clutter while keeping the value visible. */
.vehicle-directory-card{
    overflow:hidden !important;
}
.vehicle-directory-table{
    min-width:1540px !important;
    table-layout:fixed;
    font-size:.91rem;
}
.vehicle-directory-table thead th,
.vehicle-directory-table tbody td{
    text-align:center !important;
    vertical-align:middle !important;
}
.vehicle-directory-table tbody td{
    padding-top:12px !important;
    padding-bottom:12px !important;
    padding-left:9px !important;
    padding-right:9px !important;
}
.vehicle-directory-table thead th{
    padding:11px 9px !important;
}
.vehicle-directory-table .vehicle-primary-cell,
.vehicle-directory-table .vehicle-identity-cell{
    text-align:center !important;
}
.vehicle-directory-table .vehicle-directory-meta{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:5px;
    margin-top:5px;
}
.vehicle-directory-table .vehicle-code-text{
    color:#8997a9;
    font-size:.76rem;
    font-weight:700;
    white-space:nowrap;
}
.vehicle-directory-table .vehicle-gps-chip{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:4px;
    min-height:22px;
    padding:3px 8px;
    border:1px solid #dce5f0;
    border-radius:999px;
    background:#f1f5fa;
    color:#344b68;
    font-size:.72rem;
    font-weight:850;
    letter-spacing:.025em;
    line-height:1;
    white-space:nowrap;
}
.vehicle-directory-table .vehicle-gps-chip i{
    color:#5e7fa6;
    font-size:.68rem;
}
.vehicle-directory-table .vehicle-identity-cell{
    line-height:1.4;
}
.vehicle-directory-table .vehicle-status-cell{
    text-align:center !important;
}
.vehicle-directory-table .vehicle-edit-button{
    margin:7px auto 0;
}
.vehicle-directory-table th:nth-child(1){width:14%}
.vehicle-directory-table th:nth-child(2){width:9%}
.vehicle-directory-table th:nth-child(3){width:11%}
.vehicle-directory-table th:nth-child(4){width:10%}
.vehicle-directory-table th:nth-child(5){width:11%}
.vehicle-directory-table th:nth-child(6){width:11%}
.vehicle-directory-table th:nth-child(7){width:11%}
.vehicle-directory-table th:nth-child(8){width:16%}
.vehicle-directory-table th:nth-child(9){width:7%}

/* Purpose-built Monthly Deposit matrix keeps its narrow day cells while sharing
   the same premium separators and centered alignment. */
.app-page .monthly-deposit-table.premium-audit-grid > thead > tr > th,
.app-page .monthly-deposit-table.premium-audit-grid > tbody > tr > td{
    padding:.48rem .38rem !important;
}

@media(max-width:991.98px){
    .vehicle-directory-table{min-width:1500px !important}
    .app-page table.premium-audit-grid > thead > tr > th,
    .app-page table.premium-audit-grid > tbody > tr > td{
        padding:.64rem .58rem !important;
    }
}

/* ===== V252 Automation + Intelligence ===== */
.app-notification-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid #dce6ef;border-radius:12px;background:#fff;color:#244765;box-shadow:0 5px 14px rgba(13,45,75,.04)}
.app-notification-btn:hover{background:#f7fbff;color:#0b6db7}.app-notification-count{position:absolute;right:-5px;top:-6px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#d92d20;color:#fff;font-size:9px;font-weight:900;line-height:18px;text-align:center;border:2px solid #fff}
.live-ops-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:18px}.live-ops-card{border:1px solid #dde7ef;border-radius:16px;background:#fff;padding:13px 15px;box-shadow:0 7px 20px rgba(15,39,64,.04)}.live-ops-card small{display:block;color:#71859a;font-size:9px;font-weight:900;letter-spacing:.09em;text-transform:uppercase}.live-ops-card strong{display:block;margin-top:4px;color:#17324d;font-size:18px;font-weight:900}.live-ops-card span{display:block;margin-top:2px;color:#76899c;font-size:10px}.live-ops-live{display:inline-flex;align-items:center;gap:6px}.live-ops-live:before{content:"";width:7px;height:7px;border-radius:50%;background:#15a05a;box-shadow:0 0 0 4px rgba(21,160,90,.12)}
.smart-anomaly-panel{border:1px solid #dfe8f0;border-radius:18px;background:#fff;overflow:hidden;box-shadow:0 8px 22px rgba(15,39,64,.045);margin-bottom:18px}.smart-anomaly-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid #e8eef4}.smart-anomaly-head h2{font-size:15px;margin:0;color:#17324d;font-weight:900}.smart-anomaly-list{display:grid}.smart-anomaly-item{display:grid;grid-template-columns:80px minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid #edf2f6;text-decoration:none;color:inherit}.smart-anomaly-item:last-child{border-bottom:0}.smart-anomaly-item:hover{background:#fbfdff}.smart-anomaly-sev{display:inline-flex;justify-content:center;border-radius:999px;padding:5px 8px;font-size:9px;font-weight:900;letter-spacing:.06em}.smart-anomaly-sev.high{background:#feeceb;color:#b42318}.smart-anomaly-sev.medium{background:#fff4d8;color:#946200}.smart-anomaly-sev.low{background:#eaf3fb;color:#315f85}.smart-anomaly-copy strong{display:block;color:#17324d;font-size:12px}.smart-anomaly-copy span{display:block;color:#75899b;font-size:10px;margin-top:2px}.smart-anomaly-type{font-size:9px;font-weight:900;color:#71859a;letter-spacing:.06em}
@media(max-width:900px){.live-ops-strip{grid-template-columns:1fr 1fr}.smart-anomaly-item{grid-template-columns:70px 1fr}.smart-anomaly-type{display:none}}@media(max-width:575.98px){.live-ops-strip{grid-template-columns:1fr 1fr}.live-ops-card{padding:11px 12px}.live-ops-card strong{font-size:15px}}


/* ===== V253 Global Premium Grid Audit Completion =====
   Cache-safe, all in-app tables, compact centered cells, subtle four-side grid. */
.app-page table.premium-audit-grid > thead > tr > th,
.app-page table.premium-audit-grid > tbody > tr > td,
.app-page table.premium-audit-grid > tfoot > tr > td,
.app-page table.premium-audit-grid > tfoot > tr > th{
    padding:.58rem .52rem !important;
    text-align:center !important;
    vertical-align:middle !important;
    border-right:1px solid var(--bro-grid-line-soft) !important;
    border-bottom:1px solid var(--bro-grid-line) !important;
}
/* The global audit is intentionally centered even when old page markup used
   Bootstrap text-start/text-end helpers. */
.app-page table.premium-audit-grid th.text-start,
.app-page table.premium-audit-grid td.text-start,
.app-page table.premium-audit-grid th.text-end,
.app-page table.premium-audit-grid td.text-end{
    text-align:center !important;
}
.app-page table.premium-audit-grid > thead > tr:first-child > th{
    border-top:1px solid var(--bro-grid-line) !important;
}
.app-page table.premium-audit-grid > :is(thead,tbody,tfoot) > tr > :first-child{
    border-left:1px solid var(--bro-grid-line) !important;
}
.app-page table.premium-audit-grid > :is(thead,tbody,tfoot) > tr > :last-child{
    border-right:1px solid var(--bro-grid-line) !important;
}

/* Vehicles: tighter rows while retaining readable stacked metadata. */
.vehicle-directory-table tbody td{
    padding-top:8px !important;
    padding-bottom:8px !important;
    padding-left:8px !important;
    padding-right:8px !important;
}
.vehicle-directory-table thead th{
    padding:9px 8px !important;
}
.vehicle-directory-table .vehicle-directory-meta{margin-top:3px !important;gap:4px !important}
.vehicle-directory-table .vehicle-gps-chip{min-height:20px !important;padding:2px 7px !important}
.vehicle-directory-table .vehicle-edit-button{margin-top:4px !important}
.vehicle-directory-table .vehicle-status-cell .d-flex{margin-top:4px !important}

/* Custom operational tables now receive the same visual language even when
   they were not originally Bootstrap .table elements. */
.app-page .dashboard-fleet-table.premium-audit-grid,
.app-page .partner-table.premium-audit-grid,
.app-page .obd-history-table.premium-audit-grid{
    border-collapse:separate !important;
    border-spacing:0 !important;
}

/* V264 R11 — Premium Driver Savings selector */
.premium-driver-select {
    position: relative;
}
.premium-driver-select .driver-select-control {
    position: relative;
}
.premium-driver-select .driver-select-icon {
    position: absolute;
    top: 50%;
    left: 15px;
    z-index: 2;
    transform: translateY(-50%);
    color: #6b7d98;
    pointer-events: none;
}
.premium-driver-select .driver-select-search {
    min-height: 50px;
    padding-left: 43px;
    padding-right: 76px;
    border: 1px solid #d5deec;
    border-radius: 14px;
    background: #fff;
    font-weight: 700;
    color: #1d2c45;
    box-shadow: 0 5px 16px rgba(26,54,93,.04);
}
.premium-driver-select .driver-select-search::placeholder {
    color: #98a5b8;
    font-weight: 500;
}
.premium-driver-select .driver-select-search:focus {
    border-color: #73a3f2;
    box-shadow: 0 0 0 4px rgba(7,87,223,.10), 0 8px 24px rgba(34,83,154,.08);
}
.premium-driver-select .driver-select-chevron,
.premium-driver-select .driver-select-clear {
    position: absolute;
    top: 50%;
    z-index: 3;
    display: inline-grid;
    place-items: center;
    transform: translateY(-50%);
    border: 0;
    background: transparent;
    color: #70819a;
}
.premium-driver-select .driver-select-clear {
    right: 36px;
    width: 30px;
    height: 30px;
    border-radius: 9px;
}
.premium-driver-select .driver-select-clear:hover,
.premium-driver-select .driver-select-clear:focus-visible {
    color: #0757df;
    background: #edf4ff;
}
.premium-driver-select .driver-select-chevron {
    right: 14px;
    pointer-events: none;
}
.premium-driver-select .driver-select-options {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    z-index: 1090;
    max-height: 310px;
    overflow-y: auto;
    padding: 7px;
    border: 1px solid #dce5f1;
    border-radius: 16px;
    background: rgba(255,255,255,.985);
    box-shadow: 0 22px 46px rgba(17,41,78,.18), 0 6px 18px rgba(17,41,78,.07);
    scrollbar-width: thin;
}
.premium-driver-select .driver-select-option {
    width: 100%;
    display: grid;
    grid-template-columns: 38px minmax(0,1fr) auto;
    align-items: center;
    gap: 11px;
    padding: 9px 10px;
    border: 0;
    border-radius: 11px;
    background: transparent;
    color: #21314b;
    text-align: left;
}
.premium-driver-select .driver-select-option:hover,
.premium-driver-select .driver-select-option.is-active {
    background: linear-gradient(90deg,#edf4ff,#f7faff);
    color: #0757df;
}
.premium-driver-select .driver-select-avatar {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: #edf3fb;
    color: #184a97;
    font-size: .88rem;
    font-weight: 900;
}
.premium-driver-select .driver-select-option:hover .driver-select-avatar,
.premium-driver-select .driver-select-option.is-active .driver-select-avatar {
    background: #dfeaff;
    color: #0757df;
}
.premium-driver-select .driver-select-option-body {
    min-width: 0;
    display: flex;
    flex-direction: column;
    line-height: 1.25;
}
.premium-driver-select .driver-select-option-name {
    overflow: hidden;
    font-size: .93rem;
    font-weight: 800;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.premium-driver-select .driver-select-option-meta {
    overflow: hidden;
    margin-top: 2px;
    color: #7b899f;
    font-size: .76rem;
    font-weight: 600;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.premium-driver-select .driver-select-status {
    padding: 5px 8px;
    border-radius: 999px;
    background: #e9f8ef;
    color: #168148;
    font-size: .67rem;
    font-weight: 900;
    letter-spacing: .035em;
}
.premium-driver-select .driver-select-empty {
    padding: 18px 12px;
    color: #7c8ba1;
    font-size: .86rem;
    text-align: center;
}
.premium-driver-select.is-invalid .driver-select-search {
    border-color: #dc5a5a;
    box-shadow: 0 0 0 4px rgba(220,53,69,.08);
}
.premium-driver-select .driver-select-help {
    margin-top: 6px;
    color: #8795aa;
    font-size: .76rem;
}
@media (max-width: 575.98px) {
    .premium-driver-select .driver-select-option {
        grid-template-columns: 36px minmax(0,1fr);
    }
    .premium-driver-select .driver-select-status {
        display: none;
    }
}