/* Kmusta brand v2 — status colours (DRAFT until Phase 1 founder sign-off)
   ============================================================================
   Success / warning / danger / info, kept out of brand-v2.css because they
   answer a different question. Brand colours say "this is Kmusta"; these say
   "this order failed". A franchisee overriding the brand should not have to
   think about whether their theme still makes an error legible — so these
   stay put while brand-v2.css is the tenant seam.

   Every value here passed tools/wcag_gate.py. Two carry a text/fill split for
   the same reason as caramel and sage in brand-v2.css: the hex that looks right
   as a dot or a bar is too light to be legal as words.

   Danger clay is not new. #B0453C (light) and #E0776C (dark) are the values
   erp/mockup/kmusta-os.html has shipped since it was built, with no guideline
   behind them. Both were run through the gate rather than assumed, both pass,
   and so this file adopts the hexes that already exist instead of inventing
   competing ones — which also makes the Phase 5 mockup diff nearly empty for
   danger. This is where they become official (see docs/DECISIONS.md).

   NOT LINKED BY ANY PAGE YET (Phase 0 is draft-only).
   ============================================================================ */
:root {
  /* ---- Danger / error --------------------------------------------------- */
  --color-danger:       #B0453C;  /* clay. 4.97:1 on cream — legal as text. */
  --color-danger-fill:  #B0453C;  /* same hex; named for role clarity at call sites */
  --color-danger-tint:  #F7E7E5;  /* error-row wash */
  --color-on-danger:    #FFF8EC;  /* label on a danger fill — 5.29:1 */

  /* ---- Success ---------------------------------------------------------- */
  /* Sage, not pandan. The v1 pandan green retires from the UI with mango. */
  --color-success:      #575E43;  /* AS TEXT (6.05:1) */
  --color-success-fill: #6E7559;  /* AS FILL / dot / bar (4.30:1) */
  --color-success-tint: #EDEFE6;

  /* ---- Warning ---------------------------------------------------------- */
  /* Caramel does double duty: the brand's warm highlight IS the warning tone.
     Deliberate — a warmer palette does not need a separate amber, and a second
     orange would compete with the highlight. */
  --color-warning:      #8F5A22;  /* AS TEXT (5.12:1) */
  --color-warning-fill: #B87532;  /* AS FILL (3.32:1) */
  --color-warning-tint: #FAF0E2;

  /* ---- Info ------------------------------------------------------------- */
  /* Info is ube. It is the only accent left, and "informational" is the closest
     semantic to "this is a link / this is active". */
  --color-info:         #6B4E9B;
  --color-info-fill:    #6B4E9B;
  --color-info-tint:    #EFEAF6;

  /* ---- Neutral / pending ------------------------------------------------ */
  --color-pending:      #736659;
  --color-pending-fill: #8A7D70;
  --color-pending-tint: #F3E8D5;

  /* ---- Semantic aliases ------------------------------------------------- */
  --status-error-text:   var(--color-danger);
  --status-error-bg:     var(--color-danger-tint);
  --status-success-text: var(--color-success);
  --status-success-bg:   var(--color-success-tint);
  --status-warning-text: var(--color-warning);
  --status-warning-bg:   var(--color-warning-tint);
  --status-info-text:    var(--color-info);
  --status-info-bg:      var(--color-info-tint);
  --status-pending-text: var(--color-pending);
  --status-pending-bg:   var(--color-pending-tint);
}

/* Dark theme. Tints become deep washes rather than pale ones; the text values
   lighten to clear the same 4.5 bar against a dark ground. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-danger:       #E0776C;
    --color-danger-fill:  #E0776C;
    --color-danger-tint:  #38211E;
    --color-on-danger:    #241C15;
    --color-success:      #A3B189;
    --color-success-fill: #A3B189;
    --color-success-tint: #232A1E;
    --color-warning:      #E0A868;
    --color-warning-fill: #E0A868;
    --color-warning-tint: #3A2A18;
    --color-info:         #B49BE0;
    --color-info-fill:    #B49BE0;
    --color-info-tint:    #2E2440;
    --color-pending:      #BCAE9E;
    --color-pending-fill: #948676;
    --color-pending-tint: #332720;
  }
}
:root[data-theme="dark"] {
  --color-danger:       #E0776C;
  --color-danger-fill:  #E0776C;
  --color-danger-tint:  #38211E;
  --color-on-danger:    #241C15;
  --color-success:      #A3B189;
  --color-success-fill: #A3B189;
  --color-success-tint: #232A1E;
  --color-warning:      #E0A868;
  --color-warning-fill: #E0A868;
  --color-warning-tint: #3A2A18;
  --color-info:         #B49BE0;
  --color-info-fill:    #B49BE0;
  --color-info-tint:    #2E2440;
  --color-pending:      #BCAE9E;
  --color-pending-fill: #948676;
  --color-pending-tint: #332720;
}