:root {
  --app-radius-xs: .5rem;
  --app-radius-sm: .75rem;
  --app-radius: 1rem;
  --app-radius-lg: 1.35rem;
  --app-shadow-sm: 0 .2rem .6rem rgba(15, 23, 42, .07);
  --app-shadow: 0 .7rem 2rem rgba(15, 23, 42, .1);
  --app-content-max: 1680px;
  --app-focus-ring: 0 0 0 .23rem rgba(var(--bs-primary-rgb), .27);
  --app-motion-fast: 140ms;
  --app-motion: 210ms;
}

html { scroll-behavior: smooth; }
body { min-width: 320px; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
.min-w-0 { min-width: 0 !important; }
main, .main-content { width: 100%; max-width: var(--app-content-max); margin-inline: auto; }

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 0;
  box-shadow: var(--app-focus-ring) !important;
}

.card {
  border-color: color-mix(in srgb, var(--bs-border-color) 78%, transparent);
  border-radius: var(--app-radius);
  box-shadow: var(--app-shadow-sm);
}
.card-header:first-child { border-radius: calc(var(--app-radius) - 1px) calc(var(--app-radius) - 1px) 0 0; }
.modal-content, .offcanvas, .dropdown-menu { border-radius: var(--app-radius); box-shadow: var(--app-shadow); }
.dropdown-menu { padding: .45rem; border-color: color-mix(in srgb, var(--bs-border-color) 78%, transparent); }
.dropdown-item { border-radius: .62rem; }

.btn {
  --bs-btn-padding-y: .43rem;
  --bs-btn-padding-x: .82rem;
  --bs-btn-font-size: .925rem;
  --bs-btn-line-height: 1.2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .42rem;
  min-height: 2.25rem;
  border-radius: .68rem;
  font-weight: 650;
  line-height: var(--bs-btn-line-height);
  vertical-align: middle;
  transition: transform var(--app-motion-fast), box-shadow var(--app-motion-fast), background-color var(--app-motion-fast), border-color var(--app-motion-fast);
}
.btn-sm {
  --bs-btn-padding-y: .3rem;
  --bs-btn-padding-x: .64rem;
  --bs-btn-font-size: .82rem;
  min-height: 1.95rem;
  border-radius: .58rem;
}
.btn-lg {
  --bs-btn-padding-y: .56rem;
  --bs-btn-padding-x: 1rem;
  --bs-btn-font-size: 1rem;
  min-height: 2.7rem;
}
.btn > :where(i, svg) { flex: 0 0 auto; line-height: 1; }
.btn.rounded-circle { width: 2.25rem; height: 2.25rem; min-height: 2.25rem; padding: 0 !important; }
.btn-sm.rounded-circle { width: 1.95rem; height: 1.95rem; min-height: 1.95rem; }
.btn:not(.btn-link):not(.rounded-circle) {
  padding-top: var(--bs-btn-padding-y) !important;
  padding-bottom: var(--bs-btn-padding-y) !important;
}
.btn:not(:disabled):hover { transform: translateY(-1px); }
.btn:not(:disabled):active { transform: translateY(0); }

.form-control, .form-select, .input-group-text { min-height: 2.55rem; border-radius: .72rem; }
.input-group > :not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.input-group > :not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.form-label { font-weight: 650; }
.form-text { color: var(--bs-secondary-color); }

.table { --bs-table-bg: transparent; }
.table > :not(caption) > * > * { padding-block: .78rem; }
.table thead th { color: var(--bs-secondary-color); font-size: .76rem; font-weight: 750; letter-spacing: .035em; text-transform: uppercase; }
.table-hover > tbody > tr { transition: background-color var(--app-motion-fast); }
.table-responsive { border-radius: inherit; }

.badge { font-weight: 700; letter-spacing: .012em; }
.alert { border-radius: var(--app-radius); }
.pagination .page-link { min-width: 2.35rem; text-align: center; }

.app-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.app-page-header__title { margin: 0; font-size: clamp(1.35rem, 2vw, 1.85rem); letter-spacing: -.025em; }
.app-page-header__lead { max-width: 72ch; margin: .35rem 0 0; color: var(--bs-secondary-color); }
.app-empty-state { display: grid; place-items: center; min-height: 14rem; padding: 2rem; text-align: center; color: var(--bs-secondary-color); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .001ms !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; }
}

@media (max-width: 767.98px) {
  .app-page-header { flex-direction: column; }
  .table > :not(caption) > * > * { padding-block: .68rem; }
}


.license-problem-page { min-height: 100vh; min-height: 100dvh; }
.license-problem-card { max-width: 47.5rem; }
.license-problem-icon { width: 9.375rem; height: 9.375rem; }


/* Shared application components and information hierarchy. */
.ui-page-header,
.app-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-block: 0 1.25rem;
}
.ui-page-title,
.app-page-header__title {
  margin: 0;
  max-width: 30ch;
  font-size: clamp(1.4rem, 1.1rem + 1.1vw, 2rem);
  font-weight: 780;
  line-height: 1.15;
  letter-spacing: -.03em;
  text-wrap: balance;
}
.ui-page-description,
.app-page-header__lead {
  max-width: 72ch;
  margin: .45rem 0 0;
  color: var(--bs-secondary-color);
  text-wrap: pretty;
}
.ui-empty-state,
.app-empty-state {
  display: grid;
  justify-items: center;
  align-content: center;
  min-height: 15rem;
  padding: clamp(1.5rem, 4vw, 3rem);
  border: 1px dashed color-mix(in srgb, var(--bs-border-color) 82%, transparent);
  border-radius: var(--app-radius);
  background: color-mix(in srgb, var(--bs-tertiary-bg) 74%, transparent);
  text-align: center;
  color: var(--bs-secondary-color);
}
.ui-empty-state > i { margin-bottom: .85rem; font-size: 2rem; opacity: .72; }
.ui-empty-state > h2 { margin-bottom: .35rem; color: var(--bs-emphasis-color); font-size: 1.08rem; }
.ui-empty-state > p { max-width: 54ch; margin: 0; }
.ui-status {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  min-height: 1.75rem;
  padding: .2rem .62rem;
  border: 1px solid color-mix(in srgb, currentColor 22%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, currentColor 8%, transparent);
  color: var(--bs-secondary-color);
  font-size: .78rem;
  font-weight: 720;
  line-height: 1.1;
}
.ui-status-dot { width: .48rem; height: .48rem; border-radius: 50%; background: currentColor; }
.ui-status--success { color: var(--bs-success-text-emphasis); }
.ui-status--warning { color: var(--bs-warning-text-emphasis); }
.ui-status--danger { color: var(--bs-danger-text-emphasis); }
.ui-status--info { color: var(--bs-info-text-emphasis); }

.app-filter-bar {
  position: sticky;
  z-index: 1010;
  top: var(--app-sticky-offset, .75rem);
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: .75rem;
  padding: .8rem;
  border: 1px solid color-mix(in srgb, var(--bs-border-color) 78%, transparent);
  border-radius: var(--app-radius);
  background: color-mix(in srgb, var(--bs-body-bg) 94%, transparent);
  box-shadow: var(--app-shadow-sm);
  backdrop-filter: blur(12px);
}
.app-ticket-shell { display: grid; grid-template-columns: minmax(0, 1fr) minmax(18rem, 24rem); gap: 1.25rem; align-items: start; }
.app-ticket-sidebar { position: sticky; top: var(--app-sticky-offset, 1rem); }
.app-command-palette { width: min(42rem, calc(100vw - 2rem)); border: 0; border-radius: var(--app-radius-lg); box-shadow: 0 1.5rem 5rem rgba(15, 23, 42, .2); }
.app-environment-banner { position: sticky; z-index: 1085; top: 0; padding: .45rem 1rem; background: var(--bs-warning-bg-subtle); color: var(--bs-warning-text-emphasis); text-align: center; font-size: .82rem; font-weight: 720; }
.app-environment-banner--impersonating { background: var(--bs-danger-bg-subtle); color: var(--bs-danger-text-emphasis); }

[data-density="compact"] .table > :not(caption) > * > * { padding-block: .5rem; }
[data-density="compact"] .form-control,
[data-density="compact"] .form-select,
[data-density="compact"] .input-group-text { min-height: 2.15rem; }
[data-density="compact"] .btn { min-height: 2.15rem; }

@media (pointer: coarse) {
  .btn:not(.btn-sm), .form-control, .form-select, .page-link, .dropdown-item { min-height: 2.5rem; }
  .btn-sm { min-height: 2.15rem; }
  .form-check-input { width: 1.25rem; height: 1.25rem; }
}
@media (max-width: 991.98px) {
  .app-ticket-shell { grid-template-columns: minmax(0, 1fr); }
  .app-ticket-sidebar { position: static; }
  .app-filter-bar { position: static; }
}
@media (max-width: 767.98px) {
  .ui-page-header, .app-page-header { flex-direction: column; }
  .ui-page-header > :last-child, .app-page-header > :last-child { width: 100%; }
}
@supports not (color: color-mix(in srgb, black, white)) {
  .card, .dropdown-menu, .app-filter-bar { border-color: var(--bs-border-color); }
  .ui-empty-state { background: var(--bs-tertiary-bg); }
}


/* Unified dialogs, toasts and step-up authentication. */
.app-toast-stack {
  z-index: 1105;
  width: min(25rem, calc(100vw - 1rem));
  padding-top: max(1rem, env(safe-area-inset-top));
  padding-right: max(1rem, env(safe-area-inset-right));
  pointer-events: none;
}
.app-toast {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: start;
  gap: .75rem;
  width: 100%;
  padding: .85rem .9rem;
  border: 1px solid color-mix(in srgb, var(--bs-border-color) 82%, transparent);
  border-left-width: .28rem;
  border-radius: .9rem;
  background: color-mix(in srgb, var(--bs-body-bg) 96%, transparent);
  box-shadow: 0 1rem 2.8rem rgba(15, 23, 42, .18);
  color: var(--bs-body-color);
  pointer-events: auto;
  backdrop-filter: blur(14px);
}
.app-toast + .app-toast { margin-top: .65rem; }
.app-toast.is-success { border-left-color: var(--bs-success); }
.app-toast.is-danger { border-left-color: var(--bs-danger); }
.app-toast.is-warning { border-left-color: var(--bs-warning); }
.app-toast.is-info { border-left-color: var(--bs-info); }
.app-toast__icon {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: .62rem;
  background: var(--bs-tertiary-bg);
  font-size: .9rem;
}
.app-toast.is-success .app-toast__icon { background: var(--bs-success-bg-subtle); color: var(--bs-success-text-emphasis); }
.app-toast.is-danger .app-toast__icon { background: var(--bs-danger-bg-subtle); color: var(--bs-danger-text-emphasis); }
.app-toast.is-warning .app-toast__icon { background: var(--bs-warning-bg-subtle); color: var(--bs-warning-text-emphasis); }
.app-toast.is-info .app-toast__icon { background: var(--bs-info-bg-subtle); color: var(--bs-info-text-emphasis); }
.app-toast__copy { min-width: 0; padding-top: .04rem; }
.app-toast__title { margin-bottom: .12rem; font-size: .84rem; font-weight: 780; line-height: 1.25; }
.app-toast__message { color: var(--bs-secondary-color); font-size: .82rem; line-height: 1.42; overflow-wrap: anywhere; }
.app-toast__close { margin: .08rem 0 0 .1rem; font-size: .7rem; }

.app-confirm-modal .modal-dialog,
.app-prompt-modal .modal-dialog,
.app-reauth-modal .modal-dialog { max-width: 31rem; }
.app-confirm-modal .modal-content,
.app-prompt-modal .modal-content,
.app-reauth-modal .modal-content {
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--bs-border-color) 76%, transparent);
  border-radius: 1.15rem;
  box-shadow: 0 1.4rem 4rem rgba(15, 23, 42, .24);
}
.app-modal-body { display: flex; align-items: flex-start; gap: .9rem; padding: 1.25rem 1.25rem 1rem; }
.app-modal-icon {
  display: inline-grid;
  place-items: center;
  width: 2.65rem;
  height: 2.65rem;
  flex: 0 0 2.65rem;
  border-radius: .82rem;
  background: var(--bs-info-bg-subtle);
  color: var(--bs-info-text-emphasis);
  font-size: 1.05rem;
}
.app-modal-icon.is-warning { background: var(--bs-warning-bg-subtle); color: var(--bs-warning-text-emphasis); }
.app-modal-icon.is-danger { background: var(--bs-danger-bg-subtle); color: var(--bs-danger-text-emphasis); }
.app-modal-title { margin: 0 0 .35rem; color: var(--bs-emphasis-color); font-size: 1.08rem; font-weight: 780; line-height: 1.25; }
.app-modal-message { margin: 0; color: var(--bs-secondary-color); font-size: .9rem; line-height: 1.5; white-space: pre-line; }
.app-modal-footer { gap: .55rem; padding: .85rem 1.25rem 1.1rem; border-top: 0; background: transparent; }
.app-modal-feedback {
  margin-top: .85rem;
  padding: .68rem .78rem;
  border: 1px solid var(--bs-danger-border-subtle);
  border-radius: .7rem;
  background: var(--bs-danger-bg-subtle);
  color: var(--bs-danger-text-emphasis);
  font-size: .82rem;
  line-height: 1.4;
}
.app-reauth-action {
  margin: .75rem 0 1rem;
  padding: .65rem .75rem;
  border: 1px solid var(--bs-border-color);
  border-radius: .7rem;
  background: var(--bs-tertiary-bg);
  color: var(--bs-secondary-color);
  font-size: .82rem;
  line-height: 1.4;
}
.app-reauth-modal .modal-body { padding: 1.25rem; }
.app-reauth-modal .form-label { font-size: .84rem; }

@media (max-width: 575.98px) {
  .app-toast-stack { width: 100%; padding-left: .75rem; padding-right: .75rem; }
  .app-confirm-modal .modal-dialog,
  .app-prompt-modal .modal-dialog,
  .app-reauth-modal .modal-dialog { margin: .75rem; }
  .app-modal-footer { display: grid; grid-template-columns: 1fr 1fr; }
  .app-modal-footer .btn { width: 100%; }
}