﻿/*---------------------------------------------------Body - Cargando --*/
#carritoWidget {

}

#carritoWidget #linkCarritoWidget {
    position:relative;
}





#carritoWidget .cantidad {
    position:absolute;
    left:0px;
    background-color:var(--carrito_cantidadFondo);
    color:var(--carrito_cantidadTexto);
    padding:0px 5px;
    border-radius:20px;
    font-weight:bold;
    font-size:12px;    
}

#carritoWidget .cantidad[data-cantidad="0"] {
    display:none;
}



#carritoWidget.temblar {
  animation: carritoWidgetTemblar 0.82s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}


@keyframes carritoWidgetTemblar {
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }
  
  20%, 80% {
    transform: translate3d(2px, 0, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(-4px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(4px, 0, 0);
  }
}





.carritoAnimCompra {
    position:fixed;
    z-index:10000;
    display:flex;
    align-items: center;
    justify-content: center;
    top:0;
    left:0;
    width:100%;
    height:100%;
    pointer-events: none;/*no quiero que bloquee los clicks*/
}

.carritoAnimCompra .canArt {
    position:absolute;
    font-size:100px;
    font-weight:bold;
    text-shadow: 2px 3px 7px #FEFF6B;
    padding-top:150px;
}

.carritoAnimCompra .imgArt {
    padding-top:100px;
}

.carritoAnimCompra.animate .canArt {
    margin-top:-200px;
}





/*----------------------------------------------------- dialogo carrito*/
#carritoDialogo {
    position:fixed;
    top:10px;
    z-index:200;
    display:flex;
    align-items: center;
    flex-direction:column;
    width:100%;
    transition:all ease-in-out .5s;
    margin-top:-100%;
}

#carritoDialogo.visible {
    margin-top:0%;
}

#carritoDialogo .wrpCarrito {
    position:absolute;
    z-index:300;
    background-color:white;
    border-radius:20px;
    padding:10px;
    display:flex;
    flex-direction:column;
    margin:10px;
    max-height: 95vh;  
    grid-gap:10px;
    box-shadow: 0px 9px 15px 0px rgba(0,0,0,0.24);
}


#carritoDialogo .wrpCarrito > .wrpTitulo {
  background-color:var(--cabeceraFondo);
  text-align:center;
  border-radius:10px;
}

#carritoDialogo .wrpCarrito > .wrpLineas {
  flex-grow:1;
  overflow:auto;
  max-height:100%;
}

#carritoIndex .wrpCarrito > .wrpLineas .sinArticulos ,
#carritoDialogo .wrpCarrito > .wrpLineas .sinArticulos {
    text-align:center;
    font-weight:bold;
    padding:30px 20px;
}

#carritoIndex .wrpCarrito > .wrpLineas .lineas ,
#carritoDialogo .wrpCarrito > .wrpLineas .lineas {
  display:flex;
  flex-direction:column;
  grid-gap: 0px;
  padding-right:10px;
}


#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea {
  border-bottom:1px solid #aaa;
  display:flex;
  flex-direction:row;
  grid-gap:20px;
  padding: 10px 0;
}

#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea:last-child ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea:last-child {
  border:none;
}

#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .imagen ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .imagen {
  max-width: 170px;
  display: flex;
  align-items: center;
  justify-content: center;
}

#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea {
  display:flex;
  flex-direction:column;
  justify-content: space-between;
  flex-grow:1;
  width: 350px;
  grid-gap: 5px;
}

#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .titulo ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .titulo {
  color:var(--colorTexto);
  font-size:16px;
  font-weight:bold;
}


#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .skuPvp ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .skuPvp {
  display:flex;
  flex-direction:row;
  justify-content: space-between;
}

#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .sku ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .sku {
  font-size:14px;
}

#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .pvp ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .pvp {
    color:var(--productBox_pvp);
    font-weight:bolder;
    font-size:20px;
}


#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .pvpAnterior ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .pvpAnterior {
    color: var(--productBox_pvpanterior);
    font-size: 14px;
    font-weight: bold;
    text-decoration: line-through;
}


#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpCantidades ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpCantidades {
  display:flex;
  flex-direction:column;
  grid-gap:20px;
}

#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea input ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea input {
  border:none;
  border-bottom:1px solid #aaa;
}

#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpObservaciones ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpObservaciones {
  grid-gap:0px;
  display:flex;
  flex-direction:column;  
  flex-grow:1;
  height:100%;
}

#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .observaciones ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .observaciones {
  flex-grow:1;
  width:100%;
  height:100%;
  border:none;
  font-size:14px;
  font-weight:bold;
  resize:none;
}

#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .observaciones.tiene ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .observaciones.tiene {
    background-color:antiquewhite;
    border-radius:10px;
}


#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpCantidades ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpCantidades {
  flex-grow:1;
  display:flex;
  flex-direction:column;
  grid-gap:5px;
  width:100%;
  justify-content: space-between;
}

#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpCantidad ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpCantidad {
  display: flex;
  flex-direction: row;
  grid-gap: 10px;
  align-items: center;
}

#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpCantidad .wrpNumericUpDown ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpCantidad .wrpNumericUpDown {
    justify-content: flex-end;
    width: 150px;
}


#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpCantidad .wrpNumericUpDown .btnInc ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpCantidad .wrpNumericUpDown .btnInc {
    height:30px;
    width:30px;
}


#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpCantidad .wrpNumericUpDown input ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpCantidad .wrpNumericUpDown input {
    height:30px;
    border: 1px solid black!important  ;
}

#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .totalLinea ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .totalLinea {
  display:flex;
  grid-gap: 10px;
}

#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .totalLinea .valor ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .totalLinea .valor {
    display:block;
    width: 150px;
    text-align: right;
    font-weight: bold;
    color: var(--productBox_pvp);
}

#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpCantidadTotal ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpCantidadTotal {
  display:flex;
  flex-direction:column;
  grid-gap:5px;
  align-items: flex-end;

}


#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea.guardando .wrpInfoLinea .wrpCantidadTotal ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea.guardando .wrpInfoLinea .wrpCantidadTotal {
  background-image:url(../../img/layout/cargando.svg);
  background-position:left center;
  background-repeat:no-repeat;
  background-size:50px;
}


#carritoIndex .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpBotones ,
#carritoDialogo .wrpCarrito > .wrpLineas .carritoLinea .wrpInfoLinea .wrpBotones {
  display:flex;
  flex-direction:column;
  grid-gap:5px;
  align-items: flex-end;
  display:none;
}


#carritoDialogo .wrpCarrito > .wrpCabecera {
  border-top: 1px solid black;
  display:flex;
  flex-direction:column;
  grid-gap:20px;
  padding-top:10px;
}


#carritoDialogo .wrpCarrito > .wrpTitulo > .titulo {
    font-size:20px;
    padding:5px 10px;
}


#carritoIndex .lineas,
#carritoDialogo .lineas {
    display:flex;
    flex-direction:column;
}

#carritoIndex .wrpCarrito .wrpBotones ,
#carritoDialogo .wrpCarrito > .wrpBotones {
    display:flex;
    align-items: center;
    justify-content: space-around;
    grid-gap:20px;    
    align-items: stretch
}

#carritoIndex .wrpCarrito .wrpBotones .boton ,
#carritoDialogo .wrpCarrito > .wrpBotones .boton {
    width:100%;
    text-align:center;
    display: flex;
    align-items: center;
    justify-content: center;
}

#carritoIndex .wrpCarrito .wrpBotones .btnContinuar ,
#carritoDialogo .wrpCarrito > .wrpBotones .btnContinuar {
    background-color:white;
    border: 1px solid var(--botonBg);
    color:var(--botonBg);
    background-color:var(--botonFg);
}


#carritoIndex .wrpCabecera ul ,
#carritoDialogo .wrpCabecera ul {
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;  
}


#carritoIndex .wrpCabecera li ,
#carritoDialogo .wrpCabecera li {
  display:flex;
  flex-direction:row;
  grid-gap:20px;
  justify-content: space-between;
}

#carritoIndex .wrpCabecera .noAdmiteEnvio ,
#carritoDialogo .wrpCabecera .noAdmiteEnvio {
    justify-content: center;
}

#carritoIndex .wrpCabecera li.oculto ,
#carritoDialogo .wrpCabecera li.oculto {
    display:none;
}

#carritoIndex .wrpCabecera .valor ,
#carritoDialogo .wrpCabecera .valor {
  font-weight:bold;
  color:var(--productBox_pvp);
}

#carritoIndex .wrpCabecera .importeCargoPago ,
#carritoDialogo .wrpCabecera .importeCargoPago {
  display:none;
}

#carritoIndex .wrpCabecera .portesGratisBarra ,
#carritoDialogo .wrpCabecera .portesGratisBarra {
    width:100%;
}


#carritoIndex .wrpCabecera .importePortes.gratis .valor ,
#carritoDialogo .wrpCabecera .importePortes.gratis .valor {
  color:var(--productBox_gratis);
}

@media (max-width: 800px) {
    
    #carritoWidget .cantidad {
        margin-top:-8px;
        margin-left:-8px;
    }

    .carrusel .listadoItem .imagen {
        width :120px!important;
        height:120px!important;
    }
}