/* ═══════════════════════════════════════════════════════════════════════
   BASC — Business Alliance for Secure Commerce · Theming del login
   Generado: 2026-07-23 · Fuente: logo BASC (globo celeste + wordmark navy)
   Paleta extraída: navy #17479D (wordmark/tagline) · celeste #1CA2DC (globo)
   Flavor: cool · Subir en AdminUI → Clients → Edit → Branding → Advanced
   ═══════════════════════════════════════════════════════════════════════ */

:root {

  /* ── PRIMARIO (slot azur) — navy corporativo BASC ── */
  --color-azur-50:  #ECF0F7;
  --color-azur-100: #DAE2EF;
  --color-azur-200: #B5C4E0;
  --color-azur-300: #869FCC;
  --color-azur-400: #4F73B5;
  --color-azur-500: #17479D;
  --color-azur-600: #133A81;
  --color-azur-700: #0F2E66;
  --color-azur-800: #0C244F;
  --color-azur-900: #081A39;

  /* ── ACENTO FRÍO (slot teal) — celeste del globo ── */
  --color-teal-50:  #EDF8FC;
  --color-teal-100: #DBF0F9;
  --color-teal-200: #B6E1F4;
  --color-teal-300: #89CFED;
  --color-teal-400: #52B8E4;
  --color-teal-500: #1CA2DC;
  --color-teal-600: #1785B4;
  --color-teal-700: #12698F;
  --color-teal-800: #0E516E;
  --color-teal-900: #0A3A4F;

  /* ── CÁLIDO (slot amber) — complemento dorado suavizado (logo sin cálidos) ── */
  --color-amber-300: #E3C292;
  --color-amber-500: #C98A2E;

  /* ── CIERRE CÁLIDO (slot magenta) — russet oscuro (glow warm) ── */
  --color-magenta-500: #7A3E24;

  /* ── SUPERFICIES — ink con tinte navy ── */
  --color-ink-950: #061021;
  --color-ink-900: #0A1830;
  --color-ink-850: #0D1F3C;
  --color-ink-800: #112747;

  /* ── BORDES ── */
  --color-line-base: #A8C2E5;

  /* ── TEXTO ── */
  --color-txt:       #EAF1FA;
  --color-txt-dim:   #A4BCD9;
  --color-txt-faint: #6E87A6;

  /* ── GRADIENTES ── */
  /* cool arranca en azur-400 (navy 500 es muy oscuro para texto sobre ink) */
  --brand-grad-cool: linear-gradient(135deg, #4F73B5, #1CA2DC);
  --brand-grad-cool-rich: linear-gradient(135deg, #4F73B5 0%, #3B86C5 40%, #2B94D0 70%, #1CA2DC 100%);
  --brand-grad-warm: linear-gradient(135deg, #C98A2E 0%, #B26F28 32%, #965426 58%, #7A3E24 100%);
  --brand-grad-warm-btn: linear-gradient(135deg, #C98A2E, #965426, #7A3E24);
  --brand-grad-spectrum: linear-gradient(120deg, #1CA2DC 0%, #2B94D0 22%, #17479D 40%, #7A3E24 60%, #965426 78%, #C98A2E 100%);
  --brand-grad-spectrum-text: linear-gradient(120deg, #1CA2DC, #2B94D0, #17479D, #7A3E24, #965426, #C98A2E);
  --brand-grad-check: linear-gradient(135deg, #17479D 0%, #1478A6 60%, #1CA2DC 100%);

  /* ── CTA — navy→cyan oscurecido para blanco AA en todo el recorrido ── */
  --brand-cta-bg: linear-gradient(135deg, #17479D 0%, #1478A6 60%, #12698F 100%);
  --brand-cta-glow: #17479D;

  /* ── PANEL DE MARCA — glow + inks navy via --brand-panel-* (ver abajo) ── */
  --brand-panel-glow: #0E2A5C;
  --brand-orb-br: radial-gradient(circle, rgba(28, 162, 220, 0.35), rgba(23, 71, 157, 0.18) 45%, transparent 70%);
  --brand-orb-tl: radial-gradient(circle, rgba(82, 184, 228, 0.25), transparent 68%);

  /* ── INPUTS — focus en celeste (navy no contrasta sobre ink oscuro) ── */
  --brand-focus-ring: var(--color-teal-500);
  --brand-input-focus-bg: #081428;

  /* ── PANEL EN TEMA LIGHT — mantiene el dark navy BASC ── */
  --brand-panel-ink-950: #061021;
  --brand-panel-ink-900: #0A1830;
  --brand-panel-ink-850: #0D1F3C;
  --brand-panel-ink-800: #112747;
  --brand-panel-txt: #EAF1FA;
  --brand-panel-txt-dim: #A4BCD9;
  --brand-panel-txt-faint: #6E87A6;
  --brand-panel-line-base: #A8C2E5;
}

/* ═══════════════════════════════════════════════════════════════════════
   BASC — TEMA LIGHT (html[data-theme="light"])
   Superficies claras con tinte navy; panel de marca permanece dark.
   ═══════════════════════════════════════════════════════════════════════ */
html[data-theme="light"] {
  --color-ink-950: #eef3fa;   /* fondo de página */
  --color-ink-900: #ffffff;   /* card / formulario */
  --color-ink-850: #f3f7fc;   /* botones SSO */
  --color-ink-800: #e6edf6;   /* hover SSO */
  --color-line-base: #2c4a73;
  --color-txt: #0d1e3d;
  --color-txt-dim: #3e5678;
  --color-txt-faint: #64789b;
  --brand-focus-ring: var(--color-teal-600);
  --brand-input-focus-bg: #ffffff;
  /* CTA navy→cyan-oscuro del dark funciona igual sobre claro; se hereda */

  /* Velo sobre theme:pageBackground — defaults del sistema (light 25%/35%).
     Descomenta para ajustar según la foto que use BASC: */
  /* --page-veil-a: 25%; */
  /* --page-veil-b: 35%; */
}