/* =============================================================
   GM Atelie de Joias — Estilos da Pagina do Produto (Semana 06)
   ============================================================= */

/* Galeria */
#gallery-main-wrap {
    cursor: zoom-in;
}

/* Botao de atributo ativo */
.product-option-btn.active,
.product-option-btn.\\!border-\\[\\#c8a96e\\] {
    border-color: #c8a96e;
    color: #2d2a24;
    background-color: #faf8f4;
}

.product-size-btn.active {
    border-color: #c8a96e;
    color: #2d2a24;
    background-color: #faf8f4;
}

/* Descricao do produto: tipografia */
.product-description p {
    margin-bottom: 1rem;
}

.product-description h2,
.product-description h3 {
    font-family: 'Cormorant Garamond', serif;
    color: #2d2a24;
    margin-bottom: 0.5rem;
    margin-top: 1.5rem;
}

.product-description ul,
.product-description ol {
    padding-left: 1.25rem;
    margin-bottom: 1rem;
}

.product-description li {
    margin-bottom: 0.25rem;
}

/* Scrollbar fino nas miniaturas */
#gallery-thumbs::-webkit-scrollbar {
    height: 4px;
}

#gallery-thumbs::-webkit-scrollbar-thumb {
    background: #ede8d8;
    border-radius: 2px;
}

/* Lightbox: fade ao abrir */
#gallery-lightbox::backdrop {
    background: rgba(0, 0, 0, 0.85);
}

/* Transicao suave na imagem principal */
#gallery-main-img {
    transition: opacity 0.18s ease;
}