/* Prosumia — color.

   MARCA (manual de marca 2026): tres colores × cuatro tonos, transcriptos del
   manual. Los nombres de token siguen la escala del sistema:

     Rojo      700 #B40000 · 500 #E9121C · 400 #F7444C · 300 #FD787D
     Amarillo  600 #E99000 · 500 #FAAA00 · 400 #FCB941 · 300 #FFC968
     Verde     700 #008233 · 500 #0EA75D · 400 #45C678 · 300 #85D09C

   Todo lo demás es la rampa neutra. Sólo hay DOS colores derivados fuera del
   manual, y están marcados como tales: --prsm-yellow-800 (ningún amarillo del
   manual es legible como texto) y --prsm-yellow-50 (el único tinte, que ya venía
   del archivo de Figma). El resto de los estados y de la paleta de datos se
   construyen con los doce tonos de arriba. */
:root{
  /* ---- Brand: Amarillo (primary action) ---- */
  --prsm-yellow-50:rgb(255,247,230);
  --prsm-yellow-300:rgb(255,201,104);
  --prsm-yellow-400:rgb(252,185,65);
  --prsm-yellow-500:rgb(250,170,0);
  --prsm-yellow-600:rgb(233,144,0);
  /* DERIVADO, fuera del manual: ningún amarillo del manual es legible como
     texto (el más oscuro, el 600, da 2,60:1). Éste es el único amarillo de
     TEXTO del sistema. Si marca define un amarillo oscuro oficial, reemplazarlo. */
  --prsm-yellow-800:rgb(138,90,0);  /* 5,90:1 blanco · 5,36:1 sunken */
  /* Logo/sticker yellow — 1px off the UI 500, keep separate rather than snap */
  --prsm-yellow-logo:rgb(250,171,0);

  /* ---- Brand: Rojo (identity, section badges, destructive) ---- */
  --prsm-red-300:rgb(253,120,125);
  --prsm-red-400:rgb(247,68,76);
  --prsm-red-500:rgb(233,18,28);
  /* Rojo 700: el 500 como TEXTO falla sobre sunken (4,22:1). El 700 pasa en las
     dos superficies, así que es el rojo de TEXTO, delta negativo y mensaje de
     error — el 500 queda para bordes y para el hover destructivo. */
  --prsm-red-700:rgb(180,0,0);      /* 7,18:1 blanco · 6,55:1 sunken */

  /* ---- Brand: Verde (positive / confirmations, logo mark) ---- */
  --prsm-green-300:rgb(133,208,156);
  --prsm-green-400:rgb(69,198,120);
  --prsm-green-500:rgb(14,167,93);
  /* Verde 700: el 500 con texto encima da 3,52:1 (sólo texto grande).
     Este es el verde para plenos con texto y para texto verde. */
  --prsm-green-700:rgb(0,130,51);   /* 4,95:1 con blanco · 4,50:1 como texto sobre sunken */

  /* ---- Neutral ramp ---- */
  --prsm-white:rgb(255,255,255);
  --prsm-grey-50:rgb(245,245,245);
  --prsm-grey-75:rgb(246,246,246);
  --prsm-grey-100:rgb(228,228,228);
  --prsm-grey-125:rgb(235,235,235);
  --prsm-grey-150:rgb(217,217,217);
  --prsm-grey-175:rgb(212,212,212);
  --prsm-grey-200:rgb(201,201,201);
  --prsm-grey-250:rgb(196,196,196);
  --prsm-grey-300:rgb(174,174,174);
  --prsm-grey-350:rgb(160,160,160);
  --prsm-grey-400:rgb(147,147,147);
  --prsm-grey-450:rgb(153,153,153);
  --prsm-grey-500:rgb(116,116,116);
  /* Grises de texto agregados en la consolidación v1.2 (auditoría prsm.army/KARMA):
     la rampa original sólo tenía UN gris que pasa AA sobre --prsm-surface-sunken.
     550/570 dan la escalera de tres niveles legibles que pide un panel denso. */
  --prsm-grey-550:rgb(92,92,92);   /* 6,94:1 blanco · 6,04:1 sunken */
  --prsm-grey-570:rgb(110,110,110);/* 5,30:1 blanco · 4,64:1 sunken */
  --prsm-grey-600:rgb(102,102,102);
  --prsm-grey-800:rgb(60,60,60);
  --prsm-grey-850:rgb(33,33,33);
  --prsm-black:rgb(0,0,0);

  /* ---- Semantic: surface ---- */
  --prsm-surface-page:var(--prsm-grey-50);
  --prsm-surface-card:var(--prsm-white);
  --prsm-surface-sunken:var(--prsm-grey-50);
  --prsm-surface-muted:var(--prsm-grey-100);
  --prsm-surface-primary:var(--prsm-yellow-500);
  --prsm-surface-primary-hover:var(--prsm-yellow-400);
  --prsm-surface-primary-pressed:var(--prsm-yellow-600);
  --prsm-surface-primary-light:var(--prsm-yellow-50);
  --prsm-surface-secondary:var(--prsm-red-400);
  --prsm-surface-black:var(--prsm-grey-800);
  --prsm-surface-black-hover:var(--prsm-grey-850);
  --prsm-surface-disabled:var(--prsm-grey-50);

  /* ---- Semantic: border ---- */
  --prsm-border-subtle:var(--prsm-grey-100);
  --prsm-border-default:var(--prsm-grey-200);
  --prsm-border-field:var(--prsm-grey-175);
  --prsm-border-strong:var(--prsm-grey-800);
  --prsm-border-focus:var(--prsm-yellow-500);
  --prsm-border-error:var(--prsm-red-500);
  --prsm-border-disabled:var(--prsm-grey-200);

  /* ---- Semantic: text ---- */
  --prsm-text-primary:var(--prsm-grey-800);
  --prsm-text-secondary:var(--prsm-grey-550);
  --prsm-text-tertiary:var(--prsm-grey-570);
  /* CORRECCIÓN v1.2: text-supporting apuntaba a grey-400 (#939393), 3,07:1 sobre
     blanco — sólo texto grande. Ahora es el tercer nivel legible. El gris claro
     queda disponible como --prsm-grey-400 para íconos y trazos, no para texto. */
  --prsm-text-supporting:var(--prsm-grey-570);
  --prsm-text-placeholder:var(--prsm-grey-350);
  --prsm-text-disabled:var(--prsm-grey-300);
  --prsm-text-on-action:var(--prsm-white);
  /* DECISIÓN DE MARCA (v1.2.1, explícita y deliberada): la tinta sobre amarillo
     es BLANCA. El par blanco/#FAAA00 da 1,94:1 y no cumple WCAG AA — se acepta
     el incumplimiento porque el botón amarillo con texto blanco es un código de
     marca de Prosumia y la coherencia de identidad pesa más acá.
     Alternativa medida, por si alguna vez se revierte: --prsm-grey-800 da 5,68:1.
     NO reemplazar por gris sin decisión de marca. */
  --prsm-text-on-primary:var(--prsm-white);
  /* v1.4 — ÚNICO caso de tinta oscura sobre amarillo: tags o palabras sueltas
     muy chicas (≤12px) dentro de una pastilla amarilla no interactiva. Opt-in,
     nunca por defecto. Portadas, textos largos, botones y destacados: blanco. */
  --prsm-text-on-primary-tag:var(--prsm-grey-800);
  /* CORRECCIÓN v1.2: el link va en tinta primaria con subrayado amarillo de 2px.
     El amarillo como color de letra no pasa AA en ningún paso. */
  --prsm-text-link:var(--prsm-text-primary);
  --prsm-text-link-underline:var(--prsm-yellow-500);
  --prsm-text-link-underline-hover:var(--prsm-yellow-600);
  --prsm-text-error:var(--prsm-red-700);
  --prsm-text-accent:var(--prsm-red-400);

  /* ---- Semantic: icon ---- */
  --prsm-icon-default:var(--prsm-grey-800);
  --prsm-icon-muted:var(--prsm-grey-400);
  --prsm-icon-on-action:var(--prsm-white);
  --prsm-icon-disabled:var(--prsm-grey-300);

}
a{color:var(--prsm-text-link);text-decoration:underline;text-decoration-color:var(--prsm-text-link-underline);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{color:var(--prsm-text-link);text-decoration-color:var(--prsm-text-link-underline-hover)}
a:focus-visible{outline:none;box-shadow:var(--prsm-focus-ring);border-radius:var(--prsm-radius-sm)}