/* WeClose · Neutral Glass. Shared tokens for the landing and onboarding.
   Based on Manual v3; stronger edge reflections per the supplied glass reference. */
html[data-theme="light"] { color-scheme: light; }
html[data-theme="dark"] { color-scheme: dark; }
:root {
  --radius: 0.5rem; /* 8px */

  /* marca: Signal Orange se MANTIENE */
  --primary: #e85002;
  --primary-2: #ff7a2f;
  --primary-foreground: #ffffff;
  --primary-grad: linear-gradient(135deg, #ff8a3d 0%, #e85002 100%);
  --primary-glow: 0 18px 40px -18px oklch(0.55 0.19 40 / 0.7);

  /* Ice-blue accent: localized light, lead-avatar outlines and industry selection. */
  --luma-ambient-cool: #a8cddf;
  --luma-ambient-cool-rgb: 168, 205, 223;

  /* Motion: curvas con intención (se conservan del sistema anterior). */
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
}

/* ================================ DÍA ================================ */
:root,
[data-theme="light"] {
  --background: oklch(0.945 0 0);
  --foreground: oklch(0.2 0 0);
  --foreground-2: oklch(0.38 0 0);
  --muted-foreground: oklch(0.495 0 0); /* nunca más claro: AA sobre vidrio */
  --border: oklch(0.2 0 0 / 0.12);
  --card: oklch(0.99 0 0);
  --accent: oklch(1 0 0 / 0.6);
  --input: oklch(1 0 0 / 0.55);
  --ring: var(--primary);
  --luma-ambient-cool-halo: 0.16;
  --luma-ambient-cool-edge: 0.24;
  --luma-phone-cool-halo: 0.30;

  /* El lienzo de día necesita relieve REAL o el vidrio claro desaparece sobre
     gris uniforme. */
  --canvas:
    radial-gradient(560px 380px at 4% -12%, oklch(0.74 0.02 60), transparent 62%),
    radial-gradient(520px 340px at 54% 114%, oklch(0.78 0.015 40), transparent 60%),
    radial-gradient(700px 460px at 108% 10%, oklch(1 0 0), transparent 58%),
    radial-gradient(460px 300px at 86% 82%, oklch(0.88 0.09 55 / 0.85), transparent 64%),
    radial-gradient(380px 260px at 24% 62%, oklch(0.98 0 0), transparent 60%),
    linear-gradient(150deg, oklch(0.945 0 0), oklch(0.865 0.005 60));

  --glass-tint: oklch(1 0 0 / 0.24);
  --glass-sheen: linear-gradient(157deg, oklch(1 0 0 / 0.72) 0%, oklch(1 0 0 / 0.04) 42%, oklch(1 0 0 / 0.34) 100%);
  --glass-bd: oklch(1 0 0 / 0.84);
  --glass-blur: blur(22px) saturate(210%);
  --glass-hi:
    inset 0 1px 1px oklch(1 0 0 / 1), inset 1px 0 1px oklch(1 0 0 / 0.8),
    inset 0 0 0 1px oklch(1 0 0 / 0.2), inset 0 -3px 8px oklch(1 0 0 / 0.3);
  --glass-shadow: 0 3px 7px -3px oklch(0.3 0 0 / 0.22), 0 25px 55px -27px oklch(0.3 0 0 / 0.48);
  --glass-shadow-hover: 0 22px 44px -18px oklch(0 0 0 / 0.36);
  --glass-tint-hover: oklch(1 0 0 / 0.55);

  --float-tint: oklch(1 0 0 / 0.5);
  --float-bd: oklch(1 0 0 / 0.7);
  --float-blur: blur(44px) saturate(190%);
  --float-shadow: 0 30px 70px -20px oklch(0 0 0 / 0.32), 0 2px 10px oklch(0 0 0 / 0.07);

  --menu-tint: oklch(0.995 0 0 / 0.97);

  /* Más opaco que en la plataforma (0.45): allí el chrome flota sobre un solo
     tema, pero acá el nav sticky cruza por encima de las islas nocturnas y a
     0.45 se volvía una banda gris con el logo y los links oscuros encima. */
  --chrome-bg: oklch(0.96 0 0 / 0.76);
  --chrome-blur: blur(30px) saturate(190%);

  --scrim: oklch(0.145 0 0 / 0.2);
  --glow: none;

  --ok: oklch(0.62 0.13 155);
  --ok-bg: oklch(0.97 0.03 155);
  --ok-bd: oklch(0.88 0.07 155);
  --ok-foreground: oklch(0.16 0.02 155);
  --danger: oklch(0.55 0.19 25);
  --danger-bg: oklch(0.97 0.03 25);
  --danger-bd: oklch(0.88 0.07 25);
  --danger-foreground: oklch(0.99 0 0);

  --row-hover: oklch(0.2 0 0 / 0.045);
}

/* NOCHE: tema global resuelto según sistema o elección del visitante. */
.dark,
[data-theme="dark"] {
  --background: oklch(0.155 0 0);
  --foreground: oklch(0.97 0 0);
  --foreground-2: oklch(0.78 0 0);
  --muted-foreground: oklch(0.66 0 0);
  --border: oklch(1 0 0 / 0.13);
  --card: oklch(0.205 0 0);
  --accent: oklch(1 0 0 / 0.07);
  --input: oklch(1 0 0 / 0.05);
  --ring: var(--primary);
  --luma-ambient-cool-halo: 0.11;
  --luma-ambient-cool-edge: 0.32;
  --luma-phone-cool-halo: 0.28;

  /* El lienzo de noche necesita POZOS DE LUZ: son las manchas que el vidrio
     refracta y lo que hace que una placa se lea como material. */
  --canvas:
    radial-gradient(600px 520px at 3% 8%, oklch(0.42 0 0 / 0.65), transparent 62%),
    radial-gradient(580px 420px at 58% 105%, oklch(0.31 0 0), transparent 60%),
    radial-gradient(760px 520px at 104% 2%, oklch(0.1 0 0), transparent 58%),
    radial-gradient(500px 420px at 92% 72%, oklch(0.42 0.065 55 / 0.55), transparent 64%),
    radial-gradient(450px 350px at 27% 58%, oklch(0.34 0 0 / 0.75), transparent 62%),
    oklch(0.155 0 0);

  --glass-tint: oklch(1 0 0 / 0.04);
  --glass-sheen: linear-gradient(157deg, oklch(1 0 0 / 0.19) 0%, oklch(1 0 0 / 0.025) 43%, oklch(1 0 0 / 0.045) 70%, oklch(1 0 0 / 0.13) 100%);
  --glass-bd: oklch(1 0 0 / 0.22);
  --glass-blur: blur(26px) saturate(160%);
  --glass-hi:
    inset 0 1px 1px oklch(1 0 0 / 0.5), inset 1px 0 1px oklch(1 0 0 / 0.2),
    inset 0 0 0 1px oklch(1 0 0 / 0.055), inset 0 -2px 7px oklch(1 0 0 / 0.08);
  --glass-shadow: 0 6px 12px -6px oklch(0 0 0 / 0.65), 0 28px 60px -26px oklch(0 0 0 / 0.9);
  --glass-shadow-hover: 0 22px 44px -18px oklch(0 0 0 / 0.95);
  --glass-tint-hover: oklch(1 0 0 / 0.115);

  --float-tint: oklch(0.28 0.004 250 / 0.82);
  --float-bd: oklch(1 0 0 / 0.2);
  --float-blur: blur(44px) saturate(170%);
  --float-shadow: 0 30px 70px -18px oklch(0 0 0 / 0.85);

  --menu-tint: oklch(0.225 0.004 250 / 0.98);

  --chrome-bg: oklch(0.22 0 0 / 0.76);
  --chrome-blur: blur(30px) saturate(160%);

  --scrim: oklch(0 0 0 / 0.45);

  /* El isotipo se enciende como LED SOLO en noche. */
  --glow: drop-shadow(0 0 3px currentColor) drop-shadow(0 0 8px color-mix(in oklab, currentColor 55%, transparent));

  --ok: oklch(0.75 0.15 155);
  --ok-bg: oklch(0.28 0.05 155);
  --ok-bd: oklch(0.4 0.08 155);
  --ok-foreground: oklch(0.16 0.02 155);
  --danger: oklch(0.7 0.17 25);
  --danger-bg: oklch(0.28 0.06 25);
  --danger-bd: oklch(0.4 0.09 25);
  --danger-foreground: oklch(0.16 0.02 25);

  --row-hover: oklch(1 0 0 / 0.05);
}

/* ============== remapeo de los tokens antiguos (no tocar markup) ============== */
:root,
.dark,
[data-theme="light"],
[data-theme="dark"] {
  --ink: var(--foreground);
  --ink-60: var(--foreground-2);
  --ink-45: var(--muted-foreground);
  --ink-30: var(--border);
  --s-bg: var(--background);
  --s0: var(--card);
  --s1: var(--card);
  --s2: var(--accent);
  --s3: var(--card);
  --s4: var(--border);
  --fire: var(--primary);
  --fire-hover: var(--primary-2);
  /* Signal Orange como TEXTO necesita ir más oscuro que como relleno: #E85002
     sobre el lienzo claro da 3.2:1 y no pasa AA en tamaños de lectura. Se usa
     para frases y cifras naranjas; los rellenos siguen en --primary. */
  --fire-text: #b8400a;
  --cool: var(--muted-foreground);
  --warm: var(--primary-2);
  --border-subtle: var(--border);
  --border-default: var(--border);
  --module-bg: var(--card);
  --module-border: var(--border);
  --grid-dot: transparent; /* la micro-grilla desaparece */
}

/* En las islas nocturnas el naranjo de texto va al revés: hay que ACLARARLO.
   Va después del remapeo o el valor de día le ganaría por orden. */
.dark,
[data-theme="dark"] {
  --fire-text: var(--primary-2);
}