@incursa/ui-kit 0.4.1 → 1.0.1

package/AI-AGENT-INSTRUCTIONS.md

@@ -8,8 +8,8 @@ Repository brand assets live under `assets/brand/`. Prefer those local files whe
 
 - Prefer `dist/inc-design-language.css` if the target app already has working HTML and only needs the look.
 - Prefer `src/inc-design-language.scss` if you need to tune tokens, density, or Bootstrap defaults.
-- Prefer `dist/inc-design-language.js` only for stateful UI primitives such as menus, tabs, or collapsible sections.
-- Prefer `reference.html` when you need copy/paste starter markup for a supported control before composing a full page.
+- Prefer `dist/inc-design-language.js` only for stateful UI primitives such as menus, tabs, collapsible sections, modal/offcanvas shells, native dialog launch hooks, and auto-refresh widgets.
+- Prefer `reference.html` when you need copy/paste starter markup for a supported control or page-frame primitive before composing a full page.
 - Prefer `states.html`, `forms-and-validation.html`, and `data-grid-advanced.html` when the target screen is workflow-heavy and you need realistic composition patterns, not isolated snippets.
 
 ## Naming rules
@@ -34,11 +34,11 @@ Repository brand assets live under `assets/brand/`. Prefer those local files whe
   Use `inc-card` for plain cards and `inc-header-body inc-header-body--card` for titled sections with actions.
   Use `inc-header-body--table-body` when the body contains a table and should keep section padding without adding extra bottom table margin.
 - App layout:
-  Use `inc-app-shell`, `inc-footer-bar`, `inc-navbar`, `inc-breadcrumb`, `inc-nav-triad`, and `inc-sidebar-menu` when you need an opinionated application frame instead of isolated components.
+  Use `inc-app-shell`, `inc-page`, `inc-breadcrumb-body`, `inc-footer-bar`, `inc-footer-bar__menu`, `inc-footer-bar__meta`, `inc-navbar`, `inc-breadcrumb`, `inc-nav-triad`, and `inc-sidebar-menu` when you need an opinionated application frame instead of isolated components.
 - States and workflow:
   Use `inc-state-panel`, `inc-permission-banner`, `inc-toast-card`, `inc-timeline`, `inc-file-dropzone`, `inc-file-row`, and `inc-key-value` for non-happy-path and detail-heavy B2B flows.
 - Interaction:
-  Use `data-inc-toggle="menu"`, `data-inc-toggle="tab"`, and `data-inc-toggle="collapse"` with `data-inc-target="#target-id"` when you want the optional vanilla-JS helper to wire behavior.
+  Use `data-inc-toggle="menu"`, `data-inc-toggle="tab"`, and `data-inc-toggle="collapse"` with `data-inc-target="#target-id"` when you want the optional vanilla-JS helper to wire behavior. Use `data-inc-toggle="modal"`, `data-inc-toggle="offcanvas"`, `data-inc-dismiss="modal"`, `data-inc-dismiss="offcanvas"`, and `data-inc-native-dialog-open` only when the helper-managed or launch-hook contract is the intended path.
 - Native interaction:
   Use `details.inc-disclosure` for section stacks, `details.inc-native-menu` for lightweight menus, and `dialog.inc-native-dialog` for native modal surfaces.
 - Status:
@@ -55,6 +55,7 @@ Repository brand assets live under `assets/brand/`. Prefer those local files whe
 
 ## Packaging
 
+- Use `npm run verify` before versioning when you want to rebuild, smoke-test, and dry-run the package.
 - Use `npm run build` to rebuild distributables.
 - Use `npm pack` or `npm run package` to produce a local installable tarball.
 - The repository is licensed under Apache 2.0.

package/LLMS.txt

@@ -10,32 +10,47 @@ Package identity:
 
 Fast path:
 - Use `dist/inc-design-language.css` if the target app already has working HTML and mainly needs the visual language.
-- Use `dist/inc-design-language.js` only for stateful primitives such as menus, tabs, and collapsible sections.
+- Use `dist/inc-design-language.js` only for stateful primitives such as menus, tabs, collapsible sections, auto-refresh widgets, the native dialog launch hook, and legacy modal/offcanvas shells.
 - Use `src/inc-design-language.scss` if the consumer needs to tune tokens, theme variables, density, or Bootstrap defaults.
 
 Primary files:
 - `dist/inc-design-language.css`: compiled standalone CSS output.
-- `dist/inc-design-language.js`: optional dependency-free helper for menus, tabs, and collapsible sections.
+- `dist/inc-design-language.js`: optional dependency-free helper for menus, tabs, collapsible sections, auto-refresh widgets, the native dialog launch hook, and legacy modal/offcanvas shells.
 - `src/inc-design-language.scss`: main SCSS entrypoint.
 - `src/_inc-theme.scss`: brand-facing fonts, palette, semantic surfaces, and text colors.
 - `src/_inc-tokens.scss`: deeper token and Bootstrap-facing overrides.
-- `reference.html`: copy/paste catalog for standard controls and markup patterns.
+- `reference.html`: copy/paste catalog for standard controls, page-frame primitives, metric variants, and overlay shells.
+- `specs/architecture/_index.md`: design-rationale layer for token boundaries, helper scope, and package intent.
+- `specs/requirements/ui-kit/_index.md`: first-pass Spec Trace suite for the UI kit.
+- `specs/requirements/ui-kit/REQUIREMENT-GAPS.md`: unresolved requirement gaps and follow-up questions.
+- `specs/requirements/ui-kit/SPEC-UIK-STD.md`: public surface standards for `inc-` naming and accessible interactive behavior.
+- `specs/requirements/ui-kit/SPEC-UIK-CNV.md`: shared control conventions for base-plus-modifier surfaces, density suffixes, and state hooks.
+- `specs/verification/ui-kit/_index.md`: auditable source-review and smoke-validation baseline for the UI kit surface.
 - `states.html`, `forms-and-validation.html`, `data-grid-advanced.html`, `overlay-workflows.html`: workflow-heavy composition patterns.
 - `demo.html`, `work-queue.html`, `record-detail.html`, `native-patterns.html`: fuller page examples.
 
 Public naming rules:
 - Use the `inc-` prefix for public classes.
 - Keep the existing BEM structure: `inc-block`, `inc-block__element`, `inc-block--modifier`.
+- Use the shared control modifier grammar for density, expansion, and state hooks instead of inventing one-off suffixes.
+- Avoid nested element names such as `inc-form__check__input`; keep public element names one level deep.
+- Preserve native semantics and accessible focus/disabled/hidden states for interactive surfaces.
+- Treat light and dark as global theme concerns activated through `data-bs-theme` on the root scope, not public component-class modifiers.
 
 Core primitives:
+- Typography: use `inc-text`, `inc-heading`, `inc-data`, `inc-button-text`, `inc-form-text`, and `inc-table-text` for public text helpers.
 - Tables: start with `inc-table`; use modifiers such as `inc-table__cell--numeric`, `inc-table__cell--action`, `inc-table__cell--min`, and `inc-table__cell--expand`.
-- Buttons: use `inc-btn` with semantic modifiers such as `inc-btn--primary`, `inc-btn--secondary`, and `inc-btn--danger`. Use `inc-btn--micro` for in-row actions.
-- Forms: use `inc-form--inline`, `inc-form__field`, `inc-form__group`, `inc-input-group`, `inc-form__hint`, `inc-form__feedback--error`, `inc-form__feedback--success`, and `inc-form__error-summary`.
+- Buttons: use `inc-btn` with semantic modifiers such as `inc-btn--primary`, `inc-btn--secondary`, and `inc-btn--danger`. Keep the visual treatment identical on `<button>` and `<a>` markup, use `<button>` for in-place actions, use `<a>` for navigation, and use `inc-btn--micro` for in-row actions.
+- Forms: use `inc-form--inline`, `inc-form__field`, `inc-form__fieldset`, `inc-form__legend`, `inc-form__control`, `inc-form__select`, `inc-input-group`, `inc-readonly-field`, `inc-form-text`, `inc-form__feedback--error`, `inc-form__feedback--success`, and `inc-form__error-summary`.
+- Form choices: use `inc-form__check`, `inc-form__check-input`, `inc-form__check-label`, `inc-form__switch`, and `inc-form__choices` for checkbox and radio groups.
+- Control conventions: use the shared base-plus-modifier patterns from `SPEC-UIK-CNV.md` for density, expansion, and state hooks.
+- Control density: use the shared `inc-control-density-micro-*` tokens for compact buttons, inputs, selects, and input groups instead of hard-coded micro values.
 - Filter bars: use `inc-filter-bar`, `inc-filter-chip`, and `inc-bulk-bar`.
 - Cards and shells: use `inc-card` for plain cards. Use `inc-header-body` for titled sections with actions. Use `inc-header-body--table-body` when the body contains a table and should keep body padding without extra bottom table margin.
-- App layout: use `inc-app-shell`, `inc-footer-bar`, `inc-navbar`, `inc-breadcrumb`, `inc-nav-triad`, and `inc-sidebar-menu`.
+- App layout: use `inc-app-shell`, `inc-page`, `inc-breadcrumb-body`, `inc-footer-bar`, `inc-footer-bar__menu`, `inc-footer-bar__meta`, `inc-navbar`, `inc-breadcrumb`, `inc-nav-triad`, and `inc-sidebar-menu`.
+- Utilities: use `inc-u-stack-*`, `inc-u-gap-*`, `inc-grid`, `inc-row`, `inc-col`, `inc-stack`, and `inc-flex-*` when composition needs a public helper class.
 - States and workflow: use `inc-state-panel`, `inc-permission-banner`, `inc-toast-card`, `inc-timeline`, `inc-file-dropzone`, `inc-file-row`, and `inc-key-value`.
-- Interaction: use `data-inc-toggle="menu"`, `data-inc-toggle="tab"`, and `data-inc-toggle="collapse"` with `data-inc-target="#target-id"` when you want the helper to wire behavior.
+- Interaction: use `data-inc-toggle="menu"`, `data-inc-toggle="tab"`, and `data-inc-toggle="collapse"` with `data-inc-target="#target-id"` when you want the helper to wire behavior. Use `data-inc-dismiss="modal"` / `data-inc-dismiss="offcanvas"`, `data-inc-accordion`, `data-inc-backdrop-for`, `data-inc-initial-focus`, `data-inc-auto-refresh`, and the `data-inc-refresh-seconds`, `data-inc-refresh-label`, `data-inc-refresh-loading-label`, `data-inc-refresh-paused-label`, `data-inc-refresh-pause-action-label`, and `data-inc-refresh-resume-action-label` hooks when you need the rest of the helper contract. Use `data-inc-native-dialog-open="dialog-id"` when you want the helper to open a native `<dialog>`.
 - Native interaction: use `details.inc-disclosure`, `details.inc-native-menu`, and `dialog.inc-native-dialog`.
 - Status: use `inc-badge--success|warning|danger|info`.
 - Metrics: use `inc-summary-overview` and `inc-summary-block`.
@@ -47,6 +62,7 @@ Customization order:
 4. Only add new component rules after checking whether an existing `inc-*` block already fits.
 
 Packaging and build:
+- `npm run verify` rebuilds distributables, runs the smoke gate, and dry-runs the package.
 - `npm run build` rebuilds distributables.
 - `npm pack` or `npm run package` produces a local installable tarball.
 - The compiled CSS already includes the Bootstrap layer it was built from, so consumers do not need Bootstrap CSS at runtime when using compiled assets.

package/README.md

@@ -21,14 +21,16 @@ Licensed under Apache 2.0.
 - Bootstrap theming overrides for colors, typography, spacing, borders, inputs, cards, tabs, and tables.
 - Dense but readable table styling with strong teal headers and mono-friendly numeric cells.
 - Compact action buttons and inline forms that work well inside grids and table rows.
-- Card, section-shell, summary-block, vertical-list, and layout primitives used across admin screens.
+- Card, section-shell, summary-block, page-frame, vertical-list, and layout primitives used across admin screens.
 - Status-oriented badges and alerts with soft backgrounds and stronger foreground/border cues.
 - Validation states, error summaries, fieldset/legend groups, filter chips, and dense toolbar patterns for search-heavy screens.
 - Operational states such as empty, no-results, loading, error, permission, lock, toast, live-region, auto-refresh, and activity timeline surfaces.
 - Bulk-action, sticky-header, and row-state table patterns for operator-facing grids.
 - File/document dropzones, file rows, read-only description-list grids, progress/meter surfaces, and drawer-style side panels.
-- A small overlay/navigation layer for tabs, pagination, dropdown actions, modals, and offcanvas panels.
-- Opinionated app-shell pieces for navbar/topbar, breadcrumb/nav-triad, sticky footer, user menu, and common two/three-column page layouts.
+- Contextual floating content for tooltip and popover shells anchored to a trigger.
+- A small overlay/navigation layer for tabs, pagination, dropdown actions, native details/dialog patterns, and compatibility modals/offcanvas panels.
+- Opinionated app-shell pieces for navbar/topbar, breadcrumb/nav-triad, page-frame wrappers, footer-bar action clusters, sticky footer, user menu, and common two/three-column page layouts.
+- A public-surface standards layer for `inc-` prefixing, BEM naming, and accessible interactive behavior.
 
 ## What was intentionally left out
 
@@ -36,6 +38,13 @@ Licensed under Apache 2.0.
 - App-specific background art and report/print-only styling.
 - Feature-specific one-off classes that do not generalize cleanly across products.
 
+## Specification Baseline
+
+- First-pass Spec Trace suite: [specs/requirements/ui-kit/_index.md](./specs/requirements/ui-kit/_index.md)
+- Open requirement gaps and follow-up questions: [specs/requirements/ui-kit/REQUIREMENT-GAPS.md](./specs/requirements/ui-kit/REQUIREMENT-GAPS.md)
+- Architecture / design-rationale layer: [specs/architecture/_index.md](./specs/architecture/_index.md)
+- Verification baseline and smoke gate: [specs/verification/ui-kit/_index.md](./specs/verification/ui-kit/_index.md)
+
 ## Files
 
 - `assets/brand/`
@@ -49,7 +58,7 @@ Licensed under Apache 2.0.
 - `dist/inc-design-language.css`
   Compiled standalone CSS output.
 - `dist/inc-design-language.js`
-  Optional vanilla-JS helper for menus, tabs, collapsible sections, and auto-refresh widgets with pause/resume controls.
+  Optional vanilla-JS helper for menus, tabs, collapsible sections, modal/offcanvas shells, native dialog launch hooks, and auto-refresh widgets with pause/resume controls.
 - `index.html`
   Showcase hub for the included example pages.
 - `demo.html`
@@ -63,7 +72,11 @@ Licensed under Apache 2.0.
 - `overlay-workflows.html`
   Modal and offcanvas workflow example with validation and assignment flows.
 - `reference.html`
-  Copy/paste catalog for the standard controls and markup patterns.
+  Copy/paste catalog for the standard controls, page framing, metrics, lists, overlays, and markup patterns.
+- `specs/requirements/ui-kit/`
+  First-pass Spec Trace specification suite for the UI kit, including the gap log for unresolved questions.
+- `specs/verification/ui-kit/`
+  Auditable verification baseline for the current UI kit public surface, including the repo-local smoke gate.
 - `states.html`
   Empty, no-results, loading, error, permission, timeline, file, and notification patterns.
 - `forms-and-validation.html`
@@ -85,6 +98,9 @@ Examples:
 
 - `inc-table`
 - `inc-btn`
+- `inc-text`
+- `inc-heading`
+- `inc-data`
 - `inc-card`
 - `inc-header-body`
 - `inc-summary-block`
@@ -110,9 +126,10 @@ For titled sections that wrap tables, use `inc-header-body--table-body` to keep
 
 - CSS-only/native behavior is enough for layout, cards, tables, buttons, alerts, form fields, badges, breadcrumbs, sticky footer, and most surface styling.
 - Stateful controls still need behavior:
-  tabs, collapsible sections, menus/dropdowns, modals, offcanvas panels, dismissible alerts, toasts, and auto-refresh countdowns with pause/resume behavior.
+  tabs, collapsible sections, menus/dropdowns, modal and offcanvas shells, and auto-refresh countdowns with pause/resume behavior.
+- Alert and toast surfaces stay CSS/HTML-first unless the consuming app adds its own dismissal or lifecycle logic.
 - This package now includes an optional dependency-free helper at `dist/inc-design-language.js` for:
-  user-menu dropdowns, tab switching, collapse/accordion toggles, and page auto-refresh countdown widgets.
+  user-menu dropdowns, tab switching, collapse/accordion toggles, legacy modal/offcanvas shells, native dialog launching, and page auto-refresh countdown widgets.
 - This package also includes native-styled patterns for:
   `details.inc-disclosure`, `details.inc-native-menu`, `dialog.inc-native-dialog`, and `dialog.inc-native-dialog--drawer`.
 - If you prefer native HTML behavior where possible, use browser primitives like `<details>` and `<dialog>` for product-specific implementations. The helper exists for places where the design language is intentionally Bootstrap-like and needs matching interaction behavior.
@@ -122,7 +139,7 @@ For titled sections that wrap tables, use `inc-header-body--table-body` to keep
 If you just want the look in another app:
 
 1. Copy `dist/inc-design-language.css`.
-2. If you need interactive tabs/menus/collapses, also copy `dist/inc-design-language.js`.
+2. If you need interactive tabs/menus/collapses or helper-managed overlays, also copy `dist/inc-design-language.js`.
 3. Load the CSS after your reset or base stylesheet.
 4. Load the optional JS near the end of the page.
 5. Use the `inc-*` classes shown in `reference.html` for direct copy/paste control markup.
@@ -138,12 +155,13 @@ This repository is shaped as a normal npm package:
 - `npm pack` produces a local tarball.
 - `publishConfig.access` is set for public scoped publishing.
 - GitHub Actions is set up for npm Trusted Publishing on release.
+- `npm run verify` is the repo-local build, smoke, and dry-run package gate.
 
 Typical flow:
 
 ```bash
 npm install
-npm run build
+npm run verify
 npm pack
 ```
 
@@ -226,7 +244,7 @@ For normal releases:
 "@
 ```
 
-Use `minor` or `major` when needed. The script verifies the repo state, bumps the version, runs the package validation step, updates `CHANGELOG.md`, creates the release commit and tag, and pushes them. Pushing the tag publishes the package to npm automatically. If you need to retry a failed publish, rerun the original tag-triggered workflow run rather than dispatching a separate manual publish.
+Use `minor` or `major` when needed. The script verifies the repo state, bumps the version, runs the build, smoke, and package validation step, updates `CHANGELOG.md`, creates the release commit and tag, and pushes them. Pushing the tag publishes the package to npm automatically. If you need to retry a failed publish, rerun the original tag-triggered workflow run rather than dispatching a separate manual publish.
 
 ## Use it as source
 

package/dist/inc-design-language.css

@@ -2000,8 +2000,7 @@ progress {
   border-color: var(--bs-table-border-color);
 }
 
-.table-light, .inc-table__cell--light, .inc-table__row--light, .inc-table__header--light,
-.inc-table__header th.inc-table__header--light, .inc-table--light {
+.table-light {
   --bs-table-color: #121316;
   --bs-table-bg: #f6f6f6;
   --bs-table-border-color: rgb(200.4, 200.6, 201.2);
@@ -2015,8 +2014,7 @@ progress {
   border-color: var(--bs-table-border-color);
 }
 
-.table-dark, .inc-table__cell--dark, .inc-table__row--dark, .inc-table__header--dark,
-.inc-table__header th.inc-table__header--dark, .inc-table--dark {
+.table-dark {
   --bs-table-color: #ffffff;
   --bs-table-bg: #121316;
   --bs-table-border-color: rgb(65.4, 66.2, 68.6);
@@ -2313,7 +2311,7 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   padding-left: 1.5em;
   margin-bottom: 0.125rem;
 }
-.form-check .form-check-input, .form-check .inc-form__check__input, .inc-form__check .form-check-input, .inc-form__check .inc-form__check__input {
+.form-check .form-check-input, .form-check .inc-form__check-input, .inc-form__check .form-check-input, .inc-form__check .inc-form__check-input {
   float: left;
   margin-left: -1.5em;
 }
@@ -2323,13 +2321,13 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   padding-left: 0;
   text-align: right;
 }
-.form-check-reverse .form-check-input, .form-check-reverse .inc-form__check__input {
+.form-check-reverse .form-check-input, .form-check-reverse .inc-form__check-input {
   float: right;
   margin-right: -1.5em;
   margin-left: 0;
 }
 
-.form-check-input, .inc-form__check__input {
+.form-check-input, .inc-form__check-input {
   --bs-form-check-bg: #ffffff;
   flex-shrink: 0;
   width: 1em;
@@ -2345,41 +2343,41 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   border: var(--bs-border-width) solid var(--bs-border-color);
   print-color-adjust: exact;
 }
-.form-check-input[type=checkbox], [type=checkbox].inc-form__check__input {
+.form-check-input[type=checkbox], [type=checkbox].inc-form__check-input {
   border-radius: 0.25em;
 }
-.form-check-input[type=radio], [type=radio].inc-form__check__input {
+.form-check-input[type=radio], [type=radio].inc-form__check-input {
   border-radius: 50%;
 }
-.form-check-input:active, .inc-form__check__input:active {
+.form-check-input:active, .inc-form__check-input:active {
   filter: brightness(90%);
 }
-.form-check-input:focus, .inc-form__check__input:focus {
+.form-check-input:focus, .inc-form__check-input:focus {
   border-color: #b9c5ff;
   outline: 0;
   box-shadow: 0 0 0 0.25rem rgba(68, 89, 198, 0.25);
 }
-.form-check-input:checked, .inc-form__check__input:checked {
+.form-check-input:checked, .inc-form__check-input:checked {
   background-color: #4459c6;
   border-color: #4459c6;
 }
-.form-check-input:checked[type=checkbox], .inc-form__check__input:checked[type=checkbox] {
+.form-check-input:checked[type=checkbox], .inc-form__check-input:checked[type=checkbox] {
   --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
 }
-.form-check-input:checked[type=radio], .inc-form__check__input:checked[type=radio] {
+.form-check-input:checked[type=radio], .inc-form__check-input:checked[type=radio] {
   --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23ffffff'/%3e%3c/svg%3e");
 }
-.form-check-input[type=checkbox]:indeterminate, [type=checkbox].inc-form__check__input:indeterminate {
+.form-check-input[type=checkbox]:indeterminate, [type=checkbox].inc-form__check-input:indeterminate {
   background-color: #4459c6;
   border-color: #4459c6;
   --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e");
 }
-.form-check-input:disabled, .inc-form__check__input:disabled {
+.form-check-input:disabled, .inc-form__check-input:disabled {
   pointer-events: none;
   filter: none;
   opacity: 0.5;
 }
-.form-check-input[disabled] ~ .form-check-label, .form-check-input[disabled] ~ .inc-form__check__label, [disabled].inc-form__check__input ~ .form-check-label, [disabled].inc-form__check__input ~ .inc-form__check__label, .form-check-input:disabled ~ .form-check-label, .form-check-input:disabled ~ .inc-form__check__label, .inc-form__check__input:disabled ~ .form-check-label, .inc-form__check__input:disabled ~ .inc-form__check__label {
+.form-check-input[disabled] ~ .form-check-label, .form-check-input[disabled] ~ .inc-form__check-label, [disabled].inc-form__check-input ~ .form-check-label, [disabled].inc-form__check-input ~ .inc-form__check-label, .form-check-input:disabled ~ .form-check-label, .form-check-input:disabled ~ .inc-form__check-label, .inc-form__check-input:disabled ~ .form-check-label, .inc-form__check-input:disabled ~ .inc-form__check-label {
   cursor: default;
   opacity: 0.5;
 }
@@ -2387,7 +2385,7 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
 .form-switch, .inc-form__switch {
   padding-left: 2.5em;
 }
-.form-switch .form-check-input, .inc-form__switch .form-check-input, .form-switch .inc-form__check__input, .inc-form__switch .inc-form__check__input {
+.form-switch .form-check-input, .inc-form__switch .form-check-input, .form-switch .inc-form__check-input, .inc-form__switch .inc-form__check-input {
   --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%2842, 49, 66, 0.25%29'/%3e%3c/svg%3e");
   width: 2em;
   margin-left: -2.5em;
@@ -2397,14 +2395,14 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   transition: background-position 0.15s ease-in-out;
 }
 @media (prefers-reduced-motion: reduce) {
-  .form-switch .form-check-input, .inc-form__switch .form-check-input, .form-switch .inc-form__check__input, .inc-form__switch .inc-form__check__input {
+  .form-switch .form-check-input, .inc-form__switch .form-check-input, .form-switch .inc-form__check-input, .inc-form__switch .inc-form__check-input {
     transition: none;
   }
 }
-.form-switch .form-check-input:focus, .inc-form__switch .form-check-input:focus, .form-switch .inc-form__check__input:focus, .inc-form__switch .inc-form__check__input:focus {
+.form-switch .form-check-input:focus, .inc-form__switch .form-check-input:focus, .form-switch .inc-form__check-input:focus, .inc-form__switch .inc-form__check-input:focus {
   --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23b9c5ff'/%3e%3c/svg%3e");
 }
-.form-switch .form-check-input:checked, .inc-form__switch .form-check-input:checked, .form-switch .inc-form__check__input:checked, .inc-form__switch .inc-form__check__input:checked {
+.form-switch .form-check-input:checked, .inc-form__switch .form-check-input:checked, .form-switch .inc-form__check-input:checked, .inc-form__switch .inc-form__check-input:checked {
   background-position: right center;
   --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ffffff'/%3e%3c/svg%3e");
 }
@@ -2412,7 +2410,7 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   padding-right: 2.5em;
   padding-left: 0;
 }
-.form-switch.form-check-reverse .form-check-input, .form-check-reverse.inc-form__switch .form-check-input, .form-switch.form-check-reverse .inc-form__check__input, .form-check-reverse.inc-form__switch .inc-form__check__input {
+.form-switch.form-check-reverse .form-check-input, .form-check-reverse.inc-form__switch .form-check-input, .form-switch.form-check-reverse .inc-form__check-input, .form-check-reverse.inc-form__switch .inc-form__check-input {
   margin-right: -2.5em;
   margin-left: 0;
 }
@@ -2433,7 +2431,7 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   opacity: 0.65;
 }
 
-[data-bs-theme=dark] .form-switch .form-check-input:not(:checked):not(:focus), [data-bs-theme=dark] .inc-form__switch .form-check-input:not(:checked):not(:focus), [data-bs-theme=dark] .form-switch .inc-form__check__input:not(:checked):not(:focus), [data-bs-theme=dark] .inc-form__switch .inc-form__check__input:not(:checked):not(:focus) {
+[data-bs-theme=dark] .form-switch .form-check-input:not(:checked):not(:focus), [data-bs-theme=dark] .inc-form__switch .form-check-input:not(:checked):not(:focus), [data-bs-theme=dark] .form-switch .inc-form__check-input:not(:checked):not(:focus), [data-bs-theme=dark] .inc-form__switch .inc-form__check-input:not(:checked):not(:focus) {
   --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%28255, 255, 255, 0.25%29'/%3e%3c/svg%3e");
 }
 
@@ -2878,20 +2876,20 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   width: calc(3rem + calc(1.5em + 0.75rem));
 }
 
-.was-validated .form-check-input:valid, .was-validated .inc-form__check__input:valid, .form-check-input.is-valid, .form-check-input.inc-form--is-valid, .is-valid.inc-form__check__input, .inc-form__check__input.inc-form--is-valid {
+.was-validated .form-check-input:valid, .was-validated .inc-form__check-input:valid, .form-check-input.is-valid, .form-check-input.inc-form--is-valid, .is-valid.inc-form__check-input, .inc-form__check-input.inc-form--is-valid {
   border-color: var(--bs-form-valid-border-color);
 }
-.was-validated .form-check-input:valid:checked, .was-validated .inc-form__check__input:valid:checked, .form-check-input.is-valid:checked, .form-check-input.inc-form--is-valid:checked, .is-valid.inc-form__check__input:checked, .inc-form__check__input.inc-form--is-valid:checked {
+.was-validated .form-check-input:valid:checked, .was-validated .inc-form__check-input:valid:checked, .form-check-input.is-valid:checked, .form-check-input.inc-form--is-valid:checked, .is-valid.inc-form__check-input:checked, .inc-form__check-input.inc-form--is-valid:checked {
   background-color: var(--bs-form-valid-color);
 }
-.was-validated .form-check-input:valid:focus, .was-validated .inc-form__check__input:valid:focus, .form-check-input.is-valid:focus, .form-check-input.inc-form--is-valid:focus, .is-valid.inc-form__check__input:focus, .inc-form__check__input.inc-form--is-valid:focus {
+.was-validated .form-check-input:valid:focus, .was-validated .inc-form__check-input:valid:focus, .form-check-input.is-valid:focus, .form-check-input.inc-form--is-valid:focus, .is-valid.inc-form__check-input:focus, .inc-form__check-input.inc-form--is-valid:focus {
   box-shadow: 0 0 0 0.25rem rgba(var(--bs-success-rgb), 0.25);
 }
-.was-validated .form-check-input:valid ~ .form-check-label, .was-validated .form-check-input:valid ~ .inc-form__check__label, .was-validated .inc-form__check__input:valid ~ .form-check-label, .was-validated .inc-form__check__input:valid ~ .inc-form__check__label, .form-check-input.is-valid ~ .form-check-label, .form-check-input.inc-form--is-valid ~ .form-check-label, .form-check-input.is-valid ~ .inc-form__check__label, .form-check-input.inc-form--is-valid ~ .inc-form__check__label, .is-valid.inc-form__check__input ~ .form-check-label, .inc-form__check__input.inc-form--is-valid ~ .form-check-label, .is-valid.inc-form__check__input ~ .inc-form__check__label, .inc-form__check__input.inc-form--is-valid ~ .inc-form__check__label {
+.was-validated .form-check-input:valid ~ .form-check-label, .was-validated .form-check-input:valid ~ .inc-form__check-label, .was-validated .inc-form__check-input:valid ~ .form-check-label, .was-validated .inc-form__check-input:valid ~ .inc-form__check-label, .form-check-input.is-valid ~ .form-check-label, .form-check-input.inc-form--is-valid ~ .form-check-label, .form-check-input.is-valid ~ .inc-form__check-label, .form-check-input.inc-form--is-valid ~ .inc-form__check-label, .is-valid.inc-form__check-input ~ .form-check-label, .inc-form__check-input.inc-form--is-valid ~ .form-check-label, .is-valid.inc-form__check-input ~ .inc-form__check-label, .inc-form__check-input.inc-form--is-valid ~ .inc-form__check-label {
   color: var(--bs-form-valid-color);
 }
 
-.form-check-inline .form-check-input ~ .valid-feedback, .form-check-inline .form-check-input ~ .inc-form__valid-feedback, .form-check-inline .inc-form__check__input ~ .valid-feedback, .form-check-inline .inc-form__check__input ~ .inc-form__valid-feedback {
+.form-check-inline .form-check-input ~ .valid-feedback, .form-check-inline .form-check-input ~ .inc-form__valid-feedback, .form-check-inline .inc-form__check-input ~ .valid-feedback, .form-check-inline .inc-form__check-input ~ .inc-form__valid-feedback {
   margin-left: 0.5em;
 }
 
@@ -2995,20 +2993,20 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   width: calc(3rem + calc(1.5em + 0.75rem));
 }
 
-.was-validated .form-check-input:invalid, .was-validated .inc-form__check__input:invalid, .form-check-input.is-invalid, .form-check-input.inc-form--is-invalid, .is-invalid.inc-form__check__input, .inc-form__check__input.inc-form--is-invalid {
+.was-validated .form-check-input:invalid, .was-validated .inc-form__check-input:invalid, .form-check-input.is-invalid, .form-check-input.inc-form--is-invalid, .is-invalid.inc-form__check-input, .inc-form__check-input.inc-form--is-invalid {
   border-color: var(--bs-form-invalid-border-color);
 }
-.was-validated .form-check-input:invalid:checked, .was-validated .inc-form__check__input:invalid:checked, .form-check-input.is-invalid:checked, .form-check-input.inc-form--is-invalid:checked, .is-invalid.inc-form__check__input:checked, .inc-form__check__input.inc-form--is-invalid:checked {
+.was-validated .form-check-input:invalid:checked, .was-validated .inc-form__check-input:invalid:checked, .form-check-input.is-invalid:checked, .form-check-input.inc-form--is-invalid:checked, .is-invalid.inc-form__check-input:checked, .inc-form__check-input.inc-form--is-invalid:checked {
   background-color: var(--bs-form-invalid-color);
 }
-.was-validated .form-check-input:invalid:focus, .was-validated .inc-form__check__input:invalid:focus, .form-check-input.is-invalid:focus, .form-check-input.inc-form--is-invalid:focus, .is-invalid.inc-form__check__input:focus, .inc-form__check__input.inc-form--is-invalid:focus {
+.was-validated .form-check-input:invalid:focus, .was-validated .inc-form__check-input:invalid:focus, .form-check-input.is-invalid:focus, .form-check-input.inc-form--is-invalid:focus, .is-invalid.inc-form__check-input:focus, .inc-form__check-input.inc-form--is-invalid:focus {
   box-shadow: 0 0 0 0.25rem rgba(var(--bs-danger-rgb), 0.25);
 }
-.was-validated .form-check-input:invalid ~ .form-check-label, .was-validated .form-check-input:invalid ~ .inc-form__check__label, .was-validated .inc-form__check__input:invalid ~ .form-check-label, .was-validated .inc-form__check__input:invalid ~ .inc-form__check__label, .form-check-input.is-invalid ~ .form-check-label, .form-check-input.inc-form--is-invalid ~ .form-check-label, .form-check-input.is-invalid ~ .inc-form__check__label, .form-check-input.inc-form--is-invalid ~ .inc-form__check__label, .is-invalid.inc-form__check__input ~ .form-check-label, .inc-form__check__input.inc-form--is-invalid ~ .form-check-label, .is-invalid.inc-form__check__input ~ .inc-form__check__label, .inc-form__check__input.inc-form--is-invalid ~ .inc-form__check__label {
+.was-validated .form-check-input:invalid ~ .form-check-label, .was-validated .form-check-input:invalid ~ .inc-form__check-label, .was-validated .inc-form__check-input:invalid ~ .form-check-label, .was-validated .inc-form__check-input:invalid ~ .inc-form__check-label, .form-check-input.is-invalid ~ .form-check-label, .form-check-input.inc-form--is-invalid ~ .form-check-label, .form-check-input.is-invalid ~ .inc-form__check-label, .form-check-input.inc-form--is-invalid ~ .inc-form__check-label, .is-invalid.inc-form__check-input ~ .form-check-label, .inc-form__check-input.inc-form--is-invalid ~ .form-check-label, .is-invalid.inc-form__check-input ~ .inc-form__check-label, .inc-form__check-input.inc-form--is-invalid ~ .inc-form__check-label {
   color: var(--bs-form-invalid-color);
 }
 
-.form-check-inline .form-check-input ~ .invalid-feedback, .form-check-inline .form-check-input ~ .inc-form__invalid-feedback, .form-check-inline .inc-form__check__input ~ .invalid-feedback, .form-check-inline .inc-form__check__input ~ .inc-form__invalid-feedback {
+.form-check-inline .form-check-input ~ .invalid-feedback, .form-check-inline .form-check-input ~ .inc-form__invalid-feedback, .form-check-inline .inc-form__check-input ~ .invalid-feedback, .form-check-inline .inc-form__check-input ~ .inc-form__invalid-feedback {
   margin-left: 0.5em;
 }
 
@@ -3224,7 +3222,7 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   --bs-btn-disabled-border-color: #d11a2a;
 }
 
-.btn-light, .inc-btn--light {
+.btn-light {
   --bs-btn-color: #121316;
   --bs-btn-bg: #f6f6f6;
   --bs-btn-border-color: #f6f6f6;
@@ -3241,7 +3239,7 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   --bs-btn-disabled-border-color: #f6f6f6;
 }
 
-.btn-dark, .inc-btn--dark {
+.btn-dark {
   --bs-btn-color: #ffffff;
   --bs-btn-bg: #121316;
   --bs-btn-border-color: #121316;
@@ -3275,7 +3273,7 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   --bs-gradient: none;
 }
 
-.btn-outline-secondary, .inc-btn--outline-secondary {
+.btn-outline-secondary, .inc-user-menu__toggle, .inc-btn--outline-secondary {
   --bs-btn-color: #3a4358;
   --bs-btn-border-color: #3a4358;
   --bs-btn-hover-color: #ffffff;
@@ -3360,7 +3358,7 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   --bs-gradient: none;
 }
 
-.btn-outline-light, .inc-user-menu__toggle, .inc-btn--outline-light {
+.btn-outline-light {
   --bs-btn-color: #f6f6f6;
   --bs-btn-border-color: #f6f6f6;
   --bs-btn-hover-color: #121316;
@@ -3377,7 +3375,7 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   --bs-gradient: none;
 }
 
-.btn-outline-dark, .inc-btn--outline-dark {
+.btn-outline-dark {
   --bs-btn-color: #121316;
   --bs-btn-border-color: #121316;
   --bs-btn-hover-color: #ffffff;
@@ -3771,7 +3769,7 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   color: var(--bs-dropdown-link-color);
 }
 
-.dropdown-menu-dark, .inc-dropdown__menu--dark {
+.dropdown-menu-dark {
   --bs-dropdown-color: #f1f1f1;
   --bs-dropdown-bg: #525355;
   --bs-dropdown-border-color: var(--bs-border-color-translucent);
@@ -4554,7 +4552,7 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   overflow-y: visible;
 }
 
-.navbar-dark, .inc-navbar--dark,
+.navbar-dark,
 .navbar[data-bs-theme=dark],
 [data-bs-theme=dark].inc-navbar {
   --bs-navbar-color: rgba(255, 255, 255, 0.55);
@@ -5160,14 +5158,14 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   --bs-alert-link-color: var(--bs-danger-text-emphasis);
 }
 
-.alert-light, .inc-alert--light {
+.alert-light {
   --bs-alert-color: var(--bs-light-text-emphasis);
   --bs-alert-bg: var(--bs-light-bg-subtle);
   --bs-alert-border-color: var(--bs-light-border-subtle);
   --bs-alert-link-color: var(--bs-light-text-emphasis);
 }
 
-.alert-dark, .inc-alert--dark {
+.alert-dark {
   --bs-alert-color: var(--bs-dark-text-emphasis);
   --bs-alert-bg: var(--bs-dark-bg-subtle);
   --bs-alert-border-color: var(--bs-dark-border-subtle);
@@ -5554,7 +5552,7 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   --bs-list-group-active-border-color: var(--bs-danger-text-emphasis);
 }
 
-.list-group-item-light, .inc-list-group__item--light {
+.list-group-item-light {
   --bs-list-group-color: var(--bs-light-text-emphasis);
   --bs-list-group-bg: var(--bs-light-bg-subtle);
   --bs-list-group-border-color: var(--bs-light-border-subtle);
@@ -5567,7 +5565,7 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   --bs-list-group-active-border-color: var(--bs-light-text-emphasis);
 }
 
-.list-group-item-dark, .inc-list-group__item--dark {
+.list-group-item-dark {
   --bs-list-group-color: var(--bs-dark-text-emphasis);
   --bs-list-group-bg: var(--bs-dark-bg-subtle);
   --bs-list-group-border-color: var(--bs-dark-border-subtle);
@@ -8725,12 +8723,12 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   color: rgba(var(--bs-danger-rgb), var(--bs-text-opacity)) !important;
 }
 
-.text-light, .inc-spinner--grow--light, .inc-spinner--border--light {
+.text-light {
   --bs-text-opacity: 1;
   color: rgba(var(--bs-light-rgb), var(--bs-text-opacity)) !important;
 }
 
-.text-dark, .inc-spinner--grow--dark, .inc-spinner--border--dark, .inc-form__select--warning, .inc-form__control--warning {
+.text-dark, .inc-form__select--warning, .inc-form__control--warning {
   --bs-text-opacity: 1;
   color: rgba(var(--bs-dark-rgb), var(--bs-text-opacity)) !important;
 }
@@ -9020,12 +9018,12 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
   background-color: rgba(var(--bs-danger-rgb), var(--bs-bg-opacity)) !important;
 }
 
-.bg-light, .inc-badge--light {
+.bg-light {
   --bs-bg-opacity: 1;
   background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
 }
 
-.bg-dark, .inc-badge--dark {
+.bg-dark {
   --bs-bg-opacity: 1;
   background-color: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity)) !important;
 }
@@ -13309,24 +13307,24 @@ textarea.form-control-lg, textarea.inc-form__control--lg {
     padding: 1rem;
   }
 }
-.inc-page {
+.inc-page,
+.inc-breadcrumb-body {
   display: flex;
   flex-direction: column;
   gap: 1rem;
   min-width: 0;
 }
-.inc-page__breadcrumbs {
+
+.inc-page__breadcrumbs,
+.inc-breadcrumb-body__breadcrumb {
   margin-bottom: 0;
 }
-.inc-page__body {
+
+.inc-page__body,
+.inc-breadcrumb-body__body {
   min-width: 0;
 }
 
-.inc-breadcrumb-body {
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-}
 .inc-breadcrumb-body__breadcrumb {
   margin-bottom: 0;
 }
@@ -14298,11 +14296,6 @@ dialog.inc-native-dialog.inc-native-dialog--drawer .inc-native-dialog__body {
   border-top-right-radius: 0.25rem;
   border-right: none;
 }
-.inc-table--light thead th {
-  background-color: #ffffff !important;
-  color: #121316 !important;
-  border-color: #c4c4c5 !important;
-}
 .inc-table tbody td,
 .inc-table tbody th,
 .inc-table tfoot td,
@@ -14907,7 +14900,7 @@ body.inc-offcanvas-open {
   border-color: #009743;
   box-shadow: 0 0 0 0.1875rem rgba(0, 151, 67, 0.12);
 }
-.inc-form__check.is-invalid .inc-form__check__label, .inc-form__check.inc-form--is-invalid .inc-form__check__label {
+.inc-form__check.is-invalid .inc-form__check-label, .inc-form__check.inc-form--is-invalid .inc-form__check-label {
   color: #d11a2a;
 }
 .inc-form__error-summary {
@@ -15209,6 +15202,9 @@ body.inc-offcanvas-open {
   overflow: hidden;
   white-space: nowrap;
 }
+.inc-btn.is-loading:has(> .inc-spinner)::after, .inc-btn.is-loading:has(> .inc-loading-dots)::after {
+  display: none;
+}
 .inc-btn.is-loading::after {
   content: "";
   position: absolute;
@@ -15221,6 +15217,12 @@ body.inc-offcanvas-open {
   border-right-color: transparent;
   animation: inc-loading-spin 0.8s linear infinite;
 }
+.inc-btn.is-loading > .inc-spinner,
+.inc-btn.is-loading > .inc-loading-dots {
+  position: absolute;
+  inset: 50% auto auto 50%;
+  transform: translate(-50%, -50%);
+}
 
 .inc-bulk-bar {
   display: flex;