/* Exactly three popup sizes across admin, tenant, Mitra and public shells.
 * The width boundary deliberately wins over legacy inline/plugin widths and
 * mobile fullscreen rules. Explicit native geometry remains an opt-out for
 * specialized document/payment viewers, never a default for ordinary forms. */
html body .modal > .modal-dialog { --dg-popup-width: var(--dg-popup-medium); }
html body .modal > .modal-dialog.modal-sm { --dg-popup-width: var(--dg-popup-small); }
html body .modal > .modal-dialog:is(.modal-xl, .modal-fullscreen, .dg-modal-compact-list) {
  --dg-popup-width: var(--dg-popup-large);
}
html body .modal[data-dg-modal-size="small"] > .modal-dialog,
html body .modal > .modal-dialog[data-dg-modal-size="small"] { --dg-popup-width: var(--dg-popup-small); }
html body .modal[data-dg-modal-size="medium"] > .modal-dialog,
html body .modal > .modal-dialog[data-dg-modal-size="medium"] { --dg-popup-width: var(--dg-popup-medium); }
html body .modal[data-dg-modal-size="large"] > .modal-dialog,
html body .modal > .modal-dialog[data-dg-modal-size="large"] { --dg-popup-width: var(--dg-popup-large); }
html body .modal:not([data-dg-modal-size="native"]) > .modal-dialog:not([data-dg-modal-size="native"]) {
  width: min(var(--dg-popup-width), calc(100% - 24px)) !important;
  max-width: min(var(--dg-popup-width), calc(100% - 24px)) !important;
  margin-inline: auto;
  height: auto;
}
html body .modal:not([data-dg-modal-size="native"]) > .modal-dialog:not([data-dg-modal-size="native"]) > .modal-content {
  max-height: calc(100vh - 48px);
  max-height: calc(100dvh - 48px);
  overflow: hidden;
}
html body .modal-content > form {
  display: flex;
  flex-direction: column;
  min-height: 0;
}
html body .modal-content > .modal-body,
html body .modal-content > form > .modal-body {
  min-height: 0;
  overflow-y: auto;
}
/* Keep the close button inside the scroll boundary, including desktop Vuexy
 * dialogs whose default transform places it outside the rounded content. */
html body .modal .modal-header .btn-close {
  position: static;
  transform: none !important;
  margin: 0;
  margin-inline-start: auto;
  flex-shrink: 0;
}
html body .modal .modal-header .modal-title { min-width: 0; overflow-wrap: anywhere; }
html body .swal2-popup.dg-feedback-popup:not(.swal2-toast) {
  max-width: calc(100vw - 24px);
}

/* DigiRadius centralized application theme tokens and shared theme controls.
 * Vuexy's owned Navy build supplies component mechanics; this file is the
 * authoritative DigiRadius Navy palette and must load after dynamic theme CSS. */
:root {
  /* Popup sizes: confirmation/detail, normal form, datasheet/complex form. */
  --dg-popup-small: 480px;
  --dg-popup-medium: 800px;
  --dg-popup-large: 1140px;
  /* Reference-neutral Navy contrast pilot. These semantic tokens are the only Navy
   * color authority; component rules below consume them without page colors. */
  --dg-theme-navy-body: #141b2d;
  --dg-theme-navy-body-rgb: 20, 27, 45;
  --dg-theme-navy-surface: #1f293f;
  --dg-theme-navy-surface-rgb: 31, 41, 63;
  --dg-theme-navy-surface-alt: #283247;
  --dg-theme-navy-input: #283247;
  --dg-theme-navy-table-stripe: #283247;
  --dg-theme-navy-header: rgba(31, 41, 63, 0.96);
  --dg-theme-navy-sidebar: #1f293f;
  --dg-theme-navy-border: #3a4356;
  --dg-theme-navy-control-border: #3a4356;
  --dg-theme-navy-text: #ced4da;
  --dg-theme-navy-text-rgb: 206, 212, 218;
  --dg-theme-navy-heading: #eff2f7;
  --dg-theme-navy-muted: #a7aebd;
  --dg-theme-navy-muted-surface: rgba(206, 212, 218, 0.07);
  --dg-theme-navy-hover-surface: rgba(206, 212, 218, 0.09);
  --dg-theme-navy-shadow: rgba(10, 14, 24, 0.38);
  --dg-theme-navy-shadow-rgb: 10, 14, 24;
  --dg-theme-navy-border-rgb: 58, 67, 86;

  /* Active-theme text hierarchy. Light/Dark continue to inherit Vuexy's
   * Bootstrap variables; Navy remaps these aliases below from one authority. */
  --dg-theme-text-primary: var(--bs-body-color);
  --dg-theme-text-secondary: var(--bs-secondary-color);
  --dg-theme-text-muted: var(--bs-tertiary-color);
  --dg-surface: var(--dg-overlay-surface);
  --dg-surface-muted: var(--bs-tertiary-bg);
  --dg-surface-hover: var(--dg-overlay-hover);
  --dg-on-accent: var(--bs-white);
  --dg-shadow-color: rgba(var(--bs-black-rgb), 0.12);
  /* Existing ledger semantic colors: shared by Buku Kas and Pos Gaji. */
  --dg-ledger-credit: #eaf5ee;
  --dg-ledger-debit: #fbeeee;
  --dg-ledger-transfer: #e7f4f8;
  --dg-ledger-credit-day: #d2e9da;
  --dg-ledger-debit-day: #f3d7dc;
  --dg-ledger-transfer-day: #cce8ef;

  /* Shared overlay authority. Structural colors are remapped by active theme. */
  --dg-overlay-surface: #fff;
  --dg-overlay-input: #fff;
  --dg-overlay-title: #444050;
  --dg-overlay-text: #6d6b77;
  --dg-overlay-muted: #808390;
  --dg-overlay-border: #e6e6e8;
  --dg-overlay-control-border: #d1d0d4;
  --dg-overlay-hover: rgba(128, 131, 144, 0.12);
  --dg-overlay-backdrop: rgba(34, 48, 62, 0.45);
  --dg-overlay-shadow: 0 0.5rem 2rem rgba(34, 48, 62, 0.2);
  --dg-overlay-popup-width: 32rem;
  --dg-overlay-popup-side-gap: 1rem;
  --dg-overlay-popup-block-gap: 1rem;
  --dg-overlay-popup-radius: var(--bs-border-radius-lg, 0.5rem);
  --dg-overlay-close-size: 2.75rem;
  --dg-overlay-action-height: 2.75rem;
  --dg-overlay-mobile-popup-width: 17rem;
  --dg-overlay-mobile-popup-padding-bottom: 0.625rem;
  --dg-overlay-mobile-icon-size: 3.5rem;
  --dg-overlay-mobile-icon-font-size: 0.7rem;
  --dg-overlay-mobile-icon-margin-block: 0.75rem 0.25rem;
  --dg-overlay-mobile-title-size: 1rem;
  --dg-overlay-mobile-content-size: 0.8125rem;
  --dg-overlay-mobile-action-height: 2.5rem;
  --dg-overlay-mobile-action-gap: 0.375rem;

  /* Shared code-editor palette. Editor integrations consume these aliases so
   * their canvas follows the active application theme without page colors. */
  --dg-editor-bg: var(--dg-overlay-input);
  --dg-editor-gutter-bg: var(--bs-secondary-bg, var(--dg-overlay-surface));
  --dg-editor-text: var(--dg-overlay-title);
  --dg-editor-muted: var(--dg-overlay-muted);
  --dg-editor-border: var(--dg-overlay-border);
  --dg-editor-active-line: var(--dg-overlay-hover);
  --dg-editor-selection: rgba(var(--bs-primary-rgb), 0.2);
  --dg-editor-cursor: var(--bs-primary);

  /* Shared normal-form geometry. Operational filters retain their own contract. */
  --dg-form-control-height: 2.4375rem;
  --dg-form-control-font-size: 0.9375rem;
  --dg-form-control-line-height: 1.625;
  --dg-form-control-padding-x: 0.9375rem;
  --dg-form-select-indicator-space: 2.8125rem;
  /* Match Vuexy's native form-select frame, not panel/overlay borders. */
  --dg-select-frame: #d1d0d4;
  --dg-select-frame-hover: #82808b;
  --dg-select-frame-disabled: #cdccd0;
  --dg-form-control-radius: var(--dg-smooth-control-radius, var(--bs-border-radius, 0.375rem));
  --dg-form-label-size: 0.8125rem;
  --dg-form-label-weight: 500;
  --dg-form-label-gap: 0.25rem;
  --dg-form-field-gap: 0.75rem;
  --dg-form-helper-size: 0.8125rem;
  --dg-form-textarea-min-height: 4.5rem;
  --dg-action-text-transform: uppercase;
}

/* One application-wide action-label contract. Component labels such as tabs,
 * cards, and list items remain untouched; only real action controls inherit it. */
html:is(.light-style, .dark-style, .navy-style) :is(
  .btn,
  .dropdown-menu :is(button, a).dropdown-item,
  .swal2-actions > button
) {
  text-transform: var(--dg-action-text-transform);
}

/* Canonical compact form contract, derived from Tambah Data Langganan.
 * Filter/DataTables controls are intentionally excluded: they have a denser
 * operational contract in digiradius-responsive.css. */
html:is(.light-style, .dark-style, .navy-style) :is(.form-control, .form-select):not(.form-control-sm):not(.form-control-lg):not(.form-select-sm):not(.form-select-lg):not(.dg-filter-bar *):not(.dataTables_wrapper .dataTables_filter *):not(.dataTables_wrapper .dataTables_length *) {
  min-height: var(--dg-form-control-height);
  padding-inline-start: calc(var(--dg-form-control-padding-x) - var(--bs-border-width));
  font-size: var(--dg-form-control-font-size);
  line-height: var(--dg-form-control-line-height);
  border-radius: var(--dg-form-control-radius);
}

html:is(.light-style, .dark-style, .navy-style) .form-control:not(.form-control-sm):not(.form-control-lg):not(.dg-filter-bar *):not(.dataTables_wrapper .dataTables_filter *) {
  padding-inline-end: calc(var(--dg-form-control-padding-x) - var(--bs-border-width));
}

html:is(.light-style, .dark-style, .navy-style) .form-select:not(.form-select-sm):not(.form-select-lg):not(.dg-filter-bar *):not(.dataTables_wrapper .dataTables_length *) {
  padding-inline-end: calc(var(--dg-form-select-indicator-space) - var(--bs-border-width));
}

html:is(.light-style, .dark-style, .navy-style) :is(input.form-control, select.form-select):not(.form-control-sm):not(.form-control-lg):not(.form-select-sm):not(.form-select-lg):not(.dg-filter-bar *):not(.dataTables_wrapper .dataTables_filter *):not(.dataTables_wrapper .dataTables_length *) {
  height: var(--dg-form-control-height);
}

html:is(.light-style, .dark-style, .navy-style) textarea.form-control:not(.form-control-sm):not(.form-control-lg) {
  min-height: var(--dg-form-textarea-min-height);
  height: auto;
  resize: vertical;
}

html:is(.light-style, .dark-style, .navy-style) :is(.form-label, .col-form-label) {
  font-size: var(--dg-form-label-size);
  font-weight: var(--dg-form-label-weight);
}

html:is(.light-style, .dark-style, .navy-style) .form-label {
  margin-bottom: var(--dg-form-label-gap);
}

html:is(.light-style, .dark-style, .navy-style) :is(.form-text, .valid-feedback, .invalid-feedback) {
  font-size: var(--dg-form-helper-size);
}

html:is(.light-style, .dark-style, .navy-style) .input-group:not(.input-group-sm):not(.input-group-lg) > :is(.form-control, .form-select, .input-group-text, .btn) {
  min-height: var(--dg-form-control-height);
}

html:is(.light-style, .dark-style, .navy-style) .select2-container--default .select2-selection--single {
  height: var(--dg-form-control-height);
  border-radius: var(--dg-form-control-radius);
}

html:is(.light-style, .dark-style, .navy-style) .select2-container--default .select2-selection--single .select2-selection__rendered {
  min-height: calc(var(--dg-form-control-height) - var(--bs-border-width));
  padding-inline-start: calc(var(--dg-form-control-padding-x) - var(--bs-border-width));
  font-size: var(--dg-form-control-font-size);
  line-height: calc(var(--dg-form-control-height) - var(--bs-border-width));
}

html:is(.light-style, .dark-style, .navy-style) .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: var(--dg-form-control-height);
}

html:is(.light-style, .dark-style, .navy-style) .select2-container--default .select2-selection--multiple {
  min-height: var(--dg-form-control-height);
  border-radius: var(--dg-form-control-radius);
}

@media (max-width: 575.98px) {
  html:is(.light-style, .dark-style, .navy-style) form :is(.row.g-3, .row.g-4) {
    --bs-gutter-y: var(--dg-form-field-gap);
  }
}

html.dark-style:not(.navy-style) {
  --dg-select-frame: #56596f;
  --dg-select-frame-hover: #9a9ab0;
  --dg-select-frame-disabled: #585a71;
  --dg-overlay-surface: #2f3349;
  --dg-overlay-input: #25293c;
  --dg-overlay-title: #cfcce4;
  --dg-overlay-text: #b2b1cb;
  --dg-overlay-muted: #8285a0;
  --dg-overlay-border: #565b79;
  --dg-overlay-control-border: #565b79;
  --dg-overlay-hover: rgba(225, 222, 245, 0.1);
  --dg-overlay-backdrop: rgba(14, 16, 27, 0.72);
  --dg-overlay-shadow: 0 0.5rem 2rem rgba(10, 12, 22, 0.42);
}

html.dark-style {
  --dg-ledger-credit: #263e37;
  --dg-ledger-debit: #493238;
  --dg-ledger-transfer: #263f49;
  --dg-ledger-credit-day: #315344;
  --dg-ledger-debit-day: #613e46;
  --dg-ledger-transfer-day: #315865;
}

html.navy-style {
  --dg-select-frame: #3b5d89;
  --dg-select-frame-hover: #90a5c5;
  --dg-select-frame-disabled: #3e608e;
  --dg-theme-text-primary: var(--dg-theme-navy-text);
  --dg-theme-text-secondary: var(--dg-theme-navy-muted);
  --dg-theme-text-muted: var(--dg-theme-navy-muted);
  --bs-body-bg: var(--dg-theme-navy-body);
  --bs-body-bg-rgb: var(--dg-theme-navy-body-rgb);
  --bs-body-color: var(--dg-theme-text-primary);
  --bs-body-color-rgb: 206, 212, 218;
  --bs-heading-color: var(--dg-theme-navy-heading);
  --bs-secondary-color: var(--dg-theme-text-secondary);
  --bs-secondary-color-rgb: 167, 174, 189;
  --bs-tertiary-color: var(--dg-theme-text-muted);
  --bs-tertiary-color-rgb: 167, 174, 189;
  --bs-border-color: var(--dg-theme-navy-border);
  --bs-border-color-translucent: rgba(58, 67, 86, 0.55);
  --bs-secondary-bg: var(--dg-theme-navy-surface-alt);
  --bs-tertiary-bg: var(--dg-theme-navy-muted-surface);
  --dg-overlay-surface: var(--dg-theme-navy-surface);
  --dg-overlay-input: var(--dg-theme-navy-input);
  --dg-overlay-title: var(--dg-theme-navy-heading);
  --dg-overlay-text: var(--dg-theme-navy-text);
  --dg-overlay-muted: var(--dg-theme-navy-muted);
  --dg-overlay-border: var(--dg-theme-navy-border);
  --dg-overlay-control-border: var(--dg-theme-navy-control-border);
  --dg-overlay-hover: var(--dg-theme-navy-hover-surface);
  --dg-overlay-backdrop: rgba(var(--dg-theme-navy-body-rgb), 0.78);
  --dg-overlay-shadow: 0 0.5rem 2rem var(--dg-theme-navy-shadow);
}

html.navy-style body,
html.navy-style .content-wrapper {
  background-color: var(--dg-theme-navy-body);
}

/* Component-local variables must not retain the old compiled Navy palette. */
html.navy-style .accordion {
  --bs-accordion-color: var(--dg-theme-text-primary);
  --bs-accordion-bg: var(--dg-surface);
  --bs-accordion-border-color: var(--bs-border-color);
  --bs-accordion-btn-color: var(--bs-heading-color);
  --bs-accordion-btn-bg: var(--dg-surface);
  --bs-accordion-active-color: var(--bs-heading-color);
  --bs-accordion-active-bg: var(--dg-surface);
}
html.navy-style .accordion-item {
  color: var(--bs-accordion-color);
  background-color: var(--bs-accordion-bg);
  border-color: var(--bs-accordion-border-color);
}
html.navy-style .accordion .accordion-button {
  color: var(--bs-heading-color);
  background-color: var(--dg-surface);
}
html.navy-style .accordion .accordion-button:focus-visible {
  outline: 2px solid var(--bs-primary);
  outline-offset: -2px;
}
html.navy-style .bg-body { background: var(--bs-body-bg) !important; }
html.navy-style :is(.bg-white, .bg-light) { background-color: var(--dg-surface) !important; }
html.navy-style .text-dark { color: var(--bs-heading-color) !important; }

/* Store's Bootstrap opacity utilities also work with the shared Vuexy build. */
.bg-primary.bg-opacity-10 { background-color: rgba(var(--bs-primary-rgb), .1) !important; }
.bg-success.bg-opacity-10 { background-color: rgba(var(--bs-success-rgb), .1) !important; }
.bg-warning.bg-opacity-10 { background-color: rgba(var(--bs-warning-rgb), .1) !important; }
.bg-danger.bg-opacity-10 { background-color: rgba(var(--bs-danger-rgb), .1) !important; }
.bg-info.bg-opacity-10 { background-color: rgba(var(--bs-info-rgb), .1) !important; }
.bg-secondary.bg-opacity-10 { background-color: rgba(var(--bs-secondary-rgb), .1) !important; }

/* Public Navy/Light control: never a form submit or account preference. */
.dg-public-theme-menu {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  list-style: none;
  margin: 0;
  padding: 0;
}
.dg-public-theme-menu .dg-theme-switcher > button {
  width: 44px;
  height: 44px;
  min-width: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--bs-heading-color);
}

html.navy-style .card,
html.navy-style .modal-content,
html.navy-style .offcanvas,
html.navy-style .list-group-item:not(.active) {
  --bs-card-bg: var(--dg-theme-navy-surface);
  --bs-modal-bg: var(--dg-theme-navy-surface);
  background-color: var(--dg-theme-navy-surface);
  border-color: var(--dg-theme-navy-border);
}

html.navy-style .bg-navbar-theme {
  background-color: var(--dg-theme-navy-header) !important;
}

html.navy-style .bg-navbar-theme :is(h1, h2, h3, h4, h5, h6, strong, .navbar-brand) {
  color: var(--dg-theme-navy-heading);
}

html.navy-style .bg-menu-theme,
html.navy-style .bg-menu-theme.menu-horizontal,
html.navy-style .bg-menu-theme .menu-inner .menu-item.open > .menu-sub {
  background-color: var(--dg-theme-navy-sidebar) !important;
}

html.navy-style .bg-menu-theme,
html.navy-style .bg-menu-theme .menu-text,
html.navy-style .bg-menu-theme .menu-toggle::after {
  color: var(--dg-theme-text-primary);
}

html.navy-style .bg-menu-theme .menu-link {
  color: var(--dg-theme-text-secondary);
}

html.navy-style .bg-menu-theme .menu-item:is(.active, .open) > .menu-link {
  color: var(--dg-theme-navy-heading);
}

html.navy-style .bg-footer-theme,
html.navy-style .layout-footer-fixed .bg-footer-theme .footer-container {
  background-color: var(--dg-theme-navy-surface) !important;
}

html.navy-style .layout-navbar,
html.navy-style .bg-menu-theme {
  box-shadow: 0 0.125rem 0.75rem var(--dg-theme-navy-shadow);
}

html.navy-style.layout-navbar-fixed .layout-page::before {
  background: linear-gradient(
    180deg,
    rgba(var(--dg-theme-navy-body-rgb), 0.76) 44%,
    rgba(var(--dg-theme-navy-body-rgb), 0.46) 73%,
    rgba(var(--dg-theme-navy-body-rgb), 0)
  );
  -webkit-mask: linear-gradient(var(--dg-theme-navy-body), var(--dg-theme-navy-body) 18%, transparent 100%);
  mask: linear-gradient(var(--dg-theme-navy-body), var(--dg-theme-navy-body) 18%, transparent 100%);
}

html.navy-style .bg-menu-theme .menu-inner-shadow {
  background: linear-gradient(
    var(--dg-theme-navy-sidebar) 41%,
    rgba(var(--dg-theme-navy-surface-rgb), 0.12) 95%,
    rgba(var(--dg-theme-navy-surface-rgb), 0)
  );
}

/* SweetAlert consumes the same inherited palette as the active theme. */
html .swal2-popup {
  background: var(--dg-overlay-surface);
  color: var(--dg-overlay-text);
  border-radius: 0.3125rem;
}

/* Keep SweetAlert's native buttons; only their colors follow the active theme. */
html .swal2-popup .swal2-styled.swal2-confirm {
  background-color: var(--bs-primary);
  color: var(--dg-on-accent);
}
html .swal2-popup .swal2-styled.swal2-deny {
  background-color: var(--bs-danger);
  color: var(--dg-on-accent);
}
html .swal2-popup .swal2-styled.swal2-cancel {
  background-color: var(--bs-secondary);
  color: var(--dg-on-accent);
}
html .swal2-popup .swal2-styled.swal2-confirm:focus {
  box-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb), .5);
}
html .swal2-popup .swal2-styled.swal2-deny:focus {
  box-shadow: 0 0 0 3px rgba(var(--bs-danger-rgb), .5);
}
html .swal2-popup .swal2-styled.swal2-cancel:focus {
  box-shadow: 0 0 0 3px rgba(var(--bs-secondary-rgb), .5);
}

/* Shared SweetAlert geometry, independent of the page theme. */
html:is(.light-style, .dark-style, .navy-style) .swal2-container {
  padding: var(--dg-overlay-popup-block-gap) var(--dg-overlay-popup-side-gap);
}

html:is(.light-style, .dark-style, .navy-style) .swal2-container.swal2-shown,
html:is(.light-style, .dark-style, .navy-style) .swal2-container.swal2-backdrop-show,
html:is(.light-style, .dark-style, .navy-style) .swal2-container.swal2-noanimation {
  background: var(--dg-overlay-backdrop);
}

html:is(.light-style, .dark-style, .navy-style) .swal2-modal.swal2-popup {
  width: min(var(--dg-overlay-popup-width), calc(100vw - (2 * var(--dg-overlay-popup-side-gap))));
  max-width: 100%;
  max-height: calc(100dvh - (2 * var(--dg-overlay-popup-block-gap)));
  color: var(--dg-overlay-text);
  background: var(--dg-overlay-surface);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}

html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-title {
  color: var(--dg-overlay-title);
}

html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-html-container,
html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-content {
  max-height: min(55dvh, 30rem);
  color: var(--dg-overlay-text);
  overflow-x: hidden;
  overflow-y: auto;
  overflow-wrap: anywhere;
}

html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-close {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  left: auto;
  z-index: 1;
  width: var(--dg-overlay-close-size);
  height: var(--dg-overlay-close-size);
  color: var(--dg-overlay-muted);
  border-radius: var(--bs-border-radius-sm, 0.25rem);
}

html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-close:hover,
html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-close:focus-visible {
  color: var(--dg-overlay-title);
  background: var(--dg-overlay-hover);
}

html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-close:focus-visible {
  outline: 2px solid var(--bs-primary);
  outline-offset: -2px;
}

html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-input,
html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-file,
html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-textarea,
html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-select {
  color: var(--dg-overlay-title);
  background: var(--dg-overlay-input);
  border-color: var(--dg-overlay-control-border) !important;
}

html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-input::placeholder,
html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-textarea::placeholder {
  color: var(--dg-overlay-muted);
  opacity: 1;
}

html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-validation-message,
html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-validationerror {
  color: var(--bs-danger);
  background: var(--dg-overlay-input);
}

html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-footer {
  color: var(--dg-overlay-muted);
  border-color: var(--dg-overlay-border);
}

/* Vuexy declares `.btn { display: inline-flex !important; }`, while
 * SweetAlert hides inactive action buttons with a non-important inline
 * `display: none`. Keep SweetAlert's runtime visibility decision authoritative
 * so normal success/confirm dialogs cannot expose deny or cancel actions. */
html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-actions > button[style*="display: none"] {
  display: none !important;
}

/* Semantic hidden state must also outrank Vuexy's forced button display. */
.btn[hidden] {
  display: none !important;
}

html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-actions > :is(button, .btn):focus-visible {
  outline: 2px solid var(--bs-primary);
  outline-offset: 2px;
}

/* Navy shares vendor dark-style geometry, but owns popup surfaces and text.
 * Scope to the document: Select2/Flatpickr may attach their popup to body. */
html.navy-style .dropdown-menu {
  --bs-dropdown-bg: var(--dg-theme-navy-surface);
  --bs-dropdown-color: var(--dg-theme-navy-text);
  --bs-dropdown-link-color: var(--dg-theme-navy-text);
  --bs-dropdown-link-hover-color: var(--dg-theme-navy-heading);
  --bs-dropdown-link-hover-bg: var(--dg-theme-navy-hover-surface);
  --bs-dropdown-link-disabled-color: var(--dg-theme-navy-muted);
  --bs-dropdown-header-color: var(--dg-theme-navy-muted);
  --bs-dropdown-divider-bg: var(--dg-theme-navy-border);
  background-color: var(--dg-theme-navy-surface);
  color: var(--dg-theme-navy-text);
}
html.navy-style .select2-dropdown {
  background-color: var(--dg-theme-navy-surface);
  color: var(--dg-theme-navy-text);
  box-shadow: var(--dg-overlay-shadow);
}
html.navy-style .select2-container--default .select2-selection,
html.navy-style .select2-container--default .select2-search--dropdown .select2-search__field {
  background-color: var(--dg-theme-navy-input);
  color: var(--dg-theme-navy-text);
}
html.navy-style .select2-container--default :is(.select2-selection--single, .select2-selection--multiple) .select2-selection__rendered,
html.navy-style .select2-container--default .select2-search__field,
html.navy-style .select2-container--default .select2-results__option:not(.select2-results__option--highlighted):not([aria-selected="true"]):not([aria-disabled="true"]) {
  color: var(--dg-theme-navy-text);
}
html.navy-style .select2-container--default .select2-selection--multiple .select2-selection__choice {
  color: var(--dg-theme-navy-text);
  background-color: var(--dg-theme-navy-muted-surface);
}
html.navy-style .select2-container--default .select2-results__option[aria-selected="true"]:not(.select2-results__option--highlighted) {
  background-color: var(--dg-theme-navy-muted-surface);
  color: var(--dg-theme-navy-text);
}
html.navy-style .select2-container--default .select2-search__field::placeholder {
  color: var(--dg-theme-navy-muted);
  opacity: 1;
}
html.navy-style .select2-container--default.select2-container--disabled .select2-selection {
  background-color: var(--dg-theme-navy-surface-alt);
}
html.navy-style .select2-container--default :is(.select2-selection__placeholder, .select2-selection__clear),
html.navy-style .select2-container--default.select2-container--disabled :is(.select2-selection--single, .select2-selection--multiple) .select2-selection__rendered,
html.navy-style .select2-container--default .select2-results__option[aria-disabled="true"] {
  color: var(--dg-theme-navy-muted);
}
html.navy-style .flatpickr-calendar,
html.navy-style .flatpickr-calendar :is(.flatpickr-days, .flatpickr-month, .flatpickr-weekdays, .flatpickr-weekday, .flatpickr-weeks, .flatpickr-time, .flatpickr-monthDropdown-month) {
  background-color: var(--dg-theme-navy-surface);
  color: var(--dg-theme-navy-text);
  border-color: var(--dg-theme-navy-border);
}
html.navy-style .flatpickr-calendar {
  box-shadow: var(--dg-overlay-shadow);
}
html.navy-style .flatpickr-calendar.hasTime .flatpickr-time {
  box-shadow: 0 1px 0 var(--dg-theme-navy-border) inset;
}
html.navy-style .flatpickr-calendar :is(.flatpickr-current-month, .cur-month, .cur-year, .flatpickr-monthDropdown-months),
html.navy-style .flatpickr-time :is(input, .flatpickr-am-pm, .flatpickr-time-separator),
html.navy-style .flatpickr-day:not(.selected):not(.startRange):not(.endRange) {
  color: var(--dg-theme-navy-text);
}
html.navy-style .flatpickr-day:is(.prevMonthDay, .nextMonthDay, .flatpickr-disabled, .disabled) {
  color: var(--dg-theme-navy-muted) !important;
}
html.navy-style .flatpickr-day:not(.selected):not(.startRange):not(.endRange):not(.flatpickr-disabled):is(:hover, :focus),
html.navy-style .flatpickr-time :is(input, .flatpickr-am-pm):is(:hover, :focus) {
  background-color: var(--dg-theme-navy-surface-alt);
}
html.navy-style .flatpickr-calendar :is(.flatpickr-prev-month, .flatpickr-next-month) svg {
  fill: var(--dg-theme-navy-text);
}
html.navy-style .flatpickr-calendar :is(.flatpickr-prev-month, .flatpickr-next-month):hover svg {
  fill: var(--bs-primary);
}
html.navy-style .flatpickr-calendar .numInputWrapper span.arrowUp::after {
  border-bottom-color: var(--dg-theme-navy-muted);
}
html.navy-style .flatpickr-calendar .numInputWrapper span.arrowDown::after {
  border-top-color: var(--dg-theme-navy-muted);
}
html.navy-style .flatpickr-calendar .numInputWrapper:hover,
html.navy-style .flatpickr-calendar .numInputWrapper span:is(:hover, :active),
html.navy-style .flatpickr-calendar .flatpickr-monthDropdown-months:hover {
  background-color: var(--dg-theme-navy-hover-surface);
}
html.navy-style .flatpickr-calendar.arrowTop::before,
html.navy-style .flatpickr-calendar.arrowTop::after {
  border-bottom-color: var(--dg-theme-navy-surface);
}
html.navy-style .flatpickr-calendar.arrowBottom::before,
html.navy-style .flatpickr-calendar.arrowBottom::after {
  border-top-color: var(--dg-theme-navy-surface);
}

html.navy-style .popover {
  --bs-popover-bg: var(--dg-theme-navy-surface);
  --bs-popover-border-color: var(--dg-theme-navy-border);
}

html.navy-style .tooltip {
  --bs-tooltip-bg: var(--dg-theme-navy-surface-alt);
}

html.navy-style .table {
  --bs-table-bg: var(--dg-theme-navy-surface);
  --bs-table-color: var(--dg-theme-text-primary);
  --bs-table-border-color: var(--dg-theme-navy-border);
  --bs-table-striped-bg: var(--dg-theme-navy-table-stripe);
  --bs-table-hover-bg: var(--dg-theme-navy-hover-surface);
  --bs-table-active-bg: var(--dg-theme-navy-muted-surface);
}

html.navy-style .table-light,
html.navy-style .table > thead {
  --bs-table-bg: var(--dg-theme-navy-surface-alt);
  --bs-table-color: var(--dg-theme-text-primary);
}

html.navy-style .table > thead > tr > th {
  color: var(--dg-theme-text-primary);
}

/* Use one filter-frame contract in every theme. Select2's vendor popup has
 * border: 0, so set width/style too; colour alone cannot render an outline.
 * Surfaces, focus accents and validation colours remain native to Vuexy. */
html:is(.light-style, .dark-style, .navy-style) :is(.select2-dropdown, .dropdown-menu) {
  border: var(--bs-border-width, 1px) solid var(--dg-select-frame);
}
html:is(.light-style, .dark-style, .navy-style) .select2-container--default .select2-selection,
html:is(.light-style, .dark-style, .navy-style) .select2-container--default .select2-search--dropdown .select2-search__field {
  border-color: var(--dg-select-frame);
}
html:is(.light-style, .dark-style, .navy-style) .select2-container--default:not(.select2-container--disabled) .select2-selection:hover {
  border-color: var(--dg-select-frame-hover);
}
html:is(.light-style, .dark-style, .navy-style) .select2-container--default.select2-container--disabled:not(.is-valid):not(.is-invalid):not(.is-valid *):not(.is-invalid *) .select2-selection {
  border-color: var(--dg-select-frame-disabled) !important;
}

html.navy-style .list-group-item-action:hover,
html.navy-style .list-group-item-action:focus {
  background-color: var(--dg-theme-navy-hover-surface);
}

html.navy-style .modal-header,
html.navy-style .modal-footer,
html.navy-style .border,
html.navy-style .border-top,
html.navy-style .border-end,
html.navy-style .border-bottom,
html.navy-style .border-start {
  border-color: var(--dg-theme-navy-border) !important;
}

html.navy-style .text-secondary,
html.navy-style .text-muted,
html.navy-style .form-text {
  color: var(--dg-theme-navy-muted) !important;
}

.dg-theme-switcher .dropdown-menu {
  min-width: 10rem;
}

.dg-theme-switcher .dropdown-item {
  display: flex;
  align-items: center;
  min-height: 2.5rem;
  gap: 0.625rem;
}

.dg-theme-switcher .dropdown-item [data-dg-theme-check] {
  margin-inline-start: auto;
}

.dg-theme-switcher .dropdown-item.active {
  font-weight: 600;
}

.dg-theme-switcher .dropdown-item:focus-visible,
[data-dg-theme-trigger]:focus-visible {
  outline: 2px solid var(--bs-primary);
  outline-offset: 2px;
}

/* Shared tenant brand: full logo while pinned, favicon in desktop icon-only mode. */
.dg-sidebar-brand-link {
  min-width: 0;
}

.dg-sidebar-brand-logo {
  display: block;
  max-width: 190px;
  max-height: 60px;
  object-fit: contain;
}

.dg-sidebar-brand-favicon {
  display: none;
  flex: 0 0 32px;
  object-fit: contain;
}

html.light-style .dg-sidebar-brand-logo.logo-dark,
html:is(.dark-style, .navy-style) .dg-sidebar-brand-logo.logo-light {
  display: none !important;
}

html.light-style .dg-sidebar-brand-logo.logo-light,
html:is(.dark-style, .navy-style) .dg-sidebar-brand-logo.logo-dark {
  display: block !important;
}

@media (min-width: 768px) {
  html.layout-menu-collapsed:not(.layout-menu-hover) #layout-menu .dg-sidebar-brand-logo {
    display: none !important;
  }

  html.layout-menu-collapsed:not(.layout-menu-hover) #layout-menu .dg-sidebar-brand-favicon {
    display: block;
  }
}

@media (max-width: 575.98px) {
  :root {
    --dg-overlay-popup-side-gap: 0.75rem;
    --dg-overlay-popup-block-gap: 0.75rem;
  }

  /* Ordinary dialogs follow their content, not a fixed portrait card.
   * Complex forms retain their larger geometry. */
  html body .swal2-modal.swal2-popup:not(.dg-popup-medium):not(.dg-popup-large):not(.dg-feedback-loading) {
    width: min(20rem, calc(100vw - 32px)) !important;
    height: auto;
  }

  html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-html-container,
  html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-content {
    max-height: 48dvh;
  }

  .dg-theme-switcher .dropdown-menu {
    max-width: calc(100vw - 1rem);
  }

  .dg-theme-switcher .dropdown-item {
    min-height: 2.75rem;
  }
}

@media (max-height: 599.98px) {
  html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-html-container,
  html:is(.light-style, .dark-style, .navy-style) .swal2-popup .swal2-content {
    max-height: min(17dvh, 6rem);
  }
}

/* One four-colour loading treatment across tables, buttons, dialogs and public
 * pages. Presentation only: existing dimensions, hidden states and request
 * lifecycle remain owned by Bootstrap/DataTables/SweetAlert/the caller. */
html body :is(.spinner-border, .spinner-grow, .swal2-loader,
  .fa-spinner.fa-spin, .fa-circle-notch.fa-spin, .ti-loader.ti-spin, .ti-loader-2.ti-spin) {
  border: 0 !important;
  border-radius: 50%;
  background: conic-gradient(
    #4285f4 0deg 84deg, transparent 84deg 90deg,
    #ea4335 90deg 174deg, transparent 174deg 180deg,
    #fbbc05 180deg 264deg, transparent 264deg 270deg,
    #34a853 270deg 354deg, transparent 354deg 360deg
  ) !important;
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2.5px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2.5px));
  opacity: 1;
  animation: dg-spinner-rotate 1s linear infinite !important;
}

html body :is(.spinner-border-sm, .spinner-grow-sm, .btn .spinner-border, .btn .spinner-grow,
  .fa-spinner.fa-spin, .fa-circle-notch.fa-spin, .ti-loader.ti-spin, .ti-loader-2.ti-spin) {
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1.5px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1.5px));
}

html body :is(.fa-spinner.fa-spin, .fa-circle-notch.fa-spin, .ti-loader.ti-spin, .ti-loader-2.ti-spin) {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -.125em;
}

html body :is(.fa-spinner.fa-spin, .fa-circle-notch.fa-spin, .ti-loader.ti-spin, .ti-loader-2.ti-spin)::before {
  content: none !important;
}

@keyframes dg-spinner-rotate {
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  html body :is(.spinner-border, .spinner-grow, .swal2-loader,
    .fa-spinner.fa-spin, .fa-circle-notch.fa-spin, .ti-loader.ti-spin, .ti-loader-2.ti-spin) {
    animation: none !important;
  }
}

/* Page and modal tabs share the active sidebar accent in every native theme. */
html body .nav:is(.nav-tabs, .nav-pills) .nav-link:not(.active) {
  background: transparent;
  color: var(--bs-body-color);
  box-shadow: none;
}
html body .nav:is(.nav-tabs, .nav-pills) {
  background: transparent;
  box-shadow: none;
}
/* Remove legacy underline borders, including hover and the settings rail. */
html body .nav:is(.nav-tabs, .nav-pills),
html body .nav:is(.nav-tabs, .nav-pills) .nav-link,
html body .nav:is(.nav-tabs, .nav-pills) .nav-link:hover,
html body .nav:is(.nav-tabs, .nav-pills) .nav-link:focus,
html body .settings-tabs-wrap {
  border-bottom: 0 !important;
}
html body .nav:is(.nav-tabs, .nav-pills) .nav-link.active:not(.disabled):not([aria-disabled="true"]):not(:disabled) {
  background: linear-gradient(270deg, rgba(var(--bs-primary-rgb), .7) 0%, var(--bs-primary) 100%) !important;
  color: var(--dg-on-accent, #fff) !important;
  box-shadow: 0 2px 6px rgba(var(--bs-primary-rgb), .3);
}
html body .nav:is(.nav-tabs, .nav-pills) .nav-link:focus-visible {
  outline: 2px solid var(--bs-primary);
  outline-offset: 2px;
}

@media (forced-colors: active) {
  html body .nav:is(.nav-tabs, .nav-pills) .nav-link.active {
    outline: 2px solid Highlight;
    outline-offset: -2px;
  }
  html body :is(.spinner-border, .spinner-grow, .swal2-loader,
    .fa-spinner.fa-spin, .fa-circle-notch.fa-spin, .ti-loader.ti-spin, .ti-loader-2.ti-spin) {
    -webkit-mask: none;
    mask: none;
    background: none !important;
    border: 2px solid CanvasText !important;
    border-right-color: transparent !important;
  }
}

/* Official Digi pair. Sole palette authority; isolated from Light/Dark/Navy.
 * Blue = interaction, purple = secondary emphasis, orange = small highlights.
 * Semantic success/danger/warning stay supplied by the existing component build.
 * Specificity also protects this brand pair from personal accent overrides. */
html.digi-style[data-style] {
  --digi-blue: #2563eb;
  --digi-blue-rgb: 37, 99, 235;
  --digi-blue-soft: #eaf1ff;
  --digi-blue-muted: #0891b2;
  --digi-blue-strong: #1d4ed8;
  --digi-purple: #7c3aed;
  --digi-purple-rgb: 124, 58, 237;
  --digi-purple-soft: #f2edff;
  --digi-purple-muted: #a855f7;
  --digi-purple-strong: #6d28d9;
  --digi-orange: #c2410c;
  --digi-orange-rgb: 194, 65, 12;
  --digi-orange-soft: #fff2e6;
  --digi-orange-muted: #ea580c;
  --digi-orange-strong: #9a3412;
  --theme-bg: #f5f8fd;
  --theme-bg-rgb: 245, 248, 253;
  --theme-bg-secondary: #edf2fa;
  --theme-surface: #ffffff;
  --theme-surface-elevated: var(--theme-surface);
  --theme-border: #dce4f0;
  --theme-control-border: #b9c8dc;
  --theme-text: #24344d;
  --theme-text-rgb: 36, 52, 77;
  --theme-text-secondary: #4b5d76;
  --theme-text-muted: #586b85;
  --theme-on-brand: #ffffff;
  --theme-success: #17834b;
  --theme-danger: #c53038;
  --theme-warning: #9a6700;
  --theme-shadow: 0 2px 12px rgba(25, 55, 100, .07);
  --theme-backdrop: rgba(10, 22, 43, .55);
  --theme-focus-shadow: 0 0 0 2px rgba(var(--digi-blue-rgb), .14);
}
html.digi-style:is([data-style="digidark"],[data-style="digilight"][data-dg-all-dark="true"]) {
  --digi-blue: #60a5fa;
  --digi-blue-rgb: 96, 165, 250;
  --digi-blue-soft: #172c4c;
  --digi-blue-muted: #38bdf8;
  --digi-blue-strong: #1d4ed8;
  --digi-purple: #a78bfa;
  --digi-purple-rgb: 167, 139, 250;
  --digi-purple-soft: #292341;
  --digi-purple-muted: #d8b4fe;
  --digi-purple-strong: #6d28d9;
  --digi-orange: #fb923c;
  --digi-orange-rgb: 251, 146, 60;
  --digi-orange-soft: #35291f;
  --digi-orange-muted: #fbbf24;
  --digi-orange-strong: #9a3412;
  --theme-success: #4ade80;
  --theme-danger: #fb7185;
  --theme-warning: #fbbf24;
  --theme-bg: #0d1729;
  --theme-bg-rgb: 13, 23, 41;
  --theme-bg-secondary: #1b2941;
  --theme-surface: #152239;
  --theme-surface-elevated: #1a2a44;
  --theme-border: #304260;
  --theme-control-border: #506589;
  --theme-text: #e5edf9;
  --theme-text-rgb: 229, 237, 249;
  --theme-text-secondary: #bfcee3;
  --theme-text-muted: #a0b2cd;
  --theme-shadow: 0 2px 14px rgba(5, 12, 27, .25);
  --theme-backdrop: rgba(5, 12, 27, .75);
}
html:is(.digi-style, [data-style="catchy"])[data-style]:is(.light-style, .dark-style) {
  --theme-primary: var(--digi-blue);
  --theme-secondary: var(--digi-purple);
  --theme-accent: var(--digi-orange);
  --theme-link: var(--theme-primary);
  --theme-focus: var(--theme-primary);
  --theme-hover: var(--digi-blue-soft);
  --theme-active: var(--digi-blue-soft);
  --theme-button: var(--digi-blue-strong);
  --theme-button-hover: color-mix(in srgb, var(--digi-blue-strong) 85%, var(--theme-text) 15%);
  --bs-primary: var(--theme-primary);
  --bs-primary-rgb: var(--digi-blue-rgb);
  --bs-link-color: var(--theme-link);
  --bs-link-color-rgb: var(--digi-blue-rgb);
  --bs-link-hover-color-rgb: var(--digi-blue-rgb);
  --bs-link-hover-color: var(--theme-primary);
  --bs-body-bg: var(--theme-bg);
  --bs-body-bg-rgb: var(--theme-bg-rgb);
  --bs-body-color: var(--theme-text);
  --bs-body-color-rgb: var(--theme-text-rgb);
  --bs-heading-color: var(--theme-text);
  --bs-secondary-color: var(--theme-text-secondary);
  --bs-tertiary-color: var(--theme-text-muted);
  --bs-secondary-bg: var(--theme-bg-secondary);
  --bs-tertiary-bg: var(--theme-bg-secondary);
  --bs-paper-bg: var(--theme-surface);
  --bs-border-color: var(--theme-border);
  --bs-border-color-translucent: var(--theme-border);
  --dg-theme-text-primary: var(--theme-text);
  --dg-theme-text-secondary: var(--theme-text-secondary);
  --dg-theme-text-muted: var(--theme-text-muted);
  --dg-ui-light-text: var(--theme-text);
  --dg-ui-light-heading: var(--theme-text);
  --dg-ui-light-muted: var(--theme-text-muted);
  --dg-ui-light-sidebar: var(--theme-text-secondary);
  --dg-overlay-surface: var(--theme-surface-elevated);
  --dg-overlay-input: var(--theme-surface);
  --dg-overlay-title: var(--theme-text);
  --dg-overlay-text: var(--theme-text);
  --dg-overlay-muted: var(--theme-text-muted);
  --dg-overlay-border: var(--theme-border);
  --dg-overlay-control-border: var(--theme-control-border);
  --dg-overlay-hover: var(--theme-hover);
  --dg-overlay-backdrop: var(--theme-backdrop);
  --dg-overlay-shadow: var(--theme-shadow);
  --dg-surface: var(--theme-surface);
  --dg-surface-muted: var(--theme-bg-secondary);
  --dg-surface-hover: var(--theme-hover);
  --dg-on-accent: var(--theme-on-brand);
  --dg-select-frame: var(--theme-control-border);
  --dg-select-frame-hover: var(--theme-primary);
  --dg-select-frame-disabled: var(--theme-border);
  --dg-stat-accent-primary: var(--theme-primary);
  --dg-stat-accent-success: var(--theme-success);
  --dg-stat-accent-danger: var(--theme-danger);
  --dg-stat-accent-warning: var(--theme-warning);
  --dg-stat-accent-info: var(--theme-primary);
  --dg-stat-accent-secondary: var(--theme-secondary);
  --dg-accent: var(--theme-button);
  --dg-accent-rgb: var(--digi-blue-rgb);
  --dg-accent-hover: var(--theme-button-hover);
  --dg-accent-link: var(--theme-link);
  --dg-accent-soft: var(--theme-active);
}
html:is(.digi-style, [data-style="catchy"])[data-style] :is(body, .content-wrapper) { background-color: var(--theme-bg); color: var(--theme-text); }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.card, .modal-content, .offcanvas, .list-group-item:not(.active), .tab-content, .toast) {
  --bs-card-bg: var(--theme-surface);
  --bs-modal-bg: var(--theme-surface-elevated);
  --bs-card-color: var(--theme-text);
  background-color: var(--theme-surface);
  color: var(--theme-text);
  border-color: var(--theme-border);
}
html:is(.digi-style, [data-style="catchy"])[data-style] .card { box-shadow: var(--theme-shadow); }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.bg-menu-theme, .bg-navbar-theme, .bg-footer-theme) { background: var(--theme-surface) !important; color: var(--theme-text); box-shadow: var(--theme-shadow); }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.bg-white, .bg-light) { background-color: var(--theme-surface) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] .text-dark { color: var(--theme-text) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.text-muted, .form-text) { color: var(--theme-text-muted) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] .text-primary { color: var(--theme-primary) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.bg-label-primary, .btn-label-primary) { background: var(--digi-blue-soft) !important; color: var(--theme-primary) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.brand-secondary-value, .text-brand-secondary) { color: var(--theme-secondary) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.brand-primary-value, .text-brand-primary) { color: var(--theme-primary) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.brand-accent-value, .text-brand-accent) { color: var(--theme-accent) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] .bg-label-brand-secondary { color: var(--theme-secondary); background: var(--digi-purple-soft); }
html:is(.digi-style, [data-style="catchy"])[data-style] .bg-label-brand-accent { color: var(--theme-accent); background: var(--digi-orange-soft); }
/* Explicit reusable card roles; existing status/icon mapping remains authoritative otherwise. */
html:is(.digi-style, [data-style="catchy"])[data-style] .dg-stat-card[data-dg-brand="primary"] { --dg-stat-accent: var(--theme-primary); }
html:is(.digi-style, [data-style="catchy"])[data-style] .dg-stat-card[data-dg-brand="secondary"] { --dg-stat-accent: var(--theme-secondary); }
html:is(.digi-style, [data-style="catchy"])[data-style] .dg-stat-card[data-dg-brand="accent"] { --dg-stat-accent: var(--theme-accent); }
html:is(.digi-style, [data-style="catchy"])[data-style] .dg-stat-card[data-dg-brand] .dg-stat-icon { background: color-mix(in srgb, var(--dg-stat-accent) 12%, var(--theme-surface)) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] .menu .menu-inner .menu-item > .menu-link { color: var(--theme-text-secondary); }
html:is(.digi-style, [data-style="catchy"])[data-style] .menu .menu-inner .menu-item:not(.active) > .menu-link:hover { background: var(--theme-hover); color: var(--theme-primary); }
html:is(.digi-style, [data-style="catchy"])[data-style] .menu .menu-inner .menu-item.active > .menu-link { background: var(--theme-active) !important; color: var(--theme-primary) !important; box-shadow: inset 3px 0 var(--theme-primary); }
html:is(.digi-style, [data-style="catchy"])[data-style] .menu .menu-inner .menu-item.active > .menu-link :is(.menu-icon, .menu-text) { color: inherit; }
html:is(.digi-style, [data-style="catchy"])[data-style] .bg-menu-theme .menu-inner-shadow { background: linear-gradient(var(--theme-surface), transparent); }
html:is(.digi-style, [data-style="catchy"])[data-style].layout-navbar-fixed .layout-page::before { background: var(--theme-bg); }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.btn-primary, .swal2-confirm:not(.btn-danger):not(.btn-success):not(.btn-warning)) {
  --bs-btn-bg: var(--theme-button); --bs-btn-border-color: var(--theme-button);
  --bs-btn-hover-bg: var(--theme-button-hover); --bs-btn-active-bg: var(--theme-button-hover);
  background: var(--theme-button); border-color: var(--theme-button); color: var(--theme-on-brand);
  box-shadow: none;
}
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.btn-primary, .swal2-confirm:not(.btn-danger):not(.btn-success):not(.btn-warning)):hover { background: var(--theme-button-hover); border-color: var(--theme-button-hover); }
html:is(.digi-style, [data-style="catchy"])[data-style] .btn-brand-secondary { background: var(--digi-purple-strong); color: var(--theme-on-brand); border-color: var(--digi-purple-strong); }
html:is(.digi-style, [data-style="catchy"])[data-style] .btn-outline-primary { color: var(--theme-primary); border-color: var(--theme-primary); }
html:is(.digi-style, [data-style="catchy"])[data-style] .btn-outline-primary:is(:hover, :active) { background: var(--theme-button); color: var(--theme-on-brand); }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.nav-tabs, .nav-pills) .nav-link { color: var(--theme-text-secondary); }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.nav-tabs, .nav-pills) .nav-link:hover { color: var(--theme-primary); background: var(--theme-hover); }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.nav-tabs, .nav-pills) .nav-link.active { color: var(--theme-primary) !important; background: var(--theme-active) !important; box-shadow: inset 0 -2px var(--theme-primary) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.nav-tabs, .nav-pills) .tab-slider { background: var(--theme-active); }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.form-control, .form-select, .input-group-text, .select2-selection, .select2-search__field) {
  background-color: var(--theme-surface) !important; color: var(--theme-text) !important;
}
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.form-control, .form-select, .select2-selection, .select2-search__field):not(:focus):not(.is-invalid):not(.is-valid) { border-color: var(--theme-control-border) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.form-control, .form-select, .select2-search__field):focus:not(.is-invalid):not(.is-valid),
html:is(.digi-style, [data-style="catchy"])[data-style] .select2-container--focus .select2-selection:not(.is-invalid):not(.is-valid) { border-color: var(--theme-focus) !important; box-shadow: var(--theme-focus-shadow); }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(input, textarea)::placeholder { color: var(--theme-text-muted); opacity: 1; }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.form-control, .form-select):disabled { background: var(--theme-bg-secondary) !important; color: var(--theme-text-muted) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] .form-check-input:checked { background-color: var(--theme-button); border-color: var(--theme-button); }
html:is(.digi-style, [data-style="catchy"])[data-style] .form-check-input:focus { border-color: var(--theme-focus) !important; box-shadow: var(--theme-focus-shadow); }
html:is(.digi-style, [data-style="catchy"])[data-style] .select2-selection__rendered { color: var(--theme-text) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.table, .dg-data-table) {
  --bs-table-color: var(--theme-text); --bs-table-bg: var(--theme-surface);
  --bs-table-border-color: var(--theme-border); --bs-table-hover-bg: var(--theme-hover);
  --bs-table-hover-color: var(--theme-text); --bs-table-striped-bg: var(--theme-bg-secondary);
  --bs-table-striped-color: var(--theme-text); --bs-table-active-bg: var(--theme-active);
  --bs-table-active-color: var(--theme-text);
  --bs-body-color: var(--theme-text); --bs-heading-color: var(--theme-text);
}
html:is(.digi-style, [data-style="catchy"])[data-style] .table > thead { background: var(--theme-bg-secondary); }
html:is(.digi-style, [data-style="catchy"])[data-style] .table > thead > tr > th { background: var(--theme-bg-secondary); color: var(--theme-text-secondary); border-color: var(--theme-border); }
html:is(.digi-style, [data-style="catchy"])[data-style] .table > tbody > tr.selected > * { background: var(--theme-active); }
html:is(.digi-style, [data-style="catchy"])[data-style] .page-link { background: var(--theme-bg-secondary); color: var(--theme-text-secondary); }
html:is(.digi-style, [data-style="catchy"])[data-style] .pagination .page-item.active .page-link { background: var(--theme-button) !important; color: var(--theme-on-brand) !important; border-color: var(--theme-button); }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.dropdown-menu, .select2-dropdown, .swal2-popup, .flatpickr-calendar, .popover) {
  background: var(--theme-surface-elevated); color: var(--theme-text); border-color: var(--theme-border); box-shadow: var(--theme-shadow);
  --bs-dropdown-bg: var(--theme-surface-elevated); --bs-dropdown-color: var(--theme-text);
  --bs-dropdown-link-color: var(--theme-text); --bs-dropdown-link-hover-color: var(--theme-primary);
  --bs-dropdown-link-hover-bg: var(--theme-hover); --bs-dropdown-link-active-bg: var(--theme-active);
  --bs-dropdown-link-active-color: var(--theme-primary); --bs-dropdown-divider-bg: var(--theme-border);
  --bs-popover-bg: var(--theme-surface-elevated); --bs-popover-header-bg: var(--theme-bg-secondary);
  --bs-popover-header-color: var(--theme-text); --bs-popover-body-color: var(--theme-text);
  --bs-popover-border-color: var(--theme-border);
}
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.swal2-title, .swal2-html-container, .swal2-content, .swal2-input-label) { color: var(--theme-text); }
html:is(.digi-style, [data-style="catchy"])[data-style] .swal2-input { color: var(--theme-text); background: var(--theme-surface); border-color: var(--theme-control-border); }
html:is(.digi-style, [data-style="catchy"])[data-style] .swal2-container.swal2-backdrop-show { background: var(--theme-backdrop); }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.dropdown-item.active, .select2-results__option--highlighted[aria-selected]) { background: var(--theme-active); color: var(--theme-primary); }
html:is(.digi-style, [data-style="catchy"])[data-style] .tooltip { --bs-tooltip-bg: var(--theme-text); --bs-tooltip-color: var(--theme-bg); }
html:is(.digi-style, [data-style="catchy"])[data-style] .accordion { --bs-accordion-bg: var(--theme-surface); --bs-accordion-color: var(--theme-text); --bs-accordion-border-color: var(--theme-border); --bs-accordion-btn-bg: var(--theme-surface); --bs-accordion-btn-color: var(--theme-text); --bs-accordion-active-bg: var(--theme-active); --bs-accordion-active-color: var(--theme-primary); }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.flatpickr-month, .flatpickr-weekday, .flatpickr-current-month, .flatpickr-day, .flatpickr-time input) { color: var(--theme-text); }
/* Compiled vendor calendar marks these states !important; theme must win. */
html:is(.digi-style, [data-style="catchy"])[data-style] .flatpickr-day:is(.selected,.startRange,.endRange) { background: var(--theme-button) !important; color: var(--theme-on-brand) !important; border-color: var(--theme-button) !important; box-shadow:none; }
html:is(.digi-style, [data-style="catchy"])[data-style] .flatpickr-day.inRange:not(.selected):not(.startRange):not(.endRange) {background:var(--theme-active) !important;color:var(--theme-primary) !important;border-color:var(--theme-active) !important;box-shadow:none;}
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.apexcharts-tooltip, .apexcharts-xaxistooltip) { background: var(--theme-surface-elevated) !important; color: var(--theme-text) !important; border-color: var(--theme-border) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] .apexcharts-tooltip-title { background: var(--theme-bg-secondary) !important; border-color: var(--theme-border) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(a, button, input, select, textarea):focus-visible { outline: 2px solid var(--theme-focus); outline-offset: 2px; }

html:is(.digi-style, [data-style="catchy"])[data-style] :is(.text-success, .bg-label-success) { color: var(--theme-success) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.text-danger, .bg-label-danger) { color: var(--theme-danger) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.text-warning, .bg-label-warning) { color: var(--theme-warning) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] .select2-selection__choice { color: var(--theme-text); background: var(--theme-bg-secondary); border-color: var(--theme-border); }
html:is(.digi-style, [data-style="catchy"])[data-style] .select2-results__option[aria-selected="true"]:not(.select2-results__option--highlighted) { color: var(--theme-primary); background: var(--theme-active); }
html:is(.digi-style, [data-style="catchy"])[data-style] .flatpickr-calendar :is(.flatpickr-days,.dayContainer,.flatpickr-month,.flatpickr-weekday,.flatpickr-weekdays,.flatpickr-weeks,.flatpickr-months,.flatpickr-time) { background: var(--theme-surface-elevated); border-color: var(--theme-border); }
html:is(.digi-style, [data-style="catchy"])[data-style] .flatpickr-months :is(.flatpickr-prev-month, .flatpickr-next-month) { fill: var(--theme-text); color: var(--theme-text); }
html:is(.digi-style, [data-style="catchy"])[data-style] .flatpickr-day:is(.prevMonthDay, .nextMonthDay, .flatpickr-disabled) { color: var(--theme-text-muted); }
html:is(.digi-style, [data-style="catchy"])[data-style] .flatpickr-calendar :is(.cur-month,.cur-year,.flatpickr-monthDropdown-months,.flatpickr-am-pm,.flatpickr-time-separator) {color:var(--theme-text);}
html:is(.digi-style, [data-style="catchy"])[data-style] .flatpickr-monthDropdown-months {background-color:var(--theme-surface-elevated);}
html:is(.digi-style, [data-style="catchy"])[data-style] .flatpickr-day:not(.selected):not(.startRange):not(.endRange):not(.flatpickr-disabled):is(:hover,:focus) {background:var(--theme-hover);border-color:var(--theme-border);}
html:is(.digi-style, [data-style="catchy"])[data-style] .select2-container--disabled .select2-selection { background: var(--theme-bg-secondary) !important; }
/* Dropdown/filter colour authority. Native popups, body-mounted Select2 and
 * modal pickers all inherit the current theme; no per-page colour overrides. */
html:is(.digi-style, [data-style="catchy"]).light-style select { color-scheme: light; }
html:is(.digi-style, [data-style="catchy"]).dark-style select { color-scheme: dark; }
html:is(.digi-style, [data-style="catchy"])[data-style] select :is(option, optgroup) {
  background-color: var(--dg-overlay-input);
  color: var(--dg-overlay-title);
}
html:is(.digi-style, [data-style="catchy"])[data-style] select option:disabled { color: var(--dg-overlay-muted); }
html:is(.digi-style, [data-style="catchy"])[data-style] .select2-container--default .select2-dropdown {
  background-color: var(--theme-surface-elevated);
  color: var(--theme-text);
  border-color: var(--theme-border);
}
html:is(.digi-style, [data-style="catchy"])[data-style] .select2-container--default .select2-results__group { color: var(--theme-text-secondary); }
html:is(.digi-style, [data-style="catchy"])[data-style] .select2-container--default :is(.select2-selection__placeholder, .select2-selection__clear, .select2-selection__choice__remove) { color: var(--theme-text-muted); }
html:is(.digi-style, [data-style="catchy"])[data-style] .select2-container--default.select2-container--disabled .select2-selection__rendered { color: var(--theme-text-muted) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] .select2-container--default .select2-results__option[aria-disabled="true"] { color: var(--theme-text-muted) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] .select2-container--default .select2-selection--multiple .select2-selection__choice {
  color: var(--theme-text);
  background-color: var(--theme-bg-secondary);
  border-color: var(--theme-border);
}
html:is(.digi-style, [data-style="catchy"])[data-style] .select2-container--default .select2-selection__arrow b { border-top-color: var(--theme-text-secondary); }
html:is(.digi-style, [data-style="catchy"])[data-style] .select2-container--default.select2-container--open .select2-selection__arrow b {
  border-top-color: transparent;
  border-bottom-color: var(--theme-text-secondary);
}
html:is(.digi-style, [data-style="catchy"])[data-style] .select2-container--default.select2-container--open:not(.is-invalid):not(.is-valid):not(.is-invalid *):not(.is-valid *) .select2-selection {
  border-color: var(--theme-focus) !important;
  box-shadow: var(--theme-focus-shadow);
}
html:is(.digi-style, [data-style="catchy"])[data-style] .dropdown-menu {
  --bs-dropdown-link-disabled-color: var(--theme-text-muted);
  --bs-dropdown-header-color: var(--theme-text-secondary);
}
html:is(.digi-style, [data-style="catchy"])[data-style] .dropdown-menu .dropdown-item:is(:hover, :focus):not(.disabled):not(:disabled) {
  background-color: var(--theme-hover);
  color: var(--theme-primary);
}
html:is(.digi-style, [data-style="catchy"])[data-style] .form-check-input:not(:checked) { background-color: var(--theme-surface); border-color: var(--theme-control-border); }
html:is(.digi-style, [data-style="catchy"])[data-style] .select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--theme-active) !important; color: var(--theme-primary) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] .select2-results__option:not(.select2-results__option--highlighted):not([aria-selected="true"]):not([aria-disabled="true"]) { color: var(--theme-text); }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.select2-results__option[aria-disabled="true"], .select2-selection__placeholder) { color: var(--theme-text-muted); }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.form-label, .col-form-label, .form-check-label, .input-group-text) { color: var(--theme-text); }
html:is(.digi-style, [data-style="catchy"])[data-style] .bg-primary { background-color: var(--theme-button) !important; color: var(--theme-on-brand); }
html:is(.digi-style, [data-style="catchy"])[data-style] .bg-primary.bg-opacity-10 { background-color: var(--digi-blue-soft) !important; color: var(--theme-primary); }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.progress-bar, .flatpickr-day.startRange, .flatpickr-day.endRange) { background-color: var(--theme-button); }
html:is(.digi-style, [data-style="catchy"])[data-style] :is(.btn-text-primary, .btn-link) { color: var(--theme-primary); }
html:is(.digi-style, [data-style="catchy"])[data-style] .btn-label-primary:hover { background-color: var(--theme-active) !important; }
html:is(.digi-style, [data-style="catchy"])[data-style] .page-item .page-link:is(:hover, :focus) { background: var(--theme-hover); color: var(--theme-primary); box-shadow: none; }
html:is(.digi-style, [data-style="catchy"])[data-style] .dropdown-item:is(:hover, :focus) { background: var(--theme-hover); color: var(--theme-primary); }

.dg-digi-brand-only { display: none; }
html.digi-style[data-style] .dg-account-brand > :is(.account-brand-mark, .app-brand-text) { display: none; }
html.digi-style[data-style] .dg-account-brand > .dg-sidebar-brand-logo { display: block; }
@media (min-width: 768px) {
  html.digi-style[data-style].layout-menu-collapsed:not(.layout-menu-hover) .dg-account-brand > .dg-sidebar-brand-logo { display: none; }
  html.digi-style[data-style].layout-menu-collapsed:not(.layout-menu-hover) .dg-account-brand > .dg-sidebar-brand-favicon { display: block; }
}
/* Validation must outrank both brand focus and personal accent preferences. */
html.digi-style[data-style] :is(.form-control, .form-select, .select2-selection, .form-check-input).is-invalid,
html.digi-style[data-style] .was-validated :is(.form-control, .form-select, .form-check-input):invalid { border-color: var(--theme-danger) !important; }
html.digi-style[data-style] :is(.form-control, .form-select, .select2-selection, .form-check-input).is-valid,
html.digi-style[data-style] .was-validated :is(.form-control, .form-select, .form-check-input):valid { border-color: var(--theme-success) !important; }
html.digi-style[data-style] :is(.form-control, .form-select, .select2-selection).is-invalid:focus { box-shadow: 0 0 0 2px color-mix(in srgb, var(--theme-danger) 14%, transparent); }
html.digi-style[data-style] :is(.form-control, .form-select, .select2-selection).is-valid:focus { box-shadow: 0 0 0 2px color-mix(in srgb, var(--theme-success) 14%, transparent); }
html.digi-style[data-style] .invalid-feedback { color: var(--theme-danger); }
html.digi-style[data-style] .valid-feedback { color: var(--theme-success); }

/* Official account branding also applies when a legacy theme is selected. */
.dg-account-brand > .dg-sidebar-brand-logo {display:block;width:170px;height:50px;object-fit:cover;}
.dg-account-brand > .dg-sidebar-brand-favicon {display:none;}
/* Catchy is a skin, not a second layout or component engine. */
html:root[data-style="catchy"]:is(.light-style,.dark-style) {
  --catchy-page-gradient:linear-gradient(145deg,#effbfc,#f5f4fc 65%,#f4faf1);
  --catchy-card-middle:#ffffffeb;
  /* Reuse the tokenized component contract, including body-mounted pickers.
   * data-style is the theme authority, not an optional decoration class.
   * Do not add digi-style: account branding remains independent of Catchy. */
  --digi-blue:#087f98; --digi-blue-rgb:8,127,152;
  --digi-blue-soft:#e4f4f7; --digi-blue-strong:#087f98;
  --digi-purple:#e27779; --digi-purple-rgb:226,119,121;
  --digi-purple-soft:#fff0ed; --digi-purple-strong:#af4d60;
  --digi-orange:#659e35; --digi-orange-rgb:101,158,53;
  --digi-orange-soft:#edf6e1; --digi-orange-strong:#4b7b24;
  --theme-bg-rgb:240,248,250; --theme-bg-secondary:#edf6f8;
  --theme-surface-elevated:#faffff; --theme-control-border:#b5d3dd;
  --theme-text-rgb:49,93,112; --theme-text-secondary:#527783;
  --theme-on-brand:#fff; --theme-shadow:0 4px 18px rgba(32,108,128,.07);
  --theme-backdrop:rgba(18,48,60,.55);
  --theme-focus-shadow:0 0 0 2px rgba(8,127,152,.14);
  --bs-primary:#087f98; --bs-primary-rgb:8,127,152;
  --bs-body-color:#315d70; --bs-heading-color:#166b83; --bs-body-bg:#f0f8fa;
  --bs-secondary-color:#688391; --bs-border-color:#d3e7ec;
  --theme-primary:#087f98; --theme-info:#358be8; --theme-success:#159777;
  --theme-warning:#d78620; --theme-danger:#dd5975; --theme-text:#315d70;
  --theme-muted:#688391; --theme-border:#d3e7ec; --theme-surface:#faffff;
  --theme-bg:#f0f8fa; --theme-heading:#166b83;
  --theme-text-muted:#688391; --theme-secondary:#e27779; --theme-accent:#659e35;
  --dg-surface:#faffff; --dg-overlay-surface:#faffff; --dg-overlay-text:#315d70;
  --dg-overlay-border:#d3e7ec; --dg-surface-hover:#e4f4f7;
  color-scheme:light;
}
/* Native filter popups must use the Catchy scheme too, independently of OS
 * preference or a container's inherited dark scheme. No filter/value changes. */
html[data-style="catchy"] :is(select,.select2-dropdown,.dropdown-menu) {color-scheme:var(--catchy-color-scheme,light);}
html[data-style="catchy"] body {color:var(--bs-body-color);background:var(--catchy-page-gradient);}
html[data-style="catchy"] :is(h1,h2,h3,h4,h5,h6,.card-title) {color:var(--bs-heading-color);}
html[data-style="catchy"] .text-muted {color:var(--bs-secondary-color) !important;}
html[data-style="catchy"] .card {
  --catchy-wash:#d4f4f2; --catchy-end:#e7f5ff;
  border-color:var(--bs-border-color); border-radius:16px;
  box-shadow:0 4px 18px rgba(32,108,128,.07);
  animation:dg-catchy-in .28s ease-out;
}
html[data-style="catchy"] .card[data-dg-catchy-tone="1"] {--catchy-wash:#ffe1d7;--catchy-end:#fff3df;}
html[data-style="catchy"] .card[data-dg-catchy-tone="2"] {--catchy-wash:#e9e0ff;--catchy-end:#e7f4ff;}
html[data-style="catchy"] .card[data-dg-catchy-tone="3"] {--catchy-wash:#e5f3cc;--catchy-end:#e0f7f1;}
html[data-style="catchy"] .card[data-dg-catchy-tone="4"] {--catchy-wash:#dcecff;--catchy-end:#ffe9f1;}
html[data-style="catchy"] .card:not([class*="bg-"]) {background:linear-gradient(125deg,var(--catchy-wash),var(--catchy-card-middle) 55%,var(--catchy-end));}
html[data-style="catchy"] .card-header:not([class*="bg-"]) {background:transparent;border-color:var(--bs-border-color);}
html[data-style="catchy"] :is(.bg-menu-theme,.bg-navbar-theme) {background:#f9ffff !important;color:var(--bs-body-color);}
html[data-style="catchy"] .menu-inner .menu-item.active > .menu-link {background:linear-gradient(110deg,#087f98,#399cbd);color:#fff;}
html[data-style="catchy"] :is(.dropdown-menu,.modal-content,.swal2-popup,.select2-dropdown,.flatpickr-calendar) {background:#faffff;color:var(--bs-body-color);border-color:var(--bs-border-color);}
html[data-style="catchy"] :is(.form-control,.form-select,.select2-selection) {background-color:#ffffffd9;color:var(--bs-body-color);border-color:var(--bs-border-color);}
html[data-style="catchy"] .table {--bs-table-color:var(--bs-body-color);--bs-table-bg:transparent;--bs-table-border-color:var(--bs-border-color);}
html[data-style="catchy"] .table th {color:var(--bs-heading-color);}
html[data-style="catchy"] .nav-pills .nav-link.active {background:#087f98;color:#fff;}
html[data-style] {
  --dg-public-page:var(--bs-body-bg);--dg-public-heading:var(--bs-heading-color);
  --dg-public-copy:var(--bs-body-color);--dg-public-border:var(--bs-border-color);--dg-public-muted:var(--bs-secondary-color);
}
html[data-style] .dg-public-landing {
  --brand-page:var(--dg-public-page);--brand-ink:var(--dg-public-heading);--brand-copy:var(--dg-public-copy);
  --brand-border:var(--dg-public-border);--brand-muted:var(--dg-public-muted);
}
html[data-style="catchy"] .btn {transition:background-color .16s,box-shadow .16s;}
/* One Catchy button authority. Vuexy uses fixed purple !important states;
 * matching that priority here keeps hover/press/disabled and late vendor CSS
 * on the same palette. Semantic success/danger/warning buttons are untouched. */
html:root[data-style="catchy"] :is(.btn-primary, :where(.swal2-confirm:not([class*="btn-"]))) {
  --catchy-btn-bg: linear-gradient(110deg,var(--theme-button),#309aba);
  --catchy-btn-color: var(--theme-on-brand);
  --catchy-btn-border: var(--theme-button);
  --catchy-btn-hover-bg: var(--theme-button-hover);
  --catchy-btn-hover-color: var(--theme-on-brand);
  --catchy-btn-hover-border: var(--theme-button-hover);
  --catchy-btn-active-bg: var(--theme-button-hover);
  --catchy-btn-active-color: var(--theme-on-brand);
  --catchy-btn-active-border: var(--theme-button-hover);
  --catchy-btn-disabled-bg: var(--theme-button);
}
html:root[data-style="catchy"] :is(.btn-outline-primary,.btn-label-primary,.btn-text-primary,.btn-link) {
  --catchy-btn-bg: transparent;
  --catchy-btn-color: var(--theme-primary);
  --catchy-btn-border: transparent;
  --catchy-btn-hover-bg: var(--theme-active);
  --catchy-btn-hover-color: var(--theme-primary);
  --catchy-btn-hover-border: transparent;
  --catchy-btn-active-bg: var(--theme-active);
  --catchy-btn-active-color: var(--theme-primary);
  --catchy-btn-active-border: transparent;
}
html:root[data-style="catchy"] .btn-outline-primary {
  --catchy-btn-border: var(--theme-primary);
  --catchy-btn-hover-bg: var(--theme-button);
  --catchy-btn-hover-color: var(--theme-on-brand);
  --catchy-btn-hover-border: var(--theme-button);
}
html:root[data-style="catchy"] .btn-label-primary { --catchy-btn-bg: var(--theme-active); }
html:root[data-style="catchy"] :is(.btn-outline-primary,.btn-label-primary) {
  --catchy-btn-active-bg: var(--theme-button);
  --catchy-btn-active-color: var(--theme-on-brand);
  --catchy-btn-active-border: var(--theme-button);
}
html:root[data-style="catchy"] .btn-link { --catchy-btn-hover-bg: transparent; --catchy-btn-active-bg: transparent; }
/* Explicit personal colors remain authoritative, including interaction states. */
html:root[data-style="catchy"][data-dg-custom-color-primary] .btn-primary {
  --catchy-btn-bg: var(--dg-color-primary); --catchy-btn-border: var(--dg-color-primary);
  --catchy-btn-hover-bg: var(--dg-color-primary); --catchy-btn-hover-border: var(--dg-color-primary);
  --catchy-btn-active-bg: var(--dg-color-primary); --catchy-btn-active-border: var(--dg-color-primary);
  --catchy-btn-disabled-bg: var(--dg-color-primary);
}
html:root[data-style="catchy"][data-dg-custom-color-primary-text] .btn-primary {
  --catchy-btn-color: var(--dg-color-primary-text); --catchy-btn-hover-color: var(--dg-color-primary-text); --catchy-btn-active-color: var(--dg-color-primary-text);
}
html:root[data-style="catchy"] :is(.btn-primary,.btn-outline-primary,.btn-label-primary,.btn-text-primary,.btn-link,:where(.swal2-confirm:not([class*="btn-"]))):where(:not(.dg-page-back)) {
  background: var(--catchy-btn-bg) !important;
  color: var(--catchy-btn-color) !important;
  border-color: var(--catchy-btn-border) !important;
  box-shadow: none !important;
}
html:root[data-style="catchy"] :is(.btn-primary,.btn-outline-primary,.btn-label-primary,.btn-text-primary,.btn-link,:where(.swal2-confirm:not([class*="btn-"]))):where(:not(.dg-page-back)):is(:hover,:focus,.focus),
html:root[data-style="catchy"] .btn-check:focus + :is(.btn-primary,.btn-outline-primary,.btn-label-primary,.btn-text-primary) {
  background: var(--catchy-btn-hover-bg) !important;
  color: var(--catchy-btn-hover-color) !important;
  border-color: var(--catchy-btn-hover-border) !important;
}
html:root[data-style="catchy"] :is(.btn-primary,.btn-outline-primary,.btn-label-primary,.btn-text-primary,.btn-link,:where(.swal2-confirm:not([class*="btn-"]))):where(:not(.dg-page-back)):is(:active,.active,.show,[aria-pressed="true"]),
html:root[data-style="catchy"] .btn-check:checked + :is(.btn-primary,.btn-outline-primary,.btn-label-primary,.btn-text-primary),
html:root[data-style="catchy"] .show > :is(.btn-primary,.btn-outline-primary,.btn-label-primary,.btn-text-primary).dropdown-toggle {
  background: var(--catchy-btn-active-bg) !important;
  color: var(--catchy-btn-active-color) !important;
  border-color: var(--catchy-btn-active-border) !important;
}
html:root[data-style="catchy"] :is(.btn-primary,.btn-outline-primary,.btn-label-primary,.btn-text-primary,.btn-link,:where(.swal2-confirm:not([class*="btn-"]))):where(:not(.dg-page-back)):is(:disabled,.disabled),
html:root[data-style="catchy"] .btn-check:disabled + :is(.btn-primary,.btn-outline-primary,.btn-label-primary,.btn-text-primary) {
  background: var(--catchy-btn-disabled-bg,var(--catchy-btn-bg)) !important;
  color: var(--catchy-btn-color) !important;
  border-color: var(--catchy-btn-border) !important;
}
html:root[data-style="catchy"] :is(.btn-primary,.btn-outline-primary,.btn-label-primary,.btn-text-primary,.btn-link):focus-visible { outline: 2px solid var(--theme-focus); outline-offset: 2px; }
html:root[data-style="catchy"] :is(.btn-primary,.btn-outline-primary,.btn-label-primary,.btn-text-primary) .waves-ripple { background: radial-gradient(color-mix(in srgb,var(--theme-primary) 35%,transparent),transparent 70%); }
html:root[data-style="catchy"] .btn-outline-primary .badge { background: var(--theme-button); border-color: var(--theme-button); color: var(--theme-on-brand); }
html.catchy-style[data-style="catchy"] body .nav:is(.nav-tabs,.nav-pills) .nav-link.active:not(.disabled):not([aria-disabled="true"]):not(:disabled),
html.catchy-style[data-style="catchy"] .pagination .page-item.active .page-link {background:var(--theme-button) !important;color:var(--theme-on-brand) !important;border-color:var(--theme-button);box-shadow:none !important;}
html.catchy-style[data-style="catchy"] .btn-label-secondary[aria-pressed="true"] {background:var(--theme-button) !important;color:var(--theme-on-brand) !important;border-color:var(--theme-button) !important;}
/* All Dark is a personal palette modifier, never a theme ID or layout. */
html:root[data-style="catchy"][data-dg-all-dark="true"].dark-style {
  --digi-blue:#65d4de;--digi-blue-rgb:101,212,222;--digi-blue-soft:#1a3845;--digi-blue-strong:#137f94;
  --digi-purple:#f5a1aa;--digi-purple-rgb:245,161,170;--digi-purple-soft:#392b3b;
  --digi-orange:#b6d77c;--digi-orange-rgb:182,215,124;--digi-orange-soft:#29392c;
  --theme-bg:#101e2b;--theme-bg-rgb:16,30,43;--theme-bg-secondary:#213344;
  --theme-surface:#192c3b;--theme-surface-elevated:#203546;--theme-border:#375365;--theme-control-border:#527489;
  --theme-text:#d2e8ed;--theme-text-rgb:210,232,237;--theme-text-secondary:#bad4de;--theme-text-muted:#a0bdc8;
  --theme-primary:var(--digi-blue);--theme-secondary:var(--digi-purple);--theme-accent:var(--digi-orange);
  --theme-success:#61d9ac;--theme-danger:#ff98ac;--theme-warning:#efc36b;
  --theme-heading:#a5e9ee;--theme-shadow:0 4px 18px rgba(5,14,24,.22);--theme-backdrop:rgba(4,13,24,.7);
  --bs-body-color:var(--theme-text);--bs-body-bg:var(--theme-bg);--bs-heading-color:var(--theme-heading);
  --bs-primary:var(--theme-primary);--bs-primary-rgb:var(--digi-blue-rgb);--bs-secondary-color:var(--theme-text-muted);--bs-border-color:var(--theme-border);
  --dg-surface:var(--theme-surface);--dg-overlay-surface:var(--theme-surface-elevated);--dg-overlay-text:var(--theme-text);--dg-overlay-border:var(--theme-border);--dg-surface-hover:var(--digi-blue-soft);
  --catchy-color-scheme:dark;--catchy-card-middle:#192c3bed;
  --catchy-page-gradient:linear-gradient(145deg,#102830,#191f35 65%,#182b26);
  color-scheme:dark;
}
html[data-style="catchy"][data-dg-all-dark="true"] .card {--catchy-wash:#18434a;--catchy-end:#22384e;}
html[data-style="catchy"][data-dg-all-dark="true"] .card[data-dg-catchy-tone="1"] {--catchy-wash:#49303b;--catchy-end:#3b352e;}
html[data-style="catchy"][data-dg-all-dark="true"] .card[data-dg-catchy-tone="2"] {--catchy-wash:#352e51;--catchy-end:#203c51;}
html[data-style="catchy"][data-dg-all-dark="true"] .card[data-dg-catchy-tone="3"] {--catchy-wash:#31422e;--catchy-end:#1d403e;}
html[data-style="catchy"][data-dg-all-dark="true"] .card[data-dg-catchy-tone="4"] {--catchy-wash:#243951;--catchy-end:#422b43;}
/* Smooth changes geometry only. Density, text, semantic states and the chosen
 * theme palette continue to come from their existing central authorities. */
html:is([data-style="catchy"],[data-dg-smooth="true"]) {
  --dg-smooth-card-radius:16px;
  --dg-smooth-control-radius:10px;
  --dg-smooth-popup-radius:16px;
  --dg-ui-compact-radius:var(--dg-smooth-control-radius);
  --bs-modal-border-radius:var(--dg-smooth-popup-radius);
  --dg-overlay-popup-radius:var(--dg-smooth-popup-radius);
}
html:is([data-style="catchy"],[data-dg-smooth="true"]) .card {border-radius:var(--dg-smooth-card-radius);}
html:is([data-style="catchy"],[data-dg-smooth="true"]) :is(.modal-content,.swal2-popup,.offcanvas,.dropdown-menu,.select2-dropdown,.flatpickr-calendar,.popover) {border-radius:var(--dg-smooth-popup-radius);}
html:is([data-style="catchy"],[data-dg-smooth="true"]) :is(.btn,.form-control,.form-select,.select2-selection,.nav-pills .nav-link,.page-link):not(.rounded-pill):not(.btn-icon) {border-radius:var(--dg-smooth-control-radius);}
/* A grouped field keeps its joined edges; only the outer corners are soft. */
html:is([data-style="catchy"],[data-dg-smooth="true"]) .input-group > :not(:first-child):not(.dropdown-menu) {border-top-left-radius:0;border-bottom-left-radius:0;}
html:is([data-style="catchy"],[data-dg-smooth="true"]) .input-group > :not(:last-child):not(.dropdown-menu) {border-top-right-radius:0;border-bottom-right-radius:0;}
@keyframes dg-catchy-in {from{opacity:.8;}to{opacity:1;}}
html[data-dg-motion="reduce"] .card {animation:none;}
@media (prefers-reduced-motion:reduce) {html[data-style="catchy"] .card {animation:none;}}
/* DJP symbol only, from the official branding asset; follows menu text colour. */
.menu-icon.dg-tax-icon {
  display: inline-block;
  inline-size: 1.375rem;
  block-size: 1.375rem;
  background: currentColor;
  mask: url('../img/icons/djp-symbol.svg') center / contain no-repeat;
  -webkit-mask: url('../img/icons/djp-symbol.svg') center / contain no-repeat;
}
.menu-icon.dg-tax-icon::before { content: none; }
/* Only explanatory copy, never labels, validation, alerts or table values. */
html[data-dg-hide-help="true"] :is([data-dg-help],.form-text,.help-text,.help-block,.dg-appearance-help,.dg-acs-help):not(.alert):not(.alert *) {display:none;}
@media (min-width:768px) {
  html.layout-menu-collapsed:not(.layout-menu-hover) .dg-account-brand > .dg-sidebar-brand-logo {display:none;}
  html.layout-menu-collapsed:not(.layout-menu-hover) .dg-account-brand > .dg-sidebar-brand-favicon {display:block;}
}