/* ================================================================
   KAPITALIZANDO FINANZAS 360 — Tokens de diseño (kit de marca oficial)
   Paleta: negro tinta #1B1E23 · dorado #B08D33 · blanco · gris #565C66
   ================================================================ */
:root{
  /* Marca */
  --kap-ink:        #1B1E23;
  --kap-gold:       #B08D33;
  --kap-gold-light: #D4AF5A;
  --kap-gold-deep:  #8A6B22;
  --kap-orange:     #E8A33D; /* degradado de barras del logo */
  --kap-gray:       #565C66;
  --kap-white:      #FFFFFF;

  /* Semánticos */
  --ok:     #2E9E6B;
  --warn:   #D98E1F;
  --danger: #C94F3D;
  --info:   #3D7BC9;

  /* Superficies (tema claro por defecto) */
  --bg:            #F2F3F5;
  --bg-grad:       radial-gradient(1200px 600px at 85% -10%, rgba(176,141,51,.10), transparent 60%),
                   radial-gradient(900px 500px at -10% 110%, rgba(27,30,35,.06), transparent 55%);
  --surface:       #FFFFFF;
  --surface-2:     #F7F8FA;
  --surface-ink:   #1B1E23;
  --border:        #E4E6EA;
  --text:          #1B1E23;
  --text-2:        #565C66;
  --text-3:        #8B919B;
  --shadow:        0 1px 2px rgba(27,30,35,.05), 0 8px 24px rgba(27,30,35,.07);
  --shadow-lift:   0 4px 12px rgba(27,30,35,.10), 0 16px 40px rgba(27,30,35,.14);

  /* Degradados de marca */
  --grad-gold:  linear-gradient(135deg, #D4AF5A 0%, #B08D33 45%, #8A6B22 100%);
  --grad-fire:  linear-gradient(135deg, #F5C842 0%, #E8A33D 50%, #C97B2D 100%);
  --grad-ink:   linear-gradient(150deg, #262B33 0%, #1B1E23 55%, #14161A 100%);
  --grad-hero:  linear-gradient(135deg, #1B1E23 0%, #23272E 55%, #3A3323 100%);

  /* Métricas */
  --radius:    16px;
  --radius-sm: 10px;
  --sidebar-w: 248px;
  --topbar-h:  66px;
  --font: 'Inter', -apple-system, 'Segoe UI', Roboto, sans-serif;

  /* Transiciones */
  --t-fast: .18s cubic-bezier(.4,0,.2,1);
  --t-med:  .32s cubic-bezier(.4,0,.2,1);
}

/* Tema oscuro (Configuración → Apariencia) */
body[data-theme="dark"]{
  --bg:          #101216;
  --bg-grad:     radial-gradient(1200px 600px at 85% -10%, rgba(176,141,51,.14), transparent 60%),
                 radial-gradient(900px 500px at -10% 110%, rgba(0,0,0,.4), transparent 55%);
  --surface:     #1B1E23;
  --surface-2:   #22262D;
  --border:      #2E333B;
  --text:        #F2F3F5;
  --text-2:      #A8AEB8;
  --text-3:      #6E7580;
  --shadow:      0 1px 2px rgba(0,0,0,.3), 0 8px 24px rgba(0,0,0,.35);
  --shadow-lift: 0 4px 12px rgba(0,0,0,.4), 0 16px 40px rgba(0,0,0,.5);
}
body[data-theme="dark"] .kap-topbar{ background:#1B1E23; }
body[data-theme="dark"] .kap-brand h1{ color:#F2F3F5; }