/* ==========================================================
   MIRA STILOS - SHOP
========================================================== */

/* container */

.ast-left-sidebar #primary {
    padding-left:20px;
}

.ast-left-sidebar #secondary {
    padding-right:20px;
}


/* GRID */

ul.products{
    display:grid !important;
    grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
    column-gap:10px !important;
    padding:0;
    margin:0;
}

/* ==========================================================
   CARD
========================================================== */

.produto-card{
    text-align: center !important;
    display:flex;
    flex-direction:column;

    height:100%;
    border:1px solid #ececec;
    background:#fff;

    overflow:hidden;

    transition:.30s ease;

    
}

.produto-card:hover{

        transform:translateY(-4px);

    box-shadow:0 12px 15px rgba(0,0,0,.12);

    border-color:#ddd;


}

.produto-link{

    display:flex;
    flex-direction:column;
    flex:1;

    color:inherit;
    text-decoration:none;

}

/* ==========================================================
   IMAGEM
========================================================== */

.produto-imagem{

    aspect-ratio:5/7;

    overflow:hidden;

    background:#f6f6f6;

}

.produto-foto{

    width:100%;
    height:100%;

    object-fit:cover;

    transition:.45s;

}

.produto-card:hover .produto-foto{

    transform:scale(1.05);

}

/* ==========================================================
   INFORMAÇÕES
========================================================== */

.produto-info{

    display:flex;
    flex-direction:column;

    flex:1;

    padding:5px;

}

.produto-titulo{

    margin:0;

    font-size:15px;

    font-weight:600;


    color: var(--wp--preset--color--ast-global-color-3);

    min-height:52px;

    display:-webkit-box;

    -webkit-line-clamp:2;

    -webkit-box-orient:vertical;

    overflow:hidden;

}

.produto-link:hover .produto-titulo{

    color:#000;

}

/* PREÇO */

.produto-preco{

    margin-top:5px;

    font-size:26px;

    font-weight:700;

    color:#111;

}

.produto-preco del{

    display:block;

    color:#999;

    font-size:15px;

    margin-bottom:4px;

}

.produto-preco ins{

    text-decoration:none;

}

/* ==========================================================
   BOTÃO
========================================================== */

.produto-botao{

    margin-top:auto;

    padding:0 18px 18px;

}

.produto-botao .button{

    width:100%;

    display:flex;

    justify-content:center;

    align-items:center;

    height:48px;

    background:#111;

    color:#fff;

    border:none;

    border-radius:10px;

    font-size:15px;

    font-weight:600;

    transition:.25s;

    text-decoration:none;

}

.produto-botao .button:hover{

    background:#000;

    transform:translateY(-2px);

}

/* ==========================================================
   REMOVE ESTILOS DO TEMA
========================================================== */

.produto-card img{

    box-shadow:none;

}

.produto-card a{

    text-decoration:none;

}

.produto-card h2{

    margin:0;

}

.produto-card .price{

    color:#111;

}

/* ==========================================================
   RESPONSIVO
========================================================== */

@media(max-width:1024px){

    ul.products{

        grid-template-columns:repeat(3,1fr);

    }

}

@media(max-width:768px){

    ul.products{

        grid-template-columns:repeat(2,1fr);

        gap:16px !important;

    }

    .produto-info{

        padding:14px;

    }

    .produto-titulo{

        font-size:15px;

        min-height:44px;

    }

    .produto-preco{

        font-size:22px;

    }

    .produto-botao{

        padding:0 14px 14px;

    }

}

@media(max-width:480px){

    ul.products{

        gap:12px !important;

    }

}