/* ============================================================
   Ketofia — Color tokens
   Source: Manual de Marca (Estudio BAM, 2024)
   Brand palette (exact from manual p.05):
     #009B71  Pantone 3278 C   — verde primario
     #004F47  Pantone P132-16C — verde profundo
     #DAE5D5  Pantone 566 C    — sage / verde pálido
     #FF8812  Pantone 1505 C   — naranja (acentos / promos)
   ============================================================ */
:root {
  /* ---- Primary green scale ---- */
  --green-900: #00352F;
  --green-800: #004F47; /* verde profundo (brand) */
  --green-700: #00795A;
  --green-600: #009B71; /* VERDE PRIMARIO (brand) */
  --green-500: #1AAF83;
  --green-400: #54C5A1;
  --green-300: #8FD9C0;
  --green-200: #C2EADD;
  --green-100: #E1F3EC;
  --green-50:  #F0F9F5;

  /* ---- Sage scale (verde pálido / fondos suaves) ---- */
  --sage-300: #C3D6BC;
  --sage-200: #DAE5D5; /* sage (brand) */
  --sage-100: #E8F0E4;
  --sage-50:  #F3F7F1;

  /* ---- Orange / accent (acentos, promos, “sin azúcar”) ---- */
  --orange-600: #E5760A;
  --orange-500: #FF8812; /* naranja (brand) */
  --orange-400: #FFA445;
  --orange-200: #FFD7AE;
  --orange-100: #FFE8CF;
  --orange-50:  #FFF4E8;

  /* ---- Warm neutrals (green-tinted) ---- */
  --ink-900: #14221E;
  --ink-800: #243A33;
  --ink-700: #3D4D47;
  --ink-500: #6B7B74;
  --ink-400: #93A19A;
  --ink-300: #C2CCC7;
  --ink-200: #E2E8E4;
  --ink-100: #EFF2EF;
  --paper:   #FBFCF9; /* fondo app (off-white cálido) */
  --white:   #FFFFFF;
}

/* ============================================================
   Semantic aliases — use THESE in product UI, not raw scales.
   ============================================================ */
:root {
  /* surfaces */
  --color-bg:            var(--paper);
  --color-surface:       var(--white);
  --color-surface-sunken:var(--sage-50);
  --color-surface-brand: var(--green-600);
  --color-surface-deep:  var(--green-800);
  --color-surface-sage:  var(--sage-200);

  /* text */
  --text-primary:    var(--green-800);
  --text-secondary:  var(--ink-500);
  --text-muted:      var(--ink-400);
  --text-on-brand:   var(--white);
  --text-on-deep:    var(--sage-100);
  --text-price:      var(--green-800);

  /* brand actions */
  --brand:           var(--green-600);
  --brand-hover:     var(--green-700);
  --brand-press:     var(--green-800);
  --brand-soft:      var(--green-100);
  --on-brand:        var(--white);

  /* accent / promotional */
  --accent:          var(--orange-500);
  --accent-hover:    var(--orange-600);
  --accent-soft:     var(--orange-100);
  --on-accent:       var(--white);

  /* lines & borders */
  --border:          var(--ink-200);
  --border-strong:   var(--ink-300);
  --border-brand:    var(--green-300);

  /* status */
  --success:         var(--green-600);
  --success-soft:    var(--green-100);
  --promo:           var(--orange-500);
  --promo-soft:      var(--orange-100);
  --danger:          #D64545;
  --danger-soft:     #FBE7E7;

  /* focus ring */
  --ring: 0 0 0 3px color-mix(in srgb, var(--green-600) 35%, transparent);
}