/*
|--------------------------------------------------------------------------
| Hardware POS centralized container system
|--------------------------------------------------------------------------
| Style-only layer.
| Purpose:
| - Reuse the Products page smooth container feel across admin/module pages.
| - Standardize search/filter panels, cards, tables, and pagination.
| - Keep page actions, routes, permissions, icons, and JavaScript unchanged.
| - Avoid advanced CSS selectors for safer browser/editor compatibility.
|--------------------------------------------------------------------------
*/

/* Base tokens */
:root {
    --hpos-model-radius-xl: 22px;
    --hpos-model-radius-lg: 18px;
    --hpos-model-radius-md: 14px;
    --hpos-model-radius-sm: 12px;

    --hpos-model-panel-bg: rgba(255, 255, 255, 0.94);
    --hpos-model-panel-soft: rgba(248, 250, 252, 0.88);
    --hpos-model-panel-head: rgba(241, 245, 249, 0.94);

    --hpos-model-border: var(--line, #e2e8f0);
    --hpos-model-text: var(--text, #0f172a);
    --hpos-model-muted: var(--muted, #64748b);
    --hpos-model-blue: var(--blue, #2563eb);
    --hpos-model-red: var(--red, #dc2626);

    --hpos-model-shadow: 0 18px 38px rgba(15, 23, 42, 0.07);
    --hpos-model-shadow-soft: 0 12px 28px rgba(15, 23, 42, 0.05);
}

[data-theme="dark"],
html[data-theme="dark"],
body[data-theme="dark"],
body.dark {
    --hpos-model-panel-bg: rgba(15, 23, 42, 0.88);
    --hpos-model-panel-soft: rgba(15, 23, 42, 0.70);
    --hpos-model-panel-head: rgba(30, 41, 59, 0.78);
    --hpos-model-border: rgba(148, 163, 184, 0.18);
    --hpos-model-shadow: 0 22px 58px rgba(0, 0, 0, 0.30);
    --hpos-model-shadow-soft: 0 16px 44px rgba(0, 0, 0, 0.22);
}

/* Page rhythm */
.content {
    --hpos-admin-gap: 16px;
}

.content > * + * {
    margin-top: 14px;
}

.content .hpos-page-heading {
    margin-bottom: 18px;
}

.content .hpos-page-heading h1 {
    letter-spacing: -0.025em;
}

/*
|--------------------------------------------------------------------------
| Search / filter / toolbar containers
|--------------------------------------------------------------------------
*/

.content .hpos-page-toolbar,
.content .admin-list-toolbar,
.content .admin-shell-search-row,
.content .activity-filter,
.content .shift-filter,
.content .users-filter,
.content .audit-filter,
.content .reports-modern-filter,
.content .inventory-filter,
.content .activity-log-filter,
.content .hpos-print-barcode-filters,
.content .hpos-contacts-filter,
.content .ledger-filter-card,
.content .stock-adjustments-filter-card,
.content .kb-search-card,
.content .quote-actions {
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-soft) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
}

/* Normal filter spacing */
.content .admin-list-toolbar,
.content .admin-shell-search-row,
.content .activity-filter,
.content .shift-filter,
.content .users-filter,
.content .audit-filter,
.content .reports-modern-filter,
.content .inventory-filter,
.content .activity-log-filter,
.content .hpos-print-barcode-filters,
.content .hpos-contacts-filter,
.content .ledger-filter-card,
.content .stock-adjustments-filter-card,
.content .kb-search-card {
    padding: 14px 16px !important;
    margin-bottom: 14px !important;
    align-items: center !important;
}

/* Remove inner filter/card look when already inside the main toolbar */
.content .hpos-page-toolbar .admin-list-toolbar,
.content .hpos-page-toolbar .admin-shell-search-row,
.content .hpos-page-toolbar .activity-filter,
.content .hpos-page-toolbar .shift-filter,
.content .hpos-page-toolbar .users-filter,
.content .hpos-page-toolbar .audit-filter,
.content .hpos-page-toolbar .reports-modern-filter,
.content .hpos-page-toolbar .inventory-filter,
.content .hpos-page-toolbar .activity-log-filter,
.content .hpos-page-toolbar .hpos-print-barcode-filters,
.content .hpos-page-toolbar .hpos-contacts-filter,
.content .hpos-page-toolbar .ledger-filter-card,
.content .hpos-page-toolbar .stock-adjustments-filter-card,
.content .hpos-page-toolbar .kb-search-card {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Inputs inside filters */
.content .hpos-page-toolbar input,
.content .hpos-page-toolbar select,
.content .hpos-page-toolbar textarea,
.content .admin-list-toolbar input,
.content .admin-list-toolbar select,
.content .admin-list-toolbar textarea,
.content .admin-shell-search-row input,
.content .admin-shell-search-row select,
.content .admin-shell-search-row textarea,
.content .activity-filter input,
.content .activity-filter select,
.content .activity-filter textarea,
.content .shift-filter input,
.content .shift-filter select,
.content .shift-filter textarea,
.content .users-filter input,
.content .users-filter select,
.content .users-filter textarea,
.content .audit-filter input,
.content .audit-filter select,
.content .audit-filter textarea,
.content .reports-modern-filter input,
.content .reports-modern-filter select,
.content .reports-modern-filter textarea,
.content .inventory-filter input,
.content .inventory-filter select,
.content .inventory-filter textarea,
.content .activity-log-filter input,
.content .activity-log-filter select,
.content .activity-log-filter textarea,
.content .hpos-print-barcode-filters input,
.content .hpos-print-barcode-filters select,
.content .hpos-print-barcode-filters textarea,
.content .hpos-contacts-filter input,
.content .hpos-contacts-filter select,
.content .hpos-contacts-filter textarea,
.content .ledger-filter-card input,
.content .ledger-filter-card select,
.content .ledger-filter-card textarea,
.content .stock-adjustments-filter-card input,
.content .stock-adjustments-filter-card select,
.content .stock-adjustments-filter-card textarea,
.content .kb-search-card input,
.content .kb-search-card select,
.content .kb-search-card textarea,
.content .quote-actions input,
.content .quote-actions select,
.content .quote-actions textarea {
    min-height: 42px !important;
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-sm) !important;
    background: var(--hpos-model-panel-bg) !important;
    color: var(--hpos-model-text) !important;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease !important;
}

.content .hpos-page-toolbar input:focus,
.content .hpos-page-toolbar select:focus,
.content .hpos-page-toolbar textarea:focus,
.content .admin-list-toolbar input:focus,
.content .admin-list-toolbar select:focus,
.content .admin-list-toolbar textarea:focus,
.content .admin-shell-search-row input:focus,
.content .admin-shell-search-row select:focus,
.content .admin-shell-search-row textarea:focus,
.content .activity-filter input:focus,
.content .activity-filter select:focus,
.content .activity-filter textarea:focus,
.content .shift-filter input:focus,
.content .shift-filter select:focus,
.content .shift-filter textarea:focus,
.content .users-filter input:focus,
.content .users-filter select:focus,
.content .users-filter textarea:focus,
.content .audit-filter input:focus,
.content .audit-filter select:focus,
.content .audit-filter textarea:focus,
.content .reports-modern-filter input:focus,
.content .reports-modern-filter select:focus,
.content .reports-modern-filter textarea:focus,
.content .inventory-filter input:focus,
.content .inventory-filter select:focus,
.content .inventory-filter textarea:focus,
.content .activity-log-filter input:focus,
.content .activity-log-filter select:focus,
.content .activity-log-filter textarea:focus,
.content .hpos-print-barcode-filters input:focus,
.content .hpos-print-barcode-filters select:focus,
.content .hpos-print-barcode-filters textarea:focus,
.content .hpos-contacts-filter input:focus,
.content .hpos-contacts-filter select:focus,
.content .hpos-contacts-filter textarea:focus,
.content .ledger-filter-card input:focus,
.content .ledger-filter-card select:focus,
.content .ledger-filter-card textarea:focus,
.content .stock-adjustments-filter-card input:focus,
.content .stock-adjustments-filter-card select:focus,
.content .stock-adjustments-filter-card textarea:focus,
.content .kb-search-card input:focus,
.content .kb-search-card select:focus,
.content .kb-search-card textarea:focus,
.content .quote-actions input:focus,
.content .quote-actions select:focus,
.content .quote-actions textarea:focus {
    border-color: var(--hpos-model-blue) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.18) !important;
    outline: none !important;
}

/*
|--------------------------------------------------------------------------
| Cards / panels
|--------------------------------------------------------------------------
*/

.content .card,
.content .card-pad,
.content .content-card,
.content .form-card,
.content .activity-card,
.content .activity-detail-card,
.content .shift-open-card,
.content .shift-summary-card,
.content .hpos-dashboard-card,
.content .hpos-dashboard-summary-card,
.content .kb-card,
.content .kb-side-card,
.content .kb-form-card,
.content .kb-main-card,
.content .kb-category-card,
.content .users-role-card,
.content .role-summary-card,
.content .audit-card,
.content .quote-card,
.content .setting-card,
.content .settings-section,
.content .stat-card,
.content .reports-modern-card,
.content .reports-modern-table-card,
.content .hpos-ledger-card,
.content .ledger-card,
.content .hpos-print-barcode-card,
.content .hpos-print-barcode-preview-card,
.content .hpos-contact-card,
.content .hpos-contact-modal-card,
.content .customer-display-card {
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
}

.content .card-header,
.content .activity-detail-card-header,
.content .audit-card-header,
.content .reports-modern-card-head,
.content .setting-card-header,
.content .settings-section-header,
.content .customer-display-card-header {
    border-bottom: 1px solid var(--hpos-model-border) !important;
    background: var(--hpos-model-panel-head) !important;
}

/*
|--------------------------------------------------------------------------
| Tables
|--------------------------------------------------------------------------
*/

.content .table-wrap,
.content .activity-table-wrap,
.content .activity-change-wrap,
.content .audit-table-wrap,
.content .hpos-ledger-table-wrap,
.content .hpos-print-barcode-table-wrap,
.content .customer-display-table-wrap,
.content .hpos-contact-table-wrap,
.content .hpos-products-table-wrap,
.content .hpos-product-mini-table-wrap {
    width: 100% !important;
    overflow-x: auto !important;
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-lg) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
}

/* When table is already inside a smooth card, remove duplicated inner border feel */
.content .card.card-pad > .table-wrap,
.content .content-card > .table-wrap,
.content .reports-modern-table-card > .table-wrap,
.content .activity-card > .activity-table-wrap,
.content .activity-card > .activity-change-wrap,
.content .audit-card > .audit-table-wrap,
.content .ledger-card > .hpos-ledger-table-wrap,
.content .hpos-ledger-card > .hpos-ledger-table-wrap,
.content .hpos-print-barcode-card > .hpos-print-barcode-table-wrap,
.content .hpos-contact-card > .hpos-contact-table-wrap {
    border-left: 0 !important;
    border-right: 0 !important;
    border-radius: var(--hpos-model-radius-md) !important;
    box-shadow: none !important;
    margin: 0 !important;
}

.content table.table,
.content .activity-table,
.content .activity-change-table,
.content .audit-table,
.content .quote-table,
.content .hpos-ledger-table,
.content .hpos-print-barcode-table,
.content .customer-display-table,
.content .hpos-contact-table,
.content .reports-inventory-table,
.content .hpos-product-mini-table {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: transparent !important;
    color: var(--hpos-model-text) !important;
}

.content table.table thead th,
.content .activity-table thead th,
.content .activity-change-table thead th,
.content .audit-table thead th,
.content .quote-table thead th,
.content .hpos-ledger-table thead th,
.content .hpos-print-barcode-table thead th,
.content .customer-display-table thead th,
.content .hpos-contact-table thead th,
.content .reports-inventory-table thead th,
.content .hpos-product-mini-table thead th {
    background: var(--hpos-model-panel-head) !important;
    border-bottom: 1px solid var(--hpos-model-border) !important;
    color: var(--hpos-model-muted) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: 0.045em !important;
    padding: 14px 16px !important;
    text-align: left !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

.content table.table tbody td,
.content .activity-table tbody td,
.content .activity-change-table tbody td,
.content .audit-table tbody td,
.content .quote-table tbody td,
.content .hpos-ledger-table tbody td,
.content .hpos-print-barcode-table tbody td,
.content .customer-display-table tbody td,
.content .hpos-contact-table tbody td,
.content .reports-inventory-table tbody td,
.content .hpos-product-mini-table tbody td {
    border-bottom: 1px solid var(--hpos-model-border) !important;
    padding: 14px 16px !important;
    vertical-align: middle !important;
}

.content table.table tbody tr:hover,
.content .activity-table tbody tr:hover,
.content .activity-change-table tbody tr:hover,
.content .audit-table tbody tr:hover,
.content .quote-table tbody tr:hover,
.content .hpos-ledger-table tbody tr:hover,
.content .hpos-print-barcode-table tbody tr:hover,
.content .customer-display-table tbody tr:hover,
.content .hpos-contact-table tbody tr:hover,
.content .reports-inventory-table tbody tr:hover,
.content .hpos-product-mini-table tbody tr:hover {
    background: rgba(37, 99, 235, 0.07) !important;
}

.content table.table tbody tr:last-child td,
.content .activity-table tbody tr:last-child td,
.content .activity-change-table tbody tr:last-child td,
.content .audit-table tbody tr:last-child td,
.content .quote-table tbody tr:last-child td,
.content .hpos-ledger-table tbody tr:last-child td,
.content .hpos-print-barcode-table tbody tr:last-child td,
.content .customer-display-table tbody tr:last-child td,
.content .hpos-contact-table tbody tr:last-child td,
.content .reports-inventory-table tbody tr:last-child td,
.content .hpos-product-mini-table tbody tr:last-child td {
    border-bottom: 0 !important;
}

/*
|--------------------------------------------------------------------------
| Pagination
|--------------------------------------------------------------------------
*/

.content .admin-pagination,
.content .activity-log-pagination,
.content .audit-pagination,
.content .hpos-ledger-pagination,
.content .hpos-product-recovery-pagination,
.content .pagination,
.content nav[role="navigation"] {
    border-top: 1px solid var(--hpos-model-border) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: none !important;
    margin-top: 0 !important;
    padding: 14px 16px !important;
}

.content .table-wrap + .admin-pagination,
.content .table-wrap + .activity-log-pagination,
.content .table-wrap + .audit-pagination,
.content .table-wrap + .hpos-ledger-pagination,
.content .table-wrap + .hpos-product-recovery-pagination,
.content .table-wrap + nav[role="navigation"] {
    border-radius: 0 0 var(--hpos-model-radius-lg) var(--hpos-model-radius-lg) !important;
}

/*
|--------------------------------------------------------------------------
| Buttons / action shells
|--------------------------------------------------------------------------
*/

.content .btn,
.content .activity-btn,
.content .admin-btn,
.content .admin-list-btn,
.content .hpos-contact-btn,
.content .mini-btn,
.content .product-view-btn {
    border-radius: var(--hpos-model-radius-sm) !important;
    transition: transform 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease !important;
}

.content .btn:hover,
.content .activity-btn:hover,
.content .admin-btn:hover,
.content .admin-list-btn:hover,
.content .hpos-contact-btn:hover,
.content .mini-btn:hover,
.content .product-view-btn:hover {
    transform: translateY(-1px);
}

.content .btn-primary,
.content .admin-list-btn-primary {
    box-shadow: 0 10px 22px rgba(37, 99, 235, 0.28) !important;
}

.content .btn-danger,
.content .danger,
.content .delete,
.content [data-confirm-delete] {
    border-color: rgba(220, 38, 38, 0.45) !important;
}

.content .btn-icon,
.content .hpos-product-action,
.content .activity-log-action,
.content .hpos-contact-actions .btn,
.content .quote-actions .btn,
.content .actions .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
}

/*
|--------------------------------------------------------------------------
| Badges / pills
|--------------------------------------------------------------------------
*/

.content .badge,
.content .status,
.content .pill,
.content .activity-action-pill,
.content .sync-pill,
.content .filter-summary {
    border-radius: 999px !important;
}

/* Do not force .muted into a pill. It is normal helper text. */

/*
|--------------------------------------------------------------------------
| Dashboard-specific polish
|--------------------------------------------------------------------------
*/

.content .hpos-dashboard-kpis {
    gap: 14px !important;
    margin-bottom: 16px !important;
}

.content .hpos-dashboard-card {
    overflow: hidden !important;
}

.content .hpos-dashboard-icon,
.content .hpos-dashboard-section-icon {
    border-radius: 999px !important;
}

/*
|--------------------------------------------------------------------------
| Cashier Shifts
|--------------------------------------------------------------------------
*/

.content .hpos-inline-8b9adead20 {
    border-color: rgba(34, 197, 94, 0.45) !important;
    background: var(--hpos-model-panel-bg) !important;
}

/*
|--------------------------------------------------------------------------
| Warranty Claims / Settings-like section headers
|--------------------------------------------------------------------------
*/

.content .settings-section-header {
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-lg) !important;
    background: var(--hpos-model-panel-head) !important;
    padding: 16px !important;
    margin-bottom: 14px !important;
}

.content .settings-section-header h2 {
    margin: 0 0 6px !important;
}

.content .settings-section-header p {
    margin: 0 !important;
    color: var(--hpos-model-muted) !important;
}

/*
|--------------------------------------------------------------------------
| Quotations
|--------------------------------------------------------------------------
*/

.content .quote-grid {
    display: block !important;
}

.content .quote-card {
    padding: 16px !important;
}

.content .quote-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    flex-wrap: wrap !important;
    margin-bottom: 14px !important;
}

.content .quote-actions {
    padding: 10px !important;
    margin: 0 !important;
}

.content .quote-actions input {
    min-width: 260px !important;
    max-width: 360px !important;
}

/*
|--------------------------------------------------------------------------
| Light mode compatibility
|--------------------------------------------------------------------------
*/

:not([data-theme="dark"]) .content .card,
:not([data-theme="dark"]) .content .card-pad,
:not([data-theme="dark"]) .content .content-card,
:not([data-theme="dark"]) .content .quote-card,
:not([data-theme="dark"]) .content .hpos-dashboard-card,
:not([data-theme="dark"]) .content .shift-summary-card,
:not([data-theme="dark"]) .content .users-role-card {
    background: var(--hpos-model-panel-bg) !important;
}

/*
|--------------------------------------------------------------------------
| Mobile
|--------------------------------------------------------------------------
*/

@media (max-width: 768px) {
    .content {
        --hpos-admin-gap: 12px;
    }

    .content .hpos-page-toolbar,
    .content .admin-list-toolbar,
    .content .admin-shell-search-row,
    .content .activity-filter,
    .content .shift-filter,
    .content .users-filter,
    .content .audit-filter,
    .content .reports-modern-filter,
    .content .inventory-filter,
    .content .activity-log-filter,
    .content .hpos-print-barcode-filters,
    .content .hpos-contacts-filter,
    .content .ledger-filter-card,
    .content .stock-adjustments-filter-card,
    .content .kb-search-card {
        border-radius: 18px !important;
        padding: 12px !important;
    }

    .content .table-wrap,
    .content .activity-table-wrap,
    .content .activity-change-wrap,
    .content .audit-table-wrap,
    .content .hpos-ledger-table-wrap,
    .content .hpos-print-barcode-table-wrap,
    .content .customer-display-table-wrap,
    .content .hpos-contact-table-wrap,
    .content .hpos-products-table-wrap,
    .content .hpos-product-mini-table-wrap {
        border-radius: 18px !important;
    }

    .content .card.card-pad,
    .content .quote-card,
    .content .reports-modern-table-card,
    .content .activity-card,
    .content .audit-card,
    .content .ledger-card,
    .content .hpos-ledger-card,
    .content .hpos-print-barcode-card,
    .content .hpos-contact-card {
        padding: 12px !important;
    }

    .content .quote-header,
    .content .quote-actions {
        align-items: stretch !important;
    }

    .content .quote-actions,
    .content .quote-actions input,
    .content .quote-actions button {
        width: 100% !important;
        max-width: none !important;
    }

}
/*
|--------------------------------------------------------------------------
| Remove extra card/card-pad outer layer
|--------------------------------------------------------------------------
| The Blade class="card card-pad" is kept for structure, but it should not
| draw another visible container around Products-style table/filter sections.
*/

.content .card.card-pad {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* Keep spacing clean after removing the outer card layer */
.content .card.card-pad > .table-wrap,
.content .card.card-pad > .activity-table-wrap,
.content .card.card-pad > .activity-change-wrap,
.content .card.card-pad > .audit-table-wrap,
.content .card.card-pad > .hpos-ledger-table-wrap,
.content .card.card-pad > .hpos-print-barcode-table-wrap,
.content .card.card-pad > .hpos-contact-table-wrap {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* If pagination is inside card/card-pad, keep it attached to the table */
.content .card.card-pad > nav[role="navigation"],
.content .card.card-pad > .admin-pagination,
.content .card.card-pad > .activity-log-pagination,
.content .card.card-pad > .audit-pagination,
.content .card.card-pad > .hpos-ledger-pagination,
.content .card.card-pad > .hpos-product-recovery-pagination {
    margin-top: 0 !important;
}
/*
|--------------------------------------------------------------------------
| Remove extra visible outer shells
|--------------------------------------------------------------------------
| Keep Blade structure and functions unchanged.
| Only remove the extra visual container layers.
*/

/* Remove the app layout toolbar outer card shell */
.content .content-card.hpos-page-toolbar {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* Let the real toolbar/search row be the visible smooth container */
.content .hpos-page-toolbar .admin-list-toolbar,
.content .hpos-page-toolbar .admin-shell-search-row {
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-soft) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
    padding: 14px 16px !important;
}

/* Remove the page list outer shell */
.content .card.card-pad {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* Keep the actual filter as the visible search/filter container */
.content .card.card-pad > .shift-filter,
.content .card.card-pad > .users-filter,
.content .card.card-pad > .activity-filter,
.content .card.card-pad > .audit-filter,
.content .card.card-pad > .inventory-filter,
.content .card.card-pad > .reports-modern-filter,
.content .card.card-pad > .stock-adjustments-filter-card,
.content .card.card-pad > .kb-search-card {
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-soft) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
    padding: 14px 16px !important;
    margin-bottom: 14px !important;
}

/* Keep the table wrapper as the only visible table container */
.content .card.card-pad > .table-wrap {
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
    overflow: hidden !important;
    margin: 0 !important;
}

/* Pagination should attach cleanly below the table */
.content .card.card-pad > nav[role="navigation"],
.content .card.card-pad > .admin-pagination,
.content .card.card-pad > .activity-log-pagination,
.content .card.card-pad > .audit-pagination,
.content .card.card-pad > .hpos-ledger-pagination,
.content .card.card-pad > .hpos-product-recovery-pagination,
.content .card.card-pad > [class^="hpos-inline-"] {
    margin-top: 0 !important;
    border-top: 1px solid var(--hpos-model-border) !important;
    border-radius: 0 0 var(--hpos-model-radius-xl) var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: none !important;
}
/*
|--------------------------------------------------------------------------
| Remove extra wrapper backgrounds
|--------------------------------------------------------------------------
| These wrappers are kept in Blade for structure, but they should not create
| another visible background/card layer.
*/

/* Remove top toolbar outer background layer */
.content .content-card.hpos-page-toolbar,
.content .hpos-page-toolbar {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* Remove list/table outer background layer */
.content .card.card-pad {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* Keep the real filter/search area as the visible smooth container */
.content .card.card-pad > .shift-filter,
.content .card.card-pad > .users-filter,
.content .card.card-pad > .activity-filter,
.content .card.card-pad > .audit-filter,
.content .card.card-pad > .inventory-filter,
.content .card.card-pad > .reports-modern-filter,
.content .card.card-pad > .stock-adjustments-filter-card,
.content .card.card-pad > .kb-search-card {
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-soft) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
    padding: 14px 16px !important;
    margin-bottom: 14px !important;
}

/* Keep the real table as the visible smooth container */
.content .card.card-pad > .table-wrap,
.content .card.card-pad > .activity-table-wrap,
.content .card.card-pad > .activity-change-wrap,
.content .card.card-pad > .audit-table-wrap,
.content .card.card-pad > .hpos-ledger-table-wrap,
.content .card.card-pad > .hpos-print-barcode-table-wrap,
.content .card.card-pad > .hpos-contact-table-wrap {
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
    overflow: hidden !important;
    margin: 0 !important;
}

/* Pagination below table should not create another card layer */
.content .card.card-pad > nav[role="navigation"],
.content .card.card-pad > .admin-pagination,
.content .card.card-pad > .activity-log-pagination,
.content .card.card-pad > .audit-pagination,
.content .card.card-pad > .hpos-ledger-pagination,
.content .card.card-pad > .hpos-product-recovery-pagination,
.content .card.card-pad > [class^="hpos-inline-"] {
    margin-top: 0 !important;
    border-top: 1px solid var(--hpos-model-border) !important;
    border-radius: 0 0 var(--hpos-model-radius-xl) var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: none !important;
}

/*
|--------------------------------------------------------------------------
| Remove extra toolbar/card background layers
|--------------------------------------------------------------------------
| Keep the Blade structure, but remove the extra visible shell/background.
*/

/* Remove hpos-page-toolbar background in both dark and light mode */
.content .hpos-page-toolbar,
.content .content-card.hpos-page-toolbar,
html[data-theme="dark"] .content .hpos-page-toolbar,
html[data-theme="dark"] .content .content-card.hpos-page-toolbar,
body[data-theme="dark"] .content .hpos-page-toolbar,
body[data-theme="dark"] .content .content-card.hpos-page-toolbar {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
}

/* Remove card card-pad outer background layer */
.content .card.card-pad,
html[data-theme="dark"] .content .card.card-pad,
body[data-theme="dark"] .content .card.card-pad {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
}

/* Keep the real filter/search section visible and smooth */
.content .card.card-pad > .shift-filter,
.content .card.card-pad > .users-filter,
.content .card.card-pad > .activity-filter,
.content .card.card-pad > .audit-filter,
.content .card.card-pad > .inventory-filter,
.content .card.card-pad > .reports-modern-filter,
.content .card.card-pad > .stock-adjustments-filter-card,
.content .card.card-pad > .kb-search-card {
    background: var(--hpos-model-panel-soft) !important;
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
    padding: 14px 16px !important;
    margin-bottom: 14px !important;
}

/* Keep the table itself as the only visible table container */
.content .card.card-pad > .table-wrap,
.content .card.card-pad > .activity-table-wrap,
.content .card.card-pad > .activity-change-wrap,
.content .card.card-pad > .audit-table-wrap,
.content .card.card-pad > .hpos-ledger-table-wrap,
.content .card.card-pad > .hpos-print-barcode-table-wrap,
.content .card.card-pad > .hpos-contact-table-wrap {
    background: var(--hpos-model-panel-bg) !important;
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
    overflow: hidden !important;
    margin: 0 !important;
}

/*
|--------------------------------------------------------------------------
| Merge table wrapper and pagination
|--------------------------------------------------------------------------
| Makes table + pagination look like one Products-style container.
*/

/* Table becomes the top half of the container when pagination follows */
.content .card.card-pad > .table-wrap,
.content .card.card-pad > .activity-table-wrap,
.content .card.card-pad > .activity-change-wrap,
.content .card.card-pad > .audit-table-wrap,
.content .card.card-pad > .hpos-ledger-table-wrap,
.content .card.card-pad > .hpos-print-barcode-table-wrap,
.content .card.card-pad > .hpos-contact-table-wrap {
    border-bottom: 0 !important;
    border-radius: var(--hpos-model-radius-xl) var(--hpos-model-radius-xl) 0 0 !important;
    margin-bottom: 0 !important;
}

/* Pagination wrapper becomes the bottom half of the same container */
.content .card.card-pad > .table-wrap + nav[role="navigation"],
.content .card.card-pad > .table-wrap + .admin-pagination,
.content .card.card-pad > .table-wrap + .activity-log-pagination,
.content .card.card-pad > .table-wrap + .audit-pagination,
.content .card.card-pad > .table-wrap + .hpos-ledger-pagination,
.content .card.card-pad > .table-wrap + .hpos-product-recovery-pagination,
.content .card.card-pad > .table-wrap + [class^="hpos-inline-"],
.content .card.card-pad > .activity-table-wrap + nav[role="navigation"],
.content .card.card-pad > .activity-table-wrap + [class^="hpos-inline-"],
.content .card.card-pad > .activity-change-wrap + nav[role="navigation"],
.content .card.card-pad > .activity-change-wrap + [class^="hpos-inline-"],
.content .card.card-pad > .audit-table-wrap + nav[role="navigation"],
.content .card.card-pad > .audit-table-wrap + [class^="hpos-inline-"],
.content .card.card-pad > .hpos-ledger-table-wrap + nav[role="navigation"],
.content .card.card-pad > .hpos-ledger-table-wrap + [class^="hpos-inline-"],
.content .card.card-pad > .hpos-print-barcode-table-wrap + nav[role="navigation"],
.content .card.card-pad > .hpos-print-barcode-table-wrap + [class^="hpos-inline-"],
.content .card.card-pad > .hpos-contact-table-wrap + nav[role="navigation"],
.content .card.card-pad > .hpos-contact-table-wrap + [class^="hpos-inline-"] {
    margin-top: 0 !important;
    padding: 14px 16px !important;
    border: 1px solid var(--hpos-model-border) !important;
    border-top: 1px solid var(--hpos-model-border) !important;
    border-radius: 0 0 var(--hpos-model-radius-xl) var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
}

/* If Laravel's pagination nav is inside the generated hpos-inline wrapper, remove its own extra shell */
.content .card.card-pad > [class^="hpos-inline-"] > nav[role="navigation"] {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Keep pagination controls aligned like Products page */
.content .card.card-pad > [class^="hpos-inline-"] {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
}
/*
|--------------------------------------------------------------------------
| Products table + pagination merge
|--------------------------------------------------------------------------
| Keeps the Products table and pagination as one smooth container.
*/

.content .hpos-products-table-wrap,
.content .products-table-wrap,
.content .product-table-wrap {
    border-bottom: 0 !important;
    border-radius: var(--hpos-model-radius-xl) var(--hpos-model-radius-xl) 0 0 !important;
    margin-bottom: 0 !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
}

.content .hpos-products-table-wrap + .admin-pagination,
.content .hpos-products-table-wrap + .hpos-product-recovery-pagination,
.content .hpos-products-table-wrap + nav[role="navigation"],
.content .hpos-products-table-wrap + [class^="hpos-inline-"],
.content .products-table-wrap + .admin-pagination,
.content .products-table-wrap + nav[role="navigation"],
.content .products-table-wrap + [class^="hpos-inline-"],
.content .product-table-wrap + .admin-pagination,
.content .product-table-wrap + nav[role="navigation"],
.content .product-table-wrap + [class^="hpos-inline-"] {
    margin-top: 0 !important;
    border: 1px solid var(--hpos-model-border) !important;
    border-top: 1px solid var(--hpos-model-border) !important;
    border-radius: 0 0 var(--hpos-model-radius-xl) var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
    padding: 14px 16px !important;
}

/* If Laravel pagination nav is inside a generated wrapper, remove its own shell */
.content .hpos-products-table-wrap + [class^="hpos-inline-"] > nav[role="navigation"],
.content .products-table-wrap + [class^="hpos-inline-"] > nav[role="navigation"],
.content .product-table-wrap + [class^="hpos-inline-"] > nav[role="navigation"] {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Product pagination alignment */
.content .hpos-products-table-wrap + [class^="hpos-inline-"],
.content .products-table-wrap + [class^="hpos-inline-"],
.content .product-table-wrap + [class^="hpos-inline-"] {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
}
/*
|--------------------------------------------------------------------------
| Products table pagination merge - corrected
|--------------------------------------------------------------------------
| Products pagination is inside .hpos-products-table-wrap, not beside it.
| This makes table + pagination look like one single container.
*/

.content .hpos-products-table-wrap {
    overflow: hidden !important;
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
    margin-bottom: 14px !important;
}

.content .hpos-products-table-wrap > .hpos-products-table-scroll {
    overflow-x: auto !important;
    border: 0 !important;
    border-radius: var(--hpos-model-radius-xl) var(--hpos-model-radius-xl) 0 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    margin: 0 !important;
}

.content .hpos-products-table-wrap > .hpos-products-table-scroll > .hpos-products-table {
    margin: 0 !important;
    border-radius: 0 !important;
}

.content .hpos-products-table-wrap > .admin-pagination {
    margin: 0 !important;
    padding: 14px 16px !important;
    border: 0 !important;
    border-top: 1px solid var(--hpos-model-border) !important;
    border-radius: 0 !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: none !important;
}

/* Remove any pseudo extra layers from product table and pagination */
.content .hpos-products-table-wrap::before,
.content .hpos-products-table-wrap::after,
.content .hpos-products-table-wrap > .admin-pagination::before,
.content .hpos-products-table-wrap > .admin-pagination::after {
    display: none !important;
    content: none !important;
}

/* Keep the bottom of the whole wrapper rounded, not the pagination itself */
.content .hpos-products-table-wrap > .admin-pagination:last-child {
    border-radius: 0 0 var(--hpos-model-radius-xl) var(--hpos-model-radius-xl) !important;
}
/*
|--------------------------------------------------------------------------
| Product recovery mini table + pagination merge
|--------------------------------------------------------------------------
| Applies to Products page Archive Product and Deleted Product cards.
| Makes the mini table and pagination look like one attached container.
*/

.content .hpos-product-recovery-card .hpos-product-mini-table-wrap {
    margin-bottom: 0 !important;
    border-bottom: 0 !important;
    border-radius: var(--hpos-model-radius-xl) var(--hpos-model-radius-xl) 0 0 !important;
    box-shadow: none !important;
}

.content .hpos-product-recovery-card .hpos-product-recovery-pagination {
    margin-top: 0 !important;
    padding: 0 !important;
    border-top: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.content .hpos-product-recovery-card .hpos-product-recovery-pagination .admin-pagination {
    margin: 0 !important;
    padding: 14px 16px !important;
    border: 1px solid var(--hpos-model-border) !important;
    border-top: 1px solid var(--hpos-model-border) !important;
    border-radius: 0 0 var(--hpos-model-radius-xl) var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: none !important;
}

/* Remove inner pagination shell if component adds another wrapper */
.content .hpos-product-recovery-card .hpos-product-recovery-pagination nav[role="navigation"] {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Remove the divider gap between mini table and pagination */
.content .hpos-product-recovery-card .hpos-product-mini-table-wrap + .hpos-product-recovery-pagination {
    margin-top: -1px !important;
}
/*
|--------------------------------------------------------------------------
| Product recovery pagination final merge polish
|--------------------------------------------------------------------------
| Removes the remaining divider/gap between mini table and pagination.
*/

.content .hpos-product-recovery-card .hpos-product-mini-table-wrap {
    border-bottom: 0 !important;
    border-radius: var(--hpos-model-radius-xl) var(--hpos-model-radius-xl) 0 0 !important;
    margin-bottom: 0 !important;
}

.content .hpos-product-recovery-card .hpos-product-recovery-pagination {
    margin-top: -1px !important;
    padding-top: 0 !important;
    border-top: 0 !important;
}

.content .hpos-product-recovery-card .hpos-product-recovery-pagination .admin-pagination {
    border-top: 1px solid var(--hpos-model-border) !important;
    border-left: 1px solid var(--hpos-model-border) !important;
    border-right: 1px solid var(--hpos-model-border) !important;
    border-bottom: 1px solid var(--hpos-model-border) !important;
    border-radius: 0 0 var(--hpos-model-radius-xl) var(--hpos-model-radius-xl) !important;
    margin-top: 0 !important;
    box-shadow: none !important;
}

/* Remove extra horizontal rule/divider if the recovery card creates one */
.content .hpos-product-recovery-card .hpos-product-mini-table-wrap + *,
.content .hpos-product-recovery-card .hpos-product-recovery-pagination {
    border-top-color: var(--hpos-model-border) !important;
}
/*
|--------------------------------------------------------------------------
| Product recovery pagination inside mini table wrapper
|--------------------------------------------------------------------------
*/

.content .hpos-product-mini-table-wrap > .hpos-product-recovery-pagination {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.content .hpos-product-mini-table-wrap > .hpos-product-recovery-pagination > .admin-pagination {
    margin: 0 !important;
    padding: 14px 16px !important;
    border: 0 !important;
    border-top: 1px solid var(--hpos-model-border) !important;
    border-radius: 0 !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: none !important;
}
/*
|--------------------------------------------------------------------------
| Product recovery mini table final container fix
|--------------------------------------------------------------------------
| Archive Product / Deleted Product:
| The mini table wrapper is the only visible rounded container.
| Pagination sits inside it without cutting the bottom border.
*/

.content .hpos-product-recovery-card .hpos-product-mini-table-wrap {
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: none !important;
    overflow: hidden !important;
    margin-bottom: 0 !important;
}

/* Table should not create a separate bottom shell */
.content .hpos-product-recovery-card .hpos-product-mini-table {
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
}

/* Pagination is inside the mini wrapper, so remove its outside border */
.content .hpos-product-recovery-card .hpos-product-mini-table-wrap > .hpos-product-recovery-pagination {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Pagination content becomes the bottom section, not another box */
.content .hpos-product-recovery-card .hpos-product-mini-table-wrap > .hpos-product-recovery-pagination > .admin-pagination {
    margin: 0 !important;
    padding: 14px 16px !important;
    border: 0 !important;
    border-top: 1px solid var(--hpos-model-border) !important;
    border-radius: 0 !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: none !important;
}

/* Remove bottom clipping caused by earlier pagination rules */
.content .hpos-product-recovery-card .hpos-product-mini-table-wrap > .hpos-product-recovery-pagination:last-child,
.content .hpos-product-recovery-card .hpos-product-mini-table-wrap > .hpos-product-recovery-pagination > .admin-pagination:last-child {
    border-bottom: 0 !important;
    margin-bottom: 0 !important;
}

/* Keep the recovery card from clipping the inner rounded container */
.content .hpos-product-recovery-card {
    overflow: visible !important;
}
/*
|--------------------------------------------------------------------------
| Dashboard container/table polish
|--------------------------------------------------------------------------
| Makes Dashboard cards and mini tables follow the same smooth Products-style
| container system without changing any function or data.
*/

/* Main dashboard section cards */
.content .hpos-dashboard-main-grid > .hpos-dashboard-card,
.content .hpos-dashboard-split-grid > .hpos-dashboard-card,
.content .hpos-dashboard-wide-grid > .hpos-dashboard-card {
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
    overflow: hidden !important;
}

/* Keep dashboard section padding clean */
.content .hpos-dashboard-section {
    padding: 18px !important;
}

/* Inventory Health / Top Selling / Recent Stock table container */
.content .hpos-dashboard-section > .hpos-dashboard-mini-table {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-lg) !important;
    background: var(--hpos-model-panel-bg) !important;
    overflow: hidden !important;
    box-shadow: none !important;
}

/* Header cells like Products table */
.content .hpos-dashboard-section > .hpos-dashboard-mini-table thead th {
    background: var(--hpos-model-panel-head) !important;
    border-bottom: 1px solid var(--hpos-model-border) !important;
    color: var(--hpos-model-muted) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: 0.045em !important;
    padding: 14px 16px !important;
    text-transform: uppercase !important;
}

/* Body cells */
.content .hpos-dashboard-section > .hpos-dashboard-mini-table tbody th,
.content .hpos-dashboard-section > .hpos-dashboard-mini-table tbody td {
    padding: 14px 16px !important;
    border-bottom: 1px solid var(--hpos-model-border) !important;
    color: var(--hpos-model-text) !important;
    background: transparent !important;
}

/* Inventory Health labels */
.content .hpos-dashboard-section > .hpos-dashboard-mini-table tbody th {
    color: var(--hpos-model-muted) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: 0.045em !important;
    text-transform: uppercase !important;
}

/* Remove last row bottom line */
.content .hpos-dashboard-section > .hpos-dashboard-mini-table tbody tr:last-child th,
.content .hpos-dashboard-section > .hpos-dashboard-mini-table tbody tr:last-child td {
    border-bottom: 0 !important;
}

/* Smooth table corners */
.content .hpos-dashboard-section > .hpos-dashboard-mini-table thead tr:first-child th:first-child,
.content .hpos-dashboard-section > .hpos-dashboard-mini-table tbody tr:first-child th:first-child,
.content .hpos-dashboard-section > .hpos-dashboard-mini-table tbody tr:first-child td:first-child {
    border-top-left-radius: var(--hpos-model-radius-lg) !important;
}

.content .hpos-dashboard-section > .hpos-dashboard-mini-table thead tr:first-child th:last-child,
.content .hpos-dashboard-section > .hpos-dashboard-mini-table tbody tr:first-child th:last-child,
.content .hpos-dashboard-section > .hpos-dashboard-mini-table tbody tr:first-child td:last-child {
    border-top-right-radius: var(--hpos-model-radius-lg) !important;
}

.content .hpos-dashboard-section > .hpos-dashboard-mini-table tbody tr:last-child th:first-child,
.content .hpos-dashboard-section > .hpos-dashboard-mini-table tbody tr:last-child td:first-child {
    border-bottom-left-radius: var(--hpos-model-radius-lg) !important;
}

.content .hpos-dashboard-section > .hpos-dashboard-mini-table tbody tr:last-child th:last-child,
.content .hpos-dashboard-section > .hpos-dashboard-mini-table tbody tr:last-child td:last-child {
    border-bottom-right-radius: var(--hpos-model-radius-lg) !important;
}

/* Recent Transactions list should keep same smooth card language */
.content .hpos-dashboard-transactions {
    border-radius: var(--hpos-model-radius-lg) !important;
    overflow: hidden !important;
}

/* Inventory Health button spacing */
.content .hpos-dashboard-section .btn {
    margin-top: 14px !important;
}

/* Dashboard quick actions stay smooth */
.content .hpos-dashboard-quick-action {
    border-radius: var(--hpos-model-radius-lg) !important;
    background: var(--hpos-model-panel-soft) !important;
}

/*
|--------------------------------------------------------------------------
| Dashboard final polish
|--------------------------------------------------------------------------
| Fixes:
| - Inventory Health rounded edge and padding
| - Removes title background/strip from Top Selling Products This Month
| - Removes title background/strip from Recent Stock Movements
| Style only. No Blade, route, controller, or JS changes.
*/

/* Dashboard section cards keep rounded Products-style shell */
.content .hpos-dashboard-card.hpos-dashboard-section {
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
    overflow: hidden !important;
}

/* Dashboard titles should not look like a separate background strip */
.content .hpos-dashboard-card.hpos-dashboard-section > .hpos-dashboard-section-title {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 0 14px 0 !important;
}

/* Remove any inherited title/card background on title text */
.content .hpos-dashboard-section-title,
.content .hpos-dashboard-section-title span:not(.hpos-dashboard-icon) {
    background: transparent !important;
    box-shadow: none !important;
}

/* Inventory Health is the third card inside the main dashboard grid */
.content .hpos-dashboard-main-grid > .hpos-dashboard-card.hpos-dashboard-section:nth-child(3) {
    border-radius: var(--hpos-model-radius-xl) !important;
    padding: 20px !important;
    overflow: hidden !important;
}

/* Inventory Health title spacing */
.content .hpos-dashboard-main-grid > .hpos-dashboard-card.hpos-dashboard-section:nth-child(3) > .hpos-dashboard-section-title {
    margin-bottom: 16px !important;
}

/* Inventory Health table should be rounded and padded correctly */
.content .hpos-dashboard-main-grid > .hpos-dashboard-card.hpos-dashboard-section:nth-child(3) > .hpos-dashboard-mini-table {
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-lg) !important;
    overflow: hidden !important;
    background: var(--hpos-model-panel-bg) !important;
    margin: 0 0 14px 0 !important;
}

/* Inventory Health rows: cleaner padding */
.content .hpos-dashboard-main-grid > .hpos-dashboard-card.hpos-dashboard-section:nth-child(3) > .hpos-dashboard-mini-table tbody th,
.content .hpos-dashboard-main-grid > .hpos-dashboard-card.hpos-dashboard-section:nth-child(3) > .hpos-dashboard-mini-table tbody td {
    padding: 15px 18px !important;
}

/* Inventory Health button spacing */
.content .hpos-dashboard-main-grid > .hpos-dashboard-card.hpos-dashboard-section:nth-child(3) .btn {
    margin-top: 0 !important;
}

/* Top Selling Products and Recent Stock Movements cards */
.content .hpos-dashboard-split-grid > .hpos-dashboard-card.hpos-dashboard-section {
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}

/* Top Selling / Recent Stock titles: no background strip */
.content .hpos-dashboard-split-grid > .hpos-dashboard-card.hpos-dashboard-section > .hpos-dashboard-section-title {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 0 10px 0 !important;
    margin: 0 !important;
}

/* Top Selling / Recent Stock tables become the visible rounded container */
.content .hpos-dashboard-split-grid > .hpos-dashboard-card.hpos-dashboard-section > .hpos-dashboard-mini-table {
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-lg) !important;
    background: var(--hpos-model-panel-bg) !important;
    overflow: hidden !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
    margin: 0 !important;
}

/* Keep the table header clean and rounded */
.content .hpos-dashboard-split-grid > .hpos-dashboard-card.hpos-dashboard-section > .hpos-dashboard-mini-table thead th:first-child {
    border-top-left-radius: var(--hpos-model-radius-lg) !important;
}

.content .hpos-dashboard-split-grid > .hpos-dashboard-card.hpos-dashboard-section > .hpos-dashboard-mini-table thead th:last-child {
    border-top-right-radius: var(--hpos-model-radius-lg) !important;
}

/* Last row should close cleanly */
.content .hpos-dashboard-split-grid > .hpos-dashboard-card.hpos-dashboard-section > .hpos-dashboard-mini-table tbody tr:last-child td {
    border-bottom: 0 !important;
}

/*
|--------------------------------------------------------------------------
| Cashier Shifts clock-style page layout
|--------------------------------------------------------------------------
| Style-only. Keeps existing Open Shift / View Close Shift / table actions.
*/

/* Open shift becomes the main clock-status card */
.content .hpos-inline-8b9adead20 {
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
    padding: 18px 20px !important;
    margin-bottom: 16px !important;
}

/* Arrange open shift like a clock-in/out panel */
.content .hpos-inline-b19ff10482 {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    flex-wrap: wrap !important;
}

/* Make open shift title stronger */
.content .hpos-inline-b19ff10482 strong {
    display: block !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    margin-bottom: 4px !important;
}

/* Main shift action button */
.content .hpos-inline-b19ff10482 .btn {
    min-height: 44px !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
    border-radius: 14px !important;
}

/* Summary cards like clock dashboard counters */
.content .shift-summary-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin-bottom: 16px !important;
}

.content .shift-summary-card {
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
    padding: 18px !important;
}

.content .shift-summary-card strong {
    display: block !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    margin-bottom: 6px !important;
}

/* Shift history table section */
.content .cashier-shift-history {
    margin-top: 16px !important;
}

/* Keep table as one smooth Products-style container */
.content .cashier-shift-history > .table-wrap {
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
    overflow: hidden !important;
}

/* Pagination under shift table should attach cleanly if shown */
.content .cashier-shift-history > .hpos-inline-281a8f8e8a {
    margin-top: 0 !important;
    border: 1px solid var(--hpos-model-border) !important;
    border-top: 0 !important;
    border-radius: 0 0 var(--hpos-model-radius-xl) var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    padding: 14px 16px !important;
}

/* Mobile */
@media (max-width: 900px) {
    .content .shift-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 640px) {
    .content .shift-summary-grid {
        grid-template-columns: 1fr !important;
    }

    .content .hpos-inline-b19ff10482 {
        align-items: stretch !important;
    }

    .content .hpos-inline-b19ff10482 .btn {
        width: 100% !important;
    }
}
/*
|--------------------------------------------------------------------------
| Cashier Shifts clock-style layout with right-side stats
|--------------------------------------------------------------------------
| Style only. Existing routes/buttons/actions remain unchanged.
*/

.content .cashier-shift-clock-layout {
    display: grid !important;
    grid-template-columns: minmax(420px, 1.35fr) minmax(420px, 0.95fr) !important;
    gap: 16px !important;
    align-items: stretch !important;
    margin-bottom: 16px !important;
}

.content .cashier-shift-clock-layout.is-history-only {
    grid-template-columns: 1fr !important;
}

.content .cashier-shift-clock-card {
    min-height: 100% !important;
    margin-bottom: 0 !important;
    padding: 22px !important;
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
}

.content .cashier-shift-clock-card-inner {
    min-height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    flex-wrap: wrap !important;
}

.content .cashier-shift-clock-label {
    display: block !important;
    color: var(--hpos-model-muted) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: 0.045em !important;
    text-transform: uppercase !important;
    margin-bottom: 8px !important;
}

.content .cashier-shift-clock-card strong {
    display: block !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    margin-bottom: 5px !important;
}

.content .cashier-shift-clock-card .btn {
    min-height: 46px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    border-radius: 14px !important;
}

.content .cashier-shift-clock-stats {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin: 0 !important;
}

.content .cashier-shift-clock-layout.is-history-only .cashier-shift-clock-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.content .cashier-shift-clock-stats .shift-summary-card {
    min-height: 105px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    border: 1px solid var(--hpos-model-border) !important;
    border-radius: var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
    padding: 18px !important;
}

.content .cashier-shift-clock-stats .shift-summary-card strong {
    font-size: 24px !important;
    font-weight: 800 !important;
    margin-bottom: 6px !important;
}

/* Shift list pagination */
.content .cashier-shift-history > .table-wrap {
    border-bottom: 0 !important;
    border-radius: var(--hpos-model-radius-xl) var(--hpos-model-radius-xl) 0 0 !important;
    margin-bottom: 0 !important;
}

.content .cashier-shift-pagination {
    margin-top: 0 !important;
    padding: 0 !important;
    border: 1px solid var(--hpos-model-border) !important;
    border-top: 1px solid var(--hpos-model-border) !important;
    border-radius: 0 0 var(--hpos-model-radius-xl) var(--hpos-model-radius-xl) !important;
    background: var(--hpos-model-panel-bg) !important;
    box-shadow: var(--hpos-model-shadow-soft) !important;
}

.content .cashier-shift-pagination > .admin-pagination {
    margin: 0 !important;
    padding: 14px 16px !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* If the history wrapper is not present, still style direct table + pagination */
.content .table-wrap + .cashier-shift-pagination {
    margin-top: 0 !important;
}

@media (max-width: 1100px) {
    .content .cashier-shift-clock-layout {
        grid-template-columns: 1fr !important;
    }

    .content .cashier-shift-clock-layout .cashier-shift-clock-stats {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    .content .cashier-shift-clock-layout .cashier-shift-clock-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .content .cashier-shift-clock-card-inner {
        align-items: stretch !important;
    }

    .content .cashier-shift-clock-card .btn {
        width: 100% !important;
    }
}

@media (max-width: 520px) {
    .content .cashier-shift-clock-layout .cashier-shift-clock-stats {
        grid-template-columns: 1fr !important;
    }
}