/* =========================================
PÁGINA INDIVIDUAL DO PRODUTO
========================================= */

.pagina-produto{
    max-width:1200px;
    margin:50px auto;
    padding:0 40px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:40px;
}

/* GALERIA DO PRODUTO */

.produto-galeria{
    background:#fff;
    border-radius:22px;
    padding:25px;
    box-shadow:0 8px 25px rgba(0,0,0,0.06);
}

/* IMAGEM PRINCIPAL */

.imagem-principal{
    height:450px;
    background:#f1f1f1;
    border-radius:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
}

.imagem-principal img{
    width:100%;
    height:100%;
    object-fit:contain;
}

/* MINIATURAS */

.miniaturas{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:12px;
    margin-top:15px;
}

.miniaturas img{
    height:90px;
    width:100%;
    object-fit:contain;
    background:#f4f4f4;
    border-radius:12px;
    padding:8px;
    cursor:pointer;
    border:2px solid transparent;
}

.miniaturas img:hover{
    border-color:#34F6E5;
}

/* INFORMAÇÕES DO PRODUTO */

.produto-info-detalhe{
    background:#fff;
    border-radius:22px;
    padding:35px;
    box-shadow:0 8px 25px rgba(0,0,0,0.06);
}

.produto-status{
    display:inline-block;
    background:#34F6E5;
    padding:8px 14px;
    border-radius:20px;
    font-size:13px;
    font-weight:bold;
    margin-bottom:15px;
}

.produto-info-detalhe h1{
    font-size:34px;
    margin-bottom:12px;
}

.produto-avaliacao{
    color:#555;
    margin-bottom:20px;
}

.produto-preco-detalhe{
    display:block;
    font-size:38px;
    margin-bottom:25px;
}

.produto-descricao{
    color:#444;
    line-height:1.6;
    margin-bottom:20px;
}

.produto-estoque{
    margin-bottom:25px;
}

/* BOTÕES DO PRODUTO */

.produto-acoes{
    display:flex;
    gap:15px;
    margin-bottom:30px;
}

.btn-comprar,
.btn-carrinho{
    flex:1;
    padding:16px;
    border-radius:14px;
    font-weight:bold;
    cursor:pointer;
    transition:0.3s;
}

.btn-comprar{
    background:#111;
    color:#fff;
    border:2px solid #111;
}

.btn-comprar:hover{
    background:#34F6E5;
    color:#000;
    border-color:#34F6E5;
}

.btn-carrinho{
    background:#fff;
    color:#111;
    border:2px solid #111;
}

.btn-carrinho:hover{
    border-color:#34F6E5;
    color:#000;
}

/* BOX DO VENDEDOR */

.box-vendedor{
    background:#f7f7f7;
    padding:20px;
    border-radius:16px;
}

.box-vendedor h3{
    margin-bottom:8px;
}

.box-vendedor span{
    color:green;
    font-weight:bold;
}

/* PRODUTOS RELACIONADOS */

.produtos-relacionados{
    padding:40px;
    background:#f5f5f5;
}

/* RESPONSIVO */

@media(max-width:900px){
    .pagina-produto{
        grid-template-columns:1fr;
    }
}
/* =========================================
MINIATURAS DO PRODUTO
========================================= */

.miniaturas{
    display:flex;
    gap:14px;
    margin-top:20px;
    flex-wrap:wrap;
}

.miniatura-item{
    width:110px;
    height:110px;

    object-fit:contain;

    background:#f5f5f5;

    border:2px solid transparent;

    border-radius:14px;

    cursor:pointer;

    transition:0.25s;
}

.miniatura-item:hover{
    border-color:#34F6E5;
    transform:scale(1.04);
}
/* =========================================
CORRIGIR MINIATURAS LADO A LADO
========================================= */

#miniaturasProduto{
    display: flex;
    flex-direction: row;
    gap: 14px;
    margin-top: 20px;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

#miniaturasProduto .miniatura-item{
    width: 100px;
    height: 90px;
    object-fit: contain;
    background: #f5f5f5;
    border-radius: 14px;
    cursor: pointer;
    border: 2px solid transparent;
}

#miniaturasProduto .miniatura-item:hover{
    border-color: #34F6E5;
    transform: scale(1.05);
}
/* =========================================
TRAVAR TAMANHO DA IMAGEM PRINCIPAL
========================================= */

.produto-galeria{
    height: 620px;
    overflow: hidden;
}

.produto-galeria #produtoImagem{
    width: 100%;
    height: 500px;
    object-fit: contain;
    display: block;
}
/* =========================================
CORRIGIR CORTE DAS MINIATURAS
========================================= */

.produto-galeria{
    height: auto;
    min-height: 620px;
    padding-bottom: 30px;
    overflow: visible;
}

#miniaturasProduto{
    margin-bottom: 10px;
    padding-bottom: 10px;
}

#miniaturasProduto .miniatura-item{
    overflow: visible;
}
/* =========================================
ZOOM NA IMAGEM PRINCIPAL DO PRODUTO
========================================= */

/* Caixa da imagem grande */
.produto-galeria{
    overflow: hidden;
}

/* Imagem principal */
#produtoImagem{
    transition: transform 0.35s ease;
    cursor: zoom-in;
}

/* Quando passar o mouse na caixa */
.produto-galeria:hover #produtoImagem{
    transform: scale(1.15);
}
/* =========================================
CARROSSEL DE IMAGENS
========================================= */

.produto-galeria{
    position: relative;
}

/* BOTÕES */
.btn-carrossel{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);

    width: 45px;
    height: 45px;

    border: none;
    border-radius: 50%;

    background: rgba(0,0,0,0.7);
    color: white;

    font-size: 24px;
    cursor: pointer;

    z-index: 10;

    transition: 0.3s;
}

/* Hover */
.btn-carrossel:hover{
    background: #34F6E5;
    color: black;
}

/* Esquerda */
.prev{
    left: 15px;
}

/* Direita */
.next{
    right: 15px;
}
/* =========================================
AVALIAÇÕES DO PRODUTO
========================================= */

.avaliacoes-produto{
    max-width:1120px;
    margin:40px auto;
    background:#fff;
    padding:30px;
    border-radius:22px;
    box-shadow:0 8px 25px rgba(0,0,0,0.08);
}

.avaliacoes-produto h2{
    font-size:30px;
    margin-bottom:20px;
}

.media-avaliacoes{
    display:flex;
    align-items:center;
    gap:15px;
    background:#f5f5f5;
    padding:18px;
    border-radius:16px;
    margin-bottom:25px;
}

.media-avaliacoes strong{
    font-size:34px;
}

.media-avaliacoes span{
    font-size:16px;
    color:#555;
}

.form-avaliacao{
    display:flex;
    flex-direction:column;
    gap:15px;
    margin-bottom:30px;
}

.estrelas-avaliacao span{
    font-size:36px;
    cursor:pointer;
    color:#ddd;
    transition:0.2s;
}

.estrelas-avaliacao span.ativa{
    color:#ffc107;
}

.form-avaliacao textarea{
    min-height:120px;
    resize:none;
    border:1px solid #ddd;
    border-radius:14px;
    padding:15px;
    font-size:16px;
}

.form-avaliacao button{
    width:220px;
    padding:14px;
    border:none;
    border-radius:14px;
    background:#34F6E5;
    font-weight:bold;
    cursor:pointer;
}

.avaliacao-item{
    border-top:1px solid #eee;
    padding:18px 0;
}

.avaliacao-item strong{
    display:block;
    margin-bottom:6px;
}

.avaliacao-estrelas{
    color:#ffc107;
    margin-bottom:8px;
}
/* =========================================
SELO COMPRA VERIFICADA
========================================= */

.compra-verificada{
    display:inline-block;
    margin-bottom:8px;
    padding:5px 10px;
    border-radius:20px;
    background:#e8fff9;
    color:#00856f;
    font-size:13px;
    font-weight:bold;
}
.favorito.favoritado{
    color: red;
    font-weight: bold;
}
/* ========================================= */
/* DESCRIÇÃO COMPLETA DO PRODUTO */
/* ========================================= */

/* ========================================= */
/* DESCRIÇÃO COMPLETA DO PRODUTO */
/* ========================================= */

/* DESCRIÇÃO COMPLETA DO PRODUTO */
.descricao-completa-produto{
    grid-column: 1 / -1; /* faz ocupar as duas colunas */
    width: 100%;
    max-width: 1120px;
    margin: 50px auto;
}

.descricao-completa-produto h2{
    font-size: 32px;
    margin-bottom: 20px;
}

.box-descricao-produto{
    width: 100%;
    background: #fff;
    border-radius: 20px;
    padding: 30px;
    font-size: 18px;
    line-height: 1.8;
    box-sizing: border-box;
}
/* =============================== */
/* ABAS ESTILO MARKETPLACE */
/* =============================== */

.abas-produto{
    grid-column: 1 / -1;
    width: 100%;
    max-width: 1120px;
    margin: 50px auto;
}

.botoes-abas-produto{
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
    border-bottom: 2px solid #e5e5e5;
}

.aba-produto{
    background: transparent;
    border: none;
    padding: 15px 25px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    border-bottom: 4px solid transparent;
}

.aba-produto.ativa{
    border-bottom: 4px solid #34F6E5;
}

.conteudo-aba-produto{
    display: none;
    background: #fff;
    border-radius: 22px;
    padding: 35px;
}

.conteudo-aba-produto.ativo{
    display: block;
}

.box-descricao-produto{
    width: 100%;
    background: #fff;
    border-radius: 20px;
    padding: 30px;
    font-size: 18px;
    line-height: 1.8;
    box-sizing: border-box;
}

.box-perguntas-produto textarea{
    width: 100%;
    min-height: 120px;
    padding: 16px;
    border-radius: 14px;
    border: 1px solid #ddd;
    font-size: 16px;
}

.box-perguntas-produto button{
    margin-top: 15px;
    background: #34F6E5;
    border: none;
    padding: 14px 25px;
    border-radius: 12px;
    font-weight: 700;
    cursor: pointer;
}
.pergunta-item{
    background: #f7f7f7;
    border-radius: 14px;
    padding: 18px;
    margin-top: 18px;
    border-left: 4px solid #34F6E5;
}

.pergunta-item p{
    margin: 8px 0 12px;
}

.pergunta-item small{
    color: #666;
}

/* DATA DA PERGUNTA */
.data-pergunta {
    margin-top: 12px;
    margin-bottom: 18px;
    color: #666;
}

/* TÍTULO DA RESPOSTA */
.resposta-vendedor-titulo {
    margin-bottom: 10px;
    margin-top: 5px;
}