/*
 * Hoja principal del panel. Solo define el orden de las capas y carga los demás archivos: el orden
 * de las capas decide qué estilo gana (no la especificidad), así una regla de "pages" le gana a una
 * de "components" aunque su selector sea más simple, y "utilities" le gana a todo.
 *
 * Reglas: colores, medidas y sombras solo con var(--…) de settings/tokens.css; nombres BEM;
 * cortes de pantalla 1100 · 820 · 520 px. Cada archivo declara su propia capa con @layer.
 * Font Awesome lo cargan los layouts con <link>; la hoja de ApexCharts la agrega
 * js/components/graficos.js cuando hay un gráfico.
 *
 * PENDIENTE (antes de publicar): cada @import es una descarga en cadena. Para producción conviene
 * unir todos los archivos en uno solo respetando este orden.
 */
@layer reset, settings, base, layout, components, integrations, pages, utilities;

@import url("settings/tokens.css");

@import url("base/reset.css");
@import url("base/fonts.css");
@import url("base/elements.css");
@import url("base/content.css");

@import url("layout/shell/shell.css");
@import url("layout/auth/auth.css");
@import url("layout/error-screen/error-screen.css");

@import url("components/icon/icon.css");
@import url("components/button/button.css");
@import url("components/form-field/form-field.css");
@import url("components/notice/notice.css");
@import url("components/card/card.css");
@import url("components/data-table/data-table.css");
@import url("components/empty-state/empty-state.css");
@import url("components/status-pill/status-pill.css");
@import url("components/chip/chip.css");
@import url("components/detail/detail.css");
@import url("components/confirm-dialog/confirm-dialog.css");
@import url("components/danger-zone/danger-zone.css");
@import url("components/chart/chart.css");
@import url("components/chat-thread/chat-thread.css");
@import url("components/dropzone/dropzone.css");
@import url("components/image-field/image-field.css");
@import url("components/product-cell/product-cell.css");
@import url("components/persona/persona.css");
@import url("components/segmented/segmented.css");
@import url("components/shares/shares.css");
@import url("components/cobro/cobro.css");
@import url("components/cuenta/cuenta.css");
@import url("components/pos/pos.css");
@import url("components/option-card/option-card.css");
@import url("components/option-button/option-button.css");
@import url("components/switch/switch.css");
@import url("components/tabs/tabs.css");
@import url("components/avance/avance.css");
@import url("components/robot-averiado/robot-averiado.css");

@import url("integrations/fontawesome.css");

@import url("pages/asistente.css");
@import url("pages/banners.css");
@import url("pages/catalogo.css");
@import url("pages/clientes.css");
@import url("pages/configuracion.css");
@import url("pages/cotizaciones.css");
@import url("pages/cuenta.css");
@import url("pages/dashboard.css");
@import url("pages/metodos-pago.css");
@import url("pages/movimientos.css");
@import url("pages/pedidos.css");
@import url("pages/productos.css");
@import url("pages/punto-venta.css");
@import url("pages/reclamaciones.css");
@import url("pages/reportes.css");
@import url("pages/roles.css");
@import url("pages/usuarios.css");
@import url("pages/ventas.css");

@import url("utilities/accessibility.css");
@import url("utilities/text.css");