/*-----------------------------------------------
                ESTILOS SCROLL
-------------------------------------------------*/


/*SCROOL COLOR*/

::-webkit-scrollbar {
  width: 8px;               /* width of the entire scrollbar */
}

::-webkit-scrollbar-track {
  background:transparent;
}

::-webkit-scrollbar-thumb {
  background-color: var(--grisoscuro4);    /* color of the scroll thumb */
  border-radius: 20px;       /* roundness of the scroll thumb */
  transition:all ease .5s;
}

::-webkit-scrollbar-thumb:hover {
  background-color: var(--grisoscuro3);
}

  .modalCarrito{
    background-color:var(--blanco);
    width:350px;height:100vh;min-height:400px;overflow:hidden;
    box-shadow:0 -3px 23px -9px var(--colorshadow);
    position:fixed;
    top:0;right:-100%;
    z-index:1000001;
    padding:10px;
    transition:all ease-in-out 0.5s;
  }

  .movedCarritoModal{
    right:0%;overflow:auto;
  }

  
  .flexinteriorProductoItem{
            display: flex;
            width:100%;
            padding-top:10px;padding-bottom:10px;
            border-bottom:1px solid var(--grisclaro);
        }

        .imgproductoitemresumen{
            width:80px;height:90px;
            margin-right:20px;
        }
        .imgproductoitemresumen img{
            width:100%;height:100%;
        }

        .infoproductoitemresumen{
            width:auto;
        }

        .titleitemproducto{
            font-weight:500;font-size:14px;padding-bottom:5px;
        }

        .minititle{
            font-weight:500;font-size:13px;padding-right:10px;
        }

        .unidadesitemproducto{
            font-weight:500;font-size:13px;
        }

             
        .flexinteriorResumen{
            display:flex;
            justify-content:space-between;
            padding:10px 0px;
        }

        .titledentroFlexResumen{
            font-weight:600;font-size:15px;
        }

        .flexButtonsVerTerminar{
          display: flex;
          width: 100%;
          justify-content: space-between;
        }

        .flexButtonsVerTerminar a{
          padding:10px 32px;
          text-decoration:none;
          border-radius:5px;
          font-size:14px;
          background-color:var(--principal);
          color:var(--blanco);
          transition: all ease .3s;
        }


        .flexButtonsVerTerminar a:hover{
          background-color:var(--principalhover);
        }

        .flexButtonsVerTerminar a:nth-child(2) {
          background-color: var(--negro); 
          color: var(--blanco);          
        }

        .flexButtonsVerTerminar a:nth-child(2):hover {
           background-color: var(--secundario); 
        }


        
        body.dark .flexButtonsVerTerminar a:nth-child(2){
          background-color: var(--secundario); 
        }

         body.dark .flexButtonsVerTerminar a:nth-child(2):hover{
          background-color: var(--secundariohover); 
        }




        .titleResumenPedido{
            font-size:20px;
            font-weight:500;
            width:100%;
            display: flex;
            justify-content: space-between;
            align-items:center;
            padding:8px;
            margin-top:-4px;
            margin-bottom:5px;
            border-bottom:1px solid var(--grisclaro);
        }

        body.dark .modalCarrito{
            background-color: var(--negro);
            color:var(--blanco);
        }

        #overlayCarrito{
          background-color:rgba(54, 54, 54, 0.335);top:0;
          height:100vh;position:fixed;z-index:1000000;right:0;
          transition: all ease-in-out 0.1s;width:100%;display:none;
        }

        .titleResumenPedido span{
          margin-left:104px;font-size:22px;
          cursor:pointer;transition: all ease-in-out 0.5s;
        }

        #btnCerrarModalOverlayCarrito{
          text-align:center;font-size:22px;
          cursor:pointer;transition: all ease-in-out 0.5s;}

          
        @media(max-width:400px){
          .modalCarrito{width:290px;}
          .flexButtonsVerTerminar a{padding:10px 20px;}
          .titleResumenPedido span{margin-left:34px;}
        }