/* Shared authenticated UI tokens and patterns. Component CSS owns only its layout. */
:root:has(.workspace-shell) {
    --rz-text-font-family: var(--font-family);
    --rz-text-color: var(--text);
    --rz-body-background-color: var(--bg);
    --rz-layout-background-color: var(--bg);
}

.workspace-shell,
.workspace-navigation-dialog,
.workspace-dialog {
    --border: #c9d3d8;
    --border-soft: #dce3e7;
    --muted: #50616b;
    --primary-soft: #e5f1ef;
    --sidebar-bg: #f6f8f9;
    --sidebar-fg: var(--text);
    --sidebar-muted: var(--muted);
    --workspace-control-border: #7c8b94;
    --workspace-status-warning: #805515;
    --workspace-status-warning-bg: #fff8eb;
    --workspace-status-error: #a73232;
    --workspace-status-error-bg: #fff0f0;
}

/* Shared content spacing; mobile cards keep more room for their controls. */
.workspace-shell .content { padding: 2rem; }
@media (max-width: 1060px) {
    .workspace-shell .content { padding: 1.5rem 1rem; }
}
@media (max-width: 575px) {
    .workspace-shell .content { padding: 1rem .75rem; }
    .workspace-shell .card { padding: 1rem; }
}

.workspace-shell .page-header h1 {
    font-size: 1.625rem;
    line-height: 1.3;
    font-weight: 600;
    letter-spacing: -.025em;
}

.workspace-shell .page-header .lede { font-size: .875rem; }
.workspace-shell .workspace-form-page { max-width: 50rem; }
.workspace-shell .workspace-form-section h2,
.workspace-shell .workspace-section-title { font-size: 1rem; font-weight: 600; }
.workspace-shell .workspace-form-section h2 { margin-bottom: 1.25rem; }
.workspace-shell .workspace-form-page .form-label { font-size: .8125rem; font-weight: 500; }

.workspace-shell .workspace-form-page .form-control:not(.invalid):not(.is-invalid),
.workspace-shell .workspace-form-page .form-select:not(.invalid):not(.is-invalid) {
    border-color: var(--workspace-control-border);
}

.workspace-shell .workspace-form-page .form-control:not(.invalid):not(.is-invalid):focus,
.workspace-shell .workspace-form-page .form-select:not(.invalid):not(.is-invalid):focus {
    border-color: var(--primary);
}

.workspace-shell .workspace-form-page :is(.form-control, .form-select):focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}

.workspace-shell .form-actions,
.workspace-dialog .form-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .75rem;
    border-top: 1px solid var(--border);
    margin-top: 1.5rem;
    padding-top: 1.25rem;
}

.workspace-shell .form-actions .btn,
.workspace-dialog .form-actions .btn { min-height: 44px; }

.workspace-shell .workspace-status {
    display: inline-flex;
    align-items: center;
    padding: .25rem .625rem;
    border-radius: .3125rem;
    font-size: .75rem;
    font-weight: 500;
    color: var(--muted);
    background: var(--surface-muted);
}

.workspace-shell .workspace-status-approved { color: var(--primary); background: var(--primary-soft); }
.workspace-shell .workspace-status-pending { color: var(--workspace-status-warning); background: var(--workspace-status-warning-bg); }
.workspace-shell .workspace-status-error { color: var(--workspace-status-error); background: var(--workspace-status-error-bg); }

@media (max-width: 575px) {
    .workspace-shell .form-actions,
.workspace-dialog .form-actions { padding: 1rem; background: var(--sidebar-bg); }
    .workspace-shell .workspace-form-page .form-control,
    .workspace-shell .workspace-form-page .form-select { min-height: 44px; font-size: 1rem; }
}

/* Opt-in illustrations support the empty-state message without taking over the page. */
.workspace-shell .workspace-empty-state {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    padding: 2rem 1rem;
}
.workspace-shell .workspace-empty-state img { object-fit: contain; flex-shrink: 0; }
.workspace-shell .workspace-empty-state p { max-width: 28rem; }
@media (max-width: 575px) {
    .workspace-shell .workspace-empty-state { flex-direction: column; text-align: center; gap: 1rem; padding: 1.5rem .5rem; }
    .workspace-shell .workspace-empty-state img { width: 104px; height: 96px; }
}

/* Reusable operational pages: filters lead, data stays readable, surfaces stay quiet. */
.workspace-shell .workspace-operational-page .card {
    border-radius: .5rem;
    box-shadow: none;
}
.workspace-shell .workspace-operational-page .form-label { font-size: .8125rem; font-weight: 500; }
.workspace-shell .workspace-operational-page :is(.form-control, .form-select):not(.invalid):not(.is-invalid) {
    border-color: var(--workspace-control-border);
}
.workspace-shell .workspace-operational-page :is(.form-control, .form-select) { min-width: 0; }
.workspace-shell .workspace-operational-page :is(.form-control, .form-select):focus-visible,
.workspace-shell .workspace-operational-page .table-responsive:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}
.workspace-shell .workspace-operational-page .btn,
.workspace-shell .workspace-form-page .btn { min-height: 44px; }
.workspace-shell .workspace-filters .btn { width: 100%; }
.workspace-shell .table thead th { font-size: .875rem; color: var(--text); font-weight: 700; }
.workspace-shell .workspace-operational-page .table th[scope="row"] { font-size: .8125rem; color: var(--muted); font-weight: 600; }
.workspace-shell .workspace-operational-page .table td { padding-block: .75rem; }
@media (max-width: 575px) {
    .workspace-shell .workspace-operational-page :is(.form-control, .form-select) { min-height: 44px; font-size: 1rem; }
}

/* App-owned dialog content: Radzen hosts dialogs outside the workspace shell. */
.workspace-dialog { padding-top: .25rem; overflow-wrap: anywhere; }
.workspace-dialog .form-label { font-size: .8125rem; font-weight: 500; }
.workspace-dialog .form-text { color: var(--muted); }
.workspace-dialog :is(.form-control, .form-select):not(.invalid):not(.is-invalid) { border-color: var(--workspace-control-border); }
.workspace-dialog :is(.form-control, .form-select):focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.workspace-dialog .form-actions { justify-content: flex-end; }
@media (max-width: 575px) {
    .workspace-dialog :is(.form-control, .form-select) { min-height: 44px; font-size: 1rem; }
}

.workspace-shell .workspace-summary-label { margin: 0 0 .35rem; color: var(--muted); font-size: .8125rem; font-weight: 500; }
.workspace-shell .workspace-summary-value { margin: 0; color: var(--text); font-size: 1.75rem; font-weight: 600; line-height: 1.2; }
.workspace-shell .workspace-filter-result { color: var(--muted); font-size: .875rem; }

.workspace-dialog .form-group { margin-bottom: 1rem; }
.workspace-dialog .workspace-option-list { display: grid; gap: .25rem; max-height: 18rem; overflow-y: auto; padding: .25rem; }
.workspace-dialog .workspace-option { display: flex; align-items: flex-start; gap: .625rem; min-height: 44px; margin: 0; padding: .625rem .75rem; border: 1px solid var(--border); border-radius: var(--r-sm); }
.workspace-dialog .workspace-option .form-check-input { flex: 0 0 auto; float: none; margin-left: 0; }
.workspace-dialog .workspace-option .form-check-label { min-width: 0; }
.workspace-dialog .form-check-input:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.workspace-shell .workspace-data-table { min-width: 44rem; }

.workspace-dialog .workspace-field-group { margin-bottom: 1.5rem; }
.workspace-dialog .workspace-field-group legend { font-size: 1rem; font-weight: 600; margin-bottom: 1rem; }

.workspace-dialog .form-check-input { border-color: var(--workspace-control-border); }
.workspace-dialog .form-check-input:checked { background-color: var(--primary); border-color: var(--primary); }

/* DialogOptions.CssClass: keep preferred widths within the available viewport. */
.workspace-modal { max-width: calc(100vw - 2rem); }

.workspace-shell { --bs-success-rgb: 15, 118, 110; }
.workspace-shell .workspace-appointment-table { min-width: 58rem; }


/* Public Radzen component class and theme token, no internal selectors. */
.workspace-row-actions { width: 44px; height: 44px; }
.workspace-row-menu {
    --rz-menu-item-focus-outline: 2px solid var(--primary);
}
.workspace-row-actions,
.workspace-row-menu { --rz-outline-focus: 2px solid var(--primary); }

/* Onboarding: next action and factual remaining work, shared across its components. */
.workspace-shell .onboarding-step { display: flex; align-items: start; justify-content: space-between; gap: 1rem; padding-block: 1rem; }
.workspace-shell .onboarding-step > div { min-width: 0; overflow-wrap: anywhere; }
.workspace-shell .onboarding-step .btn { flex-shrink: 0; min-height: 44px; }
.workspace-shell .onboarding-steps .onboarding-step + .onboarding-step { border-top: 1px solid var(--border-soft); }
.workspace-shell .onboarding-next { display: block; padding: 0; }
.workspace-shell .onboarding-next .btn { margin-top: 1rem; }
.workspace-shell .onboarding-paths { display: flex; flex-wrap: wrap; gap: 1.5rem; }
.workspace-shell .onboarding-paths > div { flex: 1 1 15rem; }
@media (max-width: 575px) {
    .workspace-shell .onboarding-step { flex-direction: column; }
    .workspace-shell .onboarding-next .btn { width: 100%; }
}

.profile-review { font-size: .875rem; }
.profile-review-separated { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--border); }
.profile-review h2 { margin-bottom: .75rem; }
