/* /Components/Layout/MainLayout.razor.rz.scp.css */
#blazor-error-ui[b-f03yspbvk8] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-f03yspbvk8] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.nav-devbanner[b-adtgehls09] {
    padding: 1rem;
    text-align: center;
    flex-shrink: 0;
}

.nav-devbanner a[b-adtgehls09] {
    display: block;
    opacity: 0.75;
    transition: opacity 0.2s ease;
}

.nav-devbanner a:hover[b-adtgehls09] {
    opacity: 1;
}

.nav-devbanner img[b-adtgehls09] {
    width: 100%;
    max-width: 160px;
    height: auto;
    object-fit: contain;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-9vzneuxubq],
.components-reconnect-repeated-attempt-visible[b-9vzneuxubq],
.components-reconnect-failed-visible[b-9vzneuxubq],
.components-pause-visible[b-9vzneuxubq],
.components-resume-failed-visible[b-9vzneuxubq],
.components-rejoining-animation[b-9vzneuxubq] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-9vzneuxubq],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-9vzneuxubq],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-9vzneuxubq],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-9vzneuxubq],
#components-reconnect-modal.components-reconnect-retrying[b-9vzneuxubq],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-9vzneuxubq],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-9vzneuxubq],
#components-reconnect-modal.components-reconnect-failed[b-9vzneuxubq],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-9vzneuxubq] {
    display: block;
}


#components-reconnect-modal[b-9vzneuxubq] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-9vzneuxubq 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-9vzneuxubq 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-9vzneuxubq 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-9vzneuxubq]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-9vzneuxubq 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-9vzneuxubq {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-9vzneuxubq {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-9vzneuxubq {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-9vzneuxubq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-9vzneuxubq] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-9vzneuxubq] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-9vzneuxubq] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-9vzneuxubq] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-9vzneuxubq] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-9vzneuxubq] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-9vzneuxubq 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-9vzneuxubq] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-9vzneuxubq {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/AccountTransferCreate.razor.rz.scp.css */
/* ── Page wrapper ── */
.at-create-page[b-w3d384ncww] {
    max-width: 900px;
    margin: 0 auto;
    padding: 0;
}

/* ── Loading ── */
.loading-container[b-w3d384ncww] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-w3d384ncww] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-w3d384ncww] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* ── Page header ── */
.page-header[b-w3d384ncww] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 2rem;
    background: linear-gradient(135deg, var(--primary-color) 0%, #004999 100%);
    color: white;
    margin: -2rem -2rem 2rem -2rem;
    border-radius: 0 0 1rem 1rem;
}

.btn-back[b-w3d384ncww] {
    background: rgba(255, 255, 255, 0.15);
    border: none;
    color: white;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    font-size: 1.1rem;
    transition: background 0.2s ease;
}

.btn-back:hover[b-w3d384ncww] {
    background: rgba(255, 255, 255, 0.25);
}

.header-icon[b-w3d384ncww] {
    font-size: 2.5rem;
    opacity: 0.9;
    flex-shrink: 0;
}

.page-header .header-text[b-w3d384ncww] {
    flex: 1;
}

.page-header h1[b-w3d384ncww] {
    margin: 0 0 0.2rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: white;
}

.page-header p[b-w3d384ncww] {
    margin: 0;
    opacity: 0.85;
    font-size: 0.95rem;
}

/* ── Alerts ── */
.alert[b-w3d384ncww] {
    border-radius: 0.5rem;
    margin-bottom: 1.25rem;
    font-size: 0.9rem;
}

/* ── Form cards ── */
.form-card[b-w3d384ncww] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.75rem;
    padding: 1.75rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.section-title[b-w3d384ncww] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 1.25rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #e9ecef;
    display: flex;
    align-items: center;
}

/* ── Form layout ── */
.form-row[b-w3d384ncww] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-group[b-w3d384ncww] {
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
}

.form-group:last-child[b-w3d384ncww] {
    margin-bottom: 0;
}

.form-group label[b-w3d384ncww] {
    font-weight: 500;
    margin-bottom: 0.4rem;
    font-size: 0.9rem;
    color: #495057;
}

.required[b-w3d384ncww] {
    color: #dc3545;
}

.field-error[b-w3d384ncww] {
    color: #dc3545;
    font-size: 0.825rem;
    margin-top: 0.3rem;
}

/* ── Currency prefix input ── */
.input-prefix-group[b-w3d384ncww] {
    display: flex;
    align-items: stretch;
}

.input-prefix[b-w3d384ncww] {
    display: flex;
    align-items: center;
    padding: 0.375rem 0.75rem;
    background: #e9ecef;
    border: 1px solid #ced4da;
    border-right: none;
    border-radius: 0.375rem 0 0 0.375rem;
    font-size: 0.9rem;
    color: #495057;
    font-weight: 500;
    white-space: nowrap;
}

.input-prefix-group .form-control[b-w3d384ncww] {
    border-radius: 0 0.375rem 0.375rem 0;
}

/* ── Form actions ── */
.form-actions[b-w3d384ncww] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-bottom: 2rem;
}

.btn-submit[b-w3d384ncww] {
    padding: 0.6rem 1.75rem;
    font-size: 1rem;
    font-weight: 600;
}

/* ── Responsive ── */
@media (max-width: 640px) {
    .form-row[b-w3d384ncww] {
        grid-template-columns: 1fr;
    }

    .page-header[b-w3d384ncww] {
        padding: 1.5rem 1rem;
        margin: -1.5rem -1rem 1.5rem -1rem;
    }
}
/* /Components/Pages/AdminBankStatementReview.razor.rz.scp.css */
/* ── Page layout ── */
.bsr-page[b-q84u2b0puh] {
    padding: 2rem;
    max-width: 1800px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ── Page header ── */
.page-header[b-q84u2b0puh] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #004999 100%);
    color: white;
    border-radius: 12px;
    padding: 2rem 2.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    overflow: hidden;
}

.header-text[b-q84u2b0puh] {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-width: 0;
}

.page-header h1[b-q84u2b0puh] {
    margin: 0 0 0.2rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: white;
}

.page-header p[b-q84u2b0puh] {
    margin: 0;
    opacity: 0.85;
    font-size: 0.95rem;
}

.btn-back[b-q84u2b0puh] {
    background: rgba(255, 255, 255, 0.15);
    border: none;
    color: white;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    font-size: 1.1rem;
    transition: background 0.15s;
}

    .btn-back:hover[b-q84u2b0puh] {
        background: rgba(255, 255, 255, 0.25);
    }

/* ── Loading ── */
.loading-container[b-q84u2b0puh] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

    .loading-container .spinner-border[b-q84u2b0puh] {
        width: 4rem;
        height: 4rem;
        border-width: 0.4em;
    }

    .loading-container p[b-q84u2b0puh] {
        font-size: 1.25rem;
        color: #495057;
        font-weight: 500;
    }

/* ── Filters ── */
.bsr-filters[b-q84u2b0puh] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    padding: 1rem 1.25rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
}

.bsr-filter-row[b-q84u2b0puh] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: flex-end;
    flex: 1;
}

.bsr-filter-group[b-q84u2b0puh] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1 1 200px;
}

    .bsr-filter-group label[b-q84u2b0puh] {
        font-size: 0.78rem;
        font-weight: 600;
        color: #495057;
        text-transform: uppercase;
        letter-spacing: 0.03em;
    }

.bsr-statement-progress[b-q84u2b0puh] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-shrink: 0;
}

.progress-label[b-q84u2b0puh] {
    font-size: 0.82rem;
    color: #495057;
    white-space: nowrap;
}

/* ── Card ── */
.bsr-card[b-q84u2b0puh] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    overflow: hidden;
}

/* ── Table ── */
.bsr-table-wrapper[b-q84u2b0puh] {
    overflow-x: auto;
}

.bsr-table[b-q84u2b0puh] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
}

    .bsr-table th[b-q84u2b0puh],
    .bsr-table td[b-q84u2b0puh] {
        padding: 0.45rem 0.6rem;
        border-bottom: 1px solid #f0f0f0;
        vertical-align: middle;
    }

    .bsr-table th[b-q84u2b0puh] {
        background: #f8f9fa;
        font-size: 0.75rem;
        font-weight: 600;
        color: #495057;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        white-space: nowrap;
        text-align: left;
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .bsr-table th.col-right[b-q84u2b0puh] {
        text-align: right;
    }

    .bsr-table th.col-center[b-q84u2b0puh] {
        text-align: center;
    }

    .bsr-table tbody tr:hover[b-q84u2b0puh] {
        background: #f8f9fa;
    }

    .bsr-table tbody tr.row-resolved[b-q84u2b0puh] {
        background: #f0fdf4;
    }

    .bsr-table tbody tr.row-doc-pending[b-q84u2b0puh] {
        background: #fffbeb;
    }

    .bsr-table tbody tr.row-ignored[b-q84u2b0puh] {
        opacity: 0.55;
    }

    .bsr-table tbody tr.error-row[b-q84u2b0puh] {
        background: transparent;
    }

    .bsr-table tbody tr.doc-panel-row[b-q84u2b0puh] {
        background: #f8f9fa;
    }

/* Column widths */
.col-date[b-q84u2b0puh] { width: 70px; white-space: nowrap; }
.col-desc[b-q84u2b0puh] { min-width: 180px; max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.col-ref[b-q84u2b0puh] { width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.col-right[b-q84u2b0puh] { text-align: right; width: 80px; white-space: nowrap; }
.col-classifier[b-q84u2b0puh] { width: 160px; }
.col-status[b-q84u2b0puh] { width: 130px; white-space: nowrap; }
.col-notes[b-q84u2b0puh] { min-width: 150px; }
.col-docs[b-q84u2b0puh] { width: 60px; text-align: center; }
.col-actions[b-q84u2b0puh] { width: 50px; text-align: center; }
.col-center[b-q84u2b0puh] { text-align: center; }

/* ── Money colours ── */
.money-in[b-q84u2b0puh] { color: #198754; font-weight: 500; }
.money-out[b-q84u2b0puh] { color: #dc3545; font-weight: 500; }

/* ── Classifier select ── */
.classifier-select[b-q84u2b0puh] {
    min-width: 140px;
    font-size: 0.8rem;
    padding: 0.25rem 0.4rem;
}

/* ── Notes input ── */
.notes-input[b-q84u2b0puh] {
    font-size: 0.8rem;
}

/* ── Status badges ── */
.status-badge[b-q84u2b0puh] {
    display: inline-block;
    padding: 0.15em 0.55em;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.status-new[b-q84u2b0puh] { background: #e9ecef; color: #495057; }
.status-classified[b-q84u2b0puh] { background: #cfe2ff; color: #084298; }
.status-documentpending[b-q84u2b0puh] { background: #fff3cd; color: #664d03; }
.status-resolved[b-q84u2b0puh] { background: #d1e7dd; color: #0a3622; }
.status-ignored[b-q84u2b0puh] { background: #f8d7da; color: #58151c; }

/* ── Doc count button ── */
.btn-doc-count[b-q84u2b0puh] {
    background: none;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 0.2rem 0.5rem;
    font-size: 0.78rem;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    cursor: pointer;
    color: #495057;
    transition: all 0.15s;
}

    .btn-doc-count:hover[b-q84u2b0puh] {
        background: #e9ecef;
        border-color: #adb5bd;
    }

    .btn-doc-count.doc-required[b-q84u2b0puh] {
        border-color: #ffc107;
        color: #664d03;
        background: #fff3cd;
    }

/* ── Save button ── */
.btn-save[b-q84u2b0puh] {
    background: none;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 0.2rem 0.5rem;
    cursor: pointer;
    color: #adb5bd;
    transition: all 0.15s;
}

    .btn-save:disabled[b-q84u2b0puh] {
        cursor: not-allowed;
        opacity: 0.5;
    }

    .btn-save.btn-save-active[b-q84u2b0puh] {
        background: #198754;
        border-color: #198754;
        color: white;
    }

        .btn-save.btn-save-active:hover:not(:disabled)[b-q84u2b0puh] {
            background: #146c43;
        }

/* ── Document panel ── */
.doc-panel[b-q84u2b0puh] {
    padding: 0.75rem 1rem;
    background: #f8f9fa;
    border-top: 1px solid #dee2e6;
}

.doc-panel-header[b-q84u2b0puh] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-weight: 600;
    font-size: 0.85rem;
    margin-bottom: 0.6rem;
    color: #495057;
}

.btn-upload[b-q84u2b0puh] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: var(--primary-color, #0055CC);
    color: white;
    border: none;
    border-radius: 6px;
    padding: 0.25rem 0.7rem;
    font-size: 0.78rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s;
    margin-left: auto;
}

    .btn-upload:hover:not(.disabled)[b-q84u2b0puh] {
        background: #004499;
    }

    .btn-upload.disabled[b-q84u2b0puh] {
        opacity: 0.65;
        cursor: not-allowed;
    }

.doc-list[b-q84u2b0puh] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.doc-item[b-q84u2b0puh] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 0.35rem 0.6rem;
}

.doc-icon[b-q84u2b0puh] {
    color: #6c757d;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.doc-info[b-q84u2b0puh] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    flex: 1;
}

.doc-name[b-q84u2b0puh] {
    font-size: 0.82rem;
    font-weight: 500;
    color: #0d6efd;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

    .doc-name:hover[b-q84u2b0puh] {
        text-decoration: underline;
    }

.doc-meta[b-q84u2b0puh] {
    font-size: 0.72rem;
    color: #6c757d;
}

.btn-delete-doc[b-q84u2b0puh] {
    background: none;
    border: none;
    color: #dc3545;
    cursor: pointer;
    font-size: 0.9rem;
    padding: 0.15rem 0.3rem;
    border-radius: 4px;
    flex-shrink: 0;
    transition: background 0.15s;
}

    .btn-delete-doc:hover[b-q84u2b0puh] {
        background: #f8d7da;
    }

/* ── Empty state ── */
.bsr-empty[b-q84u2b0puh] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 0;
    color: #adb5bd;
    gap: 0.5rem;
}

    .bsr-empty i[b-q84u2b0puh] {
        font-size: 2.5rem;
    }

    .bsr-empty p[b-q84u2b0puh] {
        margin: 0;
        font-size: 1rem;
    }

/* ── Misc ── */
.alert-sm[b-q84u2b0puh] {
    font-size: 0.8rem;
}
/* /Components/Pages/AdminBom.razor.rz.scp.css */
/* Page layout */
.bom-page[b-izn5hry39f] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-izn5hry39f] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container--small[b-izn5hry39f] {
    padding: 3rem 0;
    min-height: 200px;
}

.loading-container .spinner-border[b-izn5hry39f] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-izn5hry39f] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.bom-header[b-izn5hry39f] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.bom-header-top[b-izn5hry39f] {
    display: flex;
    align-items: center;
}

.back-link[b-izn5hry39f] {
    font-size: 0.95rem;
    color: #0d6efd;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-weight: 500;
}

.back-link:hover[b-izn5hry39f] {
    text-decoration: underline;
}

/* Picker */
.bom-picker[b-izn5hry39f] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.bom-picker label[b-izn5hry39f] {
    font-weight: 600;
    font-size: 0.95rem;
}

.bom-picker-row[b-izn5hry39f] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.bom-picker-input-wrapper[b-izn5hry39f] {
    position: relative;
    flex: 1;
    max-width: 500px;
}

.bom-picker-input-wrapper > i[b-izn5hry39f] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.bom-picker-input[b-izn5hry39f] {
    width: 100%;
    padding: 0.5rem 2.2rem 0.5rem 2.2rem;
    border: 1px solid #ced4da;
    border-radius: 6px;
    font-size: 0.95rem;
    transition: border-color 0.15s;
}

.bom-picker-input:focus[b-izn5hry39f] {
    border-color: #0d6efd;
    outline: none;
    box-shadow: 0 0 0 0.15rem rgba(13, 110, 253, 0.15);
}

.bom-picker-clear[b-izn5hry39f] {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    background: none;
    color: #6c757d;
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
}

/* Dropdown */
.bom-dropdown[b-izn5hry39f] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    max-width: 500px;
    max-height: 320px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid #ced4da;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    z-index: 100;
}

.bom-dropdown-item[b-izn5hry39f] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0.75rem;
    cursor: pointer;
    transition: background 0.1s;
}

.bom-dropdown-item:hover[b-izn5hry39f] {
    background: #f0f4ff;
}

.bom-dropdown-name[b-izn5hry39f] {
    font-weight: 500;
}

.bom-dropdown-category[b-izn5hry39f] {
    font-size: 0.82rem;
    color: #6c757d;
}

/* Result */
.bom-result[b-izn5hry39f] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.bom-result h2[b-izn5hry39f] {
    font-size: 1.35rem;
    font-weight: 700;
    margin: 0;
}

/* Warnings */
.bom-warnings[b-izn5hry39f] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.bom-warning[b-izn5hry39f] {
    padding: 0.5rem 0.75rem;
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 6px;
    color: #664d03;
    font-size: 0.9rem;
}

.bom-warning i[b-izn5hry39f] {
    margin-right: 0.35rem;
}

/* Empty state */
.bom-empty[b-izn5hry39f] {
    text-align: center;
    padding: 3rem 1rem;
    color: #6c757d;
}

.bom-empty i[b-izn5hry39f] {
    font-size: 3rem;
    display: block;
    margin-bottom: 1rem;
}

/* Table controls */
.bom-table-controls[b-izn5hry39f] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.bom-leaf-toggle[b-izn5hry39f] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    user-select: none;
}

.bom-leaf-toggle input[type="checkbox"][b-izn5hry39f] {
    width: 1rem;
    height: 1rem;
    cursor: pointer;
}

/* Table */
.bom-table-wrapper[b-izn5hry39f] {
    overflow-x: auto;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    background: #fff;
}

.bom-table[b-izn5hry39f] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.92rem;
}

.bom-table th[b-izn5hry39f] {
    padding: 0.65rem 0.75rem;
    background: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
    font-weight: 600;
    text-align: left;
    white-space: nowrap;
}

.bom-table th.col-right[b-izn5hry39f] {
    text-align: right;
}

.bom-table th.col-center[b-izn5hry39f] {
    text-align: center;
}

.bom-table td[b-izn5hry39f] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid #f0f0f0;
    vertical-align: middle;
}

.bom-table .col-right[b-izn5hry39f] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.bom-table .col-center[b-izn5hry39f] {
    text-align: center;
}

.bom-row-group[b-izn5hry39f] {
    background: #f0f4ff;
    font-weight: 600;
}

.bom-row-leaf[b-izn5hry39f] {
    background: #fff;
}

.bom-row-leaf:hover[b-izn5hry39f],
.bom-row-group:hover[b-izn5hry39f] {
    background: #e8f0fe;
}
/* /Components/Pages/AdminBrands.razor.rz.scp.css */
/* Page layout */
.brands-page[b-ovb9h2kg4g] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-ovb9h2kg4g] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-ovb9h2kg4g] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-ovb9h2kg4g] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.brands-header[b-ovb9h2kg4g] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.brands-header-top[b-ovb9h2kg4g] {
    display: flex;
    align-items: center;
}

.brands-header-row[b-ovb9h2kg4g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.brands-header-row h1[b-ovb9h2kg4g] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-ovb9h2kg4g] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-ovb9h2kg4g] {
    text-decoration: underline;
}

.btn-add[b-ovb9h2kg4g] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* Filters */
.brands-filters[b-ovb9h2kg4g] {
    background: white;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    padding: 1rem 1.25rem;
}

.brands-filter-row[b-ovb9h2kg4g] {
    display: flex;
    align-items: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.brands-filter-input-wrapper[b-ovb9h2kg4g] {
    position: relative;
    flex: 2 1 200px;
    display: flex;
    align-items: center;
}

.brands-filter-input-wrapper > .bi-search[b-ovb9h2kg4g] {
    position: absolute;
    left: 0.65rem;
    color: #adb5bd;
    pointer-events: none;
}

.brands-filter-input[b-ovb9h2kg4g] {
    width: 100%;
    padding: 0.375rem 2rem 0.375rem 2rem;
    font-size: 0.875rem;
    border: 1px solid #ced4da;
    border-radius: 6px;
    outline: none;
}

.brands-filter-input:focus[b-ovb9h2kg4g] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 0.2rem rgba(0, 102, 204, 0.15);
}

.brands-filter-clear[b-ovb9h2kg4g] {
    position: absolute;
    right: 0.5rem;
    background: none;
    border: none;
    color: #adb5bd;
    cursor: pointer;
    padding: 0;
    font-size: 0.8rem;
    line-height: 1;
}

.brands-filter-clear:hover[b-ovb9h2kg4g] {
    color: #495057;
}

.brands-filter-group[b-ovb9h2kg4g] {
    flex: 1 1 140px;
}

.brands-filter-actions[b-ovb9h2kg4g] {
    flex-shrink: 0;
}

/* Card / Table */
.brands-card[b-ovb9h2kg4g] {
    background: white;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    overflow: hidden;
}

.no-data[b-ovb9h2kg4g] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    color: #adb5bd;
    gap: 0.75rem;
}

.no-data i[b-ovb9h2kg4g] {
    font-size: 2.5rem;
}

.no-data p[b-ovb9h2kg4g] {
    margin: 0;
    font-size: 1rem;
}

.brands-table-wrapper[b-ovb9h2kg4g] {
    overflow-x: auto;
}

.brands-table[b-ovb9h2kg4g] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.brands-table thead tr[b-ovb9h2kg4g] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.brands-table th[b-ovb9h2kg4g] {
    padding: 0.85rem 1rem;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
    text-align: left;
}

.brands-table td[b-ovb9h2kg4g] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    vertical-align: middle;
}

.brands-table tbody tr:last-child td[b-ovb9h2kg4g] {
    border-bottom: none;
}

.brands-table tbody tr:hover[b-ovb9h2kg4g] {
    background: #f8f9fa;
}

.col-center[b-ovb9h2kg4g] {
    text-align: center;
}

.brands-table th.col-center[b-ovb9h2kg4g] {
    text-align: center;
}

.brand-name[b-ovb9h2kg4g] {
    font-weight: 500;
    color: #2c3e50;
}

.brand-logo-thumb[b-ovb9h2kg4g] {
    width: 40px;
    height: 40px;
    object-fit: contain;
    border-radius: 4px;
    border: 1px solid var(--border-color);
    background: #f8f9fa;
}

.brands-badge[b-ovb9h2kg4g] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.75rem;
    padding: 0.15rem 0.5rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 700;
    background: #e7f1ff;
    color: var(--primary-color);
}

.no-value[b-ovb9h2kg4g] {
    color: #adb5bd;
}

.status-badge[b-ovb9h2kg4g] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.2rem 0.6rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
}

.status-badge--active[b-ovb9h2kg4g] {
    background: #d1fae5;
    color: #065f46;
}

.status-badge--inactive[b-ovb9h2kg4g] {
    background: #f3f4f6;
    color: #6b7280;
}

/* Pager */
.brands-pager[b-ovb9h2kg4g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--border-color);
    flex-wrap: wrap;
    gap: 0.75rem;
}

.brands-pager-info[b-ovb9h2kg4g] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.brands-pager-controls[b-ovb9h2kg4g] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.brands-pager-current[b-ovb9h2kg4g] {
    font-size: 0.85rem;
    color: #495057;
    white-space: nowrap;
}

/* Modal */
.brands-modal-backdrop[b-ovb9h2kg4g] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 1050;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 2rem 1rem;
    overflow-y: auto;
}

.brands-modal[b-ovb9h2kg4g] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.25);
    width: 100%;
    max-width: 560px;
    display: flex;
    flex-direction: column;
    animation: modal-in-b-ovb9h2kg4g 0.18s ease;
}

@keyframes modal-in-b-ovb9h2kg4g {
    from { opacity: 0; transform: translateY(-16px); }
    to   { opacity: 1; transform: translateY(0); }
}

.brands-modal-header[b-ovb9h2kg4g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
}

.brands-modal-header h2[b-ovb9h2kg4g] {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    color: #2c3e50;
}

.brands-modal-close[b-ovb9h2kg4g] {
    background: none;
    border: none;
    color: #6c757d;
    font-size: 1rem;
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
    border-radius: 4px;
}

.brands-modal-close:hover[b-ovb9h2kg4g] {
    color: #343a40;
    background: #f0f0f0;
}

.brands-modal-body[b-ovb9h2kg4g] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.form-section-title[b-ovb9h2kg4g] {
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--secondary-color);
    padding-bottom: 0.25rem;
    border-bottom: 1px solid var(--border-color);
}

.form-section-separator[b-ovb9h2kg4g] {
    height: 1px;
    background: var(--border-color);
    margin: 0.25rem 0;
}

.form-group[b-ovb9h2kg4g] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.form-group label[b-ovb9h2kg4g] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #495057;
}

.required[b-ovb9h2kg4g] {
    color: #dc3545;
}

.field-error[b-ovb9h2kg4g] {
    font-size: 0.8rem;
    color: #dc3545;
}

.form-row-checks[b-ovb9h2kg4g] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
}

/* Logo grid */
.brands-logos-grid[b-ovb9h2kg4g] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.brands-logo-item[b-ovb9h2kg4g] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
}

.brands-logo-preview[b-ovb9h2kg4g] {
    width: 80px;
    height: 80px;
    object-fit: contain;
    border-radius: 6px;
    border: 1px solid var(--border-color);
    background: #f8f9fa;
}

.brands-logo-remove[b-ovb9h2kg4g] {
    width: 80px;
    font-size: 0.75rem;
}

.brands-no-logos[b-ovb9h2kg4g] {
    font-size: 0.875rem;
    color: var(--secondary-color);
    margin: 0;
}

.brands-logo-upload[b-ovb9h2kg4g] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.brands-logo-upload .form-label[b-ovb9h2kg4g] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #495057;
    margin: 0;
}

.brands-upload-progress[b-ovb9h2kg4g] {
    display: flex;
    align-items: center;
    font-size: 0.875rem;
    color: var(--secondary-color);
}

.brands-modal-footer[b-ovb9h2kg4g] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1.25rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    border-radius: 0 0 12px 12px;
}

/* Responsive */
@media (max-width: 640px) {
    .brands-page[b-ovb9h2kg4g] {
        padding: 1rem;
    }

    .brands-filter-row[b-ovb9h2kg4g] {
        flex-direction: column;
        align-items: stretch;
    }

    .brands-filter-group[b-ovb9h2kg4g] {
        flex: unset;
    }

    .brands-modal[b-ovb9h2kg4g] {
        max-width: 100%;
    }
}
/* /Components/Pages/AdminCreateOrder.razor.rz.scp.css */
/* Page layout */
.admin-create-order-page[b-20vky3lksg] {
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-20vky3lksg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-20vky3lksg] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-20vky3lksg] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.order-detail-header[b-20vky3lksg] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.back-link[b-20vky3lksg] {
    font-size: 0.875rem;
    text-decoration: none;
    color: #6c757d;
    margin-bottom: 0.5rem;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.back-link:hover[b-20vky3lksg] {
    color: #0d6efd;
}

.order-detail-title-row[b-20vky3lksg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.order-detail-title-row h1[b-20vky3lksg] {
    font-size: 1.5rem;
    margin: 0;
}

/* Body */
.order-detail-body[b-20vky3lksg] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Cards */
.order-detail-card[b-20vky3lksg] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    padding: 1.25rem;
}

.card-section-title[b-20vky3lksg] {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 1rem;
    color: #212529;
}

/* Customer select */
.customer-select-row[b-20vky3lksg] {
    max-width: 400px;
}

/* No items hint */
.no-items-hint[b-20vky3lksg] {
    font-size: 0.875rem;
    color: #6c757d;
    margin-bottom: 0;
}

/* Items table */
.order-items-table-wrapper[b-20vky3lksg] {
    overflow-x: auto;
    margin-bottom: 0;
}

.order-items-table[b-20vky3lksg] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.order-items-table th[b-20vky3lksg],
.order-items-table td[b-20vky3lksg] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid #e9ecef;
    vertical-align: middle;
}

.order-items-table th[b-20vky3lksg] {
    font-weight: 600;
    color: #6c757d;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.order-items-table th.col-right[b-20vky3lksg] { text-align: right; }
.order-items-table th.col-center[b-20vky3lksg] { text-align: center; }

.col-right[b-20vky3lksg] {
    text-align: right;
}

.col-center[b-20vky3lksg] {
    text-align: center;
}

.col-qty[b-20vky3lksg] {
    width: 80px;
}

.col-action[b-20vky3lksg] {
    width: 48px;
}

.qty-input[b-20vky3lksg] {
    width: 70px;
    text-align: right;
    display: inline-block;
}

.btn-icon[b-20vky3lksg] {
    padding: 0.2rem 0.4rem;
    line-height: 1;
}

/* Marketing badge */
.badge-marketing[b-20vky3lksg] {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 600;
    padding: 0.15rem 0.45rem;
    border-radius: 999px;
    background: #e8daef;
    color: #6c3483;
    margin-left: 0.35rem;
    vertical-align: middle;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

/* Ad-hoc badge */
.badge-adhoc[b-20vky3lksg] {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 600;
    padding: 0.15rem 0.45rem;
    border-radius: 999px;
    background: #fde8c8;
    color: #8a4f00;
    margin-left: 0.35rem;
    vertical-align: middle;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

/* Quick add */
.quick-add-section[b-20vky3lksg] {
    margin-top: 1rem;
    border-top: 1px solid #e9ecef;
    padding-top: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.quick-add-row[b-20vky3lksg] {
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
}

.quick-add-search-wrapper[b-20vky3lksg] {
    position: relative;
    flex: 1;
    max-width: 400px;
}

.quick-add-results[b-20vky3lksg] {
    position: absolute;
    z-index: 100;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
    list-style: none;
    margin: 0.25rem 0 0;
    padding: 0.25rem 0;
    width: 100%;
    max-height: 280px;
    overflow-y: auto;
}

.quick-add-results li[b-20vky3lksg] {
    padding: 0.45rem 0.75rem;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.85rem;
}

.quick-add-results li:hover[b-20vky3lksg] {
    background: #f0f4ff;
}

.qa-name[b-20vky3lksg] {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-right: 0.5rem;
}

.qa-price[b-20vky3lksg] {
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
}

/* Ad-hoc add row */
.adhoc-add-row[b-20vky3lksg] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
}

.adhoc-label[b-20vky3lksg] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #8a4f00;
    white-space: nowrap;
}

.adhoc-desc-input[b-20vky3lksg] {
    flex: 1;
    min-width: 160px;
    max-width: 300px;
}

.adhoc-price-group[b-20vky3lksg] {
    width: 120px;
}

.price-input[b-20vky3lksg] {
    width: 90px;
    text-align: right;
    display: inline-block;
}

/* Summary amounts */
.amounts-list[b-20vky3lksg] {
    margin: 0;
    padding: 0;
}

.amounts-row[b-20vky3lksg] {
    display: flex;
    justify-content: space-between;
    padding: 0.4rem 0;
    font-size: 0.9rem;
}

.amounts-row dt[b-20vky3lksg] {
    font-weight: 500;
    color: #495057;
}

.amounts-row dd[b-20vky3lksg] {
    font-weight: 500;
    margin: 0;
}

.amounts-row--editable dd[b-20vky3lksg] {
    max-width: 160px;
}

.amount-input-group[b-20vky3lksg] {
    max-width: 140px;
}

.amounts-row--credit dt[b-20vky3lksg],
.amounts-row--credit dd[b-20vky3lksg] {
    color: #198754;
}

.amounts-row--total[b-20vky3lksg] {
    border-top: 2px solid #212529;
    margin-top: 0.25rem;
    padding-top: 0.6rem;
}

.amounts-row--total dt[b-20vky3lksg],
.amounts-row--total dd[b-20vky3lksg] {
    font-weight: 700;
    font-size: 1rem;
}

/* Actions card */
.actions-card[b-20vky3lksg] {
    display: flex;
    flex-direction: column;
}

.confirm-actions[b-20vky3lksg] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
}

/* Success panel */
.success-panel[b-20vky3lksg] {
    background: #fff;
    border: 1px solid #d1e7dd;
    border-radius: 0.75rem;
    padding: 3rem 2rem;
    text-align: center;
    color: #0f5132;
    margin: 2rem 0;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.success-icon[b-20vky3lksg] {
    font-size: 4rem;
    color: #198754;
    margin-bottom: 1rem;
}

.success-panel h2[b-20vky3lksg] {
    margin: 0 0 0.75rem;
    font-size: 1.5rem;
    font-weight: 700;
}

.success-panel p[b-20vky3lksg] {
    color: #495057;
    margin-bottom: 0.25rem;
}

.success-actions[b-20vky3lksg] {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 1.75rem;
}

@media (max-width: 600px) {
    .admin-create-order-page[b-20vky3lksg] {
        padding: 1rem;
    }

    .confirm-actions[b-20vky3lksg] {
        flex-direction: column;
        align-items: stretch;
    }

    .customer-select-row[b-20vky3lksg] {
        max-width: 100%;
    }
}
/* /Components/Pages/AdminCustomers.razor.rz.scp.css */
/* ── Page layout ── */
.cust-page[b-y2a1qxgzr5] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ── Loading ── */
.loading-container[b-y2a1qxgzr5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-y2a1qxgzr5] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-y2a1qxgzr5] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* ── Filters ── */
.cust-filters[b-y2a1qxgzr5] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    padding: 1rem 1.25rem;
}

.cust-filter-row[b-y2a1qxgzr5] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: flex-end;
}

.cust-filter-group[b-y2a1qxgzr5] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1 1 140px;
}

.cust-filter-group label[b-y2a1qxgzr5] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #495057;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.cust-filter-actions[b-y2a1qxgzr5] {
    display: flex;
    align-items: flex-end;
}

/* ── Card ── */
.cust-card[b-y2a1qxgzr5] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    overflow: hidden;
}

/* ── Table ── */
.cust-table-wrapper[b-y2a1qxgzr5] {
    overflow-x: auto;
}

.cust-table[b-y2a1qxgzr5] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.cust-table thead tr[b-y2a1qxgzr5] {
    background: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
}

.cust-table th[b-y2a1qxgzr5] {
    padding: 0.75rem 1rem;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
    text-align: left;
}

.cust-table th.col-center[b-y2a1qxgzr5] {
    text-align: center;
}

.cust-table td[b-y2a1qxgzr5] {
    padding: 0.7rem 1rem;
    border-bottom: 1px solid #f0f0f0;
    vertical-align: middle;
}

.cust-table tbody tr:last-child td[b-y2a1qxgzr5] {
    border-bottom: none;
}

.cust-table tbody tr:hover[b-y2a1qxgzr5] {
    background: #f8f9fa;
}

.cust-table tbody tr.cust-row--selected[b-y2a1qxgzr5] {
    background: #e7f0ff;
}

.col-center[b-y2a1qxgzr5] {
    text-align: center !important;
}

.cust-name[b-y2a1qxgzr5] {
    font-weight: 600;
    white-space: nowrap;
}

.cust-secondary[b-y2a1qxgzr5] {
    color: #6c757d;
    font-size: 0.875rem;
}

.no-value[b-y2a1qxgzr5] {
    color: #adb5bd;
}

/* ── Type badge ── */
.cust-type[b-y2a1qxgzr5] {
    display: inline-block;
    padding: 0.2rem 0.55rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    background: #e9ecef;
    color: #495057;
}

.cust-type--retail[b-y2a1qxgzr5],
.cust-type--retail-shop[b-y2a1qxgzr5] {
    background: #cfe2ff;
    color: #084298;
}

.cust-type--wholesale[b-y2a1qxgzr5] {
    background: #d1e7dd;
    color: #0a3622;
}

.cust-type--dealer[b-y2a1qxgzr5] {
    background: #fff3cd;
    color: #664d03;
}

.cust-type--other[b-y2a1qxgzr5] {
    background: #f8d7da;
    color: #58151c;
}

/* ── Edit button ── */
.btn-edit[b-y2a1qxgzr5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background: #fff;
    color: #6c757d;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
    font-size: 0.9rem;
}

.btn-edit:hover[b-y2a1qxgzr5] {
    background: #e7f0ff;
    border-color: #0d6efd;
    color: #0d6efd;
}

/* ── Empty state ── */
.no-data[b-y2a1qxgzr5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    color: #adb5bd;
    gap: 0.75rem;
}

.no-data i[b-y2a1qxgzr5] {
    font-size: 2.5rem;
}

.no-data p[b-y2a1qxgzr5] {
    margin: 0;
    font-size: 1rem;
}

/* ── Pager ── */
.cust-pager[b-y2a1qxgzr5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1.25rem;
    border-top: 1px solid #dee2e6;
    background: #f8f9fa;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.cust-pager-info[b-y2a1qxgzr5] {
    font-size: 0.85rem;
    color: #6c757d;
}

.cust-pager-controls[b-y2a1qxgzr5] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.cust-pager-current[b-y2a1qxgzr5] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #495057;
}

/* ── Drawer ── */
.cust-drawer-backdrop[b-y2a1qxgzr5] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.35);
    z-index: 1040;
}

.cust-drawer[b-y2a1qxgzr5] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(680px, 100vw);
    background: #fff;
    z-index: 1050;
    display: flex;
    flex-direction: column;
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.15);
    animation: slideIn-b-y2a1qxgzr5 0.22s ease-out;
}

@keyframes slideIn-b-y2a1qxgzr5 {
    from { transform: translateX(100%); }
    to   { transform: translateX(0); }
}

.cust-drawer-header[b-y2a1qxgzr5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #dee2e6;
    background: #f8f9fa;
    flex-shrink: 0;
}

.cust-drawer-header h2[b-y2a1qxgzr5] {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 700;
    color: #2c3e50;
}

.cust-drawer-close[b-y2a1qxgzr5] {
    background: none;
    border: none;
    font-size: 1.1rem;
    color: #6c757d;
    cursor: pointer;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    line-height: 1;
}

.cust-drawer-close:hover[b-y2a1qxgzr5] {
    background: #e9ecef;
    color: #2c3e50;
}

.cust-drawer-body[b-y2a1qxgzr5] {
    flex: 1;
    overflow-y: auto;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.cust-drawer-footer[b-y2a1qxgzr5] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #dee2e6;
    background: #f8f9fa;
    flex-shrink: 0;
}

/* ── Form sections ── */
.cust-section[b-y2a1qxgzr5] {
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 1rem 1.25rem 1.25rem;
}

.cust-section legend[b-y2a1qxgzr5] {
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6c757d;
    padding: 0 0.4rem;
    float: none;
    width: auto;
}

.cust-form-row[b-y2a1qxgzr5] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 0.75rem;
}

.cust-form-group[b-y2a1qxgzr5] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1 1 160px;
}

.cust-form-group--wide[b-y2a1qxgzr5] {
    flex: 2 1 240px;
}

.cust-form-group label[b-y2a1qxgzr5] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #495057;
}

.req[b-y2a1qxgzr5] {
    color: #dc3545;
}

.cust-form-checks[b-y2a1qxgzr5] {
    display: flex;
    gap: 1.5rem;
    margin-top: 0.75rem;
}

/* ── Toast ── */
.cust-toast[b-y2a1qxgzr5] {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 1060;
    cursor: pointer;
    animation: toastUp-b-y2a1qxgzr5 0.25s ease-out;
}

@keyframes toastUp-b-y2a1qxgzr5 {
    from { transform: translateY(1rem); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}

.cust-toast-inner[b-y2a1qxgzr5] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-left: 4px solid #198754;
    border-radius: 10px;
    padding: 1rem 1.25rem;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    min-width: 260px;
}

.cust-toast-inner > i[b-y2a1qxgzr5] {
    color: #198754;
    font-size: 1.3rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.cust-toast-inner div[b-y2a1qxgzr5] {
    flex: 1;
}

.cust-toast-inner strong[b-y2a1qxgzr5] {
    display: block;
    font-size: 0.9rem;
    color: #2c3e50;
}

.cust-toast-inner p[b-y2a1qxgzr5] {
    margin: 0.2rem 0 0;
    font-size: 0.85rem;
    color: #6c757d;
}

.cust-toast-close[b-y2a1qxgzr5] {
    background: none;
    border: none;
    color: #adb5bd;
    cursor: pointer;
    padding: 0;
    font-size: 0.9rem;
    flex-shrink: 0;
    line-height: 1;
}

.cust-toast-close:hover[b-y2a1qxgzr5] {
    color: #6c757d;
}
/* /Components/Pages/AdminDashboard.razor.rz.scp.css */
.dashboard-page[b-qrrfhhe2sq] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* Tabs */
.dashboard-tabs[b-qrrfhhe2sq] {
    display: flex;
    gap: 0;
    border-bottom: 2px solid #dee2e6;
}

.dashboard-tab[b-qrrfhhe2sq] {
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    padding: 0.6rem 1.5rem;
    font-size: 1rem;
    font-weight: 500;
    color: #6c757d;
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s;
}

.dashboard-tab:hover[b-qrrfhhe2sq] {
    color: var(--primary-color);
}

.dashboard-tab.active[b-qrrfhhe2sq] {
    color: var(--primary-color);
    border-bottom-color: var(--primary-color);
}

.tab-badge[b-qrrfhhe2sq] {
    display: inline-block;
    width: 8px;
    height: 8px;
    background-color: #dc3545;
    border-radius: 50%;
    margin-left: 6px;
    vertical-align: middle;
    position: relative;
    top: -1px;
}

/* Loading & Error */
.loading-container[b-qrrfhhe2sq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-qrrfhhe2sq] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-qrrfhhe2sq] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

.dashboard-error[b-qrrfhhe2sq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 2rem;
    text-align: center;
    color: var(--secondary-color);
}

.dashboard-error i[b-qrrfhhe2sq] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}

/* Welcome Banner */
.dashboard-welcome[b-qrrfhhe2sq] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #004999 100%);
    color: white;
    border-radius: 12px;
    padding: 2rem 2.5rem;
}

.welcome-text h1[b-qrrfhhe2sq] {
    margin: 0 0 0.25rem;
    font-size: 2rem;
    font-weight: 700;
    color: white;
}

.welcome-text p[b-qrrfhhe2sq] {
    margin: 0;
    opacity: 0.85;
    font-size: 1rem;
}

@media (max-width: 640px) {
    .dashboard-page[b-qrrfhhe2sq] {
        padding: 1rem;
        gap: 1.25rem;
    }

    .dashboard-welcome[b-qrrfhhe2sq] {
        padding: 1.5rem;
    }

    .welcome-text h1[b-qrrfhhe2sq] {
        font-size: 1.5rem;
    }
}
/* /Components/Pages/AdminFinishedGoods.razor.rz.scp.css */
/* Page layout */
.fg-page[b-g2q9q9hciz] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-g2q9q9hciz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-g2q9q9hciz] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-g2q9q9hciz] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.fg-header[b-g2q9q9hciz] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.fg-header-top[b-g2q9q9hciz] {
    display: flex;
    align-items: center;
}

.fg-header-row[b-g2q9q9hciz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.fg-header-row h1[b-g2q9q9hciz] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-g2q9q9hciz] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-g2q9q9hciz] {
    text-decoration: underline;
}

.btn-add[b-g2q9q9hciz] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* Controls */
.fg-controls[b-g2q9q9hciz] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.fg-controls-row[b-g2q9q9hciz] {
    display: flex;
    align-items: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.fg-filter-input-wrapper[b-g2q9q9hciz] {
    position: relative;
    display: flex;
    align-items: center;
    flex: 2 1 220px;
    min-width: 180px;
}

.fg-filter-input-wrapper > i[b-g2q9q9hciz] {
    position: absolute;
    left: 0.75rem;
    color: var(--secondary-color);
    font-size: 0.9rem;
    pointer-events: none;
}

.fg-filter-input[b-g2q9q9hciz] {
    width: 100%;
    padding: 0.5rem 2.25rem 0.5rem 2.25rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    font-size: 0.9rem;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.fg-filter-input:focus[b-g2q9q9hciz] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 105, 217, 0.12);
}

.fg-filter-clear[b-g2q9q9hciz] {
    position: absolute;
    right: 0.5rem;
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
    font-size: 0.8rem;
    border-radius: 4px;
    transition: color 0.15s;
}

.fg-filter-clear:hover[b-g2q9q9hciz] {
    color: var(--text-color);
}

.fg-filter-group[b-g2q9q9hciz] {
    flex: 1 1 150px;
    min-width: 140px;
}

.fg-filter-actions[b-g2q9q9hciz] {
    display: flex;
    align-items: center;
}

/* Card */
.fg-card[b-g2q9q9hciz] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-g2q9q9hciz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-g2q9q9hciz] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-g2q9q9hciz] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.fg-table-wrapper[b-g2q9q9hciz] {
    overflow-x: auto;
}

.fg-table[b-g2q9q9hciz] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.fg-table thead tr[b-g2q9q9hciz] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.fg-table th[b-g2q9q9hciz] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.fg-table td[b-g2q9q9hciz] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.fg-table tbody tr:last-child td[b-g2q9q9hciz] {
    border-bottom: none;
}

.fg-table tbody tr:hover[b-g2q9q9hciz] {
    background: #f8f9fa;
}

.col-right[b-g2q9q9hciz] {
    text-align: right;
}

.fg-table th.col-right[b-g2q9q9hciz] {
    text-align: right;
}

.fg-table th.col-center[b-g2q9q9hciz] {
    text-align: center;
}

.col-center[b-g2q9q9hciz] {
    text-align: center;
    width: 7rem;
}

.col-photo[b-g2q9q9hciz] {
    width: 3.5rem;
    text-align: center;
}

.fg-table th.col-photo[b-g2q9q9hciz] {
    text-align: center;
}

.item-name[b-g2q9q9hciz] {
    font-weight: 500;
}

.price-cell[b-g2q9q9hciz] {
    font-variant-numeric: tabular-nums;
    font-weight: 500;
}

.no-value[b-g2q9q9hciz] {
    color: var(--secondary-color);
    opacity: 0.6;
}

.inactive-row[b-g2q9q9hciz] {
    background: #f8f9fa;
    opacity: 0.7;
}

.inactive-row:hover[b-g2q9q9hciz] {
    opacity: 0.85;
}

/* Product thumbnail */
.product-thumb[b-g2q9q9hciz] {
    width: 36px;
    height: 36px;
    object-fit: contain;
    border-radius: 4px;
    background: #f8f9fa;
}

.product-thumb-placeholder[b-g2q9q9hciz] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    background: #f0f0f0;
    color: #adb5bd;
    font-size: 1rem;
}

/* Status badges */
.status-badge[b-g2q9q9hciz] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.6rem;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 500;
    white-space: nowrap;
}

.status-badge--active[b-g2q9q9hciz] {
    background: #d4edda;
    color: #155724;
}

.status-badge--inactive[b-g2q9q9hciz] {
    background: #e2e3e5;
    color: #383d41;
}

/* Type badges (for sales price table in edit modal) */
.type-badge[b-g2q9q9hciz] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.6rem;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 500;
    white-space: nowrap;
}

.type-badge--retail[b-g2q9q9hciz] {
    background: #d4edda;
    color: #155724;
}

.type-badge--shop[b-g2q9q9hciz] {
    background: #fff3cd;
    color: #856404;
}

/* Actions cell */
.actions-cell[b-g2q9q9hciz] {
    display: flex;
    gap: 0.35rem;
    justify-content: center;
    align-items: center;
}

/* Pager */
.fg-pager[b-g2q9q9hciz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-wrap: wrap;
    gap: 0.5rem;
}

.fg-pager-info[b-g2q9q9hciz] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.fg-pager-controls[b-g2q9q9hciz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.fg-pager-current[b-g2q9q9hciz] {
    font-size: 0.85rem;
    color: var(--secondary-color);
    white-space: nowrap;
}

/* Modal */
.fg-modal-backdrop[b-g2q9q9hciz] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 1rem;
}

.fg-modal[b-g2q9q9hciz] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    width: 100%;
    max-width: 560px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.fg-modal--lg[b-g2q9q9hciz] {
    max-width: 720px;
}

.fg-modal-header[b-g2q9q9hciz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    background: var(--background-color);
    flex-shrink: 0;
}

.fg-modal-header h2[b-g2q9q9hciz] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.fg-modal-close[b-g2q9q9hciz] {
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    font-size: 1rem;
    border-radius: 4px;
    line-height: 1;
    transition: color 0.15s;
}

.fg-modal-close:hover[b-g2q9q9hciz] {
    color: var(--text-color);
}

.fg-modal-body[b-g2q9q9hciz] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    overflow-y: auto;
}

.fg-modal-footer[b-g2q9q9hciz] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-shrink: 0;
}

.modal-description[b-g2q9q9hciz] {
    color: var(--secondary-color);
    font-size: 0.9rem;
    margin: 0;
    line-height: 1.5;
}

.modal-section-title[b-g2q9q9hciz] {
    font-size: 1rem;
    font-weight: 600;
    color: #2c3e50;
    margin: 0;
}

/* Form helpers */
.form-row-2[b-g2q9q9hciz] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-row-3[b-g2q9q9hciz] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1rem;
}

.form-group[b-g2q9q9hciz] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-g2q9q9hciz] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
}

.form-group--checkbox[b-g2q9q9hciz] {
    justify-content: center;
    gap: 0.5rem;
}

.required[b-g2q9q9hciz] {
    color: #dc3545;
}

/* Sales price table in edit modal */
.fg-sp-table-wrapper[b-g2q9q9hciz] {
    overflow-x: auto;
    border: 1px solid var(--border-color);
    border-radius: 8px;
}

.fg-sp-table[b-g2q9q9hciz] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}

.fg-sp-table thead tr[b-g2q9q9hciz] {
    background: var(--background-color);
    border-bottom: 1px solid var(--border-color);
}

.fg-sp-table th[b-g2q9q9hciz] {
    padding: 0.5rem 0.75rem;
    text-align: left;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.fg-sp-table th.col-right[b-g2q9q9hciz] {
    text-align: right;
}

.fg-sp-table th.col-center[b-g2q9q9hciz] {
    text-align: center;
}

.fg-sp-table td[b-g2q9q9hciz] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--border-color);
    vertical-align: middle;
}

.fg-sp-table td.col-right[b-g2q9q9hciz] {
    text-align: right;
}

.fg-sp-table td.col-center[b-g2q9q9hciz] {
    text-align: center;
}

.fg-sp-table tbody tr:last-child td[b-g2q9q9hciz] {
    border-bottom: none;
}

/* Photo upload */
.photo-current[b-g2q9q9hciz] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.photo-current-label-row[b-g2q9q9hciz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.photo-current label[b-g2q9q9hciz] {
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--secondary-color);
}

.photo-preview[b-g2q9q9hciz] {
    max-width: 200px;
    max-height: 200px;
    object-fit: contain;
    border-radius: 8px;
    background: #f8f9fa;
    border: 1px solid var(--border-color);
    padding: 0.25rem;
}

/* Photo grid */
.photo-empty[b-g2q9q9hciz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 2rem;
    color: var(--secondary-color);
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px dashed var(--border-color);
}

.photo-empty i[b-g2q9q9hciz] {
    font-size: 2rem;
    opacity: 0.5;
}

.photo-empty p[b-g2q9q9hciz] {
    margin: 0;
    font-size: 0.875rem;
}

.photo-grid[b-g2q9q9hciz] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.photo-grid-item[b-g2q9q9hciz] {
    position: relative;
    width: 120px;
    border-radius: 8px;
    border: 2px solid var(--border-color);
    overflow: hidden;
    background: #f8f9fa;
    display: flex;
    flex-direction: column;
}

.photo-grid-item--primary[b-g2q9q9hciz] {
    border-color: #198754;
}

.photo-grid-img[b-g2q9q9hciz] {
    width: 100%;
    height: 100px;
    object-fit: contain;
    padding: 0.25rem;
    background: #fff;
}

.photo-grid-actions[b-g2q9q9hciz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.3rem 0.4rem;
    gap: 0.25rem;
    background: #f8f9fa;
    border-top: 1px solid var(--border-color);
    min-height: 2rem;
}

.photo-primary-badge[b-g2q9q9hciz] {
    font-size: 0.7rem;
    padding: 0.15rem 0.4rem;
    white-space: nowrap;
}

.btn-xs[b-g2q9q9hciz] {
    padding: 0.15rem 0.35rem;
    font-size: 0.75rem;
    line-height: 1.4;
    border-radius: 4px;
}

@media (max-width: 768px) {
    .form-row-2[b-g2q9q9hciz],
    .form-row-3[b-g2q9q9hciz] {
        grid-template-columns: 1fr;
    }

    .fg-controls-row[b-g2q9q9hciz] {
        flex-direction: column;
        align-items: stretch;
    }

    .fg-filter-group[b-g2q9q9hciz] {
        min-width: unset;
    }
}
/* /Components/Pages/AdminItems.razor.rz.scp.css */
/* Page layout */
.items-page[b-ec5wu2tccb] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-ec5wu2tccb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-ec5wu2tccb] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-ec5wu2tccb] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.items-header[b-ec5wu2tccb] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.items-header-top[b-ec5wu2tccb] {
    display: flex;
    align-items: center;
}

.items-header-row[b-ec5wu2tccb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.items-header-row h1[b-ec5wu2tccb] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-ec5wu2tccb] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-ec5wu2tccb] {
    text-decoration: underline;
}

.btn-add[b-ec5wu2tccb] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* Filters */
.items-filters[b-ec5wu2tccb] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.items-filter-row[b-ec5wu2tccb] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.items-filter-input-wrapper[b-ec5wu2tccb] {
    position: relative;
    display: flex;
    align-items: center;
    flex: 2 1 220px;
    min-width: 180px;
}

.items-filter-input-wrapper > i[b-ec5wu2tccb] {
    position: absolute;
    left: 0.75rem;
    color: var(--secondary-color);
    font-size: 0.9rem;
    pointer-events: none;
}

.items-filter-input[b-ec5wu2tccb] {
    width: 100%;
    padding: 0.5rem 2.25rem 0.5rem 2.25rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    font-size: 0.9rem;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.items-filter-input:focus[b-ec5wu2tccb] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 105, 217, 0.12);
}

.items-filter-clear[b-ec5wu2tccb] {
    position: absolute;
    right: 0.5rem;
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
    font-size: 0.8rem;
    border-radius: 4px;
    transition: color 0.15s;
}

.items-filter-clear:hover[b-ec5wu2tccb] {
    color: var(--text-color);
}

.items-filter-group[b-ec5wu2tccb] {
    flex: 1 1 150px;
    min-width: 140px;
}

.items-filter-actions[b-ec5wu2tccb] {
    display: flex;
    align-items: center;
}

/* Card */
.items-card[b-ec5wu2tccb] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-ec5wu2tccb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-ec5wu2tccb] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-ec5wu2tccb] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.items-table-wrapper[b-ec5wu2tccb] {
    overflow-x: auto;
}

.items-table[b-ec5wu2tccb] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.items-table thead tr[b-ec5wu2tccb] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.items-table th[b-ec5wu2tccb] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.items-table td[b-ec5wu2tccb] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.items-table tbody tr:last-child td[b-ec5wu2tccb] {
    border-bottom: none;
}

.items-table tbody tr:hover[b-ec5wu2tccb] {
    background: #f8f9fa;
}

.col-right[b-ec5wu2tccb] {
    text-align: right;
}

.items-table th.col-right[b-ec5wu2tccb] {
    text-align: right;
}

.col-center[b-ec5wu2tccb] {
    text-align: center;
    width: 5rem;
}

.item-name[b-ec5wu2tccb] {
    font-weight: 500;
}

.no-value[b-ec5wu2tccb] {
    color: var(--secondary-color);
    opacity: 0.6;
}

/* Category badge */
.category-badge[b-ec5wu2tccb] {
    display: inline-block;
    padding: 0.2rem 0.6rem;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 500;
    background: #e8f4fd;
    color: #1565c0;
    white-space: nowrap;
}

/* Status badges */
.status-badge[b-ec5wu2tccb] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.6rem;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 500;
    white-space: nowrap;
}

.status-badge--active[b-ec5wu2tccb] {
    background: #d4edda;
    color: #155724;
}

.status-badge--inactive[b-ec5wu2tccb] {
    background: #f8d7da;
    color: #721c24;
}

/* Pager */
.items-pager[b-ec5wu2tccb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-wrap: wrap;
    gap: 0.5rem;
}

.items-pager-info[b-ec5wu2tccb] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.items-pager-controls[b-ec5wu2tccb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.items-pager-current[b-ec5wu2tccb] {
    font-size: 0.85rem;
    color: var(--secondary-color);
    white-space: nowrap;
}

/* Modal */
.items-modal-backdrop[b-ec5wu2tccb] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 1rem;
}

.items-modal[b-ec5wu2tccb] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    width: 100%;
    max-width: 600px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.items-modal-header[b-ec5wu2tccb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    background: var(--background-color);
    flex-shrink: 0;
}

.items-modal-header h2[b-ec5wu2tccb] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.items-modal-close[b-ec5wu2tccb] {
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    font-size: 1rem;
    border-radius: 4px;
    line-height: 1;
    transition: color 0.15s;
}

.items-modal-close:hover[b-ec5wu2tccb] {
    color: var(--text-color);
}

.items-modal-body[b-ec5wu2tccb] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    overflow-y: auto;
}

.items-modal-footer[b-ec5wu2tccb] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-shrink: 0;
}

/* Form helpers */
.form-row-2[b-ec5wu2tccb] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-row-checks[b-ec5wu2tccb] {
    display: flex;
    gap: 2rem;
    align-items: center;
}

.form-section-title[b-ec5wu2tccb] {
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--secondary-color);
    margin-bottom: -0.25rem;
}

.form-section-separator[b-ec5wu2tccb] {
    border-top: 1px solid var(--border-color);
    margin: 0.25rem 0;
}

.form-group[b-ec5wu2tccb] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-ec5wu2tccb] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
}

.required[b-ec5wu2tccb] {
    color: #dc3545;
}

.field-error[b-ec5wu2tccb] {
    font-size: 0.8rem;
    color: #dc3545;
    margin-top: 0.15rem;
}

@media (max-width: 600px) {
    .form-row-2[b-ec5wu2tccb] {
        grid-template-columns: 1fr;
    }

    .items-filter-row[b-ec5wu2tccb] {
        flex-direction: column;
        align-items: stretch;
    }

    .items-filter-group[b-ec5wu2tccb] {
        min-width: unset;
    }
}
/* /Components/Pages/AdminNavMenu.razor.rz.scp.css */
/* ── Page layout ── */
.nm-page[b-d3ipftzm0n] {
    padding: 2rem;
    max-width: 1600px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ── Loading ── */
.loading-container[b-d3ipftzm0n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-d3ipftzm0n] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-d3ipftzm0n] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* ── Header ── */
.nm-header[b-d3ipftzm0n] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.nm-header-top[b-d3ipftzm0n] {
    display: flex;
    align-items: center;
}

.back-link[b-d3ipftzm0n] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-d3ipftzm0n] {
    text-decoration: underline;
}

.nm-header-row[b-d3ipftzm0n] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.nm-header-row h1[b-d3ipftzm0n] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.btn-add[b-d3ipftzm0n] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* ── Filters ── */
.nm-filters[b-d3ipftzm0n] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    padding: 1rem 1.25rem;
}

.nm-filter-row[b-d3ipftzm0n] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: flex-end;
}

.nm-filter-group[b-d3ipftzm0n] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1 1 140px;
}

.nm-filter-group label[b-d3ipftzm0n] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #495057;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.nm-filter-actions[b-d3ipftzm0n] {
    display: flex;
    align-items: flex-end;
}

/* ── Card / Table ── */
.nm-card[b-d3ipftzm0n] {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    overflow: hidden;
}

.no-data[b-d3ipftzm0n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 3rem;
    color: #adb5bd;
    gap: 0.75rem;
}

.no-data i[b-d3ipftzm0n] {
    font-size: 2.5rem;
}

.nm-table-wrapper[b-d3ipftzm0n] {
    overflow-x: auto;
}

.nm-table[b-d3ipftzm0n] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.nm-table thead tr[b-d3ipftzm0n] {
    background: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
}

.nm-table th[b-d3ipftzm0n] {
    padding: 0.65rem 0.85rem;
    font-size: 0.75rem;
    font-weight: 700;
    color: #495057;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.nm-table tbody tr[b-d3ipftzm0n] {
    border-bottom: 1px solid #f0f0f0;
    transition: background 0.12s;
}

.nm-table tbody tr:hover[b-d3ipftzm0n] {
    background: #f8f9fa;
}

.nm-table td[b-d3ipftzm0n] {
    padding: 0.6rem 0.85rem;
    vertical-align: middle;
    color: #212529;
}

.col-center[b-d3ipftzm0n] {
    text-align: center;
}

.no-value[b-d3ipftzm0n] {
    color: #ced4da;
}

.nm-id[b-d3ipftzm0n] {
    font-size: 0.8rem;
    color: #6c757d;
    font-variant-numeric: tabular-nums;
}

.nm-menu-name[b-d3ipftzm0n] {
    font-family: monospace;
    font-size: 0.82rem;
    background: #e9ecef;
    padding: 0.15rem 0.4rem;
    border-radius: 4px;
    white-space: nowrap;
}

.nm-text[b-d3ipftzm0n] {
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.nm-indent[b-d3ipftzm0n] {
    color: #adb5bd;
    font-size: 0.8rem;
    flex-shrink: 0;
}

.nm-row--child td[b-d3ipftzm0n] {
    background: #fafafa;
    color: #495057;
}

.nm-uri[b-d3ipftzm0n] {
    font-size: 0.8rem;
    font-family: monospace;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nm-rank[b-d3ipftzm0n] {
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.nm-parent[b-d3ipftzm0n] {
    text-align: center;
    font-size: 0.82rem;
    color: #6c757d;
}

.nm-icon[b-d3ipftzm0n] {
    text-align: center;
    font-size: 1rem;
}

.nm-bootstrap code[b-d3ipftzm0n] {
    font-size: 0.78rem;
    background: #f8f9fa;
    padding: 0.1rem 0.35rem;
    border-radius: 3px;
}

.nm-actions[b-d3ipftzm0n] {
    display: flex;
    justify-content: center;
    gap: 0.35rem;
}

/* ── Role badges ── */
.nm-roles[b-d3ipftzm0n] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.nm-role[b-d3ipftzm0n] {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.15rem 0.45rem;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.nm-role--public[b-d3ipftzm0n]    { background: #e2e3e5; color: #383d41; }
.nm-role--admin[b-d3ipftzm0n]     { background: #cfe2ff; color: #084298; }
.nm-role--ops[b-d3ipftzm0n]       { background: #d1e7dd; color: #0a3622; }
.nm-role--customer[b-d3ipftzm0n]  { background: #fff3cd; color: #664d03; }
.nm-role--*[b-d3ipftzm0n]         { background: #f8d7da; color: #842029; }

/* ── Modal backdrop ── */
.nm-modal-backdrop[b-d3ipftzm0n] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 1040;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

/* ── Modal ── */
.nm-modal[b-d3ipftzm0n] {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.18);
    width: 100%;
    max-width: 680px;
    max-height: 90vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.nm-modal--sm[b-d3ipftzm0n] {
    max-width: 440px;
}

.nm-modal-header[b-d3ipftzm0n] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #dee2e6;
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 1;
}

.nm-modal-header h2[b-d3ipftzm0n] {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.nm-modal-close[b-d3ipftzm0n] {
    background: none;
    border: none;
    font-size: 1.1rem;
    color: #6c757d;
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
    border-radius: 4px;
    transition: color 0.15s;
}

.nm-modal-close:hover[b-d3ipftzm0n] {
    color: #212529;
}

.nm-modal-body[b-d3ipftzm0n] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    flex: 1;
}

.nm-modal-footer[b-d3ipftzm0n] {
    padding: 1rem 1.5rem;
    border-top: 1px solid #dee2e6;
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    background: #f8f9fa;
    border-radius: 0 0 12px 12px;
}

/* ── Form helpers ── */
.form-group[b-d3ipftzm0n] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.form-group label[b-d3ipftzm0n] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #495057;
}

.required[b-d3ipftzm0n] {
    color: #dc3545;
}

.field-error[b-d3ipftzm0n] {
    font-size: 0.78rem;
    color: #dc3545;
}

.field-hint[b-d3ipftzm0n] {
    font-size: 0.77rem;
    color: #6c757d;
}

.form-row-2[b-d3ipftzm0n] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.nm-role-toggles[b-d3ipftzm0n] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.35rem;
}

/* ── Drag-and-drop ── */
.nm-th-drag[b-d3ipftzm0n] {
    width: 32px;
}

.nm-drag-handle[b-d3ipftzm0n] {
    width: 32px;
    text-align: center;
    color: #ced4da;
    cursor: grab;
}

.nm-table tbody tr:active .nm-drag-handle[b-d3ipftzm0n] {
    cursor: grabbing;
}

.nm-row--drag-over td[b-d3ipftzm0n] {
    background: #e8f4fd;
    border-top: 2px solid #0d6efd;
}

/* ── URI mode toggles ── */
.nm-uri-mode-toggles[b-d3ipftzm0n] {
    display: flex;
    gap: 0.4rem;
    margin-bottom: 0.25rem;
}

/* ── Table header alignment overrides ── */
.nm-table th.col-center[b-d3ipftzm0n] { text-align: center; }
/* /Components/Pages/AdminOrder.razor.rz.scp.css */
/* Page layout */
.admin-order-page[b-vi6dhzm86j] {
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-vi6dhzm86j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-vi6dhzm86j] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-vi6dhzm86j] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Error */
.detail-error[b-vi6dhzm86j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 2rem;
    text-align: center;
    color: var(--secondary-color);
}

.detail-error i[b-vi6dhzm86j] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}
/* /Components/Pages/AdminOrderConfirm.razor.rz.scp.css */
/* Page layout */
.admin-order-confirm-page[b-yx91l4ts82] {
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-yx91l4ts82] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-yx91l4ts82] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-yx91l4ts82] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Error */
.detail-error[b-yx91l4ts82] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 2rem;
    text-align: center;
    color: var(--secondary-color);
}

.detail-error i[b-yx91l4ts82] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}

/* Header */
.order-detail-header[b-yx91l4ts82] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.back-link[b-yx91l4ts82] {
    font-size: 0.875rem;
    text-decoration: none;
    color: #6c757d;
    margin-bottom: 0.5rem;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.back-link:hover[b-yx91l4ts82] {
    color: #0d6efd;
}

.order-detail-title-row[b-yx91l4ts82] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.order-detail-title-row h1[b-yx91l4ts82] {
    font-size: 1.5rem;
    margin: 0;
}

.order-id-badge[b-yx91l4ts82] {
    font-weight: 600;
}

.order-placed-date[b-yx91l4ts82] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0;
}

.order-customer-name[b-yx91l4ts82] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #212529;
    margin: 0.1rem 0 0;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

/* Status badges */
.order-status-badge[b-yx91l4ts82] {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.25rem 0.625rem;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.order-status-badge--created[b-yx91l4ts82]   { background: #e2e3e5; color: #383d41; }
.order-status-badge--confirmed[b-yx91l4ts82] { background: #cce5ff; color: #004085; }
.order-status-badge--processing[b-yx91l4ts82]{ background: #fff3cd; color: #856404; }
.order-status-badge--shipped[b-yx91l4ts82]   { background: #d4edda; color: #155724; }
.order-status-badge--delivered[b-yx91l4ts82]  { background: #d1ecf1; color: #0c5460; }
.order-status-badge--cancelled[b-yx91l4ts82]  { background: #f8d7da; color: #721c24; }

/* Body */
.order-detail-body[b-yx91l4ts82] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Cards */
.order-detail-card[b-yx91l4ts82] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    padding: 1.25rem;
}

.card-section-title[b-yx91l4ts82] {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 1rem;
    color: #212529;
}

/* Items table */
.order-items-table-wrapper[b-yx91l4ts82] {
    overflow-x: auto;
}

.order-items-table[b-yx91l4ts82] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.order-items-table th[b-yx91l4ts82],
.order-items-table td[b-yx91l4ts82] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid #e9ecef;
    vertical-align: middle;
}

.order-items-table th[b-yx91l4ts82] {
    font-weight: 600;
    color: #6c757d;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.col-right[b-yx91l4ts82] {
    text-align: right;
}

.col-center[b-yx91l4ts82] {
    text-align: center;
}

.col-qty[b-yx91l4ts82] {
    width: 80px;
}

.col-action[b-yx91l4ts82] {
    width: 48px;
}

.qty-input[b-yx91l4ts82] {
    width: 70px;
    text-align: right;
    display: inline-block;
}

.btn-icon[b-yx91l4ts82] {
    padding: 0.2rem 0.4rem;
    line-height: 1;
}

/* Marketing badge */
.badge-marketing[b-yx91l4ts82] {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 600;
    padding: 0.15rem 0.45rem;
    border-radius: 999px;
    background: #e8daef;
    color: #6c3483;
    margin-left: 0.35rem;
    vertical-align: middle;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

/* Quick add */
.quick-add-section[b-yx91l4ts82] {
    margin-top: 1rem;
    border-top: 1px solid #e9ecef;
    padding-top: 1rem;
}

.quick-add-row[b-yx91l4ts82] {
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
}

.quick-add-search-wrapper[b-yx91l4ts82] {
    position: relative;
    flex: 1;
    max-width: 400px;
}

.quick-add-results[b-yx91l4ts82] {
    position: absolute;
    z-index: 100;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
    list-style: none;
    margin: 0.25rem 0 0;
    padding: 0.25rem 0;
    width: 100%;
    max-height: 280px;
    overflow-y: auto;
}

.quick-add-results li[b-yx91l4ts82] {
    padding: 0.45rem 0.75rem;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.85rem;
}

.quick-add-results li:hover[b-yx91l4ts82] {
    background: #f0f4ff;
}

.qa-name[b-yx91l4ts82] {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-right: 0.5rem;
}

.qa-price[b-yx91l4ts82] {
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
}

/* Custom line item */
.custom-line-item-section[b-yx91l4ts82] {
    margin-top: 1rem;
    border-top: 1px solid #e9ecef;
    padding-top: 1rem;
}

.custom-line-item-title[b-yx91l4ts82] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    margin: 0 0 0.6rem;
}

.custom-line-item-row[b-yx91l4ts82] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
}

.custom-line-item-row .description-input[b-yx91l4ts82] {
    flex: 1;
    min-width: 160px;
}

/* Summary amounts */
.amounts-list[b-yx91l4ts82] {
    margin: 0;
    padding: 0;
}

.amounts-row[b-yx91l4ts82] {
    display: flex;
    justify-content: space-between;
    padding: 0.4rem 0;
    font-size: 0.9rem;
}

.amounts-row dt[b-yx91l4ts82] {
    font-weight: 500;
    color: #495057;
}

.amounts-row dd[b-yx91l4ts82] {
    font-weight: 500;
    margin: 0;
}

.amounts-row--editable dd[b-yx91l4ts82] {
    max-width: 160px;
}

.amount-input-group[b-yx91l4ts82] {
    max-width: 140px;
}

.amounts-row--credit dt[b-yx91l4ts82],
.amounts-row--credit dd[b-yx91l4ts82] {
    color: #198754;
}

.amounts-row--total[b-yx91l4ts82] {
    border-top: 2px solid #212529;
    margin-top: 0.25rem;
    padding-top: 0.6rem;
}

.amounts-row--total dt[b-yx91l4ts82],
.amounts-row--total dd[b-yx91l4ts82] {
    font-weight: 700;
    font-size: 1rem;
}

/* Actions card */
.actions-card[b-yx91l4ts82] {
    display: flex;
    flex-direction: column;
}

/* Success panel */
.success-panel[b-yx91l4ts82] {
    background: #fff;
    border: 1px solid #d1e7dd;
    border-radius: 0.75rem;
    padding: 3rem 2rem;
    text-align: center;
    color: #0f5132;
    margin: 2rem 0;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.success-icon[b-yx91l4ts82] {
    font-size: 4rem;
    color: #198754;
    margin-bottom: 1rem;
}

.success-panel h2[b-yx91l4ts82] {
    margin: 0 0 0.75rem;
    font-size: 1.5rem;
    font-weight: 700;
}

.success-panel p[b-yx91l4ts82] {
    color: #495057;
    margin-bottom: 0;
}

.success-actions[b-yx91l4ts82] {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 1.75rem;
}

.confirm-actions[b-yx91l4ts82] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
}

.cancel-inline[b-yx91l4ts82] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
}

@media (max-width: 600px) {
    .admin-order-confirm-page[b-yx91l4ts82] {
        padding: 1rem;
    }

    .confirm-actions[b-yx91l4ts82] {
        flex-direction: column;
        align-items: stretch;
    }

    .cancel-inline[b-yx91l4ts82] {
        flex-direction: column;
        align-items: stretch;
    }
}
/* /Components/Pages/AdminOrderDetail.razor.rz.scp.css */
/* Page layout */
.order-detail-page[b-v9zisfv1sz] {
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-v9zisfv1sz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-v9zisfv1sz] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-v9zisfv1sz] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Error */
.detail-error[b-v9zisfv1sz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 2rem;
    text-align: center;
    color: var(--secondary-color);
}

.detail-error i[b-v9zisfv1sz] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}

/* Header */
.order-detail-header[b-v9zisfv1sz] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.back-link[b-v9zisfv1sz] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-v9zisfv1sz] {
    text-decoration: underline;
}

.order-detail-title-row[b-v9zisfv1sz] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.order-detail-title-row h1[b-v9zisfv1sz] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.order-id-badge[b-v9zisfv1sz] {
    font-family: monospace;
}

.order-placed-date[b-v9zisfv1sz] {
    margin: 0;
    font-size: 0.9rem;
    color: var(--secondary-color);
}

/* Cards */
.order-detail-body[b-v9zisfv1sz] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.order-detail-card[b-v9zisfv1sz] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 1.5rem;
}

.card-section-title[b-v9zisfv1sz] {
    font-size: 1rem;
    font-weight: 600;
    color: #2c3e50;
    margin: 0 0 1rem 0;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--border-color);
}

/* Items table */
.order-items-table-wrapper[b-v9zisfv1sz] {
    overflow-x: auto;
}

.order-items-table[b-v9zisfv1sz] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.order-items-table thead tr[b-v9zisfv1sz] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.order-items-table th[b-v9zisfv1sz] {
    padding: 0.6rem 0.75rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.order-items-table td[b-v9zisfv1sz] {
    padding: 0.65rem 0.75rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.order-items-table tbody tr:last-child td[b-v9zisfv1sz] {
    border-bottom: none;
}

.col-right[b-v9zisfv1sz] {
    text-align: right !important;
}

/* Amounts */
.amounts-list[b-v9zisfv1sz] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin: 0;
    max-width: 360px;
    margin-left: auto;
}

.amounts-row[b-v9zisfv1sz] {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    color: #2c3e50;
}

.amounts-row dt[b-v9zisfv1sz] {
    font-weight: 400;
    color: var(--secondary-color);
}

.amounts-row dd[b-v9zisfv1sz] {
    margin: 0;
    font-variant-numeric: tabular-nums;
}

.amounts-row--total[b-v9zisfv1sz] {
    padding-top: 0.5rem;
    border-top: 2px solid var(--border-color);
    margin-top: 0.25rem;
}

.amounts-row--total dt[b-v9zisfv1sz],
.amounts-row--total dd[b-v9zisfv1sz] {
    font-weight: 700;
    font-size: 1rem;
    color: #2c3e50;
}

.amounts-row--credit dt[b-v9zisfv1sz],
.amounts-row--credit dd[b-v9zisfv1sz] {
    color: #198754;
}

/* Invoice section */
.invoice-section[b-v9zisfv1sz] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.invoice-number[b-v9zisfv1sz] {
    font-family: monospace;
    font-weight: 600;
    font-size: 0.95rem;
    color: #2c3e50;
}

.invoice-download-btn[b-v9zisfv1sz] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

/* Cancel card */
.cancel-card[b-v9zisfv1sz] {
    border: 1px solid #f8d7da;
}

.cancel-description[b-v9zisfv1sz] {
    font-size: 0.9rem;
    color: var(--secondary-color);
    margin: 0 0 1rem 0;
}

.cancel-confirm-text[b-v9zisfv1sz] {
    font-size: 0.9rem;
    color: #2c3e50;
    margin: 0 0 1rem 0;
}

.cancel-confirm-actions[b-v9zisfv1sz] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.cancel-error[b-v9zisfv1sz] {
    font-size: 0.875rem;
    color: #dc3545;
}

/* Status badges */
.order-status-badge[b-v9zisfv1sz] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
}

.order-status-badge--created[b-v9zisfv1sz] {
    background: #e7f1ff;
    color: var(--primary-color);
}

.order-status-badge--confirmed[b-v9zisfv1sz] {
    background: #fff3cd;
    color: #856404;
}

.order-status-badge--processing[b-v9zisfv1sz] {
    background: #fff3cd;
    color: #856404;
}

.order-status-badge--shipped[b-v9zisfv1sz] {
    background: #d1f0e0;
    color: #0a6640;
}

.order-status-badge--delivered[b-v9zisfv1sz] {
    background: #d1f0e0;
    color: #0a6640;
}

.order-status-badge--cancelled[b-v9zisfv1sz] {
    background: #f8d7da;
    color: #842029;
}
/* /Components/Pages/AdminRecipes.razor.rz.scp.css */
/* Page layout */
.recipes-page[b-nx21sx5jok] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-nx21sx5jok] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-nx21sx5jok] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-nx21sx5jok] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.recipes-header[b-nx21sx5jok] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.recipes-header-top[b-nx21sx5jok] {
    display: flex;
    align-items: center;
}

.recipes-header-row[b-nx21sx5jok] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.recipes-header-row h1[b-nx21sx5jok] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-nx21sx5jok] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-nx21sx5jok] {
    text-decoration: underline;
}

.btn-add[b-nx21sx5jok] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* Filters */
.recipes-filters[b-nx21sx5jok] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.recipes-filter-row[b-nx21sx5jok] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.recipes-filter-input-wrapper[b-nx21sx5jok] {
    position: relative;
    display: flex;
    align-items: center;
    flex: 2 1 260px;
    min-width: 200px;
}

.recipes-filter-input-wrapper > i[b-nx21sx5jok] {
    position: absolute;
    left: 0.75rem;
    color: var(--secondary-color);
    font-size: 0.9rem;
    pointer-events: none;
}

.recipes-filter-input[b-nx21sx5jok] {
    width: 100%;
    padding: 0.5rem 2.25rem 0.5rem 2.25rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    font-size: 0.9rem;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.recipes-filter-input:focus[b-nx21sx5jok] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 105, 217, 0.12);
}

.recipes-filter-clear[b-nx21sx5jok] {
    position: absolute;
    right: 0.5rem;
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
    font-size: 0.8rem;
    border-radius: 4px;
    transition: color 0.15s;
}

.recipes-filter-clear:hover[b-nx21sx5jok] {
    color: var(--text-color);
}

.recipes-filter-actions[b-nx21sx5jok] {
    display: flex;
    align-items: center;
}

/* Card */
.recipes-card[b-nx21sx5jok] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-nx21sx5jok] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-nx21sx5jok] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-nx21sx5jok] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.recipes-table-wrapper[b-nx21sx5jok] {
    overflow-x: auto;
}

.recipes-table[b-nx21sx5jok] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.recipes-table thead tr[b-nx21sx5jok] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.recipes-table th[b-nx21sx5jok] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.recipes-table td[b-nx21sx5jok] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.recipes-table tbody tr:last-child td[b-nx21sx5jok] {
    border-bottom: none;
}

.recipes-table tbody tr:hover[b-nx21sx5jok] {
    background: #f8f9fa;
}

.col-right[b-nx21sx5jok] {
    text-align: right;
}

.col-center[b-nx21sx5jok] {
    text-align: center;
    width: 5rem;
}

.col-toggle[b-nx21sx5jok] {
    width: 2.5rem;
    text-align: center;
    padding: 0 0.25rem;
}

.col-actions[b-nx21sx5jok] {
    width: 7rem;
}

.no-value[b-nx21sx5jok] {
    color: var(--secondary-color);
    opacity: 0.6;
}

/* Product rows */
.product-row td[b-nx21sx5jok] {
    background: var(--background-color);
    font-size: 0.875rem;
    border-bottom: 1px solid var(--border-color);
}

.product-row--expanded td[b-nx21sx5jok] {
    border-bottom: none;
}

.product-row:hover td[b-nx21sx5jok] {
    background: #eef2f7;
}

.expand-toggle[b-nx21sx5jok] {
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.2rem;
    line-height: 1;
    border-radius: 4px;
    transition: color 0.15s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
}

.expand-toggle:hover[b-nx21sx5jok] {
    color: var(--text-color);
    background: rgba(0, 0, 0, 0.06);
}

.product-name[b-nx21sx5jok] {
    font-weight: 600;
    color: #2c3e50;
    margin-right: 0.6rem;
}

.ingredient-count-badge[b-nx21sx5jok] {
    display: inline-block;
    padding: 0.15rem 0.55rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 500;
    background: #e8f4fd;
    color: #1565c0;
    white-space: nowrap;
}

/* Ingredient sub-rows */
.ingredient-row td[b-nx21sx5jok] {
    background: white;
    border-bottom: 1px solid #f0f2f5;
}

.ingredient-row:last-child td[b-nx21sx5jok] {
    border-bottom: 1px solid var(--border-color);
}

.ingredient-row:hover td[b-nx21sx5jok] {
    background: #f8f9fa;
}

.ingredient-indent[b-nx21sx5jok] {
    color: #adb5bd;
    font-size: 0.85rem;
}

.ingredient-name[b-nx21sx5jok] {
    font-size: 0.875rem;
    color: #495057;
}

.ingredient-uom[b-nx21sx5jok] {
    margin-left: 0.4rem;
    font-size: 0.78rem;
    color: var(--secondary-color);
    font-style: italic;
}

/* Pager */
.recipes-pager[b-nx21sx5jok] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-wrap: wrap;
    gap: 0.5rem;
}

.recipes-pager-info[b-nx21sx5jok] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.recipes-pager-controls[b-nx21sx5jok] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.recipes-pager-current[b-nx21sx5jok] {
    font-size: 0.85rem;
    color: var(--secondary-color);
    white-space: nowrap;
}

/* Modal */
.recipes-modal-backdrop[b-nx21sx5jok] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 1rem;
}

.recipes-modal[b-nx21sx5jok] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    width: 100%;
    max-width: 560px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.recipes-modal--sm[b-nx21sx5jok] {
    max-width: 440px;
}

.recipes-modal-header[b-nx21sx5jok] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    background: var(--background-color);
    flex-shrink: 0;
}

.recipes-modal-header h2[b-nx21sx5jok] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.recipes-modal-close[b-nx21sx5jok] {
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    font-size: 1rem;
    border-radius: 4px;
    line-height: 1;
    transition: color 0.15s;
}

.recipes-modal-close:hover[b-nx21sx5jok] {
    color: var(--text-color);
}

.recipes-modal-body[b-nx21sx5jok] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    overflow-y: auto;
}

.recipes-modal-footer[b-nx21sx5jok] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-shrink: 0;
}

/* Form helpers */
.form-row-2[b-nx21sx5jok] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-row-checks[b-nx21sx5jok] {
    display: flex;
    gap: 2rem;
    align-items: center;
}

.form-section-title[b-nx21sx5jok] {
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--secondary-color);
}

.form-group[b-nx21sx5jok] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-nx21sx5jok] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
}

.required[b-nx21sx5jok] {
    color: #dc3545;
}

.field-error[b-nx21sx5jok] {
    font-size: 0.8rem;
    color: #dc3545;
}

/* Delete confirmation */
.delete-detail[b-nx21sx5jok] {
    font-size: 0.9rem;
    color: #495057;
    background: var(--background-color);
    border-radius: 8px;
    padding: 0.75rem 1rem;
    margin: 0;
}
/* /Components/Pages/AdminSalesPrices.razor.rz.scp.css */
/* Page layout */
.sp-page[b-xbdvvupgrq] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-xbdvvupgrq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-xbdvvupgrq] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-xbdvvupgrq] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.sp-header[b-xbdvvupgrq] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.sp-header-top[b-xbdvvupgrq] {
    display: flex;
    align-items: center;
}

.sp-header-row[b-xbdvvupgrq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.sp-header-row h1[b-xbdvvupgrq] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-xbdvvupgrq] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-xbdvvupgrq] {
    text-decoration: underline;
}

.btn-add[b-xbdvvupgrq] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* Controls */
.sp-controls[b-xbdvvupgrq] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.sp-controls-row[b-xbdvvupgrq] {
    display: flex;
    align-items: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.sp-period-select[b-xbdvvupgrq] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    flex: 1 1 280px;
    min-width: 220px;
}

.sp-period-select label[b-xbdvvupgrq] {
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--secondary-color);
}

.sp-filter-input-wrapper[b-xbdvvupgrq] {
    position: relative;
    display: flex;
    align-items: center;
    flex: 2 1 220px;
    min-width: 180px;
}

.sp-filter-input-wrapper > i[b-xbdvvupgrq] {
    position: absolute;
    left: 0.75rem;
    color: var(--secondary-color);
    font-size: 0.9rem;
    pointer-events: none;
}

.sp-filter-input[b-xbdvvupgrq] {
    width: 100%;
    padding: 0.5rem 2.25rem 0.5rem 2.25rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    font-size: 0.9rem;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.sp-filter-input:focus[b-xbdvvupgrq] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 105, 217, 0.12);
}

.sp-filter-clear[b-xbdvvupgrq] {
    position: absolute;
    right: 0.5rem;
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
    font-size: 0.8rem;
    border-radius: 4px;
    transition: color 0.15s;
}

.sp-filter-clear:hover[b-xbdvvupgrq] {
    color: var(--text-color);
}

.sp-filter-group[b-xbdvvupgrq] {
    flex: 1 1 150px;
    min-width: 140px;
}

.sp-filter-actions[b-xbdvvupgrq] {
    display: flex;
    align-items: center;
}

/* Card */
.sp-card[b-xbdvvupgrq] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-xbdvvupgrq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-xbdvvupgrq] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-xbdvvupgrq] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.sp-table-wrapper[b-xbdvvupgrq] {
    overflow-x: auto;
}

.sp-table[b-xbdvvupgrq] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.sp-table thead tr[b-xbdvvupgrq] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.sp-table th[b-xbdvvupgrq] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.sp-table td[b-xbdvvupgrq] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.sp-table tbody tr:last-child td[b-xbdvvupgrq] {
    border-bottom: none;
}

.sp-table tbody tr:hover[b-xbdvvupgrq] {
    background: #f8f9fa;
}

.col-right[b-xbdvvupgrq] {
    text-align: right;
}

.sp-table th.col-right[b-xbdvvupgrq] {
    text-align: right;
}

.sp-table th.col-center[b-xbdvvupgrq] {
    text-align: center;
}

.col-center[b-xbdvvupgrq] {
    text-align: center;
    width: 7rem;
}

.item-name[b-xbdvvupgrq] {
    font-weight: 500;
}

.price-cell[b-xbdvvupgrq] {
    font-variant-numeric: tabular-nums;
    font-weight: 500;
}

.no-value[b-xbdvvupgrq] {
    color: var(--secondary-color);
    opacity: 0.6;
}

.shop-use-row[b-xbdvvupgrq] {
    background: #fefce8;
}

.shop-use-row:hover[b-xbdvvupgrq] {
    background: #fef9c3 !important;
}

/* Inline edit */
.inline-edit[b-xbdvvupgrq] {
    width: 90px;
    text-align: right;
    display: inline-block;
    margin-left: auto;
}

/* Type badges */
.type-badge[b-xbdvvupgrq] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.6rem;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 500;
    white-space: nowrap;
}

.type-badge--retail[b-xbdvvupgrq] {
    background: #d4edda;
    color: #155724;
}

.type-badge--shop[b-xbdvvupgrq] {
    background: #fff3cd;
    color: #856404;
}

/* Actions cell */
.actions-cell[b-xbdvvupgrq] {
    display: flex;
    gap: 0.35rem;
    justify-content: center;
    align-items: center;
}

/* Table footer */
.sp-table-footer[b-xbdvvupgrq] {
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--border-color);
    display: flex;
    justify-content: flex-start;
}

/* Pager */
.sp-pager[b-xbdvvupgrq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-wrap: wrap;
    gap: 0.5rem;
}

.sp-pager-info[b-xbdvvupgrq] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.sp-pager-controls[b-xbdvvupgrq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.sp-pager-current[b-xbdvvupgrq] {
    font-size: 0.85rem;
    color: var(--secondary-color);
    white-space: nowrap;
}

/* Modal */
.sp-modal-backdrop[b-xbdvvupgrq] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 1rem;
}

.sp-modal[b-xbdvvupgrq] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    width: 100%;
    max-width: 560px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.sp-modal--sm[b-xbdvvupgrq] {
    max-width: 440px;
}

.sp-modal-header[b-xbdvvupgrq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    background: var(--background-color);
    flex-shrink: 0;
}

.sp-modal-header h2[b-xbdvvupgrq] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.sp-modal-close[b-xbdvvupgrq] {
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    font-size: 1rem;
    border-radius: 4px;
    line-height: 1;
    transition: color 0.15s;
}

.sp-modal-close:hover[b-xbdvvupgrq] {
    color: var(--text-color);
}

.sp-modal-body[b-xbdvvupgrq] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    overflow-y: auto;
}

.sp-modal-footer[b-xbdvvupgrq] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-shrink: 0;
}

.modal-description[b-xbdvvupgrq] {
    color: var(--secondary-color);
    font-size: 0.9rem;
    margin: 0;
    line-height: 1.5;
}

/* Form helpers */
.form-row-2[b-xbdvvupgrq] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-group[b-xbdvvupgrq] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-xbdvvupgrq] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
}

.required[b-xbdvvupgrq] {
    color: #dc3545;
}

@media (max-width: 600px) {
    .form-row-2[b-xbdvvupgrq] {
        grid-template-columns: 1fr;
    }

    .sp-controls-row[b-xbdvvupgrq] {
        flex-direction: column;
        align-items: stretch;
    }

    .sp-filter-group[b-xbdvvupgrq] {
        min-width: unset;
    }

    .sp-period-select[b-xbdvvupgrq] {
        min-width: unset;
    }
}
/* /Components/Pages/AdminServices.razor.rz.scp.css */
.loading-container[b-u6c6wyoja0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-u6c6wyoja0] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-u6c6wyoja0] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

.svc-page[b-u6c6wyoja0] {
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.svc-header[b-u6c6wyoja0] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.svc-header-top[b-u6c6wyoja0] {
    display: flex;
    align-items: center;
}

.svc-header-row[b-u6c6wyoja0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.svc-header h1[b-u6c6wyoja0] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.svc-subtitle[b-u6c6wyoja0] {
    margin: 0;
    font-size: 0.9rem;
    color: var(--secondary-color);
}

.back-link[b-u6c6wyoja0] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-u6c6wyoja0] {
    text-decoration: underline;
}

.svc-card[b-u6c6wyoja0] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.no-data[b-u6c6wyoja0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-u6c6wyoja0] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-u6c6wyoja0] {
    margin: 0;
    font-size: 0.9rem;
}

.svc-table[b-u6c6wyoja0] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.svc-table thead tr[b-u6c6wyoja0] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.svc-table th[b-u6c6wyoja0] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.svc-table td[b-u6c6wyoja0] {
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.svc-table tbody tr:last-child td[b-u6c6wyoja0] {
    border-bottom: none;
}

.svc-table tbody tr:hover[b-u6c6wyoja0] {
    background: #f8f9fa;
}

.col-center[b-u6c6wyoja0] {
    text-align: center !important;
}

.col-right[b-u6c6wyoja0] {
    text-align: right !important;
}

.svc-name[b-u6c6wyoja0] {
    font-weight: 600;
    color: #2c3e50;
}

.svc-type[b-u6c6wyoja0] {
    font-size: 0.78rem;
    color: var(--secondary-color);
    font-family: monospace;
    margin-top: 0.15rem;
}

.status-badge[b-u6c6wyoja0] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.3rem 0.65rem;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 600;
    white-space: nowrap;
}

.status-badge--active[b-u6c6wyoja0] {
    background: #d4edda;
    color: #155724;
}

.status-badge--paused[b-u6c6wyoja0] {
    background: #fff3cd;
    color: #856404;
}

.toggle-switch[b-u6c6wyoja0] {
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 0;
}

.toggle-switch .form-check-input[b-u6c6wyoja0] {
    width: 2.5em;
    height: 1.25em;
    cursor: pointer;
}

.updated-at[b-u6c6wyoja0] {
    font-size: 0.82rem;
    color: var(--secondary-color);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}
/* /Components/Pages/AdminUsers.razor.rz.scp.css */
/* ── Page layout ── */
.usr-page[b-i9ruowm7x8] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ── Loading ── */
.loading-container[b-i9ruowm7x8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-i9ruowm7x8] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-i9ruowm7x8] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* ── Header ── */
.usr-header[b-i9ruowm7x8] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.usr-header-top[b-i9ruowm7x8] {
    display: flex;
    align-items: center;
}

.back-link[b-i9ruowm7x8] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-i9ruowm7x8] {
    text-decoration: underline;
}

.usr-header-row[b-i9ruowm7x8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.usr-header-row h1[b-i9ruowm7x8] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

/* ── Filters ── */
.usr-filters[b-i9ruowm7x8] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    padding: 1rem 1.25rem;
}

.usr-filter-row[b-i9ruowm7x8] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: flex-end;
}

.usr-filter-group[b-i9ruowm7x8] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1 1 140px;
}

.usr-filter-group label[b-i9ruowm7x8] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #495057;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.usr-filter-actions[b-i9ruowm7x8] {
    display: flex;
    align-items: flex-end;
}

/* ── Card ── */
.usr-card[b-i9ruowm7x8] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    overflow: hidden;
}

/* ── Table ── */
.usr-table-wrapper[b-i9ruowm7x8] {
    overflow-x: auto;
}

.usr-table[b-i9ruowm7x8] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.usr-table thead tr[b-i9ruowm7x8] {
    background: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
}

.usr-table th[b-i9ruowm7x8] {
    padding: 0.75rem 1rem;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
    text-align: left;
}

.usr-table td[b-i9ruowm7x8] {
    padding: 0.7rem 1rem;
    border-bottom: 1px solid #f0f0f0;
    vertical-align: middle;
}

.usr-table tbody tr:last-child td[b-i9ruowm7x8] {
    border-bottom: none;
}

.usr-table tbody tr:hover[b-i9ruowm7x8] {
    background: #f8f9fa;
}

.col-center[b-i9ruowm7x8] {
    text-align: center !important;
}

.usr-name[b-i9ruowm7x8] {
    font-weight: 600;
    white-space: nowrap;
}

.usr-email[b-i9ruowm7x8] {
    color: #495057;
}

.usr-mobile[b-i9ruowm7x8] {
    white-space: nowrap;
    color: #6c757d;
    font-size: 0.85rem;
}

.usr-customer[b-i9ruowm7x8] {
    color: #495057;
}

.no-value[b-i9ruowm7x8] {
    color: #adb5bd;
}

/* ── Role badge ── */
.usr-role[b-i9ruowm7x8] {
    display: inline-block;
    padding: 0.2rem 0.55rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    background: #e9ecef;
    color: #495057;
}

.usr-role--admin[b-i9ruowm7x8] {
    background: #cfe2ff;
    color: #084298;
}

.usr-role--customer[b-i9ruowm7x8] {
    background: #d1e7dd;
    color: #0a3622;
}

.usr-role--ops[b-i9ruowm7x8] {
    background: #fff3cd;
    color: #664d03;
}

/* ── Must change password indicator ── */
.usr-must-change[b-i9ruowm7x8] {
    color: #dc3545;
    font-size: 1.1rem;
}

/* ── Reset password button ── */
.btn-reset-pw[b-i9ruowm7x8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background: #fff;
    color: #6c757d;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
    font-size: 0.95rem;
}

.btn-reset-pw:hover:not(:disabled)[b-i9ruowm7x8] {
    background: #fff3cd;
    border-color: #ffc107;
    color: #664d03;
}

.btn-reset-pw:disabled[b-i9ruowm7x8] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── Empty state ── */
.no-data[b-i9ruowm7x8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    color: #adb5bd;
    gap: 0.75rem;
}

.no-data i[b-i9ruowm7x8] {
    font-size: 2.5rem;
}

.no-data p[b-i9ruowm7x8] {
    margin: 0;
    font-size: 1rem;
}

/* ── Pager ── */
.usr-pager[b-i9ruowm7x8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1.25rem;
    border-top: 1px solid #dee2e6;
    background: #f8f9fa;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.usr-pager-info[b-i9ruowm7x8] {
    font-size: 0.85rem;
    color: #6c757d;
}

.usr-pager-controls[b-i9ruowm7x8] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.usr-pager-current[b-i9ruowm7x8] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #495057;
}

/* ── Reset password toast ── */
.usr-reset-toast[b-i9ruowm7x8] {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 1050;
    cursor: pointer;
    animation: slideUp-b-i9ruowm7x8 0.25s ease-out;
}

@keyframes slideUp-b-i9ruowm7x8 {
    from { transform: translateY(1rem); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}

.usr-reset-toast-inner[b-i9ruowm7x8] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-left: 4px solid #198754;
    border-radius: 10px;
    padding: 1rem 1.25rem;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    min-width: 280px;
    max-width: 360px;
}

.usr-reset-toast-inner > i[b-i9ruowm7x8] {
    color: #198754;
    font-size: 1.3rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.usr-reset-toast-inner div[b-i9ruowm7x8] {
    flex: 1;
}

.usr-reset-toast-inner strong[b-i9ruowm7x8] {
    display: block;
    font-size: 0.9rem;
    color: #2c3e50;
}

.usr-reset-toast-inner p[b-i9ruowm7x8] {
    margin: 0.25rem 0 0;
    font-size: 0.85rem;
    color: #495057;
}

.usr-reset-pw-value[b-i9ruowm7x8] {
    font-family: monospace;
    font-weight: 700;
    font-size: 1rem;
    color: #0d6efd;
    letter-spacing: 0.08em;
}

.usr-reset-toast-inner small[b-i9ruowm7x8] {
    display: block;
    margin-top: 0.2rem;
    font-size: 0.78rem;
    color: #6c757d;
}

.usr-reset-toast-close[b-i9ruowm7x8] {
    background: none;
    border: none;
    color: #adb5bd;
    cursor: pointer;
    padding: 0;
    font-size: 0.9rem;
    flex-shrink: 0;
    line-height: 1;
}

.usr-reset-toast-close:hover[b-i9ruowm7x8] {
    color: #6c757d;
}
/* /Components/Pages/BankStatementImport.razor.rz.scp.css */
/* ── Page layout ── */
.bsi-page[b-4yhrnaeg8w] {
    padding: 2rem;
    max-width: 1600px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ── Page header ── */
.page-header[b-4yhrnaeg8w] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #004999 100%);
    color: white;
    border-radius: 12px;
    padding: 2rem 2.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    overflow: hidden;
}

.header-text[b-4yhrnaeg8w] {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-width: 0;
}

.page-header h1[b-4yhrnaeg8w] {
    margin: 0 0 0.2rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: white;
}

.page-header p[b-4yhrnaeg8w] {
    margin: 0;
    opacity: 0.85;
    font-size: 0.95rem;
}

.btn-back[b-4yhrnaeg8w] {
    background: rgba(255, 255, 255, 0.15);
    border: none;
    color: white;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    font-size: 1.1rem;
    transition: background 0.2s ease;
}

.btn-back:hover[b-4yhrnaeg8w] {
    background: rgba(255, 255, 255, 0.25);
}

/* ── Cards ── */
.bsi-card[b-4yhrnaeg8w] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    padding: 1.5rem;
}

.section-title[b-4yhrnaeg8w] {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 1.25rem;
    color: #212529;
}

/* ── Upload form ── */
.form-group label[b-4yhrnaeg8w] {
    display: block;
    font-weight: 500;
    margin-bottom: 0.35rem;
    font-size: 0.9rem;
}

.required[b-4yhrnaeg8w] {
    color: #dc3545;
}

.file-info[b-4yhrnaeg8w] {
    font-size: 0.875rem;
    color: #495057;
}

.file-size[b-4yhrnaeg8w] {
    font-size: 0.8rem;
}

/* ── Actions row ── */
.bsi-actions[b-4yhrnaeg8w] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.extraction-progress[b-4yhrnaeg8w] {
    display: flex;
    align-items: center;
    color: #495057;
    font-size: 0.95rem;
}

/* ── Header fields grid ── */
.bsi-header-grid[b-4yhrnaeg8w] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 1rem;
}

/* ── Lines table ── */
.lines-header[b-4yhrnaeg8w] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.bsi-table-wrapper[b-4yhrnaeg8w] {
    overflow-x: auto;
}

.bsi-table[b-4yhrnaeg8w] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
    min-width: 1100px;
}

.bsi-table th[b-4yhrnaeg8w],
.bsi-table td[b-4yhrnaeg8w] {
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid #e9ecef;
    vertical-align: middle;
}

.bsi-table thead th[b-4yhrnaeg8w] {
    background: #f8f9fa;
    font-weight: 600;
    white-space: nowrap;
    position: sticky;
    top: 0;
    z-index: 1;
}

.bsi-table th.col-right[b-4yhrnaeg8w],
.bsi-table td.col-right[b-4yhrnaeg8w] {
    text-align: right;
}

.bsi-table tbody tr:hover[b-4yhrnaeg8w] {
    background: #f8f9fa;
}

.line-needs-review[b-4yhrnaeg8w] {
    background: #fff9e6 !important;
}

.line-needs-review:hover[b-4yhrnaeg8w] {
    background: #fff3cd !important;
}

/* Column widths */
.col-num[b-4yhrnaeg8w]    { width: 60px; }
.col-page[b-4yhrnaeg8w]   { width: 40px; text-align: center; }
.col-date[b-4yhrnaeg8w]   { width: 130px; }
.col-desc[b-4yhrnaeg8w]   { min-width: 180px; }
.col-ref[b-4yhrnaeg8w]    { min-width: 110px; }
.col-money[b-4yhrnaeg8w]  { width: 110px; }
.col-charge[b-4yhrnaeg8w] { width: 110px; }
.col-raw[b-4yhrnaeg8w]    { min-width: 200px; max-width: 300px; }

/* Inline inputs in table */
.input-num[b-4yhrnaeg8w]  { width: 56px; padding: 0.2rem 0.35rem; }
.input-money[b-4yhrnaeg8w] { width: 100px; padding: 0.2rem 0.35rem; text-align: right; }

input.input-warn[b-4yhrnaeg8w] {
    border-color: #ffc107;
    background: #fffde6;
}

/* Raw text / warning cell */
.parse-warning[b-4yhrnaeg8w] {
    display: block;
    font-size: 0.78rem;
    color: #856404;
    background: #fff3cd;
    border-radius: 4px;
    padding: 0.1rem 0.3rem;
    margin-bottom: 0.2rem;
    max-width: 280px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.raw-text[b-4yhrnaeg8w] {
    display: block;
    font-size: 0.75rem;
    color: #6c757d;
    font-family: monospace;
    max-width: 280px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Success page ── */
.bsi-success-page[b-4yhrnaeg8w] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    padding: 2rem;
}

.success-card[b-4yhrnaeg8w] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 12px;
    padding: 3rem 4rem;
    text-align: center;
    max-width: 480px;
    width: 100%;
}

.success-icon[b-4yhrnaeg8w] {
    font-size: 4rem;
    color: #198754;
    margin-bottom: 1.25rem;
}

.success-card h1[b-4yhrnaeg8w] {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.success-card p[b-4yhrnaeg8w] {
    color: #6c757d;
    margin-bottom: 1.75rem;
}

.success-actions[b-4yhrnaeg8w] {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

/* ── Responsive ── */
@media (max-width: 768px) {
    .bsi-page[b-4yhrnaeg8w] {
        padding: 1rem;
    }

    .bsi-header-grid[b-4yhrnaeg8w] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 480px) {
    .bsi-header-grid[b-4yhrnaeg8w] {
        grid-template-columns: 1fr;
    }

    .success-card[b-4yhrnaeg8w] {
        padding: 2rem 1.5rem;
    }
}
/* /Components/Pages/Brands.razor.rz.scp.css */
/* Find a brand Page Styles */
.find-brand-page[b-0aiyay721f] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0;
}

.page-header[b-0aiyay721f] {
    text-align: center;
    padding: 3rem 2rem;
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
    color: white;
    margin: -2rem -2rem 2rem -2rem;
    border-radius: 0 0 1rem 1rem;
}

.page-header .header-icon[b-0aiyay721f] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.9;
}

.page-header h1[b-0aiyay721f] {
    margin: 0 0 0.5rem 0;
    font-size: 2.5rem;
    font-weight: 700;
}

.page-header .lead[b-0aiyay721f] {
    font-size: 1.125rem;
    margin: 0;
    opacity: 0.9;
}

.brand-controls[b-0aiyay721f] {
    display: flex;
    gap: 1rem;
    margin-bottom: 2rem;
    padding: 0 1rem;
    flex-wrap: wrap;
}

.search-box[b-0aiyay721f] {
    flex: 1;
    min-width: 300px;
    position: relative;
}

.search-box i[b-0aiyay721f] {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box .form-control[b-0aiyay721f] {
    padding-left: 2.5rem;
}

.filter-group[b-0aiyay721f] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.filter-group label[b-0aiyay721f] {
    margin: 0;
    white-space: nowrap;
    font-weight: 500;
}

.filter-group .form-select[b-0aiyay721f] {
    min-width: 200px;
}

.brand-count[b-0aiyay721f] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    background-color: #e7f3ff;
    border-radius: 0.5rem;
    margin: 0 1rem 1.5rem 1rem;
    color: #0066cc;
    font-weight: 500;
}

.brand-count i[b-0aiyay721f] {
    font-size: 1.25rem;
}

.loading-container[b-0aiyay721f] {
    text-align: center;
    padding: 4rem 2rem;
    color: #6c757d;
}

.loading-container .spinner-border[b-0aiyay721f] {
    width: 3rem;
    height: 3rem;
    margin-bottom: 1rem;
}

.no-results[b-0aiyay721f] {
    text-align: center;
    padding: 4rem 2rem;
    color: #6c757d;
}

.no-results i[b-0aiyay721f] {
    font-size: 4rem;
    margin-bottom: 1rem;
    opacity: 0.5;
}

.no-results h3[b-0aiyay721f] {
    margin-bottom: 0.5rem;
}

.brands-grid[b-0aiyay721f] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 1.5rem;
    padding: 0 1rem 2rem 1rem;
}

.brand-card[b-0aiyay721f] {
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 0.75rem;
    overflow: hidden;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.brand-card:hover[b-0aiyay721f] {
    transform: translateY(-4px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
    border-color: #0066cc;
}

.brand-image[b-0aiyay721f] {
    width: 100%;
    height: 200px;
    overflow: hidden;
    background-color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid #dee2e6;
    padding: 1rem;
}

.brand-image img[b-0aiyay721f] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

.placeholder-image[b-0aiyay721f] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #e9ecef 0%, #dee2e6 100%);
    color: #6c757d;
}

.placeholder-image i[b-0aiyay721f] {
    font-size: 4rem;
    opacity: 0.5;
}

.brand-content[b-0aiyay721f] {
    padding: 1.5rem;
}

.brand-name[b-0aiyay721f] {
    margin: 0 0 1.25rem 0;
    font-size: 1.375rem;
    font-weight: 700;
    color: #2c3e50;
}

.brand-info[b-0aiyay721f] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.info-item[b-0aiyay721f] {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
}

.info-item > i[b-0aiyay721f] {
    flex-shrink: 0;
    width: 1.25rem;
    text-align: center;
    color: #0066cc;
    font-size: 1.125rem;
    margin-top: 0.125rem;
}

.info-text[b-0aiyay721f] {
    flex: 1;
    line-height: 1.6;
}

.info-text strong[b-0aiyay721f] {
    color: #2c3e50;
}

.info-text a[b-0aiyay721f] {
    color: #0066cc;
    text-decoration: none;
    transition: color 0.2s ease;
}

.info-text a:hover[b-0aiyay721f] {
    color: #0052a3;
    text-decoration: underline;
}

.province-badge[b-0aiyay721f] {
    display: inline-block;
    background-color: #2d8659;
    color: white;
    padding: 0.25rem 0.75rem;
    border-radius: 0.25rem;
    font-size: 0.875rem;
    font-weight: 600;
    margin-top: 0.5rem;
}

/* Brand card link styles */
.brand-card-link[b-0aiyay721f] {
    text-decoration: none;
    color: inherit;
    display: block;
}

.brand-card-link:hover[b-0aiyay721f] {
    text-decoration: none;
}

.view-products-hint[b-0aiyay721f] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 1rem;
    padding: 0.75rem;
    background-color: #e7f3ff;
    border-radius: 0.5rem;
    color: #0066cc;
    font-weight: 500;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.brand-card-link:hover .view-products-hint[b-0aiyay721f] {
    background-color: #0066cc;
    color: white;
    transform: scale(1.05);
}

.view-products-hint i[b-0aiyay721f] {
    font-size: 1.1rem;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-header h1[b-0aiyay721f] {
        font-size: 2rem;
    }

    .page-header .header-icon[b-0aiyay721f] {
        font-size: 2.5rem;
    }

    .brands-grid[b-0aiyay721f] {
        grid-template-columns: 1fr;
        padding: 0 0.5rem 1rem 0.5rem;
    }

    .brand-controls[b-0aiyay721f] {
        flex-direction: column;
        padding: 0 0.5rem;
    }

    .search-box[b-0aiyay721f] {
        min-width: 100%;
    }

    .filter-group[b-0aiyay721f] {
        width: 100%;
    }

    .filter-group .form-select[b-0aiyay721f] {
        flex: 1;
    }

    .brand-count[b-0aiyay721f] {
        margin: 0 0.5rem 1rem 0.5rem;
    }
}

@media (max-width: 480px) {
    .page-header[b-0aiyay721f] {
        padding: 2rem 1rem;
        margin: -2rem -1rem 1.5rem -1rem;
    }

    .brand-content[b-0aiyay721f] {
        padding: 1rem;
    }

    .brand-name[b-0aiyay721f] {
        font-size: 1.25rem;
    }
}
/* /Components/Pages/Cart.razor.rz.scp.css */
.cart-page[b-tiivpfayiu] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
}

.cart-page h1[b-tiivpfayiu] {
    color: #2c3e50;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.credit-banner[b-tiivpfayiu] {
    display: flex;
    align-items: center;
    background: #f0f7ff;
    border: 1px solid #b8d9f8;
    border-left: 4px solid #0d6efd;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.9rem;
    color: #1a4a7a;
    margin-bottom: 1.5rem;
}

.loading-container[b-tiivpfayiu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-tiivpfayiu] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-tiivpfayiu] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

.empty-cart[b-tiivpfayiu] {
    text-align: center;
    padding: 6rem 0;
    color: #6c757d;
}

.order-confirmed[b-tiivpfayiu] {
    text-align: center;
    padding: 6rem 0;
    color: #198754;
}

.order-confirmed i[b-tiivpfayiu] {
    font-size: 5rem;
    margin-bottom: 1rem;
    display: block;
}

.order-confirmed h2[b-tiivpfayiu] {
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.empty-cart i[b-tiivpfayiu] {
    font-size: 5rem;
    margin-bottom: 1rem;
    opacity: 0.4;
    display: block;
}

.empty-cart h2[b-tiivpfayiu] {
    color: #495057;
    margin-bottom: 0.5rem;
}

.empty-cart p[b-tiivpfayiu] {
    margin-bottom: 1.5rem;
}

.cart-content[b-tiivpfayiu] {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 2rem;
    align-items: start;
}

.cart-main[b-tiivpfayiu] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.quick-add-section[b-tiivpfayiu] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
}

.quick-add-section h5[b-tiivpfayiu] {
    font-size: 1rem;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 0.75rem;
}

.cart-items[b-tiivpfayiu] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.cart-item[b-tiivpfayiu] {
    display: grid;
    grid-template-columns: 80px 1fr auto auto auto;
    gap: 1rem;
    align-items: center;
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    padding: 1rem;
    transition: box-shadow 0.2s;
}

.cart-item:hover[b-tiivpfayiu] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.cart-item-image[b-tiivpfayiu] {
    width: 80px;
    height: 80px;
    border-radius: 8px;
    overflow: hidden;
    background: #f8f9fa;
}

.cart-item-image img[b-tiivpfayiu] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.image-placeholder[b-tiivpfayiu] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: #dee2e6;
}

.cart-item-details[b-tiivpfayiu] {
    min-width: 0;
}

.cart-item-brand[b-tiivpfayiu] {
    color: #0d6efd;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.cart-item-name[b-tiivpfayiu] {
    font-size: 1rem;
    font-weight: 600;
    color: #2c3e50;
    margin: 0.25rem 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cart-item-size[b-tiivpfayiu] {
    color: #6c757d;
    font-size: 0.85rem;
}

.cart-item-quantity[b-tiivpfayiu] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.qty-btn[b-tiivpfayiu] {
    width: 32px;
    height: 32px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
}

.qty-input[b-tiivpfayiu] {
    width: 52px;
    height: 32px;
    text-align: center;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    font-size: 0.9rem;
}

.qty-input:focus[b-tiivpfayiu] {
    outline: none;
    border-color: #0d6efd;
    box-shadow: 0 0 0 2px rgba(13, 110, 253, 0.15);
}

.cart-item-price[b-tiivpfayiu] {
    text-align: right;
    min-width: 120px;
}

.unit-price[b-tiivpfayiu] {
    display: block;
    color: #6c757d;
    font-size: 0.8rem;
}

.line-total[b-tiivpfayiu] {
    display: block;
    font-size: 1.1rem;
    font-weight: 700;
    color: #28a745;
}

.cart-item-actions[b-tiivpfayiu] {
    display: flex;
    align-items: center;
}

.cart-summary[b-tiivpfayiu] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    padding: 1.5rem;
    position: sticky;
    top: 2rem;
}

.cart-summary h3[b-tiivpfayiu] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 1.25rem;
}

.summary-line[b-tiivpfayiu] {
    display: flex;
    justify-content: space-between;
    padding: 0.5rem 0;
    color: #495057;
}

.summary-divider[b-tiivpfayiu] {
    border-top: 2px solid #e9ecef;
    margin: 0.75rem 0;
}

.summary-total[b-tiivpfayiu] {
    display: flex;
    justify-content: space-between;
    padding: 0.5rem 0;
    font-size: 1.25rem;
    font-weight: 700;
    color: #2c3e50;
}

.cart-actions[b-tiivpfayiu] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 1.5rem;
}

.overdue-notice[b-tiivpfayiu] {
    display: flex;
    align-items: flex-start;
    background: #fff8e1;
    border: 1px solid #ffe082;
    border-left: 4px solid #f59f00;
    border-radius: 8px;
    padding: 0.65rem 0.9rem;
    font-size: 0.85rem;
    color: #7d5a00;
    line-height: 1.4;
}

.credit-facility[b-tiivpfayiu] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.credit-facility-line[b-tiivpfayiu] {
    display: flex;
    justify-content: space-between;
    padding: 0.3rem 0;
    font-size: 0.88rem;
    color: #6c757d;
}

.credit-facility-line.credit-available[b-tiivpfayiu] {
    font-weight: 600;
    color: #2c3e50;
}

.cart-actions .btn[b-tiivpfayiu] {
    width: 100%;
}

@media (max-width: 992px) {
    .cart-content[b-tiivpfayiu] {
        grid-template-columns: 1fr;
    }

    .cart-summary[b-tiivpfayiu] {
        position: static;
    }
}
@media (max-width: 768px) {
    .cart-page[b-tiivpfayiu] {
        padding: 1rem;
    }

    .cart-item[b-tiivpfayiu] {
        grid-template-columns: 60px 1fr;
        gap: 0.75rem;
    }

    .cart-item-quantity[b-tiivpfayiu],
    .cart-item-price[b-tiivpfayiu],
    .cart-item-actions[b-tiivpfayiu] {
        grid-column: 2;
    }

    .cart-item-image[b-tiivpfayiu] {
        width: 60px;
        height: 60px;
    }
}
/* /Components/Pages/CasualWorkers.razor.rz.scp.css */
/* Page layout */
.cw-page[b-kv643ea647] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-kv643ea647] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-kv643ea647] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-kv643ea647] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.cw-header[b-kv643ea647] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.cw-header-top[b-kv643ea647] {
    display: flex;
    align-items: center;
}

.cw-header-row[b-kv643ea647] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.back-link[b-kv643ea647] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-kv643ea647] {
    text-decoration: underline;
}

.cw-header h1[b-kv643ea647] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.btn-add[b-kv643ea647] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Card */
.cw-card[b-kv643ea647] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-kv643ea647] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-kv643ea647] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-kv643ea647] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.cw-table-wrapper[b-kv643ea647] {
    overflow-x: auto;
}

.cw-table[b-kv643ea647] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.cw-table thead tr[b-kv643ea647] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.cw-table th[b-kv643ea647] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.cw-table td[b-kv643ea647] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.cw-table tbody tr:last-child td[b-kv643ea647] {
    border-bottom: none;
}

.cw-table tbody tr:hover[b-kv643ea647] {
    background: #f8f9fa;
}

.cw-table tfoot tr[b-kv643ea647] {
    background: var(--background-color);
    border-top: 2px solid var(--border-color);
}

.cw-table tfoot td[b-kv643ea647] {
    padding: 0.75rem 1rem;
    border-bottom: none;
}

.col-right[b-kv643ea647] {
    text-align: right !important;
}

.col-center[b-kv643ea647] {
    text-align: center !important;
}

.col-check[b-kv643ea647] {
    width: 40px;
}

.col-desc[b-kv643ea647] {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tabnum[b-kv643ea647] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.fw-600[b-kv643ea647] {
    font-weight: 600;
}

.row-inactive[b-kv643ea647] {
    opacity: 0.5;
}

.row-paid[b-kv643ea647] {
    background: #f8fdf8;
}

/* Name link button */
.btn-link-name[b-kv643ea647] {
    background: none;
    border: none;
    color: var(--primary-color);
    font-weight: 600;
    cursor: pointer;
    padding: 0;
    font-size: inherit;
    text-decoration: none;
}

.btn-link-name:hover[b-kv643ea647] {
    text-decoration: underline;
}

/* Badge - payment method */
.badge-method[b-kv643ea647] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.03em;
}

.badge-method--cash[b-kv643ea647] {
    background: #fff3cd;
    color: #856404;
}

.badge-method--eft[b-kv643ea647] {
    background: #d1ecf1;
    color: #0c5460;
}

/* Badge - outstanding documents */
.badge-docs-pending[b-kv643ea647] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    background: #fff3cd;
    color: #856404;
    font-size: 0.85rem;
}

/* Badge - status */
.badge-status[b-kv643ea647] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
}

.badge-status--paid[b-kv643ea647] {
    background: #d4edda;
    color: #155724;
}

.badge-status--unpaid[b-kv643ea647] {
    background: #fce4e4;
    color: #9b2c2c;
}

.slip-link[b-kv643ea647] {
    display: inline-flex;
    align-items: center;
    margin-left: 0.4rem;
    color: var(--primary-color);
    font-size: 0.85rem;
}

.slip-link:hover[b-kv643ea647] {
    color: #0056b3;
}

.slip-link--unsigned[b-kv643ea647] {
    color: #e6a817;
}

.slip-link--unsigned:hover[b-kv643ea647] {
    color: #c8880c;
}

.doc-action[b-kv643ea647] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    padding: 0.15rem;
    cursor: pointer;
    font-size: 0.85rem;
    line-height: 1;
    transition: color 0.15s;
}

.doc-action--delete[b-kv643ea647] {
    color: #b8b8b8;
}

.doc-action--delete:hover[b-kv643ea647] {
    color: #dc3545;
}

.doc-action--upload[b-kv643ea647] {
    color: #6c757d;
    margin-left: 0.35rem;
}

.doc-action--upload:hover[b-kv643ea647] {
    color: var(--primary-color);
}

/* Detail header */
.cw-detail-header[b-kv643ea647] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.cw-detail-header h2[b-kv643ea647] {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 700;
    color: #2c3e50;
}

.detail-rate[b-kv643ea647] {
    font-size: 0.9rem;
    color: var(--secondary-color);
    font-weight: 500;
}

.cw-bank-info[b-kv643ea647] {
    display: flex;
    align-items: center;
    background: #e8f4f8;
    padding: 0.6rem 1rem;
    border-radius: 8px;
    font-size: 0.85rem;
    color: #0c5460;
}

/* Hours actions */
.cw-hours-actions[b-kv643ea647] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.hours-summary-row td[b-kv643ea647] {
    font-size: 0.85rem;
    color: #2c3e50;
}

/* Toggle switch */
.toggle-switch[b-kv643ea647] {
    position: relative;
    display: inline-block;
    width: 36px;
    height: 20px;
    cursor: pointer;
    margin: 0;
}

.toggle-switch input[b-kv643ea647] {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider[b-kv643ea647] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #ccc;
    border-radius: 20px;
    transition: background 0.2s ease;
}

.toggle-slider[b-kv643ea647]::before {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    left: 2px;
    bottom: 2px;
    background: white;
    border-radius: 50%;
    transition: transform 0.2s ease;
}

.toggle-switch input:checked + .toggle-slider[b-kv643ea647] {
    background: #28a745;
}

.toggle-switch input:checked + .toggle-slider[b-kv643ea647]::before {
    transform: translateX(16px);
}

/* ──────────── Modals ──────────── */

.cw-modal-backdrop[b-kv643ea647] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 1rem;
}

.cw-modal[b-kv643ea647] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    width: 100%;
    max-width: 560px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    max-height: 90vh;
    overflow-y: auto;
}

.cw-modal--sm[b-kv643ea647] {
    max-width: 440px;
}

.cw-modal-header[b-kv643ea647] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    background: var(--background-color);
}

.cw-modal-header h2[b-kv643ea647] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.cw-modal-close[b-kv643ea647] {
    background: none;
    border: none;
    color: var(--secondary-color);
    font-size: 1rem;
    cursor: pointer;
    padding: 0.25rem 0.5rem;
    border-radius: 6px;
    line-height: 1;
    transition: background 0.15s ease, color 0.15s ease;
}

.cw-modal-close:hover[b-kv643ea647] {
    background: #f0f0f0;
    color: #2c3e50;
}

.cw-modal-body[b-kv643ea647] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.cw-modal-footer[b-kv643ea647] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
}

/* Form */
.form-group[b-kv643ea647] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-kv643ea647] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #2c3e50;
}

.form-row-2col[b-kv643ea647] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.required[b-kv643ea647] {
    color: #dc3545;
}

.field-error[b-kv643ea647] {
    font-size: 0.8rem;
    color: #dc3545;
}

.bank-section[b-kv643ea647] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid var(--border-color);
}

.bank-section-title[b-kv643ea647] {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

/* R prefix on amount input */
.input-prefix-group[b-kv643ea647] {
    display: flex;
    align-items: stretch;
}

.input-prefix[b-kv643ea647] {
    display: flex;
    align-items: center;
    padding: 0.375rem 0.65rem;
    background: var(--background-color);
    border: 1px solid #ced4da;
    border-right: none;
    border-radius: 6px 0 0 6px;
    font-size: 0.9rem;
    color: var(--secondary-color);
    font-weight: 500;
    white-space: nowrap;
}

.input-prefix-group .form-control[b-kv643ea647] {
    border-radius: 0 6px 6px 0;
    flex: 1;
    min-width: 0;
}

/* Responsive */
@media (max-width: 768px) {
    .cw-page[b-kv643ea647] {
        padding: 1rem;
    }

    .form-row-2col[b-kv643ea647] {
        grid-template-columns: 1fr;
    }

    .cw-modal[b-kv643ea647] {
        max-width: 100%;
    }

    .cw-detail-header[b-kv643ea647] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* /Components/Pages/ChangePassword.razor.rz.scp.css */
.change-password-page[b-n8j243j1zn] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 2rem;
}

.change-password-card[b-n8j243j1zn] {
    background: var(--card-bg, #fff);
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 12px;
    padding: 2.5rem;
    width: 100%;
    max-width: 420px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
    text-align: center;
}

.change-password-icon[b-n8j243j1zn] {
    font-size: 3rem;
    color: var(--primary, #0d6efd);
    margin-bottom: 1rem;
}

.change-password-card h1[b-n8j243j1zn] {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.change-password-subtitle[b-n8j243j1zn] {
    color: var(--text-muted, #6c757d);
    margin-bottom: 1.75rem;
    font-size: 0.95rem;
}

.change-password-card .form-group[b-n8j243j1zn] {
    text-align: left;
    margin-bottom: 1rem;
}

.change-password-card .form-group label[b-n8j243j1zn] {
    display: block;
    font-weight: 500;
    margin-bottom: 0.35rem;
    font-size: 0.9rem;
}

.change-password-card .form-control[b-n8j243j1zn] {
    width: 100%;
}

.btn-change[b-n8j243j1zn] {
    width: 100%;
    margin-top: 1rem;
    padding: 0.6rem;
}
/* /Components/Pages/CreateCreditNote.razor.rz.scp.css */
.create-cn-page[b-r6yynkg19y] {
    max-width: 860px;
    margin: 0 auto;
    padding: 0;
}

/* Loading */
.loading-container[b-r6yynkg19y] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-r6yynkg19y] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-r6yynkg19y] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Page Header */
.page-header[b-r6yynkg19y] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 2rem;
    background: linear-gradient(135deg, var(--primary-color) 0%, #004999 100%);
    color: white;
    margin: -2rem -2rem 2rem -2rem;
    border-radius: 0 0 1rem 1rem;
}

.btn-back[b-r6yynkg19y] {
    background: rgba(255, 255, 255, 0.15);
    border: none;
    color: white;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    font-size: 1.1rem;
    transition: background 0.2s ease;
}

.btn-back:hover[b-r6yynkg19y] {
    background: rgba(255, 255, 255, 0.25);
}

.header-icon[b-r6yynkg19y] {
    font-size: 2.5rem;
    opacity: 0.9;
    flex-shrink: 0;
}

.page-header .header-text[b-r6yynkg19y] {
    flex: 1;
}

.page-header h1[b-r6yynkg19y] {
    margin: 0 0 0.2rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: white;
}

.page-header p[b-r6yynkg19y] {
    margin: 0;
    opacity: 0.85;
    font-size: 0.95rem;
}

/* Form cards */
.form-card[b-r6yynkg19y] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.75rem;
    padding: 1.75rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.section-title[b-r6yynkg19y] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 1.25rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #e9ecef;
}

/* Form layout */
.form-row[b-r6yynkg19y] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-row--three[b-r6yynkg19y] {
    grid-template-columns: 1fr 1fr 1fr;
}

.form-group[b-r6yynkg19y] {
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
}

.form-group label[b-r6yynkg19y] {
    font-weight: 500;
    margin-bottom: 0.4rem;
    font-size: 0.9rem;
    color: #495057;
}

.required[b-r6yynkg19y] {
    color: #dc3545;
}

.optional[b-r6yynkg19y] {
    color: #6c757d;
    font-weight: 400;
    font-size: 0.8rem;
}

.field-error[b-r6yynkg19y] {
    color: #dc3545;
    font-size: 0.825rem;
    margin-top: 0.3rem;
}

/* Currency input */
.input-prefix-group[b-r6yynkg19y] {
    display: flex;
    align-items: stretch;
}

.input-prefix[b-r6yynkg19y] {
    display: flex;
    align-items: center;
    padding: 0.375rem 0.75rem;
    background: #e9ecef;
    border: 1px solid #ced4da;
    border-right: none;
    border-radius: 0.375rem 0 0 0.375rem;
    font-size: 0.9rem;
    color: #495057;
    font-weight: 500;
    white-space: nowrap;
}

.input-prefix-group .form-control[b-r6yynkg19y] {
    border-radius: 0 0.375rem 0.375rem 0;
}

/* Total display */
.total-display[b-r6yynkg19y] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    min-height: 2.5rem;
}

.total-currency[b-r6yynkg19y] {
    font-size: 0.9rem;
    color: #6c757d;
    font-weight: 500;
}

.total-value[b-r6yynkg19y] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
    font-variant-numeric: tabular-nums;
}

/* Reason textarea */
.reason-textarea[b-r6yynkg19y] {
    resize: vertical;
    min-height: 6rem;
}

.char-count[b-r6yynkg19y] {
    font-size: 0.8rem;
    color: #6c757d;
    text-align: right;
    margin-top: 0.25rem;
}

/* Actions */
.form-actions[b-r6yynkg19y] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-bottom: 2rem;
}

.btn-submit[b-r6yynkg19y] {
    padding: 0.6rem 1.75rem;
    font-size: 1rem;
    font-weight: 600;
}

/* Success panel */
.success-panel[b-r6yynkg19y] {
    background: #fff;
    border: 1px solid #d1e7dd;
    border-radius: 0.75rem;
    padding: 3rem 2rem;
    text-align: center;
    color: #0f5132;
    margin: 2rem 0;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.success-icon[b-r6yynkg19y] {
    font-size: 4rem;
    color: #198754;
    margin-bottom: 1rem;
}

.success-panel h2[b-r6yynkg19y] {
    margin: 0 0 0.75rem;
    font-size: 1.5rem;
    font-weight: 700;
}

.success-panel p[b-r6yynkg19y] {
    color: #495057;
    margin-bottom: 0;
}

.success-actions[b-r6yynkg19y] {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 1.75rem;
}

/* Invoice autocomplete */
.autocomplete-wrapper[b-r6yynkg19y] {
    position: relative;
}

.autocomplete-dropdown[b-r6yynkg19y] {
    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    right: 0;
    z-index: 1000;
    background: #fff;
    border: 1px solid #ced4da;
    border-radius: 0.375rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    list-style: none;
    margin: 0;
    padding: 0.25rem 0;
    max-height: 220px;
    overflow-y: auto;
}

.autocomplete-dropdown li[b-r6yynkg19y] {
    padding: 0.5rem 0.75rem;
    cursor: pointer;
    font-size: 0.9rem;
    color: #212529;
    display: flex;
    align-items: center;
}

.autocomplete-dropdown li:hover:not(.autocomplete-empty)[b-r6yynkg19y] {
    background: #f0f4ff;
    color: var(--primary-color);
}

.autocomplete-dropdown li.autocomplete-empty[b-r6yynkg19y] {
    color: #6c757d;
    cursor: default;
    font-style: italic;
}

/* Responsive */
@media (max-width: 700px) {
    .form-row[b-r6yynkg19y],
    .form-row--three[b-r6yynkg19y] {
        grid-template-columns: 1fr;
    }

    .form-actions[b-r6yynkg19y] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-r6yynkg19y] {
        width: 100%;
    }
}
/* /Components/Pages/CreditNotesList.razor.rz.scp.css */
/* Page layout */
.cn-list-page[b-hfmb9ogtey] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-hfmb9ogtey] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-hfmb9ogtey] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-hfmb9ogtey] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Error */
.list-error[b-hfmb9ogtey] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 2rem;
    text-align: center;
    color: var(--secondary-color);
}

.list-error i[b-hfmb9ogtey] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}

/* Header */
.cn-list-header[b-hfmb9ogtey] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.back-link[b-hfmb9ogtey] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-hfmb9ogtey] {
    text-decoration: underline;
}

.cn-list-header h1[b-hfmb9ogtey] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

/* Card */
.cn-list-card[b-hfmb9ogtey] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-hfmb9ogtey] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-hfmb9ogtey] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-hfmb9ogtey] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.cn-table-wrapper[b-hfmb9ogtey] {
    overflow-x: auto;
}

.cn-table[b-hfmb9ogtey] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.cn-table thead tr[b-hfmb9ogtey] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.cn-table th[b-hfmb9ogtey] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.cn-table td[b-hfmb9ogtey] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.cn-table tbody tr:last-child td[b-hfmb9ogtey] {
    border-bottom: none;
}

.cn-table tbody tr:hover[b-hfmb9ogtey] {
    background: #f8f9fa;
}

.cn-number[b-hfmb9ogtey] {
    font-weight: 600;
    font-family: monospace;
    font-size: 0.875rem;
}

.cn-amount[b-hfmb9ogtey] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.cn-available-positive[b-hfmb9ogtey] {
    color: #0a6640;
    font-weight: 600;
}

.col-right[b-hfmb9ogtey] {
    text-align: right !important;
}

.col-center[b-hfmb9ogtey] {
    text-align: center !important;
}

/* Status badges */
.cn-status-badge[b-hfmb9ogtey] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
}

.cn-status-badge--open[b-hfmb9ogtey] {
    background: #e7f1ff;
    color: var(--primary-color);
}

.cn-status-badge--partial[b-hfmb9ogtey] {
    background: #fff3cd;
    color: #856404;
}

.cn-status-badge--applied[b-hfmb9ogtey] {
    background: #d1f0e0;
    color: #0a6640;
}

.cn-status-badge--cancelled[b-hfmb9ogtey] {
    background: #f8d7da;
    color: #842029;
}

.cn-status-badge--expired[b-hfmb9ogtey] {
    background: #e9ecef;
    color: #6c757d;
}

/* Document button */
.cn-document-btn[b-hfmb9ogtey] {
    color: #c0392b;
    font-size: 1.1rem;
    padding: 0.25rem 0.4rem;
    border-radius: 6px;
    transition: background 0.15s ease, color 0.15s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.cn-document-btn:hover[b-hfmb9ogtey] {
    background: #fdecea;
    color: #922b21;
}

/* Pager */
.cn-pager[b-hfmb9ogtey] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-wrap: wrap;
    gap: 0.75rem;
}

.cn-pager-info[b-hfmb9ogtey] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.cn-pager-controls[b-hfmb9ogtey] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.cn-pager-current[b-hfmb9ogtey] {
    font-size: 0.85rem;
    color: var(--text-color);
    font-weight: 500;
    white-space: nowrap;
}
/* /Components/Pages/CustomerAccounts.razor.rz.scp.css */
/* Page layout */
.customer-accounts-page[b-tnrdzl04gz] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-tnrdzl04gz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 300px;
}

.loading-container .spinner-border[b-tnrdzl04gz] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-tnrdzl04gz] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.customer-accounts-header[b-tnrdzl04gz] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.customer-accounts-header-top[b-tnrdzl04gz] {
    display: flex;
    align-items: center;
}

.customer-accounts-header h1[b-tnrdzl04gz] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

/* Customer search */
.customer-search-wrapper[b-tnrdzl04gz] {
    position: relative;
    max-width: 500px;
}

.customer-search-dropdown[b-tnrdzl04gz] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
    z-index: 1000;
    max-height: 320px;
    overflow-y: auto;
}

.customer-search-item[b-tnrdzl04gz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.7rem 1rem;
    cursor: pointer;
    border-bottom: 1px solid #f1f3f5;
    transition: background 0.1s;
}

.customer-search-item:last-child[b-tnrdzl04gz] {
    border-bottom: none;
}

.customer-search-item:hover[b-tnrdzl04gz] {
    background: #f8f9fa;
}

.customer-search-item i[b-tnrdzl04gz] {
    font-size: 1.1rem;
    color: var(--primary-color);
}

.customer-search-name[b-tnrdzl04gz] {
    font-size: 0.95rem;
    font-weight: 500;
    color: #2c3e50;
}

.customer-search-no-results[b-tnrdzl04gz] {
    padding: 0.75rem 1rem;
    color: #6c757d;
    font-size: 0.9rem;
    text-align: center;
}

/* Customer info banner */
.customer-info-banner[b-tnrdzl04gz] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    background: linear-gradient(135deg, var(--primary-color) 0%, #004999 100%);
    color: white;
    border-radius: 12px;
    padding: 1.5rem 2rem;
    gap: 2rem;
    flex-wrap: wrap;
}

.customer-info-left h2[b-tnrdzl04gz] {
    margin: 0 0 0.25rem;
    font-size: 1.5rem;
    font-weight: 700;
    color: white;
}

.customer-registered-name[b-tnrdzl04gz] {
    font-size: 0.9rem;
    opacity: 0.8;
    display: block;
    margin-bottom: 0.5rem;
}

.customer-info-badges[b-tnrdzl04gz] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.badge-pill[b-tnrdzl04gz] {
    display: inline-block;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.3px;
}

.badge-type[b-tnrdzl04gz] {
    background: rgba(255, 255, 255, 0.2);
    color: white;
}

.badge-active[b-tnrdzl04gz] {
    background: #d4edda;
    color: #155724;
}

.badge-inactive[b-tnrdzl04gz] {
    background: #f8d7da;
    color: #721c24;
}

.customer-info-right[b-tnrdzl04gz] {
    display: flex;
    gap: 2rem;
    flex-wrap: wrap;
}

.info-item[b-tnrdzl04gz] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.info-label[b-tnrdzl04gz] {
    font-size: 0.75rem;
    opacity: 0.8;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.info-value[b-tnrdzl04gz] {
    font-size: 1.25rem;
    font-weight: 700;
}

/* Summary cards */
.summary-grid[b-tnrdzl04gz] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1rem;
}

.summary-card[b-tnrdzl04gz] {
    background: white;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.summary-label[b-tnrdzl04gz] {
    font-size: 0.8rem;
    color: #6c757d;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.summary-value[b-tnrdzl04gz] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #2c3e50;
}

.summary-value--success[b-tnrdzl04gz] {
    color: #28a745;
}

.summary-value--warning[b-tnrdzl04gz] {
    color: #856404;
}

.summary-value--danger[b-tnrdzl04gz] {
    color: #b91c1c;
}

.summary-value--info[b-tnrdzl04gz] {
    color: var(--primary-color);
}

/* Section cards */
.section-card[b-tnrdzl04gz] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 1.5rem;
}

.section-card h3[b-tnrdzl04gz] {
    margin: 0 0 1rem;
    font-size: 1.1rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.section-card h3 i[b-tnrdzl04gz] {
    color: var(--primary-color);
}

.empty-message[b-tnrdzl04gz] {
    color: #6c757d;
    font-size: 0.9rem;
    text-align: center;
    padding: 1rem 0;
    margin: 0;
}

/* Aging analysis */
.aging-grid[b-tnrdzl04gz] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
}

.aging-bucket[b-tnrdzl04gz] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    padding: 1rem;
    border-radius: 8px;
    background: #f8f9fa;
    text-align: center;
}

.aging-label[b-tnrdzl04gz] {
    font-size: 0.8rem;
    color: #6c757d;
    font-weight: 500;
}

.aging-value[b-tnrdzl04gz] {
    font-size: 1.2rem;
    font-weight: 700;
}

.aging-current[b-tnrdzl04gz] {
    color: #28a745;
}

.aging-30[b-tnrdzl04gz] {
    color: #856404;
}

.aging-60[b-tnrdzl04gz] {
    color: #e67e22;
}

.aging-90[b-tnrdzl04gz] {
    color: #b91c1c;
}

/* Data tables */
.table-responsive[b-tnrdzl04gz] {
    overflow-x: auto;
}

.data-table[b-tnrdzl04gz] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.data-table thead th[b-tnrdzl04gz] {
    background: #f8f9fa;
    padding: 0.65rem 0.75rem;
    text-align: left;
    font-weight: 600;
    color: #495057;
    border-bottom: 2px solid #dee2e6;
    white-space: nowrap;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.data-table tbody td[b-tnrdzl04gz] {
    padding: 0.6rem 0.75rem;
    border-bottom: 1px solid #f1f3f5;
    color: #2c3e50;
}

.data-table tbody tr:hover[b-tnrdzl04gz] {
    background: #f8f9fa;
}

.row-overdue[b-tnrdzl04gz] {
    background: #fff5f5;
}

.row-overdue:hover[b-tnrdzl04gz] {
    background: #fee2e2 !important;
}

.font-mono[b-tnrdzl04gz] {
    font-family: 'Cascadia Code', 'Consolas', monospace;
    font-size: 0.85rem;
}

.text-end[b-tnrdzl04gz] {
    text-align: right;
}

/* Status badges */
.status-badge[b-tnrdzl04gz] {
    display: inline-block;
    padding: 0.15rem 0.55rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
}

.status-paid[b-tnrdzl04gz] {
    background: #d4edda;
    color: #155724;
}

.status-outstanding[b-tnrdzl04gz] {
    background: #fff3cd;
    color: #856404;
}

.status-overdue[b-tnrdzl04gz] {
    background: #fde8e8;
    color: #b91c1c;
}

.status-open[b-tnrdzl04gz] {
    background: #e7f1ff;
    color: var(--primary-color);
}

.status-partiallyapplied[b-tnrdzl04gz] {
    background: #fff3cd;
    color: #856404;
}

.status-fullyapplied[b-tnrdzl04gz] {
    background: #d4edda;
    color: #155724;
}

.status-cancelled[b-tnrdzl04gz] {
    background: #e2e3e5;
    color: #383d41;
}

.status-expired[b-tnrdzl04gz] {
    background: #f8d7da;
    color: #721c24;
}

/* Document link */
.doc-link[b-tnrdzl04gz] {
    color: var(--primary-color);
    font-size: 1.1rem;
    transition: color 0.2s;
}

.doc-link:hover[b-tnrdzl04gz] {
    color: #004999;
}

/* Filter bar */
.filter-bar[b-tnrdzl04gz] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.filter-input[b-tnrdzl04gz] {
    max-width: 400px;
    flex: 1;
}

.filter-count[b-tnrdzl04gz] {
    font-size: 0.85rem;
    color: #6c757d;
    white-space: nowrap;
}

/* Customers table */
.customers-table tbody tr.customer-row[b-tnrdzl04gz] {
    cursor: pointer;
    transition: background 0.1s;
}

.customers-table tbody tr.customer-row:hover[b-tnrdzl04gz] {
    background: #eef2ff;
}

.customers-table th.col-right[b-tnrdzl04gz]   { text-align: right; }
.customers-table th.col-center[b-tnrdzl04gz]  { text-align: center; }

.col-right[b-tnrdzl04gz] {
    text-align: right;
}

.col-center[b-tnrdzl04gz] {
    text-align: center;
}

/* Action cells — never highlight on hover like data cells */
.action-cell[b-tnrdzl04gz] {
    width: 60px;
    white-space: nowrap;
    vertical-align: middle;
}

/* Active toggle — green when on */
.toggle-active[b-tnrdzl04gz] {
    cursor: pointer;
}

.toggle-active:checked[b-tnrdzl04gz] {
    background-color: #28a745;
    border-color: #28a745;
}

/* Website toggle — blue when on */
.toggle-website[b-tnrdzl04gz] {
    cursor: pointer;
}

.toggle-website:checked[b-tnrdzl04gz] {
    background-color: #0d6efd;
    border-color: #0d6efd;
}

.overdue-amount[b-tnrdzl04gz] {
    color: #b91c1c;
    font-weight: 600;
}

/* Customer status badges */
.status-active[b-tnrdzl04gz] {
    background: #d4edda;
    color: #155724;
}

.status-inactive[b-tnrdzl04gz] {
    background: #e2e3e5;
    color: #383d41;
}

.status-stale[b-tnrdzl04gz] {
    background: #fff3cd;
    color: #856404;
}

.status-nta[b-tnrdzl04gz] {
    background: #fde8e8;
    color: #b91c1c;
}

/* Pagination */
.pagination-bar[b-tnrdzl04gz] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid #f1f3f5;
}

.btn-page[b-tnrdzl04gz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background: white;
    color: #495057;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    font-size: 0.85rem;
}

.btn-page:hover:not(:disabled)[b-tnrdzl04gz] {
    background: #f8f9fa;
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.btn-page:disabled[b-tnrdzl04gz] {
    opacity: 0.4;
    cursor: default;
}

.page-info[b-tnrdzl04gz] {
    font-size: 0.85rem;
    color: #6c757d;
    min-width: 100px;
    text-align: center;
}

/* Responsive */
@media (max-width: 992px) {
    .summary-grid[b-tnrdzl04gz] {
        grid-template-columns: repeat(3, 1fr);
    }

    .aging-grid[b-tnrdzl04gz] {
        grid-template-columns: repeat(2, 1fr);
    }

    .customer-info-banner[b-tnrdzl04gz] {
        flex-direction: column;
    }

    .customer-info-right[b-tnrdzl04gz] {
        align-items: flex-start;
    }

    .info-item[b-tnrdzl04gz] {
        align-items: flex-start;
    }
}

@media (max-width: 640px) {
    .customer-accounts-page[b-tnrdzl04gz] {
        padding: 1rem;
        gap: 1rem;
    }

    .summary-grid[b-tnrdzl04gz] {
        grid-template-columns: repeat(2, 1fr);
    }

    .aging-grid[b-tnrdzl04gz] {
        grid-template-columns: 1fr;
    }

    .customer-search-wrapper[b-tnrdzl04gz] {
        max-width: 100%;
    }
}
/* /Components/Pages/CustomerCredit.razor.rz.scp.css */
.credits-page[b-oduv8uffz1] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* Loading */
.loading-container[b-oduv8uffz1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-oduv8uffz1] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-oduv8uffz1] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Page Header */
.page-header[b-oduv8uffz1] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #004999 100%);
    color: white;
    border-radius: 12px;
    padding: 2rem 2.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    overflow: hidden;
}

.header-text[b-oduv8uffz1] {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-width: 0;
}

.btn-back[b-oduv8uffz1] {
    background: rgba(255, 255, 255, 0.15);
    border: none;
    color: white;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    font-size: 1.1rem;
    transition: background 0.2s ease;
}

.btn-back:hover[b-oduv8uffz1] {
    background: rgba(255, 255, 255, 0.25);
}

.page-header h1[b-oduv8uffz1] {
    margin: 0 0 0.2rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: white;
}

.page-header p[b-oduv8uffz1] {
    margin: 0;
    opacity: 0.85;
    font-size: 0.95rem;
}

.outstanding-badge[b-oduv8uffz1] {
    background: #fff3cd;
    color: #856404;
    font-size: 0.9rem;
    font-weight: 700;
    padding: 0.35rem 1rem;
    border-radius: 20px;
    white-space: nowrap;
    flex-shrink: 0;
}

.header-actions[b-oduv8uffz1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
}

.btn-create[b-oduv8uffz1] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: white;
    color: var(--primary-color);
    border: none;
    padding: 0.5rem 1.1rem;
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease, box-shadow 0.15s ease;
    white-space: nowrap;
}

.btn-create:hover[b-oduv8uffz1] {
    background: #e7f1ff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

/* Summary Bar */
.summary-bar[b-oduv8uffz1] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 1.25rem 2rem;
    display: flex;
    align-items: center;
    gap: 2rem;
}

.summary-item[b-oduv8uffz1] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.summary-label[b-oduv8uffz1] {
    font-size: 0.85rem;
    color: var(--secondary-color);
    font-weight: 500;
}

.summary-value[b-oduv8uffz1] {
    font-size: 1.5rem;
    font-weight: 700;
}

.summary-value--warning[b-oduv8uffz1] {
    color: #856404;
}

.summary-value--primary[b-oduv8uffz1] {
    color: var(--primary-color);
}

.summary-divider[b-oduv8uffz1] {
    width: 1px;
    height: 3rem;
    background: var(--border-color);
    flex-shrink: 0;
}

/* Filter Bar */
.filter-bar[b-oduv8uffz1] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.filter-btn[b-oduv8uffz1] {
    background: white;
    border: 1px solid var(--border-color);
    color: var(--secondary-color);
    font-size: 0.875rem;
    font-weight: 500;
    padding: 0.4rem 1rem;
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.filter-btn:hover[b-oduv8uffz1] {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.filter-btn--active[b-oduv8uffz1] {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: white;
}

/* Empty State */
.empty-state[b-oduv8uffz1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    gap: 0.75rem;
}

.empty-state i[b-oduv8uffz1] {
    font-size: 3rem;
    color: var(--secondary-color);
    opacity: 0.4;
}

.empty-state h2[b-oduv8uffz1] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #2c3e50;
}

.empty-state p[b-oduv8uffz1] {
    margin: 0;
    color: var(--secondary-color);
    font-size: 0.95rem;
}

/* Table */
.credits-table-wrapper[b-oduv8uffz1] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.credits-table[b-oduv8uffz1] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.credits-table thead tr[b-oduv8uffz1] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.credits-table th[b-oduv8uffz1] {
    padding: 0.875rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.credits-table td[b-oduv8uffz1] {
    padding: 0.875rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.credits-table tbody tr:last-child td[b-oduv8uffz1] {
    border-bottom: none;
}

.credits-table tbody tr:hover[b-oduv8uffz1] {
    background: #f8f9fa;
}

.col-right[b-oduv8uffz1] {
    text-align: right !important;
}

.col-credit-number[b-oduv8uffz1] {
    font-weight: 600;
    font-family: monospace;
    font-size: 0.875rem;
}

.col-amount[b-oduv8uffz1] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.available-positive[b-oduv8uffz1] {
    color: #0a6640;
    font-weight: 600;
}

/* Status Badges */
.status-badge[b-oduv8uffz1] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
}

.status-badge--open[b-oduv8uffz1] {
    background: #e7f1ff;
    color: var(--primary-color);
}

.status-badge--partial[b-oduv8uffz1] {
    background: #fff3cd;
    color: #856404;
}

.status-badge--applied[b-oduv8uffz1] {
    background: #d1f0e0;
    color: #0a6640;
}

.status-badge--cancelled[b-oduv8uffz1] {
    background: #f8d7da;
    color: #842029;
}

.status-badge--expired[b-oduv8uffz1] {
    background: #e9ecef;
    color: #6c757d;
}

.col-center[b-oduv8uffz1] {
    text-align: center !important;
}

/* Reason Icon Button */
.btn-reason[b-oduv8uffz1] {
    background: none;
    border: none;
    color: var(--primary-color);
    cursor: pointer;
    font-size: 1rem;
    padding: 0.25rem 0.4rem;
    border-radius: 6px;
    transition: background 0.15s ease, color 0.15s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-reason:hover[b-oduv8uffz1] {
    background: #e7f1ff;
    color: #003a7a;
}

.btn-document[b-oduv8uffz1] {
    color: #c0392b;
    font-size: 1.1rem;
    padding: 0.25rem 0.4rem;
    border-radius: 6px;
    transition: background 0.15s ease, color 0.15s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.btn-document:hover[b-oduv8uffz1] {
    background: #fdecea;
    color: #922b21;
}

/* Reason Popup Overlay */
.reason-overlay[b-oduv8uffz1] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 1rem;
}

.reason-popup[b-oduv8uffz1] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    width: 100%;
    max-width: 480px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.reason-popup-header[b-oduv8uffz1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--border-color);
    font-weight: 600;
    font-size: 0.95rem;
    color: #2c3e50;
    gap: 0.5rem;
}

.reason-popup-header i[b-oduv8uffz1] {
    color: var(--primary-color);
    margin-right: 0.4rem;
}

.reason-popup-close[b-oduv8uffz1] {
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    font-size: 0.9rem;
    padding: 0.25rem 0.4rem;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    transition: background 0.15s ease, color 0.15s ease;
}

.reason-popup-close:hover[b-oduv8uffz1] {
    background: #f1f3f5;
    color: #2c3e50;
}

.reason-popup-body[b-oduv8uffz1] {
    padding: 1.25rem;
    font-size: 0.95rem;
    color: #2c3e50;
    line-height: 1.6;
    white-space: pre-wrap;
}

/* Responsive */
@media (max-width: 992px) {
    .credits-page[b-oduv8uffz1] {
        padding: 1rem;
        gap: 1.25rem;
    }

    .credits-table-wrapper[b-oduv8uffz1] {
        overflow-x: auto;
    }

    .summary-bar[b-oduv8uffz1] {
        flex-wrap: wrap;
        gap: 1rem;
    }
}

@media (max-width: 576px) {
    .page-header[b-oduv8uffz1] {
        flex-wrap: wrap;
        align-items: flex-start;
        padding: 1.5rem;
        gap: 0.75rem;
    }

    .header-text[b-oduv8uffz1] {
        flex: 1 1 100%;
    }

    .header-actions[b-oduv8uffz1] {
        flex-shrink: 0;
    }
}
/* /Components/Pages/CustomerDashboard.razor.rz.scp.css */
.dashboard-page[b-c9nnuhm86o] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* Loading & Error */
.loading-container[b-c9nnuhm86o] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-c9nnuhm86o] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-c9nnuhm86o] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

.dashboard-error[b-c9nnuhm86o] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 2rem;
    text-align: center;
    color: var(--secondary-color);
}

.dashboard-error i[b-c9nnuhm86o] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}

/* Welcome Banner */
.dashboard-welcome[b-c9nnuhm86o] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: linear-gradient(135deg, var(--primary-color) 0%, #004999 100%);
    color: white;
    border-radius: 12px;
    padding: 2rem 2.5rem;
    gap: 1.5rem;
}

.welcome-text h1[b-c9nnuhm86o] {
    margin: 0 0 0.25rem;
    font-size: 2rem;
    font-weight: 700;
    color: white;
}

.welcome-text p[b-c9nnuhm86o] {
    margin: 0;
    opacity: 0.85;
    font-size: 1rem;
}

.welcome-actions .btn[b-c9nnuhm86o] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1.5rem;
    font-weight: 600;
    background: white;
    color: var(--primary-color);
    border: none;
    border-radius: 8px;
    white-space: nowrap;
}

.welcome-actions .btn:hover[b-c9nnuhm86o] {
    background: #f0f4ff;
}

/* No account alert */
.no-account-alert[b-c9nnuhm86o] {
    border-radius: 10px;
    font-size: 0.95rem;
}

/* Card grid */
.dashboard-grid[b-c9nnuhm86o] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

/* Cards */
.dashboard-card[b-c9nnuhm86o] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    /* reset anchor styles when used as a link */
    display: block;
    color: inherit;
    text-decoration: none;
}

.dashboard-card--clickable[b-c9nnuhm86o] {
    cursor: pointer;
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.dashboard-card--clickable:hover[b-c9nnuhm86o] {
    box-shadow: 0 4px 16px rgba(0, 102, 204, 0.18);
    transform: translateY(-2px);
    color: inherit;
    text-decoration: none;
}

.dashboard-card--clickable:hover .card-header[b-c9nnuhm86o] {
    background: #e7f1ff;
}

.dashboard-card--clickable:hover .card-header i[b-c9nnuhm86o] {
    color: var(--primary-hover);
}

.card-header[b-c9nnuhm86o] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    background: var(--background-color);
}

.card-header i[b-c9nnuhm86o] {
    font-size: 1.25rem;
    color: var(--primary-color);
}

.card-header h2[b-c9nnuhm86o] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    color: #2c3e50;
}

.card-body[b-c9nnuhm86o] {
    padding: 1.5rem;
}

/* Info list (dt/dd) */
.info-list[b-c9nnuhm86o] {
    display: grid;
    grid-template-columns: 7rem 1fr;
    gap: 0.5rem 1rem;
    margin: 0;
}

.info-list dt[b-c9nnuhm86o] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.4px;
    display: flex;
    align-items: center;
}

.info-list dd[b-c9nnuhm86o] {
    margin: 0;
    font-size: 0.95rem;
    color: var(--text-color);
    display: flex;
    align-items: center;
    word-break: break-word;
}

.info-list a[b-c9nnuhm86o] {
    color: var(--primary-color);
    text-decoration: none;
}

.info-list a:hover[b-c9nnuhm86o] {
    text-decoration: underline;
}

/* Type badge */
.type-badge[b-c9nnuhm86o] {
    display: inline-block;
    padding: 0.2rem 0.65rem;
    background: #e7f1ff;
    color: var(--primary-color);
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

/* Delivery address */
.delivery-address[b-c9nnuhm86o] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    font-style: normal;
    font-size: 0.95rem;
    color: var(--text-color);
    line-height: 1.6;
}

/* No data placeholder */
.no-data[b-c9nnuhm86o] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-c9nnuhm86o] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-c9nnuhm86o] {
    margin: 0;
    font-size: 0.9rem;
}

/* Your Info card — spans full grid width */
.your-info-card[b-c9nnuhm86o] {
    grid-column: 1 / -1;
}

.your-info-card .card-header[b-c9nnuhm86o] {
    position: relative;
}

.your-info-edit-icon[b-c9nnuhm86o] {
    margin-left: auto;
    font-size: 1rem;
    color: var(--secondary-color);
    opacity: 0.55;
    transition: opacity 0.15s ease, color 0.15s ease;
}

.your-info-card:hover .your-info-edit-icon[b-c9nnuhm86o] {
    opacity: 1;
    color: var(--primary-color);
}

.your-info-card .card-body[b-c9nnuhm86o] {
    display: flex;
    flex-direction: row;
    gap: 0;
    padding: 0;
}

.your-info-section[b-c9nnuhm86o] {
    flex: 1;
    padding: 1.5rem;
}

.your-info-section-label[b-c9nnuhm86o] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin: 0 0 0.875rem;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--secondary-color);
}

.your-info-section-label i[b-c9nnuhm86o] {
    font-size: 0.9rem;
    color: var(--primary-color);
}

.your-info-divider[b-c9nnuhm86o] {
    width: 1px;
    background: var(--border-color);
    align-self: stretch;
    margin: 1rem 0;
}

.your-info-empty[b-c9nnuhm86o] {
    margin: 0;
    font-size: 0.9rem;
    color: var(--secondary-color);
    font-style: italic;
}

@media (max-width: 640px) {
    .your-info-card .card-body[b-c9nnuhm86o] {
        flex-direction: column;
    }

    .your-info-divider[b-c9nnuhm86o] {
        width: auto;
        height: 1px;
        margin: 0 1rem;
        align-self: auto;
    }
}

/* Credit Notes summary card */
.cn-available-positive[b-c9nnuhm86o] {
    color: #0a6640;
    font-weight: 600;
}

/* Quick Links */
.quick-links-card[b-c9nnuhm86o] {
    width: 100%;
}

.quick-links-grid[b-c9nnuhm86o] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 1rem;
}

.quick-link[b-c9nnuhm86o] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 1.5rem 1rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    text-decoration: none;
    color: var(--text-color);
    font-size: 0.9rem;
    font-weight: 500;
    text-align: center;
    transition: all 0.2s ease;
    background: var(--background-color);
}

.quick-link i[b-c9nnuhm86o] {
    font-size: 1.75rem;
    color: var(--primary-color);
}

.quick-link:hover[b-c9nnuhm86o] {
    border-color: var(--primary-color);
    background: #e7f1ff;
    color: var(--primary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 102, 204, 0.12);
}

/* Responsive */
@media (max-width: 992px) {
    .dashboard-grid[b-c9nnuhm86o] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .dashboard-page[b-c9nnuhm86o] {
        padding: 1rem;
        gap: 1.25rem;
    }

    .dashboard-welcome[b-c9nnuhm86o] {
        flex-direction: column;
        align-items: flex-start;
        padding: 1.5rem;
    }

    .welcome-text h1[b-c9nnuhm86o] {
        font-size: 1.5rem;
    }

    .dashboard-grid[b-c9nnuhm86o] {
        grid-template-columns: 1fr;
    }

    .quick-links-grid[b-c9nnuhm86o] {
        grid-template-columns: repeat(2, 1fr);
    }
}
/* /Components/Pages/CustomerOrderDetail.razor.rz.scp.css */
/* Page layout */
.order-detail-page[b-q0c6guf6uq] {
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-q0c6guf6uq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-q0c6guf6uq] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-q0c6guf6uq] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Error */
.detail-error[b-q0c6guf6uq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 2rem;
    text-align: center;
    color: var(--secondary-color);
}

.detail-error i[b-q0c6guf6uq] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}

/* Header */
.order-detail-header[b-q0c6guf6uq] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.back-link[b-q0c6guf6uq] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-q0c6guf6uq] {
    text-decoration: underline;
}

.order-detail-title-row[b-q0c6guf6uq] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.order-detail-title-row h1[b-q0c6guf6uq] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.order-id-badge[b-q0c6guf6uq] {
    font-family: monospace;
}

.order-placed-date[b-q0c6guf6uq] {
    margin: 0;
    font-size: 0.9rem;
    color: var(--secondary-color);
}

/* Cards */
.order-detail-body[b-q0c6guf6uq] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.order-detail-card[b-q0c6guf6uq] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 1.5rem;
}

.card-section-title[b-q0c6guf6uq] {
    font-size: 1rem;
    font-weight: 600;
    color: #2c3e50;
    margin: 0 0 1rem 0;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--border-color);
}

/* Items table */
.order-items-table-wrapper[b-q0c6guf6uq] {
    overflow-x: auto;
}

.order-items-table[b-q0c6guf6uq] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.order-items-table thead tr[b-q0c6guf6uq] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.order-items-table th[b-q0c6guf6uq] {
    padding: 0.6rem 0.75rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.order-items-table td[b-q0c6guf6uq] {
    padding: 0.65rem 0.75rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.order-items-table tbody tr:last-child td[b-q0c6guf6uq] {
    border-bottom: none;
}

.col-right[b-q0c6guf6uq] {
    text-align: right !important;
}

/* Amounts */
.amounts-list[b-q0c6guf6uq] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin: 0;
    max-width: 360px;
    margin-left: auto;
}

.amounts-row[b-q0c6guf6uq] {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    color: #2c3e50;
}

.amounts-row dt[b-q0c6guf6uq] {
    font-weight: 400;
    color: var(--secondary-color);
}

.amounts-row dd[b-q0c6guf6uq] {
    margin: 0;
    font-variant-numeric: tabular-nums;
}

.amounts-row--total[b-q0c6guf6uq] {
    padding-top: 0.5rem;
    border-top: 2px solid var(--border-color);
    margin-top: 0.25rem;
}

.amounts-row--total dt[b-q0c6guf6uq],
.amounts-row--total dd[b-q0c6guf6uq] {
    font-weight: 700;
    font-size: 1rem;
    color: #2c3e50;
}

/* Invoice section */
.invoice-section[b-q0c6guf6uq] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.invoice-number[b-q0c6guf6uq] {
    font-family: monospace;
    font-weight: 600;
    font-size: 0.95rem;
    color: #2c3e50;
}

.invoice-download-btn[b-q0c6guf6uq] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

/* Cancel card */
.cancel-card[b-q0c6guf6uq] {
    border: 1px solid #f8d7da;
}

.cancel-description[b-q0c6guf6uq] {
    font-size: 0.9rem;
    color: var(--secondary-color);
    margin: 0 0 1rem 0;
}

.cancel-confirm-text[b-q0c6guf6uq] {
    font-size: 0.9rem;
    color: #2c3e50;
    margin: 0 0 1rem 0;
}

.cancel-confirm-actions[b-q0c6guf6uq] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.cancel-error[b-q0c6guf6uq] {
    font-size: 0.875rem;
    color: #dc3545;
}

/* Status badges */
.order-status-badge[b-q0c6guf6uq] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
}

.order-status-badge--created[b-q0c6guf6uq] {
    background: #e7f1ff;
    color: var(--primary-color);
}

.order-status-badge--confirmed[b-q0c6guf6uq] {
    background: #fff3cd;
    color: #856404;
}

.order-status-badge--processing[b-q0c6guf6uq] {
    background: #fff3cd;
    color: #856404;
}

.order-status-badge--shipped[b-q0c6guf6uq] {
    background: #d1f0e0;
    color: #0a6640;
}

.order-status-badge--delivered[b-q0c6guf6uq] {
    background: #d1f0e0;
    color: #0a6640;
}

.order-status-badge--cancelled[b-q0c6guf6uq] {
    background: #f8d7da;
    color: #842029;
}
/* /Components/Pages/CustomerProfile.razor.rz.scp.css */
.customer-profile-page[b-6gf8gugntn] {
    max-width: 860px;
    margin: 0 auto;
    padding: 0;
}

/* Page header */
.page-header[b-6gf8gugntn] {
    position: relative;
    text-align: center;
    padding: 2.5rem 2rem 2rem;
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
    color: white;
    margin: -2rem -2rem 2rem -2rem;
    border-radius: 0 0 1rem 1rem;
}

.page-header .header-icon[b-6gf8gugntn] {
    font-size: 2.5rem;
    margin-bottom: 0.75rem;
    opacity: 0.9;
}

.page-header h1[b-6gf8gugntn] {
    margin: 0 0 0.4rem;
    font-size: 2rem;
    font-weight: 700;
}

.page-header .lead[b-6gf8gugntn] {
    margin: 0;
    opacity: 0.85;
    font-size: 1rem;
}

.back-link[b-6gf8gugntn] {
    position: absolute;
    top: 1.25rem;
    left: 1.5rem;
    color: rgba(255, 255, 255, 0.85);
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    transition: color 0.15s;
}

.back-link:hover[b-6gf8gugntn] {
    color: white;
}

/* Loading */
.loading-container[b-6gf8gugntn] {
    display: flex;
    justify-content: center;
    padding: 4rem 0;
}

/* Form cards */
.form-card[b-6gf8gugntn] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.75rem;
    padding: 1.75rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.section-title[b-6gf8gugntn] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 1.25rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #e9ecef;
}

.section-hint[b-6gf8gugntn] {
    color: #6c757d;
    font-size: 0.875rem;
    margin-top: -0.75rem;
    margin-bottom: 1.25rem;
}

/* Form layout */
.form-row[b-6gf8gugntn] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-group[b-6gf8gugntn] {
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
}

.form-group label[b-6gf8gugntn] {
    font-weight: 500;
    margin-bottom: 0.4rem;
    font-size: 0.9rem;
    color: #495057;
}

.form-group--narrow[b-6gf8gugntn] {
    max-width: 160px;
}

.required[b-6gf8gugntn] {
    color: #dc3545;
}

.optional[b-6gf8gugntn] {
    color: #6c757d;
    font-weight: 400;
    font-size: 0.8rem;
}

.field-error[b-6gf8gugntn] {
    color: #dc3545;
    font-size: 0.825rem;
    margin-top: 0.3rem;
}

/* Form actions */
.form-actions[b-6gf8gugntn] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 2rem;
}

.btn-save[b-6gf8gugntn] {
    padding: 0.6rem 1.75rem;
    font-size: 1rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

/* Responsive */
@media (max-width: 600px) {
    .form-row[b-6gf8gugntn] {
        grid-template-columns: 1fr;
    }

    .form-group--narrow[b-6gf8gugntn] {
        max-width: 100%;
    }

    .form-actions[b-6gf8gugntn] {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .form-actions .btn[b-6gf8gugntn] {
        text-align: center;
        justify-content: center;
    }
}
/* /Components/Pages/CustomerStatements.razor.rz.scp.css */
/* Page layout */
.statements-list-page[b-h9d4t7hppn] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-h9d4t7hppn] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-h9d4t7hppn] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-h9d4t7hppn] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.statements-list-header[b-h9d4t7hppn] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.statements-list-header-top[b-h9d4t7hppn] {
    display: flex;
    align-items: center;
}

.statements-list-header h1[b-h9d4t7hppn] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-h9d4t7hppn] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-h9d4t7hppn] {
    text-decoration: underline;
}

/* Card */
.statements-list-card[b-h9d4t7hppn] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-h9d4t7hppn] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-h9d4t7hppn] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-h9d4t7hppn] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.statements-table-wrapper[b-h9d4t7hppn] {
    overflow-x: auto;
}

.statements-table[b-h9d4t7hppn] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.statements-table thead tr[b-h9d4t7hppn] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.statements-table th[b-h9d4t7hppn] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.statements-table td[b-h9d4t7hppn] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.statements-table tbody tr:last-child td[b-h9d4t7hppn] {
    border-bottom: none;
}

.statements-table tbody tr:hover[b-h9d4t7hppn] {
    background: #f8f9fa;
}

.col-id[b-h9d4t7hppn] {
    font-size: 0.8rem;
    color: var(--secondary-color);
    width: 3rem;
}

.col-date[b-h9d4t7hppn] {
    white-space: nowrap;
    color: #495057;
}

.col-period[b-h9d4t7hppn] {
    white-space: nowrap;
    color: #495057;
    font-size: 0.85rem;
}

.col-period-unknown[b-h9d4t7hppn] {
    color: #ced4da;
}

/* Source badges */
.source-badge[b-h9d4t7hppn] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.2rem 0.6rem;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 600;
    white-space: nowrap;
}

.source-badge--system[b-h9d4t7hppn] {
    background: #e7f1ff;
    color: var(--primary-color);
}

.source-badge--manual[b-h9d4t7hppn] {
    background: #f3f0ff;
    color: #5b21b6;
}

/* Document link */
.doc-link[b-h9d4t7hppn] {
    color: var(--primary-color);
    font-size: 1.15rem;
    transition: color 0.2s;
    text-decoration: none;
}

.doc-link:hover[b-h9d4t7hppn] {
    color: #004999;
}

.doc-link-unavailable[b-h9d4t7hppn] {
    font-size: 1.15rem;
    color: #ced4da;
    cursor: default;
}

/* Pager */
.statements-pager[b-h9d4t7hppn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-wrap: wrap;
    gap: 0.75rem;
}

.statements-pager-info[b-h9d4t7hppn] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.statements-pager-controls[b-h9d4t7hppn] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.statements-pager-current[b-h9d4t7hppn] {
    font-size: 0.85rem;
    color: var(--text-color);
    font-weight: 500;
    white-space: nowrap;
}

/* Responsive */
@media (max-width: 640px) {
    .statements-list-page[b-h9d4t7hppn] {
        padding: 1rem;
        gap: 1rem;
    }
}

/* Title row */
.statements-list-title-row[b-h9d4t7hppn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

/* Actions column */
.col-actions[b-h9d4t7hppn] {
    width: 2.5rem;
    text-align: center;
}

.action-btn[b-h9d4t7hppn] {
    background: none;
    border: none;
    padding: 0.25rem 0.4rem;
    font-size: 1rem;
    color: var(--secondary-color);
    cursor: pointer;
    border-radius: 6px;
    transition: color 0.15s, background 0.15s;
    line-height: 1;
}

.action-btn:hover[b-h9d4t7hppn] {
    color: var(--primary-color);
    background: #e7f1ff;
}

.action-btn--danger:hover[b-h9d4t7hppn] {
    color: #dc2626;
    background: #fff5f5;
}

/* Delete modal */
.delete-modal[b-h9d4t7hppn] {
    max-width: 400px;
}

.delete-modal-message[b-h9d4t7hppn] {
    margin: 0;
    font-size: 0.875rem;
    color: #4a5568;
    line-height: 1.6;
}

/* Email modal backdrop */
.email-modal-backdrop[b-h9d4t7hppn] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

/* Email modal */
.email-modal[b-h9d4t7hppn] {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    width: 100%;
    max-width: 480px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.email-modal-header[b-h9d4t7hppn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem 0.75rem;
    border-bottom: 1px solid var(--border-color);
}

.email-modal-title[b-h9d4t7hppn] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #2c3e50;
}

.email-modal-close[b-h9d4t7hppn] {
    background: none;
    border: none;
    font-size: 1rem;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.2rem 0.4rem;
    border-radius: 4px;
    line-height: 1;
}

.email-modal-close:hover[b-h9d4t7hppn] {
    color: #2c3e50;
    background: #f3f4f6;
}

.email-modal-body[b-h9d4t7hppn] {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.email-modal-customer[b-h9d4t7hppn] {
    margin: 0;
    font-weight: 600;
    font-size: 0.95rem;
    color: #2c3e50;
}

.email-modal-help[b-h9d4t7hppn] {
    margin: 0;
    font-size: 0.82rem;
    color: var(--secondary-color);
}

.email-modal-no-users[b-h9d4t7hppn] {
    margin: 0;
    font-size: 0.85rem;
    color: var(--secondary-color);
    font-style: italic;
}

.email-modal-recipients[b-h9d4t7hppn] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 260px;
    overflow-y: auto;
}

.email-modal-recipient[b-h9d4t7hppn] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    cursor: pointer;
    font-size: 0.85rem;
    transition: background 0.1s;
}

.email-modal-recipient:hover[b-h9d4t7hppn] {
    background: #f8f9fa;
}

.email-modal-recipient input[type="checkbox"][b-h9d4t7hppn] {
    margin: 0;
    flex-shrink: 0;
    cursor: pointer;
}

.email-modal-recipient-name[b-h9d4t7hppn] {
    font-weight: 500;
    color: #2c3e50;
    white-space: nowrap;
}

.email-modal-recipient-email[b-h9d4t7hppn] {
    margin-left: auto;
    color: var(--secondary-color);
    font-size: 0.78rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
}

.email-modal-error[b-h9d4t7hppn] {
    padding: 0.5rem 0.75rem;
    background: #fff5f5;
    border: 1px solid #fca5a5;
    border-radius: 6px;
    color: #dc2626;
    font-size: 0.83rem;
}

.email-modal-success[b-h9d4t7hppn] {
    padding: 0.5rem 0.75rem;
    background: #f0fdf4;
    border: 1px solid #86efac;
    border-radius: 6px;
    color: #16a34a;
    font-size: 0.83rem;
}

.email-modal-footer[b-h9d4t7hppn] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.6rem;
    padding: 0.85rem 1.25rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
}

/* Extra address section */
.email-modal-extra-section[b-h9d4t7hppn] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px dashed var(--border-color);
}

.email-modal-extra-label[b-h9d4t7hppn] {
    margin: 0;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.email-modal-extra-input-row[b-h9d4t7hppn] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.email-modal-extra-input[b-h9d4t7hppn] {
    flex: 1;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: 0.35rem 0.65rem;
    font-size: 0.85rem;
    color: #2c3e50;
    outline: none;
    transition: border-color 0.15s;
}

.email-modal-extra-input:focus[b-h9d4t7hppn] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.1);
}

.email-modal-extra-list[b-h9d4t7hppn] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.email-modal-extra-tag[b-h9d4t7hppn] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: #e7f1ff;
    color: var(--primary-color);
    border-radius: 20px;
    padding: 0.2rem 0.35rem 0.2rem 0.65rem;
    font-size: 0.8rem;
    font-weight: 500;
}

.email-modal-extra-remove[b-h9d4t7hppn] {
    background: none;
    border: none;
    padding: 0;
    line-height: 1;
    color: var(--primary-color);
    cursor: pointer;
    opacity: 0.7;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
}

.email-modal-extra-remove:hover[b-h9d4t7hppn] {
    opacity: 1;
}
/* /Components/Pages/DealerApplicationForm.razor.rz.scp.css */
.dealer-app-page[b-83toeq9es1] {
    max-width: 860px;
    margin: 0 auto;
    padding: 0;
}

.page-header[b-83toeq9es1] {
    text-align: center;
    padding: 3rem 2rem;
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
    color: white;
    margin: -2rem -2rem 2rem -2rem;
    border-radius: 0 0 1rem 1rem;
}

.page-header .header-icon[b-83toeq9es1] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.9;
}

.page-header h1[b-83toeq9es1] {
    margin: 0 0 0.5rem;
    font-size: 2.25rem;
    font-weight: 700;
}

.page-header .lead[b-83toeq9es1] {
    margin: 0;
    opacity: 0.85;
    font-size: 1.1rem;
}

/* Form cards */
.form-card[b-83toeq9es1] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.75rem;
    padding: 1.75rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
}

.section-title[b-83toeq9es1] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 1.25rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #e9ecef;
}

.section-hint[b-83toeq9es1] {
    color: #6c757d;
    font-size: 0.9rem;
    margin-top: -0.75rem;
    margin-bottom: 1.25rem;
}

/* Form layout */
.form-row[b-83toeq9es1] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-group[b-83toeq9es1] {
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
}

.form-group label[b-83toeq9es1] {
    font-weight: 500;
    margin-bottom: 0.4rem;
    font-size: 0.9rem;
    color: #495057;
}

.form-group--narrow[b-83toeq9es1] {
    max-width: 160px;
}

.required[b-83toeq9es1] {
    color: #dc3545;
}

.optional[b-83toeq9es1] {
    color: #6c757d;
    font-weight: 400;
    font-size: 0.8rem;
}

.field-error[b-83toeq9es1] {
    color: #dc3545;
    font-size: 0.825rem;
    margin-top: 0.3rem;
}

/* Logo upload */
.logo-upload-area[b-83toeq9es1] {
    border: 2px dashed #ced4da;
    border-radius: 0.5rem;
    transition: border-color 0.2s;
}

.logo-upload-area:hover[b-83toeq9es1] {
    border-color: #2c3e50;
}

.logo-drop-label[b-83toeq9es1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 2rem 1rem;
    cursor: pointer;
    color: #6c757d;
    width: 100%;
}

.logo-drop-label i[b-83toeq9es1] {
    font-size: 2rem;
    color: #adb5bd;
}

.logo-drop-label span[b-83toeq9es1] {
    font-weight: 500;
    color: #495057;
}

.logo-drop-label small[b-83toeq9es1] {
    font-size: 0.8rem;
}

.logo-file-input[b-83toeq9es1] {
    display: none;
}

.logo-preview[b-83toeq9es1] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1rem;
}

.logo-preview img[b-83toeq9es1] {
    max-height: 80px;
    max-width: 200px;
    object-fit: contain;
    border-radius: 0.25rem;
    border: 1px solid #dee2e6;
}

.logo-remove[b-83toeq9es1] {
    flex-shrink: 0;
}

/* T&C notice */
.tc-notice[b-83toeq9es1] {
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    padding: 0.85rem 1.25rem;
    font-size: 0.9rem;
    color: #495057;
    margin-bottom: 1.25rem;
}

.tc-notice a[b-83toeq9es1] {
    color: #2c3e50;
    font-weight: 600;
    text-decoration: underline;
}

/* reCAPTCHA */
.recaptcha-container[b-83toeq9es1] {
    margin: 0 0 1.5rem 0;
}

/* Submit button */
.form-actions[b-83toeq9es1] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 2rem;
}

.btn-submit[b-83toeq9es1] {
    padding: 0.65rem 2rem;
    font-size: 1rem;
    font-weight: 600;
}

/* Success panel */
.success-panel[b-83toeq9es1] {
    background: #fff;
    border: 1px solid #d1e7dd;
    border-radius: 0.75rem;
    padding: 3rem 2rem;
    text-align: center;
    color: #0f5132;
    margin-bottom: 2rem;
}

.success-icon[b-83toeq9es1] {
    font-size: 4rem;
    color: #198754;
    margin-bottom: 1rem;
}

.success-panel h2[b-83toeq9es1] {
    margin-bottom: 0.75rem;
}

.success-panel .muted[b-83toeq9es1] {
    color: #6c757d;
}

/* Responsive */
@media (max-width: 600px) {
    .form-row[b-83toeq9es1] {
        grid-template-columns: 1fr;
    }

    .form-group--narrow[b-83toeq9es1] {
        max-width: 100%;
    }
}
/* /Components/Pages/DealerApplications.razor.rz.scp.css */
.applications-page[b-9d7ciyvwa3] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* Loading */
.loading-container[b-9d7ciyvwa3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-9d7ciyvwa3] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-9d7ciyvwa3] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Page Header */
.page-header[b-9d7ciyvwa3] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #004999 100%);
    color: white;
    border-radius: 12px;
    padding: 2rem 2.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.header-text[b-9d7ciyvwa3] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.btn-back[b-9d7ciyvwa3] {
    background: rgba(255, 255, 255, 0.15);
    border: none;
    color: white;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    font-size: 1.1rem;
    transition: background 0.2s ease;
}

.btn-back:hover[b-9d7ciyvwa3] {
    background: rgba(255, 255, 255, 0.25);
}

.page-header h1[b-9d7ciyvwa3] {
    margin: 0 0 0.2rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: white;
}

.page-header p[b-9d7ciyvwa3] {
    margin: 0;
    opacity: 0.85;
    font-size: 0.95rem;
}

.pending-badge[b-9d7ciyvwa3] {
    background: #fff3cd;
    color: #856404;
    font-size: 0.9rem;
    font-weight: 700;
    padding: 0.35rem 1rem;
    border-radius: 20px;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Empty State */
.empty-state[b-9d7ciyvwa3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 5rem 2rem;
    text-align: center;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.empty-state i[b-9d7ciyvwa3] {
    font-size: 3rem;
    color: #28a745;
    margin-bottom: 1rem;
}

.empty-state h2[b-9d7ciyvwa3] {
    margin: 0 0 0.5rem;
    font-size: 1.4rem;
    color: #2c3e50;
}

.empty-state p[b-9d7ciyvwa3] {
    margin: 0;
    color: var(--secondary-color);
}

/* Table */
.applications-table-wrapper[b-9d7ciyvwa3] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow-x: auto;
}

.applications-table[b-9d7ciyvwa3] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.applications-table thead th[b-9d7ciyvwa3] {
    padding: 1rem 1.25rem;
    text-align: left;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--secondary-color);
    background: var(--background-color);
    border-bottom: 1px solid var(--border-color);
    white-space: nowrap;
}

.applications-table tbody tr[b-9d7ciyvwa3] {
    border-bottom: 1px solid var(--border-color);
    transition: background 0.15s ease;
}

.row-clickable[b-9d7ciyvwa3] {
    cursor: pointer;
}

.applications-table tbody tr:last-child[b-9d7ciyvwa3] {
    border-bottom: none;
}

.applications-table tbody tr:hover[b-9d7ciyvwa3] {
    background: #f8faff;
}

.col-review[b-9d7ciyvwa3] {
    width: 2rem;
    text-align: right;
    white-space: nowrap;
}

.row-chevron[b-9d7ciyvwa3] {
    font-size: 0.85rem;
    color: var(--secondary-color);
    opacity: 0.4;
    transition: opacity 0.15s ease;
}

.row-clickable:hover .row-chevron[b-9d7ciyvwa3] {
    opacity: 1;
    color: var(--primary-color);
}

.applications-table td[b-9d7ciyvwa3] {
    padding: 1rem 1.25rem;
    vertical-align: top;
    color: #2c3e50;
}

/* Column styles */
.col-date[b-9d7ciyvwa3] {
    white-space: nowrap;
}

.date-value[b-9d7ciyvwa3] {
    display: block;
    font-weight: 600;
}

.time-value[b-9d7ciyvwa3] {
    display: block;
    font-size: 0.8rem;
    color: var(--secondary-color);
    margin-top: 0.1rem;
}

.col-trading-name[b-9d7ciyvwa3] {
    min-width: 160px;
}

.trading-name[b-9d7ciyvwa3] {
    display: block;
    font-weight: 600;
}

.registered-name[b-9d7ciyvwa3] {
    display: block;
    font-size: 0.8rem;
    color: var(--secondary-color);
    margin-top: 0.1rem;
}

.col-email a[b-9d7ciyvwa3],
.col-mobile a[b-9d7ciyvwa3],
.col-web a[b-9d7ciyvwa3] {
    color: var(--primary-color);
    text-decoration: none;
}

.col-email a:hover[b-9d7ciyvwa3],
.col-mobile a:hover[b-9d7ciyvwa3],
.col-web a:hover[b-9d7ciyvwa3] {
    text-decoration: underline;
}

.col-web a[b-9d7ciyvwa3] {
    max-width: 200px;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom;
}

.no-value[b-9d7ciyvwa3] {
    color: var(--secondary-color);
}

/* Responsive */
@media (max-width: 768px) {
    .applications-page[b-9d7ciyvwa3] {
        padding: 1rem;
        gap: 1.25rem;
    }

    .page-header[b-9d7ciyvwa3] {
        padding: 1.5rem;
        flex-direction: column;
        align-items: flex-start;
    }

    .applications-table thead th[b-9d7ciyvwa3],
    .applications-table td[b-9d7ciyvwa3] {
        padding: 0.75rem 1rem;
    }
}
/* /Components/Pages/DealerApplicationView.razor.rz.scp.css */
.app-view-page[b-jcq8h6y27o] {
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.page-header[b-jcq8h6y27o] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 2rem;
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
    color: white;
    margin: -2rem -2rem 0 -2rem;
    border-radius: 0 0 1rem 1rem;
}

/* Back button */
.btn-back[b-jcq8h6y27o] {
    background: rgba(255, 255, 255, 0.15);
    border: none;
    color: white;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    font-size: 1.1rem;
    transition: background 0.2s ease;
}

.btn-back:hover[b-jcq8h6y27o] {
    background: rgba(255, 255, 255, 0.28);
}

.page-header .header-icon[b-jcq8h6y27o] {
    font-size: 2.5rem;
    opacity: 0.9;
    flex-shrink: 0;
}

.page-header .header-text[b-jcq8h6y27o] {
    flex: 1;
}

.page-header h1[b-jcq8h6y27o] {
    margin: 0 0 0.25rem;
    font-size: 1.75rem;
    font-weight: 700;
}

.page-header .lead[b-jcq8h6y27o] {
    margin: 0;
    opacity: 0.85;
    font-size: 1rem;
}

/* Status badge */
.status-badge[b-jcq8h6y27o] {
    display: inline-block;
    padding: 0.35rem 0.85rem;
    border-radius: 50px;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.status-pending[b-jcq8h6y27o] {
    background: #fff3cd;
    color: #856404;
}

.status-approved[b-jcq8h6y27o] {
    background: #d1e7dd;
    color: #0f5132;
}

.status-rejected[b-jcq8h6y27o] {
    background: #f8d7da;
    color: #842029;
}

/* Grid layout */
.view-grid[b-jcq8h6y27o] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.view-card[b-jcq8h6y27o] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.75rem;
    padding: 1.5rem;
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
}

.section-title[b-jcq8h6y27o] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 1rem;
    padding-bottom: 0.65rem;
    border-bottom: 2px solid #e9ecef;
}

.shop-logo[b-jcq8h6y27o] {
    margin-bottom: 1rem;
}

.shop-logo img[b-jcq8h6y27o] {
    max-height: 100px;
    max-width: 220px;
    object-fit: contain;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    padding: 0.25rem;
}

/* Detail list */
.detail-list[b-jcq8h6y27o] {
    margin: 0;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.4rem 1rem;
    align-items: baseline;
}

.detail-list dt[b-jcq8h6y27o] {
    font-weight: 600;
    color: #495057;
    font-size: 0.85rem;
    white-space: nowrap;
}

.detail-list dd[b-jcq8h6y27o] {
    margin: 0;
    color: #212529;
    word-break: break-word;
}

/* Not found */
.not-found-panel[b-jcq8h6y27o] {
    text-align: center;
    padding: 4rem 2rem;
    color: #6c757d;
}

.not-found-panel i[b-jcq8h6y27o] {
    font-size: 3rem;
    margin-bottom: 1rem;
    display: block;
}

/* Loading */
.loading-container[b-jcq8h6y27o] {
    text-align: center;
    padding: 4rem 2rem;
    color: #6c757d;
}

@media (max-width: 700px) {
    .view-grid[b-jcq8h6y27o] {
        grid-template-columns: 1fr;
    }

    .page-header[b-jcq8h6y27o] {
        flex-direction: column;
        text-align: center;
    }

    .review-actions[b-jcq8h6y27o] {
        flex-direction: column;
    }

    .btn-review[b-jcq8h6y27o] {
        width: 100%;
    }
}

.customer-type-field[b-jcq8h6y27o] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}

.customer-type-field label[b-jcq8h6y27o] {
    font-weight: 600;
    font-size: 0.9rem;
    color: #2c3e50;
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.4rem;
}

/* Review Panel */
.review-panel[b-jcq8h6y27o] {
    margin-top: 0;
}

.logo-upload-field[b-jcq8h6y27o] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}

.logo-upload-field label[b-jcq8h6y27o] {
    font-weight: 600;
    font-size: 0.9rem;
    color: #2c3e50;
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.required-mark[b-jcq8h6y27o] {
    color: #dc3545;
    font-weight: 700;
}

.field-hint[b-jcq8h6y27o] {
    font-weight: 400;
    font-size: 0.8rem;
    color: #6c757d;
}

.logo-error[b-jcq8h6y27o] {
    font-size: 0.85rem;
    color: #dc3545;
}

.logo-preview-wrap[b-jcq8h6y27o] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 0.5rem;
    padding: 0.75rem;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 6px;
}

.logo-preview-img[b-jcq8h6y27o] {
    max-height: 80px;
    object-fit: contain;
    border-radius: 4px;
    border: 1px solid #dee2e6;
    background: white;
    padding: 0.25rem;
}

.logo-preview-name[b-jcq8h6y27o] {
    font-size: 0.85rem;
    color: #495057;
    word-break: break-all;
}

.review-notes-field[b-jcq8h6y27o] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}

.review-notes-field label[b-jcq8h6y27o] {
    font-weight: 600;
    font-size: 0.9rem;
    color: #2c3e50;
}

.optional[b-jcq8h6y27o] {
    font-weight: 400;
    color: #6c757d;
    font-size: 0.85rem;
}

.review-actions[b-jcq8h6y27o] {
    display: flex;
    gap: 1rem;
}

.btn-review[b-jcq8h6y27o] {
    min-width: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* /Components/Pages/DealerTerms.razor.rz.scp.css */
.terms-page[b-4jhhe63xot] {
    max-width: 860px;
    margin: 0 auto;
}

.page-header[b-4jhhe63xot] {
    text-align: center;
    padding: 3rem 2rem;
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
    color: white;
    margin: -2rem -2rem 2.5rem -2rem;
    border-radius: 0 0 1rem 1rem;
}

.page-header .header-icon[b-4jhhe63xot] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.9;
}

.page-header h1[b-4jhhe63xot] {
    margin: 0;
    font-size: 2.25rem;
    font-weight: 700;
}

.terms-body[b-4jhhe63xot] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.75rem;
    padding: 2.5rem;
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
    line-height: 1.7;
}

.terms-body h2[b-4jhhe63xot] {
    font-size: 1.15rem;
    font-weight: 700;
    color: #2c3e50;
    margin-top: 2rem;
    margin-bottom: 0.75rem;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid #e9ecef;
}

.terms-body ul[b-4jhhe63xot] {
    padding-left: 1.5rem;
    margin-bottom: 0.5rem;
}

.terms-body ul ul[b-4jhhe63xot] {
    margin-top: 0.4rem;
}

.terms-body li[b-4jhhe63xot] {
    margin-bottom: 0.35rem;
    color: #333;
}

.acceptance-note[b-4jhhe63xot] {
    margin-top: 2.5rem;
    padding: 1rem 1.25rem;
    background: #f8f9fa;
    border-left: 4px solid #2c3e50;
    border-radius: 0 0.5rem 0.5rem 0;
    color: #495057;
}

.terms-footer[b-4jhhe63xot] {
    margin-top: 2.5rem;
    padding-top: 1rem;
    border-top: 1px solid #dee2e6;
    font-size: 0.9rem;
    color: #6c757d;
}

.terms-footer a[b-4jhhe63xot] {
    color: #2c3e50;
    font-weight: 600;
}
/* /Components/Pages/DeliveryServices.razor.rz.scp.css */
/* Page layout */
.ds-page[b-q30k25g2an] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-q30k25g2an] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-q30k25g2an] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-q30k25g2an] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.ds-header[b-q30k25g2an] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.ds-header-top[b-q30k25g2an] {
    display: flex;
    align-items: center;
}

.ds-header-row[b-q30k25g2an] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.ds-header-row h1[b-q30k25g2an] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-q30k25g2an] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-q30k25g2an] {
    text-decoration: underline;
}

.btn-add[b-q30k25g2an] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* Filter */
.ds-filter[b-q30k25g2an] {
    display: flex;
    align-items: center;
}

.ds-filter-input-wrapper[b-q30k25g2an] {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 400px;
}

.ds-filter-input-wrapper > i[b-q30k25g2an] {
    position: absolute;
    left: 0.75rem;
    color: var(--secondary-color);
    font-size: 0.9rem;
    pointer-events: none;
}

.ds-filter-input[b-q30k25g2an] {
    width: 100%;
    padding: 0.5rem 2.25rem 0.5rem 2.25rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    font-size: 0.9rem;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.ds-filter-input:focus[b-q30k25g2an] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 105, 217, 0.12);
}

.ds-filter-clear[b-q30k25g2an] {
    position: absolute;
    right: 0.5rem;
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
    font-size: 0.8rem;
    border-radius: 4px;
    transition: color 0.15s;
}

.ds-filter-clear:hover[b-q30k25g2an] {
    color: var(--text-color);
}

/* Card */
.ds-card[b-q30k25g2an] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-q30k25g2an] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-q30k25g2an] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-q30k25g2an] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.ds-table-wrapper[b-q30k25g2an] {
    overflow-x: auto;
}

.ds-table[b-q30k25g2an] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.ds-table thead tr[b-q30k25g2an] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.ds-table th[b-q30k25g2an] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.ds-table td[b-q30k25g2an] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.ds-table tbody tr:last-child td[b-q30k25g2an] {
    border-bottom: none;
}

.ds-table tbody tr:hover[b-q30k25g2an] {
    background: #f8f9fa;
}

.col-center[b-q30k25g2an] {
    text-align: center;
    width: 5rem;
}

/* Pager */
.ds-pager[b-q30k25g2an] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-wrap: wrap;
    gap: 0.5rem;
}

.ds-pager-info[b-q30k25g2an] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.ds-pager-controls[b-q30k25g2an] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.ds-pager-current[b-q30k25g2an] {
    font-size: 0.85rem;
    color: var(--secondary-color);
    white-space: nowrap;
}

/* Modal */
.ds-modal-backdrop[b-q30k25g2an] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 1rem;
}

.ds-modal[b-q30k25g2an] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    width: 100%;
    max-width: 480px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.ds-modal-header[b-q30k25g2an] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    background: var(--background-color);
}

.ds-modal-header h2[b-q30k25g2an] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.ds-modal-close[b-q30k25g2an] {
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    font-size: 1rem;
    border-radius: 4px;
    line-height: 1;
    transition: color 0.15s;
}

.ds-modal-close:hover[b-q30k25g2an] {
    color: var(--text-color);
}

.ds-modal-body[b-q30k25g2an] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.ds-modal-footer[b-q30k25g2an] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
}

/* Form */
.form-group[b-q30k25g2an] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-q30k25g2an] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
}

.required[b-q30k25g2an] {
    color: #dc3545;
}

.field-error[b-q30k25g2an] {
    font-size: 0.8rem;
    color: #dc3545;
    margin-top: 0.15rem;
}

/* Drag & drop */
.col-drag[b-q30k25g2an] {
    width: 2.5rem;
    text-align: center;
    padding-left: 0.5rem;
    padding-right: 0;
}

.drag-handle[b-q30k25g2an] {
    cursor: grab;
    color: #adb5bd;
    font-size: 1.1rem;
    transition: color 0.15s;
}

.drag-handle:hover[b-q30k25g2an] {
    color: #495057;
}

.ds-table tbody tr[draggable="true"][b-q30k25g2an] {
    cursor: grab;
}

.ds-table tbody tr[draggable="true"]:active[b-q30k25g2an] {
    cursor: grabbing;
}

.ds-table tbody tr.dragging[b-q30k25g2an] {
    opacity: 0.35;
}

.ds-table tbody tr.drag-over-above[b-q30k25g2an] {
    box-shadow: inset 0 3px 0 0 var(--primary-color, #0d6efd);
}

.ds-table tbody tr.drag-over-below[b-q30k25g2an] {
    box-shadow: inset 0 -3px 0 0 var(--primary-color, #0d6efd);
}
/* /Components/Pages/ExpenseCreate.razor.rz.scp.css */
/* ── Page layout ── */
.exc-page[b-5yjqjhksqu] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ── Loading ── */
.loading-container[b-5yjqjhksqu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-5yjqjhksqu] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-5yjqjhksqu] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* ── Form card ── */
.form-card[b-5yjqjhksqu] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.section-title[b-5yjqjhksqu] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #2c3e50;
    margin: 0 0 0.25rem;
}

.section-hint[b-5yjqjhksqu] {
    font-size: 0.85rem;
    color: #6c757d;
    margin: -0.5rem 0 0;
}

.form-row[b-5yjqjhksqu] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.form-group[b-5yjqjhksqu] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1 1 200px;
}

.form-card > .form-group[b-5yjqjhksqu] {
    flex: 0 0 auto;
}

.form-group label[b-5yjqjhksqu] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #495057;
    margin: 0;
}

.required[b-5yjqjhksqu] {
    color: #dc3545;
}

.optional[b-5yjqjhksqu] {
    color: #adb5bd;
    font-weight: 400;
}

.field-error[b-5yjqjhksqu] {
    font-size: 0.78rem;
    color: #dc3545;
    margin-top: 0.15rem;
}

/* ── Input prefix / suffix ── */
.input-prefix-group[b-5yjqjhksqu] {
    display: flex;
    align-items: stretch;
}

.input-prefix-group .form-control[b-5yjqjhksqu] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.input-prefix[b-5yjqjhksqu] {
    display: flex;
    align-items: center;
    padding: 0.375rem 0.6rem;
    background: #e9ecef;
    border: 1px solid #ced4da;
    border-right: none;
    border-radius: 6px 0 0 6px;
    font-size: 0.9rem;
    color: #495057;
    white-space: nowrap;
}

.input-prefix-group-sm[b-5yjqjhksqu] {
    display: flex;
    align-items: stretch;
}

.input-prefix-group-sm .form-control[b-5yjqjhksqu] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.input-prefix-sm[b-5yjqjhksqu] {
    display: flex;
    align-items: center;
    padding: 0.2rem 0.4rem;
    background: #e9ecef;
    border: 1px solid #ced4da;
    border-right: none;
    border-radius: 4px 0 0 4px;
    font-size: 0.8rem;
    color: #495057;
    white-space: nowrap;
}

.input-suffix-group-sm[b-5yjqjhksqu] {
    display: flex;
    align-items: stretch;
}

.input-suffix-group-sm .form-control[b-5yjqjhksqu] {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-suffix-sm[b-5yjqjhksqu] {
    display: flex;
    align-items: center;
    padding: 0.2rem 0.4rem;
    background: #e9ecef;
    border: 1px solid #ced4da;
    border-left: none;
    border-radius: 0 4px 4px 0;
    font-size: 0.8rem;
    color: #495057;
    white-space: nowrap;
}

/* ── Type selector ── */
.type-selector[b-5yjqjhksqu] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.type-option[b-5yjqjhksqu] {
    display: flex;
    cursor: pointer;
    border: 2px solid #dee2e6;
    border-radius: 10px;
    padding: 1rem 1.25rem;
    flex: 1 1 240px;
    transition: border-color 0.15s, background 0.15s;
    user-select: none;
}

.type-option input[type="radio"][b-5yjqjhksqu] {
    display: none;
}

.type-option--selected[b-5yjqjhksqu] {
    border-color: var(--primary-color, #0d6efd);
    background: #f0f6ff;
}

.type-option-body[b-5yjqjhksqu] {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
}

.type-option-body i[b-5yjqjhksqu] {
    font-size: 1.75rem;
    color: var(--primary-color, #0d6efd);
    margin-top: 0.1rem;
    flex-shrink: 0;
}

.type-option-body strong[b-5yjqjhksqu] {
    display: block;
    font-size: 0.95rem;
    font-weight: 700;
    color: #2c3e50;
}

.type-option-body small[b-5yjqjhksqu] {
    display: block;
    font-size: 0.8rem;
    color: #6c757d;
    margin-top: 0.2rem;
}

/* ── Uploaded file ── */
.uploaded-file[b-5yjqjhksqu] {
    display: flex;
    align-items: center;
    background: #f0fdf4;
    border: 1px solid #d1fae5;
    border-radius: 8px;
    padding: 0.6rem 1rem;
    font-size: 0.9rem;
    color: #198754;
}

/* ── Line items ── */
.li-header[b-5yjqjhksqu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.li-header-actions[b-5yjqjhksqu] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.li-vat-toggle[b-5yjqjhksqu] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.85rem;
    color: #495057;
    user-select: none;
    white-space: nowrap;
}

.li-empty[b-5yjqjhksqu] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1.5rem;
    background: #f8f9fa;
    border-radius: 8px;
    color: #adb5bd;
    font-size: 0.9rem;
}

.li-empty i[b-5yjqjhksqu] {
    font-size: 1.5rem;
}

.li-table-wrapper[b-5yjqjhksqu] {
    overflow-x: auto;
    overflow-y: visible;
}

.li-table[b-5yjqjhksqu] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
    min-width: 860px;
}

.li-table thead tr[b-5yjqjhksqu] {
    background: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
}

.li-table th[b-5yjqjhksqu] {
    padding: 0.5rem 0.5rem;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
    text-align: left;
}

.li-table td[b-5yjqjhksqu] {
    padding: 0.4rem 0.5rem;
    border-bottom: 1px solid #f1f3f5;
    vertical-align: top;
}

.li-totals-row td[b-5yjqjhksqu] {
    border-top: 2px solid #dee2e6;
    border-bottom: none;
    padding-top: 0.6rem;
    background: #f8f9fa;
}

.col-right[b-5yjqjhksqu] {
    text-align: right !important;
}

/* ── Voucher preview panel ── */
.voucher-preview[b-5yjqjhksqu] {
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    padding: 1rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.voucher-preview-row[b-5yjqjhksqu] {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
}

.voucher-preview-label[b-5yjqjhksqu] {
    min-width: 140px;
    font-size: 0.8125rem;
    color: #6c757d;
    flex-shrink: 0;
}

.voucher-preview-value[b-5yjqjhksqu] {
    font-size: 0.9375rem;
    color: #212529;
}
}

.col-center[b-5yjqjhksqu] {
    text-align: center !important;
}

.tabnum[b-5yjqjhksqu] {
    font-variant-numeric: tabular-nums;
}

.fw-600[b-5yjqjhksqu] {
    font-weight: 600;
}

.total-cell[b-5yjqjhksqu] {
    font-size: 0.9rem;
}

/* ── Summary card ── */
.summary-card[b-5yjqjhksqu] {
    align-self: flex-end;
    min-width: 280px;
    max-width: 360px;
}

.summary-grid[b-5yjqjhksqu] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.3rem 1.5rem;
    align-items: center;
}

.summary-label[b-5yjqjhksqu] {
    font-size: 0.875rem;
    color: #495057;
}

.summary-value[b-5yjqjhksqu] {
    font-size: 0.875rem;
    text-align: right;
}

.fw-700[b-5yjqjhksqu] {
    font-weight: 700;
}

.total-value[b-5yjqjhksqu] {
    font-size: 1.05rem;
    color: #2c3e50;
    padding-top: 0.25rem;
    border-top: 2px solid #dee2e6;
}

/* ── Form actions ── */
.form-actions[b-5yjqjhksqu] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding-top: 0.5rem;
}
/* /Components/Pages/Expenses.razor.rz.scp.css */
/* ── Page layout ── */
.exp-page[b-fn98jidian] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ── Loading ── */
.loading-container[b-fn98jidian] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-fn98jidian] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-fn98jidian] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* ── Header ── */
.exp-header[b-fn98jidian] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.exp-header-top[b-fn98jidian] {
    display: flex;
    align-items: center;
}

.back-link[b-fn98jidian] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-fn98jidian] {
    text-decoration: underline;
}

.exp-header-row[b-fn98jidian] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.exp-header-row h1[b-fn98jidian] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.btn-add[b-fn98jidian] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* ── Filters ── */
.exp-filters[b-fn98jidian] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    padding: 1rem 1.25rem;
}

.exp-filter-row[b-fn98jidian] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: flex-end;
}

.exp-filter-group[b-fn98jidian] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1 1 140px;
}

.exp-filter-group label[b-fn98jidian] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #495057;
    margin: 0;
}

.exp-filter-actions[b-fn98jidian] {
    display: flex;
    align-items: flex-end;
}

/* ── Card ── */
.exp-card[b-fn98jidian] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    overflow: hidden;
}

/* ── No data ── */
.no-data[b-fn98jidian] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 4rem 2rem;
    color: #adb5bd;
    gap: 0.75rem;
}

.no-data i[b-fn98jidian] {
    font-size: 2.5rem;
}

.no-data p[b-fn98jidian] {
    font-size: 1rem;
    margin: 0;
}

/* ── Table ── */
.exp-table-wrapper[b-fn98jidian] {
    overflow-x: auto;
}

.exp-table[b-fn98jidian] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.exp-table thead tr[b-fn98jidian] {
    background: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
}

.exp-table th[b-fn98jidian] {
    padding: 0.75rem 1rem;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
    text-align: left;
}

.exp-table td[b-fn98jidian] {
    padding: 0.65rem 1rem;
    border-bottom: 1px solid #f1f3f5;
    vertical-align: middle;
}

.exp-table tbody tr:hover[b-fn98jidian] {
    background: #f8f9fb;
}

.col-right[b-fn98jidian] {
    text-align: right !important;
}

.col-center[b-fn98jidian] {
    text-align: center !important;
}

.tabnum[b-fn98jidian] {
    font-variant-numeric: tabular-nums;
}

.fw-600[b-fn98jidian] {
    font-weight: 600;
}

.exp-number[b-fn98jidian] {
    font-family: monospace;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
}

.exp-desc[b-fn98jidian] {
    color: #495057;
    max-width: 300px;
}

/* ── Type badges ── */
.exp-type[b-fn98jidian] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.55rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.exp-type--invoicereceipt[b-fn98jidian] {
    background: #e8f4ff;
    color: #0d6efd;
}

.exp-type--internalvoucher[b-fn98jidian] {
    background: #f0fdf4;
    color: #198754;
}

/* ── Paid badge ── */
.exp-paid-badge[b-fn98jidian] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
}

.exp-paid-badge--paid[b-fn98jidian] {
    color: #198754;
}

/* ── Doc link ── */
.doc-link[b-fn98jidian] {
    color: #dc3545;
    font-size: 1.1rem;
    text-decoration: none;
}

.doc-link:hover[b-fn98jidian] {
    color: #b02a37;
}

/* ── Pager ── */
.exp-pager[b-fn98jidian] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1.25rem;
    border-top: 1px solid #dee2e6;
    gap: 1rem;
    flex-wrap: wrap;
}

.exp-pager-info[b-fn98jidian] {
    font-size: 0.85rem;
    color: #6c757d;
}

.exp-pager-controls[b-fn98jidian] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.exp-pager-current[b-fn98jidian] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #495057;
    padding: 0 0.25rem;
}
/* /Components/Pages/ExpenseVoucherCreate.razor.rz.scp.css */
/* ── Page wrapper ── */
.ev-create-page[b-00p4ivi552] {
    max-width: 900px;
    margin: 0 auto;
    padding: 0;
}

/* ── Loading ── */
.loading-container[b-00p4ivi552] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-00p4ivi552] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-00p4ivi552] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* ── Page header (blue gradient banner) ── */
.page-header[b-00p4ivi552] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 2rem;
    background: linear-gradient(135deg, var(--primary-color) 0%, #004999 100%);
    color: white;
    margin: -2rem -2rem 2rem -2rem;
    border-radius: 0 0 1rem 1rem;
}

.btn-back[b-00p4ivi552] {
    background: rgba(255, 255, 255, 0.15);
    border: none;
    color: white;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    font-size: 1.1rem;
    transition: background 0.2s ease;
}

.btn-back:hover[b-00p4ivi552] {
    background: rgba(255, 255, 255, 0.25);
}

.header-icon[b-00p4ivi552] {
    font-size: 2.5rem;
    opacity: 0.9;
    flex-shrink: 0;
}

.page-header .header-text[b-00p4ivi552] {
    flex: 1;
}

.page-header h1[b-00p4ivi552] {
    margin: 0 0 0.2rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: white;
}

.page-header p[b-00p4ivi552] {
    margin: 0;
    opacity: 0.85;
    font-size: 0.95rem;
}

/* ── Alerts ── */
.alert[b-00p4ivi552] {
    border-radius: 0.5rem;
    margin-bottom: 1.25rem;
    font-size: 0.9rem;
}

/* ── Form cards ── */
.form-card[b-00p4ivi552] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.75rem;
    padding: 1.75rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.section-title[b-00p4ivi552] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 1.25rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #e9ecef;
    display: flex;
    align-items: center;
}

/* ── Form layout ── */
.form-row[b-00p4ivi552] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-group[b-00p4ivi552] {
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
}

.form-group:last-child[b-00p4ivi552] {
    margin-bottom: 0;
}

.form-group label[b-00p4ivi552] {
    font-weight: 500;
    margin-bottom: 0.4rem;
    font-size: 0.9rem;
    color: #495057;
}

.required[b-00p4ivi552] {
    color: #dc3545;
}

.optional[b-00p4ivi552] {
    color: #6c757d;
    font-weight: 400;
    font-size: 0.8rem;
}

.field-error[b-00p4ivi552] {
    color: #dc3545;
    font-size: 0.825rem;
    margin-top: 0.3rem;
}

/* ── Currency prefix input ── */
.input-prefix-group[b-00p4ivi552] {
    display: flex;
    align-items: stretch;
}

.input-prefix[b-00p4ivi552] {
    display: flex;
    align-items: center;
    padding: 0.375rem 0.75rem;
    background: #e9ecef;
    border: 1px solid #ced4da;
    border-right: none;
    border-radius: 0.375rem 0 0 0.375rem;
    font-size: 0.9rem;
    color: #495057;
    font-weight: 500;
    white-space: nowrap;
}

.input-prefix-group .form-control[b-00p4ivi552] {
    border-radius: 0 0.375rem 0.375rem 0;
}

/* ── Form actions ── */
.form-actions[b-00p4ivi552] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-bottom: 2rem;
}

.btn-submit[b-00p4ivi552] {
    padding: 0.6rem 1.75rem;
    font-size: 1rem;
    font-weight: 600;
}

/* ── Responsive ── */
@media (max-width: 640px) {
    .form-row[b-00p4ivi552] {
        grid-template-columns: 1fr;
    }

    .page-header[b-00p4ivi552] {
        padding: 1.5rem 1rem;
        margin: -1.5rem -1rem 1.5rem -1rem;
    }

    .page-header h1[b-00p4ivi552] {
        font-size: 1.35rem;
    }

    .form-card[b-00p4ivi552] {
        padding: 1.25rem;
    }

    .form-actions[b-00p4ivi552] {
        flex-direction: column-reverse;
    }
}
/* /Components/Pages/ExpenseVouchers.razor.rz.scp.css */
/* ── Page layout ── */
.ev-page[b-7weq7rhvj8] {
    padding: 2rem;
    max-width: 1300px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ── Loading ── */
.loading-container[b-7weq7rhvj8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-7weq7rhvj8] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-7weq7rhvj8] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* ── Header ── */
.ev-header[b-7weq7rhvj8] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.ev-header-top[b-7weq7rhvj8] {
    display: flex;
    align-items: center;
}

.back-link[b-7weq7rhvj8] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-7weq7rhvj8] {
    text-decoration: underline;
}

.ev-header-row[b-7weq7rhvj8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.ev-header-row h1[b-7weq7rhvj8] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.btn-add[b-7weq7rhvj8] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* ── Filter bar ── */
.ev-filters[b-7weq7rhvj8] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 1rem 1.25rem;
}

.ev-filter-row[b-7weq7rhvj8] {
    display: flex;
    align-items: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.ev-filter-group[b-7weq7rhvj8] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    flex: 1 1 140px;
    min-width: 120px;
}

.ev-filter-group label[b-7weq7rhvj8] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.ev-filter-actions[b-7weq7rhvj8] {
    flex: 0 0 auto;
    padding-bottom: 0;
}

/* ── Card ── */
.ev-card[b-7weq7rhvj8] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* ── No data ── */
.no-data[b-7weq7rhvj8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-7weq7rhvj8] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-7weq7rhvj8] {
    margin: 0;
    font-size: 0.9rem;
}

/* ── Table ── */
.ev-table-wrapper[b-7weq7rhvj8] {
    overflow-x: auto;
}

.ev-table[b-7weq7rhvj8] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.ev-table thead tr[b-7weq7rhvj8] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.ev-table th[b-7weq7rhvj8] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.ev-table td[b-7weq7rhvj8] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.ev-table tbody tr:last-child td[b-7weq7rhvj8] {
    border-bottom: none;
}

.ev-table tbody tr:hover[b-7weq7rhvj8] {
    background: #f8f9fa;
}

.col-right[b-7weq7rhvj8] {
    text-align: right !important;
}

.col-center[b-7weq7rhvj8] {
    text-align: center !important;
}

.ev-voucher-num[b-7weq7rhvj8] {
    font-weight: 600;
    font-family: monospace;
    font-size: 0.875rem;
    white-space: nowrap;
}

.ev-desc[b-7weq7rhvj8] {
    max-width: 280px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #495057;
}

.tabnum[b-7weq7rhvj8] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.fw-600[b-7weq7rhvj8] {
    font-weight: 600;
}

/* ── Status badges ── */
.ev-status[b-7weq7rhvj8] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.ev-status--draft[b-7weq7rhvj8] {
    background: #e9ecef;
    color: #495057;
}

.ev-status--submittedforapproval[b-7weq7rhvj8] {
    background: #fff3cd;
    color: #856404;
}

.ev-status--approved[b-7weq7rhvj8] {
    background: #cff4fc;
    color: #055160;
}

.ev-status--signed[b-7weq7rhvj8] {
    background: #d1f0e0;
    color: #0a6640;
}

.ev-status--cancelled[b-7weq7rhvj8] {
    background: #f8d7da;
    color: #842029;
}

/* ── Doc links ── */
.doc-link[b-7weq7rhvj8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 6px;
    font-size: 1rem;
    text-decoration: none;
    transition: background 0.15s;
}

.doc-link--signed[b-7weq7rhvj8] {
    color: #0a6640;
    background: #d1f0e0;
}

.doc-link--signed:hover[b-7weq7rhvj8] {
    background: #a8dfc5;
}

.doc-link--unsigned[b-7weq7rhvj8] {
    color: #055160;
    background: #cff4fc;
}

.doc-link--unsigned:hover[b-7weq7rhvj8] {
    background: #9eeaf9;
}

/* ── Pager ── */
.ev-pager[b-7weq7rhvj8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-wrap: wrap;
    gap: 0.75rem;
}

.ev-pager-info[b-7weq7rhvj8] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.ev-pager-controls[b-7weq7rhvj8] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.ev-pager-current[b-7weq7rhvj8] {
    font-size: 0.85rem;
    color: var(--text-color);
    font-weight: 500;
    white-space: nowrap;
}
/* /Components/Pages/ExpenseVoucherView.razor.rz.scp.css */
/* ── Page wrapper ── */
.ev-detail-page[b-j37r3p5ysu] {
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ── Loading ── */
.loading-container[b-j37r3p5ysu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-j37r3p5ysu] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-j37r3p5ysu] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* ── Not found ── */
.ev-not-found[b-j37r3p5ysu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 2rem;
    text-align: center;
    color: #6c757d;
    gap: 1rem;
}

.ev-not-found i[b-j37r3p5ysu] {
    font-size: 3rem;
    color: #ffc107;
}

.ev-not-found h2[b-j37r3p5ysu] {
    margin: 0;
    font-size: 1.4rem;
    font-weight: 600;
    color: #2c3e50;
}

/* ── Page header (blue gradient banner) ── */
.page-header[b-j37r3p5ysu] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 2rem;
    background: linear-gradient(135deg, var(--primary-color) 0%, #004999 100%);
    color: white;
    margin: -2rem -2rem 0 -2rem;
    border-radius: 0 0 1rem 1rem;
}

.btn-back[b-j37r3p5ysu] {
    background: rgba(255, 255, 255, 0.15);
    border: none;
    color: white;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    font-size: 1.1rem;
    transition: background 0.2s ease;
    text-decoration: none;
}

.btn-back:hover[b-j37r3p5ysu] {
    background: rgba(255, 255, 255, 0.25);
    color: white;
}

.header-icon[b-j37r3p5ysu] {
    font-size: 2.5rem;
    opacity: 0.9;
    flex-shrink: 0;
}

.page-header .header-text[b-j37r3p5ysu] {
    flex: 1;
}

.page-header h1[b-j37r3p5ysu] {
    margin: 0 0 0.2rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: white;
}

.page-header p[b-j37r3p5ysu] {
    margin: 0;
    opacity: 0.85;
    font-size: 0.95rem;
}

/* ── Status badge in header ── */
.ev-status-badge[b-j37r3p5ysu] {
    display: inline-flex;
    align-items: center;
    padding: 0.3rem 0.85rem;
    border-radius: 50px;
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
    flex-shrink: 0;
}

.ev-status-badge--draft[b-j37r3p5ysu]               { background: rgba(255,255,255,0.2); color: white; }
.ev-status-badge--submittedforapproval[b-j37r3p5ysu] { background: #fff3cd; color: #856404; }
.ev-status-badge--approved[b-j37r3p5ysu]            { background: #cff4fc; color: #055160; }
.ev-status-badge--signed[b-j37r3p5ysu]              { background: #d1f0e0; color: #0a6640; }
.ev-status-badge--cancelled[b-j37r3p5ysu]           { background: #f8d7da; color: #842029; }

/* ── Action bar ── */
.ev-action-bar[b-j37r3p5ysu] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}

/* ── Cards ── */
.ev-card[b-j37r3p5ysu] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.75rem;
    padding: 1.5rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.ev-card-header-row[b-j37r3p5ysu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.ev-card-header-row .ev-section-title[b-j37r3p5ysu] {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.ev-section-title[b-j37r3p5ysu] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 1.25rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #e9ecef;
    display: flex;
    align-items: center;
}

/* ── Detail grid ── */
.ev-detail-grid[b-j37r3p5ysu] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem 2rem;
}

.ev-detail-item[b-j37r3p5ysu] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.ev-detail-item--wide[b-j37r3p5ysu] {
    grid-column: 1 / -1;
}

.ev-detail-label[b-j37r3p5ysu] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.ev-detail-value[b-j37r3p5ysu] {
    font-size: 0.9rem;
    color: #2c3e50;
    line-height: 1.5;
}

.fw-bold[b-j37r3p5ysu] { font-weight: 700; }

/* ── No data ── */
.ev-no-data[b-j37r3p5ysu] {
    color: #6c757d;
    font-size: 0.9rem;
    font-style: italic;
    padding: 0.5rem 0;
}

/* ── Evidence table ── */
.ev-table-wrapper[b-j37r3p5ysu] {
    overflow-x: auto;
}

.ev-table[b-j37r3p5ysu] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.ev-table thead tr[b-j37r3p5ysu] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.ev-table th[b-j37r3p5ysu] {
    padding: 0.65rem 0.9rem;
    text-align: left;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.ev-table td[b-j37r3p5ysu] {
    padding: 0.65rem 0.9rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.ev-table tbody tr:last-child td[b-j37r3p5ysu] {
    border-bottom: none;
}

.col-center[b-j37r3p5ysu] { text-align: center !important; }

.btn-link-icon[b-j37r3p5ysu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 6px;
    background: #e7f1ff;
    color: var(--primary-color);
    font-size: 0.95rem;
    text-decoration: none;
    transition: background 0.15s;
}

.btn-link-icon:hover[b-j37r3p5ysu] {
    background: #cfe2ff;
    color: var(--primary-color);
}

/* ── Status timeline ── */
.ev-timeline[b-j37r3p5ysu] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.ev-timeline-item[b-j37r3p5ysu] {
    display: flex;
    gap: 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid #e9ecef;
    align-items: flex-start;
}

.ev-timeline-item:last-child[b-j37r3p5ysu] {
    border-bottom: none;
    padding-bottom: 0;
}

.ev-timeline-dot[b-j37r3p5ysu] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 0.3rem;
    border: 2px solid transparent;
}

.ev-timeline-dot--draft[b-j37r3p5ysu]               { background: #adb5bd; border-color: #6c757d; }
.ev-timeline-dot--submittedforapproval[b-j37r3p5ysu] { background: #ffc107; border-color: #e0a800; }
.ev-timeline-dot--approved[b-j37r3p5ysu]            { background: #0dcaf0; border-color: #0aa3c2; }
.ev-timeline-dot--signed[b-j37r3p5ysu]              { background: #198754; border-color: #157347; }
.ev-timeline-dot--cancelled[b-j37r3p5ysu]           { background: #dc3545; border-color: #b02a37; }

.ev-timeline-content[b-j37r3p5ysu] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.ev-timeline-status[b-j37r3p5ysu] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.ev-timeline-meta[b-j37r3p5ysu] {
    font-size: 0.8rem;
    color: #6c757d;
}

.ev-timeline-note[b-j37r3p5ysu] {
    font-size: 0.85rem;
    color: #495057;
    font-style: italic;
    margin-top: 0.15rem;
    padding: 0.35rem 0.6rem;
    background: #f8f9fa;
    border-left: 3px solid #dee2e6;
    border-radius: 0 4px 4px 0;
}

/* ── Modals ── */
.modal-overlay[b-j37r3p5ysu] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 1rem;
}

.modal-dialog[b-j37r3p5ysu] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    width: 100%;
    max-width: 560px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-sm[b-j37r3p5ysu] {
    max-width: 440px;
}

.modal-header[b-j37r3p5ysu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    background: var(--background-color);
}

.modal-header h5[b-j37r3p5ysu] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.modal-close[b-j37r3p5ysu] {
    background: none;
    border: none;
    color: var(--secondary-color);
    font-size: 1.3rem;
    cursor: pointer;
    padding: 0.15rem 0.5rem;
    border-radius: 6px;
    line-height: 1;
    transition: background 0.15s ease, color 0.15s ease;
}

.modal-close:hover[b-j37r3p5ysu] {
    background: #f0f0f0;
    color: #2c3e50;
}

.modal-body[b-j37r3p5ysu] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.modal-body p[b-j37r3p5ysu] {
    margin: 0;
    font-size: 0.9rem;
    color: #495057;
}

.modal-footer[b-j37r3p5ysu] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
}

/* ── Shared form classes used in modals ── */
.form-group[b-j37r3p5ysu] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-j37r3p5ysu] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
}

.required[b-j37r3p5ysu] { color: #dc3545; }
.optional[b-j37r3p5ysu]  { color: #6c757d; font-weight: 400; font-size: 0.8rem; }

.field-error[b-j37r3p5ysu] {
    font-size: 0.8rem;
    color: #dc3545;
}

/* ── Alerts ── */
.alert[b-j37r3p5ysu] {
    border-radius: 0.5rem;
    font-size: 0.9rem;
}

/* ── Responsive ── */
@media (max-width: 640px) {
    .ev-detail-grid[b-j37r3p5ysu] {
        grid-template-columns: 1fr;
    }

    .page-header[b-j37r3p5ysu] {
        padding: 1.5rem 1rem;
        margin: -1.5rem -1rem 0 -1rem;
        flex-wrap: wrap;
    }

    .ev-action-bar[b-j37r3p5ysu] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* /Components/Pages/FindDealer.razor.rz.scp.css */
/* Find a Dealer Page Styles */
.find-dealer-page[b-55rhbcsqtb] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0;
}

.page-header[b-55rhbcsqtb] {
    text-align: center;
    padding: 3rem 2rem;
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
    color: white;
    margin: -2rem -2rem 2rem -2rem;
    border-radius: 0 0 1rem 1rem;
}

.page-header .header-icon[b-55rhbcsqtb] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.9;
}

.page-header h1[b-55rhbcsqtb] {
    margin: 0 0 0.5rem 0;
    font-size: 2.5rem;
    font-weight: 700;
}

.page-header .lead[b-55rhbcsqtb] {
    font-size: 1.125rem;
    margin: 0;
    opacity: 0.9;
}

.dealer-controls[b-55rhbcsqtb] {
    display: flex;
    gap: 1rem;
    margin-bottom: 2rem;
    padding: 0 1rem;
    flex-wrap: wrap;
}

.search-box[b-55rhbcsqtb] {
    flex: 1;
    min-width: 300px;
    position: relative;
}

.search-box i[b-55rhbcsqtb] {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box .form-control[b-55rhbcsqtb] {
    padding-left: 2.5rem;
}

.filter-group[b-55rhbcsqtb] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.filter-group label[b-55rhbcsqtb] {
    margin: 0;
    white-space: nowrap;
    font-weight: 500;
}

.filter-group .form-select[b-55rhbcsqtb] {
    min-width: 200px;
}

.dealer-count[b-55rhbcsqtb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    background-color: #e7f3ff;
    border-radius: 0.5rem;
    margin: 0 1rem 1.5rem 1rem;
    color: #0066cc;
    font-weight: 500;
}

.dealer-count i[b-55rhbcsqtb] {
    font-size: 1.25rem;
}

.loading-container[b-55rhbcsqtb] {
    text-align: center;
    padding: 4rem 2rem;
    color: #6c757d;
}

.loading-container .spinner-border[b-55rhbcsqtb] {
    width: 3rem;
    height: 3rem;
    margin-bottom: 1rem;
}

.no-results[b-55rhbcsqtb] {
    text-align: center;
    padding: 4rem 2rem;
    color: #6c757d;
}

.no-results i[b-55rhbcsqtb] {
    font-size: 4rem;
    margin-bottom: 1rem;
    opacity: 0.5;
}

.no-results h3[b-55rhbcsqtb] {
    margin-bottom: 0.5rem;
}

.dealers-grid[b-55rhbcsqtb] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 1.5rem;
    padding: 0 1rem 2rem 1rem;
}

.dealer-card[b-55rhbcsqtb] {
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 0.75rem;
    overflow: hidden;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.dealer-card:hover[b-55rhbcsqtb] {
    transform: translateY(-4px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
    border-color: #0066cc;
}

.dealer-image[b-55rhbcsqtb] {
    width: 100%;
    height: 200px;
    overflow: hidden;
    background-color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid #dee2e6;
    padding: 1rem;
}

.dealer-image img[b-55rhbcsqtb] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

.placeholder-image[b-55rhbcsqtb] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #e9ecef 0%, #dee2e6 100%);
    color: #6c757d;
}

.placeholder-image i[b-55rhbcsqtb] {
    font-size: 4rem;
    opacity: 0.5;
}

.dealer-content[b-55rhbcsqtb] {
    padding: 1.5rem;
}

.dealer-name[b-55rhbcsqtb] {
    margin: 0 0 1.25rem 0;
    font-size: 1.375rem;
    font-weight: 700;
    color: #2c3e50;
}

.dealer-info[b-55rhbcsqtb] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.info-item[b-55rhbcsqtb] {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
}

.info-item > i[b-55rhbcsqtb] {
    flex-shrink: 0;
    width: 1.25rem;
    text-align: center;
    color: #0066cc;
    font-size: 1.125rem;
    margin-top: 0.125rem;
}

.info-text[b-55rhbcsqtb] {
    flex: 1;
    line-height: 1.6;
}

.info-text strong[b-55rhbcsqtb] {
    color: #2c3e50;
}

.info-text a[b-55rhbcsqtb] {
    color: #0066cc;
    text-decoration: none;
    transition: color 0.2s ease;
}

.info-text a:hover[b-55rhbcsqtb] {
    color: #0052a3;
    text-decoration: underline;
}

.province-badge[b-55rhbcsqtb] {
    display: inline-block;
    background-color: #2d8659;
    color: white;
    padding: 0.25rem 0.75rem;
    border-radius: 0.25rem;
    font-size: 0.875rem;
    font-weight: 600;
    margin-top: 0.5rem;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-header h1[b-55rhbcsqtb] {
        font-size: 2rem;
    }

    .page-header .header-icon[b-55rhbcsqtb] {
        font-size: 2.5rem;
    }

    .dealers-grid[b-55rhbcsqtb] {
        grid-template-columns: 1fr;
        padding: 0 0.5rem 1rem 0.5rem;
    }

    .dealer-controls[b-55rhbcsqtb] {
        flex-direction: column;
        padding: 0 0.5rem;
    }

    .search-box[b-55rhbcsqtb] {
        min-width: 100%;
    }

    .filter-group[b-55rhbcsqtb] {
        width: 100%;
    }

    .filter-group .form-select[b-55rhbcsqtb] {
        flex: 1;
    }

    .dealer-count[b-55rhbcsqtb] {
        margin: 0 0.5rem 1rem 0.5rem;
    }
}

@media (max-width: 480px) {
    .page-header[b-55rhbcsqtb] {
        padding: 2rem 1rem;
        margin: -2rem -1rem 1.5rem -1rem;
    }

    .dealer-content[b-55rhbcsqtb] {
        padding: 1rem;
    }

    .dealer-name[b-55rhbcsqtb] {
        font-size: 1.25rem;
    }
}
/* /Components/Pages/GenerateStatement.razor.rz.scp.css */
.generate-statement-page[b-a8rg0qsl0c] {
    padding: 2rem;
    max-width: 600px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Header */
.generate-statement-header[b-a8rg0qsl0c] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.generate-statement-header-top[b-a8rg0qsl0c] {
    display: flex;
    align-items: center;
}

.generate-statement-header h1[b-a8rg0qsl0c] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-a8rg0qsl0c] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-a8rg0qsl0c] {
    text-decoration: underline;
}

/* Card */
.generate-statement-card[b-a8rg0qsl0c] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 2rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Form */
.form-group[b-a8rg0qsl0c] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    flex: 1;
}

.form-label[b-a8rg0qsl0c] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.form-select[b-a8rg0qsl0c] {
    width: 100%;
    padding: 0.5rem 0.75rem;
    font-size: 0.9rem;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    color: #2c3e50;
    background: white;
}

.form-row[b-a8rg0qsl0c] {
    display: flex;
    gap: 1rem;
}

.form-actions[b-a8rg0qsl0c] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--border-color);
}

/* Loading inline */
.loading-inline[b-a8rg0qsl0c] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
    color: var(--secondary-color);
    padding: 0.5rem 0;
}

/* Alert */
.alert-danger[b-a8rg0qsl0c] {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    font-size: 0.85rem;
}

@media (max-width: 640px) {
    .generate-statement-page[b-a8rg0qsl0c] {
        padding: 1rem;
    }

    .form-row[b-a8rg0qsl0c] {
        flex-direction: column;
    }
}
/* /Components/Pages/Inventory.razor.rz.scp.css */
/* Low-stock row highlight */
.inventory-table tbody tr.row--low-stock[b-rq9tfxxbvg] {
    background-color: #fde8e8;
}

/* Page layout */
.inventory-page[b-rq9tfxxbvg] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-rq9tfxxbvg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-rq9tfxxbvg] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-rq9tfxxbvg] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.inventory-header[b-rq9tfxxbvg] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.inventory-header-top[b-rq9tfxxbvg] {
    display: flex;
    align-items: center;
}

.inventory-header h1[b-rq9tfxxbvg] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-rq9tfxxbvg] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-rq9tfxxbvg] {
    text-decoration: underline;
}

/* Filter */
.inventory-filter[b-rq9tfxxbvg] {
    display: flex;
    align-items: center;
}

.inventory-filter-input-wrapper[b-rq9tfxxbvg] {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 400px;
}

.inventory-filter-input-wrapper > i[b-rq9tfxxbvg] {
    position: absolute;
    left: 0.75rem;
    color: var(--secondary-color);
    font-size: 0.9rem;
    pointer-events: none;
}

.inventory-filter-input[b-rq9tfxxbvg] {
    width: 100%;
    padding: 0.5rem 2.25rem 0.5rem 2.25rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    font-size: 0.9rem;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.inventory-filter-input:focus[b-rq9tfxxbvg] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 105, 217, 0.12);
}

.inventory-filter-clear[b-rq9tfxxbvg] {
    position: absolute;
    right: 0.5rem;
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
    font-size: 0.8rem;
    border-radius: 4px;
    transition: color 0.15s;
}

.inventory-filter-clear:hover[b-rq9tfxxbvg] {
    color: var(--text-color);
}

/* Card */
.inventory-card[b-rq9tfxxbvg] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-rq9tfxxbvg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-rq9tfxxbvg] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-rq9tfxxbvg] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.inventory-table-wrapper[b-rq9tfxxbvg] {
    overflow-x: auto;
}

.inventory-table[b-rq9tfxxbvg] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.inventory-table thead tr[b-rq9tfxxbvg] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.inventory-table th[b-rq9tfxxbvg] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.inventory-table td[b-rq9tfxxbvg] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.inventory-table tbody tr:last-child td[b-rq9tfxxbvg] {
    border-bottom: none;
}

.inventory-table tbody tr:hover[b-rq9tfxxbvg] {
    background: #f8f9fa;
}

.col-right[b-rq9tfxxbvg] {
    text-align: right;
}

.col-center[b-rq9tfxxbvg] {
    text-align: center;
    width: 5rem;
}

.col-stock[b-rq9tfxxbvg] {
    width: 12rem;
}

.inventory-table th.col-right[b-rq9tfxxbvg] { text-align: right; }
.inventory-table th.col-stock[b-rq9tfxxbvg] { text-align: right; }

.col-category[b-rq9tfxxbvg] {
    font-size: 0.85rem;
    color: var(--secondary-color);
    white-space: nowrap;
}

/* Stock input */
.stock-input-wrapper[b-rq9tfxxbvg] {
    display: grid;
    grid-template-columns: 5.5rem 3.5rem;
    column-gap: 0.35rem;
    align-items: center;
}

.uom-label[b-rq9tfxxbvg] {
    font-size: 0.8rem;
    color: var(--secondary-color);
    white-space: nowrap;
    text-align: left;
}

.stock-input[b-rq9tfxxbvg] {
    width: 100%;
    padding: 0.3rem 0.5rem;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    font-size: 0.9rem;
    text-align: right;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
    background: transparent;
}

.stock-input:focus[b-rq9tfxxbvg] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 105, 217, 0.12);
    background: white;
}

.stock-input--invalid[b-rq9tfxxbvg] {
    border-color: #dc2626;
    background: #fef2f2;
}

.stock-input--invalid:focus[b-rq9tfxxbvg] {
    border-color: #dc2626;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.12);
}

/* Stock badges */
.stock-badge[b-rq9tfxxbvg] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
}

.stock-badge--danger[b-rq9tfxxbvg] {
    background: #fde8e8;
    color: #b91c1c;
}

.stock-badge--warning[b-rq9tfxxbvg] {
    background: #fff3cd;
    color: #92400e;
}

.stock-badge--ok[b-rq9tfxxbvg] {
    background: #d1fae5;
    color: #065f46;
}

/* Pager */
.inventory-pager[b-rq9tfxxbvg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-wrap: wrap;
    gap: 0.75rem;
}

.inventory-pager-info[b-rq9tfxxbvg] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.inventory-pager-controls[b-rq9tfxxbvg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.inventory-pager-current[b-rq9tfxxbvg] {
    font-size: 0.85rem;
    color: var(--text-color);
    font-weight: 500;
    white-space: nowrap;
}

/* Responsive */
@media (max-width: 640px) {
    .inventory-page[b-rq9tfxxbvg] {
        padding: 1rem;
        gap: 1rem;
    }

    .inventory-filter-input-wrapper[b-rq9tfxxbvg] {
        max-width: 100%;
    }
}
/* /Components/Pages/MyAquaDataRetention.razor.rz.scp.css */
.retention-page[b-rt96yc3awk] {
    max-width: 820px;
    margin: 0 auto;
    padding: 2.5rem 1.5rem 4rem;
}

.retention-header[b-rt96yc3awk] {
    text-align: center;
    margin-bottom: 2.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--border-color);
}

.retention-header h1[b-rt96yc3awk] {
    font-size: 2rem;
    font-weight: 700;
    color: var(--text-color);
    margin: 0 0 0.25rem;
}

.retention-subtitle[b-rt96yc3awk] {
    font-size: 1.15rem;
    color: var(--primary-color);
    font-weight: 600;
    margin: 0 0 0.5rem;
}

.retention-effective[b-rt96yc3awk] {
    font-size: 0.875rem;
    color: var(--secondary-color);
    margin: 0;
}

.retention-content[b-rt96yc3awk] {
    line-height: 1.75;
    color: var(--text-color);
}

.retention-section[b-rt96yc3awk] {
    margin-bottom: 2rem;
}

.retention-section h2[b-rt96yc3awk] {
    font-size: 1.2rem;
    font-weight: 600;
    margin: 0 0 0.75rem;
    color: var(--text-color);
}

.retention-section p[b-rt96yc3awk] {
    margin: 0 0 0.75rem;
}

.retention-section ul[b-rt96yc3awk] {
    margin: 0 0 0.75rem;
    padding-left: 1.5rem;
}

.retention-section li[b-rt96yc3awk] {
    margin-bottom: 0.35rem;
}

.retention-section a[b-rt96yc3awk] {
    color: var(--primary-color);
    text-decoration: none;
}

.retention-section a:hover[b-rt96yc3awk] {
    text-decoration: underline;
}

@@media (max-width: 576px) {
    .retention-page[b-rt96yc3awk] {
        padding: 1.5rem 1rem 3rem;
    }

    .retention-header h1[b-rt96yc3awk] {
        font-size: 1.6rem;
    }

    .retention-section h2[b-rt96yc3awk] {
        font-size: 1.1rem;
    }
}
/* /Components/Pages/MyAquaLanding.razor.rz.scp.css */
.myaqua-landing[b-dph9sww17a] {
    margin: -0.75rem;
}

/* Hero split layout */
.myaqua-hero-layout[b-dph9sww17a] {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3rem;
    max-width: 1200px;
    margin: 0 auto;
    padding: 5rem 2rem 7rem;
}

.myaqua-hero-text[b-dph9sww17a] {
    flex: 1;
    text-align: left;
}

.myaqua-hero-text h1[b-dph9sww17a] {
    font-size: clamp(1.8rem, 4vw, 2.8rem);
    font-weight: 800;
    color: #fff;
    line-height: 1.2;
    margin: 0 0 1.25rem;
    letter-spacing: -0.01em;
}

/* Logo */
.myaqua-logo[b-dph9sww17a] {
    height: 64px;
    width: auto;
    margin-bottom: 1.5rem;
    filter: drop-shadow(0 2px 8px rgba(0,0,0,.25));
}

/* Hero image */
.myaqua-hero-image[b-dph9sww17a] {
    flex: 0 0 auto;
    max-width: 380px;
}

.myaqua-hero-image img[b-dph9sww17a] {
    width: 100%;
    height: auto;
    border-radius: 1rem;
    box-shadow: 0 20px 60px rgba(0,0,0,.3);
}

/* Google Play badge */
.myaqua-play-badge[b-dph9sww17a] {
    height: 60px;
    width: auto;
    opacity: .9;
    transition: opacity .2s ease;
    pointer-events: none;
}

.myaqua-play-badge:hover[b-dph9sww17a] {
    opacity: 1;
}

/* Trust section overrides */
.myaqua-trust-title[b-dph9sww17a] {
    color: #fff !important;
}

.myaqua-trust-sub[b-dph9sww17a] {
    text-align: center;
    font-size: 1.1rem;
    color: rgba(255,255,255,.75);
    max-width: 560px;
    margin: 0 auto 3rem;
    line-height: 1.6;
}

.myaqua-trust-icon[b-dph9sww17a] {
    font-size: 1.8rem;
    color: #64d2ff;
    margin-bottom: 0.5rem;
}

/* Audience grid — 4 cols on large, follows existing responsive */
.myaqua-audience[b-dph9sww17a] {
    background: linear-gradient(180deg, #f7fafd 0%, #fff 100%);
}

/* CTA link styling */
.myaqua-cta-link[b-dph9sww17a] {
    color: #64d2ff;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.myaqua-cta-link:hover[b-dph9sww17a] {
    color: #fff;
}

/* Responsible-use CTA reduced padding */
.myaqua-cta-inner[b-dph9sww17a] {
    padding: 3rem 2rem;
}

@@media (max-width: 768px) {
    .myaqua-hero-layout[b-dph9sww17a] {
        flex-direction: column;
        text-align: center;
        padding: 3.5rem 1.25rem 6rem;
        gap: 2rem;
    }

    .myaqua-hero-text[b-dph9sww17a] {
        text-align: center;
    }

    .myaqua-hero-text .landing-hero-actions[b-dph9sww17a] {
        justify-content: center;
    }

    .myaqua-hero-image[b-dph9sww17a] {
        max-width: 280px;
    }

    .myaqua-logo[b-dph9sww17a] {
        height: 52px;
    }

    .myaqua-cta-inner[b-dph9sww17a] {
        padding: 2rem 1.25rem;
    }
}

@@media (max-width: 380px) {
    .myaqua-hero-layout[b-dph9sww17a] {
        padding: 3rem 0.75rem 5rem;
    }

    .myaqua-logo[b-dph9sww17a] {
        height: 44px;
    }

    .myaqua-hero-image[b-dph9sww17a] {
        max-width: 220px;
    }
}
/* /Components/Pages/MyAquaPrivacy.razor.rz.scp.css */
.policy-page[b-4xh68ylruy] {
    max-width: 820px;
    margin: 0 auto;
    padding: 2.5rem 1.5rem 4rem;
}

.policy-header[b-4xh68ylruy] {
    text-align: center;
    margin-bottom: 2.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--border-color);
}

.policy-header h1[b-4xh68ylruy] {
    font-size: 2rem;
    font-weight: 700;
    color: var(--text-color);
    margin: 0 0 0.25rem;
}

.policy-subtitle[b-4xh68ylruy] {
    font-size: 1.15rem;
    color: var(--primary-color);
    font-weight: 600;
    margin: 0 0 0.5rem;
}

.policy-effective[b-4xh68ylruy] {
    font-size: 0.875rem;
    color: var(--secondary-color);
    margin: 0;
}

.policy-content[b-4xh68ylruy] {
    line-height: 1.75;
    color: var(--text-color);
}

.policy-section[b-4xh68ylruy] {
    margin-bottom: 2rem;
}

.policy-section h2[b-4xh68ylruy] {
    font-size: 1.2rem;
    font-weight: 600;
    margin: 0 0 0.75rem;
    color: var(--text-color);
}

.policy-section h3[b-4xh68ylruy] {
    font-size: 1.05rem;
    font-weight: 600;
    margin: 1rem 0 0.5rem;
    color: var(--text-color);
}

.policy-section p[b-4xh68ylruy] {
    margin: 0 0 0.75rem;
}

.policy-section ul[b-4xh68ylruy] {
    margin: 0 0 0.75rem;
    padding-left: 1.5rem;
}

.policy-section li[b-4xh68ylruy] {
    margin-bottom: 0.35rem;
}

.policy-section a[b-4xh68ylruy] {
    color: var(--primary-color);
    text-decoration: none;
}

.policy-section a:hover[b-4xh68ylruy] {
    text-decoration: underline;
}

@@media (max-width: 576px) {
    .policy-page[b-4xh68ylruy] {
        padding: 1.5rem 1rem 3rem;
    }

    .policy-header h1[b-4xh68ylruy] {
        font-size: 1.6rem;
    }

    .policy-section h2[b-4xh68ylruy] {
        font-size: 1.1rem;
    }
}
/* /Components/Pages/MyAquaTerms.razor.rz.scp.css */
.terms-page[b-5xgds73m2b] {
    max-width: 820px;
    margin: 0 auto;
    padding: 2.5rem 1.5rem 4rem;
}

.terms-header[b-5xgds73m2b] {
    text-align: center;
    margin-bottom: 2.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--border-color);
}

.terms-header h1[b-5xgds73m2b] {
    font-size: 2rem;
    font-weight: 700;
    color: var(--text-color);
    margin: 0 0 0.25rem;
}

.terms-subtitle[b-5xgds73m2b] {
    font-size: 1.15rem;
    color: var(--primary-color);
    font-weight: 600;
    margin: 0 0 0.5rem;
}

.terms-effective[b-5xgds73m2b] {
    font-size: 0.875rem;
    color: var(--secondary-color);
    margin: 0;
}

.terms-content[b-5xgds73m2b] {
    line-height: 1.75;
    color: var(--text-color);
}

.terms-section[b-5xgds73m2b] {
    margin-bottom: 2rem;
}

.terms-section h2[b-5xgds73m2b] {
    font-size: 1.2rem;
    font-weight: 600;
    margin: 0 0 0.75rem;
    color: var(--text-color);
}

.terms-section p[b-5xgds73m2b] {
    margin: 0 0 0.75rem;
}

.terms-section ul[b-5xgds73m2b] {
    margin: 0 0 0.75rem;
    padding-left: 1.5rem;
}

.terms-section li[b-5xgds73m2b] {
    margin-bottom: 0.35rem;
}

.terms-section a[b-5xgds73m2b] {
    color: var(--primary-color);
    text-decoration: none;
}

.terms-section a:hover[b-5xgds73m2b] {
    text-decoration: underline;
}

@@media (max-width: 576px) {
    .terms-page[b-5xgds73m2b] {
        padding: 1.5rem 1rem 3rem;
    }

    .terms-header h1[b-5xgds73m2b] {
        font-size: 1.6rem;
    }

    .terms-section h2[b-5xgds73m2b] {
        font-size: 1.1rem;
    }
}
/* /Components/Pages/MyProfile.razor.rz.scp.css */
.my-profile-page[b-qqryim7736] {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    min-height: 60vh;
    padding: 2rem;
}

.my-profile-card[b-qqryim7736] {
    background: var(--card-bg, #fff);
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 12px;
    padding: 2.5rem;
    width: 100%;
    max-width: 480px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
    text-align: center;
}

.my-profile-icon[b-qqryim7736] {
    font-size: 3rem;
    color: var(--primary, #0d6efd);
    margin-bottom: 1rem;
}

.my-profile-card h1[b-qqryim7736] {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.my-profile-subtitle[b-qqryim7736] {
    color: var(--text-muted, #6c757d);
    margin-bottom: 1.75rem;
    font-size: 0.95rem;
}

.my-profile-card .form-group[b-qqryim7736] {
    text-align: left;
    margin-bottom: 1rem;
}

.my-profile-card .form-group label[b-qqryim7736] {
    display: block;
    font-weight: 500;
    margin-bottom: 0.35rem;
    font-size: 0.9rem;
}

.my-profile-card .form-control[b-qqryim7736] {
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 6px;
    font-size: 0.95rem;
    transition: border-color 0.15s ease-in-out;
}

    .my-profile-card .form-control:focus[b-qqryim7736] {
        outline: none;
        border-color: var(--primary, #0d6efd);
        box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.15);
    }

.btn-save[b-qqryim7736] {
    width: 100%;
    padding: 0.6rem 1.25rem;
    font-size: 1rem;
    font-weight: 500;
    border-radius: 6px;
    margin-top: 0.5rem;
}

.required[b-qqryim7736] {
    color: #dc3545;
}

.field-error[b-qqryim7736] {
    color: #dc3545;
    font-size: 0.825rem;
    margin-top: 0.3rem;
    display: block;
}

.section-divider[b-qqryim7736] {
    border: none;
    border-top: 2px solid #e9ecef;
    margin: 1.75rem 0;
}

.section-heading[b-qqryim7736] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 1.25rem;
}
/* /Components/Pages/OpsCollection.razor.rz.scp.css */
.collection-page[b-90t4kctsyy] {
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-90t4kctsyy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-90t4kctsyy] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-90t4kctsyy] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.collection-header[b-90t4kctsyy] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.collection-header h1[b-90t4kctsyy] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.back-link[b-90t4kctsyy] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.85rem;
    color: var(--primary-color);
    text-decoration: none;
    font-weight: 500;
}

.back-link:hover[b-90t4kctsyy] {
    text-decoration: underline;
}

/* Empty state */
.empty-state[b-90t4kctsyy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 4rem 2rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.empty-state-icon[b-90t4kctsyy] {
    font-size: 3.5rem;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.empty-state h2[b-90t4kctsyy] {
    margin: 0 0 0.5rem;
    font-size: 1.5rem;
    font-weight: 700;
    color: #2c3e50;
}

.empty-state p[b-90t4kctsyy] {
    margin: 0;
    color: #6c757d;
}

/* Order list */
.collection-list[b-90t4kctsyy] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.collection-card[b-90t4kctsyy] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 1.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.collection-card-top[b-90t4kctsyy] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.collection-card-identity[b-90t4kctsyy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    min-width: 0;
}

.collection-card-service[b-90t4kctsyy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

.collection-card-waiting[b-90t4kctsyy] {
    font-size: 0.85rem;
    flex-shrink: 0;
}

/* Order ID badge */
.order-id-badge[b-90t4kctsyy] {
    display: inline-flex;
    align-items: center;
    background: #e7f1ff;
    color: var(--primary-color);
    font-size: 0.9rem;
    font-weight: 700;
    padding: 0.15rem 0.6rem;
    border-radius: 8px;
    white-space: nowrap;
}

/* Service type badges */
.service-type-badge[b-90t4kctsyy] {
    display: inline-flex;
    align-items: center;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.15rem 0.5rem;
    border-radius: 6px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    white-space: nowrap;
}

.service-type-badge--aggregator[b-90t4kctsyy] {
    background: #fff3cd;
    color: #856404;
}

.service-type-badge--external[b-90t4kctsyy] {
    background: #d1ecf1;
    color: #0c5460;
}

.service-type-badge--self[b-90t4kctsyy] {
    background: #d4edda;
    color: #155724;
}

/* Item chips */
.collection-card-items[b-90t4kctsyy] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.item-chip[b-90t4kctsyy] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: #f0f4f8;
    border-radius: 6px;
    padding: 0.2rem 0.6rem;
    font-size: 0.82rem;
    color: #2c3e50;
}

.item-chip-qty[b-90t4kctsyy] {
    font-weight: 700;
    color: var(--primary-color);
}
/* /Components/Pages/OpsDashboard.razor.rz.scp.css */
.dashboard-page[b-lercm672jl] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* Tabs */
.dashboard-tabs[b-lercm672jl] {
    display: flex;
    gap: 0;
    border-bottom: 2px solid #dee2e6;
}

.dashboard-tab[b-lercm672jl] {
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    padding: 0.6rem 1.5rem;
    font-size: 1rem;
    font-weight: 500;
    color: #6c757d;
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s;
}

.dashboard-tab:hover[b-lercm672jl] {
    color: var(--primary-color);
}

.dashboard-tab.active[b-lercm672jl] {
    color: var(--primary-color);
    border-bottom-color: var(--primary-color);
}

.tab-badge[b-lercm672jl] {
    display: inline-block;
    width: 8px;
    height: 8px;
    background-color: #dc3545;
    border-radius: 50%;
    margin-left: 6px;
    vertical-align: middle;
    position: relative;
    top: -1px;
}

/* Loading & Error */
.loading-container[b-lercm672jl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-lercm672jl] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-lercm672jl] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

.dashboard-error[b-lercm672jl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 2rem;
    text-align: center;
    color: var(--secondary-color);
}

.dashboard-error i[b-lercm672jl] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}

/* Welcome Banner */
.dashboard-welcome[b-lercm672jl] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #004999 100%);
    color: white;
    border-radius: 12px;
    padding: 2rem 2.5rem;
}

.welcome-text h1[b-lercm672jl] {
    margin: 0 0 0.25rem;
    font-size: 2rem;
    font-weight: 700;
    color: white;
}

.welcome-text p[b-lercm672jl] {
    margin: 0;
    opacity: 0.85;
    font-size: 1rem;
}

@media (max-width: 640px) {
    .dashboard-page[b-lercm672jl] {
        padding: 1rem;
        gap: 1.25rem;
    }

    .dashboard-welcome[b-lercm672jl] {
        padding: 1.5rem;
    }

    .welcome-text h1[b-lercm672jl] {
        font-size: 1.5rem;
    }
}
/* /Components/Pages/OpsDelivery.razor.rz.scp.css */
.collection-page[b-p50zxb0dt1] {
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-p50zxb0dt1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-p50zxb0dt1] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-p50zxb0dt1] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.collection-header[b-p50zxb0dt1] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.collection-header h1[b-p50zxb0dt1] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.back-link[b-p50zxb0dt1] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.85rem;
    color: var(--primary-color);
    text-decoration: none;
    font-weight: 500;
}

.back-link:hover[b-p50zxb0dt1] {
    text-decoration: underline;
}

/* Empty state */
.empty-state[b-p50zxb0dt1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 4rem 2rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.empty-state-icon[b-p50zxb0dt1] {
    font-size: 3.5rem;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.empty-state h2[b-p50zxb0dt1] {
    margin: 0 0 0.5rem;
    font-size: 1.5rem;
    font-weight: 700;
    color: #2c3e50;
}

.empty-state p[b-p50zxb0dt1] {
    margin: 0;
    color: #6c757d;
}

/* Order list */
.collection-list[b-p50zxb0dt1] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.collection-card[b-p50zxb0dt1] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 1.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.collection-card-top[b-p50zxb0dt1] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.collection-card-identity[b-p50zxb0dt1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    min-width: 0;
}

.collection-card-service[b-p50zxb0dt1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

.collection-card-waiting[b-p50zxb0dt1] {
    font-size: 0.85rem;
    flex-shrink: 0;
}

/* Order ID badge */
.order-id-badge[b-p50zxb0dt1] {
    display: inline-flex;
    align-items: center;
    background: #e7f1ff;
    color: var(--primary-color);
    font-size: 0.9rem;
    font-weight: 700;
    padding: 0.15rem 0.6rem;
    border-radius: 8px;
    white-space: nowrap;
}

/* Service type badges */
.service-type-badge[b-p50zxb0dt1] {
    display: inline-flex;
    align-items: center;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.15rem 0.5rem;
    border-radius: 6px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    white-space: nowrap;
}

.service-type-badge--aggregator[b-p50zxb0dt1] {
    background: #fff3cd;
    color: #856404;
}

.service-type-badge--external[b-p50zxb0dt1] {
    background: #d1ecf1;
    color: #0c5460;
}

.service-type-badge--self[b-p50zxb0dt1] {
    background: #d4edda;
    color: #155724;
}

/* Item chips */
.collection-card-items[b-p50zxb0dt1] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.item-chip[b-p50zxb0dt1] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: #f0f4f8;
    border-radius: 6px;
    padding: 0.2rem 0.6rem;
    font-size: 0.82rem;
    color: #2c3e50;
}

.item-chip-qty[b-p50zxb0dt1] {
    font-weight: 700;
    color: var(--primary-color);
}
/* /Components/Pages/OpsFulfillment.razor.rz.scp.css */
.fulfillment-page[b-arzp09ivj8] {
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading & Error */
.loading-container[b-arzp09ivj8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-arzp09ivj8] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-arzp09ivj8] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.fulfillment-header[b-arzp09ivj8] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.fulfillment-header h1[b-arzp09ivj8] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.back-link[b-arzp09ivj8] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.85rem;
    color: var(--primary-color);
    text-decoration: none;
    font-weight: 500;
}

.back-link:hover[b-arzp09ivj8] {
    text-decoration: underline;
}

.order-id-badge[b-arzp09ivj8] {
    display: inline-flex;
    align-items: center;
    background: #e7f1ff;
    color: var(--primary-color);
    font-size: 1.1rem;
    font-weight: 700;
    padding: 0.15rem 0.65rem;
    border-radius: 8px;
}

/* Empty state */
.empty-state[b-arzp09ivj8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 4rem 2rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.empty-state-icon[b-arzp09ivj8] {
    font-size: 3.5rem;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.empty-state h2[b-arzp09ivj8] {
    margin: 0 0 0.5rem;
    font-size: 1.5rem;
    font-weight: 700;
    color: #2c3e50;
}

.empty-state p[b-arzp09ivj8] {
    margin: 0;
    color: #6c757d;
    font-size: 1rem;
}

/* Body */
.fulfillment-body[b-arzp09ivj8] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Cards */
.fulfillment-card[b-arzp09ivj8] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 1.5rem;
}

.card-section-title[b-arzp09ivj8] {
    margin: 0 0 1rem;
    font-size: 1.05rem;
    font-weight: 600;
    color: #2c3e50;
}

/* Items table */
.items-table-wrapper[b-arzp09ivj8] {
    overflow-x: auto;
}

.items-table[b-arzp09ivj8] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.items-table thead th[b-arzp09ivj8] {
    background: var(--background-color);
    padding: 0.75rem 1rem;
    font-weight: 600;
    color: #495057;
    border-bottom: 2px solid var(--border-color);
    text-align: left;
}

.items-table tbody td[b-arzp09ivj8] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
}

.items-table tbody tr:hover[b-arzp09ivj8] {
    background: #f8f9fb;
}

.col-right[b-arzp09ivj8] {
    text-align: right;
}

.col-num[b-arzp09ivj8] {
    width: 40px;
    color: #6c757d;
    font-weight: 500;
}

.col-qty-value[b-arzp09ivj8] {
    font-weight: 700;
    font-size: 1rem;
}

/* Actions */
.actions-card[b-arzp09ivj8] {
    display: flex;
    justify-content: center;
}

.action-buttons[b-arzp09ivj8] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    justify-content: center;
}

/* Modals */
.material-row[b-arzp09ivj8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f0f0f0;
}

.material-row label[b-arzp09ivj8] {
    margin: 0;
    font-weight: 500;
    color: #2c3e50;
    flex: 1;
}

.material-qty-input[b-arzp09ivj8] {
    width: 80px;
    text-align: center;
}

/* Invoice rows */
.invoice-row[b-arzp09ivj8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid #f0f0f0;
}

.invoice-row:last-child[b-arzp09ivj8] {
    border-bottom: none;
}

.invoice-label[b-arzp09ivj8] {
    font-weight: 500;
    color: #2c3e50;
}

/* Responsive */
@media (max-width: 640px) {
    .fulfillment-page[b-arzp09ivj8] {
        padding: 1rem;
    }

    .action-buttons[b-arzp09ivj8] {
        flex-direction: column;
        width: 100%;
    }

    .action-buttons .btn[b-arzp09ivj8] {
        width: 100%;
    }
}

/* Delivery service selection */
.delivery-service-options[b-arzp09ivj8] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.delivery-service-option[b-arzp09ivj8] {
    padding: 0.75rem 1rem;
    border: 2px solid var(--border-color);
    border-radius: 8px;
    cursor: pointer;
    transition: border-color 0.15s, background-color 0.15s;
}

.delivery-service-option:hover[b-arzp09ivj8] {
    border-color: var(--primary-color);
    background-color: #f8f9fb;
}

.delivery-service-option.selected[b-arzp09ivj8] {
    border-color: var(--primary-color);
    background-color: #e7f1ff;
}

.delivery-service-option .form-check-label[b-arzp09ivj8] {
    cursor: pointer;
}

.stat-row[b-arzp09ivj8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.stat-label[b-arzp09ivj8] {
    font-weight: 500;
    color: #495057;
}
/* /Components/Pages/OrdersList.razor.rz.scp.css */
/* Page layout */
.orders-list-page[b-ehh2nbd68f] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-ehh2nbd68f] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-ehh2nbd68f] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-ehh2nbd68f] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Error */
.list-error[b-ehh2nbd68f] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 2rem;
    text-align: center;
    color: var(--secondary-color);
}

.list-error i[b-ehh2nbd68f] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}

/* Header */
.orders-list-header[b-ehh2nbd68f] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.back-link[b-ehh2nbd68f] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-ehh2nbd68f] {
    text-decoration: underline;
}

.orders-list-header h1[b-ehh2nbd68f] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.orders-list-title-row[b-ehh2nbd68f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

/* Card */
.orders-list-card[b-ehh2nbd68f] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-ehh2nbd68f] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-ehh2nbd68f] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-ehh2nbd68f] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.orders-table-wrapper[b-ehh2nbd68f] {
    overflow-x: auto;
}

.orders-table[b-ehh2nbd68f] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.orders-table thead tr[b-ehh2nbd68f] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.orders-table th[b-ehh2nbd68f] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.orders-table td[b-ehh2nbd68f] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.orders-table tbody tr:last-child td[b-ehh2nbd68f] {
    border-bottom: none;
}

.orders-table tbody tr:hover[b-ehh2nbd68f] {
    background: #f8f9fa;
}

.order-row[b-ehh2nbd68f] {
    cursor: pointer;
}

.order-number[b-ehh2nbd68f] {
    font-weight: 600;
    font-family: monospace;
    font-size: 0.875rem;
}

.order-amount[b-ehh2nbd68f] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.order-total[b-ehh2nbd68f] {
    font-weight: 600;
}

.col-right[b-ehh2nbd68f] {
    text-align: right !important;
}

/* Status badges */
.order-status-badge[b-ehh2nbd68f] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
}

.order-status-badge--created[b-ehh2nbd68f] {
    background: #e7f1ff;
    color: var(--primary-color);
}

.order-status-badge--confirmed[b-ehh2nbd68f] {
    background: #fff3cd;
    color: #856404;
}

.order-status-badge--processing[b-ehh2nbd68f] {
    background: #fff3cd;
    color: #856404;
}

.order-status-badge--shipped[b-ehh2nbd68f] {
    background: #d1f0e0;
    color: #0a6640;
}

.order-status-badge--delivered[b-ehh2nbd68f] {
    background: #c8e6c9;
    color: #1b5e20;
}

.order-status-badge--cancelled[b-ehh2nbd68f] {
    background: #f8d7da;
    color: #842029;
}

/* Pager */
.orders-pager[b-ehh2nbd68f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-wrap: wrap;
    gap: 0.75rem;
}

.orders-pager-info[b-ehh2nbd68f] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.orders-pager-controls[b-ehh2nbd68f] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.orders-pager-current[b-ehh2nbd68f] {
    font-size: 0.85rem;
    color: var(--text-color);
    font-weight: 500;
    white-space: nowrap;
}
/* /Components/Pages/ProductCategories.razor.rz.scp.css */
/* Page layout */
.pc-page[b-4rejhz9ew0] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-4rejhz9ew0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-4rejhz9ew0] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-4rejhz9ew0] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.pc-header[b-4rejhz9ew0] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.pc-header-top[b-4rejhz9ew0] {
    display: flex;
    align-items: center;
}

.pc-header-row[b-4rejhz9ew0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.pc-header-row h1[b-4rejhz9ew0] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-4rejhz9ew0] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-4rejhz9ew0] {
    text-decoration: underline;
}

.btn-add[b-4rejhz9ew0] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* Filter */
.pc-filter[b-4rejhz9ew0] {
    background: white;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    padding: 1rem 1.25rem;
}

.pc-filter-row[b-4rejhz9ew0] {
    display: flex;
    align-items: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.pc-filter-input-wrapper[b-4rejhz9ew0] {
    position: relative;
    flex: 2 1 200px;
    display: flex;
    align-items: center;
}

.pc-filter-input-wrapper > i[b-4rejhz9ew0] {
    position: absolute;
    left: 0.75rem;
    color: var(--secondary-color);
    font-size: 0.9rem;
    pointer-events: none;
}

.pc-filter-input[b-4rejhz9ew0] {
    width: 100%;
    padding: 0.5rem 2.25rem 0.5rem 2.25rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    font-size: 0.9rem;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.pc-filter-input:focus[b-4rejhz9ew0] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 105, 217, 0.12);
}

.pc-filter-clear[b-4rejhz9ew0] {
    position: absolute;
    right: 0.5rem;
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
    font-size: 0.8rem;
    border-radius: 4px;
    transition: color 0.15s;
}

.pc-filter-clear:hover[b-4rejhz9ew0] {
    color: var(--text-color);
}

.pc-filter-group[b-4rejhz9ew0] {
    flex: 1 1 140px;
}

.pc-filter-actions[b-4rejhz9ew0] {
    flex-shrink: 0;
}

/* Card */
.pc-card[b-4rejhz9ew0] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-4rejhz9ew0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-4rejhz9ew0] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-4rejhz9ew0] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.pc-table-wrapper[b-4rejhz9ew0] {
    overflow-x: auto;
}

.pc-table[b-4rejhz9ew0] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.pc-table thead tr[b-4rejhz9ew0] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.pc-table th[b-4rejhz9ew0] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.pc-table td[b-4rejhz9ew0] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.pc-table tbody tr:last-child td[b-4rejhz9ew0] {
    border-bottom: none;
}

.pc-table tbody tr:hover[b-4rejhz9ew0] {
    background: #f8f9fa;
}

.col-center[b-4rejhz9ew0] {
    text-align: center;
    width: 8rem;
}

.pc-table th.col-center[b-4rejhz9ew0] {
    text-align: center;
}

/* Status badges */
.status-badge[b-4rejhz9ew0] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.2rem 0.6rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
}

.status-badge--active[b-4rejhz9ew0] {
    background: #d1fae5;
    color: #065f46;
}

.status-badge--inactive[b-4rejhz9ew0] {
    background: #f3f4f6;
    color: #6b7280;
}

/* Pager */
.pc-pager[b-4rejhz9ew0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-wrap: wrap;
    gap: 0.5rem;
}

.pc-pager-info[b-4rejhz9ew0] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.pc-pager-controls[b-4rejhz9ew0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.pc-pager-current[b-4rejhz9ew0] {
    font-size: 0.85rem;
    color: var(--secondary-color);
    white-space: nowrap;
}

/* Modal */
.pc-modal-backdrop[b-4rejhz9ew0] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 1rem;
}

.pc-modal[b-4rejhz9ew0] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    width: 100%;
    max-width: 480px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.pc-modal--narrow[b-4rejhz9ew0] {
    max-width: 420px;
}

.pc-modal-header[b-4rejhz9ew0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    background: var(--background-color);
}

.pc-modal-header h2[b-4rejhz9ew0] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.pc-modal-close[b-4rejhz9ew0] {
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    font-size: 1rem;
    border-radius: 4px;
    line-height: 1;
    transition: color 0.15s;
}

.pc-modal-close:hover[b-4rejhz9ew0] {
    color: var(--text-color);
}

.pc-modal-body[b-4rejhz9ew0] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.pc-modal-body p[b-4rejhz9ew0] {
    margin: 0;
}

.form-group[b-4rejhz9ew0] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-4rejhz9ew0] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
}

.required[b-4rejhz9ew0] {
    color: #dc3545;
}

.field-error[b-4rejhz9ew0] {
    font-size: 0.8rem;
    color: #dc3545;
}

.form-row-checks[b-4rejhz9ew0] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
}

.pc-modal-footer[b-4rejhz9ew0] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
}
/* /Components/Pages/ProductDetails.razor.rz.scp.css */
.loading-container[b-wf2mtjfuqf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-wf2mtjfuqf] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-wf2mtjfuqf] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

.not-found[b-wf2mtjfuqf] {
    text-align: center;
    padding: 6rem 0;
    color: #6c757d;
}

.not-found i[b-wf2mtjfuqf] {
    font-size: 4rem;
    margin-bottom: 1rem;
    opacity: 0.5;
    display: block;
}

.product-details-page[b-wf2mtjfuqf] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
}

.breadcrumb-nav[b-wf2mtjfuqf] {
    margin-bottom: 2rem;
}

.product-details-layout[b-wf2mtjfuqf] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    align-items: start;
}

.product-images[b-wf2mtjfuqf] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.product-main-image[b-wf2mtjfuqf] {
    max-width: 256px;
    height: auto;
    border-radius: 12px;
    object-fit: contain;
    background: #f8f9fa;
}

.product-image-placeholder[b-wf2mtjfuqf] {
    width: 100%;
    height: 480px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 6rem;
    color: #dee2e6;
    background: #f8f9fa;
    border-radius: 12px;
}

.product-thumbnails[b-wf2mtjfuqf] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.product-thumbnail[b-wf2mtjfuqf] {
    width: 72px;
    height: 72px;
    object-fit: cover;
    border-radius: 8px;
    cursor: pointer;
    border: 2px solid transparent;
    transition: border-color 0.2s;
}

.product-thumbnail:hover[b-wf2mtjfuqf] {
    border-color: #0d6efd;
}

.product-thumbnail.active[b-wf2mtjfuqf] {
    border-color: #0d6efd;
}

.product-info[b-wf2mtjfuqf] {
    display: flex;
    flex-direction: column;
}

.product-brand[b-wf2mtjfuqf] {
    color: #0d6efd;
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

.product-name[b-wf2mtjfuqf] {
    font-size: 2rem;
    font-weight: 700;
    color: #2c3e50;
    margin: 0 0 0.5rem 0;
    line-height: 1.2;
}

.product-size[b-wf2mtjfuqf] {
    color: #6c757d;
    font-size: 1rem;
    margin-bottom: 1rem;
}

.product-categories[b-wf2mtjfuqf] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}

.category-badge[b-wf2mtjfuqf] {
    background: #e9ecef;
    color: #495057;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 500;
}

.product-description[b-wf2mtjfuqf] {
    color: #495057;
    font-size: 1rem;
    line-height: 1.7;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

.product-sections[b-wf2mtjfuqf] {
    margin-top: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.product-section[b-wf2mtjfuqf] {
    border-top: 1px solid #e9ecef;
    padding-top: 1rem;
}

.product-section--description[b-wf2mtjfuqf] {
    border-top: none;
    padding-top: 0;
}

.section-title[b-wf2mtjfuqf] {
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color: #6c757d;
    margin: 0 0 0.5rem 0;
}

.section-text[b-wf2mtjfuqf] {
    font-size: 1rem;
    color: #495057;
    line-height: 1.7;
    margin: 0;
}

.product-section--description .section-text[b-wf2mtjfuqf] {
    font-size: 1rem;
    color: #495057;
}

.section-list[b-wf2mtjfuqf] {
    margin: 0;
    padding-left: 1.25rem;
    color: #495057;
    font-size: 1rem;
    line-height: 1.7;
}

.section-list li[b-wf2mtjfuqf] {
    margin-bottom: 0.15rem;
}

.product-pricing[b-wf2mtjfuqf] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin-bottom: 0.5rem;
}

.price[b-wf2mtjfuqf] {
    font-size: 2rem;
    font-weight: 700;
    color: #28a745;
    white-space: nowrap;
}

.rrp[b-wf2mtjfuqf] {
    font-size: 0.875rem;
    color: #6c757d;
    white-space: nowrap;
}

.add-to-cart-section[b-wf2mtjfuqf] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: 1.5rem;
    padding: 1.25rem;
    background: #f8f9fa;
    border-radius: 12px;
    border: 1px solid #e9ecef;
}

.quantity-selector[b-wf2mtjfuqf] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.quantity-selector label[b-wf2mtjfuqf] {
    font-weight: 600;
    color: #495057;
    margin: 0;
}

.qty-input[b-wf2mtjfuqf] {
    width: 64px;
    height: 38px;
    text-align: center;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    font-size: 1rem;
}

.qty-input:focus[b-wf2mtjfuqf] {
    outline: none;
    border-color: #0d6efd;
    box-shadow: 0 0 0 2px rgba(13, 110, 253, 0.15);
}

.qty-btn[b-wf2mtjfuqf] {
    width: 38px;
    height: 38px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
}

.cart-message[b-wf2mtjfuqf] {
    color: #28a745;
    font-weight: 600;
    font-size: 0.9rem;
    animation: fadeIn-b-wf2mtjfuqf 0.3s ease-in;
}

@keyframes fadeIn-b-wf2mtjfuqf {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 768px) {
    .product-details-page[b-wf2mtjfuqf] {
        padding: 1rem;
    }

    .product-details-layout[b-wf2mtjfuqf] {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .product-name[b-wf2mtjfuqf] {
        font-size: 1.5rem;
    }
}
/* /Components/Pages/ProductFormats.razor.rz.scp.css */
/* Page layout */
.pf-page[b-98heh2rihs] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-98heh2rihs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-98heh2rihs] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-98heh2rihs] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.pf-header[b-98heh2rihs] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.pf-header-top[b-98heh2rihs] {
    display: flex;
    align-items: center;
}

.pf-header-row[b-98heh2rihs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.pf-header-row h1[b-98heh2rihs] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-98heh2rihs] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-98heh2rihs] {
    text-decoration: underline;
}

.btn-add[b-98heh2rihs] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* Filter */
.pf-filter[b-98heh2rihs] {
    display: flex;
    align-items: center;
}

.pf-filter-input-wrapper[b-98heh2rihs] {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 400px;
}

.pf-filter-input-wrapper > i[b-98heh2rihs] {
    position: absolute;
    left: 0.75rem;
    color: var(--secondary-color);
    font-size: 0.9rem;
    pointer-events: none;
}

.pf-filter-input[b-98heh2rihs] {
    width: 100%;
    padding: 0.5rem 2.25rem 0.5rem 2.25rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    font-size: 0.9rem;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.pf-filter-input:focus[b-98heh2rihs] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 105, 217, 0.12);
}

.pf-filter-clear[b-98heh2rihs] {
    position: absolute;
    right: 0.5rem;
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
    font-size: 0.8rem;
    border-radius: 4px;
    transition: color 0.15s;
}

.pf-filter-clear:hover[b-98heh2rihs] {
    color: var(--text-color);
}

/* Card */
.pf-card[b-98heh2rihs] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-98heh2rihs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-98heh2rihs] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-98heh2rihs] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.pf-table-wrapper[b-98heh2rihs] {
    overflow-x: auto;
}

.pf-table[b-98heh2rihs] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.pf-table thead tr[b-98heh2rihs] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.pf-table th[b-98heh2rihs] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.pf-table td[b-98heh2rihs] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.pf-table tbody tr:last-child td[b-98heh2rihs] {
    border-bottom: none;
}

.pf-table tbody tr:hover[b-98heh2rihs] {
    background: #f8f9fa;
}

.col-center[b-98heh2rihs] {
    text-align: center;
    width: 8rem;
}

.pf-table th.col-center[b-98heh2rihs] {
    text-align: center;
}

/* Pager */
.pf-pager[b-98heh2rihs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-wrap: wrap;
    gap: 0.5rem;
}

.pf-pager-info[b-98heh2rihs] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.pf-pager-controls[b-98heh2rihs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.pf-pager-current[b-98heh2rihs] {
    font-size: 0.85rem;
    color: var(--secondary-color);
    white-space: nowrap;
}

/* Modal */
.pf-modal-backdrop[b-98heh2rihs] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 1rem;
}

.pf-modal[b-98heh2rihs] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    width: 100%;
    max-width: 480px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.pf-modal--narrow[b-98heh2rihs] {
    max-width: 420px;
}

.pf-modal-header[b-98heh2rihs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    background: var(--background-color);
}

.pf-modal-header h2[b-98heh2rihs] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.pf-modal-close[b-98heh2rihs] {
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    font-size: 1rem;
    border-radius: 4px;
    line-height: 1;
    transition: color 0.15s;
}

.pf-modal-close:hover[b-98heh2rihs] {
    color: var(--text-color);
}

.pf-modal-body[b-98heh2rihs] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.pf-modal-body p[b-98heh2rihs] {
    margin: 0;
}

.form-group[b-98heh2rihs] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-98heh2rihs] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
}

.required[b-98heh2rihs] {
    color: #dc3545;
}

.field-error[b-98heh2rihs] {
    font-size: 0.8rem;
    color: #dc3545;
}

.pf-modal-footer[b-98heh2rihs] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
}
/* /Components/Pages/ProductGroups.razor.rz.scp.css */
/* Page layout */
.pg-page[b-vius3shq96] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-vius3shq96] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-vius3shq96] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-vius3shq96] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.pg-header[b-vius3shq96] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.pg-header-top[b-vius3shq96] {
    display: flex;
    align-items: center;
}

.pg-header-row[b-vius3shq96] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.pg-header-row h1[b-vius3shq96] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-vius3shq96] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-vius3shq96] {
    text-decoration: underline;
}

.btn-add[b-vius3shq96] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* Filter */
.pg-filter[b-vius3shq96] {
    background: white;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    padding: 1rem 1.25rem;
}

.pg-filter-row[b-vius3shq96] {
    display: flex;
    align-items: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.pg-filter-input-wrapper[b-vius3shq96] {
    position: relative;
    flex: 2 1 200px;
    display: flex;
    align-items: center;
}

.pg-filter-input-wrapper > i[b-vius3shq96] {
    position: absolute;
    left: 0.75rem;
    color: var(--secondary-color);
    font-size: 0.9rem;
    pointer-events: none;
}

.pg-filter-input[b-vius3shq96] {
    width: 100%;
    padding: 0.5rem 2.25rem 0.5rem 2.25rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    font-size: 0.9rem;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.pg-filter-input:focus[b-vius3shq96] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 105, 217, 0.12);
}

.pg-filter-clear[b-vius3shq96] {
    position: absolute;
    right: 0.5rem;
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
    font-size: 0.8rem;
    border-radius: 4px;
    transition: color 0.15s;
}

.pg-filter-clear:hover[b-vius3shq96] {
    color: var(--text-color);
}

.pg-filter-group[b-vius3shq96] {
    flex: 1 1 140px;
}

.pg-filter-actions[b-vius3shq96] {
    flex-shrink: 0;
}

/* Card */
.pg-card[b-vius3shq96] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-vius3shq96] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-vius3shq96] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-vius3shq96] {
    margin: 0;
    font-size: 0.9rem;
}

.no-data--sm[b-vius3shq96] {
    padding: 2rem 1rem;
}

.no-data--sm i[b-vius3shq96] {
    font-size: 1.5rem;
}

/* Table */
.pg-table-wrapper[b-vius3shq96] {
    overflow-x: auto;
}

.pg-table[b-vius3shq96] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.pg-table thead tr[b-vius3shq96] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.pg-table th[b-vius3shq96] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.pg-table td[b-vius3shq96] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.pg-table tbody tr:last-child td[b-vius3shq96] {
    border-bottom: none;
}

.pg-table tbody tr:hover[b-vius3shq96] {
    background: #f8f9fa;
}

.col-center[b-vius3shq96] {
    text-align: center;
    width: 7rem;
}

.pg-table th.col-center[b-vius3shq96] {
    text-align: center;
}

.col-actions[b-vius3shq96] {
    width: 11rem;
    white-space: nowrap;
}

.pg-name[b-vius3shq96] {
    font-weight: 600;
    color: #2c3e50;
}

/* Status badges */
.status-badge[b-vius3shq96] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
}

.status-badge--active[b-vius3shq96] {
    background: #d1fae5;
    color: #065f46;
}

.status-badge--inactive[b-vius3shq96] {
    background: #f3f4f6;
    color: #6b7280;
}

/* Stat chip */
.stat-chip[b-vius3shq96] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.75rem;
    padding: 0.15rem 0.5rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    background: #e0e7ff;
    color: #3730a3;
}

/* Pager */
.pg-pager[b-vius3shq96] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-wrap: wrap;
    gap: 0.5rem;
}

.pg-pager-info[b-vius3shq96] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.pg-pager-controls[b-vius3shq96] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.pg-pager-current[b-vius3shq96] {
    font-size: 0.85rem;
    color: var(--secondary-color);
    white-space: nowrap;
}

/* Modal */
.pg-modal-backdrop[b-vius3shq96] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 1rem;
}

.pg-modal[b-vius3shq96] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    width: 100%;
    max-width: 520px;
    display: flex;
    flex-direction: column;
    max-height: 90vh;
    overflow: hidden;
}

.pg-modal--narrow[b-vius3shq96] {
    max-width: 420px;
}

.pg-modal--wide[b-vius3shq96] {
    max-width: 680px;
}

.pg-modal-header[b-vius3shq96] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    background: var(--background-color);
    flex-shrink: 0;
}

.pg-modal-header h2[b-vius3shq96] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.pg-modal-close[b-vius3shq96] {
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    font-size: 1rem;
    border-radius: 4px;
    line-height: 1;
    transition: color 0.15s;
    flex-shrink: 0;
}

.pg-modal-close:hover[b-vius3shq96] {
    color: var(--text-color);
}

.pg-modal-body[b-vius3shq96] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    overflow-y: auto;
}

.pg-modal-body--scroll[b-vius3shq96] {
    overflow-y: auto;
    max-height: calc(90vh - 10rem);
}

.pg-modal-body p[b-vius3shq96] {
    margin: 0;
}

.pg-modal-footer[b-vius3shq96] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-shrink: 0;
}

/* Form elements */
.form-group[b-vius3shq96] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-vius3shq96] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
}

.required[b-vius3shq96] {
    color: #dc3545;
}

.field-error[b-vius3shq96] {
    font-size: 0.8rem;
    color: #dc3545;
}

.form-row-checks[b-vius3shq96] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
}

/* Loading inline */
.pg-loading-inline[b-vius3shq96] {
    display: flex;
    align-items: center;
    color: var(--secondary-color);
    font-size: 0.9rem;
    padding: 0.5rem 0;
}

/* Sections toolbar */
.sections-toolbar[b-vius3shq96] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.sections-hint[b-vius3shq96] {
    font-size: 0.8rem;
    color: var(--secondary-color);
    display: flex;
    align-items: center;
}

/* Sections list */
.sections-list[b-vius3shq96] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.section-row[b-vius3shq96] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 0.875rem;
    background: var(--background-color);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    cursor: grab;
    transition: background 0.15s, box-shadow 0.15s, opacity 0.15s;
    user-select: none;
}

.section-row:hover[b-vius3shq96] {
    background: #eef2ff;
    border-color: #a5b4fc;
}

.section-row--dragging[b-vius3shq96] {
    opacity: 0.4;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.pg-drag-handle[b-vius3shq96] {
    color: var(--secondary-color);
    font-size: 1rem;
    flex-shrink: 0;
    cursor: grab;
    line-height: 1;
}

.pg-row-name[b-vius3shq96] {
    flex: 1;
    font-size: 0.9rem;
    font-weight: 500;
    color: #2c3e50;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pg-row-actions[b-vius3shq96] {
    display: flex;
    gap: 0.25rem;
    flex-shrink: 0;
}

/* Section form */
.section-form-title[b-vius3shq96] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 0.25rem;
}

.section-content-area[b-vius3shq96] {
    font-size: 0.875rem;
    resize: vertical;
}

.section-form-actions[b-vius3shq96] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: 0.5rem;
}

/* Delete section inline */
.delete-section-confirm[b-vius3shq96] {
    background: #fff5f5;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.delete-section-confirm p[b-vius3shq96] {
    margin: 0;
    font-size: 0.9rem;
    color: #2c3e50;
}

.delete-section-actions[b-vius3shq96] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

/* Categories list */
.categories-list[b-vius3shq96] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.category-check-row[b-vius3shq96] {
    padding: 0.4rem 0.25rem;
    border-radius: 6px;
    transition: background 0.1s;
}

.category-check-row:hover[b-vius3shq96] {
    background: var(--background-color);
}

.category-check-row .form-check[b-vius3shq96] {
    margin: 0;
}

.category-check-row .form-check-label[b-vius3shq96] {
    font-size: 0.9rem;
    cursor: pointer;
}
/* /Components/Pages/Products.razor.rz.scp.css */
.products-page[b-hv00mbimvk] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
}

.products-header[b-hv00mbimvk] {
    margin-bottom: 2rem;
}

.products-header h1[b-hv00mbimvk] {
    color: #2c3e50;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.category-info[b-hv00mbimvk] {
    color: #6c757d;
    font-size: 1.1rem;
}

.loading-container[b-hv00mbimvk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-hv00mbimvk] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-hv00mbimvk] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

.no-products[b-hv00mbimvk] {
    text-align: center;
    padding: 4rem 0;
    color: #6c757d;
}

.no-products i[b-hv00mbimvk] {
    font-size: 4rem;
    margin-bottom: 1rem;
    opacity: 0.5;
}

.products-grid[b-hv00mbimvk] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 2rem;
    margin-top: 2rem;
}

.product-card[b-hv00mbimvk] {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s, box-shadow 0.2s;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.product-card:hover[b-hv00mbimvk] {
    transform: translateY(-4px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.product-image-container[b-hv00mbimvk] {
    position: relative;
    width: 100%;
    background: #f8f9fa;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.product-image[b-hv00mbimvk] {
    max-width: 256px;
    max-height: 256px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.product-image-placeholder[b-hv00mbimvk] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 4rem;
    color: #dee2e6;
}

.product-info[b-hv00mbimvk] {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.product-brand[b-hv00mbimvk] {
    color: #0d6efd;
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

.product-name[b-hv00mbimvk] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #2c3e50;
    margin: 0 0 0.5rem 0;
    line-height: 1.3;
}

.product-size[b-hv00mbimvk] {
    color: #6c757d;
    font-size: 0.9rem;
    margin-bottom: 0.75rem;
}

.product-description[b-hv00mbimvk] {
    color: #6c757d;
    font-size: 0.9rem;
    line-height: 1.5;
    margin-bottom: 1rem;
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.product-categories[b-hv00mbimvk] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.category-badge[b-hv00mbimvk] {
    background: #e9ecef;
    color: #495057;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 500;
}

.product-footer[b-hv00mbimvk] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    margin-top: auto;
    padding-top: 1rem;
    border-top: 1px solid #e9ecef;
}

.product-footer-top[b-hv00mbimvk] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
}

.product-pricing[b-hv00mbimvk] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.price[b-hv00mbimvk] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #28a745;
    white-space: nowrap;
}

.rrp[b-hv00mbimvk] {
    font-size: 0.875rem;
    color: #6c757d;
    white-space: nowrap;
}

.view-details[b-hv00mbimvk] {
    white-space: nowrap;
}

.product-actions[b-hv00mbimvk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.add-to-cart-inline[b-hv00mbimvk] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.qty-input[b-hv00mbimvk] {
    width: 52px;
    height: 32px;
    text-align: center;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    font-size: 0.85rem;
    padding: 0 0.25rem;
}

.qty-input:focus[b-hv00mbimvk] {
    outline: none;
    border-color: #0d6efd;
    box-shadow: 0 0 0 2px rgba(13, 110, 253, 0.15);
}

.cart-toast[b-hv00mbimvk] {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    background: #28a745;
    color: white;
    padding: 0.75rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.9rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    z-index: 1000;
    animation: slideUp-b-hv00mbimvk 0.3s ease-out;
}

@keyframes slideUp-b-hv00mbimvk {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 768px) {
    .products-page[b-hv00mbimvk] {
        padding: 1rem;
    }

    .products-header h1[b-hv00mbimvk] {
        font-size: 2rem;
    }

    .products-grid[b-hv00mbimvk] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .product-footer-top[b-hv00mbimvk] {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .view-details[b-hv00mbimvk] {
        width: 100%;
    }
}
/* /Components/Pages/ReceivedPayments.razor.rz.scp.css */
/* Page layout */
.payments-list-page[b-zfrudsoabp] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-zfrudsoabp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-zfrudsoabp] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-zfrudsoabp] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.payments-list-header[b-zfrudsoabp] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.payments-list-header-top[b-zfrudsoabp] {
    display: flex;
    align-items: center;
}

.payments-list-header-row[b-zfrudsoabp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.back-link[b-zfrudsoabp] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-zfrudsoabp] {
    text-decoration: underline;
}

.payments-list-header h1[b-zfrudsoabp] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.btn-add-payment[b-zfrudsoabp] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Card */
.payments-list-card[b-zfrudsoabp] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-zfrudsoabp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-zfrudsoabp] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-zfrudsoabp] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.payments-table-wrapper[b-zfrudsoabp] {
    overflow-x: auto;
}

.payments-table[b-zfrudsoabp] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.payments-table thead tr[b-zfrudsoabp] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.payments-table th[b-zfrudsoabp] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.payments-table td[b-zfrudsoabp] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.payments-table tbody tr:last-child td[b-zfrudsoabp] {
    border-bottom: none;
}

.payments-table tbody tr:hover[b-zfrudsoabp] {
    background: #f8f9fa;
}

.col-right[b-zfrudsoabp] {
    text-align: right !important;
}

.payment-amount[b-zfrudsoabp] {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* Pager */
.payments-pager[b-zfrudsoabp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-wrap: wrap;
    gap: 0.75rem;
}

.payments-pager-info[b-zfrudsoabp] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.payments-pager-controls[b-zfrudsoabp] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.payments-pager-current[b-zfrudsoabp] {
    font-size: 0.85rem;
    color: var(--text-color);
    font-weight: 500;
    white-space: nowrap;
}

/* Modal backdrop */
.payment-modal-backdrop[b-zfrudsoabp] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 1rem;
}

/* Modal panel */
.payment-modal[b-zfrudsoabp] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    width: 100%;
    max-width: 480px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.payment-modal-header[b-zfrudsoabp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    background: var(--background-color);
}

.payment-modal-header h2[b-zfrudsoabp] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.payment-modal-close[b-zfrudsoabp] {
    background: none;
    border: none;
    color: var(--secondary-color);
    font-size: 1rem;
    cursor: pointer;
    padding: 0.25rem 0.5rem;
    border-radius: 6px;
    line-height: 1;
    transition: background 0.15s ease, color 0.15s ease;
}

.payment-modal-close:hover[b-zfrudsoabp] {
    background: #f0f0f0;
    color: #2c3e50;
}

/* Modal form body */
.payment-modal-body[b-zfrudsoabp] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.form-group[b-zfrudsoabp] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-zfrudsoabp] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #2c3e50;
}

.required[b-zfrudsoabp] {
    color: #dc3545;
}

.field-error[b-zfrudsoabp] {
    font-size: 0.8rem;
    color: #dc3545;
}

/* R prefix on amount input */
.input-prefix-group[b-zfrudsoabp] {
    display: flex;
    align-items: stretch;
}

.input-prefix[b-zfrudsoabp] {
    display: flex;
    align-items: center;
    padding: 0.375rem 0.65rem;
    background: var(--background-color);
    border: 1px solid #ced4da;
    border-right: none;
    border-radius: 6px 0 0 6px;
    font-size: 0.9rem;
    color: var(--secondary-color);
    font-weight: 500;
    white-space: nowrap;
}

.input-prefix-group .form-control[b-zfrudsoabp] {
    border-radius: 0 6px 6px 0;
    flex: 1;
    min-width: 0;
}

/* Modal footer */
.payment-modal-footer[b-zfrudsoabp] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
}
/* /Components/Pages/Suppliers.razor.rz.scp.css */
/* Page layout */
.suppliers-page[b-rhlv0jigfs] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-rhlv0jigfs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-rhlv0jigfs] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-rhlv0jigfs] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.suppliers-header[b-rhlv0jigfs] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.suppliers-header-top[b-rhlv0jigfs] {
    display: flex;
    align-items: center;
}

.suppliers-header-row[b-rhlv0jigfs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.suppliers-header-row h1[b-rhlv0jigfs] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-rhlv0jigfs] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.back-link:hover[b-rhlv0jigfs] {
    text-decoration: underline;
}

.btn-add[b-rhlv0jigfs] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* Filter */
.suppliers-filter[b-rhlv0jigfs] {
    display: flex;
    align-items: center;
}

.suppliers-filter-input-wrapper[b-rhlv0jigfs] {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 400px;
}

.suppliers-filter-input-wrapper > i[b-rhlv0jigfs] {
    position: absolute;
    left: 0.75rem;
    color: var(--secondary-color);
    font-size: 0.9rem;
    pointer-events: none;
}

.suppliers-filter-input[b-rhlv0jigfs] {
    width: 100%;
    padding: 0.5rem 2.25rem 0.5rem 2.25rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    font-size: 0.9rem;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.suppliers-filter-input:focus[b-rhlv0jigfs] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 105, 217, 0.12);
}

.suppliers-filter-clear[b-rhlv0jigfs] {
    position: absolute;
    right: 0.5rem;
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
    font-size: 0.8rem;
    border-radius: 4px;
    transition: color 0.15s;
}

.suppliers-filter-clear:hover[b-rhlv0jigfs] {
    color: var(--text-color);
}

/* Card */
.suppliers-card[b-rhlv0jigfs] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-rhlv0jigfs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-rhlv0jigfs] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-rhlv0jigfs] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.suppliers-table-wrapper[b-rhlv0jigfs] {
    overflow-x: auto;
}

.suppliers-table[b-rhlv0jigfs] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.suppliers-table thead tr[b-rhlv0jigfs] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.suppliers-table th[b-rhlv0jigfs] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.suppliers-table td[b-rhlv0jigfs] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.suppliers-table tbody tr:last-child td[b-rhlv0jigfs] {
    border-bottom: none;
}

.suppliers-table tbody tr:hover[b-rhlv0jigfs] {
    background: #f8f9fa;
}

.col-right[b-rhlv0jigfs] {
    text-align: right;
}

.col-center[b-rhlv0jigfs] {
    text-align: center;
    width: 5rem;
}

.col-website[b-rhlv0jigfs] {
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.website-link[b-rhlv0jigfs] {
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.875rem;
}

.website-link:hover[b-rhlv0jigfs] {
    text-decoration: underline;
}

/* Pager */
.suppliers-pager[b-rhlv0jigfs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
    flex-wrap: wrap;
    gap: 0.5rem;
}

.suppliers-pager-info[b-rhlv0jigfs] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.suppliers-pager-controls[b-rhlv0jigfs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.suppliers-pager-current[b-rhlv0jigfs] {
    font-size: 0.85rem;
    color: var(--secondary-color);
    white-space: nowrap;
}

/* Modal */
.suppliers-modal-backdrop[b-rhlv0jigfs] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 1rem;
}

.suppliers-modal[b-rhlv0jigfs] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    width: 100%;
    max-width: 480px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.suppliers-modal-header[b-rhlv0jigfs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    background: var(--background-color);
}

.suppliers-modal-header h2[b-rhlv0jigfs] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.suppliers-modal-close[b-rhlv0jigfs] {
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    font-size: 1rem;
    border-radius: 4px;
    line-height: 1;
    transition: color 0.15s;
}

.suppliers-modal-close:hover[b-rhlv0jigfs] {
    color: var(--text-color);
}

.suppliers-modal-body[b-rhlv0jigfs] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.suppliers-modal-footer[b-rhlv0jigfs] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
}

/* Form */
.form-group[b-rhlv0jigfs] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-rhlv0jigfs] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
}

.required[b-rhlv0jigfs] {
    color: #dc3545;
}

.field-error[b-rhlv0jigfs] {
    font-size: 0.8rem;
    color: #dc3545;
    margin-top: 0.15rem;
}
/* /Components/Pages/TransactionalAccounts.razor.rz.scp.css */
/* Page layout */
.ta-page[b-iukxqzsr1b] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-iukxqzsr1b] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 0;
    gap: 1.5rem;
    min-height: 400px;
}

.loading-container .spinner-border[b-iukxqzsr1b] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-iukxqzsr1b] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Card */
.ta-card[b-iukxqzsr1b] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-iukxqzsr1b] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--secondary-color);
    gap: 0.75rem;
}

.no-data i[b-iukxqzsr1b] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-iukxqzsr1b] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.ta-table-wrapper[b-iukxqzsr1b] {
    overflow-x: auto;
}

.ta-table[b-iukxqzsr1b] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.ta-table thead tr[b-iukxqzsr1b] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.ta-table th[b-iukxqzsr1b] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.ta-table th.col-center[b-iukxqzsr1b] {
    text-align: center;
}

.ta-table td[b-iukxqzsr1b] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.ta-table tbody tr:last-child td[b-iukxqzsr1b] {
    border-bottom: none;
}

.ta-table tbody tr:hover[b-iukxqzsr1b] {
    background: #f8f9fa;
}

.col-center[b-iukxqzsr1b] {
    text-align: center;
    width: 5rem;
}

/* Drag & drop */
.col-drag[b-iukxqzsr1b] {
    width: 2.5rem;
    text-align: center;
    padding-left: 0.5rem;
    padding-right: 0;
}

.drag-handle[b-iukxqzsr1b] {
    cursor: grab;
    color: #adb5bd;
    font-size: 1.1rem;
    transition: color 0.15s;
}

.drag-handle:hover[b-iukxqzsr1b] {
    color: #495057;
}

.ta-table tbody tr[draggable="true"][b-iukxqzsr1b] {
    cursor: grab;
}

.ta-table tbody tr[draggable="true"]:active[b-iukxqzsr1b] {
    cursor: grabbing;
}

.ta-table tbody tr.dragging[b-iukxqzsr1b] {
    opacity: 0.35;
}

.ta-table tbody tr.drag-over-above[b-iukxqzsr1b] {
    box-shadow: inset 0 3px 0 0 var(--primary-color, #0d6efd);
}

/* Modal */
.ta-modal-backdrop[b-iukxqzsr1b] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 1rem;
}

.ta-modal[b-iukxqzsr1b] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    width: 100%;
    max-width: 480px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.ta-modal-header[b-iukxqzsr1b] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    background: var(--background-color);
}

.ta-modal-header h2[b-iukxqzsr1b] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.ta-modal-close[b-iukxqzsr1b] {
    background: none;
    border: none;
    color: var(--secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    font-size: 1rem;
    border-radius: 4px;
    line-height: 1;
    transition: color 0.15s;
}

.ta-modal-close:hover[b-iukxqzsr1b] {
    color: var(--text-color);
}

.ta-modal-body[b-iukxqzsr1b] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.ta-modal-footer[b-iukxqzsr1b] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--background-color);
}

/* Form */
.form-group[b-iukxqzsr1b] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-iukxqzsr1b] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
}

.required[b-iukxqzsr1b] {
    color: #dc3545;
}

.field-error[b-iukxqzsr1b] {
    font-size: 0.8rem;
    color: #dc3545;
    margin-top: 0.15rem;
}
/* /Components/Shared/DashboardTileGrid.razor.rz.scp.css */
/* Card grid */
.dashboard-grid[b-hcvadekgqg] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
}

/* Metro tiles */
.metro-tile[b-hcvadekgqg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 2.25rem 1rem;
    cursor: pointer;
    transition: filter 0.15s ease, transform 0.1s ease;
    user-select: none;
    aspect-ratio: 1;
    position: relative;
}

.metro-tile i[b-hcvadekgqg] {
    font-size: 2.5rem;
    color: white;
}

.metro-tile span[b-hcvadekgqg] {
    font-size: 0.8rem;
    font-weight: 700;
    color: white;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.metro-tile:hover[b-hcvadekgqg] {
    filter: brightness(1.12);
    transform: scale(1.03);
    z-index: 1;
}

.metro-tile:active[b-hcvadekgqg] {
    filter: brightness(0.9);
    transform: scale(0.97);
}

/* Drag-and-drop states */
.tile-dragging[b-hcvadekgqg] {
    opacity: 0.4;
    transform: scale(0.95);
}

.tile-drag-over[b-hcvadekgqg] {
    outline: 3px dashed rgba(255, 255, 255, 0.7);
    outline-offset: -3px;
    filter: brightness(1.2);
}

/* Tile badge */
.tile-badge[b-hcvadekgqg] {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    width: 0.65rem;
    height: 0.65rem;
    border-radius: 50%;
    background: #e81123;
    border: 2px solid white;
    opacity: 0;
    transition: opacity 0.2s ease;
    pointer-events: none;
}

.tile-badge--visible[b-hcvadekgqg] {
    opacity: 1;
}

/* Metro color palette */
.tile-blue[b-hcvadekgqg]      { background: #0078d4; }
.tile-teal[b-hcvadekgqg]      { background: #008575; }
.tile-orange[b-hcvadekgqg]    { background: #d83b01; }
.tile-green[b-hcvadekgqg]     { background: #107c10; }
.tile-purple[b-hcvadekgqg]    { background: #5c2d91; }
.tile-dark-blue[b-hcvadekgqg] { background: #004e8c; }
.tile-red[b-hcvadekgqg]       { background: #e81123; }
.tile-cyan[b-hcvadekgqg]      { background: #0099bc; }
.tile-magenta[b-hcvadekgqg]   { background: #b4009e; }
.tile-dark-teal[b-hcvadekgqg] { background: #00b294; }
.tile-brown[b-hcvadekgqg]     { background: #8e562e; }
.tile-slate[b-hcvadekgqg]     { background: #486860; }
.tile-indigo[b-hcvadekgqg]    { background: #3b3ac7; }

/* Responsive */
@media (max-width: 992px) {
    .dashboard-grid[b-hcvadekgqg] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 640px) {
    .dashboard-grid[b-hcvadekgqg] {
        grid-template-columns: repeat(2, 1fr);
        gap: 3px;
    }
}
/* /Components/Shared/DashboardWidgetGrid.razor.rz.scp.css */
.widget-grid[b-a5qjtmdgqd] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.widget-slot[b-a5qjtmdgqd] {
    position: relative;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
    border: 1px solid #e9ecef;
    transition: box-shadow 0.15s ease, opacity 0.15s ease;
    overflow: visible;
}

.widget-slot:hover[b-a5qjtmdgqd] {
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
}

.widget-drag-handle[b-a5qjtmdgqd] {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    color: #adb5bd;
    cursor: grab;
    font-size: 1.1rem;
    line-height: 1;
    z-index: 1;
    transition: color 0.15s;
    user-select: none;
}

.widget-drag-handle:hover[b-a5qjtmdgqd] {
    color: #495057;
}

.widget-dragging[b-a5qjtmdgqd] {
    opacity: 0.4;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);
}

.widget-drag-over[b-a5qjtmdgqd] {
    outline: 2px dashed var(--primary-color, #0078d4);
    outline-offset: -2px;
}
/* /Components/Shared/ItemSearchCombobox.razor.rz.scp.css */
.isc-wrapper[b-vq1miqhinz] {
    position: relative;
}

.isc-input[b-vq1miqhinz] {
    width: 100%;
}

.isc-dropdown[b-vq1miqhinz] {
    position: fixed;
    z-index: 1050;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0 0 0.25rem 0.25rem;
    max-height: 220px;
    overflow-y: auto;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.isc-option[b-vq1miqhinz] {
    padding: 0.3rem 0.6rem;
    font-size: 0.8125rem;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.5;
}

.isc-option:hover[b-vq1miqhinz] {
    background-color: #e8f0fe;
    color: #1a56db;
}

.isc-no-results[b-vq1miqhinz] {
    padding: 0.35rem 0.6rem;
    font-size: 0.8125rem;
    color: #6c757d;
    font-style: italic;
}

.isc-chip[b-vq1miqhinz] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    background-color: #e9ecef;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    padding: 0 0.4rem;
    min-height: calc(1.5em + 0.5rem + 2px); /* matches .form-select-sm height */
    font-size: 0.8125rem;
}

.isc-chip-label[b-vq1miqhinz] {
    flex: 1 1 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.isc-chip-clear[b-vq1miqhinz] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    padding: 0;
    border: none;
    background: none;
    line-height: 1;
    color: #6c757d;
    cursor: pointer;
    font-size: 1rem;
}

.isc-chip-clear:hover[b-vq1miqhinz] {
    color: #dc3545;
}
/* /Components/Shared/OrderTurnaroundWidget.razor.rz.scp.css */
.perf-widget[b-kyi9e5ltjl] {
    padding: 1.5rem 1.75rem;
    min-height: 260px;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Header */
.perf-widget-header[b-kyi9e5ltjl] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.perf-widget-icon[b-kyi9e5ltjl] {
    font-size: 1.25rem;
    color: var(--primary-color, #0078d4);
}

.perf-widget-title[b-kyi9e5ltjl] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #343a40;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Loading */
.perf-widget-loading[b-kyi9e5ltjl] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #adb5bd;
}

/* Empty */
.perf-widget-empty[b-kyi9e5ltjl] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: #adb5bd;
    font-size: 0.9rem;
}

.perf-widget-empty i[b-kyi9e5ltjl] {
    font-size: 2rem;
}

/* Stat number */
.perf-widget-stat[b-kyi9e5ltjl] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.perf-widget-stat-value[b-kyi9e5ltjl] {
    font-size: 2.75rem;
    font-weight: 700;
    color: var(--primary-color, #0078d4);
    line-height: 1;
}

.perf-widget-stat-label[b-kyi9e5ltjl] {
    font-size: 0.8rem;
    color: #6c757d;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Bar chart */
.perf-widget-chart[b-kyi9e5ltjl] {
    display: flex;
    align-items: flex-end;
    gap: 0.5rem;
    flex: 1;
    padding-top: 0.5rem;
}

.chart-col[b-kyi9e5ltjl] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    min-width: 0;
}

.chart-bar-wrap[b-kyi9e5ltjl] {
    width: 100%;
    height: 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    position: relative;
}

.chart-bar[b-kyi9e5ltjl] {
    width: 70%;
    min-height: 4px;
    background: var(--primary-color, #0078d4);
    border-radius: 4px 4px 0 0;
    transition: height 0.4s ease;
    opacity: 0.85;
}

.chart-bar--empty[b-kyi9e5ltjl] {
    min-height: 3px;
    opacity: 0.2;
    background: #adb5bd;
}

.chart-bar:hover[b-kyi9e5ltjl] {
    opacity: 1;
}

.chart-bar-label-top[b-kyi9e5ltjl] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.2rem;
    white-space: nowrap;
}

.chart-bar-label-bottom[b-kyi9e5ltjl] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}
/* /Components/Shared/QuickAdd.razor.rz.scp.css */
.quick-add-wrapper[b-2wpds4rylc] {
    position: relative;
}

.quick-add-dropdown[b-2wpds4rylc] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
    z-index: 1000;
    max-height: 320px;
    overflow-y: auto;
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    column-gap: 0.5rem;
    text-align: left;
}

.quick-add-item[b-2wpds4rylc] {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: subgrid;
    align-items: center;
    cursor: pointer;
    border-bottom: 1px solid #f1f3f5;
    transition: background 0.1s;
}

.quick-add-item:last-child[b-2wpds4rylc] {
    border-bottom: none;
}

.quick-add-item:hover[b-2wpds4rylc] {
    background: #f8f9fa;
}

.quick-add-brand[b-2wpds4rylc] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #0d6efd;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    white-space: nowrap;
    padding: 0.6rem 0 0.6rem 1rem;
}

.quick-add-name[b-2wpds4rylc] {
    font-size: 0.9rem;
    font-weight: 500;
    color: #2c3e50;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0.6rem 0;
}

.quick-add-size[b-2wpds4rylc] {
    font-size: 0.8rem;
    color: #6c757d;
    white-space: nowrap;
    padding: 0.6rem 0;
}

.quick-add-price[b-2wpds4rylc] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #28a745;
    white-space: nowrap;
    padding: 0.6rem 1rem 0.6rem 0;
}

.quick-add-no-results[b-2wpds4rylc] {
    grid-column: 1 / -1;
    padding: 0.75rem 1rem;
    color: #6c757d;
    font-size: 0.9rem;
    text-align: center;
}

.quick-add-feedback[b-2wpds4rylc] {
    font-size: 0.85rem;
    margin-top: 0.4rem;
}
/* /Components/Shared/RevenueWidget.razor.rz.scp.css */
.revenue-widget[b-2e92jdrqsu] {
    padding: 1.5rem 1.75rem;
    min-height: 260px;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.perf-widget-header[b-2e92jdrqsu] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.perf-widget-icon[b-2e92jdrqsu] {
    font-size: 1.25rem;
    color: var(--primary-color, #0078d4);
}

.perf-widget-title[b-2e92jdrqsu] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #343a40;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.perf-widget-loading[b-2e92jdrqsu] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #adb5bd;
}

.perf-widget-empty[b-2e92jdrqsu] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: #adb5bd;
    font-size: 0.9rem;
}

.perf-widget-empty i[b-2e92jdrqsu] {
    font-size: 2rem;
}

/* Legend */
.revenue-legend[b-2e92jdrqsu] {
    display: flex;
    gap: 1rem;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
}

.revenue-legend-item[b-2e92jdrqsu] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.78rem;
    color: #495057;
    font-weight: 500;
}

.revenue-legend-dot[b-2e92jdrqsu] {
    width: 10px;
    height: 10px;
    border-radius: 2px;
    flex-shrink: 0;
}

/* Year colour palette — up to 4 years visible when window straddles a year boundary */
.revenue-year-0[b-2e92jdrqsu] { background-color: #f59f00; }                       /* oldest  — amber       */
.revenue-year-1[b-2e92jdrqsu] { background-color: #20c997; }                       /* second  — teal        */
.revenue-year-2[b-2e92jdrqsu] { background-color: var(--primary-color, #0078d4); } /* third   — brand blue  */
.revenue-year-3[b-2e92jdrqsu] { background-color: #ae3ec9; }                       /* fourth  — purple      */

/* Chart outer wrapper: y-axis + body side by side */
.revenue-chart-outer[b-2e92jdrqsu] {
    display: flex;
    gap: 0.4rem;
    flex: 1;
    min-height: 0;
}

/* Y-axis column */
.revenue-y-axis[b-2e92jdrqsu] {
    position: relative;
    width: 2.6rem;
    flex-shrink: 0;
    height: 140px;
    align-self: flex-start;
    margin-top: 0; /* aligns top of axis with top of bar area */
}

.revenue-y-label[b-2e92jdrqsu] {
    position: absolute;
    right: 0;
    transform: translateY(50%);
    font-size: 0.62rem;
    color: #adb5bd;
    white-space: nowrap;
    line-height: 1;
}

/* Body: contains the grid overlay + the bars */
.revenue-chart-body[b-2e92jdrqsu] {
    flex: 1;
    min-width: 0;
    position: relative;
    display: flex;
    flex-direction: column;
}

/* Grid lines — absolutely positioned behind bars */
.revenue-grid[b-2e92jdrqsu] {
    position: absolute;
    inset: 0 0 1.35rem 0; /* leave room for month labels at bottom */
    pointer-events: none;
}

.revenue-grid-line[b-2e92jdrqsu] {
    position: absolute;
    left: 0;
    right: 0;
    height: 1px;
    background-color: rgba(0, 0, 0, 0.07);
}

/* Bar chart row */
.revenue-chart[b-2e92jdrqsu] {
    display: flex;
    align-items: flex-end;
    gap: 0.6rem;
    flex: 1;
    overflow-x: auto;
}

.revenue-col[b-2e92jdrqsu] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
}

/* Group of bars for one month */
.revenue-bar-group[b-2e92jdrqsu] {
    width: 100%;
    height: 140px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 2px;
}

.revenue-bar-wrap[b-2e92jdrqsu] {
    flex: 1;
    height: 100%;
    display: flex;
    align-items: flex-end;
}

.revenue-bar[b-2e92jdrqsu] {
    width: 100%;
    min-height: 3px;
    border-radius: 3px 3px 0 0;
    transition: height 0.4s ease;
    cursor: default;
    opacity: 0.85;
}

.revenue-bar:hover[b-2e92jdrqsu] {
    opacity: 1;
    filter: brightness(1.1);
}

.revenue-bar--empty[b-2e92jdrqsu] {
    opacity: 0.15;
    background-color: #adb5bd !important;
}

.revenue-col-label[b-2e92jdrqsu] {
    font-size: 0.68rem;
    color: #6c757d;
    font-weight: 500;
    white-space: nowrap;
    text-align: center;
}
