// =========================================================
// EdC Tokens — adaptados de kontuan (acento morado)
// =========================================================

// Acento (CSS vars, ver _theme.scss) — un juego puede sobreescribirlas
$accent-100: var(--accent-100);
$accent-200: var(--accent-200);
$accent-300: var(--accent-300);
$accent-400: var(--accent-400);
$accent-500: var(--accent-500);
$accent-600: var(--accent-600);
$accent-700: var(--accent-700);

// Semánticos
$info: #6c8cff;
$success: #4ade80;
$warning: #fbbf24;
$danger: #ff6b6b;

// Neutros (CSS vars, themed)
$bg: var(--bg);
$surface: var(--surface);
$surface-2: var(--surface-2);
$surface-3: var(--surface-3);
$text-1: var(--text-1);
$text-2: var(--text-2);
$text-3: var(--text-3);
$border: var(--border);
$border-strong: var(--border-strong);

// Tipografía
$k-font-sans: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
$k-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
$k-fw-regular: 400;
$k-fw-medium: 500;
$k-fw-semibold: 600;
$k-fw-bold: 700;
$k-lh-tight: 1.15;
$k-lh-ui: 1.35;
$k-lh-body: 1.55;
$fs-11: 11px; $fs-12: 12px; $fs-13: 13px; $fs-14: 14px; $fs-16: 16px; $fs-18: 18px; $fs-20: 20px; $fs-24: 24px; $fs-28: 28px; $fs-32: 32px; $fs-36: 36px; $fs-40: 40px;

// Espaciado (px, como kontuan)
$space-0: 0;
$space-1: 4px;
$space-2: 8px;
$space-3: 12px;
$space-4: 16px;
$space-5: 20px;
$space-6: 24px;
$space-7: 28px;
$space-8: 32px;

// Radios
$radius-sm: 6px;
$radius-md: 10px;
$radius-lg: 14px;
$radius-xl: 18px;
$radius-pill: 999px;

// Estados UI (hover, etc.)
$ui-hover-bg: $surface-2;
$ui-hover-bg-strong: $surface-3;

// Tracking (letter-spacing)
$k-track-wide: 0.02em;

// Layout (igual que kontuan)
$layout-sidebar-width: 280px;
$layout-content-max: 1400px;
$layout-page-padding: 24px;

// Iconos (Lucide)
$icon-stroke: 1.75;

// Breakpoints (mobile-first, min-width)
$bp-xs: 360px;
$bp-sm: 480px;
$bp-md: 768px;
$bp-lg: 1024px;
$bp-xl: 1280px;

// ---------------------------------------------------------
// Alias de compatibilidad (nombres antiguos -> tokens kontuan)
// para no reescribir cada propiedad de los componentes ya hechos.
// ---------------------------------------------------------
$color-bg: $bg;
$color-surface: $surface;
$color-border: $border;
$color-text: $text-1;
$color-text-muted: $text-2;
$color-accent: $accent-500;
$color-accent-dark: $accent-600;
$font-sans: $k-font-sans;

// Sombras (CSS vars)
$shadow-sm: var(--shadow-sm);
$shadow-md: var(--shadow-md);
$shadow-lg: var(--shadow-lg);

// Formularios (elementos estilo kontuan)
$focus-ring: 0 0 0 3px color-mix(in srgb, #{$accent-500} 25%, transparent);
$disabled-opacity: 0.45;
$input-height: 36px;
$input-padding-x: 10px;
$input-padding-y: 8px;
$input-radius: $radius-md;
$input-bg: $surface-2;
$input-text: $text-1;
$input-placeholder: $text-3;
$input-border: $border;
$input-border-hover: $border-strong;
$input-border-focus: $accent-500;
$input-focus-ring: $focus-ring;

// Separación entre los ELEMENTOS de un bloque del CRM (título, subtítulo,
// texto, botón…): un único token para todos los huecos interiores de los
// bloques (antes cada zona llevaba el suyo: 20/16/12px).
$block-gap: $space-6; // 24px

// ---------------------------------------------------------
// Texto que CONTRASTA con un fondo arbitrario (el acento elegido en
// Ajustes, el color de una acción…): el navegador resuelve claro u oscuro
// según la luminosidad REAL del fondo (relative color syntax): blanco puro
// bajo L≈49.44 y negro puro por encima — el umbral donde el contraste real
// cambia de bando. La primera declaración es el FALLBACK (texto oscuro)
// para navegadores sin `lch(from …)`.
// ---------------------------------------------------------
@mixin contrast-text($bg) {
  color: #111827;
  color: lch(from #{$bg} calc((49.44 - l) * infinity) 0 0);
}