/* ==========================================================================
   ERP Sidebar — professional graphite theme (overrides the Cuba theme)
   Loaded AFTER style.css / color-1.css / responsive.css so it wins.
   Palette: graphite surface + muted slate text + teal accent (brand #006666).
   ========================================================================== */

:root {
  --erp-sb-bg:        #1e1e1e;   /* sidebar surface (near-black graphite)     */
  --erp-sb-bg-2:      #161616;   /* gradient foot / logo band                 */
  --erp-sb-border:    #2c2c2c;   /* hairline dividers                         */
  --erp-sb-txt:       #b7b7b7;   /* default link text                         */
  --erp-sb-txt-dim:   #8a8a8a;   /* icons / secondary                         */
  --erp-sb-title:     #6a6a6a;   /* section headings                          */
  --erp-sb-hover-bg:  rgba(255,255,255,.05);
  --erp-sb-hover-txt: #f3f3f3;
  --erp-accent:       #cf2b28;   /* red accent (active) — brand #971110 family */
  --erp-accent-bg:    rgba(151,17,16,.20);
  --erp-accent-brd:   rgba(151,17,16,.5);
  --erp-accent-txt:   #f3b7b6;   /* light red for active label on dark        */
}

/* ── Surface ───────────────────────────────────────────────────────────── */
.page-wrapper .page-body-wrapper .sidebar-wrapper,
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper {
  background: linear-gradient(180deg, var(--erp-sb-bg) 0%, var(--erp-sb-bg-2) 100%) !important;
  border-right: 1px solid var(--erp-sb-border) !important;
  box-shadow: 1px 0 0 rgba(0,0,0,.25) !important;
}

/* Logo band */
.page-wrapper .sidebar-wrapper .logo-wrapper,
.page-wrapper .sidebar-wrapper .logo-icon-wrapper {
  background: transparent !important;
  border-bottom: 1px solid var(--erp-sb-border) !important;
  box-shadow: none !important;
}
.page-wrapper .sidebar-wrapper .logo-wrapper .toggle-sidebar .sidebar-toggle,
.page-wrapper .sidebar-wrapper .back-btn { color: var(--erp-sb-txt-dim) !important; }

/* ── Section titles ────────────────────────────────────────────────────── */
.page-wrapper .sidebar-main-title {
  padding: 16px 18px 6px !important;
  margin: 6px 0 2px !important;
}
.page-wrapper .sidebar-main-title > div { border-top: 1px solid var(--erp-sb-border); padding-top: 12px; }
.page-wrapper .sidebar-main-title h6 {
  color: var(--erp-sb-title) !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: 1.3px !important;
  text-transform: uppercase !important;
  margin: 0 !important;
  opacity: 1 !important;
  animation: none !important;
}
/* the very first title needs no top rule */
.page-wrapper .sidebar-links > .sidebar-main-title:first-child > div { border-top: none; padding-top: 2px; }

/* ── Links ─────────────────────────────────────────────────────────────── */
.page-wrapper .sidebar-wrapper .sidebar-main .sidebar-links li { margin: 1px 10px !important; }

.page-wrapper .sidebar-wrapper .sidebar-main .sidebar-links li a.sidebar-link,
.page-wrapper.compact-wrapper .sidebar-wrapper .sidebar-main .sidebar-links li a.sidebar-link {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 9px 12px !important;
  margin: 0 !important;
  border-radius: 9px !important;
  color: var(--erp-sb-txt) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  transition: background .14s ease, color .14s ease !important;
}
/* remove the theme's default active dot / pseudo markers */
.page-wrapper .sidebar-wrapper .sidebar-main .sidebar-links li a.sidebar-link::before,
.page-wrapper .sidebar-wrapper .sidebar-main .sidebar-links li a.sidebar-link::after { display: none !important; }

.page-wrapper .sidebar-wrapper .sidebar-main .sidebar-links li a.sidebar-link span {
  color: inherit !important;
  letter-spacing: .1px !important;
  font-weight: inherit !important;
}

/* Icons (feather renders to <svg>) */
.page-wrapper .sidebar-wrapper .sidebar-main .sidebar-links li a.sidebar-link svg,
.page-wrapper .sidebar-wrapper .sidebar-main .sidebar-links li a.sidebar-link i[data-feather] {
  width: 18px !important;
  height: 18px !important;
  stroke-width: 2px !important;
  color: var(--erp-sb-txt-dim) !important;
  stroke: var(--erp-sb-txt-dim) !important;
  transition: color .14s ease, stroke .14s ease !important;
  flex-shrink: 0 !important;
}

/* Hover */
.page-wrapper .sidebar-wrapper .sidebar-main .sidebar-links li a.sidebar-link:hover {
  background: var(--erp-sb-hover-bg) !important;
  color: var(--erp-sb-hover-txt) !important;
}
.page-wrapper .sidebar-wrapper .sidebar-main .sidebar-links li a.sidebar-link:hover svg {
  color: var(--erp-sb-hover-txt) !important;
  stroke: var(--erp-sb-hover-txt) !important;
}

/* Active */
.page-wrapper .sidebar-wrapper .sidebar-main .sidebar-links li a.sidebar-link.active,
.page-wrapper.compact-wrapper .sidebar-wrapper .sidebar-main .sidebar-links li a.sidebar-link.active {
  background: var(--erp-accent-bg) !important;
  color: var(--erp-accent-txt) !important;
  font-weight: 600 !important;
  box-shadow: inset 0 0 0 1px var(--erp-accent-brd) !important;
}
.page-wrapper .sidebar-wrapper .sidebar-main .sidebar-links li a.sidebar-link.active::before {
  display: block !important;
  content: "" !important;
  position: absolute !important;
  left: -10px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 3px !important;
  height: 20px !important;
  border-radius: 0 3px 3px 0 !important;
  background: var(--erp-accent) !important;
}
.page-wrapper .sidebar-wrapper .sidebar-main .sidebar-links li a.sidebar-link.active svg {
  color: var(--erp-accent) !important;
  stroke: var(--erp-accent) !important;
}

/* ── Dropdowns: keep child links distinct from main menu items ──────────── */
.page-wrapper.compact-wrapper #sidebar-menu .sidebar-submenu {
  width: auto !important;
  margin: 4px 0 6px 21px !important;
  padding: 0 0 0 9px !important;
  border-left: 1px solid var(--erp-sb-border);
  list-style: none;
}
.page-wrapper.compact-wrapper #sidebar-menu .sidebar-submenu::before {
  display: none !important;
}
.page-wrapper #sidebar-menu .sidebar-submenu > li {
  margin: 2px 0 !important;
  padding: 0 !important;
}
.page-wrapper #sidebar-menu .sidebar-submenu > li > a.sidebar-link {
  min-height: 34px;
  padding: 7px 10px !important;
  border-radius: 6px !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  letter-spacing: .1px !important;
  white-space: normal !important;
  overflow-wrap: anywhere;
  text-decoration: none;
}
.page-wrapper #sidebar-menu .sidebar-submenu > li > a.sidebar-link.active {
  font-weight: 600 !important;
  box-shadow: none !important;
}
.page-wrapper #sidebar-menu .sidebar-submenu > li > a.sidebar-link.active::before {
  left: -12px !important;
  width: 5px !important;
  height: 5px !important;
  border-radius: 50% !important;
}
.page-wrapper #sidebar-menu a.sidebar-title[aria-controls] {
  padding-right: 34px !important;
}
.page-wrapper #sidebar-menu a.sidebar-title[aria-controls].active {
  background: var(--erp-sb-hover-bg) !important;
  color: var(--erp-sb-hover-txt) !important;
  box-shadow: none !important;
}
.page-wrapper #sidebar-menu a.sidebar-title[aria-controls].active::before {
  display: none !important;
}
.page-wrapper #sidebar-menu a.sidebar-title[aria-controls] .according-menu {
  position: absolute;
  top: 50% !important;
  right: 12px !important;
  transform: translateY(-50%);
  line-height: 1;
}
.page-wrapper #sidebar-menu a.sidebar-title[aria-controls] .according-menu i {
  color: inherit !important;
  font-size: 12px;
}
.page-wrapper #sidebar-menu a.sidebar-link:focus-visible {
  outline: 2px solid var(--erp-accent-txt);
  outline-offset: 2px;
}

/* ── Scrollbar (thin, subtle) ──────────────────────────────────────────── */
.page-wrapper .sidebar-wrapper .simplebar-scrollbar::before { background: #3a434f !important; }
.page-wrapper .sidebar-wrapper .sidebar-main .sidebar-links::-webkit-scrollbar { width: 6px; }
.page-wrapper .sidebar-wrapper .sidebar-main .sidebar-links::-webkit-scrollbar-thumb {
  background: #2a323d; border-radius: 6px;
}

/* ── Collapsed / icon-only state keeps the same palette ────────────────── */
.page-wrapper.compact-sidebar .sidebar-wrapper,
.page-wrapper .sidebar-wrapper.close_icon { background: var(--erp-sb-bg) !important; }
