/* ===========================================================================
   PRITI OS — DESIGN LOCK
   Tokens de "Priti OS — Dirección A final" (§2 del handoff de implementación).

   Este archivo se carga DESPUÉS de /ds/tokens/*.css y reasigna sus variables.
   Ese orden es deliberado: el design system del catálogo comercial (fucsia
   #F1408C, crema #FBF3EC, tinta #1C1216) sigue existiendo para las piezas de
   Instagram y WhatsApp, pero dentro del panel manda Dirección A. Reasignar los
   tokens en un solo punto convierte toda la aplicación —incluidas las pantallas
   que no se reescribieron— a la paleta correcta sin tocar sus componentes.

   Regla de color de §2.1, respetada aquí:
     · el rosa es acción, acento y severidad media; nunca fondo decorativo amplio
     · la lima es marca y señal positiva; nunca color de acción
     · Crítico (#C0304F, vinoso) y Atención (#E0479A, rosa) no se unifican
   =========================================================================== */

:root {
  /* ── Rampa rosa: acción y acento ─────────────────────────────────────── */
  --priti-pink-50: #fdf4f8;
  --priti-pink-100: #fbeaf2;
  --priti-pink-200: #f5d7e5;
  --priti-pink-300: #f0a9cc;
  --priti-pink-400: #e96fb0;
  --priti-pink-500: #e0479a;
  --priti-pink-600: #e0479a;
  --priti-pink-700: #a82a6e;
  --priti-pink-800: #8a1f58;

  /* ── Rampa lima: marca y positivo ────────────────────────────────────── */
  --priti-lime-100: #f2f7df;
  --priti-lime-200: #e4efba;
  --priti-lime-300: #d3e585;
  --priti-lime-400: #c3de4b;
  --priti-lime-500: #a8c233;
  --priti-lime-600: #869b24;
  --priti-lime-700: #5e6b22;

  /* ── Tintas cálidas ──────────────────────────────────────────────────── */
  --priti-ink-900: #2a2126;
  --priti-ink-700: #6b5d64;
  --priti-ink-500: #8b7c85;
  --priti-ink-400: #a99ba3;
  --priti-ink-300: #b9abb2;
  --priti-ink-200: #eae1dc;

  /* ── Superficies ─────────────────────────────────────────────────────── */
  --priti-paper: #ffffff;
  --priti-white: #ffffff;
  --priti-cream: #fbf6f1;
  --priti-nude: #f7ede4;
  --priti-nude-deep: #f5ede6;

  /* Nombres propios de Priti OS, para no escribir hex sueltos en cada pantalla */
  --os-lienzo: #fbf6f1;
  --os-superficie: #ffffff;
  --os-nav: #fffdfb;
  --os-crema: #f5ede6;
  --os-crema-calida: #f7ede4;
  --os-linea: rgba(42, 33, 38, .09);
  --os-linea-suave: rgba(42, 33, 38, .06);
  --os-linea-fuerte: rgba(42, 33, 38, .14);
  --os-linea-discontinua: rgba(42, 33, 38, .18);

  --os-rosa: #e0479a;
  --os-rosa-profundo: #a82a6e;
  --os-rosa-suave: #fbeaf2;
  --os-rosa-suave-fuerte: #f5d7e5;
  --os-rosa-borde: rgba(224, 71, 154, .45);

  --os-critico: #c0304f;
  --os-critico-chip: rgba(192, 48, 79, .09);
  --os-atencion: #e0479a;
  --os-atencion-chip: rgba(224, 71, 154, .10);
  --os-aviso: #a99ba3;

  --os-lima: #c3de4b;
  --os-lima-punto: #a8c233;
  --os-lima-fondo: #f2f7df;
  --os-lima-texto: #5e6b22;
  --os-lima-borde: rgba(168, 194, 51, .45);

  --os-tinta: #2a2126;
  --os-tinta-media: #6b5d64;
  --os-tinta-suave: #8b7c85;
  --os-tinta-tenue: #a99ba3;
  --os-tinta-versalita: #b9abb2;

  /* ── Semántica heredada del design system, reapuntada ────────────────── */
  --text-strong: var(--os-tinta);
  --text-body: var(--os-tinta-media);
  --text-muted: var(--os-tinta-suave);
  --text-faint: var(--os-tinta-tenue);
  --text-muted-on-pastel: var(--os-tinta-media);
  --decor-faint: var(--os-tinta-tenue);
  --text-brand: var(--os-rosa-profundo);
  --text-brand-deep: var(--os-rosa-profundo);
  --text-on-pink: var(--os-rosa-profundo);
  --text-on-accent: #ffffff;
  --text-on-lime: var(--os-tinta);
  --text-on-ink: var(--os-lienzo);
  /* Las cifras del artifact van en tinta, no en rosa: el rosa es acción. */
  --text-price: var(--os-tinta);

  --surface-page: var(--os-lienzo);
  --surface-card: var(--os-superficie);
  --surface-sunken: var(--os-lienzo);
  --surface-blush: var(--os-rosa-suave);
  --surface-blush-strong: var(--os-rosa-suave-fuerte);
  --surface-brand: var(--os-rosa-suave-fuerte);
  --surface-pink: var(--os-rosa);
  --surface-pink-deep: var(--os-rosa-profundo);
  --surface-accent: var(--os-rosa);
  --surface-lime: var(--os-lima);
  --surface-lime-soft: var(--os-lima-fondo);
  --surface-cream: var(--os-crema);
  --surface-nude: var(--os-crema-calida);
  --surface-ink: var(--os-tinta);
  --surface-photo: var(--os-crema);

  --border-hairline: var(--os-linea);
  --border-nude: var(--os-linea);
  --border-soft: var(--os-linea);
  --border-pink: var(--os-rosa-borde);
  --border-pink-strong: var(--os-rosa);
  --border-lime: var(--os-lima-borde);
  --border-ink: var(--os-tinta);

  --status-new-bg: var(--os-lima-fondo);
  --status-new-fg: var(--os-lima-texto);
  --status-out-bg: rgba(192, 48, 79, .09);
  --status-out-fg: var(--os-critico);
  --status-restock-bg: var(--os-rosa-suave);
  --status-restock-fg: var(--os-rosa-profundo);
  --status-sale-bg: var(--os-rosa);
  --status-sale-fg: #ffffff;
  --status-last-bg: var(--os-crema-calida);
  --status-last-fg: var(--os-tinta-media);

  --action-primary-bg: var(--os-rosa);
  --action-primary-bg-hover: var(--os-rosa-profundo);
  --action-primary-bg-active: #8a1f58;
  --action-primary-fg: #ffffff;
  --action-accent-bg: var(--os-lima);
  --action-accent-bg-hover: var(--os-lima-punto);
  --action-accent-fg: var(--os-tinta);
  --focus-ring: var(--os-rosa);
  --overlay-scrim: rgba(42, 33, 38, .26);

  /* ── Tipografía ──────────────────────────────────────────────────────────
     Instrument Serif titula y cifra · Poppins es toda la interfaz ·
     el monoespaciado queda para folios, marcas de tiempo y atajos.
     IBM Plex Mono no se puede servir desde este origen (no está en
     public/assets/fonts y la máquina de trabajo no tiene salida a red), así
     que la pila cae en el monoespaciado de interfaz del sistema, que cumple el
     mismo papel: cifras de ancho fijo y color tenue. */
  --font-editorial: "Instrument Serif", Georgia, serif;
  --font-sans: "Poppins", system-ui, -apple-system, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", "Segoe UI Mono",
    "Roboto Mono", Menlo, Consolas, monospace;
  --font-display: var(--font-sans);
  --font-script: var(--font-sans);

  /* ── Radios (§2.4) ───────────────────────────────────────────────────── */
  --radius-xs: 6px;
  --radius-sm: 11px;
  --radius-md: 16px;
  --radius-lg: 20px;
  --radius-xl: 24px;
  --radius-2xl: 28px;
  --radius-pill: 999px;
  --radius-circle: 50%;
  --border-width-hair: 1px;
  --border-width-thick: 1px;
  --border-width-sticker: 3px;

  /* ── Sombras (§2.6): tarjeta, acción dominante, modal, toast. Ninguna más. */
  --shadow-none: none;
  --shadow-xs: 0 1px 2px rgba(42, 33, 38, .04);
  --shadow-sm: 0 1px 3px rgba(42, 33, 38, .05);
  --shadow-card: 0 1px 2px rgba(42, 33, 38, .04);
  --shadow-raised: 0 1px 3px rgba(42, 33, 38, .05);
  --shadow-sticker: none;
  --shadow-pink-glow: 0 2px 10px rgba(224, 71, 154, .28);
  --shadow-lime-glow: none;
  --shadow-modal: 0 30px 70px rgba(42, 33, 38, .26);
  --shadow-toast: 0 12px 34px rgba(42, 33, 38, .3);
  --shadow-inset-top: none;
  --veil-light: rgba(255, 255, 255, .72);
  --veil-pink: rgba(224, 71, 154, .10);
  --veil-ink: rgba(42, 33, 38, .34);
  --scrim-bottom: linear-gradient(to top, rgba(42, 33, 38, .62) 0%, rgba(42, 33, 38, .28) 42%, rgba(42, 33, 38, 0) 78%);
  --scrim-pink: linear-gradient(to top, rgba(168, 42, 110, .60) 0%, rgba(168, 42, 110, 0) 72%);

  /* ── Movimiento (§2.8): entradas de 160–200 ms. Sin rebotes ni parallax. */
  --duration-instant: 90ms;
  --duration-fast: 160ms;
  --duration-base: 200ms;
  --duration-slow: 260ms;
  --duration-lazy: 600ms;
  --ease-out: cubic-bezier(.22, .68, 0, 1);
  --ease-in-out: cubic-bezier(.45, 0, .25, 1);
  --ease-pop: cubic-bezier(.22, .68, 0, 1);
  --press-scale: 1;
  --hover-lift: none;

  /* ── Espaciado (§2.7): escala base 4 ─────────────────────────────────── */
  --gutter-mobile: 16px;
  --gutter-web: 32px;
  --content-max: 1240px;
  --card-gap: 14px;
  --section-gap: 16px;
  --tap-min: 44px;

  --priti-ink-100: #f3ebe6;
  --transition-control: background-color var(--duration-fast) var(--ease-out),
    color var(--duration-fast) var(--ease-out),
    border-color var(--duration-fast) var(--ease-out),
    box-shadow var(--duration-base) var(--ease-out);

  /* ── Zonas seguras del dispositivo ───────────────────────────────────── */
  --priti-safe-header-top: 26px;
  --priti-safe-cta-bottom: 18px;
  --priti-safe-nav-bottom: 22px;
  --priti-safe-sheet-bottom: 26px;
  --tap-min: 44px;
}