/* ================================================
   ONLY VTC - Main CSS Entry Point
   Unified CSS architecture
   
   This file replaces the old fragmented app.css
   Import order is critical for proper cascade
   ================================================ */

/* ============================================
   LAYER 1: CORE (Foundation)
   Design tokens and base styles
   ============================================ */
@import "./core/variables.css";
@import "./core/reset.css";
@import "./core/typography.css";

/* ============================================
   LAYER 2: LAYOUT (Structure)
   Page structure and grid systems
   ============================================ */
@import "./layout/grid.css";
@import "./layout/containers.css";
@import "./layout/flex.css";

/* ============================================
   LAYER 3: COMPONENTS (UI Elements)
   Reusable UI components
   ============================================ */
@import "./components/buttons.css";
@import "./components/forms.css";
@import "./components/cards.css";
@import "./components/modals.css";
@import "./components/tables.css";
@import "./components/alerts.css";
@import "./components/badges.css";
@import "./components/navbar.css";
@import "./components/sidebar.css";
@import "./components/user-menu.css";
@import "./components/skeleton.css"; /* Added 27/01/2026 */

/* ============================================
   LAYER 4: PAGES (Page-specific)
   Styles specific to certain pages
   ============================================ */
@import "./pages/home.css";
@import "./pages/dashboard.css";
@import "./pages/admin.css";
@import "./pages/auth.css";

/* ============================================
   LAYER 5: THEMES (Dark mode, variants)
/* ============================================
   LAYER 5: THEMES (Dark mode, variants)
   Theme-specific overrides
   ============================================ */
@import "./themes/dark.css";

/* ============================================
   LAYER 6: UTILITIES (Helpers)
   Utility classes for quick styling
   ============================================ */
@import "./utilities/spacing.css";
@import "./utilities/display.css";
@import "./utilities/colors.css";
@import "./utilities/animations.css"; /* Added 27/01/2026 */
@import "./utilities/focus.css"; /* Added 27/01/2026 - Accessibility */

/* ============================================
   MIGRATION COMPLETE!
   
   ✅ Phase 0: Folder structure
   ✅ Phase 1: Core (variables, reset, typography)
   ✅ Phase 2: Layout (grid, containers, flex)
   ✅ Phase 3: Components (buttons, forms, cards, skeleton)
   ✅ Phase 4: Pages (home, dashboard, admin, auth)
   ✅ Phase 5: Themes (dark mode)
   ✅ Phase 6: Utilities (spacing, display, colors, animations, focus)
   
   Updated: 27/01/2026 - Added skeleton.css, animations.css, focus.css
   ============================================ */