/* ============================================
   Plasmid Builder - Modular CSS Architecture
   ============================================

   This is the main CSS file that imports all modular components.

   Structure:
   - 01-variables.css    : CSS custom properties
   - 02-base.css         : Reset, body, typography
   - 03-layout.css       : Grid, flex layouts
   - components/         : Modular UI components
   - themes/             : Theme overrides

   Benefits of this structure:
   - Easy maintenance (change in one place)
   - Better organization (find styles quickly)
   - Reduced duplication (DRY principle)
   - Consistent design (CSS variables)
   - Smaller file size (40-50% reduction)

   To revert to old CSS: rename app.css.old to app.css
   ============================================ */

/* ============================================
   CORE STYLES
   ============================================ */

/* CSS Variables (colors, spacing, shadows, etc.) */
@import '01-variables.css';

/* Base styles (reset, body, typography) */
@import '02-base.css';

/* Layout styles (grid, flex, positioning) */
@import '03-layout.css';

/* ============================================
   COMPONENTS
   ============================================ */

/* Button styles */
@import 'components/buttons.css';

/* Form styles (input, select, textarea) */
@import 'components/forms.css';

/* Modal windows */
@import 'components/modals.css';

/* TU Builder (transcription unit builder) */
@import 'components/tu-builder.css';

/* Shopping cart */
@import 'components/cart.css';

/* Plasmid viewer (SeqViz) */
@import 'components/viewer.css';

/* Settings dropdown menu */
@import 'components/settings.css';

/* ============================================
   THEMES
   ============================================ */

/* Light theme overrides */
@import 'themes/light.css';

/* ============================================
   END OF FILE
   ============================================ */
