/* 4foodies - CSS Principal Modular */

/* 1️⃣ Base - Fundamentos (siempre cargados) */
@import url('base/variables.css');
@import url('base/reset.css');
@import url('base/typography.css');

/* 2️⃣ Layout - Estructura principal (siempre cargados) */
@import url('layout/header.css');
@import url('layout/sections.css');

/* 3️⃣ Componentes básicos (siempre cargados) */
@import url('components/cards.css');
@import url('components/buttons.css');
@import url('components/forms.css');
@import url('components/badges.css');
@import url('components/alerts.css');

/*
   ⚠️ CARGA CONDICIONAL:

   Los siguientes archivos deben cargarse solo cuando sean necesarios:

   📦 COMPONENTES ESPECÍFICOS:
   - components/badges.css     → Para ratings, badges, pagination
   - components/alerts.css     → Para flash messages, notifications

   🎨 TRANSICIONES (OPCIONAL):
   - utilities/transitions.css → Para transiciones básicas sin movimiento

   📄 PÁGINAS ESPECÍFICAS:
   - pages/home.css           → Solo en página principal
   - pages/restaurants.css    → Solo en páginas de restaurantes
   - pages/maps.css           → Solo en páginas con mapas
   - pages/watchlist.css      → Solo en listas de restaurantes
   - pages/auth.css           → Solo en login/registro
   - pages/users.css          → Solo en perfiles de usuario
   - pages/admin.css          → Solo en panel administrativo

   📱 EJEMPLO DE USO EN TEMPLATES:

   {% block component_css %}
   <link href="{{ url_for('static', filename='css/components/badges.css') }}" rel="stylesheet">
   <link href="{{ url_for('static', filename='css/pages/restaurants.css') }}" rel="stylesheet">
   {% endblock %}
*/