/* =============================================================
   custom-variations.css  v2.1.0
   ============================================================= */

/* ── 1. Ocultar bloco nativo de preço/disponibilidade da variação ── */

.woocommerce-variation.single_variation {
    display: none !important;
}

/* ── 2. Ocultar selects sem remover do DOM ─────────────────── */

table.variations select {
    position   : absolute;
    width      : 1px;
    height     : 1px;
    padding    : 0;
    margin     : -1px;
    overflow   : hidden;
    clip       : rect(0,0,0,0);
    white-space: nowrap;
    border     : 0;
}

.reset_variations { display: none !important; }

table.variations tr:has(select[name*="pa_tamanho"]) { display: none; }

/* ── 2. Linha de botões ────────────────────────────────────── */

tr.cv-size-row > td {
    padding: 0 0 20px;
    border : none;
}

/* ── 3. Header "Escolha o tamanho: / Ver tabela de medidas" ── */

.cv-size-header {
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    margin-bottom  : 12px;
}

.cv-size-header-label {
    font-size  : 14px;
    font-weight: 600;
    color      : #333333;
}

.cv-size-header-link {
    font-size      : 13px;
    color          : #555555;
    text-decoration: underline;
    white-space    : nowrap;
}

.cv-size-header-link:hover {
    color: #222222;
}

/* ── 4. Grid de botões ─────────────────────────────────────── */

.cv-size-grid {
    display  : flex;
    flex-wrap: wrap;
    gap      : 10px;
}
@media (max-width: 981px) {
	.cv-size-grid {
		flex-direction: column;
	}
}
/* ── 5. Botão individual ───────────────────────────────────── */

.cv-size-btn {
    display        : flex;
    flex-direction : column;
    align-items    : center;
    justify-content: center;
    gap            : 4px;
    min-width      : 80px;
    padding        : 12px 10px;
    border         : 1.5px solid #d5d5d5;
    border-radius  : 12px;
    background     : #ffffff;
    color          : #333333;
    cursor         : pointer;
    transition     : border-color .15s ease, background .15s ease, color .15s ease;
    line-height    : 1.2;
    text-align     : center;
}

.cv-size-btn:hover:not(.cv-size-btn--unavailable) {
    border-color: #888888;
}

@media (max-width: 981px) {
	.cv-size-btn {
		flex-direction: row;
    justify-content: space-between;
    padding: 10px 20px;
	}
}

.cv-size-name {
    font-size  : 18px;
    font-weight: 700;
    letter-spacing: .5px;
}

.cv-size-peso {
    font-size  : 11px;
    color      : #777777;
    font-weight: 400;
}

.cv-size-qtd {
    font-size     : 10px;
    font-weight   : 600;
    color         : #555555;
    text-transform: uppercase;
    letter-spacing: .3px;
}

/* ── 6. Estado ativo ───────────────────────────────────────── */

.cv-size-btn.cv-size-btn--active {
    border-color: #B8B8B9;
    background  : #fdf0f0;
    color       : #000;
}
.cv-size-btn.cv-size-btn--active[data-slug=rn] {
    background  : #F5EADD;
}
.cv-size-btn.cv-size-btn--active[data-slug=p] {
    background  : #FFF1D1;
}
.cv-size-btn.cv-size-btn--active[data-slug=m] {
    background  : #FFEBE3;
}
.cv-size-btn.cv-size-btn--active[data-slug=g] {
    background  : #EDF0FF;
}
.cv-size-btn.cv-size-btn--active[data-slug=xg] {
    background  : #E0E9E0;
}

.cv-size-btn.cv-size-btn--active .cv-size-peso,
.cv-size-btn.cv-size-btn--active .cv-size-qtd {
    color: #000;
}

/* ── 7. Estado indisponível ────────────────────────────────── */

.cv-size-btn.cv-size-btn--unavailable {
    opacity        : 0.38;
    cursor         : not-allowed;
    text-decoration: line-through;
}

/* ── 8. Ocultar label e contador originais (ficam no form para o WC) ── */

.cv-qty-label,
.cv-qty-wrap--hidden {
    display: none !important;
}

/* Oculta o botao submit original — o clone no .cv-summary faz o submit */
.woocommerce-variation-add-to-cart .single_add_to_cart_button {
    display: none !important;
}

/* ── 9. Contador de quantidade ─────────────────────────────── */

.cv-qty-wrap {
    display      : inline-flex;
    align-items  : center;
    border       : 1.5px solid #d5d5d5;
    border-radius: 8px;
    overflow     : hidden;
    background   : #ffffff;
}

.cv-qty-btn {
    display        : flex;
    align-items    : center;
    justify-content: center;
    width          : 36px;
    height         : 36px;
    background     : transparent;
    border         : none;
    font-size      : 18px;
    color          : #333333;
    cursor         : pointer;
    line-height    : 1;
    transition     : background .15s;
    flex-shrink    : 0;
}

.cv-qty-btn:hover { background: #f5f5f5; }

.cv-qty-wrap input[type=number] {
    width          : 40px;
    height         : 36px;
    border         : none;
    border-left    : 1.5px solid #d5d5d5;
    border-right   : 1.5px solid #d5d5d5;
    text-align     : center;
    font-size      : 15px;
    font-weight    : 600;
    color          : #333333;
    background     : transparent;
    -moz-appearance: textfield;
    outline        : none;
}

.cv-qty-wrap input[type=number]::-webkit-inner-spin-button,
.cv-qty-wrap input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* ── 10. Bloco de resumo ───────────────────────────────────── */

.cv-summary {
    width     : 100%;
    max-height: 0;
    overflow  : hidden;
    opacity   : 0;
    transition: opacity .25s ease, max-height .3s ease;
}

.cv-summary.cv-summary--visible {
    max-height: 300px;
    opacity   : 1;
}

.cv-summary-inner {
    display        : flex;
    align-items    : flex-start;
    justify-content: space-between;
    gap            : 12px;
    padding        : 16px 0 12px;
}

/* Esquerda: nome + qtd descritiva */
.cv-summary-left {
    flex: 1 1 auto;
}

.cv-summary-name {
    font-size  : 17px;
    font-weight: 700;
    color      : #1a1a1a;
    line-height: 1.2;
}

.cv-summary-qtd-desc {
    font-size     : 12px;
    color         : #777777;
    margin-top    : 4px;
    text-transform: uppercase;
    letter-spacing: .3px;
}

/* Direita: preços empilhados */
.cv-summary-price {
    flex-shrink: 0;
    text-align : right;
    display    : flex;
    flex-direction: column;
    align-items: flex-end;
    gap        : 2px;
}

/* Preço riscado (original) — topo */
.cv-price-regular del,
.cv-price-regular {
    font-size      : 13px;
    color          : #aaaaaa;
    text-decoration: line-through;
}

/* Preço promocional — embaixo */
.cv-price-sale {
    font-size  : 22px;
    font-weight: 700;
    color      : #1a1a1a;
}

.cv-price-sale .woocommerce-Price-amount {
    font-size  : 22px;
    font-weight: 700;
    color      : #1a1a1a;
}

/* ── 11. Divisor ───────────────────────────────────────────── */

.cv-summary-divider {
    border     : none;
    border-top : 1px solid #b8b8b9;
    margin     : 0 0 37px;
}

/* ── 12. Footer do summary: linha de quantidade + botao clone ── */

.cv-summary--visible {
    max-height: 400px !important;
}

.cv-summary-footer {
    display       : flex;
    flex-direction: column;
    gap           : 12px;
    padding-bottom: 4px;
}

/* Linha: label + contador lado a lado */
.cv-footer-qty {
    display    : flex;
    align-items: center;
    justify-content: space-between;
    gap        : 12px;
}

.cv-qty-label-inline {
    font-size  : 14px;
    font-weight: 600;
    color      : #333333;
    flex       : 1 1 auto;
}

/* Contador clone (usa os mesmos estilos do .cv-qty-wrap) */
.cv-qty-clone {
    flex-shrink: 0;
}

.cv-qty-display {
    display    : inline-flex;
    align-items: center;
    justify-content: center;
    width      : 40px;
    height     : 36px;
    border-left : 1.5px solid #d5d5d5;
    border-right: 1.5px solid #d5d5d5;
    font-size  : 15px;
    font-weight: 600;
    color      : #333333;
}

/* Botao clone de adicionar ao carrinho */
.cv-add-to-cart-clone {
    width          : 100%;
    display        : block;
    padding        : 14px 20px;
    background     : #E0E9E0;
    color          : #000;
    border         : 1px solid #000;
    border-radius  : 50px;
    font-size      : 14px;
    font-weight    : 500;
    letter-spacing : 1px;
    text-transform : uppercase;
    cursor         : pointer;
    text-align     : center;
    box-sizing     : border-box;
    transition     : background .2s ease;
	margin-top: 
}

.cv-add-to-cart-clone:hover {
    opacity: 0.9;
}

/* ── 13. Responsivo ────────────────────────────────────────── */

@media ( max-width: 600px ) {
    .cv-size-btn {
        min-width: 64px;
    }

    .cv-size-name { font-size: 15px; }

    .cv-summary-inner {
        flex-wrap: wrap;
    }

    .cv-summary-price {
        align-items: flex-start;
        text-align : left;
    }
}