.popover-x.is-bs5 .close {
  padding: .20rem 0px 0px 1rem;
}

.falcon-table .select2-selection--single {
  /* height: calc(2.25rem + 2px); */
  /* line-height: 1.5; */
  height: calc(1.8rem + 2px);
  line-height: 1.25;
}

.falcon-table .select2-container--krajee-bs4 .select2-selection {
  background-color: transparent;
  /* border: 1px solid #ced4da; */
  border: 1px solid #606163;
}

.falcon-table .select2-selection--single .select2-selection__arrow {
  border-left: none;
}

.avatar .avatar-name {
  word-wrap: normal;
}

/*.avatar .avatar-name>span {
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translate3d(50%, -50%, 0);
  transform: translate3d(50%, -50%, 0);
}*/

.kv-editable-button{
  width: auto !important;
  white-space: nowrap;
}

.kv-editable-value:empty{
  display:none;
}
.kv-table-header {
  background: transparent !important;
}

.kv-editable-link{
  border: 1px dashed !important;
}

/* ============================================ */
/* Falcon Asset URL Fixes - Inline Styles Only */
/* ============================================ */

/* Cardholder template background */
.cardholder-bg-corner {
  background-image: url(../img/icons/spot-illustrations/corner-4.png) !important;
  opacity: 0.7;
}

/* Site snippets backgrounds */
.banner-bg-1 {
  background-image: url(../img/generic/bg-1.jpg) !important;
  background-position: center bottom;
}

.banner-bg-2 {
  background-image: url(../img/generic/bg-2.jpg) !important;
  background-position: center top;
}

/* Logo images */
.logo-bw-1 { background-image: url(../img/logos/b&w/1.png); }
.logo-bw-2 { background-image: url(../img/logos/b&w/2.png); }
.logo-bw-4 { background-image: url(../img/logos/b&w/4.png); }
.logo-bw-6 { background-image: url(../img/logos/b&w/6.png); }
.logo-bw-10 { background-image: url(../img/logos/b&w/10.png); }
.logo-bw-11 { background-image: url(../img/logos/b&w/11.png); }
.logo-bw-12 { background-image: url(../img/logos/b&w/12.png); }

/* ============================================ */
/* Responsive Navigation - Off-canvas drawer below Bootstrap xl (< 1200px) */
/* ============================================ */

@media (max-width: 1199.98px) {
  /* Shell container: full width. Falcon’s .container uses --falcon-gutter-x (default 2rem → 1rem
     padding per side). Below xl there is no fixed sidebar rail—use a smaller gutter only. */
  .container[data-layout],
  .container-fluid[data-layout] {
    max-width: 100% !important;
    width: 100% !important;
    --falcon-gutter-x: 1rem;
    padding-left: calc(var(--falcon-gutter-x) * 0.5) !important;
    padding-right: calc(var(--falcon-gutter-x) * 0.5) !important;
  }

  /* Full-width main content; no left rail inset */
  .content {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    padding: 0 !important;
  }

  /* Off-canvas drawer: hidden off-screen until body.navbar-mobile-open.
     Start below the top bar so the shell logo + hamburger are not covered/clipped. */
  .navbar-vertical {
    position: fixed !important;
    left: 0 !important;
    top: var(--falcon-top-nav-height, 3rem) !important;
    height: calc(100vh - var(--falcon-top-nav-height, 3rem)) !important;
    height: calc(100dvh - var(--falcon-top-nav-height, 3rem)) !important;
    width: min(18.75rem, 88vw) !important;
    max-width: min(18.75rem, 88vw) !important;
    z-index: 1060 !important;
    transform: translateX(-100%);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    box-shadow: none !important;
    display: flex !important;
    flex-direction: column !important;
    padding-bottom: env(safe-area-inset-bottom, 0) !important;
  }

  body.navbar-mobile-open .navbar-vertical {
    transform: translateX(0);
    box-shadow: 0.5rem 0 1.25rem rgba(0, 0, 0, 0.18) !important;
  }

  /* Full menu + labels inside drawer (panel is off-screen when closed) */
  .navbar-vertical .navbar-vertical-label-wrapper,
  .navbar-vertical .nav-link-text {
    display: flex !important;
    opacity: 1 !important;
  }

  /* Falcon hides sidebar brand below xl (logo only in top bar); show it inside the drawer. */
  .navbar-vertical .navbar-brand,
  .navbar-vertical .toggle-icon-wrapper {
    display: flex !important;
    visibility: visible !important;
  }

  .navbar-vertical .navbar-brand {
    flex: 0 0 auto;
    align-items: center;
    min-width: 0;
    padding: 0 0.75rem !important;
  }

  .navbar-vertical .navbar-brand img {
    max-width: min(10.5rem, calc(100vw - 3rem)) !important;
    width: auto !important;
    height: auto !important;
  }

  .navbar-vertical > .d-flex:first-of-type {
    flex-shrink: 0;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 0.5rem 0.75rem 0.75rem !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  }

  [data-bs-theme='dark'] .navbar-vertical > .d-flex:first-of-type {
    border-bottom-color: rgba(255, 255, 255, 0.12);
  }

  .navbar-vertical .navbar-vertical-content {
    padding-top: 0.5rem !important;
    flex: 1 1 auto;
    min-height: 0;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  /* Theme uses inline-block + fixed widths at xl; below xl force full drawer width */
  .navbar-vertical .navbar-collapse {
    overflow-x: hidden !important;
    overflow-y: visible !important;
    max-height: none !important;
    width: 100% !important;
    max-width: 100% !important;
    align-self: stretch !important;
    box-sizing: border-box;
  }

  .navbar-vertical .nav-link {
    justify-content: flex-start !important;
    padding: 0.5rem 0.75rem !important;
  }

  /* Bootstrap collapse: show menu content in drawer (layout-overrides also toggles on open) */
  body.navbar-mobile-open .navbar-vertical .navbar-collapse {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto;
    min-height: 0;
  }

  /* Top bar: avoid squashing the logo against the hamburger when drawer mode */
  .navbar-vertical + .content .navbar-top .navbar-brand {
    min-width: 0;
    padding-left: 0.35rem;
    margin-right: 0.25rem;
  }

  .navbar-vertical + .content .navbar-top .navbar-brand img {
    max-width: min(9.5rem, 42vw);
    width: auto !important;
    height: auto !important;
    object-fit: contain;
  }
}

/* Full-viewport backdrop when drawer open */
body.navbar-mobile-open::before {
  content: '';
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.45);
  z-index: 1055;
  display: none;
}

@media (max-width: 1199.98px) {
  body.navbar-mobile-open::before {
    display: block;
  }
}

@media (max-width: 767.98px) {
  .navbar-vertical .toggle-icon-wrapper button {
    width: 2rem !important;
    height: 2rem !important;
  }

  .navbar-vertical .nav-link {
    padding: 0.375rem 0.75rem !important;
    font-size: 0.875rem !important;
  }
}

/* Desktop (xl+): tradelines puts .navbar-top inside .content; the vertical rail is full-height
   (theme xl uses top:0). Falcon still caps .navbar-vertical-content to (100vh - --falcon-top-nav-height)
   and .scrollbar uses overflow:auto — that steals ~3rem of height and forces a false inner
   scrollbar. Let the menu use the full rail; keep horizontal clipping only. */
@media (min-width: 1200px) {
  .navbar-vertical.navbar-expand-xl .navbar-collapse {
    overflow: visible !important;
  }

  .navbar-vertical.navbar-expand-xl.navbar-card .navbar-collapse,
  .navbar-vertical.navbar-expand-xl.navbar-vibrant .navbar-collapse,
  .navbar-vertical.navbar-expand-xl.navbar-inverted .navbar-collapse {
    max-height: none !important;
  }

  .navbar-vertical.navbar-expand-xl .navbar-collapse .navbar-vertical-content,
  .navbar-vertical.navbar-expand-xl.navbar-card .navbar-vertical-content,
  .navbar-vertical.navbar-expand-xl.navbar-vibrant .navbar-vertical-content,
  .navbar-vertical.navbar-expand-xl.navbar-inverted .navbar-vertical-content {
    max-height: none !important;
    height: auto !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
  }

  .navbar-vertical.navbar-expand-xl .navbar-vertical-content.scrollbar {
    overflow: visible !important;
  }

  .navbar-vertical.navbar-expand-xl .navbar-collapse .navbar-vertical-content > * {
    overflow-x: hidden !important;
    overflow-y: visible !important;
  }

  .navbar-vertical.navbar-expand-xl + .content {
    margin-left: calc(12.625rem + var(--falcon-app-sidebar-gap, 0.75rem)) !important;
  }

  .navbar-vertical.navbar-expand-xl.navbar-card + .content,
  .navbar-vertical.navbar-expand-xl.navbar-vibrant + .content,
  .navbar-vertical.navbar-expand-xl.navbar-inverted + .content {
    margin-left: calc(14.625rem + var(--falcon-app-sidebar-gap, 0.75rem)) !important;
  }
}

/* ============================================ */
/* Top bar height and alignment                */
/* ============================================ */
/* Reduce top navbar height by ~21px so main content starts in line with top of Dashboard menu item */
:root {
  --falcon-top-nav-height: 3rem;  /* was 4.3125rem (69px); 3rem (48px) shifts content up ~21px */
  --falcon-app-sidebar-gap: 0.75rem; /* space between vertical rail and main .content surface */
}

/* Shorter topbar padding and top-align logo, bell, avatar so bell/avatar line up with logo top */
/* Zero side margins: vendor theme uses -1rem to bleed into .content padding; when padding is 0 (e.g. below xl), that causes document-level horizontal scroll. */
.navbar-top {
  --falcon-navbar-padding-y: 0.25rem;
  align-items: flex-start;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  margin-left: 0;
  margin-right: 0;
}

.navbar-top .navbar-brand,
.navbar-top .navbar-nav {
  align-items: flex-start;
}

/* Keep notification bell and user avatar aligned to top of row (in line with logo) */
.navbar-top .navbar-nav .nav-item .nav-link {
  display: flex;
  align-items: center;
  padding-top: 0;
  padding-bottom: 0;
}

/* Notification bell trigger: 5px shorter */
.navbar-top #navbarDropdownNotification {
  min-height: 0;
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
}
.navbar-top #navbarDropdownNotification .bi {
  font-size: 28px !important;  /* was 33px; 5px shorter */
}

/* ============================================ */
/* Notification Dropdown Scrollbar Styling     */
/* ============================================ */

/* Custom scrollbar for notification dropdown */
.dropdown-menu-notification .scrollbar-overlay {
  scrollbar-width: thin;
  scrollbar-color: rgba(116, 129, 148, 0.3) transparent;
}

/* Webkit browsers (Chrome, Safari, Edge) */
.dropdown-menu-notification .scrollbar-overlay::-webkit-scrollbar {
  width: 8px;
}

.dropdown-menu-notification .scrollbar-overlay::-webkit-scrollbar-track {
  background: transparent;
}

.dropdown-menu-notification .scrollbar-overlay::-webkit-scrollbar-thumb {
  background-color: rgba(116, 129, 148, 0.3);
  border-radius: 4px;
}

.dropdown-menu-notification .scrollbar-overlay::-webkit-scrollbar-thumb:hover {
  background-color: rgba(116, 129, 148, 0.5);
}

/* Dark mode scrollbar colors */
[data-bs-theme="dark"] .dropdown-menu-notification .scrollbar-overlay {
  scrollbar-color: rgba(182, 193, 210, 0.4) transparent;
}

[data-bs-theme="dark"] .dropdown-menu-notification .scrollbar-overlay::-webkit-scrollbar-thumb {
  background-color: rgba(182, 193, 210, 0.4);
}

[data-bs-theme="dark"] .dropdown-menu-notification .scrollbar-overlay::-webkit-scrollbar-thumb:hover {
  background-color: rgba(182, 193, 210, 0.6);
}

/* ============================================ */
/* Notification Dropdown Styling Fixes          */
/* ============================================ */

/* Fix notification dropdown styling issues */
.dropdown-menu-notification .card.navbar-card-notification {
  background-color: transparent !important; /* Match dropdown background */
}

.dropdown-menu-notification .list-group-item {
  padding: 1rem 1.25rem !important; /* Better padding for notification items */
}

.dropdown-menu-notification .notification-body {
  padding: 0.5rem 0 !important; /* Additional padding for notification content */
}

/* Ensure dropdown caret background matches the dropdown menu */
.dropdown-caret-bg::after {
  background: var(--falcon-dropdown-bg) !important;
}