/* ============================================================
   MudBlazor integration
   ============================================================

   Global adaptations of MudBlazor's own rendered markup - the cases where the
   framework's output has to be reached from outside the component that renders
   it, and where CSS isolation therefore cannot do the job.

   Only adaptations that are true of MudBlazor generally belong here. Anything
   anchored on a consuming application's own class stays with that application,
   in a stylesheet linked after this one; anything that belongs to exactly one
   component stays in that component's .razor.css; and anything expressible
   through MudTheme belongs in the theme rather than in CSS.

   Load order: MudBlazor.min.css must be linked BEFORE this file, so these rules
   win ties by cascade order. The !important flags date from an arrangement where
   the framework was linked last and they were the only way to take effect. The
   table row hover still needs its flag outright - MudBlazor's own hover rule is
   `.mud-table-hover .mud-table-container .mud-table-root .mud-table-body
   .mud-table-row:hover` at (0,6,0), which order alone cannot beat. For the
   others, removing the flag is a per-declaration visual question, not cleanup.
   ============================================================ */

/* Card radius and border suppression, without touching MudBlazor's padding.

   `border-style: none` is what this rule has always done, written plainly.

   It used to read `border: 1px solid var(--border) !important`, and --border is
   defined nowhere and never has been. An invalid var() in a *shorthand* does not
   discard the declaration: it sets every longhand to the guaranteed-invalid
   value, which computes to `unset`, and `unset` for border-style is `none`.
   Carrying !important, that declaration was therefore actively suppressing
   MudBlazor's own card borders across the application - not, as it appears,
   doing nothing. Deleting it made a 1px border appear on every MudCard on seven
   routes, which is how this was found.

   So the border is stated rather than removed, and stated as the effect rather
   than as a width and a colour that never applied. */
.mud-elevation-1,
.mud-elevation-2,
.mud-elevation-3,
.mud-elevation-4 {
    border-style: none !important;
    border-radius: var(--ds-radius-lg) !important;
}

/* App bars, excepted. MudAppBar with Elevation="1" (or any level) renders that same
   .mud-elevation-N class, so the rule above was rounding the corners of a full-bleed,
   edge-to-edge header - not a card floating on the page, which is what it was written
   for. The rule above carries !important, so beating it takes an !important of this
   one's own too - specificity alone does not outrank it. With both important, two
   classes beats one, (0,2,0) against (0,1,0), and this wins on that. */
.mud-appbar.mud-elevation-1,
.mud-appbar.mud-elevation-2,
.mud-appbar.mud-elevation-3,
.mud-appbar.mud-elevation-4 {
    border-radius: 0 !important;
}

/* Table header and row hover, matching the plain-table rules in
   styles/foundations/base.css. */
/* There was a `font-weight: 600` here, to match the plain-table rule in base.css.
   It never took effect in any application that has used this file: MudBlazor sets
   500 from `.mud-table-root .mud-table-head .mud-table-cell` at (0,3,0), against
   this rule's (0,2,0), so no link order could win it - only raising the specificity
   or an !important, and neither is worth doing to a weight nobody has missed.
   Removed rather than escalated; MudBlazor's 500 is what these headers render and
   have always rendered. Making them 600 is a visual decision, not a repair. */
.mud-table-head .mud-table-cell {
    background: var(--ds-surface-alt);
    font-size: var(--ds-text-13);
    color: var(--ds-text-body);
}

.mud-table-body .mud-table-row:hover {
    background: var(--ds-surface-alt) !important;
}

/* Icon buttons, restored to a circle.

   MudIconButton renders both `mud-button-root` and `mud-icon-button` on the same
   element. MudBlazor's own stylesheet gives the first `border-radius:
   var(--mud-default-borderradius)` and the second `border-radius: 50%` - equal
   specificity, (0,1,0) each, so whichever rule is later in MudBlazor's own file
   wins the tie, and in the shipped stylesheet that is the button rule, not the
   circle. It goes unnoticed at MudBlazor's own 4px default; it does not at a
   theme's chosen radius, where every icon button in the application - the
   hamburger, the drawer toggles, every row action - renders as a rounded square
   instead of a circle.

   Two classes beats one on specificity alone, (0,2,0) against (0,1,0), so this
   wins without needing an !important and without touching MudBlazor's own
   stylesheet - the circle was always the intended shape; this is the other
   half of the same rule MudBlazor never finished applying. */
.mud-icon-button.mud-button-root {
    border-radius: 50%;
}