﻿/* Production Control app — rules that must live OUTSIDE Blazor scoped CSS.
 *
 * MudBlazor renders tooltip TEXT into MudPopoverProvider at the application root, not inside the
 * component that declared the tooltip, so scoped CSS cannot reach it. */

/* MudBlazor puts no max-width on a tooltip at all, so a two-sentence tooltip renders as one line
 * wider than the screen and pushes itself off-viewport. This app's tooltips carry real explanations
 * rather than one-word labels, which is what made it obvious.
 *
 * This rule is GLOBAL rather than scoped to this app, and that is forced rather than chosen:
 * MudTooltip's RootClass lands on the anchor wrapper that sits inline in the page, NOT on the
 * popover that holds the text, and the popover carries no attribute identifying which component
 * opened it. `.mud-popover.mud-tooltip` is the narrowest selector that actually reaches it.
 *
 * The blast radius is every tooltip in the application, and that is acceptable here: there is no
 * case where an unbounded single-line tooltip is preferable to a wrapped one, so this only ever
 * improves the tooltips it touches. */
.mud-popover.mud-tooltip {
    line-height: 1.35;
    /* !important because MudBlazor positions and sizes popovers with INLINE styles, which no
       stylesheet rule can outrank without it -- the same reason the data grid's table container
       needs one. The rule was loading and matching but computing to `none` until this was added. */
    max-width: min(460px, 90vw) !important;
    text-align: left;
    white-space: normal !important;
    word-break: normal;
}

/* Marks this app's tooltips. Deliberately carries NO layout properties: it lands on the inline
 * anchor wrapping the chip or icon, so a width constraint here would squeeze the element being
 * described rather than the description. Kept as a hook, and as a record of where the class
 * actually ends up. */
.pc-tooltip {
    /* intentionally empty — see above */
}


/* ── Expansion panel headers in Production Control dialogs ───────────────────────────────────────
   GLOBAL, not scoped. These panels live in a MudBlazor popover outside the component's DOM subtree,
   and MudBlazor renders the header chrome itself, so no ancestor carries the component's scope
   attribute and `::deep` never matches. Same reason the tooltip width rule above is global.

   The class names are specific enough to stay contained: they exist only on these two dialogs. */

.ps-parts-panels .mud-expand-panel,
.ps-detail-panels .mud-expand-panel {
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 6px;
    margin: 0 0 4px 0;
}

/* MudBlazor adds a top margin to an expanded panel to set it apart. With a list of them that reads
   as the list coming apart rather than as emphasis. */
.ps-parts-panels .mud-expand-panel.mud-panel-expanded,
.ps-detail-panels .mud-expand-panel.mud-panel-expanded {
    margin: 0 0 4px 0;
}

/* The header has to look like something you can press. Left as plain text on the page background it
   read as a heading, and nothing suggested the content under it could be put away. */
.ps-parts-panels .mud-expand-panel-header,
.ps-detail-panels .mud-expand-panel-header {
    background: var(--mud-palette-background-gray);
    border-bottom: 1px solid transparent;
    font-weight: 500;
    min-height: 0;
    padding: 6px 10px;
    transition: background 120ms ease;
}

.ps-parts-panels .mud-expand-panel-header:hover,
.ps-detail-panels .mud-expand-panel-header:hover {
    background: var(--mud-palette-action-default-hover);
}

/* An open panel keeps its header tinted and gains a rule, so the header reads as the lid of the
   content below it rather than as a floating row. */
.ps-parts-panels .mud-panel-expanded .mud-expand-panel-header,
.ps-detail-panels .mud-panel-expanded .mud-expand-panel-header {
    border-bottom-color: var(--mud-palette-lines-default);
}

/* The chevron is the affordance; at MudBlazor's default opacity it disappeared into the grey. */
.ps-parts-panels .mud-expand-panel-icon,
.ps-detail-panels .mud-expand-panel-icon {
    color: var(--mud-palette-text-primary);
    opacity: 1;
}

.ps-parts-panels .mud-expand-panel-content,
.ps-detail-panels .mud-expand-panel-content {
    padding: 0;
}

/* The operation the parts dialog was opened from gets a rail, so it is findable without reading
   every heading. */
.ps-parts-panels .ps-parts-panel.is-current {
    border-color: var(--mud-palette-primary);
    box-shadow: inset 3px 0 0 var(--mud-palette-primary);
}

/* Same reason as the panel rules: this sits inside the dialog popover, so a scoped rule cannot
   reach it. */
.ps-parts-search {
    flex: 0 0 auto;
    width: 300px;
}
