/* R221 contrast fixes — Mitja-approved 2026-09-18 (saw the hex-accurate comparison).
   Overlay loaded after styles.css; unlayered rules win over Tailwind's @layer utilities
   (same seam as cls-font-fallback), so no !important and no Tailwind recompile; styles.css
   byte-identical. All values AA-verified on the real backgrounds (white / cream #fff8ec /
   court-purple #2a1857 / #38246b). Independently revertible: delete this file + its
   default_head_blocks line. Bump -v2 on edit (CF caches the versioned URL). */

:root {
    /* Light-only site: with the <meta name="color-scheme" content="only light"> in default_head_blocks.xml,
       Chrome's auto-dark and Samsung Internet's force-dark stop repainting Court Purple / Electric Green. */
    color-scheme: only light;
    /* Muted gray body/meta text (price line-through, blog cs-date, cart-drawer meta):
       #9ca3af (2.53:1) -> #6b7280 (4.96:1 on white, 4.78:1 on cream). */
    --color-ink-mute: #6b7280;
    --color-gray-400: #6b7280;
    --ink-mute: #6b7280;
    /* Stock / success green text: #16a34a (3.29:1) -> #15803d (5.08:1 on white). */
    --color-success-green: #15803d;
    /* Sale red used as a BACKGROUND for white text (FLASH-SALE stripe bg-sale-red,
       product SALE badge) and as sale-price/error text: #e53935 -> #d32f2f
       (white-on-red 5.00:1; still clearly red). The nav SALE link is exempt — it
       uses .nav-cta-sale (lightened) because it sits on the dark purple header. */
    --color-sale-red: #d32f2f;
}

/* NEW / SALE badge backgrounds (literal Tailwind arbitrary-value classes, white text). */
.bg-\[\#16a34a\] { background-color: #15803d; } /* white-on-green 5.08:1 */
.bg-\[\#e53935\] { background-color: #d32f2f; } /* white-on-red 5.00:1 */

/* SALE nav CTA link on the court-purple header: #e53935 (3.04:1) -> #ff7a70 (>=5:1).
   Scoped to its own class so the red wishlist hearts on WHITE product cards
   (still .text-sale-red) are unaffected. Hover/active keep electric-green. */
.nav-cta-sale { color: #ff7a70; }
.nav-cta-sale:hover { color: var(--color-electric-green); }
