/* /Components/BlikInput.razor.rz.scp.css */
.blik-container[b-ijumnmwty1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-sm);
}

.blik-label[b-ijumnmwty1] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    font-weight: 500;
}

.blik-boxes[b-ijumnmwty1] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.blik-separator[b-ijumnmwty1] {
    font-size: var(--font-size-xl);
    color: var(--color-on-surface-dim);
    margin: 0 2px;
    user-select: none;
}

.blik-box[b-ijumnmwty1] {
    width: 48px;
    height: 56px;
    text-align: center;
    font-size: var(--font-size-2xl);
    font-weight: 500;
    font-family: var(--font-body);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-on-surface);
    outline: none;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
    -moz-appearance: textfield;
}

.blik-box[b-ijumnmwty1]::-webkit-outer-spin-button,
.blik-box[b-ijumnmwty1]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.blik-box:focus[b-ijumnmwty1] {
    border-color: #e6194b;
    box-shadow: 0 0 0 2px rgba(230, 25, 75, 0.15);
}

.blik-box:disabled[b-ijumnmwty1] {
    opacity: 0.5;
    cursor: not-allowed;
}

@media (max-width: 400px) {
    .blik-box[b-ijumnmwty1] {
        width: 40px;
        height: 48px;
        font-size: var(--font-size-xl);
    }
}
/* /Components/BookingCard.razor.rz.scp.css */
.booking-card[b-f0pqfov6ni] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    padding: var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-card);
    cursor: pointer;
    transition: box-shadow var(--transition-fast), border-color var(--transition-fast), background var(--transition-fast);
}

.booking-card:hover[b-f0pqfov6ni] {
    box-shadow: var(--shadow-card);
}

.booking-card:focus-visible[b-f0pqfov6ni] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.booking-card-selected[b-f0pqfov6ni] {
    background: rgba(153, 61, 46, 0.06);
    border-left: 3px solid var(--color-primary);
    box-shadow: var(--shadow-card);
}

.booking-card-header[b-f0pqfov6ni] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.booking-card-date[b-f0pqfov6ni] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface-dim);
}

.booking-card-badge[b-f0pqfov6ni] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    padding: 2px var(--space-sm);
    border-radius: var(--radius-full);
}

.booking-card-badge.booking-status-confirmed[b-f0pqfov6ni] {
    background: var(--color-success-tint);
    color: var(--color-success);
}

.booking-card-badge.booking-status-pending[b-f0pqfov6ni] {
    background: var(--color-warning-tint);
    color: var(--color-warning);
}

.booking-card-badge.booking-status-cancelled[b-f0pqfov6ni] {
    background: var(--color-error-tint);
    color: var(--color-error);
}

.booking-card-badge.booking-status-waitlisted[b-f0pqfov6ni] {
    background: var(--color-info-tint, rgba(59, 130, 246, 0.1));
    color: var(--color-info, #3b82f6);
}

.booking-card-body[b-f0pqfov6ni] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.booking-card-name[b-f0pqfov6ni] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
    line-height: 1.3;
}

.booking-card-meta[b-f0pqfov6ni] {
    display: flex;
    gap: var(--space-md);
    flex-wrap: wrap;
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
}

.booking-card-footer[b-f0pqfov6ni] {
    display: flex;
    gap: var(--space-xs);
}

.card-icon[b-f0pqfov6ni] {
    display: inline-block;
    vertical-align: middle;
    flex-shrink: 0;
}

.booking-card-credit[b-f0pqfov6ni] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    padding: 2px var(--space-sm);
    border-radius: var(--radius-full);
    background: var(--color-success-tint);
    color: var(--color-success);
}

@media (max-width: 767px) {
    .booking-card[b-f0pqfov6ni] {
        padding: var(--space-sm) var(--space-md);
    }
}
/* /Components/BookingDetailPanel.razor.rz.scp.css */
.detail-panel[b-get01umd6o] {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
    padding: var(--space-lg);
    width: 100%;
}

.detail-panel-title[b-get01umd6o] {
    font-family: var(--font-display);
    font-size: var(--font-size-xl);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.detail-panel-date[b-get01umd6o] {
    font-size: var(--font-size-base);
    color: var(--color-on-surface);
    margin: 0;
}

.detail-panel-time[b-get01umd6o] {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    margin: 0;
}

.detail-panel-section[b-get01umd6o] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.detail-panel-section-title[b-get01umd6o] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface-dim);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0;
    padding-bottom: var(--space-xs);
    border-bottom: 1px solid var(--color-border);
}

.detail-panel-row[b-get01umd6o] {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    margin: 0;
}

.detail-panel-row-dim[b-get01umd6o] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
    margin: 0;
}

.detail-panel-dl[b-get01umd6o] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-xs) var(--space-sm);
    margin: 0;
    padding: 0;
}

.detail-panel-dl-row[b-get01umd6o] {
    display: contents;
}

.detail-panel-dl dt[b-get01umd6o] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    font-weight: 500;
}

.detail-panel-dl dd[b-get01umd6o] {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    margin: 0;
}

.panel-icon[b-get01umd6o] {
    display: inline-block;
    vertical-align: middle;
    flex-shrink: 0;
}

.detail-panel-actions[b-get01umd6o] {
    display: flex;
    gap: var(--space-sm);
    flex-wrap: wrap;
    margin-top: var(--space-md);
}

.detail-panel-btn[b-get01umd6o] {
    padding: var(--space-sm) var(--space-lg);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
    transition: background var(--transition-fast), color var(--transition-fast), opacity var(--transition-fast);
}

.detail-panel-btn-secondary[b-get01umd6o] {
    background: var(--color-border);
    color: var(--color-on-surface);
    border: none;
}

.detail-panel-btn-secondary:hover[b-get01umd6o] {
    opacity: 0.85;
}

.detail-panel-btn-outline-danger[b-get01umd6o] {
    background: transparent;
    color: var(--color-error);
    border: 1px solid var(--color-error);
}

.detail-panel-btn-outline-danger:hover[b-get01umd6o] {
    background: var(--color-error-tint);
    color: var(--color-error);
}
/* /Components/CapacityBar.razor.rz.scp.css */
.capacity-bar-wrapper[b-btotn5wymf] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    width: 100%;
}

.capacity-bar-wrapper--compact[b-btotn5wymf] {
    flex-direction: row;
    align-items: center;
    gap: var(--space-xs);
    width: auto;
}

.capacity-bar-wrapper--compact .capacity-bar[b-btotn5wymf] {
    width: 80px;
    flex-shrink: 0;
}

.capacity-bar[b-btotn5wymf] {
    height: 6px;
    background: var(--color-border);
    border-radius: var(--radius-full);
    overflow: hidden;
}

.capacity-bar-fill[b-btotn5wymf] {
    height: 100%;
    background: var(--color-on-surface-dim);
    border-radius: var(--radius-full);
    transition: width var(--transition-base);
    animation: capacity-bar-fill-b-btotn5wymf 400ms ease-out;
}

.capacity-bar-text[b-btotn5wymf] {
    font-size: var(--font-size-xs);
    font-weight: 300;
    color: var(--color-on-surface-dim);
}

@keyframes capacity-bar-fill-b-btotn5wymf {
    from { width: 0; }
}

.capacity-bar-wrapper--stacked[b-btotn5wymf] {
    display: inline-flex;
    flex-direction: column-reverse; /* text (last in DOM) on top, bar below */
    align-items: stretch;
    gap: 3px;
    width: auto;                    /* shrink to widest child = the text */
}

.capacity-bar-wrapper--stacked .capacity-bar[b-btotn5wymf] { width: 100%; }   /* match wrapper = text width */

.capacity-bar-wrapper--stacked .capacity-bar-text[b-btotn5wymf] { white-space: nowrap; text-align: center; }
/* /Components/ClassCard.razor.rz.scp.css */
.class-card[b-80josx19qd] {
    display: flex;
    flex-direction: column;
    padding: var(--space-md) var(--space-lg);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-card);
    cursor: pointer;
    transition: box-shadow var(--transition-fast);
}

.class-card:hover[b-80josx19qd] {
    box-shadow: var(--shadow-md);
}

.class-card:focus-visible[b-80josx19qd] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

/* ─── §4 badge family — dim tint fill on the whole card ─── */

.card-badge--green[b-80josx19qd] {
    background: var(--color-success-tint);
    border-left: 3px solid var(--color-success);
}

.card-badge--amber[b-80josx19qd] {
    background: var(--color-warning-tint);
    border-left: 3px solid var(--color-warning);
}

.card-badge--blue[b-80josx19qd] {
    background: var(--color-info-tint);
    border-left: 3px solid var(--color-info);
}

.card-badge--grey[b-80josx19qd] {
    background: var(--color-border);
    border-left: 3px solid var(--color-on-surface-dim);
    opacity: 0.85;
}

.card-badge--red[b-80josx19qd] {
    background: var(--color-error-tint);
    border-left: 3px solid var(--color-error);
    opacity: 0.8;
}

/* ─── Not-yet-open state: shaded/muted appearance when check-in is not open ─── */
.class-card--not-open[b-80josx19qd] { opacity: 0.65; }

/* ─── Info block ─── */
.class-card-info[b-80josx19qd] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

/* Time + duration + corner-label on one line */
.class-card-time-row[b-80josx19qd] {
    display: flex;
    align-items: baseline;
    gap: 4px;
}

.class-card-time[b-80josx19qd] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
}

.class-card-sep[b-80josx19qd] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
}

.class-card-duration[b-80josx19qd] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
    flex: 1;
}

/* Corner label — right-aligned on the time row, accent color matches the family */
.class-card-corner-label[b-80josx19qd] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    white-space: nowrap;
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.card-badge--green  .class-card-corner-label[b-80josx19qd] { color: var(--color-success); }
.card-badge--amber  .class-card-corner-label[b-80josx19qd] { color: var(--color-warning); }
.card-badge--blue   .class-card-corner-label[b-80josx19qd] { color: var(--color-info); }
.card-badge--grey   .class-card-corner-label[b-80josx19qd] { color: var(--color-on-surface-dim); }
.card-badge--red    .class-card-corner-label[b-80josx19qd] { color: var(--color-error); }

/* ─── Gold ★ overlay (§4: regular-visit marker) ─── */
.card-star[b-80josx19qd] {
    color: #F5A623;
    font-style: normal;
}

[data-theme="dark"] .card-star[b-80josx19qd] {
    color: #FFD060;
}

.class-card-name[b-80josx19qd] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Bottom line: instructor (left) + compact capacity (right) on ONE row — no extra card line */
.class-card-meta[b-80josx19qd] {
    display: flex;
    align-items: flex-end;
    gap: var(--space-sm);
}

.class-card-capacity[b-80josx19qd] { margin-left: auto; }

.class-card-instructor[b-80josx19qd] {
    font-size: var(--font-size-sm);
    font-weight: 300;
    color: var(--color-on-surface-dim);
    white-space: nowrap;
}

@media (max-width: 767px) {
    .class-card-time-row[b-80josx19qd] {
        flex-wrap: wrap;
    }
}
/* /Components/ClassDetail.razor.rz.scp.css */
.class-detail[b-5mauby4mi3] {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
}

.class-detail-skeleton[b-5mauby4mi3] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-md);
}

/* Header */
.class-detail-header[b-5mauby4mi3] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.class-detail-name[b-5mauby4mi3] {
    font-family: var(--font-display);
    font-size: var(--font-size-2xl);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
    line-height: 1.2;
}

.class-detail-instructor[b-5mauby4mi3] {
    font-size: var(--font-size-base);
    color: var(--color-on-surface-dim);
}

/* Time info */
.class-detail-time-info[b-5mauby4mi3] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.class-detail-row[b-5mauby4mi3] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
}

.class-detail-icon[b-5mauby4mi3] {
    flex-shrink: 0;
    width: 1.25rem;
    text-align: center;
}

/* Capacity */
.class-detail-capacity[b-5mauby4mi3] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.class-detail-spots-row[b-5mauby4mi3] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

.class-detail-spots[b-5mauby4mi3] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
}

.class-detail-badge-warning[b-5mauby4mi3] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    padding: 2px var(--space-sm);
    border-radius: var(--radius-full);
    background: var(--color-warning-tint);
    color: var(--color-warning);
}

.class-detail-badge-row[b-5mauby4mi3] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-xs);
}

.class-detail-badge-credit[b-5mauby4mi3] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    padding: var(--space-xs) var(--space-sm);
    border-radius: var(--radius-full);
    background: var(--color-success-tint);
    color: var(--color-success);
}

.class-detail-badge-price[b-5mauby4mi3] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    padding: var(--space-xs) var(--space-sm);
    border-radius: var(--radius-full);
    background: var(--color-surface-dim, #f0f0ec);
    color: var(--color-on-surface);
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.class-detail-badge-crossed[b-5mauby4mi3] {
    font-weight: 400;
    opacity: 0.6;
}

/* Sections */
.class-detail-section[b-5mauby4mi3] {
    padding-top: var(--space-sm);
    border-top: 1px solid var(--color-border);
}

.class-detail-description[b-5mauby4mi3] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    line-height: 1.5;
    margin: 0;
    white-space: pre-line;
}

/* Price */
.class-detail-credit-info[b-5mauby4mi3],
.class-detail-price-info[b-5mauby4mi3] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

.class-detail-price-original[b-5mauby4mi3] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    text-decoration: line-through;
}

.class-detail-price-current[b-5mauby4mi3] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
}

/* §6 detail-state header / context (plan 07) */
.class-detail-state-header[b-5mauby4mi3] {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    font-size: var(--font-size-base);
    font-weight: 600;
    padding: var(--space-xs) 0;
}

.class-detail-state-icon[b-5mauby4mi3] {
    font-size: 1rem;
}

/* Gold ★ on the merged "Booked" label for regular visitors (matches the card ★) */
.class-detail-star[b-5mauby4mi3] {
    color: #F5A623;
}

[data-theme="dark"] .class-detail-star[b-5mauby4mi3] {
    color: #FFD060;
}

.class-detail-state-visited[b-5mauby4mi3] {
    color: var(--color-success);
}

.class-detail-state-booked[b-5mauby4mi3] {
    color: var(--color-success);
}

.class-detail-state-completed[b-5mauby4mi3] {
    color: var(--color-on-surface-dim);
}

.class-detail-state-inprogress[b-5mauby4mi3] {
    color: var(--color-success);
}

.class-detail-state-cancelled[b-5mauby4mi3] {
    color: var(--color-error);
}

.class-detail-state-payment-pending[b-5mauby4mi3] {
    color: var(--color-warning);
    font-weight: 500;
}

.class-detail-state-context[b-5mauby4mi3] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    margin: var(--space-xs) 0 var(--space-sm);
}

/* Out-of-membership nudge (§6 4e — amber warning, gated on ShowRegularOutOfClassesNudge) */
.class-detail-topup-nudge[b-5mauby4mi3] {
    display: block;
    font-size: var(--font-size-sm);
    font-weight: 500;
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius-md);
    background: var(--color-warning-tint);
    color: var(--color-warning);
    text-decoration: none;
    border: 1px solid var(--color-warning);
    text-align: center;
}

.class-detail-topup-nudge:hover[b-5mauby4mi3] {
    opacity: 0.85;
}

/* Action buttons */
.class-detail-actions[b-5mauby4mi3] {
    padding-top: var(--space-sm);
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.class-detail-btn[b-5mauby4mi3] {
    width: 100%;
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius-md);
    font-size: var(--font-size-base);
    font-weight: 500;
    cursor: pointer;
    border: none;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-sm);
    transition: opacity var(--transition-fast);
}

.class-detail-btn:hover:not(:disabled)[b-5mauby4mi3] {
    opacity: 0.85;
}

.class-detail-btn:disabled[b-5mauby4mi3] {
    opacity: 0.5;
    cursor: not-allowed;
}

.class-detail-btn:focus-visible[b-5mauby4mi3] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.class-detail-btn-primary[b-5mauby4mi3] {
    background: var(--color-primary);
    color: #fff;
}

.class-detail-btn-secondary[b-5mauby4mi3] {
    background: var(--color-secondary);
    color: #fff;
}

.class-detail-btn-outlined[b-5mauby4mi3] {
    background: transparent;
    border: 1px solid var(--color-primary);
    color: var(--color-primary);
}

.class-detail-btn-warning[b-5mauby4mi3] {
    background: transparent;
    border: 1px solid var(--color-warning);
    color: var(--color-warning);
}

.class-detail-btn-cancel[b-5mauby4mi3] {
    background: transparent;
    border: 1px solid var(--color-error);
    color: var(--color-error);
}

.class-detail-btn-disabled[b-5mauby4mi3] {
    background: var(--color-border);
    color: var(--color-on-surface-dim);
}

/* Spinner */
.class-detail-spinner[b-5mauby4mi3] {
    width: 16px;
    height: 16px;
    border: 2px solid currentColor;
    border-top-color: transparent;
    border-radius: 50%;
    animation: detail-spin-b-5mauby4mi3 0.6s linear infinite;
}

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

/* Auto Check-In toggle */
.class-detail-auto-checkin[b-5mauby4mi3] {
    padding-top: var(--space-sm);
    border-top: 1px solid var(--color-border);
}

.class-detail-toggle[b-5mauby4mi3] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    cursor: pointer;
    font-size: var(--font-size-sm);
}

.class-detail-toggle input[type="checkbox"][b-5mauby4mi3] {
    width: 18px;
    height: 18px;
    accent-color: var(--color-primary);
    cursor: pointer;
}

.class-detail-toggle-label[b-5mauby4mi3] {
    color: var(--color-on-surface);
    user-select: none;
}

@media (max-width: 767px) {
    .class-detail-btn[b-5mauby4mi3] {
        min-height: 48px;
    }
}

/* Instructor roster */
.class-detail-roster-subtitle[b-5mauby4mi3] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    letter-spacing: 0.05em;
    color: var(--color-on-surface-dim);
    text-transform: uppercase;
    margin-bottom: var(--space-sm);
}

.class-detail-roster-list[b-5mauby4mi3] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.class-detail-roster-item[b-5mauby4mi3] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    padding: var(--space-xs) 0;
    border-bottom: 1px solid var(--color-border);
}

.class-detail-roster-item:last-child[b-5mauby4mi3] {
    border-bottom: none;
}

.class-detail-roster-name[b-5mauby4mi3] {
    flex: 1;
}

.class-detail-roster-badge[b-5mauby4mi3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 10px;
    border-radius: var(--radius-sm, 4px);
    font-size: var(--font-size-xs);
    font-weight: 500;
    white-space: nowrap;
    margin-left: var(--space-sm);
}

.class-detail-badge-paid[b-5mauby4mi3] {
    background: rgba(34, 139, 34, 0.12);
    color: #1a7a1a;
}

.class-detail-badge-unpaid[b-5mauby4mi3] {
    background: rgba(245, 166, 35, 0.15);
    color: #a66800;
}

.class-detail-roster-status[b-5mauby4mi3] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
    margin-left: var(--space-sm);
}

.class-detail-roster-empty[b-5mauby4mi3] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    margin: 0;
    padding: var(--space-xs) 0;
}
/* /Components/Dialog.razor.rz.scp.css */
.dialog-backdrop[b-hpf372g46h] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: var(--z-modal-backdrop);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 250ms ease;
}

.dialog-backdrop-visible[b-hpf372g46h] {
    opacity: 1;
}

.dialog-panel[b-hpf372g46h] {
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xl);
    z-index: var(--z-modal);
    width: 500px;
    max-width: 90vw;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
    animation: dialog-enter-b-hpf372g46h 250ms ease-out;
}

@keyframes dialog-enter-b-hpf372g46h {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.dialog-header[b-hpf372g46h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-md) var(--space-lg);
    border-bottom: 1px solid var(--color-border);
}

.dialog-title[b-hpf372g46h] {
    font-size: var(--font-size-lg);
    font-weight: 500;
    margin: 0;
}

.dialog-close[b-hpf372g46h] {
    background: none;
    border: none;
    color: var(--color-on-surface-dim);
    cursor: pointer;
    padding: var(--space-xs);
    border-radius: var(--radius-sm);
    font-size: var(--font-size-base);
    min-width: 36px;
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dialog-close:hover[b-hpf372g46h] {
    background: var(--color-border);
    color: var(--color-on-surface);
}

.dialog-close:focus-visible[b-hpf372g46h] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.dialog-body[b-hpf372g46h] {
    padding: var(--space-lg);
    overflow-y: auto;
    flex: 1;
}

.dialog-footer[b-hpf372g46h] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-sm);
    padding: var(--space-md) var(--space-lg);
    border-top: 1px solid var(--color-border);
}

@media (max-width: 767px) {
    .dialog-panel[b-hpf372g46h] {
        width: 90vw;
    }

    .dialog-close[b-hpf372g46h] {
        min-width: 44px;
        min-height: 44px;
    }
}
/* /Components/Dropdown.razor.rz.scp.css */
.dropdown-wrapper[b-lnbcb5vckn] {
    position: relative;
    display: inline-flex;
}

.dropdown-trigger[b-lnbcb5vckn] {
    cursor: pointer;
    display: flex;
    align-items: center;
}

.dropdown-backdrop[b-lnbcb5vckn] {
    position: fixed;
    inset: 0;
    z-index: calc(var(--z-dropdown) - 1);
}

.dropdown-content[b-lnbcb5vckn] {
    position: absolute;
    top: 100%;
    margin-top: var(--space-xs);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    z-index: var(--z-dropdown);
    min-width: 200px;
    padding: var(--space-xs) 0;
    animation: dropdown-fade-b-lnbcb5vckn 150ms ease-out;
}

.dropdown-align-right[b-lnbcb5vckn] {
    right: 0;
}

.dropdown-align-left[b-lnbcb5vckn] {
    left: 0;
}

@keyframes dropdown-fade-b-lnbcb5vckn {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /Components/EmptyState.razor.rz.scp.css */
.empty-state[b-kkfua0xycv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-2xl) var(--space-lg);
    text-align: center;
    min-height: 200px;
}

.empty-state-icon[b-kkfua0xycv] {
    font-size: var(--font-size-4xl);
    margin-bottom: var(--space-md);
    line-height: 1;
}

.empty-state-message[b-kkfua0xycv] {
    color: var(--color-on-surface-dim);
    font-size: var(--font-size-base);
    margin-bottom: var(--space-lg);
    max-width: 320px;
}

.empty-state-action[b-kkfua0xycv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-sm) var(--space-lg);
    background: var(--color-primary);
    color: #fff;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
    text-decoration: none;
    min-height: 44px;
    transition: background var(--transition-fast);
}

.empty-state-action:hover[b-kkfua0xycv] {
    opacity: 0.9;
    text-decoration: none;
}

.empty-state-action:focus-visible[b-kkfua0xycv] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}
/* /Components/FilterChips.razor.rz.scp.css */
.filter-chips[b-o0rwykwxln] {
    display: flex;
    gap: var(--space-sm);
    overflow-x: auto;
    padding: var(--space-xs) 0;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.filter-chips[b-o0rwykwxln]::-webkit-scrollbar {
    display: none;
}

.filter-chip[b-o0rwykwxln] {
    flex-shrink: 0;
    padding: var(--space-xs) var(--space-md);
    border-radius: var(--radius-full);
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    color: var(--color-on-surface);
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
    transition: all var(--transition-fast);
    min-height: 36px;
    white-space: nowrap;
}

.filter-chip:hover[b-o0rwykwxln] {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.filter-chip:focus-visible[b-o0rwykwxln] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.filter-chip-selected[b-o0rwykwxln] {
    background: var(--color-primary);
    color: #fff;
    border-color: var(--color-primary);
}

.filter-chip-selected:hover[b-o0rwykwxln] {
    opacity: 0.9;
    color: #fff;
}

@media (max-width: 767px) {
    .filter-chip[b-o0rwykwxln] {
        min-height: 44px;
        padding: var(--space-sm) var(--space-md);
    }
}
/* /Components/Icon.razor.rz.scp.css */
.icon[b-xhcia5bkin] {
    display: inline-block;
    flex-shrink: 0;
    vertical-align: middle;
}
/* /Components/MembershipCard.razor.rz.scp.css */
.membership-card[b-9v3djt6md8] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--space-lg);
    box-shadow: var(--shadow-card);
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    position: relative;
    overflow: hidden;
    transition: box-shadow var(--transition-fast);
}

.membership-card:hover[b-9v3djt6md8] {
    box-shadow: var(--shadow-md);
}

.membership-card-expired:hover[b-9v3djt6md8],
.membership-card-terminated:hover[b-9v3djt6md8] {
    box-shadow: none;
}

.membership-card-header[b-9v3djt6md8] {
    display: flex;
    align-items: center;
}

.membership-card-title-group[b-9v3djt6md8] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: var(--space-sm);
}

.membership-card-name[b-9v3djt6md8] {
    font-family: var(--font-display);
    font-size: var(--font-size-xl);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

/* All status/Unpaid badges grouped and right-aligned (name on the left via title-group space-between). */
.membership-card-badges[b-9v3djt6md8] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    margin-left: auto;
}

.membership-card-status[b-9v3djt6md8] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.status-chip[b-9v3djt6md8] {
    align-self: flex-start;
    border-radius: var(--radius-full);
    padding: 2px 8px;
    background: var(--color-primary-tint);
    color: var(--color-primary);
}

.status-chip-success[b-9v3djt6md8] {
    background: var(--color-success-tint, rgba(46, 125, 50, 0.12));
    color: var(--color-success, #2e7d32);
}

.status-chip-warning[b-9v3djt6md8] {
    background: var(--color-warning-tint, rgba(237, 108, 2, 0.12));
    color: var(--color-warning, #ed6c02);
}

/* "Unpaid" badge rendered as a button (tappable → cash-reminder dialog) — reset button chrome only.
   Use font-family (not the `font` shorthand) so font-size/weight stay inherited from
   .membership-card-status — keeping it identical to the Active/Purchased status badge. */
.membership-card-unpaid[b-9v3djt6md8] {
    border: none;
    cursor: pointer;
    font-family: inherit;
}

.status-chip-error[b-9v3djt6md8] {
    background: var(--color-error-tint, rgba(211, 47, 47, 0.12));
    color: var(--color-error, #d32f2f);
}

.membership-card-expired .membership-card-status[b-9v3djt6md8] {
    color: var(--color-on-surface-dim);
}

.membership-card-terminated .membership-card-status[b-9v3djt6md8] {
    color: var(--color-error);
}

.membership-card-details[b-9v3djt6md8] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.membership-card-row[b-9v3djt6md8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.membership-card-label[b-9v3djt6md8] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
}

.membership-card-value[b-9v3djt6md8] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface);
}

.membership-card-actions[b-9v3djt6md8] {
    padding-top: var(--space-sm);
    border-top: 1px solid var(--color-border);
}

.membership-card-cancel[b-9v3djt6md8] {
    background: none;
    border: none;
    color: var(--color-error);
    font-size: var(--font-size-sm);
    cursor: pointer;
    padding: var(--space-xs) 0;
    font-weight: 500;
    transition: opacity var(--transition-fast);
}

.membership-card-cancel:hover[b-9v3djt6md8] {
    opacity: 0.7;
}
/* /Components/MembershipTemplatePresetCard.razor.rz.scp.css */
.plan-card[b-mf3oksi1n2] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--space-lg);
    box-shadow: var(--shadow-card);
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    position: relative;
    overflow: hidden;
    transition: box-shadow var(--transition-fast);
    height: 100%;
}

.plan-card[b-mf3oksi1n2]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--color-border);
}

.plan-card:hover[b-mf3oksi1n2] {
    box-shadow: var(--shadow-md);
}

.plan-card-recommended[b-mf3oksi1n2] {
    border-color: var(--color-primary);
    border-width: 2px;
}

.plan-card-recommended[b-mf3oksi1n2]::before {
    background: linear-gradient(90deg, var(--color-primary), var(--color-primary-hover, #802820));
}

.plan-card-badge[b-mf3oksi1n2] {
    position: absolute;
    top: -1px;
    right: var(--space-md);
    background: var(--color-primary);
    color: white;
    font-size: var(--font-size-xs);
    font-weight: 500;
    padding: 4px 12px;
    border-radius: 0 0 var(--radius-sm) var(--radius-sm);
    display: inline-flex;
    align-items: center;
    gap: var(--space-xs);
}

.plan-card-header[b-mf3oksi1n2] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.plan-card-name[b-mf3oksi1n2] {
    font-family: var(--font-display);
    font-size: var(--font-size-xl);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.plan-card-classes[b-mf3oksi1n2] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    margin: 0;
}

.plan-card-features[b-mf3oksi1n2] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.plan-card-features li[b-mf3oksi1n2] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    padding-left: var(--space-md);
    position: relative;
}

.plan-card-features li[b-mf3oksi1n2]::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: var(--color-secondary);
    font-weight: 500;
}

.plan-card-promo[b-mf3oksi1n2] {
    font-size: var(--font-size-sm);
    color: var(--color-primary);
    margin: 0;
    font-weight: 500;
}

.plan-card-price[b-mf3oksi1n2] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    margin-top: auto;
    padding-top: var(--space-sm);
    margin-bottom: 0;
}

.plan-card-price-value[b-mf3oksi1n2] {
    font-size: var(--font-size-xl);
    font-weight: 500;
    color: var(--color-on-surface);
    font-family: var(--font-display);
}

.plan-card-cta[b-mf3oksi1n2] {
    background: var(--color-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-base);
    font-weight: 500;
    cursor: pointer;
    min-height: 44px;
    transition: background var(--transition-fast);
    text-align: center;
    margin-top: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-xs);
}

.plan-card-cta:hover[b-mf3oksi1n2] {
    background: var(--color-primary-hover, #802820);
}

.plan-card-cta:active[b-mf3oksi1n2] {
    background: var(--color-primary-hover, #802820);
}
/* /Components/OtpInput.razor.rz.scp.css */
.otp-wrapper[b-bi9uh3qor1] {
    position: relative;
    display: flex;
    justify-content: center;
}

.otp-cells[b-bi9uh3qor1] {
    display: flex;
    justify-content: center;
    gap: 2px;
}

.otp-real-input[b-bi9uh3qor1] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: none;
    background: transparent;
    color: transparent;
    caret-color: transparent;
    text-align: center;
    font-size: var(--font-size-2xl);
    outline: none;
    cursor: pointer;
    z-index: 1;
    margin: 0;
    padding: 0;
    -moz-appearance: textfield;
}

.otp-real-input[b-bi9uh3qor1]::selection {
    background: transparent;
}

.otp-real-input[b-bi9uh3qor1]::-webkit-outer-spin-button,
.otp-real-input[b-bi9uh3qor1]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.otp-cell[b-bi9uh3qor1] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 56px;
    font-size: var(--font-size-2xl);
    font-weight: 500;
    font-family: var(--font-body);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-on-surface);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.otp-cell.otp-active[b-bi9uh3qor1] {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(107, 78, 170, 0.15);
}

.otp-cell.otp-active:not(.otp-filled)[b-bi9uh3qor1]::after {
    content: "";
    width: 2px;
    height: 24px;
    background: var(--color-primary);
    animation: otp-caret-blink-b-bi9uh3qor1 1s step-end infinite;
}

@keyframes otp-caret-blink-b-bi9uh3qor1 {
    50% {
        opacity: 0;
    }
}

.otp-wrapper.otp-disabled[b-bi9uh3qor1] {
    opacity: 0.5;
}

.otp-wrapper.otp-disabled .otp-real-input[b-bi9uh3qor1] {
    cursor: not-allowed;
}
/* /Components/ShortcutHelpDialog.razor.rz.scp.css */
.shortcut-grid[b-ntnyptspod] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.shortcut-row[b-ntnyptspod] {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    padding: var(--space-xs) 0;
}

.shortcut-key[b-ntnyptspod] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    padding: var(--space-xs) var(--space-sm);
    background: var(--color-background);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface);
}

.shortcut-desc[b-ntnyptspod] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
}
/* /Components/SidePanel.razor.rz.scp.css */
.side-panel-backdrop[b-yqfkpmqbnw] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.3);
    z-index: calc(var(--z-panel) - 1);
    opacity: 0;
    transition: opacity var(--transition-slow);
    pointer-events: none;
}

.side-panel-backdrop-visible[b-yqfkpmqbnw] {
    opacity: 1;
    pointer-events: auto;
}

.side-panel[b-yqfkpmqbnw] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: var(--panel-width);
    max-width: 40vw;
    background: var(--color-surface);
    z-index: var(--z-panel);
    box-shadow: var(--shadow-xl);
    display: flex;
    flex-direction: column;
    animation: panel-enter 300ms ease-out;
}

.side-panel-header[b-yqfkpmqbnw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-md) var(--space-lg);
    border-bottom: 1px solid var(--color-border);
    flex-shrink: 0;
}

.side-panel-title[b-yqfkpmqbnw] {
    font-size: var(--font-size-lg);
    font-weight: 500;
    margin: 0;
}

.side-panel-close[b-yqfkpmqbnw] {
    background: none;
    border: none;
    color: var(--color-on-surface-dim);
    cursor: pointer;
    padding: var(--space-xs);
    border-radius: var(--radius-sm);
    font-size: var(--font-size-base);
    min-width: 36px;
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.side-panel-close:hover[b-yqfkpmqbnw] {
    background: var(--color-border);
    color: var(--color-on-surface);
}

.side-panel-close:focus-visible[b-yqfkpmqbnw] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.side-panel-body[b-yqfkpmqbnw] {
    flex: 1;
    overflow-y: auto;
    padding: var(--space-lg);
}

/* Mobile: full-page overlay */
@media (max-width: 767px) {
    .side-panel[b-yqfkpmqbnw] {
        width: 100%;
        max-width: 100%;
    }

    .side-panel-close[b-yqfkpmqbnw] {
        min-width: 44px;
        min-height: 44px;
    }
}
/* /Components/SkeletonLoader.razor.rz.scp.css */
.skeleton[b-rfi4o9mcoc] {
    background: linear-gradient(
        90deg,
        var(--color-border) 25%,
        transparent 50%,
        var(--color-border) 75%
    );
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
}
/* /Components/TabBar.razor.rz.scp.css */
.tab-bar[b-jmuxika3d1] {
    display: flex;
    gap: 4px;
    padding: 4px;
    border-radius: var(--radius-lg);
}

[b-jmuxika3d1] .tab-item {
    flex: 1;
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface-dim);
    text-decoration: none;
    border-radius: var(--radius-md);
    transition: background var(--transition-fast), color var(--transition-fast);
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

[b-jmuxika3d1] .tab-item:hover {
    background: rgba(0, 0, 0, 0.06);
    color: var(--color-on-surface);
}

[b-jmuxika3d1] .tab-item.active {
    background: var(--color-primary);
    color: white;
    font-weight: 500;
}

[b-jmuxika3d1] .tab-item.active:hover {
    background: var(--color-primary);
    color: white;
}
/* /Components/Toast.razor.rz.scp.css */
.toast-container[b-8bypkbzckv] {
    position: fixed;
    bottom: var(--space-lg);
    right: var(--space-lg);
    z-index: var(--z-toast);
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    max-width: 420px;
}

.toast[b-8bypkbzckv] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    background: var(--color-surface);
    color: var(--color-on-surface);
    font-size: var(--font-size-sm);
    min-height: 44px;
}

.toast-enter[b-8bypkbzckv] {
    animation: toast-enter 300ms ease-out forwards;
}

.toast-exit[b-8bypkbzckv] {
    animation: toast-exit 200ms ease-in forwards;
}

.toast-icon[b-8bypkbzckv] {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
}

.toast-success .toast-icon[b-8bypkbzckv] { color: var(--color-success); }
.toast-error .toast-icon[b-8bypkbzckv] { color: var(--color-error); }
.toast-warning .toast-icon[b-8bypkbzckv] { color: var(--color-warning); }
.toast-info .toast-icon[b-8bypkbzckv] { color: var(--color-info); }

.toast-success[b-8bypkbzckv] { border-left: 3px solid var(--color-success); }
.toast-error[b-8bypkbzckv] { border-left: 3px solid var(--color-error); }
.toast-warning[b-8bypkbzckv] { border-left: 3px solid var(--color-warning); }
.toast-info[b-8bypkbzckv] { border-left: 3px solid var(--color-info); }

.toast-message[b-8bypkbzckv] {
    flex: 1;
    line-height: 1.4;
}

.toast-undo[b-8bypkbzckv] {
    background: none;
    border: none;
    color: var(--color-primary);
    font-weight: 500;
    font-size: var(--font-size-sm);
    cursor: pointer;
    padding: var(--space-xs) var(--space-sm);
    border-radius: var(--radius-sm);
    white-space: nowrap;
    min-height: 36px;
}

.toast-undo:hover[b-8bypkbzckv] {
    background: var(--color-border);
}

.toast-undo:focus-visible[b-8bypkbzckv] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.toast-close[b-8bypkbzckv] {
    background: none;
    border: none;
    color: var(--color-on-surface-dim);
    cursor: pointer;
    padding: var(--space-xs);
    border-radius: var(--radius-sm);
    font-size: var(--font-size-xs);
    line-height: 1;
    min-width: 36px;
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.toast-close:hover[b-8bypkbzckv] {
    background: var(--color-border);
    color: var(--color-on-surface);
}

.toast-close:focus-visible[b-8bypkbzckv] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

/* Mobile: full width at bottom center */
@media (max-width: 767px) {
    .toast-container[b-8bypkbzckv] {
        left: var(--space-md);
        right: var(--space-md);
        max-width: none;
    }
}
/* /Components/WaitlistCard.razor.rz.scp.css */
.booking-card[b-aoly7dxpiw] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    padding: var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-card);
    cursor: pointer;
    transition: box-shadow var(--transition-fast), border-color var(--transition-fast), background var(--transition-fast);
}

.booking-card:hover[b-aoly7dxpiw] {
    box-shadow: var(--shadow-card);
}

.booking-card:focus-visible[b-aoly7dxpiw] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.booking-card-selected[b-aoly7dxpiw] {
    background: rgba(153, 61, 46, 0.06);
    border-left: 3px solid var(--color-primary);
    box-shadow: var(--shadow-card);
}

.booking-card-header[b-aoly7dxpiw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.booking-card-date[b-aoly7dxpiw] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface-dim);
}

.booking-card-badge[b-aoly7dxpiw] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    padding: 2px var(--space-sm);
    border-radius: var(--radius-full);
}

.booking-card-badge.booking-status-waitlisted[b-aoly7dxpiw] {
    background: var(--color-info-tint, rgba(59, 130, 246, 0.1));
    color: var(--color-info, #3b82f6);
}

.booking-card-badge.booking-badge-regular[b-aoly7dxpiw] {
    background: var(--color-success-tint);
    color: var(--color-success);
}

[data-theme="dark"] .booking-card-badge.booking-badge-regular[b-aoly7dxpiw] {
    background: var(--color-success-tint);
    color: var(--color-success);
}

.booking-card-body[b-aoly7dxpiw] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.booking-card-name[b-aoly7dxpiw] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
    line-height: 1.3;
}

.booking-card-meta[b-aoly7dxpiw] {
    display: flex;
    gap: var(--space-md);
    flex-wrap: wrap;
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
}

.booking-card-footer[b-aoly7dxpiw] {
    display: flex;
    gap: var(--space-xs);
}

.card-icon[b-aoly7dxpiw] {
    display: inline-block;
    vertical-align: middle;
    flex-shrink: 0;
}

.booking-card-credit[b-aoly7dxpiw] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    padding: 2px var(--space-sm);
    border-radius: var(--radius-full);
    background: var(--color-success-tint);
    color: var(--color-success);
}

@media (max-width: 767px) {
    .booking-card[b-aoly7dxpiw] {
        padding: var(--space-sm) var(--space-md);
    }
}
/* /Components/WaitlistDetailPanel.razor.rz.scp.css */
.detail-panel[b-h0lkqn6lfl] {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
    padding: var(--space-lg);
    width: 100%;
}

.detail-panel-title[b-h0lkqn6lfl] {
    font-family: var(--font-display);
    font-size: var(--font-size-xl);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.detail-panel-date[b-h0lkqn6lfl] {
    font-size: var(--font-size-base);
    color: var(--color-on-surface);
    margin: 0;
}

.detail-panel-time[b-h0lkqn6lfl] {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    margin: 0;
}

.detail-panel-section[b-h0lkqn6lfl] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.detail-panel-section-title[b-h0lkqn6lfl] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface-dim);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0;
    padding-bottom: var(--space-xs);
    border-bottom: 1px solid var(--color-border);
}

.detail-panel-row[b-h0lkqn6lfl] {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    margin: 0;
}

.detail-panel-dl[b-h0lkqn6lfl] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-xs) var(--space-sm);
    margin: 0;
    padding: 0;
}

.detail-panel-dl-row[b-h0lkqn6lfl] {
    display: contents;
}

.detail-panel-dl dt[b-h0lkqn6lfl] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    font-weight: 500;
}

.detail-panel-dl dd[b-h0lkqn6lfl] {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    margin: 0;
}

.panel-icon[b-h0lkqn6lfl] {
    display: inline-block;
    vertical-align: middle;
    flex-shrink: 0;
}

.panel-star[b-h0lkqn6lfl] {
    color: #F5A623;
    font-style: normal;
}

[data-theme="dark"] .panel-star[b-h0lkqn6lfl] {
    color: #FFD060;
}

.detail-panel-actions[b-h0lkqn6lfl] {
    display: flex;
    gap: var(--space-sm);
    flex-wrap: wrap;
    margin-top: var(--space-md);
}

.detail-panel-btn[b-h0lkqn6lfl] {
    padding: var(--space-sm) var(--space-lg);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
    transition: background var(--transition-fast), color var(--transition-fast), opacity var(--transition-fast);
}

.detail-panel-btn-secondary[b-h0lkqn6lfl] {
    background: var(--color-border);
    color: var(--color-on-surface);
    border: none;
}

.detail-panel-btn-secondary:hover[b-h0lkqn6lfl] {
    opacity: 0.85;
}

.detail-panel-btn-outline-danger[b-h0lkqn6lfl] {
    background: transparent;
    color: var(--color-error);
    border: 1px solid var(--color-error);
}

.detail-panel-btn-outline-danger:hover[b-h0lkqn6lfl] {
    background: var(--color-error-tint);
    color: var(--color-error);
}
/* /Layout/AuthLayout.razor.rz.scp.css */
.auth-layout[b-morhkg3fnv] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100dvh;
    background: var(--color-background);
    padding: var(--space-md);
}

.auth-container[b-morhkg3fnv] {
    width: 100%;
    max-width: 400px;
}

.auth-logo[b-morhkg3fnv] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.4rem;
    margin-bottom: var(--space-2xl);
}

.auth-logo-text[b-morhkg3fnv] {
    font-family: 'Fraunces', Georgia, serif;
    font-size: 1.6rem;
    font-weight: 300;
    letter-spacing: 0.12em;
    line-height: 1.15;
    color: var(--color-on-surface);
    display: flex;
    flex-direction: column;
}

.auth-content[b-morhkg3fnv] {
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    padding: var(--space-xl);
    box-shadow: var(--shadow-md);
}

@media (max-width: 767px) {
    .auth-container[b-morhkg3fnv] {
        max-width: 100%;
    }

    .auth-content[b-morhkg3fnv] {
        padding: var(--space-lg);
    }
}
/* /Layout/MainLayout.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════
   MainLayout — Sidebar + Top Utility Bar
   Variables --sidebar-width and --topbar-height are in tokens.css
   ═══════════════════════════════════════════════════════════ */

/* ─── App Layout ─── */
.app-layout[b-1xzz8eo1q5] {
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    background: var(--color-background);
}

/* ═══════════════════════════════════════════════════════════
   Top Utility Bar
   ═══════════════════════════════════════════════════════════ */

.topbar[b-1xzz8eo1q5] {
    height: var(--topbar-height);
    background: var(--color-surface);
    border-bottom: 1px solid var(--color-border);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 var(--space-md);
    position: sticky;
    top: 0;
    z-index: var(--z-sticky);
}

.topbar-spacer[b-1xzz8eo1q5] {
    flex: 1;
}

.topbar-title[b-1xzz8eo1q5] {
    font-family: var(--font-display);
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

/* ─── Title action button (next to page title) ─── */
.topbar-title-action[b-1xzz8eo1q5] {
    cursor: pointer;
    padding: var(--space-xs) var(--space-md);
    margin-left: var(--space-sm);
    font-size: var(--font-size-sm);
    font-weight: 500;
    font-family: inherit;
    color: var(--color-primary);
    background: var(--color-surface);
    border: 1px solid var(--color-primary);
    border-radius: var(--radius-md);
    transition: background var(--transition-fast), color var(--transition-fast);
    white-space: nowrap;
    flex-shrink: 0;
}

.topbar-title-action:hover[b-1xzz8eo1q5] {
    background: var(--color-primary);
    color: #fff;
}

.topbar-title-action:focus-visible[b-1xzz8eo1q5] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

/* ─── Top-left Brand (desktop) ─── */
.topbar-logo[b-1xzz8eo1q5] {
    position: fixed;
    top: 0;
    left: 0;
    width: var(--sidebar-width);
    height: var(--topbar-height);
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    padding: 0 var(--space-md);
    text-decoration: none;
    color: var(--color-on-surface);
    background: var(--color-surface);
    border-bottom: 1px solid var(--color-border);
    border-right: 1px solid var(--color-border);
    z-index: var(--z-sticky);
    overflow: hidden;
    white-space: nowrap;
}

.topbar-logo-text[b-1xzz8eo1q5] {
    font-family: var(--font-display);
    font-size: var(--font-size-sm);
    font-weight: 500;
    letter-spacing: 0.02em;
    color: var(--color-on-surface);
}

.topbar-actions[b-1xzz8eo1q5] {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
}

.topbar-btn[b-1xzz8eo1q5] {
    background: none;
    border: none;
    cursor: pointer;
    padding: var(--space-xs);
    min-width: 36px;
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-sm);
    position: relative;
    color: var(--color-on-surface-dim);
    transition: color var(--transition-fast), background var(--transition-fast);
}

.topbar-btn:hover[b-1xzz8eo1q5] {
    color: var(--color-on-surface);
    background: var(--color-border);
}

.topbar-btn:focus-visible[b-1xzz8eo1q5] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.topbar-icon[b-1xzz8eo1q5] {
    width: 1.125rem;
    height: 1.125rem;
    flex-shrink: 0;
    color: inherit;
    stroke: currentColor;
    fill: none;
}

.topbar-lang-select[b-1xzz8eo1q5] {
    appearance: none;
    background: none;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    padding: 4px 10px;
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
    cursor: pointer;
    min-height: 32px;
    font-family: inherit;
    transition: border-color var(--transition-fast), background var(--transition-fast);
}

.topbar-lang-select:hover[b-1xzz8eo1q5] {
    border-color: var(--color-primary);
    background: rgba(153, 61, 46, 0.04);
}

.topbar-lang-select:focus-visible[b-1xzz8eo1q5] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
    border-color: var(--color-primary);
}

.topbar-notifications[b-1xzz8eo1q5] {
    display: flex;
}

.topbar-hamburger[b-1xzz8eo1q5] {
    background: none;
    border: none;
    cursor: pointer;
    padding: var(--space-xs);
    color: var(--color-on-surface);
    min-width: 40px;
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-sm);
}

.topbar-hamburger:focus-visible[b-1xzz8eo1q5] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

/* ─── Bell Badge ─── */
.bell-badge[b-1xzz8eo1q5] {
    position: absolute;
    top: 2px;
    right: 2px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    background: var(--color-error);
    color: #fff;
    font-size: 0.625rem;
    font-weight: 500;
    line-height: 16px;
    text-align: center;
    border-radius: var(--radius-full);
    pointer-events: none;
}

/* ═══════════════════════════════════════════════════════════
   Sidebar
   ═══════════════════════════════════════════════════════════ */

.sidebar[b-1xzz8eo1q5] {
    position: fixed;
    top: var(--topbar-height);
    left: 0;
    bottom: 0;
    width: var(--sidebar-width);
    background: var(--color-surface);
    border-right: 1px solid var(--color-border);
    display: flex;
    flex-direction: column;
    z-index: var(--z-panel);
    overflow: hidden;
}

/* ─── Sidebar Header ─── */
.sidebar-header[b-1xzz8eo1q5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-md);
    min-height: 52px;
}

.sidebar-brand[b-1xzz8eo1q5] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    text-decoration: none;
    color: var(--color-on-surface);
    overflow: hidden;
    white-space: nowrap;
}

.sidebar-brand-text[b-1xzz8eo1q5] {
    font-family: var(--font-display);
    font-size: var(--font-size-sm);
    font-weight: 500;
    letter-spacing: 0.02em;
    color: var(--color-on-surface);
}

.drawer-close[b-1xzz8eo1q5] {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--color-on-surface-dim);
    padding: var(--space-xs);
    border-radius: var(--radius-sm);
    min-width: 36px;
    min-height: 36px;
    align-items: center;
    justify-content: center;
}

.drawer-close:hover[b-1xzz8eo1q5] {
    color: var(--color-on-surface);
    background: var(--color-border);
}

.drawer-close:focus-visible[b-1xzz8eo1q5] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

/* ─── Sidebar Navigation ─── */
.sidebar-nav[b-1xzz8eo1q5] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: var(--space-xs) var(--space-sm);
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* Nav icon used inside sidebar links */
.nav-icon[b-1xzz8eo1q5] {
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
    color: currentColor;
}

.sidebar-link-text[b-1xzz8eo1q5] {
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ─── Sidebar Divider ─── */
.sidebar-divider[b-1xzz8eo1q5] {
    height: 1px;
    background: var(--color-border);
    margin: var(--space-sm) var(--space-sm);
}

/* ─── Drawer Backdrop ─── */
.drawer-backdrop[b-1xzz8eo1q5] {
    display: none;
}

/* ─── Main Content ─── */
.main-content[b-1xzz8eo1q5] {
    flex: 1;
    margin-left: var(--sidebar-width);
    padding-top: var(--space-lg);
    padding-bottom: var(--space-2xl);
    min-height: calc(100dvh - var(--topbar-height));
}

/* ─── Notification Dropdown ─── */
.notification-dropdown[b-1xzz8eo1q5] {
    width: 340px;
    max-height: 420px;
    overflow-y: auto;
}

.notification-dropdown-header[b-1xzz8eo1q5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-sm) var(--space-md);
    border-bottom: 1px solid var(--color-border);
}

.notification-dropdown-title[b-1xzz8eo1q5] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface);
}

.notification-dropdown-empty[b-1xzz8eo1q5] {
    padding: var(--space-xl) var(--space-md);
    text-align: center;
    color: var(--color-on-surface-dim);
    font-size: var(--font-size-sm);
}

.notification-dropdown-item[b-1xzz8eo1q5] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-sm);
    padding: var(--space-sm) var(--space-md);
    width: 100%;
    background: none;
    border: none;
    text-align: left;
    cursor: pointer;
    transition: background var(--transition-fast);
    font-family: inherit;
}

.notification-dropdown-item:hover[b-1xzz8eo1q5] {
    background: var(--color-background);
}

.notification-dropdown-item:focus-visible[b-1xzz8eo1q5] {
    outline: 2px solid var(--color-primary);
    outline-offset: -2px;
}

.notification-dropdown-unread[b-1xzz8eo1q5] {
    background: var(--color-background);
}

.notification-dropdown-icon[b-1xzz8eo1q5] {
    font-size: var(--font-size-base);
    flex-shrink: 0;
    line-height: 1.4;
}

.notification-dropdown-content[b-1xzz8eo1q5] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.notification-dropdown-item-title[b-1xzz8eo1q5] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface);
}

.notification-dropdown-body[b-1xzz8eo1q5] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.notification-dropdown-viewall[b-1xzz8eo1q5] {
    display: block;
    text-align: center;
    padding: var(--space-sm) var(--space-md);
    border-top: 1px solid var(--color-border);
    color: var(--color-primary);
    font-size: var(--font-size-sm);
    font-weight: 500;
    text-decoration: none;
}

.notification-dropdown-viewall:hover[b-1xzz8eo1q5] {
    background: var(--color-background);
    text-decoration: none;
}

/* ═══════════════════════════════════════════════════════════
   Desktop (≥768px)
   ═══════════════════════════════════════════════════════════ */

@media (min-width: 768px) {
    .mobile-only[b-1xzz8eo1q5] {
        display: none !important;
    }

    .drawer-backdrop[b-1xzz8eo1q5] {
        display: none !important;
    }

    .topbar[b-1xzz8eo1q5] {
        margin-left: var(--sidebar-width);
    }

    .sidebar-header[b-1xzz8eo1q5] {
        display: none;
    }
}

/* ═══════════════════════════════════════════════════════════
   Mobile (<768px)
   ═══════════════════════════════════════════════════════════ */

@media (max-width: 767px) {
    .desktop-only[b-1xzz8eo1q5] {
        display: none !important;
    }

    .topbar[b-1xzz8eo1q5] {
        justify-content: space-between;
    }

    .sidebar[b-1xzz8eo1q5] {
        top: 0;
        transform: translateX(-100%);
        width: min(var(--sidebar-width), 85vw);
        transition: transform 0.3s ease;
        border-right: none;
        box-shadow: var(--shadow-xl);
    }

    .sidebar.sidebar-open[b-1xzz8eo1q5] {
        transform: translateX(0);
    }

    .sidebar.sidebar-open .drawer-close[b-1xzz8eo1q5] {
        display: flex;
    }

    .drawer-backdrop[b-1xzz8eo1q5] {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.5);
        z-index: calc(var(--z-panel) - 1);
        animation: fade-in-b-1xzz8eo1q5 200ms ease-out;
    }

    @keyframes fade-in-b-1xzz8eo1q5 {
        from { opacity: 0; }
        to { opacity: 1; }
    }

    .main-content[b-1xzz8eo1q5] {
        margin-left: 0;
    }
}

/* ═══════════════════════════════════════════════════════════
   Sidebar polish — isolation overrides (::deep penetrates NavLink boundary)
   ═══════════════════════════════════════════════════════════ */

/* ─── Account group label ─── */
.sidebar-group-label[b-1xzz8eo1q5] {
    display: block;
    text-transform: uppercase;
    font-size: var(--font-size-xs);
    letter-spacing: 0.05em;
    color: var(--color-on-surface-dim);
    padding: var(--space-md) var(--space-md) var(--space-xs);
}

/* ─── BrandLogo vertical alignment (CSS-only, targets child SVG) ─── */
.topbar-logo[b-1xzz8eo1q5]  .brand-logo,
.sidebar-brand[b-1xzz8eo1q5]  .brand-logo {
    display: block;
    vertical-align: middle;
}

/* ─── Active link: solid brand-tinted fill ─── */
.sidebar-nav[b-1xzz8eo1q5]  .sidebar-link.active {
    background: rgba(153, 61, 46, 0.12);
    color: var(--color-primary);
    font-weight: 500;
}

[data-theme="dark"] .sidebar-nav[b-1xzz8eo1q5]  .sidebar-link.active {
    background: rgba(160, 72, 48, 0.18);
}

/* ─── Hover non-active: subtle bg, no left accent ─── */
.sidebar-nav[b-1xzz8eo1q5]  .sidebar-link:hover:not(.active):not(.sidebar-link-danger) {
    background: rgba(0, 0, 0, 0.04);
    color: var(--color-on-surface);
}

[data-theme="dark"] .sidebar-nav[b-1xzz8eo1q5]  .sidebar-link:hover:not(.active):not(.sidebar-link-danger) {
    background: rgba(255, 255, 255, 0.06);
}

/* ─── Logout button reset (removes browser default border / background) ─── */
.sidebar-nav[b-1xzz8eo1q5]  button.sidebar-link {
    appearance: none;
    border: none;
    background: none;
    cursor: pointer;
    width: 100%;
    text-align: left;
    font-family: inherit;
}

/* ─── Remove focus ring on pointer/mouse focus; keep for keyboard ─── */
.sidebar-nav[b-1xzz8eo1q5]  .sidebar-link:focus:not(:focus-visible) {
    outline: none;
}

/* ─── Logout button hover ─── */
.sidebar-nav[b-1xzz8eo1q5]  .sidebar-link-danger:hover {
    background: var(--color-error-tint);
    color: var(--color-error);
}
/* /Pages/Account/Appearance.razor.rz.scp.css */
.settings-page[b-7tcbagagud] {
    display: flex;
    justify-content: center;
    padding: var(--space-lg) var(--space-md);
}

.settings-card[b-7tcbagagud] {
    width: 100%;
    max-width: 700px;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: var(--space-xl);
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
}

.settings-section[b-7tcbagagud] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.section-heading[b-7tcbagagud] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.theme-options[b-7tcbagagud] {
    display: flex;
    gap: var(--space-sm);
}

.theme-btn[b-7tcbagagud] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-on-surface-dim);
    cursor: pointer;
    transition: border-color var(--transition-fast), background var(--transition-fast), color var(--transition-fast);
}

.theme-btn:hover[b-7tcbagagud] {
    border-color: var(--color-primary);
}

.theme-btn-active[b-7tcbagagud] {
    border: 2px solid var(--color-primary);
    background: rgba(107, 78, 170, 0.08);
    color: var(--color-primary);
}

.theme-label[b-7tcbagagud] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface);
    font-family: var(--font-body);
}

@media (max-width: 768px) {
    .settings-card[b-7tcbagagud] {
        box-shadow: none;
        border-radius: 0;
        padding: var(--space-lg) var(--space-md);
    }

    .theme-options[b-7tcbagagud] {
        flex-direction: column;
    }
}
/* /Pages/Account/ChangeIdentifier.razor.rz.scp.css */
.change-id-page[b-v2f61y8lnd] {
    display: flex;
    justify-content: center;
    padding: var(--space-lg) var(--space-md);
}

.change-id-card[b-v2f61y8lnd] {
    width: 100%;
    max-width: 500px;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: var(--space-xl);
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

.page-header[b-v2f61y8lnd] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    margin-bottom: var(--space-sm);
}

.btn-back[b-v2f61y8lnd] {
    background: none;
    border: none;
    color: var(--color-on-surface-dim);
    font-size: var(--font-size-sm);
    font-family: var(--font-body);
    cursor: pointer;
    align-self: flex-start;
    padding: 0;
    transition: color var(--transition-fast);
}

.btn-back:hover[b-v2f61y8lnd] {
    color: var(--color-on-surface);
}

.step-description[b-v2f61y8lnd] {
    color: var(--color-on-surface-dim);
    font-size: var(--font-size-sm);
    text-align: center;
}

.current-value[b-v2f61y8lnd] {
    color: var(--color-on-surface-dim);
    font-size: var(--font-size-xs);
    text-align: center;
}

.form-group[b-v2f61y8lnd] {
    display: flex;
    flex-direction: column;
}

.form-input[b-v2f61y8lnd] {
    height: 48px;
    padding: 0 var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-size: var(--font-size-base);
    font-family: var(--font-body);
    background: var(--color-surface);
    color: var(--color-on-surface);
    outline: none;
    transition: border-color var(--transition-fast);
    width: 100%;
}

.form-input:focus[b-v2f61y8lnd] {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(107, 78, 170, 0.15);
}

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

.error-message[b-v2f61y8lnd] {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    text-align: center;
}

.otp-heading[b-v2f61y8lnd] {
    text-align: center;
    font-size: var(--font-size-xl);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.otp-destination[b-v2f61y8lnd] {
    text-align: center;
    color: var(--color-on-surface-dim);
    font-size: var(--font-size-sm);
}

.btn-primary[b-v2f61y8lnd] {
    height: 48px;
    width: 100%;
    border: none;
    border-radius: var(--radius-md);
    background: var(--color-primary);
    color: #fff;
    font-size: var(--font-size-base);
    font-weight: 500;
    font-family: var(--font-body);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity var(--transition-fast);
}

.btn-primary:hover:not(:disabled)[b-v2f61y8lnd] {
    opacity: 0.9;
}

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

.resend-area[b-v2f61y8lnd] {
    text-align: center;
}

.resend-timer[b-v2f61y8lnd] {
    color: var(--color-on-surface-dim);
    font-size: var(--font-size-sm);
}

.btn-text-link[b-v2f61y8lnd] {
    background: none;
    border: none;
    color: var(--color-primary);
    font-size: var(--font-size-sm);
    font-family: var(--font-body);
    cursor: pointer;
    padding: 0;
    text-decoration: underline;
    align-self: center;
}

.btn-text-link:hover[b-v2f61y8lnd] {
    opacity: 0.8;
}

.btn-text-link:disabled[b-v2f61y8lnd] {
    opacity: 0.5;
    cursor: not-allowed;
}

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

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

@media (max-width: 768px) {
    .change-id-card[b-v2f61y8lnd] {
        box-shadow: none;
        border-radius: 0;
        padding: var(--space-lg) var(--space-md);
    }
}
/* /Pages/Account/DeleteAccount.razor.rz.scp.css */
.delete-page[b-uur6772lmv] {
    display: flex;
    justify-content: center;
    padding: var(--space-lg) var(--space-md);
}

.delete-card[b-uur6772lmv] {
    width: 100%;
    max-width: 500px;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: var(--space-xl);
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

.danger-text[b-uur6772lmv] {
    color: var(--color-error);
}

.warning-box[b-uur6772lmv] {
    display: flex;
    gap: var(--space-sm);
    padding: var(--space-md);
    background: var(--color-error-tint);
    border: 1px solid var(--color-error);
    border-radius: var(--radius-md);
}

.warning-icon[b-uur6772lmv] {
    font-size: var(--font-size-xl);
    flex-shrink: 0;
}

.warning-content[b-uur6772lmv] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.warning-title[b-uur6772lmv] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-error);
    margin: 0;
}

.warning-list[b-uur6772lmv] {
    margin: 0;
    padding-left: var(--space-lg);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    line-height: 1.6;
}

.confirm-section[b-uur6772lmv] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.form-label[b-uur6772lmv] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
}

.form-input[b-uur6772lmv] {
    height: 48px;
    padding: 0 var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-size: var(--font-size-base);
    font-family: var(--font-body);
    background: var(--color-surface);
    color: var(--color-on-surface);
    outline: none;
    transition: border-color var(--transition-fast);
    width: 100%;
}

.form-input:focus[b-uur6772lmv] {
    border-color: var(--color-error);
    box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.15);
}

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

.error-message[b-uur6772lmv] {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    text-align: center;
}

.btn-danger-full[b-uur6772lmv] {
    height: 48px;
    width: 100%;
    border: none;
    border-radius: var(--radius-md);
    background: var(--color-error);
    color: #fff;
    font-size: var(--font-size-base);
    font-weight: 500;
    font-family: var(--font-body);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity var(--transition-fast);
}

.btn-danger-full:hover:not(:disabled)[b-uur6772lmv] {
    opacity: 0.9;
}

.btn-danger-full:disabled[b-uur6772lmv] {
    opacity: 0.4;
    cursor: not-allowed;
}

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

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

@media (max-width: 768px) {
    .delete-card[b-uur6772lmv] {
        box-shadow: none;
        border-radius: 0;
        padding: var(--space-lg) var(--space-md);
    }
}
/* /Pages/Account/EditProfile.razor.rz.scp.css */
.edit-profile-page[b-crq2e80bk7] {
    display: flex;
    justify-content: center;
    padding: var(--space-lg) var(--space-md);
}

.edit-profile-card[b-crq2e80bk7] {
    width: 100%;
    max-width: 600px;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: var(--space-xl);
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

.page-header[b-crq2e80bk7] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    margin-bottom: var(--space-sm);
}

.btn-back[b-crq2e80bk7] {
    background: none;
    border: none;
    color: var(--color-on-surface-dim);
    font-size: var(--font-size-sm);
    font-family: var(--font-body);
    cursor: pointer;
    align-self: flex-start;
    padding: 0;
    transition: color var(--transition-fast);
}

.btn-back:hover[b-crq2e80bk7] {
    color: var(--color-on-surface);
}

.form-skeleton[b-crq2e80bk7] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

.form-group[b-crq2e80bk7] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.form-label[b-crq2e80bk7] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface-dim);
}

.form-input[b-crq2e80bk7] {
    height: 48px;
    padding: 0 var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-size: var(--font-size-base);
    font-family: var(--font-body);
    background: var(--color-surface);
    color: var(--color-on-surface);
    outline: none;
    transition: border-color var(--transition-fast);
    width: 100%;
}

.form-input:focus[b-crq2e80bk7] {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(107, 78, 170, 0.15);
}

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

.gender-options[b-crq2e80bk7] {
    display: flex;
    gap: var(--space-lg);
    flex-wrap: wrap;
}

.radio-option[b-crq2e80bk7] {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    cursor: pointer;
}

.radio-option input[type="radio"][b-crq2e80bk7] {
    accent-color: var(--color-primary);
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.radio-label[b-crq2e80bk7] {
    font-size: var(--font-size-base);
    color: var(--color-on-surface);
}

.identifier-section[b-crq2e80bk7] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    padding: var(--space-md) 0;
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
}

.identifier-row[b-crq2e80bk7] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.identifier-info[b-crq2e80bk7] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.identifier-label[b-crq2e80bk7] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
}

.identifier-value[b-crq2e80bk7] {
    font-size: var(--font-size-base);
    color: var(--color-on-surface);
}

.btn-link[b-crq2e80bk7] {
    background: none;
    border: none;
    color: var(--color-primary);
    font-size: var(--font-size-sm);
    font-family: var(--font-body);
    cursor: pointer;
    padding: 0;
    text-decoration: underline;
}

.btn-link:hover[b-crq2e80bk7] {
    opacity: 0.8;
}

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

.error-message[b-crq2e80bk7] {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    text-align: center;
}

.btn-primary[b-crq2e80bk7] {
    height: 48px;
    width: 100%;
    border: none;
    border-radius: var(--radius-md);
    background: var(--color-primary);
    color: #fff;
    font-size: var(--font-size-base);
    font-weight: 500;
    font-family: var(--font-body);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity var(--transition-fast);
}

.btn-primary:hover:not(:disabled)[b-crq2e80bk7] {
    opacity: 0.9;
}

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

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

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

@media (max-width: 768px) {
    .edit-profile-card[b-crq2e80bk7] {
        box-shadow: none;
        border-radius: 0;
        padding: var(--space-lg) var(--space-md);
    }
}
/* /Pages/Account/HelpSupport.razor.rz.scp.css */
.help-page[b-4evoxzn3an] {
    display: flex;
    justify-content: center;
    padding: var(--space-lg) var(--space-md);
}

.help-card[b-4evoxzn3an] {
    width: 100%;
    max-width: 800px;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: var(--space-xl);
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
}

.help-section[b-4evoxzn3an] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.section-heading[b-4evoxzn3an] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.section-divider[b-4evoxzn3an] {
    height: 1px;
    background: var(--color-border);
}

/* FAQ Accordion */
.faq-list[b-4evoxzn3an] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.faq-item[b-4evoxzn3an] {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    overflow: hidden;
    transition: border-color var(--transition-fast);
}

.faq-item:hover[b-4evoxzn3an] {
    border-color: var(--color-primary);
}

.faq-header[b-4evoxzn3an] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: var(--space-md);
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
    font-family: var(--font-body);
    gap: var(--space-sm);
}

.faq-question[b-4evoxzn3an] {
    font-size: var(--font-size-base);
    color: var(--color-on-surface);
    font-weight: 500;
}

.accordion-icon[b-4evoxzn3an] {
    display: inline-flex;
    color: var(--color-on-surface-dim);
    transition: transform 200ms ease;
    flex-shrink: 0;
}

.accordion-item.open .accordion-icon[b-4evoxzn3an] {
    transform: rotate(180deg);
}

.faq-answer[b-4evoxzn3an] {
    padding: 0 var(--space-md) var(--space-md);
    animation: fadeIn-b-4evoxzn3an var(--transition-base);
}

.faq-answer p[b-4evoxzn3an] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    line-height: 1.6;
    margin: 0;
}

/* Contact */
.contact-list[b-4evoxzn3an] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.contact-item[b-4evoxzn3an] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    padding: var(--space-sm);
    border-radius: var(--radius-sm);
    text-decoration: none;
    color: var(--color-on-surface);
    transition: background var(--transition-fast), color var(--transition-fast);
}

.contact-item:hover[b-4evoxzn3an] {
    background: var(--color-bg);
    color: var(--color-primary);
}

.contact-text[b-4evoxzn3an] {
    font-size: var(--font-size-base);
    color: currentColor;
}

/* Danger zone */
.danger-zone[b-4evoxzn3an] {
    border: 1px solid var(--color-error);
    background: var(--color-error-tint);
    border-radius: var(--radius-lg);
    padding: var(--space-lg);
    margin-top: var(--space-2xl);
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.danger-zone-title[b-4evoxzn3an] {
    margin: 0;
    color: var(--color-error);
    font-size: var(--font-size-base);
    font-weight: 500;
}

.danger-zone-warning[b-4evoxzn3an] {
    margin: 0;
    color: var(--color-on-surface);
    font-size: var(--font-size-sm);
    line-height: 1.5;
}

.danger-link[b-4evoxzn3an] {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: var(--space-xs);
    color: var(--color-error);
    background: transparent;
    border: 1px solid var(--color-error);
    font-size: var(--font-size-base);
    font-weight: 500;
    text-decoration: none;
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius-sm);
    transition: background var(--transition-fast), color var(--transition-fast);
}

.danger-link:hover[b-4evoxzn3an] {
    background: var(--color-error);
    color: var(--color-surface);
}

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

@media (max-width: 768px) {
    .help-card[b-4evoxzn3an] {
        box-shadow: none;
        border-radius: 0;
        padding: var(--space-lg) var(--space-md);
    }
}
/* /Pages/Account/Language.razor.rz.scp.css */
.settings-page[b-xaf5giherg] {
    display: flex;
    justify-content: center;
    padding: var(--space-lg) var(--space-md);
}

.settings-card[b-xaf5giherg] {
    width: 100%;
    max-width: 700px;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: var(--space-xl);
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
}

.settings-section[b-xaf5giherg] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.section-heading[b-xaf5giherg] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.language-options[b-xaf5giherg] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.language-option[b-xaf5giherg] {
    width: 100%;
    padding: var(--space-sm) var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-on-surface);
    cursor: pointer;
    text-align: left;
    font: inherit;
    transition: border-color var(--transition-fast), background var(--transition-fast), color var(--transition-fast);
}

.language-option:hover[b-xaf5giherg] {
    border-color: var(--color-primary);
}

.language-option-active[b-xaf5giherg] {
    border: 2px solid var(--color-primary);
    background: rgba(107, 78, 170, 0.08);
    color: var(--color-primary);
    font-weight: 500;
}

@media (max-width: 768px) {
    .settings-card[b-xaf5giherg] {
        box-shadow: none;
        border-radius: 0;
        padding: var(--space-lg) var(--space-md);
    }
}
/* /Pages/Account/NotificationPrefs.razor.rz.scp.css */
.settings-page[b-qhujf3z1iq] {
    display: flex;
    justify-content: center;
    padding: var(--space-lg) var(--space-md);
}

.settings-card[b-qhujf3z1iq] {
    width: 100%;
    max-width: 700px;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: var(--space-xl);
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
}

.settings-section[b-qhujf3z1iq],
.prefs-skeleton[b-qhujf3z1iq],
.settings-state[b-qhujf3z1iq],
.toggle-list[b-qhujf3z1iq] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.section-heading[b-qhujf3z1iq] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.toggle-row[b-qhujf3z1iq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-sm) 0;
    gap: var(--space-md);
}

.toggle-info[b-qhujf3z1iq] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.toggle-label[b-qhujf3z1iq] {
    font-size: var(--font-size-base);
    color: var(--color-on-surface);
}

.toggle-description[b-qhujf3z1iq],
.toggle-channel[b-qhujf3z1iq],
.receipts-note[b-qhujf3z1iq] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
}

.toggle-channel[b-qhujf3z1iq] {
    font-weight: 500;
    text-transform: uppercase;
}

.receipts-note[b-qhujf3z1iq] {
    margin: var(--space-sm) 0 0;
}

.switch[b-qhujf3z1iq] {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    flex-shrink: 0;
}

.switch input[b-qhujf3z1iq] {
    opacity: 0;
    width: 0;
    height: 0;
}

.switch-slider[b-qhujf3z1iq] {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--color-border);
    border-radius: var(--radius-full);
    transition: background var(--transition-fast);
}

.switch-slider[b-qhujf3z1iq]::before {
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background: #fff;
    border-radius: 50%;
    transition: transform var(--transition-fast);
}

.switch input:checked + .switch-slider[b-qhujf3z1iq] {
    background: var(--color-success);
}

.switch input:checked + .switch-slider[b-qhujf3z1iq]::before {
    transform: translateX(20px);
}

.switch input:focus-visible + .switch-slider[b-qhujf3z1iq] {
    box-shadow: 0 0 0 2px rgba(107, 78, 170, 0.3);
}

.error-message[b-qhujf3z1iq] {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    text-align: center;
}

.btn-retry[b-qhujf3z1iq] {
    align-self: center;
    height: 36px;
    padding: 0 var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-on-surface);
    font-size: var(--font-size-sm);
    font-family: var(--font-body);
    cursor: pointer;
    transition: border-color var(--transition-fast);
}

.btn-retry:hover[b-qhujf3z1iq] {
    border-color: var(--color-primary);
}

@media (max-width: 768px) {
    .settings-card[b-qhujf3z1iq] {
        box-shadow: none;
        border-radius: 0;
        padding: var(--space-lg) var(--space-md);
    }
}
/* /Pages/Account/PaymentMethods.razor.rz.scp.css */
.payment-page[b-sq6u24ftgb] {
    display: flex;
    justify-content: center;
    padding: var(--space-lg) var(--space-md);
}

.payment-card[b-sq6u24ftgb] {
    width: 100%;
    max-width: 600px;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: var(--space-xl);
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

.payment-empty-state[b-sq6u24ftgb] {
    max-width: 480px;
    margin: var(--space-2xl) auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-sm);
    color: var(--color-on-surface-dim);
}

[b-sq6u24ftgb] .empty-state-icon {
    color: var(--color-on-surface-dim);
}

.empty-state-message[b-sq6u24ftgb] {
    margin: 0;
    color: var(--color-on-surface);
    font-size: var(--font-size-base);
    font-weight: 500;
}

.empty-state-hint[b-sq6u24ftgb] {
    margin: 0;
    color: var(--color-on-surface-dim);
    font-size: var(--font-size-sm);
    line-height: 1.5;
}

.empty-state-action[b-sq6u24ftgb] {
    color: var(--color-primary);
    font-size: var(--font-size-sm);
    font-weight: 500;
    text-decoration: none;
}

.empty-state-action:hover[b-sq6u24ftgb] {
    text-decoration: underline;
}

.list-skeleton[b-sq6u24ftgb] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.card-list[b-sq6u24ftgb] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.card-item[b-sq6u24ftgb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    transition: border-color var(--transition-fast);
}

.card-item:hover[b-sq6u24ftgb] {
    border-color: var(--color-primary);
}

.card-info[b-sq6u24ftgb] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

.card-brand-icon[b-sq6u24ftgb] {
    font-size: var(--font-size-xl);
}

.card-details[b-sq6u24ftgb] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.card-brand-number[b-sq6u24ftgb] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
}

.card-expiry[b-sq6u24ftgb] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
}

.btn-remove[b-sq6u24ftgb] {
    height: 36px;
    padding: 0 var(--space-md);
    border: 1px solid var(--color-error);
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--color-error);
    font-size: var(--font-size-sm);
    font-family: var(--font-body);
    cursor: pointer;
    transition: background var(--transition-fast);
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 80px;
}

.btn-remove:hover:not(:disabled)[b-sq6u24ftgb] {
    background: var(--color-error-tint);
}

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

.info-text[b-sq6u24ftgb] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
    line-height: 1.5;
    padding: var(--space-sm);
    background: var(--color-bg);
    border-radius: var(--radius-sm);
}

.dialog-actions[b-sq6u24ftgb] {
    display: flex;
    gap: var(--space-sm);
    justify-content: flex-end;
    margin-top: var(--space-md);
}

.btn-secondary[b-sq6u24ftgb] {
    height: 40px;
    padding: 0 var(--space-lg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-on-surface);
    font-size: var(--font-size-sm);
    font-family: var(--font-body);
    cursor: pointer;
}

.btn-secondary:hover[b-sq6u24ftgb] {
    border-color: var(--color-primary);
}

.btn-danger[b-sq6u24ftgb] {
    height: 40px;
    padding: 0 var(--space-lg);
    border: none;
    border-radius: var(--radius-md);
    background: var(--color-error);
    color: #fff;
    font-size: var(--font-size-sm);
    font-weight: 500;
    font-family: var(--font-body);
    cursor: pointer;
    transition: opacity var(--transition-fast);
}

.btn-danger:hover[b-sq6u24ftgb] {
    opacity: 0.9;
}

.spinner-sm[b-sq6u24ftgb] {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(220, 38, 38, 0.3);
    border-top-color: var(--color-error);
    border-radius: 50%;
    animation: spin-b-sq6u24ftgb 0.8s linear infinite;
}

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

.error-message[b-sq6u24ftgb] {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    text-align: center;
}

@media (max-width: 768px) {
    .payment-card[b-sq6u24ftgb] {
        box-shadow: none;
        border-radius: 0;
        padding: var(--space-lg) var(--space-md);
    }
}
/* /Pages/Account/Profile.razor.rz.scp.css */
.profile-page[b-xe8ly0yma5] {
    display: flex;
    justify-content: center;
    padding: var(--space-lg) var(--space-md);
}

.profile-card[b-xe8ly0yma5] {
    width: 100%;
    max-width: 600px;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: var(--space-xl);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-md);
}

.profile-avatar-section[b-xe8ly0yma5] {
    margin-bottom: var(--space-sm);
}

.profile-avatar[b-xe8ly0yma5] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: rgba(153, 61, 46, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
}

.profile-avatar-initials[b-xe8ly0yma5] {
    color: var(--color-primary);
    font-size: var(--font-size-2xl);
    font-weight: 500;
    font-family: var(--font-display);
}

.profile-name[b-xe8ly0yma5] {
    font-size: var(--font-size-xl);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
    text-align: center;
}

.profile-details[b-xe8ly0yma5] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.profile-field[b-xe8ly0yma5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-sm) 0;
    border-bottom: 1px solid var(--color-border);
}

.profile-field:last-child[b-xe8ly0yma5] {
    border-bottom: none;
}

.profile-field-label[b-xe8ly0yma5] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    display: flex;
    align-items: center;
    gap: var(--space-xs);
}

.profile-field-value[b-xe8ly0yma5] {
    font-size: var(--font-size-base);
    color: var(--color-on-surface);
    font-weight: 500;
}

.profile-add-phone[b-xe8ly0yma5] {
    border: none;
    background: transparent;
    color: var(--color-primary);
    font: inherit;
    font-weight: 500;
    padding: 0;
    cursor: pointer;
}

.profile-add-phone:hover[b-xe8ly0yma5] {
    text-decoration: underline;
}

.profile-membership[b-xe8ly0yma5] {
    margin-top: var(--space-xs);
}

.membership-badge[b-xe8ly0yma5] {
    display: inline-block;
    padding: var(--space-xs) var(--space-md);
    background: var(--color-success-tint);
    color: var(--color-success);
    border-radius: var(--radius-full);
    font-size: var(--font-size-sm);
    font-weight: 500;
}

.profile-actions[b-xe8ly0yma5] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    margin-top: var(--space-sm);
}

.profile-edit-button[b-xe8ly0yma5] {
    height: 48px;
    min-width: 160px;
    padding: 0 var(--space-lg);
    border: 1px solid var(--color-primary);
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--color-primary);
    font-size: var(--font-size-base);
    font-weight: 500;
    font-family: var(--font-body);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background var(--transition-fast);
}

.profile-edit-button:hover:not(:disabled)[b-xe8ly0yma5] {
    background: rgba(153, 61, 46, 0.08);
}

.btn-secondary[b-xe8ly0yma5] {
    height: 44px;
    padding: 0 var(--space-lg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-on-surface);
    font-size: var(--font-size-sm);
    font-family: var(--font-body);
    cursor: pointer;
    transition: border-color var(--transition-fast);
}

.btn-secondary:hover[b-xe8ly0yma5] {
    border-color: var(--color-primary);
}

.error-message[b-xe8ly0yma5] {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    text-align: center;
}

@media (max-width: 768px) {
    .profile-card[b-xe8ly0yma5] {
        box-shadow: none;
        border-radius: 0;
        padding: var(--space-lg) var(--space-md);
    }
}
/* /Pages/Account/Settings.razor.rz.scp.css */
.settings-page[b-egrsmjbjff] {
    display: flex;
    justify-content: center;
    padding: var(--space-lg) var(--space-md);
}

.settings-card[b-egrsmjbjff] {
    width: 100%;
    max-width: 700px;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: var(--space-xl);
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
}

.settings-section[b-egrsmjbjff] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.section-heading[b-egrsmjbjff] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.subsection-heading[b-egrsmjbjff] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface-dim);
    margin-top: var(--space-xl);
    margin-right: 0;
    margin-bottom: var(--space-sm);
    margin-left: 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.section-divider[b-egrsmjbjff] {
    height: 1px;
    background: var(--color-border);
}

/* Language radio options */
.language-options[b-egrsmjbjff] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.radio-option[b-egrsmjbjff] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    cursor: pointer;
    padding: var(--space-xs) var(--space-sm);
    border-radius: var(--radius-sm);
    transition: background var(--transition-fast);
}

.radio-option:hover[b-egrsmjbjff] {
    background: var(--color-bg);
}

.radio-option input[type="radio"][b-egrsmjbjff] {
    accent-color: var(--color-primary);
    width: 18px;
    height: 18px;
    cursor: pointer;
    flex-shrink: 0;
}

.radio-flag[b-egrsmjbjff] {
    font-size: 20px;
    line-height: 1;
}

.radio-label[b-egrsmjbjff] {
    font-size: var(--font-size-base);
    color: var(--color-on-surface);
}

/* Theme buttons */
.theme-options[b-egrsmjbjff] {
    display: flex;
    gap: var(--space-sm);
}

.theme-btn[b-egrsmjbjff] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-xs);
    padding: var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-on-surface-dim);
    cursor: pointer;
    transition: border-color var(--transition-fast), background var(--transition-fast), color var(--transition-fast);
}

.theme-btn:hover[b-egrsmjbjff] {
    border-color: var(--color-primary);
}

.theme-btn-active[b-egrsmjbjff] {
    border: 2px solid var(--color-primary);
    background: rgba(107, 78, 170, 0.08);
    color: var(--color-primary);
}

.theme-icon[b-egrsmjbjff] {
    display: inline-flex;
    color: currentColor;
}

.theme-label[b-egrsmjbjff] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface);
    font-family: var(--font-body);
}

/* Toggle switches */
.toggle-row[b-egrsmjbjff] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-sm) 0;
    gap: var(--space-md);
}

.toggle-info[b-egrsmjbjff] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.toggle-label[b-egrsmjbjff] {
    font-size: var(--font-size-base);
    color: var(--color-on-surface);
}

.toggle-description[b-egrsmjbjff] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
}

.switch[b-egrsmjbjff] {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    flex-shrink: 0;
}

.switch input[b-egrsmjbjff] {
    opacity: 0;
    width: 0;
    height: 0;
}

.switch-slider[b-egrsmjbjff] {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--color-border);
    border-radius: var(--radius-full);
    transition: background var(--transition-fast);
}

.switch-slider[b-egrsmjbjff]::before {
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background: #fff;
    border-radius: 50%;
    transition: transform var(--transition-fast);
}

.switch input:checked + .switch-slider[b-egrsmjbjff] {
    background: var(--color-success);
}

.switch input:checked + .switch-slider[b-egrsmjbjff]::before {
    transform: translateX(20px);
}

.switch input:focus-visible + .switch-slider[b-egrsmjbjff] {
    box-shadow: 0 0 0 2px rgba(107, 78, 170, 0.3);
}

/* States */
.prefs-skeleton[b-egrsmjbjff] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.error-message[b-egrsmjbjff] {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    text-align: center;
}

.btn-retry[b-egrsmjbjff] {
    align-self: center;
    height: 36px;
    padding: 0 var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-on-surface);
    font-size: var(--font-size-sm);
    font-family: var(--font-body);
    cursor: pointer;
    transition: border-color var(--transition-fast);
}

.btn-retry:hover[b-egrsmjbjff] {
    border-color: var(--color-primary);
}

@media (max-width: 768px) {
    .settings-card[b-egrsmjbjff] {
        box-shadow: none;
        border-radius: 0;
        padding: var(--space-lg) var(--space-md);
    }

    .theme-options[b-egrsmjbjff] {
        flex-direction: column;
    }

    .theme-btn[b-egrsmjbjff] {
        flex-direction: row;
        padding: var(--space-sm) var(--space-md);
    }
}
/* /Pages/Account/WeekStart.razor.rz.scp.css */
.settings-page[b-g09u3h6e72] {
    display: flex;
    justify-content: center;
    padding: var(--space-lg) var(--space-md);
}

.settings-card[b-g09u3h6e72] {
    width: 100%;
    max-width: 700px;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: var(--space-xl);
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
}

.settings-section[b-g09u3h6e72] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.section-heading[b-g09u3h6e72] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.language-options[b-g09u3h6e72] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.language-option[b-g09u3h6e72] {
    width: 100%;
    padding: var(--space-sm) var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-on-surface);
    cursor: pointer;
    text-align: left;
    font: inherit;
    transition: border-color var(--transition-fast), background var(--transition-fast), color var(--transition-fast);
}

.language-option:hover[b-g09u3h6e72] {
    border-color: var(--color-primary);
}

.language-option-active[b-g09u3h6e72] {
    border: 2px solid var(--color-primary);
    background: rgba(107, 78, 170, 0.08);
    color: var(--color-primary);
    font-weight: 500;
}

@media (max-width: 768px) {
    .settings-card[b-g09u3h6e72] {
        box-shadow: none;
        border-radius: 0;
        padding: var(--space-lg) var(--space-md);
    }
}
/* /Pages/Admin/AdminCashRefunds.razor.rz.scp.css */
/* NOTE: duplicated from AdminPayments.razor.css. Blazor scoped CSS is per-component, so the
   refunds page cannot inherit the payments page styles. Both pages share the same .admin-payment-*
   class vocabulary; keep this file in sync with AdminPayments.razor.css. Known tech debt:
   the shared style block should eventually move to a non-scoped stylesheet or a shared component. */

.admin-payments-page[b-d7z5fht9hn] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-md) 0;
}

.admin-payments-list[b-d7z5fht9hn] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.admin-payment-card[b-d7z5fht9hn] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    width: 100%;
    padding: var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-card);
    color: var(--color-on-surface);
    cursor: pointer;
    text-align: left;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
}

.admin-payment-card:hover[b-d7z5fht9hn] {
    border-color: var(--color-primary);
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}

.admin-payment-card-selected[b-d7z5fht9hn] {
    border-color: var(--color-primary);
    background: var(--color-warning-tint);
}

.admin-payment-card-header[b-d7z5fht9hn] {
    display: flex;
    justify-content: space-between;
    gap: var(--space-md);
    align-items: flex-start;
}

.admin-payment-card-customer[b-d7z5fht9hn],
.admin-payment-card-amount[b-d7z5fht9hn] {
    font-weight: 500;
}

.admin-payment-card-amount[b-d7z5fht9hn] {
    white-space: nowrap;
}

.admin-payment-card-description[b-d7z5fht9hn],
.admin-payment-card-created[b-d7z5fht9hn],
.admin-payment-related-meta[b-d7z5fht9hn],
.admin-payment-label[b-d7z5fht9hn] {
    color: var(--color-on-surface-dim);
}

.admin-payment-card-description[b-d7z5fht9hn],
.admin-payment-description[b-d7z5fht9hn],
.admin-payment-related-meta[b-d7z5fht9hn],
.admin-payment-label[b-d7z5fht9hn],
.btn[b-d7z5fht9hn] {
    font-size: var(--font-size-sm);
}

.admin-payment-card-description[b-d7z5fht9hn],
.admin-payment-description[b-d7z5fht9hn] {
    margin: 0;
}

.admin-payment-card-created[b-d7z5fht9hn] {
    font-size: var(--font-size-xs);
}

.admin-payments-empty[b-d7z5fht9hn] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-sm);
}

.admin-payments-empty-hint[b-d7z5fht9hn] {
    margin: 0;
    color: var(--color-on-surface-dim);
    text-align: center;
}

.admin-payments-loading[b-d7z5fht9hn] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 12rem;
}

.admin-payments-spinner[b-d7z5fht9hn] {
    width: 2.5rem;
    height: 2.5rem;
    border: 3px solid var(--color-border);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: admin-payments-spin-b-d7z5fht9hn 0.8s linear infinite;
}

.admin-payment-detail[b-d7z5fht9hn] {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
}

.admin-payment-section[b-d7z5fht9hn] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.admin-payment-section-title[b-d7z5fht9hn] {
    margin: 0;
    font-size: var(--font-size-base);
    font-weight: 500;
}

.admin-payment-info-grid[b-d7z5fht9hn] {
    display: grid;
    grid-template-columns: minmax(0, auto) minmax(0, 1fr);
    gap: var(--space-xs) var(--space-md);
}

.admin-payment-value[b-d7z5fht9hn] {
    word-break: break-word;
}

.admin-payment-related-list[b-d7z5fht9hn] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.admin-payment-related-item[b-d7z5fht9hn] {
    padding: var(--space-sm);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.admin-payment-related-title[b-d7z5fht9hn] {
    font-weight: 500;
}

.admin-payment-actions[b-d7z5fht9hn] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
}

.admin-payment-success[b-d7z5fht9hn] {
    margin: 0;
    color: var(--color-success, var(--color-primary));
    font-size: var(--font-size-sm);
}

.btn[b-d7z5fht9hn] {
    padding: var(--space-sm) var(--space-lg);
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    font-weight: 500;
    cursor: pointer;
    transition: opacity var(--transition-fast), background var(--transition-fast), border-color var(--transition-fast);
}

.btn:disabled[b-d7z5fht9hn] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-secondary[b-d7z5fht9hn] {
    background: var(--color-border);
    color: var(--color-on-surface);
}

.btn-primary[b-d7z5fht9hn] {
    background: var(--color-primary);
    color: var(--color-on-primary, #fff);
}

@media (max-width: 640px) {
    .admin-payment-card-header[b-d7z5fht9hn] {
        flex-direction: column;
        align-items: flex-start;
    }

    .admin-payment-actions[b-d7z5fht9hn] {
        flex-direction: column;
    }
}

@keyframes admin-payments-spin-b-d7z5fht9hn {
    to {
        transform: rotate(360deg);
    }
}
/* /Pages/Admin/AdminPayments.razor.rz.scp.css */
.admin-payments-page[b-8tgjhbqql5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-md) 0;
}

.admin-payments-list[b-8tgjhbqql5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.admin-payment-card[b-8tgjhbqql5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    width: 100%;
    padding: var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-card);
    color: var(--color-on-surface);
    cursor: pointer;
    text-align: left;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
}

.admin-payment-card:hover[b-8tgjhbqql5] {
    border-color: var(--color-primary);
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}

.admin-payment-card-selected[b-8tgjhbqql5] {
    border-color: var(--color-primary);
    background: var(--color-warning-tint);
}

.admin-payment-card-header[b-8tgjhbqql5] {
    display: flex;
    justify-content: space-between;
    gap: var(--space-md);
    align-items: flex-start;
}

.admin-payment-card-customer[b-8tgjhbqql5],
.admin-payment-card-amount[b-8tgjhbqql5] {
    font-weight: 500;
}

.admin-payment-card-amount[b-8tgjhbqql5] {
    white-space: nowrap;
}

.admin-payment-card-description[b-8tgjhbqql5],
.admin-payment-card-created[b-8tgjhbqql5],
.admin-payment-related-meta[b-8tgjhbqql5],
.admin-payment-label[b-8tgjhbqql5],
.admin-cancel-section-hint[b-8tgjhbqql5],
.admin-cancel-booking-date[b-8tgjhbqql5],
.admin-cancel-empty[b-8tgjhbqql5] {
    color: var(--color-on-surface-dim);
}

.admin-payment-card-description[b-8tgjhbqql5],
.admin-payment-description[b-8tgjhbqql5],
.admin-payment-related-meta[b-8tgjhbqql5],
.admin-payment-label[b-8tgjhbqql5],
.admin-cancel-section-hint[b-8tgjhbqql5],
.admin-cancel-booking-row[b-8tgjhbqql5],
.admin-cancel-empty[b-8tgjhbqql5],
.admin-cancel-label[b-8tgjhbqql5],
.admin-cancel-reason[b-8tgjhbqql5],
.btn[b-8tgjhbqql5] {
    font-size: var(--font-size-sm);
}

.admin-payment-card-description[b-8tgjhbqql5],
.admin-payment-description[b-8tgjhbqql5] {
    margin: 0;
}

.admin-payment-card-created[b-8tgjhbqql5] {
    font-size: var(--font-size-xs);
}

.admin-payments-empty[b-8tgjhbqql5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-sm);
}

.admin-payments-empty-hint[b-8tgjhbqql5] {
    margin: 0;
    color: var(--color-on-surface-dim);
    text-align: center;
}

.admin-payments-loading[b-8tgjhbqql5] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 12rem;
}

.admin-payments-spinner[b-8tgjhbqql5] {
    width: 2.5rem;
    height: 2.5rem;
    border: 3px solid var(--color-border);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: admin-payments-spin-b-8tgjhbqql5 0.8s linear infinite;
}

.admin-payment-detail[b-8tgjhbqql5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
}

.admin-payment-section[b-8tgjhbqql5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.admin-payment-section-title[b-8tgjhbqql5],
.admin-cancel-section-title[b-8tgjhbqql5] {
    margin: 0;
    font-size: var(--font-size-base);
    font-weight: 500;
}

.admin-payment-info-grid[b-8tgjhbqql5] {
    display: grid;
    grid-template-columns: minmax(0, auto) minmax(0, 1fr);
    gap: var(--space-xs) var(--space-md);
}

.admin-payment-value[b-8tgjhbqql5] {
    word-break: break-word;
}

.admin-payment-related-list[b-8tgjhbqql5],
.admin-cancel-section[b-8tgjhbqql5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.admin-payment-related-item[b-8tgjhbqql5],
.admin-cancel-booking-row[b-8tgjhbqql5],
.admin-cancel-options[b-8tgjhbqql5] {
    padding: var(--space-sm);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.admin-payment-related-item[b-8tgjhbqql5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.admin-payment-related-title[b-8tgjhbqql5],
.admin-cancel-booking-name[b-8tgjhbqql5] {
    font-weight: 500;
}

.admin-payment-actions[b-8tgjhbqql5] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
}

.admin-cancel-section-hint[b-8tgjhbqql5],
.admin-payment-dialog-error[b-8tgjhbqql5] {
    margin: 0;
}

.admin-cancel-warning[b-8tgjhbqql5],
.admin-payment-dialog-error[b-8tgjhbqql5] {
    color: var(--color-error);
}

.admin-cancel-warning[b-8tgjhbqql5] {
    margin: 0;
    padding: var(--space-sm);
    border-radius: var(--radius-md);
    background: var(--color-error-tint);
}

.admin-cancel-booking-row[b-8tgjhbqql5] {
    display: flex;
    justify-content: space-between;
    gap: var(--space-md);
    align-items: center;
}

.admin-cancel-options[b-8tgjhbqql5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.admin-cancel-checkbox[b-8tgjhbqql5] {
    display: flex;
    gap: var(--space-sm);
    align-items: center;
    font-weight: 500;
}

.admin-cancel-reason[b-8tgjhbqql5] {
    min-height: 6rem;
    width: 100%;
    padding: var(--space-sm);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-on-surface);
    font-family: inherit;
    resize: vertical;
}

.admin-cancel-reason:focus[b-8tgjhbqql5] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.btn[b-8tgjhbqql5] {
    padding: var(--space-sm) var(--space-lg);
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    font-weight: 500;
    cursor: pointer;
    transition: opacity var(--transition-fast), background var(--transition-fast), border-color var(--transition-fast);
}

.btn:disabled[b-8tgjhbqql5] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-secondary[b-8tgjhbqql5] {
    background: var(--color-border);
    color: var(--color-on-surface);
}

.btn-primary[b-8tgjhbqql5] {
    background: var(--color-primary);
    color: var(--color-on-primary, #fff);
}

.btn-danger[b-8tgjhbqql5] {
    background: transparent;
    border-color: var(--color-error);
    color: var(--color-error);
}

@media (max-width: 640px) {
    .admin-payment-card-header[b-8tgjhbqql5],
    .admin-cancel-booking-row[b-8tgjhbqql5] {
        flex-direction: column;
        align-items: flex-start;
    }

    .admin-payment-actions[b-8tgjhbqql5] {
        flex-direction: column;
    }
}

@keyframes admin-payments-spin-b-8tgjhbqql5 {
    to {
        transform: rotate(360deg);
    }
}
/* /Pages/Auth/Login.razor.rz.scp.css */
.login-loading[b-swful3nl2z] {
    display: flex;
    justify-content: center;
    padding: var(--space-2xl) 0;
}

.login-step[b-swful3nl2z] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

.login-subtitle[b-swful3nl2z] {
    text-align: center;
    color: var(--color-on-surface-dim);
    font-size: var(--font-size-sm);
    margin-bottom: var(--space-sm);
}

.form-group[b-swful3nl2z] {
    display: flex;
    flex-direction: column;
}

.form-input[b-swful3nl2z] {
    height: 48px;
    padding: 0 var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-size: var(--font-size-base);
    font-family: var(--font-body);
    background: var(--color-surface);
    color: var(--color-on-surface);
    outline: none;
    transition: border-color var(--transition-fast);
    width: 100%;
}

.form-input:focus[b-swful3nl2z] {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(107, 78, 170, 0.15);
}

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

.form-input[b-swful3nl2z]::placeholder {
    color: var(--color-on-surface-dim);
}

.error-message[b-swful3nl2z] {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    text-align: center;
}

.btn-primary[b-swful3nl2z] {
    height: 48px;
    width: 100%;
    border: none;
    border-radius: var(--radius-md);
    background: var(--color-primary);
    color: #fff;
    font-size: var(--font-size-base);
    font-weight: 500;
    font-family: var(--font-body);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity var(--transition-fast);
}

.btn-primary:hover:not(:disabled)[b-swful3nl2z] {
    opacity: 0.9;
}

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

.btn-back[b-swful3nl2z] {
    background: none;
    border: none;
    color: var(--color-on-surface-dim);
    font-size: var(--font-size-sm);
    font-family: var(--font-body);
    cursor: pointer;
    align-self: flex-start;
    padding: 0;
    transition: color var(--transition-fast);
}

.btn-back:hover[b-swful3nl2z] {
    color: var(--color-on-surface);
}

.btn-link[b-swful3nl2z] {
    background: none;
    border: none;
    color: var(--color-primary);
    font-size: var(--font-size-sm);
    font-family: var(--font-body);
    cursor: pointer;
    padding: 0;
    text-decoration: underline;
}

.btn-link:hover[b-swful3nl2z] {
    opacity: 0.8;
}

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

.otp-heading[b-swful3nl2z] {
    text-align: center;
    font-size: var(--font-size-xl);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.otp-destination[b-swful3nl2z] {
    text-align: center;
    color: var(--color-on-surface-dim);
    font-size: var(--font-size-sm);
}

.resend-area[b-swful3nl2z] {
    text-align: center;
}

.resend-timer[b-swful3nl2z] {
    color: var(--color-on-surface-dim);
    font-size: var(--font-size-sm);
}

.language-selector[b-swful3nl2z] {
    display: flex;
    justify-content: center;
    margin-top: var(--space-sm);
}

.language-selector select[b-swful3nl2z] {
    background: transparent;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    padding: var(--space-xs) var(--space-sm);
    font-size: var(--font-size-sm);
    font-family: var(--font-body);
    color: var(--color-on-surface-dim);
    cursor: pointer;
    outline: none;
}

.language-selector select:focus[b-swful3nl2z] {
    border-color: var(--color-primary);
}

.spinner[b-swful3nl2z] {
    width: 32px;
    height: 32px;
    border: 3px solid var(--color-border);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: spin-b-swful3nl2z 0.8s linear infinite;
}

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

@keyframes spin-b-swful3nl2z {
    to {
        transform: rotate(360deg);
    }
}
/* /Pages/Auth/Onboarding.razor.rz.scp.css */
.onboarding-form[b-wcpnckikxr] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

.onboarding-heading[b-wcpnckikxr] {
    text-align: center;
    font-size: var(--font-size-xl);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0 0 var(--space-sm) 0;
}

.form-group[b-wcpnckikxr] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.form-label[b-wcpnckikxr] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface);
}

.form-input[b-wcpnckikxr] {
    height: 48px;
    padding: 0 var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-size: var(--font-size-base);
    font-family: var(--font-body);
    background: var(--color-surface);
    color: var(--color-on-surface);
    outline: none;
    transition: border-color var(--transition-fast);
    width: 100%;
}

.form-input:focus[b-wcpnckikxr] {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(107, 78, 170, 0.15);
}

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

.gender-group[b-wcpnckikxr] {
    display: flex;
    gap: var(--space-lg);
    padding: var(--space-sm) 0;
}

.radio-label[b-wcpnckikxr] {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    cursor: pointer;
}

.radio-label input[type="radio"][b-wcpnckikxr] {
    accent-color: var(--color-primary);
    width: 16px;
    height: 16px;
    margin: 0;
}

.consent-label[b-wcpnckikxr] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-xs);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    cursor: pointer;
    line-height: 1.4;
}

.consent-checkbox[b-wcpnckikxr] {
    accent-color: var(--color-primary);
    width: 18px;
    height: 18px;
    margin: 1px 0 0 0;
    flex-shrink: 0;
}

.consent-text a[b-wcpnckikxr] {
    color: var(--color-primary);
    text-decoration: underline;
}

.error-message[b-wcpnckikxr] {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    text-align: center;
}

.btn-primary[b-wcpnckikxr] {
    height: 48px;
    width: 100%;
    border: none;
    border-radius: var(--radius-md);
    background: var(--color-primary);
    color: #fff;
    font-size: var(--font-size-base);
    font-weight: 500;
    font-family: var(--font-body);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity var(--transition-fast);
    margin-top: var(--space-sm);
}

.btn-primary:hover:not(:disabled)[b-wcpnckikxr] {
    opacity: 0.9;
}

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

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

@keyframes spin-b-wcpnckikxr {
    to {
        transform: rotate(360deg);
    }
}
/* /Pages/Bookings/BookingDetail.razor.rz.scp.css */
.booking-detail-page[b-t6ozxhsye1] {
    max-width: 600px;
    margin: 0 auto;
    padding: var(--space-lg);
}

.booking-detail-skeleton[b-t6ozxhsye1] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-lg);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
}

.booking-detail-content[b-t6ozxhsye1] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
}

.btn[b-t6ozxhsye1] {
    padding: var(--space-sm) var(--space-lg);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
    border: none;
    transition: opacity var(--transition-fast);
}

.btn:hover:not(:disabled)[b-t6ozxhsye1] {
    opacity: 0.85;
}

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

.btn-secondary[b-t6ozxhsye1] {
    background: var(--color-border);
    color: var(--color-on-surface);
}

.btn-outline-danger[b-t6ozxhsye1] {
    background: transparent;
    color: var(--color-error);
    border: 1px solid var(--color-error);
}

.btn-outline-danger:hover:not(:disabled)[b-t6ozxhsye1] {
    background: var(--color-error-tint);
    color: var(--color-error);
}

@media (max-width: 767px) {
    .booking-detail-page[b-t6ozxhsye1] {
        padding: var(--space-md);
    }
}
/* /Pages/Bookings/BookingHistory.razor.rz.scp.css */
.history-page[b-e5p8kp2klu] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-md) 0;
}

/* Skeleton */
.history-skeleton[b-e5p8kp2klu] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.history-skeleton-row[b-e5p8kp2klu] {
    display: flex;
    gap: var(--space-md);
    padding: var(--space-sm) var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
}

/* Table (desktop) */
.history-table-wrapper[b-e5p8kp2klu] {
    overflow-x: auto;
}

.desktop-table[b-e5p8kp2klu] {
    display: none;
}

.history-table[b-e5p8kp2klu] {
    width: 100%;
    border-collapse: collapse;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.history-th[b-e5p8kp2klu] {
    text-align: left;
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--color-on-surface-dim);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--color-border);
    white-space: nowrap;
    user-select: none;
}

.history-th-sortable[b-e5p8kp2klu] {
    cursor: pointer;
}

.history-th-sortable:hover[b-e5p8kp2klu] {
    color: var(--color-primary);
}

.history-th-sorted[b-e5p8kp2klu] {
    color: var(--color-primary);
}

.history-row[b-e5p8kp2klu] {
    cursor: pointer;
    transition: background var(--transition-fast);
}

.history-row:hover[b-e5p8kp2klu] {
    background: var(--color-background);
}

.history-td[b-e5p8kp2klu] {
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    border-bottom: 1px solid var(--color-border);
    white-space: nowrap;
}

.history-td-name[b-e5p8kp2klu] {
    font-weight: 500;
    white-space: normal;
}

.history-status[b-e5p8kp2klu] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    padding: 2px var(--space-sm);
    border-radius: var(--radius-full);
}

.history-status-attended[b-e5p8kp2klu],
.history-status-confirmed[b-e5p8kp2klu] {
    background: var(--color-success-tint);
    color: var(--color-success);
}

.history-status-cancelled[b-e5p8kp2klu] {
    background: var(--color-error-tint);
    color: var(--color-error);
}

.history-status-pending[b-e5p8kp2klu] {
    background: var(--color-warning-tint);
    color: var(--color-warning);
}

/* Mobile cards */
.mobile-cards[b-e5p8kp2klu] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

/* Load more */
.history-load-more[b-e5p8kp2klu] {
    align-self: center;
    padding: var(--space-sm) var(--space-xl);
    background: none;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    color: var(--color-primary);
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
    transition: background var(--transition-fast);
}

.history-load-more:hover[b-e5p8kp2klu] {
    background: var(--color-background);
}

@media (min-width: 1025px) {
    .desktop-table[b-e5p8kp2klu] {
        display: block;
    }

    .mobile-cards[b-e5p8kp2klu] {
        display: none;
    }

    .history-skeleton-row[b-e5p8kp2klu] {
        display: grid;
        grid-template-columns: repeat(6, 1fr);
    }
}
/* /Pages/Bookings/BookingsRegular.razor.rz.scp.css */
.bookings-page[b-58vzu7ld1g] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-md) 0;
}

.active-count[b-58vzu7ld1g] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    margin: 0;
}

.list-skeleton[b-58vzu7ld1g] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.checkin-list[b-58vzu7ld1g] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.checkin-item[b-58vzu7ld1g] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    transition: border-color var(--transition-fast);
}

.checkin-item:hover[b-58vzu7ld1g] {
    border-color: var(--color-primary);
}

.checkin-info[b-58vzu7ld1g] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.checkin-day-time[b-58vzu7ld1g] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
}

.checkin-secondary[b-58vzu7ld1g] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
}

.checkin-actions[b-58vzu7ld1g] {
    display: flex;
    align-items: center;
}

/* Stop regular spot — outlined error style (UI-SPEC destructive action) */
.btn-stop-regular[b-58vzu7ld1g] {
    padding: var(--space-xs) var(--space-md);
    border: 1px solid var(--color-error);
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--color-error);
    font-size: var(--font-size-sm);
    font-weight: 700;
    cursor: pointer;
    transition: opacity var(--transition-fast);
    white-space: nowrap;
    min-height: 36px;
}

.btn-stop-regular:hover:not(:disabled)[b-58vzu7ld1g] {
    background: var(--color-error);
    color: #fff;
    opacity: 1;
}

.btn-stop-regular:focus-visible[b-58vzu7ld1g] {
    outline: 2px solid var(--color-error);
    outline-offset: 2px;
}

/* Explanation card (replaces plain info-text) */
.info-card[b-58vzu7ld1g] {
    padding: var(--space-md) 0 0;
}

.info-card-title[b-58vzu7ld1g] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0 0 var(--space-xs);
}

.info-card-body[b-58vzu7ld1g] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
    line-height: 1.5;
    margin: 0;
}

.spinner-sm[b-58vzu7ld1g] {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 2px solid var(--color-border);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: spin-b-58vzu7ld1g 0.8s linear infinite;
}

@keyframes spin-b-58vzu7ld1g {
    to { transform: rotate(360deg); }
}
/* /Pages/ClassDetailPage.razor.rz.scp.css */
.class-detail[b-jnjy8jwzp6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
}

.class-detail-link[b-jnjy8jwzp6] {
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    color: var(--color-primary);
    cursor: pointer;
    font-family: inherit;
    font-size: inherit;
    text-decoration: underline;
    text-align: left;
}

.class-detail-link:hover[b-jnjy8jwzp6],
.class-detail-link:focus-visible[b-jnjy8jwzp6] {
    color: var(--color-primary-dark, var(--color-primary));
}

.class-detail-link-copy[b-jnjy8jwzp6] {
    background: none;
    border: none;
    padding: var(--space-xs);
    margin: 0;
    cursor: pointer;
    font-size: inherit;
    line-height: 1;
    color: inherit;
}

.class-detail-link-copy:hover[b-jnjy8jwzp6],
.class-detail-link-copy:focus-visible[b-jnjy8jwzp6] {
    background: var(--color-surface-variant, rgba(0, 0, 0, 0.05));
    border-radius: var(--radius-sm, 4px);
}

.class-detail-skeleton[b-jnjy8jwzp6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-md);
}

/* Header */
.class-detail-header[b-jnjy8jwzp6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.class-detail-name[b-jnjy8jwzp6] {
    font-family: var(--font-display);
    font-size: var(--font-size-2xl);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
    line-height: 1.2;
}

.class-detail-instructor[b-jnjy8jwzp6] {
    font-size: var(--font-size-base);
    color: var(--color-on-surface-dim);
}

/* Time info */
.class-detail-time-info[b-jnjy8jwzp6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.class-detail-row[b-jnjy8jwzp6] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
}

.class-detail-icon[b-jnjy8jwzp6] {
    flex-shrink: 0;
    width: 1.25rem;
    text-align: center;
}

/* Capacity */
.class-detail-capacity[b-jnjy8jwzp6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.class-detail-spots-row[b-jnjy8jwzp6] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

.class-detail-spots[b-jnjy8jwzp6] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
}

.class-detail-badge-warning[b-jnjy8jwzp6] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    padding: 2px var(--space-sm);
    border-radius: var(--radius-full);
    background: var(--color-warning-tint);
    color: var(--color-warning);
}

.class-detail-badge-row[b-jnjy8jwzp6] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-xs);
}

.class-detail-badge-credit[b-jnjy8jwzp6] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    padding: var(--space-xs) var(--space-sm);
    border-radius: var(--radius-full);
    background: var(--color-success-tint);
    color: var(--color-success);
}

.class-detail-badge-price[b-jnjy8jwzp6] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    padding: var(--space-xs) var(--space-sm);
    border-radius: var(--radius-full);
    background: var(--color-surface-dim, #f0f0ec);
    color: var(--color-on-surface);
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.class-detail-badge-crossed[b-jnjy8jwzp6] {
    font-weight: 400;
    opacity: 0.6;
}

/* Sections */
.class-detail-section[b-jnjy8jwzp6] {
    padding-top: var(--space-sm);
    border-top: 1px solid var(--color-border);
}

.class-detail-description[b-jnjy8jwzp6] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    line-height: 1.5;
    margin: 0;
    white-space: pre-line;
}

/* Price */
.class-detail-credit-info[b-jnjy8jwzp6],
.class-detail-price-info[b-jnjy8jwzp6] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

.class-detail-price-original[b-jnjy8jwzp6] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    text-decoration: line-through;
}

.class-detail-price-current[b-jnjy8jwzp6] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
}

/* Action buttons */
.class-detail-actions[b-jnjy8jwzp6] {
    padding-top: var(--space-sm);
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.class-detail-btn[b-jnjy8jwzp6] {
    width: 100%;
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius-md);
    font-size: var(--font-size-base);
    font-weight: 500;
    cursor: pointer;
    border: none;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-sm);
    transition: opacity var(--transition-fast);
}

.class-detail-btn:hover:not(:disabled)[b-jnjy8jwzp6] {
    opacity: 0.85;
}

.class-detail-btn:disabled[b-jnjy8jwzp6] {
    opacity: 0.5;
    cursor: not-allowed;
}

.class-detail-btn:focus-visible[b-jnjy8jwzp6] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.class-detail-btn-primary[b-jnjy8jwzp6] {
    background: var(--color-primary);
    color: #fff;
}

.class-detail-btn-secondary[b-jnjy8jwzp6] {
    background: var(--color-secondary);
    color: #fff;
}

.class-detail-btn-outlined[b-jnjy8jwzp6] {
    background: transparent;
    border: 1px solid var(--color-primary);
    color: var(--color-primary);
}

.class-detail-btn-warning[b-jnjy8jwzp6] {
    background: transparent;
    border: 1px solid var(--color-warning);
    color: var(--color-warning);
}

.class-detail-btn-cancel[b-jnjy8jwzp6] {
    background: transparent;
    border: 1px solid var(--color-error);
    color: var(--color-error);
}

.class-detail-btn-disabled[b-jnjy8jwzp6] {
    background: var(--color-border);
    color: var(--color-on-surface-dim);
}

/* Spinner */
.class-detail-spinner[b-jnjy8jwzp6] {
    width: 16px;
    height: 16px;
    border: 2px solid currentColor;
    border-top-color: transparent;
    border-radius: 50%;
    animation: detail-spin-b-jnjy8jwzp6 0.6s linear infinite;
}

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

/* Auto Check-In toggle */
.class-detail-auto-checkin[b-jnjy8jwzp6] {
    padding-top: var(--space-sm);
    border-top: 1px solid var(--color-border);
}

.class-detail-toggle[b-jnjy8jwzp6] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    cursor: pointer;
    font-size: var(--font-size-sm);
}

.class-detail-toggle input[type="checkbox"][b-jnjy8jwzp6] {
    width: 18px;
    height: 18px;
    accent-color: var(--color-primary);
    cursor: pointer;
}

.class-detail-toggle-label[b-jnjy8jwzp6] {
    color: var(--color-on-surface);
    user-select: none;
}

@media (max-width: 767px) {
    .class-detail-btn[b-jnjy8jwzp6] {
        min-height: 48px;
    }
}

/* Instructor roster */
.class-detail-roster-subtitle[b-jnjy8jwzp6] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    letter-spacing: 0.05em;
    color: var(--color-on-surface-dim);
    text-transform: uppercase;
    margin-bottom: var(--space-sm);
}

.class-detail-roster-list[b-jnjy8jwzp6] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.class-detail-roster-item[b-jnjy8jwzp6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    padding: var(--space-xs) 0;
    border-bottom: 1px solid var(--color-border);
}

.class-detail-roster-item:last-child[b-jnjy8jwzp6] {
    border-bottom: none;
}

.class-detail-roster-name[b-jnjy8jwzp6] {
    flex: 1;
}

.class-detail-roster-badge[b-jnjy8jwzp6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 10px;
    border-radius: var(--radius-sm, 4px);
    font-size: var(--font-size-xs);
    font-weight: 500;
    white-space: nowrap;
    margin-left: var(--space-sm);
}

.class-detail-badge-paid[b-jnjy8jwzp6] {
    background: rgba(34, 139, 34, 0.12);
    color: #1a7a1a;
}

.class-detail-badge-unpaid[b-jnjy8jwzp6] {
    background: rgba(245, 166, 35, 0.15);
    color: #a66800;
}

.class-detail-roster-status[b-jnjy8jwzp6] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
    margin-left: var(--space-sm);
}

.class-detail-roster-empty[b-jnjy8jwzp6] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    margin: 0;
    padding: var(--space-xs) 0;
}

.class-detail-page[b-jnjy8jwzp6] {
    max-width: 600px;
    margin: 0 auto;
    padding: var(--space-lg);
}

.class-detail-page-header[b-jnjy8jwzp6] {
    margin-bottom: var(--space-lg);
}

.class-detail-page-back[b-jnjy8jwzp6] {
    background: none;
    border: none;
    color: var(--color-primary);
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
    padding: var(--space-xs) var(--space-sm);
    border-radius: var(--radius-sm);
    transition: background var(--transition-fast);
}

.class-detail-page-back:hover[b-jnjy8jwzp6] {
    background: var(--color-border);
}

.class-detail-page-back:focus-visible[b-jnjy8jwzp6] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.class-detail-page-content[b-jnjy8jwzp6] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--space-lg);
}

@media (max-width: 767px) {
    .class-detail-page[b-jnjy8jwzp6] {
        padding: var(--space-md);
    }

    .class-detail-page-content[b-jnjy8jwzp6] {
        padding: var(--space-md);
    }
}
/* /Pages/Membership/BuildCustomMembership.razor.rz.scp.css */
.customize-page[b-4a7mr1kuyr] {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
    padding: var(--space-md) 0;
}

/* Skeleton */
.customize-skeleton[b-4a7mr1kuyr] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-lg);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
}

.customize-skeleton-row[b-4a7mr1kuyr] {
    display: flex;
    justify-content: space-between;
    gap: var(--space-md);
}

/* Two-column layout */
.customize-layout[b-4a7mr1kuyr] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-xl);
    align-items: start;
}

@media (max-width: 768px) {
    .customize-layout[b-4a7mr1kuyr] {
        grid-template-columns: 1fr;
    }
}

.customize-section-title[b-4a7mr1kuyr] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0 0 var(--space-md);
}

/* Steppers */
.customize-steppers[b-4a7mr1kuyr] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

.stepper-row[b-4a7mr1kuyr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.stepper-info[b-4a7mr1kuyr] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.stepper-name[b-4a7mr1kuyr] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
}

.stepper-price[b-4a7mr1kuyr] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
}

.stepper-controls[b-4a7mr1kuyr] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

.stepper-btn[b-4a7mr1kuyr] {
    width: 36px;
    height: 36px;
    border-radius: var(--radius-full);
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    color: var(--color-on-surface);
    font-size: var(--font-size-lg);
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background var(--transition-fast), border-color var(--transition-fast);
    min-height: 36px;
    min-width: 36px;
}

.stepper-btn:hover:not(:disabled)[b-4a7mr1kuyr] {
    background: var(--color-primary-tint);
    border-color: var(--color-primary);
}

.stepper-btn:disabled[b-4a7mr1kuyr] {
    opacity: 0.3;
    cursor: not-allowed;
}

.stepper-value[b-4a7mr1kuyr] {
    font-size: var(--font-size-lg);
    font-weight: 500;
    color: var(--color-on-surface);
    min-width: 32px;
    text-align: center;
}

/* Tier info */
.tier-info[b-4a7mr1kuyr] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-sm);
    padding: var(--space-sm) var(--space-md);
    background: var(--color-info-tint, var(--color-primary-tint));
    border-radius: var(--radius-md);
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
}

.tier-info-icon[b-4a7mr1kuyr] {
    font-size: var(--font-size-sm);
}

.tier-info-item[b-4a7mr1kuyr] {
    padding: 2px 6px;
    background: var(--color-surface);
    border-radius: var(--radius-sm);
}

/* Promo section */
.promo-section[b-4a7mr1kuyr] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.promo-label[b-4a7mr1kuyr] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface);
}

.promo-input[b-4a7mr1kuyr] {
    padding: var(--space-sm) var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-on-surface);
    font-size: var(--font-size-base);
    min-height: 44px;
    transition: border-color var(--transition-fast);
}

.promo-input:focus[b-4a7mr1kuyr] {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(107, 78, 170, 0.15);
}

/* Preview */
.customize-preview[b-4a7mr1kuyr] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    position: sticky;
    top: calc(var(--nav-height) + var(--space-md));
}

@media (max-width: 768px) {
    .customize-preview[b-4a7mr1kuyr] {
        position: static;
    }
}

.preview-card[b-4a7mr1kuyr] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--space-lg);
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.preview-row[b-4a7mr1kuyr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
}

.preview-value[b-4a7mr1kuyr] {
    font-weight: 500;
}

.preview-divider[b-4a7mr1kuyr] {
    height: 1px;
    background: var(--color-border);
    margin: var(--space-xs) 0;
}

.preview-discount[b-4a7mr1kuyr] {
    color: var(--color-secondary);
}

.preview-total[b-4a7mr1kuyr] {
    font-size: var(--font-size-base);
    font-weight: 500;
}

.preview-total .preview-value[b-4a7mr1kuyr] {
    font-weight: 500;
}

.preview-empty[b-4a7mr1kuyr] {
    text-align: center;
    color: var(--color-on-surface-dim);
    font-size: var(--font-size-sm);
    padding: var(--space-lg);
}

.customize-form-error[b-4a7mr1kuyr] {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    margin: 0;
    text-align: center;
}

.customize-cta[b-4a7mr1kuyr] {
    background: var(--color-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-base);
    font-weight: 500;
    cursor: pointer;
    min-height: 44px;
    transition: background var(--transition-fast);
}

.customize-cta:hover:not(:disabled)[b-4a7mr1kuyr] {
    background: var(--color-primary-hover, #802820);
}

.customize-cta:disabled[b-4a7mr1kuyr] {
    opacity: 0.5;
    cursor: not-allowed;
}
/* /Pages/Membership/MembershipPurchase.razor.rz.scp.css */
.purchase-page[b-7oix17p19q] {
    max-width: 600px;
    margin: 0 auto;
    padding: var(--space-lg) var(--space-md);
    position: relative;
    min-height: 400px;
}

.purchase-loading[b-7oix17p19q] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-lg);
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
}

/* Overlay */
.purchase-overlay[b-7oix17p19q] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.purchase-overlay-content[b-7oix17p19q] {
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    padding: var(--space-2xl) var(--space-xl);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-md);
    min-width: 280px;
    box-shadow: var(--elevation-xl);
}

.purchase-spinner[b-7oix17p19q] {
    width: 48px;
    height: 48px;
    border: 3px solid var(--color-border);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: spin-b-7oix17p19q 1s linear infinite;
}

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

.purchase-overlay-title[b-7oix17p19q] {
    font-size: var(--font-size-lg);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.purchase-overlay-detail[b-7oix17p19q] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    margin: 0;
}

/* Success */
.purchase-success[b-7oix17p19q] {
    text-align: center;
    padding: var(--space-2xl) var(--space-lg);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-md);
}

.purchase-success-icon[b-7oix17p19q] {
    font-size: 3rem;
    animation: success-bounce 0.5s ease-out;
}

.purchase-success-title[b-7oix17p19q] {
    font-size: var(--font-size-xl);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.purchase-success-actions[b-7oix17p19q] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    width: 100%;
    margin-top: var(--space-md);
}

.purchase-success-message[b-7oix17p19q] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    white-space: pre-line;
    margin: 0;
}

/* Form */
.purchase-form[b-7oix17p19q] {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
    transition: opacity var(--transition-base);
}

.purchase-form-dimmed[b-7oix17p19q] {
    opacity: 0.4;
    pointer-events: none;
}

.purchase-section-title[b-7oix17p19q] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0 0 var(--space-sm);
}

/* Summary */
.purchase-summary[b-7oix17p19q] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--space-lg);
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.purchase-row[b-7oix17p19q] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
}

.purchase-value[b-7oix17p19q] {
    font-weight: 500;
}

.purchase-dim[b-7oix17p19q] {
    color: var(--color-on-surface-dim);
}

.purchase-discount[b-7oix17p19q] {
    color: var(--color-secondary);
}

.purchase-divider[b-7oix17p19q] {
    height: 1px;
    background: var(--color-border);
    margin: var(--space-xs) 0;
}

.purchase-total[b-7oix17p19q] {
    font-size: var(--font-size-base);
    font-weight: 500;
}

.purchase-total .purchase-value[b-7oix17p19q] {
    font-weight: 500;
}

/* Promo */
.purchase-promo[b-7oix17p19q] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.purchase-promo-label[b-7oix17p19q] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface);
}

.purchase-promo-row[b-7oix17p19q] {
    display: flex;
    gap: var(--space-sm);
}

.purchase-promo-input[b-7oix17p19q] {
    flex: 1;
    padding: var(--space-sm) var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-on-surface);
    font-size: var(--font-size-base);
    min-height: 44px;
}

.purchase-promo-input:focus[b-7oix17p19q] {
    outline: none;
    border-color: var(--color-primary);
}

.purchase-promo-btn[b-7oix17p19q] {
    padding: var(--space-sm) var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-primary);
    border-radius: var(--radius-md);
    color: var(--color-primary);
    font-weight: 500;
    cursor: pointer;
    min-height: 44px;
    transition: background var(--transition-fast);
}

.purchase-promo-btn:hover:not(:disabled)[b-7oix17p19q] {
    background: var(--color-primary-tint);
}

.purchase-promo-btn:disabled[b-7oix17p19q] {
    opacity: 0.5;
}

/* Methods */
.purchase-methods[b-7oix17p19q] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.purchase-method-options[b-7oix17p19q] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-sm);
}

.purchase-method-option[b-7oix17p19q] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    padding: var(--space-md);
    background: var(--color-surface);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-md);
    cursor: pointer;
    min-height: 44px;
    font-weight: 500;
    transition: border-color var(--transition-fast), background var(--transition-fast);
}

.purchase-method-option:hover[b-7oix17p19q] {
    border-color: var(--color-primary);
}

.purchase-method-selected[b-7oix17p19q] {
    border-color: var(--color-primary);
    background: var(--color-primary-tint);
}

.purchase-method-icon[b-7oix17p19q] {
    font-size: var(--font-size-xl);
}

/* BLIK/Cards */
.purchase-blik[b-7oix17p19q] {
    padding: var(--space-md) 0;
}

.purchase-cards[b-7oix17p19q] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.saved-card-option[b-7oix17p19q] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    padding: var(--space-md);
    background: var(--color-surface);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-md);
    cursor: pointer;
    min-height: 44px;
    width: 100%;
    text-align: left;
    font-size: var(--font-size-base);
    font-weight: 500;
    transition: border-color var(--transition-fast);
}

.saved-card-option:hover[b-7oix17p19q] {
    border-color: var(--color-primary);
}

.saved-card-selected[b-7oix17p19q] {
    border-color: var(--color-primary);
    background: var(--color-primary-tint);
}

.purchase-no-cards[b-7oix17p19q] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    text-align: center;
    padding: var(--space-md);
}

.purchase-form-error[b-7oix17p19q] {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    margin: 0;
    text-align: center;
}

/* Buttons */
.purchase-btn-primary[b-7oix17p19q] {
    display: block;
    background: var(--color-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-base);
    font-weight: 500;
    cursor: pointer;
    min-height: 44px;
    text-align: center;
    text-decoration: none;
    transition: background var(--transition-fast);
    line-height: 1.5;
}

.purchase-btn-primary:hover[b-7oix17p19q] {
    background: var(--color-primary-hover, #802820);
}

.purchase-btn-primary:disabled[b-7oix17p19q] {
    opacity: 0.5;
    cursor: not-allowed;
}

.purchase-btn-secondary[b-7oix17p19q] {
    display: block;
    background: var(--color-surface);
    color: var(--color-primary);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-base);
    font-weight: 500;
    cursor: pointer;
    min-height: 44px;
    text-align: center;
    text-decoration: none;
    transition: background var(--transition-fast);
    line-height: 1.5;
}

.purchase-btn-secondary:hover[b-7oix17p19q] {
    background: var(--color-background);
}

.purchase-submit[b-7oix17p19q] {
    margin-top: var(--space-sm);
}

.purchase-error-actions[b-7oix17p19q] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    width: 100%;
}

/* Cash section */
.purchase-cash-section[b-7oix17p19q] {
    text-align: center;
    padding: 1.5rem;
}

.purchase-cash-info[b-7oix17p19q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

.purchase-cash-icon[b-7oix17p19q] {
    font-size: 2rem;
}

.purchase-header[b-7oix17p19q] {
    margin-bottom: var(--space-sm);
}

.purchase-back[b-7oix17p19q] {
    background: none;
    border: none;
    color: var(--color-primary);
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
    padding: var(--space-xs) var(--space-sm);
    border-radius: var(--radius-sm);
    transition: background var(--transition-fast);
}

.purchase-back:hover[b-7oix17p19q] {
    background: var(--color-border);
}

.purchase-back:focus-visible[b-7oix17p19q] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}
/* /Pages/Membership/MyMembership.razor.rz.scp.css */
.myplan-page[b-n0xhj6iz91] { display: flex; flex-direction: column; gap: var(--space-lg); padding: var(--space-md) 0; }
.membership-tabs[b-n0xhj6iz91] { display: flex; gap: var(--space-sm); overflow-x: auto; border-bottom: 1px solid var(--color-border); }
.membership-tab[b-n0xhj6iz91] { background: transparent; border: none; border-bottom: 2px solid transparent; color: var(--color-on-surface-dim); cursor: pointer; font-size: var(--font-size-base); font-weight: 500; min-height: 44px; padding: var(--space-sm) var(--space-md); transition: border-color var(--transition-fast), color var(--transition-fast); white-space: nowrap; }
.membership-tab:hover[b-n0xhj6iz91], .membership-tab-active[b-n0xhj6iz91] { border-bottom-color: var(--color-primary); color: var(--color-primary); }
.myplan-skeleton[b-n0xhj6iz91] { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--space-md); }
.myplan-skeleton-card[b-n0xhj6iz91] { display: flex; flex-direction: column; gap: var(--space-sm); padding: var(--space-lg); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.myplan-grid[b-n0xhj6iz91] { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--space-md); align-items: stretch; }
@media (min-width: 1024px) { .myplan-grid[b-n0xhj6iz91] { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 768px) and (max-width: 1023px) { .myplan-grid[b-n0xhj6iz91] { grid-template-columns: repeat(2, 1fr); } }
.myplan-personalized[b-n0xhj6iz91] { margin-bottom: var(--space-sm); }
.myplan-personalized-card[b-n0xhj6iz91] { background: rgba(153, 61, 46, 0.04); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-lg); box-shadow: var(--shadow-card); display: flex; flex-direction: column; gap: var(--space-sm); align-items: flex-start; }
.myplan-personalized-card[b-n0xhj6iz91]  .plan-card-icon { color: var(--color-primary); }
.myplan-personalized-name[b-n0xhj6iz91] { font-family: var(--font-display); font-size: var(--font-size-xl); font-weight: 500; color: var(--color-on-surface); margin: 0; }
.myplan-personalized-desc[b-n0xhj6iz91] { font-size: var(--font-size-sm); color: var(--color-on-surface-dim); margin: 0; }
.myplan-personalized-promo[b-n0xhj6iz91] { font-size: var(--font-size-sm); color: var(--color-primary); font-weight: 500; margin: 0; }
.myplan-personalized-cta[b-n0xhj6iz91], .plan-card-cta-secondary[b-n0xhj6iz91] { background: transparent; color: var(--color-primary); border: 1px solid var(--color-primary); border-radius: var(--radius-md); padding: var(--space-sm) var(--space-md); font-size: var(--font-size-base); font-weight: 500; text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: var(--space-xs); transition: background var(--transition-fast), color var(--transition-fast); }
.myplan-personalized-cta:hover[b-n0xhj6iz91], .plan-card-cta-secondary:hover[b-n0xhj6iz91] { background: var(--color-primary); color: white; }
.plan-card-custom[b-n0xhj6iz91] { background: rgba(153, 61, 46, 0.04); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-lg); box-shadow: var(--shadow-card); display: flex; flex-direction: column; gap: var(--space-md); justify-content: space-between; height: 100%; }
.plan-card-custom .plan-card-header[b-n0xhj6iz91] { display: flex; flex-direction: column; gap: var(--space-xs); }
.plan-card-custom .plan-card-name[b-n0xhj6iz91] { font-family: var(--font-display); font-size: var(--font-size-xl); font-weight: 500; color: var(--color-on-surface); margin: 0; }
.plan-card-custom .plan-card-classes[b-n0xhj6iz91] { font-size: var(--font-size-sm); color: var(--color-on-surface-dim); margin: 0; }
.plan-card-cta-secondary[b-n0xhj6iz91] { margin-top: auto; }
.plan-card-cta-secondary:active[b-n0xhj6iz91] { background: var(--color-primary-hover, #802820); }
.credits-skeleton[b-n0xhj6iz91] { display: flex; flex-direction: column; gap: var(--space-md); }
.credits-skeleton-card[b-n0xhj6iz91] { padding: var(--space-lg); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.credits-membership[b-n0xhj6iz91] { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-lg); box-shadow: var(--shadow-card); }
.credits-layout[b-n0xhj6iz91] { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-lg); align-items: start; }
@media (max-width: 768px) { .credits-layout[b-n0xhj6iz91] { grid-template-columns: 1fr; } }
.credits-detail[b-n0xhj6iz91] { display: flex; flex-direction: column; gap: var(--space-md); }
.credits-section-title[b-n0xhj6iz91] { font-size: var(--font-size-base); font-weight: 500; color: var(--color-on-surface); margin: 0; }
.credits-bars[b-n0xhj6iz91] { display: flex; flex-direction: column; gap: var(--space-md); }
.credit-row[b-n0xhj6iz91] { display: flex; flex-direction: column; gap: var(--space-xs); }
.credit-header[b-n0xhj6iz91] { display: flex; justify-content: space-between; align-items: center; }
.credit-name[b-n0xhj6iz91] { font-size: var(--font-size-sm); font-weight: 500; color: var(--color-on-surface); }
.credit-count[b-n0xhj6iz91] { font-size: var(--font-size-xs); color: var(--color-on-surface-dim); }
.credit-bar[b-n0xhj6iz91] { height: 8px; background: var(--color-border); border-radius: var(--radius-full); overflow: hidden; }
.credit-bar-fill[b-n0xhj6iz91] { height: 100%; border-radius: var(--radius-full); transition: width var(--transition-base); animation: capacity-bar-fill 400ms ease-out; }
.credit-bar-good[b-n0xhj6iz91] { background: var(--color-primary); }
.credit-bar-low[b-n0xhj6iz91] { background: var(--color-warning); }
.credit-bar-empty[b-n0xhj6iz91] { background: var(--color-error); }
.credits-total[b-n0xhj6iz91] { font-size: var(--font-size-sm); font-weight: 500; color: var(--color-on-surface); padding-top: var(--space-sm); border-top: 1px solid var(--color-border); }

/* §1.3 buy-from-class context banner on the Suggested picker. */
.myplan-regularspot-context[b-n0xhj6iz91] { background: rgba(153, 61, 46, 0.08); border: 1px solid var(--color-primary); border-radius: var(--radius-lg); color: var(--color-on-surface); font-weight: 500; padding: var(--space-md) var(--space-lg); margin-bottom: var(--space-md); }
/* /Pages/NotFound.razor.rz.scp.css */
.not-found[b-j2go80lag3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 60dvh;
    text-align: center;
    padding: var(--space-xl);
}

.not-found-code[b-j2go80lag3] {
    font-size: 6rem;
    font-weight: 500;
    color: var(--color-primary);
    line-height: 1;
    margin-bottom: var(--space-md);
}

.not-found-message[b-j2go80lag3] {
    font-size: var(--font-size-2xl);
    font-weight: 500;
    color: var(--color-on-surface);
    margin-bottom: var(--space-sm);
}

.not-found-hint[b-j2go80lag3] {
    font-size: var(--font-size-base);
    color: var(--color-on-surface-dim);
    margin-bottom: var(--space-xl);
    max-width: 400px;
}

.not-found-action[b-j2go80lag3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-sm) var(--space-xl);
    background: var(--color-primary);
    color: #fff;
    border-radius: var(--radius-md);
    font-weight: 500;
    font-size: var(--font-size-base);
    text-decoration: none;
    min-height: 44px;
    transition: opacity var(--transition-fast);
}

.not-found-action:hover[b-j2go80lag3] {
    opacity: 0.9;
    text-decoration: none;
}

.not-found-action:focus-visible[b-j2go80lag3] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}
/* /Pages/Notifications.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════
   Notifications Page
   ═══════════════════════════════════════════════════════════ */

.notifications-page[b-oq11fstaw0] {
    max-width: 640px;
    margin-inline: auto;
}

.notifications-header[b-oq11fstaw0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--space-lg);
}

.mark-all-btn[b-oq11fstaw0] {
    background: none;
    border: 1px solid var(--color-border);
    color: var(--color-primary);
    font-size: var(--font-size-sm);
    font-weight: 500;
    padding: var(--space-xs) var(--space-md);
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: background var(--transition-fast);
    min-height: 36px;
}

.mark-all-btn:hover:not(:disabled)[b-oq11fstaw0] {
    background: var(--color-background);
}

.mark-all-btn:disabled[b-oq11fstaw0] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ─── List ─── */
.notifications-list[b-oq11fstaw0] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    background: var(--color-border);
    border-radius: var(--radius-md);
    overflow: hidden;
}

.notification-item[b-oq11fstaw0] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-md);
    padding: var(--space-md);
    background: var(--color-surface);
    border: none;
    text-align: left;
    cursor: pointer;
    transition: background var(--transition-fast);
    width: 100%;
    min-height: 64px;
}

.notification-item:hover[b-oq11fstaw0] {
    background: var(--color-background);
}

.notification-item:focus-visible[b-oq11fstaw0] {
    outline: 2px solid var(--color-primary);
    outline-offset: -2px;
}

.notification-unread[b-oq11fstaw0] {
    background: var(--color-background);
}

.notification-icon[b-oq11fstaw0] {
    font-size: var(--font-size-xl);
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-border);
    border-radius: var(--radius-full);
}

.notification-content[b-oq11fstaw0] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.notification-item-title[b-oq11fstaw0] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface);
}

.notification-body[b-oq11fstaw0] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.notification-time[b-oq11fstaw0] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
}

.notification-dot[b-oq11fstaw0] {
    width: 8px;
    height: 8px;
    border-radius: var(--radius-full);
    background: var(--color-primary);
    flex-shrink: 0;
    margin-top: var(--space-sm);
}

/* ─── Skeleton ─── */
.notifications-skeleton[b-oq11fstaw0] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

.notification-skeleton-item[b-oq11fstaw0] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-md);
    padding: var(--space-md);
    background: var(--color-surface);
    border-radius: var(--radius-md);
}

.notification-skeleton-text[b-oq11fstaw0] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}
/* /Pages/Payment/Payment.razor.rz.scp.css */
.payment-page[b-sqr1b840k8] {
    max-width: 500px;
    margin: 0 auto;
    padding: var(--space-lg) var(--space-md);
    position: relative;
    min-height: 400px;
}

.payment-loading[b-sqr1b840k8] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-lg);
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
}

/* Overlay */
.payment-overlay[b-sqr1b840k8] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.payment-overlay-content[b-sqr1b840k8] {
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    padding: var(--space-2xl) var(--space-xl);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-md);
    min-width: 280px;
    box-shadow: var(--elevation-xl);
}

.payment-spinner[b-sqr1b840k8] {
    width: 48px;
    height: 48px;
    border: 3px solid var(--color-border);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: spin-b-sqr1b840k8 1s linear infinite;
}

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

.payment-overlay-title[b-sqr1b840k8] {
    font-size: var(--font-size-lg);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.payment-overlay-detail[b-sqr1b840k8] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    margin: 0;
}

/* Success */
.payment-success[b-sqr1b840k8] {
    text-align: center;
    padding: var(--space-2xl) var(--space-lg);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-md);
}

.payment-success-icon[b-sqr1b840k8] {
    font-size: 3rem;
    animation: success-bounce 0.5s ease-out;
}

.payment-success-title[b-sqr1b840k8] {
    font-size: var(--font-size-xl);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.payment-success-summary[b-sqr1b840k8] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    white-space: pre-line;
    margin: 0;
}

.payment-success-actions[b-sqr1b840k8] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    width: 100%;
    margin-top: var(--space-md);
}

/* Form */
.payment-form[b-sqr1b840k8] {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
    transition: opacity var(--transition-base);
}

.payment-form-dimmed[b-sqr1b840k8] {
    opacity: 0.4;
    pointer-events: none;
}

.payment-amount-card[b-sqr1b840k8] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--space-md);
    text-align: center;
}

.payment-description[b-sqr1b840k8] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    margin: 0 0 var(--space-xs);
    white-space: pre-line;
}

.payment-amount[b-sqr1b840k8] {
    font-size: var(--font-size-2xl);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 8px;
}

.payment-amount-original[b-sqr1b840k8] {
    font-size: var(--font-size-lg);
    font-weight: 400;
    opacity: 0.5;
}

/* Method selection */
.payment-methods[b-sqr1b840k8] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.payment-section-title[b-sqr1b840k8] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.payment-method-options[b-sqr1b840k8] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-sm);
}

.payment-method-option[b-sqr1b840k8] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    padding: var(--space-md);
    background: var(--color-surface);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-md);
    cursor: pointer;
    min-height: 44px;
    transition: border-color var(--transition-fast), background var(--transition-fast);
}

.payment-method-option:hover[b-sqr1b840k8] {
    border-color: var(--color-primary);
}

.payment-method-selected[b-sqr1b840k8] {
    border-color: var(--color-primary);
    background: var(--color-primary-tint);
}

.payment-method-icon[b-sqr1b840k8] {
    font-size: var(--font-size-xl);
}

.payment-method-name[b-sqr1b840k8] {
    font-weight: 500;
    font-size: var(--font-size-base);
    color: var(--color-on-surface);
}

/* BLIK section */
.payment-blik-section[b-sqr1b840k8] {
    padding: var(--space-md) 0;
}

/* Cards section */
.payment-cards-section[b-sqr1b840k8] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.saved-card-option[b-sqr1b840k8] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    padding: var(--space-md);
    background: var(--color-surface);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-md);
    cursor: pointer;
    min-height: 44px;
    transition: border-color var(--transition-fast);
    width: 100%;
    text-align: left;
}

.saved-card-option:hover[b-sqr1b840k8] {
    border-color: var(--color-primary);
}

.saved-card-selected[b-sqr1b840k8] {
    border-color: var(--color-primary);
    background: var(--color-primary-tint);
}

.saved-card-brand[b-sqr1b840k8] {
    font-size: var(--font-size-lg);
}

.saved-card-info[b-sqr1b840k8] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
}

.payment-cards-empty[b-sqr1b840k8] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    text-align: center;
    padding: var(--space-md);
}

.payment-form-error[b-sqr1b840k8] {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    margin: 0;
    text-align: center;
}

/* Buttons */
.payment-btn-primary[b-sqr1b840k8] {
    display: block;
    background: var(--color-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-base);
    font-weight: 500;
    cursor: pointer;
    min-height: 44px;
    text-align: center;
    text-decoration: none;
    transition: background var(--transition-fast);
    line-height: 1.5;
}

.payment-btn-primary:hover[b-sqr1b840k8] {
    background: var(--color-primary-hover, #802820);
}

.payment-btn-primary:disabled[b-sqr1b840k8] {
    opacity: 0.5;
    cursor: not-allowed;
}

.payment-btn-secondary[b-sqr1b840k8] {
    display: block;
    background: var(--color-surface);
    color: var(--color-primary);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-base);
    font-weight: 500;
    cursor: pointer;
    min-height: 44px;
    text-align: center;
    text-decoration: none;
    transition: background var(--transition-fast);
    line-height: 1.5;
}

.payment-btn-secondary:hover[b-sqr1b840k8] {
    background: var(--color-background);
}

.payment-submit[b-sqr1b840k8] {
    margin-top: var(--space-sm);
}

.payment-error-actions[b-sqr1b840k8] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    width: 100%;
}

/* Cash section */
.payment-cash-section[b-sqr1b840k8] {
    text-align: center;
    padding: 1.5rem;
}

.payment-cash-info[b-sqr1b840k8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

.payment-cash-icon[b-sqr1b840k8] {
    font-size: 2rem;
}

.payment-header[b-sqr1b840k8] {
    margin-bottom: var(--space-sm);
}

.payment-back[b-sqr1b840k8] {
    background: none;
    border: none;
    color: var(--color-primary);
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
    padding: var(--space-xs) var(--space-sm);
    border-radius: var(--radius-sm);
    transition: background var(--transition-fast);
}

.payment-back:hover[b-sqr1b840k8] {
    background: var(--color-border);
}

.payment-back:focus-visible[b-sqr1b840k8] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}
/* /Pages/Payment/PaymentComplete.razor.rz.scp.css */
.payment-complete-page[b-98vnyjgf0o] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: var(--space-xl);
}

.payment-complete-loading[b-98vnyjgf0o] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-md);
    text-align: center;
    color: var(--color-on-surface-dim);
}

.payment-complete-content[b-98vnyjgf0o] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-md);
    text-align: center;
    max-width: 400px;
}

.payment-complete-icon[b-98vnyjgf0o] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: var(--color-secondary);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-xl);
    font-weight: 500;
}

.payment-complete-content h2[b-98vnyjgf0o] {
    margin: 0;
    font-size: var(--font-size-xl);
    color: var(--color-on-surface);
}

.payment-complete-content p[b-98vnyjgf0o] {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
}

.btn-primary[b-98vnyjgf0o] {
    display: inline-block;
    background: var(--color-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    padding: var(--space-sm) var(--space-lg);
    font-size: var(--font-size-base);
    font-weight: 500;
    text-decoration: none;
    min-height: 44px;
    line-height: 44px;
    transition: background var(--transition-fast);
}

.btn-primary:hover[b-98vnyjgf0o] {
    background: var(--color-primary-hover, #5a3f94);
}

.spinner[b-98vnyjgf0o] {
    width: 40px;
    height: 40px;
    border: 3px solid var(--color-border);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: spin-b-98vnyjgf0o 0.8s linear infinite;
}

@keyframes spin-b-98vnyjgf0o {
    to { transform: rotate(360deg); }
}
/* /Pages/Schedule.razor.rz.scp.css */
.date-strip[b-0c1y23y0ci] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    padding: var(--space-md) 0;
}

.date-strip:focus-visible[b-0c1y23y0ci] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
    border-radius: var(--radius-md);
}

.date-strip-header[b-0c1y23y0ci] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 var(--space-xs);
}

.date-strip-month[b-0c1y23y0ci] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
    text-transform: capitalize;
}

.date-strip-nav[b-0c1y23y0ci] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    background: transparent;
    color: var(--color-on-surface);
    font-size: var(--font-size-xl);
    cursor: pointer;
    border-radius: var(--radius-full);
    transition: background var(--transition-fast);
}

.date-strip-nav:hover:not(:disabled)[b-0c1y23y0ci] {
    background: var(--color-surface);
}

.date-strip-nav:disabled[b-0c1y23y0ci] {
    opacity: 0.3;
    cursor: not-allowed;
}

.date-strip-nav:focus-visible[b-0c1y23y0ci] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}


.date-strip-days[b-0c1y23y0ci] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: var(--space-xs);
}

.date-strip-day[b-0c1y23y0ci] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: var(--space-sm) var(--space-xs);
    border: 2px solid transparent;
    background: transparent;
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: background 150ms ease;
    min-height: 44px;
}

.date-strip-day:hover:not(:disabled):not(.date-strip-day-selected)[b-0c1y23y0ci] {
    background: var(--color-border);
}

.date-strip-day:focus-visible[b-0c1y23y0ci] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.date-strip-day-letter[b-0c1y23y0ci] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--color-on-surface-dim);
    text-transform: uppercase;
}

.date-strip-day-number[b-0c1y23y0ci] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
}

.date-strip-day-dot[b-0c1y23y0ci] {
    width: 4px;
    height: 4px;
    border-radius: var(--radius-full);
    background: var(--color-primary);
}

.date-strip-day-selected[b-0c1y23y0ci] {
    background: var(--color-primary);
    border-color: var(--color-primary);
}

.date-strip-day-selected .date-strip-day-letter[b-0c1y23y0ci],
.date-strip-day-selected .date-strip-day-number[b-0c1y23y0ci] {
    color: #fff;
}

.date-strip-day-selected .date-strip-day-dot[b-0c1y23y0ci] {
    background: #fff;
}

.date-strip-day-today:not(.date-strip-day-selected)[b-0c1y23y0ci] {
    border-color: var(--color-primary);
}

.date-strip-day-disabled[b-0c1y23y0ci] {
    opacity: 0.35;
    cursor: not-allowed;
}

@media (max-width: 767px) {
    .date-strip-nav[b-0c1y23y0ci] {
        width: 44px;
        height: 44px;
    }
}

.schedule-page[b-0c1y23y0ci] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-md) 0;
}

/* ─── Toolbar (nav arrows + filter button) ─── */
.schedule-toolbar[b-0c1y23y0ci] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

.schedule-toolbar-spacer[b-0c1y23y0ci] {
    flex: 1;
}


.schedule-filter-btn[b-0c1y23y0ci] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-xs);
    padding: var(--space-xs) var(--space-sm);
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    color: var(--color-on-surface-dim);
    font-size: var(--font-size-sm);
    font-family: inherit;
    cursor: pointer;
    border-radius: var(--radius-md);
    transition: background var(--transition-fast), border-color var(--transition-fast);
}

.schedule-filter-btn:hover[b-0c1y23y0ci] {
    background: var(--color-background);
    border-color: var(--color-on-surface-dim);
}

.schedule-filter-btn-active[b-0c1y23y0ci] {
    background: var(--color-primary);
    color: #fff;
    border-color: var(--color-primary);
}

.schedule-filter-btn-active:hover[b-0c1y23y0ci] {
    background: var(--color-primary-hover);
}

.schedule-filter-icon[b-0c1y23y0ci] {
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
}

.schedule-filters[b-0c1y23y0ci] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

/* Skeleton loading */
.schedule-skeleton[b-0c1y23y0ci] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

.schedule-skeleton-card[b-0c1y23y0ci] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    padding: var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
}

/* Daily: single-day list */
.schedule-list[b-0c1y23y0ci] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}
/* /Pages/Teaching/Availability.razor.rz.scp.css */
.availability-page[b-v7rhft7ct6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-md) 0;
}

/* Form */
.availability-form[b-v7rhft7ct6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    padding: var(--space-lg);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    max-width: 500px;
}

.availability-form-title[b-v7rhft7ct6] {
    font-family: var(--font-display);
    font-size: var(--font-size-lg);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

.availability-form-row[b-v7rhft7ct6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.form-label[b-v7rhft7ct6] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface-dim);
}

.form-input[b-v7rhft7ct6] {
    padding: var(--space-sm) var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-size: var(--font-size-base);
    color: var(--color-on-surface);
    background: var(--color-background);
    transition: border-color var(--transition-fast);
}

.form-input:focus[b-v7rhft7ct6] {
    outline: none;
    border-color: var(--color-primary);
}

.btn-primary[b-v7rhft7ct6] {
    padding: var(--space-sm) var(--space-lg);
    background: var(--color-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
    transition: opacity var(--transition-fast);
    align-self: flex-start;
}

.btn-primary:hover:not(:disabled)[b-v7rhft7ct6] {
    opacity: 0.9;
}

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

/* Skeleton */
.availability-skeleton[b-v7rhft7ct6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

/* Section */
.availability-section[b-v7rhft7ct6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.availability-section-title[b-v7rhft7ct6] {
    font-family: var(--font-display);
    font-size: var(--font-size-lg);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

/* Table (desktop) */
.availability-table-wrapper[b-v7rhft7ct6] {
    overflow-x: auto;
}

.desktop-table[b-v7rhft7ct6] {
    display: none;
}

.availability-table[b-v7rhft7ct6] {
    width: 100%;
    border-collapse: collapse;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.avail-th[b-v7rhft7ct6] {
    text-align: left;
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--color-on-surface-dim);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--color-border);
    white-space: nowrap;
}

.avail-row[b-v7rhft7ct6] {
    transition: background var(--transition-fast);
}

.avail-row:hover[b-v7rhft7ct6] {
    background: var(--color-background);
}

.avail-td[b-v7rhft7ct6] {
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    border-bottom: 1px solid var(--color-border);
}

.btn-remove[b-v7rhft7ct6] {
    padding: var(--space-xs) var(--space-md);
    background: none;
    border: 1px solid var(--color-error);
    border-radius: var(--radius-md);
    color: var(--color-error);
    font-size: var(--font-size-xs);
    font-weight: 500;
    cursor: pointer;
    transition: background var(--transition-fast);
}

.btn-remove:hover:not(:disabled)[b-v7rhft7ct6] {
    background: var(--color-error-tint);
}

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

/* Mobile cards */
.mobile-cards[b-v7rhft7ct6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.avail-card[b-v7rhft7ct6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    padding: var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
}

.avail-card-date[b-v7rhft7ct6] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
}

.avail-card-reason[b-v7rhft7ct6] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
}

@media (min-width: 1025px) {
    .desktop-table[b-v7rhft7ct6] {
        display: block;
    }

    .mobile-cards[b-v7rhft7ct6] {
        display: none;
    }
}
/* /Pages/Teaching/ClassRoster.razor.rz.scp.css */
.roster-page[b-fnzmnwu6vf] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-md) 0;
}

.roster-header[b-fnzmnwu6vf] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.roster-time[b-fnzmnwu6vf] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
    margin: 0;
}

.roster-stats[b-fnzmnwu6vf] {
    display: flex;
    gap: var(--space-md);
}

.stat-chip[b-fnzmnwu6vf] {
    display: flex;
    flex-direction: column;
    padding: var(--space-sm) var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.stat-label[b-fnzmnwu6vf] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
}

.stat-value[b-fnzmnwu6vf] {
    font-size: var(--font-size-lg);
    font-weight: 500;
    color: var(--color-on-surface);
}

.capacity-bar-wrapper[b-fnzmnwu6vf] {
    height: 6px;
    background: var(--color-border);
    border-radius: var(--radius-full);
    overflow: hidden;
}

.capacity-bar[b-fnzmnwu6vf] {
    height: 100%;
    background: var(--color-primary);
    border-radius: var(--radius-full);
    transition: width var(--transition-base);
}

/* Skeleton */
.roster-skeleton[b-fnzmnwu6vf] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

/* Sections */
.roster-section[b-fnzmnwu6vf] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.roster-section-title[b-fnzmnwu6vf] {
    font-family: var(--font-display);
    font-size: var(--font-size-lg);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

/* Table */
.roster-table-wrapper[b-fnzmnwu6vf] {
    overflow-x: auto;
}

.desktop-table[b-fnzmnwu6vf] {
    display: none;
}

.roster-table[b-fnzmnwu6vf] {
    width: 100%;
    border-collapse: collapse;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.roster-th[b-fnzmnwu6vf] {
    text-align: left;
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--color-on-surface-dim);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--color-border);
    white-space: nowrap;
}

.roster-row[b-fnzmnwu6vf] {
    transition: background var(--transition-fast);
}

.roster-row:hover[b-fnzmnwu6vf] {
    background: var(--color-background);
}

.roster-td[b-fnzmnwu6vf] {
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    border-bottom: 1px solid var(--color-border);
    white-space: nowrap;
}

.roster-td-name[b-fnzmnwu6vf] {
    font-weight: 500;
}

/* Status badges */
.roster-badge[b-fnzmnwu6vf] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 10px;
    border-radius: var(--radius-sm, 4px);
    font-size: var(--font-size-xs);
    font-weight: 500;
    white-space: nowrap;
}

.roster-badge-paid[b-fnzmnwu6vf] {
    background: rgba(34, 139, 34, 0.12);
    color: #1a7a1a;
}

.roster-badge-unpaid[b-fnzmnwu6vf] {
    background: rgba(245, 166, 35, 0.15);
    color: #a66800;
}

.roster-badge-pending[b-fnzmnwu6vf] {
    background: rgba(59, 130, 246, 0.12);
    color: #1d4ed8;
}

.roster-badge-cancelled[b-fnzmnwu6vf] {
    background: rgba(239, 68, 68, 0.1);
    color: #b91c1c;
}

.roster-badge-noshow[b-fnzmnwu6vf] {
    background: rgba(107, 114, 128, 0.12);
    color: #4b5563;
}

.roster-badge-auto-checkin[b-fnzmnwu6vf] {
    background: rgba(59, 130, 246, 0.12);
    color: #1d4ed8;
}

/* Cards (mobile) */
.mobile-cards[b-fnzmnwu6vf] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.roster-cards[b-fnzmnwu6vf] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.roster-card[b-fnzmnwu6vf] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    padding: var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
}

.roster-card-name[b-fnzmnwu6vf] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
}

.roster-card-row[b-fnzmnwu6vf] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

.roster-card-time[b-fnzmnwu6vf] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
}
@media (min-width: 1025px) {
    .desktop-table[b-fnzmnwu6vf] {
        display: block;
    }

    .mobile-cards[b-fnzmnwu6vf] {
        display: none;
    }
}
/* /Pages/Teaching/CreatePrivateClass.razor.rz.scp.css */
.create-private-page[b-e4ifxjdxwc] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-md) 0;
}

.create-private-form[b-e4ifxjdxwc] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-lg);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    max-width: 600px;
}

.form-row[b-e4ifxjdxwc] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.form-label[b-e4ifxjdxwc] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface-dim);
}

.form-input[b-e4ifxjdxwc] {
    padding: var(--space-sm) var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-size: var(--font-size-base);
    color: var(--color-on-surface);
    background: var(--color-background);
    transition: border-color var(--transition-fast);
}

.form-input:focus[b-e4ifxjdxwc] {
    outline: none;
    border-color: var(--color-primary);
}

.form-error[b-e4ifxjdxwc] {
    padding: var(--space-sm) var(--space-md);
    background: var(--color-error-tint);
    color: var(--color-error);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
}

.form-success[b-e4ifxjdxwc] {
    padding: var(--space-sm) var(--space-md);
    background: var(--color-success-tint);
    color: var(--color-success);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
}

.btn-primary[b-e4ifxjdxwc] {
    padding: var(--space-sm) var(--space-lg);
    background: var(--color-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
    transition: opacity var(--transition-fast);
    align-self: flex-start;
}

.btn-primary:hover:not(:disabled)[b-e4ifxjdxwc] {
    opacity: 0.9;
}

.btn-primary:disabled[b-e4ifxjdxwc] {
    opacity: 0.5;
    cursor: not-allowed;
}
/* /Pages/Teaching/Earnings.razor.rz.scp.css */
.earnings-page[b-ojom0cuyct] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-md) 0;
}

/* Month selector */
.earnings-month-selector[b-ojom0cuyct] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-lg);
}

.month-nav[b-ojom0cuyct] {
    background: none;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    width: 2.5rem;
    height: 2.5rem;
    font-size: var(--font-size-xl);
    color: var(--color-on-surface);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background var(--transition-fast);
}

.month-nav:hover[b-ojom0cuyct] {
    background: var(--color-background);
}

.month-label[b-ojom0cuyct] {
    font-family: var(--font-display);
    font-size: var(--font-size-lg);
    font-weight: 500;
    color: var(--color-on-surface);
    min-width: 12rem;
    text-align: center;
}

/* Summary */
.earnings-summary[b-ojom0cuyct] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-md);
}

.earnings-summary-card[b-ojom0cuyct] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-xs);
    padding: var(--space-lg);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
}

.earnings-summary-label[b-ojom0cuyct] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
}

.earnings-summary-value[b-ojom0cuyct] {
    font-family: var(--font-display);
    font-size: var(--font-size-xl);
    font-weight: 500;
    color: var(--color-on-surface);
}

/* Skeleton */
.earnings-skeleton[b-ojom0cuyct] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

/* Table (desktop) */
.earnings-table-wrapper[b-ojom0cuyct] {
    overflow-x: auto;
}

.desktop-table[b-ojom0cuyct] {
    display: none;
}

.earnings-table[b-ojom0cuyct] {
    width: 100%;
    border-collapse: collapse;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.earnings-th[b-ojom0cuyct] {
    text-align: left;
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--color-on-surface-dim);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--color-border);
    white-space: nowrap;
    user-select: none;
}

.earnings-th-sortable[b-ojom0cuyct] {
    cursor: pointer;
}

.earnings-th-sortable:hover[b-ojom0cuyct] {
    color: var(--color-primary);
}

.earnings-th-sorted[b-ojom0cuyct] {
    color: var(--color-primary);
}

.earnings-row[b-ojom0cuyct] {
    transition: background var(--transition-fast);
}

.earnings-row:hover[b-ojom0cuyct] {
    background: var(--color-background);
}

.earnings-td[b-ojom0cuyct] {
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    border-bottom: 1px solid var(--color-border);
    white-space: nowrap;
}

.earnings-td-name[b-ojom0cuyct] {
    font-weight: 500;
    white-space: normal;
}

/* Mobile cards */
.mobile-cards[b-ojom0cuyct] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.earnings-card[b-ojom0cuyct] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    padding: var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
}

.earnings-card-header[b-ojom0cuyct] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.earnings-card-name[b-ojom0cuyct] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
}

.earnings-card-amount[b-ojom0cuyct] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-primary);
}

.earnings-card-date[b-ojom0cuyct] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
}

@media (min-width: 1025px) {
    .desktop-table[b-ojom0cuyct] {
        display: block;
    }

    .mobile-cards[b-ojom0cuyct] {
        display: none;
    }
}
/* /Pages/Teaching/RentalHistory.razor.rz.scp.css */
.rental-history-page[b-wlb4bf937q] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-md) 0;
}

/* Skeleton */
.rental-skeleton[b-wlb4bf937q] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

/* Table (desktop) */
.rental-table-wrapper[b-wlb4bf937q] {
    overflow-x: auto;
}

.desktop-table[b-wlb4bf937q] {
    display: none;
}

.rental-table[b-wlb4bf937q] {
    width: 100%;
    border-collapse: collapse;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.rental-th[b-wlb4bf937q] {
    text-align: left;
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--color-on-surface-dim);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--color-border);
    white-space: nowrap;
}

.rental-row[b-wlb4bf937q] {
    transition: background var(--transition-fast);
}

.rental-row:hover[b-wlb4bf937q] {
    background: var(--color-background);
}

.rental-td[b-wlb4bf937q] {
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    border-bottom: 1px solid var(--color-border);
    white-space: nowrap;
}

.rental-td-name[b-wlb4bf937q] {
    font-weight: 500;
}

/* Status badges */
.rental-status[b-wlb4bf937q] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    padding: 2px var(--space-sm);
    border-radius: var(--radius-full);
}

.status-pending[b-wlb4bf937q] {
    background: var(--color-warning-tint);
    color: var(--color-warning);
}

.status-active[b-wlb4bf937q] {
    background: var(--color-success-tint);
    color: var(--color-success);
}

.status-completed[b-wlb4bf937q] {
    background: var(--color-success-tint);
    color: var(--color-success);
}

.status-cancelled[b-wlb4bf937q] {
    background: var(--color-error-tint);
    color: var(--color-error);
}

.rental-discount[b-wlb4bf937q] {
    font-size: var(--font-size-xs);
    color: var(--color-success);
    margin-right: var(--space-xs);
}

.btn-cancel[b-wlb4bf937q] {
    padding: var(--space-xs) var(--space-md);
    background: none;
    border: 1px solid var(--color-error);
    border-radius: var(--radius-md);
    color: var(--color-error);
    font-size: var(--font-size-xs);
    font-weight: 500;
    cursor: pointer;
    transition: background var(--transition-fast);
}

.btn-cancel:hover:not(:disabled)[b-wlb4bf937q] {
    background: var(--color-error-tint);
}

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

/* Mobile cards */
.mobile-cards[b-wlb4bf937q] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.rental-card[b-wlb4bf937q] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    padding: var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
}

.rental-card-header[b-wlb4bf937q] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.rental-card-room[b-wlb4bf937q] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
}

.rental-card-details[b-wlb4bf937q] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
}

.rental-card-footer[b-wlb4bf937q] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.rental-card-price[b-wlb4bf937q] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
}

@media (min-width: 1025px) {
    .desktop-table[b-wlb4bf937q] {
        display: block;
    }

    .mobile-cards[b-wlb4bf937q] {
        display: none;
    }
}
/* /Pages/Teaching/RentRoom.razor.rz.scp.css */
.rent-room-page[b-sb9rarzcwg] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-md) 0;
}

/* Skeleton */
.rent-room-skeleton[b-sb9rarzcwg] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

/* Form */
.rent-room-form[b-sb9rarzcwg] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-lg);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    max-width: 600px;
}

.rent-room-wallet-info[b-sb9rarzcwg] {
    padding: var(--space-sm) var(--space-md);
    background: var(--color-success-tint);
    color: var(--color-success);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: 500;
}

.form-row[b-sb9rarzcwg] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.form-label[b-sb9rarzcwg] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface-dim);
}

.form-input[b-sb9rarzcwg] {
    padding: var(--space-sm) var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-size: var(--font-size-base);
    color: var(--color-on-surface);
    background: var(--color-background);
    transition: border-color var(--transition-fast);
}

.form-input:focus[b-sb9rarzcwg] {
    outline: none;
    border-color: var(--color-primary);
}

.form-error[b-sb9rarzcwg] {
    padding: var(--space-sm) var(--space-md);
    background: var(--color-error-tint);
    color: var(--color-error);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
}

.form-success[b-sb9rarzcwg] {
    padding: var(--space-sm) var(--space-md);
    background: var(--color-success-tint);
    color: var(--color-success);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
}

/* Price preview */
.price-preview[b-sb9rarzcwg] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    padding: var(--space-md);
    background: var(--color-background);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.price-row[b-sb9rarzcwg] {
    display: flex;
    justify-content: space-between;
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
}

.price-total[b-sb9rarzcwg] {
    font-weight: 500;
    padding-top: var(--space-xs);
    border-top: 1px solid var(--color-border);
}

.price-discount[b-sb9rarzcwg] {
    color: var(--color-success);
}

.price-strikethrough[b-sb9rarzcwg] {
    text-decoration: line-through;
    color: var(--color-on-surface-dim);
}

.btn-primary[b-sb9rarzcwg] {
    padding: var(--space-sm) var(--space-lg);
    background: var(--color-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
    transition: opacity var(--transition-fast);
    align-self: flex-start;
}

.btn-primary:hover:not(:disabled)[b-sb9rarzcwg] {
    opacity: 0.9;
}

.btn-primary:disabled[b-sb9rarzcwg] {
    opacity: 0.5;
    cursor: not-allowed;
}
/* /Pages/Teaching/Teaching.razor.rz.scp.css */
.teaching-page[b-kq2irpe560] {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
    padding: var(--space-md) 0;
}

/* Skeleton */
.teaching-skeleton[b-kq2irpe560] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-md);
}

.teaching-skeleton-card[b-kq2irpe560] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    padding: var(--space-lg);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
}

/* Summary grid */
.teaching-summary-grid[b-kq2irpe560] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-md);
}

.summary-card[b-kq2irpe560] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-xs);
    padding: var(--space-lg);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: box-shadow var(--transition-fast), border-color var(--transition-fast);
}

.summary-card:hover[b-kq2irpe560] {
    border-color: var(--color-primary);
    box-shadow: var(--shadow-md);
}

.summary-icon[b-kq2irpe560] {
    font-size: var(--font-size-2xl);
}

.summary-value[b-kq2irpe560] {
    font-family: var(--font-display);
    font-size: var(--font-size-xl);
    font-weight: 500;
    color: var(--color-on-surface);
}

.summary-label[b-kq2irpe560] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
    text-align: center;
}

/* Sections */
.teaching-section[b-kq2irpe560] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.section-heading[b-kq2irpe560] {
    font-family: var(--font-display);
    font-size: var(--font-size-lg);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

/* Class items */
.class-card-list[b-kq2irpe560] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.class-item[b-kq2irpe560] {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    padding: var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: box-shadow var(--transition-fast);
}

.class-item:hover[b-kq2irpe560] {
    box-shadow: var(--shadow-sm);
}

.class-item-time[b-kq2irpe560] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-primary);
    min-width: 4rem;
}

.class-item-info[b-kq2irpe560] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.class-item-name[b-kq2irpe560] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-on-surface);
}

.class-item-meta[b-kq2irpe560] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
}

.class-item-action[b-kq2irpe560] {
    padding: var(--space-xs) var(--space-md);
    background: none;
    border: 1px solid var(--color-primary);
    border-radius: var(--radius-md);
    color: var(--color-primary);
    font-size: var(--font-size-xs);
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
    transition: background var(--transition-fast);
}

.class-item-action:hover[b-kq2irpe560] {
    background: var(--color-primary);
    color: white;
}

/* Quick actions */
.quick-actions-grid[b-kq2irpe560] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-sm);
}

.quick-action-link[b-kq2irpe560] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    padding: var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    color: var(--color-on-surface);
    font-size: var(--font-size-sm);
    font-weight: 500;
    text-decoration: none;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.quick-action-link:hover[b-kq2irpe560] {
    border-color: var(--color-primary);
    box-shadow: var(--shadow-sm);
    color: var(--color-primary);
}

@media (min-width: 1025px) {
    .teaching-summary-grid[b-kq2irpe560] {
        grid-template-columns: repeat(4, 1fr);
    }

    .teaching-skeleton[b-kq2irpe560] {
        grid-template-columns: repeat(4, 1fr);
    }

    .quick-actions-grid[b-kq2irpe560] {
        grid-template-columns: repeat(3, 1fr);
    }
}
/* /Pages/Teaching/Wallet.razor.rz.scp.css */
.wallet-page[b-x4htd32hmi] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-md) 0;
}

/* Balance card */
.wallet-balance-card[b-x4htd32hmi] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-sm);
    padding: var(--space-2xl) var(--space-lg);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
}

.wallet-balance-label[b-x4htd32hmi] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface-dim);
}

.wallet-balance-value[b-x4htd32hmi] {
    font-family: var(--font-display);
    font-size: var(--font-size-4xl);
    font-weight: 500;
    color: var(--color-on-surface);
}

.btn-topup[b-x4htd32hmi] {
    padding: var(--space-sm) var(--space-xl);
    background: var(--color-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
    transition: opacity var(--transition-fast);
}

.btn-topup:hover[b-x4htd32hmi] {
    opacity: 0.9;
}

/* Top up form */
.wallet-topup-form[b-x4htd32hmi] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    padding: var(--space-lg);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    max-width: 400px;
}

.form-row[b-x4htd32hmi] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.form-label[b-x4htd32hmi] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-on-surface-dim);
}

.form-input[b-x4htd32hmi] {
    padding: var(--space-sm) var(--space-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-size: var(--font-size-base);
    color: var(--color-on-surface);
    background: var(--color-background);
    transition: border-color var(--transition-fast);
}

.form-input:focus[b-x4htd32hmi] {
    outline: none;
    border-color: var(--color-primary);
}

.form-error[b-x4htd32hmi] {
    padding: var(--space-sm) var(--space-md);
    background: var(--color-error-tint);
    color: var(--color-error);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
}

.form-success[b-x4htd32hmi] {
    padding: var(--space-sm) var(--space-md);
    background: var(--color-success-tint);
    color: var(--color-success);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
}

.btn-primary[b-x4htd32hmi] {
    padding: var(--space-sm) var(--space-lg);
    background: var(--color-primary);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
    transition: opacity var(--transition-fast);
    align-self: flex-start;
}

.btn-primary:hover:not(:disabled)[b-x4htd32hmi] {
    opacity: 0.9;
}

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

/* Skeleton */
.wallet-skeleton[b-x4htd32hmi] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

/* Section */
.wallet-section[b-x4htd32hmi] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.wallet-section-title[b-x4htd32hmi] {
    font-family: var(--font-display);
    font-size: var(--font-size-lg);
    font-weight: 500;
    color: var(--color-on-surface);
    margin: 0;
}

/* Table (desktop) */
.wallet-table-wrapper[b-x4htd32hmi] {
    overflow-x: auto;
}

.desktop-table[b-x4htd32hmi] {
    display: none;
}

.wallet-table[b-x4htd32hmi] {
    width: 100%;
    border-collapse: collapse;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.wallet-th[b-x4htd32hmi] {
    text-align: left;
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--color-on-surface-dim);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--color-border);
    white-space: nowrap;
}

.wallet-row[b-x4htd32hmi] {
    transition: background var(--transition-fast);
}

.wallet-row:hover[b-x4htd32hmi] {
    background: var(--color-background);
}

.wallet-td[b-x4htd32hmi] {
    padding: var(--space-sm) var(--space-md);
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
    border-bottom: 1px solid var(--color-border);
    white-space: nowrap;
}

.wallet-td-desc[b-x4htd32hmi] {
    white-space: normal;
    max-width: 20rem;
}

/* Type badges */
.wallet-type[b-x4htd32hmi] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    padding: 2px var(--space-sm);
    border-radius: var(--radius-full);
}

.type-earning[b-x4htd32hmi] {
    background: var(--color-success-tint);
    color: var(--color-success);
}

.type-topup[b-x4htd32hmi] {
    background: var(--color-success-tint);
    color: var(--color-success);
}

.type-rental[b-x4htd32hmi] {
    background: var(--color-warning-tint);
    color: var(--color-warning);
}

.type-refund[b-x4htd32hmi] {
    background: var(--color-error-tint);
    color: var(--color-error);
}

/* Amount color */
.amount-positive[b-x4htd32hmi] {
    color: var(--color-success);
    font-weight: 500;
}

.amount-negative[b-x4htd32hmi] {
    color: var(--color-error);
    font-weight: 500;
}

/* Mobile cards */
.mobile-cards[b-x4htd32hmi] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.wallet-card[b-x4htd32hmi] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    padding: var(--space-md);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
}

.wallet-card-header[b-x4htd32hmi] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.wallet-card-amount[b-x4htd32hmi] {
    font-size: var(--font-size-base);
    font-weight: 500;
}

.wallet-card-desc[b-x4htd32hmi] {
    font-size: var(--font-size-sm);
    color: var(--color-on-surface);
}

.wallet-card-time[b-x4htd32hmi] {
    font-size: var(--font-size-xs);
    color: var(--color-on-surface-dim);
}

@media (min-width: 1025px) {
    .desktop-table[b-x4htd32hmi] {
        display: block;
    }

    .mobile-cards[b-x4htd32hmi] {
        display: none;
    }
}