.mud-input-control.mud-input-error > .mud-input-control-input-container {
    border: 0;
    box-shadow: inset 0 0 0 1px var(--mud-palette-error);
}

.mud-input-control > .mud-input-control-input-container {
    border-radius: 1.6rem;
}

/* MudTabs styling */
.mud-tabs-tabbar {
    background-color: transparent;
}
.mud-tabs .mud-tabs-rounded .mud-tab.mud-tab-active {
    color: var(--brand-500);
}
.mud-tabs .mud-tabs-rounded .mud-tab-slider.mud-tab-slider-horizontal {
    background-color: var(--brand-500);
}
.mud-tabs .mud-tooltip-root.mud-tooltip-inline {
    margin-right: 0;
}
/* MudBlazor's outlined label uses 1.15rem, which is only 11.5px with the Console root size. */
.api-access-fields .mud-input-control .mud-input-label-inputcontrol.mud-input-label-outlined {
    line-height: 1.5;
    transform: translate(2rem, 2rem);
}

.api-access-fields .mud-input-control .mud-shrink ~ .mud-input-label-inputcontrol.mud-input-label-outlined,
.api-access-fields .mud-input-control .mud-input:focus-within ~ .mud-input-label-inputcontrol.mud-input-label-outlined {
    transform: translate(2rem, -1rem) scale(0.8);
}

.api-access-fields input.mud-input-slot {
    height: auto;
    min-height: 1.5em;
    line-height: 1.5;
}

.api-access-fields textarea.mud-input-slot {
    line-height: 1.5;
    padding-block: 1.6rem !important;
}

/* The dropdown option-list popover defaults to --bg-tertiary (mud-stuff.css) — the same surface
   as .page-content, so an open panel is indistinguishable from the card behind it and reads as
   transparent. Console-only: drop it to the darker --bg-secondary so the panel reads as a raised
   layer over the card. */
.dropdown-selection-popover {
    background-color: var(--bg-secondary) !important;
}

/* .bullet-quantity ships a small 0.8rem left margin (bullet.css) that reads fine next to POS's
   smaller headings but tight against Console's 2rem .page-content-title, so the count looks tied to
   the title. Give it clearer separation where it directly follows a page title. */
.page-content-title + .bullet-quantity {
    margin-left: var(--spacing-2);
}
