/* =============================================
   DATALYSE SIDEBAR STYLES
   Modern neutral design (ChatGPT-inspired)
   ============================================= */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');

/* ===== SIDEBAR BASE (LIGHT) ===== */

.left-sidebar {
  font-family: inherit;
  background: var(--white-color);
  border-right: 1px solid var(--border-color);
}

.left-sidebar .scroll-sidebar {
  padding-left: 0;
  padding-right: 0;
}

#sidebarnav {
  padding: 4px 0;
}

/* Section headers (BROKER HUB, SALES & OPS, etc.) */
#sidebarnav .nav-small-cap {
  padding: 20px 20px 8px 20px;
  margin: 0;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--text-muted-color);
  line-height: 1.2;
}

#sidebarnav .nav-small-cap .nav-small-cap-icon {
  display: none !important;
}

#sidebarnav .nav-small-cap .hide-menu {
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.3px;
  color: var(--text-muted-color);
}

/* Sidebar items */
#sidebarnav .sidebar-item {
  margin: 1px 8px;
}

/* Sidebar links */
#sidebarnav .sidebar-link {
  display: flex;
  align-items: center;
  padding: 9px 12px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 400;
  color: var(--text-secondary-color);
  text-decoration: none;
  transition: background-color 0.15s ease, color 0.15s ease;
  gap: 12px;
  line-height: 1.4;
}

#sidebarnav .sidebar-link:hover {
  background-color: var(--hover-color);
  color: var(--brand-color);
}

/* Icons */
#sidebarnav .sidebar-link .ti {
  font-size: 20px;
  color: var(--text-secondary-color);
  width: 22px;
  text-align: center;
  flex-shrink: 0;
  transition: color 0.15s ease;
}

#sidebarnav .sidebar-link:hover .ti {
  color: var(--brand-color);
}

/* Text */
#sidebarnav .sidebar-link .hide-menu {
  font-size: 13px;
  font-weight: 400;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Active state */
#sidebarnav .sidebar-link.active,
#sidebarnav .sidebar-item.selected > .sidebar-link {
  background-color: var(--hover-color);
  color: var(--brand-color);
  font-weight: 500;
}

#sidebarnav .sidebar-link.active .ti,
#sidebarnav .sidebar-item.selected > .sidebar-link .ti {
  color: var(--brand-color) !important;
}

#sidebarnav .sidebar-link.active .hide-menu,
#sidebarnav .sidebar-item.selected > .sidebar-link .hide-menu {
  color: var(--brand-color);
  font-weight: 500;
}

/* Notification badges */
#sidebarnav .popup-badge.spanacuantos {
  font-size: 10px;
  padding: 1px 5px;
  position: absolute;
}


/* ===== DARK MODE ===== */

[data-bs-theme="dark"] .left-sidebar {
  background: var(--white-color);
  border-right: 1px solid var(--border-color);
}

/* Section headers - dark */
[data-bs-theme="dark"] #sidebarnav .nav-small-cap,
[data-bs-theme="dark"] #sidebarnav .nav-small-cap .hide-menu {
  color: var(--text-muted-color);
}

/* Links - dark */
[data-bs-theme="dark"] #sidebarnav .sidebar-link {
  color: var(--text-secondary-color);
}

[data-bs-theme="dark"] #sidebarnav .sidebar-link:hover {
  background-color: var(--hover-color);
  color: var(--text-color);
}

/* Icons - dark */
[data-bs-theme="dark"] #sidebarnav .sidebar-link .ti {
  color: var(--text-muted-color);
}

[data-bs-theme="dark"] #sidebarnav .sidebar-link:hover .ti {
  color: var(--text-color);
}

/* Active - dark */
[data-bs-theme="dark"] #sidebarnav .sidebar-link.active,
[data-bs-theme="dark"] #sidebarnav .sidebar-item.selected > .sidebar-link {
  background-color: var(--hover-color);
  color: var(--text-color);
  font-weight: 500;
}

[data-bs-theme="dark"] #sidebarnav .sidebar-link.active .ti,
[data-bs-theme="dark"] #sidebarnav .sidebar-item.selected > .sidebar-link .ti {
  color: var(--text-color) !important;
}

[data-bs-theme="dark"] #sidebarnav .sidebar-link.active .hide-menu,
[data-bs-theme="dark"] #sidebarnav .sidebar-item.selected > .sidebar-link .hide-menu {
  color: var(--text-color);
}

/* Brand logo area - dark */
[data-bs-theme="dark"] .left-sidebar .brand-logo {
  border-bottom-color: var(--border-color);
}

/* Scrollbar - dark */
[data-bs-theme="dark"] .left-sidebar .scroll-sidebar::-webkit-scrollbar-thumb {
  background-color: var(--scrolldark-color);
}

[data-bs-theme="dark"] .left-sidebar .scroll-sidebar::-webkit-scrollbar-track {
  background: transparent;
}


/* ===== MINI-SIDEBAR (COLLAPSED) — estilo ElevenLabs ===== */
/* Ancho 60px. Colores tomados de los tokens CSS (dark/light) */

[data-sidebartype="mini-sidebar"] .left-sidebar {
  width: 60px !important;
  min-width: 60px !important;
  max-width: 60px !important;
  background: var(--el-bg-raised, #1c1c1d) !important;
  border-right: 1px solid var(--el-border) !important;
  overflow: hidden;
}

[data-sidebartype="mini-sidebar"] #sidebarnav {
  padding: 6px 0;
}

[data-sidebartype="mini-sidebar"] #sidebarnav .sidebar-item {
  margin: 2px 6px;
}

/* Logo en modo mini: icono cuadrado pequeño centrado en fondo oscuro */
[data-sidebartype="mini-sidebar"] .brand-logo {
  justify-content: center !important;
  padding: 8px 0 !important;
  background: var(--el-bg-raised, #1c1c1d) !important;
  border-bottom: none !important;
}
[data-sidebartype="mini-sidebar"] .brand-logo .logo-img {
  width: auto !important;
  max-width: 40px !important;
  margin: 0 auto !important;
}
/* Show correct logo based on theme */
[data-bs-theme="dark"] .brand-logo .dark-logo { display: none !important; }
[data-bs-theme="dark"] .brand-logo .light-logo { display: block !important; }
[data-bs-theme="light"] .brand-logo .dark-logo { display: block !important; }
[data-bs-theme="light"] .brand-logo .light-logo { display: none !important; }

[data-sidebartype="mini-sidebar"] .brand-logo .logo-img img.dark-logo,
[data-sidebartype="mini-sidebar"] .brand-logo .logo-img img.light-logo {
  width: 32px !important;
  height: 32px !important;
  object-fit: contain;
  border-radius: 8px;
}
[data-sidebartype="mini-sidebar"] .brand-logo .logo-img img.light-logo {
  content: url("/images/logo-icon.svg");
}
[data-sidebartype="mini-sidebar"] .brand-logo .logo-img img.dark-logo {
  content: url("/images/logo-icon-dark.svg");
}

[data-sidebartype="mini-sidebar"] #sidebarnav .sidebar-link {
  padding: 9px 8px !important;
  justify-content: center !important;
  gap: 0 !important;
  border-radius: 8px !important;
  color: var(--el-text-muted, rgba(255,255,255,.55)) !important;
  background: transparent !important;
}

[data-sidebartype="mini-sidebar"] #sidebarnav .sidebar-link:hover {
  background: var(--el-hover, rgba(255,255,255,.06)) !important;
  color: var(--el-text, #fff) !important;
}

[data-sidebartype="mini-sidebar"] #sidebarnav .sidebar-link.active,
[data-sidebartype="mini-sidebar"] #sidebarnav .sidebar-item.selected > .sidebar-link {
  background: var(--el-active, rgba(255,255,255,.09)) !important;
  color: var(--el-text, #fff) !important;
}

[data-sidebartype="mini-sidebar"] #sidebarnav .sidebar-link .ti {
  width: auto;
  font-size: 22px;
  color: inherit !important;
}

[data-sidebartype="mini-sidebar"] #sidebarnav .sidebar-link:hover .ti,
[data-sidebartype="mini-sidebar"] #sidebarnav .sidebar-link.active .ti {
  color: inherit !important;
}

/* More en modo mini: flyout hacia la derecha en lugar de expandir verticalmente */
[data-sidebartype="mini-sidebar"] #sidebarMasColapsable {
  position: static;
}
[data-sidebartype="mini-sidebar"] #sidebarMasColapsable > .sidebar-link.has-arrow::after {
  display: none !important;
}
[data-sidebartype="mini-sidebar"] #sidebarMasColapsable > ul.collapse {
  position: fixed !important;
  left: 68px !important;
  bottom: 14px !important;
  top: auto !important;
  width: 260px !important;
  max-height: calc(100vh - 120px);
  overflow-y: auto;
  background: var(--el-bg-raised, #1c1c1d) !important;
  border: 1px solid var(--el-border-strong, rgba(255,255,255,.1)) !important;
  border-radius: 14px !important;
  padding: 8px !important;
  box-shadow: var(--el-shadow-lg, 0 20px 60px rgba(0,0,0,.55)) !important;
  z-index: 1050;
  /* Solo visible cuando Bootstrap añade .show/.in */
  display: none !important;
}
[data-sidebartype="mini-sidebar"] #sidebarMasColapsable > ul.collapse.show,
[data-sidebartype="mini-sidebar"] #sidebarMasColapsable > ul.collapse.in {
  display: block !important;
}
/* Items dentro del flyout: recuperar el texto y el padding normal */
[data-sidebartype="mini-sidebar"] #sidebarMasColapsable > ul.collapse .sidebar-item {
  margin: 2px 0 !important;
}
[data-sidebartype="mini-sidebar"] #sidebarMasColapsable > ul.collapse .sidebar-link {
  justify-content: flex-start !important;
  padding: 9px 12px !important;
  gap: 12px !important;
  border-radius: 8px !important;
  color: var(--el-text, rgba(255,255,255,.75)) !important;
}
[data-sidebartype="mini-sidebar"] #sidebarMasColapsable > ul.collapse .sidebar-link:hover {
  background: var(--el-hover, rgba(255,255,255,.08)) !important;
  color: var(--el-text, #fff) !important;
}
[data-sidebartype="mini-sidebar"] #sidebarMasColapsable > ul.collapse .sidebar-link .ti {
  font-size: 18px !important;
}
[data-sidebartype="mini-sidebar"] #sidebarMasColapsable > ul.collapse .sidebar-link .hide-menu {
  display: inline !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  color: inherit !important;
}
/* Título "More" (opcional) en el flyout */
[data-sidebartype="mini-sidebar"] #sidebarMasColapsable > ul.collapse::before {
  content: "More";
  display: block;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--el-text-dim, rgba(255,255,255,.4));
  padding: 6px 12px 8px 12px;
}

[data-sidebartype="mini-sidebar"] #sidebarnav .sidebar-link .hide-menu {
  display: none;
}

[data-sidebartype="mini-sidebar"] #sidebarnav .nav-small-cap {
  padding: 12px 4px 4px 4px;
  justify-content: center;
  min-height: 0;
}

[data-sidebartype="mini-sidebar"] #sidebarnav .nav-small-cap .hide-menu {
  display: none;
}

[data-sidebartype="mini-sidebar"] #sidebarnav .nav-small-cap .nav-small-cap-icon {
  display: none !important;
}

[data-sidebartype="mini-sidebar"] #sidebarnav .popup-badge.spanacuantos {
  display: none;
}


/* ===== MINI-SIDEBAR (no hover expand — usamos tooltips en su lugar) =====
   El comportamiento de expandir al hacer hover sobre el aside fue eliminado
   a favor de tooltips Bootstrap que muestran el nombre del item/sección.
   Ver sidebar_initTooltips() en 165_appMARC.js
   Hay que sobreescribir reglas de stylesmarc.css:24423 y v2bootstrap.css:17452
   que están dentro de @media(min-width:1300px) con especificidad alta. */
/* Forzar 60px SIEMPRE (baseline vendor 87px, hover vendor 270px) — estilo ElevenLabs */
[data-layout=vertical] body[data-sidebartype=mini-sidebar] .left-sidebar,
[data-layout=vertical] [data-sidebartype=mini-sidebar] .left-sidebar,
[data-layout=vertical] body[data-sidebartype=mini-sidebar] .left-sidebar:hover,
[data-layout=vertical] [data-sidebartype=mini-sidebar] .left-sidebar:hover {
  width: 60px !important;
  min-width: 60px !important;
  max-width: 60px !important;
  background: var(--el-bg-raised, #1c1c1d) !important;
  border-right: 1px solid var(--el-border) !important;
  box-shadow: none !important;
}
[data-layout=vertical] body[data-sidebartype=mini-sidebar] .left-sidebar:hover .hide-menu,
[data-layout=vertical] body[data-sidebartype=mini-sidebar] .left-sidebar:hover .fixed-profile,
[data-layout=vertical] body[data-sidebartype=mini-sidebar] .left-sidebar:hover .sidebar-nav .has-arrow::after {
  display: none !important;
}
[data-layout=vertical] body[data-sidebartype=mini-sidebar] .left-sidebar:hover .nav-small-cap {
  text-align: center !important;
  padding: 8px 4px 2px 4px !important;
}
[data-layout=vertical] body[data-sidebartype=mini-sidebar] .left-sidebar:hover .sidebar-nav ul .sidebar-item .sidebar-link {
  padding: 8px !important;
  justify-content: center !important;
}
[data-layout=vertical] body[data-sidebartype=mini-sidebar] .left-sidebar:hover .logo-part {
  display: none !important;
}
[data-layout=vertical] body[data-sidebartype=mini-sidebar] .left-sidebar:hover .logo-img {
  width: auto !important;
}

[data-sidebartype="mini-sidebar"] #sidebarnav .nav-small-cap {
  padding: 6px 4px 2px 4px !important;
  min-height: 8px;
}
[data-sidebartype="mini-sidebar"] #sidebarnav .nav-small-cap::before {
  content: "";
  display: block;
  width: 20px;
  height: 1px;
  background: var(--el-border, rgba(255,255,255,.08));
  margin: 3px auto 1px auto;
}

/* ===== Modal "Activate module" estilo ElevenLabs ===== */
.sidebar-activate-modal .modal-dialog { margin: 1.75rem auto; }
.sidebar-activate-modal__content {
  background: #1c1c1d !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 16px !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.45) !important;
  color: #f5f5f7;
  overflow: hidden;
}
.sidebar-activate-modal__header {
  border: 0 !important;
  padding: 20px 24px 4px 24px !important;
  display: flex; align-items: center; justify-content: space-between;
}
.sidebar-activate-modal__icon {
  display: inline-flex;
  width: 36px; height: 36px;
  align-items: center; justify-content: center;
  margin-right: 12px;
  border-radius: 10px;
  background: rgba(255,255,255,.08);
  color: #f5f5f7;
}
.sidebar-activate-modal__icon .ti { font-size: 20px; }
.sidebar-activate-modal__title {
  font-size: 16px;
  font-weight: 600;
  color: #f5f5f7;
  letter-spacing: -.01em;
}
.sidebar-activate-modal__close {
  width: 32px; height: 32px;
  background: transparent;
  border: 1px solid rgba(255,255,255,.08);
  color: rgba(255,255,255,.7);
  border-radius: 8px;
  display: inline-flex;
  align-items: center; justify-content: center;
  cursor: pointer;
  transition: background .15s, color .15s;
}
.sidebar-activate-modal__close:hover {
  background: rgba(255,255,255,.06);
  color: #fff;
}
.sidebar-activate-modal__close .ti { font-size: 18px; }
.sidebar-activate-modal__body {
  padding: 12px 24px 20px 24px !important;
}
.sidebar-activate-modal__price {
  font-size: 22px;
  font-weight: 600;
  color: #f5f5f7;
  margin: 0 0 8px 0;
  letter-spacing: -.01em;
}
.sidebar-activate-modal__price b { color: #fff; font-weight: 700; }
.sidebar-activate-modal__desc {
  font-size: 13px;
  color: rgba(255,255,255,.55);
  margin: 0;
  line-height: 1.5;
}
.sidebar-activate-modal__footer {
  border: 0 !important;
  padding: 0 24px 20px 24px !important;
  gap: 10px;
  display: flex;
  justify-content: flex-end;
}
.sidebar-activate-modal__btn {
  padding: 10px 18px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid transparent;
  transition: background .15s, color .15s, border-color .15s, transform .1s;
  letter-spacing: -.005em;
}
.sidebar-activate-modal__btn:active { transform: scale(.98); }
.sidebar-activate-modal__btn--ghost {
  background: transparent;
  color: rgba(255,255,255,.7);
  border-color: rgba(255,255,255,.12);
}
.sidebar-activate-modal__btn--ghost:hover {
  background: rgba(255,255,255,.06);
  color: #fff;
  border-color: rgba(255,255,255,.2);
}
.sidebar-activate-modal__btn--primary {
  background: #f5f5f7;
  color: #0f0f10;
  border-color: #f5f5f7;
}
.sidebar-activate-modal__btn--primary:hover {
  background: #fff;
  color: #000;
}
/* Light mode overrides */
[data-bs-theme="light"] .sidebar-activate-modal__content {
  background: #fff !important;
  border-color: rgba(0,0,0,.1) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.12) !important;
  color: #1e293b;
}
[data-bs-theme="light"] .sidebar-activate-modal__icon { background: rgba(0,0,0,.05); color: #1e293b; }
[data-bs-theme="light"] .sidebar-activate-modal__title { color: #1e293b; }
[data-bs-theme="light"] .sidebar-activate-modal__close { border-color: rgba(0,0,0,.1); color: #64748b; }
[data-bs-theme="light"] .sidebar-activate-modal__close:hover { background: rgba(0,0,0,.04); color: #1e293b; }
[data-bs-theme="light"] .sidebar-activate-modal__price { color: #1e293b; }
[data-bs-theme="light"] .sidebar-activate-modal__price b { color: #0f172a; }
[data-bs-theme="light"] .sidebar-activate-modal__desc { color: #64748b; }
[data-bs-theme="light"] .sidebar-activate-modal__btn--ghost { color: #475569; border-color: rgba(0,0,0,.15); }
[data-bs-theme="light"] .sidebar-activate-modal__btn--ghost:hover { background: rgba(0,0,0,.04); color: #1e293b; border-color: rgba(0,0,0,.2); }
[data-bs-theme="light"] .sidebar-activate-modal__btn--primary { background: #3b82f6; color: #fff; border-color: #3b82f6; }
[data-bs-theme="light"] .sidebar-activate-modal__btn--primary:hover { background: #2563eb; color: #fff; }

/* El backdrop del modal también más oscuro */
.sidebar-activate-modal ~ .modal-backdrop,
body > .modal-backdrop.show { background: #000; opacity: .6; }

/* Tooltip custom para el sidebar (estilo ElevenLabs) */
.tooltip.sidebar-tip .tooltip-inner {
  font-size: 12px;
  padding: 5px 9px;
  background: #2b2b2d;
  color: #f5f5f7;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 6px;
  font-weight: 500;
  box-shadow: 0 6px 20px rgba(0,0,0,.35);
}
.tooltip.sidebar-tip.bs-tooltip-end .tooltip-arrow::before,
.tooltip.sidebar-tip.bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::before {
  border-right-color: #2b2b2d;
}

/* 2026 Sidebar pin/unpin + drag */
#sidebarnav .sidebar-link { position: relative; padding-right: 28px !important; }
#sidebarnav .sidebar-unpin-btn,
#sidebarnav .sidebar-drag-handle {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0;
  transition: opacity .15s ease, color .15s ease;
  cursor: pointer;
  font-size: 13px !important;
  line-height: 1;
  color: var(--text-muted, #9ca3af);
  z-index: 3;
}
#sidebarnav .sidebar-unpin-btn { right: 4px; }
#sidebarnav .sidebar-drag-handle { right: 22px; cursor: grab; }
#sidebarnav .sidebar-item:hover .sidebar-unpin-btn,
#sidebarnav .sidebar-item:hover .sidebar-drag-handle { opacity: .55; }
#sidebarnav .sidebar-unpin-btn:hover { opacity: 1 !important; color: var(--brand-color, #0d6efd); }
#sidebarnav .sidebar-drag-handle:hover { opacity: 1 !important; }
#sidebarnav .sidebar-item.dragging { opacity: .4; }

/* Subsecciones: header + items con sangría a la izquierda */
#sidebarnav li.nav-small-cap[data-sidebar-subsection="y"] {
  padding-left: 36px;
}
#sidebarnav li.nav-small-cap[data-sidebar-subsection="y"] .hide-menu {
  font-size: 10px;
  opacity: .85;
}
#sidebarnav li.sidebar-item[data-sidebar-in-subsection="y"] {
  margin-left: 22px;
}
#sidebarnav li.sidebar-item[data-sidebar-in-subsection="y"] > .sidebar-link {
  border-left: 2px solid var(--border-color, rgba(0,0,0,.08));
  border-radius: 0 8px 8px 0;
}
[data-sidebartype="mini-sidebar"] #sidebarnav li.sidebar-item[data-sidebar-in-subsection="y"] {
  margin-left: 4px;
}
[data-sidebartype="mini-sidebar"] #sidebarnav li.nav-small-cap[data-sidebar-subsection="y"] {
  padding-left: 4px;
}

/* Section headers draggable + botones clone/edit/delete */
#sidebarnav .nav-small-cap { position: relative; cursor: grab; padding-right: 76px; }
#sidebarnav .nav-small-cap.dragging { opacity: .4; }
#sidebarnav .sidebar-section-clonebtn,
#sidebarnav .sidebar-section-editbtn,
#sidebarnav .sidebar-section-delbtn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 13px;
  opacity: 0;
  cursor: pointer;
  color: var(--text-muted, #9ca3af);
  z-index: 3;
  transition: opacity .15s ease, color .15s ease;
}
#sidebarnav .sidebar-section-clonebtn { right: 54px; }
#sidebarnav .sidebar-section-editbtn  { right: 32px; }
#sidebarnav .sidebar-section-delbtn   { right: 10px; }
#sidebarnav .nav-small-cap:hover .sidebar-section-clonebtn,
#sidebarnav .nav-small-cap:hover .sidebar-section-editbtn,
#sidebarnav .nav-small-cap:hover .sidebar-section-delbtn { opacity: .55; }
#sidebarnav .sidebar-section-clonebtn:hover,
#sidebarnav .sidebar-section-editbtn:hover,
#sidebarnav .sidebar-section-delbtn:hover { opacity: 1 !important; color: var(--brand-color, #0d6efd); }
#sidebarnav .hide-menu[contenteditable="true"] {
  outline: 2px solid rgba(13,110,253,.5);
  outline-offset: 2px;
  border-radius: 3px;
  padding: 0 4px;
  background: rgba(13,110,253,.04);
  min-width: 40px;
  display: inline-block;
}
/* Mini-sidebar: ocultar botones de acción excepto pin en flyout de Más */
[data-sidebartype="mini-sidebar"] #sidebarnav .sidebar-unpin-btn,
[data-sidebartype="mini-sidebar"] #sidebarnav .sidebar-drag-handle,
[data-sidebartype="mini-sidebar"] #sidebarnav .sidebar-section-clonebtn,
[data-sidebartype="mini-sidebar"] #sidebarnav .sidebar-section-editbtn,
[data-sidebartype="mini-sidebar"] #sidebarnav .sidebar-section-delbtn { display: none !important; }
/* Show pin button inside More flyout */
[data-sidebartype="mini-sidebar"] #sidebarMasList .sidebar-unpin-btn {
  display: block !important;
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  opacity: .5;
  font-size: 13px !important;
}
[data-sidebartype="mini-sidebar"] #sidebarMasList .sidebar-item:hover .sidebar-unpin-btn { opacity: 1; }
[data-sidebartype="mini-sidebar"] #sidebarMasList .sidebar-link { padding-right: 28px !important; }
/* En modo mini los padding-right extra no hacen falta */
[data-sidebartype="mini-sidebar"] #sidebarnav .sidebar-link { padding-right: 8px !important; }
[data-sidebartype="mini-sidebar"] #sidebarnav .nav-small-cap { padding-right: 4px !important; }

/* Botón "New section" con estilo de nav-small-cap (como MARKETING AI) */
#sidebarnav #sidebarNewSectionBtn {
  cursor: pointer !important;
  opacity: .55;
  transition: opacity .15s ease;
  padding-right: 12px;
}
#sidebarnav #sidebarNewSectionBtn:hover { opacity: 1; color: var(--brand-color, #0d6efd); }
#sidebarnav #sidebarNewSectionBtn .nav-small-cap-icon { font-size: 14px; }
/* No mostrar botones edit/delete en el botón New section */
#sidebarnav #sidebarNewSectionBtn .sidebar-section-editbtn,
#sidebarnav #sidebarNewSectionBtn .sidebar-section-delbtn { display: none !important; }

/* Placeholder visual durante el drag (similar a .sbi-item-placeholder del board de sales) */
#sidebarnav .sidebar-item-placeholder {
  background: rgba(13,110,253,.08);
  border: 2px dashed rgba(13,110,253,.35);
  border-radius: 8px;
  margin: 4px 8px;
  height: 42px;
  list-style: none;
  transition: background .1s ease;
  pointer-events: none;
}
[data-bs-theme="dark"] #sidebarnav .sidebar-item-placeholder {
  background: rgba(99,179,255,.1);
  border-color: rgba(99,179,255,.45);
}
/* (Las reglas de ocultar pin/drag en mini-sidebar están arriba en el bloque consolidado) */

/* Módulos NO instalados: mostrar oscurecidos */
#sidebarnav .sidebar-module-notinstalled > .sidebar-link {
  opacity: .45;
  filter: grayscale(0.4);
  position: relative;
}
#sidebarnav .sidebar-module-notinstalled > .sidebar-link::after {
  content: "\ea75"; /* ti ti-lock */
  font-family: "tabler-icons";
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 13px;
  opacity: .65;
}
#sidebarnav .sidebar-module-notinstalled:hover > .sidebar-link { opacity: .8; cursor: pointer; }
/* En módulos no instalados sí mostramos el botón unpin (para poder enviarlos a More),
   pero ocultamos el drag handle ya que reordenar un módulo sin contratar no aporta */
#sidebarnav .sidebar-module-notinstalled .sidebar-drag-handle { display: none !important; }
#sidebarnav .sidebar-module-notinstalled .sidebar-unpin-btn { opacity: 1; color: var(--text-muted, #9ca3af); z-index: 5; }
/* Ocultar el candado ::after para que no se solape con el botón unpin */
#sidebarnav .sidebar-module-notinstalled > .sidebar-link::after {
  right: 34px;
}
