/**
 * Sebanda Insurance — Design Tokens
 *
 * Override de las variables CSS del starter Realyvax.
 * Paleta real: Dark #110c1d / CTA verde-lima #9cfe00 / Light #f7f7f7
 *
 * INSTRUCCIONES:
 * Para cambiar la paleta, editar site-config.php (los valores
 * --rvx-color-* se sobreescriben desde PHP en setup.php).
 * Las variables adicionales --sebandins-* son permanentes.
 * ─────────────────────────────────────────────────────────────────────────────
 */

:root {

  /* ── Colores de marca (sobreescritos desde setup.php) ── */
  --rvx-color-primary:   #110c1d;   /* Dark purple-black  */
  --rvx-color-secondary: #9cfe00;   /* Lime green CTA     */
  --rvx-color-accent:    #7dcc00;   /* CTA hover          */
  --rvx-color-dark:      #1a1230;   /* Alt dark           */
  --rvx-color-light:     #f7f7f7;   /* Light background   */

  /* ── Colores semánticos fijos ── */
  --rvx-color-white:     #ffffff;
  --rvx-color-muted:     #656565;
  --rvx-color-border:    #ebebeb;
  --rvx-color-surface:   #f7f7f7;
  --rvx-color-success:   #16a34a;
  --rvx-color-warning:   #d97706;
  --rvx-color-error:     #e74c3c;

  /* ── Alias de texto ── */
  --rvx-text-primary:    #000000;
  --rvx-text-secondary:  var(--rvx-color-muted);
  --rvx-text-muted:      #9ca3af;
  --rvx-text-inverse:    var(--rvx-color-white);
  --rvx-text-link:       var(--rvx-color-primary);

  /* ── Variables específicas Sebanda (paleta real del cliente) ── */
  --sebandins-navy:       #110c1d;   /* primary dark       */
  --sebandins-navy-mid:   #1a1230;   /* alt dark           */
  --sebandins-navy-light: #2a1f42;   /* dark lighter       */
  --sebandins-red:        #9cfe00;   /* ⚠ re-aliased → lime CTA */
  --sebandins-red-dark:   #7dcc00;   /* CTA hover          */
  --sebandins-lime:       #9cfe00;   /* nombre semántico   */
  --sebandins-lime-dark:  #7dcc00;
  --sebandins-light-bg:   #f7f7f7;
  --sebandins-header-bg:  #110c1d;
  --sebandins-cta-bg:     #9cfe00;
  --sebandins-cta-text:   #000000;   /* texto sobre botón lime */

  /* ── Tipografía ── */
  --rvx-font-body:    -apple-system, "Segoe UI", system-ui, sans-serif;
  --rvx-font-heading: -apple-system, "Segoe UI", system-ui, sans-serif;

  --rvx-text-xs:   0.75rem;
  --rvx-text-sm:   0.875rem;
  --rvx-text-base: 1rem;
  --rvx-text-md:   1.125rem;
  --rvx-text-lg:   clamp(1.25rem, 2vw, 1.5rem);
  --rvx-text-xl:   clamp(1.5rem, 3vw, 2rem);
  --rvx-text-2xl:  clamp(1.75rem, 3.5vw, 2.5rem);
  --rvx-text-3xl:  clamp(2rem, 4vw, 3rem);
  --rvx-text-4xl:  clamp(2.5rem, 5vw, 3.75rem);
  --rvx-text-5xl:  clamp(3rem, 6vw, 4.5rem);

  --rvx-leading-tight:   1.2;
  --rvx-leading-snug:    1.375;
  --rvx-leading-normal:  1.5;
  --rvx-leading-relaxed: 1.625;
  --rvx-leading-loose:   2;

  --rvx-weight-normal:   400;
  --rvx-weight-medium:   500;
  --rvx-weight-semibold: 600;
  --rvx-weight-bold:     700;
  --rvx-weight-black:    900;

  /* ── Espaciado ── */
  --rvx-space-1:  0.25rem;
  --rvx-space-2:  0.5rem;
  --rvx-space-3:  0.75rem;
  --rvx-space-4:  1rem;
  --rvx-space-5:  1.25rem;
  --rvx-space-6:  1.5rem;
  --rvx-space-8:  2rem;
  --rvx-space-10: 2.5rem;
  --rvx-space-12: 3rem;
  --rvx-space-16: 4rem;
  --rvx-space-20: 5rem;
  --rvx-space-24: 6rem;

  /* ── Secciones fluid ── */
  --rvx-section-sm:  clamp(1.5rem, 3vw, 2.5rem);
  --rvx-section-md:  clamp(2rem, 5vw, 4rem);
  --rvx-section-lg:  clamp(3rem, 7vw, 6rem);

  /* ── Border radius ── */
  --rvx-radius-sm:   4px;
  --rvx-radius-md:   8px;
  --rvx-radius-lg:   12px;
  --rvx-radius-xl:   20px;
  --rvx-radius-2xl:  30px;
  --rvx-radius-pill: 50px;
  --rvx-radius-full: 9999px;

  /* ── Sombras ── */
  --rvx-shadow-sm:  0 1px 2px rgba(0,0,0,.06), 0 1px 3px rgba(0,0,0,.1);
  --rvx-shadow-md:  0 4px 6px rgba(0,0,0,.07), 0 2px 4px rgba(0,0,0,.06);
  --rvx-shadow-lg:  0 10px 15px rgba(0,0,0,.1), 0 4px 6px rgba(0,0,0,.05);
  --rvx-shadow-xl:  0 20px 25px rgba(0,0,0,.1), 0 10px 10px rgba(0,0,0,.04);
  --rvx-shadow-card:0 0 0 1px rgba(0,0,0,.05), var(--rvx-shadow-sm);

  /* ── Transiciones ── */
  --rvx-transition-fast:   150ms ease;
  --rvx-transition-normal: 250ms ease;
  --rvx-transition-slow:   400ms ease;

  /* ── Layout ── */
  --rvx-content-width: 860px;
  --rvx-wide-width:    1200px;
  --rvx-full-width:    100%;
  --rvx-header-height: 80px;

  /* ── Z-index ── */
  --rvx-z-dropdown: 1000;
  --rvx-z-sticky:   1020;
  --rvx-z-fixed:    1030;
  --rvx-z-modal:    1040;
  --rvx-z-tooltip:  1050;
}