/* _content/SCM.Module.Admin.Client.Oqtane/Components/Analytics/AnalyticsChart.razor.rz.scp.css */
/* Analytics Chart Component Styles */

.analytics-chart[b-wv0qdc8jo8] {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

.analytics-chart.loading[b-wv0qdc8jo8] {
    pointer-events: none;
}

/* Header */
.chart-header[b-wv0qdc8jo8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--simx-spacing-md, 1rem);
    margin-bottom: var(--simx-spacing-md, 1rem);
    flex-wrap: wrap;
}

.chart-title h4[b-wv0qdc8jo8] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--simx-text-primary, #1f2937);
}

.chart-subtitle[b-wv0qdc8jo8] {
    display: block;
    font-size: 0.75rem;
    color: var(--simx-text-secondary, #6b7280);
    margin-top: var(--simx-spacing-xs, 0.25rem);
}

.chart-actions[b-wv0qdc8jo8] {
    display: flex;
    align-items: center;
    gap: var(--simx-spacing-sm, 0.5rem);
}

/* Time picker styling */
.chart-time-picker[b-wv0qdc8jo8] {
    font-size: 0.875rem;
}

/* Skeleton loading */
.chart-skeleton[b-wv0qdc8jo8] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(90deg, #f9fafb 25%, #f3f4f6 50%, #f9fafb 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer-b-wv0qdc8jo8 1.5s infinite;
    border-radius: var(--simx-radius-md, 0.375rem);
}

.skeleton-chart[b-wv0qdc8jo8] {
    width: 100%;
    height: 100%;
}

@keyframes skeleton-shimmer-b-wv0qdc8jo8 {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}

/* Error state */
.chart-error[b-wv0qdc8jo8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--simx-spacing-sm, 0.5rem);
    padding: var(--simx-spacing-xl, 2rem);
    color: #ef4444;
    text-align: center;
}

.chart-error i[b-wv0qdc8jo8] {
    font-size: 2rem;
}

.chart-error span[b-wv0qdc8jo8] {
    font-size: 0.875rem;
    color: var(--simx-text-secondary, #6b7280);
}

/* Empty state */
.chart-empty[b-wv0qdc8jo8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--simx-spacing-sm, 0.5rem);
    padding: var(--simx-spacing-xl, 2rem);
    color: var(--simx-text-tertiary, #9ca3af);
    text-align: center;
    min-height: 200px;
}

.chart-empty i[b-wv0qdc8jo8] {
    font-size: 3rem;
    opacity: 0.5;
}

.chart-empty span[b-wv0qdc8jo8] {
    font-size: 0.875rem;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .chart-header[b-wv0qdc8jo8] {
        flex-direction: column;
    }

    .chart-actions[b-wv0qdc8jo8] {
        width: 100%;
        justify-content: flex-end;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Analytics/BreakdownTable.razor.rz.scp.css */
/* Breakdown Table Component Styles */

.breakdown-table[b-dnrr2qa3t3] {
    background: var(--simx-surface, #ffffff);
    border: 1px solid var(--simx-border, #e5e7eb);
    border-radius: var(--simx-radius-lg, 0.5rem);
    padding: var(--simx-spacing-md, 1rem);
}

/* Header */
.table-header[b-dnrr2qa3t3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--simx-spacing-md, 1rem);
    margin-bottom: var(--simx-spacing-md, 1rem);
    flex-wrap: wrap;
}

.table-header h4[b-dnrr2qa3t3] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--simx-text-primary, #1f2937);
}

/* Search box */
.table-search[b-dnrr2qa3t3] {
    font-size: 0.875rem;
}

/* Totals row */
.table-totals[b-dnrr2qa3t3] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--simx-spacing-lg, 1.5rem);
    padding: var(--simx-spacing-md, 1rem);
    margin-top: var(--simx-spacing-sm, 0.5rem);
    border-top: 2px solid var(--simx-border, #e5e7eb);
    font-weight: 600;
    background: var(--simx-surface-alt, #f9fafb);
    border-radius: 0 0 var(--simx-radius-md, 0.375rem) var(--simx-radius-md, 0.375rem);
}

.table-totals .total-label[b-dnrr2qa3t3] {
    color: var(--simx-text-secondary, #6b7280);
}

.table-totals .total-value[b-dnrr2qa3t3] {
    font-size: 1.125rem;
    color: var(--simx-text-primary, #1f2937);
}

/* Grid overrides */
.breakdown-table[b-dnrr2qa3t3]  .e-grid {
    border: none !important;
}

.breakdown-table[b-dnrr2qa3t3]  .e-gridheader {
    border-top: none !important;
}

.breakdown-table[b-dnrr2qa3t3]  .e-headercell {
    background: var(--simx-surface-alt, #f9fafb) !important;
    font-weight: 600;
    color: var(--simx-text-secondary, #6b7280);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.breakdown-table[b-dnrr2qa3t3]  .e-row:hover .e-rowcell {
    background: var(--simx-surface-hover, #f3f4f6) !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .table-header[b-dnrr2qa3t3] {
        flex-direction: column;
        align-items: flex-start;
    }

    .table-search[b-dnrr2qa3t3] {
        width: 100% !important;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Analytics/KPICard.razor.rz.scp.css */
/* KPI Card Component Styles */

.kpi-card[b-lews9hu8t1] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    position: relative;
    min-height: 100px;
}

.kpi-card.loading[b-lews9hu8t1] {
    pointer-events: none;
}

/* Sizes */
.kpi-card.kpi-sm[b-lews9hu8t1] {
    min-height: 80px;
}

.kpi-card.kpi-sm .kpi-icon[b-lews9hu8t1] {
    width: 36px;
    height: 36px;
    font-size: 1rem;
}

.kpi-card.kpi-sm .kpi-value[b-lews9hu8t1] {
    font-size: 1.25rem;
}

.kpi-card.kpi-lg[b-lews9hu8t1] {
    min-height: 140px;
}

.kpi-card.kpi-lg .kpi-icon[b-lews9hu8t1] {
    width: 56px;
    height: 56px;
    font-size: 1.5rem;
}

.kpi-card.kpi-lg .kpi-value[b-lews9hu8t1] {
    font-size: 2.25rem;
}

/* Icon */
.kpi-icon[b-lews9hu8t1] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: var(--simx-radius-md, 0.375rem);
    font-size: 1.25rem;
    flex-shrink: 0;
}

.kpi-icon.icon-primary[b-lews9hu8t1] {
    background: rgba(59, 130, 246, 0.1);
    color: #3b82f6;
}

.kpi-icon.icon-success[b-lews9hu8t1] {
    background: rgba(16, 185, 129, 0.1);
    color: #10b981;
}

.kpi-icon.icon-warning[b-lews9hu8t1] {
    background: rgba(245, 158, 11, 0.1);
    color: #f59e0b;
}

.kpi-icon.icon-danger[b-lews9hu8t1] {
    background: rgba(239, 68, 68, 0.1);
    color: #ef4444;
}

.kpi-icon.icon-info[b-lews9hu8t1] {
    background: rgba(6, 182, 212, 0.1);
    color: #06b6d4;
}

/* Content */
.kpi-content[b-lews9hu8t1] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--simx-spacing-xs, 0.25rem);
}

.kpi-value[b-lews9hu8t1] {
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1.2;
    color: var(--simx-text-primary, #1f2937);
}

.kpi-label[b-lews9hu8t1] {
    font-size: 0.875rem;
    color: var(--simx-text-secondary, #6b7280);
    line-height: 1.4;
}

/* Delta */
.kpi-delta[b-lews9hu8t1] {
    display: flex;
    align-items: center;
    gap: var(--simx-spacing-xs, 0.25rem);
    font-size: 0.75rem;
    font-weight: 500;
    margin-top: var(--simx-spacing-xs, 0.25rem);
}

.kpi-delta i[b-lews9hu8t1] {
    font-size: 0.875rem;
}

.kpi-delta.delta-positive[b-lews9hu8t1] {
    color: #10b981;
}

.kpi-delta.delta-negative[b-lews9hu8t1] {
    color: #ef4444;
}

.kpi-delta.delta-neutral[b-lews9hu8t1] {
    color: #6b7280;
}

.kpi-delta .delta-period[b-lews9hu8t1] {
    color: var(--simx-text-tertiary, #9ca3af);
    font-weight: 400;
}

/* Sparkline */
.kpi-sparkline[b-lews9hu8t1] {
    margin-top: var(--simx-spacing-sm, 0.5rem);
    height: 40px;
    width: 100%;
}

/* Drill-down link */
.kpi-drilldown[b-lews9hu8t1] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    color: var(--simx-text-secondary, #6b7280);
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease;
    position: absolute;
    top: var(--simx-spacing-sm, 0.5rem);
    right: var(--simx-spacing-sm, 0.5rem);
}

.kpi-drilldown:hover[b-lews9hu8t1] {
    background: var(--simx-surface-hover, #f3f4f6);
    color: var(--simx-primary, #3b82f6);
}

/* Skeleton loading */
.kpi-skeleton[b-lews9hu8t1] {
    display: flex;
    align-items: flex-start;
    gap: var(--simx-spacing-md, 1rem);
    width: 100%;
}

.skeleton-icon[b-lews9hu8t1] {
    width: 48px;
    height: 48px;
    border-radius: var(--simx-radius-md, 0.375rem);
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer-b-lews9hu8t1 1.5s infinite;
}

.skeleton-value[b-lews9hu8t1] {
    width: 80px;
    height: 28px;
    border-radius: 4px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer-b-lews9hu8t1 1.5s infinite;
    margin-bottom: 8px;
}

.skeleton-label[b-lews9hu8t1] {
    width: 120px;
    height: 14px;
    border-radius: 4px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer-b-lews9hu8t1 1.5s infinite;
}

@keyframes skeleton-shimmer-b-lews9hu8t1 {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Claim/ClaimContainer.razor.rz.scp.css */
/* ClaimContainer.razor.css - Main container styles */

.claim-container[b-jshj3aneau] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px 20px;
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
    color: #ffffff;
}

.claim-header[b-jshj3aneau] {
    text-align: center;
    margin-bottom: 40px;
}

.claim-header h1[b-jshj3aneau] {
    font-size: 2rem;
    font-weight: 600;
    margin: 0 0 8px 0;
}

.claim-header .subtitle[b-jshj3aneau] {
    font-size: 1.1rem;
    color: rgba(255, 255, 255, 0.7);
    margin: 0;
}

.claim-content[b-jshj3aneau] {
    width: 100%;
    max-width: 480px;
}

/* Loading States */
.claim-loading[b-jshj3aneau] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
}

.claim-loading .spinner[b-jshj3aneau] {
    width: 48px;
    height: 48px;
    border: 3px solid rgba(255, 255, 255, 0.2);
    border-top-color: #3b82f6;
    border-radius: 50%;
    animation: spin-b-jshj3aneau 0.8s linear infinite;
    margin-bottom: 20px;
}

@keyframes spin-b-jshj3aneau {
    to { transform: rotate(360deg); }
}

.claim-loading p[b-jshj3aneau] {
    color: rgba(255, 255, 255, 0.7);
    margin: 0;
}

/* Error/Warning States */
.claim-expired[b-jshj3aneau],
.claim-already-claimed[b-jshj3aneau] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 40px 20px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.success-icon[b-jshj3aneau],
.warning-icon[b-jshj3aneau] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
}

.success-icon[b-jshj3aneau] {
    background: rgba(34, 197, 94, 0.2);
}

.success-icon i[b-jshj3aneau] {
    font-size: 2.5rem;
    color: #22c55e;
}

.warning-icon[b-jshj3aneau] {
    background: rgba(234, 179, 8, 0.2);
}

.warning-icon i[b-jshj3aneau] {
    font-size: 2.5rem;
    color: #eab308;
}

.claim-already-claimed h2[b-jshj3aneau],
.claim-expired h2[b-jshj3aneau] {
    font-size: 1.5rem;
    margin: 0 0 12px 0;
}

.claim-already-claimed p[b-jshj3aneau],
.claim-expired p[b-jshj3aneau] {
    color: rgba(255, 255, 255, 0.7);
    margin: 0 0 8px 0;
}

.claim-info[b-jshj3aneau] {
    margin-top: 16px;
    padding: 12px 16px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 8px;
}

.help-text[b-jshj3aneau] {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.5);
}

/* Responsive */
@media (max-width: 480px) {
    .claim-container[b-jshj3aneau] {
        padding: 24px 16px;
    }

    .claim-header h1[b-jshj3aneau] {
        font-size: 1.5rem;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Claim/ClaimErrorDisplay.razor.rz.scp.css */
/* ClaimErrorDisplay.razor.css */

.claim-error-display[b-nf92qt5695] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 40px 24px;
    background: rgba(239, 68, 68, 0.05);
    border-radius: 16px;
    border: 1px solid rgba(239, 68, 68, 0.2);
}

.error-icon[b-nf92qt5695] {
    width: 80px;
    height: 80px;
    background: rgba(239, 68, 68, 0.15);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
}

.error-icon i[b-nf92qt5695] {
    font-size: 2.5rem;
    color: #ef4444;
}

.claim-error-display h2[b-nf92qt5695] {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0 0 12px 0;
    color: #ef4444;
}

.error-message[b-nf92qt5695] {
    color: rgba(255, 255, 255, 0.8);
    margin: 0 0 24px 0;
    max-width: 320px;
    line-height: 1.5;
}

.retry-btn[b-nf92qt5695] {
    padding: 14px 28px;
    font-size: 1rem;
    font-weight: 600;
    background: rgba(255, 255, 255, 0.1);
    color: white;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s ease;
}

.retry-btn:hover[b-nf92qt5695] {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.3);
}

.help-section[b-nf92qt5695] {
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    width: 100%;
}

.help-section p[b-nf92qt5695] {
    margin: 0;
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.5);
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Claim/ClaimInfoDisplay.razor.rz.scp.css */
/* ClaimInfoDisplay.razor.css */

.claim-info-display[b-lgsytkuwra] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.claim-card[b-lgsytkuwra] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 32px 24px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.card-icon[b-lgsytkuwra] {
    width: 72px;
    height: 72px;
    background: linear-gradient(135deg, #f59e0b, #ef4444);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.card-icon i[b-lgsytkuwra] {
    font-size: 2rem;
    color: white;
}

.claim-card h2[b-lgsytkuwra] {
    font-size: 1.4rem;
    font-weight: 600;
    margin: 0 0 20px 0;
}

.driver-info[b-lgsytkuwra] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
}

.driver-name[b-lgsytkuwra],
.session-date[b-lgsytkuwra],
.driver-email[b-lgsytkuwra] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 12px 16px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 8px;
}

.driver-name i[b-lgsytkuwra],
.session-date i[b-lgsytkuwra],
.driver-email i[b-lgsytkuwra] {
    color: rgba(255, 255, 255, 0.5);
}

.driver-name span[b-lgsytkuwra] {
    font-weight: 600;
    font-size: 1.1rem;
}

.session-date span[b-lgsytkuwra],
.driver-email span[b-lgsytkuwra] {
    color: rgba(255, 255, 255, 0.7);
}

/* Auth Required / Email Mismatch / Confirm */
.auth-required[b-lgsytkuwra],
.email-mismatch[b-lgsytkuwra],
.claim-confirm[b-lgsytkuwra] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 32px 24px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.auth-icon[b-lgsytkuwra],
.warning-icon[b-lgsytkuwra],
.confirm-icon[b-lgsytkuwra] {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}

.auth-icon[b-lgsytkuwra] {
    background: rgba(59, 130, 246, 0.2);
}

.auth-icon i[b-lgsytkuwra] {
    font-size: 1.5rem;
    color: #3b82f6;
}

.warning-icon[b-lgsytkuwra] {
    background: rgba(234, 179, 8, 0.2);
}

.warning-icon i[b-lgsytkuwra] {
    font-size: 1.5rem;
    color: #eab308;
}

.confirm-icon[b-lgsytkuwra] {
    background: rgba(34, 197, 94, 0.2);
}

.confirm-icon i[b-lgsytkuwra] {
    font-size: 1.5rem;
    color: #22c55e;
}

.auth-required h3[b-lgsytkuwra],
.email-mismatch h3[b-lgsytkuwra],
.claim-confirm h3[b-lgsytkuwra] {
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0 0 12px 0;
}

.auth-required p[b-lgsytkuwra],
.email-mismatch p[b-lgsytkuwra],
.claim-confirm p[b-lgsytkuwra] {
    color: rgba(255, 255, 255, 0.7);
    margin: 0 0 8px 0;
    line-height: 1.5;
}

.help-text[b-lgsytkuwra] {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.5);
    margin-top: 8px !important;
}

/* Buttons */
.auth-btn[b-lgsytkuwra],
.claim-btn[b-lgsytkuwra] {
    width: 100%;
    padding: 16px 24px;
    font-size: 1.1rem;
    font-weight: 600;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: all 0.2s ease;
    margin-top: 20px;
}

.auth-btn[b-lgsytkuwra] {
    background: linear-gradient(135deg, #3b82f6, #8b5cf6);
    color: white;
}

.auth-btn.secondary[b-lgsytkuwra] {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.claim-btn[b-lgsytkuwra] {
    background: linear-gradient(135deg, #22c55e, #16a34a);
    color: white;
}

.auth-btn:hover:not(:disabled)[b-lgsytkuwra],
.claim-btn:hover:not(:disabled)[b-lgsytkuwra] {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
}

.auth-btn:disabled[b-lgsytkuwra],
.claim-btn:disabled[b-lgsytkuwra] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

.spinner-sm[b-lgsytkuwra] {
    width: 20px;
    height: 20px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-lgsytkuwra 0.8s linear infinite;
}

@keyframes spin-b-lgsytkuwra {
    to { transform: rotate(360deg); }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Claim/ClaimShortCodeEntry.razor.rz.scp.css */
/* ClaimShortCodeEntry.razor.css */

.shortcode-entry[b-cchmb17lwa] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 40px 24px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.entry-icon[b-cchmb17lwa] {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #3b82f6, #8b5cf6);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
}

.entry-icon i[b-cchmb17lwa] {
    font-size: 2.5rem;
    color: white;
}

.shortcode-entry h2[b-cchmb17lwa] {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0 0 8px 0;
}

.entry-description[b-cchmb17lwa] {
    color: rgba(255, 255, 255, 0.7);
    margin: 0 0 32px 0;
}

.shortcode-form[b-cchmb17lwa] {
    width: 100%;
    max-width: 280px;
}

.input-group[b-cchmb17lwa] {
    margin-bottom: 16px;
}

.shortcode-input[b-cchmb17lwa] {
    width: 100%;
    padding: 16px 20px;
    font-size: 1.5rem;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    background: rgba(255, 255, 255, 0.1);
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    color: white;
    transition: all 0.2s ease;
}

.shortcode-input[b-cchmb17lwa]::placeholder {
    color: rgba(255, 255, 255, 0.4);
    letter-spacing: 0.2em;
}

.shortcode-input:focus[b-cchmb17lwa] {
    outline: none;
    border-color: #3b82f6;
    background: rgba(59, 130, 246, 0.1);
}

.shortcode-input.has-error[b-cchmb17lwa] {
    border-color: #ef4444;
    background: rgba(239, 68, 68, 0.1);
}

.shortcode-input:disabled[b-cchmb17lwa] {
    opacity: 0.6;
    cursor: not-allowed;
}

.error-message[b-cchmb17lwa] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #ef4444;
    font-size: 0.9rem;
    margin-bottom: 16px;
}

.submit-btn[b-cchmb17lwa] {
    width: 100%;
    padding: 16px 24px;
    font-size: 1.1rem;
    font-weight: 600;
    background: linear-gradient(135deg, #3b82f6, #8b5cf6);
    color: white;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: all 0.2s ease;
}

.submit-btn:hover:not(:disabled)[b-cchmb17lwa] {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(59, 130, 246, 0.3);
}

.submit-btn:disabled[b-cchmb17lwa] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

.spinner-sm[b-cchmb17lwa] {
    width: 20px;
    height: 20px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-cchmb17lwa 0.8s linear infinite;
}

@keyframes spin-b-cchmb17lwa {
    to { transform: rotate(360deg); }
}

.entry-help[b-cchmb17lwa] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 32px;
    padding: 16px;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 8px;
    text-align: left;
}

.entry-help i[b-cchmb17lwa] {
    color: rgba(255, 255, 255, 0.5);
    font-size: 1rem;
    margin-top: 2px;
}

.entry-help p[b-cchmb17lwa] {
    margin: 0;
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.5);
    line-height: 1.5;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Claim/ClaimSuccessDisplay.razor.rz.scp.css */
/* ClaimSuccessDisplay.razor.css */

.claim-success[b-jp2ufpi7gs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 40px 24px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 16px;
    border: 1px solid rgba(34, 197, 94, 0.3);
}

.success-animation[b-jp2ufpi7gs] {
    margin-bottom: 24px;
}

.success-circle[b-jp2ufpi7gs] {
    width: 100px;
    height: 100px;
    background: linear-gradient(135deg, #22c55e, #16a34a);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: scaleIn-b-jp2ufpi7gs 0.3s ease-out;
}

.success-circle i[b-jp2ufpi7gs] {
    font-size: 3rem;
    color: white;
    animation: checkIn-b-jp2ufpi7gs 0.4s ease-out 0.2s both;
}

@keyframes scaleIn-b-jp2ufpi7gs {
    from {
        transform: scale(0);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes checkIn-b-jp2ufpi7gs {
    from {
        transform: scale(0) rotate(-45deg);
        opacity: 0;
    }
    to {
        transform: scale(1) rotate(0);
        opacity: 1;
    }
}

.claim-success h2[b-jp2ufpi7gs] {
    font-size: 1.75rem;
    font-weight: 700;
    margin: 0 0 8px 0;
    color: #22c55e;
}

.success-message[b-jp2ufpi7gs] {
    color: rgba(255, 255, 255, 0.7);
    margin: 0 0 24px 0;
}

.claim-summary[b-jp2ufpi7gs] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 24px;
}

.summary-item[b-jp2ufpi7gs] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 12px 16px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 8px;
}

.summary-item i[b-jp2ufpi7gs] {
    color: rgba(255, 255, 255, 0.5);
}

.summary-item.highlight[b-jp2ufpi7gs] {
    background: rgba(34, 197, 94, 0.15);
    border: 1px solid rgba(34, 197, 94, 0.3);
}

.summary-item.highlight i[b-jp2ufpi7gs] {
    color: #22c55e;
}

.personal-bests[b-jp2ufpi7gs] {
    width: 100%;
    padding: 16px;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 12px;
    margin-top: 8px;
}

.personal-bests h4[b-jp2ufpi7gs] {
    font-size: 0.9rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(255, 255, 255, 0.5);
    margin: 0 0 12px 0;
}

.pb-item[b-jp2ufpi7gs] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.pb-item:last-child[b-jp2ufpi7gs] {
    border-bottom: none;
}

.pb-item i[b-jp2ufpi7gs] {
    color: #f59e0b;
}

.view-results-btn[b-jp2ufpi7gs] {
    width: 100%;
    padding: 16px 24px;
    font-size: 1.1rem;
    font-weight: 600;
    background: linear-gradient(135deg, #3b82f6, #8b5cf6);
    color: white;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: all 0.2s ease;
}

.view-results-btn:hover[b-jp2ufpi7gs] {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(59, 130, 246, 0.3);
}

/* Gamification Summary */
.gamification-summary[b-jp2ufpi7gs] {
    width: 100%;
    margin: 16px 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.gamification-section[b-jp2ufpi7gs] {
    padding: 16px;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 12px;
    text-align: left;
}

.gamification-section h4[b-jp2ufpi7gs] {
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(255, 255, 255, 0.5);
    margin: 0 0 12px 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

.badges-earned[b-jp2ufpi7gs] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.badge-item[b-jp2ufpi7gs] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: rgba(111, 66, 193, 0.15);
    border-radius: 8px;
    border: 1px solid rgba(111, 66, 193, 0.3);
}

.badge-icon[b-jp2ufpi7gs] {
    font-size: 1.25rem;
    color: #a78bfa;
}

.badge-info[b-jp2ufpi7gs] {
    display: flex;
    flex-direction: column;
}

.badge-info strong[b-jp2ufpi7gs] {
    font-size: 0.9rem;
}

.badge-xp[b-jp2ufpi7gs] {
    font-size: 0.8rem;
    color: #fbbf24;
}

.xp-summary[b-jp2ufpi7gs] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.level-badge[b-jp2ufpi7gs] {
    background: linear-gradient(135deg, #ffd700, #ffaa00);
    color: #1a1a2e;
    font-weight: 700;
    font-size: 0.85rem;
    padding: 6px 14px;
    border-radius: 20px;
    white-space: nowrap;
}

.xp-progress[b-jp2ufpi7gs] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.xp-bar[b-jp2ufpi7gs] {
    height: 8px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    overflow: hidden;
}

.xp-fill[b-jp2ufpi7gs] {
    height: 100%;
    background: linear-gradient(90deg, #ffd700, #ffaa00);
    border-radius: 4px;
    transition: width 0.5s ease;
}

.xp-text[b-jp2ufpi7gs] {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.5);
}

.streak-status[b-jp2ufpi7gs] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.streak-count[b-jp2ufpi7gs] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #fb923c;
}

.streak-warning[b-jp2ufpi7gs] {
    font-size: 0.8rem;
    color: #ef4444;
}

/* Share Section */
.share-section[b-jp2ufpi7gs] {
    width: 100%;
    margin: 16px 0;
    padding: 16px;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 12px;
    text-align: center;
}

.share-section h4[b-jp2ufpi7gs] {
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(255, 255, 255, 0.5);
    margin: 0 0 12px 0;
}

.qr-container[b-jp2ufpi7gs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.qr-code[b-jp2ufpi7gs] {
    width: 150px;
    height: 150px;
    border-radius: 8px;
    background: white;
    padding: 8px;
}

.share-text[b-jp2ufpi7gs] {
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.4);
    margin: 0;
}

/* Claim Actions */
.claim-actions[b-jp2ufpi7gs] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 8px;
}

.book-next-btn[b-jp2ufpi7gs] {
    width: 100%;
    padding: 14px 24px;
    font-size: 1rem;
    font-weight: 600;
    background: linear-gradient(135deg, #22c55e, #16a34a);
    color: white;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: all 0.2s ease;
    text-decoration: none;
}

.book-next-btn:hover[b-jp2ufpi7gs] {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(34, 197, 94, 0.3);
    color: white;
    text-decoration: none;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Displays/ContestLeaderboardDisplay.razor.rz.scp.css */
/* 
 * ContestLeaderboardDisplay.razor.css
 * Contest/competition standings styling
 * Scales to fill any screen size for public displays
 */

/* ===== CSS Variables (Defaults) ===== */
.contest-leaderboard[b-c6jdxs3n1t] {
    --clb-bg: #1a1a2e;
    --clb-surface: #16213e;
    --clb-text: #ffffff;
    --clb-text-muted: #a0a0a0;
    --clb-primary: #f59e0b;
    --clb-leader-bg: rgba(255, 215, 0, 0.15);
    --clb-best: #a855f7;
    --clb-pos-gain: #22c55e;
    --clb-pos-lost: #ef4444;
    --clb-border: rgba(255, 255, 255, 0.1);
    --clb-font: 'Roboto Condensed', 'Segoe UI', sans-serif;
    --clb-header-font: 'Roboto Condensed', 'Segoe UI', sans-serif;
    
    /* Scaling factor based on viewport - adjust for different screen sizes */
    --clb-scale: clamp(0.75, 0.5 + 0.5vw, 1.5);
    
    font-family: var(--clb-font);
    background: var(--clb-bg);
    color: var(--clb-text);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    
    /* Fill available space - both width and height */
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    min-height: 0;
}

/* ===== Header ===== */
.leaderboard-header[b-c6jdxs3n1t] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: calc(16px * var(--clb-scale)) calc(20px * var(--clb-scale));
    background: var(--clb-surface);
    border-bottom: 2px solid var(--clb-primary);
    flex-shrink: 0;
}

.contest-info[b-c6jdxs3n1t] {
    display: flex;
    align-items: center;
    gap: calc(12px * var(--clb-scale));
}

.contest-name[b-c6jdxs3n1t] {
    font-family: var(--clb-header-font);
    font-size: clamp(1.2rem, calc(1.5rem * var(--clb-scale)), 2.5rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.contest-type.badge[b-c6jdxs3n1t] {
    font-size: clamp(0.65rem, calc(0.75rem * var(--clb-scale)), 1.1rem);
    font-weight: 600;
    padding: calc(4px * var(--clb-scale)) calc(10px * var(--clb-scale));
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.contest-status[b-c6jdxs3n1t] {
    display: flex;
    align-items: center;
    gap: calc(12px * var(--clb-scale));
}

.track-info[b-c6jdxs3n1t] {
    font-size: clamp(0.75rem, calc(0.9rem * var(--clb-scale)), 1.3rem);
    color: var(--clb-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

/* ===== Status Badges ===== */
.status-badge[b-c6jdxs3n1t] {
    font-size: clamp(0.65rem, calc(0.75rem * var(--clb-scale)), 1.1rem);
    font-weight: 600;
    padding: calc(4px * var(--clb-scale)) calc(10px * var(--clb-scale));
    border-radius: 4px;
    text-transform: uppercase;
}

.status-badge.status-draft[b-c6jdxs3n1t] {
    background: #6b7280;
    color: #fff;
}

.status-badge.status-published[b-c6jdxs3n1t] {
    background: #3b82f6;
    color: #fff;
}

.status-badge.status-active[b-c6jdxs3n1t] {
    background: #22c55e;
    color: #fff;
    animation: activePulse-b-c6jdxs3n1t 2s ease-in-out infinite;
}

.status-badge.status-closed[b-c6jdxs3n1t] {
    background: #f59e0b;
    color: #000;
}

.status-badge.status-completed[b-c6jdxs3n1t] {
    background: #8b5cf6;
    color: #fff;
}

.status-badge.status-cancelled[b-c6jdxs3n1t] {
    background: #ef4444;
    color: #fff;
}

@keyframes activePulse-b-c6jdxs3n1t {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.8; }
}

/* ===== Contest Details ===== */
.contest-details[b-c6jdxs3n1t] {
    display: flex;
    justify-content: center;
    gap: calc(24px * var(--clb-scale));
    padding: calc(12px * var(--clb-scale)) calc(20px * var(--clb-scale));
    background: rgba(0, 0, 0, 0.2);
    border-bottom: 1px solid var(--clb-border);
    flex-shrink: 0;
}

.detail-item[b-c6jdxs3n1t] {
    display: flex;
    align-items: center;
    gap: calc(8px * var(--clb-scale));
    font-size: clamp(0.75rem, calc(0.85rem * var(--clb-scale)), 1.2rem);
    color: var(--clb-text-muted);
}

.detail-item i[b-c6jdxs3n1t] {
    color: var(--clb-primary);
}

/* ===== Column Headers ===== */
.leaderboard-columns[b-c6jdxs3n1t] {
    display: grid;
    grid-template-columns: minmax(60px, 80px) 1fr minmax(100px, 120px) minmax(80px, 100px) minmax(60px, 80px);
    padding: calc(10px * var(--clb-scale)) calc(20px * var(--clb-scale));
    background: rgba(0, 0, 0, 0.3);
    font-size: clamp(0.65rem, calc(0.75rem * var(--clb-scale)), 1rem);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--clb-text-muted);
    border-bottom: 1px solid var(--clb-border);
    flex-shrink: 0;
}

.leaderboard-columns > div[b-c6jdxs3n1t] {
    padding: 0 calc(4px * var(--clb-scale));
}

.col-rank[b-c6jdxs3n1t] { text-align: center; }
.col-time[b-c6jdxs3n1t], .col-gap[b-c6jdxs3n1t], .col-attempts[b-c6jdxs3n1t], .col-points[b-c6jdxs3n1t] { text-align: right; }

/* Adjust grid when points column is shown */
.contest-leaderboard:has(.col-points) .leaderboard-columns[b-c6jdxs3n1t],
.contest-leaderboard:has(.col-points) .leaderboard-row[b-c6jdxs3n1t] {
    grid-template-columns: minmax(60px, 80px) 1fr minmax(100px, 120px) minmax(80px, 100px) minmax(60px, 80px) minmax(60px, 80px);
}

/* ===== Entries Container ===== */
.leaderboard-entries[b-c6jdxs3n1t] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.leaderboard-entries.auto-scroll[b-c6jdxs3n1t] {
    animation: autoScroll 30s linear infinite;
}

.leaderboard-entries[b-c6jdxs3n1t]::-webkit-scrollbar {
    width: 4px;
}

.leaderboard-entries[b-c6jdxs3n1t]::-webkit-scrollbar-track {
    background: transparent;
}

.leaderboard-entries[b-c6jdxs3n1t]::-webkit-scrollbar-thumb {
    background: var(--clb-border);
    border-radius: 2px;
}

/* ===== Leaderboard Row ===== */
.leaderboard-row[b-c6jdxs3n1t] {
    display: grid;
    grid-template-columns: minmax(60px, 80px) 1fr minmax(100px, 120px) minmax(80px, 100px) minmax(60px, 80px);
    padding: calc(12px * var(--clb-scale)) calc(20px * var(--clb-scale));
    border-bottom: 1px solid var(--clb-border);
    transition: all 0.3s ease;
    align-items: center;
}

.leaderboard-row:hover[b-c6jdxs3n1t] {
    background: rgba(255, 255, 255, 0.05);
}

.leaderboard-row.leader[b-c6jdxs3n1t] {
    background: var(--clb-leader-bg);
}

.leaderboard-row.podium[b-c6jdxs3n1t] {
    border-left: 3px solid transparent;
}

.leaderboard-row.leader[b-c6jdxs3n1t] {
    border-left-color: #ffd700;
}

.leaderboard-row.podium:nth-child(2)[b-c6jdxs3n1t] {
    border-left-color: #c0c0c0;
}

.leaderboard-row.podium:nth-child(3)[b-c6jdxs3n1t] {
    border-left-color: #cd7f32;
}

.leaderboard-row.prize-position[b-c6jdxs3n1t] {
    background: rgba(245, 158, 11, 0.1);
}

.leaderboard-row.rank-gained[b-c6jdxs3n1t] {
    animation: slideFromTop-b-c6jdxs3n1t 0.5s ease;
}

.leaderboard-row.rank-lost[b-c6jdxs3n1t] {
    animation: slideFromBottom-b-c6jdxs3n1t 0.5s ease;
}

@keyframes slideFromTop-b-c6jdxs3n1t {
    from {
        transform: translateY(-50%);
        opacity: 0;
        background: rgba(34, 197, 94, 0.2);
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes slideFromBottom-b-c6jdxs3n1t {
    from {
        transform: translateY(50%);
        opacity: 0;
        background: rgba(239, 68, 68, 0.2);
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* ===== Rank Column ===== */
.col-rank[b-c6jdxs3n1t] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(4px * var(--clb-scale));
}

.rank-number[b-c6jdxs3n1t] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: clamp(28px, calc(32px * var(--clb-scale)), 48px);
    height: clamp(28px, calc(32px * var(--clb-scale)), 48px);
    font-size: clamp(0.9rem, calc(1.1rem * var(--clb-scale)), 1.6rem);
    font-weight: 700;
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.1);
}

.rank-number.rank-1[b-c6jdxs3n1t] {
    background: linear-gradient(135deg, #ffd700, #ffec8b);
    color: #000;
}

.rank-number.rank-2[b-c6jdxs3n1t] {
    background: linear-gradient(135deg, #c0c0c0, #e8e8e8);
    color: #000;
}

.rank-number.rank-3[b-c6jdxs3n1t] {
    background: linear-gradient(135deg, #cd7f32, #daa06d);
    color: #000;
}

.rank-change[b-c6jdxs3n1t] {
    display: flex;
    align-items: center;
    gap: 2px;
    font-size: clamp(0.6rem, calc(0.7rem * var(--clb-scale)), 1rem);
    font-weight: 600;
}

.rank-change.gained[b-c6jdxs3n1t] {
    color: var(--clb-pos-gain);
}

.rank-change.lost[b-c6jdxs3n1t] {
    color: var(--clb-pos-lost);
}

.prize-indicator[b-c6jdxs3n1t] {
    color: var(--clb-primary);
    font-size: clamp(0.7rem, calc(0.8rem * var(--clb-scale)), 1.1rem);
    animation: prizeGlow-b-c6jdxs3n1t 2s ease-in-out infinite;
}

@keyframes prizeGlow-b-c6jdxs3n1t {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* ===== Driver Column ===== */
.col-driver[b-c6jdxs3n1t] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 0 calc(8px * var(--clb-scale));
    overflow: hidden;
}

.driver-name[b-c6jdxs3n1t] {
    font-weight: 600;
    font-size: clamp(0.85rem, calc(1rem * var(--clb-scale)), 1.5rem);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.vehicle-name[b-c6jdxs3n1t] {
    font-size: clamp(0.65rem, calc(0.75rem * var(--clb-scale)), 1rem);
    color: var(--clb-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ===== Time Column ===== */
.col-time[b-c6jdxs3n1t] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: calc(6px * var(--clb-scale));
    text-align: right;
    padding: 0 calc(8px * var(--clb-scale));
    font-family: 'Roboto Mono', 'Consolas', monospace;
    font-size: clamp(0.8rem, calc(0.95rem * var(--clb-scale)), 1.4rem);
}

.col-time.best-time[b-c6jdxs3n1t] {
    color: var(--clb-best);
    font-weight: 700;
}

.time-value[b-c6jdxs3n1t] {
    font-weight: 500;
}

.leader-indicator[b-c6jdxs3n1t] {
    color: #ffd700;
    font-size: clamp(0.6rem, calc(0.7rem * var(--clb-scale)), 1rem);
}

/* ===== Gap Column ===== */
.col-gap[b-c6jdxs3n1t] {
    text-align: right;
    padding: 0 calc(8px * var(--clb-scale));
    font-family: 'Roboto Mono', 'Consolas', monospace;
    font-size: clamp(0.75rem, calc(0.9rem * var(--clb-scale)), 1.3rem);
    color: var(--clb-text-muted);
}

.leader-text[b-c6jdxs3n1t] {
    color: var(--clb-primary);
    font-weight: 600;
    font-size: clamp(0.7rem, calc(0.8rem * var(--clb-scale)), 1.1rem);
}

/* ===== Attempts Column ===== */
.col-attempts[b-c6jdxs3n1t] {
    text-align: center;
    font-size: clamp(0.75rem, calc(0.9rem * var(--clb-scale)), 1.3rem);
    color: var(--clb-text-muted);
}

/* ===== Points Column ===== */
.col-points[b-c6jdxs3n1t] {
    text-align: right;
    padding: 0 calc(8px * var(--clb-scale));
}

.points-value[b-c6jdxs3n1t] {
    font-weight: 600;
    font-size: clamp(0.85rem, calc(1rem * var(--clb-scale)), 1.5rem);
    color: var(--clb-primary);
}

/* ===== No Entries State ===== */
.no-entries[b-c6jdxs3n1t] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: calc(60px * var(--clb-scale)) calc(20px * var(--clb-scale));
    color: var(--clb-text-muted);
    gap: calc(12px * var(--clb-scale));
    flex: 1;
}

.no-entries i[b-c6jdxs3n1t] {
    font-size: clamp(2rem, calc(3rem * var(--clb-scale)), 5rem);
    opacity: 0.5;
}

.no-entries small[b-c6jdxs3n1t] {
    font-size: clamp(0.75rem, calc(0.85rem * var(--clb-scale)), 1.2rem);
    opacity: 0.7;
}

/* ===== Footer ===== */
.leaderboard-footer[b-c6jdxs3n1t] {
    padding: calc(8px * var(--clb-scale)) calc(20px * var(--clb-scale));
    background: rgba(0, 0, 0, 0.3);
    text-align: right;
    flex-shrink: 0;
}

.update-time[b-c6jdxs3n1t] {
    font-size: clamp(0.65rem, calc(0.75rem * var(--clb-scale)), 1rem);
    color: var(--clb-text-muted);
}

/* ===== Responsive Adjustments ===== */
@media (max-width: 768px) {
    .leaderboard-columns[b-c6jdxs3n1t],
    .leaderboard-row[b-c6jdxs3n1t] {
        grid-template-columns: 60px 1fr 100px 70px;
    }
    
    .col-attempts[b-c6jdxs3n1t],
    .leaderboard-columns > .col-attempts[b-c6jdxs3n1t] {
        display: none;
    }
    
    .vehicle-name[b-c6jdxs3n1t] {
        display: none;
    }
    
    .contest-details[b-c6jdxs3n1t] {
        flex-wrap: wrap;
        gap: 12px;
    }
}

@media (max-width: 480px) {
    .leaderboard-columns[b-c6jdxs3n1t],
    .leaderboard-row[b-c6jdxs3n1t] {
        grid-template-columns: 50px 1fr 90px;
    }
    
    .col-gap[b-c6jdxs3n1t],
    .leaderboard-columns > .col-gap[b-c6jdxs3n1t] {
        display: none;
    }
    
    .leaderboard-header[b-c6jdxs3n1t] {
        flex-direction: column;
        gap: 8px;
        text-align: center;
    }
    
    .contest-info[b-c6jdxs3n1t] {
        flex-direction: column;
        gap: 4px;
    }
    
    .contest-details[b-c6jdxs3n1t] {
        flex-direction: column;
        gap: 8px;
    }
}

/* ===== Large Display Scaling ===== */
@media (min-width: 1920px) {
    .contest-leaderboard[b-c6jdxs3n1t] {
        --clb-scale: 1.25;
    }
}

@media (min-width: 2560px) {
    .contest-leaderboard[b-c6jdxs3n1t] {
        --clb-scale: 1.5;
    }
}

@media (min-width: 3840px) {
    .contest-leaderboard[b-c6jdxs3n1t] {
        --clb-scale: 2;
    }
}

/* ===== Fullscreen/Kiosk Mode ===== */
.contest-leaderboard:fullscreen[b-c6jdxs3n1t],
.contest-leaderboard:-webkit-full-screen[b-c6jdxs3n1t] {
    border-radius: 0;
    height: 100vh;
    width: 100vw;
}

/* ===== Group Event Banner ===== */
.group-event-banner[b-c6jdxs3n1t] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.25rem;
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.15) 0%, rgba(184, 134, 11, 0.1) 100%);
    border-bottom: 2px solid rgba(255, 193, 7, 0.3);
}

.group-event-banner__icon[b-c6jdxs3n1t] {
    font-size: 1.5rem;
    color: #ffc107;
    flex-shrink: 0;
}

.group-event-banner__info[b-c6jdxs3n1t] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.group-event-banner__label[b-c6jdxs3n1t] {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: rgba(255, 255, 255, 0.6);
    text-transform: uppercase;
}

.group-event-banner__name[b-c6jdxs3n1t] {
    font-size: 1.125rem;
    font-weight: 700;
    color: #ffffff;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.group-event-banner__live-badge[b-c6jdxs3n1t] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.625rem;
    border-radius: 1rem;
    background: rgba(25, 135, 84, 0.2);
    color: #4ade80;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    flex-shrink: 0;
}

.group-event-banner__live-dot[b-c6jdxs3n1t] {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: #4ade80;
    animation: group-event-live-pulse-b-c6jdxs3n1t 1.5s ease-in-out infinite;
}

@keyframes group-event-live-pulse-b-c6jdxs3n1t {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.4; transform: scale(0.8); }
}

/* Group event mode accent override */
.contest-leaderboard--group-event .leaderboard-header[b-c6jdxs3n1t] {
    border-bottom-color: rgba(255, 193, 7, 0.2);
}


/* ===== G.6.8 — kd-* chip vocabulary (PublicDisplays variant) ===== */
.contest-leaderboard .kd-series-chip[b-c6jdxs3n1t],
.contest-leaderboard .kd-round-chip[b-c6jdxs3n1t] {
    display: inline-flex;
    align-items: center;
    padding: calc(4px * var(--clb-scale)) calc(10px * var(--clb-scale));
    font-size: clamp(0.7rem, calc(0.8rem * var(--clb-scale)), 1.1rem);
    font-weight: 600;
    line-height: 1;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.contest-leaderboard .kd-series-chip[b-c6jdxs3n1t] {
    background: rgba(245, 158, 11, 0.18);
    color: var(--clb-primary);
    border: 1px solid rgba(245, 158, 11, 0.45);
}

.contest-leaderboard .kd-round-chip[b-c6jdxs3n1t] {
    background: rgba(168, 85, 247, 0.18);
    color: var(--clb-best);
    border: 1px solid rgba(168, 85, 247, 0.45);
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Displays/RaceLeaderboardDisplay.razor.rz.scp.css */
/* 
 * RaceLeaderboardDisplay.razor.css
 * F1-style race leaderboard styling
 * Scales to fill any screen size for public displays
 */

/* ===== CSS Variables (Defaults) ===== */
.race-leaderboard[b-igaa9y9tlt] {
    --lb-bg: #1a1a2e;
    --lb-surface: #16213e;
    --lb-text: #ffffff;
    --lb-text-muted: #a0a0a0;
    --lb-primary: #e10600;
    --lb-leader-bg: rgba(255, 215, 0, 0.15);
    --lb-session-best: #a855f7;
    --lb-personal-best: #22c55e;
    --lb-pos-gain: #22c55e;
    --lb-pos-lost: #ef4444;
    --lb-border: rgba(255, 255, 255, 0.1);
    --lb-font: 'Roboto Condensed', 'Segoe UI', sans-serif;
    --lb-header-font: 'Roboto Condensed', 'Segoe UI', sans-serif;
    
    /* Scaling factor based on viewport - adjust for different screen sizes */
    --lb-scale: clamp(0.75, 0.5 + 0.5vw, 1.5);
    
    font-family: var(--lb-font);
    background: var(--lb-bg);
    color: var(--lb-text);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    
    /* Fill available space - both width and height */
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    min-height: 0;
}

/* ===== Header ===== */
.leaderboard-header[b-igaa9y9tlt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    padding: calc(16px * var(--lb-scale)) calc(20px * var(--lb-scale));
    background: var(--lb-surface);
    border-bottom: 2px solid var(--lb-primary);
    flex-shrink: 0;
}

/* G.6.12 — kd-* chip vocabulary */
.series-row[b-igaa9y9tlt] {
    flex: 1 0 100%;
    display: flex;
    gap: calc(8px * var(--lb-scale));
    flex-wrap: wrap;
    margin-bottom: calc(8px * var(--lb-scale));
}

.kd-series-chip[b-igaa9y9tlt],
.kd-round-chip[b-igaa9y9tlt] {
    display: inline-flex;
    align-items: center;
    padding: calc(4px * var(--lb-scale)) calc(10px * var(--lb-scale));
    font-size: clamp(0.7rem, calc(0.85rem * var(--lb-scale)), 1.1rem);
    font-weight: 700;
    line-height: 1;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
    border: 1px solid transparent;
}

.kd-series-chip[b-igaa9y9tlt] {
    background: rgba(245, 158, 11, 0.18);
    color: #ffc857;
    border-color: rgba(245, 158, 11, 0.45);
}

.kd-round-chip[b-igaa9y9tlt] {
    background: rgba(168, 85, 247, 0.18);
    color: #d8b4fe;
    border-color: rgba(168, 85, 247, 0.45);
}

.session-info[b-igaa9y9tlt] {
    display: flex;
    align-items: center;
    gap: calc(16px * var(--lb-scale));
}

.session-name[b-igaa9y9tlt] {
    font-family: var(--lb-header-font);
    font-size: clamp(1.2rem, calc(1.5rem * var(--lb-scale)), 2.5rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.lap-counter[b-igaa9y9tlt],
.time-remaining[b-igaa9y9tlt] {
    font-size: clamp(1rem, calc(1.25rem * var(--lb-scale)), 2rem);
    font-weight: 600;
    padding: calc(4px * var(--lb-scale)) calc(12px * var(--lb-scale));
    background: rgba(255, 255, 255, 0.1);
    border-radius: 4px;
}

.session-status[b-igaa9y9tlt] {
    display: flex;
    align-items: center;
    gap: calc(12px * var(--lb-scale));
}

.track-name[b-igaa9y9tlt] {
    font-size: clamp(0.75rem, calc(0.9rem * var(--lb-scale)), 1.3rem);
    color: var(--lb-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

/* ===== Flag Indicators ===== */
.flag-indicator[b-igaa9y9tlt] {
    display: flex;
    align-items: center;
    gap: calc(6px * var(--lb-scale));
    padding: calc(6px * var(--lb-scale)) calc(12px * var(--lb-scale));
    border-radius: 4px;
    font-weight: 600;
    font-size: clamp(0.75rem, calc(0.9rem * var(--lb-scale)), 1.3rem);
    text-transform: uppercase;
    animation: flagPulse-b-igaa9y9tlt 1s ease-in-out infinite;
}

.flag-indicator.flag-yellow[b-igaa9y9tlt] {
    background: #fbbf24;
    color: #000;
}

.flag-indicator.flag-red[b-igaa9y9tlt] {
    background: #dc2626;
    color: #fff;
}

.flag-indicator.flag-safety[b-igaa9y9tlt],
.flag-indicator.flag-vsc[b-igaa9y9tlt] {
    background: #f97316;
    color: #fff;
}

.flag-indicator.flag-checkered[b-igaa9y9tlt] {
    background: linear-gradient(45deg, #000 25%, #fff 25%, #fff 50%, #000 50%, #000 75%, #fff 75%);
    background-size: 10px 10px;
    color: transparent;
    padding: calc(8px * var(--lb-scale)) calc(16px * var(--lb-scale));
}

@keyframes flagPulse-b-igaa9y9tlt {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

/* ===== Column Headers ===== */
.leaderboard-columns[b-igaa9y9tlt] {
    display: grid;
    grid-template-columns: minmax(60px, 80px) 1fr minmax(80px, 100px) minmax(80px, 100px) minmax(80px, 100px) minmax(50px, 60px);
    padding: calc(10px * var(--lb-scale)) calc(20px * var(--lb-scale));
    background: rgba(0, 0, 0, 0.3);
    font-size: clamp(0.65rem, calc(0.75rem * var(--lb-scale)), 1rem);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--lb-text-muted);
    border-bottom: 1px solid var(--lb-border);
    flex-shrink: 0;
}

.leaderboard-columns > div[b-igaa9y9tlt] {
    padding: 0 calc(4px * var(--lb-scale));
}

.col-pos[b-igaa9y9tlt] { text-align: center; }
.col-gap[b-igaa9y9tlt], .col-time[b-igaa9y9tlt], .col-pits[b-igaa9y9tlt] { text-align: right; }

/* ===== Entries Container ===== */
.leaderboard-entries[b-igaa9y9tlt] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.leaderboard-entries.auto-scroll[b-igaa9y9tlt] {
    animation: autoScroll-b-igaa9y9tlt 30s linear infinite;
}

@keyframes autoScroll-b-igaa9y9tlt {
    0%, 10% { transform: translateY(0); }
    90%, 100% { transform: translateY(calc(-100% + 600px)); }
}

.leaderboard-entries[b-igaa9y9tlt]::-webkit-scrollbar {
    width: 4px;
}

.leaderboard-entries[b-igaa9y9tlt]::-webkit-scrollbar-track {
    background: transparent;
}

.leaderboard-entries[b-igaa9y9tlt]::-webkit-scrollbar-thumb {
    background: var(--lb-border);
    border-radius: 2px;
}

/* ===== Leaderboard Row ===== */
.leaderboard-row[b-igaa9y9tlt] {
    display: grid;
    grid-template-columns: minmax(60px, 80px) 1fr minmax(80px, 100px) minmax(80px, 100px) minmax(80px, 100px) minmax(50px, 60px);
    padding: calc(12px * var(--lb-scale)) calc(20px * var(--lb-scale));
    border-bottom: 1px solid var(--lb-border);
    transition: all 0.3s ease;
    align-items: center;
}

.leaderboard-row:hover[b-igaa9y9tlt] {
    background: rgba(255, 255, 255, 0.05);
}

.leaderboard-row.leader[b-igaa9y9tlt] {
    background: var(--lb-leader-bg);
}

.leaderboard-row.podium[b-igaa9y9tlt] {
    border-left: 3px solid transparent;
}

.leaderboard-row.leader[b-igaa9y9tlt] {
    border-left-color: #ffd700;
}

.leaderboard-row.podium:nth-child(2)[b-igaa9y9tlt] {
    border-left-color: #c0c0c0;
}

.leaderboard-row.podium:nth-child(3)[b-igaa9y9tlt] {
    border-left-color: #cd7f32;
}

.leaderboard-row.position-gained[b-igaa9y9tlt] {
    animation: slideFromTop-b-igaa9y9tlt 0.5s ease;
}

.leaderboard-row.position-lost[b-igaa9y9tlt] {
    animation: slideFromBottom-b-igaa9y9tlt 0.5s ease;
}

.leaderboard-row.in-pits[b-igaa9y9tlt] {
    opacity: 0.7;
}

.leaderboard-row.out[b-igaa9y9tlt] {
    opacity: 0.5;
    text-decoration: line-through;
}

@keyframes slideFromTop-b-igaa9y9tlt {
    from {
        transform: translateY(-100%);
        opacity: 0;
        background: rgba(34, 197, 94, 0.2);
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes slideFromBottom-b-igaa9y9tlt {
    from {
        transform: translateY(100%);
        opacity: 0;
        background: rgba(239, 68, 68, 0.2);
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* ===== Position Column ===== */
.col-pos[b-igaa9y9tlt] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(4px * var(--lb-scale));
}

.position-number[b-igaa9y9tlt] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: clamp(28px, calc(32px * var(--lb-scale)), 48px);
    height: clamp(28px, calc(32px * var(--lb-scale)), 48px);
    font-size: clamp(0.9rem, calc(1.1rem * var(--lb-scale)), 1.6rem);
    font-weight: 700;
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.1);
}

.position-number.p1[b-igaa9y9tlt] {
    background: linear-gradient(135deg, #ffd700, #ffec8b);
    color: #000;
}

.position-number.p2[b-igaa9y9tlt] {
    background: linear-gradient(135deg, #c0c0c0, #e8e8e8);
    color: #000;
}

.position-number.p3[b-igaa9y9tlt] {
    background: linear-gradient(135deg, #cd7f32, #daa06d);
    color: #000;
}

.position-change[b-igaa9y9tlt] {
    display: flex;
    align-items: center;
    gap: 2px;
    font-size: clamp(0.6rem, calc(0.7rem * var(--lb-scale)), 1rem);
    font-weight: 600;
}

.position-change.gained[b-igaa9y9tlt] {
    color: var(--lb-pos-gain);
}

.position-change.lost[b-igaa9y9tlt] {
    color: var(--lb-pos-lost);
}

/* ===== Driver Column ===== */
.col-driver[b-igaa9y9tlt] {
    display: flex;
    align-items: center;
    gap: calc(10px * var(--lb-scale));
    padding: 0 calc(8px * var(--lb-scale));
    overflow: hidden;
}

.car-number[b-igaa9y9tlt] {
    font-size: clamp(0.7rem, calc(0.8rem * var(--lb-scale)), 1.1rem);
    font-weight: 600;
    padding: calc(2px * var(--lb-scale)) calc(6px * var(--lb-scale));
    background: rgba(255, 255, 255, 0.15);
    border-radius: 3px;
    min-width: clamp(28px, calc(32px * var(--lb-scale)), 48px);
    text-align: center;
}

.driver-name[b-igaa9y9tlt] {
    font-weight: 600;
    font-size: clamp(0.85rem, calc(1rem * var(--lb-scale)), 1.5rem);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.team-name[b-igaa9y9tlt] {
    font-size: clamp(0.65rem, calc(0.75rem * var(--lb-scale)), 1rem);
    color: var(--lb-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.driver-status[b-igaa9y9tlt] {
    font-size: clamp(0.55rem, calc(0.65rem * var(--lb-scale)), 0.9rem);
    font-weight: 700;
    padding: calc(2px * var(--lb-scale)) calc(6px * var(--lb-scale));
    border-radius: 3px;
    text-transform: uppercase;
}

.driver-status.inpits[b-igaa9y9tlt] {
    background: #3b82f6;
    color: #fff;
}

.driver-status.dnf[b-igaa9y9tlt],
.driver-status.dsq[b-igaa9y9tlt] {
    background: #dc2626;
    color: #fff;
}

.driver-status.finished[b-igaa9y9tlt] {
    background: #22c55e;
    color: #fff;
}

/* ===== Timing Columns ===== */
.col-gap[b-igaa9y9tlt],
.col-time[b-igaa9y9tlt] {
    text-align: right;
    padding: 0 calc(8px * var(--lb-scale));
    font-family: 'Roboto Mono', 'Consolas', monospace;
    font-size: clamp(0.8rem, calc(0.95rem * var(--lb-scale)), 1.4rem);
}

.col-time[b-igaa9y9tlt] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: calc(4px * var(--lb-scale));
}

.col-time.session-best[b-igaa9y9tlt] {
    color: var(--lb-session-best);
    font-weight: 700;
}

.col-time.personal-best[b-igaa9y9tlt] {
    color: var(--lb-personal-best);
    font-weight: 600;
}

.session-best-indicator[b-igaa9y9tlt] {
    color: var(--lb-session-best);
    font-size: clamp(0.6rem, calc(0.7rem * var(--lb-scale)), 1rem);
}

.personal-best-indicator[b-igaa9y9tlt] {
    color: var(--lb-personal-best);
    font-size: clamp(0.6rem, calc(0.7rem * var(--lb-scale)), 1rem);
}

.interval[b-igaa9y9tlt] {
    font-weight: 500;
}

/* ===== Pits Column ===== */
.col-pits[b-igaa9y9tlt] {
    text-align: center;
    font-size: clamp(0.75rem, calc(0.9rem * var(--lb-scale)), 1.3rem);
}

.pit-indicator[b-igaa9y9tlt] {
    font-size: clamp(0.6rem, calc(0.7rem * var(--lb-scale)), 1rem);
    font-weight: 700;
    padding: calc(2px * var(--lb-scale)) calc(6px * var(--lb-scale));
    background: #3b82f6;
    color: #fff;
    border-radius: 3px;
    animation: pitPulse-b-igaa9y9tlt 1s ease-in-out infinite;
}

@keyframes pitPulse-b-igaa9y9tlt {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}

/* ===== No Entries State ===== */
.no-entries[b-igaa9y9tlt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: calc(80px * var(--lb-scale)) calc(20px * var(--lb-scale));
    color: var(--lb-text-muted);
    gap: calc(20px * var(--lb-scale));
    flex: 1;
    min-height: 300px;
}

.awaiting-data-content[b-igaa9y9tlt] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: clamp(80px, calc(100px * var(--lb-scale)), 150px);
    height: clamp(80px, calc(100px * var(--lb-scale)), 150px);
}

.awaiting-data-content i[b-igaa9y9tlt] {
    font-size: clamp(2rem, calc(3rem * var(--lb-scale)), 5rem);
    color: var(--lb-primary);
    z-index: 1;
    animation: iconPulse-b-igaa9y9tlt 2s ease-in-out infinite;
}

.pulse-ring[b-igaa9y9tlt] {
    position: absolute;
    width: 100%;
    height: 100%;
    border: 2px solid var(--lb-primary);
    border-radius: 50%;
    animation: pulseRing-b-igaa9y9tlt 2s ease-out infinite;
}

.pulse-ring[b-igaa9y9tlt]::before,
.pulse-ring[b-igaa9y9tlt]::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border: 2px solid var(--lb-primary);
    border-radius: 50%;
}

.pulse-ring[b-igaa9y9tlt]::before {
    width: 130%;
    height: 130%;
    animation: pulseRing-b-igaa9y9tlt 2s ease-out infinite 0.4s;
}

.pulse-ring[b-igaa9y9tlt]::after {
    width: 160%;
    height: 160%;
    animation: pulseRing-b-igaa9y9tlt 2s ease-out infinite 0.8s;
}

@keyframes pulseRing-b-igaa9y9tlt {
    0% {
        opacity: 0.6;
        transform: translate(-50%, -50%) scale(0.8);
    }
    100% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(1.2);
    }
}

@keyframes iconPulse-b-igaa9y9tlt {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }
    50% {
        opacity: 0.7;
        transform: scale(1.05);
    }
}

.awaiting-text[b-igaa9y9tlt] {
    font-size: clamp(1.2rem, calc(1.5rem * var(--lb-scale)), 2.5rem);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: var(--lb-text-muted);
    animation: textFade-b-igaa9y9tlt 2s ease-in-out infinite;
}

@keyframes textFade-b-igaa9y9tlt {
    0%, 100% { opacity: 0.7; }
    50% { opacity: 1; }
}

/* Legacy support for old no-entries style */
.no-entries > i:not(.bi-broadcast)[b-igaa9y9tlt] {
    font-size: clamp(2rem, calc(3rem * var(--lb-scale)), 5rem);
    opacity: 0.5;
    animation: pulse-b-igaa9y9tlt 2s ease-in-out infinite;
}

@keyframes pulse-b-igaa9y9tlt {
    0%, 100% { opacity: 0.5; transform: scale(1); }
    50% { opacity: 0.8; transform: scale(1.05); }
}

/* ===== Footer ===== */
.leaderboard-footer[b-igaa9y9tlt] {
    padding: calc(8px * var(--lb-scale)) calc(20px * var(--lb-scale));
    background: rgba(0, 0, 0, 0.3);
    text-align: right;
    flex-shrink: 0;
}

.update-time[b-igaa9y9tlt] {
    font-size: clamp(0.65rem, calc(0.75rem * var(--lb-scale)), 1rem);
    color: var(--lb-text-muted);
}

/* ===== Responsive Adjustments ===== */
@media (max-width: 768px) {
    .leaderboard-columns[b-igaa9y9tlt],
    .leaderboard-row[b-igaa9y9tlt] {
        grid-template-columns: 60px 1fr 80px 80px;
    }
    
    .col-pits[b-igaa9y9tlt],
    .leaderboard-columns > .col-pits[b-igaa9y9tlt] {
        display: none;
    }
    
    .team-name[b-igaa9y9tlt] {
        display: none;
    }
}

@media (max-width: 480px) {
    .leaderboard-columns[b-igaa9y9tlt],
    .leaderboard-row[b-igaa9y9tlt] {
        grid-template-columns: 50px 1fr 70px;
    }
    
    .col-time.best-time[b-igaa9y9tlt],
    .leaderboard-columns > div:nth-child(5)[b-igaa9y9tlt] {
        display: none;
    }
    
    .leaderboard-header[b-igaa9y9tlt] {
        flex-direction: column;
        gap: 8px;
        text-align: center;
    }
    
    .session-info[b-igaa9y9tlt] {
        flex-direction: column;
        gap: 4px;
    }
}

/* ===== Large Display Scaling ===== */
@media (min-width: 1920px) {
    .race-leaderboard[b-igaa9y9tlt] {
        --lb-scale: 1.25;
    }
}

@media (min-width: 2560px) {
    .race-leaderboard[b-igaa9y9tlt] {
        --lb-scale: 1.5;
    }
}

@media (min-width: 3840px) {
    .race-leaderboard[b-igaa9y9tlt] {
        --lb-scale: 2;
    }
}

/* ===== Fullscreen/Kiosk Mode ===== */
.race-leaderboard:fullscreen[b-igaa9y9tlt],
.race-leaderboard:-webkit-full-screen[b-igaa9y9tlt] {
    border-radius: 0;
    height: 100vh;
    width: 100vw;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Displays/ScreenContainer.razor.rz.scp.css */
/* 
 * ScreenContainer.razor.css
 * Container styles for display screens
 */

.screen-container[b-hqwj7ucked] {
    --screen-bg: #0f0f1a;
    --screen-text: #ffffff;
    --screen-text-muted: #a0a0a0;
    
    position: relative;
    width: 100%;
    min-height: 100%;
    background: var(--screen-bg);
    color: var(--screen-text);
}

.screen-container.fullscreen[b-hqwj7ucked] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    overflow: auto;
}

.screen-content[b-hqwj7ucked] {
    width: 100%;
    height: 100%;
    padding: 20px;
}

.screen-container.fullscreen .screen-content[b-hqwj7ucked] {
    padding: 40px;
}

/* ===== Connection Status Indicator ===== */
.connection-status[b-hqwj7ucked] {
    position: absolute;
    top: 12px;
    right: 12px;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    z-index: 100;
}

.connection-status.connected[b-hqwj7ucked] {
    background: rgba(34, 197, 94, 0.2);
    color: #22c55e;
}

.connection-status.disconnected[b-hqwj7ucked] {
    background: rgba(239, 68, 68, 0.2);
    color: #ef4444;
    animation: disconnectedPulse-b-hqwj7ucked 2s ease-in-out infinite;
}

@keyframes disconnectedPulse-b-hqwj7ucked {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

.connection-status i[b-hqwj7ucked] {
    font-size: 0.85rem;
}

/* ===== Exit Fullscreen Button ===== */
.exit-fullscreen-btn[b-hqwj7ucked] {
    position: fixed;
    top: 12px;
    left: 12px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.1);
    border: none;
    border-radius: 8px;
    color: var(--screen-text);
    font-size: 1.2rem;
    cursor: pointer;
    opacity: 0.5;
    transition: all 0.2s ease;
    z-index: 10000;
}

.exit-fullscreen-btn:hover[b-hqwj7ucked] {
    background: rgba(255, 255, 255, 0.2);
    opacity: 1;
}

/* ===== Responsive ===== */
@media (max-width: 768px) {
    .screen-content[b-hqwj7ucked] {
        padding: 12px;
    }
    
    .screen-container.fullscreen .screen-content[b-hqwj7ucked] {
        padding: 20px;
    }
    
    .connection-status[b-hqwj7ucked] {
        top: 8px;
        right: 8px;
        padding: 4px 8px;
        font-size: 0.65rem;
    }
    
    .exit-fullscreen-btn[b-hqwj7ucked] {
        top: 8px;
        left: 8px;
        width: 32px;
        height: 32px;
        font-size: 1rem;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/FoodAndBev/CustomerOrder/CustomerCartView.razor.rz.scp.css */
/* Customer Cart Styles */

.co-cart[b-1a38do30kc] {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--co-bg);
}

.co-cart-count[b-1a38do30kc] {
    font-size: 14px;
    color: var(--co-text-muted);
    font-weight: 400;
}

.co-cart-content[b-1a38do30kc] {
    flex: 1;
    overflow-y: auto;
    padding: var(--co-spacing);
    padding-bottom: 100px; /* Space for footer */
}

/* Cart Items */
.co-cart-items[b-1a38do30kc] {
    display: flex;
    flex-direction: column;
    gap: var(--co-spacing);
}

.co-cart-item[b-1a38do30kc] {
    background: var(--co-surface);
    border-radius: var(--co-radius);
    padding: var(--co-spacing);
}

.co-cart-item-main[b-1a38do30kc] {
    display: flex;
    gap: var(--co-spacing);
    margin-bottom: var(--co-spacing);
}

.co-cart-item-info[b-1a38do30kc] {
    flex: 1;
    min-width: 0;
}

.co-cart-item-name[b-1a38do30kc] {
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 6px 0;
    color: var(--co-text);
}

.co-cart-item-modifiers[b-1a38do30kc] {
    font-size: 13px;
    color: var(--co-text-muted);
    margin: 0 0 4px 0;
}

.co-cart-item-instructions[b-1a38do30kc] {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    font-size: 12px;
    color: var(--co-text-muted);
    margin: 0;
    font-style: italic;
}

.co-cart-item-instructions i[b-1a38do30kc] {
    margin-top: 2px;
}

.co-cart-item-price[b-1a38do30kc] {
    font-size: 16px;
    font-weight: 600;
    color: var(--co-text);
    white-space: nowrap;
}

.co-cart-item-actions[b-1a38do30kc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: var(--co-spacing);
    border-top: 1px solid var(--co-border);
}

.co-remove-btn[b-1a38do30kc] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border-radius: var(--co-radius-sm);
    background: transparent;
    border: none;
    color: var(--co-error);
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.co-remove-btn:hover[b-1a38do30kc] {
    background: rgba(239, 68, 68, 0.1);
}

/* Order Summary */
.co-cart-summary[b-1a38do30kc] {
    background: var(--co-surface);
    border-radius: var(--co-radius);
    padding: var(--co-spacing);
    margin-top: var(--co-spacing);
}

.co-summary-row[b-1a38do30kc] {
    display: flex;
    justify-content: space-between;
    padding: 8px 0;
    font-size: 15px;
    color: var(--co-text-muted);
}

.co-summary-total[b-1a38do30kc] {
    font-size: 18px;
    font-weight: 600;
    color: var(--co-text);
}

.co-summary-total span:last-child[b-1a38do30kc] {
    color: var(--co-primary);
}

/* Continue Shopping */
.co-continue-shopping[b-1a38do30kc] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--co-spacing-sm);
    padding: var(--co-spacing);
    margin-top: var(--co-spacing);
    background: transparent;
    border: 2px dashed var(--co-border);
    border-radius: var(--co-radius);
    color: var(--co-text-muted);
    font-size: 15px;
    cursor: pointer;
    width: 100%;
    transition: all 0.2s ease;
}

.co-continue-shopping:hover[b-1a38do30kc] {
    border-color: var(--co-primary);
    color: var(--co-primary);
}

/* Footer */
.co-cart-footer[b-1a38do30kc] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--co-surface);
    padding: var(--co-spacing);
    border-top: 1px solid var(--co-border);
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.1);
    z-index: 100;
}

/* Responsive */
@media (min-width: 768px) {
    .co-cart-footer[b-1a38do30kc] {
        position: sticky;
        box-shadow: none;
    }
    
    .co-cart-content[b-1a38do30kc] {
        padding-bottom: var(--co-spacing);
    }
}

@media (max-width: 480px) {
    .co-cart-item-actions[b-1a38do30kc] {
        flex-direction: column;
        align-items: stretch;
        gap: var(--co-spacing);
    }
    
    .co-cart-item-actions .co-quantity[b-1a38do30kc] {
        justify-content: center;
    }
    
    .co-remove-btn[b-1a38do30kc] {
        justify-content: center;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/FoodAndBev/CustomerOrder/CustomerGuestInfoForm.razor.rz.scp.css */
/* Customer Guest Info Styles */

.co-guest-info[b-xygxdd9wjt] {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--co-bg);
}

.co-guest-content[b-xygxdd9wjt] {
    flex: 1;
    overflow-y: auto;
    padding: var(--co-spacing);
    padding-bottom: 100px; /* Space for footer */
}

/* Table Info Banner */
.co-table-info[b-xygxdd9wjt] {
    display: flex;
    align-items: center;
    gap: var(--co-spacing-sm);
    padding: var(--co-spacing);
    background: rgba(34, 197, 94, 0.1);
    border-radius: var(--co-radius);
    margin-bottom: var(--co-spacing-lg);
    color: var(--co-success);
    font-size: 14px;
}

.co-table-info i[b-xygxdd9wjt] {
    font-size: 18px;
}

.co-table-info strong[b-xygxdd9wjt] {
    color: var(--co-text);
}

/* Form Groups - Using shared styles from container */

/* Party Size Selector */
.co-party-size[b-xygxdd9wjt] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--co-spacing-sm);
    margin-top: var(--co-spacing-sm);
}

.co-party-btn[b-xygxdd9wjt] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 2px solid var(--co-border);
    background: var(--co-surface);
    color: var(--co-text);
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.co-party-btn:hover[b-xygxdd9wjt] {
    border-color: var(--co-primary);
    color: var(--co-primary);
}

.co-party-btn.active[b-xygxdd9wjt] {
    background: var(--co-primary);
    border-color: var(--co-primary);
    color: white;
}

.co-party-btn-more[b-xygxdd9wjt] {
    width: auto;
    padding: 0 16px;
    border-radius: 24px;
}

.co-custom-party[b-xygxdd9wjt] {
    margin-top: var(--co-spacing);
}

.co-custom-party .co-input[b-xygxdd9wjt] {
    width: 120px;
}

/* Notice */
.co-guest-notice[b-xygxdd9wjt] {
    display: flex;
    align-items: flex-start;
    gap: var(--co-spacing);
    padding: var(--co-spacing);
    background: rgba(37, 99, 235, 0.05);
    border-radius: var(--co-radius);
    margin-top: var(--co-spacing-lg);
}

.co-guest-notice i[b-xygxdd9wjt] {
    color: var(--co-primary);
    font-size: 18px;
    margin-top: 2px;
}

.co-guest-notice p[b-xygxdd9wjt] {
    margin: 0;
    font-size: 13px;
    color: var(--co-text-muted);
    line-height: 1.5;
}

/* Footer */
.co-guest-footer[b-xygxdd9wjt] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--co-surface);
    padding: var(--co-spacing);
    border-top: 1px solid var(--co-border);
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.1);
    z-index: 100;
}

/* Responsive */
@media (min-width: 768px) {
    .co-guest-footer[b-xygxdd9wjt] {
        position: sticky;
        box-shadow: none;
    }
    
    .co-guest-content[b-xygxdd9wjt] {
        padding-bottom: var(--co-spacing);
        max-width: 500px;
        margin: 0 auto;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/FoodAndBev/CustomerOrder/CustomerItemCustomizer.razor.rz.scp.css */
/* Customer Item Customizer Styles */

.co-customizer[b-ca5nf78ydf] {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--co-bg);
}

.co-customizer-content[b-ca5nf78ydf] {
    flex: 1;
    overflow-y: auto;
    padding: var(--co-spacing);
    padding-bottom: 120px; /* Space for footer */
}

/* Item Info */
.co-customizer-item[b-ca5nf78ydf] {
    display: flex;
    gap: var(--co-spacing);
    background: var(--co-surface);
    border-radius: var(--co-radius);
    padding: var(--co-spacing);
    margin-bottom: var(--co-spacing-lg);
}

.co-customizer-image[b-ca5nf78ydf] {
    width: 100px;
    height: 100px;
    border-radius: var(--co-radius-sm);
    object-fit: cover;
}

.co-customizer-info[b-ca5nf78ydf] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.co-customizer-name[b-ca5nf78ydf] {
    font-size: 18px;
    font-weight: 600;
    margin: 0;
    color: var(--co-text);
}

.co-customizer-description[b-ca5nf78ydf] {
    font-size: 14px;
    color: var(--co-text-muted);
    margin: 0;
    line-height: 1.4;
}

/* Modifier Groups */
.co-modifier-group[b-ca5nf78ydf] {
    background: var(--co-surface);
    border-radius: var(--co-radius);
    padding: var(--co-spacing);
    margin-bottom: var(--co-spacing);
}

.co-modifier-header[b-ca5nf78ydf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--co-spacing);
}

.co-modifier-title[b-ca5nf78ydf] {
    font-size: 16px;
    font-weight: 600;
    margin: 0;
    color: var(--co-text);
}

/* Modifier Options */
.co-modifier-options[b-ca5nf78ydf] {
    display: flex;
    flex-direction: column;
    gap: var(--co-spacing-sm);
}

.co-modifier-option[b-ca5nf78ydf] {
    display: flex;
    align-items: center;
    gap: var(--co-spacing);
    padding: 12px;
    border-radius: var(--co-radius-sm);
    border: 1px solid var(--co-border);
    cursor: pointer;
    transition: all 0.2s ease;
    -webkit-tap-highlight-color: transparent;
}

.co-modifier-option:hover[b-ca5nf78ydf] {
    border-color: var(--co-primary);
}

.co-modifier-option.selected[b-ca5nf78ydf] {
    border-color: var(--co-primary);
    background: rgba(37, 99, 235, 0.05);
}

.co-modifier-option input[b-ca5nf78ydf] {
    display: none;
}

.co-modifier-checkbox[b-ca5nf78ydf] {
    width: 24px;
    height: 24px;
    border-radius: 6px;
    border: 2px solid var(--co-border);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.co-modifier-checkbox i[b-ca5nf78ydf] {
    font-size: 14px;
    color: white;
    opacity: 0;
    transform: scale(0.5);
    transition: all 0.2s ease;
}

.co-modifier-option.selected .co-modifier-checkbox[b-ca5nf78ydf] {
    background: var(--co-primary);
    border-color: var(--co-primary);
}

.co-modifier-option.selected .co-modifier-checkbox i[b-ca5nf78ydf] {
    opacity: 1;
    transform: scale(1);
}

.co-modifier-name[b-ca5nf78ydf] {
    flex: 1;
    font-size: 15px;
    color: var(--co-text);
}

.co-modifier-price[b-ca5nf78ydf] {
    font-size: 14px;
    color: var(--co-text-muted);
    font-weight: 500;
}

.co-modifier-option.selected .co-modifier-price[b-ca5nf78ydf] {
    color: var(--co-primary);
}

/* Special Instructions */
.co-special-instructions[b-ca5nf78ydf] {
    background: var(--co-surface);
    border-radius: var(--co-radius);
    padding: var(--co-spacing);
    margin-bottom: var(--co-spacing);
}

.co-special-instructions textarea[b-ca5nf78ydf] {
    resize: none;
}

/* Quantity Section */
.co-quantity-section[b-ca5nf78ydf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--co-surface);
    border-radius: var(--co-radius);
    padding: var(--co-spacing);
}

.co-quantity-label[b-ca5nf78ydf] {
    font-size: 16px;
    font-weight: 500;
    color: var(--co-text);
}

/* Footer */
.co-customizer-footer[b-ca5nf78ydf] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--co-surface);
    padding: var(--co-spacing);
    border-top: 1px solid var(--co-border);
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.1);
    z-index: 100;
}

.co-customizer-total[b-ca5nf78ydf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--co-spacing);
}

.co-customizer-total > span:first-child[b-ca5nf78ydf] {
    font-size: 16px;
    color: var(--co-text-muted);
}

/* Responsive */
@media (min-width: 768px) {
    .co-customizer-footer[b-ca5nf78ydf] {
        position: sticky;
        box-shadow: none;
        border-top: 1px solid var(--co-border);
    }
    
    .co-customizer-content[b-ca5nf78ydf] {
        padding-bottom: var(--co-spacing);
    }
}

@media (max-width: 480px) {
    .co-customizer-item[b-ca5nf78ydf] {
        flex-direction: column;
    }
    
    .co-customizer-image[b-ca5nf78ydf] {
        width: 100%;
        height: 200px;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/FoodAndBev/CustomerOrder/CustomerMenuBrowser.razor.rz.scp.css */
/* Customer Menu Browser Styles */

.co-menu-browser[b-5c7q5xkj1u] {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
}

/* Header */
.co-menu-header[b-5c7q5xkj1u] {
    background: var(--co-surface);
    padding: var(--co-spacing);
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--co-border);
}

.co-location-info[b-5c7q5xkj1u] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.co-location-name[b-5c7q5xkj1u] {
    font-size: 20px;
    font-weight: 700;
    margin: 0;
    color: var(--co-text);
}

.co-menu-name[b-5c7q5xkj1u] {
    font-size: 14px;
    color: var(--co-text-muted);
}

.co-wait-time[b-5c7q5xkj1u] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: rgba(34, 197, 94, 0.1);
    color: var(--co-success);
    border-radius: var(--co-radius-sm);
    font-size: 14px;
    font-weight: 500;
}

/* Search */
.co-search-container[b-5c7q5xkj1u] {
    padding: var(--co-spacing);
    background: var(--co-surface);
}

.co-search-box[b-5c7q5xkj1u] {
    display: flex;
    align-items: center;
    gap: var(--co-spacing-sm);
    background: var(--co-bg);
    border-radius: var(--co-radius-sm);
    padding: 10px 14px;
    border: 1px solid var(--co-border);
    transition: border-color 0.2s ease;
}

.co-search-box:focus-within[b-5c7q5xkj1u] {
    border-color: var(--co-primary);
}

.co-search-box i[b-5c7q5xkj1u] {
    color: var(--co-text-muted);
    font-size: 18px;
}

.co-search-input[b-5c7q5xkj1u] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: 16px;
    color: var(--co-text);
    outline: none;
}

.co-search-input[b-5c7q5xkj1u]::placeholder {
    color: var(--co-text-muted);
}

.co-search-clear[b-5c7q5xkj1u] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--co-border);
    border: none;
    cursor: pointer;
    color: var(--co-text-muted);
    transition: all 0.2s ease;
}

.co-search-clear:hover[b-5c7q5xkj1u] {
    background: var(--co-text-muted);
    color: white;
}

/* Categories */
.co-categories[b-5c7q5xkj1u] {
    display: flex;
    gap: var(--co-spacing-sm);
    padding: var(--co-spacing-sm) var(--co-spacing);
    background: var(--co-surface);
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    border-bottom: 1px solid var(--co-border);
}

.co-categories[b-5c7q5xkj1u]::-webkit-scrollbar {
    display: none;
}

.co-category-tab[b-5c7q5xkj1u] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 20px;
    border: 1px solid var(--co-border);
    background: var(--co-surface);
    color: var(--co-text-muted);
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    cursor: pointer;
    transition: all 0.2s ease;
}

.co-category-tab:hover[b-5c7q5xkj1u] {
    border-color: var(--co-primary);
    color: var(--co-primary);
}

.co-category-tab.active[b-5c7q5xkj1u] {
    background: var(--co-primary);
    border-color: var(--co-primary);
    color: white;
}

.co-category-tab i[b-5c7q5xkj1u] {
    font-size: 16px;
}

/* Menu Items Grid */
.co-menu-items[b-5c7q5xkj1u] {
    flex: 1;
    overflow-y: auto;
    padding: var(--co-spacing);
}

.co-menu-item[b-5c7q5xkj1u] {
    display: flex;
    gap: var(--co-spacing);
    background: var(--co-surface);
    border-radius: var(--co-radius);
    padding: var(--co-spacing);
    box-shadow: var(--co-shadow);
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
    min-height: 120px;
    margin-bottom: var(--co-spacing);
}

.co-menu-item:hover[b-5c7q5xkj1u] {
    transform: translateY(-2px);
    box-shadow: var(--co-shadow-lg);
}

.co-menu-item:active[b-5c7q5xkj1u] {
    transform: scale(0.99);
}

.co-menu-item.unavailable[b-5c7q5xkj1u] {
    opacity: 0.6;
    cursor: not-allowed;
}

.co-menu-item.unavailable:hover[b-5c7q5xkj1u] {
    transform: none;
    box-shadow: var(--co-shadow);
}

/* Item Image */
.co-item-image[b-5c7q5xkj1u] {
    width: 100px;
    height: 100px;
    border-radius: var(--co-radius-sm);
    overflow: hidden;
    flex-shrink: 0;
}

.co-item-image img[b-5c7q5xkj1u] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.co-item-image-placeholder[b-5c7q5xkj1u] {
    background: var(--co-bg);
    display: flex;
    align-items: center;
    justify-content: center;
}

.co-item-image-placeholder i[b-5c7q5xkj1u] {
    font-size: 32px;
    color: var(--co-border);
}

/* Item Details */
.co-item-details[b-5c7q5xkj1u] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.co-item-header[b-5c7q5xkj1u] {
    display: flex;
    align-items: flex-start;
    gap: var(--co-spacing-sm);
}

.co-item-name[b-5c7q5xkj1u] {
    font-size: 16px;
    font-weight: 600;
    margin: 0;
    color: var(--co-text);
    flex: 1;
}

.co-item-description[b-5c7q5xkj1u] {
    font-size: 13px;
    color: var(--co-text-muted);
    margin: 0;
    line-height: 1.4;
}

.co-item-tags[b-5c7q5xkj1u] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.co-dietary-tag[b-5c7q5xkj1u] {
    font-size: 11px;
    padding: 2px 8px;
    background: var(--co-bg);
    color: var(--co-text-muted);
    border-radius: 10px;
}

.co-item-footer[b-5c7q5xkj1u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto;
}

.co-item-customize[b-5c7q5xkj1u] {
    font-size: 12px;
    color: var(--co-primary);
    font-weight: 500;
}

/* Add Button */
.co-add-btn[b-5c7q5xkj1u] {
    position: absolute;
    bottom: var(--co-spacing);
    right: var(--co-spacing);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--co-primary);
    color: white;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.3);
}

.co-add-btn:hover[b-5c7q5xkj1u] {
    transform: scale(1.1);
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.4);
}

.co-add-btn:active[b-5c7q5xkj1u] {
    transform: scale(0.95);
}

/* Cart Badge on Item */
.co-item-cart-badge[b-5c7q5xkj1u] {
    position: absolute;
    top: var(--co-spacing);
    right: var(--co-spacing);
    width: 24px;
    height: 24px;
    background: var(--co-primary);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
}

/* Responsive */
@media (min-width: 768px) {
    .co-menu-items[b-5c7q5xkj1u] {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .co-menu-items[b-5c7q5xkj1u] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 480px) {
    .co-item-image[b-5c7q5xkj1u] {
        width: 80px;
        height: 80px;
    }
    
    .co-item-name[b-5c7q5xkj1u] {
        font-size: 15px;
    }
    
    .co-menu-header[b-5c7q5xkj1u] {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--co-spacing-sm);
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/FoodAndBev/CustomerOrder/CustomerOrderConfirmation.razor.rz.scp.css */
/* Customer Order Confirmation Styles */

.co-confirmation[b-qldvaq5rpp] {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--co-bg);
}

.co-confirmation-content[b-qldvaq5rpp] {
    flex: 1;
    overflow-y: auto;
    padding: var(--co-spacing-lg);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* Success Icon */
.co-confirmation-icon[b-qldvaq5rpp] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: rgba(34, 197, 94, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--co-spacing-lg);
    animation: confirmPop-b-qldvaq5rpp 0.5s ease-out;
}

@keyframes confirmPop-b-qldvaq5rpp {
    0% { transform: scale(0); opacity: 0; }
    50% { transform: scale(1.2); }
    100% { transform: scale(1); opacity: 1; }
}

.co-confirmation-icon i[b-qldvaq5rpp] {
    font-size: 48px;
    color: var(--co-success);
}

/* Title */
.co-confirmation-title[b-qldvaq5rpp] {
    font-size: 28px;
    font-weight: 700;
    margin: 0 0 8px 0;
    color: var(--co-text);
}

.co-confirmation-subtitle[b-qldvaq5rpp] {
    font-size: 16px;
    color: var(--co-text-muted);
    margin: 0 0 var(--co-spacing-lg) 0;
}

/* Order Code Card */
.co-order-code-card[b-qldvaq5rpp] {
    background: var(--co-surface);
    border-radius: var(--co-radius);
    padding: var(--co-spacing-lg);
    margin-bottom: var(--co-spacing-lg);
    width: 100%;
    max-width: 300px;
    box-shadow: var(--co-shadow);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.co-order-code-label[b-qldvaq5rpp] {
    font-size: 14px;
    color: var(--co-text-muted);
}

.co-order-code[b-qldvaq5rpp] {
    font-size: 48px;
    font-weight: 800;
    color: var(--co-primary);
    letter-spacing: 4px;
    font-family: 'SF Mono', 'Roboto Mono', monospace;
}

.co-order-code-hint[b-qldvaq5rpp] {
    font-size: 12px;
    color: var(--co-text-muted);
}

/* Wait Estimate */
.co-wait-estimate[b-qldvaq5rpp] {
    display: flex;
    align-items: center;
    gap: var(--co-spacing);
    padding: var(--co-spacing);
    background: rgba(245, 158, 11, 0.1);
    border-radius: var(--co-radius);
    margin-bottom: var(--co-spacing-lg);
    width: 100%;
    max-width: 300px;
}

.co-wait-estimate i[b-qldvaq5rpp] {
    font-size: 24px;
    color: var(--co-warning);
}

.co-wait-text[b-qldvaq5rpp] {
    display: flex;
    flex-direction: column;
    text-align: left;
}

.co-wait-label[b-qldvaq5rpp] {
    font-size: 12px;
    color: var(--co-text-muted);
}

.co-wait-time[b-qldvaq5rpp] {
    font-size: 18px;
    font-weight: 600;
    color: var(--co-text);
}

/* Total */
.co-confirmation-total[b-qldvaq5rpp] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 300px;
    padding: var(--co-spacing);
    background: var(--co-surface);
    border-radius: var(--co-radius);
    margin-bottom: var(--co-spacing-lg);
}

.co-confirmation-total > span:first-child[b-qldvaq5rpp] {
    font-size: 16px;
    color: var(--co-text-muted);
}

/* Next Steps */
.co-next-steps[b-qldvaq5rpp] {
    width: 100%;
    max-width: 350px;
    text-align: left;
}

.co-next-steps h3[b-qldvaq5rpp] {
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 var(--co-spacing) 0;
    color: var(--co-text);
}

.co-next-steps ul[b-qldvaq5rpp] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--co-spacing);
}

.co-next-steps li[b-qldvaq5rpp] {
    display: flex;
    align-items: center;
    gap: var(--co-spacing);
    font-size: 14px;
    color: var(--co-text-muted);
}

.co-next-steps li i[b-qldvaq5rpp] {
    font-size: 20px;
    color: var(--co-primary);
}

/* Actions */
.co-confirmation-actions[b-qldvaq5rpp] {
    padding: var(--co-spacing);
    background: var(--co-surface);
    border-top: 1px solid var(--co-border);
    display: flex;
    flex-direction: column;
    gap: var(--co-spacing);
}

/* Responsive */
@media (min-width: 768px) {
    .co-confirmation-content[b-qldvaq5rpp] {
        padding-top: 60px;
    }
    
    .co-confirmation-actions[b-qldvaq5rpp] {
        max-width: 350px;
        margin: 0 auto;
        background: transparent;
        border-top: none;
    }
}

@media (max-width: 480px) {
    .co-order-code[b-qldvaq5rpp] {
        font-size: 36px;
    }
    
    .co-confirmation-title[b-qldvaq5rpp] {
        font-size: 24px;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/FoodAndBev/CustomerOrder/CustomerOrderContainer.razor.rz.scp.css */
/* Customer Order Container Styles */
/* Environment-independent styling for customer self-service ordering */

/* CSS Variables (with defaults) */
.customer-order[b-keh1iycda7] {
    --co-primary: #2563eb;
    --co-primary-hover: #1d4ed8;
    --co-bg: #f8fafc;
    --co-surface: #ffffff;
    --co-text: #1e293b;
    --co-text-muted: #64748b;
    --co-border: #e2e8f0;
    --co-success: #22c55e;
    --co-warning: #f59e0b;
    --co-error: #ef4444;
    --co-accent: #8b5cf6;
    --co-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --co-radius: 12px;
    --co-radius-sm: 8px;
    --co-spacing: 16px;
    --co-spacing-sm: 8px;
    --co-spacing-lg: 24px;
    --co-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    --co-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.15);
}

.customer-order[b-keh1iycda7] {
    font-family: var(--co-font);
    background: var(--co-bg);
    color: var(--co-text);
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
}

/* Loading State */
.co-loading[b-keh1iycda7],
.co-submitting[b-keh1iycda7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    padding: var(--co-spacing-lg);
    text-align: center;
}

.co-spinner[b-keh1iycda7] {
    width: 48px;
    height: 48px;
    border: 4px solid var(--co-border);
    border-top-color: var(--co-primary);
    border-radius: 50%;
    animation: co-spin-b-keh1iycda7 1s linear infinite;
    margin-bottom: var(--co-spacing);
}

@keyframes co-spin-b-keh1iycda7 {
    to { transform: rotate(360deg); }
}

/* Error State */
.co-error[b-keh1iycda7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    padding: var(--co-spacing-lg);
    text-align: center;
    gap: var(--co-spacing);
}

.co-error i[b-keh1iycda7] {
    font-size: 48px;
    color: var(--co-warning);
}

.co-error p[b-keh1iycda7] {
    color: var(--co-text-muted);
    max-width: 300px;
}

/* Buttons */
.co-btn[b-keh1iycda7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--co-spacing-sm);
    padding: 12px 24px;
    border-radius: var(--co-radius-sm);
    font-size: 16px;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    -webkit-tap-highlight-color: transparent;
}

.co-btn:active[b-keh1iycda7] {
    transform: scale(0.98);
}

.co-btn-primary[b-keh1iycda7] {
    background: var(--co-primary);
    color: white;
}

.co-btn-primary:hover[b-keh1iycda7] {
    background: var(--co-primary-hover);
}

.co-btn-secondary[b-keh1iycda7] {
    background: var(--co-surface);
    color: var(--co-text);
    border: 1px solid var(--co-border);
}

.co-btn-secondary:hover[b-keh1iycda7] {
    background: var(--co-bg);
}

.co-btn-outline[b-keh1iycda7] {
    background: transparent;
    color: var(--co-primary);
    border: 2px solid var(--co-primary);
}

.co-btn-outline:hover[b-keh1iycda7] {
    background: var(--co-primary);
    color: white;
}

.co-btn-large[b-keh1iycda7] {
    padding: 16px 32px;
    font-size: 18px;
}

.co-btn-full[b-keh1iycda7] {
    width: 100%;
}

.co-btn:disabled[b-keh1iycda7] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Floating Cart Button */
.co-floating-cart[b-keh1iycda7] {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: var(--co-primary);
    color: white;
    padding: 12px 20px;
    border-radius: 28px;
    display: flex;
    align-items: center;
    gap: var(--co-spacing-sm);
    box-shadow: var(--co-shadow-lg);
    cursor: pointer;
    transition: all 0.3s ease;
    z-index: 1000;
    -webkit-tap-highlight-color: transparent;
}

.co-floating-cart:hover[b-keh1iycda7] {
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
}

.co-floating-cart:active[b-keh1iycda7] {
    transform: scale(0.95);
}

.co-floating-cart i[b-keh1iycda7] {
    font-size: 20px;
}

.co-cart-badge[b-keh1iycda7] {
    background: white;
    color: var(--co-primary);
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
}

.co-cart-total[b-keh1iycda7] {
    font-weight: 600;
}

/* Card Component */
.co-card[b-keh1iycda7] {
    background: var(--co-surface);
    border-radius: var(--co-radius);
    box-shadow: var(--co-shadow);
    overflow: hidden;
}

.co-card-header[b-keh1iycda7] {
    padding: var(--co-spacing);
    border-bottom: 1px solid var(--co-border);
}

.co-card-body[b-keh1iycda7] {
    padding: var(--co-spacing);
}

.co-card-footer[b-keh1iycda7] {
    padding: var(--co-spacing);
    border-top: 1px solid var(--co-border);
    background: var(--co-bg);
}

/* Header Component */
.co-header[b-keh1iycda7] {
    background: var(--co-surface);
    padding: var(--co-spacing);
    display: flex;
    align-items: center;
    gap: var(--co-spacing);
    border-bottom: 1px solid var(--co-border);
    position: sticky;
    top: 0;
    z-index: 100;
}

.co-header-back[b-keh1iycda7] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--co-text);
    font-size: 20px;
}

.co-header-back:hover[b-keh1iycda7] {
    background: var(--co-bg);
}

.co-header-title[b-keh1iycda7] {
    flex: 1;
    font-size: 18px;
    font-weight: 600;
    margin: 0;
}

/* Empty State */
.co-empty[b-keh1iycda7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--co-spacing-lg) var(--co-spacing);
    text-align: center;
    min-height: 200px;
}

.co-empty i[b-keh1iycda7] {
    font-size: 48px;
    color: var(--co-border);
    margin-bottom: var(--co-spacing);
}

.co-empty p[b-keh1iycda7] {
    color: var(--co-text-muted);
    margin: 0;
}

/* Badge */
.co-badge[b-keh1iycda7] {
    display: inline-flex;
    align-items: center;
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
}

.co-badge-success[b-keh1iycda7] {
    background: rgba(34, 197, 94, 0.1);
    color: var(--co-success);
}

.co-badge-warning[b-keh1iycda7] {
    background: rgba(245, 158, 11, 0.1);
    color: var(--co-warning);
}

.co-badge-info[b-keh1iycda7] {
    background: rgba(37, 99, 235, 0.1);
    color: var(--co-primary);
}

/* Input Fields */
.co-input[b-keh1iycda7] {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid var(--co-border);
    border-radius: var(--co-radius-sm);
    font-size: 16px;
    font-family: var(--co-font);
    background: var(--co-surface);
    color: var(--co-text);
    transition: border-color 0.2s ease;
}

.co-input:focus[b-keh1iycda7] {
    outline: none;
    border-color: var(--co-primary);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

.co-input[b-keh1iycda7]::placeholder {
    color: var(--co-text-muted);
}

.co-form-group[b-keh1iycda7] {
    margin-bottom: var(--co-spacing);
}

.co-form-label[b-keh1iycda7] {
    display: block;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 6px;
    color: var(--co-text);
}

.co-form-label.required[b-keh1iycda7]::after {
    content: " *";
    color: var(--co-error);
}

.co-form-hint[b-keh1iycda7] {
    font-size: 12px;
    color: var(--co-text-muted);
    margin-top: 4px;
}

.co-form-error[b-keh1iycda7] {
    font-size: 12px;
    color: var(--co-error);
    margin-top: 4px;
}

/* Quantity Selector */
.co-quantity[b-keh1iycda7] {
    display: flex;
    align-items: center;
    gap: var(--co-spacing-sm);
}

.co-quantity-btn[b-keh1iycda7] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--co-bg);
    border: 1px solid var(--co-border);
    cursor: pointer;
    font-size: 18px;
    color: var(--co-text);
    transition: all 0.2s ease;
}

.co-quantity-btn:hover:not(:disabled)[b-keh1iycda7] {
    background: var(--co-primary);
    color: white;
    border-color: var(--co-primary);
}

.co-quantity-btn:disabled[b-keh1iycda7] {
    opacity: 0.3;
    cursor: not-allowed;
}

.co-quantity-value[b-keh1iycda7] {
    width: 40px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
}

/* Divider */
.co-divider[b-keh1iycda7] {
    height: 1px;
    background: var(--co-border);
    margin: var(--co-spacing) 0;
}

/* Price Display */
.co-price[b-keh1iycda7] {
    font-weight: 600;
    color: var(--co-text);
}

.co-price-large[b-keh1iycda7] {
    font-size: 24px;
}

.co-price-muted[b-keh1iycda7] {
    color: var(--co-text-muted);
    font-weight: 400;
}

/* Responsive adjustments */
@media (max-width: 480px) {
    .co-floating-cart[b-keh1iycda7] {
        bottom: 16px;
        right: 16px;
        left: 16px;
        justify-content: center;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/FoodAndBev/CustomerOrder/CustomerOrderTracking.razor.rz.scp.css */
/* Customer Order Tracking Styles */

.co-tracking[b-k0o34k5nes] {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--co-bg);
}

.co-tracking-content[b-k0o34k5nes] {
    flex: 1;
    overflow-y: auto;
    padding: var(--co-spacing);
}

/* Order Code */
.co-tracking-code[b-k0o34k5nes] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--co-spacing);
    padding: var(--co-spacing);
    background: var(--co-surface);
    border-radius: var(--co-radius);
    margin-bottom: var(--co-spacing-lg);
}

.co-tracking-code-label[b-k0o34k5nes] {
    font-size: 14px;
    color: var(--co-text-muted);
}

.co-tracking-code-value[b-k0o34k5nes] {
    font-size: 24px;
    font-weight: 700;
    color: var(--co-primary);
    letter-spacing: 2px;
}

/* Status Timeline */
.co-status-timeline[b-k0o34k5nes] {
    background: var(--co-surface);
    border-radius: var(--co-radius);
    padding: var(--co-spacing-lg);
    margin-bottom: var(--co-spacing-lg);
}

.co-status-step[b-k0o34k5nes] {
    display: flex;
    align-items: center;
    gap: var(--co-spacing);
}

.co-status-icon[b-k0o34k5nes] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
    transition: all 0.3s ease;
}

.co-status-step.pending .co-status-icon[b-k0o34k5nes] {
    background: var(--co-bg);
    color: var(--co-text-muted);
    border: 2px solid var(--co-border);
}

.co-status-step.active .co-status-icon[b-k0o34k5nes] {
    background: var(--co-primary);
    color: white;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.2);
}

.co-status-step.complete .co-status-icon[b-k0o34k5nes] {
    background: var(--co-success);
    color: white;
}

.co-status-info[b-k0o34k5nes] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.co-status-title[b-k0o34k5nes] {
    font-size: 15px;
    font-weight: 500;
    color: var(--co-text);
}

.co-status-step.pending .co-status-title[b-k0o34k5nes] {
    color: var(--co-text-muted);
}

.co-status-step.active .co-status-title[b-k0o34k5nes] {
    color: var(--co-primary);
    font-weight: 600;
}

.co-status-time[b-k0o34k5nes] {
    font-size: 12px;
    color: var(--co-text-muted);
}

/* Status Line */
.co-status-line[b-k0o34k5nes] {
    width: 2px;
    height: 24px;
    margin-left: 19px;
    background: var(--co-border);
    transition: all 0.3s ease;
}

.co-status-line.active[b-k0o34k5nes],
.co-status-line.complete[b-k0o34k5nes] {
    background: var(--co-success);
}

/* Pulse Animation */
.co-pulse[b-k0o34k5nes] {
    width: 12px;
    height: 12px;
    background: white;
    border-radius: 50%;
    animation: pulse-b-k0o34k5nes 1.5s ease-in-out infinite;
}

@keyframes pulse-b-k0o34k5nes {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.5); opacity: 0.7; }
}

/* Status Message */
.co-status-message[b-k0o34k5nes] {
    display: flex;
    align-items: center;
    gap: var(--co-spacing);
    padding: var(--co-spacing);
    border-radius: var(--co-radius);
    margin-bottom: var(--co-spacing-lg);
}

.co-status-message i[b-k0o34k5nes] {
    font-size: 20px;
}

.co-status-message span[b-k0o34k5nes] {
    font-size: 15px;
    font-weight: 500;
}

.co-status-message.success[b-k0o34k5nes] {
    background: rgba(34, 197, 94, 0.1);
    color: var(--co-success);
}

.co-status-message.warning[b-k0o34k5nes] {
    background: rgba(245, 158, 11, 0.1);
    color: var(--co-warning);
}

.co-status-message.info[b-k0o34k5nes] {
    background: rgba(37, 99, 235, 0.1);
    color: var(--co-primary);
}

.co-status-message.error[b-k0o34k5nes] {
    background: rgba(239, 68, 68, 0.1);
    color: var(--co-error);
}

/* Order Items */
.co-tracking-items[b-k0o34k5nes] {
    background: var(--co-surface);
    border-radius: var(--co-radius);
    padding: var(--co-spacing);
}

.co-tracking-items h4[b-k0o34k5nes] {
    font-size: 14px;
    font-weight: 600;
    color: var(--co-text);
    margin: 0 0 var(--co-spacing) 0;
}

.co-tracking-item[b-k0o34k5nes] {
    display: flex;
    align-items: center;
    gap: var(--co-spacing-sm);
    padding: var(--co-spacing-sm) 0;
    border-bottom: 1px solid var(--co-border);
}

.co-tracking-item:last-child[b-k0o34k5nes] {
    border-bottom: none;
}

.co-tracking-item-qty[b-k0o34k5nes] {
    font-size: 14px;
    color: var(--co-text-muted);
    font-weight: 500;
}

.co-tracking-item-name[b-k0o34k5nes] {
    flex: 1;
    font-size: 14px;
    color: var(--co-text);
}

.co-tracking-item-status[b-k0o34k5nes] {
    font-size: 12px;
    padding: 4px 8px;
    border-radius: 12px;
    font-weight: 500;
}

.co-tracking-item-status.queued[b-k0o34k5nes] {
    background: var(--co-bg);
    color: var(--co-text-muted);
}

.co-tracking-item-status.preparing[b-k0o34k5nes] {
    background: rgba(245, 158, 11, 0.1);
    color: var(--co-warning);
}

.co-tracking-item-status.ready[b-k0o34k5nes] {
    background: rgba(34, 197, 94, 0.1);
    color: var(--co-success);
}

/* Actions */
.co-tracking-actions[b-k0o34k5nes] {
    padding: var(--co-spacing);
    background: var(--co-surface);
    border-top: 1px solid var(--co-border);
}

/* Responsive */
@media (min-width: 768px) {
    .co-tracking-content[b-k0o34k5nes] {
        max-width: 500px;
        margin: 0 auto;
    }
    
    .co-tracking-actions[b-k0o34k5nes] {
        max-width: 500px;
        margin: 0 auto;
        background: transparent;
        border-top: none;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/FoodAndBev/KDSStaffLogin.razor.rz.scp.css */
/* KDSStaffLogin.razor.css — KDS inline staff bar + PIN dialog */

/* ================================================================
   STAFF BAR (inline, sits at top of KDS panel)
   ================================================================ */

.kds-staff-bar[b-4f2nl09vst] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 1rem;
    background: var(--simx-surface-alt, #1e293b);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.9);
    min-height: 48px;
}

.kds-staff-loading[b-4f2nl09vst] {
    justify-content: center;
    color: rgba(255, 255, 255, 0.6);
}

/* ================================================================
   ACTIVE STATE
   ================================================================ */

.kds-staff-active[b-4f2nl09vst] {
    background: linear-gradient(135deg, #1a472a, #1e3a2f);
}

.kds-staff-avatar[b-4f2nl09vst] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 700;
    flex-shrink: 0;
}

.kds-staff-avatar.active[b-4f2nl09vst] {
    background: var(--bs-success, #198754);
    box-shadow: 0 0 0 2px rgba(25, 135, 84, 0.3);
}

.kds-staff-info[b-4f2nl09vst] {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.kds-staff-name[b-4f2nl09vst] {
    font-weight: 600;
    color: #fff;
}

.kds-staff-label[b-4f2nl09vst] {
    font-size: 0.6875rem;
    color: rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.kds-staff-switch[b-4f2nl09vst] {
    margin-left: auto;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.8125rem;
    padding: 0.25rem 0.75rem;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.375rem;
    transition: all 0.15s;
}

.kds-staff-switch:hover[b-4f2nl09vst] {
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
}

/* ================================================================
   SELECTION STRIP
   ================================================================ */

.kds-staff-select[b-4f2nl09vst] {
    flex-wrap: wrap;
    gap: 0.5rem;
}

.kds-staff-prompt[b-4f2nl09vst] {
    color: rgba(255, 255, 255, 0.7);
    font-weight: 500;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.kds-staff-chips[b-4f2nl09vst] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    flex: 1;
}

.kds-staff-chip[b-4f2nl09vst] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.75rem 0.25rem 0.25rem;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 20px;
    color: #fff;
    cursor: pointer;
    font-size: 0.8125rem;
    transition: all 0.15s;
}

.kds-staff-chip:hover[b-4f2nl09vst] {
    background: var(--simx-primary, #0d6efd);
    border-color: var(--simx-primary, #0d6efd);
    transform: translateY(-1px);
}

.kds-chip-avatar[b-4f2nl09vst] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.625rem;
    font-weight: 700;
}

.kds-chip-name[b-4f2nl09vst] {
    font-weight: 500;
}

.kds-staff-skip[b-4f2nl09vst] {
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.8125rem;
    cursor: pointer;
    padding: 0.25rem 0.5rem;
    margin-left: auto;
}

.kds-staff-skip:hover[b-4f2nl09vst] {
    color: rgba(255, 255, 255, 0.8);
    text-decoration: underline;
}

/* ================================================================
   PIN OVERLAY (for KDS — dark theme)
   ================================================================ */

.kds-pin-overlay[b-4f2nl09vst] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    background: rgba(0, 0, 0, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
}

.kds-pin-dialog[b-4f2nl09vst] {
    background: #1e293b;
    border-radius: 16px;
    padding: 2rem;
    width: min(360px, 90vw);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
    color: #fff;
}

.kds-pin-header[b-4f2nl09vst] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}

.kds-pin-avatar[b-4f2nl09vst] {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--simx-primary, #0d6efd), #6610f2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    font-weight: 700;
}

.kds-pin-name[b-4f2nl09vst] {
    font-size: 1.125rem;
    font-weight: 600;
}

/* ================================================================
   KDS PIN DOTS
   ================================================================ */

.kds-pin-dots[b-4f2nl09vst] {
    display: flex;
    justify-content: center;
    gap: 0.875rem;
    margin-bottom: 1rem;
}

.kds-dot[b-4f2nl09vst] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.3);
    transition: all 0.15s;
}

.kds-dot.filled[b-4f2nl09vst] {
    background: var(--simx-primary, #0d6efd);
    border-color: var(--simx-primary, #0d6efd);
}

.kds-dot.error[b-4f2nl09vst] {
    background: var(--bs-danger, #dc3545);
    border-color: var(--bs-danger, #dc3545);
    animation: kds-shake-b-4f2nl09vst 0.3s ease;
}

@keyframes kds-shake-b-4f2nl09vst {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-3px); }
    75% { transform: translateX(3px); }
}

.kds-pin-error[b-4f2nl09vst] {
    text-align: center;
    color: var(--bs-danger, #dc3545);
    font-size: 0.8125rem;
    margin-bottom: 0.75rem;
}

/* ================================================================
   KDS PIN PAD
   ================================================================ */

.kds-pin-pad[b-4f2nl09vst] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
    max-width: 260px;
    margin: 0 auto 1rem;
}

.kds-pin-key[b-4f2nl09vst] {
    aspect-ratio: 1.6;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.05);
    font-size: 1.375rem;
    font-weight: 600;
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.1s;
    user-select: none;
}

.kds-pin-key:hover:not(:disabled)[b-4f2nl09vst] {
    background: var(--simx-primary, #0d6efd);
    border-color: var(--simx-primary, #0d6efd);
}

.kds-pin-key:active:not(:disabled)[b-4f2nl09vst] {
    transform: scale(0.95);
}

.kds-pin-key:disabled[b-4f2nl09vst] {
    opacity: 0.4;
}

.kds-pin-key.empty[b-4f2nl09vst] {
    border: none;
    background: transparent;
    cursor: default;
}

.kds-pin-key.delete[b-4f2nl09vst] {
    color: rgba(255, 255, 255, 0.6);
    font-size: 1.125rem;
}

.kds-pin-cancel[b-4f2nl09vst] {
    display: block;
    width: 100%;
    background: none;
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: rgba(255, 255, 255, 0.7);
    padding: 0.5rem;
    border-radius: 8px;
    font-size: 0.875rem;
    cursor: pointer;
    transition: all 0.15s;
}

.kds-pin-cancel:hover[b-4f2nl09vst] {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/FoodAndBev/POSCartSummaryBar.razor.rz.scp.css */
/* POSCartSummaryBar.razor.css - Collapsed cart summary bar styles */

/* =================================================================
   SUMMARY BAR CONTAINER
   ================================================================= */

.pos-cart-summary[b-vzyttiysa2] {
    display: flex;
    flex-direction: column;
    background: var(--simx-surface-alt, #fff);
    border-top: 1px solid var(--simx-border, #dee2e6);
    box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.08);
}

.pos-cart-summary.has-items[b-vzyttiysa2] {
    background: linear-gradient(to right, var(--simx-surface-alt, #fff), #f8f9ff);
}

/* =================================================================
   SUMMARY CONTENT (TAPPABLE AREA)
   ================================================================= */

.pos-cart-summary .summary-content[b-vzyttiysa2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    cursor: pointer;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    transition: background 0.2s ease;
}

.pos-cart-summary .summary-content:active[b-vzyttiysa2] {
    background: var(--simx-surface-hover, #f0f0f0);
}

/* Summary Info (Left Side) */
.pos-cart-summary .summary-info[b-vzyttiysa2] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.pos-cart-summary .item-count[b-vzyttiysa2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
    color: var(--simx-text, #212529);
}

.pos-cart-summary .item-count i[b-vzyttiysa2] {
    font-size: 1.125rem;
    color: var(--simx-primary, #0d6efd);
}

.pos-cart-summary .unsent-badge[b-vzyttiysa2] {
    font-size: 0.75rem;
    padding: 0.125rem 0.5rem;
    background: var(--bs-warning, #ffc107);
    color: #000;
    border-radius: 10px;
    font-weight: 600;
}

.pos-cart-summary .tab-name[b-vzyttiysa2] {
    font-size: 0.8125rem;
    color: var(--simx-text-muted, #6c757d);
}

/* Summary Total (Right Side) */
.pos-cart-summary .summary-total[b-vzyttiysa2] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.pos-cart-summary .total-amount[b-vzyttiysa2] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--simx-primary, #0d6efd);
}

.pos-cart-summary .summary-total i[b-vzyttiysa2] {
    font-size: 1rem;
    color: var(--simx-text-muted, #6c757d);
    transition: transform 0.2s ease;
}

.pos-cart-summary .summary-content:active .summary-total i[b-vzyttiysa2] {
    transform: translateY(-2px);
}

/* Empty State */
.pos-cart-summary.empty .summary-content[b-vzyttiysa2] {
    cursor: default;
}

.pos-cart-summary .empty-message[b-vzyttiysa2] {
    color: var(--simx-text-muted, #6c757d);
    font-size: 0.9375rem;
}

/* =================================================================
   QUICK ACTIONS
   ================================================================= */

.pos-cart-summary .quick-actions[b-vzyttiysa2] {
    display: flex;
    gap: 0.75rem;
    padding: 0 1.25rem 1rem;
}

.pos-cart-summary .quick-action-btn[b-vzyttiysa2] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.875rem 1rem;
    border: none;
    border-radius: 12px;
    font-size: 0.9375rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    -webkit-tap-highlight-color: transparent;
}

.pos-cart-summary .quick-action-btn:active:not(:disabled)[b-vzyttiysa2] {
    transform: scale(0.98);
}

.pos-cart-summary .quick-action-btn:disabled[b-vzyttiysa2] {
    opacity: 0.5;
    cursor: not-allowed;
}

.pos-cart-summary .quick-action-btn.send[b-vzyttiysa2] {
    background: var(--bs-warning, #ffc107);
    color: #000;
}

.pos-cart-summary .quick-action-btn.send:hover:not(:disabled)[b-vzyttiysa2] {
    background: #e0a800;
}

.pos-cart-summary .quick-action-btn.pay[b-vzyttiysa2] {
    background: var(--bs-success, #198754);
    color: #fff;
}

.pos-cart-summary .quick-action-btn.pay:hover:not(:disabled)[b-vzyttiysa2] {
    background: #157347;
}

.pos-cart-summary .quick-action-btn i[b-vzyttiysa2] {
    font-size: 1.125rem;
}

/* =================================================================
   MOBILE STYLES
   ================================================================= */

@media (max-width: 767px) {
    .pos-cart-summary .summary-content[b-vzyttiysa2] {
        padding: 0.875rem 1rem;
    }
    
    .pos-cart-summary .total-amount[b-vzyttiysa2] {
        font-size: 1.25rem;
    }
    
    .pos-cart-summary .quick-actions[b-vzyttiysa2] {
        padding: 0 1rem 0.875rem;
        gap: 0.5rem;
    }
    
    .pos-cart-summary .quick-action-btn[b-vzyttiysa2] {
        padding: 0.75rem;
        font-size: 0.875rem;
        border-radius: 10px;
    }
    
    .pos-cart-summary .quick-action-btn span[b-vzyttiysa2] {
        display: none; /* Icon only on small screens */
    }
    
    .pos-cart-summary .quick-action-btn i[b-vzyttiysa2] {
        font-size: 1.25rem;
    }
}

/* =================================================================
   TOUCH DEVICE OPTIMIZATIONS
   ================================================================= */

@media (pointer: coarse) {
    .pos-cart-summary .summary-content[b-vzyttiysa2] {
        min-height: 64px;
    }
    
    .pos-cart-summary .quick-action-btn[b-vzyttiysa2] {
        min-height: 52px;
    }
    
    /* Remove hover effects */
    .pos-cart-summary .quick-action-btn.send:hover:not(:disabled)[b-vzyttiysa2] {
        background: var(--bs-warning, #ffc107);
    }
    
    .pos-cart-summary .quick-action-btn.pay:hover:not(:disabled)[b-vzyttiysa2] {
        background: var(--bs-success, #198754);
    }
}

/* =================================================================
   SAFE AREA INSETS
   ================================================================= */

@supports (padding-bottom: env(safe-area-inset-bottom)) {
    .pos-cart-summary .quick-actions[b-vzyttiysa2] {
        padding-bottom: calc(1rem + env(safe-area-inset-bottom));
    }
    
    .pos-cart-summary.empty .summary-content[b-vzyttiysa2],
    .pos-cart-summary:not(.has-items) .summary-content[b-vzyttiysa2] {
        padding-bottom: calc(1rem + env(safe-area-inset-bottom));
    }
}

/* =================================================================
   DARK MODE
   ================================================================= */

@media (prefers-color-scheme: dark) {
    .pos-cart-summary[b-vzyttiysa2] {
        background: var(--simx-surface-alt, #242424);
        border-color: var(--simx-border, #444);
    }
    
    .pos-cart-summary.has-items[b-vzyttiysa2] {
        background: linear-gradient(to right, var(--simx-surface-alt, #242424), #1a1a2e);
    }
    
    .pos-cart-summary .summary-content:active[b-vzyttiysa2] {
        background: var(--simx-surface-hover, #333);
    }
    
    .pos-cart-summary .item-count[b-vzyttiysa2] {
        color: var(--simx-text, #e9ecef);
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/FoodAndBev/POSCategoryBar.razor.rz.scp.css */
/* POSCategoryBar.razor.css - Horizontal scrollable category bar styles */

/* =================================================================
   CATEGORY BAR CONTAINER
   ================================================================= */

.pos-category-bar[b-u1d1wt5cyw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: var(--simx-surface, #f8f9fa);
    border-bottom: 1px solid var(--simx-border, #dee2e6);
}

/* =================================================================
   CATEGORY SCROLL AREA
   ================================================================= */

.pos-category-bar .category-scroll[b-u1d1wt5cyw] {
    flex: 1;
    display: flex;
    gap: 0.5rem;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE/Edge */
    scroll-snap-type: x mandatory;
    padding: 2px; /* Prevent button shadows from being clipped */
}

.pos-category-bar .category-scroll[b-u1d1wt5cyw]::-webkit-scrollbar {
    display: none; /* Chrome/Safari */
}

/* =================================================================
   CATEGORY BUTTONS
   ================================================================= */

.pos-category-bar .category-btn[b-u1d1wt5cyw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    background: var(--simx-surface-alt, #fff);
    border: 1px solid var(--simx-border, #dee2e6);
    border-radius: 50px;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--simx-text, #212529);
    white-space: nowrap;
    cursor: pointer;
    transition: all 0.2s ease;
    scroll-snap-align: start;
    flex-shrink: 0;
    -webkit-tap-highlight-color: transparent;
}

.pos-category-bar .category-btn:hover[b-u1d1wt5cyw] {
    border-color: var(--simx-primary, #0d6efd);
    color: var(--simx-primary, #0d6efd);
}

.pos-category-bar .category-btn:active[b-u1d1wt5cyw] {
    transform: scale(0.97);
}

.pos-category-bar .category-btn.active[b-u1d1wt5cyw] {
    background: var(--simx-primary, #0d6efd);
    border-color: var(--simx-primary, #0d6efd);
    color: #fff;
    box-shadow: 0 2px 8px rgba(13, 110, 253, 0.3);
}

.pos-category-bar .category-btn i[b-u1d1wt5cyw] {
    font-size: 1rem;
}

.pos-category-bar .category-name[b-u1d1wt5cyw] {
    line-height: 1;
}

.pos-category-bar .category-count[b-u1d1wt5cyw] {
    font-size: 0.75rem;
    padding: 0.125rem 0.5rem;
    background: rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    margin-left: 0.25rem;
}

.pos-category-bar .category-btn.active .category-count[b-u1d1wt5cyw] {
    background: rgba(255, 255, 255, 0.25);
}

/* =================================================================
   SEARCH BUTTON
   ================================================================= */

.pos-category-bar .search-btn[b-u1d1wt5cyw] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--simx-surface-alt, #fff);
    border: 1px solid var(--simx-border, #dee2e6);
    border-radius: 50%;
    color: var(--simx-text-muted, #6c757d);
    cursor: pointer;
    flex-shrink: 0;
    transition: all 0.2s ease;
    -webkit-tap-highlight-color: transparent;
}

.pos-category-bar .search-btn:hover[b-u1d1wt5cyw] {
    border-color: var(--simx-primary, #0d6efd);
    color: var(--simx-primary, #0d6efd);
}

.pos-category-bar .search-btn:active[b-u1d1wt5cyw] {
    transform: scale(0.95);
}

.pos-category-bar .search-btn.active[b-u1d1wt5cyw] {
    background: var(--simx-primary, #0d6efd);
    border-color: var(--simx-primary, #0d6efd);
    color: #fff;
}

/* =================================================================
   SEARCH BAR
   ================================================================= */

.pos-search-bar[b-u1d1wt5cyw] {
    padding: 0.75rem 1rem;
    background: var(--simx-surface, #f8f9fa);
    border-bottom: 1px solid var(--simx-border, #dee2e6);
    animation: slideDown-b-u1d1wt5cyw 0.2s ease;
}

@keyframes slideDown-b-u1d1wt5cyw {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.pos-search-bar .search-input-wrapper[b-u1d1wt5cyw] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: var(--simx-surface-alt, #fff);
    border: 1px solid var(--simx-border, #dee2e6);
    border-radius: 50px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.pos-search-bar .search-input-wrapper:focus-within[b-u1d1wt5cyw] {
    border-color: var(--simx-primary, #0d6efd);
    box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.15);
}

.pos-search-bar .search-input-wrapper i[b-u1d1wt5cyw] {
    color: var(--simx-text-muted, #6c757d);
    font-size: 1rem;
    flex-shrink: 0;
}

.pos-search-bar .search-input-wrapper input[b-u1d1wt5cyw] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 1rem;
    color: var(--simx-text, #212529);
    min-width: 0;
}

.pos-search-bar .search-input-wrapper input[b-u1d1wt5cyw]::placeholder {
    color: var(--simx-text-muted, #adb5bd);
}

.pos-search-bar .clear-btn[b-u1d1wt5cyw] {
    padding: 0;
    background: none;
    border: none;
    color: var(--simx-text-muted, #6c757d);
    cursor: pointer;
    font-size: 1.125rem;
    transition: color 0.2s ease;
}

.pos-search-bar .clear-btn:hover[b-u1d1wt5cyw] {
    color: var(--simx-text, #212529);
}

/* =================================================================
   COMPACT MODE
   ================================================================= */

.pos-category-bar.compact[b-u1d1wt5cyw] {
    padding: 0.5rem 0.75rem;
}

.pos-category-bar.compact .category-btn[b-u1d1wt5cyw] {
    padding: 0.5rem 0.875rem;
    font-size: 0.8125rem;
}

.pos-category-bar.compact .category-btn i[b-u1d1wt5cyw] {
    font-size: 0.875rem;
}

.pos-category-bar.compact .search-btn[b-u1d1wt5cyw] {
    width: 36px;
    height: 36px;
}

/* =================================================================
   MOBILE STYLES
   ================================================================= */

@media (max-width: 767px) {
    .pos-category-bar[b-u1d1wt5cyw] {
        padding: 0.5rem;
    }
    
    .pos-category-bar .category-btn[b-u1d1wt5cyw] {
        padding: 0.5rem 0.75rem;
        font-size: 0.8125rem;
        border-radius: 8px;
    }
    
    .pos-category-bar .category-btn i[b-u1d1wt5cyw] {
        font-size: 0.875rem;
    }
    
    .pos-category-bar .category-name[b-u1d1wt5cyw] {
        max-width: 80px;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    
    .pos-category-bar .search-btn[b-u1d1wt5cyw] {
        width: 36px;
        height: 36px;
    }
    
    .pos-search-bar[b-u1d1wt5cyw] {
        padding: 0.5rem;
    }
    
    .pos-search-bar .search-input-wrapper[b-u1d1wt5cyw] {
        padding: 0.625rem 1rem;
    }
}

/* =================================================================
   TOUCH DEVICE OPTIMIZATIONS
   ================================================================= */

@media (pointer: coarse) {
    .pos-category-bar .category-btn[b-u1d1wt5cyw] {
        min-height: 44px; /* Apple's minimum touch target */
        padding: 0.625rem 1.25rem;
    }
    
    .pos-category-bar .search-btn[b-u1d1wt5cyw] {
        min-width: 44px;
        min-height: 44px;
    }
    
    /* Remove hover effects */
    .pos-category-bar .category-btn:hover:not(.active)[b-u1d1wt5cyw] {
        border-color: var(--simx-border, #dee2e6);
        color: var(--simx-text, #212529);
    }
    
    .pos-category-bar .search-btn:hover:not(.active)[b-u1d1wt5cyw] {
        border-color: var(--simx-border, #dee2e6);
        color: var(--simx-text-muted, #6c757d);
    }
}

/* =================================================================
   DARK MODE
   ================================================================= */

@media (prefers-color-scheme: dark) {
    .pos-category-bar[b-u1d1wt5cyw] {
        background: var(--simx-surface, #1a1a1a);
        border-color: var(--simx-border, #333);
    }
    
    .pos-category-bar .category-btn[b-u1d1wt5cyw] {
        background: var(--simx-surface-alt, #2a2a2a);
        border-color: var(--simx-border, #444);
        color: var(--simx-text, #e9ecef);
    }
    
    .pos-category-bar .search-btn[b-u1d1wt5cyw] {
        background: var(--simx-surface-alt, #2a2a2a);
        border-color: var(--simx-border, #444);
    }
    
    .pos-search-bar[b-u1d1wt5cyw] {
        background: var(--simx-surface, #1a1a1a);
        border-color: var(--simx-border, #333);
    }
    
    .pos-search-bar .search-input-wrapper[b-u1d1wt5cyw] {
        background: var(--simx-surface-alt, #2a2a2a);
        border-color: var(--simx-border, #444);
    }
    
    .pos-search-bar .search-input-wrapper input[b-u1d1wt5cyw] {
        color: var(--simx-text, #e9ecef);
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/FoodAndBev/POSMenuItemCard.razor.rz.scp.css */
/* POSMenuItemCard.razor.css - Touch-optimized menu item card styles */

/* =================================================================
   BASE CARD STYLES
   ================================================================= */

.pos-item-card[b-wscng0eoqu] {
    position: relative;
    display: flex;
    flex-direction: column;
    background: var(--simx-surface-alt, #fff);
    border: 1px solid var(--simx-border, #dee2e6);
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
}

.pos-item-card:not(.unavailable):hover[b-wscng0eoqu] {
    border-color: var(--simx-primary, #0d6efd);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.pos-item-card:not(.unavailable):active[b-wscng0eoqu],
.pos-item-card.pressed:not(.unavailable)[b-wscng0eoqu] {
    transform: scale(0.97);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.pos-item-card.unavailable[b-wscng0eoqu] {
    filter: grayscale(50%);
}

/* =================================================================
   IMAGE SECTION
   ================================================================= */

.pos-item-card .item-image[b-wscng0eoqu] {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: var(--simx-surface, #f8f9fa);
}

.pos-item-card .item-image img[b-wscng0eoqu] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.pos-item-card:not(.unavailable):hover .item-image img[b-wscng0eoqu] {
    transform: scale(1.05);
}

.pos-item-card .image-placeholder[b-wscng0eoqu] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #e9ecef 0%, #dee2e6 100%);
    color: var(--simx-text-muted, #adb5bd);
    font-size: 2rem;
}

/* =================================================================
   BADGES
   ================================================================= */

.pos-item-card .quantity-badge[b-wscng0eoqu] {
    position: absolute;
    top: 8px;
    right: 8px;
    min-width: 28px;
    height: 28px;
    padding: 0 8px;
    background: var(--simx-primary, #0d6efd);
    color: #fff;
    border-radius: 14px;
    font-size: 0.875rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    animation: badgePop-b-wscng0eoqu 0.3s ease;
}

@keyframes badgePop-b-wscng0eoqu {
    0% { transform: scale(0.5); opacity: 0; }
    50% { transform: scale(1.2); }
    100% { transform: scale(1); opacity: 1; }
}

.pos-item-card .unavailable-badge[b-wscng0eoqu] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-15deg);
    padding: 0.25rem 1rem;
    background: var(--bs-danger, #dc3545);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.pos-item-card .modifier-indicator[b-wscng0eoqu] {
    position: absolute;
    bottom: 8px;
    right: 8px;
    width: 24px;
    height: 24px;
    background: rgba(255, 255, 255, 0.9);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    color: var(--simx-text-muted, #6c757d);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}

/* =================================================================
   INFO SECTION
   ================================================================= */

.pos-item-card .item-info[b-wscng0eoqu] {
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
}

.pos-item-card .item-name[b-wscng0eoqu] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--simx-text, #212529);
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pos-item-card .item-price[b-wscng0eoqu] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--simx-primary, #0d6efd);
}

/* =================================================================
   LONG-PRESS INDICATOR
   ================================================================= */

.pos-item-card .long-press-indicator[b-wscng0eoqu] {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    animation: fadeIn-b-wscng0eoqu 0.2s ease;
}

@keyframes fadeIn-b-wscng0eoqu {
    from { opacity: 0; }
    to { opacity: 1; }
}

.pos-item-card .progress-ring[b-wscng0eoqu] {
    position: relative;
    width: 48px;
    height: 48px;
}

.pos-item-card .progress-ring svg[b-wscng0eoqu] {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.pos-item-card .progress-ring-bg[b-wscng0eoqu] {
    fill: none;
    stroke: rgba(255, 255, 255, 0.3);
    stroke-width: 3;
}

.pos-item-card .progress-ring-fg[b-wscng0eoqu] {
    fill: none;
    stroke: #fff;
    stroke-width: 3;
    stroke-linecap: round;
    transition: stroke-dasharray 0.1s ease;
}

.pos-item-card .progress-ring i[b-wscng0eoqu] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 1.25rem;
}

/* =================================================================
   SIZE VARIANTS
   ================================================================= */

/* Small size */
.pos-item-card.item-sm[b-wscng0eoqu] {
    border-radius: 8px;
}

.pos-item-card.item-sm .item-image[b-wscng0eoqu] {
    aspect-ratio: 1;
}

.pos-item-card.item-sm .image-placeholder[b-wscng0eoqu] {
    font-size: 1.5rem;
}

.pos-item-card.item-sm .item-info[b-wscng0eoqu] {
    padding: 0.5rem;
}

.pos-item-card.item-sm .item-name[b-wscng0eoqu] {
    font-size: 0.75rem;
    -webkit-line-clamp: 1;
}

.pos-item-card.item-sm .item-price[b-wscng0eoqu] {
    font-size: 0.875rem;
}

.pos-item-card.item-sm .quantity-badge[b-wscng0eoqu] {
    min-width: 22px;
    height: 22px;
    font-size: 0.75rem;
    top: 4px;
    right: 4px;
}

/* Large size (touch-optimized) */
.pos-item-card.item-lg[b-wscng0eoqu] {
    border-radius: 16px;
}

.pos-item-card.item-lg .item-image[b-wscng0eoqu] {
    aspect-ratio: 16 / 10;
}

.pos-item-card.item-lg .image-placeholder[b-wscng0eoqu] {
    font-size: 3rem;
}

.pos-item-card.item-lg .item-info[b-wscng0eoqu] {
    padding: 1rem;
    gap: 0.5rem;
}

.pos-item-card.item-lg .item-name[b-wscng0eoqu] {
    font-size: 1rem;
}

.pos-item-card.item-lg .item-price[b-wscng0eoqu] {
    font-size: 1.25rem;
}

.pos-item-card.item-lg .quantity-badge[b-wscng0eoqu] {
    min-width: 32px;
    height: 32px;
    font-size: 1rem;
    top: 12px;
    right: 12px;
}

.pos-item-card.item-lg .modifier-indicator[b-wscng0eoqu] {
    width: 32px;
    height: 32px;
    font-size: 1rem;
    bottom: 12px;
    right: 12px;
}

/* =================================================================
   TOUCH DEVICE OPTIMIZATIONS
   ================================================================= */

@media (pointer: coarse) {
    .pos-item-card[b-wscng0eoqu] {
        /* Ensure minimum touch target size */
        min-height: 100px;
    }
    
    .pos-item-card.item-lg[b-wscng0eoqu] {
        min-height: 140px;
    }
    
    /* Remove hover effects on touch devices */
    .pos-item-card:not(.unavailable):hover[b-wscng0eoqu] {
        border-color: var(--simx-border, #dee2e6);
        box-shadow: none;
    }
    
    .pos-item-card:not(.unavailable):hover .item-image img[b-wscng0eoqu] {
        transform: none;
    }
}

/* =================================================================
   MOBILE-SPECIFIC STYLES
   ================================================================= */

@media (max-width: 767px) {
    /* Switch to horizontal card layout on phones */
    .pos-item-card[b-wscng0eoqu] {
        flex-direction: row;
        border-radius: 10px;
    }
    
    .pos-item-card .item-image[b-wscng0eoqu] {
        width: 80px;
        height: 80px;
        aspect-ratio: 1;
        flex-shrink: 0;
    }
    
    .pos-item-card .item-info[b-wscng0eoqu] {
        flex: 1;
        justify-content: center;
        padding: 0.75rem 1rem;
    }
    
    .pos-item-card .item-name[b-wscng0eoqu] {
        -webkit-line-clamp: 1;
    }
    
    .pos-item-card .quantity-badge[b-wscng0eoqu] {
        top: 50%;
        right: 12px;
        transform: translateY(-50%);
    }
    
    .pos-item-card .modifier-indicator[b-wscng0eoqu] {
        position: static;
        margin-top: 0.25rem;
        width: auto;
        height: auto;
        background: none;
        box-shadow: none;
        font-size: 0.75rem;
        color: var(--simx-text-muted, #6c757d);
    }
    
    .pos-item-card .modifier-indicator[b-wscng0eoqu]::before {
        content: "Customizable";
        margin-left: 0.25rem;
        font-size: 0.7rem;
    }
}

/* =================================================================
   DARK MODE
   ================================================================= */

@media (prefers-color-scheme: dark) {
    .pos-item-card[b-wscng0eoqu] {
        background: var(--simx-surface-alt, #2a2a2a);
        border-color: var(--simx-border, #444);
    }
    
    .pos-item-card .image-placeholder[b-wscng0eoqu] {
        background: linear-gradient(135deg, #333 0%, #444 100%);
    }
    
    .pos-item-card .modifier-indicator[b-wscng0eoqu] {
        background: rgba(0, 0, 0, 0.7);
        color: #ccc;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/FoodAndBev/POSOrderSlideUp.razor.rz.scp.css */
/* POSOrderSlideUp.razor.css - Mobile slide-up order panel styles */

/* =================================================================
   WRAPPER
   ================================================================= */

.pos-order-slideup-wrapper[b-3i8ql0mieo] {
    position: fixed;
    inset: 0;
    z-index: 1000;
    pointer-events: none;
}

.pos-order-slideup-wrapper.visible[b-3i8ql0mieo] {
    pointer-events: auto;
}

/* =================================================================
   BACKDROP
   ================================================================= */

.slideup-backdrop[b-3i8ql0mieo] {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.slideup-backdrop.show[b-3i8ql0mieo] {
    opacity: 1;
}

/* =================================================================
   PANEL
   ================================================================= */

.slideup-panel[b-3i8ql0mieo] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    max-height: 90vh;
    background: var(--simx-surface-alt, #fff);
    border-radius: 20px 20px 0 0;
    display: flex;
    flex-direction: column;
    transform: translateY(100%);
    transition: transform 0.35s cubic-bezier(0.32, 0.72, 0, 1);
    box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.15);
}

.slideup-panel.show[b-3i8ql0mieo] {
    transform: translateY(0);
}

/* =================================================================
   HANDLE
   ================================================================= */

.slideup-handle[b-3i8ql0mieo] {
    display: flex;
    justify-content: center;
    padding: 12px 0 8px;
    cursor: grab;
}

.slideup-handle .handle-bar[b-3i8ql0mieo] {
    width: 40px;
    height: 4px;
    background: var(--simx-border, #dee2e6);
    border-radius: 2px;
}

/* =================================================================
   HEADER
   ================================================================= */

.slideup-header[b-3i8ql0mieo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.25rem 1rem;
    border-bottom: 1px solid var(--simx-border, #dee2e6);
}

.slideup-header .header-left[b-3i8ql0mieo] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.slideup-header h5[b-3i8ql0mieo] {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--simx-text, #212529);
}

.slideup-header .tab-badge[b-3i8ql0mieo] {
    padding: 0.25rem 0.625rem;
    background: var(--simx-primary, #0d6efd);
    color: #fff;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 600;
}

.slideup-header .table-info[b-3i8ql0mieo] {
    font-size: 0.8125rem;
    color: var(--simx-text-muted, #6c757d);
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.slideup-header .close-btn[b-3i8ql0mieo] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: 50%;
    font-size: 1.25rem;
    color: var(--simx-text-muted, #6c757d);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

.slideup-header .close-btn:active[b-3i8ql0mieo] {
    background: var(--simx-surface-hover, #f0f0f0);
}

/* =================================================================
   CONTENT (CART ITEMS)
   ================================================================= */

.slideup-content[b-3i8ql0mieo] {
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    min-height: 200px;
    max-height: 40vh;
}

/* Empty State */
.empty-cart[b-3i8ql0mieo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    text-align: center;
    color: var(--simx-text-muted, #6c757d);
}

.empty-cart i[b-3i8ql0mieo] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
}

.empty-cart p[b-3i8ql0mieo] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 500;
    color: var(--simx-text, #212529);
}

.empty-cart span[b-3i8ql0mieo] {
    font-size: 0.875rem;
}

/* Cart Items */
.cart-items[b-3i8ql0mieo] {
    padding: 0.5rem 0;
}

.cart-item[b-3i8ql0mieo] {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--simx-border, #dee2e6);
}

.cart-item:last-child[b-3i8ql0mieo] {
    border-bottom: none;
}

.cart-item.sent[b-3i8ql0mieo] {
    background: var(--simx-surface, #f8f9fa);
}

.cart-item .item-main[b-3i8ql0mieo] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.cart-item .item-quantity[b-3i8ql0mieo] {
    min-width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--simx-primary, #0d6efd);
    color: #fff;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.9375rem;
    flex-shrink: 0;
}

.cart-item.sent .item-quantity[b-3i8ql0mieo] {
    background: var(--bs-success, #198754);
}

.cart-item .item-details[b-3i8ql0mieo] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

.cart-item .item-name[b-3i8ql0mieo] {
    font-weight: 500;
    color: var(--simx-text, #212529);
}

.cart-item .item-mods[b-3i8ql0mieo] {
    font-size: 0.8125rem;
    color: var(--simx-text-muted, #6c757d);
}

.cart-item .item-notes[b-3i8ql0mieo] {
    font-size: 0.8125rem;
    color: var(--bs-info, #0dcaf0);
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.cart-item .sent-badge[b-3i8ql0mieo] {
    font-size: 0.75rem;
    padding: 0.125rem 0.5rem;
    background: var(--bs-success, #198754);
    color: #fff;
    border-radius: 10px;
    width: fit-content;
}

.cart-item .item-price[b-3i8ql0mieo] {
    font-weight: 600;
    color: var(--simx-text, #212529);
    white-space: nowrap;
}

/* Item Actions */
.cart-item .item-actions[b-3i8ql0mieo] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.75rem;
    padding-left: calc(32px + 0.75rem); /* Align with item name */
}

.cart-item .qty-btn[b-3i8ql0mieo] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--simx-surface, #f8f9fa);
    border: 1px solid var(--simx-border, #dee2e6);
    border-radius: 8px;
    font-size: 1.125rem;
    color: var(--simx-text, #212529);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

.cart-item .qty-btn:active[b-3i8ql0mieo] {
    background: var(--simx-border, #dee2e6);
}

.cart-item .qty-value[b-3i8ql0mieo] {
    min-width: 24px;
    text-align: center;
    font-weight: 600;
}

.cart-item .remove-btn[b-3i8ql0mieo] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid var(--bs-danger, #dc3545);
    border-radius: 8px;
    font-size: 1rem;
    color: var(--bs-danger, #dc3545);
    cursor: pointer;
    margin-left: auto;
    -webkit-tap-highlight-color: transparent;
}

.cart-item .remove-btn:active[b-3i8ql0mieo] {
    background: var(--bs-danger, #dc3545);
    color: #fff;
}

/* =================================================================
   FOOTER
   ================================================================= */

.slideup-footer[b-3i8ql0mieo] {
    padding: 1rem 1.25rem;
    background: var(--simx-surface, #f8f9fa);
    border-top: 1px solid var(--simx-border, #dee2e6);
}

/* Totals Section */
.totals-section[b-3i8ql0mieo] {
    margin-bottom: 1rem;
}

.total-row[b-3i8ql0mieo] {
    display: flex;
    justify-content: space-between;
    padding: 0.375rem 0;
    font-size: 0.9375rem;
    color: var(--simx-text, #212529);
}

.total-row.discount[b-3i8ql0mieo] {
    color: var(--bs-success, #198754);
}

.total-row.grand-total[b-3i8ql0mieo] {
    padding-top: 0.75rem;
    margin-top: 0.5rem;
    border-top: 1px solid var(--simx-border, #dee2e6);
    font-size: 1.25rem;
    font-weight: 700;
}

.total-row.grand-total span:last-child[b-3i8ql0mieo] {
    color: var(--simx-primary, #0d6efd);
}

/* Actions Section */
.actions-section[b-3i8ql0mieo] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.action-btn[b-3i8ql0mieo] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    padding: 1rem;
    border: none;
    border-radius: 12px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: transform 0.15s ease;
}

.action-btn:active:not(:disabled)[b-3i8ql0mieo] {
    transform: scale(0.98);
}

.action-btn:disabled[b-3i8ql0mieo] {
    opacity: 0.5;
    cursor: not-allowed;
}

.action-btn i[b-3i8ql0mieo] {
    font-size: 1.25rem;
}

.action-btn .count-badge[b-3i8ql0mieo] {
    padding: 0.125rem 0.5rem;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    font-size: 0.8125rem;
}

.send-btn[b-3i8ql0mieo] {
    background: var(--bs-warning, #ffc107);
    color: #000;
}

.pay-btn[b-3i8ql0mieo] {
    background: var(--bs-success, #198754);
    color: #fff;
}

/* Secondary Actions */
.secondary-actions[b-3i8ql0mieo] {
    display: flex;
    gap: 0.5rem;
}

.secondary-btn[b-3i8ql0mieo] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    padding: 0.75rem 0.5rem;
    background: var(--simx-surface-alt, #fff);
    border: 1px solid var(--simx-border, #dee2e6);
    border-radius: 10px;
    font-size: 0.75rem;
    color: var(--simx-text-muted, #6c757d);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

.secondary-btn i[b-3i8ql0mieo] {
    font-size: 1.125rem;
    color: var(--simx-text, #212529);
}

.secondary-btn:active[b-3i8ql0mieo] {
    background: var(--simx-surface, #f8f9fa);
}

/* =================================================================
   SAFE AREA INSETS
   ================================================================= */

@supports (padding-bottom: env(safe-area-inset-bottom)) {
    .slideup-footer[b-3i8ql0mieo] {
        padding-bottom: calc(1rem + env(safe-area-inset-bottom));
    }
}

/* =================================================================
   DARK MODE
   ================================================================= */

@media (prefers-color-scheme: dark) {
    .slideup-panel[b-3i8ql0mieo] {
        background: var(--simx-surface-alt, #1e1e1e);
    }
    
    .slideup-header[b-3i8ql0mieo] {
        border-color: var(--simx-border, #333);
    }
    
    .slideup-header .close-btn:active[b-3i8ql0mieo] {
        background: var(--simx-surface-hover, #333);
    }
    
    .cart-item[b-3i8ql0mieo] {
        border-color: var(--simx-border, #333);
    }
    
    .cart-item.sent[b-3i8ql0mieo] {
        background: var(--simx-surface, #2a2a2a);
    }
    
    .slideup-footer[b-3i8ql0mieo] {
        background: var(--simx-surface, #1a1a1a);
        border-color: var(--simx-border, #333);
    }
    
    .cart-item .qty-btn[b-3i8ql0mieo] {
        background: var(--simx-surface, #2a2a2a);
        border-color: var(--simx-border, #444);
    }
    
    .cart-item .qty-btn:active[b-3i8ql0mieo] {
        background: var(--simx-border, #444);
    }
    
    .secondary-btn[b-3i8ql0mieo] {
        background: var(--simx-surface-alt, #242424);
        border-color: var(--simx-border, #444);
    }
    
    .secondary-btn:active[b-3i8ql0mieo] {
        background: var(--simx-surface, #2a2a2a);
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/FoodAndBev/POSStaffLogin.razor.rz.scp.css */
/* POSStaffLogin.razor.css — POS Staff PIN-pad login */

/* ================================================================
   OVERLAY
   ================================================================ */

.staff-login-overlay[b-829yqlh3zn] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease;
}

.staff-login-overlay.visible[b-829yqlh3zn] {
    opacity: 1;
    visibility: visible;
}

/* ================================================================
   PANEL
   ================================================================ */

.staff-login-panel[b-829yqlh3zn] {
    background: var(--simx-surface-alt, #fff);
    border-radius: 16px;
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.3);
    width: min(480px, 95vw);
    max-height: 90vh;
    overflow-y: auto;
    animation: staff-panel-in-b-829yqlh3zn 0.3s ease;
}

@keyframes staff-panel-in-b-829yqlh3zn {
    from { transform: scale(0.95) translateY(20px); opacity: 0; }
    to { transform: scale(1) translateY(0); opacity: 1; }
}

/* ================================================================
   HEADER
   ================================================================ */

.staff-login-header[b-829yqlh3zn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--simx-border, #e9ecef);
}

.staff-login-title[b-829yqlh3zn] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--simx-text, #212529);
}

.staff-login-title i[b-829yqlh3zn] {
    font-size: 1.25rem;
    color: var(--simx-primary, #0d6efd);
}

.staff-login-close[b-829yqlh3zn] {
    background: none;
    border: none;
    color: var(--simx-text-muted, #6c757d);
    font-size: 1.125rem;
    padding: 0.25rem;
    cursor: pointer;
    border-radius: 6px;
    transition: background 0.15s;
}

.staff-login-close:hover[b-829yqlh3zn] {
    background: var(--simx-surface, #f8f9fa);
    color: var(--simx-text, #212529);
}

/* ================================================================
   LOADING & EMPTY
   ================================================================ */

.staff-login-loading[b-829yqlh3zn] {
    display: flex;
    justify-content: center;
    padding: 3rem;
}

.staff-login-empty[b-829yqlh3zn] {
    text-align: center;
    padding: 2.5rem 1.5rem;
    color: var(--simx-text-muted, #6c757d);
}

.staff-login-empty i[b-829yqlh3zn] {
    font-size: 3rem;
    margin-bottom: 1rem;
    display: block;
}

.staff-login-empty h5[b-829yqlh3zn] {
    color: var(--simx-text, #212529);
    margin-bottom: 0.5rem;
}

/* ================================================================
   STAFF GRID
   ================================================================ */

.staff-login-subtitle[b-829yqlh3zn] {
    text-align: center;
    padding: 1rem 1.5rem 0.5rem;
    font-size: 0.875rem;
    color: var(--simx-text-muted, #6c757d);
    font-weight: 500;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.staff-grid[b-829yqlh3zn] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
    gap: 0.75rem;
    padding: 0.75rem 1.5rem 1.5rem;
}

.staff-card[b-829yqlh3zn] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.375rem;
    padding: 1rem 0.5rem;
    background: var(--simx-surface, #f8f9fa);
    border: 2px solid transparent;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
}

.staff-card:hover[b-829yqlh3zn] {
    border-color: var(--simx-primary, #0d6efd);
    background: #fff;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.staff-card.active[b-829yqlh3zn] {
    border-color: var(--bs-success, #198754);
    background: rgba(25, 135, 84, 0.05);
}

.staff-avatar[b-829yqlh3zn] {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--simx-primary, #0d6efd), #6610f2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: 0.5px;
}

.staff-name[b-829yqlh3zn] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--simx-text, #212529);
    text-align: center;
    line-height: 1.2;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.staff-role[b-829yqlh3zn] {
    font-size: 0.6875rem;
    color: var(--simx-text-muted, #6c757d);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.staff-active-badge[b-829yqlh3zn] {
    position: absolute;
    top: 0.375rem;
    right: 0.375rem;
    color: var(--bs-success, #198754);
    font-size: 0.875rem;
}

/* ================================================================
   PIN SECTION
   ================================================================ */

.pin-section[b-829yqlh3zn] {
    padding: 1.5rem;
}

.pin-back-btn[b-829yqlh3zn] {
    background: none;
    border: none;
    color: var(--simx-primary, #0d6efd);
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    padding: 0.25rem 0;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.pin-back-btn:hover[b-829yqlh3zn] {
    text-decoration: underline;
}

.pin-staff-info[b-829yqlh3zn] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}

.pin-avatar[b-829yqlh3zn] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--simx-primary, #0d6efd), #6610f2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.375rem;
    font-weight: 700;
}

.pin-name[b-829yqlh3zn] {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--simx-text, #212529);
}

/* ================================================================
   PIN DOTS
   ================================================================ */

.pin-display[b-829yqlh3zn] {
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.pin-dot[b-829yqlh3zn] {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid var(--simx-border, #dee2e6);
    background: transparent;
    transition: all 0.15s ease;
}

.pin-dot.filled[b-829yqlh3zn] {
    background: var(--simx-primary, #0d6efd);
    border-color: var(--simx-primary, #0d6efd);
    transform: scale(1.1);
}

.pin-dot.error[b-829yqlh3zn] {
    border-color: var(--bs-danger, #dc3545);
    background: var(--bs-danger, #dc3545);
    animation: pin-shake-b-829yqlh3zn 0.3s ease;
}

@keyframes pin-shake-b-829yqlh3zn {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-4px); }
    50% { transform: translateX(4px); }
    75% { transform: translateX(-4px); }
}

.pin-error-msg[b-829yqlh3zn] {
    text-align: center;
    color: var(--bs-danger, #dc3545);
    font-size: 0.8125rem;
    margin-bottom: 0.75rem;
    font-weight: 500;
}

.pin-validating[b-829yqlh3zn] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    color: var(--simx-primary, #0d6efd);
    font-size: 0.875rem;
}

/* ================================================================
   PIN PAD
   ================================================================ */

.pin-pad[b-829yqlh3zn] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.625rem;
    max-width: 280px;
    margin: 0 auto 1rem;
}

.pin-key[b-829yqlh3zn] {
    aspect-ratio: 1.6;
    border: 1px solid var(--simx-border, #dee2e6);
    border-radius: 12px;
    background: var(--simx-surface, #f8f9fa);
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--simx-text, #212529);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.1s ease;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}

.pin-key:hover:not(:disabled)[b-829yqlh3zn] {
    background: var(--simx-primary, #0d6efd);
    color: #fff;
    border-color: var(--simx-primary, #0d6efd);
}

.pin-key:active:not(:disabled)[b-829yqlh3zn] {
    transform: scale(0.95);
}

.pin-key:disabled[b-829yqlh3zn] {
    opacity: 0.5;
    cursor: not-allowed;
}

.pin-key.empty[b-829yqlh3zn] {
    border: none;
    background: transparent;
    cursor: default;
}

.pin-key.delete[b-829yqlh3zn] {
    font-size: 1.25rem;
    color: var(--simx-text-muted, #6c757d);
}

.pin-key.delete:hover:not(:disabled)[b-829yqlh3zn] {
    background: var(--bs-danger, #dc3545);
    color: #fff;
    border-color: var(--bs-danger, #dc3545);
}

/* ================================================================
   PIN HINT
   ================================================================ */

.pin-hint[b-829yqlh3zn] {
    text-align: center;
    font-size: 0.8125rem;
    color: var(--simx-text-muted, #6c757d);
}

.pin-hint-no-pin[b-829yqlh3zn] {
    color: var(--bs-warning, #ffc107);
}

/* ================================================================
   ACTIVE STAFF BAR
   ================================================================ */

.staff-login-active-bar[b-829yqlh3zn] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    background: rgba(25, 135, 84, 0.08);
    border-top: 1px solid var(--simx-border, #e9ecef);
    font-size: 0.875rem;
    color: var(--simx-text, #212529);
}

.staff-login-active-bar i[b-829yqlh3zn] {
    color: var(--bs-success, #198754);
}

/* ================================================================
   RESPONSIVE
   ================================================================ */

@media (max-width: 480px) {
    .staff-login-panel[b-829yqlh3zn] {
        border-radius: 16px 16px 0 0;
        max-height: 95vh;
        width: 100vw;
        align-self: flex-end;
    }

    .staff-grid[b-829yqlh3zn] {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.5rem;
        padding: 0.5rem 1rem 1rem;
    }

    .staff-card[b-829yqlh3zn] {
        padding: 0.75rem 0.25rem;
    }

    .pin-pad[b-829yqlh3zn] {
        max-width: 260px;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/FoodAndBev/ResponsivePOSLayout.razor.rz.scp.css */
/* ResponsivePOSLayout.razor.css - Responsive POS layout styles */

/* =================================================================
   BASE LAYOUT
   ================================================================= */

.pos-layout[b-xia5n0729x] {
    display: flex;
    height: 100%;
    min-height: 500px;
    background-color: var(--simx-surface, #f8f9fa);
}

.pos-menu-section[b-xia5n0729x] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* =================================================================
   DESKTOP LAYOUT (>=1200px)
   ================================================================= */

.pos-layout-desktop[b-xia5n0729x] {
    flex-direction: row;
    gap: 0;
}

.pos-layout-desktop .pos-menu-section[b-xia5n0729x] {
    border-right: 1px solid var(--simx-border, #dee2e6);
}

.pos-layout-desktop .pos-order-section[b-xia5n0729x] {
    width: 400px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    background: var(--simx-surface-alt, #fff);
}

/* =================================================================
   TABLET LAYOUT (768-1199px)
   ================================================================= */

.pos-layout-tablet[b-xia5n0729x] {
    flex-direction: column;
}

.pos-layout-tablet .pos-menu-tablet[b-xia5n0729x] {
    flex: 1;
    overflow-y: auto;
    padding-bottom: 70px; /* Space for order bar */
}

.pos-layout-tablet .pos-order-bar[b-xia5n0729x] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--simx-surface-alt, #fff);
    border-top: 1px solid var(--simx-border, #dee2e6);
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.1);
    z-index: 100;
    transition: max-height 0.3s ease;
}

.pos-layout-tablet .pos-order-bar.collapsed[b-xia5n0729x] {
    max-height: 70px;
}

.pos-layout-tablet .pos-order-bar.expanded[b-xia5n0729x] {
    max-height: 60vh;
}

.pos-layout-tablet .order-summary[b-xia5n0729x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    cursor: pointer;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}

.pos-layout-tablet .order-summary:active[b-xia5n0729x] {
    background: var(--simx-surface-hover, #f8f9fa);
}

.pos-layout-tablet .summary-left[b-xia5n0729x],
.pos-layout-tablet .summary-right[b-xia5n0729x] {
    display: flex;
    align-items: center;
}

.pos-layout-tablet .item-count[b-xia5n0729x] {
    font-weight: 500;
    color: var(--simx-text-muted, #6c757d);
}

.pos-layout-tablet .order-total[b-xia5n0729x] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--simx-primary, #0d6efd);
}

.pos-layout-tablet .order-panel-content[b-xia5n0729x] {
    max-height: calc(60vh - 70px);
    overflow-y: auto;
    padding: 0 1rem 1rem;
    border-top: 1px solid var(--simx-border, #dee2e6);
}

.pos-layout-tablet .order-quick-actions[b-xia5n0729x] {
    display: flex;
    gap: 0.5rem;
    padding: 0 1rem 1rem;
}

/* =================================================================
   PHONE LAYOUT (<768px)
   ================================================================= */

.pos-layout-phone[b-xia5n0729x] {
    flex-direction: column;
    position: relative;
}

.pos-layout-phone .pos-menu-mobile[b-xia5n0729x] {
    flex: 1;
    overflow-y: auto;
    padding-bottom: 100px; /* Space for FAB */
}

/* Floating Action Button */
.pos-order-fab[b-xia5n0729x] {
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.25rem;
    background: var(--simx-primary, #0d6efd);
    color: #fff;
    border-radius: 50px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
    cursor: pointer;
    z-index: 99;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    -webkit-tap-highlight-color: transparent;
}

.pos-order-fab:active[b-xia5n0729x] {
    transform: scale(0.95);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.pos-order-fab .fab-content[b-xia5n0729x] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.25rem;
}

.pos-order-fab .badge[b-xia5n0729x] {
    background: #fff;
    color: var(--simx-primary, #0d6efd);
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 600;
}

.pos-order-fab .fab-total[b-xia5n0729x] {
    font-weight: 600;
    font-size: 1rem;
}

/* Slide-up Order Panel */
.pos-order-slideup[b-xia5n0729x] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--simx-surface-alt, #fff);
    border-radius: 20px 20px 0 0;
    box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.2);
    z-index: 1001;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
    transform: translateY(100%);
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.pos-order-slideup.show[b-xia5n0729x] {
    transform: translateY(0);
}

.slideup-handle[b-xia5n0729x] {
    padding: 12px 0 8px;
    cursor: grab;
    display: flex;
    justify-content: center;
}

.slideup-handle .handle-bar[b-xia5n0729x] {
    width: 40px;
    height: 4px;
    background: var(--simx-border, #dee2e6);
    border-radius: 2px;
}

.slideup-header[b-xia5n0729x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.25rem 1rem;
    border-bottom: 1px solid var(--simx-border, #dee2e6);
}

.slideup-header h5[b-xia5n0729x] {
    color: var(--simx-text, #212529);
}

.slideup-content[b-xia5n0729x] {
    flex: 1;
    overflow-y: auto;
    padding: 1rem 1.25rem;
    -webkit-overflow-scrolling: touch;
}

.slideup-actions[b-xia5n0729x] {
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--simx-border, #dee2e6);
    background: var(--simx-surface, #f8f9fa);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* Backdrop */
.slideup-backdrop[b-xia5n0729x] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.slideup-backdrop.show[b-xia5n0729x] {
    opacity: 1;
    visibility: visible;
}

/* =================================================================
   TOUCH OPTIMIZATIONS
   ================================================================= */

@media (pointer: coarse) {
    .pos-order-fab[b-xia5n0729x] {
        min-height: 56px;
        padding: 1rem 1.5rem;
    }
    
    .slideup-handle[b-xia5n0729x] {
        padding: 16px 0 12px;
    }
    
    .slideup-handle .handle-bar[b-xia5n0729x] {
        width: 48px;
        height: 5px;
    }
}

/* =================================================================
   SAFE AREA INSETS (for notched phones)
   ================================================================= */

@supports (padding-bottom: env(safe-area-inset-bottom)) {
    .pos-layout-phone .pos-menu-mobile[b-xia5n0729x] {
        padding-bottom: calc(100px + env(safe-area-inset-bottom));
    }
    
    .pos-order-fab[b-xia5n0729x] {
        bottom: calc(20px + env(safe-area-inset-bottom));
    }
    
    .slideup-actions[b-xia5n0729x] {
        padding-bottom: calc(1rem + env(safe-area-inset-bottom));
    }
}

/* =================================================================
   DARK MODE SUPPORT
   ================================================================= */

@media (prefers-color-scheme: dark) {
    .pos-layout[b-xia5n0729x] {
        --simx-surface: #1a1a1a;
        --simx-surface-alt: #242424;
        --simx-surface-hover: #2a2a2a;
        --simx-border: #333;
        --simx-text: #f8f9fa;
        --simx-text-muted: #adb5bd;
    }
    
    .pos-order-fab .badge[b-xia5n0729x] {
        background: #333;
        color: #fff;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskBestLaps.razor.rz.scp.css */
/*
 * KioskBestLaps.razor.css
 * World-class personal records & leaderboard — dark kiosk theme
 */

/* ===== Layout ===== */
.kiosk-best-laps[b-6ug002z4es] {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
}

.best-laps-body[b-6ug002z4es] {
    flex: 1;
    overflow-y: auto;
    padding: 16px 32px 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* ===== Stats Row ===== */
.stats-row[b-6ug002z4es] {
    display: flex;
    gap: 14px;
    flex-shrink: 0;
}

.stat-card[b-6ug002z4es] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 18px 12px;
    background: var(--kiosk-surface);
    border: 1px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius);
    transition: transform 0.2s;
}

.stat-icon[b-6ug002z4es] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 1.15rem;
    margin-bottom: 4px;
}

.accent-primary .stat-icon[b-6ug002z4es]  { background: rgba(59,130,246,0.15); color: #60a5fa; }
.accent-gold .stat-icon[b-6ug002z4es]     { background: rgba(255,215,0,0.15);  color: #ffd700; }
.accent-success .stat-icon[b-6ug002z4es]  { background: rgba(34,197,94,0.15);  color: #4ade80; }
.accent-secondary .stat-icon[b-6ug002z4es]{ background: rgba(139,92,246,0.15); color: #a78bfa; }
.accent-muted .stat-icon[b-6ug002z4es]    { background: rgba(148,163,184,0.08);color: var(--kiosk-text-dim); }

.stat-value[b-6ug002z4es] {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--kiosk-text);
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}

.stat-value.stat-time[b-6ug002z4es] {
    font-size: 1.15rem;
}

.stat-label[b-6ug002z4es] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--kiosk-text-muted);
}

/* ===== Skeleton stats ===== */
.skeleton-stats .stat-card[b-6ug002z4es] {
    pointer-events: none;
}

.skeleton-block[b-6ug002z4es] {
    border-radius: 6px;
    background: linear-gradient(90deg, var(--kiosk-surface-hover) 25%, var(--kiosk-surface-elevated) 50%, var(--kiosk-surface-hover) 75%);
    background-size: 400% 100%;
    animation: shimmer-b-6ug002z4es 1.5s infinite;
}

.stat-skel-icon[b-6ug002z4es]  { width: 40px; height: 40px; border-radius: 50%; }
.stat-skel-value[b-6ug002z4es] { width: 48px; height: 20px; }
.stat-skel-label[b-6ug002z4es] { width: 60px; height: 10px; }

@keyframes shimmer-b-6ug002z4es {
    0%   { background-position: 100% 0; }
    100% { background-position: -100% 0; }
}

/* ===== Leaderboard skeleton ===== */
.leaderboard-skeleton[b-6ug002z4es] {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius);
    overflow: hidden;
}

.skeleton-row[b-6ug002z4es] {
    display: grid;
    grid-template-columns: 60px 1fr 110px;
    gap: 12px;
    padding: 14px 16px;
    border-top: 1px solid var(--kiosk-border);
}

.skeleton-row:first-child[b-6ug002z4es] { border-top: none; }

.skel-rank[b-6ug002z4es] { width: 28px; height: 14px; border-radius: 7px; }
.skel-name[b-6ug002z4es] { width: 55%; height: 14px; border-radius: 7px; }
.skel-time[b-6ug002z4es] { width: 80px; height: 14px; border-radius: 7px; justify-self: end; }

/* ===== Leaderboard Table ===== */
.section-heading[b-6ug002z4es] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 14px;
    font-size: 1rem;
    font-weight: 700;
    color: var(--kiosk-text);
}

.section-heading i[b-6ug002z4es] {
    color: var(--kiosk-primary);
}

.lb-table[b-6ug002z4es] {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius);
    overflow: hidden;
}

.lb-header-row[b-6ug002z4es] {
    display: grid;
    grid-template-columns: 60px 1fr 120px 100px;
    padding: 10px 16px;
    background: rgba(255,255,255,0.03);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--kiosk-text-dim);
    text-transform: uppercase;
}

.lb-row[b-6ug002z4es] {
    display: grid;
    grid-template-columns: 60px 1fr 120px 100px;
    align-items: center;
    padding: 13px 16px;
    border-top: 1px solid var(--kiosk-border);
    font-size: 0.9rem;
    transition: background 0.15s;
}

.lb-row:hover[b-6ug002z4es] {
    background: rgba(255,255,255,0.02);
}

/* Rank accents */
.lb-row.rank-gold[b-6ug002z4es]   { border-left: 3px solid #ffd700; }
.lb-row.rank-silver[b-6ug002z4es] { border-left: 3px solid #c0c0c0; }
.lb-row.rank-bronze[b-6ug002z4es] { border-left: 3px solid #cd7f32; }

/* Current user highlight */
.lb-row.is-you[b-6ug002z4es] {
    background: rgba(59,130,246,0.10);
    border-left: 3px solid var(--kiosk-primary);
    box-shadow: inset 0 0 20px rgba(59,130,246,0.06);
}

.lb-col-rank[b-6ug002z4es] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-weight: 700;
}

.rank-medal[b-6ug002z4es] { font-size: 1.2rem; }
.rank-num[b-6ug002z4es]   { color: var(--kiosk-text-muted); }

.lb-col-driver[b-6ug002z4es] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    color: var(--kiosk-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.driver-name[b-6ug002z4es] {
    overflow: hidden;
    text-overflow: ellipsis;
}

.you-tag[b-6ug002z4es] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 1px 8px;
    border-radius: 4px;
    background: var(--kiosk-primary);
    color: #fff;
    font-size: 0.6rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    flex-shrink: 0;
}

.lb-col-time[b-6ug002z4es] {
    font-weight: 700;
    color: var(--kiosk-text);
    font-variant-numeric: tabular-nums;
    font-family: 'JetBrains Mono', 'Cascadia Code', 'Consolas', monospace;
}

.lb-col-gap[b-6ug002z4es] {
    color: var(--kiosk-text-muted);
    font-size: 0.85rem;
    font-variant-numeric: tabular-nums;
}

.leader-label[b-6ug002z4es] {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: #ffd700;
    text-transform: uppercase;
}

/* ===== Encouragement Card ===== */
.encouragement-card[b-6ug002z4es] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 24px;
    background: linear-gradient(135deg, rgba(59,130,246,0.08) 0%, rgba(139,92,246,0.05) 100%);
    border: 1px solid rgba(59,130,246,0.2);
    border-radius: var(--kiosk-radius);
}

.encouragement-icon[b-6ug002z4es] {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(59,130,246,0.15);
    font-size: 1.3rem;
    color: #60a5fa;
    flex-shrink: 0;
}

.encouragement-text h4[b-6ug002z4es] {
    margin: 0 0 2px;
    font-size: 1rem;
    font-weight: 700;
    color: var(--kiosk-text);
}

.encouragement-text p[b-6ug002z4es] {
    margin: 0;
    font-size: 0.85rem;
    color: var(--kiosk-text-muted);
}

/* ===== Empty State ===== */
.best-laps-empty[b-6ug002z4es] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 48px 24px;
    gap: 16px;
}

.empty-visual[b-6ug002z4es] {
    position: relative;
    margin-bottom: 8px;
}

.empty-icon-ring[b-6ug002z4es] {
    width: 96px;
    height: 96px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--kiosk-surface);
    border: 2px solid var(--kiosk-border);
    position: relative;
    z-index: 1;
}

.empty-icon-ring i[b-6ug002z4es] {
    font-size: 2.5rem;
    background: linear-gradient(135deg, var(--kiosk-primary), var(--kiosk-secondary));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.empty-glow[b-6ug002z4es] {
    position: absolute;
    inset: -12px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(59,130,246,0.12) 0%, transparent 70%);
    animation: glowPulse-b-6ug002z4es 3s ease-in-out infinite;
}

@keyframes glowPulse-b-6ug002z4es {
    0%, 100% { opacity: 0.5; transform: scale(1); }
    50%      { opacity: 1;   transform: scale(1.1); }
}

.best-laps-empty h3[b-6ug002z4es] {
    margin: 0;
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--kiosk-text);
}

.best-laps-empty p[b-6ug002z4es] {
    margin: 0;
    font-size: 0.95rem;
    color: var(--kiosk-text-muted);
    max-width: 320px;
}

.empty-cta[b-6ug002z4es] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    padding: 10px 20px;
    border-radius: var(--kiosk-radius);
    background: rgba(59,130,246,0.08);
    border: 1px solid rgba(59,130,246,0.2);
    color: #60a5fa;
    font-size: 0.85rem;
    font-weight: 600;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskContainer.razor.rz.scp.css */
/* 
 * KioskContainer.razor.css
 * Main kiosk container styles - touch-optimized with enhanced dark theme
 */

/* ===== CSS Variables (Enhanced Dark Theme) ===== */
.kiosk-container[b-d4cvt0qs9v] {
    /* Background colors */
    --kiosk-bg: #0a0a14;
    --kiosk-bg-gradient: linear-gradient(180deg, #0a0a14 0%, #0f0f1a 100%);
    --kiosk-surface: #13132a;
    --kiosk-surface-hover: #1a1a3a;
    --kiosk-surface-elevated: #1f1f40;
    
    /* Primary accent colors */
    --kiosk-primary: #3b82f6;
    --kiosk-primary-hover: #2563eb;
    --kiosk-secondary: #8b5cf6;
    --kiosk-accent-gradient: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
    
    /* Text colors */
    --kiosk-text: #f8fafc;
    --kiosk-text-muted: #94a3b8;
    --kiosk-text-dim: #64748b;
    
    /* Status colors */
    --kiosk-success: #22c55e;
    --kiosk-warning: #f59e0b;
    --kiosk-error: #ef4444;
    
    /* Border colors */
    --kiosk-border: rgba(255, 255, 255, 0.08);
    --kiosk-border-hover: rgba(255, 255, 255, 0.15);
    
    /* Glow effects */
    --kiosk-glow-primary: rgba(59, 130, 246, 0.4);
    --kiosk-glow-secondary: rgba(139, 92, 246, 0.3);
    
    /* Touch-friendly sizing */
    --kiosk-touch-target: 48px;
    --kiosk-button-height: 56px;
    --kiosk-input-height: 56px;
    --kiosk-spacing-xs: 8px;
    --kiosk-spacing-sm: 16px;
    --kiosk-spacing-md: 24px;
    --kiosk-spacing-lg: 32px;
    --kiosk-spacing-xl: 48px;
    --kiosk-radius: 12px;
    --kiosk-radius-lg: 16px;
    
    /* Typography */
    --kiosk-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --kiosk-font-display: 'Inter', sans-serif;
    
    /* Apply base styles */
    font-family: var(--kiosk-font);
    background: var(--kiosk-bg-gradient);
    color: var(--kiosk-text);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.kiosk-container.fullscreen[b-d4cvt0qs9v] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
}

/* ===== Global Scrollbar Styling (Dark Theme) ===== */
.kiosk-container[b-d4cvt0qs9v],
.kiosk-container *[b-d4cvt0qs9v] {
    scrollbar-width: thin;
    scrollbar-color: var(--kiosk-primary) var(--kiosk-surface);
}

.kiosk-container [b-d4cvt0qs9v]::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.kiosk-container [b-d4cvt0qs9v]::-webkit-scrollbar-track {
    background: var(--kiosk-surface);
    border-radius: 4px;
}

.kiosk-container [b-d4cvt0qs9v]::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--kiosk-primary), var(--kiosk-secondary));
    border-radius: 4px;
    border: 2px solid var(--kiosk-surface);
}

.kiosk-container [b-d4cvt0qs9v]::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, var(--kiosk-primary-hover), var(--kiosk-secondary));
}

.kiosk-container [b-d4cvt0qs9v]::-webkit-scrollbar-corner {
    background: var(--kiosk-surface);
}

/* ===== Content Area ===== */
.kiosk-content[b-d4cvt0qs9v] {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    overflow-x: hidden;
    animation: fadeSlideIn-b-d4cvt0qs9v 0.3s ease-out;
}

@keyframes fadeSlideIn-b-d4cvt0qs9v {
    from {
        opacity: 0;
        transform: translateX(20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* ===== Footer ===== */
.kiosk-footer[b-d4cvt0qs9v] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px var(--kiosk-spacing-md);
    background: rgba(0, 0, 0, 0.4);
    border-top: 1px solid var(--kiosk-border);
    backdrop-filter: blur(10px);
}

.powered-by[b-d4cvt0qs9v] {
    font-size: 0.75rem;
    color: var(--kiosk-text-dim);
    letter-spacing: 0.02em;
}

.user-info[b-d4cvt0qs9v] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.875rem;
    color: var(--kiosk-text);
}

.user-info i[b-d4cvt0qs9v] {
    font-size: 1.25rem;
    color: var(--kiosk-primary);
}

.user-info .short-code[b-d4cvt0qs9v] {
    font-size: 0.75rem;
    color: var(--kiosk-text-muted);
    font-family: monospace;
}

/* ===== Selection Screen Layout ===== */
[b-d4cvt0qs9v] .kiosk-selection-screen {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* ===== Global Button Styles ===== */
[b-d4cvt0qs9v] .kiosk-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: 140px;
    min-height: var(--kiosk-button-height);
    padding: 14px 24px;
    border: none;
    border-radius: var(--kiosk-radius);
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

[b-d4cvt0qs9v] .kiosk-btn i {
    font-size: 1.25rem;
}

[b-d4cvt0qs9v] .kiosk-btn-primary {
    background: var(--kiosk-accent-gradient);
    color: white;
    box-shadow: 0 4px 16px var(--kiosk-glow-primary);
}

[b-d4cvt0qs9v] .kiosk-btn-primary:hover:not(:disabled),
[b-d4cvt0qs9v] .kiosk-btn-primary:focus-visible:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px var(--kiosk-glow-primary);
}

[b-d4cvt0qs9v] .kiosk-btn-primary:active:not(:disabled) {
    transform: translateY(0) scale(0.98);
}

[b-d4cvt0qs9v] .kiosk-btn-primary:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

[b-d4cvt0qs9v] .kiosk-btn-secondary {
    background: var(--kiosk-surface);
    color: var(--kiosk-text);
    border: 2px solid var(--kiosk-border);
}

[b-d4cvt0qs9v] .kiosk-btn-secondary:hover:not(:disabled) {
    background: var(--kiosk-surface-hover);
    border-color: var(--kiosk-primary);
}

[b-d4cvt0qs9v] .kiosk-btn-outline {
    background: transparent;
    color: var(--kiosk-text-muted);
    border: 2px solid var(--kiosk-border);
}

[b-d4cvt0qs9v] .kiosk-btn-outline:hover:not(:disabled) {
    background: var(--kiosk-surface);
    color: var(--kiosk-text);
    border-color: var(--kiosk-text-muted);
}

/* ===== Back Button ===== */
[b-d4cvt0qs9v] .kiosk-back-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    background: var(--kiosk-surface);
    border: 1px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius);
    color: var(--kiosk-text);
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    touch-action: manipulation;
}

[b-d4cvt0qs9v] .kiosk-back-btn:hover,
[b-d4cvt0qs9v] .kiosk-back-btn:focus-visible {
    background: var(--kiosk-surface-hover);
    border-color: var(--kiosk-primary);
    color: var(--kiosk-primary);
}

[b-d4cvt0qs9v] .kiosk-back-btn:active {
    transform: scale(0.98);
}

[b-d4cvt0qs9v] .kiosk-back-btn i {
    font-size: 1.25rem;
}

/* ===== Screen Header ===== */
[b-d4cvt0qs9v] .kiosk-screen-header {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px 24px;
    background: rgba(0, 0, 0, 0.3);
    border-bottom: 1px solid var(--kiosk-border);
}

[b-d4cvt0qs9v] .screen-title {
    flex: 1;
    text-align: center;
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0;
    color: var(--kiosk-text);
}

/* ===== Form Inputs ===== */
[b-d4cvt0qs9v] .kiosk-input {
    width: 100%;
    min-height: var(--kiosk-input-height);
    padding: 16px 20px;
    background: var(--kiosk-surface);
    border: 2px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius);
    color: var(--kiosk-text);
    font-size: 1rem;
    transition: all 0.2s ease;
}

[b-d4cvt0qs9v] .kiosk-input:focus {
    outline: none;
    border-color: var(--kiosk-primary);
    box-shadow: 0 0 0 3px var(--kiosk-glow-primary);
}

[b-d4cvt0qs9v] .kiosk-input::placeholder {
    color: var(--kiosk-text-muted);
}

/* ===== Loading Overlay ===== */
[b-d4cvt0qs9v] .kiosk-loading-overlay {
    position: fixed;
    inset: 0;
    background: rgba(10, 10, 20, 0.9);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 24px;
    z-index: 10000;
}

[b-d4cvt0qs9v] .kiosk-spinner {
    width: 64px;
    height: 64px;
    border: 4px solid var(--kiosk-surface);
    border-top-color: var(--kiosk-primary);
    border-radius: 50%;
    animation: spin-b-d4cvt0qs9v 1s linear infinite;
}

@keyframes spin-b-d4cvt0qs9v {
    to { transform: rotate(360deg); }
}

[b-d4cvt0qs9v] .kiosk-loading-text {
    font-size: 1.125rem;
    color: var(--kiosk-text-muted);
}

/* ===== Responsive ===== */
@media (max-width: 768px) {
    .kiosk-footer[b-d4cvt0qs9v] {
        padding: 12px 16px;
    }
    
    [b-d4cvt0qs9v] .kiosk-btn {
        min-width: auto;
        min-height: 48px;
        padding: 12px 20px;
        font-size: 0.9rem;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskContestResults.razor.rz.scp.css */
/*
 * KioskContestResults.razor.css
 * World-class contest browser — dark kiosk theme, touch-optimized
 */

/* ===== Layout ===== */
.kiosk-contests[b-vy3krblujm] {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
}

/* ===== Filter Tabs ===== */
.contest-filters[b-vy3krblujm] {
    display: flex;
    gap: 8px;
    padding: 12px 32px;
    flex-shrink: 0;
}

.filter-tab[b-vy3krblujm] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 16px;
    background: var(--kiosk-surface);
    border: 1px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius);
    color: var(--kiosk-text-muted);
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

.filter-tab:hover[b-vy3krblujm] {
    background: var(--kiosk-surface-hover);
    border-color: var(--kiosk-border-hover);
}

.filter-tab.active[b-vy3krblujm] {
    background: linear-gradient(135deg, rgba(59,130,246,0.15), rgba(139,92,246,0.10));
    border-color: var(--kiosk-primary);
    color: var(--kiosk-text);
    box-shadow: 0 0 16px rgba(59,130,246,0.15);
}

.filter-tab .count-badge[b-vy3krblujm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border-radius: 11px;
    background: var(--kiosk-primary);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
}

/* ===== Contest List ===== */
.contest-list[b-vy3krblujm] {
    flex: 1;
    overflow-y: auto;
    padding: 8px 32px 24px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* ===== Contest Card ===== */
.contest-card[b-vy3krblujm] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 20px 24px;
    background: var(--kiosk-surface);
    border: 1px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius-lg);
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.4,0,0.2,1);
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    text-align: left;
    width: 100%;
    color: inherit;
    overflow: hidden;
}

.contest-card:hover[b-vy3krblujm] {
    transform: translateY(-2px);
    border-color: var(--kiosk-border-hover);
    box-shadow: 0 8px 32px rgba(0,0,0,0.25);
}

.contest-card.featured[b-vy3krblujm] {
    border-color: rgba(245,158,11,0.35);
    background: linear-gradient(135deg, var(--kiosk-surface) 80%, rgba(245,158,11,0.06) 100%);
}

.featured-ribbon[b-vy3krblujm] {
    position: absolute;
    top: 12px;
    right: -2px;
    padding: 3px 12px 3px 10px;
    background: linear-gradient(135deg, #f59e0b, #d97706);
    color: #000;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    border-radius: 4px 0 0 4px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.card-top[b-vy3krblujm] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

.card-title-area h3[b-vy3krblujm] {
    margin: 0 0 6px;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--kiosk-text);
}

.card-chips[b-vy3krblujm] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.chip[b-vy3krblujm] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.chip-type[b-vy3krblujm], .chip-type-sm[b-vy3krblujm] {
    background: rgba(59,130,246,0.15);
    color: #60a5fa;
}

.chip-activity[b-vy3krblujm], .chip-activity-sm[b-vy3krblujm] {
    background: rgba(139,92,246,0.15);
    color: #a78bfa;
}

.chip-live[b-vy3krblujm] {
    background: rgba(34,197,94,0.15);
    color: #4ade80;
}

.chip-upcoming[b-vy3krblujm] {
    background: rgba(245,158,11,0.15);
    color: #fbbf24;
}

.chip-completed[b-vy3krblujm] {
    background: rgba(148,163,184,0.12);
    color: var(--kiosk-text-muted);
}

.live-dot[b-vy3krblujm] {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #22c55e;
    animation: livePulse-b-vy3krblujm 1.5s ease-in-out infinite;
}

@keyframes livePulse-b-vy3krblujm {
    0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(34,197,94,0.5); }
    50% { opacity: 0.7; box-shadow: 0 0 0 6px rgba(34,197,94,0); }
}

.card-status[b-vy3krblujm] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--kiosk-text-muted);
    flex-shrink: 0;
}

.status-dot[b-vy3krblujm] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.dot-live[b-vy3krblujm] { background: #22c55e; animation: livePulse-b-vy3krblujm 1.5s ease-in-out infinite; }
.dot-upcoming[b-vy3krblujm] { background: #fbbf24; }
.dot-completed[b-vy3krblujm] { background: var(--kiosk-text-dim); }

.card-meta[b-vy3krblujm] {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    font-size: 0.8rem;
    color: var(--kiosk-text-muted);
}

.card-meta span[b-vy3krblujm] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.card-meta .has-prizes[b-vy3krblujm] {
    color: #fbbf24;
}

.card-action-hint[b-vy3krblujm] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--kiosk-primary);
    opacity: 0.7;
    transition: opacity 0.2s;
}

.contest-card:hover .card-action-hint[b-vy3krblujm] {
    opacity: 1;
}

/* ===== Contest Empty ===== */
.contest-empty[b-vy3krblujm] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 48px 24px;
    gap: 12px;
}

.empty-icon-wrapper[b-vy3krblujm] {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--kiosk-surface);
    margin-bottom: 8px;
}

.empty-icon-wrapper i[b-vy3krblujm] {
    font-size: 2.5rem;
    color: var(--kiosk-text-dim);
}

.contest-empty h3[b-vy3krblujm] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--kiosk-text);
}

.contest-empty p[b-vy3krblujm] {
    margin: 0;
    font-size: 0.95rem;
    color: var(--kiosk-text-muted);
    max-width: 320px;
}

/* ===== Skeleton (List) ===== */
.skeleton-card[b-vy3krblujm] {
    pointer-events: none;
}

.skeleton-line[b-vy3krblujm] {
    height: 14px;
    border-radius: 7px;
    background: linear-gradient(90deg, var(--kiosk-surface-hover) 25%, var(--kiosk-surface-elevated) 50%, var(--kiosk-surface-hover) 75%);
    background-size: 400% 100%;
    animation: shimmer-b-vy3krblujm 1.5s infinite;
}

.skeleton-line.wide[b-vy3krblujm] { width: 65%; height: 18px; }
.skeleton-line.medium[b-vy3krblujm] { width: 45%; margin-top: 8px; }
.skeleton-line.short[b-vy3krblujm] { width: 30%; margin-top: 8px; }

@keyframes shimmer-b-vy3krblujm {
    0% { background-position: 100% 0; }
    100% { background-position: -100% 0; }
}

/* ═══════════════════════════════════════════
   DETAIL VIEW
   ═══════════════════════════════════════════ */

.contest-detail-body[b-vy3krblujm] {
    flex: 1;
    overflow-y: auto;
    padding: 0 32px 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* ── Info Banner ── */
.contest-info-banner[b-vy3krblujm] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 20px 24px;
    background: var(--kiosk-surface);
    border: 1px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius-lg);
}

.info-chips[b-vy3krblujm] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.info-meta[b-vy3krblujm] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    font-size: 0.85rem;
    color: var(--kiosk-text-muted);
}

.info-meta span[b-vy3krblujm] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.contest-description[b-vy3krblujm] {
    margin: 4px 0 0;
    font-size: 0.9rem;
    color: var(--kiosk-text-muted);
    line-height: 1.5;
}

/* ── Section Headings ── */
.section-heading[b-vy3krblujm] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 14px;
    font-size: 1rem;
    font-weight: 700;
    color: var(--kiosk-text);
}

.section-heading i[b-vy3krblujm] {
    color: var(--kiosk-primary);
}

/* ── Prizes ── */
.prizes-section[b-vy3krblujm] {
    padding: 0;
}

.prize-cards[b-vy3krblujm] {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    padding-bottom: 4px;
}

.prize-card[b-vy3krblujm] {
    flex: 0 0 auto;
    min-width: 160px;
    max-width: 220px;
    padding: 16px;
    background: var(--kiosk-surface);
    border: 1px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius);
    display: flex;
    flex-direction: column;
    gap: 6px;
    text-align: center;
}

.prize-card.prize-gold[b-vy3krblujm] {
    border-color: rgba(255,215,0,0.35);
    background: linear-gradient(135deg, var(--kiosk-surface) 60%, rgba(255,215,0,0.06) 100%);
}

.prize-card.prize-silver[b-vy3krblujm] {
    border-color: rgba(192,192,192,0.35);
    background: linear-gradient(135deg, var(--kiosk-surface) 60%, rgba(192,192,192,0.06) 100%);
}

.prize-card.prize-bronze[b-vy3krblujm] {
    border-color: rgba(205,127,50,0.30);
    background: linear-gradient(135deg, var(--kiosk-surface) 60%, rgba(205,127,50,0.06) 100%);
}

.prize-rank[b-vy3krblujm] {
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--kiosk-text);
}

.prize-name[b-vy3krblujm] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--kiosk-text);
}

.prize-value[b-vy3krblujm] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #fbbf24;
}

.prize-points[b-vy3krblujm] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--kiosk-secondary);
}

/* ── Leaderboard ── */
.leaderboard-section[b-vy3krblujm] {
    padding: 0;
}

.leaderboard-table[b-vy3krblujm] {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius);
    overflow: hidden;
}

.leaderboard-header-row[b-vy3krblujm] {
    display: grid;
    grid-template-columns: 72px 1fr 120px 100px;
    padding: 10px 16px;
    background: rgba(255,255,255,0.03);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--kiosk-text-dim);
    text-transform: uppercase;
}

.leaderboard-row[b-vy3krblujm] {
    display: grid;
    grid-template-columns: 72px 1fr 120px 100px;
    align-items: center;
    padding: 12px 16px;
    border-top: 1px solid var(--kiosk-border);
    font-size: 0.9rem;
    transition: background 0.15s;
}

.leaderboard-row:hover[b-vy3krblujm] {
    background: rgba(255,255,255,0.02);
}

.leaderboard-row.is-current-user[b-vy3krblujm] {
    background: rgba(59,130,246,0.08);
    border-left: 3px solid var(--kiosk-primary);
}

.leaderboard-row.rank-gold[b-vy3krblujm] { border-left: 3px solid #ffd700; }
.leaderboard-row.rank-silver[b-vy3krblujm] { border-left: 3px solid #c0c0c0; }
.leaderboard-row.rank-bronze[b-vy3krblujm] { border-left: 3px solid #cd7f32; }

.lb-col-rank[b-vy3krblujm] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-weight: 700;
}

.rank-medal[b-vy3krblujm] {
    font-size: 1.2rem;
}

.rank-number[b-vy3krblujm] {
    color: var(--kiosk-text-muted);
}

.rank-delta[b-vy3krblujm] {
    font-size: 0.65rem;
}

.rank-delta.up[b-vy3krblujm] { color: #22c55e; }
.rank-delta.down[b-vy3krblujm] { color: #ef4444; }

.lb-col-driver[b-vy3krblujm] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    color: var(--kiosk-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.you-badge[b-vy3krblujm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 1px 8px;
    border-radius: 4px;
    background: var(--kiosk-primary);
    color: #fff;
    font-size: 0.6rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    flex-shrink: 0;
}

.lb-col-score[b-vy3krblujm] {
    font-weight: 700;
    color: var(--kiosk-text);
    font-variant-numeric: tabular-nums;
}

.lb-col-gap[b-vy3krblujm] {
    color: var(--kiosk-text-muted);
    font-size: 0.85rem;
    font-variant-numeric: tabular-nums;
}

/* Leaderboard skeleton */
.leaderboard-loading[b-vy3krblujm] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    border: 1px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius);
    overflow: hidden;
}

.skeleton-row[b-vy3krblujm] {
    display: grid;
    grid-template-columns: 72px 1fr 120px;
    padding: 14px 16px;
    gap: 12px;
    border-top: 1px solid var(--kiosk-border);
}

.skeleton-row:first-child[b-vy3krblujm] {
    border-top: none;
}

.skeleton-rank[b-vy3krblujm] {
    width: 28px;
    height: 14px;
    border-radius: 7px;
    background: linear-gradient(90deg, var(--kiosk-surface-hover) 25%, var(--kiosk-surface-elevated) 50%, var(--kiosk-surface-hover) 75%);
    background-size: 400% 100%;
    animation: shimmer-b-vy3krblujm 1.5s infinite;
}

.skeleton-name[b-vy3krblujm] {
    width: 60%;
    height: 14px;
    border-radius: 7px;
    background: linear-gradient(90deg, var(--kiosk-surface-hover) 25%, var(--kiosk-surface-elevated) 50%, var(--kiosk-surface-hover) 75%);
    background-size: 400% 100%;
    animation: shimmer-b-vy3krblujm 1.5s infinite;
}

.skeleton-score[b-vy3krblujm] {
    width: 80px;
    height: 14px;
    border-radius: 7px;
    background: linear-gradient(90deg, var(--kiosk-surface-hover) 25%, var(--kiosk-surface-elevated) 50%, var(--kiosk-surface-hover) 75%);
    background-size: 400% 100%;
    animation: shimmer-b-vy3krblujm 1.5s infinite;
}

.leaderboard-empty[b-vy3krblujm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 40px 16px;
    color: var(--kiosk-text-muted);
    text-align: center;
}

.leaderboard-empty i[b-vy3krblujm] {
    font-size: 2rem;
    color: var(--kiosk-text-dim);
}

.leaderboard-empty p[b-vy3krblujm] {
    margin: 0;
    font-size: 0.95rem;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskDriverIdentity.razor.rz.scp.css */
/* KioskDriverIdentity.razor.css */

.kiosk-driver-identity[b-8eimzenrr5] {
    flex: 1;
    display: flex;
    flex-direction: column;
    max-width: 600px;
    margin: 0 auto;
    width: 100%;
}

.identity-content[b-8eimzenrr5] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px 0;
}

/* Intro Section */
.identity-intro[b-8eimzenrr5] {
    text-align: center;
    padding: 24px;
}

.identity-icon[b-8eimzenrr5] {
    width: 80px;
    height: 80px;
    margin: 0 auto 16px;
    background: linear-gradient(135deg, var(--kiosk-primary), var(--kiosk-secondary, var(--kiosk-primary)));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.identity-icon i[b-8eimzenrr5] {
    font-size: 2.5rem;
    color: white;
}

.identity-intro h3[b-8eimzenrr5] {
    font-size: 1.5rem;
    margin: 0 0 12px 0;
    color: var(--kiosk-text);
}

.intro-text[b-8eimzenrr5] {
    font-size: 1rem;
    color: var(--kiosk-text-muted);
    margin: 0;
    line-height: 1.5;
}

/* Form */
.identity-form[b-8eimzenrr5] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.form-group[b-8eimzenrr5] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-group label[b-8eimzenrr5] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 1rem;
    font-weight: 500;
    color: var(--kiosk-text);
}

.form-group label i[b-8eimzenrr5] {
    color: var(--kiosk-primary);
}

.kiosk-input[b-8eimzenrr5] {
    width: 100%;
    padding: 16px 20px;
    font-size: 1.1rem;
    border: 2px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius, 12px);
    background: var(--kiosk-surface);
    color: var(--kiosk-text);
    transition: border-color 0.2s, box-shadow 0.2s;
}

.kiosk-input:focus[b-8eimzenrr5] {
    outline: none;
    border-color: var(--kiosk-primary);
    box-shadow: 0 0 0 3px rgba(var(--kiosk-primary-rgb, 59, 130, 246), 0.1);
}

.kiosk-input[b-8eimzenrr5]::placeholder {
    color: var(--kiosk-text-muted);
    opacity: 0.7;
}

.kiosk-input:disabled[b-8eimzenrr5] {
    opacity: 0.6;
    cursor: not-allowed;
}

.kiosk-input.input-error[b-8eimzenrr5] {
    border-color: var(--kiosk-error, #ef4444);
}

.field-error[b-8eimzenrr5] {
    color: var(--kiosk-error, #ef4444);
    font-size: 0.875rem;
    display: flex;
    align-items: center;
    gap: 4px;
}

.field-hint[b-8eimzenrr5] {
    color: var(--kiosk-text-muted);
    font-size: 0.875rem;
    display: flex;
    align-items: center;
    gap: 6px;
}

.field-hint i[b-8eimzenrr5] {
    font-size: 0.875rem;
}

/* Form Error */
.form-error[b-8eimzenrr5] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid var(--kiosk-error, #ef4444);
    border-radius: var(--kiosk-radius, 12px);
    color: var(--kiosk-error, #ef4444);
}

.form-error i[b-8eimzenrr5] {
    font-size: 1.25rem;
    flex-shrink: 0;
}

/* Continue Button */
.kiosk-btn-lg[b-8eimzenrr5] {
    padding: 18px 32px;
    font-size: 1.2rem;
}

/* Privacy Notice */
.identity-privacy[b-8eimzenrr5] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px;
    background: var(--kiosk-surface);
    border-radius: var(--kiosk-radius, 12px);
    border: 1px solid var(--kiosk-border);
}

.identity-privacy i[b-8eimzenrr5] {
    color: var(--kiosk-success, #22c55e);
    font-size: 1.25rem;
}

.identity-privacy p[b-8eimzenrr5] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--kiosk-text-muted);
}

/* Spinner */
.spinner[b-8eimzenrr5] {
    width: 20px;
    height: 20px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-8eimzenrr5 0.8s linear infinite;
}

@keyframes spin-b-8eimzenrr5 {
    to { transform: rotate(360deg); }
}

/* Responsive */
@media (max-width: 480px) {
    .identity-intro[b-8eimzenrr5] {
        padding: 16px;
    }

    .identity-icon[b-8eimzenrr5] {
        width: 64px;
        height: 64px;
    }

    .identity-icon i[b-8eimzenrr5] {
        font-size: 2rem;
    }

    .identity-intro h3[b-8eimzenrr5] {
        font-size: 1.25rem;
    }

    .kiosk-input[b-8eimzenrr5] {
        padding: 14px 16px;
        font-size: 1rem;
    }

    .kiosk-btn-lg[b-8eimzenrr5] {
        padding: 16px 24px;
        font-size: 1.1rem;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskDurationSelection.razor.rz.scp.css */
/* KioskDurationSelection.razor.css - Duration selection screen styles */

.kiosk-duration-selection[b-wdm7tmk6ex] {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 2rem;
}

/* Duration grid layout - centered with flexible sizing */
.duration-grid[b-wdm7tmk6ex] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* Center items horizontally */
    align-items: center;
    align-content: center; /* Center wrapped rows vertically */
    gap: 1.5rem;
    padding: 2rem;
    width: 100%;
    flex: 1;
    box-sizing: border-box;
}

/* Duration card */
.duration-card[b-wdm7tmk6ex] {
    background: var(--kiosk-surface, #1a1a2e);
    border: 2px solid var(--kiosk-border, #2a2a4e);
    border-radius: 16px;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    min-height: 220px;
    width: 280px;
    flex-shrink: 0;
    flex-grow: 0; /* Don't grow - keep fixed size for consistent centering */
}

.duration-card:hover:not(.unavailable):not(:disabled)[b-wdm7tmk6ex] {
    border-color: var(--kiosk-primary, #00d4ff);
    transform: translateY(-4px);
    box-shadow: 0 8px 32px rgba(0, 212, 255, 0.2);
}

.duration-card.selected[b-wdm7tmk6ex] {
    border-color: var(--kiosk-primary, #00d4ff);
    background: linear-gradient(135deg, rgba(0, 212, 255, 0.1) 0%, rgba(0, 212, 255, 0.05) 100%);
    box-shadow: 0 0 24px rgba(0, 212, 255, 0.3);
}

.duration-card.unavailable[b-wdm7tmk6ex] {
    opacity: 0.5;
    cursor: not-allowed;
    filter: grayscale(0.5);
}

.duration-card:disabled[b-wdm7tmk6ex] {
    cursor: not-allowed;
}

/* Duration icon */
.duration-icon[b-wdm7tmk6ex] {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--kiosk-primary, #00d4ff), var(--kiosk-secondary, #7b2cbf));
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
}

.duration-icon i[b-wdm7tmk6ex] {
    font-size: 1.75rem;
    color: white;
}

.duration-card.unavailable .duration-icon[b-wdm7tmk6ex] {
    background: var(--kiosk-muted, #4a4a6a);
}

/* Duration time */
.duration-time[b-wdm7tmk6ex] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--kiosk-text, #ffffff);
    margin-bottom: 0.75rem;
}

/* Duration price */
.duration-price[b-wdm7tmk6ex] {
    display: flex;
    align-items: baseline;
    gap: 0.25rem;
    margin-bottom: 0.75rem;
}

.price-label[b-wdm7tmk6ex] {
    font-size: 0.875rem;
    color: var(--kiosk-text-secondary, #a0a0c0);
}

.price-value[b-wdm7tmk6ex] {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--kiosk-success, #00ff88);
}

.price-range[b-wdm7tmk6ex] {
    font-size: 1rem;
    color: var(--kiosk-text-secondary, #a0a0c0);
}

.unavailable-text[b-wdm7tmk6ex] {
    font-size: 1rem;
    color: var(--kiosk-error, #ff4757);
    font-weight: 600;
}

/* Duration availability */
.duration-availability[b-wdm7tmk6ex] {
    font-size: 0.875rem;
    color: var(--kiosk-text-secondary, #a0a0c0);
}

.available-count[b-wdm7tmk6ex] {
    color: var(--kiosk-success, #00ff88);
}

.unavailable-reason[b-wdm7tmk6ex] {
    color: var(--kiosk-error, #ff4757);
}

/* Selected indicator */
.selected-indicator[b-wdm7tmk6ex] {
    position: absolute;
    top: 1rem;
    right: 1rem;
    color: var(--kiosk-primary, #00d4ff);
    font-size: 1.5rem;
}

/* Selection summary in footer */
.selection-summary[b-wdm7tmk6ex] {
    display: flex;
    align-items: center;
    color: var(--kiosk-text, #ffffff);
    font-size: 1rem;
    padding: 0.5rem 1rem;
    background: rgba(0, 212, 255, 0.1);
    border-radius: 8px;
    border: 1px solid var(--kiosk-primary, #00d4ff);
}

.selection-summary i[b-wdm7tmk6ex] {
    color: var(--kiosk-primary, #00d4ff);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .kiosk-duration-selection[b-wdm7tmk6ex] {
        padding: 1rem;
    }

    .duration-grid[b-wdm7tmk6ex] {
        flex-direction: column;
        gap: 1rem;
    }

    .duration-card[b-wdm7tmk6ex] {
        padding: 1.5rem;
        min-height: auto;
        width: 100%;
        max-width: 320px;
    }

    .duration-icon[b-wdm7tmk6ex] {
        width: 50px;
        height: 50px;
    }

    .duration-icon i[b-wdm7tmk6ex] {
        font-size: 1.5rem;
    }

    .duration-time[b-wdm7tmk6ex] {
        font-size: 1.25rem;
    }

    .price-value[b-wdm7tmk6ex] {
        font-size: 1.5rem;
    }
}

/* Animation for loading */
.duration-card[b-wdm7tmk6ex] {
    animation: fadeInUp-b-wdm7tmk6ex 0.3s ease-out;
    animation-fill-mode: both;
}

.duration-card:nth-child(1)[b-wdm7tmk6ex] { animation-delay: 0.1s; }
.duration-card:nth-child(2)[b-wdm7tmk6ex] { animation-delay: 0.15s; }
.duration-card:nth-child(3)[b-wdm7tmk6ex] { animation-delay: 0.2s; }
.duration-card:nth-child(4)[b-wdm7tmk6ex] { animation-delay: 0.25s; }
.duration-card:nth-child(5)[b-wdm7tmk6ex] { animation-delay: 0.3s; }

@keyframes fadeInUp-b-wdm7tmk6ex {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskFBCart.razor.rz.scp.css */
.kiosk-fb-cart[b-dn8hx7qjbf] {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--kiosk-bg, #1a1a2e);
    color: var(--kiosk-text, #fff);
}

/* Header */
.cart-header[b-dn8hx7qjbf] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem 2rem;
    background: rgba(255, 255, 255, 0.05);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.back-btn[b-dn8hx7qjbf] {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.1);
    border: none;
    border-radius: 50%;
    color: inherit;
    font-size: 1.25rem;
    cursor: pointer;
    transition: background 0.2s;
}

.back-btn:hover[b-dn8hx7qjbf] {
    background: rgba(255, 255, 255, 0.2);
}

.cart-header h2[b-dn8hx7qjbf] {
    flex: 1;
    margin: 0;
    font-size: 1.75rem;
}

.item-count[b-dn8hx7qjbf] {
    padding: 0.5rem 1rem;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    font-size: 0.95rem;
}

/* Empty State */
.cart-empty[b-dn8hx7qjbf] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 2rem;
}

.cart-empty i[b-dn8hx7qjbf] {
    opacity: 0.3;
    margin-bottom: 1rem;
}

.cart-empty h3[b-dn8hx7qjbf] {
    margin: 0 0 0.5rem;
}

.cart-empty p[b-dn8hx7qjbf] {
    opacity: 0.7;
}

/* Cart Items */
.cart-items[b-dn8hx7qjbf] {
    flex: 1;
    overflow-y: auto;
    padding: 1rem 2rem;
}

.cart-item[b-dn8hx7qjbf] {
    display: flex;
    gap: 1rem;
    padding: 1.25rem;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 12px;
    margin-bottom: 1rem;
}

.item-details[b-dn8hx7qjbf] {
    flex: 1;
}

.item-details h4[b-dn8hx7qjbf] {
    margin: 0 0 0.25rem;
    font-size: 1.1rem;
}

.item-mods[b-dn8hx7qjbf] {
    margin: 0 0 0.25rem;
    font-size: 0.9rem;
    opacity: 0.7;
}

.item-notes[b-dn8hx7qjbf] {
    margin: 0 0 0.5rem;
    font-size: 0.85rem;
    color: var(--kiosk-accent, #4361ee);
}

.item-unit-price[b-dn8hx7qjbf] {
    font-size: 0.9rem;
    opacity: 0.6;
}

.item-controls[b-dn8hx7qjbf] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.75rem;
}

.quantity-control[b-dn8hx7qjbf] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 25px;
    padding: 0.25rem;
}

.qty-btn[b-dn8hx7qjbf] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.1);
    border: none;
    border-radius: 50%;
    color: inherit;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.2s;
}

.qty-btn:hover:not(:disabled)[b-dn8hx7qjbf] {
    background: rgba(255, 255, 255, 0.2);
}

.qty-btn:disabled[b-dn8hx7qjbf] {
    opacity: 0.3;
    cursor: not-allowed;
}

.qty-value[b-dn8hx7qjbf] {
    min-width: 32px;
    text-align: center;
    font-weight: 600;
    font-size: 1.1rem;
}

.item-total[b-dn8hx7qjbf] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--kiosk-accent, #4361ee);
}

/* Order Notes */
.order-notes[b-dn8hx7qjbf] {
    padding: 1rem 2rem;
}

.order-notes label[b-dn8hx7qjbf] {
    display: block;
    margin-bottom: 0.5rem;
    font-size: 0.95rem;
    opacity: 0.9;
}

.order-notes textarea[b-dn8hx7qjbf] {
    width: 100%;
    padding: 0.75rem 1rem;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    color: inherit;
    font-size: 1rem;
    resize: none;
    height: 80px;
}

.order-notes textarea:focus[b-dn8hx7qjbf] {
    outline: none;
    border-color: var(--kiosk-accent, #4361ee);
}

/* Order Summary */
.order-summary[b-dn8hx7qjbf] {
    padding: 1.25rem 2rem;
    background: rgba(0, 0, 0, 0.2);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.summary-row[b-dn8hx7qjbf] {
    display: flex;
    justify-content: space-between;
    padding: 0.5rem 0;
    font-size: 1.05rem;
}

.summary-row.total[b-dn8hx7qjbf] {
    padding-top: 0.75rem;
    margin-top: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 1.35rem;
}

.summary-row.total strong[b-dn8hx7qjbf] {
    color: var(--kiosk-accent, #4361ee);
}

/* Actions */
.cart-actions[b-dn8hx7qjbf] {
    display: flex;
    gap: 1rem;
    padding: 1.5rem 2rem;
    background: rgba(0, 0, 0, 0.3);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.clear-btn[b-dn8hx7qjbf] {
    padding: 1rem 1.5rem;
}

.checkout-btn[b-dn8hx7qjbf] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    font-size: 1.1rem;
}

.checkout-total[b-dn8hx7qjbf] {
    font-weight: 700;
}

/* Clear Confirm Dialog */
.confirm-overlay[b-dn8hx7qjbf] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.8);
    z-index: 1000;
    padding: 2rem;
}

.confirm-dialog[b-dn8hx7qjbf] {
    background: var(--kiosk-bg, #1a1a2e);
    border-radius: 20px;
    padding: 2rem;
    text-align: center;
    max-width: 400px;
}

.confirm-dialog h3[b-dn8hx7qjbf] {
    margin: 0 0 0.5rem;
}

.confirm-dialog p[b-dn8hx7qjbf] {
    margin: 0 0 1.5rem;
    opacity: 0.7;
}

.confirm-actions[b-dn8hx7qjbf] {
    display: flex;
    gap: 1rem;
    justify-content: center;
}

.confirm-actions .kiosk-btn[b-dn8hx7qjbf] {
    min-width: 120px;
}

.kiosk-btn-danger[b-dn8hx7qjbf] {
    background: #dc3545;
    border-color: #dc3545;
}

.kiosk-btn-danger:hover[b-dn8hx7qjbf] {
    background: #bb2d3b;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskFBCheckout.razor.rz.scp.css */
.kiosk-fb-checkout[b-8a265f1ola] {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--kiosk-bg, #1a1a2e);
    color: var(--kiosk-text, #fff);
}

.checkout-section[b-8a265f1ola] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    max-width: 600px;
    margin: 0 auto;
    width: 100%;
}

/* Section Header */
.section-header[b-8a265f1ola] {
    text-align: center;
    margin-bottom: 2rem;
}

.section-header h2[b-8a265f1ola] {
    margin: 0 0 0.5rem;
    font-size: 2rem;
}

.section-header p[b-8a265f1ola] {
    margin: 0;
    opacity: 0.7;
    font-size: 1.1rem;
}

.section-header i[b-8a265f1ola] {
    color: var(--kiosk-accent, #4361ee);
}

/* Guest Info */
.name-input-container[b-8a265f1ola] {
    width: 100%;
    margin-bottom: 2rem;
}

.name-input[b-8a265f1ola] {
    width: 100%;
    padding: 1.25rem 1.5rem;
    background: rgba(255, 255, 255, 0.05);
    border: 2px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    color: inherit;
    font-size: 1.5rem;
    text-align: center;
    transition: border-color 0.2s;
}

.name-input:focus[b-8a265f1ola] {
    outline: none;
    border-color: var(--kiosk-accent, #4361ee);
}

.name-input[b-8a265f1ola]::placeholder {
    opacity: 0.5;
}

.input-hint[b-8a265f1ola] {
    display: block;
    text-align: center;
    margin-top: 0.75rem;
    font-size: 0.9rem;
    opacity: 0.6;
}

/* Mini Summary */
.mini-summary[b-8a265f1ola] {
    width: 100%;
    padding: 1.25rem;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 12px;
    margin-bottom: 2rem;
}

.summary-items[b-8a265f1ola] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.summary-item[b-8a265f1ola] {
    padding: 0.25rem 0.75rem;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    font-size: 0.9rem;
}

.summary-item.more[b-8a265f1ola] {
    opacity: 0.6;
}

.summary-total[b-8a265f1ola] {
    display: flex;
    justify-content: space-between;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 1.25rem;
}

.summary-total strong[b-8a265f1ola] {
    color: var(--kiosk-accent, #4361ee);
}

/* Payment Section */
.payment-amount[b-8a265f1ola] {
    text-align: center;
    margin-bottom: 2rem;
}

.payment-amount span[b-8a265f1ola] {
    display: block;
    font-size: 1rem;
    opacity: 0.7;
    margin-bottom: 0.5rem;
}

.payment-amount .amount[b-8a265f1ola] {
    font-size: 3rem;
    font-weight: 700;
    color: var(--kiosk-accent, #4361ee);
}

.payment-error[b-8a265f1ola] {
    width: 100%;
    padding: 1rem;
    background: rgba(220, 53, 69, 0.2);
    border: 1px solid #dc3545;
    border-radius: 10px;
    margin-bottom: 1.5rem;
    text-align: center;
}

.payment-methods[b-8a265f1ola] {
    width: 100%;
    margin-bottom: 2rem;
}

.payment-methods h4[b-8a265f1ola] {
    margin: 0 0 1rem;
    font-size: 1rem;
    opacity: 0.8;
    text-align: center;
}

.payment-method-btn[b-8a265f1ola] {
    display: flex;
    align-items: center;
    gap: 1rem;
    width: 100%;
    padding: 1.25rem 1.5rem;
    margin-bottom: 0.75rem;
    background: rgba(255, 255, 255, 0.05);
    border: 2px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    color: inherit;
    font-size: 1.1rem;
    cursor: pointer;
    transition: all 0.2s;
}

.payment-method-btn:hover[b-8a265f1ola] {
    background: rgba(255, 255, 255, 0.1);
}

.payment-method-btn.selected[b-8a265f1ola] {
    border-color: var(--kiosk-accent, #4361ee);
    background: rgba(67, 97, 238, 0.1);
}

.payment-method-btn i[b-8a265f1ola] {
    font-size: 1.5rem;
    width: 40px;
    text-align: center;
}

/* Card Reader Prompt */
.card-reader-prompt[b-8a265f1ola] {
    text-align: center;
    padding: 2rem;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 16px;
    margin-bottom: 2rem;
    width: 100%;
}

.tap-animation[b-8a265f1ola] {
    position: relative;
    width: 100px;
    height: 100px;
    margin: 0 auto 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tap-animation i[b-8a265f1ola] {
    font-size: 3rem;
    color: var(--kiosk-accent, #4361ee);
    z-index: 1;
}

.tap-animation .wave[b-8a265f1ola] {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 2px solid var(--kiosk-accent, #4361ee);
    animation: pulse-b-8a265f1ola 2s ease-out infinite;
}

@keyframes pulse-b-8a265f1ola {
    0% {
        transform: scale(0.8);
        opacity: 1;
    }
    100% {
        transform: scale(1.5);
        opacity: 0;
    }
}

.card-reader-prompt p[b-8a265f1ola] {
    margin: 0;
    font-size: 1.1rem;
    opacity: 0.8;
}

.processing-indicator[b-8a265f1ola] {
    margin-top: 1rem;
    opacity: 0.8;
}

/* Checkout Actions */
.checkout-actions[b-8a265f1ola] {
    display: flex;
    gap: 1rem;
    width: 100%;
    margin-top: auto;
    padding-top: 2rem;
}

.checkout-actions .kiosk-btn[b-8a265f1ola] {
    flex: 1;
    padding: 1rem 1.5rem;
    font-size: 1.05rem;
}

/* Complete Section */
.complete .success-animation[b-8a265f1ola] {
    margin-bottom: 1.5rem;
}

.complete .success-animation i[b-8a265f1ola] {
    font-size: 5rem;
    color: #28a745;
    animation: successPop-b-8a265f1ola 0.5s ease-out;
}

@keyframes successPop-b-8a265f1ola {
    0% {
        transform: scale(0);
        opacity: 0;
    }
    50% {
        transform: scale(1.2);
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.complete h2[b-8a265f1ola] {
    margin: 0 0 1.5rem;
    font-size: 2.5rem;
    text-align: center;
}

.order-number[b-8a265f1ola] {
    text-align: center;
    margin-bottom: 1.5rem;
}

.order-number span[b-8a265f1ola] {
    display: block;
    font-size: 1rem;
    opacity: 0.7;
    margin-bottom: 0.5rem;
}

.order-number .number[b-8a265f1ola] {
    font-size: 4rem;
    font-weight: 800;
    color: var(--kiosk-accent, #4361ee);
    letter-spacing: 0.1em;
}

.pickup-message[b-8a265f1ola] {
    text-align: center;
    font-size: 1.1rem;
    margin-bottom: 2rem;
    padding: 1rem 1.5rem;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 10px;
}

/* Order Receipt */
.order-receipt[b-8a265f1ola] {
    width: 100%;
    padding: 1.5rem;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 12px;
    margin-bottom: 2rem;
}

.order-receipt h5[b-8a265f1ola] {
    margin: 0 0 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.receipt-item[b-8a265f1ola] {
    display: flex;
    justify-content: space-between;
    padding: 0.5rem 0;
    font-size: 0.95rem;
}

.receipt-total[b-8a265f1ola] {
    display: flex;
    justify-content: space-between;
    padding-top: 0.75rem;
    margin-top: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 1.1rem;
}

.receipt-total strong[b-8a265f1ola] {
    color: var(--kiosk-accent, #4361ee);
}

.receipt-note[b-8a265f1ola] {
    margin-top: 1rem;
    padding: 0.75rem;
    background: rgba(255, 193, 7, 0.1);
    border-radius: 8px;
    font-size: 0.9rem;
    text-align: center;
    color: #ffc107;
}

.done-btn[b-8a265f1ola] {
    min-width: 200px;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskFBMenuBrowser.razor.rz.scp.css */
.kiosk-fb-menu[b-k98jafi0ui] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
    background: var(--kiosk-bg, #1a1a2e);
    color: var(--kiosk-text, #fff);
}

/* Loading & Empty States */
.menu-loading[b-k98jafi0ui],
.menu-empty[b-k98jafi0ui] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    text-align: center;
    padding: 2rem;
}

.menu-loading .spinner-border[b-k98jafi0ui] {
    width: 3rem;
    height: 3rem;
    margin-bottom: 1rem;
}

/* Header */
.menu-header[b-k98jafi0ui] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 2rem;
    background: rgba(255, 255, 255, 0.05);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.header-title h2[b-k98jafi0ui] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 600;
}

.header-title p[b-k98jafi0ui] {
    margin: 0.25rem 0 0;
    opacity: 0.7;
}

.cart-summary-btn[b-k98jafi0ui] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.5rem;
    background: rgba(255, 255, 255, 0.1);
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 50px;
    color: inherit;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.2s;
}

.cart-summary-btn:hover[b-k98jafi0ui] {
    background: rgba(255, 255, 255, 0.15);
}

.cart-summary-btn.has-items[b-k98jafi0ui] {
    background: var(--kiosk-accent, #4361ee);
    border-color: var(--kiosk-accent, #4361ee);
}

.cart-summary-btn i[b-k98jafi0ui] {
    font-size: 1.25rem;
}

.cart-count[b-k98jafi0ui] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 24px;
    padding: 0 6px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    font-weight: 600;
    font-size: 0.875rem;
}

.cart-summary-btn.has-items .cart-count[b-k98jafi0ui] {
    background: rgba(255, 255, 255, 0.3);
}

.cart-total[b-k98jafi0ui] {
    font-weight: 600;
}

/* Category Tabs */
.category-tabs[b-k98jafi0ui] {
    display: flex;
    gap: 0.5rem;
    padding: 1rem 2rem;
    overflow-x: auto;
    background: rgba(0, 0, 0, 0.2);
    -webkit-overflow-scrolling: touch;
}

.category-tabs[b-k98jafi0ui]::-webkit-scrollbar {
    display: none;
}

.category-tab[b-k98jafi0ui] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 25px;
    color: inherit;
    font-size: 0.95rem;
    white-space: nowrap;
    cursor: pointer;
    transition: all 0.2s;
}

.category-tab:hover[b-k98jafi0ui] {
    background: rgba(255, 255, 255, 0.1);
}

.category-tab.active[b-k98jafi0ui] {
    background: var(--kiosk-accent, #4361ee);
    border-color: var(--kiosk-accent, #4361ee);
}

.category-tab i[b-k98jafi0ui] {
    font-size: 1.1rem;
}

/* Items Scroll Area — flex child that takes remaining space and scrolls */
.items-scroll-area[b-k98jafi0ui] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

/* Items Grid — pure CSS Grid at natural content height (no flex constraint) */
.items-grid[b-k98jafi0ui] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 1.5rem;
    padding: 1.5rem 2rem;
}

.item-card[b-k98jafi0ui] {
    position: relative;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.2s;
}

.item-card:hover[b-k98jafi0ui] {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
    border-color: rgba(255, 255, 255, 0.2);
}

.item-card.unavailable[b-k98jafi0ui] {
    opacity: 0.5;
    cursor: not-allowed;
}

.item-card.in-cart[b-k98jafi0ui] {
    border-color: var(--kiosk-accent, #4361ee);
}

.item-image[b-k98jafi0ui] {
    height: 140px;
    background-size: cover;
    background-position: center;
    background-color: rgba(255, 255, 255, 0.05);
}

.item-image.placeholder[b-k98jafi0ui] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.item-image.placeholder i[b-k98jafi0ui] {
    font-size: 3rem;
    opacity: 0.3;
}

.item-info[b-k98jafi0ui] {
    padding: 1rem;
}

.item-info h4[b-k98jafi0ui] {
    margin: 0 0 0.25rem;
    font-size: 1.1rem;
    font-weight: 600;
}

.item-desc[b-k98jafi0ui] {
    margin: 0 0 0.5rem;
    font-size: 0.85rem;
    opacity: 0.7;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.item-price[b-k98jafi0ui] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.item-price .price[b-k98jafi0ui] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--kiosk-accent, #4361ee);
}

.badge.sold-out[b-k98jafi0ui] {
    background: #dc3545;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    font-size: 0.75rem;
}

.cart-badge[b-k98jafi0ui] {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--kiosk-accent, #4361ee);
    border-radius: 50%;
    font-weight: 700;
    font-size: 0.875rem;
}

.no-items[b-k98jafi0ui] {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    text-align: center;
    opacity: 0.5;
}

/* Footer */
.menu-footer[b-k98jafi0ui] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 2rem;
    background: rgba(0, 0, 0, 0.3);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

/* Item Detail Modal */
.item-detail-overlay[b-k98jafi0ui] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.8);
    z-index: 1000;
    padding: 2rem;
}

.item-detail-modal[b-k98jafi0ui] {
    position: relative;
    width: 100%;
    max-width: 500px;
    max-height: 90vh;
    background: var(--kiosk-bg, #1a1a2e);
    border-radius: 20px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.close-btn[b-k98jafi0ui] {
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.5);
    border: none;
    border-radius: 50%;
    color: #fff;
    font-size: 1.25rem;
    cursor: pointer;
    z-index: 10;
    transition: background 0.2s;
}

.close-btn:hover[b-k98jafi0ui] {
    background: rgba(0, 0, 0, 0.7);
}

.detail-image[b-k98jafi0ui] {
    height: 200px;
    background-size: cover;
    background-position: center;
    background-color: rgba(255, 255, 255, 0.05);
}

.detail-content[b-k98jafi0ui] {
    flex: 1;
    padding: 1.5rem;
    overflow-y: auto;
}

.detail-content h3[b-k98jafi0ui] {
    margin: 0 0 0.5rem;
    font-size: 1.5rem;
}

.detail-desc[b-k98jafi0ui] {
    margin: 0 0 1rem;
    opacity: 0.7;
    line-height: 1.5;
}

.detail-price[b-k98jafi0ui] {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--kiosk-accent, #4361ee);
    margin-bottom: 1.5rem;
}

/* Modifiers */
.modifiers-section[b-k98jafi0ui] {
    margin-bottom: 1.5rem;
}

.modifiers-section h5[b-k98jafi0ui],
.special-instructions h5[b-k98jafi0ui],
.quantity-section h5[b-k98jafi0ui] {
    margin: 0 0 0.75rem;
    font-size: 1rem;
    opacity: 0.9;
}

.modifier-option[b-k98jafi0ui] {
    display: flex;
    align-items: center;
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 8px;
    margin-bottom: 0.5rem;
    cursor: pointer;
    transition: background 0.2s;
}

.modifier-option:hover[b-k98jafi0ui] {
    background: rgba(255, 255, 255, 0.1);
}

.modifier-option input[b-k98jafi0ui] {
    margin-right: 0.75rem;
    width: 20px;
    height: 20px;
    accent-color: var(--kiosk-accent, #4361ee);
}

.modifier-name[b-k98jafi0ui] {
    flex: 1;
}

.modifier-price[b-k98jafi0ui] {
    opacity: 0.7;
}

/* Special Instructions */
.special-instructions[b-k98jafi0ui] {
    margin-bottom: 1.5rem;
}

.special-instructions textarea[b-k98jafi0ui] {
    width: 100%;
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    color: inherit;
    font-size: 1rem;
    resize: none;
    height: 80px;
}

.special-instructions textarea:focus[b-k98jafi0ui] {
    outline: none;
    border-color: var(--kiosk-accent, #4361ee);
}

/* Quantity Control */
.quantity-section[b-k98jafi0ui] {
    margin-bottom: 1.5rem;
}

.quantity-control[b-k98jafi0ui] {
    display: flex;
    align-items: center;
    gap: 1rem;
    justify-content: center;
}

.qty-btn[b-k98jafi0ui] {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.1);
    border: none;
    border-radius: 50%;
    color: inherit;
    font-size: 1.5rem;
    cursor: pointer;
    transition: all 0.2s;
}

.qty-btn:hover:not(:disabled)[b-k98jafi0ui] {
    background: rgba(255, 255, 255, 0.2);
}

.qty-btn:disabled[b-k98jafi0ui] {
    opacity: 0.3;
    cursor: not-allowed;
}

.qty-value[b-k98jafi0ui] {
    font-size: 2rem;
    font-weight: 700;
    min-width: 60px;
    text-align: center;
}

/* Add to Cart */
.detail-actions[b-k98jafi0ui] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.item-total[b-k98jafi0ui] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.item-total span[b-k98jafi0ui] {
    font-size: 0.875rem;
    opacity: 0.7;
}

.item-total strong[b-k98jafi0ui] {
    font-size: 1.5rem;
    color: var(--kiosk-accent, #4361ee);
}

.add-to-cart-btn[b-k98jafi0ui] {
    flex: 1;
    padding: 1rem 1.5rem;
    font-size: 1.1rem;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskGameSelection.razor.rz.scp.css */
/* 
 * KioskGameSelection.razor.css
 * Game selection screen styles.
 */

.kiosk-selection-screen[b-3cqqfqknv6] {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Badge for unavailable items */
[b-3cqqfqknv6] .badge-unavailable {
    background: linear-gradient(135deg, #64748b, #475569) !important;
    opacity: 0.8;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskKartingSelection.razor.rz.scp.css */
/*
 * KioskKartingSelection.razor.css
 * Karting selection screen — class picker and booking choice.
 */

/* Layout */
.karting-selection[b-9pordscwwy] {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.karting-main[b-9pordscwwy] {
    flex: 1;
    overflow-y: auto;
    padding: 1rem 2rem;
}

/* Loading / Error States */
.loading-indicator[b-9pordscwwy],
.error-state[b-9pordscwwy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 1rem;
    color: var(--kiosk-text-muted, #aaa);
    text-align: center;
}

.loading-indicator .spinner[b-9pordscwwy] {
    width: 48px;
    height: 48px;
    border: 4px solid var(--kiosk-surface-hover, #1a1a3a);
    border-top-color: var(--kiosk-primary, #3b82f6);
    border-radius: 50%;
    animation: spin-b-9pordscwwy 0.8s linear infinite;
}

@keyframes spin-b-9pordscwwy {
    to { transform: rotate(360deg); }
}

.error-state i[b-9pordscwwy] {
    font-size: 3rem;
    color: var(--kiosk-danger, #ef4444);
}

/* ??? Class Selection ??????????????????????????????? */

.class-selection[b-9pordscwwy] {
    flex: 1;
}

.class-grid[b-9pordscwwy] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
    gap: var(--kiosk-spacing-md, 24px);
}

.class-card[b-9pordscwwy] {
    background: var(--kiosk-surface, #13132a);
    border-radius: var(--kiosk-radius-lg, 16px);
    padding: var(--kiosk-spacing-lg, 32px);
    cursor: pointer;
    transition: all 0.2s ease;
    border: 3px solid transparent;
    position: relative;
    display: flex;
    flex-direction: column;
    width: 280px;
    flex-shrink: 0;
    flex-grow: 0;
}

.class-card:hover[b-9pordscwwy] {
    transform: translateY(-4px);
    box-shadow: 0 8px 32px rgba(59, 130, 246, 0.2);
    border-color: rgba(59, 130, 246, 0.3);
}

.class-card:active[b-9pordscwwy] {
    transform: translateY(0);
    transition: transform 0.1s ease;
}

.class-card.selected[b-9pordscwwy] {
    border-color: var(--kiosk-primary, #3b82f6);
    background: linear-gradient(135deg,
        var(--kiosk-surface, #13132a),
        rgba(59, 130, 246, 0.1));
    box-shadow: 0 0 0 1px var(--kiosk-primary, #3b82f6),
                0 8px 32px rgba(59, 130, 246, 0.3);
}

.class-card.ineligible[b-9pordscwwy] {
    opacity: 0.45;
    cursor: not-allowed;
    filter: grayscale(0.5);
}

.class-card.ineligible:hover[b-9pordscwwy] {
    transform: none;
    box-shadow: none;
    border-color: transparent;
}

/* Card header */
.class-header[b-9pordscwwy] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: var(--kiosk-spacing-sm, 16px);
}

.class-icon[b-9pordscwwy] {
    font-size: 1.6rem;
    color: var(--kiosk-primary, #3b82f6);
}

.class-name[b-9pordscwwy] {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--kiosk-text, #fff);
    flex: 1;
}

.electric-badge[b-9pordscwwy] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--kiosk-success, #22c55e);
    background: rgba(34, 197, 94, 0.15);
    padding: 6px 12px;
    border-radius: var(--kiosk-radius-sm, 8px);
}

/* Card details */
.class-details[b-9pordscwwy] {
    flex: 1;
    margin-bottom: var(--kiosk-spacing-sm, 16px);
}

.class-description[b-9pordscwwy] {
    font-size: 0.95rem;
    color: var(--kiosk-text-muted, #aaa);
    margin: 0 0 var(--kiosk-spacing-sm, 16px);
    line-height: 1.5;
}

.eligibility-info[b-9pordscwwy] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 8px;
}

.eligibility-item[b-9pordscwwy] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    color: var(--kiosk-text-muted, #aaa);
}

.eligibility-item i[b-9pordscwwy] {
    color: var(--kiosk-primary, #3b82f6);
    font-size: 0.9rem;
}

.speed-info[b-9pordscwwy] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.9rem;
    color: var(--kiosk-text-muted, #aaa);
    margin-top: 8px;
}

.speed-info i[b-9pordscwwy] {
    color: var(--kiosk-warning, #f59e0b);
}

/* Card footer */
.class-footer[b-9pordscwwy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: var(--kiosk-spacing-sm, 16px);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.class-footer .availability[b-9pordscwwy] {
    font-size: 0.85rem;
    color: var(--kiosk-success, #22c55e);
}

.class-footer .availability.low[b-9pordscwwy] {
    color: var(--kiosk-warning, #f59e0b);
}

.class-footer .availability.none[b-9pordscwwy] {
    color: var(--kiosk-danger, #ef4444);
}

.ineligible-badge[b-9pordscwwy] {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--kiosk-danger, #ef4444);
    background: rgba(239, 68, 68, 0.15);
    padding: 4px 10px;
    border-radius: var(--kiosk-radius-sm, 8px);
}

/* Selection check */
.selection-indicator[b-9pordscwwy] {
    position: absolute;
    top: 12px;
    right: 12px;
    color: var(--kiosk-primary, #3b82f6);
    font-size: 1.4rem;
}

/* ??? Booking Choice (Heat vs Queue) ???????????????? */

.booking-choice[b-9pordscwwy] {
    display: flex;
    flex-direction: column;
    gap: var(--kiosk-spacing-md, 24px);
}

.selected-class-banner[b-9pordscwwy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--kiosk-surface, #13132a);
    padding: 12px var(--kiosk-spacing-md, 24px);
    border-radius: var(--kiosk-radius, 12px);
    color: var(--kiosk-text, #fff);
    font-size: 1rem;
}

.change-link[b-9pordscwwy] {
    background: none;
    border: none;
    color: var(--kiosk-primary, #3b82f6);
    cursor: pointer;
    font-size: 0.9rem;
    text-decoration: underline;
    padding: 4px 8px;
}

.change-link:hover[b-9pordscwwy] {
    color: var(--kiosk-primary-hover, #2563eb);
}

.choice-cards[b-9pordscwwy] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: var(--kiosk-spacing-md, 24px);
}

.choice-card[b-9pordscwwy] {
    background: var(--kiosk-surface, #13132a);
    border-radius: var(--kiosk-radius-lg, 16px);
    padding: var(--kiosk-spacing-lg, 32px);
    cursor: pointer;
    transition: all 0.2s ease;
    border: 3px solid transparent;
    display: flex;
    align-items: center;
    gap: var(--kiosk-spacing-md, 24px);
}

.choice-card:hover:not(.disabled)[b-9pordscwwy] {
    transform: translateY(-4px);
    box-shadow: 0 8px 32px rgba(59, 130, 246, 0.2);
    border-color: rgba(59, 130, 246, 0.3);
}

.choice-card:active:not(.disabled)[b-9pordscwwy] {
    transform: translateY(0);
    transition: transform 0.1s ease;
}

.choice-card.disabled[b-9pordscwwy] {
    opacity: 0.4;
    cursor: not-allowed;
}

.choice-icon[b-9pordscwwy] {
    flex-shrink: 0;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.6rem;
}

.book-heat .choice-icon[b-9pordscwwy] {
    background: rgba(59, 130, 246, 0.15);
    color: var(--kiosk-primary, #3b82f6);
}

.join-queue .choice-icon[b-9pordscwwy] {
    background: rgba(34, 197, 94, 0.15);
    color: var(--kiosk-success, #22c55e);
}

.choice-content[b-9pordscwwy] {
    flex: 1;
}

.choice-content h3[b-9pordscwwy] {
    margin: 0 0 4px;
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--kiosk-text, #fff);
}

.choice-content p[b-9pordscwwy] {
    margin: 0 0 8px;
    font-size: 0.95rem;
    color: var(--kiosk-text-muted, #aaa);
}

.choice-content .availability[b-9pordscwwy] {
    font-size: 0.85rem;
    color: var(--kiosk-success, #22c55e);
}

.choice-content .availability.no-heats[b-9pordscwwy] {
    color: var(--kiosk-danger, #ef4444);
}

.choice-content .queue-info[b-9pordscwwy] {
    font-size: 0.85rem;
    color: var(--kiosk-text-muted, #aaa);
}

.choice-content .queue-info.disabled[b-9pordscwwy] {
    color: var(--kiosk-danger, #ef4444);
}

.choice-arrow[b-9pordscwwy] {
    flex-shrink: 0;
    font-size: 1.2rem;
    color: var(--kiosk-text-muted, #aaa);
}

/* Footer selection summary */
.selection-summary[b-9pordscwwy] {
    font-size: 1rem;
    color: var(--kiosk-text-muted, #aaa);
}

.selection-summary strong[b-9pordscwwy] {
    color: var(--kiosk-text, #fff);
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskLaunching.razor.rz.scp.css */
/* KioskLaunching.razor.css - Premium session launch screen */

.launching-container[b-pspvpbxo1n] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px;
    position: relative;
    text-align: center;
    gap: 24px;
}

/* Ambient glow effect behind the icon */
.launching-glow[b-pspvpbxo1n] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -60%);
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, var(--kiosk-glow-primary) 0%, var(--kiosk-glow-secondary) 30%, transparent 70%);
    opacity: 0.4;
    animation: glow-pulse-b-pspvpbxo1n 3s ease-in-out infinite;
    pointer-events: none;
}

@keyframes glow-pulse-b-pspvpbxo1n {
    0%, 100% { opacity: 0.3; transform: translate(-50%, -60%) scale(1); }
    50% { opacity: 0.5; transform: translate(-50%, -60%) scale(1.1); }
}

/* Icon with animated ring */
.launching-icon-wrapper[b-pspvpbxo1n] {
    position: relative;
    width: 140px;
    height: 140px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.launching-icon-ring[b-pspvpbxo1n] {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: var(--kiosk-primary);
    border-right-color: var(--kiosk-secondary, #8b5cf6);
    animation: spin-b-pspvpbxo1n 1.5s linear infinite;
}

@keyframes spin-b-pspvpbxo1n {
    to { transform: rotate(360deg); }
}

.launching-icon[b-pspvpbxo1n] {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: var(--kiosk-accent-gradient);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 32px var(--kiosk-glow-primary);
    animation: icon-float-b-pspvpbxo1n 2s ease-in-out infinite;
}

@keyframes icon-float-b-pspvpbxo1n {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

.launching-icon i[b-pspvpbxo1n] {
    font-size: 2.5rem;
    color: white;
}

/* Typography */
.launching-title[b-pspvpbxo1n] {
    font-family: var(--kiosk-font-display);
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--kiosk-text);
    margin: 0;
    letter-spacing: -0.02em;
}

.launching-subtitle[b-pspvpbxo1n] {
    font-size: 1.25rem;
    color: var(--kiosk-text-muted);
    margin: 0;
    font-weight: 500;
}

/* Simulator chips */
.simulator-assignments[b-pspvpbxo1n] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    margin: 8px 0;
}

.sim-chip[b-pspvpbxo1n] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: var(--kiosk-surface);
    border: 1px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius);
    color: var(--kiosk-text);
    font-size: 1rem;
    font-weight: 500;
}

.sim-chip i[b-pspvpbxo1n] {
    font-size: 1.1rem;
    color: var(--kiosk-primary);
}

/* Progress indicator */
.launching-progress[b-pspvpbxo1n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    width: 100%;
    max-width: 400px;
    margin-top: 16px;
}

.progress-bar-track[b-pspvpbxo1n] {
    width: 100%;
    height: 4px;
    background: var(--kiosk-surface);
    border-radius: 2px;
    overflow: hidden;
}

.progress-bar-fill[b-pspvpbxo1n] {
    height: 100%;
    width: 30%;
    background: var(--kiosk-accent-gradient);
    border-radius: 2px;
    animation: progress-slide-b-pspvpbxo1n 1.5s ease-in-out infinite;
}

@keyframes progress-slide-b-pspvpbxo1n {
    0% { width: 10%; margin-left: 0; }
    50% { width: 40%; margin-left: 30%; }
    100% { width: 10%; margin-left: 90%; }
}

.launching-hint[b-pspvpbxo1n] {
    font-size: 1rem;
    color: var(--kiosk-text-dim);
    margin: 0;
    font-weight: 400;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskLogin.razor.rz.scp.css */
/* KioskLogin.razor.css & shared kiosk form styles */

.kiosk-login[b-f5y7mxbtps],
.kiosk-register[b-f5y7mxbtps] {
    flex: 1;
    display: flex;
    flex-direction: column;
    max-width: 500px;
    margin: 0 auto;
    width: 100%;
    padding: 0 24px;
    overflow-y: auto;
    min-height: 0;
}

/* ===== Screen Header ===== */
.kiosk-screen-header[b-f5y7mxbtps] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
    padding-top: 16px;
    flex-shrink: 0;
}

.kiosk-back-btn[b-f5y7mxbtps] {
    width: var(--kiosk-touch-target, 48px);
    height: var(--kiosk-touch-target, 48px);
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--kiosk-surface);
    border: none;
    border-radius: 50%;
    color: var(--kiosk-text);
    font-size: 1.25rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.kiosk-back-btn:hover[b-f5y7mxbtps],
.kiosk-back-btn:active[b-f5y7mxbtps] {
    background: var(--kiosk-surface-hover);
}

.screen-title[b-f5y7mxbtps] {
    font-size: 1.75rem;
    font-weight: 600;
    margin: 0;
}

/* ===== Form Styles ===== */
.kiosk-form[b-f5y7mxbtps] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-bottom: 24px;
}

.kiosk-form-group[b-f5y7mxbtps] {
    display: flex;
    flex-direction: column;
    gap: 10px; /* Slightly increased gap between label and input */
}

.kiosk-label[b-f5y7mxbtps] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--kiosk-text);
    letter-spacing: 0.02em;
}

.kiosk-input[b-f5y7mxbtps] {
    width: 100%;
    height: var(--kiosk-input-height, 56px);
    padding: 0 20px;
    background: var(--kiosk-surface);
    border: 2px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius, 12px);
    color: var(--kiosk-text);
    font-size: 1.125rem;
    transition: all 0.2s ease;
}

.kiosk-input:focus[b-f5y7mxbtps] {
    outline: none;
    border-color: var(--kiosk-primary);
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.2);
}

.kiosk-input[b-f5y7mxbtps]::placeholder {
    color: var(--kiosk-text-muted);
    opacity: 0.6;
}

/* ===== Input Group with Addon (password toggle) ===== */
.kiosk-input-group[b-f5y7mxbtps] {
    display: flex;
    position: relative;
    align-items: stretch;
}

.kiosk-input-group .kiosk-input[b-f5y7mxbtps] {
    flex: 1;
    padding-right: 60px; /* Space for the addon button */
}

.kiosk-input-addon[b-f5y7mxbtps] {
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    height: 44px;
    width: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--kiosk-surface-hover, rgba(255, 255, 255, 0.08));
    border: none;
    border-radius: 8px;
    color: var(--kiosk-text-muted);
    font-size: 1.25rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.kiosk-input-addon:hover[b-f5y7mxbtps] {
    color: var(--kiosk-text);
    background: var(--kiosk-primary);
}

.kiosk-input-addon:active[b-f5y7mxbtps] {
    transform: translateY(-50%) scale(0.95);
}

/* ===== Alert Styles ===== */
.kiosk-alert[b-f5y7mxbtps] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    border-radius: var(--kiosk-radius, 12px);
    font-size: 1rem;
}

.kiosk-alert i[b-f5y7mxbtps] {
    font-size: 1.25rem;
    flex-shrink: 0;
}

.kiosk-alert-error[b-f5y7mxbtps] {
    background: rgba(239, 68, 68, 0.15);
    color: var(--kiosk-error);
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.kiosk-alert-success[b-f5y7mxbtps] {
    background: rgba(34, 197, 94, 0.15);
    color: var(--kiosk-success);
    border: 1px solid rgba(34, 197, 94, 0.3);
}

/* ===== Button Styles ===== */
.kiosk-btn[b-f5y7mxbtps] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
    min-height: var(--kiosk-button-height, 56px);
    padding: 16px 24px;
    border: none;
    border-radius: var(--kiosk-radius, 12px);
    font-size: 1.125rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    touch-action: manipulation;
    margin-top: 8px; /* Extra space before submit button */
}

.kiosk-btn:disabled[b-f5y7mxbtps] {
    opacity: 0.6;
    cursor: not-allowed;
}

.kiosk-btn i[b-f5y7mxbtps] {
    font-size: 1.5rem;
}

.kiosk-btn-primary[b-f5y7mxbtps] {
    background: linear-gradient(135deg, var(--kiosk-primary), var(--kiosk-secondary, var(--kiosk-primary)));
    color: white;
}

.kiosk-btn-primary:hover:not(:disabled)[b-f5y7mxbtps],
.kiosk-btn-primary:active:not(:disabled)[b-f5y7mxbtps] {
    transform: scale(1.02);
    box-shadow: 0 8px 24px rgba(59, 130, 246, 0.4);
}

/* ===== Spinner ===== */
.kiosk-spinner[b-f5y7mxbtps] {
    width: 24px;
    height: 24px;
    border: 3px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-f5y7mxbtps 0.8s linear infinite;
}

@keyframes spin-b-f5y7mxbtps {
    to { transform: rotate(360deg); }
}

/* ===== Form Footer ===== */
.kiosk-form-footer[b-f5y7mxbtps] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--kiosk-border);
    font-size: 1rem;
    color: var(--kiosk-text-muted);
    flex-shrink: 0;
}

.kiosk-link-btn[b-f5y7mxbtps] {
    background: none;
    border: none;
    color: var(--kiosk-primary);
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    padding: 8px;
    margin: -8px;
}

.kiosk-link-btn:hover[b-f5y7mxbtps] {
    text-decoration: underline;
}

/* ===== Hint text below inputs ===== */
.kiosk-hint[b-f5y7mxbtps] {
    font-size: 0.8rem;
    color: var(--kiosk-text-muted);
    margin-top: 6px;
    padding-left: 4px;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskLoginScreen.razor.rz.scp.css */
/*
 * KioskLoginScreen.razor.css
 * Authentication screen for kiosk device login — matches kiosk dark theme.
 */

.kiosk-login-screen[b-ink083r2ii] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    background: var(--kiosk-bg-gradient, linear-gradient(180deg, #0a0a14 0%, #0f0f1a 100%));
    padding: 2rem;
}

.kiosk-login-card[b-ink083r2ii] {
    background: var(--kiosk-surface, #13132a);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 1.5rem;
    padding: 3rem;
    width: 100%;
    max-width: 480px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
}

.kiosk-login-header[b-ink083r2ii] {
    text-align: center;
    margin-bottom: 2.5rem;
}

.kiosk-login-header i[b-ink083r2ii] {
    font-size: 3rem;
    color: var(--kiosk-primary, #3b82f6);
    margin-bottom: 1rem;
    display: block;
}

.kiosk-login-header h2[b-ink083r2ii] {
    color: var(--kiosk-text, #f8fafc);
    font-size: 1.75rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.kiosk-login-header p[b-ink083r2ii] {
    color: var(--kiosk-text-muted, #94a3b8);
    font-size: 1rem;
    margin: 0;
}

.kiosk-login-form[b-ink083r2ii] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.kiosk-login-error[b-ink083r2ii] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: 0.75rem;
    color: var(--kiosk-error, #ef4444);
    font-size: 0.95rem;
}

.kiosk-login-error i[b-ink083r2ii] {
    font-size: 1.25rem;
    flex-shrink: 0;
}

.kiosk-login-field[b-ink083r2ii] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.kiosk-login-field label[b-ink083r2ii] {
    color: var(--kiosk-text-muted, #94a3b8);
    font-size: 0.9rem;
    font-weight: 500;
}

.kiosk-login-input[b-ink083r2ii] {
    background: var(--kiosk-surface-hover, #1a1a3a);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.75rem;
    padding: 1rem 1.25rem;
    color: var(--kiosk-text, #f8fafc);
    font-size: 1.1rem;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.kiosk-login-input[b-ink083r2ii]::placeholder {
    color: var(--kiosk-text-dim, #64748b);
}

.kiosk-login-input:focus[b-ink083r2ii] {
    border-color: var(--kiosk-primary, #3b82f6);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}

.kiosk-login-input:disabled[b-ink083r2ii] {
    opacity: 0.5;
    cursor: not-allowed;
}

.kiosk-login-button[b-ink083r2ii] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 1rem 2rem;
    background: var(--kiosk-accent-gradient, linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%));
    border: none;
    border-radius: 0.75rem;
    color: white;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.2s, transform 0.1s;
    margin-top: 0.5rem;
}

.kiosk-login-button:hover:not(:disabled)[b-ink083r2ii] {
    opacity: 0.9;
}

.kiosk-login-button:active:not(:disabled)[b-ink083r2ii] {
    transform: scale(0.98);
}

.kiosk-login-button:disabled[b-ink083r2ii] {
    opacity: 0.5;
    cursor: not-allowed;
}

.kiosk-login-footer[b-ink083r2ii] {
    text-align: center;
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.kiosk-login-footer small[b-ink083r2ii] {
    color: var(--kiosk-text-dim, #64748b);
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskMainMenu.razor.rz.scp.css */
/* KioskMainMenu.razor.css */
/* World-class, touch-optimized main menu design */

.kiosk-main-menu[b-8ys7dkmtfg] {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 24px 40px;
    gap: 20px;
    max-width: 900px;
    margin: 0 auto;
    width: 100%;
    overflow-y: auto;
    min-height: 0;
}

/* ===== Header Section ===== */
.menu-header[b-8ys7dkmtfg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 12px;
    padding-bottom: 8px;
    flex-shrink: 0;
}

.greeting-container[b-8ys7dkmtfg] {
    display: flex;
    align-items: center;
    gap: 20px;
}

.avatar-ring[b-8ys7dkmtfg] {
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--kiosk-primary), var(--kiosk-secondary));
    border-radius: 50%;
    position: relative;
    flex-shrink: 0;
}

.avatar-ring[b-8ys7dkmtfg]::before {
    content: '';
    position: absolute;
    inset: -3px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--kiosk-primary), var(--kiosk-secondary));
    opacity: 0.3;
    filter: blur(8px);
}

.avatar-ring i[b-8ys7dkmtfg] {
    font-size: 1.5rem;
    color: white;
    z-index: 1;
}

.greeting-text[b-8ys7dkmtfg] {
    text-align: left;
}

.welcome-label[b-8ys7dkmtfg] {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--kiosk-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 4px;
}

.user-name[b-8ys7dkmtfg] {
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0;
    background: linear-gradient(135deg, var(--kiosk-text) 0%, var(--kiosk-text-muted) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.menu-prompt[b-8ys7dkmtfg] {
    font-size: 1.125rem;
    color: var(--kiosk-text-muted);
    margin: 0;
}

/* ===== Menu Sections ===== */
.menu-section[b-8ys7dkmtfg] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* ===== Primary Action Cards ===== */
.primary-actions[b-8ys7dkmtfg] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.action-card[b-8ys7dkmtfg] {
    position: relative;
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    text-align: left;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    border-radius: 20px;
    overflow: hidden;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.action-card:hover[b-8ys7dkmtfg],
.action-card:focus-visible[b-8ys7dkmtfg] {
    transform: translateY(-4px) scale(1.01);
}

.action-card:active[b-8ys7dkmtfg] {
    transform: scale(0.98);
}

.action-card:focus-visible[b-8ys7dkmtfg] {
    outline: 2px solid var(--kiosk-primary);
    outline-offset: 4px;
}

/* Card glow effect */
.card-glow[b-8ys7dkmtfg] {
    position: absolute;
    inset: 0;
    border-radius: 20px;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.action-card:hover .card-glow[b-8ys7dkmtfg],
.action-card:focus-visible .card-glow[b-8ys7dkmtfg] {
    opacity: 1;
}

/* Racing card styles */
.action-card.racing .card-glow[b-8ys7dkmtfg] {
    box-shadow: 0 8px 40px rgba(59, 130, 246, 0.4),
                inset 0 0 0 1px rgba(59, 130, 246, 0.3);
}

.action-card.racing .card-inner[b-8ys7dkmtfg] {
    background: linear-gradient(135deg, 
        rgba(59, 130, 246, 0.15) 0%, 
        rgba(139, 92, 246, 0.1) 100%);
    border: 1px solid rgba(59, 130, 246, 0.3);
}

.action-card.racing .icon-bg[b-8ys7dkmtfg] {
    background: linear-gradient(135deg, #3b82f6, #6366f1);
}

/* Karting card styles */
.action-card.karting .card-glow[b-8ys7dkmtfg] {
    box-shadow: 0 8px 40px rgba(255, 107, 53, 0.4),
                inset 0 0 0 1px rgba(255, 107, 53, 0.3);
}

.action-card.karting .card-inner[b-8ys7dkmtfg] {
    background: linear-gradient(135deg, 
        rgba(255, 107, 53, 0.15) 0%, 
        rgba(247, 147, 30, 0.1) 100%);
    border: 1px solid rgba(255, 107, 53, 0.3);
}

.action-card.karting .icon-bg[b-8ys7dkmtfg] {
    background: linear-gradient(135deg, #ff6b35, #f7931e);
}

/* Food & Bev card styles */
.action-card.food-bev .card-glow[b-8ys7dkmtfg] {
    box-shadow: 0 8px 40px rgba(236, 72, 153, 0.4),
                inset 0 0 0 1px rgba(236, 72, 153, 0.3);
}

.action-card.food-bev .card-inner[b-8ys7dkmtfg] {
    background: linear-gradient(135deg, 
        rgba(236, 72, 153, 0.15) 0%, 
        rgba(249, 115, 22, 0.1) 100%);
    border: 1px solid rgba(236, 72, 153, 0.3);
}

.action-card.food-bev .icon-bg[b-8ys7dkmtfg] {
    background: linear-gradient(135deg, #ec4899, #f97316);
}

/* Card inner container */
.card-inner[b-8ys7dkmtfg] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 24px;
    border-radius: 20px;
    background: var(--kiosk-surface);
    border: 1px solid var(--kiosk-border);
    transition: all 0.3s ease;
}

/* Icon wrapper */
.card-icon-wrapper[b-8ys7dkmtfg] {
    flex-shrink: 0;
}

.icon-bg[b-8ys7dkmtfg] {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.icon-bg i[b-8ys7dkmtfg] {
    font-size: 1.75rem;
    color: white;
}

/* Card content */
.card-content[b-8ys7dkmtfg] {
    flex: 1;
    min-width: 0;
}

.card-content h3[b-8ys7dkmtfg] {
    font-size: 1.375rem;
    font-weight: 700;
    margin: 0 0 6px 0;
    color: var(--kiosk-text);
}

.card-content p[b-8ys7dkmtfg] {
    font-size: 0.9375rem;
    color: var(--kiosk-text-muted);
    margin: 0;
    line-height: 1.4;
}

/* Card action button */
.card-action[b-8ys7dkmtfg] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--kiosk-text);
    white-space: nowrap;
    transition: all 0.2s ease;
}

.action-card:hover .card-action[b-8ys7dkmtfg],
.action-card:focus-visible .card-action[b-8ys7dkmtfg] {
    background: rgba(255, 255, 255, 0.15);
    transform: translateX(4px);
}

.card-action i[b-8ys7dkmtfg] {
    font-size: 1rem;
    transition: transform 0.2s ease;
}

.action-card:hover .card-action i[b-8ys7dkmtfg],
.action-card:focus-visible .card-action i[b-8ys7dkmtfg] {
    transform: translateX(4px);
}

/* ===== Secondary Actions ===== */
.secondary-actions[b-8ys7dkmtfg] {
    margin-top: auto;
    padding-top: 16px;
}

.section-label[b-8ys7dkmtfg] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

.section-label span[b-8ys7dkmtfg] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--kiosk-text-dim);
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.section-label[b-8ys7dkmtfg]::after {
    content: '';
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, var(--kiosk-border), transparent);
}

.quick-links[b-8ys7dkmtfg] {
    display: flex;
    gap: 12px;
}

.quick-link-btn[b-8ys7dkmtfg] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 20px;
    background: var(--kiosk-surface);
    border: 1px solid var(--kiosk-border);
    border-radius: 14px;
    color: var(--kiosk-text);
    font-size: 0.9375rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    touch-action: manipulation;
}

.quick-link-btn:hover[b-8ys7dkmtfg],
.quick-link-btn:focus-visible[b-8ys7dkmtfg] {
    background: var(--kiosk-surface-hover);
    border-color: var(--kiosk-primary);
    color: var(--kiosk-primary);
    transform: translateY(-2px);
}

.quick-link-btn:active[b-8ys7dkmtfg] {
    transform: scale(0.98);
}

.quick-link-btn:focus-visible[b-8ys7dkmtfg] {
    outline: 2px solid var(--kiosk-primary);
    outline-offset: 2px;
}

.quick-link-btn i[b-8ys7dkmtfg] {
    font-size: 1.25rem;
}

/* ===== Footer ===== */
.menu-footer[b-8ys7dkmtfg] {
    display: flex;
    justify-content: center;
    padding-top: 16px;
    border-top: 1px solid var(--kiosk-border);
    margin-top: auto;
    flex-shrink: 0;
}

.logout-btn[b-8ys7dkmtfg] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 28px;
    background: transparent;
    border: 1px solid var(--kiosk-border);
    border-radius: 12px;
    color: var(--kiosk-text-muted);
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    touch-action: manipulation;
}

.logout-btn:hover[b-8ys7dkmtfg],
.logout-btn:focus-visible[b-8ys7dkmtfg] {
    background: rgba(239, 68, 68, 0.1);
    border-color: #ef4444;
    color: #ef4444;
}

.logout-btn:active[b-8ys7dkmtfg] {
    transform: scale(0.98);
}

.logout-btn:focus-visible[b-8ys7dkmtfg] {
    outline: 2px solid #ef4444;
    outline-offset: 2px;
}

.logout-btn i[b-8ys7dkmtfg] {
    font-size: 1.25rem;
}

/* ===== Responsive Design ===== */
@media (max-width: 768px) {
    .kiosk-main-menu[b-8ys7dkmtfg] {
        padding: 16px 20px;
        gap: 16px;
    }
    
    .greeting-container[b-8ys7dkmtfg] {
        flex-direction: column;
        text-align: center;
    }
    
    .greeting-text[b-8ys7dkmtfg] {
        text-align: center;
    }
    
    .avatar-ring[b-8ys7dkmtfg] {
        width: 64px;
        height: 64px;
    }
    
    .avatar-ring i[b-8ys7dkmtfg] {
        font-size: 1.75rem;
    }
    
    .user-name[b-8ys7dkmtfg] {
        font-size: 1.5rem;
    }
    
    .card-inner[b-8ys7dkmtfg] {
        padding: 20px;
        gap: 16px;
    }
    
    .icon-bg[b-8ys7dkmtfg] {
        width: 52px;
        height: 52px;
        border-radius: 12px;
    }
    
    .icon-bg i[b-8ys7dkmtfg] {
        font-size: 1.5rem;
    }
    
    .card-content h3[b-8ys7dkmtfg] {
        font-size: 1.125rem;
    }
    
    .card-content p[b-8ys7dkmtfg] {
        font-size: 0.875rem;
    }
    
    .card-action[b-8ys7dkmtfg] {
        padding: 8px 14px;
        font-size: 0.8125rem;
    }
    
    .quick-links[b-8ys7dkmtfg] {
        flex-direction: column;
    }
    
    .quick-link-btn[b-8ys7dkmtfg] {
        padding: 14px 16px;
    }
}

@media (max-width: 480px) {
    .kiosk-main-menu[b-8ys7dkmtfg] {
        padding: 16px 16px;
    }
    
    .card-action span[b-8ys7dkmtfg] {
        display: none;
    }
    
    .card-action[b-8ys7dkmtfg] {
        padding: 10px;
        border-radius: 10px;
    }
}

/* ===== Small viewport height (compact kiosk screens) ===== */
@media (max-height: 800px) {
    .kiosk-main-menu[b-8ys7dkmtfg] {
        padding: 12px 24px;
        gap: 12px;
    }

    .menu-header[b-8ys7dkmtfg] {
        gap: 8px;
        padding-bottom: 4px;
    }

    .avatar-ring[b-8ys7dkmtfg] {
        width: 40px;
        height: 40px;
    }

    .avatar-ring i[b-8ys7dkmtfg] {
        font-size: 1.125rem;
    }

    .user-name[b-8ys7dkmtfg] {
        font-size: 1.25rem;
    }

    .menu-prompt[b-8ys7dkmtfg] {
        font-size: 0.875rem;
    }

    .card-inner[b-8ys7dkmtfg] {
        padding: 14px 18px;
        gap: 12px;
    }

    .icon-bg[b-8ys7dkmtfg] {
        width: 48px;
        height: 48px;
        border-radius: 12px;
    }

    .icon-bg i[b-8ys7dkmtfg] {
        font-size: 1.25rem;
    }

    .card-content h3[b-8ys7dkmtfg] {
        font-size: 1.125rem;
    }

    .card-content p[b-8ys7dkmtfg] {
        font-size: 0.8125rem;
    }

    .logout-btn[b-8ys7dkmtfg] {
        padding: 10px 20px;
        font-size: 0.875rem;
    }

    .quick-link-btn[b-8ys7dkmtfg] {
        padding: 12px 16px;
        font-size: 0.875rem;
    }

    .menu-footer[b-8ys7dkmtfg] {
        padding-top: 12px;
    }
}

/* ===== Animation Entrance ===== */
.action-card[b-8ys7dkmtfg] {
    animation: cardSlideIn-b-8ys7dkmtfg 0.4s cubic-bezier(0.4, 0, 0.2, 1) backwards;
}

.action-card:nth-child(1)[b-8ys7dkmtfg] { animation-delay: 0.1s; }
.action-card:nth-child(2)[b-8ys7dkmtfg] { animation-delay: 0.2s; }
.action-card:nth-child(3)[b-8ys7dkmtfg] { animation-delay: 0.3s; }

@keyframes cardSlideIn-b-8ys7dkmtfg {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.quick-link-btn[b-8ys7dkmtfg] {
    animation: fadeIn-b-8ys7dkmtfg 0.3s ease backwards;
    animation-delay: 0.4s;
}

@keyframes fadeIn-b-8ys7dkmtfg {
    from { opacity: 0; }
    to { opacity: 1; }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskMemberLookup.razor.rz.scp.css */
/* KioskMemberLookup.razor.css */

.kiosk-member-lookup[b-jzi2jbzfwm] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--kiosk-spacing-lg, 32px);
    gap: var(--kiosk-spacing-lg, 32px);
    max-width: 600px;
    margin: 0 auto;
    width: 100%;
}

/* ===== Header ===== */
.lookup-header[b-jzi2jbzfwm] {
    text-align: center;
}

.lookup-title[b-jzi2jbzfwm] {
    font-size: 2rem;
    font-weight: 700;
    color: var(--kiosk-text, #f8fafc);
    margin: 0 0 0.5rem;
}

.lookup-subtitle[b-jzi2jbzfwm] {
    font-size: 1.1rem;
    color: var(--kiosk-text-muted, #94a3b8);
    margin: 0;
    line-height: 1.4;
}

/* ===== Input Area ===== */
.lookup-input-area[b-jzi2jbzfwm] {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--kiosk-spacing-sm, 16px);
}

.member-number-display[b-jzi2jbzfwm] {
    width: 100%;
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px 24px;
    background: var(--kiosk-surface, #13132a);
    border: 2px solid var(--kiosk-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--kiosk-radius-lg, 16px);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.member-number-display:focus-within[b-jzi2jbzfwm] {
    border-color: var(--kiosk-primary, #3b82f6);
    box-shadow: 0 0 0 4px var(--kiosk-glow-primary, rgba(59, 130, 246, 0.4));
}

.member-number-display.has-error[b-jzi2jbzfwm] {
    border-color: var(--kiosk-error, #ef4444);
    box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.2);
}

.member-number-text[b-jzi2jbzfwm] {
    font-size: 2rem;
    font-weight: 700;
    font-family: monospace;
    letter-spacing: 0.15em;
    color: var(--kiosk-text, #f8fafc);
}

/* Placeholder state (no digits entered) */
.member-number-display:not(.has-error) .member-number-text:only-child[b-jzi2jbzfwm] {
    color: var(--kiosk-text-dim, #64748b);
    font-weight: 400;
    font-size: 1.1rem;
    letter-spacing: normal;
    font-family: var(--kiosk-font, inherit);
}

/* ===== Error / Success Messages ===== */
.lookup-error[b-jzi2jbzfwm] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: var(--kiosk-radius, 12px);
    color: var(--kiosk-error, #ef4444);
    font-size: 1rem;
    width: 100%;
    animation: shakeError-b-jzi2jbzfwm 0.4s ease;
}

.lookup-error i[b-jzi2jbzfwm] {
    font-size: 1.25rem;
    flex-shrink: 0;
}

@keyframes shakeError-b-jzi2jbzfwm {
    0%, 100% { transform: translateX(0); }
    20% { transform: translateX(-6px); }
    40% { transform: translateX(6px); }
    60% { transform: translateX(-4px); }
    80% { transform: translateX(4px); }
}

.lookup-success[b-jzi2jbzfwm] {
    width: 100%;
    padding: 16px;
    background: rgba(34, 197, 94, 0.08);
    border: 1px solid rgba(34, 197, 94, 0.25);
    border-radius: var(--kiosk-radius, 12px);
    animation: fadeIn-b-jzi2jbzfwm 0.3s ease;
}

@keyframes fadeIn-b-jzi2jbzfwm {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ===== Keypad ===== */
.lookup-keypad[b-jzi2jbzfwm] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    width: 100%;
    max-width: 360px;
}

.keypad-btn[b-jzi2jbzfwm] {
    height: 72px;
    font-size: 1.75rem;
    font-weight: 600;
    border: 2px solid var(--kiosk-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--kiosk-radius, 12px);
    background: var(--kiosk-surface, #13132a);
    color: var(--kiosk-text, #f8fafc);
    cursor: pointer;
    transition: all 0.15s ease;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
}

.keypad-btn:hover:not(:disabled)[b-jzi2jbzfwm] {
    background: var(--kiosk-surface-hover, #1a1a3a);
    border-color: var(--kiosk-border-hover, rgba(255, 255, 255, 0.15));
}

.keypad-btn:active:not(:disabled)[b-jzi2jbzfwm] {
    transform: scale(0.95);
    background: var(--kiosk-primary, #3b82f6);
    border-color: var(--kiosk-primary, #3b82f6);
}

.keypad-btn:disabled[b-jzi2jbzfwm] {
    opacity: 0.4;
    cursor: not-allowed;
}

/* Delete key */
.keypad-btn-delete[b-jzi2jbzfwm] {
    font-size: 1.5rem;
    background: var(--kiosk-surface-elevated, #1f1f40);
    color: var(--kiosk-text-muted, #94a3b8);
}

.keypad-btn-delete:hover:not(:disabled)[b-jzi2jbzfwm] {
    color: var(--kiosk-error, #ef4444);
    border-color: rgba(239, 68, 68, 0.3);
}

/* GO key */
.keypad-btn-go[b-jzi2jbzfwm] {
    background: linear-gradient(135deg, var(--kiosk-primary, #3b82f6), var(--kiosk-secondary, #8b5cf6));
    color: white;
    border-color: transparent;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: 0.05em;
}

.keypad-btn-go:hover:not(:disabled)[b-jzi2jbzfwm] {
    box-shadow: 0 4px 16px var(--kiosk-glow-primary, rgba(59, 130, 246, 0.4));
    transform: scale(1.02);
    background: linear-gradient(135deg, var(--kiosk-primary, #3b82f6), var(--kiosk-secondary, #8b5cf6));
    border-color: transparent;
}

.keypad-btn-go:active:not(:disabled)[b-jzi2jbzfwm] {
    transform: scale(0.97);
}

/* ===== Footer Actions ===== */
.lookup-footer[b-jzi2jbzfwm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    width: 100%;
}

.lookup-footer .kiosk-btn[b-jzi2jbzfwm] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    min-height: var(--kiosk-button-height, 56px);
    padding: 14px 24px;
    border: none;
    border-radius: var(--kiosk-radius, 12px);
    font-size: 1.05rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    touch-action: manipulation;
}

.lookup-footer .kiosk-btn i[b-jzi2jbzfwm] {
    font-size: 1.25rem;
}

.lookup-footer .kiosk-btn-primary[b-jzi2jbzfwm] {
    background: linear-gradient(135deg, var(--kiosk-success, #22c55e), #16a34a);
    color: white;
}

.lookup-footer .kiosk-btn-primary:hover[b-jzi2jbzfwm] {
    transform: scale(1.02);
    box-shadow: 0 8px 24px rgba(34, 197, 94, 0.4);
}

.lookup-footer .kiosk-btn-outline[b-jzi2jbzfwm] {
    background: transparent;
    color: var(--kiosk-text-muted, #94a3b8);
    border: 2px solid var(--kiosk-border, rgba(255, 255, 255, 0.08));
}

.lookup-footer .kiosk-btn-outline:hover[b-jzi2jbzfwm] {
    background: var(--kiosk-surface, #13132a);
    color: var(--kiosk-text, #f8fafc);
    border-color: var(--kiosk-text-muted, #94a3b8);
}

/* ===== Responsive ===== */
@media (max-width: 480px) {
    .kiosk-member-lookup[b-jzi2jbzfwm] {
        padding: var(--kiosk-spacing-md, 24px) var(--kiosk-spacing-sm, 16px);
        gap: var(--kiosk-spacing-md, 24px);
    }

    .lookup-title[b-jzi2jbzfwm] {
        font-size: 1.5rem;
    }

    .lookup-subtitle[b-jzi2jbzfwm] {
        font-size: 0.95rem;
    }

    .member-number-text[b-jzi2jbzfwm] {
        font-size: 1.5rem;
    }

    .lookup-keypad[b-jzi2jbzfwm] {
        gap: 8px;
    }

    .keypad-btn[b-jzi2jbzfwm] {
        height: 60px;
        font-size: 1.5rem;
    }
}

@media (min-width: 481px) and (max-width: 768px) {
    .lookup-keypad[b-jzi2jbzfwm] {
        max-width: 320px;
    }

    .keypad-btn[b-jzi2jbzfwm] {
        height: 66px;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskMultiDriverIdentity.razor.rz.scp.css */
/* KioskMultiDriverIdentity.razor.css */

/* ===== Custom Scrollbar Styling (Dark Theme) ===== */
.identity-content[b-00gonf6eol] {
    /* Scrollbar styling for WebKit browsers (Chrome, Safari, Edge) */
    scrollbar-width: thin;
    scrollbar-color: var(--kiosk-primary, #3b82f6) var(--kiosk-surface, #1a1a2e);
}

.identity-content[b-00gonf6eol]::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.identity-content[b-00gonf6eol]::-webkit-scrollbar-track {
    background: var(--kiosk-surface, #1a1a2e);
    border-radius: 4px;
}

.identity-content[b-00gonf6eol]::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--kiosk-primary, #3b82f6), var(--kiosk-secondary, #8b5cf6));
    border-radius: 4px;
    border: 2px solid var(--kiosk-surface, #1a1a2e);
}

.identity-content[b-00gonf6eol]::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, var(--kiosk-primary-hover, #2563eb), var(--kiosk-secondary, #8b5cf6));
}

.kiosk-multi-driver-identity[b-00gonf6eol] {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--kiosk-bg, #0f0f1a);
    color: var(--kiosk-text, #f8fafc);
}

.kiosk-screen-header[b-00gonf6eol] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    background: rgba(0, 0, 0, 0.3);
    border-bottom: 1px solid var(--kiosk-border, rgba(255, 255, 255, 0.08));
}

.kiosk-back-btn[b-00gonf6eol] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border: none;
    border-radius: 12px;
    background: var(--kiosk-surface, #1a1a2e);
    color: var(--kiosk-text, #f8fafc);
    font-size: 1.25rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.kiosk-back-btn:hover[b-00gonf6eol] {
    background: var(--kiosk-surface-hover, #252540);
    transform: scale(1.05);
}

.screen-title[b-00gonf6eol] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
}

.step-indicator[b-00gonf6eol] {
    font-size: 0.875rem;
    color: var(--kiosk-text-muted, #94a3b8);
}

.identity-content[b-00gonf6eol] {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 24px;
    overflow-y: auto;
}

.identity-intro[b-00gonf6eol] {
    text-align: center;
    margin-bottom: 32px;
}

.identity-icon[b-00gonf6eol] {
    width: 80px;
    height: 80px;
    margin: 0 auto 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--kiosk-primary, #3b82f6), var(--kiosk-secondary, #8b5cf6));
    border-radius: 20px;
    font-size: 2.5rem;
    color: white;
}

.identity-intro h3[b-00gonf6eol] {
    margin: 0 0 8px 0;
    font-size: 1.5rem;
    font-weight: 600;
}

.intro-text[b-00gonf6eol] {
    margin: 0;
    color: var(--kiosk-text-muted, #94a3b8);
    max-width: 500px;
    margin: 0 auto;
}

/* Loading state */
.loading-state[b-00gonf6eol] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px;
    color: var(--kiosk-text-muted, #94a3b8);
}

.loading-state .spinner[b-00gonf6eol] {
    width: 48px;
    height: 48px;
    border: 3px solid var(--kiosk-surface, #1a1a2e);
    border-top-color: var(--kiosk-primary, #3b82f6);
    border-radius: 50%;
    animation: spin-b-00gonf6eol 1s linear infinite;
    margin-bottom: 16px;
}

/* Driver cards container */
.driver-cards-container[b-00gonf6eol] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 24px;
    margin-bottom: 24px;
}

/* Single driver - center it */
.driver-cards-container:has(.driver-card:only-child)[b-00gonf6eol] {
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}

.driver-card[b-00gonf6eol] {
    background: var(--kiosk-surface, #1a1a2e);
    border: 2px solid transparent;
    border-radius: 16px;
    padding: 20px;
    transition: all 0.2s ease;
}

.driver-card:focus-within[b-00gonf6eol] {
    border-color: var(--kiosk-primary, #3b82f6);
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.1);
}

.driver-card.has-errors[b-00gonf6eol] {
    border-color: var(--kiosk-error, #ef4444);
}

.driver-card.logged-in-user[b-00gonf6eol] {
    border-color: var(--kiosk-success, #22c55e);
    background: linear-gradient(135deg, 
        rgba(34, 197, 94, 0.1), 
        rgba(34, 197, 94, 0.05));
}

.driver-card-header[b-00gonf6eol] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--kiosk-border, rgba(255, 255, 255, 0.08));
}

.simulator-badge[b-00gonf6eol] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: var(--kiosk-primary, #3b82f6);
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.875rem;
}

.simulator-badge i[b-00gonf6eol] {
    font-size: 1rem;
}

.copy-from-first-btn[b-00gonf6eol] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 8px;
    background: var(--kiosk-surface-hover, #252540);
    color: var(--kiosk-text-muted, #94a3b8);
    cursor: pointer;
    transition: all 0.2s ease;
}

.copy-from-first-btn:hover:not(:disabled)[b-00gonf6eol] {
    background: var(--kiosk-primary, #3b82f6);
    color: white;
}

.copy-from-first-btn:disabled[b-00gonf6eol] {
    opacity: 0.3;
    cursor: not-allowed;
}

/* Form styling */
.driver-form[b-00gonf6eol] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.form-group[b-00gonf6eol] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.form-group label[b-00gonf6eol] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.875rem;
    color: var(--kiosk-text-muted, #94a3b8);
    font-weight: 500;
}

.form-group label i[b-00gonf6eol] {
    font-size: 1rem;
    color: var(--kiosk-primary, #3b82f6);
}

.kiosk-input[b-00gonf6eol] {
    width: 100%;
    height: 56px;
    padding: 0 16px;
    background: var(--kiosk-bg, #0f0f1a);
    border: 2px solid var(--kiosk-border, rgba(255, 255, 255, 0.08));
    border-radius: 12px;
    color: var(--kiosk-text, #f8fafc);
    font-size: 1rem;
    transition: all 0.2s ease;
}

.kiosk-input:focus[b-00gonf6eol] {
    outline: none;
    border-color: var(--kiosk-primary, #3b82f6);
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.1);
}

.kiosk-input[b-00gonf6eol]::placeholder {
    color: var(--kiosk-text-dim, #64748b);
}

.kiosk-input.input-error[b-00gonf6eol] {
    border-color: var(--kiosk-error, #ef4444);
}

.kiosk-input:disabled[b-00gonf6eol] {
    opacity: 0.6;
    cursor: not-allowed;
}

.field-error[b-00gonf6eol] {
    font-size: 0.75rem;
    color: var(--kiosk-error, #ef4444);
    display: flex;
    align-items: center;
    gap: 4px;
}

/* Form error */
.form-error[b-00gonf6eol] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid var(--kiosk-error, #ef4444);
    border-radius: 12px;
    color: var(--kiosk-error, #ef4444);
    margin-bottom: 16px;
}

.form-error i[b-00gonf6eol] {
    font-size: 1.25rem;
}

/* Action buttons */
.action-buttons[b-00gonf6eol] {
    display: flex;
    justify-content: center;
    margin-top: auto;
    padding-top: 24px;
}

.kiosk-btn[b-00gonf6eol] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 0 32px;
    height: 56px;
    border: none;
    border-radius: 16px;
    font-size: 1.125rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    touch-action: manipulation;
}

.kiosk-btn-primary[b-00gonf6eol] {
    background: linear-gradient(135deg, var(--kiosk-primary, #3b82f6), var(--kiosk-secondary, #8b5cf6));
    color: white;
}

.kiosk-btn-primary:hover:not(:disabled)[b-00gonf6eol] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(59, 130, 246, 0.4);
}

.kiosk-btn-primary:active:not(:disabled)[b-00gonf6eol] {
    transform: translateY(0);
}

.kiosk-btn:disabled[b-00gonf6eol] {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

.kiosk-btn-lg[b-00gonf6eol] {
    height: 64px;
    padding: 0 48px;
    font-size: 1.25rem;
}

.kiosk-btn .spinner[b-00gonf6eol] {
    width: 24px;
    height: 24px;
    border: 3px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-00gonf6eol 1s linear infinite;
}

/* Privacy notice */
.identity-privacy[b-00gonf6eol] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px;
    margin-top: 24px;
    color: var(--kiosk-text-muted, #94a3b8);
    font-size: 0.875rem;
    text-align: center;
}

.identity-privacy i[b-00gonf6eol] {
    font-size: 1.25rem;
    color: var(--kiosk-success, #22c55e);
}

/* Logged-in user styling */
.logged-in-badge[b-00gonf6eol] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: var(--kiosk-success, #22c55e);
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.875rem;
    color: white;
}

.logged-in-badge i[b-00gonf6eol] {
    font-size: 1rem;
}

.logged-in-info[b-00gonf6eol] {
    padding: 16px;
    text-align: center;
}

.logged-in-name[b-00gonf6eol] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--kiosk-text, #f8fafc);
    margin-bottom: 8px;
}

.logged-in-name i[b-00gonf6eol] {
    color: var(--kiosk-success, #22c55e);
    font-size: 1.5rem;
}

.logged-in-note[b-00gonf6eol] {
    margin: 0;
    color: var(--kiosk-text-muted, #94a3b8);
    font-size: 0.875rem;
}

@keyframes spin-b-00gonf6eol {
    to {
        transform: rotate(360deg);
    }
}

/* Responsive */
@media (max-width: 768px) {
    .driver-cards-container[b-00gonf6eol] {
        grid-template-columns: 1fr;
    }
    
    .identity-content[b-00gonf6eol] {
        padding: 16px;
    }
    
    .kiosk-btn-lg[b-00gonf6eol] {
        width: 100%;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskPackageSelection.razor.rz.scp.css */
/* KioskPackageSelection.razor.css */

/* Package tiles within the grid */
.package-tile[b-w661qrlwy8] {
    background: var(--kiosk-surface);
    border-radius: var(--kiosk-radius-lg);
    padding: var(--kiosk-spacing-lg);
    cursor: pointer;
    transition: all 0.2s ease;
    border: 3px solid transparent;
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 280px;
}

.package-tile:hover[b-w661qrlwy8] {
    transform: translateY(-4px);
    box-shadow: 0 8px 32px rgba(59, 130, 246, 0.2);
    border-color: rgba(59, 130, 246, 0.3);
}

.package-tile:active[b-w661qrlwy8] {
    transform: translateY(0);
    transition: transform 0.1s ease;
}

.package-tile.selected[b-w661qrlwy8] {
    border-color: var(--kiosk-primary);
    background: linear-gradient(135deg, 
        var(--kiosk-surface), 
        rgba(59, 130, 246, 0.1));
    box-shadow: 0 0 0 1px var(--kiosk-primary),
                0 8px 32px rgba(59, 130, 246, 0.3);
}

/* Package header with type badge */
.package-header[b-w661qrlwy8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--kiosk-spacing-sm);
    gap: var(--kiosk-spacing-sm);
}

.package-type[b-w661qrlwy8] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--kiosk-primary);
    background: rgba(59, 130, 246, 0.15);
    padding: 6px 12px;
    border-radius: var(--kiosk-radius-sm);
}

.package-popular-badge[b-w661qrlwy8] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--kiosk-warning);
    background: rgba(245, 158, 11, 0.15);
    padding: 6px 12px;
    border-radius: var(--kiosk-radius-sm);
}

.package-popular-badge i[b-w661qrlwy8] {
    font-size: 0.65rem;
}

/* Package name */
.package-name[b-w661qrlwy8] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--kiosk-text);
    margin: 0 0 var(--kiosk-spacing-md);
    line-height: 1.2;
}

/* Package details */
.package-details[b-w661qrlwy8] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--kiosk-spacing-md);
    margin-bottom: var(--kiosk-spacing-md);
}

.package-detail-item[b-w661qrlwy8] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.95rem;
    color: var(--kiosk-text-muted);
}

.package-detail-item i[b-w661qrlwy8] {
    color: var(--kiosk-primary);
    font-size: 1rem;
}

/* Package description */
.package-description[b-w661qrlwy8] {
    font-size: 0.9rem;
    color: var(--kiosk-text-muted);
    line-height: 1.5;
    margin: 0 0 var(--kiosk-spacing-md);
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Package pricing */
.package-pricing[b-w661qrlwy8] {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: var(--kiosk-spacing-sm);
    margin-top: auto;
    padding-top: var(--kiosk-spacing-md);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.package-price[b-w661qrlwy8] {
    font-size: 2.25rem;
    font-weight: 800;
    color: var(--kiosk-success);
    letter-spacing: -0.02em;
}

.package-original-price[b-w661qrlwy8] {
    font-size: 1rem;
    color: var(--kiosk-text-muted);
    text-decoration: line-through;
    opacity: 0.7;
}

.member-badge[b-w661qrlwy8],
.peak-badge[b-w661qrlwy8] {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 4px 10px;
    border-radius: var(--kiosk-radius-sm);
}

.member-badge[b-w661qrlwy8] {
    color: var(--kiosk-success);
    background: rgba(34, 197, 94, 0.15);
}

.peak-badge[b-w661qrlwy8] {
    color: var(--kiosk-warning);
    background: rgba(245, 158, 11, 0.15);
}

/* Selected indicator */
.selected-indicator[b-w661qrlwy8] {
    position: absolute;
    top: var(--kiosk-spacing-md);
    right: var(--kiosk-spacing-md);
    color: var(--kiosk-primary);
    font-size: 2rem;
    animation: scaleIn-b-w661qrlwy8 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes scaleIn-b-w661qrlwy8 {
    from {
        transform: scale(0);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* Footer selection info */
.footer-selection-info[b-w661qrlwy8] {
    display: flex;
    align-items: center;
    gap: var(--kiosk-spacing-md);
}

.selected-label[b-w661qrlwy8] {
    font-size: 0.85rem;
    color: var(--kiosk-text-muted);
}

.selected-value[b-w661qrlwy8] {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--kiosk-text);
}

.selected-price[b-w661qrlwy8] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--kiosk-success);
    padding-left: var(--kiosk-spacing-md);
    border-left: 2px solid rgba(255, 255, 255, 0.1);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .package-tile[b-w661qrlwy8] {
        min-height: 240px;
        padding: var(--kiosk-spacing-md);
    }
    
    .package-name[b-w661qrlwy8] {
        font-size: 1.25rem;
    }
    
    .package-price[b-w661qrlwy8] {
        font-size: 1.75rem;
    }
    
    .footer-selection-info[b-w661qrlwy8] {
        flex-direction: column;
        gap: var(--kiosk-spacing-xs);
        text-align: center;
    }
    
    .selected-price[b-w661qrlwy8] {
        border-left: none;
        padding-left: 0;
    }
}

/* Large screens - show more columns */
@media (min-width: 1400px) {
    .package-tile[b-w661qrlwy8] {
        min-height: 300px;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskPayment.razor.rz.scp.css */
/* KioskPayment.razor.css */

/* ── Value Redemption (gift cards & member credits) ── */

.kiosk-value-redemption-section[b-1n3fks2s6n] {
    width: 100%;
    max-width: 420px;
    padding: var(--kiosk-spacing-md);
    background: var(--kiosk-surface);
    border-radius: var(--kiosk-radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

/* Fully-covered state */
.kiosk-fully-covered[b-1n3fks2s6n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: var(--kiosk-spacing-md);
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.12), rgba(34, 197, 94, 0.04));
    border: 2px solid var(--kiosk-success);
    border-radius: var(--kiosk-radius-lg);
    min-width: 240px;
}

.kiosk-fully-covered__icon[b-1n3fks2s6n] {
    font-size: 2.5rem;
    color: var(--kiosk-success);
    animation: successPop-b-1n3fks2s6n 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.kiosk-fully-covered h3[b-1n3fks2s6n] {
    color: var(--kiosk-success);
    font-weight: 700;
    margin: 0;
}

.kiosk-fully-covered p[b-1n3fks2s6n] {
    color: var(--kiosk-text-muted);
    font-size: 0.9rem;
    margin: 0;
}

/* Remaining amount display (partial coverage) */
.kiosk-remaining-amount[b-1n3fks2s6n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: var(--kiosk-spacing-md);
    background: var(--kiosk-surface);
    border-radius: var(--kiosk-radius-lg);
    border: 2px solid var(--kiosk-primary);
    min-width: 200px;
}

/* ── Main content area ── */

.payment-main-content[b-1n3fks2s6n] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--kiosk-spacing-lg);
    overflow-y: auto;
}

/* Payment state containers */
.payment-state[b-1n3fks2s6n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    max-width: 500px;
    gap: var(--kiosk-spacing-md);
}

.payment-state h3[b-1n3fks2s6n] {
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0;
    color: var(--kiosk-text);
}

.payment-state p[b-1n3fks2s6n] {
    font-size: 1rem;
    color: var(--kiosk-text-muted);
    margin: 0;
    line-height: 1.4;
}

/* Amount display */
.amount-display[b-1n3fks2s6n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: var(--kiosk-spacing-lg);
    background: var(--kiosk-surface);
    border-radius: var(--kiosk-radius-lg);
    border: 2px solid var(--kiosk-primary);
    min-width: 240px;
}

.amount-display.small[b-1n3fks2s6n] {
    padding: var(--kiosk-spacing-md);
    min-width: 180px;
}

.amount-label[b-1n3fks2s6n] {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--kiosk-text-muted);
}

.amount-value[b-1n3fks2s6n] {
    font-size: 2.5rem;
    font-weight: 800;
    color: var(--kiosk-primary);
    letter-spacing: -0.02em;
}

.amount-display.small .amount-value[b-1n3fks2s6n] {
    font-size: 1.75rem;
}

/* Reader animation and instructions */
.reader-instructions[b-1n3fks2s6n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--kiosk-spacing-sm);
}

.reader-animation[b-1n3fks2s6n] {
    position: relative;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-icon-container[b-1n3fks2s6n] {
    position: relative;
    width: 70px;
    height: 70px;
    background: linear-gradient(135deg, var(--kiosk-surface), rgba(59, 130, 246, 0.1));
    border-radius: var(--kiosk-radius);
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--kiosk-primary);
}

.card-icon-container i[b-1n3fks2s6n] {
    font-size: 2rem;
    color: var(--kiosk-primary);
}

.card-icon-container.pulse[b-1n3fks2s6n] {
    animation: cardPulse-b-1n3fks2s6n 1.5s ease-in-out infinite;
}

@keyframes cardPulse-b-1n3fks2s6n {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.4);
    }
    50% {
        transform: scale(1.05);
        box-shadow: 0 0 20px 5px rgba(59, 130, 246, 0.2);
    }
}

.reader-glow[b-1n3fks2s6n] {
    position: absolute;
    inset: -8px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.2) 0%, transparent 70%);
    animation: glowPulse-b-1n3fks2s6n 2s ease-in-out infinite;
}

@keyframes glowPulse-b-1n3fks2s6n {
    0%, 100% { opacity: 0.5; }
    50% { opacity: 1; }
}

.reader-waves[b-1n3fks2s6n] {
    position: absolute;
    inset: -15px;
    border: 2px solid var(--kiosk-primary);
    border-radius: var(--kiosk-radius);
    opacity: 0;
    animation: waveExpand-b-1n3fks2s6n 1.5s ease-out infinite;
}

.reader-waves[b-1n3fks2s6n]::before,
.reader-waves[b-1n3fks2s6n]::after {
    content: '';
    position: absolute;
    inset: -8px;
    border: 2px solid var(--kiosk-primary);
    border-radius: var(--kiosk-radius);
    animation: waveExpand-b-1n3fks2s6n 1.5s ease-out infinite;
}

.reader-waves[b-1n3fks2s6n]::before {
    animation-delay: 0.5s;
}

.reader-waves[b-1n3fks2s6n]::after {
    animation-delay: 1s;
}

@keyframes waveExpand-b-1n3fks2s6n {
    0% {
        transform: scale(1);
        opacity: 0.6;
    }
    100% {
        transform: scale(1.3);
        opacity: 0;
    }
}

/* Timeout display */
.payment-timeout[b-1n3fks2s6n] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    color: var(--kiosk-text-muted);
    padding: 8px 12px;
    background: var(--kiosk-surface);
    border-radius: var(--kiosk-radius);
}

.payment-timeout i[b-1n3fks2s6n] {
    color: var(--kiosk-warning);
}

/* Cash payment option */
.cash-option[b-1n3fks2s6n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--kiosk-spacing-sm);
    margin-top: var(--kiosk-spacing-md);
    padding-top: var(--kiosk-spacing-md);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    width: 100%;
}

.divider-text[b-1n3fks2s6n] {
    font-size: 0.8rem;
    color: var(--kiosk-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.cash-hint[b-1n3fks2s6n] {
    font-size: 0.8rem;
    color: var(--kiosk-text-dim);
}

/* Processing animation */
.processing-animation[b-1n3fks2s6n] {
    position: relative;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.spinner-ring[b-1n3fks2s6n] {
    position: absolute;
    width: 100%;
    height: 100%;
    border: 3px solid rgba(59, 130, 246, 0.2);
    border-top-color: var(--kiosk-primary);
    border-radius: 50%;
    animation: spin-b-1n3fks2s6n 1s linear infinite;
}

@keyframes spin-b-1n3fks2s6n {
    to { transform: rotate(360deg); }
}

.processing-animation i[b-1n3fks2s6n] {
    font-size: 2rem;
    color: var(--kiosk-primary);
}

/* Success animation */
.success-animation[b-1n3fks2s6n] {
    position: relative;
}

.success-circle[b-1n3fks2s6n] {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, var(--kiosk-success), #16a34a);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: successPop-b-1n3fks2s6n 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.success-circle i[b-1n3fks2s6n] {
    font-size: 2.5rem;
    color: white;
}

@keyframes successPop-b-1n3fks2s6n {
    0% {
        transform: scale(0);
        opacity: 0;
    }
    50% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.payment-success h3[b-1n3fks2s6n] {
    color: var(--kiosk-success);
}

.card-info[b-1n3fks2s6n] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.9rem;
    color: var(--kiosk-text-muted);
    padding: 8px 12px;
    background: var(--kiosk-surface);
    border-radius: var(--kiosk-radius);
}

/* Error state */
.error-animation i[b-1n3fks2s6n] {
    font-size: 3.5rem;
    color: var(--kiosk-error);
}

.payment-failed h3[b-1n3fks2s6n] {
    color: var(--kiosk-error);
}

.error-message[b-1n3fks2s6n] {
    background: rgba(239, 68, 68, 0.1);
    padding: var(--kiosk-spacing-sm);
    border-radius: var(--kiosk-radius);
    border: 1px solid rgba(239, 68, 68, 0.3);
    font-size: 0.9rem;
}

.error-actions[b-1n3fks2s6n] {
    display: flex;
    gap: var(--kiosk-spacing-sm);
    flex-wrap: wrap;
    justify-content: center;
}

/* Not configured state */
.info-animation i[b-1n3fks2s6n] {
    font-size: 3.5rem;
    color: var(--kiosk-warning);
}

.payment-not-configured .hint[b-1n3fks2s6n] {
    font-size: 0.85rem;
    opacity: 0.7;
}

/* Contact info display */
.contact-info[b-1n3fks2s6n] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: var(--kiosk-spacing-md);
    background: var(--kiosk-surface);
    border-radius: var(--kiosk-radius);
    border: 1px solid rgba(59, 130, 246, 0.3);
    font-size: 1rem;
    color: var(--kiosk-text);
}

.contact-info i[b-1n3fks2s6n] {
    font-size: 1.25rem;
    color: var(--kiosk-primary);
}

.contact-info strong[b-1n3fks2s6n] {
    color: var(--kiosk-primary);
    font-weight: 700;
    letter-spacing: 0.02em;
}

/* Reader unavailable state */
.payment-reader-unavailable .error-animation i[b-1n3fks2s6n] {
    font-size: 3.5rem;
    color: var(--kiosk-warning);
}

.payment-reader-unavailable h3[b-1n3fks2s6n] {
    color: var(--kiosk-warning);
}

/* Assistance box - prominent help display */
.assistance-box[b-1n3fks2s6n] {
    display: flex;
    align-items: flex-start;
    gap: var(--kiosk-spacing-md);
    padding: var(--kiosk-spacing-lg);
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(59, 130, 246, 0.05));
    border: 2px solid var(--kiosk-primary);
    border-radius: var(--kiosk-radius-lg);
    max-width: 400px;
    text-align: left;
    margin: var(--kiosk-spacing-md) 0;
}

.assistance-icon[b-1n3fks2s6n] {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    background: var(--kiosk-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.assistance-icon i[b-1n3fks2s6n] {
    font-size: 1.5rem;
    color: white;
}

.assistance-content[b-1n3fks2s6n] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.assistance-content h4[b-1n3fks2s6n] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--kiosk-text);
    margin: 0;
}

.assistance-content p[b-1n3fks2s6n] {
    font-size: 0.9rem;
    color: var(--kiosk-text-muted);
    margin: 0;
    line-height: 1.5;
}

.contact-phone[b-1n3fks2s6n] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 14px;
    background: var(--kiosk-surface);
    border-radius: var(--kiosk-radius);
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--kiosk-primary);
    margin-top: 8px;
}

.contact-phone i[b-1n3fks2s6n] {
    font-size: 1rem;
    color: var(--kiosk-primary);
}

/* Cash pending state */
.cash-animation i[b-1n3fks2s6n] {
    font-size: 3.5rem;
    color: var(--kiosk-success);
    animation: bounce-b-1n3fks2s6n 1s ease infinite;
}

@keyframes bounce-b-1n3fks2s6n {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

/* Skip payment option (testing) */
.skip-payment-option[b-1n3fks2s6n] {
    margin-top: var(--kiosk-spacing-sm);
    padding-top: var(--kiosk-spacing-sm);
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.skip-payment-option .kiosk-btn[b-1n3fks2s6n] {
    opacity: 0.7;
    font-size: 0.8rem;
    min-height: 40px;
    padding: 8px 16px;
}

.skip-payment-option .kiosk-btn:hover[b-1n3fks2s6n] {
    opacity: 1;
}

/* Compact button sizes for payment screen */
.payment-state .kiosk-btn-lg[b-1n3fks2s6n] {
    min-height: 52px;
    padding: 12px 24px;
    font-size: 1rem;
}

.payment-state .kiosk-btn-sm[b-1n3fks2s6n] {
    min-height: 40px;
    padding: 8px 16px;
    font-size: 0.875rem;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .payment-main-content[b-1n3fks2s6n] {
        padding: var(--kiosk-spacing-md);
    }

    .amount-value[b-1n3fks2s6n] {
        font-size: 2rem;
    }

    .payment-state h3[b-1n3fks2s6n] {
        font-size: 1.25rem;
    }

    .reader-animation[b-1n3fks2s6n] {
        width: 60px;
        height: 60px;
    }

    .card-icon-container[b-1n3fks2s6n] {
        width: 50px;
        height: 50px;
    }

    .card-icon-container i[b-1n3fks2s6n] {
        font-size: 1.5rem;
    }

    .kiosk-value-redemption-section[b-1n3fks2s6n] {
        max-width: 100%;
        padding: var(--kiosk-spacing-sm);
    }

    .kiosk-fully-covered__icon[b-1n3fks2s6n] {
        font-size: 2rem;
    }

    .assistance-box[b-1n3fks2s6n] {
        flex-direction: column;
        text-align: center;
        align-items: center;
    }
    
    .assistance-content[b-1n3fks2s6n] {
        align-items: center;
    }
    
    .contact-phone[b-1n3fks2s6n] {
        font-size: 1rem;
    }
}

/* Extra small screens / tight vertical space */
@media (max-height: 700px) {
    .payment-main-content[b-1n3fks2s6n] {
        padding: var(--kiosk-spacing-sm);
    }
    
    .payment-state[b-1n3fks2s6n] {
        gap: var(--kiosk-spacing-sm);
    }
    
    .amount-display[b-1n3fks2s6n] {
        padding: var(--kiosk-spacing-md);
    }
    
    .amount-value[b-1n3fks2s6n] {
        font-size: 2rem;
    }
    
    .reader-animation[b-1n3fks2s6n] {
        width: 60px;
        height: 60px;
    }
    
    .card-icon-container[b-1n3fks2s6n] {
        width: 50px;
        height: 50px;
    }
    
    .assistance-box[b-1n3fks2s6n] {
        padding: var(--kiosk-spacing-md);
    }
    
    .assistance-icon[b-1n3fks2s6n] {
        width: 40px;
        height: 40px;
    }
    
    .assistance-icon i[b-1n3fks2s6n] {
        font-size: 1.25rem;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskPreferencesChoice.razor.rz.scp.css */
/* KioskPreferencesChoice.razor.css */

.kiosk-preferences-choice[b-ztbcdrvirr] {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 2rem;
}

.preferences-choice-content[b-ztbcdrvirr] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2rem;
    max-width: 800px;
    margin: 0 auto;
    padding: 2rem 0;
}

/* Saved preferences card */
.saved-preferences-card[b-ztbcdrvirr] {
    background: var(--kiosk-surface, #1a1a2e);
    border: 2px solid var(--kiosk-border, #2a2a4e);
    border-radius: 16px;
    padding: 1.5rem;
    width: 100%;
    max-width: 500px;
}

.saved-preferences-card .card-header[b-ztbcdrvirr] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--kiosk-border, #2a2a4e);
}

.saved-preferences-card .card-header i[b-ztbcdrvirr] {
    font-size: 1.5rem;
    color: var(--kiosk-success, #00ff88);
}

.saved-preferences-card .card-header h3[b-ztbcdrvirr] {
    margin: 0;
    font-size: 1.25rem;
    color: var(--kiosk-text, #ffffff);
}

/* Preferences list */
.preferences-list[b-ztbcdrvirr] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.preference-item[b-ztbcdrvirr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 8px;
}

.pref-type[b-ztbcdrvirr] {
    color: var(--kiosk-text-secondary, #a0a0c0);
    font-size: 0.9rem;
}

.pref-value[b-ztbcdrvirr] {
    color: var(--kiosk-text, #ffffff);
    font-weight: 600;
}

/* Choice buttons */
.choice-buttons[b-ztbcdrvirr] {
    display: flex;
    gap: 1.5rem;
    width: 100%;
    max-width: 600px;
}

.choice-btn[b-ztbcdrvirr] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1.5rem;
    border: 2px solid var(--kiosk-border, #2a2a4e);
    border-radius: 16px;
    background: var(--kiosk-surface, #1a1a2e);
    cursor: pointer;
    transition: all 0.3s ease;
    text-align: center;
}

.choice-btn:hover[b-ztbcdrvirr] {
    transform: translateY(-4px);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

.choice-btn.primary[b-ztbcdrvirr] {
    border-color: var(--kiosk-primary, #00d4ff);
    background: linear-gradient(135deg, rgba(0, 212, 255, 0.1) 0%, rgba(0, 212, 255, 0.05) 100%);
}

.choice-btn.primary:hover[b-ztbcdrvirr] {
    box-shadow: 0 8px 32px rgba(0, 212, 255, 0.3);
}

.choice-btn.secondary:hover[b-ztbcdrvirr] {
    border-color: var(--kiosk-text-secondary, #a0a0c0);
}

.choice-btn i[b-ztbcdrvirr] {
    font-size: 2.5rem;
    margin-bottom: 1rem;
}

.choice-btn.primary i[b-ztbcdrvirr] {
    color: var(--kiosk-primary, #00d4ff);
}

.choice-btn.secondary i[b-ztbcdrvirr] {
    color: var(--kiosk-text-secondary, #a0a0c0);
}

.btn-title[b-ztbcdrvirr] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--kiosk-text, #ffffff);
    margin-bottom: 0.25rem;
}

.btn-subtitle[b-ztbcdrvirr] {
    font-size: 0.875rem;
    color: var(--kiosk-text-secondary, #a0a0c0);
}

/* No saved preferences state */
.no-saved-preferences[b-ztbcdrvirr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 1rem;
    padding: 3rem;
}

.no-saved-preferences i[b-ztbcdrvirr] {
    font-size: 4rem;
    color: var(--kiosk-primary, #00d4ff);
    opacity: 0.8;
}

.no-saved-preferences h3[b-ztbcdrvirr] {
    margin: 0;
    font-size: 1.5rem;
    color: var(--kiosk-text, #ffffff);
}

.no-saved-preferences p[b-ztbcdrvirr] {
    margin: 0;
    color: var(--kiosk-text-secondary, #a0a0c0);
}

/* Responsive */
@media (max-width: 768px) {
    .kiosk-preferences-choice[b-ztbcdrvirr] {
        padding: 1rem;
    }

    .choice-buttons[b-ztbcdrvirr] {
        flex-direction: column;
    }

    .choice-btn[b-ztbcdrvirr] {
        padding: 1.5rem;
    }

    .choice-btn i[b-ztbcdrvirr] {
        font-size: 2rem;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskPreferencesEntry.razor.rz.scp.css */
/* KioskPreferencesEntry.razor.css */

/* Content area */
.kiosk-preferences-content[b-xvbdikp5s4] {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 1rem 2rem;
    overflow-y: auto;
    min-height: 0;
}

/* Questions grid (show all mode) */
.questions-grid[b-xvbdikp5s4] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
    padding: 1rem 0;
    flex: 1;
    align-content: start;
    max-width: 1000px;
    margin: 0 auto;
    width: 100%;
}

.question-card[b-xvbdikp5s4] {
    background: var(--kiosk-surface, #1a1a2e);
    border: 2px solid var(--kiosk-border, #2a2a4e);
    border-radius: 12px;
    padding: 1.5rem;
    transition: all 0.3s ease;
}

.question-card.answered[b-xvbdikp5s4] {
    border-color: var(--kiosk-success, #00ff88);
}

.question-card .question-text[b-xvbdikp5s4] {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--kiosk-text, #ffffff);
    margin-bottom: 1rem;
}

.question-card .question-image[b-xvbdikp5s4] {
    width: 100%;
    max-height: 120px;
    object-fit: contain;
    margin-bottom: 1rem;
    border-radius: 8px;
}

.options-row[b-xvbdikp5s4] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.option-btn[b-xvbdikp5s4] {
    flex: 1;
    min-width: 80px;
    padding: 0.75rem 1rem;
    border: 2px solid var(--kiosk-border, #2a2a4e);
    border-radius: 8px;
    background: transparent;
    color: var(--kiosk-text, #ffffff);
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.option-btn:hover[b-xvbdikp5s4] {
    border-color: var(--kiosk-primary, #00d4ff);
    background: rgba(0, 212, 255, 0.1);
}

.option-btn.selected[b-xvbdikp5s4] {
    border-color: var(--kiosk-primary, #00d4ff);
    background: var(--kiosk-primary, #00d4ff);
    color: #000;
    font-weight: 600;
}

/* Single question view */
.single-question-view[b-xvbdikp5s4] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem 0;
    max-width: 800px;
    margin: 0 auto;
    width: 100%;
}

.question-progress[b-xvbdikp5s4] {
    width: 100%;
    margin-bottom: 2rem;
    text-align: center;
}

.question-progress span[b-xvbdikp5s4] {
    display: block;
    color: var(--kiosk-text-secondary, #a0a0c0);
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.progress-bar[b-xvbdikp5s4] {
    height: 4px;
    background: var(--kiosk-border, #2a2a4e);
    border-radius: 2px;
    overflow: hidden;
}

.progress-fill[b-xvbdikp5s4] {
    height: 100%;
    background: var(--kiosk-primary, #00d4ff);
    transition: width 0.3s ease;
}

.question-content[b-xvbdikp5s4] {
    text-align: center;
    margin-bottom: 2rem;
}

.question-image-large[b-xvbdikp5s4] {
    max-width: 300px;
    max-height: 200px;
    object-fit: contain;
    margin-bottom: 1.5rem;
    border-radius: 12px;
}

.question-text-large[b-xvbdikp5s4] {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--kiosk-text, #ffffff);
    margin: 0 0 0.5rem 0;
}

.question-help[b-xvbdikp5s4] {
    color: var(--kiosk-text-secondary, #a0a0c0);
    font-size: 1rem;
    margin: 0;
}

/* Options grid for single question */
.options-grid[b-xvbdikp5s4] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    width: 100%;
}

.option-card[b-xvbdikp5s4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1.5rem;
    border: 2px solid var(--kiosk-border, #2a2a4e);
    border-radius: 12px;
    background: var(--kiosk-surface, #1a1a2e);
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    min-height: 120px;
}

.option-card:hover[b-xvbdikp5s4] {
    border-color: var(--kiosk-primary, #00d4ff);
    transform: translateY(-2px);
}

.option-card.selected[b-xvbdikp5s4] {
    border-color: var(--kiosk-primary, #00d4ff);
    background: linear-gradient(135deg, rgba(0, 212, 255, 0.1) 0%, rgba(0, 212, 255, 0.05) 100%);
    box-shadow: 0 0 20px rgba(0, 212, 255, 0.2);
}

.option-card img[b-xvbdikp5s4] {
    width: 80px;
    height: 80px;
    object-fit: contain;
    margin-bottom: 1rem;
}

.option-label[b-xvbdikp5s4] {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--kiosk-text, #ffffff);
    text-align: center;
}

.option-desc[b-xvbdikp5s4] {
    font-size: 0.85rem;
    color: var(--kiosk-text-secondary, #a0a0c0);
    text-align: center;
    margin-top: 0.25rem;
}

.selected-icon[b-xvbdikp5s4] {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    color: var(--kiosk-primary, #00d4ff);
    font-size: 1.25rem;
}

/* Empty state */
.kiosk-empty-state[b-xvbdikp5s4] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 1rem;
}

.kiosk-empty-state i[b-xvbdikp5s4] {
    font-size: 4rem;
    color: var(--kiosk-success, #00ff88);
    opacity: 0.8;
}

.kiosk-empty-state h3[b-xvbdikp5s4] {
    margin: 0;
    font-size: 1.5rem;
    color: var(--kiosk-text, #ffffff);
}

.kiosk-empty-state p[b-xvbdikp5s4] {
    margin: 0;
    color: var(--kiosk-text-secondary, #a0a0c0);
}

/* Loading state */
.kiosk-loading[b-xvbdikp5s4] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
}

.kiosk-loading p[b-xvbdikp5s4] {
    color: var(--kiosk-text-secondary, #a0a0c0);
}

/* Responsive */
@media (max-width: 768px) {
    .kiosk-preferences-content[b-xvbdikp5s4] {
        padding: 1rem;
    }

    .questions-grid[b-xvbdikp5s4] {
        grid-template-columns: 1fr;
    }

    .options-grid[b-xvbdikp5s4] {
        grid-template-columns: 1fr;
    }

    .question-text-large[b-xvbdikp5s4] {
        font-size: 1.5rem;
    }
}

/* Animation */
.option-card[b-xvbdikp5s4] {
    animation: fadeIn-b-xvbdikp5s4 0.3s ease-out;
}

@keyframes fadeIn-b-xvbdikp5s4 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskPreferencesQR.razor.rz.scp.css */
/* KioskPreferencesQR.razor.css */

/* Use kiosk-selection-screen class (defined in parent) for consistent layout */

.qr-content[b-ov1ev1bn60] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1.5rem;
    gap: 1.5rem;
    overflow-y: auto;
    min-height: 0; /* Allow content to scroll */
}

/* Drivers grid */
.drivers-grid[b-ov1ev1bn60] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.25rem;
    width: 100%;
    max-width: 1200px;
}

.driver-card[b-ov1ev1bn60] {
    background: var(--kiosk-surface, #1a1a2e);
    border: 2px solid var(--kiosk-border, #2a2a4e);
    border-radius: 16px;
    padding: 1.25rem;
    transition: all 0.3s ease;
}

.driver-card.completed[b-ov1ev1bn60] {
    border-color: var(--kiosk-success, #00ff88);
    background: linear-gradient(135deg, rgba(0, 255, 136, 0.1) 0%, rgba(0, 255, 136, 0.05) 100%);
}

.driver-header[b-ov1ev1bn60] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    text-align: center;
}

.simulator-badge[b-ov1ev1bn60] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.75rem;
    background: var(--kiosk-primary, #00d4ff);
    color: #000;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
}

.driver-name[b-ov1ev1bn60] {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--kiosk-text, #ffffff);
}

/* QR container */
.qr-container[b-ov1ev1bn60] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
}

.qr-placeholder[b-ov1ev1bn60] {
    width: 120px;
    height: 120px;
    background: #fff;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.qr-placeholder img[b-ov1ev1bn60] {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.qr-instructions[b-ov1ev1bn60] {
    text-align: center;
}

.qr-instructions p[b-ov1ev1bn60] {
    margin: 0;
    color: var(--kiosk-text-secondary, #a0a0c0);
    font-size: 0.85rem;
}

.qr-url[b-ov1ev1bn60] {
    font-family: monospace;
    font-size: 0.75rem !important;
    color: var(--kiosk-primary, #00d4ff) !important;
    margin-top: 0.25rem !important;
}

/* Completed state */
.completed-indicator[b-ov1ev1bn60] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 160px;
    gap: 0.5rem;
}

.completed-indicator i[b-ov1ev1bn60] {
    font-size: 3rem;
    color: var(--kiosk-success, #00ff88);
    animation: checkmark-b-ov1ev1bn60 0.5s ease-out;
}

.completed-indicator span[b-ov1ev1bn60] {
    font-size: 1rem;
    color: var(--kiosk-success, #00ff88);
    font-weight: 600;
}

@keyframes checkmark-b-ov1ev1bn60 {
    from {
        transform: scale(0);
        opacity: 0;
    }
    50% {
        transform: scale(1.2);
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* Countdown section - compact and at bottom of scrollable area */
.countdown-section[b-ov1ev1bn60] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding-top: 1rem;
    margin-top: auto; /* Push to bottom of scroll area */
}

.countdown-ring[b-ov1ev1bn60] {
    position: relative;
    width: 80px;
    height: 80px;
}

.countdown-ring svg[b-ov1ev1bn60] {
    transform: rotate(-90deg);
    width: 100%;
    height: 100%;
}

.countdown-bg[b-ov1ev1bn60] {
    fill: none;
    stroke: var(--kiosk-border, #2a2a4e);
    stroke-width: 6;
}

.countdown-progress[b-ov1ev1bn60] {
    fill: none;
    stroke: var(--kiosk-primary, #00d4ff);
    stroke-width: 6;
    stroke-linecap: round;
    stroke-dasharray: 282.74;
    transition: stroke-dashoffset 1s linear;
}

.countdown-text[b-ov1ev1bn60] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}

.countdown-number[b-ov1ev1bn60] {
    display: block;
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--kiosk-text, #ffffff);
    line-height: 1;
}

.countdown-label[b-ov1ev1bn60] {
    display: block;
    font-size: 0.6rem;
    color: var(--kiosk-text-secondary, #a0a0c0);
    text-transform: uppercase;
}

.countdown-message[b-ov1ev1bn60] {
    margin: 0;
    font-size: 0.85rem;
    color: var(--kiosk-text-secondary, #a0a0c0);
}

/* Responsive - smaller viewport heights */
@media (max-height: 800px) {
    .qr-content[b-ov1ev1bn60] {
        padding: 1rem;
        gap: 1rem;
    }
    
    .drivers-grid[b-ov1ev1bn60] {
        gap: 1rem;
    }
    
    .driver-card[b-ov1ev1bn60] {
        padding: 1rem;
    }
    
    .qr-placeholder[b-ov1ev1bn60] {
        width: 100px;
        height: 100px;
    }
    
    .countdown-ring[b-ov1ev1bn60] {
        width: 60px;
        height: 60px;
    }
    
    .countdown-number[b-ov1ev1bn60] {
        font-size: 1.25rem;
    }
    
    .completed-indicator[b-ov1ev1bn60] {
        min-height: 120px;
    }
    
    .completed-indicator i[b-ov1ev1bn60] {
        font-size: 2.5rem;
    }
}

@media (max-height: 700px) {
    .qr-content[b-ov1ev1bn60] {
        padding: 0.75rem;
        gap: 0.75rem;
    }
    
    .driver-card[b-ov1ev1bn60] {
        padding: 0.75rem;
    }
    
    .qr-placeholder[b-ov1ev1bn60] {
        width: 80px;
        height: 80px;
    }
    
    .countdown-ring[b-ov1ev1bn60] {
        width: 50px;
        height: 50px;
    }
    
    .countdown-number[b-ov1ev1bn60] {
        font-size: 1rem;
    }
    
    .completed-indicator[b-ov1ev1bn60] {
        min-height: 100px;
    }
    
    .completed-indicator i[b-ov1ev1bn60] {
        font-size: 2rem;
    }
    
    .driver-name[b-ov1ev1bn60] {
        font-size: 1rem;
    }
}

@media (max-width: 768px) {
    .drivers-grid[b-ov1ev1bn60] {
        grid-template-columns: 1fr 1fr;
    }

    .driver-card[b-ov1ev1bn60] {
        padding: 1rem;
    }

    .qr-placeholder[b-ov1ev1bn60] {
        width: 100px;
        height: 100px;
    }
}

@media (max-width: 600px) {
    .drivers-grid[b-ov1ev1bn60] {
        grid-template-columns: 1fr;
    }
}

/* Loading state */
.kiosk-loading[b-ov1ev1bn60] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
}

.kiosk-loading p[b-ov1ev1bn60] {
    color: var(--kiosk-text-secondary, #a0a0c0);
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskRegister.razor.rz.scp.css */
/* KioskRegister.razor.css */

.kiosk-register[b-u8p5gdn1ga] {
    flex: 1;
    display: flex;
    flex-direction: column;
    max-width: 500px;
    margin: 0 auto;
    width: 100%;
}

/* Form group spacing - key fix for vertical spacing */
.kiosk-register .kiosk-form-group[b-u8p5gdn1ga] {
    margin-bottom: 1.75rem;
}

.kiosk-hint[b-u8p5gdn1ga] {
    font-size: 0.8rem;
    color: var(--kiosk-text-muted);
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    display: block;
}

.kiosk-label-required[b-u8p5gdn1ga] {
    color: var(--kiosk-error, #ef4444);
    margin-left: 2px;
}

.kiosk-field-info[b-u8p5gdn1ga] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 0.75rem;
    margin-bottom: 0.5rem;
    padding: 12px 14px;
    background: rgba(59, 130, 246, 0.1);
    border: 1px solid rgba(59, 130, 246, 0.3);
    border-radius: 8px;
    font-size: 0.85rem;
    color: var(--kiosk-text-muted);
    line-height: 1.5;
}

.kiosk-field-info i[b-u8p5gdn1ga] {
    color: var(--kiosk-primary, #3b82f6);
    font-size: 1rem;
    margin-top: 2px;
    flex-shrink: 0;
}

.kiosk-field-info strong[b-u8p5gdn1ga] {
    color: var(--kiosk-text);
    font-weight: 600;
}

/* Ensure screen header has proper spacing */
.kiosk-register .kiosk-screen-header[b-u8p5gdn1ga] {
    margin-bottom: 2rem;
}

/* Form spacing */
.kiosk-register .kiosk-form[b-u8p5gdn1ga] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Button spacing */
.kiosk-register .kiosk-btn-primary[b-u8p5gdn1ga] {
    margin-top: 1rem;
}

/* Footer spacing */
.kiosk-register .kiosk-form-footer[b-u8p5gdn1ga] {
    margin-top: 1.5rem;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskSessionActive.razor.rz.scp.css */
/* KioskSessionActive.razor.css - Premium active session screen */

.session-active-container[b-xgxgrjoso2] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px;
    position: relative;
    text-align: center;
    gap: 24px;
}

/* Ambient glow effect */
.session-glow[b-xgxgrjoso2] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -60%);
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(34, 197, 94, 0.3) 0%, rgba(59, 130, 246, 0.15) 40%, transparent 70%);
    opacity: 0.5;
    animation: session-glow-pulse-b-xgxgrjoso2 4s ease-in-out infinite;
    pointer-events: none;
}

@keyframes session-glow-pulse-b-xgxgrjoso2 {
    0%, 100% { opacity: 0.4; transform: translate(-50%, -60%) scale(1); }
    50% { opacity: 0.6; transform: translate(-50%, -60%) scale(1.05); }
}

/* Icon */
.session-icon-wrapper[b-xgxgrjoso2] {
    position: relative;
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.session-icon[b-xgxgrjoso2] {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--kiosk-success) 0%, #16a34a 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 32px rgba(34, 197, 94, 0.35);
}

.session-icon i[b-xgxgrjoso2] {
    font-size: 2.5rem;
    color: white;
}

/* Typography */
.session-title[b-xgxgrjoso2] {
    font-family: var(--kiosk-font-display);
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--kiosk-text);
    margin: 0;
    letter-spacing: -0.02em;
}

.session-subtitle[b-xgxgrjoso2] {
    font-size: 1.25rem;
    color: var(--kiosk-text-muted);
    margin: 0;
    font-weight: 500;
}

/* Timer card */
.session-timer-card[b-xgxgrjoso2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 24px 48px;
    background: var(--kiosk-surface);
    border: 1px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius-lg);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.2);
}

.timer-label[b-xgxgrjoso2] {
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--kiosk-text-dim);
}

.timer-value[b-xgxgrjoso2] {
    font-family: var(--kiosk-font-display);
    font-size: 3.5rem;
    font-weight: 700;
    color: var(--kiosk-text);
    letter-spacing: 0.05em;
    font-variant-numeric: tabular-nums;
}

/* Hint text */
.session-hint[b-xgxgrjoso2] {
    font-size: 1rem;
    color: var(--kiosk-text-dim);
    margin: 0;
    font-weight: 400;
    max-width: 400px;
}

/* Done button - styled like other kiosk buttons */
.session-done-btn[b-xgxgrjoso2] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 16px 48px;
    min-height: var(--kiosk-button-height);
    border: 2px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius);
    background: transparent;
    color: var(--kiosk-text);
    font-family: var(--kiosk-font);
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-top: 16px;
}

.session-done-btn:hover[b-xgxgrjoso2] {
    background: var(--kiosk-surface-hover);
    border-color: var(--kiosk-primary);
    box-shadow: 0 0 20px var(--kiosk-glow-primary);
}

.session-done-btn:active[b-xgxgrjoso2] {
    transform: scale(0.98);
}

.session-done-btn i[b-xgxgrjoso2] {
    font-size: 1.3rem;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskSessionDispatched.razor.rz.scp.css */
/* KioskSessionDispatched.razor.css - Multi-sim kiosk dispatch confirmation screen */
/* Follows the same visual pattern as KioskSessionActive */

.session-active-container[b-vd9uv4ykyt] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px;
    position: relative;
    text-align: center;
    gap: 24px;
}

/* Ambient glow effect */
.session-glow[b-vd9uv4ykyt] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -60%);
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(34, 197, 94, 0.3) 0%, rgba(59, 130, 246, 0.15) 40%, transparent 70%);
    opacity: 0.5;
    animation: session-glow-pulse-b-vd9uv4ykyt 4s ease-in-out infinite;
    pointer-events: none;
}

@keyframes session-glow-pulse-b-vd9uv4ykyt {
    0%, 100% { opacity: 0.4; transform: translate(-50%, -60%) scale(1); }
    50% { opacity: 0.6; transform: translate(-50%, -60%) scale(1.05); }
}

/* Icon */
.session-icon-wrapper[b-vd9uv4ykyt] {
    position: relative;
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.session-icon[b-vd9uv4ykyt] {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--kiosk-success) 0%, #16a34a 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 32px rgba(34, 197, 94, 0.35);
}

.session-icon.session-icon-success[b-vd9uv4ykyt] {
    background: linear-gradient(135deg, var(--kiosk-accent, #00c853) 0%, var(--kiosk-success, #16a34a) 100%);
    box-shadow: 0 8px 32px rgba(0, 200, 83, 0.35);
}

.session-icon i[b-vd9uv4ykyt] {
    font-size: 2.5rem;
    color: white;
}

/* Typography */
.session-title[b-vd9uv4ykyt] {
    font-family: var(--kiosk-font-display);
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--kiosk-text);
    margin: 0;
    letter-spacing: -0.02em;
}

.session-subtitle[b-vd9uv4ykyt] {
    font-size: 1.25rem;
    color: var(--kiosk-text-muted);
    margin: 0;
    font-weight: 500;
}

/* Simulator assignment chips */
.simulator-assignments[b-vd9uv4ykyt] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin: 8px 0;
}

.sim-chip[b-vd9uv4ykyt] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0.75rem 1.5rem;
    background: var(--kiosk-surface);
    border: 1px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius);
    color: var(--kiosk-text);
    font-size: 1.1rem;
    font-weight: 500;
}

.sim-chip i[b-vd9uv4ykyt] {
    color: var(--kiosk-primary);
}

.sim-chip-driver[b-vd9uv4ykyt] {
    opacity: 0.7;
}

/* Hint text */
.session-hint[b-vd9uv4ykyt] {
    font-size: 1.1rem;
    color: var(--kiosk-text-dim);
    margin: 0;
    font-weight: 400;
    max-width: 500px;
}

/* Done button */
.session-done-btn[b-vd9uv4ykyt] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 16px 48px;
    min-height: var(--kiosk-button-height);
    border: 2px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius);
    background: transparent;
    color: var(--kiosk-text);
    font-family: var(--kiosk-font);
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.session-done-btn:hover[b-vd9uv4ykyt] {
    background: var(--kiosk-surface-hover);
    border-color: var(--kiosk-primary);
    box-shadow: 0 0 20px var(--kiosk-glow-primary);
}

.session-done-btn:active[b-vd9uv4ykyt] {
    transform: scale(0.98);
}

/* Auto-return countdown hint */
.session-countdown-hint[b-vd9uv4ykyt] {
    font-size: 0.9rem;
    color: var(--kiosk-text-dim);
    opacity: 0.5;
    margin: 0;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskSessionSummary.razor.rz.scp.css */
/* KioskSessionSummary.razor.css - Professional session summary styling */

/* Main content - ensure it fits within available space */
.summary-main-content[b-3fw2yma61o] {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 16px 48px;
    overflow: hidden;
    min-height: 0; /* Important for flex child to respect parent bounds */
}

/* Two-column professional layout */
.summary-layout[b-3fw2yma61o] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    max-height: 100%;
}

.summary-left[b-3fw2yma61o],
.summary-right[b-3fw2yma61o] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-height: 0;
}

/* Hero Section - Vehicle showcase (landscape images) */
.summary-hero[b-3fw2yma61o] {
    flex-shrink: 0;
}

.hero-image-container[b-3fw2yma61o] {
    position: relative;
    width: 100%;
    /* 3:1 aspect ratio works well for vehicle thumbnails (72px tall, ~200px wide) */
    aspect-ratio: 3 / 1;
    border-radius: var(--kiosk-radius-lg, 16px);
    overflow: hidden;
    background: linear-gradient(135deg, #0a0a14 0%, #1a1a2e 100%);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

.hero-image[b-3fw2yma61o] {
    width: 100%;
    height: 100%;
    /* Use contain to show full vehicle image without cropping */
    object-fit: contain;
    object-position: center;
}

.hero-placeholder[b-3fw2yma61o] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--kiosk-primary) 0%, var(--kiosk-secondary, #6366f1) 100%);
}

.hero-placeholder i[b-3fw2yma61o] {
    font-size: 3rem;
    color: rgba(255, 255, 255, 0.3);
}

.hero-overlay[b-3fw2yma61o] {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.5) 50%, transparent 80%);
    display: flex;
    align-items: flex-end;
    padding: 16px 20px;
}

.hero-content[b-3fw2yma61o] {
    color: white;
}

.hero-label[b-3fw2yma61o] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    opacity: 0.7;
    margin-bottom: 2px;
    display: block;
}

.hero-title[b-3fw2yma61o] {
    font-size: 1.4rem;
    font-weight: 700;
    margin: 0 0 2px 0;
    line-height: 1.2;
}

.hero-subtitle[b-3fw2yma61o] {
    font-size: 0.8rem;
    margin: 0;
    opacity: 0.85;
}

/* Summary Cards - Clean, professional styling */
.summary-card[b-3fw2yma61o] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--kiosk-surface);
    border: 1px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius, 12px);
    transition: all 0.2s ease;
}

.summary-card.featured[b-3fw2yma61o] {
    background: linear-gradient(135deg, var(--kiosk-surface) 0%, rgba(59, 130, 246, 0.08) 100%);
    border-color: var(--kiosk-primary);
    box-shadow: 0 4px 20px rgba(59, 130, 246, 0.15);
}

.summary-card.package-card[b-3fw2yma61o] {
    padding: 14px 18px;
}

/* Card Icon */
.card-icon[b-3fw2yma61o] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--kiosk-surface-hover, rgba(255,255,255,0.08));
    border-radius: 10px;
}

.summary-card.featured .card-icon[b-3fw2yma61o] {
    background: var(--kiosk-primary);
}

.card-icon i[b-3fw2yma61o] {
    font-size: 1.1rem;
    color: var(--kiosk-text-muted);
}

.summary-card.featured .card-icon i[b-3fw2yma61o] {
    color: white;
}

/* Card Content */
.card-content[b-3fw2yma61o] {
    flex: 1;
    min-width: 0;
}

.card-label[b-3fw2yma61o] {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--kiosk-text-muted);
    margin-bottom: 1px;
    display: block;
}

.card-title[b-3fw2yma61o] {
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
    color: var(--kiosk-text);
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.card-description[b-3fw2yma61o] {
    font-size: 0.75rem;
    color: var(--kiosk-text-muted);
    margin: 2px 0 0 0;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.card-badge[b-3fw2yma61o] {
    display: inline-block;
    font-size: 0.6rem;
    font-weight: 600;
    padding: 2px 6px;
    background: var(--kiosk-primary);
    color: white;
    border-radius: 10px;
    margin-top: 2px;
}

.card-meta[b-3fw2yma61o] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 6px;
}

.meta-item[b-3fw2yma61o] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.75rem;
    color: var(--kiosk-text-muted);
}

.meta-item i[b-3fw2yma61o] {
    font-size: 0.85rem;
    color: var(--kiosk-primary);
}

/* Card Price */
.card-price[b-3fw2yma61o] {
    flex-shrink: 0;
    text-align: right;
}

.price-amount[b-3fw2yma61o] {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--kiosk-success, #22c55e);
}

/* Card Thumbnail - for game icon etc */
.card-thumbnail[b-3fw2yma61o] {
    flex-shrink: 0;
    width: 56px;
    height: 42px;
    border-radius: 8px;
    overflow: hidden;
    background: var(--kiosk-surface-hover);
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-thumbnail img[b-3fw2yma61o] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Track thumbnail - square images (200x200), use cover for square container */
.card-thumbnail.track-thumbnail[b-3fw2yma61o] {
    width: 56px;
    height: 56px;
    background: linear-gradient(135deg, #0a0a14 0%, #1a1a2e 100%);
}

.card-thumbnail.track-thumbnail img[b-3fw2yma61o] {
    object-fit: cover;
}

/* Footer Total - Professional styling */
.summary-total[b-3fw2yma61o] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 20px;
    background: var(--kiosk-surface);
    border-radius: var(--kiosk-radius);
    border: 1px solid var(--kiosk-border);
}

.total-label[b-3fw2yma61o] {
    font-size: 0.9rem;
    color: var(--kiosk-text-muted);
    font-weight: 500;
}

.total-amount[b-3fw2yma61o] {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--kiosk-success, #22c55e);
}

/* Responsive - Portrait/smaller screens */
@media (max-width: 900px), (max-height: 700px) {
    .summary-main-content[b-3fw2yma61o] {
        padding: 12px 20px;
        overflow-y: auto;
        justify-content: flex-start;
    }
    
    .summary-layout[b-3fw2yma61o] {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    
    .hero-image-container[b-3fw2yma61o] {
        aspect-ratio: 4 / 1;
    }
    
    .hero-title[b-3fw2yma61o] {
        font-size: 1.2rem;
    }
    
    .summary-card[b-3fw2yma61o] {
        padding: 10px 14px;
    }
    
    .card-icon[b-3fw2yma61o] {
        width: 36px;
        height: 36px;
    }
    
    .card-thumbnail.track-thumbnail[b-3fw2yma61o] {
        width: 48px;
        height: 48px;
    }
    
    .total-amount[b-3fw2yma61o] {
        font-size: 1.4rem;
    }
}

/* Large widescreen */
@media (min-width: 1400px) and (min-height: 900px) {
    .summary-main-content[b-3fw2yma61o] {
        padding: 24px 64px;
    }
    
    .summary-layout[b-3fw2yma61o] {
        gap: 32px;
        max-width: 1400px;
    }
    
    .hero-image-container[b-3fw2yma61o] {
        aspect-ratio: 3.5 / 1;
    }
    
    .hero-title[b-3fw2yma61o] {
        font-size: 1.6rem;
    }
    
    .card-title[b-3fw2yma61o] {
        font-size: 1.1rem;
    }
    
    .price-amount[b-3fw2yma61o] {
        font-size: 1.5rem;
    }
    
    .total-amount[b-3fw2yma61o] {
        font-size: 2rem;
    }
    
    .card-thumbnail.track-thumbnail[b-3fw2yma61o] {
        width: 64px;
        height: 64px;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskSessionTypeSelection.razor.rz.scp.css */
/* KioskSessionTypeSelection.razor.css */

.kiosk-session-type-selection[b-6hqe3djjaw] {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 24px;
    gap: 24px;
}

/* Header */
.kiosk-header[b-6hqe3djjaw] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--kiosk-border, rgba(255,255,255,0.1));
}

.kiosk-back-btn[b-6hqe3djjaw] {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--kiosk-surface, #1e1e2e);
    border: 1px solid var(--kiosk-border, rgba(255,255,255,0.1));
    border-radius: 12px;
    color: var(--kiosk-text, #fff);
    font-size: 1.5rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.kiosk-back-btn:hover[b-6hqe3djjaw] {
    background: var(--kiosk-surface-hover, #2a2a3e);
    transform: scale(1.05);
}

.header-content[b-6hqe3djjaw] {
    flex: 1;
}

.kiosk-title[b-6hqe3djjaw] {
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    color: var(--kiosk-text, #fff);
}

.kiosk-subtitle[b-6hqe3djjaw] {
    font-size: 1rem;
    color: var(--kiosk-text-muted, rgba(255,255,255,0.6));
    margin: 4px 0 0 0;
}

.step-indicator[b-6hqe3djjaw] {
    font-size: 0.875rem;
    color: var(--kiosk-text-muted, rgba(255,255,255,0.6));
    background: var(--kiosk-surface, #1e1e2e);
    padding: 8px 16px;
    border-radius: 20px;
}

/* Content Area */
.kiosk-content-area[b-6hqe3djjaw] {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

/* Loading */
.loading-container[b-6hqe3djjaw] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    color: var(--kiosk-text-muted, rgba(255,255,255,0.6));
}

.kiosk-spinner[b-6hqe3djjaw] {
    width: 48px;
    height: 48px;
    border: 4px solid var(--kiosk-surface, #1e1e2e);
    border-top-color: var(--kiosk-primary, #3b82f6);
    border-radius: 50%;
    animation: spin-b-6hqe3djjaw 1s linear infinite;
}

@keyframes spin-b-6hqe3djjaw {
    to { transform: rotate(360deg); }
}

/* Empty State */
.empty-state[b-6hqe3djjaw] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    text-align: center;
    color: var(--kiosk-text-muted, rgba(255,255,255,0.6));
}

.empty-state i[b-6hqe3djjaw] {
    font-size: 4rem;
    opacity: 0.5;
}

.empty-state h2[b-6hqe3djjaw] {
    margin: 0;
    font-size: 1.5rem;
    color: var(--kiosk-text, #fff);
}

.empty-state p[b-6hqe3djjaw] {
    margin: 0;
}

/* Session Type Grid */
.session-type-grid[b-6hqe3djjaw] {
    display: grid;
    gap: 24px;
    padding: 8px;
}

.session-type-grid.single-tile[b-6hqe3djjaw] {
    grid-template-columns: 1fr;
    max-width: 500px;
    margin: 0 auto;
}

.session-type-grid.two-tiles[b-6hqe3djjaw] {
    grid-template-columns: repeat(2, 1fr);
}

.session-type-grid.three-tiles[b-6hqe3djjaw] {
    grid-template-columns: repeat(3, 1fr);
}

.session-type-grid.multi-tiles[b-6hqe3djjaw] {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

/* Session Type Tile */
.session-type-tile[b-6hqe3djjaw] {
    display: flex;
    flex-direction: column;
    background: var(--kiosk-surface, #1e1e2e);
    border: 2px solid var(--kiosk-border, rgba(255,255,255,0.1));
    border-radius: 16px;
    padding: 24px;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    min-height: 200px;
}

.session-type-tile:hover:not(.unavailable)[b-6hqe3djjaw] {
    border-color: var(--kiosk-primary, #3b82f6);
    transform: translateY(-4px);
    box-shadow: 0 12px 40px rgba(59, 130, 246, 0.2);
}

.session-type-tile.selected[b-6hqe3djjaw] {
    border-color: var(--kiosk-primary, #3b82f6);
    background: linear-gradient(135deg, 
        rgba(59, 130, 246, 0.15), 
        rgba(139, 92, 246, 0.15));
}

.session-type-tile.unavailable[b-6hqe3djjaw] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Tile Icon */
.tile-icon[b-6hqe3djjaw] {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--kiosk-primary, #3b82f6), var(--kiosk-secondary, #8b5cf6));
    border-radius: 20px;
    margin-bottom: 16px;
}

.tile-icon i[b-6hqe3djjaw] {
    font-size: 2.5rem;
    color: white;
}

.tile-icon img[b-6hqe3djjaw] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
}

/* Tile Content */
.tile-content[b-6hqe3djjaw] {
    flex: 1;
}

.tile-name[b-6hqe3djjaw] {
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 0 8px 0;
    color: var(--kiosk-text, #fff);
}

.tile-description[b-6hqe3djjaw] {
    font-size: 0.9rem;
    color: var(--kiosk-text-muted, rgba(255,255,255,0.6));
    margin: 0;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Tile Availability */
.tile-availability[b-6hqe3djjaw] {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--kiosk-border, rgba(255,255,255,0.1));
}

.tile-availability span[b-6hqe3djjaw] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.875rem;
}

.tile-availability .available[b-6hqe3djjaw] {
    color: var(--kiosk-success, #22c55e);
}

.tile-availability .unavailable[b-6hqe3djjaw] {
    color: var(--kiosk-text-muted, rgba(255,255,255,0.5));
}

/* Select Indicator */
.tile-select-indicator[b-6hqe3djjaw] {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--kiosk-primary, #3b82f6);
    border-radius: 50%;
    color: white;
    opacity: 0;
    transition: all 0.3s ease;
}

.session-type-tile:hover:not(.unavailable) .tile-select-indicator[b-6hqe3djjaw] {
    opacity: 1;
}

.session-type-tile.selected .tile-select-indicator[b-6hqe3djjaw] {
    opacity: 1;
    background: var(--kiosk-success, #22c55e);
}

/* Responsive */
@media (max-width: 768px) {
    .session-type-grid.two-tiles[b-6hqe3djjaw],
    .session-type-grid.three-tiles[b-6hqe3djjaw] {
        grid-template-columns: 1fr;
    }
    
    .kiosk-title[b-6hqe3djjaw] {
        font-size: 1.5rem;
    }
    
    .session-type-tile[b-6hqe3djjaw] {
        min-height: auto;
        padding: 20px;
    }
    
    .tile-icon[b-6hqe3djjaw] {
        width: 60px;
        height: 60px;
        border-radius: 16px;
    }
    
    .tile-icon i[b-6hqe3djjaw] {
        font-size: 1.75rem;
    }
    
    .tile-name[b-6hqe3djjaw] {
        font-size: 1.25rem;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskShared.razor.rz.scp.css */
/* Shared kiosk selection screen styles */

[b-9mx9zihhc8] .kiosk-selection-screen {
    flex: 1;
    display: flex;
    flex-direction: column;
}

[b-9mx9zihhc8] .placeholder-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    text-align: center;
    padding: 40px;
}

[b-9mx9zihhc8] .placeholder-content > i {
    font-size: 4rem;
    color: var(--kiosk-primary);
    opacity: 0.7;
}

[b-9mx9zihhc8] .placeholder-content h3 {
    font-size: 1.5rem;
    margin: 0;
}

[b-9mx9zihhc8] .placeholder-content p {
    color: var(--kiosk-text-muted);
    margin: 0;
}

[b-9mx9zihhc8] .placeholder-content .hint {
    font-size: 0.875rem;
    opacity: 0.7;
}

[b-9mx9zihhc8] .placeholder-content .amount {
    font-size: 2rem;
    font-weight: 700;
    color: var(--kiosk-primary);
}

[b-9mx9zihhc8] .placeholder-content .kiosk-btn {
    margin-top: 24px;
    max-width: 300px;
}

[b-9mx9zihhc8] .payment-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 24px;
    width: 100%;
    max-width: 300px;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskSimulatorSelection.razor.rz.scp.css */
/* KioskSimulatorSelection.razor.css */

/* Loading state */
.kiosk-loading[b-siel01v3lk] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 24px;
}

.kiosk-spinner.large[b-siel01v3lk] {
    width: 48px;
    height: 48px;
    border-width: 4px;
}

.kiosk-loading p[b-siel01v3lk] {
    color: var(--kiosk-text-muted);
    font-size: 1rem;
}

/* Empty state */
.kiosk-empty-state[b-siel01v3lk] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    text-align: center;
    padding: 40px;
}

.kiosk-empty-state i[b-siel01v3lk] {
    font-size: 4rem;
    color: var(--kiosk-text-muted);
    opacity: 0.5;
}

.kiosk-empty-state h3[b-siel01v3lk] {
    font-size: 1.5rem;
    margin: 0;
}

.kiosk-empty-state p[b-siel01v3lk] {
    color: var(--kiosk-text-muted);
    margin: 0;
}

/* Simulator grid */
.simulator-grid[b-siel01v3lk] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    flex: 1;
    align-content: start;
    padding: 24px;
}

.simulator-card[b-siel01v3lk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 24px;
    background: var(--kiosk-surface);
    border: 2px solid var(--kiosk-border);
    border-radius: var(--kiosk-radius);
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
}

.simulator-card:hover:not(:disabled)[b-siel01v3lk] {
    background: var(--kiosk-surface-hover);
}

.simulator-card.selected[b-siel01v3lk] {
    border-color: var(--kiosk-primary);
    background: rgba(59, 130, 246, 0.1);
}

.simulator-card.unavailable[b-siel01v3lk] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Offline simulator card */
.simulator-card.offline[b-siel01v3lk] {
    opacity: 0.6;
    cursor: not-allowed;
    background: rgba(100, 116, 139, 0.1);
    border-color: var(--kiosk-text-dim);
}

.sim-icon[b-siel01v3lk] {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--kiosk-surface-hover);
    border-radius: 16px;
    position: relative;
}

.simulator-card.selected .sim-icon[b-siel01v3lk] {
    background: var(--kiosk-primary);
}

.sim-icon i[b-siel01v3lk] {
    font-size: 2rem;
    color: var(--kiosk-text);
}

.simulator-card.selected .sim-icon i[b-siel01v3lk] {
    color: white;
}

/* Offline overlay on icon */
.offline-overlay[b-siel01v3lk] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 16px;
}

.offline-overlay i[b-siel01v3lk] {
    font-size: 1.5rem;
    color: var(--kiosk-error, #ef4444);
}

.sim-info[b-siel01v3lk] {
    text-align: center;
}

/* Fix: Ensure simulator name and status text are readable (white) */
.sim-info h4[b-siel01v3lk] {
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0 0 4px 0;
    color: var(--kiosk-text, #f8fafc);
}

.sim-status[b-siel01v3lk] {
    font-size: 0.875rem;
    font-weight: 500;
}

.sim-status.available[b-siel01v3lk] {
    color: var(--kiosk-success);
}

.sim-status.in-use[b-siel01v3lk] {
    color: var(--kiosk-warning);
}

/* Fix: Offline status text should be clearly visible */
.sim-status.offline[b-siel01v3lk] {
    color: var(--kiosk-error, #ef4444);
}

.selected-badge[b-siel01v3lk] {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--kiosk-primary);
    border-radius: 50%;
}

.selected-badge i[b-siel01v3lk] {
    color: white;
    font-size: 1rem;
}

/* Selection summary */
.selection-summary[b-siel01v3lk] {
    padding: 16px;
    text-align: center;
    color: var(--kiosk-primary);
    font-weight: 500;
}

/* Actions */
.kiosk-form-actions[b-siel01v3lk] {
    padding-top: 24px;
    border-top: 1px solid var(--kiosk-border);
    margin-top: auto;
}

/* Fix: Warning alert - centered with proper padding */
.kiosk-alert[b-siel01v3lk] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 16px 24px;
    margin: 0 24px 16px 24px;
    border-radius: var(--kiosk-radius, 12px);
    text-align: center;
}

.kiosk-alert.warning[b-siel01v3lk] {
    background: rgba(245, 158, 11, 0.15);
    border: 1px solid rgba(245, 158, 11, 0.3);
    color: var(--kiosk-warning, #f59e0b);
}

.kiosk-alert.warning i[b-siel01v3lk] {
    font-size: 1.5rem;
    flex-shrink: 0;
}

.kiosk-alert.warning span[b-siel01v3lk] {
    font-size: 1rem;
    font-weight: 500;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskTimeoutOverlay.razor.rz.scp.css */
/* KioskTimeoutOverlay.razor.css */

.kiosk-timeout-overlay[b-nv45m5qko3] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.9);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    animation: fadeIn-b-nv45m5qko3 0.3s ease;
}

@keyframes fadeIn-b-nv45m5qko3 {
    from { opacity: 0; }
    to { opacity: 1; }
}

.timeout-content[b-nv45m5qko3] {
    text-align: center;
    padding: 48px;
    max-width: 400px;
}

.timeout-icon[b-nv45m5qko3] {
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--kiosk-warning);
    border-radius: 50%;
    margin: 0 auto 24px;
    animation: pulse-b-nv45m5qko3 1s ease-in-out infinite;
}

.timeout-icon i[b-nv45m5qko3] {
    font-size: 3rem;
    color: white;
}

@keyframes pulse-b-nv45m5qko3 {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

.timeout-content h2[b-nv45m5qko3] {
    font-size: 1.75rem;
    font-weight: 600;
    margin: 0 0 8px 0;
    color: var(--kiosk-text, #ffffff);
}

.timeout-content p[b-nv45m5qko3] {
    font-size: 1rem;
    color: var(--kiosk-text-muted, #a0a0a0);
    margin: 0;
}

.countdown[b-nv45m5qko3] {
    font-size: 5rem;
    font-weight: 700;
    color: var(--kiosk-warning, #f59e0b);
    line-height: 1;
    margin: 16px 0 0;
}

.countdown-label[b-nv45m5qko3] {
    font-size: 1rem;
    color: var(--kiosk-text-muted, #a0a0a0);
    margin: 0 0 52px 0; /* Increased from 32px to 52px (added 20px) */
}

.timeout-content .kiosk-btn[b-nv45m5qko3] {
    max-width: 280px;
    margin: 0 auto;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskTrackSelection.razor.rz.scp.css */
/* 
 * KioskTrackSelection.razor.css
 * Track selection screen styles.
 */

.kiosk-selection-screen[b-38xv91cvbw] {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0; /* Important for flex child scrolling */
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskVehicleSelection.razor.rz.scp.css */
/* 
 * KioskVehicleSelection.razor.css
 * Vehicle selection screen styles.
 */

.kiosk-selection-screen[b-mxfc7ujcu6] {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0; /* Important for flex child scrolling */
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskWaiver.razor.rz.scp.css */
/* KioskWaiver.razor.css */

.kiosk-waiver[b-9acp076dkh] {
    flex: 1;
    display: flex;
    flex-direction: column;
    max-width: 800px;
    margin: 0 auto;
    width: 100%;
    padding: 16px;
    min-height: 0;
}

.kiosk-waiver > .kiosk-screen-header[b-9acp076dkh] {
    flex-shrink: 0;
}

.waiver-loading[b-9acp076dkh],
.waiver-error[b-9acp076dkh],
.waiver-not-required[b-9acp076dkh],
.waiver-already-signed[b-9acp076dkh] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    text-align: center;
    padding: 48px;
}

.waiver-loading .spinner[b-9acp076dkh],
.waiver-error i[b-9acp076dkh],
.waiver-not-required i[b-9acp076dkh],
.waiver-already-signed i[b-9acp076dkh] {
    font-size: 3rem;
    color: var(--kiosk-primary);
}

.waiver-error i[b-9acp076dkh] {
    color: var(--kiosk-warning);
}

.waiver-already-signed i[b-9acp076dkh] {
    color: var(--kiosk-success);
}

.waiver-content[b-9acp076dkh] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
    overflow-y: auto;
    padding-bottom: 16px;
}

.waiver-text[b-9acp076dkh] {
    flex-shrink: 0;
    background: var(--kiosk-surface);
    border-radius: var(--kiosk-radius);
    padding: 24px;
    border: 1px solid var(--kiosk-border);
}

.waiver-text h3[b-9acp076dkh] {
    flex-shrink: 0;
    font-size: 1.25rem;
    margin: 0 0 8px 0;
}

.waiver-subtitle[b-9acp076dkh] {
    flex-shrink: 0;
    color: var(--kiosk-text-muted);
    margin: 0 0 16px 0;
}

.waiver-scroll-area[b-9acp076dkh] {
    max-height: 40vh;
    overflow-y: auto;
    padding-right: 16px;
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--kiosk-text);
}

.waiver-scroll-area p[b-9acp076dkh] {
    margin: 0 0 16px 0;
}

.waiver-scroll-area[b-9acp076dkh]::-webkit-scrollbar {
    width: 6px;
}

.waiver-scroll-area[b-9acp076dkh]::-webkit-scrollbar-thumb {
    background: var(--kiosk-border);
    border-radius: 3px;
}

/* Signature Section */
/* Signature Section */
.signature-section[b-9acp076dkh] {
    flex-shrink: 0;
    background: var(--kiosk-surface);
    border-radius: var(--kiosk-radius);
    padding: 20px;
    border: 1px solid var(--kiosk-border);
}

.signature-section h4[b-9acp076dkh] {
    font-size: 1.1rem;
    margin: 0 0 4px 0;
}

.signature-instructions[b-9acp076dkh] {
    color: var(--kiosk-text-muted);
    font-size: 0.9rem;
    margin: 0 0 12px 0;
}

.signature-container[b-9acp076dkh] {
    background: #ffffff;
    border: 2px solid var(--kiosk-border);
    border-radius: 8px;
    overflow: hidden;
    height: 150px;
}

.signature-container[b-9acp076dkh]  .e-signature {
    width: 100% !important;
    height: 100% !important;
}

.signature-actions[b-9acp076dkh] {
    display: flex;
    justify-content: flex-end;
    margin-top: 12px;
}

.kiosk-btn-sm[b-9acp076dkh] {
    padding: 8px 16px;
    font-size: 0.9rem;
}

/* Checkbox */
.waiver-agreement[b-9acp076dkh] {
    flex-shrink: 0;
}

.kiosk-checkbox[b-9acp076dkh] {
    display: flex;
    align-items: center;
    gap: 16px;
    cursor: pointer;
    padding: 16px 20px;
    background: var(--kiosk-surface);
    border-radius: var(--kiosk-radius);
    border: 2px solid var(--kiosk-border);
    transition: border-color 0.2s;
}

.kiosk-checkbox:has(input:checked)[b-9acp076dkh] {
    border-color: var(--kiosk-primary);
}

.kiosk-checkbox input[b-9acp076dkh] {
    display: none;
}

.checkbox-mark[b-9acp076dkh] {
    width: 32px;
    height: 32px;
    border: 2px solid var(--kiosk-border);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all 0.2s;
}

.kiosk-checkbox input:checked + .checkbox-mark[b-9acp076dkh] {
    background: var(--kiosk-primary);
    border-color: var(--kiosk-primary);
}

.kiosk-checkbox input:checked + .checkbox-mark[b-9acp076dkh]::after {
    content: '\2713'; /* Unicode checkmark ? */
    color: white;
    font-size: 1.25rem;
    font-weight: bold;
}

.checkbox-label[b-9acp076dkh] {
    font-size: 1rem;
    color: var(--kiosk-text);
}

/* Spinner for signing */
.spinner-border-sm[b-9acp076dkh] {
    width: 1rem;
    height: 1rem;
    border-width: 2px;
}

/* Submit button - must never be pushed offscreen */
.waiver-content > .kiosk-btn-primary[b-9acp076dkh] {
    flex-shrink: 0;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/KioskWelcome.razor.rz.scp.css */
/* KioskWelcome.razor.css */

.kiosk-welcome[b-u93xsceryf] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 40px;
    gap: 48px;
}

.welcome-header[b-u93xsceryf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.logo-area[b-u93xsceryf] {
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--kiosk-primary), var(--kiosk-secondary));
    border-radius: 24px;
    margin-bottom: 16px;
}

.logo-area i[b-u93xsceryf] {
    font-size: 4rem;
    color: white;
}

.welcome-title[b-u93xsceryf] {
    font-size: 1.5rem;
    font-weight: 400;
    color: var(--kiosk-text-muted);
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.2em;
}

.sim-center-name[b-u93xsceryf] {
    font-size: 3rem;
    font-weight: 700;
    margin: 0;
    background: linear-gradient(135deg, var(--kiosk-primary), var(--kiosk-secondary));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.welcome-actions[b-u93xsceryf] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    max-width: 400px;
}

/* ===== Kiosk Button Styles ===== */
.kiosk-btn[b-u93xsceryf] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
    min-height: var(--kiosk-button-height, 56px);
    padding: 16px 24px;
    border: none;
    border-radius: var(--kiosk-radius, 12px);
    font-size: 1.125rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    touch-action: manipulation;
}

.kiosk-btn i[b-u93xsceryf] {
    font-size: 1.5rem;
}

.kiosk-btn-primary[b-u93xsceryf] {
    background: linear-gradient(135deg, var(--kiosk-primary), var(--kiosk-secondary));
    color: white;
}

.kiosk-btn-primary:hover[b-u93xsceryf],
.kiosk-btn-primary:active[b-u93xsceryf] {
    transform: scale(1.02);
    box-shadow: 0 8px 24px rgba(59, 130, 246, 0.4);
}

.kiosk-btn-secondary[b-u93xsceryf] {
    background: var(--kiosk-surface);
    color: var(--kiosk-text);
    border: 2px solid var(--kiosk-primary);
}

.kiosk-btn-secondary:hover[b-u93xsceryf],
.kiosk-btn-secondary:active[b-u93xsceryf] {
    background: var(--kiosk-surface-hover);
}

.kiosk-btn-outline[b-u93xsceryf] {
    background: transparent;
    color: var(--kiosk-text-muted);
    border: 2px solid var(--kiosk-border);
}

.kiosk-btn-outline:hover[b-u93xsceryf],
.kiosk-btn-outline:active[b-u93xsceryf] {
    background: var(--kiosk-surface);
    color: var(--kiosk-text);
    border-color: var(--kiosk-text-muted);
}

.welcome-footer[b-u93xsceryf] {
    margin-top: auto;
}

.tap-instruction[b-u93xsceryf] {
    font-size: 0.875rem;
    color: var(--kiosk-text-muted);
    margin: 0;
    animation: pulse-b-u93xsceryf 2s ease-in-out infinite;
}

@keyframes pulse-b-u93xsceryf {
    0%, 100% { opacity: 0.5; }
    50% { opacity: 1; }
}

/* Responsive */
@media (max-width: 480px) {
    .kiosk-welcome[b-u93xsceryf] {
        padding: 24px;
        gap: 32px;
    }
    
    .logo-area[b-u93xsceryf] {
        width: 80px;
        height: 80px;
        border-radius: 16px;
    }
    
    .logo-area i[b-u93xsceryf] {
        font-size: 2.5rem;
    }
    
    .sim-center-name[b-u93xsceryf] {
        font-size: 2rem;
    }
    
    .welcome-title[b-u93xsceryf] {
        font-size: 1rem;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/Shared/KioskFooter.razor.rz.scp.css */
/* 
 * KioskFooter.razor.css
 * Footer styles for kiosk screens.
 */

.kiosk-footer[b-sjwiabytgf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 24px;
    background: rgba(0, 0, 0, 0.4);
    border-top: 1px solid var(--kiosk-border, rgba(255, 255, 255, 0.08));
    min-height: 72px;
    backdrop-filter: blur(10px);
    gap: 16px;
}

.footer-left[b-sjwiabytgf] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
}

.footer-center[b-sjwiabytgf] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer-right[b-sjwiabytgf] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 12px;
}

.powered-by[b-sjwiabytgf] {
    font-size: 0.75rem;
    color: var(--kiosk-text-dim, #64748b);
    letter-spacing: 0.02em;
}

/* Selection info in footer */
[b-sjwiabytgf] .footer-selection-info {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: var(--kiosk-surface, #13132a);
    border-radius: var(--kiosk-radius, 12px);
    border: 1px solid var(--kiosk-border, rgba(255, 255, 255, 0.08));
}

[b-sjwiabytgf] .selected-label {
    font-size: 0.875rem;
    color: var(--kiosk-text-muted, #94a3b8);
}

[b-sjwiabytgf] .selected-value {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--kiosk-primary, #3b82f6);
}

/* Continue button in footer */
[b-sjwiabytgf] .kiosk-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: 160px;
    min-height: var(--kiosk-button-height, 56px);
    padding: 14px 28px;
    border: none;
    border-radius: var(--kiosk-radius, 12px);
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    touch-action: manipulation;
}

[b-sjwiabytgf] .kiosk-btn i {
    font-size: 1.25rem;
}

[b-sjwiabytgf] .kiosk-btn-primary {
    background: linear-gradient(135deg, var(--kiosk-primary, #3b82f6), var(--kiosk-secondary, #8b5cf6));
    color: white;
    box-shadow: 0 4px 16px rgba(59, 130, 246, 0.3);
}

[b-sjwiabytgf] .kiosk-btn-primary:hover:not(:disabled),
[b-sjwiabytgf] .kiosk-btn-primary:focus-visible:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(59, 130, 246, 0.4);
}

[b-sjwiabytgf] .kiosk-btn-primary:active:not(:disabled) {
    transform: translateY(0) scale(0.98);
}

[b-sjwiabytgf] .kiosk-btn-primary:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

[b-sjwiabytgf] .kiosk-btn-secondary {
    background: var(--kiosk-surface, #13132a);
    color: var(--kiosk-text, #f8fafc);
    border: 2px solid var(--kiosk-border, rgba(255, 255, 255, 0.08));
}

[b-sjwiabytgf] .kiosk-btn-secondary:hover:not(:disabled),
[b-sjwiabytgf] .kiosk-btn-secondary:focus-visible:not(:disabled) {
    background: var(--kiosk-surface-hover, #1a1a3a);
    border-color: var(--kiosk-primary, #3b82f6);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .kiosk-footer[b-sjwiabytgf] {
        padding: 12px 16px;
        min-height: 64px;
    }
    
    .footer-left[b-sjwiabytgf] {
        display: none;
    }
    
    .footer-center[b-sjwiabytgf] {
        flex: 1;
        justify-content: flex-start;
    }
    
    [b-sjwiabytgf] .kiosk-btn {
        min-width: auto;
        min-height: 48px;
        padding: 12px 20px;
        font-size: 0.9rem;
    }
    
    [b-sjwiabytgf] .footer-selection-info {
        padding: 6px 12px;
    }
    
    [b-sjwiabytgf] .selected-label,
    [b-sjwiabytgf] .selected-value {
        font-size: 0.8rem;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/Shared/KioskHeader.razor.rz.scp.css */
/* 
 * KioskHeader.razor.css
 * Header styles for kiosk screens.
 */

.kiosk-header[b-qytwu4q9sv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    background: rgba(0, 0, 0, 0.3);
    border-bottom: 1px solid var(--kiosk-border, rgba(255, 255, 255, 0.08));
    min-height: 80px;
    backdrop-filter: blur(10px);
}

.header-left[b-qytwu4q9sv],
.header-right[b-qytwu4q9sv] {
    flex: 0 0 auto;
    min-width: 120px;
}

.header-left[b-qytwu4q9sv] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.header-right[b-qytwu4q9sv] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.header-center[b-qytwu4q9sv] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    text-align: center;
}

.header-icon[b-qytwu4q9sv] {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--kiosk-primary, #3b82f6), var(--kiosk-secondary, #8b5cf6));
    border-radius: 12px;
}

.header-icon i[b-qytwu4q9sv] {
    font-size: 1.5rem;
    color: white;
}

.header-titles[b-qytwu4q9sv] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.screen-title[b-qytwu4q9sv] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--kiosk-text, #f8fafc);
    line-height: 1.2;
}

.screen-subtitle[b-qytwu4q9sv] {
    margin: 0;
    font-size: 0.9rem;
    color: var(--kiosk-text-muted, #94a3b8);
}

/* Back button */
.kiosk-back-btn[b-qytwu4q9sv] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    background: var(--kiosk-surface, #13132a);
    border: 1px solid var(--kiosk-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--kiosk-radius, 12px);
    color: var(--kiosk-text, #f8fafc);
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    touch-action: manipulation;
}

.kiosk-back-btn:hover[b-qytwu4q9sv],
.kiosk-back-btn:focus-visible[b-qytwu4q9sv] {
    background: var(--kiosk-surface-hover, #1a1a3a);
    border-color: var(--kiosk-primary, #3b82f6);
    color: var(--kiosk-primary, #3b82f6);
}

.kiosk-back-btn:active[b-qytwu4q9sv] {
    transform: scale(0.98);
}

.kiosk-back-btn i[b-qytwu4q9sv] {
    font-size: 1.25rem;
}

.back-text[b-qytwu4q9sv] {
    display: inline;
}

/* Step indicator */
.step-indicator[b-qytwu4q9sv] {
    padding: 8px 16px;
    background: var(--kiosk-surface, #13132a);
    border: 1px solid var(--kiosk-border, rgba(255, 255, 255, 0.08));
    border-radius: 20px;
}

.step-text[b-qytwu4q9sv] {
    font-size: 0.875rem;
    color: var(--kiosk-text-muted, #94a3b8);
    font-weight: 500;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .kiosk-header[b-qytwu4q9sv] {
        padding: 16px;
        min-height: 70px;
    }
    
    .header-left[b-qytwu4q9sv],
    .header-right[b-qytwu4q9sv] {
        min-width: 60px;
    }
    
    .screen-title[b-qytwu4q9sv] {
        font-size: 1.25rem;
    }
    
    .screen-subtitle[b-qytwu4q9sv] {
        font-size: 0.8rem;
    }
    
    .back-text[b-qytwu4q9sv] {
        display: none;
    }
    
    .kiosk-back-btn[b-qytwu4q9sv] {
        padding: 12px 14px;
    }
    
    .header-icon[b-qytwu4q9sv] {
        display: none;
    }
    
    .step-indicator[b-qytwu4q9sv] {
        padding: 6px 12px;
    }
    
    .step-text[b-qytwu4q9sv] {
        font-size: 0.75rem;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/Shared/KioskTile.razor.rz.scp.css */
/* 
 * KioskTile.razor.css
 * Touch-optimized tile component styles for kiosk displays.
 * 
 * Image handling:
 * - Track thumbnails: 200x200 (square) - use object-fit: cover
 * - Vehicle thumbnails: 72px tall, 179-260px wide (landscape ~3:1) - use object-fit: contain
 * - Medium images are too large for tiles, use thumbnails
 */

.kiosk-tile[b-ubbhv8oe6f] {
    background: #13132a;
    border: 2px solid transparent;
    border-radius: 12px;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    touch-action: manipulation;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    position: relative;
    display: flex;
    flex-direction: column;
    /* Fixed height ensures consistent tile sizing regardless of content */
    height: 280px;
    /* Fixed width to match grid */
    width: 100%;
}

.kiosk-tile:hover[b-ubbhv8oe6f],
.kiosk-tile:focus-visible[b-ubbhv8oe6f] {
    transform: translateY(-4px);
    border-color: #3b82f6;
    box-shadow: 
        0 12px 40px rgba(59, 130, 246, 0.25),
        0 0 0 1px rgba(59, 130, 246, 0.1);
}

.kiosk-tile:focus-visible[b-ubbhv8oe6f] {
    outline: none;
}

.kiosk-tile:active[b-ubbhv8oe6f] {
    transform: translateY(-2px) scale(0.98);
    transition: transform 0.1s ease;
}

.kiosk-tile.selected[b-ubbhv8oe6f] {
    border-color: #3b82f6;
    background: linear-gradient(135deg, 
        rgba(59, 130, 246, 0.15), 
        rgba(139, 92, 246, 0.1));
    box-shadow: 
        0 8px 32px rgba(59, 130, 246, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.kiosk-tile.disabled[b-ubbhv8oe6f] {
    opacity: 0.5;
    cursor: not-allowed;
    filter: grayscale(50%);
}

.kiosk-tile.disabled:hover[b-ubbhv8oe6f] {
    transform: none;
    border-color: transparent;
    box-shadow: none;
}

/* Tile Image Container - fixed height portion */
.tile-image-container[b-ubbhv8oe6f] {
    position: relative;
    width: 100%;
    height: 160px;
    flex-shrink: 0;
    overflow: hidden;
    /* Dark background visible around contained images */
    background: linear-gradient(135deg, #0a0a14 0%, #1a1a2e 100%);
    /* Center the image content */
    display: flex;
    align-items: center;
    justify-content: center;
}

.tile-image[b-ubbhv8oe6f] {
    /* Default: cover mode for square track images */
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Contained mode for landscape vehicle images (72px tall, ~200px wide) */
.tile-image.contained[b-ubbhv8oe6f] {
    object-fit: contain;
    /* Don't scale up - show at native size or smaller */
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}

.kiosk-tile:hover .tile-image[b-ubbhv8oe6f] {
    transform: scale(1.05);
}

.kiosk-tile:hover .tile-image.contained[b-ubbhv8oe6f] {
    transform: scale(1.08);
}

/* Placeholder Image */
.tile-placeholder-image[b-ubbhv8oe6f] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, 
        rgba(59, 130, 246, 0.08) 0%, 
        rgba(139, 92, 246, 0.08) 100%);
}

.tile-placeholder-image i[b-ubbhv8oe6f] {
    font-size: 3rem;
    color: #94a3b8;
    opacity: 0.5;
}

/* Selected Badge */
.tile-selected-badge[b-ubbhv8oe6f] {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 36px;
    height: 36px;
    background: linear-gradient(135deg, #3b82f6, #8b5cf6);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 16px rgba(59, 130, 246, 0.5);
    z-index: 2;
    animation: badge-pop-b-ubbhv8oe6f 0.35s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}

.tile-selected-badge i[b-ubbhv8oe6f] {
    color: white;
    font-size: 1.25rem;
    font-weight: bold;
}

@keyframes badge-pop-b-ubbhv8oe6f {
    0% { transform: scale(0) rotate(-45deg); opacity: 0; }
    50% { transform: scale(1.2) rotate(0deg); }
    100% { transform: scale(1) rotate(0deg); opacity: 1; }
}

/* Tile Badge */
.tile-badge[b-ubbhv8oe6f] {
    position: absolute;
    top: 12px;
    left: 12px;
    padding: 4px 10px;
    background: linear-gradient(135deg, #3b82f6, #8b5cf6);
    color: white;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 16px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    z-index: 2;
}

/* Tile Content - fills remaining space */
.tile-content[b-ubbhv8oe6f] {
    padding: 14px 16px 16px;
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.tile-title[b-ubbhv8oe6f] {
    margin: 0 0 6px 0;
    font-size: 1.05rem;
    font-weight: 600;
    color: #f8fafc;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tile-subtitle[b-ubbhv8oe6f] {
    margin: 0 0 6px 0;
    font-size: 0.85rem;
    color: #3b82f6;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tile-description[b-ubbhv8oe6f] {
    margin: 0;
    font-size: 0.8rem;
    color: #94a3b8;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Responsive tile sizing */
@media (max-width: 768px) {
    .kiosk-tile[b-ubbhv8oe6f] {
        height: 250px;
    }
    
    .tile-image-container[b-ubbhv8oe6f] {
        height: 140px;
    }
    
    .tile-content[b-ubbhv8oe6f] {
        padding: 12px 14px;
    }
    
    .tile-title[b-ubbhv8oe6f] {
        font-size: 0.95rem;
    }
    
    .tile-placeholder-image i[b-ubbhv8oe6f] {
        font-size: 2.5rem;
    }
}

@media (max-width: 500px) {
    .kiosk-tile[b-ubbhv8oe6f] {
        height: 220px;
    }
    
    .tile-image-container[b-ubbhv8oe6f] {
        height: 120px;
    }
    
    .tile-content[b-ubbhv8oe6f] {
        padding: 10px 12px;
    }
    
    .tile-title[b-ubbhv8oe6f] {
        font-size: 0.9rem;
        margin-bottom: 4px;
    }
    
    .tile-subtitle[b-ubbhv8oe6f],
    .tile-description[b-ubbhv8oe6f] {
        font-size: 0.75rem;
    }
    
    .tile-placeholder-image i[b-ubbhv8oe6f] {
        font-size: 2rem;
    }
    
    .tile-selected-badge[b-ubbhv8oe6f] {
        width: 28px;
        height: 28px;
        top: 8px;
        right: 8px;
    }
    
    .tile-selected-badge i[b-ubbhv8oe6f] {
        font-size: 1rem;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Components/Kiosk/Shared/KioskTileGrid.razor.rz.scp.css */
/* 
 * KioskTileGrid.razor.css
 * Responsive tile grid with touch scrolling for kiosk displays.
 * Uses FIXED tile widths to ensure consistent sizing.
 */

.kiosk-tile-grid-container[b-uq7ej19b85] {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    position: relative;
    min-height: 0;
}

.kiosk-tile-grid[b-uq7ej19b85] {
    display: grid;
    /* Fixed tile width of 280px - no stretching */
    grid-template-columns: repeat(auto-fill, 280px);
    /* Center the grid within the container */
    justify-content: center;
    gap: 24px;
    padding: 24px;
    overflow-y: auto;
    overflow-x: hidden;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    flex: 1;
    min-height: 0;
    touch-action: pan-y;
    overscroll-behavior: contain;
    /* CRITICAL: align-content start prevents grid from stretching items to fill space */
    align-content: start;
}

/* Visible scrollbar */
.kiosk-tile-grid[b-uq7ej19b85] {
    scrollbar-width: thin;
    scrollbar-color: rgba(59, 130, 246, 0.6) rgba(19, 19, 42, 0.3);
}

.kiosk-tile-grid[b-uq7ej19b85]::-webkit-scrollbar {
    width: 12px;
}

.kiosk-tile-grid[b-uq7ej19b85]::-webkit-scrollbar-track {
    background: rgba(19, 19, 42, 0.3);
    border-radius: 6px;
}

.kiosk-tile-grid[b-uq7ej19b85]::-webkit-scrollbar-thumb {
    background: rgba(59, 130, 246, 0.6);
    border-radius: 6px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.kiosk-tile-grid[b-uq7ej19b85]::-webkit-scrollbar-thumb:hover {
    background: rgba(59, 130, 246, 0.8);
    background-clip: padding-box;
}

/* Responsive grid columns - all use fixed widths */
@media (min-width: 1200px) {
    .kiosk-tile-grid[b-uq7ej19b85] {
        grid-template-columns: repeat(auto-fill, 300px);
        gap: 28px;
        padding: 28px;
    }
}

@media (min-width: 1600px) {
    .kiosk-tile-grid[b-uq7ej19b85] {
        grid-template-columns: repeat(4, 300px);
        gap: 32px;
        padding: 32px;
    }
}

@media (min-width: 1920px) {
    .kiosk-tile-grid[b-uq7ej19b85] {
        grid-template-columns: repeat(5, 300px);
    }
}

@media (max-width: 768px) {
    .kiosk-tile-grid[b-uq7ej19b85] {
        grid-template-columns: repeat(auto-fill, 220px);
        gap: 16px;
        padding: 16px;
    }
}

@media (max-width: 500px) {
    .kiosk-tile-grid[b-uq7ej19b85] {
        /* On very small screens, allow tiles to fill available space */
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
        padding: 12px;
    }
}

/* Skeleton Loading */
.kiosk-tile-skeleton[b-uq7ej19b85] {
    pointer-events: none;
}

.kiosk-tile-skeleton .skeleton-image[b-uq7ej19b85] {
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg,
        #13132a 0%,
        #1a1a3a 50%,
        #13132a 100%);
    background-size: 200% 100%;
    animation: shimmer-b-uq7ej19b85 1.5s infinite linear;
}

.kiosk-tile-skeleton .skeleton-text[b-uq7ej19b85] {
    background: linear-gradient(90deg,
        #1a1a3a 0%,
        rgba(255, 255, 255, 0.05) 50%,
        #1a1a3a 100%);
    background-size: 200% 100%;
    border-radius: 4px;
    animation: shimmer-b-uq7ej19b85 1.5s infinite linear;
}

.kiosk-tile-skeleton .skeleton-title[b-uq7ej19b85] { height: 20px; width: 80%; margin-bottom: 8px; }
.kiosk-tile-skeleton .skeleton-subtitle[b-uq7ej19b85] { height: 14px; width: 50%; margin-bottom: 8px; }
.kiosk-tile-skeleton .skeleton-description[b-uq7ej19b85] { height: 14px; width: 100%; }

@keyframes shimmer-b-uq7ej19b85 {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* Empty State */
.kiosk-empty-state[b-uq7ej19b85] {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 60px 40px;
    min-height: 300px;
}

.kiosk-empty-state .empty-icon[b-uq7ej19b85] {
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(139, 92, 246, 0.1));
    border-radius: 50%;
    margin-bottom: 24px;
}

.kiosk-empty-state .empty-icon i[b-uq7ej19b85] {
    font-size: 3rem;
    background: linear-gradient(135deg, #3b82f6, #8b5cf6);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    opacity: 0.7;
}

.kiosk-empty-state .empty-title[b-uq7ej19b85] {
    font-size: 1.4rem;
    font-weight: 600;
    color: #f8fafc;
    margin: 0 0 12px 0;
}

.kiosk-empty-state .empty-message[b-uq7ej19b85] {
    font-size: 1rem;
    color: #94a3b8;
    margin: 0 0 24px 0;
    max-width: 380px;
}

/* Scroll Indicator */
.kiosk-scroll-indicator[b-uq7ej19b85] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px;
    background: linear-gradient(to top, #0a0a14 0%, rgba(10, 10, 20, 0.85) 60%, transparent 100%);
    color: #94a3b8;
    font-size: 0.875rem;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.kiosk-scroll-indicator.hidden[b-uq7ej19b85] { opacity: 0; }

.kiosk-scroll-indicator i[b-uq7ej19b85] {
    font-size: 1.2rem;
    animation: bounce-arrow-b-uq7ej19b85 2s ease-in-out infinite;
}

@keyframes bounce-arrow-b-uq7ej19b85 {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(6px); }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Modules/SCM.Module.AdminShell/Components/Karting/KartingDriverCard.razor.rz.scp.css */
/* KartingDriverCard.razor.css - World-class driver status styling */

/* 
 * Design System:
 * - Uses CSS custom properties for theming
 * - Status-driven color coding (red ? yellow ? green progression)
 * - Smooth transitions for micro-interactions
 * - Touch-friendly sizing for kiosk/mobile
 */

.karting-driver-card[b-g88h0h5hbx] {
    display: flex;
    align-items: stretch;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 0.75rem;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    margin-bottom: 0.5rem;
    min-height: 72px;
}

.karting-driver-card:hover[b-g88h0h5hbx] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.karting-driver-card.compact[b-g88h0h5hbx] {
    min-height: 56px;
}

.karting-driver-card.expanded[b-g88h0h5hbx] {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

/* Status Rail - Visual status indicator on the left */
.driver-status-rail[b-g88h0h5hbx] {
    width: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    transition: all 0.3s ease;
}

.driver-status-rail .status-icon[b-g88h0h5hbx] {
    position: absolute;
    left: 10px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bs-body-bg, #fff);
    font-size: 0.75rem;
    z-index: 1;
}

.driver-status-rail.status-pending[b-g88h0h5hbx] {
    background: var(--bs-secondary, #6c757d);
}

.driver-status-rail.status-pending .status-icon[b-g88h0h5hbx] {
    color: var(--bs-secondary, #6c757d);
    border: 2px solid var(--bs-secondary, #6c757d);
}

.driver-status-rail.status-waiver-signed[b-g88h0h5hbx] {
    background: var(--bs-warning, #ffc107);
}

.driver-status-rail.status-waiver-signed .status-icon[b-g88h0h5hbx] {
    color: var(--bs-warning, #ffc107);
    border: 2px solid var(--bs-warning, #ffc107);
}

.driver-status-rail.status-checked-in[b-g88h0h5hbx] {
    background: var(--bs-info, #0dcaf0);
}

.driver-status-rail.status-checked-in .status-icon[b-g88h0h5hbx] {
    color: var(--bs-info, #0dcaf0);
    border: 2px solid var(--bs-info, #0dcaf0);
}

.driver-status-rail.status-ready[b-g88h0h5hbx] {
    background: var(--bs-success, #198754);
}

.driver-status-rail.status-ready .status-icon[b-g88h0h5hbx] {
    color: var(--bs-success, #198754);
    border: 2px solid var(--bs-success, #198754);
}

/* Main Content */
.driver-content[b-g88h0h5hbx] {
    flex: 1;
    padding: 0.75rem 0.75rem 0.75rem 2rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0;
}

.karting-driver-card.compact .driver-content[b-g88h0h5hbx] {
    padding: 0.5rem 0.5rem 0.5rem 2rem;
    gap: 0.375rem;
}

/* Header */
.driver-header[b-g88h0h5hbx] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
}

.driver-identity[b-g88h0h5hbx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
    flex: 1;
}

.driver-name[b-g88h0h5hbx] {
    font-weight: 600;
    font-size: 0.95rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.first-time-badge[b-g88h0h5hbx] {
    display: inline-flex;
    align-items: center;
    gap: 0.125rem;
    font-size: 0.65rem;
    padding: 0.125rem 0.375rem;
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    color: white;
    border-radius: 1rem;
    white-space: nowrap;
    animation: pulse-badge-b-g88h0h5hbx 2s infinite;
}

@keyframes pulse-badge-b-g88h0h5hbx {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

/* Kart Assignment Chip */
.kart-assignment[b-g88h0h5hbx] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.5rem;
    background: var(--kart-class-color, var(--bs-primary, #0d6efd));
    color: white;
    border-radius: 0.375rem;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.kart-number[b-g88h0h5hbx] {
    font-family: 'SF Mono', 'Monaco', monospace;
    font-size: 0.85rem;
}

.kart-class[b-g88h0h5hbx] {
    opacity: 0.9;
    font-weight: 500;
}

/* Status Checklist - Horizontal progress indicator */
.driver-checklist[b-g88h0h5hbx] {
    display: flex;
    align-items: center;
    gap: 0;
}

.check-item[b-g88h0h5hbx] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-radius: 0.375rem;
    font-size: 0.7rem;
    font-weight: 500;
    transition: all 0.2s ease;
}

.check-item i[b-g88h0h5hbx] {
    font-size: 0.8rem;
}

.check-item.pending[b-g88h0h5hbx] {
    background: var(--bs-tertiary-bg, #f8f9fa);
    color: var(--bs-secondary, #6c757d);
}

.check-item.current[b-g88h0h5hbx] {
    background: rgba(255, 193, 7, 0.15);
    color: var(--bs-warning, #b45309);
    animation: pulse-current-b-g88h0h5hbx 1.5s infinite;
}

@keyframes pulse-current-b-g88h0h5hbx {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.4); }
    50% { box-shadow: 0 0 0 4px rgba(255, 193, 7, 0); }
}

.check-item.completed[b-g88h0h5hbx] {
    background: rgba(25, 135, 84, 0.1);
    color: var(--bs-success, #198754);
}

.check-connector[b-g88h0h5hbx] {
    width: 16px;
    height: 2px;
    background: var(--bs-border-color, #dee2e6);
    transition: all 0.3s ease;
}

.check-connector.active[b-g88h0h5hbx] {
    background: var(--bs-success, #198754);
}

/* Details Section */
.driver-details[b-g88h0h5hbx] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transition: all 0.25s ease-out;
}

.driver-details.preview[b-g88h0h5hbx] {
    max-height: 60px;
    opacity: 0.8;
}

.driver-details.expanded[b-g88h0h5hbx] {
    max-height: 120px;
    opacity: 1;
}

.detail-row[b-g88h0h5hbx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.75rem;
    color: var(--bs-secondary, #6c757d);
}

.detail-row i[b-g88h0h5hbx] {
    font-size: 0.8rem;
    width: 16px;
}

.detail-value[b-g88h0h5hbx] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Action Buttons */
.driver-actions[b-g88h0h5hbx] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.5rem;
    border-left: 1px solid var(--bs-border-color, #dee2e6);
    background: var(--bs-tertiary-bg, #f8f9fa);
}

.action-btn[b-g88h0h5hbx] {
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 0.375rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.15s ease;
    font-size: 0.875rem;
}

.action-btn:hover[b-g88h0h5hbx] {
    transform: scale(1.1);
}

.action-btn:active[b-g88h0h5hbx] {
    transform: scale(0.95);
}

.action-btn.primary[b-g88h0h5hbx] {
    background: var(--bs-primary, #0d6efd);
    color: white;
}

.action-btn.primary:hover[b-g88h0h5hbx] {
    background: var(--bs-primary-shade, #0b5ed7);
}

.action-btn.success[b-g88h0h5hbx] {
    background: var(--bs-success, #198754);
    color: white;
}

.action-btn.success:hover[b-g88h0h5hbx] {
    background: #157347;
}

.action-btn.secondary[b-g88h0h5hbx] {
    background: transparent;
    color: var(--bs-secondary, #6c757d);
    border: 1px solid var(--bs-border-color, #dee2e6);
}

.action-btn.secondary:hover[b-g88h0h5hbx] {
    background: var(--bs-body-bg, #fff);
    color: var(--bs-body-color, #212529);
}

/* State Variations */
.karting-driver-card.ready-to-race[b-g88h0h5hbx] {
    background: linear-gradient(90deg, rgba(25, 135, 84, 0.05) 0%, transparent 100%);
    border-color: var(--bs-success, #198754);
}

.karting-driver-card.first-time[b-g88h0h5hbx] {
    position: relative;
}

.karting-driver-card.first-time[b-g88h0h5hbx]::after {
    content: '';
    position: absolute;
    top: -1px;
    right: -1px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 24px 24px 0;
    border-color: transparent #f59e0b transparent transparent;
    border-radius: 0 0.75rem 0 0;
}

/* Compact Mode Adjustments */
.karting-driver-card.compact .driver-checklist[b-g88h0h5hbx] {
    display: none;
}

.karting-driver-card.compact .driver-details[b-g88h0h5hbx] {
    display: none;
}

.karting-driver-card.compact .driver-actions[b-g88h0h5hbx] {
    flex-direction: row;
}

/* Dark Mode Support */
@media (prefers-color-scheme: dark) {
    .karting-driver-card[b-g88h0h5hbx] {
        background: var(--bs-dark, #212529);
        border-color: var(--bs-gray-700, #495057);
    }

    .karting-driver-card:hover[b-g88h0h5hbx] {
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
    }

    .driver-status-rail .status-icon[b-g88h0h5hbx] {
        background: var(--bs-dark, #212529);
    }

    .check-item.pending[b-g88h0h5hbx] {
        background: var(--bs-gray-800, #343a40);
    }

    .driver-actions[b-g88h0h5hbx] {
        background: var(--bs-gray-800, #343a40);
        border-color: var(--bs-gray-700, #495057);
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Modules/SCM.Module.AdminShell/Components/Karting/KartingHeatTimeline.razor.rz.scp.css */
/* KartingHeatTimeline.razor.css - Heat progression timeline styling */

/*
 * Timeline Design:
 * - Horizontal: For inline display in cards
 * - Vertical: For detailed views
 * - Real-time animations for active heats
 * - Color-coded status progression
 */

.karting-heat-timeline[b-pcvmc71v9h] {
    display: flex;
    align-items: flex-start;
    gap: 0;
    padding: 0.5rem 0;
}

.karting-heat-timeline.horizontal[b-pcvmc71v9h] {
    flex-direction: row;
    align-items: center;
}

.karting-heat-timeline.vertical[b-pcvmc71v9h] {
    flex-direction: column;
    align-items: flex-start;
}

/* Timeline Connector */
.timeline-connector[b-pcvmc71v9h] {
    position: relative;
    background: var(--bs-border-color, #dee2e6);
    transition: all 0.3s ease;
}

.karting-heat-timeline.horizontal .timeline-connector[b-pcvmc71v9h] {
    width: 24px;
    height: 3px;
    margin: 0 -1px;
}

.karting-heat-timeline.vertical .timeline-connector[b-pcvmc71v9h] {
    width: 3px;
    height: 24px;
    margin-left: 18px;
}

.timeline-connector.filled[b-pcvmc71v9h] {
    background: var(--bs-success, #198754);
}

.progress-pulse[b-pcvmc71v9h] {
    position: absolute;
    background: var(--bs-primary, #0d6efd);
    border-radius: 4px;
    animation: pulse-progress-b-pcvmc71v9h 1.5s ease-in-out infinite;
}

.karting-heat-timeline.horizontal .progress-pulse[b-pcvmc71v9h] {
    height: 100%;
    width: 50%;
    left: 0;
}

@keyframes pulse-progress-b-pcvmc71v9h {
    0% { transform: translateX(0); opacity: 1; }
    100% { transform: translateX(100%); opacity: 0; }
}

/* Heat Node */
.heat-node[b-pcvmc71v9h] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0.5rem;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: all 0.2s ease;
    background: transparent;
}

.heat-node:hover[b-pcvmc71v9h] {
    background: var(--bs-tertiary-bg, #f8f9fa);
}

.karting-heat-timeline.vertical .heat-node[b-pcvmc71v9h] {
    flex-direction: row;
    width: 100%;
}

/* Heat Marker */
.heat-marker[b-pcvmc71v9h] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.85rem;
    flex-shrink: 0;
    transition: all 0.3s ease;
    border: 3px solid;
}

.heat-node.pending .heat-marker[b-pcvmc71v9h] {
    background: var(--bs-body-bg, #fff);
    border-color: var(--bs-border-color, #dee2e6);
    color: var(--bs-secondary, #6c757d);
}

.heat-node.next .heat-marker[b-pcvmc71v9h] {
    border-color: var(--bs-primary, #0d6efd);
    color: var(--bs-primary, #0d6efd);
    animation: pulse-next-b-pcvmc71v9h 2s infinite;
}

@keyframes pulse-next-b-pcvmc71v9h {
    0%, 100% { box-shadow: 0 0 0 0 rgba(13, 110, 253, 0.4); }
    50% { box-shadow: 0 0 0 8px rgba(13, 110, 253, 0); }
}

.heat-node.active .heat-marker[b-pcvmc71v9h] {
    background: var(--bs-primary, #0d6efd);
    border-color: var(--bs-primary, #0d6efd);
    color: white;
    animation: pulse-active-b-pcvmc71v9h 1.5s infinite;
}

@keyframes pulse-active-b-pcvmc71v9h {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

.heat-node.completed .heat-marker[b-pcvmc71v9h] {
    background: var(--bs-success, #198754);
    border-color: var(--bs-success, #198754);
    color: white;
}

.heat-node.final .heat-marker[b-pcvmc71v9h] {
    border-width: 4px;
}

.active-indicator[b-pcvmc71v9h] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

/* Heat Info */
.heat-info[b-pcvmc71v9h] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.heat-label[b-pcvmc71v9h] {
    font-weight: 600;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 0.25rem;
    white-space: nowrap;
}

.final-badge[b-pcvmc71v9h] {
    font-size: 0.75rem;
}

.heat-time[b-pcvmc71v9h] {
    font-size: 0.75rem;
    color: var(--bs-secondary, #6c757d);
}

.heat-time.highlight[b-pcvmc71v9h] {
    color: var(--bs-primary, #0d6efd);
    font-weight: 600;
}

/* Live Badge */
.live-badge[b-pcvmc71v9h] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.375rem;
    background: var(--bs-danger, #dc3545);
    color: white;
    font-size: 0.65rem;
    font-weight: 700;
    border-radius: 0.25rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    animation: blink-live-b-pcvmc71v9h 1s infinite;
}

@keyframes blink-live-b-pcvmc71v9h {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

/* Countdown */
.countdown[b-pcvmc71v9h] {
    font-family: 'SF Mono', 'Monaco', monospace;
    font-weight: 600;
    color: var(--bs-primary, #0d6efd);
}

.countdown.urgent[b-pcvmc71v9h] {
    color: var(--bs-warning, #ffc107);
    animation: pulse-urgent-b-pcvmc71v9h 0.5s infinite;
}

@keyframes pulse-urgent-b-pcvmc71v9h {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}

/* Heat Meta */
.heat-meta[b-pcvmc71v9h] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.125rem;
}

.class-badge[b-pcvmc71v9h] {
    font-size: 0.65rem;
    padding: 0.125rem 0.375rem;
    border-radius: 0.25rem;
    font-weight: 500;
}

.driver-count[b-pcvmc71v9h] {
    font-size: 0.7rem;
    color: var(--bs-secondary, #6c757d);
    display: flex;
    align-items: center;
    gap: 0.125rem;
}

.driver-count i[b-pcvmc71v9h] {
    font-size: 0.65rem;
}

/* Compact Mode */
.karting-heat-timeline.compact .heat-node[b-pcvmc71v9h] {
    padding: 0.25rem;
}

.karting-heat-timeline.compact .heat-marker[b-pcvmc71v9h] {
    width: 28px;
    height: 28px;
    font-size: 0.75rem;
    border-width: 2px;
}

.karting-heat-timeline.compact .heat-info[b-pcvmc71v9h] {
    display: none;
}

.karting-heat-timeline.compact .timeline-connector[b-pcvmc71v9h] {
    width: 12px;
}

.karting-heat-timeline.compact.vertical .timeline-connector[b-pcvmc71v9h] {
    height: 12px;
    width: 3px;
}

/* Hover Effects */
.heat-node:hover .heat-marker[b-pcvmc71v9h] {
    transform: scale(1.1);
}

.heat-node:hover .heat-info[b-pcvmc71v9h] {
    color: var(--bs-primary, #0d6efd);
}

/* Dark Mode */
@media (prefers-color-scheme: dark) {
    .heat-node:hover[b-pcvmc71v9h] {
        background: var(--bs-gray-800, #343a40);
    }

    .heat-node.pending .heat-marker[b-pcvmc71v9h] {
        background: var(--bs-dark, #212529);
        border-color: var(--bs-gray-600, #6c757d);
    }
}

/* Responsive */
@media (max-width: 576px) {
    .karting-heat-timeline.horizontal[b-pcvmc71v9h] {
        flex-wrap: wrap;
        justify-content: center;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Modules/SCM.Module.AdminShell/Components/SessionConfigDialog.razor.rz.scp.css */
/*
 * SessionConfigDialog.razor.css
 * 
 * IMPORTANT: The styles in this file are NOT USED at runtime!
 * 
 * Syncfusion SfDialog renders outside the Blazor component tree (at body level),
 * so Blazor CSS isolation scoping attributes are not applied to dialog elements.
 * 
 * All dialog styles have been moved to:
 *   SCM.Module.Admin.SCMUIKit/wwwroot/SCMUIKit.css
 * 
 * This file is kept for documentation/reference only.
 * To modify dialog styling, edit SCMUIKit.css instead.
 * 
 * See: .github/copilot-instructions.md - "SCMUIKit CSS Rule"
 */

/* ===============================================================
   ARCHIVED STYLES - See SCMUIKit.css for active implementation
   =============================================================== */
/* _content/SCM.Module.Admin.Client.Oqtane/Modules/SCM.Module.AdminShell/Components/SimxColorPicker.razor.rz.scp.css */
/* SimxColorPicker Component Styles */

.simx-color-picker[b-5oo2zl1xun] {
    position: relative;
}

.color-preview-row[b-5oo2zl1xun] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.color-swatch[b-5oo2zl1xun] {
    width: 40px;
    height: 38px;
    border-radius: 6px;
    border: 2px solid var(--bs-gray-300);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.color-swatch:hover[b-5oo2zl1xun] {
    border-color: var(--bs-primary);
    transform: scale(1.05);
}

.color-swatch.empty[b-5oo2zl1xun] {
    background: linear-gradient(45deg, #f0f0f0 25%, transparent 25%),
                linear-gradient(-45deg, #f0f0f0 25%, transparent 25%),
                linear-gradient(45deg, transparent 75%, #f0f0f0 75%),
                linear-gradient(-45deg, transparent 75%, #f0f0f0 75%);
    background-size: 10px 10px;
    background-position: 0 0, 0 5px, 5px -5px, -5px 0px;
}

.color-input-group[b-5oo2zl1xun] {
    display: flex;
    flex: 1;
}

.color-input-group .form-control[b-5oo2zl1xun] {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
    font-size: 0.875rem;
}

.color-input-group .btn[b-5oo2zl1xun] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

/* Color Picker Dropdown */
.color-picker-dropdown[b-5oo2zl1xun] {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    min-width: 320px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.05);
    z-index: 1050;
    padding: 1rem;
    animation: fadeInUp-b-5oo2zl1xun 0.2s ease;
}

@keyframes fadeInUp-b-5oo2zl1xun {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.color-picker-header[b-5oo2zl1xun] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--bs-gray-200);
}

.color-picker-header .fw-medium[b-5oo2zl1xun] {
    font-weight: 600;
    color: var(--bs-gray-800);
}

/* Preset Colors */
.preset-colors[b-5oo2zl1xun] {
    margin-bottom: 1rem;
}

.preset-label[b-5oo2zl1xun] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--bs-gray-500);
    margin-bottom: 0.5rem;
}

.preset-grid[b-5oo2zl1xun] {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 6px;
}

.preset-swatch[b-5oo2zl1xun] {
    width: 100%;
    aspect-ratio: 1;
    border-radius: 6px;
    border: 2px solid transparent;
    cursor: pointer;
    transition: all 0.15s ease;
    padding: 0;
}

.preset-swatch:hover[b-5oo2zl1xun] {
    transform: scale(1.15);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    z-index: 1;
}

.preset-swatch.selected[b-5oo2zl1xun] {
    border-color: var(--bs-gray-800);
    box-shadow: 0 0 0 2px white, 0 0 0 4px var(--bs-gray-800);
}

/* Custom Picker */
.custom-picker[b-5oo2zl1xun] {
    margin-bottom: 1rem;
}

[b-5oo2zl1xun] .simx-sf-color-picker {
    width: 100%;
}

[b-5oo2zl1xun] .simx-sf-color-picker .e-container {
    border: none !important;
    box-shadow: none !important;
}

/* Footer */
.color-picker-footer[b-5oo2zl1xun] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 0.75rem;
    border-top: 1px solid var(--bs-gray-200);
}

.color-picker-footer .btn-link[b-5oo2zl1xun] {
    text-decoration: none;
}

.color-picker-footer .btn-link:hover[b-5oo2zl1xun] {
    text-decoration: underline;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Modules/SCM.Module.AdminShell/Features/FoodAndBev/FBPOSPanel.razor.rz.scp.css */
/* FBPOSPanel.razor.css - POS Terminal responsive styles */

/* =================================================================
   BASE TERMINAL STYLES
   ================================================================= */

.pos-terminal[b-lo6btq9nc9] {
    height: calc(100vh - 140px);
    min-height: 600px;
    background-color: var(--simx-surface, #f8f9fa);
}

/* =================================================================
   TAB HEADER (COMPACT - DESKTOP)
   ================================================================= */

.pos-tab-header-compact[b-lo6btq9nc9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    background: var(--simx-surface-alt, #fff);
    border-bottom: 1px solid var(--simx-border, #dee2e6);
}

.pos-tab-header-compact .tab-info[b-lo6btq9nc9] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.pos-tab-header-compact .tab-badge[b-lo6btq9nc9] {
    padding: 0.25rem 0.625rem;
    background: var(--simx-primary, #0d6efd);
    color: #fff;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 600;
}

.pos-tab-header-compact .tab-name[b-lo6btq9nc9] {
    font-weight: 500;
    color: var(--simx-text, #212529);
}

.pos-tab-header-compact .table-badge[b-lo6btq9nc9] {
    padding: 0.25rem 0.5rem;
    background: var(--bs-info, #0dcaf0);
    color: #fff;
    border-radius: 6px;
    font-size: 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.pos-tab-header-compact .no-tab[b-lo6btq9nc9] {
    color: var(--simx-text-muted, #6c757d);
}

.pos-tab-header-compact .tab-actions[b-lo6btq9nc9] {
    display: flex;
    gap: 0.5rem;
}

.pos-tab-header-compact .tab-action-btn[b-lo6btq9nc9] {
    position: relative;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--simx-surface, #f8f9fa);
    border: 1px solid var(--simx-border, #dee2e6);
    border-radius: 8px;
    color: var(--simx-text-muted, #6c757d);
    cursor: pointer;
    transition: all 0.2s ease;
}

.pos-tab-header-compact .tab-action-btn:hover[b-lo6btq9nc9] {
    border-color: var(--simx-primary, #0d6efd);
    color: var(--simx-primary, #0d6efd);
}

.pos-tab-header-compact .tab-action-btn .count-badge[b-lo6btq9nc9] {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    background: var(--simx-primary, #0d6efd);
    color: #fff;
    border-radius: 9px;
    font-size: 0.6875rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* =================================================================
   ITEMS CONTAINER
   ================================================================= */

.pos-items-container[b-lo6btq9nc9] {
    flex: 1;
    overflow-y: auto;
    padding: 1rem;
    -webkit-overflow-scrolling: touch;
}

.pos-items-grid[b-lo6btq9nc9] {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
}

@media (min-width: 768px) {
    .pos-items-grid[b-lo6btq9nc9] {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    }
}

@media (min-width: 1200px) {
    .pos-items-grid[b-lo6btq9nc9] {
        grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
        gap: 0.625rem;
    }
}

.empty-items[b-lo6btq9nc9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    text-align: center;
    color: var(--simx-text-muted, #6c757d);
}

.empty-items i[b-lo6btq9nc9] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
}

.empty-items p[b-lo6btq9nc9] {
    margin: 0;
    font-size: 1rem;
}

/* =================================================================
   ORDER TAB HEADER (MOBILE)
   ================================================================= */

.order-tab-header[b-lo6btq9nc9] {
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--simx-border, #dee2e6);
    margin-bottom: 0.75rem;
}

/* =================================================================
   CART ITEMS LIST
   ================================================================= */

.cart-items-list[b-lo6btq9nc9] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.cart-items-list .cart-item[b-lo6btq9nc9] {
    background: var(--simx-surface-alt, #fff);
    border: 1px solid var(--simx-border, #dee2e6);
    border-radius: 10px;
    padding: 0.75rem;
    transition: border-color 0.2s ease;
}

.cart-items-list .cart-item.sent[b-lo6btq9nc9] {
    background: var(--simx-surface, #f8f9fa);
    border-color: var(--bs-success, #198754);
}

.cart-items-list .item-main[b-lo6btq9nc9] {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
}

.cart-items-list .qty-badge[b-lo6btq9nc9] {
    min-width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--simx-primary, #0d6efd);
    color: #fff;
    border-radius: 6px;
    font-weight: 600;
    font-size: 0.875rem;
    flex-shrink: 0;
}

.cart-items-list .cart-item.sent .qty-badge[b-lo6btq9nc9] {
    background: var(--bs-success, #198754);
}

.cart-items-list .item-details[b-lo6btq9nc9] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.cart-items-list .item-name[b-lo6btq9nc9] {
    font-weight: 500;
    color: var(--simx-text, #212529);
    word-wrap: break-word;
}

.cart-items-list .item-mods[b-lo6btq9nc9] {
    font-size: 0.8125rem;
    color: var(--simx-text-muted, #6c757d);
}

.cart-items-list .item-notes[b-lo6btq9nc9] {
    font-size: 0.8125rem;
    color: var(--bs-info, #0dcaf0);
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.cart-items-list .sent-badge[b-lo6btq9nc9] {
    font-size: 0.6875rem;
    padding: 0.125rem 0.375rem;
    background: var(--bs-success, #198754);
    color: #fff;
    border-radius: 4px;
    width: fit-content;
    text-transform: uppercase;
    font-weight: 600;
}

.cart-items-list .item-price[b-lo6btq9nc9] {
    font-weight: 600;
    color: var(--simx-text, #212529);
    white-space: nowrap;
}

.cart-items-list .item-actions[b-lo6btq9nc9] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: 0.5rem;
    padding-left: calc(28px + 0.625rem);
}

.cart-items-list .qty-btn[b-lo6btq9nc9] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--simx-surface, #f8f9fa);
    border: 1px solid var(--simx-border, #dee2e6);
    border-radius: 6px;
    font-size: 1rem;
    font-weight: 600;
    color: var(--simx-text, #212529);
    cursor: pointer;
}

.cart-items-list .qty-btn:hover[b-lo6btq9nc9] {
    border-color: var(--simx-primary, #0d6efd);
}

.cart-items-list .qty-btn:active[b-lo6btq9nc9] {
    background: var(--simx-border, #dee2e6);
}

.cart-items-list .remove-btn[b-lo6btq9nc9] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid var(--bs-danger, #dc3545);
    border-radius: 6px;
    color: var(--bs-danger, #dc3545);
    cursor: pointer;
    margin-left: auto;
}

.cart-items-list .remove-btn:hover[b-lo6btq9nc9] {
    background: var(--bs-danger, #dc3545);
    color: #fff;
}

/* =================================================================
   EMPTY CART STATE
   ================================================================= */

.empty-cart[b-lo6btq9nc9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    text-align: center;
    color: var(--simx-text-muted, #6c757d);
}

.empty-cart i[b-lo6btq9nc9] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
}

.empty-cart p[b-lo6btq9nc9] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 500;
    color: var(--simx-text, #212529);
}

.empty-cart span[b-lo6btq9nc9] {
    font-size: 0.875rem;
}

/* =================================================================
   ORDER TOTALS
   ================================================================= */

.order-totals[b-lo6btq9nc9] {
    margin-top: auto;
    padding-top: 1rem;
    border-top: 1px solid var(--simx-border, #dee2e6);
}

.order-totals .total-row[b-lo6btq9nc9] {
    display: flex;
    justify-content: space-between;
    padding: 0.375rem 0;
    font-size: 0.9375rem;
}

.order-totals .grand-total[b-lo6btq9nc9] {
    padding-top: 0.75rem;
    margin-top: 0.5rem;
    border-top: 1px solid var(--simx-border, #dee2e6);
    font-size: 1.25rem;
    font-weight: 700;
}

.order-totals .grand-total span:last-child[b-lo6btq9nc9] {
    color: var(--simx-primary, #0d6efd);
}

/* =================================================================
   ACTION BUTTON GROUP
   ================================================================= */

.action-btn-group[b-lo6btq9nc9] {
    display: flex;
    gap: 0.5rem;
}

.action-btn-group .e-btn[b-lo6btq9nc9] {
    flex: 1;
    padding: 0.625rem;
}

/* =================================================================
   TABLE SELECTION STYLES
   ================================================================= */

.table-card[b-lo6btq9nc9] {
    transition: transform 0.1s, box-shadow 0.1s;
    cursor: pointer;
}

.table-card:hover:not(.opacity-50)[b-lo6btq9nc9] {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.table-shape[b-lo6btq9nc9] {
    width: 40px;
    height: 30px;
    margin: 0 auto;
    border: 2px solid currentColor;
}

.table-shape.rectangle[b-lo6btq9nc9] {
    border-radius: 4px;
}

.table-shape.round[b-lo6btq9nc9] {
    border-radius: 50%;
    width: 35px;
    height: 35px;
}

.table-shape.square[b-lo6btq9nc9] {
    width: 35px;
    height: 35px;
    border-radius: 4px;
}

.table-shape.status-available[b-lo6btq9nc9] {
    background-color: rgba(25, 135, 84, 0.2);
    border-color: #198754;
    color: #198754;
}

.table-shape.status-occupied[b-lo6btq9nc9] {
    background-color: rgba(220, 53, 69, 0.2);
    border-color: #dc3545;
    color: #dc3545;
}

.table-shape.status-reserved[b-lo6btq9nc9] {
    background-color: rgba(255, 193, 7, 0.2);
    border-color: #ffc107;
    color: #ffc107;
}

.table-shape.status-cleaning[b-lo6btq9nc9] {
    background-color: rgba(108, 117, 125, 0.2);
    border-color: #6c757d;
    color: #6c757d;
}

.table-shape.status-closed[b-lo6btq9nc9] {
    background-color: rgba(33, 37, 41, 0.2);
    border-color: #212529;
    color: #212529;
}

/* =================================================================
   CREDIT REDEMPTION STYLES
   ================================================================= */

.credit-dialog[b-lo6btq9nc9] {
    max-height: 70vh;
    overflow-y: auto;
}

.credit-list[b-lo6btq9nc9] {
    max-height: 300px;
    overflow-y: auto;
}

/* =================================================================
   MOBILE RESPONSIVE ADJUSTMENTS
   ================================================================= */

@media (max-width: 767px) {
    .pos-terminal[b-lo6btq9nc9] {
        height: calc(100vh - 120px);
        min-height: 500px;
    }
    
    .pos-items-container[b-lo6btq9nc9] {
        padding: 0.75rem;
    }
    
    .pos-items-grid[b-lo6btq9nc9] {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }
    
    .cart-items-list .cart-item[b-lo6btq9nc9] {
        padding: 0.625rem;
    }
    
    .cart-items-list .item-actions[b-lo6btq9nc9] {
        padding-left: calc(28px + 0.5rem);
    }
    
    .empty-cart[b-lo6btq9nc9] {
        padding: 2rem 1rem;
    }
    
    .empty-cart i[b-lo6btq9nc9] {
        font-size: 2.5rem;
    }
}

/* =================================================================
   TOUCH OPTIMIZATIONS
   ================================================================= */

@media (pointer: coarse) {
    .pos-tab-header-compact .tab-action-btn[b-lo6btq9nc9] {
        width: 44px;
        height: 44px;
    }
    
    .cart-items-list .qty-btn[b-lo6btq9nc9],
    .cart-items-list .remove-btn[b-lo6btq9nc9] {
        width: 40px;
        height: 40px;
    }
    
    /* Remove hover effects on touch */
    .pos-tab-header-compact .tab-action-btn:hover[b-lo6btq9nc9] {
        border-color: var(--simx-border, #dee2e6);
        color: var(--simx-text-muted, #6c757d);
    }
    
    .cart-items-list .qty-btn:hover[b-lo6btq9nc9] {
        border-color: var(--simx-border, #dee2e6);
    }
    
    .cart-items-list .remove-btn:hover[b-lo6btq9nc9] {
        background: transparent;
        color: var(--bs-danger, #dc3545);
    }
}

/* =================================================================
   DARK MODE
   ================================================================= */

@media (prefers-color-scheme: dark) {
    .pos-terminal[b-lo6btq9nc9] {
        background-color: var(--simx-surface, #1a1a1a);
    }
    
    .pos-tab-header-compact[b-lo6btq9nc9] {
        background: var(--simx-surface-alt, #242424);
        border-color: var(--simx-border, #333);
    }
    
    .pos-tab-header-compact .tab-action-btn[b-lo6btq9nc9] {
        background: var(--simx-surface, #2a2a2a);
        border-color: var(--simx-border, #444);
    }
    
    .cart-items-list .cart-item[b-lo6btq9nc9] {
        background: var(--simx-surface-alt, #242424);
        border-color: var(--simx-border, #333);
    }
    
    .cart-items-list .cart-item.sent[b-lo6btq9nc9] {
        background: var(--simx-surface, #1a1a1a);
    }
    
    .cart-items-list .qty-btn[b-lo6btq9nc9] {
        background: var(--simx-surface, #2a2a2a);
        border-color: var(--simx-border, #444);
        color: var(--simx-text, #e9ecef);
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Modules/SCM.Module.AdminShell/Features/ResourceTypesPanel.razor.rz.scp.css */
/* ResourceTypesPanel Dialog Styles */

/* Section Headers */
[b-sncmxit65t] .section-header {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--bs-gray-700);
    border-bottom: 2px solid var(--bs-primary);
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
}

[b-sncmxit65t] .section-header i {
    color: var(--bs-primary);
    font-size: 1rem;
}

/* Form Section Container */
[b-sncmxit65t] .form-section {
    background: var(--bs-gray-50, #f8f9fa);
    border-radius: 8px;
    padding: 1rem;
    height: 100%;
}

/* Live Preview Card */
[b-sncmxit65t] .resource-type-preview {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 12px;
    padding: 1.25rem;
    color: white;
}

[b-sncmxit65t] .resource-type-preview .preview-label {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    opacity: 0.8;
    margin-bottom: 0.75rem;
}

[b-sncmxit65t] .resource-type-preview .preview-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    border-radius: 10px;
    padding: 1rem 1.25rem;
}

[b-sncmxit65t] .resource-type-preview .preview-icon {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

[b-sncmxit65t] .resource-type-preview .preview-content {
    flex: 1;
    min-width: 0;
}

[b-sncmxit65t] .resource-type-preview .preview-name {
    font-size: 1.1rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-sncmxit65t] .resource-type-preview .preview-code {
    font-size: 0.8rem;
    opacity: 0.8;
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
}

[b-sncmxit65t] .resource-type-preview .preview-badges {
    display: flex;
    gap: 0.5rem;
    flex-shrink: 0;
}

[b-sncmxit65t] .resource-type-preview .badge {
    font-size: 0.7rem;
    padding: 0.35rem 0.6rem;
}

/* Form Label Styling */
[b-sncmxit65t] .e-label-top {
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--bs-gray-600);
    margin-bottom: 0.35rem;
    display: block;
}

/* Form Text Helper */
[b-sncmxit65t] .form-text {
    font-size: 0.75rem;
    color: var(--bs-gray-500);
    margin-top: 0.25rem;
}

/* Checkbox Group Styling */
[b-sncmxit65t] .e-checkbox-wrapper {
    margin-right: 0.5rem;
}

/* Modern Dialog Styling */
[b-sncmxit65t] .simx-dialog-modern .e-dlg-content {
    padding: 1.5rem;
}

[b-sncmxit65t] .simx-dialog-modern .e-dlg-header-content {
    border-bottom: 1px solid var(--bs-gray-200);
    padding-bottom: 1rem;
}

[b-sncmxit65t] .simx-dialog-modern .e-dlg-header {
    font-size: 1.25rem;
    font-weight: 600;
}

/* Outline Input Focus States */
[b-sncmxit65t] .e-outline.e-input-group:not(.e-disabled):not(.e-float-icon-left).e-input-focus,
[b-sncmxit65t] .e-outline.e-input-group:not(.e-disabled):not(.e-float-icon-left):focus-within {
    border-color: var(--bs-primary);
    box-shadow: 0 0 0 2px rgba(13, 110, 253, 0.1);
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    [b-sncmxit65t] .resource-type-preview .preview-card {
        flex-wrap: wrap;
    }
    
    [b-sncmxit65t] .resource-type-preview .preview-badges {
        width: 100%;
        margin-top: 0.5rem;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Modules/SCM.Module.AdminShell/Features/ScreensPanel.razor.rz.scp.css */
/* ScreensPanel.razor.css */

/* Color picker input group styling */
.input-group .form-control-color[b-k7hdhet8ac] {
    cursor: pointer;
}

/* Ensure text input next to color picker has visible text */
.input-group > .form-control[b-k7hdhet8ac] {
    color: var(--bs-body-color, #212529) !important;
    background-color: var(--bs-body-bg, #fff) !important;
}

/* Color preview swatch styling */
.input-group-text[b-k7hdhet8ac] {
    background-color: var(--bs-tertiary-bg, #f8f9fa);
}

/* Theme color picker specific - show hex value clearly */
.input-group .form-control[placeholder^="#"][b-k7hdhet8ac] {
    font-family: var(--bs-font-monospace, monospace);
    font-size: 0.875rem;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Modules/SCM.Module.AdminShell/Features/TaxJurisdictionsPanel.razor.rz.scp.css */
/* Tax Jurisdictions Panel Styles */

.tax-jurisdictions-panel[b-8jc11ib9wj] {
    /* Panel-specific styling */
}

/* Combined Rate Summary Card */
.combined-rate-card[b-8jc11ib9wj] {
    background: linear-gradient(135deg, var(--bs-primary) 0%, #4a6fa5 100%);
    border-radius: 12px;
    padding: 1.5rem;
    color: white;
    display: flex;
    align-items: center;
    gap: 2rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.rate-summary[b-8jc11ib9wj] {
    text-align: center;
    padding-right: 2rem;
    border-right: 1px solid rgba(255, 255, 255, 0.3);
}

.rate-value[b-8jc11ib9wj] {
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1;
}

.rate-label[b-8jc11ib9wj] {
    font-size: 0.875rem;
    opacity: 0.9;
    margin-top: 0.25rem;
}

.rate-breakdown[b-8jc11ib9wj] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    flex: 1;
}

.rate-item[b-8jc11ib9wj] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: rgba(255, 255, 255, 0.15);
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-size: 0.875rem;
}

.rate-name[b-8jc11ib9wj] {
    opacity: 0.9;
}

.rate-percent[b-8jc11ib9wj] {
    font-weight: 600;
}

/* Tax Rate Display on Cards */
.tax-rate-display[b-8jc11ib9wj] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--bs-primary);
}

/* Jurisdiction Level Badges */
.jurisdiction-level-badge[b-8jc11ib9wj] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
}

.level-federal[b-8jc11ib9wj] {
    background-color: #fef3cd;
    color: #856404;
}

.level-state[b-8jc11ib9wj] {
    background-color: #cce5ff;
    color: #004085;
}

.level-county[b-8jc11ib9wj] {
    background-color: #d4edda;
    color: #155724;
}

.level-city[b-8jc11ib9wj] {
    background-color: #f8d7da;
    color: #721c24;
}

.level-district[b-8jc11ib9wj] {
    background-color: #e2e3e5;
    color: #383d41;
}

.level-other[b-8jc11ib9wj] {
    background-color: #e2e3e5;
    color: #6c757d;
}

/* Card States */
.inactive-card[b-8jc11ib9wj] {
    opacity: 0.6;
    background-color: #f8f9fa;
}

.pending-card[b-8jc11ib9wj] {
    border-left: 4px solid var(--bs-warning);
}

/* Form Sections */
.form-section[b-8jc11ib9wj] {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 1rem;
    height: 100%;
}

.section-header[b-8jc11ib9wj] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--bs-secondary);
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #dee2e6;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .combined-rate-card[b-8jc11ib9wj] {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }
    
    .rate-summary[b-8jc11ib9wj] {
        padding-right: 0;
        padding-bottom: 1rem;
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    }
    
    .rate-breakdown[b-8jc11ib9wj] {
        justify-content: center;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Modules/SCM.Module.AdminShell/Features/WaiversPanel.razor.rz.scp.css */
/* WaiversPanel.razor.css */

.panel-content[b-nug5n9que7] {
    padding: 16px;
}

.panel-toolbar[b-nug5n9que7] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--bs-border-color);
}

.panel-title[b-nug5n9que7] {
    margin: 0;
    font-weight: 600;
}

.loading-container[b-nug5n9que7] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 200px;
}

.dialog-form[b-nug5n9que7] {
    padding: 8px 0;
}

.btn-group-sm .btn[b-nug5n9que7] {
    padding: 0.25rem 0.5rem;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Modules/SCM.Module.PublicDisplays/Kiosk/Index.razor.rz.scp.css */
/* 
 * Kiosk/Index.razor.css
 * Scoped styles for the Kiosk Oqtane module wrapper.
 */

.kiosk-module[b-zi946gviid] {
    min-height: 100vh;
    background: #0a0a14;
    color: #f8fafc;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.kiosk-module.fullscreen[b-zi946gviid] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    background: linear-gradient(180deg, #0a0a14 0%, #0f0f1a 100%);
    overflow: hidden;
}

/* Loading state */
.module-loading[b-zi946gviid] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    gap: 1.5rem;
}

.module-loading .spinner[b-zi946gviid] {
    width: 64px;
    height: 64px;
    border: 4px solid rgba(59, 130, 246, 0.2);
    border-top-color: #3b82f6;
    border-radius: 50%;
    animation: spin-b-zi946gviid 1s linear infinite;
}

@keyframes spin-b-zi946gviid {
    to { transform: rotate(360deg); }
}

.module-loading p[b-zi946gviid] {
    color: #94a3b8;
    font-size: 1.125rem;
    margin: 0;
}

/* Error state */
.kiosk-error[b-zi946gviid] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    text-align: center;
    padding: 2rem;
    gap: 1rem;
}

.kiosk-error i[b-zi946gviid] {
    font-size: 4rem;
    color: #ef4444;
}

.kiosk-error h3[b-zi946gviid] {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0;
    color: #f8fafc;
}

.kiosk-error p[b-zi946gviid] {
    font-size: 1rem;
    color: #94a3b8;
    margin: 0;
    max-width: 400px;
}

.kiosk-error small[b-zi946gviid] {
    font-size: 0.75rem;
    color: #64748b;
}

/* Not configured state */
.kiosk-not-configured[b-zi946gviid] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    text-align: center;
    padding: 2rem;
    gap: 1rem;
}

.kiosk-not-configured i[b-zi946gviid] {
    font-size: 4rem;
    color: #f59e0b;
}

.kiosk-not-configured h3[b-zi946gviid] {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0;
    color: #f8fafc;
}

.kiosk-not-configured p[b-zi946gviid] {
    font-size: 1rem;
    color: #94a3b8;
    margin: 0;
    max-width: 400px;
}

.kiosk-not-configured small[b-zi946gviid] {
    font-size: 0.75rem;
    color: #64748b;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Modules/SCM.Module.WebsiteDisplays/BookNow/Index.razor.rz.scp.css */
/* 
   BookNow Module - Component-Scoped Styles

   NOTE:
   - Primary styles are in the module-level static stylesheet:
     `Server/wwwroot/Modules/SCM.Module.Admin.WebsiteDisplays.BookNow/Module.css`
   - This file uses Blazor CSS isolation and should only contain truly
     component-scoped styles that must not apply to child components.
*/

/* Any truly component-scoped styles go here */
/* _content/SCM.Module.Admin.Client.Oqtane/Modules/SCM.Module.WebsiteDisplays/Claim/Index.razor.rz.scp.css */
/*
 * Claim Website Module Styles
 * 
 * Scoped styles for the Claim Oqtane website module wrapper.
 * The actual claim flow styling is in the ClaimContainer component.
 */

/* Module container - respects parent container */
.scm-mod-Claim[b-vqggp3shlm] {
    /* Theme token integration with fallbacks */
    --scm-mod-bg: var(--scm-surface, #ffffff);
    --scm-mod-text: var(--scm-surface-contrast, #212529);
    --scm-mod-accent: var(--scm-accent, #0066cc);
    --scm-mod-border: var(--scm-border, #dee2e6);
    
    /* Container sizing */
    width: 100%;
    min-height: 300px;
    
    /* Visual styling */
    background: var(--scm-mod-bg);
    color: var(--scm-mod-text);
    border-radius: 8px;
    overflow: hidden;
    
    /* Flexbox for internal layout */
    display: flex;
    flex-direction: column;
}

/* Loading state */
.scm-mod-Claim .scm-mod-loading[b-vqggp3shlm] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 2rem;
    min-height: 200px;
}

.scm-mod-Claim .scm-mod-spinner[b-vqggp3shlm] {
    width: 40px;
    height: 40px;
    border: 3px solid var(--scm-mod-border);
    border-top-color: var(--scm-mod-accent);
    border-radius: 50%;
    animation: scm-mod-spin-b-vqggp3shlm 1s linear infinite;
}

@keyframes scm-mod-spin-b-vqggp3shlm {
    to { transform: rotate(360deg); }
}

.scm-mod-Claim .scm-mod-loading p[b-vqggp3shlm] {
    margin: 0;
    color: var(--scm-mod-text);
    opacity: 0.7;
    font-size: 0.9rem;
}

/* Ensure ClaimContainer fills the module */
.scm-mod-Claim[b-vqggp3shlm]  .claim-container {
    flex: 1;
    min-height: 0;
    width: 100%;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .scm-mod-Claim[b-vqggp3shlm] {
        min-height: 250px;
        border-radius: 0;
    }
}
/* _content/SCM.Module.Admin.Client.Oqtane/Modules/SCM.Module.WebsiteDisplays/ContestLeaderboard/Index.razor.rz.scp.css */
/*
 * ContestLeaderboard Website Module Styles
 * 
 * Scoped styles for the ContestLeaderboard Oqtane website module wrapper.
 * The actual leaderboard styling is in the ContestLeaderboardDisplay component.
 * 
 * This module respects page layout - for fullscreen displays, use PublicDisplays.
 */

/* Module container - respects parent container, no fullscreen forcing */
.scm-mod-ContestLeaderboard[b-4w7x24wa73] {
    /* Theme token integration with fallbacks */
    --scm-mod-bg: var(--scm-surface, #1a1a2e);
    --scm-mod-text: var(--scm-surface-contrast, #ffffff);
    --scm-mod-accent: var(--scm-accent, #f59e0b);
    --scm-mod-border: var(--scm-border, rgba(255, 255, 255, 0.1));
    
    /* Container sizing - fills parent, minimum height for usability */
    width: 100%;
    min-height: 400px;
    
    /* Visual styling */
    background: var(--scm-mod-bg);
    color: var(--scm-mod-text);
    border-radius: 8px;
    overflow: hidden;
    
    /* Flexbox for internal layout */
    display: flex;
    flex-direction: column;
}

/* Loading state */
.scm-mod-ContestLeaderboard .scm-mod-loading[b-4w7x24wa73] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 2rem;
    min-height: 300px;
}

.scm-mod-ContestLeaderboard .scm-mod-spinner[b-4w7x24wa73] {
    width: 48px;
    height: 48px;
    border: 3px solid var(--scm-mod-border);
    border-top-color: var(--scm-mod-accent);
    border-radius: 50%;
    animation: scm-mod-spin-b-4w7x24wa73 1s linear infinite;
}

@keyframes scm-mod-spin-b-4w7x24wa73 {
    to { transform: rotate(360deg); }
}

.scm-mod-ContestLeaderboard .scm-mod-loading p[b-4w7x24wa73] {
    margin: 0;
    color: var(--scm-mod-text);
    opacity: 0.7;
    font-size: 0.9rem;
}

/* Ensure the ContestLeaderboardDisplay component fills the container */
.scm-mod-ContestLeaderboard[b-4w7x24wa73]  .contest-leaderboard {
    flex: 1;
    min-height: 0;
    width: 100%;
    border-radius: inherit;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .scm-mod-ContestLeaderboard[b-4w7x24wa73] {
        min-height: 300px;
        border-radius: 0;
    }
}

/* Size variants */
.scm-mod-ContestLeaderboard.scm-mod-compact[b-4w7x24wa73] {
    min-height: 250px;
}

.scm-mod-ContestLeaderboard.scm-mod-large[b-4w7x24wa73] {
    min-height: 600px;
}

.scm-mod-ContestLeaderboard.scm-mod-fullheight[b-4w7x24wa73] {
    min-height: 80vh;
}
/* _content/SCM.Module.Admin.Client.Oqtane/Modules/SCM.Module.WebsiteDisplays/RaceLeaderboard/Index.razor.rz.scp.css */
/*
 * RaceLeaderboard Website Module Styles
 * 
 * Scoped styles for the RaceLeaderboard Oqtane website module wrapper.
 * The actual leaderboard styling is in the RaceLeaderboardDisplay component.
 * 
 * This module respects page layout - for fullscreen displays, use PublicDisplays.
 */

/* Module container - respects parent container, no fullscreen forcing */
.scm-mod-RaceLeaderboard[b-3m6jb8kkln] {
    /* Theme token integration with fallbacks */
    --scm-mod-bg: var(--scm-surface, #1a1a2e);
    --scm-mod-text: var(--scm-surface-contrast, #ffffff);
    --scm-mod-accent: var(--scm-accent, #e10600);
    --scm-mod-border: var(--scm-border, rgba(255, 255, 255, 0.1));
    
    /* Container sizing - fills parent, minimum height for usability */
    width: 100%;
    min-height: 400px;
    
    /* Visual styling */
    background: var(--scm-mod-bg);
    color: var(--scm-mod-text);
    border-radius: 8px;
    overflow: hidden;
    
    /* Flexbox for internal layout */
    display: flex;
    flex-direction: column;
}

/* Loading state */
.scm-mod-RaceLeaderboard .scm-mod-loading[b-3m6jb8kkln] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 2rem;
    min-height: 300px;
}

.scm-mod-RaceLeaderboard .scm-mod-spinner[b-3m6jb8kkln] {
    width: 48px;
    height: 48px;
    border: 3px solid var(--scm-mod-border);
    border-top-color: var(--scm-mod-accent);
    border-radius: 50%;
    animation: scm-mod-spin-b-3m6jb8kkln 1s linear infinite;
}

@keyframes scm-mod-spin-b-3m6jb8kkln {
    to { transform: rotate(360deg); }
}

.scm-mod-RaceLeaderboard .scm-mod-loading p[b-3m6jb8kkln] {
    margin: 0;
    color: var(--scm-mod-text);
    opacity: 0.7;
    font-size: 0.9rem;
}

/* Ensure the RaceLeaderboardDisplay component fills the container */
.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .race-leaderboard {
    flex: 1;
    min-height: 0;
    width: 100%;
    border-radius: inherit;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .scm-mod-RaceLeaderboard[b-3m6jb8kkln] {
        min-height: 300px;
        border-radius: 0;
    }
}

/* Size variants - can be applied via parent container or settings */
.scm-mod-RaceLeaderboard.scm-mod-compact[b-3m6jb8kkln] {
    min-height: 250px;
}

.scm-mod-RaceLeaderboard.scm-mod-large[b-3m6jb8kkln] {
    min-height: 600px;
}

.scm-mod-RaceLeaderboard.scm-mod-fullheight[b-3m6jb8kkln] {
    min-height: 80vh;
}

/* ---------- Professional polish ---------- */

/* Outer container: soft shadow + gradient surround */
.scm-mod-RaceLeaderboard[b-3m6jb8kkln] {
    background: linear-gradient(180deg,
        color-mix(in srgb, var(--scm-mod-bg) 90%, #000 10%) 0%,
        var(--scm-mod-bg) 100%);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.04) inset,
        0 10px 30px rgba(0, 0, 0, 0.25),
        0 2px 6px rgba(0, 0, 0, 0.18);
    border: 1px solid var(--scm-mod-border);
    font-family: var(--scm-font-sans, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);
}

/* Stack multiple leaderboard cards with breathing room */
.scm-mod-RaceLeaderboard .scm-mod-leaderboard-item[b-3m6jb8kkln] {
    position: relative;
    border-bottom: 1px solid var(--scm-mod-border);
}

.scm-mod-RaceLeaderboard .scm-mod-leaderboard-item:last-child[b-3m6jb8kkln] {
    border-bottom: none;
}

/* Results banner — Provisional / Official / Amended */
.scm-mod-RaceLeaderboard .scm-mod-results-banner[b-3m6jb8kkln] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 1.25rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    font-size: 0.8rem;
    background: color-mix(in srgb, var(--scm-mod-accent) 14%, transparent);
    color: var(--scm-mod-text);
    border-bottom: 1px solid var(--scm-mod-border);
}

.scm-mod-RaceLeaderboard .scm-mod-results-banner--provisional[b-3m6jb8kkln] {
    background: color-mix(in srgb, #f5a524 22%, transparent);
}

.scm-mod-RaceLeaderboard .scm-mod-results-banner--official[b-3m6jb8kkln] {
    background: color-mix(in srgb, #17c964 22%, transparent);
}

.scm-mod-RaceLeaderboard .scm-mod-results-banner--amended[b-3m6jb8kkln] {
    background: color-mix(in srgb, #7828c8 22%, transparent);
}

.scm-mod-RaceLeaderboard .scm-mod-results-banner__meta[b-3m6jb8kkln] {
    opacity: 0.75;
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
}

/* Empty state — polished racing-themed card */
.scm-mod-RaceLeaderboard .scm-mod-empty-state[b-3m6jb8kkln] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 3rem 1.5rem;
    text-align: center;
    min-height: 320px;
    background:
        radial-gradient(circle at 50% 0%,
            color-mix(in srgb, var(--scm-mod-accent) 12%, transparent) 0%,
            transparent 60%);
}

.scm-mod-RaceLeaderboard .scm-mod-empty-icon[b-3m6jb8kkln] {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--scm-mod-accent) 18%, transparent);
    color: var(--scm-mod-accent);
    margin-bottom: 0.5rem;
    box-shadow: 0 0 0 6px color-mix(in srgb, var(--scm-mod-accent) 8%, transparent);
}

.scm-mod-RaceLeaderboard .scm-mod-empty-title[b-3m6jb8kkln] {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--scm-mod-text);
}

.scm-mod-RaceLeaderboard .scm-mod-empty-message[b-3m6jb8kkln] {
    margin: 0;
    max-width: 480px;
    color: var(--scm-mod-text);
    opacity: 0.7;
    font-size: 0.95rem;
    line-height: 1.5;
}

.scm-mod-RaceLeaderboard .scm-mod-empty-cta[b-3m6jb8kkln] {
    margin: 0.5rem 0 0 0;
    font-weight: 600;
    color: var(--scm-mod-accent);
    font-size: 0.95rem;
}

/* Tighten/upgrade the embedded RaceLeaderboardDisplay when shown inside the website module */
.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .race-leaderboard {
    background: transparent;
    color: var(--scm-mod-text);
}

.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .leaderboard-header {
    padding: 1rem 1.25rem;
    background: linear-gradient(180deg,
        color-mix(in srgb, var(--scm-mod-bg) 70%, #000 30%) 0%,
        color-mix(in srgb, var(--scm-mod-bg) 92%, #000 8%) 100%);
    border-bottom: 1px solid var(--scm-mod-border);
}

.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .session-name {
    font-weight: 700;
    font-size: 1.1rem;
    letter-spacing: -0.01em;
}

.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .session-type-chip,
.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .game-phase-chip,
.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .kd-series-chip,
.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .kd-round-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    background: color-mix(in srgb, var(--scm-mod-accent) 18%, transparent);
    color: var(--scm-mod-text);
    border: 1px solid color-mix(in srgb, var(--scm-mod-accent) 35%, transparent);
}

.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .leaderboard-columns {
    padding: 0.5rem 1.25rem;
    border-bottom: 1px solid var(--scm-mod-border);
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.65;
}

.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .leaderboard-row {
    padding: 0.6rem 1.25rem;
    border-bottom: 1px solid color-mix(in srgb, var(--scm-mod-border) 60%, transparent);
    transition: background-color 120ms ease;
}

.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .leaderboard-row:hover {
    background: color-mix(in srgb, var(--scm-mod-accent) 6%, transparent);
}

.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .leaderboard-row:nth-child(even) {
    background: color-mix(in srgb, var(--scm-mod-text) 3%, transparent);
}

.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .position-number {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .driver-name {
    font-weight: 600;
}

.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .col-time,
.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .col-gap,
.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .col-pits {
    font-variant-numeric: tabular-nums;
}

.scm-mod-RaceLeaderboard[b-3m6jb8kkln]  .leaderboard-footer {
    padding: 0.5rem 1.25rem;
    font-size: 0.75rem;
    opacity: 0.55;
    border-top: 1px solid var(--scm-mod-border);
}