/* ==========================================================================
   SENKU — Tokens de Diseño e Identidad Visual (v1.0)
   ========================================================================== */

/* 1. Tipografías locales (Offline PWA) con respaldo Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;600;700;800&family=Figtree:wght@400;500;600;700&display=swap');

@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/static/fonts/outfit-latin-400-normal.woff2') format('woff2');
}

@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/static/fonts/outfit-latin-600-normal.woff2') format('woff2');
}

@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/static/fonts/outfit-latin-700-normal.woff2') format('woff2');
}

@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/static/fonts/outfit-latin-800-normal.woff2') format('woff2');
}

@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/static/fonts/figtree-latin-400-normal.woff2') format('woff2');
}

@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/static/fonts/figtree-latin-500-normal.woff2') format('woff2');
}

@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/static/fonts/figtree-latin-600-normal.woff2') format('woff2');
}

@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/static/fonts/figtree-latin-700-normal.woff2') format('woff2');
}

/* 2. Variables Globales y Tokens del Manual de Marca Senku */
:root {
  /* --- Colores Primarios Senku --- */
  --senku-lima:    #8FCB55; /* RGB 143 203 85  · CMYK 30 0 58 20 (Acento, hitos) */
  --senku-brote:   #5BAE84; /* RGB 91 174 132  · CMYK 48 0 24 32 (Transición, estados activos) */
  --senku-bosque:  #2E5A55; /* RGB 46 90 85    · CMYK 49 0 6 65  (Primario corporativo) */
  --senku-pizarra: #22303F; /* RGB 34 48 63    · CMYK 46 24 0 75 (Estructura, sidebar, textos) */

  /* --- Neutros Senku --- */
  --senku-niebla:      #F2F5F3; /* Fondo de interfaz / app */
  --senku-brote-claro: #EEF6EA; /* Fondos de acento suave, selección */
  --senku-gris-texto:  #5B6770; /* Texto secundario y muted */
  --senku-blanco:      #FFFFFF; /* Superficies de tarjetas y paneles */

  /* --- Funcionales Senku --- */
  --senku-exito:  #3F8A5E;
  --senku-alerta: #D99A1E;
  --senku-error:  #C8453B;
  --senku-info:   #2F6FB5;

  /* --- Degradados de Marca --- */
  --senku-degradado:            linear-gradient(180deg, #8FCB55 0%, #5BAE84 50%, #2E5A55 100%);
  --senku-degradado-horizontal: linear-gradient(90deg, #8FCB55 0%, #5BAE84 50%, #2E5A55 100%);
  --senku-degradado-suave:      linear-gradient(135deg, #EEF6EA 0%, #F2F5F3 100%);

  /* --- Tipografías Institucionales --- */
  --senku-font-titulos: 'Outfit', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --senku-font-texto:   'Figtree', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* --- Mapeo de Variables del Sistema de Aplicación --- */
  --color-primario:       var(--senku-bosque);
  --color-primario-hover: #234642;
  --color-primario-rgb:   46, 90, 85;
  --color-secundario:     var(--senku-brote);
  --color-secundario-hover: #4c9b74;
  --color-acento:         var(--senku-lima);
  --color-acento-hover:   #7db844;
  --color-pizarra:        var(--senku-pizarra);
  --color-exito:          var(--senku-exito);
  --color-advertencia:    var(--senku-alerta);
  --color-error:          var(--senku-error);
  --color-info:           var(--senku-info);

  --color-fondo:          var(--senku-niebla);
  --color-superficie:     var(--senku-blanco);
  --color-borde:          #E2E8E5;
  --color-borde-fuerte:   #CBD5CF;
  --color-texto:          var(--senku-pizarra);
  --color-texto-muted:    var(--senku-gris-texto);

  /* --- Tokens de Navegación Lateral (Sidebar en Pizarra) --- */
  --sidebar-ancho:        260px;
  --sidebar-fondo:        var(--senku-pizarra);
  --sidebar-texto:        #C4D1DB;
  --sidebar-hover:        rgba(255, 255, 255, 0.08);
  --sidebar-activo:       rgba(91, 174, 132, 0.18);
  --sidebar-activo-borde: var(--senku-lima);

  /* --- Bordes y Radios --- */
  --radio-sm:   6px;
  --radio-md:   10px;
  --radio-lg:   16px;
  --radio-full: 9999px;

  /* --- Sombras --- */
  --sombra-sm: 0 1px 3px rgba(34, 48, 63, 0.06);
  --sombra-md: 0 4px 12px rgba(34, 48, 63, 0.08);
  --sombra-lg: 0 12px 28px rgba(34, 48, 63, 0.12);

  /* --- Espaciados --- */
  --espacio-xs: 4px;
  --espacio-sm: 8px;
  --espacio-md: 16px;
  --espacio-lg: 24px;
  --espacio-xl: 32px;

  /* --- Sobrescritura de Variables Bootstrap 5 --- */
  --bs-primary:          #2E5A55;
  --bs-primary-rgb:      46, 90, 85;
  --bs-secondary:        #5BAE84;
  --bs-secondary-rgb:    91, 174, 132;
  --bs-success:          #3F8A5E;
  --bs-success-rgb:      63, 138, 94;
  --bs-warning:          #D99A1E;
  --bs-warning-rgb:      217, 154, 30;
  --bs-danger:           #C8453B;
  --bs-danger-rgb:       200, 69, 59;
  --bs-info:             #2F6FB5;
  --bs-info-rgb:         47, 111, 181;
  --bs-dark:             #22303F;
  --bs-dark-rgb:         34, 48, 63;
  --bs-body-font-family: var(--senku-font-texto);
  --bs-body-color:       var(--color-texto);
  --bs-body-bg:          var(--color-fondo);
  --bs-link-color:       var(--color-primario);
  --bs-link-hover-color: var(--color-primario-hover);
}
