/*
 * Shared semantic treatment for authenticated Client, Admin, and Alice
 * surfaces. Application styles may compose layouts, but theme colors and
 * control states resolve through the shared token/MudBlazor contract here.
 */

.rtu-authenticated-shell {
    min-width: 0;
    min-height: 100vh;
    color: var(--rtu-color-text);
    background-color: var(--rtu-color-background);
}

.rtu-authenticated-shell :where(.mud-layout, .mud-main-content, .mud-container, .mud-grid-item, .mud-paper) {
    min-width: 0;
}

.rtu-authenticated-shell :where(p, li, dd, dt, code, .mud-typography-root) {
    overflow-wrap: anywhere;
}

.rtu-authenticated-shell :where(a, .mud-button-root, .mud-icon-button, .mud-nav-link, [role="button"]) {
    min-block-size: var(--rtu-touch-target-min);
}

.rtu-authenticated-shell :where(.mud-icon-button, [role="button"]) {
    min-inline-size: var(--rtu-touch-target-min);
}

.rtu-authenticated-shell :where(.mud-input-control .mud-input, .mud-select, .mud-picker) {
    min-block-size: var(--rtu-control-min-height);
}

.rtu-authenticated-shell :where(.mud-disabled, [disabled], [aria-disabled="true"]) {
    color: var(--rtu-color-disabled-text) !important;
}

.rtu-authenticated-shell .mud-button-root.mud-disabled {
    background-color: var(--rtu-color-disabled-background);
}

.rtu-authenticated-shell .mud-button-filled:not(.mud-disabled) {
    background-color: var(--rtu-color-surface-subtle) !important;
    color: var(--rtu-color-text) !important;
}

.rtu-authenticated-shell .mud-button-filled-primary:not(.mud-disabled) {
    background-color: var(--rtu-color-primary) !important;
    color: var(--rtu-color-on-primary) !important;
}

.rtu-authenticated-shell .mud-button-filled-secondary:not(.mud-disabled) {
    background-color: var(--rtu-color-secondary) !important;
    color: var(--rtu-color-on-secondary) !important;
}

.rtu-authenticated-shell .mud-button-filled-info:not(.mud-disabled) {
    background-color: var(--rtu-color-info) !important;
    color: var(--rtu-color-on-info) !important;
}

.rtu-authenticated-shell .mud-button-filled-success:not(.mud-disabled) {
    background-color: var(--rtu-color-success) !important;
    color: var(--rtu-color-on-success) !important;
}

.rtu-authenticated-shell .mud-button-filled-warning:not(.mud-disabled) {
    background-color: var(--rtu-color-warning) !important;
    color: var(--rtu-color-on-warning) !important;
}

.rtu-authenticated-shell .mud-button-filled-error:not(.mud-disabled) {
    background-color: var(--rtu-color-error) !important;
    color: var(--rtu-color-on-error) !important;
}

.rtu-authenticated-shell :where(.mud-simple-table, .mud-table-container, .rtu-table-scroll) {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
}

.rtu-authenticated-shell .rtu-table-scroll {
    border: 1px solid var(--rtu-color-border);
    border-radius: var(--rtu-radius-md);
}

.rtu-authenticated-shell .mud-table-root {
    color: var(--rtu-color-text);
}

.rtu-authenticated-shell .mud-table-root thead th {
    color: var(--rtu-color-text-muted);
}

.rtu-authenticated-shell .mud-table-root tbody tr:focus-within {
    box-shadow: inset 0 0 0 2px var(--rtu-color-focus);
}

.rtu-authenticated-shell :where(.client-page-hero, .client-page-panel, .client-session-card, .client-quick-card, .rtu-metric-card, .rtu-billing-banner, .rtu-map-card) {
    border-color: var(--rtu-color-border) !important;
    border-radius: var(--rtu-radius-card) !important;
    background: var(--rtu-color-surface) !important;
    color: var(--rtu-color-text);
    box-shadow: var(--rtu-elevation-card);
}

.rtu-authenticated-shell :where(.client-empty-state, .client-quick-search-panel, .client-quick-device-card) {
    border-color: var(--rtu-color-border) !important;
    background: var(--rtu-color-surface-subtle) !important;
    color: var(--rtu-color-text);
}

.rtu-authenticated-shell :where(.client-kpi-card .mud-typography-overline, .rtu-metric-card .mud-typography-overline) {
    color: var(--rtu-color-text-muted);
}

.rtu-authenticated-shell.client-shell,
.rtu-authenticated-shell.client-quick-shell,
.rtu-authenticated-shell.client-login-shell {
    background:
        radial-gradient(
            circle at top right,
            color-mix(in srgb, var(--rtu-color-primary) 12%, transparent),
            transparent 28%),
        radial-gradient(
            circle at top left,
            color-mix(in srgb, var(--rtu-color-secondary) 8%, transparent),
            transparent 24%),
        var(--rtu-color-background);
}

.rtu-authenticated-shell :where(.client-appbar, .client-quick-appbar, .client-login-appbar) {
    border-bottom-color: var(--rtu-color-border);
    background: color-mix(in srgb, var(--rtu-color-surface) 92%, transparent) !important;
    color: var(--rtu-color-text) !important;
}

.rtu-authenticated-shell .client-quick-main .client-main-container {
    padding: 0;
}

.rtu-authenticated-shell :where(.client-appbar-actions .mud-button-root, .client-theme-toggle, .client-menu-button) {
    color: var(--rtu-color-text) !important;
}

.rtu-authenticated-shell.mud-theme-light .client-appbar-actions .mud-button-root {
    color: var(--rtu-color-primary) !important;
}

.rtu-authenticated-shell .client-appbar-chip {
    border-color: var(--rtu-color-border) !important;
    color: var(--rtu-color-info) !important;
    background: color-mix(in srgb, var(--rtu-color-info) 10%, transparent);
}

.rtu-authenticated-shell .client-brand-link--light {
    color: var(--rtu-color-text);
}

.rtu-authenticated-shell .client-drawer {
    border-right-color: var(--rtu-color-border);
    background: var(--rtu-color-surface-subtle) !important;
    color: var(--rtu-color-text) !important;
}

.rtu-authenticated-shell .client-drawer .mud-nav-link {
    color: var(--rtu-color-text);
}

.rtu-authenticated-shell .client-drawer .mud-nav-link.active:not(.mud-nav-link-disabled) {
    color: var(--rtu-color-primary);
    background: color-mix(in srgb, var(--rtu-color-primary) 14%, transparent);
}

.rtu-authenticated-shell :where(.client-login-copy, .client-login-copy h1, .auth-entry__title, .auth-entry__call-title, .auth-entry__call-link) {
    color: var(--rtu-color-text) !important;
}

.rtu-authenticated-shell :where(.client-login-copy p, .client-login-copy__facts span, .auth-entry__subtitle, .auth-entry__brand-copy span, .auth-entry__call-text, .auth-entry__call-hint) {
    color: var(--rtu-color-text-muted) !important;
}

.rtu-authenticated-shell :where(.client-login-copy__eyebrow, .client-login-copy__facts div, .auth-entry__brand, .auth-entry__call-panel) {
    border-color: var(--rtu-color-border) !important;
    background: var(--rtu-color-surface-subtle) !important;
}

.rtu-authenticated-shell .client-login-copy__facts strong {
    color: var(--rtu-color-primary);
}

.rtu-authenticated-shell .auth-entry__card {
    border-color: var(--rtu-color-border) !important;
    background: var(--rtu-color-surface) !important;
    box-shadow: var(--rtu-elevation-dialog);
}

.rtu-authenticated-shell :where(.auth-entry__brand-copy strong, .auth-entry__close) {
    color: var(--rtu-color-text) !important;
}

.rtu-authenticated-shell .auth-entry__badge {
    border-color: var(--rtu-color-border) !important;
    background: color-mix(in srgb, var(--rtu-color-info) 10%, transparent);
    color: var(--rtu-color-info) !important;
}

.rtu-authenticated-shell .client-quick-context-note {
    color: var(--rtu-color-text-muted);
}

.rtu-authenticated-shell .client-quick-device-card__title .mud-typography-h5 {
    color: var(--rtu-color-text);
}

.rtu-authenticated-shell .client-quick-device-card__eyebrow {
    color: var(--rtu-color-primary);
}

.rtu-authenticated-shell .client-quick-status--online {
    color: var(--rtu-color-success);
    background: color-mix(in srgb, var(--rtu-color-success) 8%, transparent);
}

.rtu-authenticated-shell .client-quick-status--offline,
.rtu-authenticated-shell .client-quick-status--neutral {
    color: var(--rtu-color-text-muted);
    background: color-mix(in srgb, var(--rtu-color-text-muted) 8%, transparent);
}

.rtu-authenticated-shell .client-quick-status--connecting {
    color: var(--rtu-color-info);
    background: color-mix(in srgb, var(--rtu-color-info) 8%, transparent);
}

.rtu-authenticated-shell .client-quick-status--error {
    color: var(--rtu-color-error);
    background: color-mix(in srgb, var(--rtu-color-error) 8%, transparent);
}

.rtu-authenticated-shell .client-device-members__row {
    border-color: var(--rtu-color-border);
    background: var(--rtu-color-surface-subtle);
}

.rtu-authenticated-shell .client-device-members__row strong {
    color: var(--rtu-color-text);
}

.rtu-authenticated-shell .client-device-members__row span {
    color: var(--rtu-color-text-muted);
}

.rtu-authenticated-shell.admin-shell {
    background: var(--rtu-color-background);
}

.rtu-authenticated-shell.rtu-alice-shell {
    --rtu-color-primary: var(--mud-palette-primary);
    --rtu-color-secondary: var(--mud-palette-secondary);
    --rtu-color-info: var(--mud-palette-info);
    --rtu-color-success: var(--mud-palette-success);
    --rtu-color-warning: var(--mud-palette-warning);
    --rtu-color-error: var(--mud-palette-error);
    --rtu-color-text: var(--mud-palette-text-primary);
    --rtu-color-text-muted: var(--mud-palette-text-secondary);
    --rtu-color-surface: var(--mud-palette-surface);
    --rtu-color-surface-subtle: var(--mud-palette-background-gray);
    --rtu-color-background: var(--mud-palette-background);
    --rtu-color-border: var(--mud-palette-lines-default);
    --rtu-color-disabled-text: var(--mud-palette-action-disabled);
    --rtu-color-disabled-background: var(--mud-palette-action-disabled-background);
    background: var(--mud-palette-background);
}

.rtu-alice-appbar {
    border-bottom: 1px solid var(--rtu-color-border);
}

.rtu-alice-main {
    min-height: calc(100vh - var(--mud-appbar-height, 4rem));
    padding: calc(var(--mud-appbar-height, 4rem) + var(--rtu-space-6)) var(--rtu-space-4) var(--rtu-space-8);
}

.rtu-alice-page {
    width: min(100%, 42rem);
    margin-inline: auto;
}

.rtu-alice-card {
    border: 1px solid var(--rtu-color-border);
    border-radius: var(--rtu-radius-lg) !important;
    background: var(--mud-palette-surface) !important;
    color: var(--mud-palette-text-primary);
    box-shadow: var(--rtu-elevation-card);
}

.rtu-alice-card .mud-typography-body1,
.rtu-alice-card .mud-typography-body2 {
    color: var(--mud-palette-text-secondary);
}
