/* Global app styles. Linked from Components/App.razor AFTER MudBlazor.min.css and the scoped bundle.
   Table rows are rendered by MudBlazor components (and dialogs by MudDialogProvider), which page-scoped
   .razor.css cannot reach without ::deep — so row styling that every list shares lives here.
   Only --mud-palette-* variables: MudThemeProvider re-emits them for dark mode, so these follow the theme. */

/* ---- Organic orders (owner, 2026-09-24): "a quick way to identify which orders are organic" ----------------
   A green tint plus a green bar on the first cell. Never the ONLY cue: every organic row also carries the
   ORGANIC chip / leaf icon (OrganicChip), because Primary, Success, the status chips and the table hover are
   all green too, and a colour alone is lost on a colour-blind reader. Applied by OrganicStyle.RowClass. */
.mud-table .mud-table-body .mud-table-row.pt-organic-row > .mud-table-cell {
    background-color: rgba(var(--mud-palette-success-rgb), 0.12);
}
.mud-table .mud-table-body .mud-table-row.pt-organic-row > .mud-table-cell:first-child {
    box-shadow: inset 4px 0 0 var(--mud-palette-success);
}
@media (hover: hover) and (pointer: fine) {
    .mud-table-hover .mud-table-container .mud-table-root .mud-table-body .mud-table-row.pt-organic-row:hover > .mud-table-cell {
        background-color: rgba(var(--mud-palette-success-rgb), 0.20);
    }
}

/* ---- Selected row ------------------------------------------------------------------------------------------
   Every master list's RowClassFunc returns "mud-selected-row", but MudBlazor ships no rule for that class, so a
   selected row was never actually highlighted. Neutral background + an amber (secondary) bar, so it reads
   distinctly from the green organic tint and the green hover; an organic row that is selected shows both. */
.mud-table .mud-table-body .mud-table-row.mud-selected-row > .mud-table-cell {
    background-color: var(--mud-palette-action-default-hover);
}
.mud-table .mud-table-body .mud-table-row.mud-selected-row > .mud-table-cell:first-child {
    box-shadow: inset 4px 0 0 var(--mud-palette-secondary);
}
.mud-table .mud-table-body .mud-table-row.pt-organic-row.mud-selected-row > .mud-table-cell {
    background-color: rgba(var(--mud-palette-success-rgb), 0.24);
}
.mud-table .mud-table-body .mud-table-row.pt-organic-row.mud-selected-row > .mud-table-cell:first-child {
    box-shadow: inset 4px 0 0 var(--mud-palette-secondary), inset 8px 0 0 var(--mud-palette-success);
}

/* The ORGANIC chip itself: bold caps so it reads as a designation, not a status. */
.pt-organic-chip {
    font-weight: 700;
    letter-spacing: 0.04em;
}

/* ---- Color.Dark chips (the Tickets "Invoiced" status) ---------------------------------------------------------
   MudBlazor's dark palette sets Dark to #27272f, the colour of the dark surface itself, so a Dark chip vanished in
   dark mode: Text-variant ink on the same-coloured page, a Filled chip with no visible body. Point the chip's Dark
   variables at the theme's ink and paper instead: charcoal with white text in light mode, as before, and off-white
   with dark text in dark mode. Scoped to chips because the palette's Dark also colours tooltip text and Normal
   alerts, which are right as they are. Darken is the fill a clickable Filled chip takes on hover. */
.mud-chip.mud-chip-color-dark {
    --mud-palette-dark: var(--mud-palette-text-primary);
    --mud-palette-dark-text: var(--mud-palette-surface);
    --mud-palette-dark-hover: var(--mud-palette-action-default-hover);
    --mud-palette-dark-darken: var(--mud-palette-text-secondary);
}

/* ---- Chips whose label is their colour (Text and Outlined chips: list statuses, activity tags) ----------------
   A Text chip draws its colour as text on a 6% tint of itself, an Outlined chip on whatever is behind it, and list
   rows darken or tint what's behind: hovered, selected, organic. The raw palette colours fell to 2.8-3.8:1 on the
   worst row (an organic row that is also hovered or selected). So each label is its colour blended with the theme's
   text ink: deeper in light mode, paler in dark mode, same hue. Each colour's share sits a few points under the
   largest that still reaches 4.5:1 on every row in BOTH themes, so 8-bit rounding can't tip it under (Primary,
   Success, Info and Error are held back by dark mode, Secondary and Warning by light mode). The worst row assumes
   the organic hover rule keeps outranking organic-selected. Recheck these if a palette colour changes. */
.mud-chip-text.mud-chip-color-primary, .mud-chip-outlined.mud-chip-color-primary {
    color: color-mix(in srgb, var(--mud-palette-primary) 50%, var(--mud-palette-text-primary));
}
.mud-chip-text.mud-chip-color-secondary, .mud-chip-outlined.mud-chip-color-secondary {
    color: color-mix(in srgb, var(--mud-palette-secondary) 45%, var(--mud-palette-text-primary));
}
.mud-chip-text.mud-chip-color-success, .mud-chip-outlined.mud-chip-color-success {
    color: color-mix(in srgb, var(--mud-palette-success) 60%, var(--mud-palette-text-primary));
}
.mud-chip-text.mud-chip-color-info, .mud-chip-outlined.mud-chip-color-info {
    color: color-mix(in srgb, var(--mud-palette-info) 55%, var(--mud-palette-text-primary));
}
.mud-chip-text.mud-chip-color-warning, .mud-chip-outlined.mud-chip-color-warning {
    color: color-mix(in srgb, var(--mud-palette-warning) 70%, var(--mud-palette-text-primary));
}
.mud-chip-text.mud-chip-color-error, .mud-chip-outlined.mud-chip-color-error {
    color: color-mix(in srgb, var(--mud-palette-error) 45%, var(--mud-palette-text-primary));
}

/* ---- Text and Outlined error alerts (the over-capacity warnings on Tickets/Trips, Users, the account pages) -------
   MudBlazor colours their text with --mud-palette-error-darken, which is also the Filled red button's hover fill. The
   dark theme's red hover has to be light enough to carry the dark ink, and on the dark surface that red failed as
   text (3.8:1). So the alert text is the red blended with the theme's text ink instead: deeper in light mode (5.0:1,
   about as before), paler in dark mode (5.5:1). */
.mud-alert-text-error, .mud-alert-outlined-error {
    color: color-mix(in srgb, var(--mud-palette-error) 80%, var(--mud-palette-text-primary));
}

/* ---- Buttons (owner, 2026-09-29: every button in the app follows the Orders list toolbar) --------------------
   A button's label never breaks over lines. Squeezed into a narrow row, a MudButton otherwise shrinks and stacks
   its words, standing two or three lines tall, as the Orders toolbar buttons did. So the ROW gives way instead:
   every row that holds buttons is `d-flex flex-wrap` with a `gap-*`, and moves whole buttons (or a pair kept
   together in a nested non-wrapping `d-flex`) onto the next line. A row that can't wrap would overflow. */
.mud-button-label {
    white-space: nowrap;
}

/* Opt-out for a lone button with no row to wrap into, whose box can end up narrower than its label: the Returns
   finder's "Load returnable lines" in its md=4 panel at ~960-1000px screens. Its label may break there instead of
   spilling past the panel. */
.pt-wrap-label .mud-button-label {
    white-space: normal;
}

/* Dialog action bars wrap the same way rather than pushing buttons past the dialog's edge on a narrow screen.
   MudBlazor already spaces them with gap: 8px, so a wrapped line keeps the spacing. */
.mud-dialog-actions {
    flex-wrap: wrap;
}

/* MudBlazor ships no white-space utility, so markup that keeps a short run on one line (the order number and its
   organic leaf in the Orders list) needs this defined here. */
.text-nowrap {
    white-space: nowrap !important;
}