/**
 * Shared validation-card chrome — the one warning/error card design
 * (Design.md §7.11: "One design, two sizes").
 *
 * Split out of core-configurator.css (efficiency #231) so the card is
 * reachable from surfaces that are NOT configurators. The trade application
 * form is a standalone block on any page and had hand-rolled its own
 * err-tinted recipe rather than pull the whole ~1,500-line configurator
 * sheet in as a dep; that is the drift this file closes.
 *
 * Registered as the `core-validation-messages` style handle beside the other
 * shared primitives (core-tokens, core-modal) in Core_Assets_Configurator.
 * Consumers declare it as a DIRECT style dep so the shared rules always print
 * ahead of their own local sizing, and an equal-specificity local override
 * (a single class on the same element) still wins.
 *
 * Colour/type/radius tokens come from the theme's main.css; the card casts no
 * elevation, so unlike core-modal this needs no core-tokens dep.
 *
 * A module's own class on this element keeps only width / placement — never a
 * local background, border, radius, colour or font-size (inconsistency #95).
 *
 * @package Make_My_Core
 */

/* The banner — the Error family (Design.md §7.11, ruled 2026-09-29): a 2px
   Error line down the left edge on a faint Error wash, square corners (a
   one-sided border takes no radius) and no other border, with 13px Ink text.
   It was a Warn-tinted box, which read as advice rather than as a refusal.
   Ink on the 6% wash is pinned in tests/js/Theme/design-contrast.test.js. */
.core-validation-messages {
    background: color-mix(in oklch, var(--err) 6%, var(--paper));
    border: 0;
    border-left: 2px solid var(--err);
    border-radius: 0;
    padding: var(--sp-3) var(--sp-4);
    margin-bottom: var(--sp-3);
    font-size: var(--fs-13);
    line-height: 1.4;
    color: var(--ink);
}

.core-validation-messages ul {
    margin: 0;
    padding: 0 0 0 16px;
    list-style: disc;
}

.core-validation-messages li {
    margin-bottom: 2px;
}

/* Inline variant — per-field / in-step placement rather than the top-of-step
   banner, and deliberately quieter than it (Design.md §7.11, ruled
   2026-09-28): Ink text with a 2px Error line down the left edge, no tint, no
   box, square corners (a one-sided border takes no radius). Consumers carry
   both classes and keep only their own width / placement rules local
   (inconsistency #95). */
.core-validation-messages--inline {
    margin: 0;
    padding: 1px 0 1px 8px;
    background: none;
    border: 0;
    border-left: 2px solid var(--err);
    border-radius: 0;
    color: var(--ink);
    line-height: 1.4;
}