/* st26 · MOVIMIENTO estilo Instagram para el panel (complementa st03). Respeta "reducir movimiento".
   Lo orquesta js/sc68.js. Para revertir: quitar st26.css y sc68.js del index.html. */
:root{--am-spring:cubic-bezier(.34,1.56,.64,1);--am-out:cubic-bezier(.22,1,.36,1);}
@media (prefers-reduced-motion:no-preference){
  /* interruptores: perilla con rebote */
  .tgl::after{transition:transform .38s var(--am-spring)!important;}
  .tgl{transition:background .25s ease!important;}

  /* indicadores deslizantes (pestañas y barra inferior) */
  .cfgtabs{position:relative;}
  .cfgtabs.am-has-ind .cfgtab.on{border-bottom-color:transparent!important;}
  .am-ind{position:absolute;bottom:-1px;left:0;height:2px;width:0;border-radius:2px;background:var(--blue);pointer-events:none;
    transition:transform .42s var(--am-out),width .42s var(--am-out);will-change:transform,width;}
  .am-bind{position:absolute;top:0;left:0;height:3px;width:0;border-radius:0 0 4px 4px;background:var(--mint,#1fbf8f);pointer-events:none;
    transition:transform .45s var(--am-out),width .45s var(--am-out);}
  .mbottom .mb-item svg{transition:transform .35s var(--am-spring);}
  .mbottom .mb-item.on svg{transform:translateY(-1px) scale(1.12);}

  /* barra superior: sombra suave al bajar */
  .topbar{transition:box-shadow .3s ease;}
  .topbar.am-scrolled{box-shadow:0 8px 20px -14px rgba(10,20,50,.35);}

  /* cajón lateral y fondo */
  .side-backdrop.show{animation:amFade .28s ease both;}
  @keyframes amFade{from{opacity:0}to{opacity:1}}

  /* fantasma de salida (modales) */
  .am-ghost{pointer-events:none!important;}
}
@media (prefers-reduced-motion:reduce){ .am-ind,.am-bind{transition:none!important;} }

/* ── Editor de producto (3 fases): más aire, etiquetas legibles, navegación fija abajo ── */
#pe-box{max-width:580px!important;border-radius:26px;}
#pe-box .mtop{padding:34px 36px 14px;}
#pe-box .mtitle{font-size:1.35rem;letter-spacing:-.01em;margin-bottom:6px;}
#pe-box .msubt{font-size:.8rem;}
#pe-box .mbody{padding:0 36px 0;}
#pe-box .mform{gap:0;}
#pe-box .pe-phase{display:flex;flex-direction:column;gap:22px;padding-bottom:10px;animation:peFase .32s cubic-bezier(.32,.72,0,1);}
@keyframes peFase{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
#pe-box #pe-sale-block{display:flex;flex-direction:column;gap:20px;}
#pe-box #pe-sale-block > *{margin-top:0!important;}
#pe-box .mfg{gap:9px;}
#pe-box .mfg label{font-family:"DM Sans",sans-serif;font-size:.8rem;font-weight:600;letter-spacing:0;text-transform:none;color:rgba(255,255,255,.78);}
#pe-box .mfg label span{font-size:.72rem!important;color:rgba(255,255,255,.38)!important;font-weight:400!important;}
#pe-box .mi{padding:14px 16px;border-radius:13px;font-size:.92rem;background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.12);}
#pe-box textarea.mi{line-height:1.5;min-height:96px;}
#pe-box .mrow2{gap:16px;}
/* textos de ayuda: ya no diminutos */
#pe-box [style*="font-size:.6rem"],#pe-box [style*="font-size:.62rem"],#pe-box [style*="font-size:.64rem"]{font-size:.72rem!important;line-height:1.6!important;}
#pe-box [style*="font-size:.66rem"],#pe-box [style*="font-size:.68rem"]{font-size:.76rem!important;line-height:1.55!important;}
/* tarjetas internas (anticipo, horario, prelanzamiento, mensualidad…) con más respiro */
#pe-box #pe-reserva-block,#pe-box #pe-prelanz-block,#pe-box #pe-cita-hours,#pe-box #pe-link-hint{padding:1.2rem 1.25rem!important;border-radius:16px!important;}
#pe-box #pe-info-box,#pe-box #pe-unlimited-box,#pe-box #pe-monthly-box,#pe-box #pe-askaddr-box,#pe-box #pe-meet-box{padding:1rem 1.1rem!important;border-radius:14px!important;gap:12px!important;}
#pe-box #pe-askaddr-box,#pe-box #pe-meet-box{margin-top:.8rem!important;}
/* modo de venta: botones más grandes */
#pe-box [id^="pe-mode-"]{padding:.85rem .6rem!important;border-radius:14px!important;font-size:.84rem!important;}
/* encabezado de cada fase */
#pe-box .pe-phase > div:first-child{margin:4px 0 2px!important;}
#pe-box .pe-phase > div:first-child > div:first-child{font-size:1.1rem!important;letter-spacing:-.01em;}
#pe-box .pe-phase > div:first-child > div:last-child{font-size:.8rem!important;margin-top:4px!important;}
/* pasos */
#pe-box #pe-stepper{gap:10px!important;margin:6px 0 24px!important;}
#pe-box #pe-stepper button{padding:.8rem .4rem!important;border-radius:14px!important;font-size:.76rem!important;gap:8px!important;}
#pe-box #pe-stepper .pe-st-n{width:22px!important;height:22px!important;line-height:22px!important;font-size:.7rem!important;}
/* navegación fija abajo */
#pe-box #pe-nav{position:sticky;bottom:0;z-index:5;margin:18px -36px 0!important;padding:16px 36px calc(18px + env(safe-area-inset-bottom))!important;gap:12px!important;
  background:linear-gradient(180deg,rgba(7,17,42,0),#07112a 28%);}
#pe-box #pe-nav button{padding:.95rem 1.2rem!important;border-radius:14px!important;font-size:.9rem!important;}
#pe-box #pe-nav .mbtn{margin:0!important;width:auto!important;flex:1;}
#pe-box #pe-del-wrap{padding:4px 0 26px;}
@media (max-width:760px){
  #pe-box{max-width:100%!important;max-height:94vh;border-radius:22px;}
  #pe-box .mtop{padding:28px 20px 10px;}
  #pe-box .mbody{padding:0 20px;}
  #pe-box #pe-nav{margin:16px -20px 0!important;padding:14px 20px calc(16px + env(safe-area-inset-bottom))!important;}
  #pe-box .mrow2{grid-template-columns:1fr 1fr;gap:12px;}
  #pe-box #pe-stepper button span:last-child{font-size:.68rem;}
}
/* etiquetas dentro de las tarjetas claras: texto oscuro */
#pe-box #pe-reserva-block label,#pe-box #pe-prelanz-block label,#pe-box #pe-link-hint label{color:#1f2a44!important;}
#pe-box #pe-reserva-block label span,#pe-box #pe-prelanz-block label span,#pe-box #pe-link-hint label span{color:#6b7690!important;}