/* Shared visual foundation and component layer for authenticated workspaces.
   Context styles own rail identity and page-specific composition only. */
:root {
    --workspace-font-body: "DM Sans", system-ui, -apple-system, sans-serif;
    --workspace-font-display: "Lora", Georgia, serif;

    --workspace-counsel-navy: #0d1b2a;
    --workspace-counsel-gold: #e2b659;
    --workspace-document-ink: #172533;
    --workspace-canvas: #f6f3ed;
    --workspace-paper: #fdfcfa;
    --workspace-muted: #5f6d7e;
    --workspace-rule: #d6dce2;
    --workspace-staff-rail-text: #f8f7f3;
    --workspace-client-olive: #25291f;
    --workspace-client-rail-text: #f6f1df;
    --workspace-status-success: #0a6948;
    --workspace-status-caution: #8b4a05;
    --workspace-status-danger: #a4312b;
    --workspace-staff-focus: #2b6ea3;
    --workspace-client-focus: #246b61;

    --workspace-radius-control-sm: 5px;
    --workspace-radius-control: 6px;
    --workspace-radius-compact: 8px;
    --workspace-radius-pill: 999px;

    --workspace-shadow-resting: 0 2px 12px rgba(13, 27, 42, 0.05);
    --workspace-shadow-hover: 0 4px 20px rgba(13, 27, 42, 0.09);
    --workspace-shadow-floating: 0 18px 45px rgba(0, 0, 0, 0.28);
    --workspace-focus-width: 3px;
    --workspace-focus-offset: 2px;
    --workspace-target-min: 44px;
}

* {
    box-sizing: border-box;
}

.workspace-shell {
    display: grid;
    grid-template-columns: var(--workspace-rail-width) minmax(0, 1fr);
    min-height: var(--workspace-shell-min-height, 100dvh);
}

.workspace-rail {
    align-self: start;
    background: var(--workspace-rail-background);
    color: var(--workspace-rail-foreground);
    display: flex;
    flex-direction: column;
    height: var(--workspace-rail-height, 100dvh);
    max-height: var(--workspace-rail-height, 100dvh);
    min-height: 0;
    overflow-y: auto;
    position: sticky;
    top: 0;
}

.workspace-canvas {
    min-width: 0;
}

/* Browser surfaces belong to the same visual system as rendered controls. */
::selection {
    background: rgba(226, 182, 89, 0.42);
    color: var(--workspace-document-ink);
}

.workspace-ui {
    --workspace-ui-ink: var(--workspace-document-ink);
    --workspace-ui-muted: var(--workspace-muted);
    --workspace-ui-rule: var(--workspace-rule);
    --workspace-ui-soft: #f3f5f6;
    --workspace-ui-focus: var(--workspace-staff-focus);
    accent-color: var(--workspace-counsel-navy);
    caret-color: var(--workspace-counsel-navy);
    scrollbar-color: var(--workspace-muted) var(--workspace-canvas);
}

.workspace-skip-link {
    position: fixed;
    top: 1rem;
    left: 1rem;
    z-index: 2000;
    padding: 0.65rem 0.9rem;
    border: 2px solid var(--workspace-counsel-navy);
    border-radius: var(--workspace-radius-control-sm);
    background: var(--workspace-paper);
    color: var(--workspace-counsel-navy);
    font-weight: 700;
    text-decoration: none;
    transform: translateY(calc(-100% - 2rem));
    transition: transform 140ms ease-out;
}

.workspace-skip-link:focus {
    color: var(--workspace-counsel-navy);
    transform: translateY(0);
}

/* Admin is the component authority. Portal-specific classes remain only as
   composition hooks while these shared primitives own component appearance. */
.staff-page,
.portal-main {
    color: var(--workspace-ui-ink);
}

.portal-main {
    --workspace-ui-focus: var(--workspace-client-focus);
}

.workspace-panel,
.workspace-form,
.workspace-empty,
.staff-page .card {
    border: 1px solid var(--workspace-ui-rule);
    border-radius: var(--workspace-radius-compact);
    background: var(--workspace-paper);
    box-shadow: none;
}

.staff-page .card {
    overflow: hidden;
}

.staff-page .card:hover {
    box-shadow: none;
}

.staff-page .card-header {
    padding: 0.9rem 1.1rem;
    border-bottom-color: var(--workspace-ui-rule);
    background: var(--workspace-paper);
}

.staff-page .card-body {
    padding: 1.1rem;
}

.staff-page .card-header :is(h2, h4, h5, h6) {
    font-family: var(--workspace-font-body);
}

.staff-page .table {
    margin-bottom: 0;
}

.staff-page .table > :not(caption) > * > * {
    padding: 0.72rem;
    border-color: var(--workspace-ui-rule);
}

.staff-page .badge.bg-primary,
.staff-page .badge.bg-info {
    background: #dceaf2 !important;
    color: #23445c !important;
}

.staff-page .badge.bg-success {
    background: #dff2e8 !important;
    color: var(--workspace-status-success) !important;
}

.staff-page .badge.bg-warning {
    background: #fae8c2 !important;
    color: #6f3d00 !important;
}

.staff-page .badge.bg-danger {
    background: #f6dedb !important;
    color: var(--workspace-status-danger) !important;
}

.staff-page .badge.bg-secondary,
.staff-page .badge.bg-dark {
    background: #e9edf0 !important;
    color: #4d5c6a !important;
}

.workspace-button,
.staff-page .btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--workspace-target-min);
    border: 1px solid var(--workspace-counsel-navy);
    border-radius: var(--workspace-radius-control);
    background: var(--workspace-counsel-navy);
    color: var(--workspace-paper);
    cursor: pointer;
    font: inherit;
    font-weight: 700;
    gap: 0.45rem;
    text-decoration: none;
}

.workspace-button {
    padding: 0.6rem 0.9rem;
}

.staff-page .btn {
    min-height: var(--workspace-target-min);
}

.staff-page .btn-sm {
    min-height: 36px;
}

.workspace-button:hover,
.workspace-button:focus-visible,
.staff-page .btn-primary:hover,
.staff-page .btn-primary:focus-visible {
    border-color: #16283a;
    background: #16283a;
    color: #fff;
}

.workspace-button:focus-visible,
.workspace-form :is(input, select, textarea):focus-visible,
.staff-page :is(.btn, .form-control, .form-select, .form-check-input):focus-visible {
    outline: var(--workspace-focus-width) solid var(--workspace-ui-focus);
    outline-offset: var(--workspace-focus-offset);
    box-shadow: none;
}

.workspace-button-secondary,
.staff-page .btn-outline-primary {
    border-color: #526475;
    background: transparent;
    color: var(--workspace-ui-ink);
}

.workspace-button-secondary:hover,
.workspace-button-secondary:focus-visible,
.staff-page .btn-outline-primary:hover,
.staff-page .btn-outline-primary:focus-visible {
    border-color: var(--workspace-counsel-navy);
    background: var(--workspace-counsel-navy);
    color: #fff;
}

.workspace-button-danger,
.staff-page .btn-outline-danger {
    border-color: var(--workspace-status-danger);
    background: transparent;
    color: var(--workspace-status-danger);
}

.workspace-button-danger:hover,
.workspace-button-danger:focus-visible,
.staff-page .btn-outline-danger:hover,
.staff-page .btn-outline-danger:focus-visible {
    border-color: var(--workspace-status-danger);
    background: var(--workspace-status-danger);
    color: #fff;
}

.workspace-button-small {
    min-height: 36px;
    padding: 0.42rem 0.68rem;
    font-size: 0.875rem;
}

.workspace-button:disabled,
.staff-page .btn:disabled,
.staff-page .btn.disabled {
    border-color: var(--workspace-ui-rule);
    background: #c8cdd1;
    color: #4d5c6a;
    cursor: not-allowed;
    opacity: 1;
}

.staff-page .btn-warning {
    border-color: #d6a645;
    background: #f5c451;
    color: var(--workspace-ui-ink);
}

.staff-page .btn-danger {
    border-color: var(--workspace-status-danger);
    background: var(--workspace-status-danger);
}

.staff-page .btn-secondary {
    border-color: #526475;
    background: #526475;
}

.staff-page .btn-success {
    border-color: var(--workspace-status-success);
    background: var(--workspace-status-success);
}

.staff-page .btn-outline-secondary,
.staff-page .btn-outline-info {
    border-color: #526475;
    background: transparent;
    color: var(--workspace-ui-ink);
}

.staff-page .btn-outline-secondary:hover,
.staff-page .btn-outline-secondary:focus-visible,
.staff-page .btn-outline-info:hover,
.staff-page .btn-outline-info:focus-visible {
    border-color: #526475;
    background: #526475;
    color: #fff;
}

.staff-page .btn-outline-success {
    border-color: var(--workspace-status-success);
    background: transparent;
    color: var(--workspace-status-success);
}

.staff-page .btn-outline-success:hover,
.staff-page .btn-outline-success:focus-visible {
    background: var(--workspace-status-success);
    color: #fff;
}

.staff-page .btn-outline-warning {
    border-color: var(--workspace-status-caution);
    background: transparent;
    color: var(--workspace-status-caution);
}

.staff-page .btn-outline-warning:hover,
.staff-page .btn-outline-warning:focus-visible {
    background: var(--workspace-status-caution);
    color: #fff;
}

.workspace-form {
    padding: 1.1rem;
}

.workspace-form :is(input, select, textarea) {
    width: 100%;
    min-height: var(--workspace-target-min);
    padding: 0.65rem 0.75rem;
    border: 1px solid var(--workspace-ui-rule);
    border-radius: var(--workspace-radius-control);
    background: #fff;
    color: var(--workspace-ui-ink);
    font: inherit;
}

.workspace-form textarea {
    min-height: 7rem;
    resize: vertical;
}

.workspace-form input[type="checkbox"],
.workspace-form input[type="radio"] {
    width: auto;
    min-height: auto;
}

.workspace-table {
    overflow: hidden;
    border: 1px solid var(--workspace-ui-rule);
    border-radius: var(--workspace-radius-compact);
    background: var(--workspace-paper);
}

.workspace-table-row {
    display: flex;
    justify-content: space-between;
    gap: 1.25rem;
    padding: 0.9rem 1rem;
    border-bottom: 1px solid var(--workspace-ui-rule);
}

.workspace-table-row:last-child {
    border-bottom: 0;
}

.workspace-empty {
    padding: 1.5rem;
}

.workspace-alert,
.admin-staff-main > .alert {
    padding: 0.85rem 1rem;
    border: 1px solid var(--workspace-ui-rule);
    border-radius: var(--workspace-radius-control);
    background: var(--workspace-paper);
    color: var(--workspace-ui-ink);
}

.workspace-alert-success,
.admin-staff-main > .alert-success,
.staff-page .alert-success {
    border-color: #b9ddcd;
    background: #edf7f2;
    color: var(--workspace-status-success);
}

.workspace-alert-warning,
.admin-staff-main > .alert-warning,
.staff-page .alert-warning {
    border-color: #e4ca8c;
    background: #fff7e3;
    color: #6f3d00;
}

.workspace-alert-danger,
.admin-staff-main > .alert-danger,
.staff-page .alert-danger {
    border-color: #e7bbb6;
    background: #fdf1ef;
    color: var(--workspace-status-danger);
}

.workspace-alert-info,
.workspace-alert-primary,
.admin-staff-main > .alert-info,
.admin-staff-main > .alert-primary,
.staff-page .alert-info,
.staff-page .alert-primary {
    border-color: #c4d6e0;
    background: #eef4f7;
    color: #23445c;
}

.staff-page .alert-secondary,
.staff-page .alert-light {
    border-color: var(--workspace-ui-rule);
    background: var(--workspace-paper);
    color: var(--workspace-ui-muted);
}

.staff-page .form-check-input:checked {
    border-color: var(--workspace-counsel-navy);
    background-color: var(--workspace-counsel-navy);
}