/* ========================================
   SitiJY Driver PWA - Main Stylesheet
   ARCHITECTURE.md Rule 4 Compliant: ≤400 lines
   
   Modular CSS Architecture (Total: ~1,100 lines)
   - variables.css (85 lines): CSS custom properties
   - layout.css (330 lines): Screen structure, header, footer
   - components.css (274 lines): Buttons, cards, modals, forms
   - timeline.css (298 lines): Timeline items, bottom sheet
   - map.css (104 lines): Map container, controls, markers
   - outdoor-visibility.css (18 lines): Phase 2-4 enhancements
   
   Import order is critical:
   1. Variables must load first (CSS custom properties)
   2. Layout provides base structure
   3. Components build on layout
   4. Timeline & Map are feature-specific
   5. Outdoor visibility overrides for enhancement
   ======================================== */

/* Layer 1: CSS Variables (Design Tokens) */
@import url('variables.css');

/* Layer 2: Layout & Base Styles */
@import url('layout.css');

/* Layer 3: Reusable Components */
@import url('components.css');
@import url('slide-to-confirm.css');
@import url('inline-style-replacements.css');

/* Layer 4: Feature-Specific Styles */
@import url('timeline.css');
@import url('delivery-modal.css');
@import url('start-location.css');
@import url('map.css');

/* Layer 5: Enhancement Overrides */
@import url('outdoor-visibility.css');