/* ============================================================
   Cotxera — Design Tokens
   "Noche de partido": night navy, floodlight amber, turf green,
   chalk pitch-markings. Source of truth: brand/brand-guidelines.md
   ============================================================ */

:root {
  /* ---------- Palette · core ---------- */
  --rc-night:        #081226;  /* Noche Zapopan — page background, ink on light */
  --rc-night-2:      #0c1b3a;  /* Noche 2 — gradient partner, elevated dark bg */
  --rc-panel:        #0e2044;  /* Tribuna — card/panel surface on dark */
  --rc-panel-2:      #122a57;  /* Tribuna Alta — hover/raised surface */
  --rc-chalk:        #ecf2fb;  /* Cal — primary text on dark, pitch markings */
  --rc-chalk-dim:    #9db0d0;  /* Cal Tenue — secondary text on dark */
  --rc-line:         rgba(220, 232, 250, 0.14); /* hairlines, borders */

  /* ---------- Palette · accents ---------- */
  --rc-turf:         #3ed47e;  /* Pasto — action, confirmation, money (dark bg) */
  --rc-turf-deep:    #23a35c;  /* Pasto Profundo — turf on light backgrounds */
  --rc-turf-ink:     #052012;  /* text/icons sitting ON turf fills */
  --rc-flood:        #f4c964;  /* Reflector — highlight, event kickers, caps/alerts */
  --rc-flood-ink:    #2b2005;  /* text/icons sitting ON flood fills */
  --rc-danger:       #ff8f7a;  /* Tarjeta Roja (suave) — errors, "nunca" states */

  /* ---------- Palette · semantic aliases ---------- */
  --rc-bg:                var(--rc-night);
  --rc-bg-raised:         var(--rc-panel);
  --rc-text:              var(--rc-chalk);
  --rc-text-muted:        var(--rc-chalk-dim);
  --rc-action:            var(--rc-turf);      /* primary CTA */
  --rc-action-hover:      #55e392;
  --rc-confirm:           var(--rc-turf);      /* bookings, payouts, success */
  --rc-money:             var(--rc-turf);      /* earnings figures, payout rows */
  --rc-highlight:         var(--rc-flood);     /* floodlight moments only */
  --rc-privacy:           var(--rc-turf);      /* privacy-radius circle, badge */
  --rc-error:             var(--rc-danger);

  /* ---------- Typography ---------- */
  --rc-font-display: "Barlow Condensed", "Arial Narrow", sans-serif;
  --rc-font-body:    "Barlow", system-ui, -apple-system, sans-serif;

  --rc-weight-body:      400;
  --rc-weight-body-med:  500;
  --rc-weight-body-bold: 600; /* max for body copy; 700 reserved for tiny UI labels */
  --rc-weight-display:   700;
  --rc-weight-display-x: 800; /* hero/display only */

  /* Type scale (1.25 major third on 17px body base) */
  --rc-text-xs:   13px;   /* legal, captions, map chips */
  --rc-text-sm:   14.5px; /* meta, labels, secondary UI */
  --rc-text-base: 17px;   /* body */
  --rc-text-md:   19px;   /* lead paragraphs */
  --rc-text-lg:   24px;   /* card titles (display font) */
  --rc-text-xl:   clamp(30px, 4.6vw, 46px);  /* section titles small */
  --rc-text-2xl:  clamp(34px, 5.4vw, 56px);  /* section titles */
  --rc-text-3xl:  clamp(42px, 5.6vw, 72px);  /* hero */

  --rc-leading-tight: 0.95;  /* display headlines */
  --rc-leading-body:  1.6;
  --rc-tracking-display: 0.015em;  /* display headlines */
  --rc-tracking-kicker:  0.22em;   /* kickers/eyebrows (uppercase) */
  --rc-tracking-label:   0.1em;    /* buttons, nav, chips (uppercase) */

  /* ---------- Spacing (4px base) ---------- */
  --rc-space-1:  4px;
  --rc-space-2:  8px;
  --rc-space-3:  12px;
  --rc-space-4:  16px;
  --rc-space-5:  22px;   /* default card gap */
  --rc-space-6:  26px;   /* panel padding */
  --rc-space-7:  38px;
  --rc-space-8:  48px;   /* band padding */
  --rc-space-9:  74px;   /* section rhythm (54px under 560px wide) */
  --rc-measure:  56ch;   /* max line length for running text */
  --rc-wrap-max: 1120px; /* page container */

  /* ---------- Radii ---------- */
  --rc-radius-xs:   4px;    /* focus rings, tiny elements */
  --rc-radius-sm:   10px;   /* buttons, inputs */
  --rc-radius-md:   14px;   /* cards, panels */
  --rc-radius-lg:   18px;   /* framed media, map frame */
  --rc-radius-xl:   20px;   /* full-width bands */
  --rc-radius-pill: 999px;  /* chips, badges */

  /* ---------- Shadows & glows ---------- */
  --rc-shadow-card:  0 30px 70px rgba(2, 6, 18, 0.55), inset 0 1px 0 rgba(236, 242, 251, 0.08);
  --rc-shadow-cta:   0 6px 26px rgba(62, 212, 126, 0.28);   /* turf CTA only */
  --rc-glow-flood:   0 0 34px rgba(244, 201, 100, 0.22);    /* floodlight halo */

  /* ---------- Borders ---------- */
  --rc-border-hair:   1px solid var(--rc-line);
  --rc-border-input:  1.5px solid rgba(236, 242, 251, 0.25);
  --rc-border-ghost:  2px solid rgba(236, 242, 251, 0.35);
  /* Motif strokes (see guidelines §Motifs) */
  --rc-stroke-pitch:      2px;                 /* chalk pitch markings, 20% chalk */
  --rc-dash-privacy:      3 7;                 /* privacy-radius circle dasharray */
  --rc-dash-ticket:       2px dashed rgba(236, 242, 251, 0.28); /* stub perforation */

  /* ---------- Motion ---------- */
  --rc-motion-fast:    160ms;  /* hovers, presses */
  --rc-motion-base:    400ms;  /* chips, toggles, small entrances */
  --rc-motion-slow:    700ms;  /* scroll reveals */
  --rc-motion-draw:    2.4s;   /* self-drawing routes / check strokes */
  --rc-ease-out:       cubic-bezier(0.2, 0.7, 0.2, 1);
  --rc-ease-standard:  ease;
  /* Respect prefers-reduced-motion: disable all non-essential animation. */

  /* ---------- Z-index ---------- */
  --rc-z-nav:    50;
  --rc-z-modal:  80;
  --rc-z-toast:  90;
  --rc-z-skip:   100;
}

/* ---------- Light-context overrides (emails, print, docs) ----------
   Dark "noche de partido" is the default stage. When forced onto white
   (transactional email clients, print), remap: */
.rc-on-light {
  --rc-bg:         #ffffff;
  --rc-bg-raised:  #f4f7fc;
  --rc-text:       var(--rc-night);
  --rc-text-muted: #4a5a78;
  --rc-line:       rgba(8, 18, 38, 0.14);
  --rc-action:     var(--rc-turf-deep);   /* AA-safe large text/icons only */
  --rc-confirm:    var(--rc-turf-deep);
  --rc-money:      #17824a;               /* money figures on white */
  --rc-highlight:  #a97c13;               /* flood is a fill on light, never text */
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --rc-motion-fast: 0ms;
    --rc-motion-base: 0ms;
    --rc-motion-slow: 0ms;
    --rc-motion-draw: 0ms;
  }
}