/* /Components/Layout/MainLayout.razor.rz.scp.css */
#blazor-error-ui[b-mqfh1gzeis] {
    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-mqfh1gzeis] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-b69d3srseq],
.components-reconnect-repeated-attempt-visible[b-b69d3srseq],
.components-reconnect-failed-visible[b-b69d3srseq],
.components-pause-visible[b-b69d3srseq],
.components-resume-failed-visible[b-b69d3srseq],
.components-rejoining-animation[b-b69d3srseq] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-b69d3srseq],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-b69d3srseq],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-b69d3srseq],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-b69d3srseq],
#components-reconnect-modal.components-reconnect-retrying[b-b69d3srseq],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-b69d3srseq],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-b69d3srseq],
#components-reconnect-modal.components-reconnect-failed[b-b69d3srseq],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-b69d3srseq] {
    display: block;
}


#components-reconnect-modal[b-b69d3srseq] {
    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-b69d3srseq 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-b69d3srseq 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-b69d3srseq 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-b69d3srseq]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-b69d3srseq 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-b69d3srseq {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-b69d3srseq {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-b69d3srseq {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-b69d3srseq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-b69d3srseq] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-b69d3srseq] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-b69d3srseq] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-b69d3srseq] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-b69d3srseq] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-b69d3srseq] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-b69d3srseq 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-b69d3srseq] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-b69d3srseq {
    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/AdminCreateOrder.razor.rz.scp.css */
/* Page layout */
.admin-create-order-page[b-c6lqp2x8y2] {
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-c6lqp2x8y2] {
    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-c6lqp2x8y2] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-c6lqp2x8y2] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.order-detail-header[b-c6lqp2x8y2] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.back-link[b-c6lqp2x8y2] {
    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-c6lqp2x8y2] {
    color: #0d6efd;
}

.order-detail-title-row[b-c6lqp2x8y2] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.order-detail-title-row h1[b-c6lqp2x8y2] {
    font-size: 1.5rem;
    margin: 0;
}

/* Body */
.order-detail-body[b-c6lqp2x8y2] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Cards */
.order-detail-card[b-c6lqp2x8y2] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    padding: 1.25rem;
}

.card-section-title[b-c6lqp2x8y2] {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 1rem;
    color: #212529;
}

/* Customer select */
.customer-select-row[b-c6lqp2x8y2] {
    max-width: 400px;
}

/* No items hint */
.no-items-hint[b-c6lqp2x8y2] {
    font-size: 0.875rem;
    color: #6c757d;
    margin-bottom: 0;
}

/* Items table */
.order-items-table-wrapper[b-c6lqp2x8y2] {
    overflow-x: auto;
    margin-bottom: 0;
}

.order-items-table[b-c6lqp2x8y2] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.order-items-table th[b-c6lqp2x8y2],
.order-items-table td[b-c6lqp2x8y2] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid #e9ecef;
    vertical-align: middle;
}

.order-items-table th[b-c6lqp2x8y2] {
    font-weight: 600;
    color: #6c757d;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.col-right[b-c6lqp2x8y2] {
    text-align: right;
}

.col-center[b-c6lqp2x8y2] {
    text-align: center;
}

.col-qty[b-c6lqp2x8y2] {
    width: 80px;
}

.col-action[b-c6lqp2x8y2] {
    width: 48px;
}

.qty-input[b-c6lqp2x8y2] {
    width: 70px;
    text-align: right;
    display: inline-block;
}

.btn-icon[b-c6lqp2x8y2] {
    padding: 0.2rem 0.4rem;
    line-height: 1;
}

/* Marketing badge */
.badge-marketing[b-c6lqp2x8y2] {
    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-c6lqp2x8y2] {
    margin-top: 1rem;
    border-top: 1px solid #e9ecef;
    padding-top: 1rem;
}

.quick-add-row[b-c6lqp2x8y2] {
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
}

.quick-add-search-wrapper[b-c6lqp2x8y2] {
    position: relative;
    flex: 1;
    max-width: 400px;
}

.quick-add-results[b-c6lqp2x8y2] {
    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-c6lqp2x8y2] {
    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-c6lqp2x8y2] {
    background: #f0f4ff;
}

.qa-name[b-c6lqp2x8y2] {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-right: 0.5rem;
}

.qa-price[b-c6lqp2x8y2] {
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
}

/* Summary amounts */
.amounts-list[b-c6lqp2x8y2] {
    margin: 0;
    padding: 0;
}

.amounts-row[b-c6lqp2x8y2] {
    display: flex;
    justify-content: space-between;
    padding: 0.4rem 0;
    font-size: 0.9rem;
}

.amounts-row dt[b-c6lqp2x8y2] {
    font-weight: 500;
    color: #495057;
}

.amounts-row dd[b-c6lqp2x8y2] {
    font-weight: 500;
    margin: 0;
}

.amounts-row--editable dd[b-c6lqp2x8y2] {
    max-width: 160px;
}

.amount-input-group[b-c6lqp2x8y2] {
    max-width: 140px;
}

.amounts-row--credit dt[b-c6lqp2x8y2],
.amounts-row--credit dd[b-c6lqp2x8y2] {
    color: #198754;
}

.amounts-row--total[b-c6lqp2x8y2] {
    border-top: 2px solid #212529;
    margin-top: 0.25rem;
    padding-top: 0.6rem;
}

.amounts-row--total dt[b-c6lqp2x8y2],
.amounts-row--total dd[b-c6lqp2x8y2] {
    font-weight: 700;
    font-size: 1rem;
}

/* Actions card */
.actions-card[b-c6lqp2x8y2] {
    display: flex;
    flex-direction: column;
}

.confirm-actions[b-c6lqp2x8y2] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
}

/* Success panel */
.success-panel[b-c6lqp2x8y2] {
    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-c6lqp2x8y2] {
    font-size: 4rem;
    color: #198754;
    margin-bottom: 1rem;
}

.success-panel h2[b-c6lqp2x8y2] {
    margin: 0 0 0.75rem;
    font-size: 1.5rem;
    font-weight: 700;
}

.success-panel p[b-c6lqp2x8y2] {
    color: #495057;
    margin-bottom: 0.25rem;
}

.success-actions[b-c6lqp2x8y2] {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 1.75rem;
}

@media (max-width: 600px) {
    .admin-create-order-page[b-c6lqp2x8y2] {
        padding: 1rem;
    }

    .confirm-actions[b-c6lqp2x8y2] {
        flex-direction: column;
        align-items: stretch;
    }

    .customer-select-row[b-c6lqp2x8y2] {
        max-width: 100%;
    }
}
/* /Components/Pages/AdminDashboard.razor.rz.scp.css */
.dashboard-page[b-w0timj371w] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* Loading & Error */
.loading-container[b-w0timj371w] {
    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-w0timj371w] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-w0timj371w] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

.dashboard-error[b-w0timj371w] {
    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-w0timj371w] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}

/* Welcome Banner */
.dashboard-welcome[b-w0timj371w] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #004999 100%);
    color: white;
    border-radius: 12px;
    padding: 2rem 2.5rem;
}

.welcome-text h1[b-w0timj371w] {
    margin: 0 0 0.25rem;
    font-size: 2rem;
    font-weight: 700;
    color: white;
}

.welcome-text p[b-w0timj371w] {
    margin: 0;
    opacity: 0.85;
    font-size: 1rem;
}

/* Card grid */
.dashboard-grid[b-w0timj371w] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    align-items: start;
}

/* Cards */
.dashboard-card[b-w0timj371w] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.card-header[b-w0timj371w] {
    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-w0timj371w] {
    font-size: 1.25rem;
    color: var(--primary-color);
}

.card-header h2[b-w0timj371w] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    color: #2c3e50;
    flex: 1;
}

.card-chevron[b-w0timj371w] {
    font-size: 0.9rem !important;
    color: var(--secondary-color) !important;
    opacity: 0.5;
    transition: opacity 0.2s ease;
}

.card-body[b-w0timj371w] {
    padding: 1.5rem;
}

/* Clickable stat card */
.stat-card[b-w0timj371w] {
    cursor: pointer;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
    text-decoration: none;
}

.stat-card:hover[b-w0timj371w] {
    box-shadow: 0 6px 20px rgba(0, 102, 204, 0.15);
    transform: translateY(-2px);
}

.stat-card:hover .card-chevron[b-w0timj371w] {
    opacity: 1;
}

/* Stat rows */
.stat-row[b-w0timj371w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.5rem 0;
}

.stat-divider[b-w0timj371w] {
    height: 1px;
    background: var(--border-color);
    margin: 0.25rem 0;
}

.stat-label[b-w0timj371w] {
    font-size: 0.9rem;
    color: var(--secondary-color);
    font-weight: 500;
}

.stat-badge[b-w0timj371w] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.25rem;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 700;
    line-height: 1.4;
}

.stat-badge--warning[b-w0timj371w] {
    background: #fff3cd;
    color: #856404;
}

.stat-badge--primary[b-w0timj371w] {
    background: #e7f1ff;
    color: var(--primary-color);
}

.stat-badge--danger[b-w0timj371w] {
    background: #fde8e8;
    color: #b91c1c;
}

/* Responsive */
@media (max-width: 992px) {
    .dashboard-grid[b-w0timj371w] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .dashboard-page[b-w0timj371w] {
        padding: 1rem;
        gap: 1.25rem;
    }

    .dashboard-welcome[b-w0timj371w] {
        padding: 1.5rem;
    }

    .welcome-text h1[b-w0timj371w] {
        font-size: 1.5rem;
    }

    .dashboard-grid[b-w0timj371w] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/AdminOrder.razor.rz.scp.css */
/* Page layout */
.admin-order-page[b-stielb5uo3] {
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-stielb5uo3] {
    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-stielb5uo3] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-stielb5uo3] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Error */
.detail-error[b-stielb5uo3] {
    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-stielb5uo3] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}
/* /Components/Pages/AdminOrderConfirm.razor.rz.scp.css */
/* Page layout */
.admin-order-confirm-page[b-bn5tiujqxh] {
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-bn5tiujqxh] {
    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-bn5tiujqxh] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-bn5tiujqxh] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Error */
.detail-error[b-bn5tiujqxh] {
    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-bn5tiujqxh] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}

/* Header */
.order-detail-header[b-bn5tiujqxh] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.back-link[b-bn5tiujqxh] {
    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-bn5tiujqxh] {
    color: #0d6efd;
}

.order-detail-title-row[b-bn5tiujqxh] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.order-detail-title-row h1[b-bn5tiujqxh] {
    font-size: 1.5rem;
    margin: 0;
}

.order-id-badge[b-bn5tiujqxh] {
    font-weight: 600;
}

.order-placed-date[b-bn5tiujqxh] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0;
}

.order-customer-name[b-bn5tiujqxh] {
    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-bn5tiujqxh] {
    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-bn5tiujqxh]   { background: #e2e3e5; color: #383d41; }
.order-status-badge--confirmed[b-bn5tiujqxh] { background: #cce5ff; color: #004085; }
.order-status-badge--processing[b-bn5tiujqxh]{ background: #fff3cd; color: #856404; }
.order-status-badge--shipped[b-bn5tiujqxh]   { background: #d4edda; color: #155724; }
.order-status-badge--delivered[b-bn5tiujqxh]  { background: #d1ecf1; color: #0c5460; }
.order-status-badge--cancelled[b-bn5tiujqxh]  { background: #f8d7da; color: #721c24; }

/* Body */
.order-detail-body[b-bn5tiujqxh] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Cards */
.order-detail-card[b-bn5tiujqxh] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    padding: 1.25rem;
}

.card-section-title[b-bn5tiujqxh] {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 1rem;
    color: #212529;
}

/* Items table */
.order-items-table-wrapper[b-bn5tiujqxh] {
    overflow-x: auto;
}

.order-items-table[b-bn5tiujqxh] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.order-items-table th[b-bn5tiujqxh],
.order-items-table td[b-bn5tiujqxh] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid #e9ecef;
    vertical-align: middle;
}

.order-items-table th[b-bn5tiujqxh] {
    font-weight: 600;
    color: #6c757d;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.col-right[b-bn5tiujqxh] {
    text-align: right;
}

.col-center[b-bn5tiujqxh] {
    text-align: center;
}

.col-qty[b-bn5tiujqxh] {
    width: 80px;
}

.col-action[b-bn5tiujqxh] {
    width: 48px;
}

.qty-input[b-bn5tiujqxh] {
    width: 70px;
    text-align: right;
    display: inline-block;
}

.btn-icon[b-bn5tiujqxh] {
    padding: 0.2rem 0.4rem;
    line-height: 1;
}

/* Marketing badge */
.badge-marketing[b-bn5tiujqxh] {
    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-bn5tiujqxh] {
    margin-top: 1rem;
    border-top: 1px solid #e9ecef;
    padding-top: 1rem;
}

.quick-add-row[b-bn5tiujqxh] {
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
}

.quick-add-search-wrapper[b-bn5tiujqxh] {
    position: relative;
    flex: 1;
    max-width: 400px;
}

.quick-add-results[b-bn5tiujqxh] {
    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-bn5tiujqxh] {
    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-bn5tiujqxh] {
    background: #f0f4ff;
}

.qa-name[b-bn5tiujqxh] {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-right: 0.5rem;
}

.qa-price[b-bn5tiujqxh] {
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
}

/* Summary amounts */
.amounts-list[b-bn5tiujqxh] {
    margin: 0;
    padding: 0;
}

.amounts-row[b-bn5tiujqxh] {
    display: flex;
    justify-content: space-between;
    padding: 0.4rem 0;
    font-size: 0.9rem;
}

.amounts-row dt[b-bn5tiujqxh] {
    font-weight: 500;
    color: #495057;
}

.amounts-row dd[b-bn5tiujqxh] {
    font-weight: 500;
    margin: 0;
}

.amounts-row--editable dd[b-bn5tiujqxh] {
    max-width: 160px;
}

.amount-input-group[b-bn5tiujqxh] {
    max-width: 140px;
}

.amounts-row--credit dt[b-bn5tiujqxh],
.amounts-row--credit dd[b-bn5tiujqxh] {
    color: #198754;
}

.amounts-row--total[b-bn5tiujqxh] {
    border-top: 2px solid #212529;
    margin-top: 0.25rem;
    padding-top: 0.6rem;
}

.amounts-row--total dt[b-bn5tiujqxh],
.amounts-row--total dd[b-bn5tiujqxh] {
    font-weight: 700;
    font-size: 1rem;
}

/* Actions card */
.actions-card[b-bn5tiujqxh] {
    display: flex;
    flex-direction: column;
}

/* Success panel */
.success-panel[b-bn5tiujqxh] {
    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-bn5tiujqxh] {
    font-size: 4rem;
    color: #198754;
    margin-bottom: 1rem;
}

.success-panel h2[b-bn5tiujqxh] {
    margin: 0 0 0.75rem;
    font-size: 1.5rem;
    font-weight: 700;
}

.success-panel p[b-bn5tiujqxh] {
    color: #495057;
    margin-bottom: 0;
}

.success-actions[b-bn5tiujqxh] {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 1.75rem;
}

.confirm-actions[b-bn5tiujqxh] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
}

.cancel-inline[b-bn5tiujqxh] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
}

@media (max-width: 600px) {
    .admin-order-confirm-page[b-bn5tiujqxh] {
        padding: 1rem;
    }

    .confirm-actions[b-bn5tiujqxh] {
        flex-direction: column;
        align-items: stretch;
    }

    .cancel-inline[b-bn5tiujqxh] {
        flex-direction: column;
        align-items: stretch;
    }
}
/* /Components/Pages/AdminOrderDetail.razor.rz.scp.css */
/* Page layout */
.order-detail-page[b-jqaez21f8b] {
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-jqaez21f8b] {
    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-jqaez21f8b] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-jqaez21f8b] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Error */
.detail-error[b-jqaez21f8b] {
    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-jqaez21f8b] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}

/* Header */
.order-detail-header[b-jqaez21f8b] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.back-link[b-jqaez21f8b] {
    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-jqaez21f8b] {
    text-decoration: underline;
}

.order-detail-title-row[b-jqaez21f8b] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.order-detail-title-row h1[b-jqaez21f8b] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.order-id-badge[b-jqaez21f8b] {
    font-family: monospace;
}

.order-placed-date[b-jqaez21f8b] {
    margin: 0;
    font-size: 0.9rem;
    color: var(--secondary-color);
}

/* Cards */
.order-detail-body[b-jqaez21f8b] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.order-detail-card[b-jqaez21f8b] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 1.5rem;
}

.card-section-title[b-jqaez21f8b] {
    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-jqaez21f8b] {
    overflow-x: auto;
}

.order-items-table[b-jqaez21f8b] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.order-items-table thead tr[b-jqaez21f8b] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.order-items-table th[b-jqaez21f8b] {
    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-jqaez21f8b] {
    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-jqaez21f8b] {
    border-bottom: none;
}

.col-right[b-jqaez21f8b] {
    text-align: right !important;
}

/* Amounts */
.amounts-list[b-jqaez21f8b] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin: 0;
    max-width: 360px;
    margin-left: auto;
}

.amounts-row[b-jqaez21f8b] {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    color: #2c3e50;
}

.amounts-row dt[b-jqaez21f8b] {
    font-weight: 400;
    color: var(--secondary-color);
}

.amounts-row dd[b-jqaez21f8b] {
    margin: 0;
    font-variant-numeric: tabular-nums;
}

.amounts-row--total[b-jqaez21f8b] {
    padding-top: 0.5rem;
    border-top: 2px solid var(--border-color);
    margin-top: 0.25rem;
}

.amounts-row--total dt[b-jqaez21f8b],
.amounts-row--total dd[b-jqaez21f8b] {
    font-weight: 700;
    font-size: 1rem;
    color: #2c3e50;
}

.amounts-row--credit dt[b-jqaez21f8b],
.amounts-row--credit dd[b-jqaez21f8b] {
    color: #198754;
}

/* Invoice section */
.invoice-section[b-jqaez21f8b] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.invoice-number[b-jqaez21f8b] {
    font-family: monospace;
    font-weight: 600;
    font-size: 0.95rem;
    color: #2c3e50;
}

.invoice-download-btn[b-jqaez21f8b] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

/* Cancel card */
.cancel-card[b-jqaez21f8b] {
    border: 1px solid #f8d7da;
}

.cancel-description[b-jqaez21f8b] {
    font-size: 0.9rem;
    color: var(--secondary-color);
    margin: 0 0 1rem 0;
}

.cancel-confirm-text[b-jqaez21f8b] {
    font-size: 0.9rem;
    color: #2c3e50;
    margin: 0 0 1rem 0;
}

.cancel-confirm-actions[b-jqaez21f8b] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.cancel-error[b-jqaez21f8b] {
    font-size: 0.875rem;
    color: #dc3545;
}

/* Status badges */
.order-status-badge[b-jqaez21f8b] {
    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-jqaez21f8b] {
    background: #e7f1ff;
    color: var(--primary-color);
}

.order-status-badge--confirmed[b-jqaez21f8b] {
    background: #fff3cd;
    color: #856404;
}

.order-status-badge--processing[b-jqaez21f8b] {
    background: #fff3cd;
    color: #856404;
}

.order-status-badge--shipped[b-jqaez21f8b] {
    background: #d1f0e0;
    color: #0a6640;
}

.order-status-badge--delivered[b-jqaez21f8b] {
    background: #d1f0e0;
    color: #0a6640;
}

.order-status-badge--cancelled[b-jqaez21f8b] {
    background: #f8d7da;
    color: #842029;
}
/* /Components/Pages/AdminServices.razor.rz.scp.css */
.loading-container[b-m3f9j1zjga] {
    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-m3f9j1zjga] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-m3f9j1zjga] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

.svc-page[b-m3f9j1zjga] {
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.svc-header[b-m3f9j1zjga] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.svc-header-top[b-m3f9j1zjga] {
    display: flex;
    align-items: center;
}

.svc-header-row[b-m3f9j1zjga] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.svc-header h1[b-m3f9j1zjga] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.svc-subtitle[b-m3f9j1zjga] {
    margin: 0;
    font-size: 0.9rem;
    color: var(--secondary-color);
}

.back-link[b-m3f9j1zjga] {
    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-m3f9j1zjga] {
    text-decoration: underline;
}

.svc-card[b-m3f9j1zjga] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.no-data[b-m3f9j1zjga] {
    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-m3f9j1zjga] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-m3f9j1zjga] {
    margin: 0;
    font-size: 0.9rem;
}

.svc-table[b-m3f9j1zjga] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.svc-table thead tr[b-m3f9j1zjga] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.svc-table th[b-m3f9j1zjga] {
    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-m3f9j1zjga] {
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.svc-table tbody tr:last-child td[b-m3f9j1zjga] {
    border-bottom: none;
}

.svc-table tbody tr:hover[b-m3f9j1zjga] {
    background: #f8f9fa;
}

.col-center[b-m3f9j1zjga] {
    text-align: center !important;
}

.col-right[b-m3f9j1zjga] {
    text-align: right !important;
}

.svc-name[b-m3f9j1zjga] {
    font-weight: 600;
    color: #2c3e50;
}

.svc-type[b-m3f9j1zjga] {
    font-size: 0.78rem;
    color: var(--secondary-color);
    font-family: monospace;
    margin-top: 0.15rem;
}

.status-badge[b-m3f9j1zjga] {
    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-m3f9j1zjga] {
    background: #d4edda;
    color: #155724;
}

.status-badge--paused[b-m3f9j1zjga] {
    background: #fff3cd;
    color: #856404;
}

.toggle-switch[b-m3f9j1zjga] {
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 0;
}

.toggle-switch .form-check-input[b-m3f9j1zjga] {
    width: 2.5em;
    height: 1.25em;
    cursor: pointer;
}

.updated-at[b-m3f9j1zjga] {
    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-pwpc79y18k] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ── Loading ── */
.loading-container[b-pwpc79y18k] {
    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-pwpc79y18k] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-pwpc79y18k] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* ── Header ── */
.usr-header[b-pwpc79y18k] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.usr-header-top[b-pwpc79y18k] {
    display: flex;
    align-items: center;
}

.back-link[b-pwpc79y18k] {
    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-pwpc79y18k] {
    text-decoration: underline;
}

.usr-header-row[b-pwpc79y18k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.usr-header-row h1[b-pwpc79y18k] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

/* ── Filters ── */
.usr-filters[b-pwpc79y18k] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    padding: 1rem 1.25rem;
}

.usr-filter-row[b-pwpc79y18k] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: flex-end;
}

.usr-filter-group[b-pwpc79y18k] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1 1 140px;
}

.usr-filter-group label[b-pwpc79y18k] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #495057;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.usr-filter-actions[b-pwpc79y18k] {
    display: flex;
    align-items: flex-end;
}

/* ── Card ── */
.usr-card[b-pwpc79y18k] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    overflow: hidden;
}

/* ── Table ── */
.usr-table-wrapper[b-pwpc79y18k] {
    overflow-x: auto;
}

.usr-table[b-pwpc79y18k] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.usr-table thead tr[b-pwpc79y18k] {
    background: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
}

.usr-table th[b-pwpc79y18k] {
    padding: 0.75rem 1rem;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
    text-align: left;
}

.usr-table td[b-pwpc79y18k] {
    padding: 0.7rem 1rem;
    border-bottom: 1px solid #f0f0f0;
    vertical-align: middle;
}

.usr-table tbody tr:last-child td[b-pwpc79y18k] {
    border-bottom: none;
}

.usr-table tbody tr:hover[b-pwpc79y18k] {
    background: #f8f9fa;
}

.col-center[b-pwpc79y18k] {
    text-align: center !important;
}

.usr-name[b-pwpc79y18k] {
    font-weight: 600;
    white-space: nowrap;
}

.usr-email[b-pwpc79y18k] {
    color: #495057;
}

.usr-mobile[b-pwpc79y18k] {
    white-space: nowrap;
    color: #6c757d;
    font-size: 0.85rem;
}

.usr-customer[b-pwpc79y18k] {
    color: #495057;
}

.no-value[b-pwpc79y18k] {
    color: #adb5bd;
}

/* ── Role badge ── */
.usr-role[b-pwpc79y18k] {
    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-pwpc79y18k] {
    background: #cfe2ff;
    color: #084298;
}

.usr-role--customer[b-pwpc79y18k] {
    background: #d1e7dd;
    color: #0a3622;
}

.usr-role--ops[b-pwpc79y18k] {
    background: #fff3cd;
    color: #664d03;
}

/* ── Must change password indicator ── */
.usr-must-change[b-pwpc79y18k] {
    color: #dc3545;
    font-size: 1.1rem;
}

/* ── Reset password button ── */
.btn-reset-pw[b-pwpc79y18k] {
    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-pwpc79y18k] {
    background: #fff3cd;
    border-color: #ffc107;
    color: #664d03;
}

.btn-reset-pw:disabled[b-pwpc79y18k] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── Empty state ── */
.no-data[b-pwpc79y18k] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    color: #adb5bd;
    gap: 0.75rem;
}

.no-data i[b-pwpc79y18k] {
    font-size: 2.5rem;
}

.no-data p[b-pwpc79y18k] {
    margin: 0;
    font-size: 1rem;
}

/* ── Pager ── */
.usr-pager[b-pwpc79y18k] {
    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-pwpc79y18k] {
    font-size: 0.85rem;
    color: #6c757d;
}

.usr-pager-controls[b-pwpc79y18k] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.usr-pager-current[b-pwpc79y18k] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #495057;
}

/* ── Reset password toast ── */
.usr-reset-toast[b-pwpc79y18k] {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 1050;
    cursor: pointer;
    animation: slideUp-b-pwpc79y18k 0.25s ease-out;
}

@keyframes slideUp-b-pwpc79y18k {
    from { transform: translateY(1rem); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}

.usr-reset-toast-inner[b-pwpc79y18k] {
    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-pwpc79y18k] {
    color: #198754;
    font-size: 1.3rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.usr-reset-toast-inner div[b-pwpc79y18k] {
    flex: 1;
}

.usr-reset-toast-inner strong[b-pwpc79y18k] {
    display: block;
    font-size: 0.9rem;
    color: #2c3e50;
}

.usr-reset-toast-inner p[b-pwpc79y18k] {
    margin: 0.25rem 0 0;
    font-size: 0.85rem;
    color: #495057;
}

.usr-reset-pw-value[b-pwpc79y18k] {
    font-family: monospace;
    font-weight: 700;
    font-size: 1rem;
    color: #0d6efd;
    letter-spacing: 0.08em;
}

.usr-reset-toast-inner small[b-pwpc79y18k] {
    display: block;
    margin-top: 0.2rem;
    font-size: 0.78rem;
    color: #6c757d;
}

.usr-reset-toast-close[b-pwpc79y18k] {
    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-pwpc79y18k] {
    color: #6c757d;
}
/* /Components/Pages/Brands.razor.rz.scp.css */
/* Find a brand Page Styles */
.find-brand-page[b-avm6pygelc] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0;
}

.page-header[b-avm6pygelc] {
    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-avm6pygelc] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.9;
}

.page-header h1[b-avm6pygelc] {
    margin: 0 0 0.5rem 0;
    font-size: 2.5rem;
    font-weight: 700;
}

.page-header .lead[b-avm6pygelc] {
    font-size: 1.125rem;
    margin: 0;
    opacity: 0.9;
}

.brand-controls[b-avm6pygelc] {
    display: flex;
    gap: 1rem;
    margin-bottom: 2rem;
    padding: 0 1rem;
    flex-wrap: wrap;
}

.search-box[b-avm6pygelc] {
    flex: 1;
    min-width: 300px;
    position: relative;
}

.search-box i[b-avm6pygelc] {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box .form-control[b-avm6pygelc] {
    padding-left: 2.5rem;
}

.filter-group[b-avm6pygelc] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.filter-group label[b-avm6pygelc] {
    margin: 0;
    white-space: nowrap;
    font-weight: 500;
}

.filter-group .form-select[b-avm6pygelc] {
    min-width: 200px;
}

.brand-count[b-avm6pygelc] {
    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-avm6pygelc] {
    font-size: 1.25rem;
}

.loading-container[b-avm6pygelc] {
    text-align: center;
    padding: 4rem 2rem;
    color: #6c757d;
}

.loading-container .spinner-border[b-avm6pygelc] {
    width: 3rem;
    height: 3rem;
    margin-bottom: 1rem;
}

.no-results[b-avm6pygelc] {
    text-align: center;
    padding: 4rem 2rem;
    color: #6c757d;
}

.no-results i[b-avm6pygelc] {
    font-size: 4rem;
    margin-bottom: 1rem;
    opacity: 0.5;
}

.no-results h3[b-avm6pygelc] {
    margin-bottom: 0.5rem;
}

.brands-grid[b-avm6pygelc] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 1.5rem;
    padding: 0 1rem 2rem 1rem;
}

.brand-card[b-avm6pygelc] {
    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-avm6pygelc] {
    transform: translateY(-4px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
    border-color: #0066cc;
}

.brand-image[b-avm6pygelc] {
    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-avm6pygelc] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

.placeholder-image[b-avm6pygelc] {
    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-avm6pygelc] {
    font-size: 4rem;
    opacity: 0.5;
}

.brand-content[b-avm6pygelc] {
    padding: 1.5rem;
}

.brand-name[b-avm6pygelc] {
    margin: 0 0 1.25rem 0;
    font-size: 1.375rem;
    font-weight: 700;
    color: #2c3e50;
}

.brand-info[b-avm6pygelc] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.info-item[b-avm6pygelc] {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
}

.info-item > i[b-avm6pygelc] {
    flex-shrink: 0;
    width: 1.25rem;
    text-align: center;
    color: #0066cc;
    font-size: 1.125rem;
    margin-top: 0.125rem;
}

.info-text[b-avm6pygelc] {
    flex: 1;
    line-height: 1.6;
}

.info-text strong[b-avm6pygelc] {
    color: #2c3e50;
}

.info-text a[b-avm6pygelc] {
    color: #0066cc;
    text-decoration: none;
    transition: color 0.2s ease;
}

.info-text a:hover[b-avm6pygelc] {
    color: #0052a3;
    text-decoration: underline;
}

.province-badge[b-avm6pygelc] {
    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-avm6pygelc] {
    text-decoration: none;
    color: inherit;
    display: block;
}

.brand-card-link:hover[b-avm6pygelc] {
    text-decoration: none;
}

.view-products-hint[b-avm6pygelc] {
    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-avm6pygelc] {
    background-color: #0066cc;
    color: white;
    transform: scale(1.05);
}

.view-products-hint i[b-avm6pygelc] {
    font-size: 1.1rem;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-header h1[b-avm6pygelc] {
        font-size: 2rem;
    }

    .page-header .header-icon[b-avm6pygelc] {
        font-size: 2.5rem;
    }

    .brands-grid[b-avm6pygelc] {
        grid-template-columns: 1fr;
        padding: 0 0.5rem 1rem 0.5rem;
    }

    .brand-controls[b-avm6pygelc] {
        flex-direction: column;
        padding: 0 0.5rem;
    }

    .search-box[b-avm6pygelc] {
        min-width: 100%;
    }

    .filter-group[b-avm6pygelc] {
        width: 100%;
    }

    .filter-group .form-select[b-avm6pygelc] {
        flex: 1;
    }

    .brand-count[b-avm6pygelc] {
        margin: 0 0.5rem 1rem 0.5rem;
    }
}

@media (max-width: 480px) {
    .page-header[b-avm6pygelc] {
        padding: 2rem 1rem;
        margin: -2rem -1rem 1.5rem -1rem;
    }

    .brand-content[b-avm6pygelc] {
        padding: 1rem;
    }

    .brand-name[b-avm6pygelc] {
        font-size: 1.25rem;
    }
}
/* /Components/Pages/Cart.razor.rz.scp.css */
.cart-page[b-cm6kbcnmqo] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
}

.cart-page h1[b-cm6kbcnmqo] {
    color: #2c3e50;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.credit-banner[b-cm6kbcnmqo] {
    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-cm6kbcnmqo] {
    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-cm6kbcnmqo] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-cm6kbcnmqo] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

.empty-cart[b-cm6kbcnmqo] {
    text-align: center;
    padding: 6rem 0;
    color: #6c757d;
}

.order-confirmed[b-cm6kbcnmqo] {
    text-align: center;
    padding: 6rem 0;
    color: #198754;
}

.order-confirmed i[b-cm6kbcnmqo] {
    font-size: 5rem;
    margin-bottom: 1rem;
    display: block;
}

.order-confirmed h2[b-cm6kbcnmqo] {
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.empty-cart i[b-cm6kbcnmqo] {
    font-size: 5rem;
    margin-bottom: 1rem;
    opacity: 0.4;
    display: block;
}

.empty-cart h2[b-cm6kbcnmqo] {
    color: #495057;
    margin-bottom: 0.5rem;
}

.empty-cart p[b-cm6kbcnmqo] {
    margin-bottom: 1.5rem;
}

.cart-content[b-cm6kbcnmqo] {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 2rem;
    align-items: start;
}

.cart-main[b-cm6kbcnmqo] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.quick-add-section[b-cm6kbcnmqo] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
}

.quick-add-section h5[b-cm6kbcnmqo] {
    font-size: 1rem;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 0.75rem;
}

.cart-items[b-cm6kbcnmqo] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.cart-item[b-cm6kbcnmqo] {
    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-cm6kbcnmqo] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.cart-item-image[b-cm6kbcnmqo] {
    width: 80px;
    height: 80px;
    border-radius: 8px;
    overflow: hidden;
    background: #f8f9fa;
}

.cart-item-image img[b-cm6kbcnmqo] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.image-placeholder[b-cm6kbcnmqo] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: #dee2e6;
}

.cart-item-details[b-cm6kbcnmqo] {
    min-width: 0;
}

.cart-item-brand[b-cm6kbcnmqo] {
    color: #0d6efd;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.cart-item-name[b-cm6kbcnmqo] {
    font-size: 1rem;
    font-weight: 600;
    color: #2c3e50;
    margin: 0.25rem 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cart-item-size[b-cm6kbcnmqo] {
    color: #6c757d;
    font-size: 0.85rem;
}

.cart-item-quantity[b-cm6kbcnmqo] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.qty-btn[b-cm6kbcnmqo] {
    width: 32px;
    height: 32px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
}

.qty-input[b-cm6kbcnmqo] {
    width: 52px;
    height: 32px;
    text-align: center;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    font-size: 0.9rem;
}

.qty-input:focus[b-cm6kbcnmqo] {
    outline: none;
    border-color: #0d6efd;
    box-shadow: 0 0 0 2px rgba(13, 110, 253, 0.15);
}

.cart-item-price[b-cm6kbcnmqo] {
    text-align: right;
    min-width: 120px;
}

.unit-price[b-cm6kbcnmqo] {
    display: block;
    color: #6c757d;
    font-size: 0.8rem;
}

.line-total[b-cm6kbcnmqo] {
    display: block;
    font-size: 1.1rem;
    font-weight: 700;
    color: #28a745;
}

.cart-item-actions[b-cm6kbcnmqo] {
    display: flex;
    align-items: center;
}

.cart-summary[b-cm6kbcnmqo] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    padding: 1.5rem;
    position: sticky;
    top: 2rem;
}

.cart-summary h3[b-cm6kbcnmqo] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 1.25rem;
}

.summary-line[b-cm6kbcnmqo] {
    display: flex;
    justify-content: space-between;
    padding: 0.5rem 0;
    color: #495057;
}

.summary-divider[b-cm6kbcnmqo] {
    border-top: 2px solid #e9ecef;
    margin: 0.75rem 0;
}

.summary-total[b-cm6kbcnmqo] {
    display: flex;
    justify-content: space-between;
    padding: 0.5rem 0;
    font-size: 1.25rem;
    font-weight: 700;
    color: #2c3e50;
}

.cart-actions[b-cm6kbcnmqo] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 1.5rem;
}

.overdue-notice[b-cm6kbcnmqo] {
    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-cm6kbcnmqo] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.credit-facility-line[b-cm6kbcnmqo] {
    display: flex;
    justify-content: space-between;
    padding: 0.3rem 0;
    font-size: 0.88rem;
    color: #6c757d;
}

.credit-facility-line.credit-available[b-cm6kbcnmqo] {
    font-weight: 600;
    color: #2c3e50;
}

.cart-actions .btn[b-cm6kbcnmqo] {
    width: 100%;
}

@media (max-width: 992px) {
    .cart-content[b-cm6kbcnmqo] {
        grid-template-columns: 1fr;
    }

    .cart-summary[b-cm6kbcnmqo] {
        position: static;
    }
}
@media (max-width: 768px) {
    .cart-page[b-cm6kbcnmqo] {
        padding: 1rem;
    }

    .cart-item[b-cm6kbcnmqo] {
        grid-template-columns: 60px 1fr;
        gap: 0.75rem;
    }

    .cart-item-quantity[b-cm6kbcnmqo],
    .cart-item-price[b-cm6kbcnmqo],
    .cart-item-actions[b-cm6kbcnmqo] {
        grid-column: 2;
    }

    .cart-item-image[b-cm6kbcnmqo] {
        width: 60px;
        height: 60px;
    }
}
/* /Components/Pages/CasualWorkers.razor.rz.scp.css */
/* Page layout */
.cw-page[b-iuk3ahi4lb] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-iuk3ahi4lb] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.cw-header[b-iuk3ahi4lb] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.cw-header-top[b-iuk3ahi4lb] {
    display: flex;
    align-items: center;
}

.cw-header-row[b-iuk3ahi4lb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.back-link[b-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    text-decoration: underline;
}

.cw-header h1[b-iuk3ahi4lb] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.btn-add[b-iuk3ahi4lb] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Card */
.cw-card[b-iuk3ahi4lb] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-iuk3ahi4lb] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.cw-table-wrapper[b-iuk3ahi4lb] {
    overflow-x: auto;
}

.cw-table[b-iuk3ahi4lb] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.cw-table thead tr[b-iuk3ahi4lb] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.cw-table th[b-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.cw-table tbody tr:last-child td[b-iuk3ahi4lb] {
    border-bottom: none;
}

.cw-table tbody tr:hover[b-iuk3ahi4lb] {
    background: #f8f9fa;
}

.cw-table tfoot tr[b-iuk3ahi4lb] {
    background: var(--background-color);
    border-top: 2px solid var(--border-color);
}

.cw-table tfoot td[b-iuk3ahi4lb] {
    padding: 0.75rem 1rem;
    border-bottom: none;
}

.col-right[b-iuk3ahi4lb] {
    text-align: right !important;
}

.col-center[b-iuk3ahi4lb] {
    text-align: center !important;
}

.col-check[b-iuk3ahi4lb] {
    width: 40px;
}

.col-desc[b-iuk3ahi4lb] {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tabnum[b-iuk3ahi4lb] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.fw-600[b-iuk3ahi4lb] {
    font-weight: 600;
}

.row-inactive[b-iuk3ahi4lb] {
    opacity: 0.5;
}

.row-paid[b-iuk3ahi4lb] {
    background: #f8fdf8;
}

/* Name link button */
.btn-link-name[b-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    text-decoration: underline;
}

/* Badge - payment method */
.badge-method[b-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    background: #fff3cd;
    color: #856404;
}

.badge-method--eft[b-iuk3ahi4lb] {
    background: #d1ecf1;
    color: #0c5460;
}

/* Badge - outstanding documents */
.badge-docs-pending[b-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    background: #d4edda;
    color: #155724;
}

.badge-status--unpaid[b-iuk3ahi4lb] {
    background: #fce4e4;
    color: #9b2c2c;
}

.slip-link[b-iuk3ahi4lb] {
    display: inline-flex;
    align-items: center;
    margin-left: 0.4rem;
    color: var(--primary-color);
    font-size: 0.85rem;
}

.slip-link:hover[b-iuk3ahi4lb] {
    color: #0056b3;
}

.slip-link--unsigned[b-iuk3ahi4lb] {
    color: #e6a817;
}

.slip-link--unsigned:hover[b-iuk3ahi4lb] {
    color: #c8880c;
}

.doc-action[b-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    color: #b8b8b8;
}

.doc-action--delete:hover[b-iuk3ahi4lb] {
    color: #dc3545;
}

.doc-action--upload[b-iuk3ahi4lb] {
    color: #6c757d;
    margin-left: 0.35rem;
}

.doc-action--upload:hover[b-iuk3ahi4lb] {
    color: var(--primary-color);
}

/* Detail header */
.cw-detail-header[b-iuk3ahi4lb] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.cw-detail-header h2[b-iuk3ahi4lb] {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 700;
    color: #2c3e50;
}

.detail-rate[b-iuk3ahi4lb] {
    font-size: 0.9rem;
    color: var(--secondary-color);
    font-weight: 500;
}

.cw-bank-info[b-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.hours-summary-row td[b-iuk3ahi4lb] {
    font-size: 0.85rem;
    color: #2c3e50;
}

/* Toggle switch */
.toggle-switch[b-iuk3ahi4lb] {
    position: relative;
    display: inline-block;
    width: 36px;
    height: 20px;
    cursor: pointer;
    margin: 0;
}

.toggle-switch input[b-iuk3ahi4lb] {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider[b-iuk3ahi4lb] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #ccc;
    border-radius: 20px;
    transition: background 0.2s ease;
}

.toggle-slider[b-iuk3ahi4lb]::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-iuk3ahi4lb] {
    background: #28a745;
}

.toggle-switch input:checked + .toggle-slider[b-iuk3ahi4lb]::before {
    transform: translateX(16px);
}

/* ──────────── Modals ──────────── */

.cw-modal-backdrop[b-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    max-width: 440px;
}

.cw-modal-header[b-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.cw-modal-close[b-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    background: #f0f0f0;
    color: #2c3e50;
}

.cw-modal-body[b-iuk3ahi4lb] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.cw-modal-footer[b-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-iuk3ahi4lb] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #2c3e50;
}

.form-row-2col[b-iuk3ahi4lb] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.required[b-iuk3ahi4lb] {
    color: #dc3545;
}

.field-error[b-iuk3ahi4lb] {
    font-size: 0.8rem;
    color: #dc3545;
}

.bank-section[b-iuk3ahi4lb] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid var(--border-color);
}

.bank-section-title[b-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    display: flex;
    align-items: stretch;
}

.input-prefix[b-iuk3ahi4lb] {
    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-iuk3ahi4lb] {
    border-radius: 0 6px 6px 0;
    flex: 1;
    min-width: 0;
}

/* Responsive */
@media (max-width: 768px) {
    .cw-page[b-iuk3ahi4lb] {
        padding: 1rem;
    }

    .form-row-2col[b-iuk3ahi4lb] {
        grid-template-columns: 1fr;
    }

    .cw-modal[b-iuk3ahi4lb] {
        max-width: 100%;
    }

    .cw-detail-header[b-iuk3ahi4lb] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* /Components/Pages/ChangePassword.razor.rz.scp.css */
.change-password-page[b-r8dflemtjt] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 2rem;
}

.change-password-card[b-r8dflemtjt] {
    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-r8dflemtjt] {
    font-size: 3rem;
    color: var(--primary, #0d6efd);
    margin-bottom: 1rem;
}

.change-password-card h1[b-r8dflemtjt] {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.change-password-subtitle[b-r8dflemtjt] {
    color: var(--text-muted, #6c757d);
    margin-bottom: 1.75rem;
    font-size: 0.95rem;
}

.change-password-card .form-group[b-r8dflemtjt] {
    text-align: left;
    margin-bottom: 1rem;
}

.change-password-card .form-group label[b-r8dflemtjt] {
    display: block;
    font-weight: 500;
    margin-bottom: 0.35rem;
    font-size: 0.9rem;
}

.change-password-card .form-control[b-r8dflemtjt] {
    width: 100%;
}

.btn-change[b-r8dflemtjt] {
    width: 100%;
    margin-top: 1rem;
    padding: 0.6rem;
}
/* /Components/Pages/CreateCreditNote.razor.rz.scp.css */
.create-cn-page[b-8y2o9525f9] {
    max-width: 860px;
    margin: 0 auto;
    padding: 0;
}

/* Loading */
.loading-container[b-8y2o9525f9] {
    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-8y2o9525f9] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-8y2o9525f9] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Page Header */
.page-header[b-8y2o9525f9] {
    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-8y2o9525f9] {
    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-8y2o9525f9] {
    background: rgba(255, 255, 255, 0.25);
}

.header-icon[b-8y2o9525f9] {
    font-size: 2.5rem;
    opacity: 0.9;
    flex-shrink: 0;
}

.page-header .header-text[b-8y2o9525f9] {
    flex: 1;
}

.page-header h1[b-8y2o9525f9] {
    margin: 0 0 0.2rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: white;
}

.page-header p[b-8y2o9525f9] {
    margin: 0;
    opacity: 0.85;
    font-size: 0.95rem;
}

/* Form cards */
.form-card[b-8y2o9525f9] {
    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-8y2o9525f9] {
    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-8y2o9525f9] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-row--three[b-8y2o9525f9] {
    grid-template-columns: 1fr 1fr 1fr;
}

.form-group[b-8y2o9525f9] {
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
}

.form-group label[b-8y2o9525f9] {
    font-weight: 500;
    margin-bottom: 0.4rem;
    font-size: 0.9rem;
    color: #495057;
}

.required[b-8y2o9525f9] {
    color: #dc3545;
}

.optional[b-8y2o9525f9] {
    color: #6c757d;
    font-weight: 400;
    font-size: 0.8rem;
}

.field-error[b-8y2o9525f9] {
    color: #dc3545;
    font-size: 0.825rem;
    margin-top: 0.3rem;
}

/* Currency input */
.input-prefix-group[b-8y2o9525f9] {
    display: flex;
    align-items: stretch;
}

.input-prefix[b-8y2o9525f9] {
    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-8y2o9525f9] {
    border-radius: 0 0.375rem 0.375rem 0;
}

/* Total display */
.total-display[b-8y2o9525f9] {
    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-8y2o9525f9] {
    font-size: 0.9rem;
    color: #6c757d;
    font-weight: 500;
}

.total-value[b-8y2o9525f9] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
    font-variant-numeric: tabular-nums;
}

/* Reason textarea */
.reason-textarea[b-8y2o9525f9] {
    resize: vertical;
    min-height: 6rem;
}

.char-count[b-8y2o9525f9] {
    font-size: 0.8rem;
    color: #6c757d;
    text-align: right;
    margin-top: 0.25rem;
}

/* Actions */
.form-actions[b-8y2o9525f9] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-bottom: 2rem;
}

.btn-submit[b-8y2o9525f9] {
    padding: 0.6rem 1.75rem;
    font-size: 1rem;
    font-weight: 600;
}

/* Success panel */
.success-panel[b-8y2o9525f9] {
    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-8y2o9525f9] {
    font-size: 4rem;
    color: #198754;
    margin-bottom: 1rem;
}

.success-panel h2[b-8y2o9525f9] {
    margin: 0 0 0.75rem;
    font-size: 1.5rem;
    font-weight: 700;
}

.success-panel p[b-8y2o9525f9] {
    color: #495057;
    margin-bottom: 0;
}

.success-actions[b-8y2o9525f9] {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 1.75rem;
}

/* Invoice autocomplete */
.autocomplete-wrapper[b-8y2o9525f9] {
    position: relative;
}

.autocomplete-dropdown[b-8y2o9525f9] {
    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-8y2o9525f9] {
    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-8y2o9525f9] {
    background: #f0f4ff;
    color: var(--primary-color);
}

.autocomplete-dropdown li.autocomplete-empty[b-8y2o9525f9] {
    color: #6c757d;
    cursor: default;
    font-style: italic;
}

/* Responsive */
@media (max-width: 700px) {
    .form-row[b-8y2o9525f9],
    .form-row--three[b-8y2o9525f9] {
        grid-template-columns: 1fr;
    }

    .form-actions[b-8y2o9525f9] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-8y2o9525f9] {
        width: 100%;
    }
}
/* /Components/Pages/CreditNotesList.razor.rz.scp.css */
/* Page layout */
.cn-list-page[b-3gvbw7nvyv] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-3gvbw7nvyv] {
    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-3gvbw7nvyv] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-3gvbw7nvyv] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Error */
.list-error[b-3gvbw7nvyv] {
    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-3gvbw7nvyv] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}

/* Header */
.cn-list-header[b-3gvbw7nvyv] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.back-link[b-3gvbw7nvyv] {
    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-3gvbw7nvyv] {
    text-decoration: underline;
}

.cn-list-header h1[b-3gvbw7nvyv] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

/* Card */
.cn-list-card[b-3gvbw7nvyv] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-3gvbw7nvyv] {
    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-3gvbw7nvyv] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-3gvbw7nvyv] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.cn-table-wrapper[b-3gvbw7nvyv] {
    overflow-x: auto;
}

.cn-table[b-3gvbw7nvyv] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.cn-table thead tr[b-3gvbw7nvyv] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.cn-table th[b-3gvbw7nvyv] {
    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-3gvbw7nvyv] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.cn-table tbody tr:last-child td[b-3gvbw7nvyv] {
    border-bottom: none;
}

.cn-table tbody tr:hover[b-3gvbw7nvyv] {
    background: #f8f9fa;
}

.cn-number[b-3gvbw7nvyv] {
    font-weight: 600;
    font-family: monospace;
    font-size: 0.875rem;
}

.cn-amount[b-3gvbw7nvyv] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.cn-available-positive[b-3gvbw7nvyv] {
    color: #0a6640;
    font-weight: 600;
}

.col-right[b-3gvbw7nvyv] {
    text-align: right !important;
}

.col-center[b-3gvbw7nvyv] {
    text-align: center !important;
}

/* Status badges */
.cn-status-badge[b-3gvbw7nvyv] {
    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-3gvbw7nvyv] {
    background: #e7f1ff;
    color: var(--primary-color);
}

.cn-status-badge--partial[b-3gvbw7nvyv] {
    background: #fff3cd;
    color: #856404;
}

.cn-status-badge--applied[b-3gvbw7nvyv] {
    background: #d1f0e0;
    color: #0a6640;
}

.cn-status-badge--cancelled[b-3gvbw7nvyv] {
    background: #f8d7da;
    color: #842029;
}

.cn-status-badge--expired[b-3gvbw7nvyv] {
    background: #e9ecef;
    color: #6c757d;
}

/* Document button */
.cn-document-btn[b-3gvbw7nvyv] {
    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-3gvbw7nvyv] {
    background: #fdecea;
    color: #922b21;
}

/* Pager */
.cn-pager[b-3gvbw7nvyv] {
    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-3gvbw7nvyv] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.cn-pager-controls[b-3gvbw7nvyv] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.cn-pager-current[b-3gvbw7nvyv] {
    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-dp41h52hbh] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-dp41h52hbh] {
    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-dp41h52hbh] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-dp41h52hbh] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.customer-accounts-header[b-dp41h52hbh] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.customer-accounts-header-top[b-dp41h52hbh] {
    display: flex;
    align-items: center;
}

.customer-accounts-header h1[b-dp41h52hbh] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

/* Customer search */
.customer-search-wrapper[b-dp41h52hbh] {
    position: relative;
    max-width: 500px;
}

.customer-search-dropdown[b-dp41h52hbh] {
    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-dp41h52hbh] {
    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-dp41h52hbh] {
    border-bottom: none;
}

.customer-search-item:hover[b-dp41h52hbh] {
    background: #f8f9fa;
}

.customer-search-item i[b-dp41h52hbh] {
    font-size: 1.1rem;
    color: var(--primary-color);
}

.customer-search-name[b-dp41h52hbh] {
    font-size: 0.95rem;
    font-weight: 500;
    color: #2c3e50;
}

.customer-search-no-results[b-dp41h52hbh] {
    padding: 0.75rem 1rem;
    color: #6c757d;
    font-size: 0.9rem;
    text-align: center;
}

/* Customer info banner */
.customer-info-banner[b-dp41h52hbh] {
    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-dp41h52hbh] {
    margin: 0 0 0.25rem;
    font-size: 1.5rem;
    font-weight: 700;
    color: white;
}

.customer-registered-name[b-dp41h52hbh] {
    font-size: 0.9rem;
    opacity: 0.8;
    display: block;
    margin-bottom: 0.5rem;
}

.customer-info-badges[b-dp41h52hbh] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.badge-pill[b-dp41h52hbh] {
    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-dp41h52hbh] {
    background: rgba(255, 255, 255, 0.2);
    color: white;
}

.badge-active[b-dp41h52hbh] {
    background: #d4edda;
    color: #155724;
}

.badge-inactive[b-dp41h52hbh] {
    background: #f8d7da;
    color: #721c24;
}

.customer-info-right[b-dp41h52hbh] {
    display: flex;
    gap: 2rem;
    flex-wrap: wrap;
}

.info-item[b-dp41h52hbh] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.info-label[b-dp41h52hbh] {
    font-size: 0.75rem;
    opacity: 0.8;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.info-value[b-dp41h52hbh] {
    font-size: 1.25rem;
    font-weight: 700;
}

/* Summary cards */
.summary-grid[b-dp41h52hbh] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1rem;
}

.summary-card[b-dp41h52hbh] {
    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-dp41h52hbh] {
    font-size: 0.8rem;
    color: #6c757d;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.summary-value[b-dp41h52hbh] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #2c3e50;
}

.summary-value--success[b-dp41h52hbh] {
    color: #28a745;
}

.summary-value--warning[b-dp41h52hbh] {
    color: #856404;
}

.summary-value--danger[b-dp41h52hbh] {
    color: #b91c1c;
}

.summary-value--info[b-dp41h52hbh] {
    color: var(--primary-color);
}

/* Section cards */
.section-card[b-dp41h52hbh] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 1.5rem;
}

.section-card h3[b-dp41h52hbh] {
    margin: 0 0 1rem;
    font-size: 1.1rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.section-card h3 i[b-dp41h52hbh] {
    color: var(--primary-color);
}

.empty-message[b-dp41h52hbh] {
    color: #6c757d;
    font-size: 0.9rem;
    text-align: center;
    padding: 1rem 0;
    margin: 0;
}

/* Aging analysis */
.aging-grid[b-dp41h52hbh] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
}

.aging-bucket[b-dp41h52hbh] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    padding: 1rem;
    border-radius: 8px;
    background: #f8f9fa;
    text-align: center;
}

.aging-label[b-dp41h52hbh] {
    font-size: 0.8rem;
    color: #6c757d;
    font-weight: 500;
}

.aging-value[b-dp41h52hbh] {
    font-size: 1.2rem;
    font-weight: 700;
}

.aging-current[b-dp41h52hbh] {
    color: #28a745;
}

.aging-30[b-dp41h52hbh] {
    color: #856404;
}

.aging-60[b-dp41h52hbh] {
    color: #e67e22;
}

.aging-90[b-dp41h52hbh] {
    color: #b91c1c;
}

/* Data tables */
.table-responsive[b-dp41h52hbh] {
    overflow-x: auto;
}

.data-table[b-dp41h52hbh] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.data-table thead th[b-dp41h52hbh] {
    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-dp41h52hbh] {
    padding: 0.6rem 0.75rem;
    border-bottom: 1px solid #f1f3f5;
    color: #2c3e50;
}

.data-table tbody tr:hover[b-dp41h52hbh] {
    background: #f8f9fa;
}

.row-overdue[b-dp41h52hbh] {
    background: #fff5f5;
}

.row-overdue:hover[b-dp41h52hbh] {
    background: #fee2e2 !important;
}

.font-mono[b-dp41h52hbh] {
    font-family: 'Cascadia Code', 'Consolas', monospace;
    font-size: 0.85rem;
}

.text-end[b-dp41h52hbh] {
    text-align: right;
}

/* Status badges */
.status-badge[b-dp41h52hbh] {
    display: inline-block;
    padding: 0.15rem 0.55rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
}

.status-paid[b-dp41h52hbh] {
    background: #d4edda;
    color: #155724;
}

.status-outstanding[b-dp41h52hbh] {
    background: #fff3cd;
    color: #856404;
}

.status-overdue[b-dp41h52hbh] {
    background: #fde8e8;
    color: #b91c1c;
}

.status-open[b-dp41h52hbh] {
    background: #e7f1ff;
    color: var(--primary-color);
}

.status-partiallyapplied[b-dp41h52hbh] {
    background: #fff3cd;
    color: #856404;
}

.status-fullyapplied[b-dp41h52hbh] {
    background: #d4edda;
    color: #155724;
}

.status-cancelled[b-dp41h52hbh] {
    background: #e2e3e5;
    color: #383d41;
}

.status-expired[b-dp41h52hbh] {
    background: #f8d7da;
    color: #721c24;
}

/* Document link */
.doc-link[b-dp41h52hbh] {
    color: var(--primary-color);
    font-size: 1.1rem;
    transition: color 0.2s;
}

.doc-link:hover[b-dp41h52hbh] {
    color: #004999;
}

/* Responsive */
@media (max-width: 992px) {
    .summary-grid[b-dp41h52hbh] {
        grid-template-columns: repeat(3, 1fr);
    }

    .aging-grid[b-dp41h52hbh] {
        grid-template-columns: repeat(2, 1fr);
    }

    .customer-info-banner[b-dp41h52hbh] {
        flex-direction: column;
    }

    .customer-info-right[b-dp41h52hbh] {
        align-items: flex-start;
    }

    .info-item[b-dp41h52hbh] {
        align-items: flex-start;
    }
}

@media (max-width: 640px) {
    .customer-accounts-page[b-dp41h52hbh] {
        padding: 1rem;
        gap: 1rem;
    }

    .summary-grid[b-dp41h52hbh] {
        grid-template-columns: repeat(2, 1fr);
    }

    .aging-grid[b-dp41h52hbh] {
        grid-template-columns: 1fr;
    }

    .customer-search-wrapper[b-dp41h52hbh] {
        max-width: 100%;
    }
}
/* /Components/Pages/CustomerCredit.razor.rz.scp.css */
.credits-page[b-4kmw2rq5sa] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* Loading */
.loading-container[b-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-4kmw2rq5sa] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Page Header */
.page-header[b-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.btn-back[b-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
    background: rgba(255, 255, 255, 0.25);
}

.page-header h1[b-4kmw2rq5sa] {
    margin: 0 0 0.2rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: white;
}

.page-header p[b-4kmw2rq5sa] {
    margin: 0;
    opacity: 0.85;
    font-size: 0.95rem;
}

.outstanding-badge[b-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
}

.btn-create[b-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
    background: #e7f1ff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

/* Summary Bar */
.summary-bar[b-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.summary-label[b-4kmw2rq5sa] {
    font-size: 0.85rem;
    color: var(--secondary-color);
    font-weight: 500;
}

.summary-value[b-4kmw2rq5sa] {
    font-size: 1.5rem;
    font-weight: 700;
}

.summary-value--warning[b-4kmw2rq5sa] {
    color: #856404;
}

.summary-value--primary[b-4kmw2rq5sa] {
    color: var(--primary-color);
}

.summary-divider[b-4kmw2rq5sa] {
    width: 1px;
    height: 3rem;
    background: var(--border-color);
    flex-shrink: 0;
}

/* Filter Bar */
.filter-bar[b-4kmw2rq5sa] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.filter-btn[b-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.filter-btn--active[b-4kmw2rq5sa] {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: white;
}

/* Empty State */
.empty-state[b-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
    font-size: 3rem;
    color: var(--secondary-color);
    opacity: 0.4;
}

.empty-state h2[b-4kmw2rq5sa] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #2c3e50;
}

.empty-state p[b-4kmw2rq5sa] {
    margin: 0;
    color: var(--secondary-color);
    font-size: 0.95rem;
}

/* Table */
.credits-table-wrapper[b-4kmw2rq5sa] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.credits-table[b-4kmw2rq5sa] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.credits-table thead tr[b-4kmw2rq5sa] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.credits-table th[b-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
    padding: 0.875rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.credits-table tbody tr:last-child td[b-4kmw2rq5sa] {
    border-bottom: none;
}

.credits-table tbody tr:hover[b-4kmw2rq5sa] {
    background: #f8f9fa;
}

.col-right[b-4kmw2rq5sa] {
    text-align: right !important;
}

.col-credit-number[b-4kmw2rq5sa] {
    font-weight: 600;
    font-family: monospace;
    font-size: 0.875rem;
}

.col-amount[b-4kmw2rq5sa] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.available-positive[b-4kmw2rq5sa] {
    color: #0a6640;
    font-weight: 600;
}

/* Status Badges */
.status-badge[b-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
    background: #e7f1ff;
    color: var(--primary-color);
}

.status-badge--partial[b-4kmw2rq5sa] {
    background: #fff3cd;
    color: #856404;
}

.status-badge--applied[b-4kmw2rq5sa] {
    background: #d1f0e0;
    color: #0a6640;
}

.status-badge--cancelled[b-4kmw2rq5sa] {
    background: #f8d7da;
    color: #842029;
}

.status-badge--expired[b-4kmw2rq5sa] {
    background: #e9ecef;
    color: #6c757d;
}

.col-center[b-4kmw2rq5sa] {
    text-align: center !important;
}

/* Reason Icon Button */
.btn-reason[b-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
    background: #e7f1ff;
    color: #003a7a;
}

.btn-document[b-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
    background: #fdecea;
    color: #922b21;
}

/* Reason Popup Overlay */
.reason-overlay[b-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
    color: var(--primary-color);
    margin-right: 0.4rem;
}

.reason-popup-close[b-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
    background: #f1f3f5;
    color: #2c3e50;
}

.reason-popup-body[b-4kmw2rq5sa] {
    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-4kmw2rq5sa] {
        padding: 1rem;
        gap: 1.25rem;
    }

    .credits-table-wrapper[b-4kmw2rq5sa] {
        overflow-x: auto;
    }

    .summary-bar[b-4kmw2rq5sa] {
        flex-wrap: wrap;
        gap: 1rem;
    }
}
/* /Components/Pages/CustomerDashboard.razor.rz.scp.css */
.dashboard-page[b-ib7uhj951p] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* Loading & Error */
.loading-container[b-ib7uhj951p] {
    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-ib7uhj951p] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-ib7uhj951p] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

.dashboard-error[b-ib7uhj951p] {
    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-ib7uhj951p] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}

/* Welcome Banner */
.dashboard-welcome[b-ib7uhj951p] {
    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-ib7uhj951p] {
    margin: 0 0 0.25rem;
    font-size: 2rem;
    font-weight: 700;
    color: white;
}

.welcome-text p[b-ib7uhj951p] {
    margin: 0;
    opacity: 0.85;
    font-size: 1rem;
}

.welcome-actions .btn[b-ib7uhj951p] {
    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-ib7uhj951p] {
    background: #f0f4ff;
}

/* No account alert */
.no-account-alert[b-ib7uhj951p] {
    border-radius: 10px;
    font-size: 0.95rem;
}

/* Card grid */
.dashboard-grid[b-ib7uhj951p] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

/* Cards */
.dashboard-card[b-ib7uhj951p] {
    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-ib7uhj951p] {
    cursor: pointer;
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.dashboard-card--clickable:hover[b-ib7uhj951p] {
    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-ib7uhj951p] {
    background: #e7f1ff;
}

.dashboard-card--clickable:hover .card-header i[b-ib7uhj951p] {
    color: var(--primary-hover);
}

.card-header[b-ib7uhj951p] {
    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-ib7uhj951p] {
    font-size: 1.25rem;
    color: var(--primary-color);
}

.card-header h2[b-ib7uhj951p] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    color: #2c3e50;
}

.card-body[b-ib7uhj951p] {
    padding: 1.5rem;
}

/* Info list (dt/dd) */
.info-list[b-ib7uhj951p] {
    display: grid;
    grid-template-columns: 7rem 1fr;
    gap: 0.5rem 1rem;
    margin: 0;
}

.info-list dt[b-ib7uhj951p] {
    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-ib7uhj951p] {
    margin: 0;
    font-size: 0.95rem;
    color: var(--text-color);
    display: flex;
    align-items: center;
    word-break: break-word;
}

.info-list a[b-ib7uhj951p] {
    color: var(--primary-color);
    text-decoration: none;
}

.info-list a:hover[b-ib7uhj951p] {
    text-decoration: underline;
}

/* Type badge */
.type-badge[b-ib7uhj951p] {
    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-ib7uhj951p] {
    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-ib7uhj951p] {
    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-ib7uhj951p] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-ib7uhj951p] {
    margin: 0;
    font-size: 0.9rem;
}

/* Credit Notes summary card */
.cn-available-positive[b-ib7uhj951p] {
    color: #0a6640;
    font-weight: 600;
}

/* Quick Links */
.quick-links-card[b-ib7uhj951p] {
    width: 100%;
}

.quick-links-grid[b-ib7uhj951p] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 1rem;
}

.quick-link[b-ib7uhj951p] {
    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-ib7uhj951p] {
    font-size: 1.75rem;
    color: var(--primary-color);
}

.quick-link:hover[b-ib7uhj951p] {
    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-ib7uhj951p] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .dashboard-page[b-ib7uhj951p] {
        padding: 1rem;
        gap: 1.25rem;
    }

    .dashboard-welcome[b-ib7uhj951p] {
        flex-direction: column;
        align-items: flex-start;
        padding: 1.5rem;
    }

    .welcome-text h1[b-ib7uhj951p] {
        font-size: 1.5rem;
    }

    .dashboard-grid[b-ib7uhj951p] {
        grid-template-columns: 1fr;
    }

    .quick-links-grid[b-ib7uhj951p] {
        grid-template-columns: repeat(2, 1fr);
    }
}
/* /Components/Pages/CustomerOrderDetail.razor.rz.scp.css */
/* Page layout */
.order-detail-page[b-xk4vmsbvju] {
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-xk4vmsbvju] {
    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-xk4vmsbvju] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-xk4vmsbvju] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Error */
.detail-error[b-xk4vmsbvju] {
    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-xk4vmsbvju] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}

/* Header */
.order-detail-header[b-xk4vmsbvju] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.back-link[b-xk4vmsbvju] {
    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-xk4vmsbvju] {
    text-decoration: underline;
}

.order-detail-title-row[b-xk4vmsbvju] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.order-detail-title-row h1[b-xk4vmsbvju] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.order-id-badge[b-xk4vmsbvju] {
    font-family: monospace;
}

.order-placed-date[b-xk4vmsbvju] {
    margin: 0;
    font-size: 0.9rem;
    color: var(--secondary-color);
}

/* Cards */
.order-detail-body[b-xk4vmsbvju] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.order-detail-card[b-xk4vmsbvju] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 1.5rem;
}

.card-section-title[b-xk4vmsbvju] {
    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-xk4vmsbvju] {
    overflow-x: auto;
}

.order-items-table[b-xk4vmsbvju] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.order-items-table thead tr[b-xk4vmsbvju] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.order-items-table th[b-xk4vmsbvju] {
    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-xk4vmsbvju] {
    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-xk4vmsbvju] {
    border-bottom: none;
}

.col-right[b-xk4vmsbvju] {
    text-align: right !important;
}

/* Amounts */
.amounts-list[b-xk4vmsbvju] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin: 0;
    max-width: 360px;
    margin-left: auto;
}

.amounts-row[b-xk4vmsbvju] {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    color: #2c3e50;
}

.amounts-row dt[b-xk4vmsbvju] {
    font-weight: 400;
    color: var(--secondary-color);
}

.amounts-row dd[b-xk4vmsbvju] {
    margin: 0;
    font-variant-numeric: tabular-nums;
}

.amounts-row--total[b-xk4vmsbvju] {
    padding-top: 0.5rem;
    border-top: 2px solid var(--border-color);
    margin-top: 0.25rem;
}

.amounts-row--total dt[b-xk4vmsbvju],
.amounts-row--total dd[b-xk4vmsbvju] {
    font-weight: 700;
    font-size: 1rem;
    color: #2c3e50;
}

/* Invoice section */
.invoice-section[b-xk4vmsbvju] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.invoice-number[b-xk4vmsbvju] {
    font-family: monospace;
    font-weight: 600;
    font-size: 0.95rem;
    color: #2c3e50;
}

.invoice-download-btn[b-xk4vmsbvju] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

/* Cancel card */
.cancel-card[b-xk4vmsbvju] {
    border: 1px solid #f8d7da;
}

.cancel-description[b-xk4vmsbvju] {
    font-size: 0.9rem;
    color: var(--secondary-color);
    margin: 0 0 1rem 0;
}

.cancel-confirm-text[b-xk4vmsbvju] {
    font-size: 0.9rem;
    color: #2c3e50;
    margin: 0 0 1rem 0;
}

.cancel-confirm-actions[b-xk4vmsbvju] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.cancel-error[b-xk4vmsbvju] {
    font-size: 0.875rem;
    color: #dc3545;
}

/* Status badges */
.order-status-badge[b-xk4vmsbvju] {
    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-xk4vmsbvju] {
    background: #e7f1ff;
    color: var(--primary-color);
}

.order-status-badge--confirmed[b-xk4vmsbvju] {
    background: #fff3cd;
    color: #856404;
}

.order-status-badge--processing[b-xk4vmsbvju] {
    background: #fff3cd;
    color: #856404;
}

.order-status-badge--shipped[b-xk4vmsbvju] {
    background: #d1f0e0;
    color: #0a6640;
}

.order-status-badge--delivered[b-xk4vmsbvju] {
    background: #d1f0e0;
    color: #0a6640;
}

.order-status-badge--cancelled[b-xk4vmsbvju] {
    background: #f8d7da;
    color: #842029;
}
/* /Components/Pages/CustomerProfile.razor.rz.scp.css */
.customer-profile-page[b-r60hbzjitf] {
    max-width: 860px;
    margin: 0 auto;
    padding: 0;
}

/* Page header */
.page-header[b-r60hbzjitf] {
    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-r60hbzjitf] {
    font-size: 2.5rem;
    margin-bottom: 0.75rem;
    opacity: 0.9;
}

.page-header h1[b-r60hbzjitf] {
    margin: 0 0 0.4rem;
    font-size: 2rem;
    font-weight: 700;
}

.page-header .lead[b-r60hbzjitf] {
    margin: 0;
    opacity: 0.85;
    font-size: 1rem;
}

.back-link[b-r60hbzjitf] {
    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-r60hbzjitf] {
    color: white;
}

/* Loading */
.loading-container[b-r60hbzjitf] {
    display: flex;
    justify-content: center;
    padding: 4rem 0;
}

/* Form cards */
.form-card[b-r60hbzjitf] {
    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-r60hbzjitf] {
    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-r60hbzjitf] {
    color: #6c757d;
    font-size: 0.875rem;
    margin-top: -0.75rem;
    margin-bottom: 1.25rem;
}

/* Form layout */
.form-row[b-r60hbzjitf] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-group[b-r60hbzjitf] {
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
}

.form-group label[b-r60hbzjitf] {
    font-weight: 500;
    margin-bottom: 0.4rem;
    font-size: 0.9rem;
    color: #495057;
}

.form-group--narrow[b-r60hbzjitf] {
    max-width: 160px;
}

.required[b-r60hbzjitf] {
    color: #dc3545;
}

.optional[b-r60hbzjitf] {
    color: #6c757d;
    font-weight: 400;
    font-size: 0.8rem;
}

.field-error[b-r60hbzjitf] {
    color: #dc3545;
    font-size: 0.825rem;
    margin-top: 0.3rem;
}

/* Form actions */
.form-actions[b-r60hbzjitf] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 2rem;
}

.btn-save[b-r60hbzjitf] {
    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-r60hbzjitf] {
        grid-template-columns: 1fr;
    }

    .form-group--narrow[b-r60hbzjitf] {
        max-width: 100%;
    }

    .form-actions[b-r60hbzjitf] {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .form-actions .btn[b-r60hbzjitf] {
        text-align: center;
        justify-content: center;
    }
}
/* /Components/Pages/CustomerStatements.razor.rz.scp.css */
/* Page layout */
.statements-list-page[b-hozj0j44tl] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-hozj0j44tl] {
    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-hozj0j44tl] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-hozj0j44tl] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.statements-list-header[b-hozj0j44tl] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.statements-list-header-top[b-hozj0j44tl] {
    display: flex;
    align-items: center;
}

.statements-list-header h1[b-hozj0j44tl] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-hozj0j44tl] {
    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-hozj0j44tl] {
    text-decoration: underline;
}

/* Card */
.statements-list-card[b-hozj0j44tl] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-hozj0j44tl] {
    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-hozj0j44tl] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-hozj0j44tl] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.statements-table-wrapper[b-hozj0j44tl] {
    overflow-x: auto;
}

.statements-table[b-hozj0j44tl] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.statements-table thead tr[b-hozj0j44tl] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.statements-table th[b-hozj0j44tl] {
    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-hozj0j44tl] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.statements-table tbody tr:last-child td[b-hozj0j44tl] {
    border-bottom: none;
}

.statements-table tbody tr:hover[b-hozj0j44tl] {
    background: #f8f9fa;
}

.col-id[b-hozj0j44tl] {
    font-size: 0.8rem;
    color: var(--secondary-color);
    width: 3rem;
}

.col-date[b-hozj0j44tl] {
    white-space: nowrap;
    color: #495057;
}

.col-period[b-hozj0j44tl] {
    white-space: nowrap;
    color: #495057;
    font-size: 0.85rem;
}

.col-period-unknown[b-hozj0j44tl] {
    color: #ced4da;
}

/* Source badges */
.source-badge[b-hozj0j44tl] {
    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-hozj0j44tl] {
    background: #e7f1ff;
    color: var(--primary-color);
}

.source-badge--manual[b-hozj0j44tl] {
    background: #f3f0ff;
    color: #5b21b6;
}

/* Document link */
.doc-link[b-hozj0j44tl] {
    color: var(--primary-color);
    font-size: 1.15rem;
    transition: color 0.2s;
    text-decoration: none;
}

.doc-link:hover[b-hozj0j44tl] {
    color: #004999;
}

.doc-link-unavailable[b-hozj0j44tl] {
    font-size: 1.15rem;
    color: #ced4da;
    cursor: default;
}

/* Pager */
.statements-pager[b-hozj0j44tl] {
    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-hozj0j44tl] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.statements-pager-controls[b-hozj0j44tl] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.statements-pager-current[b-hozj0j44tl] {
    font-size: 0.85rem;
    color: var(--text-color);
    font-weight: 500;
    white-space: nowrap;
}

/* Responsive */
@media (max-width: 640px) {
    .statements-list-page[b-hozj0j44tl] {
        padding: 1rem;
        gap: 1rem;
    }
}

/* Title row */
.statements-list-title-row[b-hozj0j44tl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

/* Actions column */
.col-actions[b-hozj0j44tl] {
    width: 2.5rem;
    text-align: center;
}

.action-btn[b-hozj0j44tl] {
    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-hozj0j44tl] {
    color: var(--primary-color);
    background: #e7f1ff;
}

/* Email modal backdrop */
.email-modal-backdrop[b-hozj0j44tl] {
    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-hozj0j44tl] {
    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-hozj0j44tl] {
    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-hozj0j44tl] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #2c3e50;
}

.email-modal-close[b-hozj0j44tl] {
    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-hozj0j44tl] {
    color: #2c3e50;
    background: #f3f4f6;
}

.email-modal-body[b-hozj0j44tl] {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.email-modal-customer[b-hozj0j44tl] {
    margin: 0;
    font-weight: 600;
    font-size: 0.95rem;
    color: #2c3e50;
}

.email-modal-help[b-hozj0j44tl] {
    margin: 0;
    font-size: 0.82rem;
    color: var(--secondary-color);
}

.email-modal-no-users[b-hozj0j44tl] {
    margin: 0;
    font-size: 0.85rem;
    color: var(--secondary-color);
    font-style: italic;
}

.email-modal-recipients[b-hozj0j44tl] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 260px;
    overflow-y: auto;
}

.email-modal-recipient[b-hozj0j44tl] {
    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-hozj0j44tl] {
    background: #f8f9fa;
}

.email-modal-recipient input[type="checkbox"][b-hozj0j44tl] {
    margin: 0;
    flex-shrink: 0;
    cursor: pointer;
}

.email-modal-recipient-name[b-hozj0j44tl] {
    font-weight: 500;
    color: #2c3e50;
    white-space: nowrap;
}

.email-modal-recipient-email[b-hozj0j44tl] {
    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-hozj0j44tl] {
    padding: 0.5rem 0.75rem;
    background: #fff5f5;
    border: 1px solid #fca5a5;
    border-radius: 6px;
    color: #dc2626;
    font-size: 0.83rem;
}

.email-modal-success[b-hozj0j44tl] {
    padding: 0.5rem 0.75rem;
    background: #f0fdf4;
    border: 1px solid #86efac;
    border-radius: 6px;
    color: #16a34a;
    font-size: 0.83rem;
}

.email-modal-footer[b-hozj0j44tl] {
    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-hozj0j44tl] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px dashed var(--border-color);
}

.email-modal-extra-label[b-hozj0j44tl] {
    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-hozj0j44tl] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.email-modal-extra-input[b-hozj0j44tl] {
    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-hozj0j44tl] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.1);
}

.email-modal-extra-list[b-hozj0j44tl] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.email-modal-extra-tag[b-hozj0j44tl] {
    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-hozj0j44tl] {
    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-hozj0j44tl] {
    opacity: 1;
}
/* /Components/Pages/DealerApplicationForm.razor.rz.scp.css */
.dealer-app-page[b-reeyuozbw4] {
    max-width: 860px;
    margin: 0 auto;
    padding: 0;
}

.page-header[b-reeyuozbw4] {
    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-reeyuozbw4] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.9;
}

.page-header h1[b-reeyuozbw4] {
    margin: 0 0 0.5rem;
    font-size: 2.25rem;
    font-weight: 700;
}

.page-header .lead[b-reeyuozbw4] {
    margin: 0;
    opacity: 0.85;
    font-size: 1.1rem;
}

/* Form cards */
.form-card[b-reeyuozbw4] {
    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-reeyuozbw4] {
    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-reeyuozbw4] {
    color: #6c757d;
    font-size: 0.9rem;
    margin-top: -0.75rem;
    margin-bottom: 1.25rem;
}

/* Form layout */
.form-row[b-reeyuozbw4] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-group[b-reeyuozbw4] {
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
}

.form-group label[b-reeyuozbw4] {
    font-weight: 500;
    margin-bottom: 0.4rem;
    font-size: 0.9rem;
    color: #495057;
}

.form-group--narrow[b-reeyuozbw4] {
    max-width: 160px;
}

.required[b-reeyuozbw4] {
    color: #dc3545;
}

.optional[b-reeyuozbw4] {
    color: #6c757d;
    font-weight: 400;
    font-size: 0.8rem;
}

.field-error[b-reeyuozbw4] {
    color: #dc3545;
    font-size: 0.825rem;
    margin-top: 0.3rem;
}

/* Logo upload */
.logo-upload-area[b-reeyuozbw4] {
    border: 2px dashed #ced4da;
    border-radius: 0.5rem;
    transition: border-color 0.2s;
}

.logo-upload-area:hover[b-reeyuozbw4] {
    border-color: #2c3e50;
}

.logo-drop-label[b-reeyuozbw4] {
    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-reeyuozbw4] {
    font-size: 2rem;
    color: #adb5bd;
}

.logo-drop-label span[b-reeyuozbw4] {
    font-weight: 500;
    color: #495057;
}

.logo-drop-label small[b-reeyuozbw4] {
    font-size: 0.8rem;
}

.logo-file-input[b-reeyuozbw4] {
    display: none;
}

.logo-preview[b-reeyuozbw4] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1rem;
}

.logo-preview img[b-reeyuozbw4] {
    max-height: 80px;
    max-width: 200px;
    object-fit: contain;
    border-radius: 0.25rem;
    border: 1px solid #dee2e6;
}

.logo-remove[b-reeyuozbw4] {
    flex-shrink: 0;
}

/* T&C notice */
.tc-notice[b-reeyuozbw4] {
    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-reeyuozbw4] {
    color: #2c3e50;
    font-weight: 600;
    text-decoration: underline;
}

/* reCAPTCHA */
.recaptcha-container[b-reeyuozbw4] {
    margin: 0 0 1.5rem 0;
}

/* Submit button */
.form-actions[b-reeyuozbw4] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 2rem;
}

.btn-submit[b-reeyuozbw4] {
    padding: 0.65rem 2rem;
    font-size: 1rem;
    font-weight: 600;
}

/* Success panel */
.success-panel[b-reeyuozbw4] {
    background: #fff;
    border: 1px solid #d1e7dd;
    border-radius: 0.75rem;
    padding: 3rem 2rem;
    text-align: center;
    color: #0f5132;
    margin-bottom: 2rem;
}

.success-icon[b-reeyuozbw4] {
    font-size: 4rem;
    color: #198754;
    margin-bottom: 1rem;
}

.success-panel h2[b-reeyuozbw4] {
    margin-bottom: 0.75rem;
}

.success-panel .muted[b-reeyuozbw4] {
    color: #6c757d;
}

/* Responsive */
@media (max-width: 600px) {
    .form-row[b-reeyuozbw4] {
        grid-template-columns: 1fr;
    }

    .form-group--narrow[b-reeyuozbw4] {
        max-width: 100%;
    }
}
/* /Components/Pages/DealerApplications.razor.rz.scp.css */
.applications-page[b-fkm3eo98m0] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* Loading */
.loading-container[b-fkm3eo98m0] {
    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-fkm3eo98m0] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-fkm3eo98m0] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Page Header */
.page-header[b-fkm3eo98m0] {
    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-fkm3eo98m0] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.btn-back[b-fkm3eo98m0] {
    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-fkm3eo98m0] {
    background: rgba(255, 255, 255, 0.25);
}

.page-header h1[b-fkm3eo98m0] {
    margin: 0 0 0.2rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: white;
}

.page-header p[b-fkm3eo98m0] {
    margin: 0;
    opacity: 0.85;
    font-size: 0.95rem;
}

.pending-badge[b-fkm3eo98m0] {
    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-fkm3eo98m0] {
    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-fkm3eo98m0] {
    font-size: 3rem;
    color: #28a745;
    margin-bottom: 1rem;
}

.empty-state h2[b-fkm3eo98m0] {
    margin: 0 0 0.5rem;
    font-size: 1.4rem;
    color: #2c3e50;
}

.empty-state p[b-fkm3eo98m0] {
    margin: 0;
    color: var(--secondary-color);
}

/* Table */
.applications-table-wrapper[b-fkm3eo98m0] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow-x: auto;
}

.applications-table[b-fkm3eo98m0] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.applications-table thead th[b-fkm3eo98m0] {
    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-fkm3eo98m0] {
    border-bottom: 1px solid var(--border-color);
    transition: background 0.15s ease;
}

.row-clickable[b-fkm3eo98m0] {
    cursor: pointer;
}

.applications-table tbody tr:last-child[b-fkm3eo98m0] {
    border-bottom: none;
}

.applications-table tbody tr:hover[b-fkm3eo98m0] {
    background: #f8faff;
}

.col-review[b-fkm3eo98m0] {
    width: 2rem;
    text-align: right;
    white-space: nowrap;
}

.row-chevron[b-fkm3eo98m0] {
    font-size: 0.85rem;
    color: var(--secondary-color);
    opacity: 0.4;
    transition: opacity 0.15s ease;
}

.row-clickable:hover .row-chevron[b-fkm3eo98m0] {
    opacity: 1;
    color: var(--primary-color);
}

.applications-table td[b-fkm3eo98m0] {
    padding: 1rem 1.25rem;
    vertical-align: top;
    color: #2c3e50;
}

/* Column styles */
.col-date[b-fkm3eo98m0] {
    white-space: nowrap;
}

.date-value[b-fkm3eo98m0] {
    display: block;
    font-weight: 600;
}

.time-value[b-fkm3eo98m0] {
    display: block;
    font-size: 0.8rem;
    color: var(--secondary-color);
    margin-top: 0.1rem;
}

.col-trading-name[b-fkm3eo98m0] {
    min-width: 160px;
}

.trading-name[b-fkm3eo98m0] {
    display: block;
    font-weight: 600;
}

.registered-name[b-fkm3eo98m0] {
    display: block;
    font-size: 0.8rem;
    color: var(--secondary-color);
    margin-top: 0.1rem;
}

.col-email a[b-fkm3eo98m0],
.col-mobile a[b-fkm3eo98m0],
.col-web a[b-fkm3eo98m0] {
    color: var(--primary-color);
    text-decoration: none;
}

.col-email a:hover[b-fkm3eo98m0],
.col-mobile a:hover[b-fkm3eo98m0],
.col-web a:hover[b-fkm3eo98m0] {
    text-decoration: underline;
}

.col-web a[b-fkm3eo98m0] {
    max-width: 200px;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom;
}

.no-value[b-fkm3eo98m0] {
    color: var(--secondary-color);
}

/* Responsive */
@media (max-width: 768px) {
    .applications-page[b-fkm3eo98m0] {
        padding: 1rem;
        gap: 1.25rem;
    }

    .page-header[b-fkm3eo98m0] {
        padding: 1.5rem;
        flex-direction: column;
        align-items: flex-start;
    }

    .applications-table thead th[b-fkm3eo98m0],
    .applications-table td[b-fkm3eo98m0] {
        padding: 0.75rem 1rem;
    }
}
/* /Components/Pages/DealerApplicationView.razor.rz.scp.css */
.app-view-page[b-xop53sq9nz] {
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.page-header[b-xop53sq9nz] {
    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-xop53sq9nz] {
    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-xop53sq9nz] {
    background: rgba(255, 255, 255, 0.28);
}

.page-header .header-icon[b-xop53sq9nz] {
    font-size: 2.5rem;
    opacity: 0.9;
    flex-shrink: 0;
}

.page-header .header-text[b-xop53sq9nz] {
    flex: 1;
}

.page-header h1[b-xop53sq9nz] {
    margin: 0 0 0.25rem;
    font-size: 1.75rem;
    font-weight: 700;
}

.page-header .lead[b-xop53sq9nz] {
    margin: 0;
    opacity: 0.85;
    font-size: 1rem;
}

/* Status badge */
.status-badge[b-xop53sq9nz] {
    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-xop53sq9nz] {
    background: #fff3cd;
    color: #856404;
}

.status-approved[b-xop53sq9nz] {
    background: #d1e7dd;
    color: #0f5132;
}

.status-rejected[b-xop53sq9nz] {
    background: #f8d7da;
    color: #842029;
}

/* Grid layout */
.view-grid[b-xop53sq9nz] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.view-card[b-xop53sq9nz] {
    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-xop53sq9nz] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 1rem;
    padding-bottom: 0.65rem;
    border-bottom: 2px solid #e9ecef;
}

.shop-logo[b-xop53sq9nz] {
    margin-bottom: 1rem;
}

.shop-logo img[b-xop53sq9nz] {
    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-xop53sq9nz] {
    margin: 0;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.4rem 1rem;
    align-items: baseline;
}

.detail-list dt[b-xop53sq9nz] {
    font-weight: 600;
    color: #495057;
    font-size: 0.85rem;
    white-space: nowrap;
}

.detail-list dd[b-xop53sq9nz] {
    margin: 0;
    color: #212529;
    word-break: break-word;
}

/* Not found */
.not-found-panel[b-xop53sq9nz] {
    text-align: center;
    padding: 4rem 2rem;
    color: #6c757d;
}

.not-found-panel i[b-xop53sq9nz] {
    font-size: 3rem;
    margin-bottom: 1rem;
    display: block;
}

/* Loading */
.loading-container[b-xop53sq9nz] {
    text-align: center;
    padding: 4rem 2rem;
    color: #6c757d;
}

@media (max-width: 700px) {
    .view-grid[b-xop53sq9nz] {
        grid-template-columns: 1fr;
    }

    .page-header[b-xop53sq9nz] {
        flex-direction: column;
        text-align: center;
    }

    .review-actions[b-xop53sq9nz] {
        flex-direction: column;
    }

    .btn-review[b-xop53sq9nz] {
        width: 100%;
    }
}

.customer-type-field[b-xop53sq9nz] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}

.customer-type-field label[b-xop53sq9nz] {
    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-xop53sq9nz] {
    margin-top: 0;
}

.logo-upload-field[b-xop53sq9nz] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}

.logo-upload-field label[b-xop53sq9nz] {
    font-weight: 600;
    font-size: 0.9rem;
    color: #2c3e50;
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.required-mark[b-xop53sq9nz] {
    color: #dc3545;
    font-weight: 700;
}

.field-hint[b-xop53sq9nz] {
    font-weight: 400;
    font-size: 0.8rem;
    color: #6c757d;
}

.logo-error[b-xop53sq9nz] {
    font-size: 0.85rem;
    color: #dc3545;
}

.logo-preview-wrap[b-xop53sq9nz] {
    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-xop53sq9nz] {
    max-height: 80px;
    object-fit: contain;
    border-radius: 4px;
    border: 1px solid #dee2e6;
    background: white;
    padding: 0.25rem;
}

.logo-preview-name[b-xop53sq9nz] {
    font-size: 0.85rem;
    color: #495057;
    word-break: break-all;
}

.review-notes-field[b-xop53sq9nz] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}

.review-notes-field label[b-xop53sq9nz] {
    font-weight: 600;
    font-size: 0.9rem;
    color: #2c3e50;
}

.optional[b-xop53sq9nz] {
    font-weight: 400;
    color: #6c757d;
    font-size: 0.85rem;
}

.review-actions[b-xop53sq9nz] {
    display: flex;
    gap: 1rem;
}

.btn-review[b-xop53sq9nz] {
    min-width: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* /Components/Pages/DealerTerms.razor.rz.scp.css */
.terms-page[b-4yei9ho3xm] {
    max-width: 860px;
    margin: 0 auto;
}

.page-header[b-4yei9ho3xm] {
    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-4yei9ho3xm] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.9;
}

.page-header h1[b-4yei9ho3xm] {
    margin: 0;
    font-size: 2.25rem;
    font-weight: 700;
}

.terms-body[b-4yei9ho3xm] {
    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-4yei9ho3xm] {
    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-4yei9ho3xm] {
    padding-left: 1.5rem;
    margin-bottom: 0.5rem;
}

.terms-body ul ul[b-4yei9ho3xm] {
    margin-top: 0.4rem;
}

.terms-body li[b-4yei9ho3xm] {
    margin-bottom: 0.35rem;
    color: #333;
}

.acceptance-note[b-4yei9ho3xm] {
    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-4yei9ho3xm] {
    margin-top: 2.5rem;
    padding-top: 1rem;
    border-top: 1px solid #dee2e6;
    font-size: 0.9rem;
    color: #6c757d;
}

.terms-footer a[b-4yei9ho3xm] {
    color: #2c3e50;
    font-weight: 600;
}
/* /Components/Pages/ExpenseCreate.razor.rz.scp.css */
/* ── Page layout ── */
.exc-page[b-myson4zstm] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ── Loading ── */
.loading-container[b-myson4zstm] {
    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-myson4zstm] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-myson4zstm] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* ── Page header ── */
.page-header[b-myson4zstm] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #eee;
}

.btn-back[b-myson4zstm] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: var(--primary-color, #0d6efd);
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
    border-radius: 6px;
    transition: background 0.15s;
}

.btn-back:hover[b-myson4zstm] {
    background: #f0f4ff;
}

.header-icon[b-myson4zstm] {
    font-size: 2rem;
    color: var(--primary-color, #0d6efd);
    flex-shrink: 0;
}

.header-text h1[b-myson4zstm] {
    margin: 0;
    font-size: 1.6rem;
    font-weight: 700;
    color: #2c3e50;
}

.header-text p[b-myson4zstm] {
    margin: 0.15rem 0 0;
    font-size: 0.9rem;
    color: #6c757d;
}

/* ── Form card ── */
.form-card[b-myson4zstm] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.section-title[b-myson4zstm] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #2c3e50;
    margin: 0 0 0.25rem;
}

.section-hint[b-myson4zstm] {
    font-size: 0.85rem;
    color: #6c757d;
    margin: -0.5rem 0 0;
}

.form-row[b-myson4zstm] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.form-group[b-myson4zstm] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1 1 200px;
}

.form-group label[b-myson4zstm] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #495057;
    margin: 0;
}

.required[b-myson4zstm] {
    color: #dc3545;
}

.optional[b-myson4zstm] {
    color: #adb5bd;
    font-weight: 400;
}

.field-error[b-myson4zstm] {
    font-size: 0.78rem;
    color: #dc3545;
    margin-top: 0.15rem;
}

/* ── Input prefix / suffix ── */
.input-prefix-group[b-myson4zstm] {
    display: flex;
    align-items: stretch;
}

.input-prefix-group .form-control[b-myson4zstm] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.input-prefix[b-myson4zstm] {
    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-myson4zstm] {
    display: flex;
    align-items: stretch;
}

.input-prefix-group-sm .form-control[b-myson4zstm] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.input-prefix-sm[b-myson4zstm] {
    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-myson4zstm] {
    display: flex;
    align-items: stretch;
}

.input-suffix-group-sm .form-control[b-myson4zstm] {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-suffix-sm[b-myson4zstm] {
    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-myson4zstm] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.type-option[b-myson4zstm] {
    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-myson4zstm] {
    display: none;
}

.type-option--selected[b-myson4zstm] {
    border-color: var(--primary-color, #0d6efd);
    background: #f0f6ff;
}

.type-option-body[b-myson4zstm] {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
}

.type-option-body i[b-myson4zstm] {
    font-size: 1.75rem;
    color: var(--primary-color, #0d6efd);
    margin-top: 0.1rem;
    flex-shrink: 0;
}

.type-option-body strong[b-myson4zstm] {
    display: block;
    font-size: 0.95rem;
    font-weight: 700;
    color: #2c3e50;
}

.type-option-body small[b-myson4zstm] {
    display: block;
    font-size: 0.8rem;
    color: #6c757d;
    margin-top: 0.2rem;
}

/* ── Uploaded file ── */
.uploaded-file[b-myson4zstm] {
    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-myson4zstm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.li-empty[b-myson4zstm] {
    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-myson4zstm] {
    font-size: 1.5rem;
}

.li-table-wrapper[b-myson4zstm] {
    overflow-x: auto;
}

.li-table[b-myson4zstm] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
    min-width: 860px;
}

.li-table thead tr[b-myson4zstm] {
    background: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
}

.li-table th[b-myson4zstm] {
    padding: 0.5rem 0.5rem;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
    text-align: left;
}

.li-table td[b-myson4zstm] {
    padding: 0.4rem 0.5rem;
    border-bottom: 1px solid #f1f3f5;
    vertical-align: top;
}

.li-totals-row td[b-myson4zstm] {
    border-top: 2px solid #dee2e6;
    border-bottom: none;
    padding-top: 0.6rem;
    background: #f8f9fa;
}

.col-right[b-myson4zstm] {
    text-align: right !important;
}

.col-center[b-myson4zstm] {
    text-align: center !important;
}

.tabnum[b-myson4zstm] {
    font-variant-numeric: tabular-nums;
}

.fw-600[b-myson4zstm] {
    font-weight: 600;
}

.total-cell[b-myson4zstm] {
    font-size: 0.9rem;
}

/* ── Summary card ── */
.summary-card[b-myson4zstm] {
    align-self: flex-end;
    min-width: 280px;
    max-width: 360px;
}

.summary-grid[b-myson4zstm] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.3rem 1.5rem;
    align-items: center;
}

.summary-label[b-myson4zstm] {
    font-size: 0.875rem;
    color: #495057;
}

.summary-value[b-myson4zstm] {
    font-size: 0.875rem;
    text-align: right;
}

.fw-700[b-myson4zstm] {
    font-weight: 700;
}

.total-value[b-myson4zstm] {
    font-size: 1.05rem;
    color: #2c3e50;
    padding-top: 0.25rem;
    border-top: 2px solid #dee2e6;
}

/* ── Form actions ── */
.form-actions[b-myson4zstm] {
    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-uan9pmfwda] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ── Loading ── */
.loading-container[b-uan9pmfwda] {
    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-uan9pmfwda] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-uan9pmfwda] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* ── Header ── */
.exp-header[b-uan9pmfwda] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.exp-header-top[b-uan9pmfwda] {
    display: flex;
    align-items: center;
}

.back-link[b-uan9pmfwda] {
    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-uan9pmfwda] {
    text-decoration: underline;
}

.exp-header-row[b-uan9pmfwda] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.exp-header-row h1[b-uan9pmfwda] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.btn-add[b-uan9pmfwda] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* ── Filters ── */
.exp-filters[b-uan9pmfwda] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    padding: 1rem 1.25rem;
}

.exp-filter-row[b-uan9pmfwda] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: flex-end;
}

.exp-filter-group[b-uan9pmfwda] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1 1 140px;
}

.exp-filter-group label[b-uan9pmfwda] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #495057;
    margin: 0;
}

.exp-filter-actions[b-uan9pmfwda] {
    display: flex;
    align-items: flex-end;
}

/* ── Card ── */
.exp-card[b-uan9pmfwda] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    overflow: hidden;
}

/* ── No data ── */
.no-data[b-uan9pmfwda] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 4rem 2rem;
    color: #adb5bd;
    gap: 0.75rem;
}

.no-data i[b-uan9pmfwda] {
    font-size: 2.5rem;
}

.no-data p[b-uan9pmfwda] {
    font-size: 1rem;
    margin: 0;
}

/* ── Table ── */
.exp-table-wrapper[b-uan9pmfwda] {
    overflow-x: auto;
}

.exp-table[b-uan9pmfwda] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.exp-table thead tr[b-uan9pmfwda] {
    background: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
}

.exp-table th[b-uan9pmfwda] {
    padding: 0.75rem 1rem;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
    text-align: left;
}

.exp-table td[b-uan9pmfwda] {
    padding: 0.65rem 1rem;
    border-bottom: 1px solid #f1f3f5;
    vertical-align: middle;
}

.exp-table tbody tr:hover[b-uan9pmfwda] {
    background: #f8f9fb;
}

.col-right[b-uan9pmfwda] {
    text-align: right !important;
}

.col-center[b-uan9pmfwda] {
    text-align: center !important;
}

.tabnum[b-uan9pmfwda] {
    font-variant-numeric: tabular-nums;
}

.fw-600[b-uan9pmfwda] {
    font-weight: 600;
}

.exp-number[b-uan9pmfwda] {
    font-family: monospace;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
}

.exp-desc[b-uan9pmfwda] {
    color: #495057;
    max-width: 300px;
}

/* ── Type badges ── */
.exp-type[b-uan9pmfwda] {
    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-uan9pmfwda] {
    background: #e8f4ff;
    color: #0d6efd;
}

.exp-type--internalvoucher[b-uan9pmfwda] {
    background: #f0fdf4;
    color: #198754;
}

/* ── Paid badge ── */
.exp-paid-badge[b-uan9pmfwda] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
}

.exp-paid-badge--paid[b-uan9pmfwda] {
    color: #198754;
}

/* ── Doc link ── */
.doc-link[b-uan9pmfwda] {
    color: #dc3545;
    font-size: 1.1rem;
    text-decoration: none;
}

.doc-link:hover[b-uan9pmfwda] {
    color: #b02a37;
}

/* ── Pager ── */
.exp-pager[b-uan9pmfwda] {
    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-uan9pmfwda] {
    font-size: 0.85rem;
    color: #6c757d;
}

.exp-pager-controls[b-uan9pmfwda] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.exp-pager-current[b-uan9pmfwda] {
    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-ka9ftv44hg] {
    max-width: 900px;
    margin: 0 auto;
    padding: 0;
}

/* ── Loading ── */
.loading-container[b-ka9ftv44hg] {
    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-ka9ftv44hg] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-ka9ftv44hg] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* ── Page header (blue gradient banner) ── */
.page-header[b-ka9ftv44hg] {
    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-ka9ftv44hg] {
    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-ka9ftv44hg] {
    background: rgba(255, 255, 255, 0.25);
}

.header-icon[b-ka9ftv44hg] {
    font-size: 2.5rem;
    opacity: 0.9;
    flex-shrink: 0;
}

.page-header .header-text[b-ka9ftv44hg] {
    flex: 1;
}

.page-header h1[b-ka9ftv44hg] {
    margin: 0 0 0.2rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: white;
}

.page-header p[b-ka9ftv44hg] {
    margin: 0;
    opacity: 0.85;
    font-size: 0.95rem;
}

/* ── Alerts ── */
.alert[b-ka9ftv44hg] {
    border-radius: 0.5rem;
    margin-bottom: 1.25rem;
    font-size: 0.9rem;
}

/* ── Form cards ── */
.form-card[b-ka9ftv44hg] {
    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-ka9ftv44hg] {
    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-ka9ftv44hg] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-group[b-ka9ftv44hg] {
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
}

.form-group:last-child[b-ka9ftv44hg] {
    margin-bottom: 0;
}

.form-group label[b-ka9ftv44hg] {
    font-weight: 500;
    margin-bottom: 0.4rem;
    font-size: 0.9rem;
    color: #495057;
}

.required[b-ka9ftv44hg] {
    color: #dc3545;
}

.optional[b-ka9ftv44hg] {
    color: #6c757d;
    font-weight: 400;
    font-size: 0.8rem;
}

.field-error[b-ka9ftv44hg] {
    color: #dc3545;
    font-size: 0.825rem;
    margin-top: 0.3rem;
}

/* ── Currency prefix input ── */
.input-prefix-group[b-ka9ftv44hg] {
    display: flex;
    align-items: stretch;
}

.input-prefix[b-ka9ftv44hg] {
    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-ka9ftv44hg] {
    border-radius: 0 0.375rem 0.375rem 0;
}

/* ── Form actions ── */
.form-actions[b-ka9ftv44hg] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-bottom: 2rem;
}

.btn-submit[b-ka9ftv44hg] {
    padding: 0.6rem 1.75rem;
    font-size: 1rem;
    font-weight: 600;
}

/* ── Responsive ── */
@media (max-width: 640px) {
    .form-row[b-ka9ftv44hg] {
        grid-template-columns: 1fr;
    }

    .page-header[b-ka9ftv44hg] {
        padding: 1.5rem 1rem;
        margin: -1.5rem -1rem 1.5rem -1rem;
    }

    .page-header h1[b-ka9ftv44hg] {
        font-size: 1.35rem;
    }

    .form-card[b-ka9ftv44hg] {
        padding: 1.25rem;
    }

    .form-actions[b-ka9ftv44hg] {
        flex-direction: column-reverse;
    }
}
/* /Components/Pages/ExpenseVouchers.razor.rz.scp.css */
/* ── Page layout ── */
.ev-page[b-27tyc1rsmi] {
    padding: 2rem;
    max-width: 1300px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ── Loading ── */
.loading-container[b-27tyc1rsmi] {
    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-27tyc1rsmi] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-27tyc1rsmi] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* ── Header ── */
.ev-header[b-27tyc1rsmi] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.ev-header-top[b-27tyc1rsmi] {
    display: flex;
    align-items: center;
}

.back-link[b-27tyc1rsmi] {
    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-27tyc1rsmi] {
    text-decoration: underline;
}

.ev-header-row[b-27tyc1rsmi] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.ev-header-row h1[b-27tyc1rsmi] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.btn-add[b-27tyc1rsmi] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* ── Filter bar ── */
.ev-filters[b-27tyc1rsmi] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 1rem 1.25rem;
}

.ev-filter-row[b-27tyc1rsmi] {
    display: flex;
    align-items: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.ev-filter-group[b-27tyc1rsmi] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    flex: 1 1 140px;
    min-width: 120px;
}

.ev-filter-group label[b-27tyc1rsmi] {
    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-27tyc1rsmi] {
    flex: 0 0 auto;
    padding-bottom: 0;
}

/* ── Card ── */
.ev-card[b-27tyc1rsmi] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* ── No data ── */
.no-data[b-27tyc1rsmi] {
    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-27tyc1rsmi] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-27tyc1rsmi] {
    margin: 0;
    font-size: 0.9rem;
}

/* ── Table ── */
.ev-table-wrapper[b-27tyc1rsmi] {
    overflow-x: auto;
}

.ev-table[b-27tyc1rsmi] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.ev-table thead tr[b-27tyc1rsmi] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.ev-table th[b-27tyc1rsmi] {
    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-27tyc1rsmi] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.ev-table tbody tr:last-child td[b-27tyc1rsmi] {
    border-bottom: none;
}

.ev-table tbody tr:hover[b-27tyc1rsmi] {
    background: #f8f9fa;
}

.col-right[b-27tyc1rsmi] {
    text-align: right !important;
}

.col-center[b-27tyc1rsmi] {
    text-align: center !important;
}

.ev-voucher-num[b-27tyc1rsmi] {
    font-weight: 600;
    font-family: monospace;
    font-size: 0.875rem;
    white-space: nowrap;
}

.ev-desc[b-27tyc1rsmi] {
    max-width: 280px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #495057;
}

.tabnum[b-27tyc1rsmi] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.fw-600[b-27tyc1rsmi] {
    font-weight: 600;
}

/* ── Status badges ── */
.ev-status[b-27tyc1rsmi] {
    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-27tyc1rsmi] {
    background: #e9ecef;
    color: #495057;
}

.ev-status--submittedforapproval[b-27tyc1rsmi] {
    background: #fff3cd;
    color: #856404;
}

.ev-status--approved[b-27tyc1rsmi] {
    background: #cff4fc;
    color: #055160;
}

.ev-status--signed[b-27tyc1rsmi] {
    background: #d1f0e0;
    color: #0a6640;
}

.ev-status--cancelled[b-27tyc1rsmi] {
    background: #f8d7da;
    color: #842029;
}

/* ── Doc links ── */
.doc-link[b-27tyc1rsmi] {
    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-27tyc1rsmi] {
    color: #0a6640;
    background: #d1f0e0;
}

.doc-link--signed:hover[b-27tyc1rsmi] {
    background: #a8dfc5;
}

.doc-link--unsigned[b-27tyc1rsmi] {
    color: #055160;
    background: #cff4fc;
}

.doc-link--unsigned:hover[b-27tyc1rsmi] {
    background: #9eeaf9;
}

/* ── Pager ── */
.ev-pager[b-27tyc1rsmi] {
    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-27tyc1rsmi] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.ev-pager-controls[b-27tyc1rsmi] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.ev-pager-current[b-27tyc1rsmi] {
    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-w6332q6bnx] {
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ── Loading ── */
.loading-container[b-w6332q6bnx] {
    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-w6332q6bnx] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-w6332q6bnx] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* ── Not found ── */
.ev-not-found[b-w6332q6bnx] {
    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-w6332q6bnx] {
    font-size: 3rem;
    color: #ffc107;
}

.ev-not-found h2[b-w6332q6bnx] {
    margin: 0;
    font-size: 1.4rem;
    font-weight: 600;
    color: #2c3e50;
}

/* ── Page header (blue gradient banner) ── */
.page-header[b-w6332q6bnx] {
    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-w6332q6bnx] {
    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-w6332q6bnx] {
    background: rgba(255, 255, 255, 0.25);
    color: white;
}

.header-icon[b-w6332q6bnx] {
    font-size: 2.5rem;
    opacity: 0.9;
    flex-shrink: 0;
}

.page-header .header-text[b-w6332q6bnx] {
    flex: 1;
}

.page-header h1[b-w6332q6bnx] {
    margin: 0 0 0.2rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: white;
}

.page-header p[b-w6332q6bnx] {
    margin: 0;
    opacity: 0.85;
    font-size: 0.95rem;
}

/* ── Status badge in header ── */
.ev-status-badge[b-w6332q6bnx] {
    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-w6332q6bnx]               { background: rgba(255,255,255,0.2); color: white; }
.ev-status-badge--submittedforapproval[b-w6332q6bnx] { background: #fff3cd; color: #856404; }
.ev-status-badge--approved[b-w6332q6bnx]            { background: #cff4fc; color: #055160; }
.ev-status-badge--signed[b-w6332q6bnx]              { background: #d1f0e0; color: #0a6640; }
.ev-status-badge--cancelled[b-w6332q6bnx]           { background: #f8d7da; color: #842029; }

/* ── Action bar ── */
.ev-action-bar[b-w6332q6bnx] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}

/* ── Cards ── */
.ev-card[b-w6332q6bnx] {
    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-w6332q6bnx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.ev-card-header-row .ev-section-title[b-w6332q6bnx] {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.ev-section-title[b-w6332q6bnx] {
    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-w6332q6bnx] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem 2rem;
}

.ev-detail-item[b-w6332q6bnx] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.ev-detail-item--wide[b-w6332q6bnx] {
    grid-column: 1 / -1;
}

.ev-detail-label[b-w6332q6bnx] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.ev-detail-value[b-w6332q6bnx] {
    font-size: 0.9rem;
    color: #2c3e50;
    line-height: 1.5;
}

.fw-bold[b-w6332q6bnx] { font-weight: 700; }

/* ── No data ── */
.ev-no-data[b-w6332q6bnx] {
    color: #6c757d;
    font-size: 0.9rem;
    font-style: italic;
    padding: 0.5rem 0;
}

/* ── Evidence table ── */
.ev-table-wrapper[b-w6332q6bnx] {
    overflow-x: auto;
}

.ev-table[b-w6332q6bnx] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.ev-table thead tr[b-w6332q6bnx] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.ev-table th[b-w6332q6bnx] {
    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-w6332q6bnx] {
    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-w6332q6bnx] {
    border-bottom: none;
}

.col-center[b-w6332q6bnx] { text-align: center !important; }

.btn-link-icon[b-w6332q6bnx] {
    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-w6332q6bnx] {
    background: #cfe2ff;
    color: var(--primary-color);
}

/* ── Status timeline ── */
.ev-timeline[b-w6332q6bnx] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.ev-timeline-item[b-w6332q6bnx] {
    display: flex;
    gap: 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid #e9ecef;
    align-items: flex-start;
}

.ev-timeline-item:last-child[b-w6332q6bnx] {
    border-bottom: none;
    padding-bottom: 0;
}

.ev-timeline-dot[b-w6332q6bnx] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 0.3rem;
    border: 2px solid transparent;
}

.ev-timeline-dot--draft[b-w6332q6bnx]               { background: #adb5bd; border-color: #6c757d; }
.ev-timeline-dot--submittedforapproval[b-w6332q6bnx] { background: #ffc107; border-color: #e0a800; }
.ev-timeline-dot--approved[b-w6332q6bnx]            { background: #0dcaf0; border-color: #0aa3c2; }
.ev-timeline-dot--signed[b-w6332q6bnx]              { background: #198754; border-color: #157347; }
.ev-timeline-dot--cancelled[b-w6332q6bnx]           { background: #dc3545; border-color: #b02a37; }

.ev-timeline-content[b-w6332q6bnx] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.ev-timeline-status[b-w6332q6bnx] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.ev-timeline-meta[b-w6332q6bnx] {
    font-size: 0.8rem;
    color: #6c757d;
}

.ev-timeline-note[b-w6332q6bnx] {
    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-w6332q6bnx] {
    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-w6332q6bnx] {
    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-w6332q6bnx] {
    max-width: 440px;
}

.modal-header[b-w6332q6bnx] {
    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-w6332q6bnx] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.modal-close[b-w6332q6bnx] {
    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-w6332q6bnx] {
    background: #f0f0f0;
    color: #2c3e50;
}

.modal-body[b-w6332q6bnx] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.modal-body p[b-w6332q6bnx] {
    margin: 0;
    font-size: 0.9rem;
    color: #495057;
}

.modal-footer[b-w6332q6bnx] {
    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-w6332q6bnx] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-w6332q6bnx] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
}

.required[b-w6332q6bnx] { color: #dc3545; }
.optional[b-w6332q6bnx]  { color: #6c757d; font-weight: 400; font-size: 0.8rem; }

.field-error[b-w6332q6bnx] {
    font-size: 0.8rem;
    color: #dc3545;
}

/* ── Alerts ── */
.alert[b-w6332q6bnx] {
    border-radius: 0.5rem;
    font-size: 0.9rem;
}

/* ── Responsive ── */
@media (max-width: 640px) {
    .ev-detail-grid[b-w6332q6bnx] {
        grid-template-columns: 1fr;
    }

    .page-header[b-w6332q6bnx] {
        padding: 1.5rem 1rem;
        margin: -1.5rem -1rem 0 -1rem;
        flex-wrap: wrap;
    }

    .ev-action-bar[b-w6332q6bnx] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* /Components/Pages/FindDealer.razor.rz.scp.css */
/* Find a Dealer Page Styles */
.find-dealer-page[b-6c2kl3u0oq] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0;
}

.page-header[b-6c2kl3u0oq] {
    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-6c2kl3u0oq] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.9;
}

.page-header h1[b-6c2kl3u0oq] {
    margin: 0 0 0.5rem 0;
    font-size: 2.5rem;
    font-weight: 700;
}

.page-header .lead[b-6c2kl3u0oq] {
    font-size: 1.125rem;
    margin: 0;
    opacity: 0.9;
}

.dealer-controls[b-6c2kl3u0oq] {
    display: flex;
    gap: 1rem;
    margin-bottom: 2rem;
    padding: 0 1rem;
    flex-wrap: wrap;
}

.search-box[b-6c2kl3u0oq] {
    flex: 1;
    min-width: 300px;
    position: relative;
}

.search-box i[b-6c2kl3u0oq] {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box .form-control[b-6c2kl3u0oq] {
    padding-left: 2.5rem;
}

.filter-group[b-6c2kl3u0oq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.filter-group label[b-6c2kl3u0oq] {
    margin: 0;
    white-space: nowrap;
    font-weight: 500;
}

.filter-group .form-select[b-6c2kl3u0oq] {
    min-width: 200px;
}

.dealer-count[b-6c2kl3u0oq] {
    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-6c2kl3u0oq] {
    font-size: 1.25rem;
}

.loading-container[b-6c2kl3u0oq] {
    text-align: center;
    padding: 4rem 2rem;
    color: #6c757d;
}

.loading-container .spinner-border[b-6c2kl3u0oq] {
    width: 3rem;
    height: 3rem;
    margin-bottom: 1rem;
}

.no-results[b-6c2kl3u0oq] {
    text-align: center;
    padding: 4rem 2rem;
    color: #6c757d;
}

.no-results i[b-6c2kl3u0oq] {
    font-size: 4rem;
    margin-bottom: 1rem;
    opacity: 0.5;
}

.no-results h3[b-6c2kl3u0oq] {
    margin-bottom: 0.5rem;
}

.dealers-grid[b-6c2kl3u0oq] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 1.5rem;
    padding: 0 1rem 2rem 1rem;
}

.dealer-card[b-6c2kl3u0oq] {
    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-6c2kl3u0oq] {
    transform: translateY(-4px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
    border-color: #0066cc;
}

.dealer-image[b-6c2kl3u0oq] {
    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-6c2kl3u0oq] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

.placeholder-image[b-6c2kl3u0oq] {
    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-6c2kl3u0oq] {
    font-size: 4rem;
    opacity: 0.5;
}

.dealer-content[b-6c2kl3u0oq] {
    padding: 1.5rem;
}

.dealer-name[b-6c2kl3u0oq] {
    margin: 0 0 1.25rem 0;
    font-size: 1.375rem;
    font-weight: 700;
    color: #2c3e50;
}

.dealer-info[b-6c2kl3u0oq] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.info-item[b-6c2kl3u0oq] {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
}

.info-item > i[b-6c2kl3u0oq] {
    flex-shrink: 0;
    width: 1.25rem;
    text-align: center;
    color: #0066cc;
    font-size: 1.125rem;
    margin-top: 0.125rem;
}

.info-text[b-6c2kl3u0oq] {
    flex: 1;
    line-height: 1.6;
}

.info-text strong[b-6c2kl3u0oq] {
    color: #2c3e50;
}

.info-text a[b-6c2kl3u0oq] {
    color: #0066cc;
    text-decoration: none;
    transition: color 0.2s ease;
}

.info-text a:hover[b-6c2kl3u0oq] {
    color: #0052a3;
    text-decoration: underline;
}

.province-badge[b-6c2kl3u0oq] {
    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-6c2kl3u0oq] {
        font-size: 2rem;
    }

    .page-header .header-icon[b-6c2kl3u0oq] {
        font-size: 2.5rem;
    }

    .dealers-grid[b-6c2kl3u0oq] {
        grid-template-columns: 1fr;
        padding: 0 0.5rem 1rem 0.5rem;
    }

    .dealer-controls[b-6c2kl3u0oq] {
        flex-direction: column;
        padding: 0 0.5rem;
    }

    .search-box[b-6c2kl3u0oq] {
        min-width: 100%;
    }

    .filter-group[b-6c2kl3u0oq] {
        width: 100%;
    }

    .filter-group .form-select[b-6c2kl3u0oq] {
        flex: 1;
    }

    .dealer-count[b-6c2kl3u0oq] {
        margin: 0 0.5rem 1rem 0.5rem;
    }
}

@media (max-width: 480px) {
    .page-header[b-6c2kl3u0oq] {
        padding: 2rem 1rem;
        margin: -2rem -1rem 1.5rem -1rem;
    }

    .dealer-content[b-6c2kl3u0oq] {
        padding: 1rem;
    }

    .dealer-name[b-6c2kl3u0oq] {
        font-size: 1.25rem;
    }
}
/* /Components/Pages/GenerateStatement.razor.rz.scp.css */
.generate-statement-page[b-96rhu3pz1b] {
    padding: 2rem;
    max-width: 600px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Header */
.generate-statement-header[b-96rhu3pz1b] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.generate-statement-header-top[b-96rhu3pz1b] {
    display: flex;
    align-items: center;
}

.generate-statement-header h1[b-96rhu3pz1b] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-96rhu3pz1b] {
    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-96rhu3pz1b] {
    text-decoration: underline;
}

/* Card */
.generate-statement-card[b-96rhu3pz1b] {
    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-96rhu3pz1b] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    flex: 1;
}

.form-label[b-96rhu3pz1b] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.form-select[b-96rhu3pz1b] {
    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-96rhu3pz1b] {
    display: flex;
    gap: 1rem;
}

.form-actions[b-96rhu3pz1b] {
    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-96rhu3pz1b] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
    color: var(--secondary-color);
    padding: 0.5rem 0;
}

/* Alert */
.alert-danger[b-96rhu3pz1b] {
    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-96rhu3pz1b] {
        padding: 1rem;
    }

    .form-row[b-96rhu3pz1b] {
        flex-direction: column;
    }
}
/* /Components/Pages/Inventory.razor.rz.scp.css */
/* Page layout */
.inventory-page[b-9tum2bsmcc] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-9tum2bsmcc] {
    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-9tum2bsmcc] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-9tum2bsmcc] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.inventory-header[b-9tum2bsmcc] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.inventory-header-top[b-9tum2bsmcc] {
    display: flex;
    align-items: center;
}

.inventory-header h1[b-9tum2bsmcc] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-9tum2bsmcc] {
    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-9tum2bsmcc] {
    text-decoration: underline;
}

/* Filter */
.inventory-filter[b-9tum2bsmcc] {
    display: flex;
    align-items: center;
}

.inventory-filter-input-wrapper[b-9tum2bsmcc] {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 400px;
}

.inventory-filter-input-wrapper > i[b-9tum2bsmcc] {
    position: absolute;
    left: 0.75rem;
    color: var(--secondary-color);
    font-size: 0.9rem;
    pointer-events: none;
}

.inventory-filter-input[b-9tum2bsmcc] {
    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-9tum2bsmcc] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 105, 217, 0.12);
}

.inventory-filter-clear[b-9tum2bsmcc] {
    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-9tum2bsmcc] {
    color: var(--text-color);
}

/* Card */
.inventory-card[b-9tum2bsmcc] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-9tum2bsmcc] {
    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-9tum2bsmcc] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-9tum2bsmcc] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.inventory-table-wrapper[b-9tum2bsmcc] {
    overflow-x: auto;
}

.inventory-table[b-9tum2bsmcc] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.inventory-table thead tr[b-9tum2bsmcc] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.inventory-table th[b-9tum2bsmcc] {
    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-9tum2bsmcc] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.inventory-table tbody tr:last-child td[b-9tum2bsmcc] {
    border-bottom: none;
}

.inventory-table tbody tr:hover[b-9tum2bsmcc] {
    background: #f8f9fa;
}

.col-right[b-9tum2bsmcc] {
    text-align: right;
}

.col-center[b-9tum2bsmcc] {
    text-align: center;
    width: 5rem;
}

.col-stock[b-9tum2bsmcc] {
    width: 12rem;
}

.col-category[b-9tum2bsmcc] {
    font-size: 0.85rem;
    color: var(--secondary-color);
    white-space: nowrap;
}

/* Stock input */
.stock-input-wrapper[b-9tum2bsmcc] {
    display: grid;
    grid-template-columns: 5.5rem 3.5rem;
    column-gap: 0.35rem;
    align-items: center;
}

.uom-label[b-9tum2bsmcc] {
    font-size: 0.8rem;
    color: var(--secondary-color);
    white-space: nowrap;
    text-align: left;
}

.stock-input[b-9tum2bsmcc] {
    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-9tum2bsmcc] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 105, 217, 0.12);
    background: white;
}

.stock-input--invalid[b-9tum2bsmcc] {
    border-color: #dc2626;
    background: #fef2f2;
}

.stock-input--invalid:focus[b-9tum2bsmcc] {
    border-color: #dc2626;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.12);
}

/* Toggle switch */
.toggle-switch[b-9tum2bsmcc] {
    position: relative;
    display: inline-block;
    width: 36px;
    height: 20px;
    cursor: pointer;
    margin: 0;
}

.toggle-switch input[b-9tum2bsmcc] {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider[b-9tum2bsmcc] {
    position: absolute;
    inset: 0;
    background: #cbd5e1;
    border-radius: 20px;
    transition: background 0.25s;
}

.toggle-slider[b-9tum2bsmcc]::before {
    content: "";
    position: absolute;
    left: 2px;
    top: 2px;
    width: 16px;
    height: 16px;
    background: white;
    border-radius: 50%;
    transition: transform 0.25s;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

.toggle-switch input:checked + .toggle-slider[b-9tum2bsmcc] {
    background: #22c55e;
}

.toggle-switch input:checked + .toggle-slider[b-9tum2bsmcc]::before {
    transform: translateX(16px);
}

/* Stock badges */
.stock-badge[b-9tum2bsmcc] {
    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-9tum2bsmcc] {
    background: #fde8e8;
    color: #b91c1c;
}

.stock-badge--warning[b-9tum2bsmcc] {
    background: #fff3cd;
    color: #92400e;
}

.stock-badge--ok[b-9tum2bsmcc] {
    background: #d1fae5;
    color: #065f46;
}

/* Pager */
.inventory-pager[b-9tum2bsmcc] {
    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-9tum2bsmcc] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.inventory-pager-controls[b-9tum2bsmcc] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.inventory-pager-current[b-9tum2bsmcc] {
    font-size: 0.85rem;
    color: var(--text-color);
    font-weight: 500;
    white-space: nowrap;
}

/* Responsive */
@media (max-width: 640px) {
    .inventory-page[b-9tum2bsmcc] {
        padding: 1rem;
        gap: 1rem;
    }

    .inventory-filter-input-wrapper[b-9tum2bsmcc] {
        max-width: 100%;
    }
}
/* /Components/Pages/MyProfile.razor.rz.scp.css */
.my-profile-page[b-mywgyaz56z] {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    min-height: 60vh;
    padding: 2rem;
}

.my-profile-card[b-mywgyaz56z] {
    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-mywgyaz56z] {
    font-size: 3rem;
    color: var(--primary, #0d6efd);
    margin-bottom: 1rem;
}

.my-profile-card h1[b-mywgyaz56z] {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.my-profile-subtitle[b-mywgyaz56z] {
    color: var(--text-muted, #6c757d);
    margin-bottom: 1.75rem;
    font-size: 0.95rem;
}

.my-profile-card .form-group[b-mywgyaz56z] {
    text-align: left;
    margin-bottom: 1rem;
}

.my-profile-card .form-group label[b-mywgyaz56z] {
    display: block;
    font-weight: 500;
    margin-bottom: 0.35rem;
    font-size: 0.9rem;
}

.my-profile-card .form-control[b-mywgyaz56z] {
    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-mywgyaz56z] {
        outline: none;
        border-color: var(--primary, #0d6efd);
        box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.15);
    }

.btn-save[b-mywgyaz56z] {
    width: 100%;
    padding: 0.6rem 1.25rem;
    font-size: 1rem;
    font-weight: 500;
    border-radius: 6px;
    margin-top: 0.5rem;
}

.required[b-mywgyaz56z] {
    color: #dc3545;
}

.field-error[b-mywgyaz56z] {
    color: #dc3545;
    font-size: 0.825rem;
    margin-top: 0.3rem;
    display: block;
}

.section-divider[b-mywgyaz56z] {
    border: none;
    border-top: 2px solid #e9ecef;
    margin: 1.75rem 0;
}

.section-heading[b-mywgyaz56z] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 1.25rem;
}
/* /Components/Pages/OpsDashboard.razor.rz.scp.css */
.dashboard-page[b-sqf9a6cdo8] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* Loading & Error */
.loading-container[b-sqf9a6cdo8] {
    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-sqf9a6cdo8] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-sqf9a6cdo8] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

.dashboard-error[b-sqf9a6cdo8] {
    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-sqf9a6cdo8] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}

/* Welcome Banner */
.dashboard-welcome[b-sqf9a6cdo8] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #004999 100%);
    color: white;
    border-radius: 12px;
    padding: 2rem 2.5rem;
}

.welcome-text h1[b-sqf9a6cdo8] {
    margin: 0 0 0.25rem;
    font-size: 2rem;
    font-weight: 700;
    color: white;
}

.welcome-text p[b-sqf9a6cdo8] {
    margin: 0;
    opacity: 0.85;
    font-size: 1rem;
}

/* Card grid */
.dashboard-grid[b-sqf9a6cdo8] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    align-items: start;
}

/* Cards */
.dashboard-card[b-sqf9a6cdo8] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.card-header[b-sqf9a6cdo8] {
    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-sqf9a6cdo8] {
    font-size: 1.25rem;
    color: var(--primary-color);
}

.card-header h2[b-sqf9a6cdo8] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    color: #2c3e50;
    flex: 1;
}

.card-chevron[b-sqf9a6cdo8] {
    font-size: 0.9rem !important;
    color: var(--secondary-color) !important;
    opacity: 0.5;
    transition: opacity 0.2s ease;
}

.card-body[b-sqf9a6cdo8] {
    padding: 1.5rem;
}

/* Clickable stat card */
.stat-card[b-sqf9a6cdo8] {
    cursor: pointer;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
    text-decoration: none;
}

.stat-card:hover[b-sqf9a6cdo8] {
    box-shadow: 0 6px 20px rgba(0, 102, 204, 0.15);
    transform: translateY(-2px);
}

.stat-card:hover .card-chevron[b-sqf9a6cdo8] {
    opacity: 1;
}

/* Stat rows */
.stat-row[b-sqf9a6cdo8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.5rem 0;
}

.stat-divider[b-sqf9a6cdo8] {
    height: 1px;
    background: var(--border-color);
    margin: 0.25rem 0;
}

.stat-label[b-sqf9a6cdo8] {
    font-size: 0.9rem;
    color: var(--secondary-color);
    font-weight: 500;
}

.stat-badge[b-sqf9a6cdo8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.25rem;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 700;
    line-height: 1.4;
}

.stat-badge--warning[b-sqf9a6cdo8] {
    background: #fff3cd;
    color: #856404;
}

.stat-badge--primary[b-sqf9a6cdo8] {
    background: #e7f1ff;
    color: var(--primary-color);
}

.stat-badge--danger[b-sqf9a6cdo8] {
    background: #fde8e8;
    color: #b91c1c;
}

.stat-badge--success[b-sqf9a6cdo8] {
    background: #d1fae5;
    color: #065f46;
}

/* Responsive */
@media (max-width: 992px) {
    .dashboard-grid[b-sqf9a6cdo8] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .dashboard-page[b-sqf9a6cdo8] {
        padding: 1rem;
        gap: 1.25rem;
    }

    .dashboard-welcome[b-sqf9a6cdo8] {
        padding: 1.5rem;
    }

    .welcome-text h1[b-sqf9a6cdo8] {
        font-size: 1.5rem;
    }

    .dashboard-grid[b-sqf9a6cdo8] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/OpsFulfillment.razor.rz.scp.css */
.fulfillment-page[b-4nx806qimq] {
    padding: 2rem;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading & Error */
.loading-container[b-4nx806qimq] {
    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-4nx806qimq] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-4nx806qimq] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.fulfillment-header[b-4nx806qimq] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.fulfillment-header h1[b-4nx806qimq] {
    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-4nx806qimq] {
    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-4nx806qimq] {
    text-decoration: underline;
}

.order-id-badge[b-4nx806qimq] {
    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-4nx806qimq] {
    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-4nx806qimq] {
    font-size: 3.5rem;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

.empty-state h2[b-4nx806qimq] {
    margin: 0 0 0.5rem;
    font-size: 1.5rem;
    font-weight: 700;
    color: #2c3e50;
}

.empty-state p[b-4nx806qimq] {
    margin: 0;
    color: #6c757d;
    font-size: 1rem;
}

/* Body */
.fulfillment-body[b-4nx806qimq] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Cards */
.fulfillment-card[b-4nx806qimq] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 1.5rem;
}

.card-section-title[b-4nx806qimq] {
    margin: 0 0 1rem;
    font-size: 1.05rem;
    font-weight: 600;
    color: #2c3e50;
}

/* Items table */
.items-table-wrapper[b-4nx806qimq] {
    overflow-x: auto;
}

.items-table[b-4nx806qimq] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.items-table thead th[b-4nx806qimq] {
    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-4nx806qimq] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
}

.items-table tbody tr:hover[b-4nx806qimq] {
    background: #f8f9fb;
}

.col-right[b-4nx806qimq] {
    text-align: right;
}

.col-num[b-4nx806qimq] {
    width: 40px;
    color: #6c757d;
    font-weight: 500;
}

.col-qty-value[b-4nx806qimq] {
    font-weight: 700;
    font-size: 1rem;
}

/* Actions */
.actions-card[b-4nx806qimq] {
    display: flex;
    justify-content: center;
}

.action-buttons[b-4nx806qimq] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    justify-content: center;
}

/* Modals */
.material-row[b-4nx806qimq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f0f0f0;
}

.material-row label[b-4nx806qimq] {
    margin: 0;
    font-weight: 500;
    color: #2c3e50;
    flex: 1;
}

.material-qty-input[b-4nx806qimq] {
    width: 80px;
    text-align: center;
}

/* Invoice rows */
.invoice-row[b-4nx806qimq] {
    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-4nx806qimq] {
    border-bottom: none;
}

.invoice-label[b-4nx806qimq] {
    font-weight: 500;
    color: #2c3e50;
}

/* Responsive */
@media (max-width: 640px) {
    .fulfillment-page[b-4nx806qimq] {
        padding: 1rem;
    }

    .action-buttons[b-4nx806qimq] {
        flex-direction: column;
        width: 100%;
    }

    .action-buttons .btn[b-4nx806qimq] {
        width: 100%;
    }
}
/* /Components/Pages/OrdersList.razor.rz.scp.css */
/* Page layout */
.orders-list-page[b-3sx0h8prui] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-3sx0h8prui] {
    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-3sx0h8prui] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-3sx0h8prui] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Error */
.list-error[b-3sx0h8prui] {
    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-3sx0h8prui] {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffc107;
}

/* Header */
.orders-list-header[b-3sx0h8prui] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.back-link[b-3sx0h8prui] {
    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-3sx0h8prui] {
    text-decoration: underline;
}

.orders-list-header h1[b-3sx0h8prui] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.orders-list-title-row[b-3sx0h8prui] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

/* Card */
.orders-list-card[b-3sx0h8prui] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-3sx0h8prui] {
    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-3sx0h8prui] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-3sx0h8prui] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.orders-table-wrapper[b-3sx0h8prui] {
    overflow-x: auto;
}

.orders-table[b-3sx0h8prui] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.orders-table thead tr[b-3sx0h8prui] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.orders-table th[b-3sx0h8prui] {
    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-3sx0h8prui] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.orders-table tbody tr:last-child td[b-3sx0h8prui] {
    border-bottom: none;
}

.orders-table tbody tr:hover[b-3sx0h8prui] {
    background: #f8f9fa;
}

.order-row[b-3sx0h8prui] {
    cursor: pointer;
}

.order-number[b-3sx0h8prui] {
    font-weight: 600;
    font-family: monospace;
    font-size: 0.875rem;
}

.order-amount[b-3sx0h8prui] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.order-total[b-3sx0h8prui] {
    font-weight: 600;
}

.col-right[b-3sx0h8prui] {
    text-align: right !important;
}

/* Status badges */
.order-status-badge[b-3sx0h8prui] {
    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-3sx0h8prui] {
    background: #e7f1ff;
    color: var(--primary-color);
}

.order-status-badge--confirmed[b-3sx0h8prui] {
    background: #fff3cd;
    color: #856404;
}

.order-status-badge--processing[b-3sx0h8prui] {
    background: #fff3cd;
    color: #856404;
}

.order-status-badge--shipped[b-3sx0h8prui] {
    background: #d1f0e0;
    color: #0a6640;
}

.order-status-badge--delivered[b-3sx0h8prui] {
    background: #c8e6c9;
    color: #1b5e20;
}

.order-status-badge--cancelled[b-3sx0h8prui] {
    background: #f8d7da;
    color: #842029;
}

/* Pager */
.orders-pager[b-3sx0h8prui] {
    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-3sx0h8prui] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.orders-pager-controls[b-3sx0h8prui] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.orders-pager-current[b-3sx0h8prui] {
    font-size: 0.85rem;
    color: var(--text-color);
    font-weight: 500;
    white-space: nowrap;
}
/* /Components/Pages/ProductDetails.razor.rz.scp.css */
.loading-container[b-caowi6unyu] {
    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-caowi6unyu] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-caowi6unyu] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

.not-found[b-caowi6unyu] {
    text-align: center;
    padding: 6rem 0;
    color: #6c757d;
}

.not-found i[b-caowi6unyu] {
    font-size: 4rem;
    margin-bottom: 1rem;
    opacity: 0.5;
    display: block;
}

.product-details-page[b-caowi6unyu] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
}

.breadcrumb-nav[b-caowi6unyu] {
    margin-bottom: 2rem;
}

.product-details-layout[b-caowi6unyu] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    align-items: start;
}

.product-images[b-caowi6unyu] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.product-main-image[b-caowi6unyu] {
    max-width: 256px;
    height: auto;
    border-radius: 12px;
    object-fit: contain;
    background: #f8f9fa;
}

.product-image-placeholder[b-caowi6unyu] {
    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-caowi6unyu] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.product-thumbnail[b-caowi6unyu] {
    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-caowi6unyu] {
    border-color: #0d6efd;
}

.product-thumbnail.active[b-caowi6unyu] {
    border-color: #0d6efd;
}

.product-info[b-caowi6unyu] {
    display: flex;
    flex-direction: column;
}

.product-brand[b-caowi6unyu] {
    color: #0d6efd;
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

.product-name[b-caowi6unyu] {
    font-size: 2rem;
    font-weight: 700;
    color: #2c3e50;
    margin: 0 0 0.5rem 0;
    line-height: 1.2;
}

.product-size[b-caowi6unyu] {
    color: #6c757d;
    font-size: 1rem;
    margin-bottom: 1rem;
}

.product-categories[b-caowi6unyu] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}

.category-badge[b-caowi6unyu] {
    background: #e9ecef;
    color: #495057;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 500;
}

.product-description[b-caowi6unyu] {
    color: #495057;
    font-size: 1rem;
    line-height: 1.7;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

.product-pricing[b-caowi6unyu] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin-bottom: 0.5rem;
}

.price[b-caowi6unyu] {
    font-size: 2rem;
    font-weight: 700;
    color: #28a745;
    white-space: nowrap;
}

.rrp[b-caowi6unyu] {
    font-size: 0.875rem;
    color: #6c757d;
    white-space: nowrap;
}

.add-to-cart-section[b-caowi6unyu] {
    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-caowi6unyu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.quantity-selector label[b-caowi6unyu] {
    font-weight: 600;
    color: #495057;
    margin: 0;
}

.qty-input[b-caowi6unyu] {
    width: 64px;
    height: 38px;
    text-align: center;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    font-size: 1rem;
}

.qty-input:focus[b-caowi6unyu] {
    outline: none;
    border-color: #0d6efd;
    box-shadow: 0 0 0 2px rgba(13, 110, 253, 0.15);
}

.qty-btn[b-caowi6unyu] {
    width: 38px;
    height: 38px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
}

.cart-message[b-caowi6unyu] {
    color: #28a745;
    font-weight: 600;
    font-size: 0.9rem;
    animation: fadeIn-b-caowi6unyu 0.3s ease-in;
}

@keyframes fadeIn-b-caowi6unyu {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 768px) {
    .product-details-page[b-caowi6unyu] {
        padding: 1rem;
    }

    .product-details-layout[b-caowi6unyu] {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .product-name[b-caowi6unyu] {
        font-size: 1.5rem;
    }
}
/* /Components/Pages/Products.razor.rz.scp.css */
.products-page[b-8v0gfcxwyl] {
    padding: 2rem;
    max-width: 1400px;
    margin: 0 auto;
}

.products-header[b-8v0gfcxwyl] {
    margin-bottom: 2rem;
}

.products-header h1[b-8v0gfcxwyl] {
    color: #2c3e50;
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.category-info[b-8v0gfcxwyl] {
    color: #6c757d;
    font-size: 1.1rem;
}

.loading-container[b-8v0gfcxwyl] {
    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-8v0gfcxwyl] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-8v0gfcxwyl] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

.no-products[b-8v0gfcxwyl] {
    text-align: center;
    padding: 4rem 0;
    color: #6c757d;
}

.no-products i[b-8v0gfcxwyl] {
    font-size: 4rem;
    margin-bottom: 1rem;
    opacity: 0.5;
}

.products-grid[b-8v0gfcxwyl] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 2rem;
    margin-top: 2rem;
}

.product-card[b-8v0gfcxwyl] {
    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-8v0gfcxwyl] {
    transform: translateY(-4px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.product-image-container[b-8v0gfcxwyl] {
    position: relative;
    width: 100%;
    background: #f8f9fa;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.product-image[b-8v0gfcxwyl] {
    max-width: 256px;
    max-height: 256px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.product-image-placeholder[b-8v0gfcxwyl] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 4rem;
    color: #dee2e6;
}

.product-info[b-8v0gfcxwyl] {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.product-brand[b-8v0gfcxwyl] {
    color: #0d6efd;
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

.product-name[b-8v0gfcxwyl] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #2c3e50;
    margin: 0 0 0.5rem 0;
    line-height: 1.3;
}

.product-size[b-8v0gfcxwyl] {
    color: #6c757d;
    font-size: 0.9rem;
    margin-bottom: 0.75rem;
}

.product-description[b-8v0gfcxwyl] {
    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-8v0gfcxwyl] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.category-badge[b-8v0gfcxwyl] {
    background: #e9ecef;
    color: #495057;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 500;
}

.product-footer[b-8v0gfcxwyl] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    margin-top: auto;
    padding-top: 1rem;
    border-top: 1px solid #e9ecef;
}

.product-footer-top[b-8v0gfcxwyl] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
}

.product-pricing[b-8v0gfcxwyl] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.price[b-8v0gfcxwyl] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #28a745;
    white-space: nowrap;
}

.rrp[b-8v0gfcxwyl] {
    font-size: 0.875rem;
    color: #6c757d;
    white-space: nowrap;
}

.view-details[b-8v0gfcxwyl] {
    white-space: nowrap;
}

.product-actions[b-8v0gfcxwyl] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.add-to-cart-inline[b-8v0gfcxwyl] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.qty-input[b-8v0gfcxwyl] {
    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-8v0gfcxwyl] {
    outline: none;
    border-color: #0d6efd;
    box-shadow: 0 0 0 2px rgba(13, 110, 253, 0.15);
}

.cart-toast[b-8v0gfcxwyl] {
    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-8v0gfcxwyl 0.3s ease-out;
}

@keyframes slideUp-b-8v0gfcxwyl {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 768px) {
    .products-page[b-8v0gfcxwyl] {
        padding: 1rem;
    }

    .products-header h1[b-8v0gfcxwyl] {
        font-size: 2rem;
    }

    .products-grid[b-8v0gfcxwyl] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .product-footer-top[b-8v0gfcxwyl] {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .view-details[b-8v0gfcxwyl] {
        width: 100%;
    }
}
/* /Components/Pages/ReceivedPayments.razor.rz.scp.css */
/* Page layout */
.payments-list-page[b-ybkl8hr7q2] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-ybkl8hr7q2] {
    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-ybkl8hr7q2] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-ybkl8hr7q2] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.payments-list-header[b-ybkl8hr7q2] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.payments-list-header-top[b-ybkl8hr7q2] {
    display: flex;
    align-items: center;
}

.payments-list-header-row[b-ybkl8hr7q2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.back-link[b-ybkl8hr7q2] {
    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-ybkl8hr7q2] {
    text-decoration: underline;
}

.payments-list-header h1[b-ybkl8hr7q2] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.btn-add-payment[b-ybkl8hr7q2] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Card */
.payments-list-card[b-ybkl8hr7q2] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-ybkl8hr7q2] {
    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-ybkl8hr7q2] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-ybkl8hr7q2] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.payments-table-wrapper[b-ybkl8hr7q2] {
    overflow-x: auto;
}

.payments-table[b-ybkl8hr7q2] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.payments-table thead tr[b-ybkl8hr7q2] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.payments-table th[b-ybkl8hr7q2] {
    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-ybkl8hr7q2] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.payments-table tbody tr:last-child td[b-ybkl8hr7q2] {
    border-bottom: none;
}

.payments-table tbody tr:hover[b-ybkl8hr7q2] {
    background: #f8f9fa;
}

.col-right[b-ybkl8hr7q2] {
    text-align: right !important;
}

.payment-amount[b-ybkl8hr7q2] {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* Pager */
.payments-pager[b-ybkl8hr7q2] {
    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-ybkl8hr7q2] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.payments-pager-controls[b-ybkl8hr7q2] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.payments-pager-current[b-ybkl8hr7q2] {
    font-size: 0.85rem;
    color: var(--text-color);
    font-weight: 500;
    white-space: nowrap;
}

/* Modal backdrop */
.payment-modal-backdrop[b-ybkl8hr7q2] {
    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-ybkl8hr7q2] {
    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-ybkl8hr7q2] {
    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-ybkl8hr7q2] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.payment-modal-close[b-ybkl8hr7q2] {
    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-ybkl8hr7q2] {
    background: #f0f0f0;
    color: #2c3e50;
}

/* Modal form body */
.payment-modal-body[b-ybkl8hr7q2] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.form-group[b-ybkl8hr7q2] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-ybkl8hr7q2] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #2c3e50;
}

.required[b-ybkl8hr7q2] {
    color: #dc3545;
}

.field-error[b-ybkl8hr7q2] {
    font-size: 0.8rem;
    color: #dc3545;
}

/* R prefix on amount input */
.input-prefix-group[b-ybkl8hr7q2] {
    display: flex;
    align-items: stretch;
}

.input-prefix[b-ybkl8hr7q2] {
    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-ybkl8hr7q2] {
    border-radius: 0 6px 6px 0;
    flex: 1;
    min-width: 0;
}

/* Modal footer */
.payment-modal-footer[b-ybkl8hr7q2] {
    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-enrjev5zzk] {
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Loading */
.loading-container[b-enrjev5zzk] {
    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-enrjev5zzk] {
    width: 4rem;
    height: 4rem;
    border-width: 0.4em;
}

.loading-container p[b-enrjev5zzk] {
    font-size: 1.25rem;
    color: #495057;
    font-weight: 500;
}

/* Header */
.suppliers-header[b-enrjev5zzk] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.suppliers-header-top[b-enrjev5zzk] {
    display: flex;
    align-items: center;
}

.suppliers-header-row[b-enrjev5zzk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.suppliers-header-row h1[b-enrjev5zzk] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #2c3e50;
}

.back-link[b-enrjev5zzk] {
    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-enrjev5zzk] {
    text-decoration: underline;
}

.btn-add[b-enrjev5zzk] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* Filter */
.suppliers-filter[b-enrjev5zzk] {
    display: flex;
    align-items: center;
}

.suppliers-filter-input-wrapper[b-enrjev5zzk] {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 400px;
}

.suppliers-filter-input-wrapper > i[b-enrjev5zzk] {
    position: absolute;
    left: 0.75rem;
    color: var(--secondary-color);
    font-size: 0.9rem;
    pointer-events: none;
}

.suppliers-filter-input[b-enrjev5zzk] {
    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-enrjev5zzk] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 105, 217, 0.12);
}

.suppliers-filter-clear[b-enrjev5zzk] {
    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-enrjev5zzk] {
    color: var(--text-color);
}

/* Card */
.suppliers-card[b-enrjev5zzk] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* No data */
.no-data[b-enrjev5zzk] {
    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-enrjev5zzk] {
    font-size: 2rem;
    opacity: 0.5;
}

.no-data p[b-enrjev5zzk] {
    margin: 0;
    font-size: 0.9rem;
}

/* Table */
.suppliers-table-wrapper[b-enrjev5zzk] {
    overflow-x: auto;
}

.suppliers-table[b-enrjev5zzk] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.suppliers-table thead tr[b-enrjev5zzk] {
    background: var(--background-color);
    border-bottom: 2px solid var(--border-color);
}

.suppliers-table th[b-enrjev5zzk] {
    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-enrjev5zzk] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color);
    color: #2c3e50;
    vertical-align: middle;
}

.suppliers-table tbody tr:last-child td[b-enrjev5zzk] {
    border-bottom: none;
}

.suppliers-table tbody tr:hover[b-enrjev5zzk] {
    background: #f8f9fa;
}

.col-right[b-enrjev5zzk] {
    text-align: right;
}

.col-center[b-enrjev5zzk] {
    text-align: center;
    width: 5rem;
}

.col-website[b-enrjev5zzk] {
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.website-link[b-enrjev5zzk] {
    color: var(--primary-color);
    text-decoration: none;
    font-size: 0.875rem;
}

.website-link:hover[b-enrjev5zzk] {
    text-decoration: underline;
}

/* Pager */
.suppliers-pager[b-enrjev5zzk] {
    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-enrjev5zzk] {
    font-size: 0.85rem;
    color: var(--secondary-color);
}

.suppliers-pager-controls[b-enrjev5zzk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.suppliers-pager-current[b-enrjev5zzk] {
    font-size: 0.85rem;
    color: var(--secondary-color);
    white-space: nowrap;
}

/* Modal */
.suppliers-modal-backdrop[b-enrjev5zzk] {
    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-enrjev5zzk] {
    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-enrjev5zzk] {
    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-enrjev5zzk] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.suppliers-modal-close[b-enrjev5zzk] {
    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-enrjev5zzk] {
    color: var(--text-color);
}

.suppliers-modal-body[b-enrjev5zzk] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.suppliers-modal-footer[b-enrjev5zzk] {
    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-enrjev5zzk] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-enrjev5zzk] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
}

.required[b-enrjev5zzk] {
    color: #dc3545;
}

.field-error[b-enrjev5zzk] {
    font-size: 0.8rem;
    color: #dc3545;
    margin-top: 0.15rem;
}
/* /Components/Shared/QuickAdd.razor.rz.scp.css */
.quick-add-wrapper[b-m4g1b3km5b] {
    position: relative;
}

.quick-add-dropdown[b-m4g1b3km5b] {
    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-m4g1b3km5b] {
    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-m4g1b3km5b] {
    border-bottom: none;
}

.quick-add-item:hover[b-m4g1b3km5b] {
    background: #f8f9fa;
}

.quick-add-brand[b-m4g1b3km5b] {
    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-m4g1b3km5b] {
    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-m4g1b3km5b] {
    font-size: 0.8rem;
    color: #6c757d;
    white-space: nowrap;
    padding: 0.6rem 0;
}

.quick-add-price[b-m4g1b3km5b] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #28a745;
    white-space: nowrap;
    padding: 0.6rem 1rem 0.6rem 0;
}

.quick-add-no-results[b-m4g1b3km5b] {
    grid-column: 1 / -1;
    padding: 0.75rem 1rem;
    color: #6c757d;
    font-size: 0.9rem;
    text-align: center;
}

.quick-add-feedback[b-m4g1b3km5b] {
    font-size: 0.85rem;
    margin-top: 0.4rem;
}
