/* Account/Vehicle presentation for legacy pages using the shared layout.
 * Keep existing Bootstrap columns, Angular visibility, table initialization,
 * report output controls and specialized settings/reference pages unchanged.
 * Screen-only rules deliberately leave printed/exported layouts alone.
 */
@media screen {
    /* Shared visual foundations; business state and layout visibility stay in existing JS. */
    body #erp-layout-page-body {
        --erp-ui-control-height: 36px;
        --erp-ui-radius: 6px;
        --erp-ui-space: 12px;
        --erp-ui-text: #25354a;
        --erp-ui-muted: #64748b;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
        font-size: 13px;
        line-height: 1.5;
        color: var(--erp-ui-text);
    }
    body #erp-layout-page-body :is(.erp-field, .erp-search-field, .erp-report-filter-field) :is(input.form-control:not([type="file"], [type="checkbox"], [type="radio"], [type="hidden"]), select.form-control),
    body #erp-layout-page-body .bootstrap-select > .dropdown-toggle {
        box-sizing: border-box;
        height: var(--erp-ui-control-height) !important;
        min-height: var(--erp-ui-control-height) !important;
        padding: 6px 10px !important;
        border-radius: var(--erp-ui-radius) !important;
        font-family: inherit;
        font-size: 13px;
        line-height: 22px;
    }
    body #erp-layout-page-body .bootstrap-select > .dropdown-toggle { padding-right: 30px !important; }
    body #erp-layout-page-body .bootstrap-select.form-control {
        height: auto !important;
        min-height: var(--erp-ui-control-height) !important;
    }
    body #erp-layout-page-body :is(.erp-field, .erp-search-field, .erp-report-filter-field) > label {
        font-family: inherit;
        font-size: 13px;
        font-weight: 600;
        line-height: 18px;
        letter-spacing: normal;
    }
    body #erp-layout-page-body textarea.form-control {
        font-family: inherit;
        font-size: 13px;
        line-height: 1.5;
        resize: vertical;
    }
    /* Tab content follows the tab strip without stacked legacy padding/min-height. */
    body .erp-entry-shell #erp-layout-page-body .tab-content,
    body #erp-layout-page-body :is(.erp-form-page, .erp-standard-entry) .tab-content {
        padding: 0 !important;
        margin-top: 0 !important;
        min-height: 0 !important;
    }
    body .erp-entry-shell #erp-layout-page-body .tab-content > .tab-pane,
    body #erp-layout-page-body .erp-form-page .tab-content > .tab-pane {
        min-height: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
    body .erp-entry-shell #erp-layout-page-body .tab-pane > .table:last-child,
    body .erp-entry-shell #erp-layout-page-body .tab-pane > .erp-entry-table-scroll:last-child {
        margin-bottom: 0 !important;
    }
    body #erp-layout-page-body :is(.erp-column-options, .erp-column-filter-popup) {
        border-radius: 8px;
        box-shadow: 0 6px 20px rgba(15, 23, 42, .1);
    }
    body #erp-layout-page-body .erp-data-table {
        font-family: inherit;
        font-size: 12px;
        line-height: 1.45;
    }
    body #erp-layout-page-body .erp-data-table thead th {
        font-size: 12px;
        font-weight: 600;
        letter-spacing: normal;
        border-bottom-width: 1px;
    }
    body.erp-report-screen #erp-layout-page-body .erp-report-filter-host {
        padding: 12px !important;
        border-radius: 8px;
    }
    body.erp-report-screen #erp-layout-page-body .btn-tab {
        border-radius: 6px;
        box-shadow: none;
        font-family: inherit;
        letter-spacing: normal;
    }
    /* One gutter for legacy page shells; specialized screens own their spacing. */
    body:not(.erp-report-screen) .erp-content-shell:not(.erp-dashboard-shell, .erp-entry-shell, .erp-list-shell, .erp-settings-shell) > .card-body {
        padding: 16px;
    }
    #erp-layout-page-body :is(a, button, input, select, textarea, summary, [tabindex="0"]):focus-visible {
        outline: 2px solid var(--erp-theme-ink, #3569cf);
        outline-offset: 2px;
    }

    /* One border and one content gutter for dashboard widgets, including welcome. */
    body .erp-dashboard-shell #erp-layout-page-body {
        padding: 12px !important;
    }
    body .erp-dashboard-shell .dashboard-welcome.card,
    body #dashboardDiv .card {
        border: 1px solid var(--erp-theme-border, #e2e8f0) !important;
        border-radius: 10px !important;
        box-shadow: none !important;
        margin-bottom: 16px !important;
        box-sizing: border-box;
    }
    body .erp-dashboard-shell .dashboard-welcome > .card-body,
    body #dashboardDiv .card > .card-body {
        padding: 16px !important;
    }
    body #dashboardDiv .metric-tile,
    body #dashboardDiv .erp-dashboard-chart-card {
        padding: 16px;
        border-radius: 10px;
        box-shadow: none;
    }
    body #dashboardDiv .bg-dashboard {
        border: 1px solid var(--erp-theme-border, #e2e8f0);
        border-radius: 10px;
        padding: 12px 16px !important;
        margin-bottom: 16px !important;
    }
    body #dashboardDiv .bg-dashboard > :is(h4, h6) {
        margin: 0 !important;
    }
    body #dashboardDiv .bg-dashboard > .card-body {
        padding: 0 0 0 12px !important;
    }
    /* Nested chart cards are content, not a second bordered widget. */
    body #dashboardDiv .card .card {
        border: 0 !important;
        margin: 0 !important;
        box-shadow: none !important;
    }
    @media (max-width: 767px) {
        body .erp-dashboard-shell #erp-layout-page-body { padding: 8px !important; }
        body .erp-dashboard-shell .dashboard-welcome > .card-body,
        body #dashboardDiv .card > .card-body,
        body #dashboardDiv .metric-tile,
        body #dashboardDiv .erp-dashboard-chart-card { padding: 12px !important; }
    }

    /* Shared section bars, including headings inside legacy form-grid rows. */
    body #erp-layout-page-body .erp-section-heading {
        box-sizing: border-box;
        grid-column: 1 / -1;
        padding: 10px 14px !important;
        min-height: 42px;
        border: 1px solid var(--erp-theme-border, #e2e8f0);
        border-left: 3px solid var(--erp-theme-accent, #64748b);
        border-radius: 6px;
        background: var(--erp-theme-soft, #f8fafc);
        color: var(--erp-theme-ink, #334155) !important;
        font-size: 14px !important;
        line-height: 22px;
    }
    body #erp-layout-page-body .erp-section-heading::before,
    body #erp-layout-page-body .erp-section-heading::after {
        display: none;
    }
    body #erp-layout-page-body .erp-section-heading {
        margin: 16px 0 12px !important;
    }
    body .erp-entry-shell #erp-layout-page-body .form-group.row:has(> .erp-section-heading) {
        margin: 16px 0 12px !important;
    }
    body #erp-layout-page-body .form-group.row > .erp-section-heading {
        margin: 0 !important;
    }
    body #erp-layout-page-body .erp-section-heading:first-child {
        margin-top: 0 !important;
    }

    /* Support both direct Bootstrap tab links and legacy li > a markup. */
    body :is(.erp-entry-shell, .erp-form-page, .erp-standard-entry):is(#erp-layout-page-body, #erp-layout-page-body *, .erp-entry-shell) .nav-tabs {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
        padding: 4px 4px 0 !important;
        margin: 16px 0 8px !important;
        background: var(--erp-theme-soft, #f8fafc);
        border: 1px solid var(--erp-theme-border, #e2e8f0);
        border-radius: 8px 8px 0 0;
        min-width: 0;
        list-style: none;
    }
    body :is(.erp-entry-shell, .erp-form-page, .erp-standard-entry):is(#erp-layout-page-body, #erp-layout-page-body *, .erp-entry-shell) .nav-tabs > li {
        float: none;
        margin: 0;
        padding: 0;
    }
    body :is(.erp-entry-shell, .erp-form-page, .erp-standard-entry):is(#erp-layout-page-body, #erp-layout-page-body *, .erp-entry-shell) .nav-tabs > :is(a, button),
    body :is(.erp-entry-shell, .erp-form-page, .erp-standard-entry):is(#erp-layout-page-body, #erp-layout-page-body *, .erp-entry-shell) .nav-tabs > li > :is(a, button) {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 4px;
        box-sizing: border-box;
        min-height: 36px;
        max-width: 100%;
        padding: 6px 12px !important;
        margin: 0 !important;
        border: 0 !important;
        border-bottom: 3px solid transparent !important;
        border-radius: 6px 6px 0 0 !important;
        background: transparent !important;
        color: #52647b !important;
        font-size: 13px;
        letter-spacing: normal;
        font-weight: 500;
        line-height: 20px;
        white-space: normal;
        text-decoration: none;
        box-shadow: none !important;
    }
    body :is(.erp-entry-shell, .erp-form-page, .erp-standard-entry):is(#erp-layout-page-body, #erp-layout-page-body *, .erp-entry-shell) .nav-tabs :is(a, button):hover {
        background: var(--erp-theme-soft, #f8fafc) !important;
        color: var(--erp-theme-ink, #334155) !important;
    }
    body :is(.erp-entry-shell, .erp-form-page, .erp-standard-entry):is(#erp-layout-page-body, #erp-layout-page-body *, .erp-entry-shell) .nav-tabs > :is(a, button).active,
    body :is(.erp-entry-shell, .erp-form-page, .erp-standard-entry):is(#erp-layout-page-body, #erp-layout-page-body *, .erp-entry-shell) .nav-tabs > li.active > :is(a, button),
    body :is(.erp-entry-shell, .erp-form-page, .erp-standard-entry):is(#erp-layout-page-body, #erp-layout-page-body *, .erp-entry-shell) .nav-tabs > li > :is(a, button).active {
        background: var(--erp-theme-selected, #edf2fa) !important;
        border-bottom-color: var(--erp-theme-accent, #64748b) !important;
        color: var(--erp-theme-ink, #334155) !important;
        font-weight: 600;
    }
    body :is(.erp-entry-shell, .erp-form-page, .erp-standard-entry):is(#erp-layout-page-body, #erp-layout-page-body *, .erp-entry-shell) .nav-tabs :is(a, button):is(.disabled, [aria-disabled="true"], :disabled) {
        opacity: .5;
        cursor: not-allowed;
    }

    /* Match text fields to dropdowns without rounding joined input-group edges. */
    body #erp-layout-page-body :is(input, select, textarea).form-control:not([type="checkbox"], [type="radio"], .input-group *) {
        border-radius: 6px !important;
    }

    #erp-layout-page-body {
        min-width: 0;
        color: #25354a;
    }

    /* The reference pages and Settings already have their own presentation. */
    #erp-layout-page-body:not([data-erp-dashboard-page="true"]):not(.erp-standard-page, .erp-page, .erp-settings-page):not(:has(.erp-page, .erp-settings-page)) {
        background-color: var(--erp-theme-soft, #f5f7fb);
        border-radius: 8px;
        padding-top: 12px;
        padding-bottom: 12px;
    }
    #erp-layout-page-body :is(.form-control, .bootstrap-select > .dropdown-toggle):not(.erp-page *, .erp-settings-page *, table *, .modal *, .is-invalid, .is-valid, [aria-invalid="true"], .has-error *, .has-success *, .has-warning *) {
        border-color: var(--erp-theme-border, #cbd5e1);
        border-radius: 6px;
        background-color: var(--erp-theme-surface, #fff);
        color: #25354a;
        box-shadow: none;
        font-size: 13px;
    }
    #erp-layout-page-body :is(input.form-control, select.form-control, .bootstrap-select > .dropdown-toggle):not(.erp-page *, .erp-settings-page *, table *, .modal *) {
        min-height: 34px;
    }
    #erp-layout-page-body :is(input.form-control, select.form-control, textarea.form-control):not(.erp-page *, .erp-settings-page *, table *, .modal *) {
        max-width: 100%;
        box-sizing: border-box;
    }
    #erp-layout-page-body .form-control[readonly]:not(.erp-page *, .erp-settings-page *, table *, .modal *) {
        background-color: #f3f5f8;
    }
    #erp-layout-page-body .form-control:disabled:not(.erp-page *, .erp-settings-page *, table *, .modal *) {
        background-color: #e9ecef;
    }
    #erp-layout-page-body :is(.form-control, .bootstrap-select > .dropdown-toggle):focus-visible:not(.erp-page *, .erp-settings-page *, table *, .modal *, .is-invalid, .is-valid, [aria-invalid="true"], .has-error *, .has-success *, .has-warning *) {
        border-color: var(--erp-theme-ink, #3569cf);
        outline: 2px solid var(--erp-theme-focus, #dbe8ff);
        outline-offset: 1px;
    }
    #erp-layout-page-body .label-control:not(.erp-page *, .erp-settings-page *, table *, .modal *) {
        font-size: 13px;
        font-weight: 600;
        line-height: 1.4;
    }
    #erp-layout-page-body .form-group.row:not(.erp-page *, .erp-settings-page *, table *, .modal *, .erp-report-filter-host *) {
        margin-bottom: 12px;
    }

    /* Preserve semantic button variants; theme only the existing primary actions. */
    #erp-layout-page-body .btn:not(.erp-page *, .erp-settings-page *, table *, .modal *, .erp-report-toolbar *) {
        border-radius: 6px;
        font-size: 13px;
    }
    #erp-layout-page-body .btn-primary:not(.erp-page *, .erp-settings-page *, table *, .modal *) {
        background-color: var(--erp-theme-accent, #3569cf);
        border-color: var(--erp-theme-accent, #3569cf);
        color: var(--erp-theme-on-accent, #fff);
    }
    #erp-layout-page-body .btn-primary:is(:hover, :focus-visible):not(:disabled, .disabled):not(.erp-page *, .erp-settings-page *, table *, .modal *) {
        background-color: var(--erp-theme-hover, #2459bb);
        border-color: var(--erp-theme-hover, #2459bb);
        color: var(--erp-theme-on-hover, #fff);
    }

    /* Do not change display on conditional action containers or report toolbars. */
    #erp-layout-page-body .card-footer:not(.erp-page *, .erp-settings-page *, table *, .modal *, .erp-report-action-bar, .erp-report-toolbar) {
        text-align: center;
        padding: 12px;
        border-top-color: var(--erp-theme-border, #dce3ed);
        background-color: var(--erp-theme-surface, #fff);
    }
    #erp-layout-page-body .card-footer > :is(.btn, input[type="submit"], input[type="button"]):not(.erp-page *, .erp-settings-page *, table *, .modal *, .erp-report-toolbar *) {
        margin: 3px;
        max-width: 100%;
        white-space: normal;
    }

    /* Compact management filters without regrouping labels or moving controls. */
    #erp-layout-page-body .panel-group:not(.erp-page *, .erp-settings-page *) {
        margin-bottom: 8px;
    }
    #erp-layout-page-body .panel-heading:not(.erp-page *, .erp-settings-page *, .modal *) {
        padding: 10px;
        background-color: var(--erp-theme-selected, #edf3fc);
        border: 1px solid var(--erp-theme-border, #dce3ed);
        border-radius: 6px;
    }
    #erp-layout-page-body .panel-title:not(.erp-page *, .erp-settings-page *, .modal *) {
        font-size: 14px;
        line-height: 1.5;
    }
    #erp-layout-page-body .panel-collapse > .panel-body:not(.erp-page *, .erp-settings-page *, .modal *) {
        padding: 12px;
        background-color: var(--erp-theme-surface, #fff);
        border-radius: 6px;
    }

    /* Style existing tables and DataTables controls; never initialize a table here. */
    #erp-layout-page-body .table:not(.erp-page *, .erp-settings-page *, .modal *) {
        font-size: 12px;
        border-color: var(--erp-theme-border, #dce3ed);
    }
    #erp-layout-page-body .table > :is(thead, tbody, tfoot) > tr > :is(th, td):not(.erp-page *, .erp-settings-page *, .modal *) {
        padding: 6px 8px;
        vertical-align: middle;
    }
    #erp-layout-page-body .table > thead > tr > th:not(.erp-page *, .erp-settings-page *, .modal *, .bg-danger, .bg-success, .bg-warning, .table-danger, .table-success, .table-warning, .danger, .success, .warning) {
        background-color: var(--erp-theme-selected, #edf3fc);
        color: var(--erp-theme-ink, #263e63);
        border-color: var(--erp-theme-border, #dce3ed);
    }
    #erp-layout-page-body .table td:has(> a:is([title="Edit"], [title="Delete"])):not(.erp-page *, .erp-settings-page *, .modal *) {
        width: 1%;
        white-space: nowrap;
    }
    #erp-layout-page-body :is(.dataTables_length, .dataTables_filter, .dataTables_info, .dataTables_paginate):not(.erp-page *, .erp-settings-page *, .modal *) {
        font-size: 12px;
        margin-top: 6px;
        margin-bottom: 6px;
    }
    #erp-layout-page-body :is(.dataTables_length select, .dataTables_filter input):not(.erp-page *, .erp-settings-page *, .modal *) {
        min-height: 30px;
        max-width: 100%;
        padding: 4px 8px;
        border: 1px solid var(--erp-theme-border, #cbd5e1);
        border-radius: 6px;
        background-color: var(--erp-theme-surface, #fff);
        color: #25354a;
    }
}

@media screen and (max-width: 767px) {
    body:not(.erp-report-screen) .erp-content-shell:not(.erp-dashboard-shell, .erp-entry-shell, .erp-list-shell, .erp-settings-shell) > .card-body {
        padding: 12px;
    }

    #erp-layout-page-body:not([data-erp-dashboard-page="true"]):not(.erp-standard-page, .erp-page, .erp-settings-page):not(:has(.erp-page, .erp-settings-page)) {
        padding: 10px;
    }
    #erp-layout-page-body .panel-title .pull-right:not(.erp-page *, .erp-settings-page *, .modal *) {
        float: none !important;
        margin-top: 6px;
    }
    #erp-layout-page-body .dataTables_filter input:not(.erp-page *, .erp-settings-page *, .modal *) {
        width: 140px;
    }
}

/* Compact desktop presentation. Keep mobile touch targets and print layouts intact. */
@media screen and (min-width: 992px) {
    body #erp-layout-page-body {
        --erp-ui-control-height: 34px;
        --erp-button-width: 124px;
        --erp-button-gap: 6px;
    }
    body #erp-layout-page-body .erp-section-heading {
        min-height: 36px;
        padding: 6px 12px !important;
        margin-bottom: 8px !important;
    }
    body .erp-entry-shell #erp-layout-page-body .form-group.row:has(> .erp-section-heading) {
        margin-bottom: 8px !important;
    }
    body #erp-layout-page-body .erp-vehicle-form-grid,
    body.erp-report-screen #erp-layout-page-body .erp-report-filter-host,
    body #erp-layout-page-body .erp-search-panel.erp-search-five-columns {
        column-gap: 12px;
        row-gap: 8px;
    }
    body #erp-layout-page-body :is(.erp-field, .erp-search-field, .erp-report-filter-field) > label {
        margin-bottom: 3px;
        line-height: 18px;
    }
    body #erp-layout-page-body .erp-data-table > :is(thead, tbody, tfoot) > tr > :is(th, td) {
        padding: 6px 8px;
        line-height: 1.4;
        vertical-align: middle;
    }
    body #dashboardDiv .card > .card-body,
    body .erp-dashboard-shell .dashboard-welcome > .card-body {
        padding: 14px !important;
    }
    body .dashboard-welcome .dashboard-quote {
        padding-top: 4px;
        line-height: 1.45;
    }
}

/* Feedback without moving controls, delaying content, or animating business data. */
@media screen and (prefers-reduced-motion: no-preference) {
    body #erp-layout-page-body :is(.form-control, .nav-tabs a, .nav-tabs button, .erp-table-icon, .paginate_button),
    body #dashboardDiv .card {
        transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease, box-shadow 140ms ease;
    }
    body #erp-layout-page-body .table-hover > tbody > tr > td {
        transition: background-color 120ms ease;
    }
}
@media screen and (prefers-reduced-motion: reduce) {
    body #erp-layout-page-body :is(.erp-button, .form-control, .nav-tabs a, .nav-tabs button, .erp-table-icon, .paginate_button),
    body #erp-layout-page-body .table-hover > tbody > tr > td,
    body #dashboardDiv .card {
        transition: none !important;
    }
}

@media screen and (max-width: 767px) {
    body #erp-layout-page-body { --erp-ui-control-height: 40px; }
}

/* Compact form/list shells: one gutter rather than nested page and card padding. */
@media screen {
    body .erp-entry-shell.card > .card-body,
    body .erp-list-shell.card > .card-body { padding: 10px !important; }
    body .erp-entry-shell #erp-layout-page-body .erp-form-page,
    body .erp-entry-shell #erp-layout-page-body .form-body:not(.form-body .form-body):not(.erp-form-page .form-body) {
        padding: 0 !important;
    }
    body .main-content-wrap:has(.erp-entry-shell, .erp-list-shell) .page-header {
        margin-bottom: 6px;
    }
    body .main-content-wrap:has(.erp-entry-shell, .erp-list-shell) .page-header-left {
        padding: 6px 0;
    }
    body .main-content-wrap:has(.erp-entry-shell, .erp-list-shell) .page-header-left > h3 {
        margin-bottom: 0;
        line-height: 24px;
    }
    body .erp-list-shell #erp-layout-page-body .panel-heading {
        padding-top: 0 !important;
        padding-bottom: 6px !important;
    }
    body .erp-list-shell #erp-layout-page-body .panel-group {
        margin-bottom: 6px !important;
    }
    body .erp-list-shell #erp-layout-page-body .erp-table-topbar {
        margin: 0 0 6px !important;
        padding: 0 !important;
        min-height: 0;
    }
    body .erp-list-shell #erp-layout-page-body :is(.dataTables_length, .dataTables_filter) {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
    body .erp-entry-shell #erp-layout-page-body .form-group.row:has(> .erp-section-heading) {
        margin-top: 10px !important;
        margin-bottom: 6px !important;
    }
    body .erp-entry-shell #erp-layout-page-body .form-body > .form-group.row:first-child:has(> .erp-section-heading) {
        margin-top: 0 !important;
    }
}
@media screen and (min-width: 992px) {
    body .erp-entry-shell #erp-layout-page-body .erp-vehicle-form-grid {
        row-gap: 6px;
    }
    body .erp-entry-shell #erp-layout-page-body .erp-section-heading {
        min-height: 30px;
        padding: 4px 10px !important;
        margin-bottom: 6px !important;
        line-height: 20px;
    }
}

/* Page hierarchy: title, page actions, then data controls and records. */
@media screen {
    body .main-content-wrap .page-header-left {
        padding: 8px 12px !important;
        margin: 0 0 8px;
        border-left: 3px solid var(--erp-theme-accent, #64748b);
        border-radius: 0 6px 6px 0;
        background: var(--erp-theme-soft, #f8fafc);
    }
    body .main-content-wrap .page-header-left > :is(h1, h2, h3, .erp-report-page-title) {
        margin: 0 !important;
        color: var(--erp-theme-ink, #334155) !important;
        font-size: 17px;
        font-weight: 600;
        line-height: 24px;
        letter-spacing: normal;
    }
    body #erp-layout-page-body :is(.erp-search-heading, .erp-list-action-toolbar):not(.modal *),
    body #erp-layout-page-body :is(.panel-heading, .card-header):has(> .panel-title :is(a, button, input[type="button"], input[type="submit"])):not(.modal *) {
        padding: 8px 10px !important;
        margin-bottom: 8px;
        background: var(--erp-theme-soft, #f8fafc) !important;
        border: 1px solid var(--erp-theme-border, #e2e8f0) !important;
        border-radius: 6px;
    }
    body #erp-layout-page-body :is(.erp-search-heading, .panel-heading, .card-header) > .panel-title {
        margin: 0 !important;
    }
    body #erp-layout-page-body :is(table.dataTable, table.erp-data-table, table.table) {
        border-bottom: 1px solid var(--erp-theme-border, #cbd5e1) !important;
    }
    body #erp-layout-page-body :is(table.dataTable, table.erp-data-table, table.table) > tbody > tr:last-child > :is(td, th) {
        border-bottom: 1px solid var(--erp-theme-border, #cbd5e1) !important;
    }
}

/* Search is part of the existing page surface, not another stack of bordered cards. */
@media screen {
    body #erp-layout-page-body .panel-heading.erp-search-heading,
    body #erp-layout-page-body .panel-heading:has(> .erp-list-action-toolbar),
    body #erp-layout-page-body .panel-heading:has(> .panel-title) {
        border: 0 !important;
        box-shadow: none !important;
    }
    body #erp-layout-page-body .panel-heading .erp-list-action-toolbar {
        border: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        background: transparent !important;
    }
    body #erp-layout-page-body .panel-collapse > .panel-body.erp-search-panel,
    body #erp-layout-page-body .erp-search-panel.erp-search-five-columns {
        border: 0 !important;
        border-radius: 0;
        box-shadow: none !important;
        background: transparent !important;
        padding: 8px 10px !important;
        margin: 0 0 6px !important;
    }
    body #erp-layout-page-body .erp-search-panel.erp-search-five-columns .erp-search-panel-actions {
        border: 0 !important;
        padding: 4px 0 0 !important;
        margin: 0 !important;
        gap: 6px;
    }
}

/* One management layout contract: compact title, toolbar and filter rows. */
@media screen {
    body .main-content-wrap:has(.erp-list-shell, .erp-entry-shell) .page-header {
        margin: 0 0 4px !important;
        padding: 0 !important;
        border-bottom: 0 !important;
    }
    body .main-content-wrap:has(.erp-list-shell, .erp-entry-shell) .page-header-left {
        padding: 5px 10px !important;
        margin: 0 !important;
    }
    body #erp-layout-page-body .panel-group .panel-heading:has(> .panel-title) {
        box-sizing: border-box;
        padding: 3px 8px !important;
        margin: 0 0 4px !important;
        min-height: 0 !important;
        height: auto !important;
        border: 0 !important;
        border-left: 3px solid var(--erp-theme-accent, #64748b) !important;
        background: var(--erp-theme-soft, #f8fafc) !important;
        box-shadow: none !important;
    }
    body #erp-layout-page-body .panel-group .panel-heading > .panel-title,
    body #erp-layout-page-body .panel-group .panel-heading > .erp-list-action-toolbar {
        padding: 0 !important;
        margin: 0 !important;
        min-height: 0 !important;
        border: 0 !important;
        background: transparent !important;
        line-height: 1;
        gap: 6px;
    }
    body #erp-layout-page-body .panel-group .panel-collapse > .panel-body.erp-search-panel.erp-search-five-columns {
        border: 0 !important;
        border-left: 3px solid var(--erp-theme-accent, #64748b) !important;
        border-radius: 0 !important;
        background: var(--erp-theme-soft, #f8fafc) !important;
        padding: 6px 10px !important;
        margin: 0 0 6px !important;
        row-gap: 6px;
    }
}
@media screen and (min-width: 768px) {
    body #erp-layout-page-body .panel-group .panel-heading > .panel-title .erp-button:not(.erp-button-icon) {
        height: 28px !important;
        min-height: 28px !important;
        padding: 0 10px !important;
        line-height: 26px !important;
        font-size: 12px !important;
    }
}
@media screen and (min-width: 1200px) {
    body #erp-layout-page-body .panel-group .erp-search-panel.erp-search-five-columns .erp-search-panel-actions {
        grid-column: -3 / -1 !important;
        padding: 0 !important;
        margin: 0 !important;
        align-self: end;
        border: 0 !important;
    }
}

/* Match stable table markers as well as the transient DataTables class.
 * Angular removes/recreates plugin classes while refreshing report rows. */
/* Quiet data headers: neutral labels, theme accents reserved for interaction. */
@media screen {
    body #erp-layout-page-body :is(table.dataTable, table.erp-data-table, table[datatable], table[data-datatable], table[data-erp-table="true"]) > thead > tr > th {
        background: var(--erp-theme-soft, #f8fafc) !important;
        color: #334155 !important;
        border-top: 1px solid var(--erp-theme-border, #dce3ed) !important;
        border-bottom: 1px solid var(--erp-theme-border, #dce3ed) !important;
        border-left-color: transparent;
        border-right-color: transparent;
        padding: 7px 26px 7px 10px !important;
        font-size: 12px !important;
        font-weight: 600;
        line-height: 20px;
        letter-spacing: normal !important;
        vertical-align: middle;
    }
    body #erp-layout-page-body :is(table.dataTable, table.erp-data-table, table[datatable], table[data-datatable], table[data-erp-table="true"]) > thead > tr > th[aria-sort] {
        color: var(--erp-theme-ink, #334155) !important;
    }
    body #erp-layout-page-body table.dataTable thead :is(.sorting, .sorting_asc, .sorting_desc)::before,
    body #erp-layout-page-body table.dataTable thead :is(.sorting, .sorting_asc, .sorting_desc)::after {
        font-size: 11px;
        bottom: 9px;
    }
    body #erp-layout-page-body .erp-column-filter-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 24px;
        height: 24px;
        padding: 0;
        margin-left: 4px;
        border: 0;
        border-radius: 4px;
        background: transparent;
        color: #64748b !important;
        font-size: 11px;
        opacity: 1;
        vertical-align: middle;
    }
    body #erp-layout-page-body .erp-column-filter-icon:is(:hover, :focus-visible, .is-active, [aria-expanded="true"]) {
        color: var(--erp-theme-ink, #334155) !important;
        background: var(--erp-theme-selected, #edf2fa) !important;
    }
    body #erp-layout-page-body .erp-table-topbar {
        gap: 8px 12px;
        align-items: center;
        font-size: 12px;
    }
    body #erp-layout-page-body .erp-table-topbar :is(select, input) {
        height: 32px;
        min-height: 32px;
        padding: 4px 8px;
        border-radius: 5px;
        font-size: 12px;
    }
    body #erp-layout-page-body .erp-table-topbar .erp-table-count {
        font-size: 12px;
        color: #64748b;
    }
    body #erp-layout-page-body .dataTables_paginate .paginate_button {
        border-radius: 5px;
        font-size: 12px;
    }
}

/* Secondary row tools stay separate from Edit/Delete and size to their contents. */
@media screen {
    body #erp-layout-page-body table .erp-secondary-action-column {
        width: 1%;
        white-space: nowrap;
        text-align: center;
    }
    body #erp-layout-page-body td.erp-secondary-action-column :is(a, button) {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 24px;
        min-height: 24px;
        margin: 0 2px;
        vertical-align: middle;
    }
    body #erp-layout-page-body td.erp-secondary-action-column :is(a, button):hover {
        background-color: var(--erp-theme-selected, #edf2fa);
        border-radius: 4px;
    }
}

/* Submenu group names are captions, visually distinct from navigable pages. */
@media screen {
    body #kt_header_menu .erp-mega-menu h3.kt-menu__heading {
        padding: 7px 10px !important;
        margin: 0 0 6px !important;
        background: var(--erp-theme-selected, #edf2fa) !important;
        border: 0 !important;
        border-left: 3px solid var(--erp-theme-accent, #64748b) !important;
        border-radius: 4px;
    }
    body #kt_header_menu .erp-mega-menu h3.kt-menu__heading .kt-menu__link-text {
        color: var(--erp-theme-ink, #334155) !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        letter-spacing: .025em;
        line-height: 18px;
    }
    body #kt_header_menu .erp-mega-menu h3.kt-menu__heading .erp-mega-section-icon {
        font-size: 13px;
        color: var(--erp-theme-ink, #334155) !important;
    }
    body #kt_header_menu .erp-mega-menu h3.kt-menu__heading .erp-mega-section-count {
        background: var(--erp-theme-surface, #fff);
        color: var(--erp-theme-ink, #334155);
        border-radius: 4px;
        padding: 1px 6px;
        font-size: 11px;
        line-height: 16px;
    }
    body #kt_header_menu .erp-mega-menu .kt-menu__inner .kt-menu__link-text {
        font-weight: 400 !important;
    }
    body #kt_header_menu .erp-mega-menu .kt-menu__inner .erp-mega-current .kt-menu__link-text {
        font-weight: 600 !important;
    }
}

/* Consistent checkbox spacing; keep native controls and focus feedback intact. */
@media screen {
    body #erp-layout-page-body input[type="checkbox"] {
        padding: 0 !important;
        margin: 0 6px 0 0 !important;
        vertical-align: middle;
        flex-shrink: 0;
    }
    body #erp-layout-page-body label:has(> input[type="checkbox"]) {
        min-height: 20px !important;
        height: auto;
        padding: 2px 0 !important;
        gap: 6px;
        align-items: center;
        line-height: 20px;
        box-sizing: border-box;
    }
    body #erp-layout-page-body label > input[type="checkbox"],
    body #erp-layout-page-body td > input[type="checkbox"] {
        margin: 0 !important;
    }
    body #erp-layout-page-body input[type="checkbox"] + label {
        margin-left: 0;
        vertical-align: middle;
    }
    /* Filters and results share the page surface; avoid an enclosing accent frame. */
    body .erp-content-shell #erp-layout-page-body .erp-search-panel.erp-search-five-columns,
    body #erp-layout-page-body .panel-collapse > .panel-body.erp-search-panel,
    body.erp-report-screen #erp-layout-page-body .erp-report-layout {
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
    }
}

/* Report results share one neutral surface, rather than legacy blue card layers. */
@media screen {
    body.erp-report-screen .erp-content-shell,
    body.erp-report-screen .erp-content-shell > .card-body {
        background: #fff !important;
        background-image: none !important;
        box-shadow: none !important;
    }
    body.erp-report-screen #erp-layout-page-body :is(.card, .card-body, .card-block, .dataTables_wrapper, .table-responsive):not(.modal *) {
        background: transparent !important;
        background-image: none !important;
        box-shadow: none !important;
        border: 0 !important;
    }
    body.erp-report-screen #erp-layout-page-body table:is(.dataTable, .table, .erp-data-table, [datatable], [data-datatable]) {
        background: #fff !important;
        color: #334155;
        border-bottom: 1px solid var(--erp-theme-border, #dce3ed) !important;
    }
    body.erp-report-screen #erp-layout-page-body table:is(.dataTable, .table, .erp-data-table, [datatable], [data-datatable]) > tbody > tr:not(.selected, .table-danger, .table-warning, .table-success, .danger, .warning, .success) > td:not(.table-danger, .table-warning, .table-success, .danger, .warning, .success) {
        background: #fff !important;
        padding: 6px 10px !important;
        border-color: #e8edf3 !important;
        line-height: 1.45;
        box-shadow: none !important;
    }
    body.erp-report-screen #erp-layout-page-body table:is(.dataTable, .table, .erp-data-table, [datatable], [data-datatable]) > tbody > tr:nth-child(even):not(.selected, .table-danger, .table-warning, .table-success, .danger, .warning, .success) > td:not(.table-danger, .table-warning, .table-success, .danger, .warning, .success) {
        background: #f8fafc !important;
    }
    body.erp-report-screen #erp-layout-page-body table:is(.dataTable, .table, .erp-data-table, [datatable], [data-datatable]) > tbody > tr:not(.table-danger, .table-warning, .table-success, .danger, .warning, .success):hover > td:not(.table-danger, .table-warning, .table-success, .danger, .warning, .success) {
        background: var(--erp-theme-soft, #f1f5f9) !important;
    }
    body.erp-report-screen #erp-layout-page-body table:is(.dataTable, .table, .erp-data-table, [datatable], [data-datatable]) > :is(thead, tfoot) > tr > :is(th, td) {
        background: var(--erp-theme-selected, #edf2fa) !important;
        color: var(--erp-theme-ink, #334155) !important;
        border-color: var(--erp-theme-border, #dce3ed) !important;
        padding: 7px 10px;
        font-weight: 600;
    }
    body.erp-report-screen #erp-layout-page-body .dataTables_wrapper .dataTables_paginate .paginate_button.current {
        background: var(--erp-theme-selected, #edf2fa) !important;
        border-color: var(--erp-theme-border, #dce3ed) !important;
        color: var(--erp-theme-ink, #334155) !important;
    }
    body.erp-report-screen #erp-layout-page-body .dataTables_wrapper :is(.dataTables_length, .dataTables_filter, .dataTables_info, .dataTables_paginate) {
        background: transparent !important;
        font-size: 12px;
    }
}

/* A single report band follows the selected theme without framing each control. */
@media screen {
    body.erp-report-screen #erp-layout-page-body .erp-report-filter-host {
        border: 0 !important;
        border-left: 3px solid var(--erp-theme-accent, #3768d5) !important;
        border-radius: 0 6px 6px 0 !important;
        background: var(--erp-theme-soft, #f5f7fc) !important;
        box-shadow: none !important;
        padding: 10px 12px !important;
        gap: 8px 12px;
    }
    body.erp-report-screen #erp-layout-page-body .btn-tab.btn-active,
    body.erp-report-screen #erp-layout-page-body .btn-tab.btn-active:hover {
        box-shadow: inset 0 -3px 0 var(--erp-theme-accent, #3768d5) !important;
    }
    body.erp-report-screen #erp-layout-page-body .erp-report-options {
        border-top: 1px solid var(--erp-theme-border, #dce3ed) !important;
        padding: 8px 0 0 !important;
        margin: 2px 0 0 !important;
    }
    body.erp-report-screen #erp-layout-page-body .erp-report-choice-group legend {
        color: var(--erp-theme-ink, #315fba);
        font-weight: 600;
        letter-spacing: .02em;
        margin-bottom: 4px;
    }
    body.erp-report-screen #erp-layout-page-body .erp-report-choice-group label {
        border-radius: 4px;
        padding: 2px 4px;
        gap: 6px;
    }
    body.erp-report-screen #erp-layout-page-body .erp-report-choice-group label:has(input:checked) {
        background: var(--erp-theme-selected, #e3eafb);
        color: var(--erp-theme-ink, #315fba);
    }
}

/* Narrow screens: contain legacy widths without changing desktop/print layouts. */
@media screen and (max-width: 991px) {
    body .erp-content-shell,
    body #erp-layout-page-body,
    body #erp-layout-page-body :is(.card, .card-body, .card-block, .panel, .panel-body, .tab-content, .tab-pane) {
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }
    body #erp-layout-page-body :is(.table-responsive, .erp-table-scroll, .erp-report-scroll, .erp-entry-table-scroll, .dataTables_wrapper) {
        min-width: 0;
        max-width: 100%;
    }
    body #erp-layout-page-body :is(.erp-field, .erp-search-field, .erp-report-filter-field, .erp-field-control) {
        min-width: 0;
    }
    body #erp-layout-page-body :is(.erp-field, .erp-search-field, .erp-report-filter-field) > :is(.form-control, .bootstrap-select, .input-group) {
        max-width: 100% !important;
        min-width: 0;
    }
    body .modal-dialog {
        max-width: calc(100% - 24px) !important;
        box-sizing: border-box;
    }
    body #erp-layout-page-body .erp-chart-container {
        max-width: 100%;
        min-width: 0;
    }
}
@media screen and (max-width: 767px) {
    body #erp-layout-page-body :is(.erp-table-topbar, .erp-table-tools, .erp-form-action-bar, .erp-report-action-bar, .erp-search-panel-actions) {
        flex-wrap: wrap;
        gap: 6px;
        min-width: 0;
        max-width: 100%;
    }
    body #erp-layout-page-body :is(.dataTables_filter, .dataTables_length) {
        max-width: 100%;
        white-space: normal;
    }
    body #erp-layout-page-body .dataTables_filter label {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 6px;
        max-width: 100%;
    }
    body #erp-layout-page-body .dataTables_filter input {
        max-width: 100% !important;
        margin-left: 0 !important;
        box-sizing: border-box;
    }
    body #erp-layout-page-body .dataTables_paginate {
        white-space: normal;
    }
    body #erp-layout-page-body .dataTables_paginate .pagination {
        flex-wrap: wrap;
    }
    body #erp-layout-page-body .nav-tabs {
        flex-wrap: wrap;
        height: auto;
        min-width: 0;
    }
    body #erp-layout-page-body .nav-tabs :is(a, .nav-link) {
        white-space: normal;
        overflow-wrap: anywhere;
    }
    body.erp-report-screen #erp-layout-page-body fieldset.erp-report-choice-group {
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }
    body #erp-layout-page-body :is(.erp-toolbar-actions, .erp-form-action-bar, .erp-report-action-bar) .erp-button {
        min-width: 0 !important;
        max-width: 100%;
        white-space: normal;
        height: auto;
    }
}

/* Match the mobile navigation breakpoint, including tablets such as 799px. */
@media screen and (max-width: 1024px) {
    body .mobile-view .main-content-wrap:not(.vms-footer-layout) {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 10px;
        padding-right: 10px;
        box-sizing: border-box;
    }
    body .mobile-view .main-content-wrap:not(.vms-footer-layout) > .col-md-12,
    body .mobile-view .main-content-wrap .erp-content-shell,
    body .mobile-view .erp-content-shell > .card-body,
    body .mobile-view #erp-layout-page-body {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0;
        flex: 0 0 100%;
        box-sizing: border-box;
    }
    body .mobile-view .main-content-wrap:not(.vms-footer-layout) > .col-md-12 {
        padding-left: 0;
        padding-right: 0;
    }
    body .mobile-view .erp-content-shell > .card-body > .row {
        margin-left: 0;
        margin-right: 0;
        min-width: 0;
    }
    body .mobile-view #erp-layout-page-body {
        padding-left: 0;
        padding-right: 0;
    }
    body .mobile-view #erp-layout-page-body :is(.erp-form-grid, .erp-vehicle-form-grid) {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }
}

/* Report shells should fit their content; tables retain their own scroll regions. */
@media screen {
    body.erp-report-screen .main-content-wrap:not(.vms-footer-layout),
    body.erp-report-screen .erp-content-shell,
    body.erp-report-screen .erp-content-shell > .card-body,
    body.erp-report-screen #erp-layout-page-body,
    body.erp-report-screen #erp-layout-page-body :is(.erp-report-layout, .erp-report-content, .erp-report-filter-host) {
        min-height: 0 !important;
        height: auto !important;
    }
    body.erp-report-screen #erp-layout-page-body :is(.erp-report-layout, .erp-report-content, .erp-report-filter-host) {
        align-content: start;
    }
    body.erp-report-screen #erp-layout-page-body > br:last-child {
        display: none;
    }
}

/* Shared import/upload surfaces: preserve controls and bindings in their original DOM. */
@media screen {
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) .form-group.row:has(> label):not(:has(table)) {
        display: grid;
        grid-template-columns: minmax(120px, 1fr) minmax(0, 2fr) minmax(120px, 1fr) minmax(0, 2fr);
        align-items: center;
        gap: 8px 14px;
        margin: 0 0 10px;
    }
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) .form-group.row:has(> label):not(:has(table))::before,
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) .form-group.row:has(> label):not(:has(table))::after { display: none; }
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) .form-group.row:has(> label):not(:has(table)) > :is(label, [class*="col-"]) {
        width: 100% !important; max-width: 100% !important; min-width: 0;
        margin: 0 !important; padding: 0 !important; float: none; box-sizing: border-box;
    }
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) .form-group.row > label { font-size: 13px; line-height: 20px; }
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) :is(.form-control, .bootstrap-select) { max-width: 100%; }
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) .bootstrap-select { width: 100% !important; }
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) .modal-body { padding: 14px; overflow-x: auto; }
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) :is(.card-body, .box-body):has(> table) {
        max-width: 100%; min-width: 0; overflow-x: auto; padding: 0;
    }
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) table { width: 100%; border-collapse: collapse; }
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) table > thead > :is(tr > th, th) {
        background: var(--erp-theme-selected, #edf2fa) !important;
        color: var(--erp-theme-ink, #334155) !important;
        padding: 8px 10px !important; font-size: 12px; line-height: 18px;
        vertical-align: middle; letter-spacing: normal; white-space: nowrap;
        border: 1px solid var(--erp-theme-border, #dce3ed);
    }
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) table > tbody > tr > td { padding: 6px 10px; vertical-align: middle; }
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) table input[type="checkbox"] { margin: 0 4px; vertical-align: middle; }
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) .modal-footer { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; padding: 10px 14px; }
}
@media screen and (max-width: 991px) {
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) .form-group.row:has(> label):not(:has(table)) {
        grid-template-columns: minmax(110px, 1fr) minmax(0, 2fr);
    }
}
@media screen and (max-width: 575px) {
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) .form-group.row:has(> label):not(:has(table)) {
        grid-template-columns: minmax(0, 1fr); gap: 5px;
    }
    body :is([data-erp-import-page="true"], .modal[id*="import" i], .modal[id*="upload" i]) .form-group.row > label:not(:first-child) { margin-top: 6px !important; }
}

/* Plain tables keep their cell indexes while omitting empty secondary actions. */
#erp-layout-page-body .erp-empty-secondary-action { display: none !important; }

/* E-invoice upload and acknowledgement details share one aligned row. */
@media screen {
    body #erp-layout-page-body .erp-einvoice-panel {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
        align-items: start;
        gap: 12px 20px;
        border-top: 0;
        padding-top: 0;
    }
    body #erp-layout-page-body .erp-einvoice-panel > .erp-section-heading {
        grid-column: 1 / -1;
        margin-bottom: 0;
    }
    body #erp-layout-page-body .erp-einvoice-panel > .erp-document-meta {
        margin: 0;
        padding: 12px 14px;
        align-self: stretch;
        align-content: start;
        gap: 10px 16px;
    }
    body #erp-layout-page-body .erp-einvoice-panel .erp-attachment-widget {
        flex: 1 1 240px;
        width: auto;
        max-width: 100%;
        margin: 0;
        box-sizing: border-box;
    }
    body #erp-layout-page-body .erp-einvoice-panel .erp-document-meta dd {
        line-height: 1.5;
        white-space: normal;
        overflow-wrap: anywhere;
    }
}
@media screen and (max-width: 991px) {
    body #erp-layout-page-body .erp-einvoice-panel {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Only the table region is busy; navigation and filters remain available. */
#erp-layout-page-body .erp-table-region { position: relative; min-width: 0; isolation: isolate; }
#erp-layout-page-body .erp-table-loading { min-height: 140px; }
#erp-layout-page-body .erp-table-loading-message { display: none; }
#erp-layout-page-body .erp-table-loading > .erp-table-loading-message {
    display: flex; position: absolute; inset: 0; z-index: 10;
    align-items: center; justify-content: center; gap: 10px;
    background: rgba(255,255,255,.9); color: var(--erp-theme-ink, #334155);
    font-size: 13px; font-weight: 600;
}
#erp-layout-page-body .erp-table-loading-message::before {
    content: ''; width: 18px; height: 18px; border-radius: 50%;
    border: 2px solid var(--erp-theme-border, #dce3ed);
    border-top-color: var(--erp-theme-accent, #3768d5);
    animation: erp-table-spin .8s linear infinite;
}
@keyframes erp-table-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    #erp-layout-page-body .erp-table-loading-message::before { animation: none; }
}
#erp-layout-page-body table :is(th, td).erp-action-column {
    text-align: center !important; vertical-align: middle; white-space: nowrap;
}

/* Use the chosen UI palette before and after DataTables/Angular initialization. */
@media screen {
    body :is(#erp-layout-page-body, .modal) table.table.table-bordered.table-striped {
        background: #fff;
        border-color: var(--erp-theme-border, #dce3ed) !important;
    }
    body :is(#erp-layout-page-body, .modal) table.table.table-bordered.table-striped > :is(thead, tfoot) > tr > :is(th, td) {
        background: var(--erp-theme-selected, #edf2fa) !important;
        color: var(--erp-theme-ink, #334155) !important;
        border-color: var(--erp-theme-border, #dce3ed) !important;
    }
    body :is(#erp-layout-page-body, .modal) table.table.table-bordered.table-striped > tbody > tr:not(.selected, .table-danger, .table-warning, .table-success, .table-info, .danger, .warning, .success, .info) > :is(td, th):not(.selected, .table-danger, .table-warning, .table-success, .table-info, .danger, .warning, .success, .info) {
        background: #fff !important;
        border-color: var(--erp-theme-border, #dce3ed) !important;
    }
    body :is(#erp-layout-page-body, .modal) table.table.table-bordered.table-striped > tbody > tr:nth-child(even):not(.selected, .table-danger, .table-warning, .table-success, .table-info, .danger, .warning, .success, .info) > :is(td, th):not(.selected, .table-danger, .table-warning, .table-success, .table-info, .danger, .warning, .success, .info) {
        background: var(--erp-theme-soft, #f8fafc) !important;
    }
    body :is(#erp-layout-page-body, .modal) table.table.table-bordered.table-striped > tbody > tr:hover:not(.selected, .table-danger, .table-warning, .table-success, .table-info, .danger, .warning, .success, .info) > :is(td, th):not(.selected, .table-danger, .table-warning, .table-success, .table-info, .danger, .warning, .success, .info) {
        background: var(--erp-theme-selected, #edf2fa) !important;
    }
}

/* Menu polish stays within the existing navigation and theme palette. */
@media screen {
    body #kt_header_menu .erp-mega-menu {
        border-color: var(--erp-theme-border, #dce3ed);
        border-radius: 10px;
        box-shadow: 0 12px 30px rgba(30, 41, 59, .14);
    }
    body #kt_header_menu .erp-mega-heading {
        background: linear-gradient(110deg, var(--erp-theme-soft, #f8fafc), #fff);
        padding: 14px 18px;
        gap: 10px;
    }
    body #kt_header_menu .erp-mega-heading strong { line-height: 1.4; }
    body #kt_header_menu .erp-mega-summary { font-size: 12px; line-height: 1.5; color: #64748b; }
    body #kt_header_menu .erp-mega-menu .kt-menu__content > .kt-menu__item {
        border-color: var(--erp-theme-border, #e2e8f0);
        background: #fff;
        border-radius: 8px;
    }
    body #kt_header_menu .erp-mega-menu .kt-menu__inner .kt-menu__link {
        border-radius: 6px;
    }
    body #kt_header_menu .erp-mega-menu .kt-menu__inner .kt-menu__link:focus-visible {
        outline: 2px solid var(--erp-theme-accent, #3768d5);
        outline-offset: -2px;
        background: var(--erp-theme-soft, #f8fafc);
    }
}
@media screen and (min-width: 1025px) {
    body #kt_header_menu > .kt-menu__nav > .kt-menu__item > .kt-menu__link {
        border-radius: 7px;
    }
    body #kt_header_menu > .kt-menu__nav > .kt-menu__item > .kt-menu__link:focus-visible {
        outline: 2px solid currentColor;
        outline-offset: -3px;
    }
}
@media screen and (prefers-reduced-motion: no-preference) {
    body #kt_header_menu > .kt-menu__nav > .kt-menu__item > .kt-menu__link,
    body #kt_header_menu .erp-mega-menu .kt-menu__inner .kt-menu__link {
        transition: background-color 140ms ease, color 140ms ease, box-shadow 140ms ease;
    }
    body #kt_header_menu > .kt-menu__nav > :is(.kt-menu__item--open, .kt-menu__item--hover) > .erp-mega-menu > .kt-menu__subnav {
        animation: erp-menu-reveal 180ms ease-out both;
    }
    body #kt_header_menu .erp-mega-menu .kt-menu__inner .erp-mega-link-icon {
        transition: transform 140ms ease;
    }
    body #kt_header_menu .erp-mega-menu .kt-menu__inner .kt-menu__link:hover .erp-mega-link-icon {
        transform: translateX(2px);
    }
}
@keyframes erp-menu-reveal {
    from { opacity: .35; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}
@media screen and (prefers-reduced-motion: reduce) {
    body #kt_header_menu .erp-mega-menu,
    body #kt_header_menu .erp-mega-menu *,
    body #kt_header_menu > .kt-menu__nav > .kt-menu__item > .kt-menu__link {
        animation: none !important;
        transition: none !important;
    }
}

/* Shared list filters: a single theme band, without nested panel borders. */
@media screen {
    body .erp-content-shell #erp-layout-page-body .erp-search-panel.erp-search-five-columns,
    body #erp-layout-page-body .panel-collapse > .panel-body.erp-search-panel {
        border-left: 3px solid var(--erp-theme-accent, #3768d5) !important;
    }
    #erp-layout-page-body table :is(th, td).erp-secondary-action-column {
        text-align: center !important;
        vertical-align: middle;
    }
}

/* Replace the legacy fixed-color GIF without changing its show/hide lifecycle. */
body #loader { background-image: none !important; background-color: rgba(255,255,255,.88); }
body #loader::after {
    content: ""; position: absolute; top: 50%; left: 50%;
    width: 28px; height: 28px; margin: -14px 0 0 -14px;
    border: 3px solid var(--erp-theme-border); border-top-color: var(--erp-theme-accent);
    border-radius: 50%; animation: erp-table-spin .8s linear infinite;
}
@media (prefers-reduced-motion: reduce) { body #loader::after { animation: none; } }

/* Upload fields retain a predictable grid without legacy label/control offsets. */
body #erp-layout-page-body .erp-upload-form-grid {
    display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px 16px; align-items: start; margin: 0 0 12px; width: 100%;
}
body #erp-layout-page-body .erp-upload-form-field { min-width: 0; }
body #erp-layout-page-body .erp-upload-form-field > label { display: block; margin: 0 0 4px; }
body #erp-layout-page-body .erp-upload-form-field .erp-attachment-widget,
body #erp-layout-page-body .erp-upload-form-field > .bootstrap-select { width: 100% !important; max-width: 100%; }
body #erp-layout-page-body .erp-upload-file-field > .erp-upload-template-link { margin-top: 6px; }
@media (max-width: 991px) {
    body #erp-layout-page-body .erp-upload-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
    body #erp-layout-page-body .erp-upload-form-grid { grid-template-columns: minmax(0, 1fr); }
}

/* Purchase totals: explicit fields, without blank Bootstrap offset labels. */
body .erp-order-summary {
    clear: both; display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px 16px; padding-top: 12px; margin: 0;
    grid-column: 1 / -1; width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box;
}
body .erp-order-summary > div { min-width: 0; width: auto; margin: 0; }
body .erp-order-summary label { display: block; margin: 0 0 4px; }
body .erp-order-summary .form-control { width: 100%; }
body .erp-order-summary-remarks { grid-column: 1 / -1; }
body .erp-order-summary-remarks textarea { min-height: 100px; resize: vertical; }
@media (max-width: 991px) {
    body .erp-order-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
    body .erp-order-summary { grid-template-columns: minmax(0, 1fr); }
}

/* Explicitly scoped settings and GPS filter layouts. */
body #erp-layout-page-body :is(.erp-aligned-filters, .erp-defaults-settings) .erp-aligned-row {
    display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px 16px; margin: 0 0 10px !important; padding: 0 !important;
}
body #erp-layout-page-body .erp-defaults-settings .erp-aligned-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
body #erp-layout-page-body .erp-aligned-row > [class*="col-"]:empty { display: none; }
body #erp-layout-page-body .erp-aligned-field { min-width: 0; }
body #erp-layout-page-body .erp-aligned-field > label,
body #erp-layout-page-body .erp-aligned-control {
    width: 100% !important; max-width: none !important; flex: none !important;
    float: none !important; padding: 0 !important; margin: 0 !important;
}
body #erp-layout-page-body .erp-aligned-field > label {
    display: block; margin-bottom: 5px !important; font-weight: 600;
}
body #erp-layout-page-body .erp-aligned-control .bootstrap-select { width: 100% !important; }
body #erp-layout-page-body .erp-aligned-datetime {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px;
}
body #erp-layout-page-body .erp-aligned-datetime > .clockpicker {
    width: 100%; max-width: none; padding: 0;
}
body #erp-layout-page-body .erp-defaults-settings .erp-aligned-field {
    padding: 10px 12px; border: 1px solid var(--erp-theme-border, #e2e8f0);
    border-radius: 6px; background: #fff;
}
body #erp-layout-page-body .erp-defaults-settings .erp-aligned-option {
    display: grid; grid-template-columns: minmax(0, 1fr) 18px;
    align-items: center; gap: 12px;
}
body #erp-layout-page-body .erp-defaults-settings .erp-aligned-option > label {
    width: auto !important; min-width: 0; overflow-wrap: anywhere;
}
body #erp-layout-page-body .erp-defaults-settings .erp-aligned-option > .erp-aligned-control {
    width: 18px !important; min-width: 0; display: flex; align-items: center;
}
body #erp-layout-page-body .erp-aligned-option > label { margin: 0 !important; cursor: pointer; }
body #erp-layout-page-body .erp-aligned-option > .erp-aligned-control { width: auto !important; }
body #erp-layout-page-body .erp-aligned-option input[type="checkbox"] { margin: 0; width: 18px; height: 18px; }
body #erp-layout-page-body .erp-defaults-settings .tab-pane > br,
body #erp-layout-page-body .erp-aligned-filters > br { display: none; }
body #erp-layout-page-body .erp-defaults-settings .tab-pane > h5 {
    padding: 10px 0; margin: 0 0 10px !important; color: var(--erp-theme-ink, #334155);
    border-bottom: 1px solid var(--erp-theme-border, #e2e8f0);
}
@media (max-width: 991px) {
    body #erp-layout-page-body .erp-aligned-filters .erp-aligned-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
    body #erp-layout-page-body :is(.erp-aligned-filters, .erp-defaults-settings) .erp-aligned-row { grid-template-columns: minmax(0, 1fr); }
}

/* GPS reports share a compact filter section; preserve report-type visibility. */
body #erp-layout-page-body .erp-gps-filter-panel {
    border-left: 3px solid var(--erp-theme-accent, #64748b);
    padding: 10px 12px; margin-bottom: 12px;
    background: var(--erp-theme-surface, #f8fafc);
}
body #erp-layout-page-body .erp-gps-filter-heading {
    margin: 0 0 10px; padding: 0 0 8px; font-size: 14px; font-weight: 600;
    color: var(--erp-theme-ink, #334155);
    border-bottom: 1px solid var(--erp-theme-border, #e2e8f0);
}
body #erp-layout-page-body .erp-gps-filter-grid {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 16px;
}
body #erp-layout-page-body .erp-gps-filter-grid .erp-aligned-row,
body #erp-layout-page-body .erp-gps-filter-grid > .nav:not([hidden]):not(.ng-hide):not([style*="display: none"]):not([style*="display:none"]) {
    display: contents !important;
}
body #erp-layout-page-body .erp-gps-filter-grid > br { display: none; }
body #erp-layout-page-body .erp-gps-filter-grid .erp-aligned-field > label {
    min-height: 20px; display: flex; align-items: center; gap: 6px;
}
body #erp-layout-page-body .erp-gps-filter-grid label input[type="checkbox"] { margin: 0; }
@media (max-width: 991px) {
    body #erp-layout-page-body .erp-gps-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
    body #erp-layout-page-body .erp-gps-filter-grid { grid-template-columns: minmax(0, 1fr); }
}
