/*
 * Punto de entrada de los estilos. Es el unico archivo CSS que enlaza el HTML.
 *
 * El orden importa: primero el vocabulario (tokens), despues los elementos
 * base, despues la estructura de las pantallas y por ultimo los componentes,
 * que son los que tienen que poder ajustar lo anterior.
 */

@import "fonts.css";
@import "tokens.css";
@import "base.css";

/* --- Estructura de pantalla --- */
@import "layout/site-header.css";
@import "layout/site-footer.css";
@import "layout/hero.css";
@import "layout/story.css";
@import "layout/grids.css";
@import "layout/panel.css";
@import "layout/bare.css";
@import "layout/kiosk.css";
@import "layout/agenda.css";
@import "layout/queue.css";
@import "layout/cash.css";
@import "layout/booking.css";
@import "layout/reports.css";
@import "layout/drawer.css";

/* --- Componentes reutilizables --- */
@import "components/button.css";
@import "components/badge.css";
@import "components/alert.css";
@import "components/flash-stack.css";
@import "components/field.css";
@import "components/combo.css";
@import "components/datefield.css";
@import "components/field-image.css";
@import "components/logo.css";
@import "components/section-heading.css";
@import "components/service-item.css";
@import "components/branch-card.css";
@import "components/step-card.css";
@import "components/plan-card.css";
@import "components/membership.css";
@import "components/stat-card.css";
@import "components/nav-item.css";
@import "components/table.css";
@import "components/empty-state.css";
@import "components/panel-toolbar.css";
@import "components/confirm-action.css";
@import "components/form-card.css";
@import "components/inline-form.css";
@import "components/filter-bar.css";
@import "components/link-card.css";
@import "components/tabs.css";
@import "components/steps.css";
@import "components/scope-bar.css";
@import "components/kiosk-link.css";
@import "components/sale-barber.css";