/* ============================================================================
CSS GENERADO DINÁMICAMENTE - BOOTSTRAP 5 THEME + LITERA OVERRIDE
============================================================================ */

:root, [data-bs-theme=light] {

/* ============================================================================
1. COLORES BASE
============================================================================ */

/* Colores Temáticos */
--bs-primary: #611232;
--bs-secondary: #a57f2c;
--bs-success: #38b44a;
--bs-info: #17a2b8;
--bs-warning: #efb73e;
--bs-danger: #df382c;
--bs-light: #e9ecef;
--bs-dark: #002f2a;

/* Colores de Sistema */
--bs-white: #ffffff;
--bs-body-color: #212529;
--bs-body-bg: #f8f9fa;

/* ============================================================================
2. VALORES RGB (Para opacidades y sombras)
============================================================================ */

  --bs-primary-rgb: 97, 18, 50;
  --bs-secondary-rgb: 165, 127, 44;
  --bs-success-rgb: 56, 180, 74;
  --bs-info-rgb: 23, 162, 184;
  --bs-warning-rgb: 239, 183, 62;
  --bs-danger-rgb: 223, 56, 44;
  --bs-light-rgb: 233, 236, 239;
  --bs-dark-rgb: 0, 47, 42;

--bs-white-rgb: 255, 255, 255;
--bs-body-color-rgb: 33, 37, 41;
--bs-body-bg-rgb: 248, 249, 250;

/* ============================================================================
3. COLORES DE TEXTO ACCESIBLES SOBRE FONDOS DE COLOR
============================================================================ */

  --bs-primary-text: #ffffff;
  --bs-secondary-text: #000000;
  --bs-success-text: #000000;
  --bs-info-text: #000000;
  --bs-warning-text: #000000;
  --bs-danger-text: #000000;
  --bs-light-text: #000000;
  --bs-dark-text: #ffffff;

/* ============================================================================
4. COLORES DERIVADOS - TEXT EMPHASIS
Mezcla el color base con 60% de negro (más oscuro para texto)
============================================================================ */

  --bs-primary-text-emphasis: color-mix(in srgb, var(--bs-primary), black 60%);
  --bs-secondary-text-emphasis: color-mix(in srgb, var(--bs-secondary), black 60%);
  --bs-success-text-emphasis: color-mix(in srgb, var(--bs-success), black 60%);
  --bs-info-text-emphasis: color-mix(in srgb, var(--bs-info), black 60%);
  --bs-warning-text-emphasis: color-mix(in srgb, var(--bs-warning), black 60%);
  --bs-danger-text-emphasis: color-mix(in srgb, var(--bs-danger), black 60%);
  --bs-light-text-emphasis: color-mix(in srgb, var(--bs-light), black 60%);
  --bs-dark-text-emphasis: color-mix(in srgb, var(--bs-dark), black 60%);

/* ============================================================================
5. COLORES DERIVADOS - BG SUBTLE
Mezcla el color base con 80% de blanco (muy claro para fondos)
============================================================================ */

  --bs-primary-bg-subtle: color-mix(in srgb, var(--bs-primary), white 80%);
  --bs-secondary-bg-subtle: color-mix(in srgb, var(--bs-secondary), white 80%);
  --bs-success-bg-subtle: color-mix(in srgb, var(--bs-success), white 80%);
  --bs-info-bg-subtle: color-mix(in srgb, var(--bs-info), white 80%);
  --bs-warning-bg-subtle: color-mix(in srgb, var(--bs-warning), white 80%);
  --bs-danger-bg-subtle: color-mix(in srgb, var(--bs-danger), white 80%);
  --bs-light-bg-subtle: color-mix(in srgb, var(--bs-light), white 80%);
  --bs-dark-bg-subtle: color-mix(in srgb, var(--bs-dark), white 80%);

/* ============================================================================
6. COLORES DERIVADOS - BORDER SUBTLE
Mezcla el color base con 60% de blanco (suave para bordes)
============================================================================ */

  --bs-primary-border-subtle: color-mix(in srgb, var(--bs-primary), white 60%);
  --bs-secondary-border-subtle: color-mix(in srgb, var(--bs-secondary), white 60%);
  --bs-success-border-subtle: color-mix(in srgb, var(--bs-success), white 60%);
  --bs-info-border-subtle: color-mix(in srgb, var(--bs-info), white 60%);
  --bs-warning-border-subtle: color-mix(in srgb, var(--bs-warning), white 60%);
  --bs-danger-border-subtle: color-mix(in srgb, var(--bs-danger), white 60%);
  --bs-light-border-subtle: color-mix(in srgb, var(--bs-light), white 60%);
  --bs-dark-border-subtle: color-mix(in srgb, var(--bs-dark), white 60%);

/* ============================================================================
7. COLORES DE ENLACE
============================================================================ */

--bs-link-color: var(--bs-primary);
--bs-link-color-rgb: var(--bs-primary-rgb);
--bs-link-hover-color: color-mix(in srgb, var(--bs-primary), black 20%);
--bs-link-decoration: underline;
--bs-link-hover-decoration: underline;

/* ============================================================================
8. COLORES DE BORDE Y FONDO
============================================================================ */

--bs-border-color: #dee2e6;
--bs-border-color-translucent: rgba(0, 0, 0, 0.175);

/* ============================================================================
9. FOCUS RING (Borde al hacer foco en inputs)
============================================================================ */

--bs-focus-ring-width: 0.25rem;
--bs-focus-ring-opacity: 0.25;
--bs-focus-ring-color: rgba(var(--bs-primary-rgb), var(--bs-focus-ring-opacity));

/* ============================================================================
10. COLORES DE FORMULARIOS
============================================================================ */

--bs-form-valid-color: var(--bs-success);
--bs-form-valid-border-color: var(--bs-success);
--bs-form-invalid-color: var(--bs-danger);
--bs-form-invalid-border-color: var(--bs-danger);

/* ============================================================================
11. COLORES DE HEADINGS
============================================================================ */

--bs-heading-color: inherit;

/* ============================================================================
12. COLORES DE CÓDIGO
============================================================================ */

--bs-code-color: #d63384;
--bs-highlight-bg: #fff3cd;

}

/* ============================================================================
COMPONENTES - BOTONES
============================================================================ */

  .btn-primary {
  --bs-btn-color: var(--bs-primary-text);
  --bs-btn-bg: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-color: var(--bs-primary-text);
  --bs-btn-hover-bg: color-mix(in srgb, var(--bs-primary), black 15%);
  --bs-btn-hover-border-color: color-mix(in srgb, var(--bs-primary), black 20%);
  --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
  --bs-btn-active-color: var(--bs-primary-text);
  --bs-btn-active-bg: color-mix(in srgb, var(--bs-primary), black 20%);
  --bs-btn-active-border-color: color-mix(in srgb, var(--bs-primary), black 25%);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-primary-text);
  --bs-btn-disabled-bg: var(--bs-primary);
  --bs-btn-disabled-border-color: var(--bs-primary);
  }

  .btn-secondary {
  --bs-btn-color: var(--bs-secondary-text);
  --bs-btn-bg: var(--bs-secondary);
  --bs-btn-border-color: var(--bs-secondary);
  --bs-btn-hover-color: var(--bs-secondary-text);
  --bs-btn-hover-bg: color-mix(in srgb, var(--bs-secondary), black 15%);
  --bs-btn-hover-border-color: color-mix(in srgb, var(--bs-secondary), black 20%);
  --bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
  --bs-btn-active-color: var(--bs-secondary-text);
  --bs-btn-active-bg: color-mix(in srgb, var(--bs-secondary), black 20%);
  --bs-btn-active-border-color: color-mix(in srgb, var(--bs-secondary), black 25%);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-secondary-text);
  --bs-btn-disabled-bg: var(--bs-secondary);
  --bs-btn-disabled-border-color: var(--bs-secondary);
  }

  .btn-success {
  --bs-btn-color: var(--bs-success-text);
  --bs-btn-bg: var(--bs-success);
  --bs-btn-border-color: var(--bs-success);
  --bs-btn-hover-color: var(--bs-success-text);
  --bs-btn-hover-bg: color-mix(in srgb, var(--bs-success), black 15%);
  --bs-btn-hover-border-color: color-mix(in srgb, var(--bs-success), black 20%);
  --bs-btn-focus-shadow-rgb: var(--bs-success-rgb);
  --bs-btn-active-color: var(--bs-success-text);
  --bs-btn-active-bg: color-mix(in srgb, var(--bs-success), black 20%);
  --bs-btn-active-border-color: color-mix(in srgb, var(--bs-success), black 25%);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-success-text);
  --bs-btn-disabled-bg: var(--bs-success);
  --bs-btn-disabled-border-color: var(--bs-success);
  }

  .btn-info {
  --bs-btn-color: var(--bs-info-text);
  --bs-btn-bg: var(--bs-info);
  --bs-btn-border-color: var(--bs-info);
  --bs-btn-hover-color: var(--bs-info-text);
  --bs-btn-hover-bg: color-mix(in srgb, var(--bs-info), black 15%);
  --bs-btn-hover-border-color: color-mix(in srgb, var(--bs-info), black 20%);
  --bs-btn-focus-shadow-rgb: var(--bs-info-rgb);
  --bs-btn-active-color: var(--bs-info-text);
  --bs-btn-active-bg: color-mix(in srgb, var(--bs-info), black 20%);
  --bs-btn-active-border-color: color-mix(in srgb, var(--bs-info), black 25%);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-info-text);
  --bs-btn-disabled-bg: var(--bs-info);
  --bs-btn-disabled-border-color: var(--bs-info);
  }

  .btn-warning {
  --bs-btn-color: var(--bs-warning-text);
  --bs-btn-bg: var(--bs-warning);
  --bs-btn-border-color: var(--bs-warning);
  --bs-btn-hover-color: var(--bs-warning-text);
  --bs-btn-hover-bg: color-mix(in srgb, var(--bs-warning), black 15%);
  --bs-btn-hover-border-color: color-mix(in srgb, var(--bs-warning), black 20%);
  --bs-btn-focus-shadow-rgb: var(--bs-warning-rgb);
  --bs-btn-active-color: var(--bs-warning-text);
  --bs-btn-active-bg: color-mix(in srgb, var(--bs-warning), black 20%);
  --bs-btn-active-border-color: color-mix(in srgb, var(--bs-warning), black 25%);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-warning-text);
  --bs-btn-disabled-bg: var(--bs-warning);
  --bs-btn-disabled-border-color: var(--bs-warning);
  }

  .btn-danger {
  --bs-btn-color: var(--bs-danger-text);
  --bs-btn-bg: var(--bs-danger);
  --bs-btn-border-color: var(--bs-danger);
  --bs-btn-hover-color: var(--bs-danger-text);
  --bs-btn-hover-bg: color-mix(in srgb, var(--bs-danger), black 15%);
  --bs-btn-hover-border-color: color-mix(in srgb, var(--bs-danger), black 20%);
  --bs-btn-focus-shadow-rgb: var(--bs-danger-rgb);
  --bs-btn-active-color: var(--bs-danger-text);
  --bs-btn-active-bg: color-mix(in srgb, var(--bs-danger), black 20%);
  --bs-btn-active-border-color: color-mix(in srgb, var(--bs-danger), black 25%);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-danger-text);
  --bs-btn-disabled-bg: var(--bs-danger);
  --bs-btn-disabled-border-color: var(--bs-danger);
  }

  .btn-light {
  --bs-btn-color: var(--bs-light-text);
  --bs-btn-bg: var(--bs-light);
  --bs-btn-border-color: var(--bs-light);
  --bs-btn-hover-color: var(--bs-light-text);
  --bs-btn-hover-bg: color-mix(in srgb, var(--bs-light), black 15%);
  --bs-btn-hover-border-color: color-mix(in srgb, var(--bs-light), black 20%);
  --bs-btn-focus-shadow-rgb: var(--bs-light-rgb);
  --bs-btn-active-color: var(--bs-light-text);
  --bs-btn-active-bg: color-mix(in srgb, var(--bs-light), black 20%);
  --bs-btn-active-border-color: color-mix(in srgb, var(--bs-light), black 25%);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-light-text);
  --bs-btn-disabled-bg: var(--bs-light);
  --bs-btn-disabled-border-color: var(--bs-light);
  }

  .btn-dark {
  --bs-btn-color: var(--bs-dark-text);
  --bs-btn-bg: var(--bs-dark);
  --bs-btn-border-color: var(--bs-dark);
  --bs-btn-hover-color: var(--bs-dark-text);
  --bs-btn-hover-bg: color-mix(in srgb, var(--bs-dark), black 15%);
  --bs-btn-hover-border-color: color-mix(in srgb, var(--bs-dark), black 20%);
  --bs-btn-focus-shadow-rgb: var(--bs-dark-rgb);
  --bs-btn-active-color: var(--bs-dark-text);
  --bs-btn-active-bg: color-mix(in srgb, var(--bs-dark), black 20%);
  --bs-btn-active-border-color: color-mix(in srgb, var(--bs-dark), black 25%);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-dark-text);
  --bs-btn-disabled-bg: var(--bs-dark);
  --bs-btn-disabled-border-color: var(--bs-dark);
  }


/* Botones Outline */
  .btn-outline-primary {
  --bs-btn-color: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-color: var(--bs-primary-text);
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
  --bs-btn-active-color: var(--bs-primary-text);
  --bs-btn-active-bg: var(--bs-primary);
  --bs-btn-active-border-color: var(--bs-primary);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-primary);
  --bs-btn-disabled-bg: transparent;
  --bs-gradient: none;
  }

  .btn-outline-secondary {
  --bs-btn-color: var(--bs-secondary);
  --bs-btn-border-color: var(--bs-secondary);
  --bs-btn-hover-color: var(--bs-secondary-text);
  --bs-btn-hover-bg: var(--bs-secondary);
  --bs-btn-hover-border-color: var(--bs-secondary);
  --bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
  --bs-btn-active-color: var(--bs-secondary-text);
  --bs-btn-active-bg: var(--bs-secondary);
  --bs-btn-active-border-color: var(--bs-secondary);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-secondary);
  --bs-btn-disabled-bg: transparent;
  --bs-gradient: none;
  }

  .btn-outline-success {
  --bs-btn-color: var(--bs-success);
  --bs-btn-border-color: var(--bs-success);
  --bs-btn-hover-color: var(--bs-success-text);
  --bs-btn-hover-bg: var(--bs-success);
  --bs-btn-hover-border-color: var(--bs-success);
  --bs-btn-focus-shadow-rgb: var(--bs-success-rgb);
  --bs-btn-active-color: var(--bs-success-text);
  --bs-btn-active-bg: var(--bs-success);
  --bs-btn-active-border-color: var(--bs-success);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-success);
  --bs-btn-disabled-bg: transparent;
  --bs-gradient: none;
  }

  .btn-outline-info {
  --bs-btn-color: var(--bs-info);
  --bs-btn-border-color: var(--bs-info);
  --bs-btn-hover-color: var(--bs-info-text);
  --bs-btn-hover-bg: var(--bs-info);
  --bs-btn-hover-border-color: var(--bs-info);
  --bs-btn-focus-shadow-rgb: var(--bs-info-rgb);
  --bs-btn-active-color: var(--bs-info-text);
  --bs-btn-active-bg: var(--bs-info);
  --bs-btn-active-border-color: var(--bs-info);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-info);
  --bs-btn-disabled-bg: transparent;
  --bs-gradient: none;
  }

  .btn-outline-warning {
  --bs-btn-color: var(--bs-warning);
  --bs-btn-border-color: var(--bs-warning);
  --bs-btn-hover-color: var(--bs-warning-text);
  --bs-btn-hover-bg: var(--bs-warning);
  --bs-btn-hover-border-color: var(--bs-warning);
  --bs-btn-focus-shadow-rgb: var(--bs-warning-rgb);
  --bs-btn-active-color: var(--bs-warning-text);
  --bs-btn-active-bg: var(--bs-warning);
  --bs-btn-active-border-color: var(--bs-warning);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-warning);
  --bs-btn-disabled-bg: transparent;
  --bs-gradient: none;
  }

  .btn-outline-danger {
  --bs-btn-color: var(--bs-danger);
  --bs-btn-border-color: var(--bs-danger);
  --bs-btn-hover-color: var(--bs-danger-text);
  --bs-btn-hover-bg: var(--bs-danger);
  --bs-btn-hover-border-color: var(--bs-danger);
  --bs-btn-focus-shadow-rgb: var(--bs-danger-rgb);
  --bs-btn-active-color: var(--bs-danger-text);
  --bs-btn-active-bg: var(--bs-danger);
  --bs-btn-active-border-color: var(--bs-danger);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-danger);
  --bs-btn-disabled-bg: transparent;
  --bs-gradient: none;
  }

  .btn-outline-light {
  --bs-btn-color: var(--bs-light);
  --bs-btn-border-color: var(--bs-light);
  --bs-btn-hover-color: var(--bs-light-text);
  --bs-btn-hover-bg: var(--bs-light);
  --bs-btn-hover-border-color: var(--bs-light);
  --bs-btn-focus-shadow-rgb: var(--bs-light-rgb);
  --bs-btn-active-color: var(--bs-light-text);
  --bs-btn-active-bg: var(--bs-light);
  --bs-btn-active-border-color: var(--bs-light);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-light);
  --bs-btn-disabled-bg: transparent;
  --bs-gradient: none;
  }

  .btn-outline-dark {
  --bs-btn-color: var(--bs-dark);
  --bs-btn-border-color: var(--bs-dark);
  --bs-btn-hover-color: var(--bs-dark-text);
  --bs-btn-hover-bg: var(--bs-dark);
  --bs-btn-hover-border-color: var(--bs-dark);
  --bs-btn-focus-shadow-rgb: var(--bs-dark-rgb);
  --bs-btn-active-color: var(--bs-dark-text);
  --bs-btn-active-bg: var(--bs-dark);
  --bs-btn-active-border-color: var(--bs-dark);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-dark);
  --bs-btn-disabled-bg: transparent;
  --bs-gradient: none;
  }


/* ============================================================================
COMPONENTES - ALERTAS
============================================================================ */

  .alert-primary {
  --bs-alert-color: var(--bs-primary-text-emphasis);
  --bs-alert-bg: var(--bs-primary-bg-subtle);
  --bs-alert-border-color: var(--bs-primary-border-subtle);
  --bs-alert-link-color: var(--bs-primary-text-emphasis);
  }

  .alert-secondary {
  --bs-alert-color: var(--bs-secondary-text-emphasis);
  --bs-alert-bg: var(--bs-secondary-bg-subtle);
  --bs-alert-border-color: var(--bs-secondary-border-subtle);
  --bs-alert-link-color: var(--bs-secondary-text-emphasis);
  }

  .alert-success {
  --bs-alert-color: var(--bs-success-text-emphasis);
  --bs-alert-bg: var(--bs-success-bg-subtle);
  --bs-alert-border-color: var(--bs-success-border-subtle);
  --bs-alert-link-color: var(--bs-success-text-emphasis);
  }

  .alert-info {
  --bs-alert-color: var(--bs-info-text-emphasis);
  --bs-alert-bg: var(--bs-info-bg-subtle);
  --bs-alert-border-color: var(--bs-info-border-subtle);
  --bs-alert-link-color: var(--bs-info-text-emphasis);
  }

  .alert-warning {
  --bs-alert-color: var(--bs-warning-text-emphasis);
  --bs-alert-bg: var(--bs-warning-bg-subtle);
  --bs-alert-border-color: var(--bs-warning-border-subtle);
  --bs-alert-link-color: var(--bs-warning-text-emphasis);
  }

  .alert-danger {
  --bs-alert-color: var(--bs-danger-text-emphasis);
  --bs-alert-bg: var(--bs-danger-bg-subtle);
  --bs-alert-border-color: var(--bs-danger-border-subtle);
  --bs-alert-link-color: var(--bs-danger-text-emphasis);
  }

  .alert-light {
  --bs-alert-color: var(--bs-light-text-emphasis);
  --bs-alert-bg: var(--bs-light-bg-subtle);
  --bs-alert-border-color: var(--bs-light-border-subtle);
  --bs-alert-link-color: var(--bs-light-text-emphasis);
  }

  .alert-dark {
  --bs-alert-color: var(--bs-dark-text-emphasis);
  --bs-alert-bg: var(--bs-dark-bg-subtle);
  --bs-alert-border-color: var(--bs-dark-border-subtle);
  --bs-alert-link-color: var(--bs-dark-text-emphasis);
  }


/* ============================================================================
COMPONENTES - BADGES
============================================================================ */

  .badge.bg-primary {
  color: var(--bs-primary-text) !important;
  }

  .badge.bg-secondary {
  color: var(--bs-secondary-text) !important;
  }

  .badge.bg-success {
  color: var(--bs-success-text) !important;
  }

  .badge.bg-info {
  color: var(--bs-info-text) !important;
  }

  .badge.bg-warning {
  color: var(--bs-warning-text) !important;
  }

  .badge.bg-danger {
  color: var(--bs-danger-text) !important;
  }

  .badge.bg-light {
  color: var(--bs-light-text) !important;
  }

  .badge.bg-dark {
  color: var(--bs-dark-text) !important;
  }


/* ============================================================================
COMPONENTES - TABLAS
============================================================================ */

  .table-primary {
  --bs-table-color: var(--bs-body-color);
  --bs-table-bg: var(--bs-primary-bg-subtle);
  --bs-table-border-color: var(--bs-primary-border-subtle);
  --bs-table-striped-bg: color-mix(in srgb, var(--bs-primary-bg-subtle), black 5%);
  --bs-table-striped-color: var(--bs-body-color);
  --bs-table-active-bg: color-mix(in srgb, var(--bs-primary-bg-subtle), black 10%);
  --bs-table-active-color: var(--bs-body-color);
  --bs-table-hover-bg: color-mix(in srgb, var(--bs-primary-bg-subtle), black 7.5%);
  --bs-table-hover-color: var(--bs-body-color);
  }

  .table-secondary {
  --bs-table-color: var(--bs-body-color);
  --bs-table-bg: var(--bs-secondary-bg-subtle);
  --bs-table-border-color: var(--bs-secondary-border-subtle);
  --bs-table-striped-bg: color-mix(in srgb, var(--bs-secondary-bg-subtle), black 5%);
  --bs-table-striped-color: var(--bs-body-color);
  --bs-table-active-bg: color-mix(in srgb, var(--bs-secondary-bg-subtle), black 10%);
  --bs-table-active-color: var(--bs-body-color);
  --bs-table-hover-bg: color-mix(in srgb, var(--bs-secondary-bg-subtle), black 7.5%);
  --bs-table-hover-color: var(--bs-body-color);
  }

  .table-success {
  --bs-table-color: var(--bs-body-color);
  --bs-table-bg: var(--bs-success-bg-subtle);
  --bs-table-border-color: var(--bs-success-border-subtle);
  --bs-table-striped-bg: color-mix(in srgb, var(--bs-success-bg-subtle), black 5%);
  --bs-table-striped-color: var(--bs-body-color);
  --bs-table-active-bg: color-mix(in srgb, var(--bs-success-bg-subtle), black 10%);
  --bs-table-active-color: var(--bs-body-color);
  --bs-table-hover-bg: color-mix(in srgb, var(--bs-success-bg-subtle), black 7.5%);
  --bs-table-hover-color: var(--bs-body-color);
  }

  .table-info {
  --bs-table-color: var(--bs-body-color);
  --bs-table-bg: var(--bs-info-bg-subtle);
  --bs-table-border-color: var(--bs-info-border-subtle);
  --bs-table-striped-bg: color-mix(in srgb, var(--bs-info-bg-subtle), black 5%);
  --bs-table-striped-color: var(--bs-body-color);
  --bs-table-active-bg: color-mix(in srgb, var(--bs-info-bg-subtle), black 10%);
  --bs-table-active-color: var(--bs-body-color);
  --bs-table-hover-bg: color-mix(in srgb, var(--bs-info-bg-subtle), black 7.5%);
  --bs-table-hover-color: var(--bs-body-color);
  }

  .table-warning {
  --bs-table-color: var(--bs-body-color);
  --bs-table-bg: var(--bs-warning-bg-subtle);
  --bs-table-border-color: var(--bs-warning-border-subtle);
  --bs-table-striped-bg: color-mix(in srgb, var(--bs-warning-bg-subtle), black 5%);
  --bs-table-striped-color: var(--bs-body-color);
  --bs-table-active-bg: color-mix(in srgb, var(--bs-warning-bg-subtle), black 10%);
  --bs-table-active-color: var(--bs-body-color);
  --bs-table-hover-bg: color-mix(in srgb, var(--bs-warning-bg-subtle), black 7.5%);
  --bs-table-hover-color: var(--bs-body-color);
  }

  .table-danger {
  --bs-table-color: var(--bs-body-color);
  --bs-table-bg: var(--bs-danger-bg-subtle);
  --bs-table-border-color: var(--bs-danger-border-subtle);
  --bs-table-striped-bg: color-mix(in srgb, var(--bs-danger-bg-subtle), black 5%);
  --bs-table-striped-color: var(--bs-body-color);
  --bs-table-active-bg: color-mix(in srgb, var(--bs-danger-bg-subtle), black 10%);
  --bs-table-active-color: var(--bs-body-color);
  --bs-table-hover-bg: color-mix(in srgb, var(--bs-danger-bg-subtle), black 7.5%);
  --bs-table-hover-color: var(--bs-body-color);
  }

  .table-light {
  --bs-table-color: var(--bs-body-color);
  --bs-table-bg: var(--bs-light-bg-subtle);
  --bs-table-border-color: var(--bs-light-border-subtle);
  --bs-table-striped-bg: color-mix(in srgb, var(--bs-light-bg-subtle), black 5%);
  --bs-table-striped-color: var(--bs-body-color);
  --bs-table-active-bg: color-mix(in srgb, var(--bs-light-bg-subtle), black 10%);
  --bs-table-active-color: var(--bs-body-color);
  --bs-table-hover-bg: color-mix(in srgb, var(--bs-light-bg-subtle), black 7.5%);
  --bs-table-hover-color: var(--bs-body-color);
  }

  .table-dark {
  --bs-table-color: var(--bs-body-color);
  --bs-table-bg: var(--bs-dark-bg-subtle);
  --bs-table-border-color: var(--bs-dark-border-subtle);
  --bs-table-striped-bg: color-mix(in srgb, var(--bs-dark-bg-subtle), black 5%);
  --bs-table-striped-color: var(--bs-body-color);
  --bs-table-active-bg: color-mix(in srgb, var(--bs-dark-bg-subtle), black 10%);
  --bs-table-active-color: var(--bs-body-color);
  --bs-table-hover-bg: color-mix(in srgb, var(--bs-dark-bg-subtle), black 7.5%);
  --bs-table-hover-color: var(--bs-body-color);
  }


/* ============================================================================
COMPONENTES - TOASTS
============================================================================ */

  .toast.bg-primary {
  color: var(--bs-primary-text);
  }

  .toast.bg-primary .btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
  }

  .toast.bg-secondary {
  color: var(--bs-secondary-text);
  }

  .toast.bg-secondary .btn-close {
  filter: none;
  }

  .toast.bg-success {
  color: var(--bs-success-text);
  }

  .toast.bg-success .btn-close {
  filter: none;
  }

  .toast.bg-info {
  color: var(--bs-info-text);
  }

  .toast.bg-info .btn-close {
  filter: none;
  }

  .toast.bg-warning {
  color: var(--bs-warning-text);
  }

  .toast.bg-warning .btn-close {
  filter: none;
  }

  .toast.bg-danger {
  color: var(--bs-danger-text);
  }

  .toast.bg-danger .btn-close {
  filter: none;
  }

  .toast.bg-light {
  color: var(--bs-light-text);
  }

  .toast.bg-light .btn-close {
  filter: none;
  }

  .toast.bg-dark {
  color: var(--bs-dark-text);
  }

  .toast.bg-dark .btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
  }


/* ============================================================================
COMPONENTES - LIST GROUPS
============================================================================ */

  .list-group-item-primary {
  --bs-list-group-color: var(--bs-primary-text-emphasis);
  --bs-list-group-bg: var(--bs-primary-bg-subtle);
  --bs-list-group-border-color: var(--bs-primary-border-subtle);
  --bs-list-group-action-hover-color: var(--bs-primary-text-emphasis);
  --bs-list-group-action-hover-bg: color-mix(in srgb, var(--bs-primary-bg-subtle), black 5%);
  --bs-list-group-action-active-color: var(--bs-primary-text-emphasis);
  --bs-list-group-action-active-bg: var(--bs-primary-bg-subtle);
  --bs-list-group-active-color: var(--bs-primary-text);
  --bs-list-group-active-bg: var(--bs-primary);
  --bs-list-group-active-border-color: var(--bs-primary);
  }

  .list-group-item-secondary {
  --bs-list-group-color: var(--bs-secondary-text-emphasis);
  --bs-list-group-bg: var(--bs-secondary-bg-subtle);
  --bs-list-group-border-color: var(--bs-secondary-border-subtle);
  --bs-list-group-action-hover-color: var(--bs-secondary-text-emphasis);
  --bs-list-group-action-hover-bg: color-mix(in srgb, var(--bs-secondary-bg-subtle), black 5%);
  --bs-list-group-action-active-color: var(--bs-secondary-text-emphasis);
  --bs-list-group-action-active-bg: var(--bs-secondary-bg-subtle);
  --bs-list-group-active-color: var(--bs-secondary-text);
  --bs-list-group-active-bg: var(--bs-secondary);
  --bs-list-group-active-border-color: var(--bs-secondary);
  }

  .list-group-item-success {
  --bs-list-group-color: var(--bs-success-text-emphasis);
  --bs-list-group-bg: var(--bs-success-bg-subtle);
  --bs-list-group-border-color: var(--bs-success-border-subtle);
  --bs-list-group-action-hover-color: var(--bs-success-text-emphasis);
  --bs-list-group-action-hover-bg: color-mix(in srgb, var(--bs-success-bg-subtle), black 5%);
  --bs-list-group-action-active-color: var(--bs-success-text-emphasis);
  --bs-list-group-action-active-bg: var(--bs-success-bg-subtle);
  --bs-list-group-active-color: var(--bs-success-text);
  --bs-list-group-active-bg: var(--bs-success);
  --bs-list-group-active-border-color: var(--bs-success);
  }

  .list-group-item-info {
  --bs-list-group-color: var(--bs-info-text-emphasis);
  --bs-list-group-bg: var(--bs-info-bg-subtle);
  --bs-list-group-border-color: var(--bs-info-border-subtle);
  --bs-list-group-action-hover-color: var(--bs-info-text-emphasis);
  --bs-list-group-action-hover-bg: color-mix(in srgb, var(--bs-info-bg-subtle), black 5%);
  --bs-list-group-action-active-color: var(--bs-info-text-emphasis);
  --bs-list-group-action-active-bg: var(--bs-info-bg-subtle);
  --bs-list-group-active-color: var(--bs-info-text);
  --bs-list-group-active-bg: var(--bs-info);
  --bs-list-group-active-border-color: var(--bs-info);
  }

  .list-group-item-warning {
  --bs-list-group-color: var(--bs-warning-text-emphasis);
  --bs-list-group-bg: var(--bs-warning-bg-subtle);
  --bs-list-group-border-color: var(--bs-warning-border-subtle);
  --bs-list-group-action-hover-color: var(--bs-warning-text-emphasis);
  --bs-list-group-action-hover-bg: color-mix(in srgb, var(--bs-warning-bg-subtle), black 5%);
  --bs-list-group-action-active-color: var(--bs-warning-text-emphasis);
  --bs-list-group-action-active-bg: var(--bs-warning-bg-subtle);
  --bs-list-group-active-color: var(--bs-warning-text);
  --bs-list-group-active-bg: var(--bs-warning);
  --bs-list-group-active-border-color: var(--bs-warning);
  }

  .list-group-item-danger {
  --bs-list-group-color: var(--bs-danger-text-emphasis);
  --bs-list-group-bg: var(--bs-danger-bg-subtle);
  --bs-list-group-border-color: var(--bs-danger-border-subtle);
  --bs-list-group-action-hover-color: var(--bs-danger-text-emphasis);
  --bs-list-group-action-hover-bg: color-mix(in srgb, var(--bs-danger-bg-subtle), black 5%);
  --bs-list-group-action-active-color: var(--bs-danger-text-emphasis);
  --bs-list-group-action-active-bg: var(--bs-danger-bg-subtle);
  --bs-list-group-active-color: var(--bs-danger-text);
  --bs-list-group-active-bg: var(--bs-danger);
  --bs-list-group-active-border-color: var(--bs-danger);
  }

  .list-group-item-light {
  --bs-list-group-color: var(--bs-light-text-emphasis);
  --bs-list-group-bg: var(--bs-light-bg-subtle);
  --bs-list-group-border-color: var(--bs-light-border-subtle);
  --bs-list-group-action-hover-color: var(--bs-light-text-emphasis);
  --bs-list-group-action-hover-bg: color-mix(in srgb, var(--bs-light-bg-subtle), black 5%);
  --bs-list-group-action-active-color: var(--bs-light-text-emphasis);
  --bs-list-group-action-active-bg: var(--bs-light-bg-subtle);
  --bs-list-group-active-color: var(--bs-light-text);
  --bs-list-group-active-bg: var(--bs-light);
  --bs-list-group-active-border-color: var(--bs-light);
  }

  .list-group-item-dark {
  --bs-list-group-color: var(--bs-dark-text-emphasis);
  --bs-list-group-bg: var(--bs-dark-bg-subtle);
  --bs-list-group-border-color: var(--bs-dark-border-subtle);
  --bs-list-group-action-hover-color: var(--bs-dark-text-emphasis);
  --bs-list-group-action-hover-bg: color-mix(in srgb, var(--bs-dark-bg-subtle), black 5%);
  --bs-list-group-action-active-color: var(--bs-dark-text-emphasis);
  --bs-list-group-action-active-bg: var(--bs-dark-bg-subtle);
  --bs-list-group-active-color: var(--bs-dark-text);
  --bs-list-group-active-bg: var(--bs-dark);
  --bs-list-group-active-border-color: var(--bs-dark);
  }


/* ============================================================================
COMPONENTES - PROGRESS BARS
============================================================================ */

  .progress-bar.bg-primary {
  color: var(--bs-primary-text);
  }

  .progress-bar.bg-secondary {
  color: var(--bs-secondary-text);
  }

  .progress-bar.bg-success {
  color: var(--bs-success-text);
  }

  .progress-bar.bg-info {
  color: var(--bs-info-text);
  }

  .progress-bar.bg-warning {
  color: var(--bs-warning-text);
  }

  .progress-bar.bg-danger {
  color: var(--bs-danger-text);
  }

  .progress-bar.bg-light {
  color: var(--bs-light-text);
  }

  .progress-bar.bg-dark {
  color: var(--bs-dark-text);
  }


/* ============================================================================
COMPONENTES - NAVS Y TABS
============================================================================ */

.nav-pills .nav-link.active {
background-color: var(--bs-primary);
color: var(--bs-primary-text);
}

/* ============================================================================
COMPONENTES - PAGINATION
============================================================================ */

.page-link {
--bs-pagination-color: var(--bs-link-color);
--bs-pagination-hover-color: var(--bs-link-hover-color);
--bs-pagination-focus-color: var(--bs-link-hover-color);
--bs-pagination-active-bg: var(--bs-primary);
--bs-pagination-active-border-color: var(--bs-primary);
}

/* ============================================================================
UTILIDADES - COLORES DE TEXTO
============================================================================ */

  .text-primary {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-primary-rgb), var(--bs-text-opacity)) !important;
  }

  .text-bg-primary {
  color: var(--bs-primary-text) !important;
  background-color: RGBA(var(--bs-primary-rgb), var(--bs-bg-opacity, 1)) !important;
  }

  .text-secondary {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-secondary-rgb), var(--bs-text-opacity)) !important;
  }

  .text-bg-secondary {
  color: var(--bs-secondary-text) !important;
  background-color: RGBA(var(--bs-secondary-rgb), var(--bs-bg-opacity, 1)) !important;
  }

  .text-success {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-success-rgb), var(--bs-text-opacity)) !important;
  }

  .text-bg-success {
  color: var(--bs-success-text) !important;
  background-color: RGBA(var(--bs-success-rgb), var(--bs-bg-opacity, 1)) !important;
  }

  .text-info {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-info-rgb), var(--bs-text-opacity)) !important;
  }

  .text-bg-info {
  color: var(--bs-info-text) !important;
  background-color: RGBA(var(--bs-info-rgb), var(--bs-bg-opacity, 1)) !important;
  }

  .text-warning {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-warning-rgb), var(--bs-text-opacity)) !important;
  }

  .text-bg-warning {
  color: var(--bs-warning-text) !important;
  background-color: RGBA(var(--bs-warning-rgb), var(--bs-bg-opacity, 1)) !important;
  }

  .text-danger {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-danger-rgb), var(--bs-text-opacity)) !important;
  }

  .text-bg-danger {
  color: var(--bs-danger-text) !important;
  background-color: RGBA(var(--bs-danger-rgb), var(--bs-bg-opacity, 1)) !important;
  }

  .text-light {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-light-rgb), var(--bs-text-opacity)) !important;
  }

  .text-bg-light {
  color: var(--bs-light-text) !important;
  background-color: RGBA(var(--bs-light-rgb), var(--bs-bg-opacity, 1)) !important;
  }

  .text-dark {
  --bs-text-opacity: 1;
  color: rgba(var(--bs-dark-rgb), var(--bs-text-opacity)) !important;
  }

  .text-bg-dark {
  color: var(--bs-dark-text) !important;
  background-color: RGBA(var(--bs-dark-rgb), var(--bs-bg-opacity, 1)) !important;
  }


/* ============================================================================
UTILIDADES - FONDOS
============================================================================ */

  .bg-primary {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity)) !important;
  }

  .bg-secondary {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-secondary-rgb), var(--bs-bg-opacity)) !important;
  }

  .bg-success {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-success-rgb), var(--bs-bg-opacity)) !important;
  }

  .bg-info {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-info-rgb), var(--bs-bg-opacity)) !important;
  }

  .bg-warning {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-warning-rgb), var(--bs-bg-opacity)) !important;
  }

  .bg-danger {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-danger-rgb), var(--bs-bg-opacity)) !important;
  }

  .bg-light {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
  }

  .bg-dark {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity)) !important;
  }


/* ============================================================================
UTILIDADES - BORDES
============================================================================ */

  .border-primary {
  --bs-border-opacity: 1;
  border-color: rgba(var(--bs-primary-rgb), var(--bs-border-opacity)) !important;
  }

  .border-secondary {
  --bs-border-opacity: 1;
  border-color: rgba(var(--bs-secondary-rgb), var(--bs-border-opacity)) !important;
  }

  .border-success {
  --bs-border-opacity: 1;
  border-color: rgba(var(--bs-success-rgb), var(--bs-border-opacity)) !important;
  }

  .border-info {
  --bs-border-opacity: 1;
  border-color: rgba(var(--bs-info-rgb), var(--bs-border-opacity)) !important;
  }

  .border-warning {
  --bs-border-opacity: 1;
  border-color: rgba(var(--bs-warning-rgb), var(--bs-border-opacity)) !important;
  }

  .border-danger {
  --bs-border-opacity: 1;
  border-color: rgba(var(--bs-danger-rgb), var(--bs-border-opacity)) !important;
  }

  .border-light {
  --bs-border-opacity: 1;
  border-color: rgba(var(--bs-light-rgb), var(--bs-border-opacity)) !important;
  }

  .border-dark {
  --bs-border-opacity: 1;
  border-color: rgba(var(--bs-dark-rgb), var(--bs-border-opacity)) !important;
  }


/* ============================================================================
FIN DEL CSS DINÁMICO
============================================================================ */