/*
 * LikeSoon UI compatibility layer
 *
 * These selectors translate legacy Bootstrap semantic classes used by the
 * admin interface into shared LikeSoon tokens. New components must not add
 * rules here. A rule may be removed once its legacy class is absent from all
 * rendered admin routes and the route matrix still passes.
 */

.jq-toast-single.jq-icon-success .jq-toast-loader {
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  background-color: var(--ui-color-primary-deep) !important;
  opacity: 1;
}
/*
 * Admin token compatibility layer.
 * Preserve the legacy admin information architecture while routing its
 * Bootstrap-era semantic states through the shared LikeSoon tokens.
 */
body.ui-app[data-area="admin"] .ui-page-header {
  min-height: 48px;
  padding: 0;
  border: 0;
  border-radius: var(--ui-admin-compat-radius-01);
  background: transparent;
  box-shadow: var(--ui-admin-compat-shadow-01);
}

body.ui-app[data-area="admin"] .ui-page-header::before {
  display: none;
  content: none;
}

body.ui-app[data-area="admin"] .ui-page-header > .row,
body.ui-app[data-area="admin"] .ui-page-header > .page-title,
body.ui-app[data-area="admin"] .ui-page-header > .ui-page-heading {
  margin-left: 0;
}

/* Text-labelled actions must never inherit the fixed square icon-button width. */
body.ui-app[data-area="admin"] .ui-admin-custom-rate {
  display: inline-flex;
  width: auto;
  min-width: max-content;
  min-height: 36px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding-right: 12px;
  padding-left: 12px;
  line-height: 1.2;
  white-space: nowrap;
}

body.ui-app[data-area="admin"] .ui-admin-custom-rate > span {
  display: inline-block;
  white-space: nowrap;
}

/*
 * Keep pagination outside the clipped/scrolling table container. Reset every
 * legacy positioning hook so it always occupies its own document-flow row.
 */
body.ui-app[data-area="admin"] #pagination.ui-list-pagination {
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  position: static !important;
  inset: auto !important;
  z-index: auto;
  display: flex;
  width: 100%;
  min-height: 58px;
  clear: both;
  align-items: center;
  justify-content: flex-end;
  margin: 12px 0 0;
  padding: 9px 14px;
  overflow: visible;
  border: 1px solid var(--ui-border-subtle);
  border-radius: var(--ui-admin-compat-radius-02);
  background: var(--ui-surface-raised);
  box-shadow: var(--ui-admin-compat-shadow-02);
}

body.ui-app[data-area="admin"] #pagination.ui-list-pagination:empty {
  display: none;
}

body.ui-app[data-area="admin"] #pagination.ui-list-pagination > .col-md-12 {
  width: 100%;
  min-height: 0;
  padding: 0;
}

body.ui-app[data-area="admin"] #pagination.ui-list-pagination .float-right {
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  float: none !important;
}

body.ui-app[data-area="admin"] #pagination.ui-list-pagination .pagination,
body.ui-app[data-area="admin"] #pagination.ui-list-pagination .page-navigation {
  margin: 0;
}

body.ui-app[data-area="admin"] .ui-pagination-shell {
  display: flex;
  min-height: 38px;
  clear: both;
  align-items: center;
  justify-content: flex-end;
  padding-top: 0;
  padding-bottom: 0;
}

body.ui-app[data-area="admin"] .ui-pagination-inner {
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  float: none !important;
}

body.ui-app[data-area="admin"] .ui-pagination-inner .pagination,
body.ui-app[data-area="admin"] .ui-pagination-inner .page-navigation {
  margin: 0;
}

body.ui-app[data-area="admin"] .ui-list-table .table th,
body.ui-app[data-area="admin"] .ui-list-table .table td {
  vertical-align: middle;
}

body.ui-app[data-area="admin"] .modal-body .selectize-input {
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
}

body.ui-app[data-area="admin"] .services-group-items .s-item {
  border-color: var(--ui-border-subtle);
}

body.ui-app[data-area="admin"] .services-group-items .btn-remove-item {
  width: 36px;
  min-width: 36px;
  padding: 0;
}

/* Admin custom-rate modal: compact, bounded and legible at every list size. */
body.ui-app[data-area="admin"] #customRate {
  z-index: 1060;
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  padding-right: 0 !important;
  pointer-events: auto;
}

body.ui-app[data-area="admin"] #customRate .ui-custom-rate-dialog {
  width: min(860px, calc(100vw - 32px));
  max-width: 860px;
  margin: 24px auto;
}

body.ui-app[data-area="admin"] #customRate .ui-custom-rate-modal {
  max-height: calc(100vh - 48px);
  overflow: hidden;
  border: 1px solid var(--ui-border-subtle);
  border-radius: var(--ui-radius-panel);
  background: var(--ui-surface-raised);
  box-shadow: var(--ui-shadow-float);
}

body.ui-app[data-area="admin"] #customRate .ui-custom-rate-form {
  display: flex;
  min-height: 0;
  flex: 1 1 auto;
  flex-direction: column;
}

body.ui-app[data-area="admin"] #customRate .ui-custom-rate-body {
  min-height: 0;
  padding: 20px 22px;
  overflow: visible;
}

body.ui-app[data-area="admin"] #customRate .ui-custom-rate-picker {
  margin-bottom: 14px;
}

body.ui-app[data-area="admin"] #customRate .ui-custom-rate-picker .selectize-control,
body.ui-app[data-area="admin"] #customRate .ui-custom-rate-picker .selectize-input {
  min-height: 44px;
}

body.ui-app[data-area="admin"] #customRate .ui-custom-rate-picker .selectize-input {
  display: flex;
  align-items: center;
  padding: 10px 13px;
  background: var(--ui-surface-raised);
}

body.ui-app[data-area="admin"] #customRate .ui-custom-rate-list {
  min-height: 164px;
  max-height: min(42vh, 360px);
  overflow: auto;
  border: 1px solid var(--ui-border-subtle);
  border-radius: var(--ui-admin-compat-radius-02);
  background: var(--ui-surface-subtle);
}

body.ui-app[data-area="admin"] #customRate .ui-custom-rate-empty {
  display: flex;
  min-height: 164px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
  padding: 24px;
  color: var(--ui-color-muted);
  text-align: center;
}

body.ui-app[data-area="admin"] #customRate .ui-custom-rate-empty.d-none {
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  display: none !important;
}

body.ui-app[data-area="admin"] #customRate .ui-custom-rate-empty strong {
  color: var(--ui-color-text);
  font-size: 15px;
  font-weight: 650;
}

body.ui-app[data-area="admin"] #customRate .ui-custom-rate-empty-icon {
  display: inline-flex;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  margin-bottom: 4px;
  border-radius: var(--ui-admin-compat-radius-02);
  background: var(--ui-color-primary-soft);
  color: var(--ui-color-primary);
  font-size: 18px;
}

body.ui-app[data-area="admin"] #customRate .services-group-items .s-item {
  padding: 13px 12px;
  border-bottom: 1px solid var(--ui-border-subtle);
  background: var(--ui-surface-raised);
}

body.ui-app[data-area="admin"] #customRate .services-group-items .s-item:last-child {
  border-bottom: 0;
}

body.ui-app[data-area="admin"] #customRate .services-group-items .s-item .row {
  min-height: 42px;
  margin-right: -6px;
  margin-left: -6px;
}

body.ui-app[data-area="admin"] #customRate .services-group-items .s-item .row > [class*="col"] {
  padding-right: 6px;
  padding-left: 6px;
}

body.ui-app[data-area="admin"] #customRate .ui-custom-rate-footer {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 22px;
  border-top: 1px solid var(--ui-border-subtle);
  background: var(--ui-surface-subtle);
}

body.ui-app[data-area="admin"] #customRate .ui-custom-rate-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

body.ui-app[data-area="admin"] #customRate .ui-custom-rate-footer .btn {
  min-height: 40px;
  margin: 0;
}

/* Search controls are one composite field: the shell owns state and geometry. */
.ui-app .ui-search-group {
  min-height: 44px;
  flex-wrap: nowrap;
  overflow: hidden;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface-raised);
  box-shadow: var(--ui-admin-compat-shadow-01);
  transition:
    border-color var(--ui-duration-fast) ease,
    box-shadow var(--ui-duration-fast) ease;
}

.ui-app .ui-search-group:hover {
  border-color: var(--ui-color-primary-bright);
}

.ui-app .ui-search-group:focus-within {
  border-color: var(--ui-color-primary);
  box-shadow: var(--ui-shadow-focus);
}

.ui-app .ui-search-group > .form-control,
.ui-app .ui-search-group > .form-select,
.ui-app .ui-search-group > select.form-control,
.ui-app .ui-search-group > .btn {
  height: 42px;
  min-height: 42px;
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  margin: 0 !important;
  border: 0 !important;
  border-radius: var(--ui-admin-compat-radius-01) !important;
  box-shadow: var(--ui-admin-compat-shadow-01) !important;
}

.ui-app .ui-search-group > .form-control,
.ui-app .ui-search-group > .form-select,
.ui-app .ui-search-group > select.form-control {
  background-color: var(--ui-surface-raised);
}

.ui-app .ui-search-group > .form-control:focus,
.ui-app .ui-search-group > .form-select:focus,
.ui-app .ui-search-group > select.form-control:focus {
  background-color: var(--ui-surface-raised);
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  box-shadow: var(--ui-admin-compat-shadow-01) !important;
}

.ui-app .ui-search-group > select.form-control,
.ui-app .ui-search-group > .form-select,
.ui-app .ui-search-group > .btn {
  border-left: 1px solid var(--ui-border-subtle) !important;
}

.ui-app .ui-search-group > .btn {
  align-self: stretch;
  transform: none !important;
}

.ui-app .ui-search-group > .btn-search {
  width: 44px;
  min-width: 44px;
  padding: 0;
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  background-color: var(--ui-color-primary) !important;
  background-image: var(--ui-action-primary-background) !important;
  color: var(--ui-action-primary-foreground) !important;
}

.ui-app .ui-search-group > .btn-search:hover,
.ui-app .ui-search-group > .btn-search:focus,
.ui-app .ui-search-group > .btn-search:active {
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  background-image: var(--ui-action-primary-background-hover) !important;
  box-shadow: var(--ui-admin-compat-shadow-01) !important;
  transform: none !important;
}

.ui-app .ui-search-group > .btn-clear:not(.d-none) {
  width: 44px;
  min-width: 44px;
  padding: 0;
}

.ui-app .ui-search-group > .input-group-append {
  display: flex;
  height: 42px;
  align-items: stretch;
  margin: 0;
  border-left: 1px solid var(--ui-border-subtle);
}

.ui-app .ui-search-group > .input-group-append > .form-control,
.ui-app .ui-search-group > .input-group-append > .form-select,
.ui-app .ui-search-group > .input-group-append > .btn {
  height: 42px;
  min-height: 42px;
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  margin: 0 !important;
  border: 0 !important;
  border-radius: var(--ui-admin-compat-radius-01) !important;
  box-shadow: var(--ui-admin-compat-shadow-01) !important;
  transform: none !important;
}

.ui-app .ui-search-group > .input-group-append > .btn-searchItem {
  width: 44px;
  min-width: 44px;
  padding: 0;
  background-color: var(--ui-color-primary) !important;
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  background-image: var(--ui-action-primary-background) !important;
  color: var(--ui-action-primary-foreground) !important;
}

.ui-app .ui-search-group > .input-group-append > .form-control + .btn-searchItem,
.ui-app .ui-search-group > .input-group-append > .form-select + .btn-searchItem {
  border-left: 1px solid var(--ui-border-subtle) !important;
}

.ui-app .ui-search-group > .input-group-append > .btn-searchItem:hover,
.ui-app .ui-search-group > .input-group-append > .btn-searchItem:focus,
.ui-app .ui-search-group > .input-group-append > .btn-searchItem:active {
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  background-image: var(--ui-action-primary-background-hover) !important;
  box-shadow: var(--ui-admin-compat-shadow-01) !important;
  transform: none !important;
}

@media (max-width: 767.98px) {
  body.ui-app[data-area="admin"] #customRate .ui-custom-rate-dialog {
    width: calc(100vw - 20px);
    margin: 10px auto;
  }

  body.ui-app[data-area="admin"] #customRate .ui-custom-rate-modal {
    max-height: calc(100vh - 20px);
    border-radius: var(--ui-radius-panel-mobile);
  }

  body.ui-app[data-area="admin"] #customRate .ui-custom-rate-body {
    padding: 16px;
  }

  body.ui-app[data-area="admin"] #customRate .ui-custom-rate-list {
    max-height: 48vh;
  }

  body.ui-app[data-area="admin"] #customRate .services-group-items .s-item .row > [class*="col"] {
    margin-bottom: 8px;
  }

  body.ui-app[data-area="admin"] #customRate .ui-custom-rate-footer {
    align-items: stretch;
    padding: 12px 16px;
    flex-direction: column-reverse;
  }

  body.ui-app[data-area="admin"] #customRate .ui-custom-rate-actions,
  body.ui-app[data-area="admin"] #customRate .ui-custom-rate-actions .btn {
    width: 100%;
  }

  body.ui-app[data-area="admin"] #customRate .ui-custom-rate-actions .btn {
    flex: 1 1 0;
  }
}


.custom-control-input:checked ~ .custom-control-label::before,
.custom-control-input:indeterminate ~ .custom-control-label::before {
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  border-color: var(--ui-color-primary) !important;
  background-color: var(--ui-color-primary) !important;
}

.custom-control-input:focus ~ .custom-control-label::before {
  border-color: var(--ui-color-primary) !important;
  box-shadow: var(--ui-shadow-native-focus) !important;
}

.custom-control-input:active ~ .custom-control-label::before {
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  border-color: var(--ui-color-primary-strong) !important;
  background-color: var(--ui-color-primary-strong) !important;
}

.ui-list-toolbar #btn-filter-group,
.ui-list-toolbar .btn-filter-status,
.ui-list-toolbar .search-area {
  margin: 0 !important;
}

.ui-app .ui-list-table > #pagination .ui-pagination-inner,
.ui-app .ui-list-table > #pagination .float-right {
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  float: none !important;
}

.ui-app .search-box div.form-group {
  margin-bottom: 0 !important;
}

.ui-app .search-box .form-control {
  height: auto !important;
}

body.ui-app[data-area="admin"] .btn-info,
body.ui-app[data-area="admin"] .btn-info:not(:disabled):not(.disabled):active,
body.ui-app[data-area="admin"] .btn-info:not(:disabled):not(.disabled).active {
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  border: 0 !important;
  background-color: var(--ui-color-primary) !important;
  background-image: var(--ui-action-primary-background) !important;
  color: var(--ui-action-primary-foreground) !important;
  box-shadow: var(--ui-action-primary-shadow);
}

/* Bootstrap action classes are kept for JS and template compatibility. */
.ui-app .btn.btn-primary,
.ui-app .btn.btn-info,
.ui-app .btn.btn-warning,
.ui-app .btn.btn-danger,
.ui-app .btn.btn-dark,
.ui-app .btn.btn-default,
.ui-app .btn.btn-secondary:not(.brand-category) {
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  border-width: 0 !important;
}

.ui-app .btn-primary,
.ui-app .btn-primary:not(:disabled):not(.disabled):active,
.ui-app .btn-primary:not(:disabled):not(.disabled).active {
  border: 0 !important;
  background-color: var(--ui-color-primary) !important;
  background-image: var(--ui-button-primary-bg) !important;
  color: var(--ui-button-primary-fg) !important;
  box-shadow: var(--ui-button-primary-shadow);
}

.ui-app .btn-primary:hover,
.ui-app .btn-primary:focus {
  /* ui-compat-exception; scope=admin-shell-controls; reason=Legacy admin Bootstrap or plugin specificity bridge, remove after affected admin templates stop emitting the legacy class and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  border: 0 !important;
  background-image: var(--ui-button-primary-bg-hover) !important;
  color: var(--ui-button-primary-fg) !important;
  box-shadow: var(--ui-shadow-button-hover);
}

/* The legacy theme utility uses an !important coral gradient on auth actions. */
.ui-auth .btn-primary {
  border-color: var(--ui-color-primary-strong) !important;
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  background-color: var(--ui-color-primary-strong) !important;
  background-image: var(--ui-button-primary-bg) !important;
  color: var(--ui-button-primary-fg) !important;
}

.ui-auth .btn-primary:hover,
.ui-auth .btn-primary:focus {
  background-color: var(--ui-color-primary-deep) !important;
  background-image: var(--ui-button-primary-bg-hover) !important;
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  color: var(--ui-button-primary-fg) !important;
}

.ui-app .btn-primary:disabled,
.ui-app .btn-primary.disabled {
  border: 0 !important;
  background-color: var(--ui-action-primary-disabled) !important;
  background-image: none !important;
  color: var(--ui-action-primary-disabled-foreground) !important;
  box-shadow: var(--ui-shadow-none);
}

.ui-app .btn-danger,
.ui-app .btn-danger:not(:disabled):not(.disabled):active,
.ui-app .btn-danger:not(:disabled):not(.disabled).active {
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  background-color: var(--ui-action-danger-background) !important;
  background-image: none !important;
  color: var(--ui-action-danger-foreground) !important;
}

.ui-app .btn-danger:hover,
.ui-app .btn-danger:focus {
  background-color: var(--ui-action-danger-background-hover) !important;
  color: var(--ui-action-danger-foreground) !important;
}

.ui-app .btn-gray {
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  border-color: var(--ui-action-neutral-background) !important;
  background-color: var(--ui-action-neutral-background) !important;
  color: var(--ui-action-neutral-foreground) !important;
}

.ui-app .btn-outline-primary {
  border-color: var(--ui-border-outline-primary) !important;
  background: var(--ui-surface-raised) !important;
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  color: var(--ui-color-primary-strong) !important;
}

.ui-app .btn-outline-primary:hover,
.ui-app .btn-outline-primary:focus {
  border-color: var(--ui-color-primary) !important;
  background: var(--ui-color-primary-soft) !important;
  color: var(--ui-color-primary-strong) !important;
}

.ui-app .btn-outline-danger {
  border: 1px solid var(--ui-border-danger-subtle) !important;
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  background: var(--ui-surface-raised) !important;
  color: var(--ui-color-danger) !important;
  box-shadow: var(--ui-shadow-none) !important;
}

.ui-app .btn-outline-danger:hover,
.ui-app .btn-outline-danger:focus,
.ui-app .btn-outline-danger:not(:disabled):not(.disabled):active {
  border-color: var(--ui-color-danger) !important;
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  background: var(--ui-color-danger-soft) !important;
  color: var(--ui-color-danger) !important;
}

.ui-app .component-button-cancel {
  display: inline-flex;
}

.ui-app .component-button-cancel .btn-cancel {
  min-height: var(--ui-control-sm);
  padding: 7px 12px;
  border-radius: var(--ui-radius-control);
  font-weight: 700;
  line-height: 20px;
  white-space: nowrap;
  transition:
    transform var(--ui-duration-fast) var(--ui-ease-standard),
    border-color var(--ui-duration-fast) var(--ui-ease-standard),
    background-color var(--ui-duration-fast) var(--ui-ease-standard),
    color var(--ui-duration-fast) var(--ui-ease-standard);
}

.ui-app .component-button-cancel .btn-cancel:active {
  transform: translateY(1px);
}

.ui-app .btn-outline-secondary {
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface-raised) !important;
  color: var(--ui-color-muted-strong) !important;
  box-shadow: var(--ui-shadow-none) !important;
}

.ui-app .btn-outline-secondary:hover,
.ui-app .btn-outline-secondary:focus {
  border-color: var(--ui-color-primary) !important;
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  background: var(--ui-color-primary-soft) !important;
  color: var(--ui-color-primary-strong) !important;
}

.ui-app .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.ui-app .page-item.active .page-link,
.ui-app .dropdown-item.active,
.ui-app .dropdown-item:active,
.ui-app .pagination .active .page-link,
.ui-app .pagination > .active > a {
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  border-width: 0 !important;
  background-color: var(--ui-color-primary) !important;
  background-image: var(--ui-action-primary-background) !important;
  color: var(--ui-action-primary-foreground) !important;
}

body.ui-app[data-area="admin"] .btn-info:hover,
body.ui-app[data-area="admin"] .btn-info:focus {
  background-image: var(--ui-action-primary-background-hover) !important;
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  color: var(--ui-action-primary-foreground) !important;
}

body.ui-app[data-area="admin"] .btn-outline-info {
  border: 1px solid var(--ui-border-primary) !important;
  background: var(--ui-surface-raised) !important;
  color: var(--ui-color-primary-strong) !important;
  box-shadow: var(--ui-shadow-none);
}

body.ui-app[data-area="admin"] .btn-outline-info:hover,
body.ui-app[data-area="admin"] .btn-outline-info:focus,
body.ui-app[data-area="admin"] .btn-outline-info:not(:disabled):not(.disabled):active {
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  border-color: var(--ui-border-primary-strong) !important;
  background: var(--ui-color-primary-soft) !important;
  color: var(--ui-color-primary-deep) !important;
}

body.ui-app[data-area="admin"] .btn-success {
  border: 0 !important;
  background: var(--ui-color-success) !important;
  color: var(--ui-surface-raised) !important;
}

body.ui-app[data-area="admin"] .btn-warning {
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  border: 0 !important;
  background: var(--ui-color-warning) !important;
  color: var(--ui-surface-raised) !important;
}

body.ui-app[data-area="admin"] .btn-dark {
  border: 0 !important;
  background: var(--ui-color-ink) !important;
  color: var(--ui-surface-raised) !important;
}

body.ui-app[data-area="admin"] .btn-secondary:not(.brand-category),
body.ui-app[data-area="admin"] .btn-default {
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  border: 1px solid var(--ui-border-strong) !important;
  background: var(--ui-surface-subtle) !important;
  color: var(--ui-color-muted-strong) !important;
  box-shadow: var(--ui-shadow-none);
}

body.ui-app[data-area="admin"] .btn-secondary:not(.brand-category):hover,
body.ui-app[data-area="admin"] .btn-secondary:not(.brand-category):focus,
body.ui-app[data-area="admin"] .btn-default:hover,
body.ui-app[data-area="admin"] .btn-default:focus {
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  border-color: var(--ui-border-primary) !important;
  background: var(--ui-color-primary-soft) !important;
  color: var(--ui-color-primary-strong) !important;
}

body.ui-app[data-area="admin"] .btn-outline-danger {
  border: 1px solid var(--ui-border-danger-subtle) !important;
  background: var(--ui-surface-raised) !important;
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  color: var(--ui-color-danger) !important;
  box-shadow: var(--ui-shadow-none);
}

body.ui-app[data-area="admin"] .btn-outline-danger:hover,
body.ui-app[data-area="admin"] .btn-outline-danger:focus,
body.ui-app[data-area="admin"] .btn-outline-danger:not(:disabled):not(.disabled):active {
  border-color: var(--ui-color-danger) !important;
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  background: var(--ui-color-danger) !important;
  color: var(--ui-surface-raised) !important;
}

body.ui-app[data-area="admin"] .text-primary,
body.ui-app[data-area="admin"] .text-info {
  color: var(--ui-color-primary) !important;
}

body.ui-app[data-area="admin"] .bg-primary,
body.ui-app[data-area="admin"] .bg-info,
body.ui-app[data-area="admin"] .badge-primary,
body.ui-app[data-area="admin"] .badge-info {
  /* ui-compat-exception; scope=shared-action-states; reason=Legacy button and state utility specificity bridge, remove after the legacy utility is retired and customer plus admin route matrices pass; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  background-color: var(--ui-color-primary) !important;
  color: var(--ui-surface-raised) !important;
}

body.ui-app[data-area="admin"] .badge-success {
  /* ui-compat-exception; scope=status-and-form-states; reason=Legacy status or form utility specificity bridge, remove after status markup uses governed component modifiers and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  background-color: var(--ui-color-success) !important;
  color: var(--ui-surface-raised) !important;
}

body.ui-app[data-area="admin"] .badge-warning {
  background-color: var(--ui-color-warning-soft) !important;
  color: var(--ui-color-ink) !important;
}

body.ui-app[data-area="admin"] .badge-danger {
  background-color: var(--ui-color-danger) !important;
  /* ui-compat-exception; scope=status-and-form-states; reason=Legacy status or form utility specificity bridge, remove after status markup uses governed component modifiers and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  color: var(--ui-surface-raised) !important;
}

body.ui-app[data-area="admin"] .bg-secondary,
body.ui-app[data-area="admin"] .badge.bg-secondary {
  border: 1px solid var(--ui-border-subtle);
  background-color: var(--ui-surface-subtle) !important;
  color: var(--ui-color-muted-strong) !important;
}

/* Legacy status classes retain their semantic hue with accessible contrast. */
.ui-app .badge.bg-blue {
  /* ui-compat-exception; scope=status-and-form-states; reason=Legacy status or form utility specificity bridge, remove after status markup uses governed component modifiers and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  background-color: var(--ui-status-processing) !important;
  color: var(--ui-text-inverse) !important;
}

.ui-app .badge.bg-green {
  background-color: var(--ui-status-pending) !important;
  color: var(--ui-text-inverse) !important;
}

.ui-app .badge.bg-cyan {
  background-color: var(--ui-status-running) !important;
  color: var(--ui-text-inverse) !important;
}

.ui-app .badge.bg-secondary {
  /* ui-compat-exception; scope=status-and-form-states; reason=Legacy status or form utility specificity bridge, remove after status markup uses governed component modifiers and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  border-color: var(--ui-status-cancelled) !important;
  background-color: var(--ui-status-cancelled) !important;
  color: var(--ui-text-inverse) !important;
}

.ui-app .badge.bg-pink {
  background-color: var(--ui-status-partial) !important;
  color: var(--ui-text-inverse) !important;
}

.ui-app .badge.badge-default {
  border: 1px solid var(--ui-border-subtle);
  /* ui-compat-exception; scope=status-and-form-states; reason=Legacy status or form utility specificity bridge, remove after status markup uses governed component modifiers and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  background-color: var(--ui-surface-control-subtle) !important;
  color: var(--ui-color-muted-strong) !important;
}

.ui-app .badge.bg-orange-lt {
  background-color: var(--ui-color-warning-soft) !important;
  color: var(--ui-color-warning-ink) !important;
}

body.ui-app[data-area="admin"] .border-primary,
body.ui-app[data-area="admin"] .border-info {
  /* ui-compat-exception; scope=status-and-form-states; reason=Legacy status or form utility specificity bridge, remove after status markup uses governed component modifiers and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  border-color: var(--ui-color-primary) !important;
}

body.ui-app[data-area="admin"] .alert-info {
  border-color: var(--ui-border-primary-subtle) !important;
  background: var(--ui-color-primary-soft) !important;
  color: var(--ui-color-primary-deep) !important;
}

body.ui-app[data-area="admin"] .alert-success {
  border-color: var(--ui-color-success) !important;
  /* ui-compat-exception; scope=status-and-form-states; reason=Legacy status or form utility specificity bridge, remove after status markup uses governed component modifiers and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  background: var(--ui-color-success-soft) !important;
  color: var(--ui-color-success) !important;
}

body.ui-app[data-area="admin"] .alert-warning {
  border-color: var(--ui-color-warning) !important;
  background: var(--ui-color-warning-soft) !important;
  color: var(--ui-color-warning) !important;
}

body.ui-app[data-area="admin"] .alert-danger {
  /* ui-compat-exception; scope=status-and-form-states; reason=Legacy status or form utility specificity bridge, remove after status markup uses governed component modifiers and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  border-color: var(--ui-color-danger) !important;
  background: var(--ui-color-danger-soft) !important;
  color: var(--ui-color-danger) !important;
}

body.ui-app[data-area="admin"] .custom-switch-input:checked ~ .custom-switch-indicator {
  border-color: var(--ui-color-primary) !important;
  background-color: var(--ui-color-primary) !important;
}

body.ui-app[data-area="admin"] .custom-switch-input:focus ~ .custom-switch-indicator {
  /* ui-compat-exception; scope=status-and-form-states; reason=Legacy status or form utility specificity bridge, remove after status markup uses governed component modifiers and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  border-color: var(--ui-color-primary) !important;
  box-shadow: var(--ui-shadow-focus) !important;
}

body.ui-app[data-area="admin"] .page-item.active .page-link {
  border-color: var(--ui-color-primary) !important;
  background: var(--ui-action-primary-background) !important;
  color: var(--ui-surface-raised) !important;
}

body.ui-app[data-area="admin"] .page-link {
  border-color: var(--ui-border-subtle);
  color: var(--ui-color-muted-strong);
}

body.ui-app[data-area="admin"] .page-link:hover,
body.ui-app[data-area="admin"] .page-link:focus {
  border-color: var(--ui-border-primary-subtle);
  background: var(--ui-color-primary-soft);
  color: var(--ui-color-primary-strong);
  box-shadow: var(--ui-shadow-none);
}

/* Bootstrap text utilities are intentionally stronger than component text. */
.ui-app .text-muted {
  /* ui-compat-exception; scope=helper-and-overlay-states; reason=Legacy helper or overlay specificity bridge, remove after the legacy selector is absent from rendered routes and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  color: var(--ui-text-muted) !important;
}

.ui-app .text-danger {
  color: var(--ui-text-danger) !important;
}

.ui-app .form-text.text-muted {
  color: var(--ui-color-muted-strong) !important;
}

/*
 * Pointer-focus hygiene
 *
 * Tabler and Bootstrap attach native outlines and outer shadows to `:focus`,
 * which leaves a legacy ring after mouse activation. Pointer focus is kept
 * visually neutral while the tokenized `:focus-visible` rules in ui-system.css
 * remain available to keyboard users.
 */
body.ui-app a:focus:not(:focus-visible),
body.ui-app button:focus:not(:focus-visible),
body.ui-app summary:focus:not(:focus-visible),
body.ui-app [role="button"]:focus:not(:focus-visible),
body.ui-app [tabindex]:focus:not(:focus-visible) {
  outline: 0;
}

body.ui-app .btn:focus:not(:focus-visible) {
  box-shadow: var(--ui-pointer-focus-shadow, var(--ui-shadow-none));
}

body.ui-app .btn-primary {
  --ui-pointer-focus-shadow: var(--ui-button-primary-shadow);
}

body.ui-app .btn-primary:hover {
  --ui-pointer-focus-shadow: var(--ui-shadow-button-hover);
}

body.ui-app[data-area="admin"] .btn-info {
  --ui-pointer-focus-shadow: var(--ui-action-primary-shadow);
}

body.ui-app[data-area="admin"] .btn-info:hover {
  --ui-pointer-focus-shadow: var(--ui-shadow-button-hover);
}

body.ui-app .ui-order-panel .ui-order-submit {
  --ui-pointer-focus-shadow: var(--ui-new-order-shadow-14);
}

body.ui-app .ui-order-panel .ui-order-submit:hover {
  --ui-pointer-focus-shadow: var(--ui-new-order-shadow-15);
}

body.ui-app .page-link:focus:not(:focus-visible) {
  outline: 0;
  box-shadow: var(--ui-shadow-none);
}

body.ui-app .custom-control-input:focus:not(:focus-visible) ~ .custom-control-label::before,
body.ui-app[data-area="admin"] .custom-switch-input:focus:not(:focus-visible) ~ .custom-switch-indicator {
  /* ui-compat-exception; scope=helper-and-overlay-states; reason=Legacy helper or overlay specificity bridge, remove after the legacy selector is absent from rendered routes and the full route matrix passes; owner=frontend-governance; reviewed=2026-08-09; expires=2026-12-31 */
  box-shadow: var(--ui-shadow-none) !important;
}