/* Admin-only UI fixes (spacing + topbar user dropdown)
   Loaded from app/application/views/admin/header.php
*/

/* ===== FIXED TOP-RIGHT PROFILE BUTTON ===== */
.ivqa-fixed-profile {
  position: fixed !important;
  top: 12px !important;
  right: 18px !important;
  z-index: 99999 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.ivqa-fp-btn {
  all: unset !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  height: 36px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  border: 1.5px solid rgba(37, 99, 235, 0.30) !important;
  background: #ffffff !important;
  color: #0f172a !important;
  font-family: Inter, system-ui, sans-serif !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
  box-shadow: 0 2px 12px rgba(37, 99, 235, 0.12) !important;
  white-space: nowrap !important;
  line-height: 1 !important;
}

.ivqa-fp-btn:hover {
  background: #f0f5ff !important;
}

.ivqa-fp-avatar {
  width: 24px !important;
  height: 24px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #2563eb !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

.ivqa-fp-label {
  font-weight: 800 !important;
  font-size: 13px !important;
}

.ivqa-fp-btn i {
  font-size: 10px !important;
  color: #64748b !important;
}

.ivqa-fp-menu {
  position: absolute !important;
  top: calc(100% + 10px) !important;
  right: 0 !important;
  min-width: 280px !important;
  background: #fff !important;
  border: 1px solid rgba(15, 23, 42, 0.10) !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 60px rgba(2, 6, 23, 0.16) !important;
  padding: 10px !important;
  display: none !important;
  z-index: 99999 !important;
}

.ivqa-fp-menu.open {
  display: block !important;
}

.ivqa-fp-meta {
  padding: 10px 10px 8px !important;
}

.ivqa-fp-name {
  font-weight: 900 !important;
  color: #0f172a !important;
  font-size: 15px !important;
  line-height: 1.2 !important;
}

.ivqa-fp-email {
  color: rgba(15, 23, 42, 0.55) !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  margin-top: 4px !important;
}

.ivqa-fp-divider {
  height: 1px !important;
  background: rgba(15, 23, 42, 0.10) !important;
  margin: 8px 0 !important;
}

.ivqa-fp-link {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px !important;
  border-radius: 12px !important;
  text-decoration: none !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  color: rgba(15, 23, 42, 0.88) !important;
}

.ivqa-fp-link:hover {
  background: rgba(37, 99, 235, 0.08) !important;
}

.ivqa-fp-link.ivqa-fp-logout {
  color: #b42318 !important;
}

.ivqa-fp-link.ivqa-fp-logout:hover {
  background: rgba(180, 35, 24, 0.08) !important;
}

@media (max-width: 767px) {
  .ivqa-fixed-profile {
    right: 10px !important;
    top: 10px !important;
  }
  .ivqa-fp-label {
    display: none !important;
  }
  .ivqa-fp-btn {
    padding: 0 10px !important;
  }
}
/* ===== END FIXED PROFILE BUTTON ===== */

/* Pro CRM typography (ensure admin dashboard matches CRM/app) */
body.crm-app,
body.crm-app button,
body.crm-app input,
body.crm-app select,
body.crm-app textarea {
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
}

/* Topbar layout */
.admin-topbar {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: #f5f7fb;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.admin-topbar .navbar {
  position: relative;
}

/* Template uses body.fixed with a large padding-top on .content-wrapper (80px / 125px).
   Keep enough offset so content doesn't go under the fixed header, but reduce empty space. */
body.fixed .wrapper > .main-header.admin-topbar {
  max-height: 64px;
  overflow: visible !important;
}

body.fixed .wrapper > .main-header.admin-topbar div.logo-box,
body.fixed .wrapper > .main-header.admin-topbar .logo,
body.fixed .wrapper > .main-header.admin-topbar .navbar {
  height: 64px;
}

body.fixed .wrapper > .main-header.admin-topbar .navbar {
  min-height: 64px;
}

body.fixed .wrapper > .main-header.admin-topbar .logo .logo-lg {
  height: 64px !important;
}

body.fixed .wrapper > .main-header.admin-topbar .ivqa-admin-logo {
  max-height: 36px;
  width: auto;
  margin-top: 0 !important;
  margin-left: 12px;
}

body.fixed .wrapper > .main-header.admin-topbar ~ .content-wrapper,
body.fixed .wrapper > .main-header.admin-topbar ~ .right-side {
  padding-top: 64px !important;
}

@media (max-width: 767px) {
  body.fixed .wrapper > .main-header.admin-topbar {
    max-height: 64px;
  }
  body.fixed .wrapper > .main-header.admin-topbar ~ .content-wrapper,
  body.fixed .wrapper > .main-header.admin-topbar ~ .right-side {
    padding-top: 64px !important;
  }
}

/* Ensure dropdowns aren't clipped by template containers */
.admin-topbar,
.admin-topbar .navbar,
.admin-topbar .navbar-custom-menu,
.admin-topbar .navbar-custom-menu .navbar-nav {
  overflow: visible !important;
}

.admin-topbar .navbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.admin-topbar .navbar-custom-menu {
  margin-left: auto;
}

.admin-topbar .ivqa-topbar-menu {
  position: absolute !important;
  right: 18px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin-left: 0 !important;
  float: none !important;
  padding-right: 0 !important;
  z-index: 1010;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.admin-topbar .ivqa-topbar-menu .navbar-nav {
  display: flex !important;
  align-items: center;
  margin: 0;
}

.admin-topbar .ivqa-topbar-menu .navbar-nav > li {
  float: none;
  display: block !important;
  visibility: visible !important;
}

/* PROBLEM #1: reduce empty vertical space */

.content-wrapper > .container-full > .content {
  padding-top: 12px !important;
  padding-bottom: 18px;
}

/* Common page header blocks */
.content-header {
  padding: 12px 18px !important;
  margin: 0 !important;
}

.ivqa-dashboard-title,
.ivqa-page-title {
  margin-top: 0 !important;
  margin-bottom: 6px !important;
}

.ivqa-dashboard-subtitle,
.ivqa-page-subtitle {
  margin-top: 0 !important;
}

/* Old CRM header block spacing */
.crm-pagehead {
  margin-top: 0 !important;
}

/* PROBLEM #2: user dropdown — override base template's aggressive specificity */
.admin-topbar .navbar-custom-menu .navbar-nav > li.ivqa-user {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  height: auto !important;
}

.admin-topbar .navbar-custom-menu .navbar-nav > li.ivqa-user > a.ivqa-user-btn,
.admin-topbar .navbar-custom-menu .navbar-nav > li.ivqa-user > a.ivqa-user-btn.dropdown-toggle,
.admin-topbar .navbar-custom-menu .navbar-nav > li.ivqa-user:last-child > a.ivqa-user-btn {
  height: 42px !important;
  width: auto !important;
  min-width: 42px !important;
  padding: 0 16px !important;
  margin: 0 !important;
  border-radius: 999px !important;
  border: 2px solid #2563eb !important;
  background: #ffffff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  font-weight: 900 !important;
  font-size: 15px !important;
  color: #0f172a !important;
  box-shadow: 0 4px 16px rgba(37, 99, 235, 0.18) !important;
  cursor: pointer !important;
  text-decoration: none !important;
  line-height: 1 !important;
}

.admin-topbar .navbar-custom-menu .navbar-nav > li.ivqa-user > a.ivqa-user-btn.dropdown-toggle::after {
  display: none !important;
}

.ivqa-user-avatar {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #2563eb;
  color: #fff;
  font-weight: 900;
  font-size: 13px;
  line-height: 1;
}

.ivqa-user-label {
  font-weight: 800;
  font-size: 15px;
}

@media (max-width: 767px) {
  .admin-topbar .ivqa-topbar-menu {
    right: 10px !important;
  }

  .admin-topbar .navbar-custom-menu .navbar-nav > li.ivqa-user > a.ivqa-user-btn,
  .admin-topbar .navbar-custom-menu .navbar-nav > li.ivqa-user > a.ivqa-user-btn.dropdown-toggle,
  .admin-topbar .navbar-custom-menu .navbar-nav > li.ivqa-user:last-child > a.ivqa-user-btn {
    padding: 0 10px !important;
    gap: 8px !important;
  }

  .ivqa-user-label {
    display: none !important;
  }
}

.ivqa-user-btn:focus {
  outline: 0;
  box-shadow: 0 0 0 4px rgba(16, 112, 208, 0.16);
}

.ivqa-user-dd {
  position: absolute;
  right: 0;
  top: calc(100% + 10px);
  min-width: 280px;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.10);
  border-radius: 16px;
  box-shadow: 0 24px 60px rgba(2, 6, 23, 0.14);
  padding: 10px;
  display: none;
  z-index: 2000;
}

.ivqa-user-dd.open {
  display: block;
}

.ivqa-user-dd .meta {
  padding: 10px 10px 8px;
}

.ivqa-user-dd .name {
  font-weight: 900;
  color: #0f172a;
  line-height: 1.2;
}

.ivqa-user-dd .email {
  color: rgba(15, 23, 42, 0.62);
  font-weight: 700;
  font-size: 12px;
  margin-top: 4px;
}

.ivqa-user-dd .divider {
  height: 1px;
  background: rgba(15, 23, 42, 0.10);
  margin: 8px 0;
}

.ivqa-user-dd a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 10px;
  border-radius: 12px;
  text-decoration: none;
  font-weight: 800;
  color: rgba(15, 23, 42, 0.92);
}

.ivqa-user-dd a:hover {
  background: rgba(16, 112, 208, 0.08);
}

.ivqa-user-dd a.logout {
  color: #b42318;
}

.ivqa-user-dd a.logout:hover {
  background: rgba(180, 35, 24, 0.08);
}


/* ===== Admin Dashboard (CRM page) ===== */

/* Variables (fallbacks; crm_v2.css also defines these under .crm-app) */
.crm-page {
  --bg: #f5f7fb;
  --card: #fff;
  --text: #0b1324;
  --muted: #6b7a90;
  --primary: #1f6feb;
}

.crm-page {
  background: var(--bg);
}

/* Header block */
.crm-header {
  background: var(--card);
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 14px;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
  padding: 16px 18px;
  margin: 0 0 16px 0;
}

.crm-header-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.crm-breadcrumb {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(11, 19, 36, 0.55);
  margin-bottom: 6px;
}

.crm-title {
  margin: 0;
  font-size: 26px;
  line-height: 1.15;
  font-weight: 900;
  letter-spacing: -0.02em;
  color: var(--text);
}

.crm-subtitle {
  margin-top: 6px;
  color: var(--muted);
  font-weight: 650;
}

.crm-subtitle:empty {
  display: none;
}

.crm-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

/* Home-page button style (tv-btn-primary) reused in Admin dashboard */
.crm-app .tv-btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 22px;
  border-radius: 18px 0 18px 0;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-decoration: none;
  cursor: pointer;
  line-height: 1.1;
  background: linear-gradient(135deg, var(--primary), #0ea5e9);
  border: 1px solid rgba(31, 111, 235, 0.35);
  color: #fff;
  box-shadow: 0 10px 22px rgba(37, 99, 235, 0.20);
  transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease, border-color .15s ease, color .15s ease;
}

.crm-app .tv-btn-primary:hover {
  transform: translateY(-1px);
  background: linear-gradient(135deg, var(--primary), #0ea5e9);
  border-color: rgba(31, 111, 235, 0.35);
  color: #fff;
  box-shadow: 0 12px 26px rgba(37, 99, 235, 0.26);
}

.crm-app .tv-btn-primary:active {
  transform: translateY(0);
}

.crm-app .tv-btn-primary:focus,
.crm-app .tv-btn-primary:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(37, 99, 235, 0.20);
}

.crm-app .tv-btn-primary .btn-wrap {
  display: inline-block;
}

/* Keep compatibility if the markup includes btn-text2 */
.crm-app .tv-btn-primary .btn-text2 {
  display: none !important;
}

.crm-app .tv-btn-primary.btn-sm {
  padding: 8px 14px;
  font-size: 14px;
  font-weight: 800;
  border-radius: 16px 0 16px 0;
}

.crm-action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--card);
  color: rgba(11, 19, 36, 0.92);
  text-decoration: none;
  font-weight: 850;
  box-shadow: none;
}

.crm-action-btn:hover {
  background: rgba(2, 6, 23, 0.02);
}

.crm-action-btn:focus {
  outline: 0;
  box-shadow: var(--focus);
}

.crm-action-btn-primary {
  background: linear-gradient(135deg, var(--primary), #0ea5e9);
  border-color: rgba(31, 111, 235, 0.30);
  color: #fff;
}

.crm-action-btn-primary:hover {
  filter: brightness(0.98);
}

.crm-action-btn-small {
  padding: 8px 12px;
  font-size: 12px;
}

.crm-action-btn i {
  font-size: 14px;
}

/* Stats grid */
.stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}

@media (max-width: 1199px) {
  .stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 575px) {
  .stat-grid {
    grid-template-columns: 1fr;
  }
  .crm-header-actions {
    width: 100%;
    justify-content: flex-start;
  }
}

.stat-card {
  position: relative;
  min-height: 118px;
  padding: 18px 18px 16px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.crm-page .stat-card {
  padding-top: 72px;
  justify-content: flex-start;
}

.stat-icon {
  position: absolute;
  top: 16px;
  left: 16px;
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(31, 111, 235, 0.12);
  color: #1f6feb;
  box-shadow: inset 0 0 0 1px rgba(31, 111, 235, 0.12);
}

.stat-number {
  margin-top: 22px;
  font-size: 34px;
  font-weight: 950;
  letter-spacing: -0.03em;
  color: var(--text);
}

.crm-page .stat-number {
  margin-top: 0;
  line-height: 1.05;
  font-variant-numeric: tabular-nums;
}

.crm-page .stat-icon i {
  font-size: 16px;
}

.stat-label {
  margin-top: 4px;
  color: var(--muted);
  font-weight: 750;
}

/* Soft card wrapper */
.card-soft {
  background: var(--card);
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 14px;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
}

.card-soft-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.card-soft-title {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 900;
  color: rgba(11, 19, 36, 0.92);
}

.card-soft-ico {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(31, 111, 235, 0.10);
  color: var(--primary);
}

.card-soft-ico i {
  font-size: 14px;
}

/* Soft tables */
.table-soft {
  border-collapse: separate;
  border-spacing: 0;
}

.table-soft thead th {
  background: rgba(15, 23, 42, 0.02);
  border-bottom: 1px solid rgba(15, 23, 42, 0.08) !important;
  color: rgba(11, 19, 36, 0.75);
  font-weight: 900;
  letter-spacing: 0.2px;
  white-space: nowrap;
}

.table-soft td,
.table-soft th {
  border-top: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
}

.table-soft tbody tr {
  transition: background 140ms ease;
}

.table-soft tbody tr:hover {
  background: rgba(31, 111, 235, 0.06);
}

/* ===== Certificates list (Admin) ===== */

.ivqa-certificates-page .ivqa-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

@media (max-width: 1199px) {
  .ivqa-certificates-page .ivqa-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 991px) {
  .ivqa-certificates-page .ivqa-kpi-grid {
    grid-template-columns: 1fr;
  }
}

.ivqa-certificates-page .ivqa-kpi-card {
  appearance: none;
  border: 1px solid rgba(15, 23, 42, 0.10);
  background: #ffffff;
  border-radius: 18px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  text-align: left;
  cursor: pointer;
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.ivqa-certificates-page .ivqa-kpi-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.10);
  border-color: rgba(31, 111, 235, 0.22);
}

.ivqa-certificates-page .ivqa-kpi-ico {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.10);
}

.ivqa-certificates-page .ivqa-kpi-ico i {
  font-size: 18px;
}

.ivqa-certificates-page .ivqa-kpi-ico.is-success {
  background: rgba(34, 197, 94, 0.12);
  color: #15803d;
}

.ivqa-certificates-page .ivqa-kpi-ico.is-muted {
  background: rgba(148, 163, 184, 0.18);
  color: rgba(30, 41, 59, 0.78);
}

.ivqa-certificates-page .ivqa-kpi-ico.is-warning {
  background: rgba(245, 158, 11, 0.16);
  color: #a16207;
}

.ivqa-certificates-page .ivqa-kpi-ico.is-info {
  background: rgba(59, 130, 246, 0.12);
  color: #1d4ed8;
}

.ivqa-certificates-page .ivqa-kpi-main {
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.ivqa-certificates-page .ivqa-kpi-number {
  font-size: 38px;
  line-height: 1.05;
  font-weight: 950;
  letter-spacing: -0.03em;
  color: rgba(11, 19, 36, 0.92);
  font-variant-numeric: tabular-nums;
}

.ivqa-certificates-page .ivqa-kpi-label {
  font-size: 14px;
  font-weight: 900;
  color: rgba(11, 19, 36, 0.80);
}

.ivqa-certificates-page .ivqa-kpi-sub {
  font-size: 12px;
  color: rgba(11, 19, 36, 0.55);
  font-weight: 700;
}

.ivqa-certificates-page .ivqa-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.ivqa-certificates-page .ivqa-card-title {
  display: inline-flex;
  align-items: baseline;
  gap: 10px;
}

.ivqa-certificates-page .ivqa-card-meta {
  font-size: 12px;
  font-weight: 900;
  color: rgba(11, 19, 36, 0.62);
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(2, 6, 23, 0.03);
  border: 1px solid rgba(15, 23, 42, 0.10);
}

.ivqa-certificates-page .ivqa-bulk-meta {
  font-size: 12px;
  font-weight: 900;
  color: rgba(11, 19, 36, 0.62);
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(2, 6, 23, 0.03);
  border: 1px solid rgba(15, 23, 42, 0.10);
}

.ivqa-certificates-page .ivqa-table-toolbar {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  gap: 12px;
}

.ivqa-certificates-page .ivqa-toolbar-left,
.ivqa-certificates-page .ivqa-toolbar-right {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.ivqa-certificates-page .ivqa-toolbar-left {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 220px 220px;
  gap: 10px;
}

.ivqa-certificates-page .ivqa-toolbar-right {
  justify-content: flex-end;
}

.ivqa-certificates-page .ivqa-search {
  position: relative;
  min-width: 260px;
}

.ivqa-certificates-page .ivqa-search i {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: rgba(11, 19, 36, 0.45);
}

.ivqa-certificates-page .ivqa-search input {
  padding-left: 36px;
}



@media (max-width: 1199px) {
  .ivqa-certificates-page .ivqa-table-toolbar {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .ivqa-certificates-page .ivqa-toolbar-left {
    grid-template-columns: 1fr;
  }
}

.ivqa-certificates-page .ivqa-date-label {
  font-size: 12px;
  font-weight: 900;
  color: rgba(11, 19, 36, 0.55);
}

.ivqa-certificates-page .ivqa-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  min-width: 112px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  background: rgba(15, 23, 42, 0.04);
  color: rgba(11, 19, 36, 0.72);
  font-weight: 900;
  font-size: 12px;
  letter-spacing: 0.2px;
  white-space: nowrap;
}

.ivqa-certificates-page .ivqa-status-badge.is-ready,
.ivqa-certificates-page .ivqa-status-badge.is-pending {
  background: rgba(245, 158, 11, 0.16);
  border-color: rgba(245, 158, 11, 0.28);
  color: #a16207;
}

.ivqa-certificates-page .ivqa-status-badge.is-issued {
  background: rgba(34, 197, 94, 0.12);
  border-color: rgba(34, 197, 94, 0.24);
  color: #15803d;
}

.ivqa-certificates-page .ivqa-status-badge.is-validated {
  background: rgba(59, 130, 246, 0.10);
  border-color: rgba(59, 130, 246, 0.22);
  color: #1d4ed8;
}

.ivqa-certificates-page .ivqa-score {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
}

.ivqa-certificates-page .ivqa-score-main {
  font-size: 16px;
}

.ivqa-certificates-page .ivqa-score-max {
  font-size: 12px;
  color: rgba(11, 19, 36, 0.55);
  font-weight: 800;
}

.ivqa-certificates-page .ivqa-score-tier {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 8px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  border: 1px solid rgba(15, 23, 42, 0.10);
  color: rgba(11, 19, 36, 0.72);
  background: rgba(2, 6, 23, 0.03);
}

.ivqa-certificates-page .ivqa-score-tier.is-excellent {
  background: rgba(34, 197, 94, 0.12);
  border-color: rgba(34, 197, 94, 0.24);
  color: #15803d;
}

.ivqa-certificates-page .ivqa-score-tier.is-good {
  background: rgba(59, 130, 246, 0.10);
  border-color: rgba(59, 130, 246, 0.22);
  color: #1d4ed8;
}

.ivqa-certificates-page .ivqa-score-tier.is-fair {
  background: rgba(245, 158, 11, 0.14);
  border-color: rgba(245, 158, 11, 0.24);
  color: #a16207;
}

.ivqa-certificates-page .ivqa-score-tier.is-low {
  background: rgba(239, 68, 68, 0.10);
  border-color: rgba(239, 68, 68, 0.20);
  color: #b91c1c;
}

.ivqa-certificates-page .ivqa-copy-btn {
  margin-left: 8px;
  border: 0;
  background: transparent;
  color: rgba(11, 19, 36, 0.45);
  padding: 2px 6px;
  border-radius: 10px;
}

.ivqa-certificates-page .ivqa-copy-btn:hover {
  background: rgba(2, 6, 23, 0.04);
  color: rgba(11, 19, 36, 0.70);
}

.ivqa-certificates-page .ivqa-copy-btn.is-copied {
  background: rgba(34, 197, 94, 0.14);
  color: #15803d;
}

.ivqa-certificates-page .ivqa-dt-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
}

/* ===== Documents list: status colors (Admin) ===== */

.ivqa-admin-page .ivqa-status-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.ivqa-admin-page .ivqa-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  background: rgba(15, 23, 42, 0.04);
  color: rgba(11, 19, 36, 0.72);
  font-weight: 900;
  font-size: 12px;
  letter-spacing: 0.2px;
  text-transform: capitalize;
  white-space: nowrap;
}

.ivqa-admin-page .ivqa-status-accepted {
  background: rgba(34, 197, 94, 0.12);
  border-color: rgba(34, 197, 94, 0.22);
  color: #15803d;
}

.ivqa-admin-page .ivqa-status-rejected {
  background: rgba(239, 68, 68, 0.12);
  border-color: rgba(239, 68, 68, 0.22);
  color: #b91c1c;
}

.ivqa-admin-page .ivqa-status-warning {
  background: rgba(245, 158, 11, 0.16);
  border-color: rgba(245, 158, 11, 0.24);
  color: #a16207;
}

.ivqa-admin-page .ivqa-status-pending {
  background: rgba(99, 102, 241, 0.10);
  border-color: rgba(99, 102, 241, 0.20);
  color: #3730a3;
}

.ivqa-admin-page .ivqa-status-select {
  min-width: 110px;
  width: 120px;
  border-radius: 12px;
}

.ivqa-admin-page .ivqa-docs-table-wrap {
  border-radius: 14px;
}

.ivqa-admin-page .ivqa-docs-table th:last-child,
.ivqa-admin-page .ivqa-docs-table td:last-child {
  padding-right: 18px;
}

.ivqa-admin-page .ivqa-docs-table td:last-child .ivqa-home-btn {
  max-width: 100%;
}

.ivqa-admin-page .ivqa-status-select.is-accepted {
  border-color: rgba(34, 197, 94, 0.40);
}

.ivqa-admin-page .ivqa-status-select.is-rejected {
  border-color: rgba(239, 68, 68, 0.40);
}

.ivqa-admin-page .ivqa-status-select.is-warning {
  border-color: rgba(245, 158, 11, 0.45);
}

.ivqa-admin-page .ivqa-status-select.is-pending {
  border-color: rgba(99, 102, 241, 0.35);
}

.ivqa-admin-page .ivqa-doc-row > td:first-child {
  position: relative;
}

.ivqa-admin-page .ivqa-doc-row > td:first-child::before {
  content: '';
  position: absolute;
  left: 0;
  top: 10px;
  bottom: 10px;
  width: 3px;
  border-radius: 999px;
  background: var(--ivqa-doc-accent, transparent);
}

.ivqa-admin-page .ivqa-doc-row {
  background: var(--ivqa-doc-bg, transparent);
}

.ivqa-admin-page .ivqa-doc-row-accepted {
  --ivqa-doc-accent: rgba(34, 197, 94, 0.60);
  --ivqa-doc-bg: rgba(34, 197, 94, 0.06);
}

.ivqa-admin-page .ivqa-doc-row-rejected {
  --ivqa-doc-accent: rgba(239, 68, 68, 0.60);
  --ivqa-doc-bg: rgba(239, 68, 68, 0.06);
}

.ivqa-admin-page .ivqa-doc-row-warning {
  --ivqa-doc-accent: rgba(245, 158, 11, 0.65);
  --ivqa-doc-bg: rgba(245, 158, 11, 0.08);
}

.ivqa-admin-page .ivqa-doc-row-pending {
  --ivqa-doc-accent: rgba(99, 102, 241, 0.55);
  --ivqa-doc-bg: rgba(99, 102, 241, 0.05);
}

.ivqa-admin-page .crm-chip[data-status="accepted"] i,
.ivqa-admin-page .crm-chip[data-status="accepted"] .count {
  color: #15803d;
}

.ivqa-admin-page .crm-chip[data-status="accepted"] .count {
  background: rgba(34, 197, 94, 0.14);
  border-color: rgba(34, 197, 94, 0.26);
}

.ivqa-admin-page .crm-chip[data-status="rejected"] i,
.ivqa-admin-page .crm-chip[data-status="rejected"] .count {
  color: #b91c1c;
}

.ivqa-admin-page .crm-chip[data-status="rejected"] .count {
  background: rgba(239, 68, 68, 0.14);
  border-color: rgba(239, 68, 68, 0.26);
}

.ivqa-admin-page .crm-chip[data-status="warning"] i,
.ivqa-admin-page .crm-chip[data-status="warning"] .count {
  color: #a16207;
}

.ivqa-admin-page .crm-chip[data-status="warning"] .count {
  background: rgba(245, 158, 11, 0.18);
  border-color: rgba(245, 158, 11, 0.28);
}

.ivqa-admin-page .crm-chip[data-status="pending"] i,
.ivqa-admin-page .crm-chip[data-status="pending"] .count {
  color: #3730a3;
}

.ivqa-admin-page .crm-chip[data-status="pending"] .count {
  background: rgba(99, 102, 241, 0.14);
  border-color: rgba(99, 102, 241, 0.26);
}


/* ===== Admin Sidebar (IVQA Admin) ===== */

.crm-app .ivqa-sidebar,
.crm-app .ivqa-sidebar .main-sidebar,
.crm-app .ivqa-sidebar .sidebar,
.crm-app .ivqa-sidebar .multinav,
.crm-app .ivqa-sidebar .multinav-scroll {
  overflow: visible;
}

.crm-app .ivqa-sidebar {
  width: 260px;
}

@media (min-width: 768px) {
  .crm-app .main-sidebar.ivqa-sidebar {
    width: 260px;
  }
  .crm-app:not(.sidebar-collapse) .content-wrapper {
    margin-left: 260px;
  }
}

.crm-app.sidebar-collapse .content-wrapper {
  margin-left: 0 !important;
}

.crm-app .main-sidebar.ivqa-sidebar {
  background: linear-gradient(180deg, #0a1628 0%, #0d1f3a 100%);
}

/* Brand area: logo only */
.crm-app .ivqa-sidebrand {
  padding: 14px 14px 10px;
}

.crm-app .ivqa-sidebrand a {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  text-decoration: none;
}

.crm-app .ivqa-sidebrand-logo {
  width: 108px;
  height: auto;
  display: block;
  filter: drop-shadow(0 10px 24px rgba(2, 6, 23, 0.25));
}

/* Section titles */
.crm-app .sidebar-menu > li.sidebar-section {
  padding: 7px 14px 3px;
  margin: 0;
}

.crm-app .sidebar-menu > li.sidebar-section > span {
  display: block;
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55);
}

/* Links */
.crm-app .sidebar-menu {
  padding: 0 8px 8px;
}

.crm-app .sidebar-menu > li > a.sidebar-link {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 7px;
  height: 36px;
  padding: 0 9px;
  margin: 3px 6px;
  border-radius: 10px;
  color: rgba(255, 255, 255, 0.82);
  font-weight: 800;
  font-size: 12.5px;
  text-align: left;
  background: transparent;
}

/* Force alignment even if AdminLTE tree/menu CSS overrides (crm_v2.css loads after this file) */
.crm-app .ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  text-align: left !important;
  float: none !important;
  position: relative !important;
  height: 36px !important;
  padding: 0 9px !important;
  margin: 3px 6px !important;
  border-radius: 10px !important;
  letter-spacing: 0.1px !important;
  font-size: 12.5px !important;
}

.crm-app .ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link > i {
  flex: 0 0 auto !important;
  width: 18px !important;
  min-width: 18px !important;
  text-align: left !important;
  margin: 0 !important;
  font-size: 13px !important;
}

.crm-app .ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link > span {
  flex: 1 1 auto !important;
  display: block !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.crm-app .sidebar-menu > li > a.sidebar-link i {
  font-size: 16px;
  width: 18px;
  min-width: 18px;
  text-align: left;
  color: rgba(255, 255, 255, 0.70);
}

.crm-app .sidebar-menu > li > a.sidebar-link:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

.crm-app .sidebar-menu > li > a.sidebar-link:hover i,
.crm-app .sidebar-menu > li > a.sidebar-link:hover svg {
  color: #ffffff !important;
}

.crm-app .sidebar-menu > li > a.sidebar-link:hover svg,
.crm-app .sidebar-menu > li > a.sidebar-link:hover svg * {
  stroke: #ffffff !important;
  fill: #ffffff !important;
}

/* Active */
.crm-app .sidebar-menu > li.active > a.sidebar-link,
.crm-app .sidebar-menu > li > a.sidebar-link.active {
  background: #2563eb;
  color: #ffffff;
  box-shadow: 0 10px 26px rgba(37, 99, 235, 0.25);
}

.crm-app .sidebar-menu > li.active > a.sidebar-link i,
.crm-app .sidebar-menu > li > a.sidebar-link.active i {
  color: #ffffff;
}

.crm-app .sidebar-menu > li.active > a.sidebar-link svg,
.crm-app .sidebar-menu > li > a.sidebar-link.active svg,
.crm-app .sidebar-menu > li.active > a.sidebar-link svg *,
.crm-app .sidebar-menu > li > a.sidebar-link.active svg * {
  stroke: #ffffff !important;
  fill: #ffffff !important;
}

.crm-app .sidebar-menu > li.active > a.sidebar-link > span,
.crm-app .sidebar-menu > li > a.sidebar-link.active > span {
  color: #ffffff;
}

/* Bottom area (logout + support) */
.crm-app .sidebar-menu > li.sidebar-bottom {
  padding: 8px 6px 0;
}

.crm-app .ivqa-support-card {
  margin: 10px 6px 0;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.10);
  background: rgba(255, 255, 255, 0.06);
  padding: 12px 12px;
}

.crm-app .ivqa-support-title {
  color: rgba(255, 255, 255, 0.92);
  font-weight: 900;
  font-size: 13px;
  margin-bottom: 4px;
}

.crm-app .ivqa-support-text {
  color: rgba(255, 255, 255, 0.70);
  font-weight: 650;
  font-size: 12px;
  line-height: 1.35;
}

/* ===== ADMIN PROFILE AVATAR BADGE ===== */
.ivqa-avatar-badge {
  width: 56px;
  height: 56px;
  font-size: 22px;
}

/* Phase 36f — absolute final override for sidebar text */
html body.crm-app.ivqa-portal .wrapper .main-sidebar.ivqa-sidebar .sidebar-menu > li > a,
html body.crm-app.ivqa-portal .wrapper .main-sidebar.ivqa-sidebar .sidebar-menu > li > a.sidebar-link,
html body.crm-app.ivqa-portal .wrapper .main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a,
html body.crm-app.ivqa-portal .wrapper .main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link {
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  text-transform: none !important;
  height: 34px !important;
  padding: 0 12px !important;
  margin: 1px 10px !important;
  border-radius: 8px !important;
  gap: 10px !important;
  display: flex !important;
  align-items: center !important;
}
html body.crm-app.ivqa-portal .wrapper .main-sidebar.ivqa-sidebar .sidebar-menu > li > a > span,
html body.crm-app.ivqa-portal .wrapper .main-sidebar.ivqa-sidebar .sidebar-menu > li > a.sidebar-link > span,
html body.crm-app.ivqa-portal .wrapper .main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a > span,
html body.crm-app.ivqa-portal .wrapper .main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link > span {
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  text-transform: none !important;
}
html body.crm-app.ivqa-portal .wrapper .main-sidebar.ivqa-sidebar .sidebar-menu > li > a > i,
html body.crm-app.ivqa-portal .wrapper .main-sidebar.ivqa-sidebar .sidebar-menu > li > a.sidebar-link > i,
html body.crm-app.ivqa-portal .wrapper .main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a > i,
html body.crm-app.ivqa-portal .wrapper .main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link > i {
  font-size: 13px !important;
  width: 16px !important;
  min-width: 16px !important;
  opacity: .85 !important;
}

/* Phase 36g — fix header logo-box width + hide floating control-sidebar */
html body.crm-app .wrapper > .main-header div.logo-box,
html body.ivqa-portal .wrapper > .main-header div.logo-box,
html body .wrapper > .main-header .ivqa-portal-logo-box,
html body .wrapper > .main-header > .logo-box {
  width: 216px !important;
  min-width: 216px !important;
  max-width: 216px !important;
  float: left !important;
  background: #ffffff !important;
}
html body.sidebar-collapse .wrapper > .main-header div.logo-box,
html body.sidebar-mini.sidebar-collapse .wrapper > .main-header div.logo-box,
html body.sidebar-collapse .wrapper > .main-header > .logo-box {
  width: 64px !important;
  min-width: 64px !important;
  max-width: 64px !important;
}

/* Navbar fills rest beside logo-box (no hard margin) */
html body.crm-app .wrapper > .main-header > nav.navbar,
html body.ivqa-portal .wrapper > .main-header > nav.navbar,
html body .wrapper > .main-header > .navbar.navbar-static-top {
  margin-left: 216px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 18px !important;
}
html body.sidebar-collapse .wrapper > .main-header > nav.navbar,
html body.sidebar-mini.sidebar-collapse .wrapper > .main-header > nav.navbar {
  margin-left: 64px !important;
}

/* Hide default AdminLTE control-sidebar & its bg (right-side stripe) */
html body .wrapper > aside.control-sidebar,
html body .wrapper > .control-sidebar-bg {
  display: none !important;
}

/* Hide Chat + Taskboard icons in topbar (unused) */
html body .wrapper > .main-header .app-menu .header-megamenu > li.d-none.d-xl-inline-block,
html body .wrapper > .main-header .app-menu .header-megamenu > li:has(a[title="Chat"]),
html body .wrapper > .main-header .app-menu .header-megamenu > li:has(a[title="Taskboard"]) {
  display: none !important;
}

/* ==========================================================================
   Sidebar — overflow fix & clean spacing (phase 36h)
   Ensures active pill stays inside the 216 px sidebar.
   ========================================================================== */

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar {
  box-sizing: border-box !important;
  overflow-x: hidden !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar {
  box-sizing: border-box !important;
  width: 100% !important;
  padding: 6px 0 14px !important;
  overflow-x: hidden !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu[data-widget="tree"] {
  box-sizing: border-box !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu[data-widget="tree"] > li {
  box-sizing: border-box !important;
  width: 100% !important;
  padding: 0 10px !important;   /* symmetric gutters hold the pill inside */
  margin: 0 !important;
  list-style: none !important;
}

/* Menu link / active pill — width is driven by the <li> gutters, not margins */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li > a,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li > a.sidebar-link,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu[data-widget="tree"] > li > a,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: 34px !important;
  padding: 0 12px !important;
  margin: 2px 0 !important;      /* no horizontal margin — stays inside <li> */
  border-radius: 8px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: rgba(255, 255, 255, 0.78) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  transition: background-color .18s ease, color .18s ease !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li > a > i,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li > a.sidebar-link > i {
  flex: 0 0 16px !important;
  width: 16px !important;
  min-width: 16px !important;
  font-size: 13px !important;
  text-align: center !important;
  opacity: .85 !important;
  margin: 0 !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li > a > span,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li > a.sidebar-link > span {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Hover */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li > a:hover,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li > a.sidebar-link:hover {
  background: rgba(255, 255, 255, 0.06) !important;
  color: #ffffff !important;
}

/* Active */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li.active > a,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li > a.sidebar-link.active,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu[data-widget="tree"] > li.active > a,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link.active {
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25) !important;
}
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li.active > a > i,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li.active > a > span,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li > a.sidebar-link.active > i,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li > a.sidebar-link.active > span {
  color: #ffffff !important;
  opacity: 1 !important;
}

/* Section headers */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li.sidebar-section,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li.header {
  box-sizing: border-box !important;
  width: 100% !important;
  padding: 16px 22px 6px !important;
  margin: 0 !important;
}
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li.sidebar-section > span,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .sidebar-menu > li.header {
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  opacity: 0.5 !important;
  line-height: 1 !important;
}

/* ==========================================================================
   Sidebar final (phase 36j) — beats crm_v2.css specificity (adds [data-widget])
   ========================================================================== */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li {
  box-sizing: border-box !important;
  width: 100% !important;
  padding: 0 10px !important;
  margin: 0 !important;
  list-style: none !important;
  display: block !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: 34px !important;
  padding: 0 12px !important;
  margin: 2px 0 !important;
  border-radius: 8px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: rgba(255,255,255,.78) !important;
  background: transparent !important;
  overflow: hidden !important;
  transition: background-color .16s ease, color .16s ease !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a > i,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link > i {
  flex: 0 0 16px !important;
  width: 16px !important;
  min-width: 16px !important;
  font-size: 13px !important;
  margin: 0 !important;
  text-align: center !important;
  color: rgba(255,255,255,.72) !important;
  opacity: 1 !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a > span,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link > span {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Hover */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a:hover,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link:hover {
  background: rgba(255,255,255,.06) !important;
  color: #ffffff !important;
}
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a:hover > i,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link:hover > i {
  color: #ffffff !important;
}

/* Active pill — inline, inside gutter, no stretch */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li.active > a,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li.active > a.sidebar-link,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link.active {
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 8px rgba(37,99,235,.25) !important;
}
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li.active > a > i,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li.active > a > span,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link.active > i,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link.active > span {
  color: #ffffff !important;
  opacity: 1 !important;
}

/* Section header gutter */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li.sidebar-section {
  padding: 16px 20px 6px !important;
  margin: 0 !important;
}
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li.sidebar-section > span {
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  opacity: 0.5 !important;
  line-height: 1 !important;
}

/* ==========================================================================
   Sidebar containment (phase 36k) — constrain scroll wrapper to sidebar width
   ========================================================================== */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar {
  width: 216px !important;
  max-width: 216px !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar section.sidebar,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu {
  width: 216px !important;
  max-width: 216px !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Perfect-scrollbar inner container often gets inline width — force it */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps > * {
  max-width: 216px !important;
  box-sizing: border-box !important;
}

/* Hard cap <li> and <a> to fit the 216 - 2*10 gutter = 196 px */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li {
  width: 216px !important;
  max-width: 216px !important;
  box-sizing: border-box !important;
  padding: 0 10px !important;
  margin: 0 !important;
  overflow: hidden !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link {
  width: 196px !important;
  max-width: 196px !important;
  min-width: 0 !important;
  margin: 2px 0 !important;
  box-sizing: border-box !important;
}

/* ==========================================================================
   Header height normalization (phase 36l) — cap to 64px so hero isn't clipped
   ========================================================================== */
html body.crm-app .wrapper > .main-header,
html body.ivqa-portal .wrapper > .main-header {
  height: 64px !important;
  min-height: 64px !important;
  max-height: 64px !important;
  overflow: hidden !important;
}

html body.crm-app .wrapper > .main-header div.logo-box,
html body.ivqa-portal .wrapper > .main-header div.logo-box,
html body .wrapper > .main-header > .logo-box {
  height: 64px !important;
  min-height: 64px !important;
  max-height: 64px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 12px !important;
}

html body .wrapper > .main-header .logo-box .logo,
html body .wrapper > .main-header .logo-box a.logo,
html body .wrapper > .main-header .logo-box .logo-lg,
html body .wrapper > .main-header .ivqa-admin-logo,
html body .wrapper > .main-header .logo-box img,
html body .wrapper > .main-header .logo-box svg {
  max-height: 44px !important;
  height: auto !important;
  width: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.crm-app .wrapper > .main-header > nav.navbar,
html body.ivqa-portal .wrapper > .main-header > nav.navbar,
html body .wrapper > .main-header > .navbar.navbar-static-top {
  height: 64px !important;
  min-height: 64px !important;
  max-height: 64px !important;
}

/* ==========================================================================
   Header positioning correction (phase 36m)
   Shell CSS was pushing .main-header right by 216px — conflicts with
   AdminLTE fixed header (left:0). Force header to span full width, keep
   navbar offset by sidebar width so toolbar items stay right of logo-box.
   ========================================================================== */
html body.fixed .wrapper > .main-header,
html body.fixed.crm-app .wrapper > .main-header,
html body.fixed.ivqa-portal .wrapper > .main-header {
  margin-left: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  position: fixed !important;
  top: 0 !important;
  z-index: 1030 !important;
  background: #ffffff !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.06) !important;
  overflow: visible !important;
}

/* Logo box — anchored at left:0 over sidebar area */
html body.fixed .wrapper > .main-header > .logo-box,
html body.fixed .wrapper > .main-header div.logo-box {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 216px !important;
  height: 64px !important;
  margin: 0 !important;
  z-index: 2 !important;
}

html body.fixed.sidebar-collapse .wrapper > .main-header > .logo-box,
html body.fixed.sidebar-mini.sidebar-collapse .wrapper > .main-header div.logo-box {
  width: 64px !important;
}

/* Navbar — starts after logo-box */
html body.fixed .wrapper > .main-header > nav.navbar,
html body.fixed .wrapper > .main-header > .navbar.navbar-static-top {
  margin-left: 216px !important;
  width: calc(100% - 216px) !important;
  height: 64px !important;
  min-height: 64px !important;
  background: #ffffff !important;
}
html body.fixed.sidebar-collapse .wrapper > .main-header > nav.navbar,
html body.fixed.sidebar-mini.sidebar-collapse .wrapper > .main-header > nav.navbar {
  margin-left: 64px !important;
  width: calc(100% - 64px) !important;
}

/* Content clears the 64px fixed header with comfortable breathing room */
html body.fixed .wrapper > .content-wrapper {
  padding-top: 24px !important;
  margin-top: 64px !important;
}

/* Hero top alignment — no negative pull into header */
.inst-dashboard .dashboard-hero {
  margin-top: 0 !important;
}

/* ==========================================================================
   Perfect-scrollbar polish (phase 36n) — smooth, subtle, premium
   ========================================================================== */

/* Rail — invisible track, appears on hover */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .ps__rail-y,
html body .ps__rail-y {
  width: 6px !important;
  right: 2px !important;
  background: transparent !important;
  border-radius: 999px !important;
  opacity: 0 !important;
  transition: opacity .2s ease, background-color .2s ease !important;
  z-index: 2 !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar:hover .ps__rail-y,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .ps:hover > .ps__rail-y,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .ps--active-y > .ps__rail-y,
html body .ps:hover > .ps__rail-y,
html body .ps--scrolling-y > .ps__rail-y {
  opacity: 1 !important;
  background: rgba(255, 255, 255, 0.04) !important;
}

/* Thumb — slim pill, soft gradient, smooth */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .ps__thumb-y,
html body .ps__rail-y > .ps__thumb-y {
  width: 4px !important;
  right: 1px !important;
  background: rgba(255, 255, 255, 0.22) !important;
  border-radius: 999px !important;
  transition: width .15s ease, background-color .2s ease, right .15s ease !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .ps__rail-y:hover > .ps__thumb-y,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .ps__rail-y.ps--clicking > .ps__thumb-y,
html body .ps__rail-y:hover > .ps__thumb-y,
html body .ps__rail-y.ps--clicking > .ps__thumb-y {
  width: 6px !important;
  right: 0 !important;
  background: rgba(255, 255, 255, 0.45) !important;
}

/* Hide horizontal rail entirely in sidebar (no horizontal scroll needed) */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .ps__rail-x {
  display: none !important;
}

/* Native scrollbar fallback (Firefox/Chrome) for .multinav-scroll */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .multinav-scroll {
  scrollbar-width: thin !important;
  scrollbar-color: rgba(255,255,255,.22) transparent !important;
  scroll-behavior: smooth !important;
}
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .multinav-scroll::-webkit-scrollbar {
  width: 6px !important;
  height: 0 !important;
}
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .multinav-scroll::-webkit-scrollbar-track {
  background: transparent !important;
}
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .multinav-scroll::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.22) !important;
  border-radius: 999px !important;
  transition: background-color .2s ease !important;
}
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar .multinav-scroll::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.45) !important;
}

/* ==========================================================================
   Sidebar scroll fix (phase 36o)
   36k set overflow:hidden on .multinav-scroll which blocked wheel scrolling.
   Restore vertical scroll on the scroll container; keep X hidden.
   ========================================================================== */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar {
  overflow: hidden !important;          /* aside itself stays clipped */
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar > section.sidebar,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav {
  overflow: hidden !important;          /* parents: no scroll */
  height: 100% !important;
  max-height: 100% !important;
}

/* Actual scroll container — allow wheel scroll */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  height: 100% !important;
  max-height: calc(100vh - 64px) !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior: contain !important;
  touch-action: pan-y !important;
}

/* Perfect-scrollbar sets position:relative on .ps and absolute on rails.
   If PS is initialized, `ps` class is present — keep native scroll as fallback
   so mouse wheel always works even when PS fails to bind. */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps.ps--active-y {
  overflow-y: auto !important;
}

/* ==========================================================================
   Sidebar horizontal clip fix (phase 36p)
   Text appears cut off on the left because inner content is wider than
   the 216px aside, causing horizontal scroll. Force every descendant to
   stay within 216px and reset any inline widths perfect-scrollbar sets.
   ========================================================================== */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar * {
  max-width: 100% !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps {
  width: 216px !important;
  max-width: 216px !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

/* Perfect-scrollbar wraps content in a child that can exceed container width.
   Force that child (and any direct div child) to the sidebar width. */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps > div,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps > .ps__content,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll > div,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll > ul {
  width: 216px !important;
  max-width: 216px !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* Ensure the <ul> and every <li> content fits */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu > li,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu > li > a {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu > li > a > span,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu > li.sidebar-section > span {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* ==========================================================================
   Sidebar click/scroll restoration (phase 36q)
   - Fixed header (z:1030) was overlapping sidebar top → clicks on top items
     were being swallowed by the header.
   - Wildcard `*` rule from 36p interfered with perfect-scrollbar rails.
   ========================================================================== */

/* Revert the overly-broad wildcard from 36p */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps__rail-y,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps__rail-x,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps__thumb-y,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps__thumb-x {
  max-width: none !important;
}

/* Push sidebar below fixed header so it owns the left column cleanly */
html body.fixed.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar,
html body.fixed .wrapper > aside.main-sidebar.ivqa-sidebar {
  position: fixed !important;
  top: 64px !important;
  left: 0 !important;
  bottom: 0 !important;
  height: calc(100vh - 64px) !important;
  max-height: calc(100vh - 64px) !important;
  z-index: 1020 !important;
  pointer-events: auto !important;
}

/* Ensure nothing above sidebar swallows pointer events */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar section.sidebar,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu > li,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu > li > a {
  pointer-events: auto !important;
}

/* Scroll container — explicit height matching aside, wheel-scroll enabled */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar section.sidebar,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav {
  height: 100% !important;
  max-height: 100% !important;
  overflow: hidden !important;
  position: relative !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps {
  height: 100% !important;
  max-height: 100% !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  position: relative !important;
  -webkit-overflow-scrolling: touch !important;
  touch-action: pan-y !important;
  overscroll-behavior: contain !important;
}

/* Kill iframe / overlay bleeds from hero radial gradient behind sidebar */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar::before,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar::after {
  display: none !important;
  content: none !important;
}

/* Anchor links – ensure cursor + click actually reach the <a> */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu > li > a,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu > li > a.sidebar-link {
  cursor: pointer !important;
  user-select: none !important;
  text-decoration: none !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Logo-box (header) — keep click-safe but does not extend over sidebar */
html body.fixed .wrapper > .main-header {
  top: 0 !important;
  height: 64px !important;
}

/* ==========================================================================
   Sidebar polish final (phase 36r)
   - Remove decorative circle/glow artifacts inside sidebar
   - Clean, visible hover state
   - Wheel scroll stays INSIDE sidebar (no page scroll bleed)
   ========================================================================== */

/* 1. Kill all decorative pseudo-elements inside sidebar */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar::before,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar::after,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar section.sidebar::before,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar section.sidebar::after,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav::before,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav::after,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll::before,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll::after,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps::before,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps::after {
  display: none !important;
  content: none !important;
  background: none !important;
}

/* Flat solid sidebar — kill any gradient/radial backgrounds */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar section.sidebar,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps {
  background: #0f172a !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  border-radius: 0 !important;
}

/* 2. Hover — visible, smooth */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a:hover,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a.sidebar-link:hover,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li:hover > a {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
  transition: background-color .16s ease, color .16s ease !important;
}
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a:hover > i,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li > a:hover > span,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li:hover > a > i,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li:hover > a > span {
  color: #ffffff !important;
  opacity: 1 !important;
}

/* Active pill — trimmed glow (removes big halo) */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li.active > a,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] > li.active > a.sidebar-link {
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12) !important;
}

/* 3. Scroll containment — wheel stays inside sidebar */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar {
  overflow: hidden !important;
  overscroll-behavior: contain !important;
}
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  overscroll-behavior-y: contain !important;
  -webkit-overflow-scrolling: touch !important;
  touch-action: pan-y !important;
  height: 100% !important;
  max-height: calc(100vh - 64px) !important;
}

/* ==========================================================================
   Sidebar scroll — use native scrollbar only (phase 36s)
   Perfect-scrollbar measurements are stale after our height overrides, so
   its rail drifts (top: 325px) and only scrolls one direction. Disable PS
   visuals entirely; native scroll already works and we style it cleanly.
   ========================================================================== */

/* Hide PS rails/thumbs — they're fighting us */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps__rail-x,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps__rail-y,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps__thumb-x,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps__thumb-y {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Neutralize the `.ps` container (avoid PS's position-juggling) */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps {
  position: static !important;
}

/* Native scroll on the real scroll container */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  height: 100% !important;
  max-height: calc(100vh - 64px) !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(255, 255, 255, 0.22) transparent !important;
  scroll-behavior: smooth !important;
  overscroll-behavior: contain !important;
  touch-action: pan-y !important;
  -webkit-overflow-scrolling: touch !important;
}

/* Webkit scrollbar styling — thin pill, hover-brighten */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll::-webkit-scrollbar,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps::-webkit-scrollbar {
  width: 6px !important;
  height: 0 !important;
  background: transparent !important;
}
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll::-webkit-scrollbar-track,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps::-webkit-scrollbar-track {
  background: transparent !important;
}
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll::-webkit-scrollbar-thumb,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.22) !important;
  border-radius: 999px !important;
  transition: background-color .2s ease !important;
}
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll::-webkit-scrollbar-thumb:hover,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.45) !important;
}

/* ==========================================================================
   Sidebar top spacing tighten (phase 36t)
   Remove excess gap between logo (header) and the first menu item.
   ========================================================================== */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar section.sidebar,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu[data-widget="tree"] {
  padding-top: 8px !important;
  margin-top: 0 !important;
}

/* First item has no extra top margin */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu > li:first-child,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu > li:first-child > a {
  margin-top: 0 !important;
}

/* ==========================================================================
   Sidebar flush top (phase 36u)
   Force sidebar scroll container to flush against top. Remove all cumulative
   padding/margin/space that's pushing Dashboard ~150px down.
   ========================================================================== */

/* Sidebar wraps — zero top spacing */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar section.sidebar,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar section.sidebar.position-relative,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .multinav-scroll.ivqa-h-100,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .ps {
  padding-top: 0 !important;
  margin-top: 0 !important;
  top: 0 !important;
}

/* Menu — minimal top padding */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu[data-widget="tree"],
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-menu[data-widget="tree"] {
  padding-top: 8px !important;
  padding-bottom: 12px !important;
  margin: 0 !important;
  list-style: none !important;
}

/* Kill any hidden first-child with margin/height */
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .user-panel,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-form,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar .sidebar-brand {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu > li:first-child,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu > li:first-child > a,
html body.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar ul.sidebar-menu > li:first-child > a.sidebar-link {
  margin-top: 0 !important;
}

/* Keep sidebar aligned with header — top:64px, no extra offset */
html body.fixed.crm-app.ivqa-portal .wrapper > aside.main-sidebar.ivqa-sidebar {
  top: 64px !important;
  padding-top: 0 !important;
}