/**
 * ============================================
 * MSI STUDIO DESIGN SYSTEM
 * ============================================
 *
 * Versión: 1.0.0
 * Autor: MSI Studio
 *
 * Este es el archivo principal del design system.
 * Importa todos los módulos en el orden correcto.
 *
 * ESTRUCTURA:
 * 1. Tokens      - Variables CSS (colores, tipografía, spacing, etc.)
 * 2. Foundations - Reset CSS, estilos base, grid system
 * 3. Components  - Componentes reutilizables (buttons, cards, etc.)
 * 4. Utilities   - Clases utilitarias estilo Tailwind
 *
 * USO:
 *
 * Opción 1 - Importar todo:
 * @import 'design-system/design-system.css';
 *
 * Opción 2 - Importar selectivo:
 * @import 'design-system/tokens.css';
 * @import 'design-system/foundations.css';
 * @import 'design-system/components.css';
 *
 * Opción 3 - Solo tokens y utilities:
 * @import 'design-system/tokens.css';
 * @import 'design-system/utilities.css';
 */

/* ============================================
   LAYER 1: DESIGN TOKENS
   VARIABLES CSS FUNDAMENTALES
   ============================================ */

@import 'tokens.css';

/* ============================================
   LAYER 2: FOUNDATIONS
   RESET, ESTILOS BASE, GRID SYSTEM
   ============================================ */

@import 'foundations.css';

/* ============================================
   LAYER 3: COMPONENTS
   COMPONENTES REUTILIZABLES
   ============================================ */

@import 'components.css';

/* ============================================
   LAYER 3.5: FORMS
   ELEMENTOS DE FORMULARIOS
   ============================================ */

@import 'forms.css';

/* ============================================
   LAYER 3.6: TABLES
   TABLAS Y ELEMENTOS RELACIONADOS
   ============================================ */

@import 'tables.css';

/* ============================================
   LAYER 3.7: MODALS
   MODALES Y DIÁLOGOS
   ============================================ */

@import 'modals.css';

/* ============================================
   LAYER 3.8: TABS
   COMPONENTES DE NAVEGACIÓN POR PESTAÑAS
   ============================================ */

@import 'tabs.css';

/* ============================================
   LAYER 3.9: SELECT2
   INTEGRACIÓN CON SELECT2.JS (ADVANCED SELECTS)
   ============================================ */

@import './select2/select2.css';

/* ============================================
   LAYER 3.10: BOOTSTRAP COMPONENTS
   COMPONENTES ADICIONALES DE BOOTSTRAP ADAPTADOS
   ============================================ */

@import './bootstrap/bootstrap-components.css';

/* ============================================
   LAYER 3.11: DATATABLES
   ESTILOS PARA DATATABLES.JS
   ============================================ */
   
@import './dataTables/datatables.css';

/* ============================================
   LAYER 3.12: FULLCALENDAR
   ESTILOS PARA FULLCALENDAR.JS
   ============================================ */

@import 'fullcalendar.css';

/* ============================================
   LAYER 4: UTILITIES
   CLASES UTILITARIAS
   ============================================ */

@import 'utilities.css';