/* ═══════════════════════════════════════════════════════════════════════════
   flow.css — THE app stylesheet (FL-134 P2). One <link> in the layouts;
   everything else arrives through cascade layers, lowest precedence first:

     foundation  css/flow-core.css (ours, FL-232 — scanner-extracted, only
                 the rules Flow's own markup/JS still reaches survive; see
                 that file's own header) + the tom-select and litepicker
                 vendor sheets
     base        design tokens (tokens.css :root) + html/body (base.css)
     components  all flow component styling, split by concern in components/*
                 (beats foundation BY LAYER ORDER — no !important needed)
     utilities   small single-purpose helper classes
     overrides   QUARANTINE — the only layer where !important is permitted,
                 each with a reason comment + TODO

   ⚠️ Unlayered CSS beats ALL layers. Never add a plain <link>/<style> that
   competes with these rules — new page CSS goes in css/pages/* wrapped in
   @layer components { … } (see Flow — Plans §Audit 1).
   ⚠️ components/* are imported in SOURCE ORDER — the concatenation equals the
   old monolithic components.css, so same-specificity cascade is preserved.
   Keep new component files in the right ordinal slot; don't reorder existing.
   ═══════════════════════════════════════════════════════════════════════════ */
@layer foundation, base, components, utilities, overrides;

@import url(flow-core.css) layer(foundation);
@import url(../../tom-select/dist/css/tom-select.bootstrap5.min.css) layer(foundation);
@import url(../../litepicker/dist/css/litepicker.css) layer(foundation);

@import url(tokens.css) layer(base);
@import url(base.css) layer(base);
@import url(fonts.css) layer(base);
@import url(generated-utilities-base.css) layer(base);
@import url(generated-utilities-top.css) layer(utilities);

@import url(components/00-flow-tokens.css) layer(components);
@import url(components/01-forms-controls.css) layer(components);
@import url(components/02-badges-navbar.css) layer(components);
@import url(components/03-inputs-datepicker.css) layer(components);
@import url(components/04-input-states.css) layer(components);
@import url(components/05-buttons.css) layer(components);
@import url(components/06-tables.css) layer(components);
@import url(components/07-cards-tabs.css) layer(components);
@import url(components/08-scrollbar-pagination.css) layer(components);
@import url(components/09-tom-select.css) layer(components);
@import url(components/10-modals-misc.css) layer(components);
@import url(components/11-bulk-select.css) layer(components);
@import url(components/12-calculator.css) layer(components);
@import url(components/13-misc-pages.css) layer(components);
@import url(components/14-icons.css) layer(components);
@import url(components/15-wizard.css) layer(components);
@import url(components/16-section-nav.css) layer(components);
@import url(pages/org-chart.css) layer(components);

@import url(utilities.css) layer(utilities);
@import url(overrides.css) layer(overrides);
