/* ============================================
   Main CSS File - Import all modules
   Order matters: Base → Layout → Components → Pages
   ============================================ */

/* 1. Base Layer: Design tokens and reset */
@import url('base/variables.css');
@import url('base/reset.css');

/* 2. Layout Layer: Page containers */
@import url('layout/containers.css');

/* 3. Component Layer: Reusable UI elements */
@import url('components/buttons.css');
@import url('components/cards.css');
@import url('components/filters.css');
@import url('components/multiselect.css');
@import url('components/navigation.css');
@import url('components/animations.css');

/* 4. Page Layer: Page-specific styles */
@import url('pages/home.css');
@import url('pages/questions-by-topic.css');
@import url('pages/past-papers.css');
@import url('pages/viewer.css');
@import url('pages/tutorials.css');

/* ============================================
   Global Helper Classes
   ============================================ */
.container {
  max-width: var(--container-width);
  margin: 0 auto;
  padding: 0 20px;
}