/* Gallant ERP — modern admin sidebar (design spec) */
:root {
  --admin-font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --admin-sidebar-bg: #1f1f2e;
  --admin-sidebar-hover: #2a2a3d;
  --admin-sidebar-active: #ff6600;
  --admin-sidebar-text: #d1d5db;
  --admin-sidebar-icon: #9ca3af;
  --admin-sidebar-muted: #6b7280;
  --admin-sidebar-border: #1f2937;
  --admin-sidebar-width: 260px;
  --admin-sidebar-mini: 80px;
  --admin-sidebar-transition: 0.3s ease;
}

body.admin-panel {
  font-family: var(--admin-font-family);
}

/* Full-height sidebar */
body.admin-panel .sidebar {
  top: 0;
  bottom: 0;
  width: var(--admin-sidebar-width);
  background: var(--admin-sidebar-bg);
  border-right: none;
  transition: width var(--admin-sidebar-transition), margin-left var(--admin-sidebar-transition);
  display: flex;
  flex-direction: column;
  z-index: 1041;
}

body.admin-panel .sidebar .sidebar-inner {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: #374151 transparent;
}

body.admin-panel .sidebar .sidebar-inner::-webkit-scrollbar {
  width: 5px;
}

body.admin-panel .sidebar .sidebar-inner::-webkit-scrollbar-thumb {
  background: #374151;
  border-radius: 4px;
}

/* Logo / collapse toggle */
body.admin-panel .sidebar .sidebar-logo {
  background: var(--admin-sidebar-bg);
  border-bottom: 1px solid var(--admin-sidebar-border);
  padding: 18px 16px;
  min-height: 72px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

body.admin-panel .sidebar .sidebar-logo .logo,
body.admin-panel .sidebar .sidebar-logo .logo-white,
body.admin-panel .sidebar .sidebar-logo .logo-normal,
body.admin-panel .sidebar .sidebar-logo .logo-small {
  flex: 1;
  min-width: 0;
}

body.admin-panel .sidebar .sidebar-logo .logo img,
body.admin-panel .sidebar .sidebar-logo .logo-small img {
  max-height: 36px;
  width: auto;
}

body.admin-panel .sidebar .sidebar-logo #toggle_btn,
body.admin-panel .sidebar .sidebar-logo .admin-sidebar-toggle {
  color: var(--admin-sidebar-icon);
  background: transparent;
  border: none;
  transition: color var(--admin-sidebar-transition), transform var(--admin-sidebar-transition);
  margin-left: auto;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  cursor: pointer;
}

body.admin-panel .sidebar .sidebar-logo .admin-sidebar-toggle:hover {
  color: #fff;
  background: var(--admin-sidebar-hover);
}

body.admin-panel.mini-sidebar .sidebar .sidebar-logo .admin-sidebar-toggle i {
  transform: rotate(180deg);
}

body.admin-panel.mini-sidebar:not(.expand-menu) .sidebar .sidebar-logo .logo,
body.admin-panel.mini-sidebar:not(.expand-menu) .sidebar .sidebar-logo .logo-white,
body.admin-panel.mini-sidebar:not(.expand-menu) .sidebar .sidebar-logo .logo-normal {
  display: none;
}

body.admin-panel.mini-sidebar:not(.expand-menu) .sidebar .sidebar-logo .logo-small {
  display: block !important;
}

body.admin-panel.mini-sidebar:not(.expand-menu) .sidebar .sidebar-logo {
  flex-direction: column;
  padding: 14px 8px;
  gap: 8px;
}

body.admin-panel.mini-sidebar:not(.expand-menu) .sidebar .sidebar-logo .admin-sidebar-toggle {
  margin-left: 0;
}

body.admin-panel.mini-sidebar.expand-menu .sidebar .sidebar-logo .logo,
body.admin-panel.mini-sidebar.expand-menu .sidebar .sidebar-logo .logo-white,
body.admin-panel.mini-sidebar.expand-menu .sidebar .sidebar-logo .logo-normal {
  display: block;
}

body.admin-panel.mini-sidebar.expand-menu .sidebar .sidebar-logo .logo-small {
  display: none !important;
}

/* Section headers */
body.admin-panel .sidebar .submenu-hdr {
  color: #9ca3af !important;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 10px 0 4px;
  padding: 0 12px;
}

body.admin-panel .sidebar .sidebar-menu {
  padding: 6px 8px 12px;
}

body.admin-panel .sidebar .sidebar-menu > ul > li,
body.admin-panel .sidebar .sidebar-menu li.submenu-open > ul > li {
  margin-bottom: 2px;
}

/* Top-level & submenu parent links — cover nested submenu-open structure */
body.admin-panel .sidebar .sidebar-menu a,
body.admin-panel .sidebar .sidebar-menu li.submenu-open ul a,
body.admin-panel .sidebar .sidebar-menu li.submenu > a {
  display: flex !important;
  align-items: center !important;
  gap: 0;
  padding: 10px 12px;
  border-radius: 8px;
  color: #e5e7eb !important;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.2;
  background: transparent;
  transition: background var(--admin-sidebar-transition), color var(--admin-sidebar-transition);
}

body.admin-panel .sidebar .sidebar-menu a span:not(.menu-arrow) {
  color: inherit !important;
  flex: 1;
  min-width: 0;
}

body.admin-panel .sidebar .sidebar-menu a i,
body.admin-panel .sidebar .sidebar-menu a svg {
  font-size: 20px;
  width: 20px;
  min-width: 20px;
  height: 20px;
  margin-right: 12px;
  color: #9ca3af !important;
  transition: color var(--admin-sidebar-transition);
}

/* DreamsPOS menu-arrow white circle — remove overlap */
body.admin-panel .sidebar .sidebar-menu .menu-arrow {
  background: transparent !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  border-radius: 0 !important;
  position: static !important;
  top: auto !important;
  right: auto !important;
  margin-left: auto;
  margin-right: 0;
  flex-shrink: 0;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  line-height: 1 !important;
}

body.admin-panel .sidebar .sidebar-menu .menu-arrow::before {
  position: static !important;
  left: auto !important;
  top: auto !important;
  width: 7px !important;
  height: 7px !important;
  border-right: 2px solid #9ca3af !important;
  border-bottom: 2px solid #9ca3af !important;
  border-top: 0 !important;
  border-left: 0 !important;
  transform: rotate(-45deg);
}

body.admin-panel .sidebar .sidebar-menu li.submenu > a.subdrop .menu-arrow::before,
body.admin-panel .sidebar .sidebar-menu li.submenu:hover > a .menu-arrow::before {
  border-right-color: #fff !important;
  border-bottom-color: #fff !important;
}

body.admin-panel .sidebar .sidebar-menu a:hover,
body.admin-panel .sidebar .sidebar-menu li.submenu > a:hover {
  background: var(--admin-sidebar-hover) !important;
  color: #fff !important;
}

body.admin-panel .sidebar .sidebar-menu a:hover i,
body.admin-panel .sidebar .sidebar-menu a:hover svg,
body.admin-panel .sidebar .sidebar-menu a.active i,
body.admin-panel .sidebar .sidebar-menu a.router-link-active i,
body.admin-panel .sidebar .sidebar-menu a.router-link-exact-active i,
body.admin-panel .sidebar .sidebar-menu li.submenu > a.subdrop i,
body.admin-panel .sidebar .sidebar-menu li.submenu > a.subdrop:hover i {
  color: #fff !important;
}

/* Active item — top-level links */
body.admin-panel .sidebar .sidebar-menu > ul > li:not(.submenu) > a.active,
body.admin-panel .sidebar .sidebar-menu > ul > li.submenu-open > ul > li:not(.submenu) > a.active,
body.admin-panel .sidebar .sidebar-menu > ul > li.submenu-open > ul > li:not(.submenu) > a.router-link-active,
body.admin-panel .sidebar .sidebar-menu > ul > li.submenu-open > ul > li:not(.submenu) > a.router-link-exact-active {
  background: var(--admin-sidebar-active) !important;
  color: #fff !important;
}

body.admin-panel .sidebar .sidebar-menu > ul > li:not(.submenu) > a.active i,
body.admin-panel .sidebar .sidebar-menu > ul > li.submenu-open > ul > li:not(.submenu) > a.active i,
body.admin-panel .sidebar .sidebar-menu > ul > li.submenu-open > ul > li:not(.submenu) > a.router-link-active i,
body.admin-panel .sidebar .sidebar-menu > ul > li.submenu-open > ul > li:not(.submenu) > a.router-link-exact-active i {
  color: #fff !important;
}

/* Active submenu leaf */
body.admin-panel .sidebar .sidebar-menu li.submenu ul li a.router-link-active,
body.admin-panel .sidebar .sidebar-menu li.submenu ul li a.router-link-exact-active,
body.admin-panel .sidebar .sidebar-menu li.submenu ul li a.active {
  background: var(--admin-sidebar-active) !important;
  color: #fff !important;
}

body.admin-panel .sidebar .sidebar-menu li.submenu ul li a.router-link-active i,
body.admin-panel .sidebar .sidebar-menu li.submenu ul li a.router-link-exact-active i,
body.admin-panel .sidebar .sidebar-menu li.submenu ul li a.active i {
  color: #fff;
}

/* Submenu parent when child active or expanded */
body.admin-panel .sidebar .sidebar-menu li.submenu:has(a.router-link-active) > a,
body.admin-panel .sidebar .sidebar-menu li.submenu:has(a.active) > a,
body.admin-panel .sidebar .sidebar-menu li.submenu > a.subdrop,
body.admin-panel .sidebar .sidebar-menu li.submenu > a.subdrop:hover {
  background: var(--admin-sidebar-hover) !important;
  color: #fff !important;
}

body.admin-panel .sidebar .sidebar-menu li.submenu:has(a.router-link-active) > a i,
body.admin-panel .sidebar .sidebar-menu li.submenu > a.subdrop i {
  color: #fff !important;
}

body.admin-panel .sidebar .sidebar-menu li.submenu > a.subdrop .menu-arrow::before {
  border-right-color: #fff !important;
  border-bottom-color: #fff !important;
}

/* Nested submenu items */
body.admin-panel .sidebar .sidebar-menu li.submenu ul {
  background: transparent;
  padding-left: 8px;
}

body.admin-panel .sidebar .sidebar-menu li.submenu ul li a {
  padding: 8px 12px 8px 36px;
  font-size: 13px;
  font-weight: 400;
  color: #9ca3af;
  border-radius: 8px;
}

body.admin-panel .sidebar .sidebar-menu li.submenu ul li a:hover {
  background: var(--admin-sidebar-hover) !important;
  color: #fff !important;
}

/* DreamsPOS hover span color reset */
body.admin-panel .sidebar .sidebar-menu a:hover span:not(.menu-arrow) {
  color: inherit !important;
}

/* Content & header offset */
body.admin-panel .page-wrapper {
  margin-left: var(--admin-sidebar-width);
  transition: margin-left var(--admin-sidebar-transition);
}

body.admin-panel .header {
  left: var(--admin-sidebar-width);
  width: calc(100% - var(--admin-sidebar-width));
  transition: left var(--admin-sidebar-transition), width var(--admin-sidebar-transition);
}

body.admin-panel .header .header-left {
  display: none;
}

/* Collapsed sidebar */
body.admin-panel.mini-sidebar .sidebar {
  width: var(--admin-sidebar-mini);
}

body.admin-panel.mini-sidebar .page-wrapper {
  margin-left: var(--admin-sidebar-mini);
}

body.admin-panel.mini-sidebar .header {
  left: var(--admin-sidebar-mini);
  width: calc(100% - var(--admin-sidebar-mini));
}

body.admin-panel.mini-sidebar:not(.expand-menu) .sidebar .sidebar-menu span,
body.admin-panel.mini-sidebar:not(.expand-menu) .sidebar .submenu-hdr,
body.admin-panel.mini-sidebar:not(.expand-menu) .sidebar .menu-arrow {
  display: none !important;
}

body.admin-panel.mini-sidebar:not(.expand-menu) .sidebar .sidebar-menu li.submenu > ul {
  display: none !important;
}

body.admin-panel.mini-sidebar:not(.expand-menu) .sidebar .sidebar-menu > ul > li > a,
body.admin-panel.mini-sidebar:not(.expand-menu) .sidebar .sidebar-menu > ul > li > ul > li > a {
  justify-content: center;
  padding: 14px 0;
}

body.admin-panel.mini-sidebar:not(.expand-menu) .sidebar .sidebar-menu a i {
  margin-right: 0;
}

/* Hover expand while collapsed */
body.admin-panel.mini-sidebar.expand-menu .sidebar {
  width: var(--admin-sidebar-width);
  box-shadow: 8px 0 32px rgba(0, 0, 0, 0.28);
  z-index: 1055;
}

body.admin-panel.mini-sidebar.expand-menu .sidebar .sidebar-menu span,
body.admin-panel.mini-sidebar.expand-menu .sidebar .submenu-hdr,
body.admin-panel.mini-sidebar.expand-menu .sidebar .menu-arrow {
  display: inline !important;
}

body.admin-panel.mini-sidebar.expand-menu .sidebar .menu-arrow {
  display: inline-flex !important;
}

body.admin-panel.mini-sidebar.expand-menu .sidebar .sidebar-menu > ul > li > a,
body.admin-panel.mini-sidebar.expand-menu .sidebar .sidebar-menu > ul > li > ul > li > a {
  justify-content: flex-start;
  padding: 14px 20px;
}

body.admin-panel.mini-sidebar.expand-menu .sidebar .sidebar-menu a i {
  margin-right: 12px;
}

body.admin-panel.mini-sidebar.expand-menu .sidebar .sidebar-menu li.submenu > a.subdrop + ul,
body.admin-panel.mini-sidebar.expand-menu .sidebar .sidebar-menu li.submenu ul.d-block {
  display: block !important;
}

/* Mobile overlay */
@media (max-width: 991.98px) {
  body.admin-panel .sidebar {
    margin-left: calc(-1 * var(--admin-sidebar-width));
    width: var(--admin-sidebar-width);
  }

  body.admin-panel.slide-nav .sidebar {
    margin-left: 0;
  }

  body.admin-panel .page-wrapper,
  body.admin-panel.mini-sidebar .page-wrapper {
    margin-left: 0;
  }

  body.admin-panel .header,
  body.admin-panel.mini-sidebar .header {
    left: 0;
    width: 100%;
  }

  body.admin-panel .sidebar-overlay {
    background: rgba(17, 24, 39, 0.55);
  }
}