/**
 * ==========================================================================
 * Archivo: assets/wc/css/variables.css
 * Contexto: WooCommerce
 * 
 * PROPÓSITO:
 * - Mapea variables exclusivas de WooCommerce usando los tokens globales de assets/css/tokens.css.
 * - Define configuraciones UI que solo existen en la tienda (tamaño de tarjetas, botones).
 * ==========================================================================
 */

:root {

   /* ─────────────────────────────────────────────────────
       COMPONENTES WC
       ───────────────────────────────────────────────────── */
   --hybinet-color-bg-card: var(--hybinet-palette-white);
   --hybinet-color-price: var(--hybinet-palette-black);
   --hybinet-color-price-sale: var(--hybinet-palette-red-text);
   --hybinet-color-del: var(--hybinet-palette-gray);
   --hybinet-color-title: var(--hybinet-palette-black);
   --hybinet-color-badge-bg: var(--hybinet-palette-red-badge);
   --hybinet-color-badge-text: var(--hybinet-palette-white);
   --hybinet-color-star: var(--hybinet-palette-yellow);
   --hybinet-color-cta-bg: var(--hybinet-palette-white);
   --hybinet-color-cta-icon: var(--hybinet-palette-black);
   --hybinet-color-cta-hover: var(--hybinet-palette-black);
   --hybinet-color-cta-hover-icon: var(--hybinet-palette-white);
   --hybinet-color-bg-image: #f5f5f5;
   --hybinet-color-bg-overlay: #1a1a1a;
   --hybinet-color-status-confirm: var(--hybinet-color-status-success);
   --hybinet-color-border-dark: #444444;

   /* ─────────────────────────────────────────────────────
       ESPACIADO Y FORMAS WC
       ───────────────────────────────────────────────────── */
   --hybinet-card-radius: 12px;
   --hybinet-card-gap: 1.25rem;
   --hybinet-cta-size: 34px;
   --hybinet-badge-radius: 999px;
   --hybinet-badge-radius-sm: 8px;
   --hybinet-badge-radius-xs: 4px;

   /* ─────────────────────────────────────────────────────
       TIPOGRAFÍA WC
       ───────────────────────────────────────────────────── */
   --hybinet-font-title-size: 0.875rem;
   --hybinet-font-price-size: 1.25rem;
   --hybinet-font-del-size: 0.8rem;
   --hybinet-font-meta-size: 0.75rem;

}