/**
 * main.css - CSS Entry Point for Nacom Goya Design System
 *
 * This file establishes the CSS cascade layer order and imports
 * all stylesheets in the correct priority sequence.
 *
 * Layer Priority (lowest to highest):
 * 1. bootstrap - Self-hosted Bootstrap 5.3.3 (lowest priority)
 * 2. reset     - Browser normalization
 * 3. tokens    - Design tokens (colors, spacing, typography)
 * 4. base      - Bootstrap overrides, global defaults
 * 5. components - Reusable UI components (buttons, cards, etc.)
 * 6. modules   - Feature-specific styles (carteira, financeiro, etc.)
 * 7. utilities - Utility classes (spacing, visibility, etc.)
 *
 * IMPORTANT: The @layer statement MUST be the first rule.
 * All @import statements MUST come after @layer and before any other rules.
 *
 * Browser Support: 96%+ (all modern browsers since March 2022)
 * Reference: https://developer.mozilla.org/en-US/docs/Web/CSS/@layer
 */

/* ═══════════════════════════════════════════════════════════════════════════
   LAYER ORDER DECLARATION (MUST BE FIRST)
   Lower layers have lower specificity, higher layers can override without !important
   ═══════════════════════════════════════════════════════════════════════════ */

@layer bootstrap, reset, tokens, base, components, modules, utilities;

/* ═══════════════════════════════════════════════════════════════════════════
   BOOTSTRAP (self-hosted, lowest layer)
   Loaded inside @layer so our components/modules can override without !important
   ═══════════════════════════════════════════════════════════════════════════ */

@import url('./vendor/bootstrap.min.css') layer(bootstrap);

/* ═══════════════════════════════════════════════════════════════════════════
   FONTS (unlayered - must be available to all layers)
   Moved from bootstrap-overrides.css
   ═══════════════════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&family=IBM+Plex+Sans:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

/* ═══════════════════════════════════════════════════════════════════════════
   LAYER IMPORTS
   ═══════════════════════════════════════════════════════════════════════════ */

/* Tokens - Design system variables */
@import url('./tokens/_design-tokens.css') layer(tokens);

/* Base - Bootstrap overrides and global defaults */
@import url('./base/_bootstrap-overrides.css') layer(base);
@import url('./base/_navbar.css') layer(base);

/* Components - Reusable UI patterns */
@import url('./components/_buttons.css') layer(components);
@import url('./components/_cards.css') layer(components);
@import url('./components/_badges.css') layer(components);
@import url('./components/_modals.css') layer(components);
@import url('./components/_forms.css') layer(components);
@import url('./components/_tables.css') layer(components);
@import url('./components/_tags.css') layer(components);
@import url('./components/_layout.css') layer(components);

/* Modules - Feature-specific styles */
@import url('./modules/_financeiro.css') layer(modules);
@import url('./modules/_carteira.css') layer(modules);
@import url('./modules/_embarques.css') layer(modules);
@import url('./modules/_pallet.css') layer(modules);
@import url('./modules/_pallet-unified.css') layer(modules);
@import url('./modules/_recebimento.css') layer(modules);
@import url('./modules/_portal.css') layer(modules);
@import url('./modules/_fretes.css') layer(modules);
@import url('./modules/_bi.css') layer(modules);
@import url('./modules/_motochefe.css') layer(modules);
@import url('./modules/_manufatura.css') layer(modules);
@import url('./modules/_rastreamento.css') layer(modules);
@import url('./modules/_rastreamento-standalone.css') layer(modules);
@import url('./modules/_devolucao.css') layer(modules);
@import url('./modules/_monitoramento.css') layer(modules);
@import url('./modules/_insights.css') layer(modules);
@import url('./modules/_carvia.css') layer(modules);
@import url('./modules/_seguranca.css') layer(modules);
@import url('./financeiro/premium-effects.css') layer(modules);
@import url('./modules/_comercial.css') layer(modules);
@import url('./modules/_portaria.css') layer(modules);
@import url('./modules/_transportadoras.css') layer(modules);

/* Utilities - Helper classes */
@import url('./utilities/_utilities.css') layer(utilities);
@import url('./utilities/_legacy.css') layer(utilities);

/* ═══════════════════════════════════════════════════════════════════════════
   END OF IMPORTS - No additional rules should be added to this file
   ═══════════════════════════════════════════════════════════════════════════ */
