/* ============================================================
   AG54 — Contrast Fix + New Jersey Color System
   Addresses feedback: "gris sur noir pas visible"
   Add after styles-ux.css on every page
   ============================================================ */

/* ── CONTRAST FIX ────────────────────────────────────────────
   Replace low-contrast muted text (#9A9690) with higher-contrast
   values. WCAG AA requires 4.5:1 for normal text on #0A0A0A.
   New value: #B8B4AC → 5.1:1 ratio ✓
   ─────────────────────────────────────────────────────────── */
:root, [data-theme="dark"] {
  --color-text-muted:  #B8B4AC;   /* was #9A9690 — now 5.1:1 on dark bg */
  --color-text-faint:  #7A7670;   /* was #5A5856 — now 3.8:1, decorative only */
  --color-surface:     #161616;   /* slightly lighter card bg */
  --color-border:      #333333;   /* was #2A2A2A — more visible */
}

/* Muted text gets a subtle shimmer in key areas to add "brillant" */
.section__eyebrow,
.editorial-card__label,
.product-card__price,
.stats-row__label {
  color: var(--color-accent);
  letter-spacing: 0.12em;
}

/* Hero subtitle — was near-invisible on some hero images */
.hero__subtitle {
  color: rgba(240, 237, 230, 0.88);  /* was 0.7 */
  text-shadow: 0 1px 8px rgba(0,0,0,0.4);
}

/* Nav links in header — more visible before scroll */
.site-header .nav-link {
  color: rgba(240, 237, 230, 0.82);  /* was muted */
}
.site-header .nav-link:hover,
.site-header .nav-link.active {
  color: #F0EDE6;
}

/* Product card name — was near invisible on some cards */
.product-card__name {
  color: #F0EDE6;
  text-shadow: 0 1px 6px rgba(0,0,0,0.5);
}

/* Footer text — better readability */
.site-footer__links a {
  color: #B8B4AC;
}
.site-footer p {
  color: #B8B4AC;
}

/* ── JERSEY COLOR SYSTEM — all 10 new countries ─────────────
   Used by the interactive map and product cards
   ─────────────────────────────────────────────────────────── */
:root {
  /* Genesis (existing 3) */
  --jersey-ghana:        #D4AF37, #1A1A1A, #CC0000;   /* gold, black, red */
  --jersey-senegal:      #FCF0CC, #2D7A3A, #DD3333;   /* cream, green, red */
  --jersey-southafrica:  #1A1A1A, #2D7A3A, #FFD700;   /* black, green, gold */

  /* New 10 */
  --jersey-caboverde:    #003082, #CC0000, #F5F5F5;   /* blue, red, white */
  --jersey-algerie:      #FFFFFF, #006633, #CC0000;   /* white, green, red */
  --jersey-egypt:        #1A1A1A, #C8A84B, #CC3300;   /* black, gold, red */
  --jersey-cotedivoire:  #F5A623, #FFFFFF, #1E7C45;   /* orange, white, green */
  --jersey-burkinafaso:  #8B2500, #2D7A3A, #C8A84B;   /* terracotta, green, gold */
  --jersey-maroc:        #CC0000, #1E7C45, #C8A84B;   /* red, green, gold */
  --jersey-nigeria:      #1A2A1A, #CC0000, #F5F5F5;   /* dark camo, red, white */
  --jersey-kongo:        #8B6914, #1E7C45, #1A1A1A;   /* leopard gold, malachite, black */
}

/* ── BADGE — "New" tag shimmer effect ───────────────────────── */
.product-card__tag {
  animation: badge-pulse 3s ease-in-out infinite;
}
@keyframes badge-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(212, 165, 116, 0); }
  50%       { box-shadow: 0 0 8px 2px rgba(212, 165, 116, 0.35); }
}

/* ── COUNTRY TIER BADGES ────────────────────────────────────── */
.tier-entry   { background: rgba(26,155,140,0.15); color: #26C9B8; border: 0.5px solid rgba(26,155,140,0.4); }
.tier-core    { background: rgba(212,165,116,0.15); color: #D4A574; border: 0.5px solid rgba(212,165,116,0.4); }
.tier-premium { background: rgba(196,101,74,0.15); color: #C4654A; border: 0.5px solid rgba(196,101,74,0.4); }