
.boton-mt{background:#EF7B00;color:#fff;border:none;border-radius:26px;padding:11px 18px;
          font-weight:700;font-size:14px;cursor:pointer;width:100%}
.boton-mt:hover{background:#d96f00}
.aviso-mt{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(140%);
          background:#1f2430;color:#fff;padding:13px 22px;border-radius:26px;font-weight:600;
          transition:transform .25s;z-index:9999}
.aviso-mt.ver{transform:translateX(-50%) translateY(0)}
/* El panel del carrito: la animación del template lo deja invisible, así que
   al abrirlo se le pone esta clase, que manda sobre lo demás. */
.w-commerce-commercecartcontainerwrapper.mt-abierto{display:flex !important;opacity:1 !important}

/* El carrito se adapta a lo que lleva dentro.

   Con pocos productos el panel se encoge y se ve entero. Con muchos, la
   lista se desplaza por dentro, pero la cabecera y el pie no se mueven:
   el botón de pagar tiene que estar SIEMPRE a la vista, porque si hay que
   bajar a buscarlo hay clientes que no lo encuentran y se van. */
.w-commerce-commercecartcontainer.cart-container{
  display:flex;
  flex-direction:column;
  height:auto;
  max-height:min(88vh, 900px);
}
.w-commerce-commercecartheader.cart-header{flex:0 0 auto}
.cart-form-wrapper,
.w-commerce-commercecartform{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0;              /* sin esto el hijo no deja encoger al padre */
}
.w-commerce-commercecartlist{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
.w-commerce-commercecartfooter.cart-footer{
  flex:0 0 auto;
  position:sticky;
  bottom:0;
  background:#fff;
  box-shadow:0 -8px 20px rgba(0,0,0,.07);
}
/* En el teléfono el panel ocupa lo que haga falta, pero nunca tapa la
   barra del navegador: 100dvh tiene en cuenta la barra que aparece y
   desaparece al desplazar. */
@media (max-width:767px){
  .w-commerce-commercecartcontainer.cart-container{max-height:min(92dvh, 92vh)}
}

/* Al deslizar dentro del carrito se movía la página de detrás: eso es lo
   que hace que parezca que el carrito "no baja". overscroll-behavior corta
   esa cadena, y con el carrito abierto la página de detrás se queda
   quieta del todo. */
.w-commerce-commercecartlist{overscroll-behavior:contain}
.w-commerce-commercecartcontainer.cart-container{overscroll-behavior:contain}
body.mt-carrito-abierto{overflow:hidden}
/* El panel se queda donde está aunque la página de detrás esté bloqueada. */
.w-commerce-commercecartcontainerwrapper.mt-abierto{overscroll-behavior:contain}
