/*
 * Unified UI redesign
 * Applied last in the cascade so every first-party module inherits one
 * predictable visual language without changing module business logic.
 */

:root {
  --ui-font-sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --ui-canvas: #f3f6fb;
  --ui-canvas-elevated: #f8faff;
  --ui-surface: #ffffff;
  --ui-surface-muted: #f7f9fc;
  --ui-surface-strong: #eef2f7;
  --ui-text: #18212f;
  --ui-text-muted: #667085;
  --ui-border: #dfe5ee;
  --ui-border-strong: #c9d2df;
  --ui-sidebar: #101828;
  --ui-sidebar-elevated: #182230;
  --ui-sidebar-text: #e4e7ec;
  --ui-sidebar-muted: #98a2b3;
  --ui-accent: #365cff;
  --ui-accent-rgb: 54, 92, 255;
  --ui-accent-soft: #edf1ff;
  --ui-accent-strong: #2447db;
  --ui-success: #138a5b;
  --ui-warning: #b25e09;
  --ui-danger: #d92d20;
  --ui-info: #1769aa;
  --ui-radius-xs: .5rem;
  --ui-radius-sm: .75rem;
  --ui-radius-md: 1rem;
  --ui-radius-lg: 1.35rem;
  --ui-shadow-xs: 0 1px 2px rgba(16, 24, 40, .04);
  --ui-shadow-sm: 0 4px 14px rgba(16, 24, 40, .055);
  --ui-shadow-md: 0 14px 34px rgba(16, 24, 40, .09);
  --ui-shadow-lg: 0 24px 64px rgba(16, 24, 40, .16);
  --ui-control-height: 2.5rem;
  --ui-control-height-sm: 2.125rem;
  --ui-content-max: 1640px;
  --ui-transition: 160ms cubic-bezier(.2, 0, 0, 1);
  --app-topbar-height: 4.25rem;
  --app-sidebar-width: 17.75rem;
  --app-page-bg: var(--ui-canvas);
  --app-sidebar-bg: var(--ui-sidebar);
  --app-topbar-bg: rgba(255, 255, 255, .92);
  --app-topbar-border: rgba(16, 24, 40, .08);
  --app-radius: var(--ui-radius-md);
  --app-radius-sm: var(--ui-radius-sm);
  --app-shadow: var(--ui-shadow-md);
  --app-shadow-sm: var(--ui-shadow-sm);
}

[data-bs-theme="dark"] {
  color-scheme: dark;
  --ui-canvas: #0b111c;
  --ui-canvas-elevated: #101827;
  --ui-surface: #151e2d;
  --ui-surface-muted: #111a28;
  --ui-surface-strong: #1d2939;
  --ui-text: #f2f4f7;
  --ui-text-muted: #98a2b3;
  --ui-border: #2b394d;
  --ui-border-strong: #3b4b61;
  --ui-sidebar: #080d16;
  --ui-sidebar-elevated: #111a28;
  --ui-sidebar-text: #f2f4f7;
  --ui-sidebar-muted: #98a2b3;
  --ui-accent: #7b9cff;
  --ui-accent-rgb: 123, 156, 255;
  --ui-accent-soft: rgba(123, 156, 255, .13);
  --ui-accent-strong: #9db4ff;
  --ui-shadow-xs: 0 1px 2px rgba(0, 0, 0, .18);
  --ui-shadow-sm: 0 6px 18px rgba(0, 0, 0, .18);
  --ui-shadow-md: 0 18px 42px rgba(0, 0, 0, .24);
  --ui-shadow-lg: 0 28px 74px rgba(0, 0, 0, .38);
  --app-page-bg: var(--ui-canvas);
  --app-sidebar-bg: var(--ui-sidebar);
  --app-topbar-bg: rgba(15, 23, 36, .92);
  --app-topbar-border: rgba(255, 255, 255, .08);
}

body[data-app-tone="indigo"] { --ui-accent: #4f46e5; --ui-accent-rgb: 79, 70, 229; --ui-accent-soft: #eef2ff; --ui-accent-strong: #4338ca; }
body[data-app-tone="violet"] { --ui-accent: #7c3aed; --ui-accent-rgb: 124, 58, 237; --ui-accent-soft: #f3e8ff; --ui-accent-strong: #6d28d9; }
body[data-app-tone="blue"] { --ui-accent: #2563eb; --ui-accent-rgb: 37, 99, 235; --ui-accent-soft: #eff6ff; --ui-accent-strong: #1d4ed8; }
body[data-app-tone="sky"] { --ui-accent: #0284c7; --ui-accent-rgb: 2, 132, 199; --ui-accent-soft: #e0f2fe; --ui-accent-strong: #0369a1; }
body[data-app-tone="cyan"] { --ui-accent: #0891b2; --ui-accent-rgb: 8, 145, 178; --ui-accent-soft: #ecfeff; --ui-accent-strong: #0e7490; }
body[data-app-tone="teal"] { --ui-accent: #0f766e; --ui-accent-rgb: 15, 118, 110; --ui-accent-soft: #f0fdfa; --ui-accent-strong: #115e59; }
body[data-app-tone="emerald"] { --ui-accent: #059669; --ui-accent-rgb: 5, 150, 105; --ui-accent-soft: #ecfdf3; --ui-accent-strong: #047857; }
body[data-app-tone="amber"] { --ui-accent: #d97706; --ui-accent-rgb: 217, 119, 6; --ui-accent-soft: #fffbeb; --ui-accent-strong: #b45309; }
body[data-app-tone="rose"] { --ui-accent: #e11d48; --ui-accent-rgb: 225, 29, 72; --ui-accent-soft: #fff1f2; --ui-accent-strong: #be123c; }
body[data-app-tone="slate"] { --ui-accent: #475467; --ui-accent-rgb: 71, 84, 103; --ui-accent-soft: #f2f4f7; --ui-accent-strong: #344054; }

body[data-app-tone] {
  --bs-primary: var(--ui-accent);
  --bs-primary-rgb: var(--ui-accent-rgb);
  --bs-primary-bg-subtle: var(--ui-accent-soft);
  --bs-primary-border-subtle: color-mix(in srgb, var(--ui-accent) 28%, transparent);
  --bs-primary-text-emphasis: var(--ui-accent-strong);
  --bs-link-color: var(--ui-accent);
  --bs-link-hover-color: var(--ui-accent-strong);
}

[data-bs-theme="dark"] body[data-app-tone] {
  --ui-accent-soft: rgba(var(--ui-accent-rgb), .14);
}

html {
  background: var(--ui-canvas);
  font-size: 16px;
}

body.app-ui-next {
  min-width: 320px;
  background:
    radial-gradient(circle at 100% 0, rgba(var(--ui-accent-rgb), .055), transparent 28rem),
    var(--ui-canvas);
  color: var(--ui-text);
  font-family: var(--ui-font-sans);
  font-feature-settings: "cv02", "cv03", "cv04", "cv11";
  letter-spacing: -.006em;
}

body.app-ui-next ::selection {
  background: rgba(var(--ui-accent-rgb), .2);
}

body.app-ui-next :where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid rgba(var(--ui-accent-rgb), .24) !important;
  outline-offset: 2px;
  box-shadow: none !important;
}

body.app-ui-next a {
  text-underline-offset: .18em;
}

body.app-ui-next .text-primary,
body.app-ui-next .link-primary {
  color: var(--ui-accent) !important;
}

body.app-ui-next .bg-primary,
body.app-ui-next .text-bg-primary {
  background-color: var(--ui-accent) !important;
}

body.app-ui-next .bg-primary-subtle {
  background-color: var(--ui-accent-soft) !important;
}

body.app-ui-next .border-primary {
  border-color: rgba(var(--ui-accent-rgb), .42) !important;
}

/* Application shell */
.app-topbar {
  min-height: var(--app-topbar-height);
  border-bottom: 1px solid var(--app-topbar-border);
  background: var(--app-topbar-bg);
  box-shadow: 0 1px 0 rgba(16, 24, 40, .025);
  color: var(--ui-text);
  backdrop-filter: saturate(160%) blur(18px);
  -webkit-backdrop-filter: saturate(160%) blur(18px);
}

.app-topbar .container-fluid {
  min-height: var(--app-topbar-height);
  gap: .65rem;
}

.brand-link {
  gap: .7rem;
  color: var(--ui-text);
  font-weight: 760;
}

.brand-link:hover,
.brand-link:focus {
  color: var(--ui-text);
}

.brand-mark {
  width: 2.45rem;
  height: 2.45rem;
  flex-basis: 2.45rem;
  border: 1px solid rgba(var(--ui-accent-rgb), .2);
  border-radius: .78rem;
  background: linear-gradient(145deg, var(--ui-accent), var(--ui-accent-strong));
  box-shadow: 0 8px 22px rgba(var(--ui-accent-rgb), .22);
}

.brand-name {
  color: var(--ui-text);
  font-size: .95rem;
}

.topbar-action,
.mobile-menu-toggle,
.profile-dropdown-toggle,
.guest-auth-action {
  border-color: var(--ui-border);
  background: var(--ui-surface);
  color: var(--ui-text-muted);
  box-shadow: var(--ui-shadow-xs);
}

.topbar-action:hover,
.topbar-action:focus,
.mobile-menu-toggle:hover,
.mobile-menu-toggle:focus,
.profile-dropdown-toggle:hover,
.profile-dropdown-toggle:focus,
.guest-auth-action:hover,
.guest-auth-action:focus {
  border-color: rgba(var(--ui-accent-rgb), .32);
  background: var(--ui-accent-soft);
  color: var(--ui-accent-strong);
  box-shadow: 0 4px 12px rgba(var(--ui-accent-rgb), .12);
  transform: translateY(-1px);
}

.profile-name { color: var(--ui-text); }
.profile-chevron { color: var(--ui-text-muted); }
.profile-avatar {
  background: var(--ui-accent-soft);
  color: var(--ui-accent-strong);
}

.notification-badge,
.system-alert-badge {
  border-color: var(--app-topbar-bg);
}

.app-shell {
  align-items: stretch;
  min-height: calc(100dvh - var(--app-topbar-height));
}

.app-sidebar .text-muted,
#mobileSidebar .text-muted {
  color: var(--ui-sidebar-muted) !important;
}

.app-sidebar {
  position: relative;
  border-right: 0;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .035), transparent 12rem),
    var(--ui-sidebar);
  color: var(--ui-sidebar-text);
  box-shadow: inset -1px 0 rgba(255, 255, 255, .045);
}

.sidebar-desktop {
  padding: .95rem .8rem 1.4rem;
  scrollbar-color: rgba(255, 255, 255, .2) transparent;
}

.sidebar-desktop::before {
  display: block;
  margin: .15rem .72rem .8rem;
  color: var(--ui-sidebar-muted);
  content: attr(data-navigation-label);
  font-size: .66rem;
  font-weight: 760;
  letter-spacing: .095em;
  text-transform: uppercase;
}

.sidebar-item { margin-bottom: .22rem; }

.sidebar-link {
  min-height: 2.7rem;
  padding: .62rem .7rem;
  border: 1px solid transparent;
  border-radius: .72rem;
  color: var(--ui-sidebar-text);
  font-size: .89rem;
  font-weight: 560;
  transition: color var(--ui-transition), background-color var(--ui-transition), border-color var(--ui-transition), transform var(--ui-transition);
}

.sidebar-link:hover,
.sidebar-link:focus {
  border-color: rgba(255, 255, 255, .07);
  background: rgba(255, 255, 255, .065);
  color: #fff;
  transform: none;
}

.sidebar-link.active {
  border-color: rgba(255, 255, 255, .08);
  background: linear-gradient(90deg, rgba(var(--ui-accent-rgb), .42), rgba(var(--ui-accent-rgb), .18));
  color: #fff;
  box-shadow: inset 3px 0 var(--ui-accent), 0 6px 18px rgba(0, 0, 0, .12);
  font-weight: 690;
}

.sidebar-link.parent-active {
  color: #fff;
  font-weight: 650;
}

.sidebar-link-main { gap: .68rem; }

.sidebar-link-main i {
  width: 1.42rem;
  flex-basis: 1.42rem;
  color: var(--ui-sidebar-muted);
  font-size: .93rem;
}

.sidebar-link:hover i,
.sidebar-link.active i,
.sidebar-link.parent-active i {
  color: #fff;
}

.sidebar-link-end .badge {
  border: 1px solid rgba(255, 255, 255, .09);
  background: rgba(255, 255, 255, .1) !important;
  color: #fff !important;
  font-size: .66rem;
}

.sidebar-sub {
  margin: .28rem 0 .42rem 1.14rem;
  padding: .12rem 0 .12rem .62rem;
  border-left-color: rgba(255, 255, 255, .11);
}

.sidebar-sub .sidebar-link {
  min-height: 2.32rem;
  padding: .47rem .62rem;
  color: #cbd5e1;
  font-size: .84rem;
}

#mobileSidebar {
  background: var(--ui-sidebar);
  color: var(--ui-sidebar-text);
}

#mobileSidebar .offcanvas-header {
  border-color: rgba(255, 255, 255, .1) !important;
}

#mobileSidebar .offcanvas-title,
#mobileSidebar .btn-close {
  color: #fff;
}

#mobileSidebar .btn-close { filter: invert(1) grayscale(1) brightness(2); }

.app-main {
  min-width: 0;
  padding: clamp(.85rem, 1.65vw, 1.55rem);
  background: transparent;
}

.main-content {
  max-width: var(--ui-content-max);
}

.app-context-bar {
  min-height: 2.7rem;
  margin-bottom: 1rem;
  padding: .55rem .75rem;
  border: 1px solid var(--ui-border);
  border-radius: .78rem;
  background: rgba(255, 255, 255, .7);
  box-shadow: var(--ui-shadow-xs);
  backdrop-filter: blur(12px);
}

[data-bs-theme="dark"] .app-context-bar {
  background: rgba(21, 30, 45, .78);
}

.breadcrumb {
  min-height: 1.55rem;
  color: var(--ui-text-muted);
  font-size: .8rem;
}

.breadcrumb a {
  color: var(--ui-text-muted);
  font-weight: 580;
}

.breadcrumb a:hover,
.breadcrumb a:focus {
  color: var(--ui-accent-strong);
}

.breadcrumb-item.active { color: var(--ui-text); font-weight: 650; }
.breadcrumb-item + .breadcrumb-item::before { color: var(--ui-border-strong); }

.content-scroll-x {
  isolation: isolate;
}

.content-scroll-x > :first-child { margin-top: 0 !important; }
.content-scroll-x > :last-child { margin-bottom: 0 !important; }

.app-footer {
  border-top-color: var(--ui-border) !important;
  background: var(--ui-surface);
  color: var(--ui-text-muted);
}

.app-footer-content { gap: .5rem; }
.app-footer-copyright { color: var(--ui-text); }
.app-footer-link { border-radius: .35rem; }

/* Typography and page hierarchy */
body.app-ui-next h1,
body.app-ui-next h2,
body.app-ui-next h3,
body.app-ui-next h4,
body.app-ui-next h5,
body.app-ui-next h6 {
  color: var(--ui-text);
  font-weight: 720;
  letter-spacing: -.024em;
}

body.app-ui-next h1,
body.app-ui-next .h1 { font-size: clamp(1.5rem, 1.2rem + 1vw, 2.05rem); }
body.app-ui-next h2,
body.app-ui-next .h2 { font-size: clamp(1.2rem, 1.06rem + .5vw, 1.55rem); }
body.app-ui-next h3,
body.app-ui-next .h3 { font-size: clamp(1.08rem, 1rem + .3vw, 1.3rem); }

.ui-page-header,
.app-page-header {
  align-items: center;
  margin-bottom: 1.15rem;
  padding: .2rem 0;
}

.ui-page-title,
.app-page-header__title {
  max-width: 34ch;
  color: var(--ui-text);
  font-size: clamp(1.55rem, 1.24rem + 1vw, 2.15rem);
  font-weight: 770;
}

.ui-page-description,
.app-page-header__lead {
  color: var(--ui-text-muted);
  font-size: .94rem;
  line-height: 1.55;
}

.text-muted,
.text-body-secondary,
.text-secondary,
.form-text { color: var(--ui-text-muted) !important; }

/* Surfaces, cards and panels */
body.app-ui-next .card,
body.app-ui-next .modal-content,
body.app-ui-next .dropdown-menu,
body.app-ui-next .list-group-item,
body.app-ui-next .accordion-item {
  border-color: var(--ui-border);
  background-color: var(--ui-surface);
  color: var(--ui-text);
}

body.app-ui-next .card {
  border-width: 1px;
  border-radius: var(--ui-radius-md);
  box-shadow: var(--ui-shadow-sm) !important;
}

body.app-ui-next .card.border-0 {
  border: 1px solid var(--ui-border) !important;
}

body.app-ui-next .card.shadow,
body.app-ui-next .card.shadow-sm {
  box-shadow: var(--ui-shadow-sm) !important;
}

body.app-ui-next .card-header {
  min-height: 2.9rem;
  padding: .7rem .85rem;
  border-bottom-color: var(--ui-border);
  background: var(--ui-surface-muted);
  color: var(--ui-text);
}

body.app-ui-next .card-footer {
  border-top-color: var(--ui-border);
  background: var(--ui-surface-muted);
}

body.app-ui-next .card-body { color: var(--ui-text); }
body.app-ui-next .bg-body { background-color: var(--ui-surface) !important; }
body.app-ui-next .bg-body-tertiary,
body.app-ui-next .bg-light { background-color: var(--ui-surface-muted) !important; }
body.app-ui-next .border,
body.app-ui-next .border-top,
body.app-ui-next .border-bottom,
body.app-ui-next .border-start,
body.app-ui-next .border-end { border-color: var(--ui-border) !important; }

.ui-empty-state,
.app-empty-state {
  min-height: 13rem;
  border: 1px dashed var(--ui-border-strong);
  background: var(--ui-surface-muted);
}

.ui-empty-state > i,
.app-empty-state > i { color: var(--ui-accent); }

/* Buttons and actions */
body.app-ui-next .btn {
  min-height: var(--ui-control-height);
  padding-inline: .75rem;
  border-radius: .62rem;
  font-size: .84rem;
  font-weight: 680;
  letter-spacing: -.005em;
  box-shadow: var(--ui-shadow-xs);
  transition: transform var(--ui-transition), box-shadow var(--ui-transition), background-color var(--ui-transition), border-color var(--ui-transition), color var(--ui-transition);
}

body.app-ui-next .btn-sm {
  min-height: var(--ui-control-height-sm);
  padding-inline: .58rem;
  border-radius: .54rem;
  font-size: .76rem;
}

body.app-ui-next .btn-lg {
  min-height: 2.8rem;
  border-radius: .7rem;
  font-size: .9rem;
}

body.app-ui-next .btn:not(:disabled):hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(16, 24, 40, .1);
}

body.app-ui-next .btn-primary {
  --bs-btn-bg: var(--ui-accent);
  --bs-btn-border-color: var(--ui-accent);
  --bs-btn-hover-bg: var(--ui-accent-strong);
  --bs-btn-hover-border-color: var(--ui-accent-strong);
  --bs-btn-active-bg: var(--ui-accent-strong);
  --bs-btn-active-border-color: var(--ui-accent-strong);
  color: #fff;
}

body.app-ui-next .btn-outline-primary {
  --bs-btn-color: var(--ui-accent-strong);
  --bs-btn-border-color: rgba(var(--ui-accent-rgb), .38);
  --bs-btn-hover-bg: var(--ui-accent);
  --bs-btn-hover-border-color: var(--ui-accent);
  --bs-btn-active-bg: var(--ui-accent-strong);
}

body.app-ui-next .btn-light,
body.app-ui-next .btn-outline-secondary {
  border-color: var(--ui-border-strong);
  background: var(--ui-surface);
  color: var(--ui-text);
}

body.app-ui-next .btn-light:hover,
body.app-ui-next .btn-outline-secondary:hover {
  border-color: rgba(var(--ui-accent-rgb), .3);
  background: var(--ui-accent-soft);
  color: var(--ui-accent-strong);
}

body.app-ui-next .btn-link {
  min-height: auto;
  box-shadow: none;
  color: var(--ui-accent-strong);
}

body.app-ui-next .btn-close { border-radius: .5rem; }
body.app-ui-next .dropdown-item { min-height: 2.45rem; padding: .55rem .68rem; }
body.app-ui-next .dropdown-item:hover,
body.app-ui-next .dropdown-item:focus { background: var(--ui-accent-soft); color: var(--ui-accent-strong); }

/* Forms */
body.app-ui-next .form-label {
  margin-bottom: .42rem;
  color: var(--ui-text);
  font-size: .84rem;
  font-weight: 670;
}

body.app-ui-next .form-control,
body.app-ui-next .form-select,
body.app-ui-next .input-group-text {
  min-height: var(--ui-control-height);
  border-color: var(--ui-border-strong);
  border-radius: .68rem;
  background-color: var(--ui-surface);
  color: var(--ui-text);
  font-size: .9rem;
  box-shadow: inset 0 1px 2px rgba(16, 24, 40, .025);
}

body.app-ui-next textarea.form-control { min-height: 7rem; line-height: 1.55; }

body.app-ui-next .form-control:hover,
body.app-ui-next .form-select:hover { border-color: color-mix(in srgb, var(--ui-border-strong) 55%, var(--ui-accent)); }

body.app-ui-next .form-control:focus,
body.app-ui-next .form-select:focus {
  border-color: var(--ui-accent);
  box-shadow: 0 0 0 .22rem rgba(var(--ui-accent-rgb), .14) !important;
}

body.app-ui-next .form-control::placeholder { color: color-mix(in srgb, var(--ui-text-muted) 72%, transparent); }
body.app-ui-next .form-check-input { border-color: var(--ui-border-strong); }
body.app-ui-next .form-check-input:checked { border-color: var(--ui-accent); background-color: var(--ui-accent); }
body.app-ui-next .form-switch .form-check-input { min-width: 2.35rem; height: 1.25rem; }
body.app-ui-next fieldset { min-width: 0; }
body.app-ui-next legend { color: var(--ui-text); font-size: 1rem; font-weight: 700; }

body.app-ui-next .input-group-text {
  background: var(--ui-surface-muted);
  color: var(--ui-text-muted);
}

body.app-ui-next :disabled,
body.app-ui-next .disabled {
  cursor: not-allowed;
}

/* Tables and data-heavy modules */
body.app-ui-next .table-responsive,
body.app-ui-next .app-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--ui-border);
  border-radius: .85rem;
  background: var(--ui-surface);
  scrollbar-width: thin;
}

body.app-ui-next .card .table-responsive,
body.app-ui-next .card .app-table-wrap {
  border: 0;
  border-radius: 0 0 var(--ui-radius-md) var(--ui-radius-md);
}

body.app-ui-next .table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--ui-text);
  --bs-table-border-color: var(--ui-border);
  --bs-table-hover-bg: rgba(var(--ui-accent-rgb), .045);
  margin-bottom: 0;
  font-size: .86rem;
}

body.app-ui-next .table > :not(caption) > * > * {
  padding: .78rem .85rem;
  border-bottom-color: var(--ui-border);
  vertical-align: middle;
}

body.app-ui-next .table thead th {
  position: relative;
  border-bottom-width: 1px;
  background: var(--ui-surface-muted);
  color: var(--ui-text-muted);
  font-size: .69rem;
  font-weight: 780;
  letter-spacing: .055em;
  line-height: 1.25;
  text-transform: uppercase;
  white-space: nowrap;
}

body.app-ui-next .table tbody tr:last-child > * { border-bottom: 0; }
body.app-ui-next .table-hover > tbody > tr:hover > * { color: var(--ui-text); }
body.app-ui-next .table .btn { white-space: nowrap; }
body.app-ui-next .table caption { padding: .7rem .85rem; color: var(--ui-text-muted); }

/* Navigation, tabs and pagination */
body.app-ui-next .nav-tabs {
  gap: .25rem;
  border-bottom-color: var(--ui-border);
}

body.app-ui-next .nav-tabs .nav-link {
  min-height: 2.55rem;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: .55rem .55rem 0 0;
  color: var(--ui-text-muted);
  font-size: .86rem;
  font-weight: 650;
}

body.app-ui-next .nav-tabs .nav-link:hover { background: var(--ui-surface-muted); color: var(--ui-text); }
body.app-ui-next .nav-tabs .nav-link.active {
  border-bottom-color: var(--ui-accent);
  background: var(--ui-accent-soft);
  color: var(--ui-accent-strong);
}

body.app-ui-next .nav-pills .nav-link {
  min-height: 2.45rem;
  border-radius: .64rem;
  color: var(--ui-text-muted);
  font-size: .84rem;
  font-weight: 640;
}

body.app-ui-next .nav-pills .nav-link.active { background: var(--ui-accent); color: #fff; }

body.app-ui-next .pagination { gap: .25rem; }
body.app-ui-next .page-link {
  display: inline-grid;
  place-items: center;
  min-width: 2.4rem;
  min-height: 2.4rem;
  border-color: var(--ui-border);
  border-radius: .58rem !important;
  background: var(--ui-surface);
  color: var(--ui-text-muted);
  font-size: .82rem;
  font-weight: 650;
}
body.app-ui-next .page-link:hover { border-color: rgba(var(--ui-accent-rgb), .32); background: var(--ui-accent-soft); color: var(--ui-accent-strong); }
body.app-ui-next .active > .page-link { border-color: var(--ui-accent); background: var(--ui-accent); color: #fff; }

/* Feedback and status */
body.app-ui-next .alert {
  padding: .88rem 1rem;
  border-width: 1px;
  border-radius: .82rem;
  box-shadow: none !important;
  font-size: .88rem;
}

body.app-ui-next .alert.border-0 { border: 1px solid currentColor !important; }
body.app-ui-next .badge { padding: .36em .6em; border-radius: .48rem; font-size: .7rem; font-weight: 720; }
body.app-ui-next .rounded-pill.badge { border-radius: 999px; }

.ui-status {
  min-height: 1.7rem;
  padding: .22rem .58rem;
  border-radius: 999px;
  font-size: .73rem;
}

body.app-ui-next .progress {
  height: .48rem;
  border-radius: 999px;
  background: var(--ui-surface-strong);
}
body.app-ui-next .progress-bar { border-radius: inherit; background-color: var(--ui-accent); }

/* Modals, dropdowns and overlays */
body.app-ui-next .dropdown-menu,
body.app-ui-next .profile-dropdown,
body.app-ui-next .preferences-dropdown,
body.app-ui-next .notification-dropdown,
body.app-ui-next .system-alert-dropdown {
  border-color: var(--ui-border);
  border-radius: .9rem;
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-lg);
}

body.app-ui-next .modal-dialog {
  --ui-modal-viewport-gap: 2rem;
  max-height: calc(100dvh - var(--ui-modal-viewport-gap));
}
body.app-ui-next .modal-content {
  display: flex;
  max-height: calc(100dvh - var(--ui-modal-viewport-gap));
  overflow: hidden;
  border-radius: 1rem;
  box-shadow: var(--ui-shadow-lg);
}
body.app-ui-next .modal-body {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
}
body.app-ui-next .modal-header,
body.app-ui-next .modal-footer {
  flex: 0 0 auto;
  border-color: var(--ui-border);
}
body.app-ui-next .modal-header { background: var(--ui-surface-muted); }
body.app-ui-next .modal-title { font-size: 1.05rem; }
body.app-ui-next .offcanvas { border-color: var(--ui-border); }

.app-toast {
  border-color: var(--ui-border);
  background: rgba(255, 255, 255, .94);
  box-shadow: var(--ui-shadow-lg);
}
[data-bs-theme="dark"] .app-toast { background: rgba(21, 30, 45, .95); }

/* Filters and settings shells */
.app-filter-bar {
  top: calc(var(--app-topbar-height) + .7rem);
  border-color: var(--ui-border);
  background: rgba(255, 255, 255, .88);
  box-shadow: var(--ui-shadow-sm);
}
[data-bs-theme="dark"] .app-filter-bar { background: rgba(21, 30, 45, .9); }

.settings-shell,
.settings-layout,
.admin-tools-shell {
  gap: 1rem;
}

/* Authentication and narrow forms */
body.app-ui-next .auth-card,
body.app-ui-next .login-card,
body.app-ui-next form.card {
  border-color: var(--ui-border);
}

/* Progressive enhancement hooks */
body.app-ui-next [data-ui-icon-only="true"] {
  width: var(--ui-control-height);
  min-width: var(--ui-control-height);
  padding-inline: 0;
}

body.app-ui-next [data-ui-enhanced-table="true"] { min-width: 42rem; }
body.app-ui-next [data-ui-empty="true"] { display: none !important; }

body.app-ui-next .card-header :is(h2, h3, h4, h5, h6, .h2, .h3, .h4, .h5, .h6) {
  margin-bottom: 0;
  font-size: .94rem;
  line-height: 1.3;
}

.admin-theme-picker {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(8.8rem, 1fr));
  gap: .55rem;
}
.admin-theme-choice {
  display: flex;
  align-items: center;
  gap: .55rem;
  min-height: 2.65rem;
  padding: .48rem .62rem;
  border: 1px solid var(--ui-border-strong);
  border-radius: .68rem;
  background: var(--ui-surface);
  color: var(--ui-text);
  cursor: pointer;
  font-size: .82rem;
  font-weight: 680;
  transition: border-color var(--ui-transition), box-shadow var(--ui-transition), background-color var(--ui-transition);
}
.admin-theme-choice:hover { border-color: var(--admin-theme-swatch); background: var(--ui-surface-muted); }
.admin-theme-choice-swatch {
  width: 1.18rem;
  height: 1.18rem;
  flex: 0 0 1.18rem;
  border: 2px solid rgba(255, 255, 255, .85);
  border-radius: 50%;
  background: var(--admin-theme-swatch);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--admin-theme-swatch) 38%, var(--ui-border));
}
.admin-theme-choice-check { margin-left: auto; color: var(--admin-theme-swatch); opacity: 0; }
.btn-check:checked + .admin-theme-choice {
  border-color: var(--admin-theme-swatch);
  background: color-mix(in srgb, var(--admin-theme-swatch) 9%, var(--ui-surface));
  box-shadow: 0 0 0 .16rem color-mix(in srgb, var(--admin-theme-swatch) 18%, transparent);
}
.btn-check:checked + .admin-theme-choice .admin-theme-choice-check { opacity: 1; }
.btn-check:focus-visible + .admin-theme-choice { outline: 3px solid color-mix(in srgb, var(--admin-theme-swatch) 24%, transparent); outline-offset: 2px; }

/* Module-specific refinements: all first-party modules share the system, while
   dense workflows get a few safe layout adjustments. */
body[data-app-module="Dashboard"] .content-scroll-x { container-type: inline-size; }
body[data-app-module="Dashboard"] .dashboard-stat-card,
body[data-app-module="Dashboard"] .metric-card { transition: transform var(--ui-transition), box-shadow var(--ui-transition); }
body[data-app-module="Dashboard"] .dashboard-stat-card:hover,
body[data-app-module="Dashboard"] .metric-card:hover { transform: translateY(-2px); box-shadow: var(--ui-shadow-md) !important; }

body[data-app-module="Tickets"] .ticket-index-page,
body[data-app-module="Tickets"] .ticket-show-page,
body[data-app-module="Tickets"] .ticket-form-page { --app-sticky-offset: calc(var(--app-topbar-height) + .8rem); }

body[data-app-module="Users"] .rounded-4.bg-primary-subtle,
body[data-app-module="SystemSettings"] .rounded-4.bg-primary-subtle,
body[data-app-module="MailSettings"] .rounded-4.bg-primary-subtle {
  border: 1px solid rgba(var(--ui-accent-rgb), .18);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25);
}

body[data-app-module="SystemLogs"] code,
body[data-app-module="AdminTools"] code,
body[data-app-module="Backups"] code {
  border: 1px solid var(--ui-border);
  border-radius: .38rem;
  background: var(--ui-surface-muted);
  color: var(--ui-text);
}

body[data-app-module="SystemLogs"] .log-detail-context code {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font: inherit;
}

.profile-mfa-copy,
.mfa-manage-copy {
  min-width: 0;
  flex: 1 1 18rem;
}
.profile-mfa-heading,
.mfa-manage-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .5rem .75rem;
}
.profile-mfa-heading h2,
.mfa-manage-copy h1 {
  min-width: 0;
  overflow-wrap: anywhere;
}
.profile-mfa-heading .badge,
.mfa-manage-header > .badge {
  flex: 0 0 auto;
  max-width: 100%;
  white-space: normal;
  text-align: center;
}
.profile-mfa-card > .btn { flex: 0 0 auto; }

.satisfaction-filter {
  display: flex;
  align-items: end;
  flex-wrap: wrap;
  gap: .65rem;
}
.satisfaction-filter-field {
  min-width: 9.5rem;
  flex: 1 1 9.5rem;
}
.satisfaction-filter-field .form-label {
  margin-bottom: .3rem;
}
.satisfaction-response-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: .75rem;
}
.satisfaction-response-title {
  min-width: 0;
  overflow-wrap: anywhere;
}
.satisfaction-rating-badge {
  align-self: start;
  white-space: nowrap;
}

body[data-app-module="ModuleAdmin"] .modal-content,
body[data-app-module="License"] .modal-content { max-height: min(calc(100dvh - var(--ui-modal-viewport-gap)), 62rem); }

/* Responsive behavior */
@media (min-width: 1200px) {
  .app-main { padding-inline: clamp(1.2rem, 2.2vw, 2rem); }
}

@media (max-width: 1199.98px) {
  :root { --app-sidebar-width: 16.5rem; }
}

@media (max-width: 991.98px) {
  :root { --app-topbar-height: 4rem; }
  .app-main { padding: .8rem; }
  .app-context-bar { margin-bottom: .8rem; }
  .app-filter-bar { position: static; }
  body.app-ui-next .card { border-radius: .9rem; }
}

@media (max-width: 767.98px) {
  body.app-ui-next { background: var(--ui-canvas); }
  .ui-page-header,
  .app-page-header { align-items: stretch; }
  .ui-page-header > :last-child,
  .app-page-header > :last-child { display: grid; grid-template-columns: 1fr; width: 100%; }
  .ui-page-header > :last-child .btn,
  .app-page-header > :last-child .btn { width: 100%; }
  body.app-ui-next .card-body { padding: .85rem; }
  body.app-ui-next .card-header { padding: .66rem .78rem; }
  body.app-ui-next .table > :not(caption) > * > * { padding: .68rem .72rem; }
  .app-footer { padding-block: 1.4rem !important; }
}

@media (max-width: 575.98px) {
  .app-topbar .container-fluid { padding-inline: .6rem !important; }
  .brand-link { max-width: calc(100vw - 14.5rem); }
  .brand-mark { width: 2.18rem; height: 2.18rem; flex-basis: 2.18rem; border-radius: .68rem; }
  .app-main { padding: .62rem; }
  .app-context-bar { min-height: 2.45rem; padding: .48rem .62rem; border-radius: .68rem; }
  .breadcrumb { font-size: .75rem; }
  body.app-ui-next .btn:not(.btn-sm) { min-height: 2.5rem; }
  body.app-ui-next .form-control,
  body.app-ui-next .form-select,
  body.app-ui-next .input-group-text { min-height: 2.5rem; }
  body.app-ui-next .modal-dialog {
    --ui-modal-viewport-gap: 1.2rem;
    margin: .6rem;
  }
  body.app-ui-next .modal-content { border-radius: .88rem; }
  .profile-mfa-card > .btn { width: 100%; }
  .satisfaction-filter,
  .satisfaction-filter .btn { width: 100%; }
  .satisfaction-filter-field { width: 100%; flex-basis: 100%; }
}

@media (pointer: coarse) {
  body.app-ui-next .btn,
  body.app-ui-next .form-control,
  body.app-ui-next .form-select,
  body.app-ui-next .dropdown-item,
  body.app-ui-next .page-link,
  body.app-ui-next .nav-link { min-height: 2.5rem; }
}

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

@media (prefers-contrast: more) {
  :root {
    --ui-border: #98a2b3;
    --ui-border-strong: #667085;
  }
  body.app-ui-next .card,
  body.app-ui-next .form-control,
  body.app-ui-next .form-select,
  body.app-ui-next .btn { box-shadow: none !important; }
}

@media print {
  .app-topbar,
  .app-sidebar,
  .app-footer,
  .app-back-to-top,
  .app-context-bar,
  .btn,
  .dropdown { display: none !important; }
  .app-main { padding: 0 !important; }
  body.app-ui-next,
  .card { background: #fff !important; color: #000 !important; box-shadow: none !important; }
  .card { break-inside: avoid; border-color: #aaa !important; }
}

/* Small semantic utilities used by the enhanced layouts. */
.breadcrumb { --bs-breadcrumb-divider: '›'; }
.form-label.is-required::after {
  margin-left: .25rem;
  color: var(--ui-danger);
  content: '*';
  font-weight: 760;
}