/* ==========================================================================
   OpZone - surviving MudBlazor overrides
   Role: the global button system (.mud-button-root.mud-button*) and the accent
         layer (headings, appbar nav links, MudAlert severity colours,
         SiteAdmin side-panel tabs). Each .mud-* rule here is kept because the
         palette alone cannot express it (9.5-verified).
   Load position: 7 of 8 in the website opz-*.css chain.
   Derived from app.css (2026-10-12 Field Manual round) - pure move, no edits.
   ========================================================================== */

/* OpZone global button system — see MainLayout.razor theme */
.mud-button-root.mud-button {
    min-height: 40px;
    padding: 9px 16px;
    border-radius: var(--mud-default-borderradius, 10px);
    font-size: 0.875rem;
    box-shadow: none !important;
    transition:
        background-color 140ms ease-out,
        color 140ms ease-out,
        border-color 140ms ease-out,
        transform 140ms ease-out,
        filter 140ms ease-out;
}

.mud-button-root.mud-button-size-small {
    min-height: 32px;
    padding: 6px 12px;
    font-size: 0.8125rem;
}

.mud-button-root.mud-button-size-large {
    min-height: 48px;
    padding: 12px 20px;
    font-size: 1rem;
}

.mud-button-root.mud-button-filled,
.mud-button-root.mud-button-outlined,
.mud-button-root.mud-button-text,
.mud-icon-button {
    box-shadow: none !important;
}

/* Deep fills brighten slightly on hover so they do not sink into the charcoal shell. */
.mud-button-root.mud-button-filled:not(:disabled):not(.mud-disabled):hover {
    filter: brightness(1.04);
    transform: translateY(-1px);
}

.mud-button-root.mud-button-outlined:not(:disabled):not(.mud-disabled):hover,
.mud-button-root.mud-button-text:not(:disabled):not(.mud-disabled):hover,
.mud-icon-button:not(:disabled):not(.mud-disabled):hover {
    transform: translateY(-1px);
}

.mud-button-root.mud-button:not(:disabled):not(.mud-disabled):active {
    filter: brightness(1.02);
    transform: scale(0.985);
}

.mud-icon-button:not(:disabled):not(.mud-disabled):active {
    filter: brightness(1.02);
    transform: scale(0.96);
}

.mud-button-root.mud-button:focus-visible,
.mud-icon-button:focus-visible {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: 2px;
    box-shadow: 0 0 0 4px var(--mud-palette-primary-hover) !important;
}

.mud-icon-button {
    width: 40px;
    height: 40px;
    padding: 8px;
    border-radius: 10px;
    transition:
        background-color 140ms ease-out,
        color 140ms ease-out,
        transform 140ms ease-out,
        filter 140ms ease-out;
}

.mud-icon-button-size-small {
    width: 36px;
    height: 36px;
    padding: 6px;
}

.mud-icon-button-size-large {
    width: 48px;
    height: 48px;
    padding: 12px;
}

.mud-button-root.mud-button-filled:is(:disabled, .mud-disabled),
.mud-button-root.mud-button-filled:is(:disabled, .mud-disabled):hover,
.mud-button-root.mud-button-filled:is(:disabled, .mud-disabled):active {
    color: var(--mud-palette-action-disabled) !important;
    background-color: var(--mud-palette-action-disabled-background) !important;
    border-color: var(--mud-palette-action-disabled-background) !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    opacity: 1 !important;
}

.mud-button-root.mud-button-outlined:is(:disabled, .mud-disabled),
.mud-button-root.mud-button-outlined:is(:disabled, .mud-disabled):hover,
.mud-button-root.mud-button-outlined:is(:disabled, .mud-disabled):active {
    color: var(--mud-palette-action-disabled) !important;
    background-color: transparent !important;
    border-color: var(--mud-palette-action-disabled-background) !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    opacity: 1 !important;
}

.mud-button-root.mud-button-text:is(:disabled, .mud-disabled),
.mud-button-root.mud-button-text:is(:disabled, .mud-disabled):hover,
.mud-button-root.mud-button-text:is(:disabled, .mud-disabled):active,
.mud-icon-button:is(:disabled, .mud-disabled),
.mud-icon-button:is(:disabled, .mud-disabled):hover,
.mud-icon-button:is(:disabled, .mud-disabled):active {
    color: var(--mud-palette-action-disabled) !important;
    background-color: transparent !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    opacity: 1 !important;
}

/* ==========================================================================
   Accent colour layer — headings, appbar nav, alerts, side-panel tabs
   Deliberately separate from --mud-palette-text-primary so body, caption and
   table text stay neutral while headings carry the accent blue.
   ========================================================================== */

/* ---- Headings: field-manual ink on light surfaces. Removed the previous
   global accent-blue override; MudBlazor heading typography now falls back to
   --mud-palette-text-primary (#161A12), and the .display/.h1/.h2/.h3 classes
   from the Field Manual section set Barlow Condensed + ink explicitly. ---- */

/* A heading inside an alert takes the alert's own colour instead */
.mud-alert h1, .mud-alert h2, .mud-alert h3, .mud-alert h4, .mud-alert h5, .mud-alert h6,
.mud-alert .mud-typography-h1, .mud-alert .mud-typography-h2, .mud-alert .mud-typography-h3,
.mud-alert .mud-typography-h4, .mud-alert .mud-typography-h5, .mud-alert .mud-typography-h6 {
    color: inherit !important;
}

/* ---- Appbar inline nav links: the old light-blue accent rules are deleted
   (lane 4) — the light appbar is paper + ink, and the base
   a { color: var(--opz-ink-2) } / a:hover { color: var(--opz-signal-deep) }
   rules in opz-base.css already carry the design. ---- */

/* ---- Alerts: keep their punchy accents, independent of the deep buttons ----
   MudBlazor's alert rules read these custom properties, so overriding them on
   the alert element restyles text / outlined / filled without touching the
   global palette (and therefore without touching button fills).
   Severity colours come from the --opz-alert-* tokens (plan C2 / F-13 —
   not palette-drivable in 9.5 (verified), do not delete). */
.mud-alert-text-info,
.mud-alert-outlined-info,
.mud-alert-filled-info {
    --mud-palette-info: var(--opz-alert-info);
    --mud-palette-info-rgb: var(--opz-alert-info-rgb);
    --mud-palette-info-darken: #227397;
    --mud-palette-info-text: var(--opz-alert-info-text);
    --mud-palette-info-hover: var(--opz-alert-info-hover);
}

.mud-alert-text-success,
.mud-alert-outlined-success,
.mud-alert-filled-success {
    --mud-palette-success: var(--opz-alert-success);
    --mud-palette-success-rgb: var(--opz-alert-success-rgb);
    --mud-palette-success-darken: #176C36;
    --mud-palette-success-text: var(--opz-alert-success-text);
    --mud-palette-success-hover: var(--opz-alert-success-hover);
}

.mud-alert-text-warning,
.mud-alert-outlined-warning,
.mud-alert-filled-warning {
    --mud-palette-warning: var(--opz-alert-warning);
    --mud-palette-warning-rgb: var(--opz-alert-warning-rgb);
    --mud-palette-warning-darken: #997414;
    --mud-palette-warning-text: var(--opz-alert-warning-text);
    --mud-palette-warning-hover: var(--opz-alert-warning-hover);
}

.mud-alert-text-error,
.mud-alert-outlined-error,
.mud-alert-filled-error {
    --mud-palette-error: var(--opz-alert-error);
    --mud-palette-error-rgb: var(--opz-alert-error-rgb);
    --mud-palette-error-darken: var(--opz-alert-error-darken);
    --mud-palette-error-text: var(--opz-alert-error-text);
    --mud-palette-error-hover: var(--opz-alert-error-hover);
}

/* ---- SiteAdmin side-panel tabs: white by default, accent blue when active ----
   Scoped to .opz-siteadmin-tabs (SelectedSitePanel) so the Developer/Admin
   tabs, which use Color.Dark + their own ActiveTabClass, are unaffected. */
.opz-siteadmin-tabs .mud-tab {
    color: var(--opz-ink-2);
}

.opz-siteadmin-tabs .mud-tab.mud-tab-active {
    color: var(--opz-signal);
}

.opz-siteadmin-tabs .mud-tab-slider {
    background: var(--opz-signal);
}