/* Shared visual tokens for Razor account pages and both Blazor workspaces. */
:root {
    color-scheme: light;
    --psx-charcoal: #1d2325;
    --psx-bg: #f3f5f5;
    --psx-surface: #ffffff;
    --psx-subtle: #edf1f1;
    --psx-border: #d4dcdc;
    --psx-input-border: #aab8b8;
    --psx-text: #202b2d;
    --psx-muted: #546668;
    --psx-card-content-gap: 1rem;
    --psx-card-content-padding: 1.5rem;
    --psx-card-action-gap: .5rem;
    --psx-faint: #6c7b7d;
    --psx-accent: #006b60;
    --psx-accent-hover: #00564d;
    --psx-accent-soft: #deeeea;
    --psx-on-accent: #ffffff;
    --psx-success: #186745;
    --psx-success-bg: #e7f3eb;
    --psx-warning: #805200;
    --psx-warning-bg: #fff2d5;
    --psx-warning-fill: #f2cc36;
    --psx-on-warning: #342b0b;
    --psx-danger: #a02b35;
    --psx-danger-bg: #fcebed;
    --psx-danger-fill: #a02b35;
    --psx-on-danger: #fcebed;
    --psx-info: #245c89;
    --psx-info-bg: #e9f1fa;
    --psx-shadow: 0 2px 8px rgb(0 0 0 / 5%);
}
html[data-psx-theme="dark"] {
    color-scheme: dark;
    --psx-bg: #141819;
    --psx-surface: var(--psx-charcoal);
    --psx-subtle: #262e30;
    --psx-border: #394649;
    --psx-input-border: #64777a;
    --psx-text: #edf2f1;
    --psx-muted: #b2c1c2;
    --psx-faint: #91a5a7;
    --psx-accent: #72d6c3;
    --psx-accent-hover: #9de5d8;
    --psx-accent-soft: #203e39;
    --psx-on-accent: #102c26;
    --psx-success: #8bddae;
    --psx-success-bg: #203b2c;
    --psx-warning: #f1cc7b;
    --psx-warning-bg: #3c3221;
    --psx-warning-fill: #f1cc7b;
    --psx-on-warning: #3c3221;
    --psx-danger: #ffadb6;
    --psx-danger-bg: #432a2f;
    --psx-danger-fill: #d63b35;
    --psx-on-danger: #ffffff;
    --psx-info: #acd4fa;
    --psx-info-bg: #273745;
    --psx-shadow: 0 2px 8px rgb(0 0 0 / 15%);
}
html[data-psx-theme] {
    --rz-primary: var(--psx-accent);
    --rz-primary-light: var(--psx-accent-hover);
    --rz-primary-lighter: var(--psx-accent-soft);
    --rz-primary-dark: var(--psx-accent-hover);
    --rz-primary-darker: var(--psx-accent);
    --rz-on-primary: var(--psx-on-accent);
    --rz-on-primary-light: var(--psx-on-accent);
    --rz-on-primary-dark: var(--psx-on-accent);
    --rz-on-primary-darker: var(--psx-on-accent);
    --rz-on-primary-lighter: var(--psx-accent);
    --rz-secondary: var(--psx-muted);
    --rz-secondary-light: var(--psx-muted);
    --rz-secondary-dark: var(--psx-text);
    --rz-secondary-lighter: var(--psx-subtle);
    --rz-on-secondary: var(--psx-surface);
    --rz-on-secondary-dark: var(--psx-surface);
    --rz-on-secondary-lighter: var(--psx-text);
    --rz-success: var(--psx-success);
    --rz-on-success: var(--psx-success-bg);
    --rz-warning: var(--psx-warning-fill);
    --rz-on-warning: var(--psx-on-warning);
    --rz-danger: var(--psx-danger-fill);
    --rz-on-danger: var(--psx-on-danger);
    --rz-info: var(--psx-info);
    --rz-on-info: var(--psx-info-bg);
    --rz-body-background-color: var(--psx-bg);
    --rz-base-background-color: var(--psx-surface);
    --rz-text-font-family: "Segoe UI", Arial, sans-serif;
    --rz-text-color: var(--psx-text);
    --rz-text-title-color: var(--psx-text);
    --rz-text-secondary-color: var(--psx-muted);
    --rz-text-tertiary-color: var(--psx-muted);
    --rz-link-color: var(--psx-accent);
    --rz-link-hover-color: var(--psx-accent-hover);
    --rz-border-normal: 1px solid var(--psx-input-border);
    --rz-border-hover: 1px solid var(--psx-accent);
    --rz-border-base-300: 1px solid var(--psx-border);
    --rz-border-radius: 6px;
    --rz-input-background-color: var(--psx-surface);
    --rz-input-hover-background-color: var(--psx-surface);
    --rz-input-focus-background-color: var(--psx-surface);
    --rz-input-disabled-background-color: var(--psx-subtle);
    --rz-input-disabled-color: var(--psx-muted);
    --rz-input-disabled-placeholder-color: var(--psx-muted);
    --rz-dropdown-filter-border: 1px solid var(--psx-border);
    --rz-listbox-filter-border: 1px solid var(--psx-border);
    --rz-dropdown-item-hover-background-color: var(--psx-subtle);
    --rz-dropdown-item-hover-color: var(--psx-text);
    --rz-dropdown-panel-shadow: var(--psx-shadow);
    --rz-datepicker-calendar-hover-background-color: var(--psx-subtle);
    --rz-datepicker-panel-shadow: var(--psx-shadow);
    --rz-card-background-color: var(--psx-surface);
    --rz-card-shadow: none;
    --rz-grid-header-background-color: var(--psx-subtle);
    --rz-grid-stripe-background-color: var(--psx-subtle);
    --rz-grid-stripe-odd-background-color: var(--psx-surface);
    --rz-datepicker-calendar-selected-color: var(--psx-on-accent);
    --rz-datepicker-calendar-selected-background-color: var(--psx-accent);
    --rz-datepicker-calendar-selected-hover-color: var(--psx-on-accent);
    --rz-datepicker-calendar-selected-hover-background-color: var(--psx-accent-hover);
    --rz-panel-menu-item-color: var(--psx-text);
    --rz-panel-menu-item-background-color: transparent;
    --rz-panel-menu-item-hover-color: var(--psx-text);
    --rz-panel-menu-item-hover-background-color: var(--psx-subtle);
    --rz-panel-menu-item-active-color: var(--psx-accent);
    --rz-panel-menu-item-active-background-color: var(--psx-accent-soft);
    --rz-panel-menu-item-active-indicator: var(--psx-accent);
    --rz-panel-menu-item-padding-block: .7rem;
    --rz-panel-menu-item-border: 0;
    --rz-panel-menu-icon-color: var(--psx-muted);
}
html, body { margin: 0; background: var(--psx-bg); color: var(--psx-text); font-family: var(--rz-text-font-family); }
body, button, input, select, textarea { letter-spacing: 0; }
h1, h2, h3, h4, h5, h6, .rz-button, .rz-tabview-title, .rz-badge { letter-spacing: 0; }
.page-title { font-size: 1.65rem; line-height: 1.25; }
.section-title { font-size: 1.15rem; line-height: 1.35; }
.rz-button { box-shadow: none; text-transform: none; }
/* Unfilled variants need readable ink, independently of the filled palette. */
.rz-variant-outlined, .rz-variant-text {
    --rz-warning: var(--psx-warning);
    --rz-danger: var(--psx-danger);
}
.rz-alert .rz-button.rz-variant-text.rz-light[aria-label="Cerrar"] { color: inherit; }
.rz-alert .rz-button.rz-variant-text.rz-light[aria-label="Cerrar"]:hover { background-color: color-mix(in srgb, currentColor 12%, transparent); }
.rz-button:focus-visible, .theme-option:focus-visible, a:focus-visible { outline: 2px solid var(--psx-accent); outline-offset: 3px; }
.rz-tabview-nav li button { text-transform: none; }
.rz-card { border-radius: 6px; }
.rz-data-grid { border: 1px solid var(--psx-border); border-radius: 6px; }
.rz-grid-table th, .rz-grid-table td { font-variant-numeric: tabular-nums; }

/* A single shell keeps platform and tenant navigation visually identical. */
.workspace-shell .rz-layout.app-shell { display: grid; height: 100dvh; grid-template-columns: 250px minmax(0, 1fr); grid-template-rows: 64px minmax(0, 1fr); grid-template-areas: "sidebar header" "sidebar body"; overflow: hidden; }
.workspace-shell .app-sidebar { grid-area: sidebar; position: static; width: auto; transform: none; opacity: 1; background: var(--psx-surface); border-right: 1px solid var(--psx-border); overflow: auto; }
.workspace-shell .app-header { grid-area: header; background: var(--psx-surface); color: var(--psx-text); border-bottom: 1px solid var(--psx-border); box-shadow: none; }
.workspace-shell .header-content { min-height: 64px; padding: .65rem 1.25rem; gap: 1rem; }
.workspace-shell .header-title, .workspace-shell .header-content h6 { margin: 0; font-size: .95rem; font-weight: 600; color: var(--psx-text); }
.header-identity, .header-actions { display: flex; align-items: center; gap: .75rem; min-width: 0; }
.header-user { color: var(--psx-muted); font-size: .8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 12rem; }
.header-action-link { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; text-decoration: none; min-height: 36px; }
.workspace-shell .app-header .header-action-link { color: var(--psx-text); background: var(--psx-subtle); box-shadow: none; }
.workspace-shell .app-header .header-action-link:hover, .workspace-shell .app-header .header-action-link:focus { color: var(--psx-accent); background: var(--psx-accent-soft); box-shadow: none; }
.workspace-shell .app-body { grid-area: body; margin: 0; min-width: 0; background: var(--psx-bg); overflow: auto; }
.workspace-shell .content { padding: 1.5rem; min-width: 0; }
.workspace-shell .content > .rz-stack > .rz-card { background: transparent; border: 0; border-radius: 0; padding: 1rem 0; box-shadow: none; }
.workspace-shell .content > .rz-stack > .rz-card + .rz-card { border-top: 1px solid var(--psx-border); }
.brand-panel { display: flex; flex-direction: column; align-items: center; gap: .5rem; padding: 1rem; border-bottom: 1px solid var(--psx-border); margin-bottom: .5rem; color: var(--psx-text); }
.sidebar-brand-logo { display: block; width: 192px; height: 128px; max-width: 100%; object-fit: contain; }
html:not([data-psx-theme="dark"]) img[data-psx-logo="dark"],
html[data-psx-theme="dark"] img[data-psx-logo="light"] { display: none; }
.brand-panel span { color: var(--psx-muted); font-size: .75rem; text-align: center; overflow-wrap: anywhere; }
.app-menu { background: transparent; border: 0; padding: .4rem; }
.uma-parameters dt { font-weight: 600; margin-top: .75rem; }
.uma-parameters dd { margin: .2rem 0 .75rem; }
.app-menu .rz-navigation-item-wrapper { border-radius: 4px; margin-bottom: .15rem; }
.app-menu .rz-navigation-item-link { font-size: .85rem; }
.navigation-group { margin: .15rem .4rem; }
.navigation-group summary { display: flex; align-items: center; gap: .6rem; padding: .8rem .6rem; cursor: pointer; border-radius: 4px; font-size: .85rem; font-weight: 600; list-style: none; }
.navigation-group summary::-webkit-details-marker { display: none; }
.navigation-group summary::after { content: "›"; margin-left: auto; font-size: 1.2rem; }
.navigation-group[open] > summary::after { transform: rotate(90deg); }
.navigation-group summary:hover { background: var(--psx-subtle); }
.navigation-group summary:focus-visible { outline: 2px solid var(--psx-accent); outline-offset: -2px; }
.navigation-group > .app-menu { padding-left: .8rem; }
.app-menu .rz-navigation-item-active .rz-navigation-item-icon { color: var(--psx-accent); }

.theme-switcher { display: inline-flex; align-items: center; gap: 2px; flex: 0 0 auto; padding: 3px; border: 1px solid var(--psx-border); border-radius: 6px; background: var(--psx-subtle); }
.theme-option { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 30px; padding: 0; border: 0; border-radius: 3px; background: transparent; color: var(--psx-muted); cursor: pointer; }
.theme-option .rzi { font-size: 1.15rem; }
.theme-option:hover { color: var(--psx-text); background: var(--psx-surface); }
.theme-option[aria-pressed="true"] { background: var(--psx-surface); color: var(--psx-accent); box-shadow: var(--psx-shadow); }
.login-theme-toolbar { position: absolute; inset: 1.25rem 1.5rem auto auto; z-index: 2; }
.login-workspace { position: relative; padding: 5rem 2.5rem 2.5rem; }
.login-panel { background: transparent; border: 0; box-shadow: none; padding: 0; max-width: 25rem; }
.login-panel-header h2 { font-size: 1.65rem; font-weight: 650; }
.login-panel-header .eyebrow { font-size: .8rem; }
.login-brand-logo { border: 0; box-shadow: none; border-radius: 0; object-fit: contain; }
.login-identity { background: var(--psx-surface); color: var(--psx-text); }
.login-identity::after { display: none; }
.login-evidence-strip { border: 0; border-radius: 0; padding: 0; letter-spacing: 0; color: var(--psx-muted); }
.login-evidence-strip span + span::before { background: var(--psx-accent); }
.login-trust-grid .rzi { border: 0; color: var(--psx-accent); }
.login-hero-message { border-top-color: var(--psx-border); }
.login-hero-message p { font-size: 1.05rem; color: var(--psx-text); }
.login-trust-grid strong { font-weight: 500; color: var(--psx-text); }
.login-submit { color: var(--psx-on-accent); }
.login-alert { border: 1px solid var(--psx-danger); font-weight: 500; }
.login-alert-info { border-color: var(--psx-accent); }
.account-status-shell { max-width: 42rem; margin: 8vh auto; padding: 2rem; }
.account-status-toolbar { display: flex; justify-content: flex-end; margin-bottom: 2rem; }
#blazor-error-ui { display: none; position: fixed; inset: auto 0 0; z-index: 1000; background: var(--psx-warning-bg); color: var(--psx-warning); padding: .85rem 1.25rem; border-top: 1px solid var(--psx-warning); }
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: .75rem; top: .5rem; }
@media (max-width: 1080px) { .header-user { display: none; } }
.header-user.admin-session-user { display: block; max-width: min(12rem, 35vw); }
@media (max-width: 800px) {
    .workspace-shell .rz-layout.app-shell { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto minmax(0, 1fr); grid-template-areas: "header" "sidebar" "body"; }
    .workspace-shell .header-content { padding: .6rem .8rem; min-height: 60px; flex-wrap: wrap; gap: .5rem; }
    .workspace-shell .header-title { font-size: .85rem; }
    .header-actions { gap: .4rem; margin-left: auto; }
    .header-action-link .header-action-label { display: none; }
    .workspace-shell .app-sidebar { max-height: 64px; border-right: 0; border-bottom: 1px solid var(--psx-border); }
    .workspace-shell .brand-panel { display: none; }
    .app-menu { display: flex; flex-wrap: nowrap; width: max-content; }
    .app-menu .rz-navigation-item { flex: 0 0 auto; }
    .workspace-shell .app-sidebar:has(.grouped-navigation) { max-height: 40vh; overflow-y: auto; }
    .grouped-navigation .app-menu { display: block; width: auto; }
    .workspace-shell .content { padding: 1rem; }
    .rz-tabview-nav { flex-wrap: wrap; }
    .rz-tabview-nav li { min-width: 0; }
    .rz-tabview-nav li button { padding: .7rem .65rem; font-size: .8rem; white-space: normal; overflow-wrap: anywhere; }
    .login-shell { grid-template-columns: 1fr; }
    .login-identity { min-height: auto; padding: 1.25rem; gap: .7rem; }
    .login-brand-logo { max-height: 9rem; width: auto; max-width: 100%; }
    .login-hero-message { margin: 0; padding-top: .75rem; }
    .login-hero-message p { font-size: .9rem; text-align: center; }
    .login-trust-grid, .login-evidence-strip { display: none; }
    .login-workspace { padding: 4.5rem 1.5rem 2rem; }
    .login-theme-toolbar { top: .8rem; right: 1.5rem; }
    .page-title { font-size: 1.4rem; }
    .account-status-shell { margin: 0 auto; padding: 1.25rem; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0s !important; } }
