/* ==========================================================================
   styles.css — the entry point. NO RULES LIVE HERE.
   ==========================================================================
   This file was 7,678 lines, which made every change a scroll-hunt. It is now
   nine modules of 538-1,257 lines each, cut at the existing section banners so
   no rule was split mid-block.

   ⛔ THE IMPORT ORDER IS THE CASCADE. These nine are listed in exactly the order
   their rules appeared in the original file. Re-ordering an @import changes which
   declaration wins and produces a silent visual regression that CI cannot catch.
   Verified after the split: computed styles on 8 representative pages are
   byte-identical to the pre-split baseline.

   ⚠️ LOCAL DEV ONLY: the browser fetches each @import SEPARATELY, so an edited module can
   keep serving from cache while styles.css itself is refetched. base.html used to carry a
   per-request `?v=` query, which never propagated to these imports anyway — and which
   disabled caching of every stylesheet on every page. It was removed in #2751.

   ⛔ Do NOT "fix" that by appending `?m=<number>` to these @imports. That was tried
   2026-09-07 and is worse than the problem: this is a STATIC file, so Django cannot
   template it, which means the number is a frozen literal that busts the cache
   exactly once and never again — while looking permanently solved. It also breaks
   every guard that resolves this import list against real filenames
   (`test_dark_scheme_cascade_1614.py:81` asserts each imported file exists).

   ★ The right answer for local development is a hard reload (Ctrl-Shift-R), which
   refetches the whole @import tree. In production the question does not arise: the
   manifest storage hashes this file AND rewrites every @import above to its own hashed
   name (`_01-base-and-tokens.7c1eb63d906b.css`), so a changed module is a changed URL.
   That is why no query string is needed, and why adding one back is a regression (#2751).

   Add a new module: append an @import at the END unless the rule must be beaten by
   something later, and say why in the module header.
   ========================================================================== */

@import url("_01-base-and-tokens.7c1eb63d906b.css");
@import url("_02-buttons-and-icons.ecfddfa83ea0.css");
@import url("_03-layout-and-admin.7f1560d297c5.css");
@import url("_04-forms-and-policy.f5d103a7b4da.css");
@import url("_05-guide-and-shell.640a190f47ad.css");
@import url("_06-tables-and-tooltips.0542e1b12d76.css");
@import url("_07-detail-and-fluid.371dfa649914.css");
@import url("_08-toolbar-and-2168.8c183e624cb2.css");
@import url("_09-a11y-and-touch.608e90ec74a7.css");

/* The approved component layer (T2). LAST on purpose: several older fragments
   style these same classes earlier, and appending is what makes this the winner.
   ⚠️ Self-contained — it consumes the app's own tokens and depends on nothing
   outside static/css, so the design survives when docs/design/samples is deleted. */
@import url("_10-components.97e543ec60bb.css");

/* Part 2 of the component layer — surfaces, the shared table definition, and the
   button intent groups. ⛔ Must follow _10-components.css immediately: the table
   rules here align against the column roles declared there. */
@import url("_10b-components-surfaces.0a52c41b118c.css");

/* The LOA authorization form component family, de-duplicated out of the inline
   <style> blocks of loa_send / loa_email_form / loa_record_verbal /
   loa_upload_external, where the same ~30 rules were copy-pasted four times.
   ⛔ Must stay LAST: those template blocks render after every stylesheet, so
   importing last is what reproduces the cascade position they held. */
@import url("_10c-loa-forms.2ab252f5a780.css");

/* The auth/reset page family (.reset-*, .auth-links a, .message) and the
   payment-preview banner strip (.preview-*), de-duplicated out of the inline
   <style> blocks of 12 accounts/ templates.
   ⛔ Must stay LAST: those template blocks render after every stylesheet, so
   importing last is what reproduces the cascade position they held — .message
   here deliberately beats the centered definition in _02-buttons-and-icons.css. */
@import url("_10d-auth-and-preview.5838d38d8565.css");

/* The shared dialog interior — `.modal-content` surface, header/body/footer bands,
   the close button and the action row, de-duplicated out of the inline <style>
   blocks of 9 templates where the same dialog was declared up to seven different
   ways. ⛔ Must follow _10b: that module owns the OVERLAY (backdrop, z-index, the
   hide-state names) and this one deliberately does not repeat it. It must also stay
   after _07-detail-and-fluid.css, which owns the fluid WIDTH and the centring. */
@import url("_10e-modals.ff9080ec06a2.css");

/* The customer dashboard's whole page, moved out of a 1,447-line inline <style>
   block — the largest in the project, where CSS outweighed markup four to one.
   Two files because one would exceed the per-module line ceiling; they are one
   block cut at a section boundary, so _10g MUST stay immediately after _10f.
   ⛔ Last in the _10* group deliberately: these rules beat _01.._10e on a tie,
   which is the relationship they had with those modules from inside the template.
   They do NOT beat _11/_12/_13 — those are separate <link> tags loaded after this
   stylesheet. That was checked before the move: 13 class names are shared with the
   theme layer, every one of those theme rules is scoped `body.laser-theme` and so
   already outranked the page rules on specificity, and there were zero
   equal-specificity ties. See the header of _10f for the full cascade note. */
@import url("_10f-customer-dashboard.c515c9e50ca0.css");
@import url("_10g-customer-dashboard-2.b9a74fdda4c7.css");

/* The CSR dashboard and the organization-users screen, each moved out of its own
   template's inline <style> block (1,256 and 932 lines). Page modules, not shared
   components — the selectors describe one screen apiece and were moved verbatim,
   in order, with nothing consolidated.
   ⛔ Both files deliberately leave rules BEHIND in their templates: anything that
   shares a target and a property with _11/_12/_13. Those three load as their own
   <link> tags AFTER this stylesheet, and every selector in them is scoped
   `body.laser-theme`, so a page rule moved here loses a contest it currently wins
   on source order. The contested selectors are listed in each file's header. */
@import url("_10h-csr-dashboard.910e29705315.css");
@import url("_10i-org-users.1788386e2c94.css");
