/* Main sidebar scroll */
.sidebar .sidebar-inner {
  max-height: calc(100vh - 65px);
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: #c5c5c5 transparent;
}

.sidebar .sidebar-inner::-webkit-scrollbar {
  width: 6px;
}

.sidebar .sidebar-inner::-webkit-scrollbar-thumb {
  background: #c5c5c5;
  border-radius: 4px;
}

/* Settings sidebar scroll */
.settings-wrapper .settings-sidebar .sidebar-inner {
  max-height: calc(100vh - 120px);
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
}

.settings-wrapper .settings-sidebar .sidebar-inner::-webkit-scrollbar {
  width: 6px;
}

.settings-wrapper .settings-sidebar .sidebar-inner::-webkit-scrollbar-thumb {
  background: #c5c5c5;
  border-radius: 4px;
}

/* Header: push user info to the right */
.header .main-header {
  display: flex;
  align-items: center;
  width: 100%;
}

.header .main-header .header-left {
  float: none;
  flex-shrink: 0;
}

.header .main-header .mobile_btn {
  float: none;
  flex-shrink: 0;
}

.header .main-header .user-menu {
  display: flex;
  margin-left: auto;
  justify-content: flex-end;
  flex: 1;
}

/* Sidebar overlay when mobile menu is open */
.sidebar-overlay.opened {
  display: block !important;
}

@media (max-width: 991.98px) {
  .main-wrapper.slide-nav .sidebar {
    margin-left: 0 !important;
  }
}

/* ==========================================================================
   Universal Modal Close Button Fix (.btn-close & .modal .close)
   ========================================================================== */
.modal .btn-close,
.modal-header .btn-close,
.modal .close {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: none !important;
  background-color: rgba(0, 0, 0, 0.08) !important;
  background-image: none !important;
  color: #374151 !important;
  opacity: 0.9 !important;
  filter: none !important;
  cursor: pointer !important;
  transition: all 0.15s ease-in-out !important;
  box-shadow: none !important;
  margin: 0 !important;
  line-height: 1 !important;
}

.modal .btn-close::before,
.modal-header .btn-close::before,
.modal .close::before {
  content: '×' !important;
  display: block !important;
  font-family: Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  color: inherit !important;
  text-align: center !important;
  pointer-events: none !important;
}

.modal .btn-close:hover,
.modal-header .btn-close:hover,
.modal .close:hover {
  opacity: 1 !important;
  background-color: #ef4444 !important;
  color: #ffffff !important;
  transform: scale(1.06) !important;
}

/* Colored / Dark modal headers (e.g. blue POS headers, .btn-close-white, .text-white) */
.modal .btn-close.btn-close-white,
.modal-header.text-white .btn-close,
.modal-header[style*="background"] .btn-close,
.modal-header[style*="background:#"] .btn-close,
.modal-header.bg-primary .btn-close,
.modal-header.bg-dark .btn-close {
  background-color: rgba(255, 255, 255, 0.22) !important;
  color: #ffffff !important;
  filter: none !important;
}

.modal .btn-close.btn-close-white:hover,
.modal-header.text-white .btn-close:hover,
.modal-header[style*="background"] .btn-close:hover,
.modal-header[style*="background:#"] .btn-close:hover,
.modal-header.bg-primary .btn-close:hover,
.modal-header.bg-dark .btn-close:hover {
  background-color: rgba(255, 255, 255, 0.38) !important;
  color: #ffffff !important;
}


/* NOTE: a full header/sidebar re-skin (white sidebar + purple #7c3aed accent)
   used to live below this point. It was dead weight: countivoo-theme.css
   loads after this file and restates every one of those selectors with the
   same !important weight, so the app has only ever rendered
   countivoo-theme.css's dark charcoal + teal design. Removed rather than
   left in place to confuse the next edit — see countivoo-theme.css for the
   live header/sidebar rules. */