/* CDI shared menu */
.cdi-menu-btn{
  background:transparent;
  border:1px solid rgba(214,179,106,.22);
  border-radius:6px;
  width:46px;
  height:46px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:5px;
  cursor:pointer;
  padding:0;
  transition:all .2s;
  margin-left:12px;
}
.cdi-menu-btn:hover{border-color:#d6b36a;}
.cdi-menu-btn span{display:block;width:22px;height:2px;background:currentColor;border-radius:2px;transition:all .3s;}
.cdi-menu-btn.active span:nth-child(1){transform:translateY(7px) rotate(45deg);background:#d6b36a;}
.cdi-menu-btn.active span:nth-child(2){opacity:0;}
.cdi-menu-btn.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);background:#d6b36a;}

.cdi-menu-backdrop{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  backdrop-filter:blur(4px);
  opacity:0;
  pointer-events:none;
  transition:opacity .25s;
  z-index:9998;
}
.cdi-menu-backdrop.open{opacity:1;pointer-events:auto;}

.cdi-menu-drawer{
  position:fixed;
  top:0;
  right:0;
  height:100vh;
  width:340px;
  max-width:88vw;
  background:#10100f;
  border-left:1px solid rgba(214,179,106,.18);
  box-shadow:-12px 0 40px rgba(0,0,0,.5);
  transform:translateX(100%);
  transition:transform .3s ease;
  z-index:9999;
  display:flex;
  flex-direction:column;
  overflow-y:auto;
  color:#f1eee8;
}
.cdi-menu-drawer.open{transform:translateX(0);}

.cdi-menu-head{
  padding:24px 22px 18px;
  border-bottom:1px solid rgba(214,179,106,.14);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.cdi-menu-head .who{display:flex;flex-direction:column;gap:4px;min-width:0;}
.cdi-menu-head .who-label{font-size:13px;letter-spacing:.05em;text-transform:uppercase;color:#aaa39a;}
.cdi-menu-head .who-name{font-size:15px;font-weight:500;color:#f1eee8;word-break:break-all;}
.cdi-menu-close{background:transparent;border:none;color:#aaa39a;font-size:30px;cursor:pointer;line-height:1;padding:4px 8px;}
.cdi-menu-close:hover{color:#d6b36a;}

.cdi-menu-section{padding:14px 0;border-bottom:1px solid rgba(214,179,106,.10);}
.cdi-menu-section:last-child{border-bottom:none;}
.cdi-menu-section-label{padding:0 22px 8px;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:#7d766c;}

.cdi-menu-item{
  display:flex;
  align-items:center;
  gap:14px;
  width:100%;
  padding:14px 22px;
  background:transparent;
  border:none;
  color:#f1eee8;
  font-family:inherit;
  font-size:16px;
  font-weight:400;
  text-align:left;
  cursor:pointer;
  transition:background .15s;
  text-decoration:none;
  box-sizing:border-box;
}
.cdi-menu-item:hover{background:rgba(214,179,106,.08);color:#d6b36a;}
.cdi-menu-item .ico{font-size:20px;width:28px;text-align:center;display:inline-flex;align-items:center;justify-content:center;}
.cdi-menu-item.logout{color:#ff5c7a;}
.cdi-menu-item.logout:hover{background:rgba(255,92,122,.1);color:#ff5c7a;}
.cdi-menu-foot{padding:18px 22px 24px;text-align:center;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#7d766c;opacity:.8;}

/* Estado activo igual al menu principal */
.cdi-menu-item.active{
  background:rgba(30,144,255,.14);
  color:#1e90ff;
  border-left:3px solid #1e90ff;
  padding-left:19px;
}
.cdi-menu-item.active .ico{
  color:#1e90ff;
}

/* Logout integrado a estetica CDI */
.cdi-menu-item.logout,
.cdi-menu-item.logout:hover{
  background:transparent !important;
  color:#f1eee8 !important;
  border-radius:0 !important;
  font-weight:400 !important;
}

.cdi-menu-item.logout:hover{
  background:rgba(30,144,255,.10) !important;
  color:#1e90ff !important;
}

.cdi-menu-item.logout .ico{
  color:inherit !important;
}

/* Forzar visibilidad de las 3 rayas del menu */
.cdi-menu-btn span{
  display:block !important;
  width:22px !important;
  height:2px !important;
  background:#d6b36a !important;
  border-radius:2px !important;
  opacity:1 !important;
}

.cdi-menu-btn.active span:nth-child(1),
.cdi-menu-btn.active span:nth-child(3){
  background:#1e90ff !important;
}

/* Mantener hamburguesa CDI siempre a la derecha */
.cdi-menu-btn{
  margin-left:auto !important;
  order:99 !important;
}

/* Mantener hamburguesa CDI siempre a la derecha */
.cdi-menu-btn{
  margin-left:auto !important;
  order:99 !important;
}