/* ┌────────────────────────────────────────────────────────────┐
   │ bal·AM UI Design System                                    │
   │ index.css — entry point                                    │
   ├────────────────────────────────────────────────────────────┤
   │ Version:   2.1.0 · Updated: 2026-06-12                     │
   ├────────────────────────────────────────────────────────────┤
   │ Purpose:   Punto de entrada único del sistema. Declara el  │
   │            orden canónico de capas y carga cada módulo.    │
   │            Cada archivo auto-declara su capa con @layer,   │
   │            por lo que los imports NO usan layer().         │
   │                                                            │
   │ Orden:     reset → foundation → tokens → base → layout     │
   │            → components → patterns → utilities → overrides │
   │                                                            │
   │ Uso:       <link rel="stylesheet" href="index.css">        │
   │            o @import "balam-ui/index.css";                 │
   ├────────────────────────────────────────────────────────────┤
   │ Author:    Aarón Mejía / bal·AM Studio                     │
   └────────────────────────────────────────────────────────────┘ */

/* Orden canónico de capas. Esta declaración manda: la
   especificidad entre capas la define este orden, no el
   orden de los imports ni la especificidad de selectores. */
@layer reset, foundation, tokens, base, layout, components, patterns, pages, utilities, overrides;

/* Tipografías — única dependencia remota; el sistema queda autónomo y las
   páginas sólo enlazan index.css (las @import van al inicio). */
@import url("https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300..500;1,9..144,300..400&family=IBM+Plex+Mono:wght@400;500;700&family=Inter:wght@300;400;500;600&display=swap");

/* ── 1 · Reset ─────────────────────────────────────────────── */
@import "./base/reset.css";

/* ── 2 · Foundation (primitivas: rampas OKLCH, escalas) ────── */
@import "./system/system.css";

/* ── 3 · Tokens (roles semánticos, theming light/dark) ─────── */
@import "./system/tokens.css";

/* ── 4 · Base (elementos HTML, tipografía global) ──────────── */
@import "./base/base.css";

/* ── 5 · Layout (primitivas de composición y shell) ────────── */
@import "./layout/layout.css";
@import "./layout/shell.css";
@import "./layout/topbar.css";
@import "./layout/sidebar.css";
@import "./layout/footer.css";

/* ── 6 · Components ────────────────────────────────────────── */
/* Identidad */
@import "./components/brand.css";
@import "./components/mark.css";

/* Acciones y estado */
@import "./components/buttons.css";
@import "./components/badge.css";
@import "./components/alert.css";
@import "./components/toast.css";
@import "./components/loader.css";
@import "./components/skeleton.css";
@import "./components/progress.css";

/* Entrada de datos */
@import "./components/forms.css";
@import "./components/controls.css";
@import "./components/inputs-extended.css";

/* Contenido y datos */
@import "./components/cards.css";
@import "./components/table.css";
@import "./components/avatar.css";
@import "./components/divider.css";
@import "./components/accordion.css";

/* Superposición */
@import "./components/modal.css";
@import "./components/drawer.css";
@import "./components/tooltip.css";

/* Navegación */
@import "./components/nav.css";
@import "./components/tabs.css";
@import "./components/tabbar.css";
@import "./components/toolbar.css";
@import "./components/wayfinding.css";

/* Dominio: control de obra */
@import "./components/obra.css";

/* Dominio: portal de cliente (contenido) */
@import "./components/activity.css";
@import "./components/ledger.css";
@import "./components/timeline.css";
@import "./components/decision.css";
@import "./components/message.css";
@import "./components/file.css";
@import "./components/lightbox.css";
@import "./components/person.css";
@import "./components/panel.css";
@import "./components/project-card.css";
@import "./components/kpi.css";
@import "./components/action.css";
@import "./components/theme-toggle.css";

/* ── 7 · Patterns (composiciones de pantalla) ──────────────── */
@import "./patterns/forms.css";
@import "./patterns/obra.css";
@import "./patterns/portal-dashboard.css";

/* ── 8 · Pages (composiciones de página completas, scopeadas a body.page-*) */
@import "./pages/home.css";
@import "./pages/obra.css";
@import "./pages/rentas.css";

/* ── 9 · Utilities (gana a components/patterns) ────────────── */
@import "./utilities/display.css";
@import "./utilities/flex.css";
@import "./utilities/position.css";
@import "./utilities/sizing.css";
@import "./utilities/spacing.css";
@import "./utilities/text.css";
@import "./utilities/type.css";

/* ── 10 · Overrides (print · forced-colors · contraste) ─────── */
@import "./overrides.css";