/* ── MudBlazor component overrides ──────────────────────────────────────── */

/* navigation.css hardcodes color:white on selected nav items — override with the
   correct contrast text for the primary (yellow) background. */
.bpt-left-nav .bpt-nav-item.mud-selected {
    color: var(--mud-palette-primary); /* intentional: overrides BPT navigation.css color:white */
}

/* Branded primary-colour headers — applies to all MudTable instances.
   NOTE: MudBlazor renders Class on div.mud-table (inner), NOT div.mud-table-root (outer),
   so :not(.lg-grid-table) on .mud-table-root never excluded LgGrid. LgGrid is now
   reset by the dedicated section below. */
.mud-table-root .mud-table-head .mud-table-cell {
    color: var(--mud-palette-primary) !important; /* intentional: overrides MudBlazor scoped table-cell styles */
    background-color: var(--mud-palette-primary-hover) !important;
    font-weight: 800 !important;
    line-height: 1.5rem !important;
}

/* ── LgGrid overrides — must come AFTER the global rule above to win the cascade ── */
/* Selector anchors on .lg-grid-paper (MudPaper root) → .lg-grid-table (MudTable inner div).
   Specificity 0,4,0 matches the global rule; later declaration wins. */

/* MudPaper elevation-0 zeroes the border — restore it */
.mud-elevation-0.lg-grid-paper {
    border: 1px solid var(--lg-color-border) !important; /* intentional: MudPaper elevation-0 removes border */
    border-radius: var(--lg-radius-lg) !important;
    overflow: hidden !important;
}

/* Header cells: solid white so sticky header hides rows scrolling beneath */
.lg-grid-paper .lg-grid-table .mud-table-head .mud-table-cell {
    color: var(--lg-color-dark) !important; /* intentional: LgGrid uses clean dark headers, not brand-yellow */
    background-color: var(--lg-color-surface) !important;
    font-weight: 600 !important;
    font-size: var(--lg-font-size-sm) !important;
    border-bottom: 1px solid var(--lg-color-border) !important;
    letter-spacing: 0.01em !important;
}

/* Empty content can render in a plain th, which inherits BPT main.min.css's
   navy legacy-table background. Keep shared grid empty states on the same
   neutral surface as the rest of the grid, with readable brand-dark text. */
.lg-grid-paper .lg-grid-table .mud-table-empty-row,
.lg-grid-paper .lg-grid-table .mud-table-empty-row > th,
.lg-grid-paper .lg-grid-table .mud-table-empty-row > td {
    background-color: var(--lg-color-surface);
    color: var(--lg-color-dark);
}

/* Remove the MudTable container's right-side border/scroll divider */
.lg-grid-paper .lg-grid-table .mud-table-container {
    border-right: none !important;
    box-shadow: none !important;
}

/* Remove alternating row backgrounds — MudBlazor applies nth-child grey via its own CSS */
.lg-grid-paper .lg-grid-table .mud-table-body .mud-table-row {
    background-color: transparent !important;
}

/* Header <tr> row also gets a grey background from MudBlazor — clear it */
.lg-grid-paper .lg-grid-table .mud-table-head tr {
    background-color: var(--lg-color-surface) !important;
}

/* Rows: thin bottom divider only, no vertical borders */
.lg-grid-paper .lg-grid-table .mud-table-body .mud-table-cell {
    border-bottom: 1px solid var(--lg-color-border) !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

/* Row hover — matches nav menu hover (--mud-palette-primary-hover = brand yellow ~4% opacity) */
.lg-grid-paper .lg-grid-table.mud-table-hover .mud-table-body .mud-table-row:hover td {
    background-color: var(--mud-palette-primary-hover) !important;
    cursor: pointer;
}

.dialog-background-title {
    background: rgb(from var(--mud-palette-info-lighten) r g b / 50%);
    color: var(--mud-palette-white);
}

.mud-tab { cursor: pointer; }

/* Disable built-in tab slider — does not position correctly with current layout. */
.mud-tab-slider.mud-tab-slider-horizontal { height: 0 !important; } /* intentional: must suppress MudBlazor slider element */

.mud-tab.mud-tab-active {
    background-color: var(--mud-palette-primary-hover);
    color: var(--mud-palette-primary);
    border-radius: 0;
    border-style: solid;
    border-width: 0 0 4px 0;
}

/* Primary button hover: swap to teal — intentional brand behaviour. */
.mud-button-filled.mud-button-filled-primary:hover {
    background-color: var(--mud-palette-secondary) !important; /* intentional: brand hover override for primary button */
}

.mud-rating-item.mud-rating-item-active .mud-icon-root.mud-svg-icon {
    color: var(--mud-palette-primary) !important; /* intentional: overrides MudBlazor rating item color */
}

/* Hyperlinks on light surfaces should use the dark brand tone instead of the
   primary yellow, which does not provide enough contrast on white backgrounds. */
.mud-link,
a:where(:not(.mud-button-root):not(.mud-icon-button):not(.mud-tab):not(.mud-nav-link)) {
    color: var(--lg-color-link);
}

.mud-link:hover,
.mud-link:focus-visible,
a:where(:not(.mud-button-root):not(.mud-icon-button):not(.mud-tab):not(.mud-nav-link)):hover,
a:where(:not(.mud-button-root):not(.mud-icon-button):not(.mud-tab):not(.mud-nav-link)):focus-visible {
    color: var(--lg-color-link-hover);
}

/* Breadcrumb polish */
.mud-breadcrumb .mud-link {
    font-size: var(--lg-font-size-xs);
    text-transform: capitalize;
    letter-spacing: 0.02em;
}
.mud-breadcrumb-separator {
    font-size: var(--lg-font-size-xs);
}

nav[aria-label="Breadcrumb"]:not(.lg-breadcrumbs) {
    display: none;
}

.app-breadcrumbs-bar,
.breadcrumbs-container {
    display: none;
}

.mud-main-content > .breadcrumbs-container + .mud-container {
    margin-top: 0 !important; /* intentional: removes the legacy top spacing that only existed to separate content from the stock breadcrumb bar */
}

.mud-main-content > .mud-container:not(.breadcrumbs-container) .lg-page-header,
.mud-main-content > .mud-container:not(.breadcrumbs-container) .lg-grid-toolbar {
    padding-top: var(--lg-space-3);
}

/* The dashboard owns the first content surface, so it does not need the
   standard top separation used by the other content pages. */
.mud-main-content:has(.my-dashboard-scope) .mud-container {
    margin-top: 0 !important; /* intentional: remove the dashboard-only top gap */
}

/* ── Tenant logo override ─────────────────────────────────────────────────── */

/* Force tenant avatar fallback to render brand logo when tenant logo is not populated.
   Uses the all-yellow variant (latergate-logo-on-dark.svg) — brand rule: on dark appbar
   (#231F20) both icon and wordmark must be yellow. The standard logo-with-text.svg has
   a dark wordmark which is invisible on dark backgrounds. */
.tenant-logo-link .tenant-initial-avatar.animate {
    background: transparent !important; /* intentional: suppresses BPT avatar background */
    background-image: url('/images/latergate-logo-on-dark.svg') !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    color: transparent !important;
    text-shadow: none !important;
    width: 196px !important;
    height: 32px !important;
    min-width: 196px !important;
    min-height: 32px !important;
    flex-shrink: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    animation: none !important;
    transform: none !important;
}

.tenant-logo-link .tenant-initial-avatar.animate::after {
    display: none !important; /* intentional: suppresses BPT avatar pseudo-element */
}

.tenant-logo-link + .tenant-text-group {
    display: none !important; /* intentional: hide text fallback when logo is shown */
}

/* ── Top bar icon buttons ──────────────────────────────────────────────────── */

/* Logged-in top bar action icons: dark outlined and centered. */
.lg-uniform-topbar button.mud-icon-button:not(.mud-icon-button-edge-start) {
    width: 36px !important; /* intentional: overrides MudBlazor icon-button sizing */
    height: 36px !important;
    min-width: 36px !important;
    border: 1px solid var(--mud-palette-text-primary) !important;
    border-radius: var(--lg-radius-md) !important;
    color: var(--mud-palette-text-primary) !important;
    background: var(--mud-palette-surface) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

.lg-uniform-topbar button.mud-icon-button:not(.mud-icon-button-edge-start) .mud-icon-root {
    color: var(--mud-palette-text-primary) !important;
    margin: 0 !important;
    line-height: 1 !important;
    vertical-align: middle !important;
}

.lg-uniform-topbar button.mud-icon-button:not(.mud-icon-button-edge-start) > .mud-typography {
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    line-height: 1 !important;
}

/* ── AI launcher button ──────────────────────────────────────────────────── */

/* The BPT AI toggle wrapper stays in normal document flow even though the button itself
   is fixed-positioned. Pull the wrapper out of flow so it does not push the main content down. */
.mud-layout > .mud-tooltip-root.mud-tooltip-inline {
    position: fixed !important; /* intentional: removes the AI launcher tooltip wrapper from layout flow */
    inset: 0 auto auto 0 !important;
    width: 0 !important;
    height: 0 !important;
    overflow: visible !important;
}

/* Bottom-corner AI launcher: match dark outlined icon button style and remove floating effects. */
.ai-toolbar-toggle-fab.ai-toolbar-toggle-fab--funky {
    border: 1px solid var(--mud-palette-text-primary) !important; /* intentional: overrides BPT AI launcher styles */
    border-radius: 10px !important;
    background: var(--mud-palette-surface) !important;
    color: var(--mud-palette-text-primary) !important;
    box-shadow: var(--lg-shadow-md) !important;
    filter: none !important;
    animation: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.ai-toolbar-toggle-fab.ai-toolbar-toggle-fab--funky:hover,
.ai-toolbar-toggle-fab.ai-toolbar-toggle-fab--funky:active {
    transform: none !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, .22) !important;
}

.ai-toolbar-toggle-fab.ai-toolbar-toggle-fab--funky::after {
    display: none !important; /* intentional: removes BPT AI launcher ::after pseudo-element */
}