/* ============================================================
   TERRANOVUSS · COLOR SYSTEM
   Sources: Brandbook §1.7 (Tonos de Identidad) + live product UIs
   (Peritaje "Control de Caja" · pine · and "33DC Interventoría" · teal).

   PALETTE SCOPE — IMPORTANT:
   • BRAND (mostaza/oliva/gris/negro tenue) is the CANONICAL palette. Use it
     for presentations, publications, marketing and any brand surface.
   • PINE/TEAL surfaces and the DATA-VIZ series are PRODUCT-ONLY (dashboards).
     Do NOT use them in presentations/publications unless explicitly requested.
   ============================================================ */
:root{
  /* --- BRAND PALETTE (Brandbook §1.7) --- */
  --brand-mustard:      #FBC558;   /* Amarillo mostaza · primary accent  r251 g197 b88 */
  --brand-mustard-600:  #EDB13E;   /* pressed / gradient anchor */
  --brand-mustard-700:  #D89A2A;   /* deep accent, on-light text */
  --brand-mustard-200:  #FDE3AA;   /* tint */
  --brand-olive:        #8C9D5D;   /* Verde oliva  r140 g157 b93 */
  --brand-olive-300:    #AEBD84;   /* lighter olive (data viz) */
  --brand-olive-700:    #6B7A46;   /* deep olive */
  --brand-grey:         #D3D3D4;   /* Gris claro  r211 g211 b212 */
  --brand-ink:          #4D4D4D;   /* Negro tenue  r77 g77 b77 */

  /* --- DATA-VIZ PALETTE (as used across product charts) --- */
  --viz-olive:   #A9BC7E;   /* positive · recibido · ejecutado */
  --viz-powder:  #B9CBD8;   /* neutral · programado · inicial */
  --viz-rose:    #D9A29B;   /* negative · préstamos · proyección · sobrecosto */
  --viz-mustard: #FBC558;   /* highlight */
  --viz-teal:    #6FB1B8;   /* secondary series */
  --viz-slate:   #8B94A6;   /* muted series */

  /* --- STEEL / PIZARRA NEUTRALS (light surfaces) --- */
  --steel-50:  #F7F8F8;
  --steel-100: #EEF1F0;
  --steel-200: #DFE3E2;
  --steel-300: #C6CCCB;
  --steel-400: #9BA4A2;
  --steel-500: #6E7876;
  --steel-600: #4E5654;
  --steel-700: #363C3B;
  --steel-800: #232827;
  --steel-900: #141817;

  /* --- PINE INK (Peritaje dark product · deep forest-green) --- */
  --pine-900: #0B1512;
  --pine-850: #0E1A16;
  --pine-800: #12201B;
  --pine-750: #16271F;
  --pine-700: #1C3128;

  /* --- TEAL INK (Interventoría dark product · deep teal-blue) --- */
  --teal-900: #081C22;
  --teal-850: #0A2129;
  --teal-800: #0E2A33;
  --teal-750: #123640;
  --teal-700: #17454F;

  /* --- FIXED SEMANTIC STATE HUES (Kanban / obra) --- */
  --state-done:      #8C9D5D;  /* completado */
  --state-done-fg:   #C7D6A2;
  --state-progress:  #FBC558;  /* en proceso */
  --state-progress-fg:#FCD98C;
  --state-delayed:   #D9736B;  /* retrasado / crítico */
  --state-delayed-fg:#EFA79F;
  --state-info:      #6FB1B8;  /* informativo */
  --state-info-fg:   #A7D3D7;
  --state-neutral:   #8B94A6;  /* sin estado */
  --state-neutral-fg:#B9C0CC;

  /* ============================================================
     SEMANTIC ALIASES — default theme = PINE (primary product)
     Override via .theme-teal / .theme-light scopes below.
     ============================================================ */
  --bg-app:          var(--pine-900);
  --bg-app-grad:     radial-gradient(120% 90% at 80% -10%, #14261e 0%, var(--pine-900) 55%);
  --surface-card:    rgba(255,255,255,0.028);
  --surface-raised:  rgba(255,255,255,0.05);
  --surface-sunken:  rgba(0,0,0,0.22);
  --surface-active:  rgba(251,197,88,0.10);

  --border-subtle:   rgba(180,197,186,0.12);
  --border-strong:   rgba(180,197,186,0.22);
  --border-focus:    var(--brand-mustard);

  --text-primary:    #F4F7F3;
  --text-secondary:  #A7B3AB;
  --text-tertiary:   #71807A;
  --text-inverse:    #12201B;

  --accent:          var(--brand-mustard);
  --accent-hover:    #FCD07A;
  --accent-press:    var(--brand-mustard-600);
  --accent-contrast: #241A05;   /* text on mustard */
  --accent-soft:     rgba(251,197,88,0.14);

  --link:            var(--brand-mustard);
  --link-hover:      #FCD98C;

  --focus-ring:      0 0 0 2px var(--bg-app), 0 0 0 4px var(--brand-mustard);
}

/* ---- TEAL THEME (Interventoría 33DC) ---- */
.theme-teal{
  --bg-app:        var(--teal-900);
  --bg-app-grad:   linear-gradient(155deg, #123640 0%, #0A2129 48%, #081C22 100%);
  --surface-card:  rgba(120,180,195,0.06);
  --surface-raised:rgba(120,180,195,0.10);
  --surface-sunken:rgba(0,0,0,0.22);
  --surface-active:rgba(251,197,88,0.10);
  --border-subtle: rgba(150,195,205,0.16);
  --border-strong: rgba(150,195,205,0.28);
  --text-primary:  #F1F7F8;
  --text-secondary:#9FB4BA;
  --text-tertiary: #6A7F85;
  --text-inverse:  #0E2A33;
}

/* ---- LIGHT THEME (steel / pizarra · optional light dashboards) ---- */
.theme-light{
  --bg-app:        var(--steel-50);
  --bg-app-grad:   var(--steel-50);
  --surface-card:  #FFFFFF;
  --surface-raised:#FFFFFF;
  --surface-sunken:var(--steel-100);
  --surface-active:rgba(251,197,88,0.16);
  --border-subtle: var(--steel-200);
  --border-strong: var(--steel-300);
  --text-primary:  #1B2321;
  --text-secondary:var(--steel-600);
  --text-tertiary: var(--steel-400);
  --text-inverse:  #FFFFFF;
  --accent-contrast:#241A05;
  --focus-ring:    0 0 0 2px #FFFFFF, 0 0 0 4px var(--brand-mustard-700);
}