/* ==========================================================================
   tokens.css: Tokens de diseño propios de la librería UI
   --------------------------------------------------------------------------
   Todas las variables usan el prefijo --lib-.
   Cambia aquí un valor y se propaga a Bootstrap mediante css/theme.css.
   ========================================================================== */

:root {
  /* ------------------------------------------------------------------
     Color primario (azul): escala 50 → 900
     ------------------------------------------------------------------ */
  --lib-primary-50:  #eef4ff;
  --lib-primary-100: #e0ebff;
  --lib-primary-200: #c6d9ff;
  --lib-primary-300: #a3c0ff;
  --lib-primary-400: #7ba1ff;
  --lib-primary-500: #465fff; /* color principal */
  --lib-primary-600: #3a4fe0;
  --lib-primary-700: #2f3fb8;
  --lib-primary-800: #25318e;
  --lib-primary-900: #1c2569;

  /* ------------------------------------------------------------------
     Color secundario (gris azulado)
     ------------------------------------------------------------------ */
  --lib-secondary-50:  #f8fafc;
  --lib-secondary-100: #f1f5f9;
  --lib-secondary-200: #e2e8f0;
  --lib-secondary-300: #cbd5e1;
  --lib-secondary-400: #94a3b8;
  --lib-secondary-500: #64748b;
  --lib-secondary-600: #475569;
  --lib-secondary-700: #334155;
  --lib-secondary-800: #1e293b;
  --lib-secondary-900: #0f172a;

  /* ------------------------------------------------------------------
     Colores semánticos: escala 50 → 900
     ------------------------------------------------------------------ */
  --lib-success-50:  #ecfdf3;
  --lib-success-100: #d1fadf;
  --lib-success-200: #a6f4c5;
  --lib-success-300: #6ce9a6;
  --lib-success-400: #32d583;
  --lib-success-500: #12b76a;
  --lib-success-600: #039855;
  --lib-success-700: #027a48;
  --lib-success-800: #05603a;
  --lib-success-900: #054f31;

  --lib-warning-50:  #fffaeb;
  --lib-warning-100: #fef0c7;
  --lib-warning-200: #fedf89;
  --lib-warning-300: #fec84b;
  --lib-warning-400: #fdb022;
  --lib-warning-500: #f79009;
  --lib-warning-600: #dc6803;
  --lib-warning-700: #b54708;
  --lib-warning-800: #93370d;
  --lib-warning-900: #7a2e0e;

  --lib-danger-50:  #fef3f2;
  --lib-danger-100: #fee4e2;
  --lib-danger-200: #fecdca;
  --lib-danger-300: #fda29b;
  --lib-danger-400: #f97066;
  --lib-danger-500: #f04438;
  --lib-danger-600: #d92d20;
  --lib-danger-700: #b42318;
  --lib-danger-800: #912018;
  --lib-danger-900: #7a271a;

  --lib-info-50:  #eff8ff;
  --lib-info-100: #d1e9ff;
  --lib-info-200: #b2ddff;
  --lib-info-300: #84caff;
  --lib-info-400: #53b1fd;
  --lib-info-500: #2e90fa;
  --lib-info-600: #1570ef;
  --lib-info-700: #175cd3;
  --lib-info-800: #1849a9;
  --lib-info-900: #194185;

  /* ------------------------------------------------------------------
     Superficies, fondos, bordes y textos
     ------------------------------------------------------------------ */
  --lib-bg:            #f6f7fb;
  --lib-bg-subtle:     #fbfcfe;
  --lib-surface:       #ffffff;
  --lib-surface-muted: #f1f3f9;
  --lib-border:        #e4e7ec;
  --lib-border-strong: #d0d5dd;

  --lib-text:           #101828;
  --lib-text-muted:     #475467;
  --lib-text-subtle:    #667085;
  --lib-text-inverse:   #ffffff;

  /* ------------------------------------------------------------------
     Tipografía
     ------------------------------------------------------------------ */
  --lib-font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
    Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji",
    "Segoe UI Emoji", "Segoe UI Symbol";
  --lib-font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
    "Liberation Mono", monospace;

  --lib-font-size-base: 0.9375rem;   /* 15px */
  --lib-font-size-sm:   0.8125rem;   /* 13px */
  --lib-font-size-lg:   1.0625rem;   /* 17px */
  --lib-font-size-xs:   0.75rem;     /* 12px */

  --lib-font-weight-normal:   400;
  --lib-font-weight-medium:   500;
  --lib-font-weight-semibold: 600;
  --lib-font-weight-bold:     700;

  --lib-line-height-base: 1.5;
  --lib-line-height-tight: 1.25;

  /* ------------------------------------------------------------------
     Espaciado (escala de 4px)
     ------------------------------------------------------------------ */
  --lib-space-1: 0.25rem;  /*  4px */
  --lib-space-2: 0.5rem;   /*  8px */
  --lib-space-3: 0.75rem;  /* 12px */
  --lib-space-4: 1rem;     /* 16px */
  --lib-space-5: 1.25rem;  /* 20px */
  --lib-space-6: 1.5rem;   /* 24px */
  --lib-space-8: 2rem;     /* 32px */
  --lib-space-10: 2.5rem;  /* 40px */
  --lib-space-12: 3rem;    /* 48px */

  /* ------------------------------------------------------------------
     Radios
     ------------------------------------------------------------------ */
  --lib-radius-sm:   0.375rem; /*  6px */
  --lib-radius-md:   0.625rem; /* 10px */
  --lib-radius-lg:   0.875rem; /* 14px */
  --lib-radius-pill: 50rem;

  /* ------------------------------------------------------------------
     Sombras
     ------------------------------------------------------------------ */
  --lib-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.05);
  --lib-shadow-md: 0 4px 12px rgba(16, 24, 40, 0.08);
  --lib-shadow-lg: 0 12px 32px rgba(16, 24, 40, 0.12);

  /* ------------------------------------------------------------------
     Medidas de layout
     ------------------------------------------------------------------ */
  --lib-sidebar-width:         16.25rem; /* 260px */
  --lib-sidebar-width-collapsed: 4.75rem; /* 76px */
  --lib-topbar-height:         4rem;     /* 64px */
  --lib-container-max:         90rem;    /* 1440px */

  /* ------------------------------------------------------------------
     Sidebar oscuro (se mantiene oscuro también en el tema claro)
     ------------------------------------------------------------------ */
  --lib-sidebar-bg:            #0f172a;
  --lib-sidebar-border:        rgba(255, 255, 255, 0.08);
  --lib-sidebar-border-strong: rgba(255, 255, 255, 0.18);
  --lib-sidebar-text:          #cbd5e1;
  --lib-sidebar-text-strong:   #ffffff;
  --lib-sidebar-text-muted:    #7c8aa5;
  --lib-sidebar-hover-bg:      rgba(255, 255, 255, 0.07);
  --lib-sidebar-active-bg:     rgba(109, 130, 255, 0.20);
  --lib-sidebar-active-text:   #ffffff;
}

/* ------------------------------------------------------------------
   Modo oscuro: solo las variables de superficie/texto/borde cambian.
   Los matices de color se mantienen para conservar la identidad.
   ------------------------------------------------------------------ */
[data-bs-theme="dark"] {
  --lib-bg:            #0b0f1a;
  --lib-bg-subtle:     #0f1420;
  --lib-surface:       #151a28;
  --lib-surface-muted: #1c2333;
  --lib-border:        #262e42;
  --lib-border-strong: #38415a;

  --lib-text:          #e7ebf3;
  --lib-text-muted:    #a9b2c5;
  --lib-text-subtle:   #7d8798;
  --lib-text-inverse:  #0b0f1a;

  --lib-primary-50:  #1b2440;
  --lib-primary-500: #6d82ff;

  --lib-success-50: #0f2a1e;
  --lib-warning-50: #2b2210;
  --lib-danger-50:  #2e1513;
  --lib-info-50:    #10233d;

  --lib-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --lib-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.5);
  --lib-shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.6);

  /* El sidebar ya es oscuro: en modo oscuro hereda la superficie del tema */
  --lib-sidebar-bg:            var(--lib-surface);
  --lib-sidebar-border:        var(--lib-border);
  --lib-sidebar-border-strong: var(--lib-border-strong);
  --lib-sidebar-text:          var(--lib-text-muted);
  --lib-sidebar-text-strong:   var(--lib-text);
  --lib-sidebar-text-muted:    var(--lib-text-subtle);
  --lib-sidebar-hover-bg:      var(--lib-surface-muted);
  --lib-sidebar-active-bg:     var(--lib-primary-50);
  --lib-sidebar-active-text:   var(--lib-primary-300);
}