@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
:root {
    --tblr-font-sans-serif: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    --tblr-primary: #CD0000;
    --tblr-primary-rgb: 205, 0, 0;
    --tblr-primary-lt: rgba(205, 0, 0, 0.1);
    --tblr-primary-lt-rgb: 205, 0, 0;
}
body { font-family: var(--tblr-font-sans-serif); }

/*
 * LeanERP - Centralized CSS
 * Replaces all inline styles across blade templates
 * =================================================
 */

/* ─── CSS Variables ──────────────────────────────── */
:root {
    --erp-primary:          #CD0000;
    --erp-primary-hover:    #a80000;
    --erp-primary-light:    #CD0000;
    --erp-success:          #10B981;
    --erp-success-dark:     #059669;
    --erp-danger:           #dc2626;
    --erp-danger-light:     #ef4444;
    --erp-text-dark:        #1A1D2E;
    --erp-text-muted:       #6B7280;
    --erp-text-light:       #9CA3AF;
    --erp-text-placeholder: #B0B7C9;
    --erp-text-mono:        #64748b;
    --erp-border:           #E8EAF0;
    --erp-border-light:     #DDE1EC;
    --erp-bg-light:         #F8F9FC;
    --erp-radius-sm:        6px;
    --erp-radius-md:        8px;
    --erp-radius-lg:        14px;
}

/* ─── Typography Utilities ───────────────────────── */
.erp-brand-name {
    font-size: 1.25rem;
}
.sidebar-logo {
    height: 42px;
    width: auto;
    object-fit: contain;
    margin-top: 8px;
}

.erp-nav-section-label {
    font-size: 0.625rem;
    letter-spacing: 0.1em;
}

.erp-text-xxs {
    font-size: 0.72rem;
}

.erp-text-xs {
    font-size: 0.75rem;
}

.erp-text-sm {
    font-size: 0.8rem;
}

.erp-text-82 {
    font-size: 0.82rem;
}

.erp-text-85 {
    font-size: 0.85rem;
}

.erp-text-mono {
    font-size: 0.72rem;
    color: var(--erp-text-mono);
    font-family: monospace;
}

.erp-table-section-header {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--erp-text-muted);
}

.erp-table-col-header {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--erp-text-muted);
}

.erp-label-upper {
    font-size: 0.8rem;
    color: #64748b;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.erp-text-placeholder {
    color: var(--erp-text-placeholder);
}

.erp-text-muted-light {
    color: var(--erp-text-light);
    font-size: 0.78rem;
}

.erp-text-returned {
    color: var(--erp-danger-light);
    text-decoration: line-through;
}

.lh-relaxed  { line-height: 1.7; }
.text-blue    { color: #CD0000 !important; }
.text-purple  { color: #7c3aed !important; }
.text-green   { color: #059669 !important; }
.text-warning { color: #d97706 !important; }
.text-orange  { color: #ea580c !important; }
.text-teal    { color: #0d9488 !important; }
.text-pink    { color: #db2777 !important; }
.text-indigo  { color: #CD0000 !important; }

.text-erp-primary {
    color: var(--erp-primary);
}

.erp-text-danger {
    color: var(--erp-danger-light);
}

.erp-border-top-light {
    border-top: 1px solid #F0F2F8;
}


/* ─── Button Utilities ───────────────────────────── */
.btn-erp-sm {
    font-size: 0.82rem;
    font-weight: 600;
    height: 34px;
    padding: 0 14px;
    border-radius: var(--erp-radius-sm);
}

.btn-erp-success-gradient {
    background: linear-gradient(135deg, var(--erp-success), var(--erp-success-dark));
    border: none;
    color: #fff;
}

.btn-erp-success-gradient:hover {
    background: linear-gradient(135deg, var(--erp-success-dark), #047857);
    color: #fff;
}

.btn-erp-danger-gradient {
    background: linear-gradient(135deg, var(--erp-danger), var(--erp-danger-light));
    border: none;
    color: #fff;
}

.btn-erp-danger-gradient:hover {
    background: linear-gradient(135deg, #b91c1c, var(--erp-danger));
    color: #fff;
}

.btn-erp-clear {
    height: 36px;
    border: 1px solid var(--erp-border-light);
    border-radius: var(--erp-radius-sm);
    color: var(--erp-text-muted);
    font-size: 0.85rem;
}

.btn-erp-scanner {
    width: 38px;
    height: 38px;
}

.btn-erp-scanner-lg {
    width: 40px;
    height: 40px;
    border-radius: var(--erp-radius-md);
}


/* ─── Form / Input Utilities ─────────────────────── */
.erp-readonly-field {
    background: var(--erp-bg-light) !important;
    color: #64748b;
}

.erp-input-no-right-border {
    border-right: none !important;
}

.erp-input-left-radius {
    border-radius: 8px 0 0 8px !important;
}

.erp-textarea-auto {
    height: auto !important;
}

.erp-password-hint {
    font-size: 0.75rem;
    display: none;
}

.erp-search-icon {
    font-size: 14px;
}

.erp-icon-sm {
    font-size: 14px;
}

.erp-icon-md {
    font-size: 16px;
}

.erp-icon-lg {
    font-size: 17px;
}

.erp-icon-inline {
    font-size: 1.2rem;
    vertical-align: middle;
}

.erp-icon-disabled {
    color: var(--erp-text-placeholder);
    pointer-events: none;
}


/* ─── Table Column Widths ────────────────────────── */
.col-erp-checkbox {
    width: 36px;
    padding-left: 16px !important;
}

.col-erp-expand {
    width: 30px;
}

.col-erp-action {
    width: 32px;
}

.col-erp-xs {
    width: 90px;
}

.col-erp-sm {
    width: 120px;
}

.col-erp-md {
    width: 150px;
}

.col-erp-lg {
    width: 190px;
}

.col-erp-28 {
    width: 28px;
}

.col-erp-160 {
    width: 160px;
}


/* ─── Layout Utilities ───────────────────────────── */
.justify-center {
    justify-content: center;
}

.erp-divider-bottom {
    border-bottom: 1px solid var(--erp-border);
}

.erp-section-divider {
    border-bottom: 1px solid var(--erp-border);
    padding-bottom: 12px;
    margin-bottom: 12px;
}

.erp-summary-box {
    background: #fff;
    border: 1px solid var(--erp-border);
    border-radius: var(--erp-radius-md);
    padding: 12px 16px;
}

.erp-permission-table-wrap {
    border: 1px solid var(--erp-border);
    border-radius: var(--erp-radius-md);
    overflow: hidden;
}

.erp-pt-btn {
    padding-top: 20px;
}

.erp-overflow-hidden {
    overflow: hidden;
}

.erp-overflow-visible {
    overflow: visible;
}

.erp-flex-shrink-0 {
    flex-shrink: 0;
}

.erp-min-h-0 {
    min-height: 0;
}


/* ─── Modal Dialog Widths ────────────────────────── */
.modal-dialog-380 { max-width: 380px; }
.modal-dialog-440 { max-width: 540px; }
.modal-dialog-520 { max-width: 520px; }
.modal-dialog-620 { max-width: 620px; }
.modal-dialog-640 { max-width: 640px; }
.modal-dialog-680 { max-width: 780px; }

/* ─── Overlay Icon Colors ────────────────────────── */
.ms-icon-danger {
    background: rgba(220, 38, 38, 0.1);
    color: #dc2626;
}

.ms-icon-warning {
    background: rgba(234, 88, 12, 0.1);
    color: #ea580c;
}

.ms-icon-warning-amber {
    background: rgba(245, 158, 11, 0.1);
    color: #D97706;
}

/* ─── Stock Status Badges ────────────────────────── */
.erp-stock-badge-out {
    font-size: 0.68rem;
    background: #FEE2E2;
    color: #DC2626;
    padding: 1px 6px;
    border-radius: 4px;
    font-weight: 600;
}

.erp-stock-badge-low {
    font-size: 0.68rem;
    background: #FEF3C7;
    color: #D97706;
    padding: 1px 6px;
    border-radius: 4px;
    font-weight: 600;
}

/* ─── Report Print Params ────────────────────────── */
.rpt-print-params {
    font-size: 0.75rem;
    color: #555;
    margin-top: 6px;
}

/* ─── Report icon colors ─────────────────────────── */
.rpt-icon-purchase       { color: #7C3AED; }
.rpt-icon-purch-ret-color { color: #be123c; }
.rpt-icon-purch-color    { color: #6d28d9; }

/* ─── Misc Input Helpers ─────────────────────────── */
.erp-section-title-upper {
    font-size: 0.7rem;
    letter-spacing: 0.08em;
}

.erp-qty-input {
    width: 80px;
    border: 1px solid var(--erp-border-light);
    border-radius: 5px;
}

.erp-adj-product-name {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--erp-primary);
}

.erp-info-hint {
    font-size: 0.72rem;
    color: #64748b;
    margin-top: 4px;
}

.erp-dropdown-type-label {
    color: var(--erp-text-light);
    font-size: 0.78rem;
    white-space: nowrap;
}

.erp-dropdown-placeholder {
    color: var(--erp-text-placeholder);
}

.erp-input-group-suffix {
    border-radius: 0 7px 7px 0;
    border-left: none;
    border-right: 1px solid var(--erp-border-light);
}

.erp-btn-action-sm {
    font-size: 0.75rem;
    height: 28px;
    padding: 0 10px;
    border-radius: 5px;
}

/* ─── Cash Reconciliation Log Table ──────────────── */
.cr-log-th {
    padding: 10px 14px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #64748b;
    border-bottom: 2px solid var(--erp-border);
}

.cr-td {
    padding: 8px 14px;
}

.cr-td-muted {
    padding: 8px 14px;
    color: #64748b;
}

/* ─── Report Table Row Styles ─────────────────────── */

/* Total rows */
.rpt-total-row {
    font-weight: 700;
    background: #F8F9FC;
}

/* Indented item cell */
.rpt-indent-cell {
    padding-left: 26px !important;
    font-size: 0.83rem;
}

/* Date cell */
.rpt-date-cell {
    color: #64748b;
    font-size: 0.78rem;
    white-space: nowrap;
}

/* Total label cell */
.rpt-total-label {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 600;
}

/* Total value cell */
.rpt-total-val {
    font-weight: 700;
    font-size: 0.88rem;
}

/* Secondary text */
.rpt-secondary-text {
    font-size: 0.82rem;
    color: #374151;
}

/* Meta text (italic, small) */
.rpt-meta-text {
    font-size: 0.78rem;
    color: #64748b;
    font-style: italic;
}

/* Font size 0.83rem */
.erp-text-83 {
    font-size: 0.83rem;
}

/* ─── Report ID Badge Colors ──────────────────────── */
.rpt-id-purchase  { font-weight: 700; color: #7C3AED; font-size: 0.85rem; }
.rpt-id-sale      { font-weight: 700; color: #CD0000; font-size: 0.85rem; }
.rpt-id-purch-ret { font-weight: 700; color: #6d28d9; font-size: 0.85rem; }
.rpt-id-sale-ret  { font-weight: 700; color: #be123c; font-size: 0.85rem; }
.rpt-id-customer  { font-weight: 700; color: #059669; font-size: 0.85rem; }
.rpt-id-vendor    { font-weight: 700; color: #EA580C; font-size: 0.85rem; }

/* ─── Report Grouped Row Backgrounds ─────────────── */

/* Purchase orders */
.rpt-purch-header-row   { background: #F5F3FF !important; border-top: 2px solid #DDD6FE !important; }
.rpt-purch-total-row    { background: #F5F3FF !important; border-top: 1px solid #DDD6FE !important; }
.rpt-purch-item-row     { border-top: 1px solid #E9D5FF; }

/* Sales invoices */
.rpt-sales-header-row   { background: #EEF2FF !important; border-top: 2px solid #C7D2FE !important; }
.rpt-sales-total-row    { background: #EEF2FF !important; border-top: 1px solid #E8EAF0 !important; }
.rpt-sales-item-row     { border-top: 1px solid #E8EAF0; }

/* Purchase returns */
.rpt-purch-ret-header-row  { background: #F5F3FF !important; border-top: 2px solid #DDD6FE !important; }
.rpt-purch-ret-total-row   { background: #F5F3FF !important; border-top: 1px solid #DDD6FE !important; }

/* Sales returns */
.rpt-sale-ret-header-row   { background: #FFF1F2 !important; border-top: 2px solid #FECDD3 !important; }
.rpt-sale-ret-total-row    { background: #FFF1F2 !important; border-top: 1px solid #FECDD3 !important; }

/* Sales by customer */
.rpt-cust-header-row   { background: #ECFDF5 !important; border-top: 2px solid #A7F3D0 !important; }
.rpt-cust-total-row    { background: #ECFDF5 !important; border-top: 1px solid #A7F3D0 !important; }

/* Purchases by vendor */
.rpt-vend-header-row   { background: #FFF7ED !important; border-top: 2px solid #FED7AA !important; }
.rpt-vend-total-row    { background: #FFF7ED !important; border-top: 1px solid #FED7AA !important; }

/* ─── Purchase Order Received Status ─────────────── */
.po-received-status {
    flex: 1;
    text-align: center;
    padding: 8px;
    background: #F0FDF4;
    border-radius: 7px;
    color: #059669;
    font-size: 0.82rem;
    font-weight: 600;
}

/* ─── Dashboard JS-generated Content ────────────── */
.db-company-name {
    font-weight: 700;
    font-size: 0.85rem;
}

.db-company-id {
    font-size: 0.72rem;
    color: #94a3b8;
    font-family: monospace;
}

.db-kpi-value {
    font-weight: 600;
    font-size: 0.85rem;
}

.db-kpi-sub {
    font-size: 0.72rem;
    color: #94a3b8;
}

.db-revenue-cell {
    text-align: right;
    font-weight: 700;
    color: var(--erp-primary);
}

.db-chart-div {
    height: 300px;
}

/* ─── Dashboard Date Filter Buttons ─────────────────── */
.db-filter-btns {
    display: flex;
    gap: 8px;
}

.db-filter-btn {
    padding: 4px 12px;
    font-size: 0.75rem;
    font-weight: 500;
    border: 1.5px solid var(--erp-border);
    border-radius: 8px;
    background: #fff;
    color: var(--erp-text-muted);
    cursor: pointer;
    transition: all 0.15s ease;
}

.db-filter-btn:hover {
    border-color: var(--erp-primary);
    color: var(--erp-primary);
}

.db-filter-btn.active {
    background: var(--erp-primary);
    border-color: var(--erp-primary);
    color: #fff;
    font-weight: 600;
}

/* ─── Recon badge ─────────────────────────────────── */
.cr-status-badge {
    background: rgba(20, 184, 166, 0.1);
    color: #0d9488;
    font-size: 0.72rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 12px;
}

.cr-view-btn {
    background: none;
    border: 1.5px solid #CD0000;
    color: #CD0000;
    border-radius: 6px;
    padding: 3px 12px;
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 4px;
}


/* ─── Feedback / Status Text ─────────────────────── */
.erp-feedback {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 2px 4px;
    transition: opacity 0.6s;
    opacity: 0;
    min-height: 18px;
    margin-top: 3px;
}

.erp-feedback-inline {
    font-size: 0.75rem;
    font-weight: 600;
    margin-top: 3px;
    min-height: 16px;
    opacity: 0;
    transition: opacity 0.6s;
}

.erp-feedback-scanner {
    color: var(--erp-success);
    font-size: 0.9rem;
    font-weight: 600;
    margin-top: 14px;
    min-height: 22px;
    transition: all 0.2s;
}

/* ─── POS Layout ─────────────────────────────────── */
.erp-pos-products {
    height: calc(100vh - 260px);
}
.pos-main-row   { align-items: flex-start; }
.pos-left-col   { }
.pos-right-col  { position: sticky; top: 16px; }

.erp-pos-order-title {
    font-size: 0.95rem;
    color: var(--erp-text-dark);
}

.erp-pos-right-card {
    overflow: visible;
}


/* ─── Barcode Scanner Overlay ────────────────────── */
.erp-scanner-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.93);
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 16px;
}

.erp-scanner-overlay.active {
    display: flex;
}

.erp-scanner-container {
    width: 100%;
    max-width: 420px;
    text-align: center;
}

.erp-scanner-title {
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 14px;
    letter-spacing: 0.02em;
}

.erp-scanner-reader-box {
    position: relative;
    border-radius: 14px;
    overflow: hidden;
    background: #000;
    box-shadow: 0 0 0 2px rgba(59, 79, 228, 0.6), 0 8px 40px rgba(0, 0, 0, 0.5);
}

.erp-scanner-reader-box video,
.erp-scanner-reader-box #reader {
    width: 100%;
}

.erp-scanner-viewfinder {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

/* Scanner corner marks */
.erp-scanner-corner {
    position: absolute;
    width: 36px;
    height: 36px;
    border-color: #CD0000;
    border-style: solid;
}

.erp-scanner-corner-tl {
    top: 18px;
    left: 18px;
    border-width: 3px 0 0 3px;
    border-radius: 4px 0 0 0;
}

.erp-scanner-corner-tr {
    top: 18px;
    right: 18px;
    border-width: 3px 3px 0 0;
    border-radius: 0 4px 0 0;
}

.erp-scanner-corner-bl {
    bottom: 18px;
    left: 18px;
    border-width: 0 0 3px 3px;
    border-radius: 0 0 0 4px;
}

.erp-scanner-corner-br {
    bottom: 18px;
    right: 18px;
    border-width: 0 3px 3px 0;
    border-radius: 0 0 4px 0;
}

/* Scanner scanline animation */
@keyframes bc-scan {
    0%   { top: 20%; }
    50%  { top: 80%; }
    100% { top: 20%; }
}

.erp-scanner-scanline {
    position: absolute;
    left: 18px;
    right: 18px;
    top: 50%;
    height: 2px;
    background: linear-gradient(90deg, transparent, #CD0000, transparent);
    animation: bc-scan 2s linear infinite;
}

/* ─── Camera Button (shared across pages) ────────── */
.bc-cam-btn {
    background: none;
    border: 1px solid var(--erp-border-light);
    border-radius: var(--erp-radius-sm);
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--erp-text-muted);
    transition: all 0.15s;
    flex-shrink: 0;
}

.bc-cam-btn:hover {
    background: #F5F7FF;
    border-color: var(--erp-primary);
    color: var(--erp-primary);
}

/* ─── Hidden App Data ────────────────────────────── */
#app-data {
    display: none;
}

.erp-scanner-cancel-btn {
    margin-top: 14px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.25);
    color: #fff;
    padding: 10px 32px;
    border-radius: var(--erp-radius-md);
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
}

.erp-scanner-cancel-btn:hover {
    background: rgba(255, 255, 255, 0.22);
}


/* ─── Reports / Print Styles ─────────────────────── */
.erp-report-tiles {
    padding: 24px 20px;
}

/* Report tile icon color variants */
.rpt-tile-icon-inventory   { background: #EEF2FF; color: #CD0000; }
.rpt-tile-icon-customer    { background: #F0FDF4; color: #059669; }
.rpt-tile-icon-sales       { background: #FFF7ED; color: #EA580C; }
.rpt-tile-icon-sales-ret   { background: #FFF1F2; color: #E11D48; }
.rpt-tile-icon-purchase    { background: #F5F3FF; color: #7C3AED; }
.rpt-tile-icon-purch-ret   { background: #F5F3FF; color: #6d28d9; }
.rpt-tile-icon-party       { background: #ECFDF5; color: #059669; }
.rpt-tile-icon-vendor      { background: #FFF7ED; color: #EA580C; }

/* Report icon color in titles */
.rpt-icon-inventory { color: #CD0000; }
.rpt-icon-success   { color: #059669; }
.rpt-icon-sales     { color: #EA580C; }

/* Print company/title text */
.rpt-print-company-name {
    font-size: 1.7rem;
    font-weight: 900;
    color: #000;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    line-height: 1.2;
}

.rpt-print-report-title {
    display: block;
    font-size: 1rem;
    font-weight: 700;
    color: #000;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid #ccc;
}

.erp-print-header {
    padding: 0 0 14px;
    border-bottom: 2.5px solid #000;
    margin-bottom: 16px;
    text-align: center;
}

.erp-print-title {
    font-size: 1.7rem;
    font-weight: 900;
    color: #000;
}

.erp-filter-w-190 {
    width: 190px;
}

.erp-filter-w-160 {
    width: 160px;
}

.erp-filter-w-150 {
    width: 150px;
}

@media print {
    .erp-no-print {
        display: none !important;
    }

    .erp-print-only {
        display: block !important;
    }
}


/* ─── App Hidden Data Container ──────────────────── */
#erp-app-data {
    display: none;
}

/* ─── Dashboard ──────────────────────────────────── */
.erp-chart-container {
    height: 300px;
}

.erp-primary-icon-color {
    color: var(--erp-primary);
}

/* ─── Table Thead Background ─────────────────────── */
.erp-thead-light { background: var(--erp-bg-light); }

/* ─── Utility Color Classes ──────────────────────── */
.text-erp-purple { color: #6d28d9; }
.text-erp-rose   { color: #be123c; }
.text-erp-orange { color: #EA580C; }
.text-erp-violet { color: #7C3AED; }

/* ─── Report Table — Summary / Count Spans ───────── */
.rpt-count-span {
    color: #64748b;
    font-weight: 500;
    font-size: 0.82rem;
}

.rpt-bank-cell {
    font-size: 0.78rem;
    color: #64748b;
}

.rpt-rcvd-badge {
    font-size: 0.65rem;
    color: #059669;
    font-weight: 600;
    margin-left: 6px;
}

.rpt-line-amt {
    font-size: 0.83rem;
    font-weight: 500;
}

.rpt-reason-purch { color: #6d28d9; font-size: 0.7rem; }
.rpt-reason-sale  { color: #be123c; font-size: 0.7rem; }

/* Indented item ID cells in grouped reports */
.rpt-indent-id-sale {
    padding-left: 26px !important;
    font-size: 0.83rem;
    font-weight: 600;
    color: #CD0000;
}

.rpt-indent-id-vend {
    padding-left: 26px !important;
    font-size: 0.83rem;
    font-weight: 600;
    color: #7C3AED;
}

/* ─── Cash Recon — Detail Overlay ────────────────── */
.cr-detail-overlay {
    position: fixed;
    inset: 0;
    z-index: 1090;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, 0.45);
}

.cr-detail-panel {
    background: #F8F9FC;
    border-radius: 16px;
    width: 100%;
    max-width: 480px;
    max-height: 88vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.22);
    display: flex;
    flex-direction: column;
}

.cr-detail-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px 14px;
    border-bottom: 1px solid #E8EAF0;
    background: #fff;
    border-radius: 16px 16px 0 0;
    position: sticky;
    top: 0;
    z-index: 2;
}

.cr-detail-header-left {
    display: flex;
    align-items: center;
    gap: 12px;
}

.cr-detail-icon-box {
    width: 38px;
    height: 38px;
    background: linear-gradient(135deg, #e0f2fe, #bae6fd);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cr-detail-icon  { font-size: 1.3rem; color: #0ea5e9; }
.cr-detail-title { font-size: 0.95rem; font-weight: 700; color: #0f172a; letter-spacing: 0.03em; }
.cr-detail-sub   { font-size: 0.75rem; color: #64748b; }

.cr-detail-close-btn {
    background: none;
    border: none;
    font-size: 1.4rem;
    color: #94a3b8;
    cursor: pointer;
    line-height: 1;
}

.cr-detail-body { padding: 16px 20px 20px; }

.cr-detail-footer {
    padding: 12px 20px;
    border-top: 1px solid #E8EAF0;
    background: #fff;
    border-radius: 0 0 16px 16px;
    display: flex;
    justify-content: flex-end;
    position: sticky;
    bottom: 0;
}

.cr-detail-close-solid {
    background: #CD0000;
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 8px 24px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
}

/* ─── Cash Recon — Denom toggle ──────────────────── */
.cr-denom-label   { font-size: 0.65rem; color: #94a3b8; font-weight: 500; margin-left: 6px; }
.cr-denom-chevron { font-size: 1rem; color: #94a3b8; transition: transform 0.2s ease; }
.erp-cursor-pointer { cursor: pointer; }
.fw-600 { font-weight: 600; }

/* Recon status badge — larger variant in detail view */
.cr-status-badge-lg {
    background: rgba(20, 184, 166, 0.12);
    color: #0d9488;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 20px;
}

/* ─── Cash Recon — Detail view JS-built HTML ─────── */
.cr-var-td   { padding: 8px 14px; text-align: right; font-weight: 600; }
.cr-row-item { display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: 1px solid #F1F5F9; }
.cr-row-label { font-size: 0.78rem; color: #64748b; text-transform: uppercase; letter-spacing: 0.04em; }
.cr-row-val   { font-size: 0.83rem; color: #1e293b; }

.cr-period-box {
    background: #F0FDF4;
    border-radius: 10px;
    padding: 14px 16px;
    margin-bottom: 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.cr-period-label { font-size: 0.7rem; text-transform: uppercase; color: #64748b; letter-spacing: 0.05em; }
.cr-period-val   { font-size: 0.85rem; font-weight: 700; color: #0f172a; }

.cr-info-box {
    background: #fff;
    border: 1px solid #E8EAF0;
    border-radius: 10px;
    padding: 4px 16px;
    margin-bottom: 14px;
}

.cr-variance-neg {
    background: #FFF5F5;
    border: 1px solid #FECACA;
    border-radius: 10px;
    padding: 4px 16px;
    margin-bottom: 14px;
}

.cr-variance-pos {
    background: #FFFBEB;
    border: 1px solid #FDE68A;
    border-radius: 10px;
    padding: 4px 16px;
    margin-bottom: 14px;
}

/* ─── Settings — Bulk Import UI ──────────────────── */
.set-import-subtitle { margin-left: auto; font-size: 0.72rem; font-weight: 500; color: #94a3b8; }
.set-upload-icon     { font-size: 2.8rem; color: #C5CAE9; display: block; margin-bottom: 10px; }
.set-upload-title    { font-size: 0.95rem; font-weight: 600; color: #374151; margin-bottom: 4px; }
.set-upload-hint     { font-size: 0.72rem; color: #C5CAE9; margin-top: 8px; }
.set-download-link   { font-size: 0.8rem; color: #CD0000; font-weight: 600; text-decoration: none; }

.set-valid-badge {
    margin-left: auto;
    display: none;
    align-items: center;
    gap: 6px;
    font-size: 0.82rem;
    font-weight: 700;
    color: #059669;
    background: rgba(5, 150, 105, 0.08);
    padding: 5px 14px;
    border-radius: 20px;
}

.set-import-label {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6B7280;
    margin-bottom: 8px;
}

.set-preview-box {
    border: 1px solid #E8EAF0;
    border-radius: 8px;
    overflow: hidden;
    max-height: 150px;
}

.set-import-prog-box {
    background: #F8F9FC;
    border: 1px solid #E8EAF0;
    border-radius: 10px;
    padding: 20px 24px;
    margin-bottom: 16px;
}

.set-stat-ok   { font-size: 1.3rem; font-weight: 700; color: #059669; }
.set-stat-fail { font-size: 1.3rem; font-weight: 700; color: #EF4444; }
.set-stat-skip { font-size: 1.3rem; font-weight: 700; color: #94a3b8; }

.set-lock-msg { font-size: 0.75rem; color: #ea580c; font-weight: 600; }

/* Bulk import mapping table */
.bk-preview-th {
    padding: 6px 10px;
    font-size: 0.72rem;
    font-weight: 600;
    color: #64748b;
    border-bottom: 1px solid #E8EAF0;
    white-space: nowrap;
}

.bk-preview-td {
    padding: 5px 10px;
    color: #374151;
    border-bottom: 1px solid #F0F2F8;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bk-req-label  { color: #EF4444; font-size: 0.72rem; font-weight: 700; }
.bk-opt-label  { color: #94a3b8; font-size: 0.72rem; }
.bk-icon-ok    { color: #059669; font-size: 1rem; }
.bk-icon-empty { color: #DDE1EC; font-size: 1rem; }
.bk-map-label-td  { padding: 8px 14px; font-weight: 600; color: #1e293b; font-size: 0.82rem; }
.bk-map-select-td { padding: 6px 10px; }
.bk-map-status-td { padding: 8px 14px; text-align: center; }
.bk-err-row       { color: #EF4444; padding: 4px 0; border-bottom: 1px solid #FEE2E2; }

.bk-col-select { height: 30px !important; font-size: 0.8rem !important; padding: 0 8px; }

/* Sequence form inputs */
.seq-input-base { height: 30px; font-size: 0.8rem; border: 1px solid #DDE1EC; border-radius: 5px; }
.seq-input-ro   { background: #F8F9FC !important; color: #64748b; cursor: not-allowed; }
.seq-input-rw   { background: #fff; color: #1A1D2E; }
.set-auto-managed { font-size: 0.75rem; color: #B0B7C9; font-style: italic; }

/* Settings error list */
.set-err-list { font-size: 0.78rem; max-height: 180px; overflow-y: auto; margin-bottom: 16px; }

/* Import button variants */
.set-import-btn {
    font-size: 0.85rem;
    padding: 9px 22px;
    border-radius: 7px;
    background: linear-gradient(135deg, #059669, #10B981);
    color: #fff;
    border: none;
    font-weight: 600;
}

.set-action-btn { font-size: 0.85rem; padding: 9px 22px; border-radius: 7px; }
.set-action-btn-sm { font-size: 0.85rem; padding: 9px 20px; border-radius: 7px; }
.bk-row-badge { background: rgba(255, 255, 255, 0.2); padding: 1px 8px; border-radius: 10px; }

/* Progress bar track & bar */
.set-prog-track { background: #E8EAF0; border-radius: 100px; height: 10px; overflow: hidden; }
#bk-prog-bar { height: 100%; background: #CD0000; border-radius: 100px; width: 0%; transition: width 0.25s; }

.set-prog-lbl { font-size: 0.85rem; font-weight: 600; color: #374151; }
.set-prog-pct { font-size: 0.85rem; font-weight: 700; color: #CD0000; }

.bk-seq-preview {
    font-size: 0.78rem;
    background: #F0F2FF;
    color: #CD0000;
    padding: 2px 8px;
    border-radius: 4px;
}

/* ─── POS — Layout & Interactive Components ──────── */
.pos-product-card { cursor: pointer; border: 1px solid #E8EAF0; border-radius: 10px; background: #fff; transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease; }
.pos-product-card:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.08); border-color: #e53333; }
.pos-product-card.disabled { opacity: 0.45; cursor: not-allowed; pointer-events: none; }
.pos-product-sku  { font-size: 0.68rem; color: #6B7280; }
.pos-product-icon { height: 40px; background: #F8F9FC; border-radius: 8px; display: flex; align-items: center; justify-content: center; margin-bottom: 6px; }

.pos-cart-header { padding: 14px 16px; border-bottom: 1px solid #E8EAF0; }
.pos-clear-btn { background: none; border: none; font-size: 0.78rem; font-weight: 500; color: #EF4444; cursor: pointer; padding: 4px 8px; border-radius: 6px; transition: background 0.15s ease; }
.pos-clear-btn:hover { background: rgba(239,68,68,0.06); }
.pos-cart-item { padding: 10px 0; border-bottom: 1px solid #F0F2F8; }
.pos-cart-item:last-child { border-bottom: none; }
.pos-cart-col-header { display: flex; align-items: center; gap: 6px; padding: 4px 0 6px; border-bottom: 1px solid #E8EAF0; margin-bottom: 4px; }
.pos-cch-name  { flex: 1; min-width: 0; font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #9CA3AF; }
.pos-cch-uom   { width: 80px; font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #9CA3AF; }
.pos-cch-disc  { width: 64px; font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #9CA3AF; text-align: center; }
.pos-cch-qty   { width: 86px; font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #9CA3AF; text-align: center; }
.pos-cch-total { width: 90px; font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #9CA3AF; text-align: right; }
.pos-cch-del   { width: 28px; flex-shrink: 0; }
.pos-ci-row  { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.pos-ci-name { flex: 1; min-width: 0; font-size: 0.82rem; font-weight: 600; color: #1A1D2E; word-break: break-word; }
.pos-ci-input  { width: 64px; height: 28px; border: 1px solid #DDE1EC; border-radius: 6px; font-size: 0.75rem; text-align: center; color: #374151; padding: 0 6px; background: #fff; outline: none; -moz-appearance: textfield; }
.pos-ci-input::-webkit-outer-spin-button,
.pos-ci-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.pos-ci-input:focus { border-color: #e53333; box-shadow: 0 0 0 2px rgba(205,0,0,0.1); }

.pos-checkout-panel { padding: 10px 14px; border-top: 1px solid #E8EAF0; background: #FAFBFD; }
.pos-pay-btn { height: 32px; font-size: 0.78rem; font-weight: 600; border-radius: 7px; border: 1px solid #DDE1EC; color: #6B7280; background: #fff; transition: all 0.15s ease; }
.pos-pay-btn.active { background: linear-gradient(135deg, #CD0000, #e53333); border-color: #CD0000; color: #fff; box-shadow: 0 2px 6px rgba(205,0,0,0.25); }
.pos-complete-btn { height: 38px; font-size: 0.85rem; font-weight: 700; border-radius: 8px; border: none; background: linear-gradient(135deg, #10B981, #059669); color: #fff; cursor: pointer; transition: transform 0.15s ease, box-shadow 0.15s ease; }
.pos-complete-btn:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(16,185,129,0.35); }
.pos-complete-btn:disabled { opacity: 0.5; cursor: not-allowed; }

.pos-qty-group { display: inline-flex; border: 1px solid #DDE1EC; border-radius: 6px; overflow: hidden; }
.pos-qty-btn   { width: 26px; height: 26px; border: none; background: #F8F9FC; color: #6B7280; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 12px; transition: background 0.15s ease; }
.pos-qty-btn:hover { background: #EEF0F8; color: #CD0000; }
.pos-qty-input { width: 40px; height: 26px; border: none; border-left: 1px solid #DDE1EC; border-right: 1px solid #DDE1EC; text-align: center; font-size: 0.78rem; font-weight: 600; color: #1A1D2E; background: #fff; padding: 0; outline: none; -moz-appearance: textfield; }
.pos-qty-input::-webkit-outer-spin-button,
.pos-qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.pos-qty-input:focus { background: #F0F4FF; border-left-color: #CD0000; border-right-color: #CD0000; }

.pos-cat-btn { height: 30px; padding: 0 12px; font-size: 0.75rem; font-weight: 600; border-radius: 6px; border: 1px solid #DDE1EC; background: #fff; color: #6B7280; cursor: pointer; transition: all 0.15s ease; }
.pos-cat-btn:hover  { border-color: #e53333; color: #e53333; }
.pos-cat-btn.active { background: #CD0000; border-color: #CD0000; color: #fff; }

.pos-line-price-wrap { display: inline-flex; align-items: center; gap: 2px; border: 1px dashed #DDE1EC; border-radius: 6px; background: #F8F9FC; padding: 0 5px 0 6px; height: 28px; transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease; cursor: text; }
.pos-line-price-wrap:hover { border-color: #e53333; background: #fff; box-shadow: 0 0 0 2px rgba(205,0,0,0.08); }
.pos-line-price-wrap:focus-within { border-color: #CD0000; background: #fff; box-shadow: 0 0 0 2px rgba(205,0,0,0.12); border-style: solid; }
.pos-line-price-prefix { font-size: 0.72rem; font-weight: 600; color: #6B7280; white-space: nowrap; }
.pos-line-price { width: 52px; border: none !important; background: transparent !important; font-size: 0.82rem !important; font-weight: 700 !important; color: #1A1D2E !important; text-align: right; padding: 0 !important; outline: none; box-shadow: none !important; -moz-appearance: textfield; }
.pos-line-price::-webkit-outer-spin-button,
.pos-line-price::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.pos-line-price-icon { font-size: 11px; color: #B0B7C9; flex-shrink: 0; transition: color 0.15s ease; }
.pos-line-price-wrap:hover .pos-line-price-icon,
.pos-line-price-wrap:focus-within .pos-line-price-icon { color: #e53333; }

/* Allow SDD panel to overflow the right card boundary */
#pos-right-card { overflow: hidden !important; border-radius: 10px; display: flex; flex-direction: column; max-height: calc(100vh - 32px); }
#pos-right-card .pos-cart-header { border-radius: 10px 10px 0 0; overflow: hidden; flex-shrink: 0; }
#pos-cart { flex: 1; overflow-y: auto; min-height: 0; }
#pos-right-card .pos-checkout-panel { flex-shrink: 0; }

/* POS customer SDD trigger (slightly shorter than sr-sdd-trigger) */
.pos-sdd-trigger { height: 36px; font-size: 0.85rem; border: 1px solid #DDE1EC; border-radius: 6px; background: #fff; width: 100%; padding: 0 10px; cursor: pointer; display: flex; align-items: center; justify-content: space-between; transition: border-color 0.2s ease, box-shadow 0.2s ease; }
.pos-sdd-trigger:hover { border-color: #B0B7C9; }
.pos-sdd-trigger.sdd-open  { border-color: #CD0000; box-shadow: 0 0 0 3px rgba(205,0,0,0.08); }
.pos-sdd-trigger.is-invalid { border-color: #EF4444 !important; box-shadow: 0 0 0 3px rgba(239,68,68,0.1) !important; }

/* POS overlay warning footer */
.ms-footer-center { padding: 16px 24px; display: flex; gap: 10px; justify-content: center; border-top: 1px solid #F3F4F6; }
.ms-btn-ok-warn   { height: 36px; padding: 0 28px; border: none; border-radius: 7px; background: linear-gradient(135deg, #F59E0B, #D97706); color: #fff; font-size: 0.83rem; font-weight: 600; cursor: pointer; }

/* ─── POS — Sale Success Modal ───────────────────── */
.pos-success-icon-wrap {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(16, 185, 129, 0.1);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.pos-success-title   { font-weight: 700; color: #1A1D2E; margin-bottom: 4px; }
.pos-success-sub     { font-size: 0.82rem; color: #6B7280; margin-bottom: 16px; }
.pos-success-box     { background: #fff; border: 1px solid #E8EAF0; border-radius: 8px; padding: 14px; margin-bottom: 8px; }
.pos-success-lbl     { font-size: 0.68rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: #6B7280; margin-bottom: 4px; }
.pos-success-amt     { font-size: 1.5rem; font-weight: 700; color: #CD0000; }

/* POS cart/product JS-built items */
.pos-subtotal-val  { font-weight: 500; color: #1A1D2E; }
.pos-discount-val  { font-weight: 500; color: #EF4444; }
.pos-total-val     { font-size: 1.15rem; color: #CD0000; }
.pos-product-name  { font-size: 0.82rem; font-weight: 600; color: #1A1D2E; }
.pos-product-price { font-size: 0.72rem; color: #6B7280; }

.pos-remove-btn {
    border: none;
    background: none;
    color: #EF4444;
    cursor: pointer;
    padding: 0;
    font-size: 14px;
}

.pos-cart-empty {
    font-size: 0.82rem;
    font-weight: 500;
    color: #6B7280;
}

.pos-cart-empty-sub { font-size: 0.72rem; color: #B0B7C9; }

/* Background light utility */
.erp-bg-light { background: var(--erp-bg-light); }

/* POS discount input */
.pos-disc-input { width: 75px; height: 28px !important; font-size: 0.75rem !important; }

/* POS invoice print */
.pos-print-id { font-weight: 600; color: #1A1D2E; }

/* Empty grid / cart icons */
.erp-icon-xl    { font-size: 2.5rem; opacity: 0.3; }
.erp-icon-lg    { font-size: 2rem;   opacity: 0.5; }
.erp-icon-1-3   { font-size: 1.3rem; color: #B0B7C9; }

/* No-products / empty messages */
.pos-empty-msg     { font-size: 0.85rem; font-weight: 500; }
.pos-empty-sub     { font-size: 0.72rem; color: #B0B7C9; }
.pos-cart-lbl      { font-size: 0.82rem; font-weight: 500; color: #6B7280; }

/* POS product grid — stock badges */
.pos-badge-out { font-size: 0.68rem; font-weight: 600; color: #EF4444; background: rgba(239,68,68,0.08); padding: 2px 8px; border-radius: 4px; }
.pos-badge-low { font-size: 0.68rem; font-weight: 600; color: #F59E0B; background: rgba(245,158,11,0.08); padding: 2px 8px; border-radius: 4px; }
.pos-badge-ok  { font-size: 0.68rem; font-weight: 600; color: #10B981; background: rgba(16,185,129,0.08); padding: 2px 8px; border-radius: 4px; }

/* ─── Purchase Order Table Cells ─────────────────── */
.po-td-input  { padding: 6px 10px; border-bottom: 1px solid #F0F2F8; vertical-align: middle; overflow: visible; }
.po-td-item   { padding: 8px 10px; border-bottom: 1px solid #F0F2F8; font-size: 0.85rem; }
.po-td-center { padding: 8px 10px; border-bottom: 1px solid #F0F2F8; font-size: 0.85rem; text-align: center; }
.po-td-remain { padding: 8px 10px; border-bottom: 1px solid #F0F2F8; font-size: 0.85rem; font-weight: 600; }
.po-input-sm  { height: 34px !important; font-size: 0.82rem !important; }
#newPOModal .table { overflow: visible; }
#newPOModal .modal-body { overflow: visible !important; }

/* Purchase action buttons */
.pg-action-btn { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border: none; border-radius: 6px; background: #F3F4F6; color: #6B7280; cursor: pointer; font-size: 15px; transition: background 0.15s ease, color 0.15s ease; }
.pg-action-btn:hover { background: #E5E7EB; color: #374151; }
.pg-action-success { background: #D1FAE5; color: #059669; }
.pg-action-success:hover { background: #A7F3D0; color: #047857; }

/* Receive goods button */
.btn-erp-receive {
    background: linear-gradient(135deg, #10B981, #059669);
    padding: 8px 16px;
    font-size: 0.82rem;
    color: #fff;
    border: none;
    border-radius: var(--erp-radius-md);
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.15s ease;
}
.btn-erp-receive:hover { opacity: 0.9; }

/* Receipts button */
.btn-erp-receipts {
    background: #F0F2F8;
    padding: 8px 14px;
    font-size: 0.82rem;
    color: #374151;
    border: none;
    border-radius: var(--erp-radius-md);
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s ease;
}
.btn-erp-receipts:hover { background: #E5E7EB; }

/* Receive modal PO ID subtitle */
.recv-po-sub { font-size: 0.75rem; color: rgba(255, 255, 255, 0.7); }

/* Purchase Return — receipt groups */
.pr-rcv-group { border: 1px solid #E8EAF0; border-radius: 8px; overflow: hidden; }
.pr-rcv-group-header { display: flex; align-items: center; justify-content: space-between; padding: 6px 14px; background: #F8F9FC; border-bottom: 1px solid #E8EAF0; gap: 8px; }
.pr-rcv-id { display: inline-flex; align-items: center; font-size: 0.76rem; font-weight: 700; color: #CD0000; background: #FEE2E2; border-radius: 5px; padding: 2px 8px; white-space: nowrap; letter-spacing: 0.01em; }
.sr-inv-id  { display: inline-flex; align-items: center; font-size: 0.76rem; font-weight: 700; color: #6D28D9; background: #EDE9FE; border-radius: 5px; padding: 2px 8px; white-space: nowrap; letter-spacing: 0.01em; }
.pr-rcv-date { font-size: 0.76rem; color: #6B7280; white-space: nowrap; }
.pr-rcv-group .po-th-col { padding: 5px 10px; font-size: 0.7rem; }
.pr-rcv-group .po-td-item { padding: 5px 10px; font-size: 0.82rem; vertical-align: middle; }
.pr-rcv-group .po-td-center { padding: 5px 10px; font-size: 0.82rem; vertical-align: middle; }
.pr-rcv-group .po-td-input { padding: 4px 10px; vertical-align: middle; }
.pr-rcv-group .po-input-sm { height: 30px !important; font-size: 0.8rem !important; }

/* PO th columns */
.po-th-col { font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: #6B7280; background: #F8F9FC; padding: 8px 10px; border-bottom: 1px solid #E8EAF0; }
.po-th-act  { background: #F8F9FC; padding: 8px; border-bottom: 1px solid #E8EAF0; }
.po-del-btn { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border: none; border-radius: 5px; background: #FEE2E2; color: #EF4444; cursor: pointer; font-size: 14px; transition: background 0.15s ease; }
.po-del-btn:hover { background: #FECACA; color: #DC2626; }

/* ── Searchable Dropdown (SDD) — shared across 7+ pages ── */
.sdd-wrap { position: relative; }
.sr-sdd-trigger { height: 38px; font-size: 0.875rem; font-weight: 500; border: 1px solid #DDE1EC; border-radius: 7px; background: #fff; width: 100%; padding: 0 10px; cursor: pointer; display: flex; align-items: center; justify-content: space-between; transition: border-color 0.2s ease, box-shadow 0.2s ease; color: #1A1D2E; }
.sr-sdd-trigger:hover { border-color: #B0B7C9; }
.sr-sdd-trigger.sdd-open,
.sdd-wrap.open .sr-sdd-trigger { border-color: #CD0000; box-shadow: 0 0 0 3px rgba(205,0,0,0.12); }
.sdd-caret { font-size: 14px; color: #6B7280; flex-shrink: 0; transition: transform 0.2s ease; }
.sdd-wrap.open .sdd-caret { transform: rotate(180deg); }
.sdd-disp { font-size: 0.875rem; color: #1A1D2E; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sdd-panel { display: none; position: absolute; top: calc(100% + 4px); left: 0; right: 0; background: #fff; border: 1px solid #DDE1EC; border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,0.12); z-index: 3000; overflow: hidden; }
.sdd-wrap.open .sdd-panel { display: block; }
.sdd-search-row { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-bottom: 1px solid #F0F2F8; }
.sdd-search-row .ti-search { font-size: 13px; color: #9CA3AF; flex-shrink: 0; }
.sdd-search-inp { border: none; outline: none; font-size: 0.82rem; color: #1A1D2E; flex: 1; background: transparent; }
.sdd-opts-wrap { max-height: 200px; overflow-y: auto; }
.sdd-opt { padding: 8px 12px; font-size: 0.83rem; color: #374151; cursor: pointer; transition: background 0.12s; }
.sdd-opt:hover { background: #F0F4FF; color: #CD0000; }
.sdd-no-res { padding: 10px 12px; font-size: 0.82rem; color: #9CA3AF; text-align: center; }
/* Product dropdown display color variants */
.sdd-disp-normal { color: #1A1D2E; font-size: 0.82rem; }
.sdd-disp-muted  { color: #B0B7C9; font-size: 0.82rem; }

/* Expand row td (sale-returns, purchase-returns) */
.erp-expand-row-td { background: var(--erp-bg-light); padding: 16px 14px; }

/* Dashboard amber icon (leaderboard) */
.erp-text-amber { color: #ca8a04; }

/* ── UOM Conversions (Inventory modal) ────────────────────────────────────── */
.uom-conv-header { display: flex; justify-content: space-between; align-items: center; padding: 10px 12px; background: #F8F9FC; border: 1px solid #E8EAF0; border-radius: 6px; cursor: pointer; font-size: 0.82rem; font-weight: 600; color: #374151; }
.uom-conv-header:hover { background: #F0F2F8; }
.uom-conv-body { border: 1px solid #E8EAF0; border-top: none; border-radius: 0 0 6px 6px; padding: 12px; }
.uom-conv-table { width: 100%; font-size: 0.80rem; border-collapse: collapse; }
.uom-conv-th { padding: 5px 8px; font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: #6B7280; border-bottom: 1px solid #E8EAF0; }
.uom-conv-td { padding: 7px 8px; border-bottom: 1px solid #F3F4F6; vertical-align: middle; }
.uom-conv-del-btn { padding: 3px 7px; font-size: 0.78rem; background: none; border: 1px solid #EF4444; color: #EF4444; border-radius: 4px; cursor: pointer; }
.uom-conv-del-btn:hover { background: #FEF2F2; }
.uom-conv-empty { color: #9CA3AF; font-size: 0.80rem; text-align: center; padding: 10px 0; }
/* Checkbox for default flags */
.uom-conv-cb { width: 16px; height: 16px; cursor: pointer; accent-color: var(--erp-primary); vertical-align: middle; }
/* Multiplier inline edit */
.uom-mult-display { font-size: 0.82rem; }
.uom-conv-edit-btn { background: none; border: none; color: #C4C9D4; padding: 0 2px; cursor: pointer; font-size: 0.75rem; line-height: 1; vertical-align: middle; }
.uom-conv-edit-btn:hover { color: var(--erp-primary); }
.uom-mult-edit-wrap { display: inline-flex; align-items: center; gap: 3px; vertical-align: middle; }
.uom-mult-edit-inp { width: 64px; padding: 2px 6px; border: 1px solid #D1D5DB; border-radius: 4px; font-size: 0.80rem; }
.uom-conv-save-btn { background: none; border: 1px solid #10B981; color: #10B981; border-radius: 4px; padding: 2px 5px; cursor: pointer; font-size: 0.72rem; line-height: 1.4; }
.uom-conv-save-btn:hover { background: #F0FDF4; }
.uom-conv-cancel-btn { background: none; border: 1px solid #EF4444; color: #EF4444; border-radius: 4px; padding: 2px 5px; cursor: pointer; font-size: 0.72rem; line-height: 1.4; }
.uom-conv-cancel-btn:hover { background: #FEF2F2; }
/* Add UOM card */
.uom-add-card { background: #F8F9FC; border: 1px dashed #D1D5DB; border-radius: 6px; padding: 10px 12px; margin-top: 4px; }
.uom-add-grid { display: grid; grid-template-columns: 1fr 160px auto; gap: 8px; align-items: end; }
.uom-add-btn-wrap { display: flex; align-items: flex-end; }
.uom-conv-add-btn { font-size: 0.80rem; padding: 6px 14px; background: var(--erp-primary); color: #fff; border: none; border-radius: 5px; cursor: pointer; white-space: nowrap; height: 36px; }
.uom-conv-add-btn:hover { background: var(--erp-primary-hover); }

/* ── POS UOM selector per cart item ──────────────────────────────────────── */
.pos-uom-sel { font-size: 0.75rem; padding: 0 4px; height: 28px; border: 1px solid #DDE1EC; border-radius: 6px; background: #fff; color: #374151; min-width: 80px; cursor: pointer; }
.pos-uom-sel:disabled { background: #F8F9FC; color: #6B7280; cursor: default; }
.pos-cart-stock { font-size: 0.70rem; padding: 2px 6px; border-radius: 10px; font-weight: 600; }
.pos-cart-stock-ok { background: #D1FAE5; color: #065F46; }
.pos-cart-stock-low { background: #FEF3C7; color: #92400E; }
.pos-cart-stock-out { background: #FEE2E2; color: #991B1B; }

/* ── Purchase Order UOM elements ─────────────────────────────────────────── */
.po-uom-preview { font-size: 0.70rem; color: #6B7280; margin-top: 3px; }
.po-uom-badge { font-size: 0.72rem; padding: 2px 7px; background: #EEF2FF; color: #4338CA; border-radius: 10px; font-weight: 600; }

/* ── Product Price Tiers ─────────────────────────────────────────── */
.pm-tier-wrap          { margin-top: 1rem; border: 1px solid #e6e7ee; border-radius: 6px; overflow: hidden; }
.pm-tier-header        { display: flex; align-items: center; justify-content: space-between;
                         padding: .5rem .75rem; background: #f8f9fc; font-size: .8rem; font-weight: 600; color: #4a4c6a; }
.pm-tier-add-btn       { font-size: .78rem; padding: .2rem .6rem; border: 1px solid #c5c7db;
                         background: #fff; border-radius: 5px; cursor: pointer; color: #4a4c6a; }
.pm-tier-add-btn:hover { background: #eef0ff; }
.pm-tier-empty         { padding: .6rem .75rem; font-size: .8rem; color: #9193a6; font-style: italic; }
.pm-tier-table         { width: 100%; font-size: .82rem; border-collapse: collapse; }
.pm-tier-table th,
.pm-tier-table td      { padding: .4rem .75rem; border-top: 1px solid #eef0f7; }
.pm-tier-table th      { background: #f3f4fb; font-weight: 600; font-size: .78rem; color: #6163a0; }
.pm-tier-add-form      { padding: .5rem .75rem; background: #f8f9fc; }

/* ── Dynamic Fields ──────────────────────────────────────────────────── */
.dynf-section-title         { font-size: 0.78rem; font-weight: 700; color: #475569; text-transform: uppercase; letter-spacing: 0.07em; margin-bottom: 10px; display: flex; align-items: center; gap: 4px; }
.dynf-grid                  { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px; margin-bottom: 4px; }
.dynf-group-label           { grid-column: 1 / -1; font-size: 0.68rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.1em; color: #94a3b8; padding: 6px 0 2px; display: flex; align-items: center; gap: 6px; }
.dynf-group-label::after    { content: ''; flex: 1; height: 1px; background: #EEF0F8; }

.dynf-group-label.hint-retail       { color: #2563EB; }
.dynf-group-label.hint-retail::after       { background: rgba(37,99,235,0.15); }
.dynf-group-label.hint-grocery      { color: #059669; }
.dynf-group-label.hint-grocery::after      { background: rgba(5,150,105,0.15); }
.dynf-group-label.hint-pharmacy     { color: #0891B2; }
.dynf-group-label.hint-pharmacy::after     { background: rgba(8,145,178,0.15); }
.dynf-group-label.hint-automobile   { color: #D97706; }
.dynf-group-label.hint-automobile::after   { background: rgba(217,119,6,0.15); }

.dynf-card                  { background: #fff; border: 1.5px solid #EEF0F8; border-radius: 9px; padding: 10px 12px; display: flex; align-items: center; justify-content: space-between; gap: 8px; transition: border-color 0.15s, box-shadow 0.15s, background 0.15s; }
.dynf-card:hover            { border-color: #D0D4E8; box-shadow: 0 1px 4px rgba(0,0,0,0.06); }
.dynf-card.pending-enable   { border-color: #86EFAC; background: #F0FDF4; box-shadow: 0 0 0 2px rgba(34,197,94,0.12); }
.dynf-card.pending-disable  { border-color: #FCA5A5; background: #FFF5F5; box-shadow: 0 0 0 2px rgba(239,68,68,0.10); }
.dynf-card-left             { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; }
.dynf-card-name             { font-size: 0.8rem; font-weight: 600; color: #1e293b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dynf-card-badges           { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.dynf-badge-type            { font-size: 0.65rem; padding: 1px 6px; border-radius: 6px; background: #F1F5F9; color: #64748b; font-weight: 500; }
.dynf-badge-industry        { font-size: 0.65rem; padding: 1px 6px; border-radius: 6px; font-weight: 600; }
.dynf-badge-industry.hint-retail     { background: rgba(37,99,235,0.09); color: #2563EB; }
.dynf-badge-industry.hint-grocery    { background: rgba(5,150,105,0.09); color: #059669; }
.dynf-badge-industry.hint-pharmacy   { background: rgba(8,145,178,0.09); color: #0891B2; }
.dynf-badge-industry.hint-automobile { background: rgba(217,119,6,0.09); color: #D97706; }

.dynf-toggle                { position: relative; width: 36px; height: 20px; flex-shrink: 0; }
.dynf-toggle input          { opacity: 0; width: 0; height: 0; position: absolute; }
.dynf-toggle-track          { position: absolute; inset: 0; border-radius: 20px; background: #CBD5E1; transition: background 0.2s; cursor: pointer; }
.dynf-toggle input:checked  ~ .dynf-toggle-track { background: #CD0000; }
.dynf-toggle-thumb          { position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.25); transition: transform 0.2s; pointer-events: none; }
.dynf-toggle input:checked  ~ .dynf-toggle-thumb { transform: translateX(16px); }
.dynf-toggle input:disabled ~ .dynf-toggle-track { opacity: 0.5; cursor: not-allowed; }

.dynf-pending-dot           { width: 6px; height: 6px; border-radius: 50%; background: #F59E0B; flex-shrink: 0; animation: dynf-pulse 1s ease-in-out infinite; }
@keyframes dynf-pulse       { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }

.dynf-save-btn              { display: inline-flex; align-items: center; gap: 6px; padding: 7px 16px; background: #CD0000; color: #fff; border: none; border-radius: 8px; font-size: 0.8rem; font-weight: 700; cursor: pointer; transition: opacity 0.15s, transform 0.1s; }
.dynf-save-btn:hover        { opacity: 0.9; transform: translateY(-1px); }
.dynf-save-btn:active       { transform: translateY(0); }
.dynf-save-badge            { background: rgba(255,255,255,0.3); border-radius: 10px; padding: 1px 7px; font-size: 0.72rem; font-weight: 800; min-width: 20px; text-align: center; }

/* ── Inventory Page ────────────────────────────────────────────────────────── */
.inv-page-wrap { display: flex; flex-direction: column; gap: 16px; }
.inv-header-card { background: linear-gradient(135deg, #CD0000 0%, #e53333 100%); border: none; border-radius: 10px; overflow: hidden; position: relative; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.inv-header-card::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(255,255,255,0.12) 1px, transparent 1px); background-size: 16px 16px; opacity: 0.5; pointer-events: none; }
.inv-header-card::after { content: ''; position: absolute; top: -40%; right: -8%; width: 260px; height: 260px; background: rgba(255,255,255,0.06); border-radius: 50%; pointer-events: none; }
.inv-header-body { padding: 20px 28px !important; position: relative; z-index: 1; }
.inv-header-card .inv-title { font-size: 1.35rem; font-weight: 700; color: #fff; }
.inv-header-card .inv-subtitle { font-size: 0.82rem; color: rgba(255,255,255,0.82); }
.inv-header-card .btn { font-size: 0.82rem; font-weight: 600; padding: 8px 18px; }
.inv-section-card { border: 1px solid #E8EAF0; border-radius: 10px; box-shadow: 0 1px 3px rgba(0,0,0,0.06); background: #fff; }
.set-card-header { padding: 14px 20px; font-size: 0.85rem; font-weight: 700; color: #1e293b; border-bottom: 1px solid #E8EAF0; background: #F8F9FC; display: flex; align-items: center; }
.set-card-body   { padding: 16px 20px; }
.set-desc   { font-size: 0.78rem; color: #64748b; margin-top: 8px; margin-bottom: 0; line-height: 1.5; }
.set-avatar { width: 44px; height: 44px; border-radius: 10px; background: linear-gradient(135deg,#CD0000,#e53333); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 1.1rem; }
.set-add-btn { height: 38px; padding: 0 14px; border-radius: 0 6px 6px 0; font-size: 0.85rem; }
.set-tag { font-size: 0.78rem; font-weight: 600; padding: 4px 10px; border-radius: 20px; background: rgba(205,0,0,0.08); color: #CD0000; display: inline-flex; align-items: center; gap: 4px; }
.set-tag .del-btn { color: #dc2626; cursor: pointer; font-size: 0.65rem; opacity: 0.7; transition: opacity 0.15s; }
.set-tag .del-btn:hover { opacity: 1; }
/* ── Badge utilities ── */
.badge-pill  { font-weight: 600; padding: 3px 10px; border-radius: 20px; font-size: 0.72rem; }
.badge-green { background: rgba(16,185,129,0.1); color: #059669; }
.badge-red   { background: rgba(239,68,68,0.1);   color: #dc2626; }
.badge-blue  { background: rgba(205,0,0,0.1);      color: #CD0000; }
.badge-gray   { background: rgba(100,116,139,0.1);  color: #64748b; }
.badge-orange  { background: rgba(249,115,22,0.1);   color: #ea580c; }
.badge-purple  { background: rgba(124,58,237,0.1);   color: #7c3aed; }
/* ── User avatar ── */
.user-avatar { width: 32px; height: 32px; border-radius: 8px; background: linear-gradient(135deg,#CD0000,#e53333); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 0.8rem; margin-right: 10px; flex-shrink: 0; }
/* ── Password eye toggle ── */
.pm-eye-btn { height: 38px !important; width: 40px; border: 1px solid #DDE1EC !important; border-left: none !important; border-radius: 0 6px 6px 0 !important; background: #fff !important; color: #6B7280; padding: 0; display: flex; align-items: center; justify-content: center; transition: color 0.15s; }
.pm-eye-btn:hover { color: #CD0000 !important; background: #F5F7FF !important; }
/* ── Account Mappings page ── */
.map-key { font-size: 0.78rem; font-weight: 700; color: #CD0000; font-family: monospace; }
.map-desc { font-size: 0.8rem; color: #64748b; }
.map-section-row td { background: #F8F9FC; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: #94a3b8; padding: 8px 14px !important; }
.map-th-account { min-width: 280px; }
/* ── Settings — Bulk Uploader ── */
.bk-dot { display: flex; flex-direction: column; align-items: center; position: relative; flex-shrink: 0; }
.bk-dot span { width: 34px; height: 34px; border-radius: 50%; background: #E8EAF0; color: #94a3b8; font-weight: 700; font-size: 0.82rem; display: flex; align-items: center; justify-content: center; border: 2px solid #E8EAF0; transition: all 0.3s; }
.bk-dot-lbl { font-size: 0.7rem; font-weight: 600; color: #94a3b8; margin-top: 6px; white-space: nowrap; transition: color 0.3s; }
.bk-dot.active span { background: #CD0000; color: #fff; border-color: #CD0000; box-shadow: 0 0 0 4px rgba(205,0,0,0.12); }
.bk-dot.active .bk-dot-lbl { color: #CD0000; }
.bk-dot.done span { background: #059669; color: #fff; border-color: #059669; }
.bk-dot.done .bk-dot-lbl { color: #059669; }
.bk-line { flex: 1; height: 2px; background: #E8EAF0; margin: 0 6px; margin-bottom: 20px; transition: background 0.3s; }
.bk-line.done { background: #059669; }
.bk-type-card { border: 2px solid #E8EAF0; border-radius: 12px; padding: 24px 20px; text-align: center; cursor: pointer; transition: all 0.2s; background: #fff; }
.bk-type-card:hover { border-color: #CD0000; background: #F5F7FF; transform: translateY(-2px); box-shadow: 0 4px 16px rgba(205,0,0,0.1); }
.bk-type-icon  { font-size: 2.2rem; display: block; margin-bottom: 10px; }
.bk-type-title { font-size: 0.95rem; font-weight: 700; color: #1e293b; margin-bottom: 6px; }
.bk-type-desc  { font-size: 0.78rem; color: #64748b; line-height: 1.5; }
.bk-drop-zone { border: 2px dashed #DDE1EC; border-radius: 12px; padding: 48px 24px; text-align: center; cursor: pointer; transition: all 0.2s; background: #FAFBFC; }
.bk-drop-zone:hover, .bk-drop-zone.bk-drag-over { border-color: #CD0000; background: #F5F7FF; }
.bk-back-btn { background: none; border: 1px solid #DDE1EC; border-radius: 7px; padding: 7px 16px; font-size: 0.82rem; font-weight: 600; color: #64748b; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.bk-back-btn:hover { border-color: #CD0000; color: #CD0000; }
.bk-th { font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: #64748b; padding: 10px 14px !important; border-bottom: 1px solid #E8EAF0; background: #F8F9FC; }
.inv-stat-cell { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-right: 1px solid #F0F2F8; border-bottom: 1px solid #F0F2F8; position: relative; }
.inv-stat-cell::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; }
.inv-stat-blue::before { background: #CD0000; }
.inv-stat-green::before { background: #10B981; }
.inv-stat-red::before { background: #EF4444; }
.inv-stat-orange::before { background: #F59E0B; }
.inv-stat-icon-sm { width: 38px; height: 38px; border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 18px; }
.inv-stat-blue .inv-stat-icon-sm { background: rgba(205,0,0,0.08); color: #CD0000; }
.inv-stat-green .inv-stat-icon-sm { background: rgba(16,185,129,0.08); color: #10B981; }
.inv-stat-red .inv-stat-icon-sm { background: rgba(239,68,68,0.08); color: #EF4444; }
.inv-stat-orange .inv-stat-icon-sm { background: rgba(245,158,11,0.08); color: #F59E0B; }
.inv-stat-label { font-size: 0.68rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: #64748b; margin-bottom: 2px; }
.inv-stat-value { font-size: 1.75rem; font-weight: 700; line-height: 1.1; color: #1e293b; }
.inv-filter-body { padding: 12px 16px !important; }
.inv-input { height: 36px !important; font-size: 0.85rem !important; border: 1px solid #DDE1EC !important; border-radius: 6px !important; transition: all 0.2s ease; }
.inv-input:focus { border-color: var(--erp-primary) !important; box-shadow: 0 0 0 3px rgba(205,0,0,0.08) !important; }
.inv-toggle-label { font-size: 0.82rem; font-weight: 500; color: #64748b; }
.inv-toggle { width: 2.2em !important; height: 1.2em !important; cursor: pointer; }
.inv-toggle:checked { background-color: #f59e0b; border-color: #f59e0b; }
.inv-cols-btn { font-size: 0.8rem; border: 1px solid #DDE1EC; }
.inv-toolbar-group { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.inv-icon-btn { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 1px solid #DDE1EC; border-radius: 8px; background: #fff; color: #4B5563; font-size: 1.1rem; cursor: pointer; transition: background 0.15s, color 0.15s, border-color 0.15s; }
.inv-icon-btn:hover { background: #F3F4F6; border-color: #9CA3AF; color: #1F2937; }
.inv-icon-btn.active, .inv-icon-btn[aria-expanded="true"] { background: #CD0000; border-color: #CD0000; color: #fff; }
.inv-cols-menu { min-width: 220px; padding: 8px 12px; font-size: 0.82rem; }
.inv-cols-empty { font-size: 0.78rem; padding: 4px 0; }
.inv-cols-label { display: flex; align-items: center; gap: 8px; cursor: pointer; padding: 3px 0; }
.inv-dyn-filter-select { min-width: 140px; max-width: 180px; }
.inv-dyn-filter-input  { min-width: 140px; max-width: 200px; }
.inv-table-card { overflow: hidden; }
.inv-table thead { background: #F8F9FC; }
.inv-th { font-size: 0.8rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: #64748b; border-bottom: 2px solid #E8EAF0 !important; white-space: nowrap; padding: 10px 14px !important; }
.inv-table tbody tr { transition: background-color 0.15s ease; }
.inv-table tbody tr:hover { background-color: #F5F7FF !important; }
.inv-table tbody td { padding: 10px 14px !important; vertical-align: middle; border-bottom: 1px solid #F0F2F8 !important; border-top: none !important; }
.inv-row-outofstock { background-color: #FFF8F8 !important; border-left: 3px solid #FF4D4F; }
.inv-row-outofstock:hover { background-color: #FFF0F0 !important; }
.inv-row-lowstock { background-color: #FFFDF5 !important; border-left: 3px solid #fcd34d; }
.inv-row-lowstock:hover { background-color: #FFF9E6 !important; }
.inv-sku { font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace; font-size: 0.75rem; font-weight: 500; color: #CD0000; background: #EEF0F8; padding: 2px 8px; border-radius: 4px; display: inline-block; }
.inv-product-name { font-size: 0.88rem; color: #1e293b; }
.inv-category-text { font-size: 0.82rem; color: #64748b; }
.inv-cost { font-size: 0.82rem; color: #475569; }
.inv-price { font-size: 0.85rem; color: #1e293b; }
.inv-stock-num { font-size: 0.88rem; }
.inv-reorder-num { font-size: 0.85rem; color: #64748b; }
.badge-type-product { background: transparent; color: #2563eb; font-weight: 600; padding: 3px 10px; border-radius: 20px; font-size: 0.72rem; border: 1px solid #2563eb; }
.badge-type-service { background: transparent; color: #7c3aed; font-weight: 600; padding: 3px 10px; border-radius: 20px; font-size: 0.72rem; border: 1px solid #7c3aed; }
.badge-type-noninventory { background: transparent; color: #0891b2; font-weight: 600; padding: 3px 10px; border-radius: 20px; font-size: 0.72rem; border: 1px solid #0891b2; }
.badge-status { font-weight: 600; padding: 3px 10px; border-radius: 20px; font-size: 0.72rem; letter-spacing: 0.03em; }
.badge-status-instock { background: rgba(16,185,129,0.1); color: #059669; }
.badge-status-outofstock { background: rgba(239,68,68,0.1); color: #dc2626; }
.badge-status-noninventory { background: rgba(8,145,178,0.1); color: #0e7490; }
.badge-status-lowstock { background: rgba(245,158,11,0.1); color: #d97706; }
.badge-status-service { background: rgba(100,116,139,0.1); color: #64748b; }
.inv-action-btn { width: 28px; height: 28px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; border: none; background: transparent; color: #64748b; transition: all 0.15s ease; padding: 0; font-size: 15px; }
.inv-action-btn:hover { color: #CD0000; background: #EEF0F8; }
.inv-action-btn.inv-action-warn:hover    { color: #f59e0b; background: rgba(245,158,11,0.08); }
.inv-action-btn.inv-action-danger:hover  { color: #dc2626; background: rgba(220,38,38,0.08); }
.inv-action-btn.inv-action-success:hover { color: #10B981; background: rgba(16,185,129,0.08); }
/* ── Role Management — permission matrix ── */
.perm-section-title { font-size: 0.82rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #374151; margin-bottom: 12px; }
.perm-table thead   { background: #F0F2FF; }
.perm-th            { font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: #CD0000; padding: 8px 12px !important; border-bottom: 1px solid #DDE1EC !important; }
.perm-table tbody td { padding: 8px 12px !important; vertical-align: middle; border-bottom: 1px solid #F0F2F8 !important; }
.inv-chk-col { display: none; }
.inv-select-active .inv-chk-col { display: table-cell; }
.inv-chk { width: 15px; height: 15px; cursor: pointer; accent-color: #CD0000; vertical-align: middle; }
#inv-sel-toggle-btn { transition: all 0.15s; }
#inv-sel-toggle-btn.active { background: #CD0000 !important; color: #fff !important; border-color: #CD0000 !important; }
.inv-bulk-bar { background: #EEF0FF; border: 1px solid #C5CAE9; border-radius: 8px; padding: 10px 18px; display: flex; align-items: center; }
.inv-bulk-count { font-size: 0.85rem; font-weight: 600; color: #CD0000; }
.inv-bulk-del-btn { background: linear-gradient(135deg,#dc2626,#ef4444); border: none; border-radius: 7px; padding: 7px 16px; font-size: 0.82rem; font-weight: 600; color: #fff; cursor: pointer; transition: opacity 0.15s; }
.inv-bulk-del-btn:hover { opacity: 0.88; }
.inv-bulk-clear-btn { background: none; border: 1px solid #DDE1EC; border-radius: 7px; padding: 7px 14px; font-size: 0.82rem; font-weight: 600; color: #64748b; cursor: pointer; transition: all 0.15s; }
.inv-bulk-clear-btn:hover { border-color: #94a3b8; color: #1e293b; }
.inv-table-footer { background: #fff; border-top: 1px solid #E8EAF0; padding: 10px 16px; }
.pagination .page-link { border-radius: 6px !important; margin: 0 2px; border: 1px solid #E8EAF0; color: #64748b; font-weight: 500; font-size: 0.8rem; min-width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; padding: 0 8px; text-align: center; transition: all 0.15s ease; }
.pagination .page-item.active .page-link { background: #CD0000; border-color: #CD0000; color: #fff; box-shadow: 0 1px 3px rgba(205,0,0,0.3); }
.pagination .page-link:hover { background: #F5F6FA; border-color: #DDE1EC; color: #1e293b; }
.cursor-pointer { cursor: pointer; }
/* ── Sales / Purchases — badges, IDs, expand rows ── */
.pg-badge          { font-size: 0.72rem; font-weight: 600; padding: 3px 10px; border-radius: 20px; letter-spacing: 0.03em; }
.pg-badge-cash     { background: rgba(205,0,0,0.08);     color: #CD0000; }
.pg-badge-credit   { background: rgba(139,92,246,0.08);  color: #7c3aed; }
.pg-badge-completed{ background: rgba(16,185,129,0.1);   color: #059669; }
.pg-badge-returned { background: rgba(239,68,68,0.1);    color: #dc2626; }
.pg-badge-draft    { background: rgba(245,158,11,0.1);   color: #D97706; }
.pg-badge-partial  { background: rgba(59,130,246,0.1);   color: #2563EB; }
.pg-badge-received { background: rgba(16,185,129,0.1);   color: #059669; }
.pg-id { font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace; font-size: 0.75rem; font-weight: 500; color: #e53333; background: #EEF0F8; padding: 2px 8px; border-radius: 4px; }
.expand-row            { background: #FAFBFD !important; }
.expand-row:hover      { background: #FAFBFD !important; }
.expand-row td         { border-bottom: 1px solid #E8EAF0 !important; }
.expand-row .table th  { font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: #64748b; background: #F8F9FC; padding: 8px 12px; border-bottom: 1px solid #E8EAF0; }
.expand-row .table td  { font-size: 0.82rem; padding: 8px 12px; border-bottom: 1px solid #F0F2F8; }
@media print { .no-print { display: none !important; } }
.pm-modal-content { border-radius: 12px; overflow: hidden; border: none; box-shadow: 0 20px 60px rgba(0,0,0,0.15); }
/* SDD inside modal needs visible overflow so the dropdown panel isn't clipped */
.pm-modal-content.sdd-overflow { overflow: visible !important; }
.pm-modal-content.sdd-overflow .pm-modal-header { border-radius: 12px 12px 0 0; overflow: hidden; }
.pm-modal-header { background: #CD0000; padding: 16px 24px; border-bottom: none; }
.pm-modal-title { font-size: 1rem; font-weight: 700; color: #fff; }
.pm-modal-close { background: none; border: none; color: #fff; font-size: 1.4rem; line-height: 1; opacity: 0.8; transition: opacity 0.15s ease; padding: 0; cursor: pointer; }
.pm-modal-close:hover { opacity: 1; }
.pm-modal-body { background: #F8F9FC; padding: 24px; }
.pm-field-row { margin-bottom: 16px; }
.pm-field-row:last-child { margin-bottom: 0; }
.pm-label { display: block; font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: #6B7280; margin-bottom: 6px; }
.pm-input { height: 38px !important; border-radius: 7px !important; border: 1px solid #DDE1EC !important; background: #FFFFFF !important; font-size: 0.875rem !important; font-weight: 500 !important; color: #1A1D2E !important; transition: border-color 0.15s ease, box-shadow 0.15s ease; }
.pm-input::placeholder { color: #B0B7C9 !important; font-weight: 400 !important; }
.pm-input:focus { border-color: #CD0000 !important; box-shadow: 0 0 0 3px rgba(205,0,0,0.12) !important; }
.pm-textarea { height: auto !important; }
.pm-prefix { background: #F0F2F8; border: 1px solid #DDE1EC; border-right: none; font-size: 0.8rem; color: #6B7280; border-radius: 7px 0 0 7px; height: 38px; display: flex; align-items: center; padding: 0 10px; }
.pm-prefix + .pm-input { border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important; }
.pm-modal-footer { background: #FFFFFF; border-top: 1px solid #E8EAF0; padding: 14px 24px; display: flex; justify-content: flex-end; gap: 10px; }
.pm-btn-cancel { background: none; border: none; color: #6B7280; font-size: 0.875rem; font-weight: 500; padding: 9px 16px; cursor: pointer; transition: color 0.15s ease; }
.pm-btn-cancel:hover { color: #1A1D2E; }
.pm-btn-save { background: #CD0000; border: none; border-radius: 7px; padding: 9px 22px; font-size: 0.875rem; font-weight: 600; color: #fff; cursor: pointer; transition: transform 0.15s ease, box-shadow 0.15s ease; }
.pm-btn-save:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(91,108,249,0.35); }
.ms-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.45); z-index: 9999; display: flex; align-items: center; justify-content: center; }
.ms-box { background: #fff; border-radius: 14px; width: 100%; max-width: 360px; box-shadow: 0 20px 60px rgba(0,0,0,0.18); overflow: hidden; animation: msIn .18s ease; }
@keyframes msIn { from { transform: scale(0.92); opacity: 0; } to { transform: scale(1); opacity: 1; } }
.ms-body { padding: 28px 28px 20px; text-align: center; }
.ms-icon { width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto; font-size: 1.6rem; }
.ms-icon-confirm { background: #EEF2FF; color: #CD0000; }
.ms-icon-success { background: #ECFDF5; color: #10B981; }
.ms-icon-error   { background: rgba(234,88,12,0.1);  color: #ea580c; }
.ms-icon-warning { background: #FFF7ED; color: #F59E0B; }
.ms-icon-danger  { background: #FFF1F2; color: #E11D48; }
.ms-icon-primary { background: #EEF2FF; color: #CD0000; }
.ms-title { font-size: 1rem; font-weight: 700; color: #111827; margin: 14px 0 6px; }
.ms-sub { font-size: 0.83rem; color: #6B7280; margin: 0; }
.ms-footer { padding: 16px 24px; display: flex; gap: 10px; justify-content: flex-end; border-top: 1px solid #F3F4F6; }
.ms-btn-cancel { height: 36px; padding: 0 18px; border: 1px solid #DDE1EC; border-radius: 7px; background: #fff; color: #374151; font-size: 0.83rem; font-weight: 600; cursor: pointer; }
.ms-btn-confirm { height: 36px; padding: 0 18px; border: none; border-radius: 7px; background: #CD0000; color: #fff; font-size: 0.83rem; font-weight: 600; cursor: pointer; }
.ms-btn-ok { height: 36px; padding: 0 28px; border: none; border-radius: 7px; background: linear-gradient(135deg,#10B981,#34D399); color: #fff; font-size: 0.83rem; font-weight: 600; cursor: pointer; }
.pm-acct-wrap { border-top: 1px dashed #DDE1EC; margin-top: 14px; padding-top: 4px; }
.pm-acct-toggle { width: 100%; display: flex; align-items: center; justify-content: space-between; background: none; border: none; padding: 8px 2px; font-size: 0.8rem; font-weight: 600; color: #CD0000; cursor: pointer; text-align: left; letter-spacing: 0.02em; transition: color 0.15s; }
.pm-acct-toggle:hover { color: #2a3bb0; }
.pm-acct-toggle .ti-chevron-down { transition: transform 0.2s; font-size: 0.85rem; }
.pm-acct-toggle.open .ti-chevron-down { transform: rotate(180deg); }
.pm-acct-body { padding: 10px 0 4px; }
.uom-mult-edit-wrap { display: inline-flex; align-items: center; gap: 4px; }

/* ── Job Card Module ────────────────────────────────────────────────────── */

.jc-page-wrap { display: flex; flex-direction: column; height: calc(100vh - 60px); gap: 0; }
.jc-page-wrap > .inv-header-card { flex-shrink: 0; border-radius: 0 !important; }
.jc-page-wrap > .jc-tab-bar      { flex-shrink: 0; }
#jc-panel-wrap                    { flex: 1; overflow: hidden; display: flex; flex-direction: column; }

/* Tab Bar */
.jc-tab-bar {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 8px 16px;
    background: #fff;
    border-bottom: 1px solid var(--erp-border);
    overflow-x: auto;
    flex-shrink: 0;
    min-height: 46px;
}
.jc-tab {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px 14px;
    border: 1px solid var(--erp-border-light);
    border-radius: var(--erp-radius-sm);
    background: var(--erp-bg-light);
    font-size: 0.8125rem;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s, border-color 0.15s;
    color: var(--erp-text-dark);
}
.jc-tab:hover { background: #eef0fb; border-color: var(--erp-primary); color: var(--erp-primary); }
.jc-tab.active { background: var(--erp-primary); color: #fff; border-color: var(--erp-primary); }
.jc-tab-close { opacity: 0.55; font-size: 0.75rem; cursor: pointer; margin-left: 2px; }
.jc-tab-close:hover { opacity: 1; }

/* Card Panel */
.jc-panel { display: flex; gap: 14px; flex: 1; overflow: hidden; padding: 14px 16px; }
.jc-left  { flex: 0 0 55%; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; }
.jc-right { flex: 0 0 45%; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; }

/* Section cards — match inv-section-card style */
.jc-header-card,
.jc-items-card,
.jc-totals-card {
    background: #fff;
    border: 1px solid var(--erp-border);
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    padding: 14px 16px;
}
.jc-section-title {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--erp-text-muted);
    margin-bottom: 12px;
}

/* Items table — matches inv-table style */
.jc-search-row { margin-bottom: 10px; }
.jc-items-table { width: 100%; font-size: 0.8125rem; border-collapse: collapse; }
.jc-items-table thead { background: var(--erp-bg-light); }
.jc-items-table th { font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--erp-text-muted); padding: 8px 10px; border-bottom: 2px solid var(--erp-border); white-space: nowrap; }
.jc-items-table td { padding: 8px 10px; border-bottom: 1px solid var(--erp-border-light); vertical-align: middle; }
.jc-items-table tbody tr:hover { background: #F5F7FF; }
.jc-remove-btn { background: none; border: none; color: var(--erp-danger-light); cursor: pointer; padding: 2px 5px; border-radius: 4px; transition: background 0.12s; }
.jc-remove-btn:hover { background: #fff0f0; color: var(--erp-danger); }

/* Totals */
.jc-total-row { display: flex; justify-content: space-between; align-items: center; font-size: 0.875rem; margin-bottom: 7px; color: var(--erp-text-dark); }
.jc-total-row.grand { font-weight: 700; font-size: 1rem; border-top: 2px solid var(--erp-border); padding-top: 10px; margin-top: 6px; color: var(--erp-primary); }

/* Payment method toggle */
.jc-payment-btns { display: flex; gap: 6px; margin: 10px 0 4px; }
.jc-payment-btn { flex: 1; padding: 7px; border: 1px solid var(--erp-border-light); border-radius: var(--erp-radius-sm); background: var(--erp-bg-light); font-size: 0.82rem; font-weight: 500; cursor: pointer; transition: all 0.15s; color: var(--erp-text-dark); }
.jc-payment-btn:hover { border-color: var(--erp-primary); color: var(--erp-primary); }
.jc-payment-btn.active { background: var(--erp-primary); color: #fff; border-color: var(--erp-primary); font-weight: 600; }

/* Action buttons — use app gradient style */
.jc-finalize-btn {
    width: 100%; padding: 10px; border: none; border-radius: var(--erp-radius-sm);
    background: linear-gradient(135deg, var(--erp-success), var(--erp-success-dark));
    color: #fff; font-weight: 600; font-size: 0.875rem; cursor: pointer; margin-top: 4px;
    transition: opacity 0.15s, transform 0.15s;
}
.jc-finalize-btn:hover { opacity: 0.92; transform: translateY(-1px); }
.jc-print-btn {
    width: 100%; padding: 8px; border: none; border-radius: var(--erp-radius-sm);
    background: linear-gradient(135deg, var(--erp-primary), var(--erp-primary-light));
    color: #fff; font-size: 0.875rem; cursor: pointer; margin-top: 4px;
    transition: opacity 0.15s;
}
.jc-print-btn:hover { opacity: 0.9; }
.jc-discard-btn {
    width: 100%; padding: 8px; background: transparent; font-size: 0.875rem;
    color: var(--erp-danger); border: 1px solid var(--erp-danger-light);
    border-radius: var(--erp-radius-sm); cursor: pointer; margin-top: 4px;
    transition: background 0.15s;
}
.jc-discard-btn:hover { background: #fff5f5; }

/* Empty state */
.jc-empty-state {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    flex: 1; color: var(--erp-text-muted); gap: 14px; padding: 60px 40px; text-align: center;
}
.jc-empty-state i { font-size: 3.5rem; opacity: 0.2; }
.jc-empty-state p { font-size: 0.9rem; margin: 0; }

/* ── Print Layout ────────────────────────────────────────────────────────── */
@media print {
    .navbar-vertical,
    .jc-tab-bar,
    .jc-right,
    .navbar,
    .inv-header-card,
    [data-nav-mode="pos"],
    [data-nav-mode="job-card"] { display: none !important; }

    .jc-panel { display: block; padding: 0; }
    .jc-left  { overflow: visible; }

    .jc-print-header { display: block !important; margin-bottom: 16px; }
    .jc-items-table td,
    .jc-items-table th { padding: 4px 6px; font-size: 11pt; }

    body { background: #fff; }
    .card { border: none; box-shadow: none; }
}
.jc-print-header { display: none; }

/* ── Login Page ──────────────────────────────────────────────────────────── */
.page.page-center{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#7a0000 0%,#CD0000 50%,#e53333 100%);position:relative;overflow:hidden;}
.page.page-center::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(239,237,230,0.20) 1px,transparent 1px);background-size:24px 24px;pointer-events:none;}
.page.page-center::after{content:'';position:absolute;top:-15%;right:-8%;width:480px;height:480px;background:rgba(255,255,255,0.05);border-radius:50%;pointer-events:none;}
.login-wrap{width:100%;max-width:420px;padding:24px;position:relative;z-index:1;}
.login-card{background:#EFEDE6;border-radius:8px;overflow:hidden;box-shadow:0 32px 80px rgba(0,0,0,0.35),0 0 0 1px rgba(255,255,255,0.08);}
.login-header{background:#EFEDE6;padding:12px 32px 0px;text-align:center;}
.login-logo-wrap{display:flex;align-items:center;justify-content:center;}
.login-logo-img{max-height:180px;max-width:380px;width:auto;object-fit:contain;}
.login-body{padding:8px 32px 16px;background:#EFEDE6;}
.login-welcome{margin-bottom:16px;}
.login-heading{font-size:1.125rem;font-weight:700;color:#1e293b;margin:0 0 8px;font-family:'Inter',sans-serif;}
.login-subheading{font-size:0.875rem;color:#94a3b8;margin:0;}
.login-error-box{border-radius:8px;font-size:0.875rem;padding:8px 16px;margin-bottom:24px;background:rgba(239,68,68,0.08);border:1px solid rgba(239,68,68,0.2);color:#dc2626;display:flex;align-items:center;}/* Body Small */
.login-field{margin-bottom:10px;}
.login-label{display:block;font-size:0.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:#64748b;margin-bottom:8px;}
.login-input-wrap{position:relative;display:flex;align-items:center;}
.login-input-icon{position:absolute;left:16px;color:#94a3b8;font-size:1rem;pointer-events:none;display:flex;align-items:center;z-index:1;}
.login-input{width:100%;height:48px;padding:0 48px 0 40px;border:1.5px solid #d4d0c9;border-radius:8px;font-size:0.875rem;color:#1e293b;background:#EFEDE6;transition:all 0.2s;outline:none;font-family:'Inter',sans-serif;}
.login-input:focus{border-color:#CD0000;background:#EFEDE6;box-shadow:0 0 0 3px rgba(205,0,0,0.1);}
.login-input::placeholder{color:#CBD5E1;}
.login-input:-webkit-autofill,.login-input:-webkit-autofill:hover,.login-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0px 1000px #EFEDE6 inset;-webkit-text-fill-color:#1e293b;}
.login-toggle-pass{position:absolute;right:16px;background:none;border:none;color:#94a3b8;cursor:pointer;padding:8px;display:flex;align-items:center;font-size:1rem;transition:color 0.15s;}
.login-toggle-pass:hover{color:#CD0000;}
.login-btn{width:100%;height:48px;border:none;border-radius:8px;background:linear-gradient(135deg,#CD0000 0%,#e53333 100%);color:#EFEDE6;font-size:0.875rem;font-weight:700;cursor:pointer;margin-top:8px;display:flex;align-items:center;justify-content:center;font-family:'Inter',sans-serif;letter-spacing:0.02em;transition:transform 0.15s,box-shadow 0.15s;box-shadow:0 4px 15px rgba(205,0,0,0.35);}
.login-btn:hover{transform:translateY(-1px);box-shadow:0 6px 22px rgba(205,0,0,0.45);}
.login-btn:active{transform:translateY(0);}
.login-btn:disabled{opacity:0.75;cursor:not-allowed;transform:none;}
.login-footer{padding:10px 32px;background:#EFEDE6;border-top:1px solid #d4d0c9;text-align:center;font-size:0.75rem;color:#94a3b8;}
.login-footer strong{color:#64748b;}

/* ─── Reports Page ────────────────────────────────── */
/* Tab navigation */
.inv-tab-header { padding: 0 16px; border-bottom: 2px solid #E8EAF0; background: #F8F9FC; }
.inv-nav-tabs   { border: none; gap: 4px; }
.inv-nav-link   { font-size: 0.82rem; font-weight: 600; color: #64748b; padding: 12px 16px !important; border: none !important; border-bottom: 2px solid transparent !important; margin-bottom: -2px; border-radius: 0 !important; background: none !important; transition: all 0.2s; }
.inv-nav-link.active               { color: #CD0000 !important; border-bottom-color: #CD0000 !important; }
.inv-nav-link:hover:not(.active)   { color: #374151; border-bottom-color: #DDE1EC !important; }

/* Filter bar + run button */
.rpt-filter-bar { padding: 14px 16px; background: #F8F9FC; border-bottom: 1px solid #E8EAF0; }
.rpt-btn        { height: 36px; padding: 0 14px; font-size: 0.82rem; font-weight: 600; border-radius: 6px; }

/* Chart & KPI */
.rpt-chart-container { padding: 16px; height: 300px; }
.rpt-kpi-bar    { display: flex; flex-wrap: wrap; gap: 12px; padding: 16px; }
.rpt-kpi-card   { flex: 1; min-width: 160px; background: #fff; border: 1px solid #E8EAF0; border-radius: 10px; padding: 16px 18px; }
.rpt-kpi-label  { font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: #64748b; margin-bottom: 6px; }
.rpt-kpi-value  { font-size: 1.3rem; font-weight: 700; color: #1e293b; }

/* Compact table variant */
.rpt-compact-table             { font-size: 0.75rem !important; }
.rpt-compact-table thead th    { font-size: 0.68rem !important; padding: 7px 10px !important; }
.rpt-compact-table tbody td    { font-size: 0.75rem !important; padding: 5px 10px !important; }
.rpt-compact-table tfoot td    { font-size: 0.75rem !important; padding: 6px 10px !important; }

/* Table footer totals row */
.inv-table tfoot td { padding: 10px 14px !important; font-weight: 700; background: #F8F9FC !important; border-top: 2px solid #E8EAF0 !important; }

/* Report tiles grid */
.rpt-tiles-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.rpt-tile       { display: flex; align-items: center; gap: 16px; padding: 16px 18px; background: #fff; border: 1px solid #E8EAF0; border-radius: 10px; cursor: pointer; transition: all 0.18s; box-shadow: 0 1px 3px rgba(0,0,0,0.04); }
.rpt-tile:hover { border-color: #CD0000; box-shadow: 0 4px 12px rgba(205,0,0,0.12); transform: translateY(-1px); }
.rpt-tile-icon  { width: 46px; height: 46px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 1.4rem; flex-shrink: 0; }
.rpt-tile-body  { flex: 1; }
.rpt-tile-name  { font-size: 0.92rem; font-weight: 700; color: #1A1D2E; margin-bottom: 2px; }
.rpt-tile-desc  { font-size: 0.78rem; color: #64748b; }
.rpt-tile-arrow { color: #CBD5E1; font-size: 1rem; flex-shrink: 0; }
.rpt-tile:hover .rpt-tile-arrow { color: #CD0000; }

/* Report panel header */
.rpt-report-header { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid #E8EAF0; background: #F8F9FC; }
.rpt-report-title  { font-size: 1rem; font-weight: 700; color: #1A1D2E; flex: 1; }
.rpt-export-btn    { font-size: 0.78rem; font-weight: 600; padding: 5px 12px; border-radius: 6px; border: none; }
.rpt-excel-btn     { background: #E8F5E9; color: #1B5E20; }
.rpt-excel-btn:hover { background: #C8E6C9; color: #1B5E20; }
.rpt-pdf-btn       { background: #FFEBEE; color: #B71C1C; }
.rpt-pdf-btn:hover { background: #FFCDD2; color: #B71C1C; }

/* Summary bar (shared across all report panels) */
.rpt-summary-bar { display: flex; gap: 24px; padding: 12px 16px; background: #F8F9FC; border-top: 2px solid #E8EAF0; font-size: 0.82rem; color: #374151; }
.rpt-summary-bar span b { color: #1A1D2E; }

/* Grouped report row styles */
.rpt-sales-inv-row td  { background: #F0F4FF !important; border-top: 2px solid #DDE1EC !important; }
.rpt-sales-item-row td { padding-top: 7px !important; padding-bottom: 7px !important; background: #fff !important; }
.rpt-purch-inv-row td  { background: #F5F3FF !important; border-top: 2px solid #E9D5FF !important; }
.rpt-purch-item-row td { padding-top: 7px !important; padding-bottom: 7px !important; background: #fff !important; }

/* Inline badges */
.rpt-badge        { display: inline-block; font-size: 0.65rem; font-weight: 600; padding: 1px 6px; border-radius: 4px; margin-left: 4px; vertical-align: middle; }
.rpt-badge-blue   { background: #EEF2FF; color: #CD0000; }
.rpt-badge-red    { background: #FEE2E2; color: #DC2626; }
.rpt-badge-amber  { background: #FEF3C7; color: #D97706; }
.rpt-badge-green  { background: #DCFCE7; color: #15803D; }
.rpt-badge-grey   { background: #F1F5F9; color: #475569; }

/* Print header */
.rpt-print-top     { padding: 0 0 14px; border-bottom: 2px solid #000; margin-bottom: 14px; text-align: center; }
.rpt-print-company { font-size: 1.6rem; font-weight: 800; color: #000; text-transform: uppercase; letter-spacing: 0.04em; line-height: 1.2; }
.rpt-print-title   { font-size: 0.9rem; font-weight: 600; color: #000; margin-top: 6px; text-transform: uppercase; letter-spacing: 0.1em; border-top: 1px solid #000; padding-top: 6px; display: inline-block; }

/* Reports print overrides */
@media print {
    .inv-tab-header, .rpt-filter-bar, .rpt-report-header, .rpt-tiles-grid, #rpt-tiles-view, .d-print-none { display: none !important; }
    .tab-pane { display: block !important; }
    .inv-table thead th    { background: #fff !important; color: #000 !important; border-bottom: 2px solid #000 !important; font-weight: 700 !important; }
    .inv-table tbody td    { color: #000 !important; background: #fff !important; }
    .inv-table tbody tr:hover td { background: #fff !important; }
    .inv-table tbody tr    { border-bottom: 1px solid #ddd !important; }
    .rpt-sales-inv-row td, .rpt-purch-inv-row td { background: #f8f8f8 !important; font-weight: 600 !important; }
    .rpt-badge-green, .rpt-badge-orange, .rpt-badge-red, .rpt-badge-grey { background: #fff !important; color: #000 !important; border: 1px solid #666 !important; padding: 1px 6px !important; font-size: 0.75rem !important; }
    .rpt-summary-bar { border-top: 2px solid #000 !important; background: #fff !important; color: #000 !important; }
    .rpt-summary-bar span, .rpt-summary-bar b { color: #000 !important; }
    .inv-card, .pm-card { box-shadow: none !important; border: 1px solid #ccc !important; }
    a { color: #000 !important; text-decoration: none !important; }
}

/* P&L / BS panel wrappers */
#rptPlReport    { padding: 16px; }
.rpt-bs-results { padding: 16px; display: flex; flex-direction: column; gap: 16px; }

/* Profit & Loss */
.pl-section-row td   { background: #CD0000; color: #fff; font-weight: 700; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.08em; padding: 10px 14px !important; }
.pl-subtotal-row td  { background: #F0F4FF; font-weight: 700; font-size: 0.85rem; border-top: 1px solid #DDE1EC !important; }
.pl-total-row td     { background: #1e293b; color: #fff; font-weight: 700; font-size: 0.95rem; padding: 12px 14px !important; }
.pl-total-row.profit td { background: #059669; }
.pl-total-row.loss td   { background: #dc2626; }
.pl-sub-type td      { background: #F8F9FC; font-size: 0.78rem; font-weight: 600; color: #64748b; padding: 8px 14px 4px !important; border-bottom: none !important; }

/* Balance Sheet */
.bs-section-row td { background: #F0F4FF; font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: #CD0000; padding: 8px 14px !important; }
.bs-total-row td   { background: #1e293b; color: #fff; font-weight: 700; font-size: 0.9rem; padding: 10px 14px !important; }
.bs-balanced       { background: rgba(5,150,105,0.08); color: #059669; padding: 10px 14px; font-size: 0.85rem; font-weight: 600; border-radius: 6px; display: inline-block; }
.bs-unbalanced     { background: rgba(220,38,38,0.08); color: #dc2626; padding: 10px 14px; font-size: 0.85rem; font-weight: 600; border-radius: 6px; display: inline-block; }

/* ── Payment Modal — SDD Trigger ─────────────────────────────── */
.pm-sdd-trigger { height: 38px; font-size: 0.875rem; font-weight: 500; border: 1px solid #DDE1EC; border-radius: 7px; background: #fff; width: 100%; padding: 0 10px; cursor: pointer; display: flex; align-items: center; justify-content: space-between; transition: border-color 0.15s ease, box-shadow 0.15s ease; color: #1A1D2E; }
.pm-sdd-trigger:hover { border-color: #B0B7C9; }
.sdd-wrap.open .pm-sdd-trigger { border-color: #CD0000; box-shadow: 0 0 0 3px rgba(205,0,0,0.12); }
#paymentModal .pm-modal-content  { overflow: visible !important; }
#paymentModal .pm-modal-header   { border-radius: 12px 12px 0 0; overflow: hidden; }
#productModal .pm-modal-content  { overflow: visible !important; }
#productModal .pm-modal-header   { border-radius: 12px 12px 0 0; overflow: hidden; }
#productModal .pm-modal-footer   { border-radius: 0 0 12px 12px; overflow: hidden; }
#productModal .pm-modal-body     { overflow: visible !important; }
#partyModal .pm-modal-content   { overflow: visible !important; }
#partyModal .pm-modal-header    { border-radius: 12px 12px 0 0; overflow: hidden; }
#partyModal .pm-modal-footer    { border-radius: 0 0 12px 12px; overflow: hidden; }
#partyModal .pm-modal-body      { overflow: visible !important; }

/* ── Cash Reconciliation Modal ───────────────────────────────── */
.cr-modal-content { border-radius: 14px; overflow: hidden; border: none; box-shadow: 0 24px 64px rgba(0,0,0,0.18); }
.cr-modal-header { background: #fff; padding: 18px 22px; border-bottom: 1px solid #E8EAF0; display: flex; align-items: center; justify-content: space-between; }
.cr-header-icon { width: 48px; height: 48px; border-radius: 12px; background: rgba(20,184,166,0.12); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cr-header-title { font-size: 0.95rem; font-weight: 700; color: #14b8a6; letter-spacing: 0.04em; }
.cr-header-date { font-size: 0.78rem; color: #64748b; margin-top: 2px; }
.cr-close-btn { background: none; border: none; font-size: 1.5rem; color: #94a3b8; line-height: 1; cursor: pointer; padding: 0; transition: color 0.15s ease; }
.cr-close-btn:hover { color: #374151; }
.cr-modal-body { background: #F8F9FC; padding: 20px; }
.cr-section { background: #fff; border: 1px solid #E8EAF0; border-radius: 10px; padding: 16px; }
.cr-section-title { font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: #64748b; margin-bottom: 12px; }
.cr-label { display: block; font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: #6B7280; margin-bottom: 5px; }
.cr-input { height: 38px !important; font-size: 0.85rem !important; border: 1px solid #DDE1EC !important; border-radius: 7px !important; background: #fff !important; color: #1A1D2E !important; }
.cr-input:focus { border-color: #14b8a6 !important; box-shadow: 0 0 0 3px rgba(20,184,166,0.12) !important; }
.cr-input[readonly] { background: #F8F9FC !important; color: #64748b !important; }
.cr-expected-row { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; background: #F0FDF9; border-radius: 7px; border: 1px solid #99f6e4; }
.cr-expected-val { font-size: 1rem; font-weight: 700; color: #14b8a6; }
.cr-total-row { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; background: #F8F9FC; border-radius: 7px; border: 1px solid #E8EAF0; }
.cr-total-val { font-size: 1rem; font-weight: 700; color: #1A1D2E; }
.cr-variance-section { background: #FFF5F5 !important; border-color: #FED7D7 !important; }
.cr-variance-section .cr-section-title { color: #DC2626; }
.cr-diff-ok    { color: #059669; }
.cr-diff-short { color: #DC2626; }
.cr-diff-over  { color: #D97706; }
.cr-modal-footer { background: #fff; border-top: 1px solid #E8EAF0; padding: 14px 20px; display: flex; justify-content: flex-end; gap: 10px; }
.cr-btn-cancel { background: none; border: 1px solid #DDE1EC; border-radius: 7px; color: #6B7280; font-size: 0.875rem; font-weight: 500; padding: 9px 18px; cursor: pointer; transition: all 0.15s ease; }
.cr-btn-cancel:hover { border-color: #94a3b8; color: #374151; }
.cr-btn-draft { background: #F8F9FC; border: 1px solid #DDE1EC; border-radius: 7px; color: #374151; font-size: 0.875rem; font-weight: 600; padding: 9px 18px; cursor: pointer; transition: all 0.15s ease; }
.cr-btn-draft:hover { background: #E8EAF0; }
.cr-btn-submit { background: linear-gradient(135deg, #14b8a6, #0d9488); border: none; border-radius: 7px; padding: 9px 22px; font-size: 0.875rem; font-weight: 600; color: #fff; cursor: pointer; transition: transform 0.15s ease, box-shadow 0.15s ease; }
.cr-btn-submit:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(20,184,166,0.4); }

/* ── Party Master (Customer / Vendor) ─────────────────────────────────────── */
.pty-page-wrap { display: flex; flex-direction: column; gap: 16px; }
.pty-header-card { background: linear-gradient(135deg, #CD0000 0%, #e53333 100%); border: none; border-radius: 10px; overflow: hidden; position: relative; }
.pty-header-card::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(255,255,255,0.12) 1px, transparent 1px); background-size: 16px 16px; opacity: 0.5; pointer-events: none; }
.pty-header-card::after { content: ''; position: absolute; top: -40%; right: -8%; width: 260px; height: 260px; background: rgba(255,255,255,0.06); border-radius: 50%; pointer-events: none; }
.pty-header-body { padding: 20px 28px !important; position: relative; z-index: 1; }
.pty-header-card .pty-title { font-size: 1.35rem; font-weight: 700; color: #fff; }
.pty-header-card .pty-subtitle { font-size: 0.82rem; font-weight: 400; color: rgba(255,255,255,0.82); }
.pty-header-card .btn { font-size: 0.82rem; font-weight: 600; padding: 8px 18px; }
.pty-section-card { border: 1px solid #E8EAF0; border-radius: 10px; box-shadow: 0 1px 3px rgba(0,0,0,0.06); background: #fff; }
.pty-filter-body { padding: 12px 16px !important; }
.pty-input { height: 36px !important; font-size: 0.85rem !important; border: 1px solid #DDE1EC !important; border-radius: 6px !important; transition: all 0.2s ease; }
.pty-input:focus { border-color: #CD0000 !important; box-shadow: 0 0 0 3px rgba(205,0,0,0.08) !important; }
.pty-table-card { overflow: hidden; }
.pty-table thead { background: #F8F9FC; }
.pty-th { font-size: 0.8rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: #64748b; border-bottom: 2px solid #E8EAF0 !important; white-space: nowrap; padding: 10px 14px !important; }
.pty-table tbody tr { transition: background-color 0.15s ease; }
.pty-table tbody tr:hover { background-color: #F5F7FF !important; }
.pty-table tbody td { padding: 10px 14px !important; vertical-align: middle; border-bottom: 1px solid #F0F2F8 !important; border-top: none !important; font-size: 0.85rem; color: #1e293b; }
.pty-code { font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace; font-size: 0.75rem; font-weight: 500; color: #e53333; background: #EEF0F8; padding: 2px 8px; border-radius: 4px; display: inline-block; }
.pty-action-btn { width: 28px; height: 28px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; border: none; background: transparent; color: #64748b; transition: all 0.15s ease; padding: 0; font-size: 15px; }
.pty-action-btn:hover { color: #CD0000; background: #EEF0F8; }
.pty-action-btn.pty-action-danger:hover { color: #EF4444; background: rgba(239,68,68,0.08); }
.pty-chk-col { display: none; }
.pty-select-active .pty-chk-col { display: table-cell; }
.pty-chk { width: 15px; height: 15px; cursor: pointer; accent-color: #CD0000; vertical-align: middle; }
#pty-sel-toggle-btn { transition: all 0.15s; }
#pty-sel-toggle-btn.active { background: #CD0000 !important; color: #fff !important; border-color: #CD0000 !important; }
.pty-bulk-bar { background: #EEF0FF; border: 1px solid #C5CAE9; border-radius: 8px; padding: 10px 18px; display: flex; align-items: center; }
.pty-bulk-count { font-size: 0.85rem; font-weight: 600; color: #CD0000; }
.pty-bulk-del-btn { background: linear-gradient(135deg,#dc2626,#ef4444); border: none; border-radius: 7px; padding: 7px 16px; font-size: 0.82rem; font-weight: 600; color: #fff; cursor: pointer; transition: opacity 0.15s; }
.pty-bulk-del-btn:hover { opacity: 0.88; }
.pty-bulk-clear-btn { background: none; border: 1px solid #DDE1EC; border-radius: 7px; padding: 7px 14px; font-size: 0.82rem; font-weight: 600; color: #64748b; cursor: pointer; transition: all 0.15s; }
.pty-bulk-clear-btn:hover { border-color: #94a3b8; color: #1e293b; }
.pty-table-footer { background: #fff; border-top: 1px solid #E8EAF0; padding: 10px 16px; }

/* Sync overlay */
.erp-sync-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
}
.erp-sync-overlay .spinner-border {
    width: 3rem;
    height: 3rem;
}

/* ── Journal Entries Report ──────────────────────────────────────── */
.rpt-tile-icon-journal        { background: #EFF6FF; color: #2563EB; }
.rpt-icon-journal-color       { color: #2563EB; }

/* Entry rows */
.rpt-journal-table .jrn-entry-row td  { background: #F8FAFF; border-top: 2px solid #E8EAF0; font-weight: 600; }
.rpt-journal-table .jrn-line-row  td  { background: #fff; border-top: none; font-size: 0.85rem; }
.rpt-journal-table .jrn-entry-subtotal td { background: #F1F5F9; font-size: 0.78rem; border-top: 1px dashed #CBD5E1; }
.rpt-journal-table .jrn-spacer td     { height: 6px; background: #F8F9FC; border: none; padding: 0 !important; }
.jrn-row-unbalanced td                { background: #FFF5F5 !important; }

/* Entry No cell */
.jrn-entry-no     { font-weight: 700; font-size: 0.82rem; white-space: nowrap; color: #1A1D2E; }
.jrn-entry-no-ref { font-weight: 700; color: #2563EB; font-size: 0.82rem; }

/* Entry description + account */
.jrn-entry-desc   { font-weight: 600; font-size: 0.86rem; color: #1A1D2E; margin-bottom: 2px; }
.jrn-account-name { font-size: 0.8rem; color: #475569; }
.jrn-line-narration { font-size: 0.77rem; color: #64748b; font-style: italic; margin-bottom: 2px; }
.jrn-acc-code     { font-size: 0.72rem; color: #2563EB; background: #EFF6FF; border-radius: 3px; padding: 1px 4px; font-family: monospace; }

/* Ref type + badges */
.jrn-ref-type   { font-size: 0.75rem; color: #64748b; text-transform: capitalize; }
.jrn-badge-posted { background: rgba(5,150,105,0.12); color: #059669; font-size: 0.7rem; font-weight: 600; border-radius: 4px; padding: 2px 8px; }
.jrn-badge-draft  { background: rgba(100,116,139,0.12); color: #64748b; font-size: 0.7rem; font-weight: 600; border-radius: 4px; padding: 2px 8px; }

/* Balance indicators */
.jrn-bal-ok  { color: #059669; font-size: 0.78rem; margin-right: 4px; }
.jrn-bal-err { color: #dc2626; font-size: 0.78rem; margin-right: 4px; }

/* Debit/Credit cells */
.jrn-debit-cell  { font-family: 'Courier New', monospace; font-size: 0.85rem; color: #1e40af; }
.jrn-credit-cell { font-family: 'Courier New', monospace; font-size: 0.85rem; color: #059669; }

/* Doc No + Party */
.jrn-doc-no    { font-size: 0.8rem; font-weight: 600; color: #2563EB; font-family: monospace; }
.jrn-party-name { font-size: 0.8rem; color: #374151; }

/* Grand total balance banner */
.jrn-grand-ok  { background: rgba(5,150,105,0.08); color: #059669; padding: 10px 16px; font-size: 0.85rem; font-weight: 600; border-radius: 8px; border-left: 4px solid #059669; margin: 8px 18px; }
.jrn-grand-err { background: rgba(220,38,38,0.08); color: #dc2626; padding: 10px 16px; font-size: 0.85rem; font-weight: 600; border-radius: 8px; border-left: 4px solid #dc2626; margin: 8px 18px; }

/* Discrepancy box */
.jrn-discrepancy-box   { background: #FFF5F5; border: 1px solid #FECACA; border-radius: 8px; margin: 8px 18px; padding: 12px 16px; }
.jrn-discrepancy-title { font-size: 0.85rem; font-weight: 700; color: #dc2626; margin-bottom: 8px; }
.jrn-discrepancy-list  { display: flex; flex-direction: column; gap: 4px; }
.jrn-discrepancy-item  { font-size: 0.8rem; color: #7f1d1d; padding: 4px 0; border-bottom: 1px dashed #FECACA; }
.jrn-discrepancy-item:last-child { border-bottom: none; }
.jrn-diff-amt { font-weight: 700; color: #dc2626; }

/* Summary bar */
.rpt-summary-bar { padding: 8px 18px; font-size: 0.8rem; color: #64748b; border-top: 1px solid #E8EAF0; }