@import '_content/Sva.Interface/Sva.Interface.3xrtahpaso.bundle.scp.css';
@import '_content/Sva.Video/Sva.Video.wohky7ntyy.bundle.scp.css';

/* /Components/AgreementConsent.razor.rz.scp.css */
.sva-consent[b-fhxvwgt535] {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

.sva-consent__doc[b-fhxvwgt535] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.sva-consent__pdf[b-fhxvwgt535] {
    width: 100%;
    height: 360px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
}

.sva-consent__fallback[b-fhxvwgt535] {
    margin: 0;
    font-size: var(--font-size-xs);
}

.sva-checkbox-row[b-fhxvwgt535] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
}
/* /Components/AppButton.razor.rz.scp.css */
/* Shared application button. Pill corners, semantic colour variants mapped to
   design tokens. Keep ALL button colours here so the palette stays centralised —
   callers pick a Variant, never a hex value. */

.app-btn[b-fy2roow9zg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    flex: 0 0 auto;
    border: 1px solid transparent;
    border-radius: var(--radius-full);
    font-family: var(--font-sans);
    font-weight: var(--font-weight-semibold);
    line-height: 1.2;
    cursor: pointer;
    touch-action: manipulation;
    white-space: nowrap;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

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

.app-btn:disabled[b-fy2roow9zg] {
    opacity: 0.55;
    cursor: not-allowed;
}

/* --- Sizes --- */
.app-btn--medium[b-fy2roow9zg] {
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
}

.app-btn--small[b-fy2roow9zg] {
    padding: var(--space-1) var(--space-3);
    font-size: var(--font-size-sm);
}

.app-btn--full[b-fy2roow9zg] {
    width: 100%;
}

/* Icon-only → equal padding collapses the pill into a circle. */
.app-btn--icon-only[b-fy2roow9zg] {
    padding: var(--space-2);
    aspect-ratio: 1 / 1;
}

.app-btn--icon-only.app-btn--small[b-fy2roow9zg] {
    padding: var(--space-1);
}

/* --- Solid variants --- */
.app-btn--primary[b-fy2roow9zg] {
    background: var(--color-primary);
    color: var(--color-text-on-primary);
}

.app-btn--primary:not(:disabled):hover[b-fy2roow9zg] {
    background: var(--color-primary-hover);
}

.app-btn--secondary[b-fy2roow9zg] {
    background: var(--color-surface);
    border-color: var(--color-border);
    color: var(--color-text-secondary);
}

.app-btn--secondary:not(:disabled):hover[b-fy2roow9zg] {
    background: var(--color-surface-raised);
}

.app-btn--success[b-fy2roow9zg] {
    background: var(--color-success);
    color: #ffffff;
}

.app-btn--success:not(:disabled):hover[b-fy2roow9zg] {
    filter: brightness(0.94);
}

.app-btn--danger[b-fy2roow9zg] {
    background: var(--color-danger);
    color: #ffffff;
}

.app-btn--danger:not(:disabled):hover[b-fy2roow9zg] {
    background: var(--color-danger-hover);
}

.app-btn--ghost[b-fy2roow9zg] {
    background: transparent;
    color: var(--color-primary);
}

.app-btn--ghost:not(:disabled):hover[b-fy2roow9zg] {
    background: var(--color-surface-raised);
}

/* --- Outline modifier: transparent fill, coloured border + text. --- */
.app-btn--outline[b-fy2roow9zg] {
    background: transparent;
}

.app-btn--outline.app-btn--primary[b-fy2roow9zg] {
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.app-btn--outline.app-btn--primary:not(:disabled):hover[b-fy2roow9zg] {
    background: var(--color-surface-raised);
}

.app-btn--outline.app-btn--danger[b-fy2roow9zg] {
    color: var(--color-danger);
    border-color: var(--color-danger);
}

.app-btn--outline.app-btn--danger:not(:disabled):hover[b-fy2roow9zg] {
    background: var(--color-danger-muted);
}

.app-btn--outline.app-btn--success[b-fy2roow9zg] {
    color: var(--color-success);
    border-color: var(--color-success);
}

.app-btn--outline.app-btn--success:not(:disabled):hover[b-fy2roow9zg] {
    background: var(--color-success-muted);
}

/* --- Busy spinner --- */
.app-btn__spinner[b-fy2roow9zg] {
    width: 1em;
    height: 1em;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: var(--radius-full);
    animation: app-btn-spin-b-fy2roow9zg 0.6s linear infinite;
}

@keyframes app-btn-spin-b-fy2roow9zg {
    to {
        transform: rotate(360deg);
    }
}
/* /Components/AppointmentDialog.razor.rz.scp.css */
.appt-dialog-overlay[b-3oje7thyhd] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.appt-dialog[b-3oje7thyhd] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 8px;
    padding: 24px;
    /* Fit narrow viewports without overflowing: cap at 420px but never
       wider than the viewport less a 16px margin each side. */
    box-sizing: border-box;
    width: 100%;
    max-width: min(420px, calc(100vw - 32px));
    box-shadow: 0 8px 32px rgba(0, 40, 80, 0.15);
}

.appt-dialog__represented-hint[b-3oje7thyhd] {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    padding: 8px 12px;
    border-radius: 6px;
    background: var(--color-info-muted);
    color: var(--color-text-secondary);
    font-size: .8em;
    line-height: 1.4;
}

.appt-dialog__error[b-3oje7thyhd] {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    padding: 8px 12px;
    border-radius: 6px;
    background: var(--color-danger-muted);
    color: var(--color-danger);
    font-size: .8em;
    line-height: 1.4;
}
/* /Components/FormRow.razor.rz.scp.css */
/* Stacked by default (mobile); side-by-side label/field at >=768px,
   replicating the old col-md-2 / col-md-8 grid with token spacing. */
.form-row[b-3tlucg19nv] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    margin-top: var(--space-4);
}

@media (min-width: 768px) {
    .form-row[b-3tlucg19nv] {
        flex-direction: row;
        align-items: flex-start;
        gap: var(--space-4);
    }

    .form-row__label[b-3tlucg19nv] {
        flex: 0 0 16.6667%;
        max-width: 16.6667%;
        padding-top: var(--space-2);
    }

    .form-row__field[b-3tlucg19nv] {
        flex: 0 0 66.6667%;
        max-width: 66.6667%;
    }
}
/* /Components/LanguageSwitcher.razor.rz.scp.css */
/* Core layout/sizing lives inline on the elements to defeat any global theme
   rules that size buttons or images. Only hover/focus effects live here. */

.language-switcher button:hover[b-kw99ucqp7q] {
    background: rgba(255, 255, 255, 0.15) !important;
}

.language-switcher button:focus-visible[b-kw99ucqp7q] {
    outline: 2px solid rgba(255, 255, 255, 0.6);
    outline-offset: 2px;
}

.language-switcher-item:hover[b-kw99ucqp7q] {
    background: rgba(0, 0, 0, 0.06) !important;
}

.language-switcher-item.selected[b-kw99ucqp7q] {
    background: var(--color-surface-raised);
}
/* /Components/ListRow.razor.rz.scp.css */
/* Generic list row — token-driven, responsive, touch-friendly. */

.list-row[b-zqny1zniol] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    width: 100%;
    min-height: 3.25rem;                        /* comfortable tap target (~52px) */
    box-sizing: border-box;
    /* Reset native <button>/<a> chrome so both render as the same card. */
    appearance: none;
    -webkit-appearance: none;
    margin: 0;
    text-decoration: none;
    padding: var(--space-4);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    color: var(--color-text-primary);
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    line-height: var(--line-height-normal);
    text-align: left;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;   /* we provide our own :active state */
    touch-action: manipulation;                 /* no double-tap zoom / tap delay */
    transition: background 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

/* Hover only where a real pointer exists — avoids sticky hover on touch screens. */
@media (hover: hover) {
    .list-row:hover[b-zqny1zniol] {
        background: var(--color-surface-raised);
        border-color: var(--color-medium-blue);
        box-shadow: var(--shadow-md);
    }
}

/* Press feedback for touch (and mouse) users. */
.list-row:active[b-zqny1zniol] {
    background: var(--color-surface-raised);
}

.list-row:focus-visible[b-zqny1zniol] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.list-row--disabled[b-zqny1zniol] {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

.list-row__content[b-zqny1zniol] {
    flex: 1 1 auto;
    min-width: 0;
}

/* Wrap long labels (up to 2 lines) rather than hiding text on narrow screens. */
.list-row__text[b-zqny1zniol] {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Icons are Radzen child components, so reach them with ::deep. */
.list-row[b-zqny1zniol]  .list-row__leading,
.list-row[b-zqny1zniol]  .list-row__trailing {
    color: var(--color-text-secondary);
    font-size: var(--font-size-xl);
    flex-shrink: 0;
}

/* Tighten spacing on small phones. */
@media (max-width: 380px) {
    .list-row[b-zqny1zniol] {
        padding: var(--space-3);
        gap: var(--space-2);
    }
}
/* /Components/Notifications/NotificationPanel.razor.rz.scp.css */
.notification-panel[b-btf2n908ys] { display: flex; flex-direction: column; gap: 0.5rem; padding: 0.5rem; }
.notification-panel__header[b-btf2n908ys] { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.25rem; }
.notification-panel__title[b-btf2n908ys] { font-weight: 600; }
.notification-panel__empty[b-btf2n908ys] { padding: 1rem; color: var(--rz-text-secondary-color, #666); }
[b-btf2n908ys] .notification-item { padding: 0.75rem; border-bottom: 1px solid var(--rz-border, #e0e0e0); }
[b-btf2n908ys] .notification-item--unread { font-weight: 600; }
[b-btf2n908ys] .notification-item__actions { display: flex; gap: 0.5rem; margin-top: 0.5rem; }
[b-btf2n908ys] .notification-item__resolved { margin-top: 0.5rem; color: var(--rz-text-secondary-color, #666); font-size: 0.85rem; }
/* /Components/OnboardingForm.razor.rz.scp.css */
.sva-onboarding-steps[b-ya4btlnyq3] {
    display: flex;
    justify-content: center;
    gap: var(--space-2);
}

.sva-onboarding-step[b-ya4btlnyq3] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--color-border);
    transition: background 0.2s;
}

.sva-onboarding-step.active[b-ya4btlnyq3] {
    background: var(--color-primary);
}

.sva-onboarding-form[b-ya4btlnyq3] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    font-family: var(--rz-text-font-family);
}

.sva-onboarding-actions[b-ya4btlnyq3] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    font-family: var(--rz-text-font-family);
}

/* Step navigation: secondary (back/cancel) and primary (next/finish) share one row,
   each taking half the width. */
.sva-onboarding-buttons[b-ya4btlnyq3] {
    display: flex;
    gap: var(--space-3);
    margin-top: var(--space-2);
}

.sva-onboarding-buttons[b-ya4btlnyq3]  .app-btn {
    flex: 1;
}

/* On very narrow screens the long "cancel — log out" label would overflow a
   half-width pill, so stack them instead. */
@media (max-width: 380px) {
    .sva-onboarding-buttons[b-ya4btlnyq3] {
        flex-direction: column;
    }
}

.sva-field[b-ya4btlnyq3] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.sva-field-label[b-ya4btlnyq3] {
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
}

.sva-field.invalid .sva-field-label[b-ya4btlnyq3] {
    color: var(--rz-danger, #f44336);
}

.sva-required-mark[b-ya4btlnyq3] {
    color: var(--rz-danger, #f44336);
}

.sva-field-error[b-ya4btlnyq3] {
    font-size: var(--font-size-xs);
    color: var(--rz-danger, #f44336);
}

.sva-checkbox-row[b-ya4btlnyq3] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
}

.sva-onboarding-columns[b-ya4btlnyq3] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-6);
}

.sva-onboarding-column[b-ya4btlnyq3] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.sva-column-section-label[b-ya4btlnyq3] {
    font-style: italic;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: 0 0 var(--space-1);
}

@media (max-width: 540px) {
    .sva-onboarding-columns[b-ya4btlnyq3] {
        grid-template-columns: 1fr;
    }
}

.sva-field .rz-textbox[b-ya4btlnyq3] {
    width: 100%;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: 0.75rem 1rem;
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    color: var(--color-text-primary);
    transition: border-color 0.2s ease, background 0.2s ease;
    box-sizing: border-box;
}

.sva-field .rz-textbox[b-ya4btlnyq3]::placeholder {
    color: var(--color-text-muted);
}

.sva-field .rz-textbox:focus[b-ya4btlnyq3] {
    outline: none;
    border-color: var(--color-medium-blue);
    background: var(--color-surface-raised);
}

.sva-field .rz-dropdown[b-ya4btlnyq3] {
    width: 100%;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: 0.75rem 1rem;
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    color: var(--color-text-primary);
    transition: border-color 0.2s ease, background 0.2s ease;
    box-sizing: border-box;
}

.sva-field .rz-dropdown:focus[b-ya4btlnyq3],
.sva-field .rz-dropdown.rz-state-focused[b-ya4btlnyq3] {
    outline: none;
    border-color: var(--color-medium-blue);
    background: var(--color-surface-raised);
}

.sva-field.invalid .rz-textbox[b-ya4btlnyq3],
.sva-field.invalid .rz-dropdown[b-ya4btlnyq3] {
    border-color: var(--color-danger);
}
/* /Components/ParticipantList.razor.rz.scp.css */
.participant-list[b-ng22oxh11g] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.participant-list__heading[b-ng22oxh11g] {
    font-size: 0.78rem;
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.participant-list__row[b-ng22oxh11g] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-1) 0;
}

.participant-list__name[b-ng22oxh11g] {
    font-size: 0.9rem;
    font-weight: 500;
}

.participant-list__role[b-ng22oxh11g] {
    margin-left: auto;
    font-size: 0.72rem;
    font-weight: var(--font-weight-semibold);
    padding: 2px var(--space-2);
    border-radius: var(--radius-full);
}

.participant-list__role--patient[b-ng22oxh11g] {
    background: var(--color-info-muted);
    color: var(--color-info);
}

.participant-list__role--representative[b-ng22oxh11g] {
    background: var(--color-surface-raised);
    color: var(--color-text-secondary);
}
/* /Components/Patients/PatientDetailPanel.razor.rz.scp.css */
/* Inline patient detail panel — light/clinical theme. */

.patient-detail[b-u355t907yn] {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

/* Back action — colour/shape come from AppButton; only its placement is set here. */
.patient-detail[b-u355t907yn]  .patient-detail__back {
    align-self: flex-start;
}

/* Header */
.patient-detail__head[b-u355t907yn] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.patient-detail__avatar[b-u355t907yn] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.25rem;
    height: 3.25rem;
    border-radius: var(--radius-full);
    background: var(--color-medium-blue);
    color: var(--color-text-on-primary);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
}

.patient-detail__heading[b-u355t907yn] {
    min-width: 0;
}

.patient-detail__name[b-u355t907yn] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.patient-detail__sub[b-u355t907yn] {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

/* Top actions (Book time / Send message — disabled placeholders for now) */
.patient-detail__actions-top[b-u355t907yn] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
}

/* Sections */
.patient-detail__section[b-u355t907yn] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.patient-detail__section-head[b-u355t907yn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
}

.patient-detail__section-title[b-u355t907yn] {
    margin: 0;
    font-size: var(--font-size-lg);
}

/* Upcoming / past segmented toggle */
.patient-detail__seg[b-u355t907yn] {
    display: flex;
    gap: var(--space-1);
    padding: 3px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    background: var(--color-surface-raised);
}

.patient-detail__seg-btn[b-u355t907yn] {
    padding: var(--space-1) var(--space-3);
    border: none;
    border-radius: var(--radius-full);
    background: transparent;
    color: var(--color-text-secondary);
    font-family: var(--font-sans);
    font-size: var(--font-size-sm);
    cursor: pointer;
    touch-action: manipulation;
    transition: background 0.15s ease, color 0.15s ease;
}

.patient-detail__seg-btn--active[b-u355t907yn] {
    background: var(--color-primary);
    color: var(--color-text-on-primary);
    font-weight: var(--font-weight-semibold);
}

/* Appointment rows */
.patient-detail__appts[b-u355t907yn] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.patient-detail__appt[b-u355t907yn] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-2) var(--space-3);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.patient-detail__appt-date[b-u355t907yn] {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border-radius: var(--radius-sm);
    background: var(--color-surface-raised);
}

.patient-detail__appt-day[b-u355t907yn] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-bold);
    color: var(--color-text-primary);
    line-height: 1;
}

.patient-detail__appt-month[b-u355t907yn] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-secondary);
    letter-spacing: 0.04em;
}

.patient-detail__appt-body[b-u355t907yn] {
    min-width: 0;
}

.patient-detail__appt-title[b-u355t907yn] {
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.patient-detail__appt-when[b-u355t907yn] {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.patient-detail__empty[b-u355t907yn] {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
}

/* Patient information form */
.patient-detail__grid[b-u355t907yn] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-4);
}

.patient-detail__field[b-u355t907yn] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    position: relative;
}

.patient-detail__actions[b-u355t907yn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-3);
    margin-top: var(--space-4);
}

@media (max-width: 560px) {
    .patient-detail__grid[b-u355t907yn] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Patients/PatientListRow.razor.rz.scp.css */
/* One patient list row — light/clinical theme, token-driven, touch-friendly. */

.patient-row[b-ylb8yifrtx] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    width: 100%;
    min-height: 3.75rem;
    box-sizing: border-box;
    appearance: none;
    -webkit-appearance: none;
    margin: 0;
    padding: var(--space-3) var(--space-4);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    color: var(--color-text-primary);
    font-family: var(--font-sans);
    text-align: left;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    transition: background 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

@media (hover: hover) {
    .patient-row:hover[b-ylb8yifrtx] {
        background: var(--color-surface-raised);
        border-color: var(--color-medium-blue);
        box-shadow: var(--shadow-md);
    }
}

.patient-row:active[b-ylb8yifrtx] {
    background: var(--color-surface-raised);
}

.patient-row:focus-visible[b-ylb8yifrtx] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.patient-row--selected[b-ylb8yifrtx] {
    border-color: var(--color-primary);
    box-shadow: inset 4px 0 0 var(--color-primary);
}

/* Next appointment: gold accent ring + matching badge. */
.patient-row--next[b-ylb8yifrtx] {
    border-color: var(--color-next-accent);
    box-shadow: inset 0 0 0 1px var(--color-next-accent);
}

/* Avatar */
.patient-row__avatar[b-ylb8yifrtx] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: var(--radius-full);
    background: var(--color-medium-blue);
    color: var(--color-text-on-primary);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    letter-spacing: 0.02em;
}

/* Main column */
.patient-row__main[b-ylb8yifrtx] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-width: 0;
    gap: 2px;
}

.patient-row__nameline[b-ylb8yifrtx] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    min-width: 0;
}

.patient-row__name[b-ylb8yifrtx] {
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.patient-row__badge[b-ylb8yifrtx] {
    flex: 0 0 auto;
    padding: 1px var(--space-2);
    border-radius: var(--radius-full);
    background: var(--color-next-accent);
    color: var(--color-primary);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.patient-row__secondary[b-ylb8yifrtx] {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Appointment badge */
.patient-row__appointment[b-ylb8yifrtx] {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    text-align: right;
    gap: 2px;
}

.patient-row__time[b-ylb8yifrtx] {
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.patient-row__day[b-ylb8yifrtx] {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    text-transform: capitalize;
}

@media (max-width: 380px) {
    .patient-row[b-ylb8yifrtx] {
        padding: var(--space-3);
        gap: var(--space-2);
    }
}
/* /Components/Patients/PendingRegistrations.razor.rz.scp.css */
/* Pending registrations strip — light/clinical theme. */

.patients-pending[b-nlgah6jqqs] {
    margin: var(--space-4) 0;
}

.patients-pending__title[b-nlgah6jqqs] {
    font-size: var(--font-size-lg);
    margin: 0 0 var(--space-2);
}

.patients-pending__list[b-nlgah6jqqs] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.patients-pending__item[b-nlgah6jqqs] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-2) var(--space-3);
    background: var(--color-surface);
    color: var(--color-text-primary);
    border: 1px solid var(--color-border);
    border-left: 3px solid var(--color-warning);
    border-radius: var(--radius-md);
}
/* /Components/ReadOnlyField.razor.rz.scp.css */
.readonly-field[b-v9p4p10d1l] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

/* Label + lock button on one centered row. */
.readonly-field__header[b-v9p4p10d1l] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.readonly-field__label[b-v9p4p10d1l] {
    font-weight: 600;
}

.readonly-field__lock[b-v9p4p10d1l] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: none;
    background: none;
    line-height: 1;
    color: var(--color-text-muted);
    cursor: pointer;
}

.readonly-field__lock:hover[b-v9p4p10d1l] {
    color: var(--color-text-secondary);
}

.readonly-field__lock[b-v9p4p10d1l]  .rz-icon {
    font-size: 1.125rem;
    line-height: 1;
}

/* Muted box so it's visibly non-editable. */
.readonly-field[b-v9p4p10d1l]  .rz-textbox {
    background: var(--color-surface-raised);
    color: var(--color-text-secondary);
    cursor: not-allowed;
}
/* /Layout/Footer/AppFooter.razor.rz.scp.css */
.app-footer[b-bgss4qs4yh] {
    display: flex;
    width: 100%;
    flex-shrink: 0;
    height: 64px;
    border-top: 1px solid var(--rz-border-color, #e0e0e0);
    background: var(--rz-base-background-color, #fff);
}

.app-footer[b-bgss4qs4yh]  .footer-tab {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 6px 0;
    text-decoration: none;
    color: var(--rz-text-secondary-color, #6b6b6b);
    cursor: pointer;
    transition: color 0.15s ease;
}

.app-footer[b-bgss4qs4yh]  .footer-tab:hover {
    color: var(--rz-primary, #2f6fb0);
}

.app-footer[b-bgss4qs4yh]  .footer-tab.active {
    color: var(--rz-primary, #2f6fb0);
}

/* Material Symbols fill axis: 0 = outlined, 1 = filled. Fill the active tab's icon. */
.app-footer[b-bgss4qs4yh]  .footer-tab.active .rzi {
    --rz-icon-fill: 1;
}

.app-footer[b-bgss4qs4yh]  .footer-label {
    font-size: 0.8rem;
    line-height: 1;
}

.app-footer[b-bgss4qs4yh]  .footer-tab.active .footer-label {
    font-weight: 600;
}
/* /Pages/EmailVerification.razor.rz.scp.css */
.sva-link-form[b-8hnmwt65vn] {
    display: flex;
    flex-direction: column;
}

.sva-verify-actions[b-8hnmwt65vn] {
    display: flex;
    gap: var(--space-3);
    margin-top: var(--space-2);
}

.sva-verify-actions[b-8hnmwt65vn]  .app-btn {
    flex: 1;
    white-space: normal;
}

@media (max-width: 380px) {
    .sva-verify-actions[b-8hnmwt65vn] {
        flex-direction: column;
    }
}

.sva-verify-cancel[b-8hnmwt65vn] {
    display: flex;
    justify-content: center;
    margin-top: var(--space-2);
}
/* /Pages/LoginPage.razor.rz.scp.css */
.sva-login-wrapper[b-voubcogu5b] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    background: var(--color-background);
}

.sva-login-card[b-voubcogu5b] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    padding: var(--space-8);
    min-width: 340px;
    max-width: 400px;
    width: 100%;
    box-shadow: var(--shadow-md);
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.sva-login-header[b-voubcogu5b] {
    text-align: center;
}

.sva-login-title[b-voubcogu5b] {
    margin: 0 0 var(--space-1);
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-text-primary);
}

.sva-login-subtitle[b-voubcogu5b] {
    margin: 0 0 var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    font-weight: var(--font-weight-semibold);
    text-transform: uppercase;
    letter-spacing: .04em;
}

.sva-login-description[b-voubcogu5b] {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    line-height: 1.5;
}

.sva-login-buttons[b-voubcogu5b] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.sva-login-divider[b-voubcogu5b] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    color: var(--color-text-muted);
    font-size: var(--font-size-xs);
    margin: var(--space-1) 0;
}

.sva-login-divider hr[b-voubcogu5b] {
    flex: 1;
    border: none;
    border-top: 1px solid var(--color-border);
}

/* Test credentials section */
.sva-test-credentials[b-voubcogu5b] {
    background: var(--color-background);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-4);
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.sva-test-header[b-voubcogu5b] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    font-size: var(--font-size-sm);
}

.sva-test-description[b-voubcogu5b] {
    margin: 0;
    color: var(--color-text-secondary);
    line-height: 1.5;
}

.sva-test-user[b-voubcogu5b] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.sva-test-user-name[b-voubcogu5b] {
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    margin-bottom: var(--space-1);
}

.sva-test-divider[b-voubcogu5b] {
    border: none;
    border-top: 1px solid var(--color-border);
    margin: var(--space-1) 0;
}

.sva-test-note[b-voubcogu5b] {
    margin: var(--space-1) 0 0;
    font-style: italic;
}

/* Anonymous support form */
.sva-support-link[b-voubcogu5b] {
    background: none;
    border: none;
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-1);
    padding: var(--space-2) 0;
    font-family: inherit;
    transition: color 0.15s;
}

.sva-support-link:hover[b-voubcogu5b] {
    color: var(--color-medium-blue);
}

.sva-support-form[b-voubcogu5b] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.sva-support-field[b-voubcogu5b] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.sva-support-label[b-voubcogu5b] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-secondary);
}
/* /Pages/PatientOnboardingPage.razor.rz.scp.css */
/* Step navigation: secondary (back/log out) and primary (next/finish) share one
   row, each taking half the width. Mirrors OnboardingForm. */
.sva-onboarding-buttons[b-pzrl5yu8n4] {
    display: flex;
    gap: var(--space-3);
    margin-top: var(--space-2);
}

.sva-onboarding-buttons[b-pzrl5yu8n4]  .app-btn {
    flex: 1;
}

@media (max-width: 380px) {
    .sva-onboarding-buttons[b-pzrl5yu8n4] {
        flex-direction: column;
    }
}

.onboarding-mandates__list[b-pzrl5yu8n4] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    margin-bottom: var(--space-3);
}

.onboarding-mandates__item[b-pzrl5yu8n4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--color-border, #d0d7de);
    border-radius: 8px;
}
/* /Pages/Patients.razor.rz.scp.css */
/* Clinician patient list — light/clinical theme, consistent with the rest of the app. */

.patients-page[b-ugab1z533j] {
    max-width: 1200px;
    margin: 0 auto;
    box-sizing: border-box;
}

/* Wider screens: the list spans the full width by default, and only shrinks into a
   two-column split once a patient is selected (detail on the right). */
@media (min-width: 900px) {
    .patients-page--detail[b-ugab1z533j] {
        display: grid;
        grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
        gap: var(--space-5);
        align-items: start;
    }

    /* No selection → no right column; list uses the whole width. */
    .patients-page:not(.patients-page--detail) .patients-detail-col[b-ugab1z533j] {
        display: none;
    }

    /* Keep the detail in view while the list scrolls the page. */
    .patients-page--detail .patients-detail-col[b-ugab1z533j] {
        position: sticky;
        top: 0;
        align-self: start;
        max-height: calc(100 * var(--vh) - 8rem);
        overflow-y: auto;
    }
}

/* Narrow screens: one column at a time — list, or detail when a patient is selected. */
@media (max-width: 899px) {
    .patients-page--detail .patients-list-col[b-ugab1z533j] {
        display: none;
    }

    .patients-page:not(.patients-page--detail) .patients-detail-col[b-ugab1z533j] {
        display: none;
    }
}

.patients-list-col[b-ugab1z533j] {
    min-width: 0;
}

.patients-detail-col[b-ugab1z533j] {
    min-width: 0;
}

.patients-detail-empty[b-ugab1z533j] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 12rem;
    padding: var(--space-6);
    text-align: center;
    color: var(--color-text-secondary);
}

/* Toolbar sits above the list (static); the list itself scrolls in its own panel
   below, so the toolbar always stays visible and rows never bleed behind it. */
.patients-toolbar[b-ugab1z533j] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    padding-bottom: var(--space-3);
    background: var(--color-background);
}

.patients-toolbar__titlerow[b-ugab1z533j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
}

.patients-toolbar__heading[b-ugab1z533j] {
    display: flex;
    align-items: baseline;
    gap: var(--space-3);
    min-width: 0;
}

.patients-toolbar__title[b-ugab1z533j] {
    margin: 0;
    font-size: var(--font-size-2xl);
}

.patients-toolbar__count[b-ugab1z533j] {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    white-space: nowrap;
}

/* Page info note */
.patients-toolbar__note[b-ugab1z533j] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    background: var(--color-info-muted);
    color: var(--color-info);
    font-size: var(--font-size-sm);
}

/* Search field — magnifier on the right. */
.patients-toolbar__search[b-ugab1z533j] {
    position: relative;
    display: flex;
    align-items: center;
    color: var(--color-text-muted);
}

.patients-toolbar__searchinput[b-ugab1z533j] {
    width: 100%;
    box-sizing: border-box;
    height: 2.75rem;
    padding: 0 calc(var(--space-6) + var(--space-3)) 0 var(--space-4);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    background: var(--color-surface);
    color: var(--color-text-primary);
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.patients-toolbar__searchinput[b-ugab1z533j]::placeholder {
    color: var(--color-text-muted);
}

.patients-toolbar__searchinput:focus[b-ugab1z533j] {
    border-color: var(--color-medium-blue);
    box-shadow: 0 0 0 3px rgba(36, 114, 179, 0.15);
}

.patients-toolbar__search[b-ugab1z533j]  .patients-toolbar__searchicon {
    position: absolute;
    right: var(--space-4);
    top: 50%;
    transform: translateY(-50%);
    color: var(--color-text-muted);
    pointer-events: none;
}

/* Controls row: segmented view toggle + filter button. */
.patients-toolbar__controls[b-ugab1z533j] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.patients-seg[b-ugab1z533j] {
    display: flex;
    flex: 1 1 auto;
    gap: var(--space-1);
    padding: 3px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    background: var(--color-surface-raised);
}

.patients-seg__btn[b-ugab1z533j] {
    flex: 1 1 0;
    padding: var(--space-2) var(--space-3);
    border: none;
    border-radius: var(--radius-full);
    background: transparent;
    color: var(--color-text-secondary);
    font-family: var(--font-sans);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    touch-action: manipulation;
    transition: background 0.15s ease, color 0.15s ease;
}

.patients-seg__btn--active[b-ugab1z533j] {
    background: var(--color-primary);
    color: var(--color-text-on-primary);
    font-weight: var(--font-weight-semibold);
}

.patients-iconbtn[b-ugab1z533j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 2.75rem;
    height: 2.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-text-secondary);
    cursor: pointer;
    touch-action: manipulation;
    transition: background 0.15s ease, color 0.15s ease;
}

.patients-iconbtn--active[b-ugab1z533j] {
    background: var(--color-primary);
    color: var(--color-text-on-primary);
    border-color: var(--color-primary);
}

/* Filter chips */
.patients-toolbar__filters[b-ugab1z533j] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.patients-chip[b-ugab1z533j] {
    padding: var(--space-1) var(--space-3);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    background: var(--color-surface);
    color: var(--color-text-secondary);
    font-family: var(--font-sans);
    font-size: var(--font-size-sm);
    cursor: pointer;
    touch-action: manipulation;
    transition: background 0.15s ease, color 0.15s ease;
}

.patients-chip--active[b-ugab1z533j] {
    background: var(--color-primary);
    color: var(--color-text-on-primary);
    border-color: var(--color-primary);
    font-weight: var(--font-weight-semibold);
}

/* List — its own scroll panel so the page doesn't grow into one endless list and
   the toolbar above stays put. Virtualization renders only the visible rows, so this
   scales to hundreds of patients. */
.patients-list[b-ugab1z533j] {
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    max-height: calc(100 * var(--vh) - 25rem);
    min-height: 14rem;
    padding-right: var(--space-1);
}

.patients-list[b-ugab1z533j]  .patient-row {
    margin-bottom: var(--space-2);
}

.patients-group[b-ugab1z533j] {
    padding: var(--space-3) var(--space-1) var(--space-1);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-text-muted);
}

.patients-empty[b-ugab1z533j] {
    margin-top: var(--space-6);
    text-align: center;
    color: var(--color-text-secondary);
}
/* /Pages/Profile.razor.rz.scp.css */
.profile-options[b-t4nc3x9le8] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    width: 100%;
    max-width: 640px;          /* centered & capped on tablet/desktop */
    margin: 0 auto;
    padding: var(--space-4);
    box-sizing: border-box;    /* keep padding inside the width on small screens */
}

@media (max-width: 380px) {
    .profile-options[b-t4nc3x9le8] {
        gap: var(--space-2);
        padding: var(--space-3);
    }
}
/* /Pages/ProfileMandateDetail.razor.rz.scp.css */
.mandate-detail[b-imw8zyqufa] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
    padding: var(--space-4);
    box-sizing: border-box;
}

.mandate-detail__intro[b-imw8zyqufa] {
    margin: 0;
    color: var(--text-muted, inherit);
}

.mandate-detail__actions[b-imw8zyqufa] {
    display: flex;
    flex-direction: column;
}

@media (max-width: 380px) {
    .mandate-detail[b-imw8zyqufa] {
        gap: var(--space-2);
        padding: var(--space-3);
    }
}
/* /Pages/ProfileMandates.razor.rz.scp.css */
.mandates[b-58wuo2gku5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
    padding: var(--space-4);
    box-sizing: border-box;
}

.mandates__info[b-58wuo2gku5] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-4);
    border-radius: var(--radius-md);
    background-color: var(--color-info-muted);
    color: var(--color-info);
}

.mandates__info .rz-icon[b-58wuo2gku5] {
    flex-shrink: 0;
    font-size: 1.5rem;
}

.mandates__info p[b-58wuo2gku5] {
    margin: 0;
}

.mandates__empty[b-58wuo2gku5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-5) var(--space-3);
    text-align: center;
    color: var(--text-muted, inherit);
}

.mandates__empty p[b-58wuo2gku5] {
    margin: 0;
}

.mandates__empty .rz-icon[b-58wuo2gku5] {
    font-size: 2.5rem;
    opacity: 0.5;
}

.mandates__list[b-58wuo2gku5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.mandate-card[b-58wuo2gku5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    width: 100%;
    text-align: left;
}

.mandate-card__row[b-58wuo2gku5] {
    display: flex;
    gap: var(--space-2);
}

.mandate-card__label[b-58wuo2gku5] {
    font-weight: 600;
    min-width: 7rem;
}

.mandate-card__value[b-58wuo2gku5] {
    flex: 1;
}

@media (max-width: 380px) {
    .mandates[b-58wuo2gku5] {
        gap: var(--space-2);
        padding: var(--space-3);
    }
}
/* /Pages/ProfileSettings.razor.rz.scp.css */
.profile-settings[b-n43swtaxca] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    width: 100%;
    max-width: 640px;          /* centered & capped on tablet/desktop */
    margin: 0 auto;
    padding: var(--space-4);
    box-sizing: border-box;    /* keep padding inside the width on small screens */
}

.settings-field[b-n43swtaxca] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.settings-label[b-n43swtaxca] {
    font-weight: 600;
}

.settings-actions[b-n43swtaxca] {
    display: flex;
    justify-content: center;
    margin-top: var(--space-3);
}

/* Smaller, pill-shaped Save button instead of a full-width bar. */
.settings-actions[b-n43swtaxca]  .app-btn {
    min-width: 8rem;
    padding-inline: var(--space-5);
}

.settings-toggles[b-n43swtaxca] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    margin-top: var(--space-1);
}

.settings-toggle[b-n43swtaxca] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

@media (max-width: 380px) {
    .profile-settings[b-n43swtaxca] {
        gap: var(--space-2);
        padding: var(--space-3);
    }
}