/* =====================================================================
   FROSTEC · CAPA DE MARCA (permanente)
   Basada en el Manual de Identidad Frostec (Oct 2026)
   Se carga DESPUÉS del <style> inline que define .fr-* en layout.tpl
   ===================================================================== */

/* IBM Plex Mono se carga con un <link> en layout.tpl (ver INSTRUCCIONES) */

html:root {
  /* Paleta del manual */
  --fx-off:    #F4F4F4;
  --fx-ceniza: #D5DCD9;
  --fx-beige:  #B8B7A6;
  --fx-musgo:  #48595E;
  --fx-topo:   #827974;
  --fx-black:  #000000;

  /* Remapeo de las variables que ya usa el tema custom (.fr-*) */
  --color-white:        var(--fx-off);
  --color-accent:       var(--fx-musgo);
  --color-accent-light: var(--fx-ceniza);
  --color-gray-bg:      var(--fx-ceniza);
  --color-gray-border:  #C4CBC8;
  --color-gray-text:    #4F5557;
  --color-gray-dark:    #111111;
  --radius-md: 4px;
  --radius-lg: 4px;

  /* Tipografía del manual: Helvetica + IBM Plex Mono como acento */
  --font-display: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-body:    "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono:    "IBM Plex Mono", ui-monospace, monospace;

  /* Variables nativas de Rio (carrito, botones, labels) */
  --main-background:  #F4F4F4;
  --button-background:#48595E;
  --button-foreground:#F4F4F4;
  --accent-color:     #48595E;
  --label-background: #48595E;
  --label-foreground: #F4F4F4;
}

/* ---------- Interruptor de campañas ----------
   El script de layout.tpl agrega <html class="fx-cyber"> solo entre el 02/11 00:00 y el 05/11 00:00 (ART) */
.fx-cyber-only { display: none !important; }
html.fx-cyber .fx-cyber-only { display: revert !important; }
html.fx-cyber .fx-normal-only { display: none !important; }

/* ---------- Titulares: Helvetica bold, ajustada, alineada a la izquierda ---------- */
.section-title,
.fr-elegidos__title,
.fr-hero__title { letter-spacing: -0.02em; font-weight: 700; }

/* Eyebrows y textos técnicos en mono */
.eyebrow,
.fr-hero__eyebrow,
.fr-sport__card-sub,
.fr-topbar__item,
.fr-card__badge,
.fr-trust-bar__item,
.fr-footer__col-title,
.fr-footer__pay-badge {
  font-family: var(--font-mono);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* ---------- Barra superior ---------- */
body .fr-topbar { background: var(--fx-musgo); }
body .fr-topbar__item { color: var(--fx-off); font-size: 11px; }

/* ---------- Nav ---------- */
body .fr-nav__links a:hover { color: var(--fx-ceniza) !important; }
body .fr-nav__cart-count { background: var(--fx-beige); color: var(--fx-black); }

/* ---------- Hero ---------- */
body .fr-hero__overlay {
  background: linear-gradient(180deg, rgba(14,20,22,.15) 0%, rgba(14,20,22,.55) 100%);
}
body .fr-hero__cta { background: var(--fx-off); color: var(--fx-black); border-radius: 2px; }
body .fr-hero__cta:hover { background: var(--fx-musgo); color: var(--fx-off); }

/* ---------- Barra de confianza ---------- */
body .fr-trust-bar { background: var(--fx-musgo); }
body .fr-trust-bar__item { color: var(--fx-off); font-size: 12px; }

/* ---------- Comprá por deporte ---------- */
body .fr-sport__card-overlay { background: linear-gradient(180deg, rgba(72,89,94,0) 30%, rgba(72,89,94,.75) 100%); }
body .fr-sport__card:hover .fr-sport__card-overlay { background: linear-gradient(180deg, rgba(72,89,94,.1) 0%, rgba(72,89,94,.85) 100%); }

/* ---------- Más elegidos ---------- */
body .fr-elegidos { background: var(--fx-off); }
body .fr-card { background: transparent; border-radius: 4px; }
body .fr-card__img-wrap { background: var(--fx-ceniza); border-radius: 4px; }
body .fr-card__badge { background: var(--fx-musgo); color: var(--fx-off); border-radius: 2px; font-size: 11px; }
body .fr-card__price-compare { color: var(--fx-topo); }
body .fr-card__price--sale { color: var(--fx-black); font-weight: 700; }

/* ---------- Reviews ---------- */
body .fr-reviews { background: var(--fx-ceniza); }
body .fr-review-card { background: var(--fx-off); border-radius: 4px; }
body .fr-reviews__stars,
body .fr-review-card__stars { color: var(--fx-musgo); }

/* ---------- Footer en verde musgo ---------- */
body .fr-footer { background: var(--fx-musgo); }
body .fr-footer__logo,
body .fr-footer__col-title { color: var(--fx-off); }
body .fr-footer__tagline { color: rgba(244,244,244,.7); }
body .fr-footer__links a { color: rgba(244,244,244,.72); }
body .fr-footer__links a:hover { color: var(--fx-off); }
body .fr-footer__social { border-color: rgba(244,244,244,.3); color: var(--fx-off); }
body .fr-footer__social:hover { border-color: var(--fx-beige); color: var(--fx-beige); }
body .fr-footer__bottom { border-top-color: rgba(244,244,244,.15); }
body .fr-footer__copy,
body .fr-footer__pay-badge { color: rgba(244,244,244,.6); border-color: rgba(244,244,244,.25); }