/* =============================================================================
   Orbita Diego — Paleta B "Crema Industrial" — B2C scope
   b2c-tokens.css: redefine tokens de color y sombra SOLO bajo body.orbita-b2c.
   Encolado DESPUÉS de main.css (dep: orbita-diego-main) para garantizar cascada.

   NO modificar :root de main.css ni theme.json — el portal B2B queda oscuro.
   Mecanismo: body_class filter agrega `orbita-b2c` en páginas de storefront.
   Ver: D066 en docs/DECISIONS.md.
   ============================================================================= */

/* -----------------------------------------------------------------------------
   1. Custom properties — redefinición para B2C bajo body.orbita-b2c
   ----------------------------------------------------------------------------- */

body.orbita-b2c {
  /* --- Backgrounds (crema industrial) --- */
  --paper:        #F7F3EC;
  --paper-soft:   #EDE8DF;
  --paper-card:   #E2DDD4;

  /* --- Foregrounds (tinta oscura) --- */
  --ink:          #1C1814;
  --ink-mid:      #5C5348;
  --ink-light:    #6E6258;

  /* --- Accents (mismos en ambos contextos — marca consistente) --- */
  --accent:           #CFA22A;
  --accent-deep:      #B68A1F;
  --accent-warm:      #E0BB3F;
  --accent-blue:      #1A6BAF;   /* links + precio total — más oscuro para contraste AA */
  --accent-blue-deep: #155A94;

  /* --- Semantic --- */
  --critical: #B82020;
  --warning:  #7A4F00;
  --success:  #1A6B40;

  /* --- Rules / Borders --- */
  --rule:        #D4CEC5;
  --rule-strong: #BEB7AC;
  --rule-subtle: #EAE5DC;

  /* --- Ink on accent (texto sobre fondo dorado — sigue oscuro, correcto) --- */
  --ink-on-accent: #1C1814;

  /* --- Shadows (más suaves, apropiadas para fondo claro) --- */
  --shadow-sm:          0 1px 3px rgba(28, 24, 20, 0.08);
  --shadow-md:          0 4px 12px rgba(28, 24, 20, 0.10);
  --shadow-lg:          0 12px 32px rgba(28, 24, 20, 0.14);
  --shadow-glow-accent: 0 0 24px rgba(207, 162, 42, 0.22);

  /* --- PLP layout tokens — recalculados para fondo crema --- */
  --plp-controls-bg: var(--paper);
}

/* -----------------------------------------------------------------------------
   2. Preset WP/WC — redefinición de --wp--preset--color--* para B2C
   Los bloques nativos de WC (cart, checkout) usan estas variables generadas
   por theme.json. Sin esta sección, los bloques quedarían con valores oscuros.
   Slugs validados contra theme.json palette. "rule", "info" no tienen slug
   en theme.json (son solo vars de main.css) — no hay --wp--preset--color-- para esos.
   ----------------------------------------------------------------------------- */

body.orbita-b2c {
  --wp--preset--color--paper:          #F7F3EC;
  --wp--preset--color--paper-soft:     #EDE8DF;
  --wp--preset--color--paper-card:     #E2DDD4;
  --wp--preset--color--ink:            #1C1814;
  --wp--preset--color--ink-mid:        #5C5348;
  --wp--preset--color--ink-light:      #6E6258;
  --wp--preset--color--ink-on-accent:  #1C1814;
  --wp--preset--color--accent:         #CFA22A;
  --wp--preset--color--accent-deep:    #B68A1F;
  --wp--preset--color--accent-warm:    #E0BB3F;
  --wp--preset--color--accent-blue:    #1A6BAF;
  --wp--preset--color--accent-blue-deep: #155A94;
  --wp--preset--color--critical:       #B82020;
  --wp--preset--color--warning:        #7A4F00;
  --wp--preset--color--success:        #1A6B40;
  /* whatsapp y whatsapp-deep mantienen sus valores de marca — no cambian */
}

/* -----------------------------------------------------------------------------
   3. Scrollbar — adaptar a fondo crema en B2C (Chrome/Edge)
   Firefox hereda vía scrollbar-color con los tokens ya redefinidos arriba.
   ----------------------------------------------------------------------------- */

body.orbita-b2c {
  scrollbar-color: var(--rule-strong) var(--paper-soft);
}

body.orbita-b2c::-webkit-scrollbar-track {
  background: var(--paper-soft);
}

body.orbita-b2c::-webkit-scrollbar-thumb {
  background-color: var(--rule-strong);
  border: 2px solid var(--paper-soft);
}


/* -----------------------------------------------------------------------------
   4. Pattern hardcode overrides — inline styles que no pueden usar var()
   Los patterns PHP generan HTML con inline styles (color:#HEX) para compatibilidad
   con el editor de bloques. En B2C necesitamos sobreescribirlos con !important
   ya que la especificidad de inline style (1,0,0,0) supera cualquier selector CSS.
   ----------------------------------------------------------------------------- */

/* checkout-trust-badges: fondo oscuro + texto claro, incompatibles con crema.
   La clase orbita-trust-badges es única del pattern → safe para targetear. */
body.orbita-b2c .orbita-trust-badges {
  background-color: var(--paper-card) !important;
  border-top-color: var(--rule) !important;
  border-bottom-color: var(--rule) !important;
}

/* Los párrafos de labels del badge tienen color:#F4F1EA hardcodeado.
   En crema, el ink correcto es #1C1814 — sobreescribimos todos los p dentro. */
body.orbita-b2c .orbita-trust-badge p {
  color: var(--ink) !important;
}

/* pdp-compatibility lead: color:#A6A29A (ink-mid oscuro) — ratio 3.9:1 sobre crema.
   No pasa WCAG AA (4.5:1). Reemplazamos con --ink-mid de la paleta B (#5C5348 → 7.5:1). */
body.orbita-b2c .orbita-pdp-section__lead {
  color: var(--ink-mid) !important;
}