:root {
    --spp-navy: #102a43;
    --spp-navy-2: #163c5d;
    --spp-emerald: #0f9f75;
    --spp-emerald-dark: #087f5b;
    --spp-teal-soft: #e8f8f3;
    --spp-blue-soft: #edf5ff;
    --spp-amber-soft: #fff7e6;
    --spp-red-soft: #fff0f0;
    --spp-slate: #62748a;
    --spp-border: #e6ebf1;
    --spp-bg: #f5f7fa;
    --spp-shadow: 0 10px 32px rgba(16, 42, 67, .07);
}

body { background: var(--spp-bg); color: var(--spp-navy); }
.spp-brand-mark { width: 37px; height: 37px; display: inline-grid; place-items: center; color: white; background: linear-gradient(135deg, var(--spp-emerald), var(--spp-emerald-dark)); border-radius: 11px; font-size: 1.2rem; box-shadow: 0 6px 15px rgba(15,159,117,.2); }
.spp-brand-lockup { height: 70px; display: flex !important; align-items: center; gap: .65rem; text-align: left; line-height: normal !important; padding: 0 14px; }
.spp-brand-lockup > span:not(.spp-brand-mark) { display: flex; flex-direction: column; justify-content: center; line-height: 1.15 !important; }
.spp-brand-lockup strong { display: block; color: var(--spp-navy); font-size: .92rem; line-height: 1.1; }
.spp-brand-lockup small { display: block; color: #8291a3; font-size: .62rem; margin-top: .18rem; text-transform: uppercase; letter-spacing: .055em; }
[data-sidebar="dark"] .spp-brand-lockup strong { color: white; }
.spp-user-dropdown { width: 290px; margin-top: .65rem !important; padding: 0; overflow: hidden; border: 1px solid var(--spp-border); border-radius: 14px; box-shadow: 0 18px 45px rgba(16,42,67,.16); }
.spp-user-menu-head { display: flex; align-items: center; gap: .8rem; padding: 1rem; background: linear-gradient(135deg,#f3fbf8,#f7fafc); border-bottom: 1px solid var(--spp-border); }
.spp-user-menu-avatar { width: 44px; height: 44px; flex: 0 0 auto; padding: 3px; object-fit: cover; border: 1px solid #dce7e3; border-radius: 13px; background: #fff; }
.spp-user-menu-name { overflow: hidden; color: var(--spp-navy); font-size: .9rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.spp-user-menu-role { margin-top: .12rem; color: #7a899b; font-size: .72rem; }
.spp-user-menu-body { padding: .45rem; }
.spp-user-menu-item { display: flex; align-items: center; gap: .7rem; padding: .7rem; border: 0; border-radius: 9px; color: #33485f; }
.spp-user-menu-item:hover,.spp-user-menu-item:focus { color: var(--spp-navy); background: #f3f7f9; }
.spp-user-menu-item strong,.spp-user-menu-item small { display: block; }
.spp-user-menu-item strong { font-size: .8rem; font-weight: 750; }
.spp-user-menu-item small { margin-top: .08rem; color: #8795a5; font-size: .67rem; }
.spp-user-menu-icon { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; background: var(--spp-teal-soft); color: var(--spp-emerald-dark); font-size: 1rem; }
.spp-logout-item { width: 100%; text-align: left; }
.spp-logout-item .spp-user-menu-icon { color: #c23d3d; background: #ffeded; }
.spp-logout-item:hover { color: #a92f2f; background: #fff5f5; }
.spp-user-menu-foot { padding: .65rem 1rem; border-top: 1px solid var(--spp-border); color: #8795a5; background: #fbfcfd; font-size: .67rem; text-align: center; }
.spp-user-menu-foot i { margin-right: .2rem; color: var(--spp-emerald); }
[data-layout-mode="dark"] .spp-user-dropdown { border-color: #33465a; background: #23364a; }
[data-layout-mode="dark"] .spp-user-menu-head { border-color: #33465a; background: linear-gradient(135deg,#263e4d,#26384b); }
[data-layout-mode="dark"] .spp-user-menu-name,[data-layout-mode="dark"] .spp-user-menu-item { color: #e5edf5; }
[data-layout-mode="dark"] .spp-user-menu-item:hover { background: #2c4257; }
[data-layout-mode="dark"] .spp-user-menu-foot { border-color: #33465a; background: #203246; }
.page-content { background: radial-gradient(circle at 100% 0, rgba(15, 159, 117, .06), transparent 26rem), var(--spp-bg); }
.spp-page { max-width: 1680px; margin: 0 auto; }
.spp-page .card { border: 1px solid var(--spp-border); box-shadow: var(--spp-shadow); border-radius: 16px; }
.spp-page .card-header { background: transparent; border-bottom: 1px solid var(--spp-border); padding: 1.25rem 1.4rem; }
.spp-page .card-body { padding: 1.4rem; }
.spp-page-title { font-size: 1.3rem; font-weight: 750; letter-spacing: -.025em; margin: 0; color: var(--spp-navy); }
.spp-page-subtitle { color: var(--spp-slate); margin: .35rem 0 0; font-size: .875rem; }
.spp-eyebrow { color: var(--spp-emerald-dark); font-weight: 700; font-size: .7rem; text-transform: uppercase; letter-spacing: .11em; }

.spp-hero { position: relative; overflow: hidden; color: white; background: linear-gradient(120deg, #102a43 0%, #174a66 58%, #0d8067 100%); border: 0 !important; }
.spp-hero::after { content: ''; position: absolute; width: 330px; height: 330px; right: -120px; top: -170px; border: 55px solid rgba(255,255,255,.07); border-radius: 50%; }
.spp-hero::before { content: ''; position: absolute; width: 160px; height: 160px; right: 170px; bottom: -115px; border: 35px solid rgba(255,255,255,.045); border-radius: 50%; }
.spp-hero .card-body { position: relative; z-index: 2; padding: 1.55rem 1.7rem; }
.spp-hero h3 { color: #fff; font-weight: 750; letter-spacing: -.03em; }
.spp-hero p { color: rgba(255,255,255,.72); }

.spp-metric { height: 100%; transition: transform .2s ease, box-shadow .2s ease; }
.spp-metric:hover { transform: translateY(-3px); box-shadow: 0 15px 36px rgba(16, 42, 67, .11); }
.spp-metric .card-body { padding: 1.15rem 1.2rem; }
.spp-metric-label { font-size: .77rem; color: var(--spp-slate); font-weight: 650; margin-bottom: .45rem; }
.spp-metric-value { font-size: 1.35rem; letter-spacing: -.04em; color: var(--spp-navy); font-weight: 780; line-height: 1.15; }
.spp-metric-note { color: #8291a3; font-size: .72rem; margin-top: .4rem; }
.spp-icon { width: 43px; height: 43px; display: inline-grid; place-items: center; border-radius: 13px; font-size: 1.25rem; flex: 0 0 auto; }
.spp-icon.green { color: var(--spp-emerald-dark); background: var(--spp-teal-soft); }
.spp-icon.blue { color: #2563a9; background: var(--spp-blue-soft); }
.spp-icon.amber { color: #b87503; background: var(--spp-amber-soft); }
.spp-icon.red { color: #d04747; background: var(--spp-red-soft); }
.spp-icon.navy { color: var(--spp-navy); background: #edf1f5; }

.spp-btn-primary { background: linear-gradient(135deg, var(--spp-emerald), var(--spp-emerald-dark)); border: 0; color: white; box-shadow: 0 7px 15px rgba(15,159,117,.2); }
.spp-btn-primary:hover, .spp-btn-primary:focus { color: white; background: linear-gradient(135deg, #0e8f6b, #076c4f); transform: translateY(-1px); }
.spp-btn-dark { background: var(--spp-navy); color: white; border: 0; }
.spp-btn-dark:hover { background: #0b2034; color: white; }
.spp-page .btn { border-radius: 9px; font-weight: 650; }
.spp-page .btn-sm { border-radius: 8px; }

.spp-filter { display: flex; gap: .75rem; flex-wrap: wrap; align-items: end; padding: 1rem 1.1rem; background: #fff; border: 1px solid var(--spp-border); border-radius: 14px; box-shadow: 0 6px 22px rgba(16,42,67,.045); }
.spp-filter .form-label { font-size: .68rem; text-transform: uppercase; letter-spacing: .07em; color: var(--spp-slate); font-weight: 750; margin-bottom: .35rem; }
.spp-filter .form-control, .spp-filter .form-select { min-height: 40px; border-color: var(--spp-border); }
.spp-filter-grow { flex: 1 1 230px; }
.spp-filter-item { flex: 0 1 170px; }
.spp-page .form-control, .spp-page .form-select { border-radius: 9px; border-color: #dde4ec; }
.spp-page .form-control:focus, .spp-page .form-select:focus { border-color: rgba(15,159,117,.6); box-shadow: 0 0 0 .18rem rgba(15,159,117,.1); }
.spp-page .form-label { font-weight: 650; color: #40546a; font-size: .8rem; }
.spp-required::after { content: ' *'; color: #dc4c4c; }
.spp-page.spp-loading { opacity: .62; pointer-events: none; transition: opacity .15s ease; }
.spp-filter-enter { animation: sppFilterEnter .22s ease-out; }
@keyframes sppFilterEnter { from { opacity: .55; transform: translateY(3px); } to { opacity: 1; transform: translateY(0); } }

.select2-container { width: 100% !important; }
.select2-container .select2-selection--single { height: 40px; border: 1px solid #dde4ec; border-radius: 9px; background: #fff; }
.select2-container .select2-selection--single .select2-selection__rendered { line-height: 38px; padding-left: 12px; padding-right: 34px; color: #33485f; font-size: .8125rem; }
.select2-container .select2-selection--single .select2-selection__arrow { height: 38px; right: 7px; }
.select2-container .select2-selection--single .select2-selection__clear { margin-right: 7px; color: #8391a2; }
.select2-container .select2-selection--multiple { min-height: 40px; border: 1px solid #dde4ec; border-radius: 9px; padding: 3px 7px; }
.select2-container--default .select2-selection--multiple .select2-selection__choice { background: var(--spp-teal-soft); border: 0; color: var(--spp-emerald-dark); border-radius: 6px; padding: 3px 7px; }
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single { border-color: rgba(15,159,117,.65); box-shadow: 0 0 0 .18rem rgba(15,159,117,.1); }
.select2-dropdown { border: 1px solid #dfe6ed; border-radius: 10px; overflow: hidden; box-shadow: 0 14px 35px rgba(16,42,67,.14); z-index: 1065; }
.select2-container--open .select2-dropdown--below { margin-top: 5px; }
.select2-search--dropdown { padding: 9px; background: #f8fafc; }
.select2-search--dropdown .select2-search__field { border: 1px solid #dbe4eb !important; border-radius: 7px; padding: 7px 9px; outline: none; }
.select2-results__option { padding: 8px 11px; color: #40546a; font-size: .8rem; }
.select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--spp-emerald); color: white; }
.select2-container--default .select2-results__option[aria-selected=true] { background: var(--spp-teal-soft); color: var(--spp-emerald-dark); }
.spp-filter .select2-container .select2-selection--single { min-height: 40px; }
.modal .select2-container { z-index: 1060; }
[data-layout-mode="dark"] .select2-container .select2-selection--single { background: #243447; border-color: #3a4a5e; }
[data-layout-mode="dark"] .select2-container .select2-selection--single .select2-selection__rendered { color: #dce4ed; }

/* Select2 v3 compatibility for the theme bundle used by this application. */
.select2-container.form-select {
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none !important;
    box-shadow: none;
}
.select2-container .select2-choice {
    height: 40px;
    padding: 0 38px 0 12px;
    border: 1px solid #dde4ec;
    border-radius: 9px;
    background: #fff !important;
    box-shadow: none;
    color: #33485f;
    font-size: .8125rem;
    line-height: 38px;
}
.select2-container .select2-choice > .select2-chosen { margin-right: 0; line-height: 38px; }
.select2-container .select2-choice .select2-arrow {
    width: 36px;
    height: 38px;
    border: 0;
    background: transparent;
}
.select2-container .select2-choice .select2-arrow b {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 7px;
    height: 7px;
    border: 0;
    border-right: 1.5px solid #607086;
    border-bottom: 1.5px solid #607086;
    background: none !important;
    transform: rotate(45deg);
    transition: transform .15s ease;
}
.select2-dropdown-open .select2-choice .select2-arrow b { top: 17px; transform: rotate(225deg); }
.select2-container-active .select2-choice,
.select2-dropdown-open .select2-choice { border-color: rgba(15,159,117,.65); box-shadow: 0 0 0 .18rem rgba(15,159,117,.1); }
.select2-drop {
    margin-top: 5px;
    border: 1px solid #dfe6ed;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 14px 35px rgba(16,42,67,.14);
    overflow: hidden;
}
.select2-drop-active { border: 1px solid #dfe6ed; }
.select2-search { padding: 9px; background: #f8fafc; }
.select2-search input { min-height: 36px; padding: 7px 9px; border: 1px solid #dbe4eb; border-radius: 7px; background: #fff; }
.select2-results { margin: 0; padding: 5px; }
.select2-results .select2-result-label { padding: 8px 10px; border-radius: 7px; color: #40546a; font-size: .8rem; }
.select2-results .select2-highlighted { background: var(--spp-emerald); color: #fff; }
.select2-results .select2-highlighted .select2-result-label { color: #fff; }
.select2-results .select2-no-results,
.select2-results .select2-searching { padding: 10px; background: transparent; color: #8492a4; font-size: .8rem; }
.select2-container-multi .select2-choices { min-height: 40px; border: 1px solid #dde4ec; border-radius: 9px; background: #fff; }
.select2-container-multi .select2-choices .select2-search-choice { margin: 5px 0 3px 5px; padding: 5px 8px 5px 22px; border: 0; border-radius: 6px; background: var(--spp-teal-soft); color: var(--spp-emerald-dark); box-shadow: none; }
[data-layout-mode="dark"] .select2-container .select2-choice,
[data-layout-mode="dark"] .select2-drop,
[data-layout-mode="dark"] .select2-search input { background: #243447 !important; border-color: #3a4a5e; color: #dce4ed; }
[data-layout-mode="dark"] .select2-results .select2-result-label { color: #dce4ed; }

.spp-table { margin: 0; vertical-align: middle; }
.spp-table thead th { background: #f8fafc; color: #607086; font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; border-bottom: 1px solid var(--spp-border); padding: .8rem .9rem; white-space: nowrap; }
.spp-table tbody td { padding: .82rem .9rem; border-color: #eef1f5; color: #33485f; }
.spp-table tbody tr:hover td { background: #fbfdfd; }
.spp-table .primary-text { color: var(--spp-navy); font-weight: 700; }
.spp-table .secondary-text { color: #8492a4; font-size: .75rem; }
.spp-datatable.dataTable { width: 100% !important; margin: 0 !important; }
.spp-datatable.dataTable thead .sorting,
.spp-datatable.dataTable thead .sorting_asc,
.spp-datatable.dataTable thead .sorting_desc { cursor: pointer; padding-right: 1.8rem; }
.spp-datatable-toolbar { display: flex; justify-content: flex-end; padding: 1rem 1.25rem; border-bottom: 1px solid var(--spp-border); background: #fff; }
.spp-datatable-search .dataTables_filter { float: none !important; margin: 0; text-align: left; }
.spp-datatable-search .dataTables_filter label { display: block; margin: 0; }
.spp-datatable-search .dataTables_filter input { width: min(320px, 72vw); height: 38px; margin: 0 !important; padding: .5rem .8rem; border: 1px solid #dde4ec; border-radius: 9px; background: #fff; color: #33485f; font-size: .8rem; outline: none; box-shadow: none; }
.spp-datatable-search .dataTables_filter input:focus { border-color: rgba(15,159,117,.65); box-shadow: 0 0 0 .18rem rgba(15,159,117,.1); }
.spp-datatable-footer { display: grid; grid-template-columns: minmax(150px,.8fr) minmax(220px,1fr) minmax(260px,1.2fr); align-items: center; gap: 1rem; padding: 1rem 1.25rem; border-top: 1px solid var(--spp-border); background: #fff; }
.spp-datatable-length .dataTables_length,
.spp-datatable-info .dataTables_info,
.spp-datatable-pagination .dataTables_paginate { float: none !important; margin: 0 !important; padding: 0 !important; }
.spp-datatable-length .dataTables_length { display: flex; align-items: center; color: #6e7f93; font-size: .75rem; }
.spp-datatable-length .dataTables_length label { display: flex; align-items: center; gap: .45rem; margin: 0; white-space: nowrap; }
.spp-datatable-length .select2-container { width: 82px !important; min-height: 0 !important; height: 32px; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
.spp-datatable-length .select2-container .select2-choice,
.spp-datatable-length .select2-container .select2-selection--single { height: 32px; border: 1px solid #dde4ec; border-radius: 8px; box-shadow: none; }
.spp-datatable-length .select2-container .select2-choice,
.spp-datatable-length .select2-container .select2-choice > .select2-chosen,
.spp-datatable-length .select2-container .select2-selection--single .select2-selection__rendered { line-height: 30px; }
.spp-datatable-length .select2-container .select2-choice .select2-arrow,
.spp-datatable-length .select2-container .select2-selection--single .select2-selection__arrow { height: 30px; }
.spp-datatable-info .dataTables_info { color: #718198; font-size: .75rem; text-align: center; }
.spp-datatable-pagination .pagination { justify-content: flex-end; gap: .25rem; margin: 0; }
.spp-datatable-pagination .page-link { min-width: 32px; height: 32px; display: inline-grid; place-items: center; border: 0; border-radius: 8px !important; background: #f3f6f9; color: #506176; font-size: .75rem; box-shadow: none; }
.spp-datatable-pagination .page-item.active .page-link { background: var(--spp-navy); color: #fff; }
.spp-datatable-pagination .page-item.disabled .page-link { opacity: .42; }
.dataTables_wrapper .dataTables_processing { top: 72px; left: 50%; width: auto; height: auto; margin: 0; padding: .65rem 1rem; transform: translateX(-50%); border: 1px solid var(--spp-border); border-radius: 10px; background: rgba(255,255,255,.96); color: var(--spp-navy); font-size: .78rem; font-weight: 700; box-shadow: 0 10px 30px rgba(15,35,55,.12); z-index: 5; }
.dataTables_wrapper .dataTables_empty { padding: 2.5rem 1rem !important; color: #8391a2; text-align: center; }
.spp-avatar { width: 38px; height: 38px; display: inline-grid; place-items: center; color: var(--spp-emerald-dark); background: var(--spp-teal-soft); border-radius: 12px; font-size: .8rem; font-weight: 800; }
.spp-status { display: inline-flex; gap: .35rem; align-items: center; border-radius: 999px; padding: .3rem .6rem; font-size: .68rem; font-weight: 750; white-space: nowrap; }
.spp-status::before { content: ''; width: 6px; height: 6px; background: currentColor; border-radius: 50%; }
.spp-status.success { color: #087f5b; background: #e8f8f3; }
.spp-status.warning { color: #a86700; background: #fff5d9; }
.spp-status.danger { color: #c23d3d; background: #ffeded; }
.spp-status.info { color: #2563a9; background: #eaf3ff; }
.spp-status.muted { color: #687b8f; background: #eef2f6; }
.spp-status.dark { color: #33485f; background: #e9eef3; }
.spp-discount-item { padding: 1rem; border: 1px solid var(--spp-border); border-radius: 12px; background: #fff; }
.spp-discount-item + .spp-discount-item { margin-top: .75rem; }
.spp-discount-meta { display: grid; gap: .35rem; margin-top: .8rem; color: #718198; font-size: .75rem; }
.spp-discount-meta i { margin-right: .25rem; color: var(--spp-emerald); }
@media (min-width: 992px) { .border-end-lg { padding-right: 1.5rem; border-right: 1px solid var(--spp-border); } }

.spp-empty { text-align: center; padding: 3rem 1rem; }
.spp-empty-icon { margin: 0 auto 1rem; width: 65px; height: 65px; display: grid; place-items: center; background: var(--spp-teal-soft); color: var(--spp-emerald-dark); border-radius: 20px; font-size: 1.65rem; }
.spp-empty h5 { color: var(--spp-navy); font-weight: 700; }
.spp-empty p { color: var(--spp-slate); max-width: 430px; margin: .4rem auto 0; }

.spp-progress { height: 7px; border-radius: 7px; background: #edf1f5; overflow: hidden; }
.spp-progress > span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--spp-emerald), #41c99f); }
.spp-tabs { display: flex; overflow-x: auto; gap: .35rem; padding: .35rem; background: #edf1f5; border-radius: 11px; }
.spp-tabs a { color: #607086; padding: .55rem .85rem; border-radius: 8px; font-size: .78rem; font-weight: 650; white-space: nowrap; }
.spp-tabs a:hover { color: var(--spp-navy); }
.spp-tabs a.active { background: white; color: var(--spp-navy); box-shadow: 0 2px 8px rgba(16,42,67,.08); }
.spp-section-label { display: flex; align-items: center; gap: .6rem; color: var(--spp-navy); font-weight: 750; margin-bottom: 1rem; }
.spp-section-label i { color: var(--spp-emerald); }
.spp-callout { border: 1px solid #cdece2; background: #f0fbf7; color: #286354; padding: .85rem 1rem; border-radius: 11px; font-size: .8rem; }
.spp-callout.warning { border-color: #f6deb1; background: #fffaed; color: #7e5a17; }
.spp-callout.danger { border-color: #f0caca; background: #fff4f4; color: #984444; }
.spp-deposit-switch { padding: .8rem .85rem .8rem 3rem; border: 1px solid #cce9df; border-radius: 10px; background: #f3fbf8; }
.spp-deposit-switch .form-check-input { margin-top: .18rem; }
.spp-deposit-switch .form-text { margin-top: .15rem; color: #718b81; font-size: .7rem; }
.spp-kpi-strip { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: var(--spp-border); border: 1px solid var(--spp-border); border-radius: 13px; overflow: hidden; }
.spp-kpi-strip > div { padding: .85rem 1rem; background: white; }
.spp-kpi-strip small { color: var(--spp-slate); display: block; }
.spp-kpi-strip strong { color: var(--spp-navy); font-size: 1rem; }
.spp-quick-action { display: flex; align-items: center; gap: .8rem; padding: .8rem; border: 1px solid var(--spp-border); border-radius: 12px; color: var(--spp-navy); transition: .2s; }
.spp-quick-action:hover { border-color: #b9e3d7; background: #f8fdfb; color: var(--spp-emerald-dark); transform: translateX(2px); }

.spp-receipt { max-width: 850px; margin: auto; background: white; border-radius: 18px; border: 1px solid var(--spp-border); box-shadow: var(--spp-shadow); overflow: hidden; }
.spp-receipt-head { background: linear-gradient(120deg, var(--spp-navy), #174a66); color: white; padding: 2rem; }
.spp-receipt-mark { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 16px; background: rgba(255,255,255,.12); font-size: 1.6rem; }
.spp-receipt-body { padding: 2rem; }
.spp-receipt-total { border-radius: 13px; background: var(--spp-teal-soft); color: var(--spp-emerald-dark); padding: 1rem 1.2rem; }
.spp-watermark { position: absolute; transform: rotate(-17deg); border: 5px solid currentColor; padding: .5rem 1rem; font-weight: 900; letter-spacing: .15em; opacity: .14; font-size: 2.2rem; }

.spp-modal .modal-content { border: 0; border-radius: 18px; box-shadow: 0 24px 80px rgba(16,42,67,.18); }
.spp-modal .modal-header { padding: 1.25rem 1.4rem; border-color: var(--spp-border); }
.spp-modal .modal-body { padding: 1.4rem; }
.spp-modal .modal-footer { padding: 1rem 1.4rem; border-color: var(--spp-border); }

@media (max-width: 991.98px) {
    .spp-kpi-strip { grid-template-columns: repeat(2,1fr); }
    .spp-filter-item { flex: 1 1 145px; }
}
@media (max-width: 575.98px) {
    .spp-hero .card-body, .spp-page .card-body { padding: 1.1rem; }
    .spp-metric-value { font-size: 1.15rem; }
    .spp-kpi-strip { grid-template-columns: 1fr; }
    .spp-receipt-body, .spp-receipt-head { padding: 1.25rem; }
    .spp-filter > * { flex-basis: 100%; }
    .spp-datatable-footer { grid-template-columns: 1fr; gap: .75rem; }
    .spp-datatable-info .dataTables_info { text-align: left; }
    .spp-datatable-pagination .pagination { justify-content: flex-start; flex-wrap: wrap; }
}

@media print {
    #page-topbar, .app-menu, .footer, .page-title-box, .spp-no-print, .vertical-overlay { display: none !important; }
    .main-content { margin-left: 0 !important; }
    .page-content { padding: 0 !important; background: white !important; }
    .spp-receipt, .card { box-shadow: none !important; border: 0 !important; }
    .container-fluid { padding: 0 !important; }
}