/* Halo Bento foundations and MudBlazor adapters: Mud keeps behaviour, Halo owns appearance. */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: 16px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
html, body { margin: 0; padding: 0; font-family: var(--halo-font); background: var(--halo-canvas); color: var(--halo-text); line-height: 1.5; }
body { min-height: 100vh; overflow-x: clip; }
button, input, select, textarea { font: inherit; }
::selection { background: var(--halo-selection); color: var(--halo-text); }
a { color: var(--halo-ink-info); text-underline-offset: 3px; }
a:hover { text-decoration: underline; }
:focus-visible { outline: 2px solid var(--halo-focus-color); outline-offset: 2px; }
/* FocusOnNavigate moves screen-reader focus to a static page heading. Keep
   focus rings on interactive controls, not this programmatic navigation target. */
body h1[tabindex="-1"]:focus { outline: none; }
.validation-message, .blazor-error-boundary { color: var(--halo-ink-critical); }
.invalid { border-color: var(--halo-ink-critical); }
.blazor-error-boundary { padding: var(--halo-4); background: var(--halo-soft-red); color: var(--halo-soft-red-ink); border: 0; border-radius: var(--halo-radius-md); }
.blazor-error-boundary::after { content: "An error has occurred."; }

/* CSS applies the saved palette before the interactive provider connects. */
:root[data-theme] {
    --mud-palette-background: var(--halo-canvas);
    --mud-palette-background-gray: var(--halo-surface-sunken);
    --mud-palette-surface: var(--halo-surface);
    --mud-palette-text-primary: var(--halo-text);
    --mud-palette-text-secondary: var(--halo-text-secondary);
    --mud-palette-text-disabled: var(--halo-text-tertiary);
    --mud-palette-action-default: var(--halo-text-secondary);
    --mud-palette-action-disabled: var(--halo-text-tertiary);
    --mud-palette-action-disabled-background: var(--halo-surface-sunken);
    --mud-palette-divider: var(--halo-hairline-strong);
    --mud-palette-lines-default: var(--halo-hairline-strong);
    --mud-palette-lines-inputs: var(--halo-input-border);
    --mud-palette-primary: var(--halo-action-brand);
    --mud-palette-primary-text: var(--halo-on-action);
    --mud-palette-secondary: var(--halo-fill-navy);
    --mud-palette-secondary-text: var(--halo-on-fill);
    --mud-palette-success: var(--halo-ink-success);
    --mud-palette-warning: var(--halo-ink-warning);
    --mud-palette-error: var(--halo-ink-critical);
    --mud-palette-info: var(--halo-ink-info);
}
.mud-typography, .mud-input, .mud-button, .mud-table, .mud-list, .mud-dialog { font-family: var(--halo-font); }
.mud-paper, .mud-card { background: var(--halo-surface); color: var(--halo-text); border-radius: var(--halo-radius-xl); }
.mud-ripple-element { display: none; }
.mud-divider { border-color: var(--halo-hairline); }
.mud-icon-root { color: currentColor; }
.mud-popover, .mud-menu, .mud-picker { background: var(--halo-surface-raised); color: var(--halo-text); border: 1px solid var(--halo-hairline); border-radius: var(--halo-radius-lg); box-shadow: var(--halo-shadow-3); }
.mud-popover-open { animation: halo-popover-pop var(--halo-duration-3) var(--halo-ease-spring); }
/* Dropdowns and pickers float above drawers and dialogs that host them. */
.mud-popover.mud-popover-open { z-index: calc(var(--halo-z-modal) + 50) !important; }
@keyframes halo-popover-pop { from { opacity: 0; transform: scale(.95) translateY(-4px); } }
.mud-list-item { color: var(--halo-text); border-radius: 12px; }
.mud-list-item:hover, .mud-list-item:focus-visible { background: var(--halo-surface-hover); }
.mud-list-item.mud-selected-item { color: var(--halo-soft-navy-ink); background: var(--halo-soft-navy); }
.mud-tooltip { background: var(--halo-surface-inverse); color: var(--halo-text-inverse); border-radius: 10px; padding: 6px 10px; font-size: var(--halo-text-caption); font-weight: 600; }
/* Toasts: dark pills that rise from the bottom with the spring. */
.mud-snackbar { border-radius: var(--halo-radius-pill); background: var(--halo-surface-inverse); color: var(--halo-text-inverse); box-shadow: var(--halo-shadow-3); padding-inline: 18px 10px; font-weight: 600; animation: halo-toast-rise var(--halo-duration-4) var(--halo-ease-spring); }
.mud-snackbar .mud-snackbar-icon, .mud-snackbar .mud-button-root { color: inherit; }
.mud-snackbar.mud-alert-filled-success .mud-snackbar-icon { color: var(--halo-ink-success); }
.mud-snackbar.mud-alert-filled-error .mud-snackbar-icon { color: var(--halo-ink-critical); }
.mud-snackbar.mud-alert-filled-warning .mud-snackbar-icon { color: var(--halo-ink-warning); }
:root[data-theme="dark"] .mud-snackbar .mud-snackbar-icon { color: var(--halo-text-inverse); }
@keyframes halo-toast-rise { from { opacity: 0; transform: translateY(16px) scale(.96); } }
.mud-alert { border-radius: var(--halo-radius-md); box-shadow: none; border: 0; }
.mud-alert-outlined-success, .mud-alert-text-success { color: var(--halo-soft-green-ink); background: var(--halo-soft-green); }
.mud-alert-outlined-warning, .mud-alert-text-warning { color: var(--halo-soft-yellow-ink); background: var(--halo-soft-yellow); }
.mud-alert-outlined-error, .mud-alert-text-error { color: var(--halo-soft-red-ink); background: var(--halo-soft-red); }
.mud-alert-outlined-info, .mud-alert-text-info { color: var(--halo-soft-blue-ink); background: var(--halo-soft-blue); }
.mud-alert-filled-success { color: var(--halo-on-fill); background: var(--halo-fill-green); }
.mud-alert-filled-warning { color: var(--halo-on-fill-yellow); background: var(--halo-fill-yellow); }
.mud-alert-filled-error { color: var(--halo-on-fill); background: var(--halo-fill-red); }
.mud-alert-filled-info { color: var(--halo-on-fill); background: var(--halo-fill-blue); }

/* Dialogs share one neutral surface, readable content and fixed action footer. */
.mud-dialog:not(.mud-dialog-fullscreen) {
    width: min(var(--halo-dialog-width, var(--halo-dialog-standard)), calc(100vw - 48px));
    max-width: min(var(--halo-dialog-width, var(--halo-dialog-standard)), calc(100vw - 48px));
    min-width: 0;
}
.mud-dialog-width-xs { --halo-dialog-width: var(--halo-dialog-compact); }
.mud-dialog-width-sm { --halo-dialog-width: var(--halo-dialog-standard); }
.mud-dialog-width-md { --halo-dialog-width: var(--halo-dialog-wide); }
.mud-dialog-width-lg { --halo-dialog-width: var(--halo-dialog-workspace); }
.mud-dialog-width-xl { --halo-dialog-width: var(--halo-dialog-expanded); }
.mud-dialog .mud-dialog-content > * { min-width: 0; }
.mud-dialog { display: flex; flex-direction: column; max-height: min(92dvh, 920px); overflow: hidden; background: var(--halo-surface-raised); color: var(--halo-text); border: 1px solid var(--halo-hairline); border-radius: var(--halo-radius-xl); box-shadow: var(--halo-shadow-4); animation: halo-dialog-in var(--halo-duration-4) var(--halo-ease-spring), halo-dialog-fade var(--halo-duration-2) var(--halo-ease-out); }
@keyframes halo-dialog-in { from { transform: translateY(12px) scale(.96); } }
@keyframes halo-dialog-fade { from { opacity: 0; } }
.mud-dialog .mud-dialog-title { flex: 0 0 auto; padding: 22px var(--halo-6) var(--halo-3); border-bottom: 0; background: var(--halo-surface-raised); font-family: var(--halo-font-display); font-size: 1.375rem; font-weight: 700; letter-spacing: -0.03em; }
.mud-dialog .mud-dialog-title .mud-typography { font-family: var(--halo-font-display); font-weight: 700; letter-spacing: -0.03em; }
.mud-dialog .mud-dialog-content { flex: 1 1 auto; min-height: 0; overflow: auto; padding: var(--halo-2) var(--halo-6) var(--halo-6); background: var(--halo-surface-raised); color: var(--halo-text); }
.mud-dialog .mud-dialog-actions { flex: 0 0 auto; display: flex; flex-wrap: wrap; gap: var(--halo-2); padding: var(--halo-4) var(--halo-6) 22px; border-top: 1px solid var(--halo-hairline); background: var(--halo-surface-raised); }
/* Fields inside a dialog step in as a staircase: 45ms apart, after the sheet lands. */
.mud-dialog .mud-dialog-content > :is(.halo-form-grid, .halo-dialog-stack, .dialog-form, .halo-dialog-grid) > * { animation: halo-field-rise var(--halo-duration-4) var(--halo-ease-out) both; animation-delay: calc(var(--halo-stagger, 0) * 45ms + 80ms); }
.mud-dialog .mud-dialog-content > :is(.halo-form-grid, .halo-dialog-stack, .dialog-form, .halo-dialog-grid) > :nth-child(1) { --halo-stagger: 0; }
.mud-dialog .mud-dialog-content > :is(.halo-form-grid, .halo-dialog-stack, .dialog-form, .halo-dialog-grid) > :nth-child(2) { --halo-stagger: 1; }
.mud-dialog .mud-dialog-content > :is(.halo-form-grid, .halo-dialog-stack, .dialog-form, .halo-dialog-grid) > :nth-child(3) { --halo-stagger: 2; }
.mud-dialog .mud-dialog-content > :is(.halo-form-grid, .halo-dialog-stack, .dialog-form, .halo-dialog-grid) > :nth-child(4) { --halo-stagger: 3; }
.mud-dialog .mud-dialog-content > :is(.halo-form-grid, .halo-dialog-stack, .dialog-form, .halo-dialog-grid) > :nth-child(5) { --halo-stagger: 4; }
.mud-dialog .mud-dialog-content > :is(.halo-form-grid, .halo-dialog-stack, .dialog-form, .halo-dialog-grid) > :nth-child(6) { --halo-stagger: 5; }
.mud-dialog .mud-dialog-content > :is(.halo-form-grid, .halo-dialog-stack, .dialog-form, .halo-dialog-grid) > :nth-child(7) { --halo-stagger: 6; }
.mud-dialog .mud-dialog-content > :is(.halo-form-grid, .halo-dialog-stack, .dialog-form, .halo-dialog-grid) > :nth-child(n + 8) { --halo-stagger: 7; }
@keyframes halo-field-rise { from { transform: translateY(8px); } }
.mud-overlay-dark { background: var(--halo-scrim); animation: halo-dialog-fade var(--halo-duration-3) var(--halo-ease-out); }
.mud-drawer--closed.mud-drawer-pos-right { display: none; }
.halo-dialog-stack, .dialog-form { display: grid; gap: var(--halo-4); }
.halo-dialog-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--halo-4); }
.halo-dialog-full { grid-column: 1 / -1; }

/* Framework fields use the same border, focus and disabled roles as native Halo. */
.mud-input.mud-input-outlined, .mud-input.mud-input-filled { background: var(--halo-surface); color: var(--halo-text); border-radius: var(--halo-radius-pill); }
.mud-input.mud-input-outlined .mud-input-outlined-border, .mud-input.mud-input-filled { border-radius: var(--halo-radius-pill); }
.mud-input.mud-input-outlined.mud-input-multiline, .mud-input.mud-input-outlined.mud-input-multiline .mud-input-outlined-border { border-radius: var(--halo-radius-lg); }
.mud-input.mud-input-outlined .mud-input-outlined-border { border-color: var(--halo-input-border); }
.mud-input.mud-input-filled { border: 1px solid var(--halo-input-border); }
.mud-input.mud-input-filled::before, .mud-input.mud-input-filled::after { display: none; }
.mud-input:hover .mud-input-outlined-border { border-color: var(--halo-input-border-hover); }
.mud-input.mud-input-focused .mud-input-outlined-border { border-color: var(--halo-focus-color); }
.mud-input.mud-input-focused { box-shadow: var(--halo-focus-ring-field); }
.mud-input.mud-input-outlined, .mud-input.mud-input-filled { transition: box-shadow var(--halo-duration-2) var(--halo-ease-out), border-color var(--halo-duration-1) var(--halo-ease-out); }
.mud-input.mud-input-outlined .mud-input-outlined-border { transition: border-color var(--halo-duration-1) var(--halo-ease-out); }
.mud-input.mud-input-error.mud-input-focused { box-shadow: 0 0 0 4px rgb(var(--halo-red) / .14); }
.mud-input-control.mud-input-error .mud-input { animation: halo-field-shake var(--halo-duration-3) var(--halo-ease-out); }
@keyframes halo-field-shake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }
.mud-input.mud-disabled { background: var(--halo-surface-sunken); color: var(--halo-text-tertiary); }
.mud-input-label, .mud-input-helper-text { color: var(--halo-text-secondary); }
.mud-input-adornment { color: var(--halo-text-secondary); }
.mud-input.mud-input-error .mud-input-outlined-border { border-color: var(--halo-ink-critical); }
.mud-input-control .mud-input-error .mud-input-helper-text { color: var(--halo-ink-critical); }
.mud-picker-toolbar { color: var(--halo-text); background: var(--halo-surface-sunken); }
.mud-picker-calendar .mud-day.mud-selected { color: var(--halo-on-fill); background: var(--halo-fill-navy); }
.mud-picker-calendar .mud-day.mud-current { box-shadow: inset 0 0 0 1px var(--halo-focus-color); }
.mud-picker-calendar { color: var(--halo-text); background: var(--halo-surface-raised); }
.mud-picker-calendar-header-switch { font-family: var(--halo-font-display); font-weight: 600; }
.mud-picker-calendar-header-day, .mud-picker-calendar-week-text { color: var(--halo-text-secondary); }
.mud-picker-calendar .mud-day { border-radius: 50%; font-family: var(--halo-font); }
.mud-picker-calendar .mud-day:not(.mud-selected):not(:disabled):hover { background: var(--halo-soft-navy); color: var(--halo-soft-navy-ink); }
.mud-picker-calendar .mud-day:focus-visible { outline: 2px solid var(--halo-focus-color); outline-offset: 2px; }

/* Tables keep operational density and theme-aware hover/selection. */
.mud-table { background: var(--halo-surface); color: var(--halo-text); }
.mud-table-head .mud-table-cell { background: var(--halo-surface); color: var(--halo-text-secondary); font-size: var(--halo-text-caption); font-weight: 600; }
.mud-table-cell { color: var(--halo-text); border-bottom-color: var(--halo-hairline); }
.mud-table-hover .mud-table-body .mud-table-row:hover { background: var(--halo-surface-hover); }
.mud-table-row.selected, .mud-table-row.mud-selected { background: var(--halo-soft-blue); }
.mud-table-pagination { color: var(--halo-text-secondary); border-top: 1px solid var(--halo-hairline); }

@media (max-width: 640px) {
    .halo-dialog-grid { grid-template-columns: 1fr; }
    .mud-dialog .mud-dialog-content { padding: var(--halo-4); }
    .mud-dialog .mud-dialog-title, .mud-dialog .mud-dialog-actions { padding: var(--halo-4); }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
@keyframes halo-number-change { from { opacity: .55; } to { opacity: 1; } }
.halo-number-change { animation: halo-number-change var(--halo-duration-2) var(--halo-ease); }
/* Text and outlined actions use readable semantic ink; filled actions keep their stable paint. */
.mud-primary-text, .mud-button-text-primary, .mud-button-outlined-primary { color: var(--halo-ink-critical); }
.mud-secondary-text, .mud-button-text-secondary, .mud-button-outlined-secondary { color: var(--halo-ink-brand); }
/* Raw MudButton and MudIconButton follow the Halo pill and round geometry. */
.mud-button-root.mud-button { border-radius: var(--halo-radius-pill); text-transform: none; font-weight: 600; letter-spacing: 0; box-shadow: none; }
.mud-button-filled-primary { background: var(--halo-action-brand); color: var(--halo-on-action); }
.mud-button-filled-secondary { background: var(--halo-fill-navy); color: var(--halo-on-fill); }
.mud-icon-button { border-radius: 50%; }
.mud-chip { border-radius: var(--halo-radius-pill); font-weight: 600; }
.mud-progress-linear { border-radius: var(--halo-radius-pill); background: var(--halo-surface-pressed); }
.mud-progress-linear .mud-progress-linear-bar { border-radius: inherit; }
.mud-skeleton { background: var(--halo-surface-pressed); border-radius: var(--halo-radius-md); }
.mud-switch-base.mud-checked + .mud-switch-track, .mud-switch .mud-checked + .mud-switch-track { background-color: var(--halo-fill-green); opacity: 1; }
.mud-checkbox .mud-checked, .mud-radio .mud-checked { color: var(--halo-fill-navy); }
.mud-tabs-slider { background: var(--halo-fill-navy); }
.mud-dark-text { color: var(--halo-text); }
.halo-grid--condensed .mud-table-body .mud-table-cell { padding-block: var(--halo-1); }
.halo-grid--expanded .mud-table-body .mud-table-cell { padding-block: var(--halo-3); }
.halo-grid-clickable .mud-table-body .mud-table-row { cursor: pointer; }
.halo-col-actions { width: 1%; white-space: nowrap; }

@keyframes sticky-slide-left {
    from { transform: translateX(100%); opacity: 0; }
    to   { transform: translateX(0);    opacity: 1; }
}

@keyframes sticky-slide-right {
    from { transform: translateX(-100%); opacity: 0; }
    to   { transform: translateX(0);     opacity: 1; }
}

.sticky-note-enter-left {
    animation: sticky-slide-left 250ms cubic-bezier(0.32, 0.72, 0, 1);
}

.sticky-note-enter-right {
    animation: sticky-slide-right 250ms cubic-bezier(0.32, 0.72, 0, 1);
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }

    .sticky-note-enter-left,
    .sticky-note-enter-right {
        animation: none;
    }
}


@media print { .halo-main-content { padding: 0; } .blazor-error-boundary { display: none; } }

/* Dashboard feed: MudBlazor inputs inside the feed widget have no underline. */
.bh-feed-widget .mud-input-underline:before,
.bh-feed-widget .mud-input-underline:after,
.bh-feed-widget .mud-input-filled:before,
.bh-feed-widget .mud-input-filled:after {
    border-bottom: none !important;
}
