/* =============================================================================
   MudBlazor → Majesty theme bridge
   -----------------------------------------------------------------------------
   MudThemeProvider injects its own palette into :root at runtime (purple
   defaults). We override those CSS custom properties and point them at the
   app's own theme.css variables (--accent-primary, --surface, --text-primary …).

   Because every app theme ([data-theme="light|dark|wa-*|meta-*|notion|
   spotify|vintage"]) redefines those same --accent/--surface/--text vars,
   MudBlazor automatically follows whichever theme is active — no per-theme
   MudBlazor config needed.

   !important is required: MudThemeProvider's runtime <style> renders AFTER this
   file in the DOM, so equal-specificity rules would otherwise win.
   ============================================================================= */

:root {
    /* ---- Brand / accent ------------------------------------------------- */
    --mud-palette-primary: var(--accent-primary) !important;
    --mud-palette-primary-text: var(--on-accent) !important;
    --mud-palette-primary-darken: var(--accent-secondary) !important;
    --mud-palette-primary-lighten: var(--accent-tertiary) !important;
    --mud-palette-primary-hover: var(--accent-15) !important;
    --mud-palette-primary-rgb: var(--accent-primary-rgb) !important; /* follows theme accent */

    --mud-palette-secondary: var(--accent-secondary) !important;
    --mud-palette-secondary-text: var(--on-accent) !important;
    --mud-palette-secondary-rgb: 220, 0, 115 !important;

    --mud-palette-tertiary: var(--accent-tertiary) !important;
    --mud-palette-tertiary-text: var(--on-accent) !important;

    /* ---- Status -------------------------------------------------------- */
    --mud-palette-info: var(--info) !important;
    --mud-palette-info-text: var(--on-accent) !important;
    --mud-palette-success: var(--success) !important;
    --mud-palette-success-text: var(--on-accent) !important;
    --mud-palette-warning: var(--warning) !important;
    --mud-palette-warning-text: #161616 !important;
    --mud-palette-error: var(--error) !important;
    --mud-palette-error-text: var(--on-accent) !important;
    --mud-palette-dark: var(--chrome-bg) !important;
    --mud-palette-dark-text: var(--chrome-text) !important;

    /* ---- Surfaces / backgrounds ---------------------------------------- */
    --mud-palette-background: var(--bg-primary) !important;
    --mud-palette-background-gray: var(--bg-secondary) !important;
    --mud-palette-background-grey: var(--bg-secondary) !important;
    --mud-palette-surface: var(--surface) !important;
    --mud-palette-drawer-background: var(--surface) !important;
    --mud-palette-drawer-text: var(--text-primary) !important;
    --mud-palette-appbar-background: var(--chrome-bg) !important;
    --mud-palette-appbar-text: var(--chrome-text) !important;

    /* ---- Text ---------------------------------------------------------- */
    --mud-palette-text-primary: var(--text-primary) !important;
    --mud-palette-text-secondary: var(--text-secondary) !important;
    --mud-palette-text-disabled: var(--text-disabled) !important;

    /* ---- Actions / icons ----------------------------------------------- */
    --mud-palette-action-default: var(--text-secondary) !important;
    --mud-palette-action-default-hover: var(--hover-bg) !important;
    --mud-palette-action-disabled: var(--text-disabled) !important;
    --mud-palette-action-disabled-background: var(--bg-tertiary) !important;

    /* ---- Lines / dividers / tables ------------------------------------- */
    --mud-palette-lines-default: var(--border-primary) !important;
    --mud-palette-lines-inputs: var(--border-secondary) !important;
    --mud-palette-divider: var(--border-primary) !important;
    --mud-palette-divider-light: var(--border-primary) !important;
    --mud-palette-table-lines: var(--border-primary) !important;
    --mud-palette-table-striped: var(--bg-secondary) !important;
    --mud-palette-table-hover: var(--hover-bg) !important;

    /* ---- Overlays ------------------------------------------------------ */
    --mud-palette-overlay-dark: var(--overlay-dark) !important;
    --mud-palette-overlay-light: var(--overlay-light) !important;

    /* ---- Shape: match the app's rounded, soft-shadow language ---------- */
    --mud-default-borderradius: 10px !important;
    --mud-elevation-8: var(--shadow-lg) !important;
    --mud-elevation-24: var(--shadow-xl) !important;
}

/* MudThemeProvider also tags the body with .mud-theme-light / .mud-theme-dark.
   Re-assert the bridge there too so it wins regardless of which class Mud sets. */
body.mud-theme-light,
body.mud-theme-dark,
.mud-theme-light,
.mud-theme-dark {
    --mud-palette-primary: var(--accent-primary) !important;
    --mud-palette-primary-text: var(--on-accent) !important;
    --mud-palette-secondary: var(--accent-secondary) !important;
    --mud-palette-info: var(--info) !important;
    --mud-palette-success: var(--success) !important;
    --mud-palette-warning: var(--warning) !important;
    --mud-palette-error: var(--error) !important;
    --mud-palette-background: var(--bg-primary) !important;
    --mud-palette-background-gray: var(--bg-secondary) !important;
    --mud-palette-surface: var(--surface) !important;
    --mud-palette-text-primary: var(--text-primary) !important;
    --mud-palette-text-secondary: var(--text-secondary) !important;
    --mud-palette-text-disabled: var(--text-disabled) !important;
    --mud-palette-action-default: var(--text-secondary) !important;
    --mud-palette-lines-default: var(--border-primary) !important;
    --mud-palette-lines-inputs: var(--border-secondary) !important;
    --mud-palette-divider: var(--border-primary) !important;
    --mud-palette-table-lines: var(--border-primary) !important;
    --mud-palette-table-hover: var(--hover-bg) !important;
}

/* -----------------------------------------------------------------------------
   Small polish so Mud surfaces sit naturally on the app's surfaces.
   ----------------------------------------------------------------------------- */

/* Dialog paper: use the app surface + the app's large shadow + rounded corners */
.mud-dialog {
    background-color: var(--surface) !important;
    color: var(--text-primary) !important;
    box-shadow: var(--shadow-xl) !important;
    border-radius: 14px !important;
}

.mud-dialog .mud-dialog-title {
    border-bottom: 1px solid var(--border-primary);
}

/* Dialog backdrop matches the app overlay tone */
.mud-overlay-dialog + .mud-overlay,
.mud-overlay.mud-overlay-dialog {
    background-color: var(--overlay-backdrop) !important;
}

/* Popovers (date/time picker panels, selects) on the app surface */
.mud-popover {
    background-color: var(--surface) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-primary);
    box-shadow: var(--shadow-lg) !important;
}

/* Data-grid header tint to match the app's inset surface */
.mud-table-root .mud-table-head .mud-table-cell,
.mud-data-grid .mud-table-head .mud-table-cell {
    background-color: var(--surface-inset) !important;
    color: var(--text-primary) !important;
    font-weight: 600;
}

/* Outlined inputs pick up the app border + accent focus ring */
.mud-input.mud-input-outlined .mud-input-outlined-border {
    border-color: var(--border-secondary) !important;
}
.mud-input.mud-input-outlined.mud-focused .mud-input-outlined-border {
    border-color: var(--accent-primary) !important;
    box-shadow: 0 0 0 2px var(--focus-ring);
}