/* ============================================================
   CS TUCUMAN · MOBILE NAV V32.5
   Fix definitivo: menú móvil independiente del nav desktop.
   ============================================================ */

.cst325-mobile-drawer{
 display:none;
}

/* desktop queda exactamente igual */
@media(min-width:821px){
 .cst325-mobile-drawer{display:none!important}
}

/* mobile */
@media(max-width:820px){
 body{
  padding-top:70px!important;
 }

 /* El nav desktop no se reutiliza visualmente en móvil.
    Esto evita que CSS viejos lo dejen con altura 0 o contenido invisible. */
 .cst320-nav-row{
  height:0!important;
  min-height:0!important;
  overflow:visible!important;
  border:0!important;
 }
 .cst320-nav{
  display:none!important;
 }

 /* El botón hamburguesa siempre visible */
 #cst320MenuBtn,
 .cst320-menu-btn{
  position:relative!important;
  z-index:5105!important;
  width:44px!important;
  min-width:44px!important;
  height:44px!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid #272727!important;
  border-radius:10px!important;
  background:#080808!important;
  color:#fff!important;
  opacity:1!important;
  visibility:visible!important;
 }
 .cst320-menu-btn ion-icon{
  display:block!important;
  color:#fff!important;
  font-size:22px!important;
  opacity:1!important;
  visibility:visible!important;
 }

 /* backdrop */
 .cst320-backdrop{
  position:fixed!important;
  z-index:5090!important;
  inset:0!important;
  display:none!important;
  background:rgba(0,0,0,.82)!important;
  backdrop-filter:blur(6px)!important;
  -webkit-backdrop-filter:blur(6px)!important;
 }
 body.cst325-mobile-open .cst320-backdrop,
 body.cst325-account-open .cst320-backdrop{
  display:block!important;
 }

 /* Drawer real, agregado al BODY por JS */
 .cst325-mobile-drawer{
  position:fixed!important;
  z-index:5100!important;
  top:72px!important;
  left:10px!important;
  right:10px!important;
  width:auto!important;
  max-height:calc(100dvh - 84px)!important;
  padding:10px!important;
  display:block!important;
  overflow:auto!important;
  overscroll-behavior:contain!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(-8px) scale(.985)!important;
  border:1px solid #242424!important;
  border-radius:14px!important;
  background:#050505!important;
  box-shadow:0 35px 100px rgba(0,0,0,.85)!important;
  transition:opacity .14s ease,transform .14s ease,visibility .14s ease!important;
 }
 body.cst325-mobile-open .cst325-mobile-drawer{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:none!important;
 }

 .cst325-mobile-drawer-head{
  min-height:52px!important;
  padding:0 8px 9px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  border-bottom:1px solid #171717!important;
 }
 .cst325-mobile-drawer-head span small,
 .cst325-mobile-drawer-head span b{
  display:block!important;
 }
 .cst325-mobile-drawer-head span small{
  color:#ff8420!important;
  font-size:6px!important;
  font-weight:900!important;
  letter-spacing:1.5px!important;
 }
 .cst325-mobile-drawer-head span b{
  margin-top:4px!important;
  color:#fff!important;
  font-size:14px!important;
  font-weight:900!important;
 }
 .cst325-mobile-close{
  width:38px!important;
  height:38px!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid #252525!important;
  border-radius:9px!important;
  background:#090909!important;
  color:#aaa!important;
  font-size:20px!important;
 }

 .cst325-mobile-links{
  padding:8px 0 2px!important;
  display:grid!important;
  gap:4px!important;
 }
 .cst325-mobile-links>a{
  position:relative!important;
  width:100%!important;
  min-height:58px!important;
  padding:0 13px!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr) 24px!important;
  align-items:center!important;
  gap:10px!important;
  border:1px solid transparent!important;
  border-radius:10px!important;
  background:transparent!important;
  color:#e8e8e8!important;
  text-decoration:none!important;
  opacity:1!important;
  visibility:visible!important;
 }
 .cst325-mobile-links>a:hover,
 .cst325-mobile-links>a:active{
  background:#0a0a0a!important;
  border-color:#1d1d1d!important;
 }
 .cst325-mobile-links>a.active{
  border-color:#3a2717!important;
  background:#0b0805!important;
  color:#ff8a24!important;
 }
 .cst325-mobile-links>a.active:before{
  content:""!important;
  position:absolute!important;
  left:0!important;
  top:12px!important;
  bottom:12px!important;
  width:2px!important;
  border-radius:999px!important;
  background:#ff7a00!important;
 }

 .cst325-mobile-links>a>.ico{
  width:38px!important;
  height:38px!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid #1b1b1b!important;
  border-radius:9px!important;
  background:#090909!important;
 }
 .cst325-mobile-links>a>.ico ion-icon{
  display:block!important;
  color:#aaa!important;
  font-size:18px!important;
  opacity:1!important;
  visibility:visible!important;
 }
 .cst325-mobile-links>a.active>.ico ion-icon{
  color:#ff8420!important;
 }

 .cst325-mobile-links>a>.copy{
  min-width:0!important;
  display:block!important;
  opacity:1!important;
  visibility:visible!important;
 }
 .cst325-mobile-links>a>.copy b,
 .cst325-mobile-links>a>.copy small{
  display:block!important;
  opacity:1!important;
  visibility:visible!important;
 }
 .cst325-mobile-links>a>.copy b{
  color:inherit!important;
  font-size:11px!important;
  font-weight:900!important;
 }
 .cst325-mobile-links>a>.copy small{
  margin-top:3px!important;
  color:#656565!important;
  font-size:6.5px!important;
  line-height:1.3!important;
 }
 .cst325-mobile-links>a>.arrow{
  display:block!important;
  color:#555!important;
  font-size:15px!important;
 }

 .cst325-mobile-play{
  min-height:48px!important;
  margin-top:7px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  border-radius:9px!important;
  background:#ff7a00!important;
  color:#050505!important;
  text-decoration:none!important;
  font-size:8px!important;
  font-weight:900!important;
 }

 /* Cuenta móvil siempre por arriba del overlay */
 .cst320-account-drop{
  z-index:5110!important;
  top:72px!important;
  left:10px!important;
  right:10px!important;
  width:auto!important;
  max-height:calc(100dvh - 84px)!important;
  background:#050505!important;
  border-color:#242424!important;
 }
 body.cst325-account-open .cst320-account.open .cst320-account-drop{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
 }

 body.cst325-mobile-open,
 body.cst325-account-open{
  overflow:hidden!important;
 }
}

/* ============================================================
   CS TUCUMAN · MOBILE NAV V32.6 · DRAWER GRANDE
   Override final: ocupa casi todo el ancho y toda la altura.
   ============================================================ */
@media(max-width:820px){
 html,body{max-width:100%;overflow-x:hidden}
 body.cst325-mobile-open,
 body.cst325-account-open{overflow:hidden!important}

 .cst325-mobile-drawer{
  top:0!important;
  bottom:0!important;
  left:0!important;
  right:auto!important;
  width:min(94vw,430px)!important;
  max-width:430px!important;
  height:100dvh!important;
  max-height:100dvh!important;
  padding:14px 14px calc(18px + env(safe-area-inset-bottom))!important;
  border:0!important;
  border-right:1px solid #252525!important;
  border-radius:0 18px 18px 0!important;
  box-sizing:border-box!important;
  transform:translateX(-102%)!important;
  background:#050505!important;
  box-shadow:30px 0 90px rgba(0,0,0,.9)!important;
  overflow-y:auto!important;
 }
 body.cst325-mobile-open .cst325-mobile-drawer{
  transform:translateX(0)!important;
 }

 .cst325-mobile-drawer-head{
  position:sticky!important;
  top:-14px!important;
  z-index:2!important;
  min-height:76px!important;
  padding:14px 2px 12px!important;
  background:#050505!important;
 }
 .cst325-mobile-drawer-head span small{
  font-size:10px!important;
  letter-spacing:1.8px!important;
 }
 .cst325-mobile-drawer-head span b{
  margin-top:5px!important;
  font-size:21px!important;
  line-height:1!important;
 }
 .cst325-mobile-close{
  width:46px!important;
  height:46px!important;
  border-radius:12px!important;
  font-size:25px!important;
 }

 .cst325-mobile-links{
  padding:14px 0 6px!important;
  gap:8px!important;
 }
 .cst325-mobile-links>a{
  min-height:68px!important;
  padding:0 14px!important;
  grid-template-columns:46px minmax(0,1fr) 24px!important;
  gap:12px!important;
  border-color:#171717!important;
  border-radius:13px!important;
  background:#080808!important;
 }
 .cst325-mobile-links>a.active{
  background:#100a05!important;
  border-color:#533012!important;
 }
 .cst325-mobile-links>a.active:before{
  top:11px!important;
  bottom:11px!important;
  width:3px!important;
 }
 .cst325-mobile-links>a>.ico{
  width:46px!important;
  height:46px!important;
  border-radius:11px!important;
 }
 .cst325-mobile-links>a>.ico ion-icon{
  font-size:22px!important;
 }
 .cst325-mobile-links>a>.copy b{
  font-size:15px!important;
  line-height:1.15!important;
  letter-spacing:.1px!important;
 }
 .cst325-mobile-links>a>.copy small{
  margin-top:5px!important;
  font-size:11px!important;
  line-height:1.25!important;
  color:#8a8a8a!important;
 }
 .cst325-mobile-links>a>.arrow{
  font-size:18px!important;
 }

 .cst325-mobile-play{
  position:sticky!important;
  bottom:0!important;
  min-height:58px!important;
  margin-top:12px!important;
  border-radius:12px!important;
  font-size:14px!important;
  letter-spacing:.3px!important;
  box-shadow:0 -12px 28px #050505,0 10px 30px rgba(255,122,0,.12)!important;
 }
 .cst325-mobile-play ion-icon{font-size:18px!important}

 /* El menú de cuenta usa el mismo tamaño cómodo */
 .cst320-account-drop{
  top:0!important;
  bottom:0!important;
  left:0!important;
  right:auto!important;
  width:min(94vw,430px)!important;
  max-width:430px!important;
  height:100dvh!important;
  max-height:100dvh!important;
  border-radius:0 18px 18px 0!important;
  padding:18px!important;
  overflow:auto!important;
 }
 .cst320-account-drop header{padding:10px 4px 16px!important}
 .cst320-account-drop header span{font-size:10px!important}
 .cst320-account-drop header b{font-size:20px!important}
 .cst320-account-drop header small{font-size:12px!important}
 .cst320-account-drop>a{
  min-height:54px!important;
  font-size:14px!important;
  border-radius:10px!important;
 }
 .cst320-account-drop>a ion-icon{font-size:19px!important}
 .cst320-account-drop .label{font-size:10px!important}

 #cst320MenuBtn,.cst320-menu-btn{
  width:48px!important;
  min-width:48px!important;
  height:48px!important;
 }
 .cst320-menu-btn ion-icon{font-size:25px!important}
}

@media(max-width:390px){
 .cst325-mobile-drawer,
 .cst320-account-drop{
  width:96vw!important;
 }
 .cst325-mobile-links>a{
  min-height:64px!important;
 }
 .cst325-mobile-links>a>.copy b{font-size:14px!important}
 .cst325-mobile-links>a>.copy small{font-size:10.5px!important}
}

/* =========================================================
   V32.7 · PANELES VISIBLES EN MOBILE
   ========================================================= */
@media (max-width:820px){
 .cst327-mobile-panels-source{display:none!important}
 .cst327-mobile-section-title{
   margin:14px 2px 7px!important;
   padding:11px 4px 7px!important;
   border-top:1px solid rgba(255,255,255,.09)!important;
   display:flex!important;
   align-items:flex-end!important;
   justify-content:space-between!important;
   gap:10px!important;
 }
 .cst327-mobile-section-title span{
   color:#ff8a24!important;
   font-family:'Rajdhani',sans-serif!important;
   font-size:15px!important;
   line-height:1!important;
   font-weight:800!important;
   letter-spacing:.9px!important;
 }
 .cst327-mobile-section-title small{
   color:#6f7680!important;
   font-size:10px!important;
   font-weight:700!important;
   letter-spacing:.2px!important;
 }
 .cst325-mobile-links>a.cst327-mobile-panel-link{
   min-height:64px!important;
   border-color:rgba(255,138,36,.22)!important;
   background:linear-gradient(90deg,rgba(255,138,36,.075),rgba(255,255,255,.018))!important;
 }
 .cst325-mobile-links>a.cst327-mobile-panel-link>.ico{
   border-color:rgba(255,138,36,.26)!important;
   background:rgba(255,138,36,.08)!important;
 }
 .cst325-mobile-links>a.cst327-mobile-panel-link>.ico ion-icon,
 .cst325-mobile-links>a.cst327-mobile-panel-link>.arrow{
   color:#ff8a24!important;
 }
 .cst325-mobile-links>a.cst327-mobile-panel-link>.copy b{
   color:#fff!important;
   font-size:15px!important;
 }
 .cst325-mobile-links>a.cst327-mobile-panel-link>.copy small{
   color:#8d949e!important;
   font-size:11px!important;
 }
}