/**
 * Kitagrada Theme - WooCommerce Styles
 * Material Design styles for WooCommerce
 */

/* ========== PRODUCTS GRID ========== */
.woocommerce ul.products,
.woocommerce-page ul.products {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: var(--md-spacing-lg);
    margin: 0;
    padding: 0;
    list-style: none;
}

.woocommerce ul.products li.product {
    background: white;
    border-radius: var(--md-radius-md);
    box-shadow: var(--md-elevation-1);
    transition: all var(--md-transition-normal);
    overflow: hidden;
    position: relative;
    margin: 0;
}

.woocommerce ul.products li.product:hover {
    box-shadow: var(--md-elevation-3);
    transform: translateY(-4px);
}

/* Product Image */
.woocommerce ul.products li.product img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 0;
}

.woocommerce ul.products li.product .woocommerce-loop-product__link {
    display: block;
}

/* Product Title */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font: var(--md-font-subtitle1);
    color: var(--md-text-primary);
    margin: var(--md-spacing-md) var(--md-spacing-md) var(--md-spacing-sm);
    min-height: 48px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Product Price */
.woocommerce ul.products li.product .price {
    font: var(--md-font-h6);
    color: var(--md-primary);
    margin: 0 var(--md-spacing-md) var(--md-spacing-sm);
    display: block;
}

.woocommerce ul.products li.product .price del {
    color: var(--md-text-hint);
    font-size: 0.85em;
    margin-right: var(--md-spacing-xs);
}

.woocommerce ul.products li.product .price ins {
    text-decoration: none;
    font-weight: 500;
}

/* Add to Cart Button */
.woocommerce ul.products li.product .button {
    width: calc(100% - (var(--md-spacing-md) * 2));
    margin: 0 var(--md-spacing-md) var(--md-spacing-md);
    background: var(--md-primary);
    color: white;
    border: none;
    border-radius: var(--md-radius-sm);
    padding: 10px var(--md-spacing-sm);
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    text-align: center;
    cursor: pointer;
    transition: all var(--md-transition-normal);
    box-shadow: var(--md-elevation-2);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.woocommerce ul.products li.product .button:hover {
    background: var(--md-primary-dark);
    box-shadow: var(--md-elevation-3);
    transform: translateY(-2px);
}

.woocommerce ul.products li.product .button:before {
    content: 'add_shopping_cart';
    font-family: 'Material Symbols Outlined';
    font-size: 20px;
}

/* Sale Badge */
.woocommerce span.onsale {
    background: var(--md-secondary);
    color: white;
    border-radius: var(--md-radius-sm);
    padding: var(--md-spacing-xs) var(--md-spacing-sm);
    font: var(--md-font-caption);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    position: absolute;
    top: var(--md-spacing-md);
    right: var(--md-spacing-md);
    z-index: 2;
    box-shadow: var(--md-elevation-2);
}

/* ========== SINGLE PRODUCT ========== */
.single-product .product {
    background: white;
    border-radius: var(--md-radius-md);
    box-shadow: var(--md-elevation-1);
    padding: var(--md-spacing-xl);
    margin-bottom: var(--md-spacing-xl);
}

/* Galeria + resumo lado a lado; abas/relacionados (single-product-extra) ficam fora
   desse grid — wrappers próprios definidos em woocommerce/content-single-product.php,
   então não há mais risco de vazar layout entre as seções. */
.single-product-top {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: start;
    gap: var(--space-xl);
}

.single-product-extra {
    margin-top: var(--space-xl);
}

.single-product .product .product_title {
    font: var(--md-font-h4);
    color: var(--md-text-primary);
    margin-bottom: var(--md-spacing-md);
}

.single-product .product .price {
    font: var(--md-font-h5);
    color: var(--md-primary);
    margin-bottom: var(--md-spacing-lg);
}

.single-product .product .woocommerce-product-details__short-description {
    font: var(--md-font-body1);
    color: var(--md-text-secondary);
    margin-bottom: var(--md-spacing-lg);
}

/* Quantity Selector Material Style */
.quantity {
    display: inline-flex;
    align-items: center;
    border-radius: var(--md-radius-sm);
    overflow: hidden;
}

.quantity input.qty {
    width: 60px;
    border: none;
    text-align: center;
    font: var(--md-font-body1);
    padding: var(--md-spacing-sm);
}

.quantity .minus,
.quantity .plus {
    background: var(--md-surface);
    border: none;
    width: 36px;
    height: 36px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color var(--md-transition-fast);
}

.quantity .minus:hover,
.quantity .plus:hover {
    background: var(--md-divider);
}

/* Super Frete */
button.button[name="calc_shipping"] {
    color: var(--primary-dark);
    background: none;
    border: none;
    outline: none;
    box-shadow: none;
    text-decoration: none;
    padding: var(--space-sm) var(--space-md);
    cursor: pointer;
}

button.button[name="calc_shipping"]:hover {
    background-color: var(--primary-lighter);
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 36px;
}

.woocommerce-info.superfrete-number-notice {
    display: none;
}

#billing_state,
#shipping_state {
    width: 100% !important;
    padding: var(--md-spacing-md) !important;
    border: 1px solid var(--md-divider) !important;
    border-radius: var(--md-radius-sm);
    font: var(--md-font-body1);
    transition: all var(--md-transition-fast);
    background: var(--md-surface);
    height: 70px !important;
    position: relative !important;
}

.select2-container {
    display: none !important;
}

#billing_address_2,
#shipping_address_2 {
    margin-top: 33px;
}

/* Abas do Produto — nomes próprios (kitagrada-product-tabs-*), sem colidir com nada
   de terceiros que possa estar mexendo nos seletores padrão do WooCommerce. */
.kitagrada-product-tabs {
    margin-top: var(--md-spacing-xxl);
}

.kitagrada-product-tabs-nav {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--md-spacing-lg);
    border-bottom: 2px solid var(--md-divider);
    display: flex;
    gap: var(--md-spacing-md);
}

.kitagrada-product-tabs-nav-item {
    margin: 0;
}

.kitagrada-product-tabs-nav-item button {
    display: block;
    width: 100%;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    padding: var(--md-spacing-md) var(--md-spacing-lg);
    font: var(--md-font-subtitle2);
    text-transform: uppercase;
    color: var(--md-text-secondary);
    margin-bottom: -2px;
    cursor: pointer;
    transition: all var(--md-transition-fast);
}

.kitagrada-product-tabs-nav-item button:hover {
    color: var(--md-primary);
}

.kitagrada-product-tabs-nav-item.is-active button {
    color: var(--md-primary);
    border-bottom-color: var(--md-primary);
}

.kitagrada-product-tabs-panel {
    display: none;
    color: var(--text-secondary);
    line-height: 1.7;
}

.kitagrada-product-tabs-panel.is-active {
    display: block;
}

.kitagrada-product-tabs-panel h2 {
    font-size: 22px;
    color: var(--text-primary);
    margin-bottom: var(--space-md);
}

/* ---------- Galeria de Imagens ---------- */
.woocommerce-product-gallery {
    position: relative;
}

/* Botão de zoom/tela cheia nativo do WooCommerce — vira um ícone flutuante no canto */
.woocommerce-product-gallery__trigger {
    position: absolute;
    top: var(--space-sm);
    right: var(--space-sm);
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: white;
    border-radius: var(--radius-round);
    box-shadow: var(--shadow-soft);
    transition: background var(--transition-quick);
}

.woocommerce-product-gallery__trigger:hover {
    background: var(--primary-lighter);
}

.woocommerce-product-gallery__wrapper {
    margin: 0;
    padding: 0;
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-subtle);
}

.woocommerce-product-gallery__image img {
    width: 100%;
    height: auto;
    display: block;
}

.flex-control-thumbs {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
    margin: var(--space-md) 0 0;
    padding: 0;
    list-style: none;
}

.flex-control-thumbs li {
    width: 72px;
}

.flex-control-thumbs img {
    width: 100%;
    height: 72px;
    object-fit: cover;
    border-radius: var(--radius-sm);
    cursor: pointer;
    opacity: 0.6;
    border: 2px solid transparent;
    transition: opacity var(--transition-quick), border-color var(--transition-quick);
}

.flex-control-thumbs img.flex-active,
.flex-control-thumbs img:hover {
    opacity: 1;
    border-color: var(--primary);
}

/* ---------- Avaliação em Estrelas ---------- */
.woocommerce-product-rating {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    margin-bottom: var(--space-sm);
}

.star-rating {
    overflow: hidden;
    position: relative;
    height: 20px;
    line-height: 20px;
    font-size: 16px;
    width: 100px;
    letter-spacing: 4px;
}

.star-rating::before {
    content: "star star star star star";
    font-family: 'Material Symbols Outlined';
    color: var(--divider);
    display: block;
    white-space: nowrap;
}

.star-rating span {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
}

.star-rating span::before {
    content: "star star star star star";
    font-family: 'Material Symbols Outlined';
    color: #f0a500;
    display: block;
    white-space: nowrap;
}

.woocommerce-review-link {
    font-size: 13px;
    color: var(--text-light);
}

/* ---------- Formulário de Compra ---------- */
.single-product .cart {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-md);
    margin: var(--space-lg) 0;
}

/* Stepper de quantidade, mesmo padrão visual do carrinho */
.single-product .quantity {
    display: flex;
    align-items: center;
    gap: 4px;
}

.single-product .quantity .qty-btn {
    width: 28px;
    height: 28px;
    border: 1px solid var(--divider);
    background: var(--surface);
    border-radius: var(--radius-sm);
    color: var(--primary);
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    transition: background var(--transition-quick);
}

.single-product .quantity .qty-btn:hover {
    background: var(--primary-lighter);
}

.single-product .quantity input.qty {
    width: 44px;
    text-align: center;
    border: 1px solid var(--divider);
    border-radius: var(--radius-sm);
    padding: 6px 4px;
    font-size: 14px;
    color: var(--text-primary);
}

.single-product .single_add_to_cart_button {
    display: inline-flex;
    align-items: center;
    gap: var(--space-xs);
    padding: 14px 32px;
    border: none;
    border-radius: var(--radius-lg);
    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
    color: white;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    box-shadow: var(--shadow-soft);
    transition: all var(--transition-smooth);
}

.single-product .single_add_to_cart_button:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-medium);
    color: white;
}

/* ---------- Metadados (SKU, categorias) ---------- */
.product_meta {
    margin-top: var(--space-lg);
    padding-top: var(--space-md);
    border-top: 1px solid var(--divider);
    font-size: 13px;
    color: var(--text-light);
}

.product_meta > span {
    display: block;
    margin-bottom: 4px;
}

.product_meta a {
    color: var(--text-secondary);
}

/* ---------- Relacionados / Upsell ---------- */
.related.products,
.upsells.products {
    margin-top: var(--space-xxl);
}

.related.products > h2,
.upsells.products > h2 {
    font-size: 24px;
    color: var(--text-primary);
    margin-bottom: var(--space-lg);
    text-align: center;
}

@media (max-width: 767px) {
    .single-product-top {
        grid-template-columns: 1fr;
    }
}

/* ========== SHOP PAGE (REDESIGN) ========== */
.woocommerce-products-header__title.page-title {
    font: var(--md-font-h3);
    color: var(--text-primary);
    margin: 0;
}

.woocommerce-breadcrumb {
    display: block;
    font-size: 13px;
    color: var(--text-light);
    margin-bottom: var(--space-md);
}

.woocommerce-breadcrumb a {
    color: var(--text-secondary);
}

.shop-layout {
    display: grid;
    grid-template-columns: 260px 1fr;
    align-items: start;
    gap: var(--space-xl);
}

/* ---------- Sidebar de Filtros ---------- */
.shop-filters {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
    position: sticky;
    top: var(--space-lg);
}

.shop-filter-group {
    background: white;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-subtle);
    padding: var(--space-lg);
}

.shop-filter-group h3 {
    font-size: 16px;
    color: var(--text-primary);
    margin-bottom: var(--space-md);
}

.shop-filter-categories {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.shop-filter-categories a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px var(--space-sm);
    border-radius: var(--radius-sm);
    color: var(--text-secondary);
    font-size: 14px;
    transition: all var(--transition-quick);
}

.shop-filter-categories a:hover {
    background: var(--primary-light);
    color: var(--primary-dark);
}

.shop-filter-categories li.is-active a {
    background: var(--primary);
    color: white;
    font-weight: 500;
}

.shop-filter-count {
    font-size: 12px;
    color: inherit;
    opacity: 0.7;
}

.shop-filter-price-inputs {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    margin-bottom: var(--space-md);
}

.shop-filter-price-inputs input {
    width: 100%;
    min-width: 0;
    padding: 8px var(--space-sm);
    border: 1px solid var(--divider);
    border-radius: var(--radius-sm);
    font-size: 14px;
}

.shop-filter-price-inputs span {
    color: var(--text-light);
}

.shop-filter-price .btn {
    width: 100%;
    padding: 10px;
    font-size: 14px;
}

.shop-filter-clear {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    justify-content: center;
    font-size: 13px;
    color: var(--text-light);
    text-decoration: underline;
}

.shop-filter-clear .material-symbols-outlined {
    font-size: 16px;
}

@media (max-width: 959px) {
    .shop-layout {
        grid-template-columns: 1fr;
    }

    .shop-filters {
        position: static;
    }
}

/* ---------- Listagem ---------- */
.shop-main {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
}

.shop-main .woocommerce-notices-wrapper,
.shop-main > ul.products {
    width: 100%;
}

.shop-main .woocommerce-notices-wrapper .woocommerce-info {
    background: var(--secondary-light);
    color: var(--text-primary);
    border-radius: var(--radius-md);
    padding: var(--space-md) var(--space-lg);
    font-size: 14px;
}

.woocommerce-result-count {
    margin: 0;
    color: var(--text-light);
    font-size: 14px;
}

.woocommerce-ordering {
    margin: 0;
}

.woocommerce-ordering select {
    padding: 10px var(--space-sm);
    border: 1px solid var(--divider);
    border-radius: var(--radius-sm);
    background: var(--surface);
    font-size: 14px;
    color: var(--text-primary);
}

/* ========== CART PAGE (REDESIGN EM CARDS) ========== */

.cart-page-title h1 {
    margin-bottom: var(--space-xs);
}

/* O aviso padrão do WooCommerce ("Carrinho atualizado.", etc.) vira snackbar via JS */
.cart-page .woocommerce-notices-wrapper {
    display: none;
}

.cart-page.is-updating {
    opacity: 0.6;
    pointer-events: none;
    transition: opacity var(--transition-quick);
}

.cart-page-layout {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: var(--space-lg);
    align-items: start;
}

/* ---------- Coluna de Itens ---------- */
.cart-items-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

.cart-item-card {
    display: grid;
    grid-template-columns: 96px 1fr auto auto auto;
    align-items: center;
    gap: var(--space-md);
    background: white;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-subtle);
    padding: var(--space-md);
    transition: box-shadow var(--transition-quick);
}

.cart-item-card:hover {
    box-shadow: var(--shadow-soft);
}

.cart-item-thumbnail img {
    width: 96px;
    height: 96px;
    object-fit: cover;
    border-radius: var(--radius-sm);
    display: block;
}

.cart-item-info {
    min-width: 0;
}

.cart-item-name {
    font-size: 16px;
    color: var(--text-primary);
    margin-bottom: 4px;
}

.cart-item-name a {
    color: var(--text-primary);
    font-weight: 500;
}

.cart-item-price {
    font-size: 14px;
    color: var(--text-light);
}

.cart-item-quantity .quantity {
    display: flex;
    align-items: center;
    gap: 4px;
}

.cart-item-quantity .qty-btn {
    width: 28px;
    height: 28px;
    border: 1px solid var(--divider);
    background: var(--surface);
    border-radius: var(--radius-sm);
    color: var(--primary);
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    transition: background var(--transition-quick);
}

.cart-item-quantity .qty-btn:hover {
    background: var(--primary-lighter);
}

.cart-item-quantity input.qty {
    width: 44px;
    text-align: center;
    border: 1px solid var(--divider);
    border-radius: var(--radius-sm);
    padding: 6px 4px;
    font-size: 14px;
    color: var(--text-primary);
}

.cart-item-subtotal {
    font-weight: 500;
    color: var(--primary-dark);
    white-space: nowrap;
}

.cart-item-remove .remove {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: var(--radius-round);
    color: var(--text-light);
    transition: all var(--transition-quick);
}

.cart-item-remove .remove:hover {
    background: var(--primary-lighter);
    color: var(--primary-dark);
}

.cart-item-remove .material-symbols-outlined {
    font-size: 20px;
}

/* ---------- Barra de Ações ---------- */
.cart-actions-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-md);
    margin-top: var(--space-lg);
}

.cart-continue-shopping {
    margin-right: auto;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.cart-actions-row .coupon {
    display: flex;
    gap: var(--space-xs);
}

.cart-actions-row .coupon .input-text {
    padding: 10px var(--space-sm);
    border: 1px solid var(--divider);
    border-radius: var(--radius-md);
    font-size: 14px;
}

.cart-update-btn .material-symbols-outlined {
    font-size: 18px;
}

/* ---------- Coluna de Resumo ---------- */
.cart-summary-column {
    position: sticky;
    top: var(--space-lg);
}

.cart-summary-card {
    background: white;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-soft);
    padding: var(--space-lg);
}

.cart-summary-card h2 {
    font-size: 22px;
    color: var(--primary);
    margin-bottom: var(--space-md);
}

.cart-totals-rows {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.cart-totals-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding-bottom: var(--space-sm);
    border-bottom: 1px solid var(--divider);
    font-size: 14px;
    color: var(--text-secondary);
}

.cart-totals-row.order-total {
    border-bottom: none;
    padding-top: var(--space-xs);
    font-size: 18px;
    font-weight: 500;
    color: var(--text-primary);
}

.cart-totals-row.order-total .cart-totals-value {
    color: var(--primary-dark);
}

.cart-totals-label {
    flex-shrink: 0;
}

.cart-totals-value {
    text-align: right;
}

/* Bloco de frete (inclui SuperFrete, via wc_cart_totals_shipping_html()) */
.cart-shipping-row {
    flex-direction: column;
    align-items: stretch;
}

.cart-shipping-block {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    width: 100%;
}

.cart-shipping-block .cart-totals-label {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: var(--text-light);
}

.cart-shipping-block .cart-totals-value {
    width: 100%;
    text-align: left;
}

/* Uma opção de envio por linha */
.woocommerce-shipping-methods {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    list-style: none;
    margin: 0 0 var(--space-sm) 0;
    padding: 0;
    text-align: left;
}

.woocommerce-shipping-methods li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: var(--space-sm);
    border: 1px solid var(--divider);
    border-radius: var(--radius-sm);
    transition: border-color var(--transition-quick);
}

.woocommerce-shipping-methods li:has(input:checked) {
    border-color: var(--primary);
    background: var(--primary-light);
}

.woocommerce-shipping-methods input[type="radio"] {
    margin-top: 3px;
    accent-color: var(--primary);
    flex-shrink: 0;
}

.woocommerce-shipping-methods label {
    font-size: 14px;
    line-height: 1.4;
    color: var(--text-primary);
    margin: 0;
}

/* Endereço e "Mudar endereço", cada um na sua própria linha */
.woocommerce-shipping-destination {
    display: block;
    font-size: 13px;
    color: var(--text-light);
    margin: 0 0 var(--space-xs) 0;
    text-align: left;
}

.shipping-calculator-button {
    display: inline-block;
    font-size: 13px;
    color: var(--primary);
    text-decoration: underline;
    margin-bottom: var(--space-xs);
}

.shipping-calculator-form {
    display: block;
    margin-top: var(--space-sm);
    text-align: left;
}

.shipping-calculator-form .form-row {
    margin-bottom: var(--space-sm);
}

.shipping-calculator-form label {
    display: block;
    font-size: 13px;
    color: var(--text-secondary);
    margin-bottom: 4px;
}

.shipping-calculator-form .input-text,
.shipping-calculator-form select {
    width: 100%;
    padding: 8px var(--space-sm);
    border: 1px solid var(--divider);
    border-radius: var(--radius-sm);
    font-size: 14px;
}

.shipping-calculator-form .select2-container .select2-selection--single {
    height: 38px;
    border: 1px solid var(--divider);
    border-radius: var(--radius-sm);
}

.shipping-calculator-form .select2-container .select2-selection__rendered {
    line-height: 38px;
}

/* País/Estado bloqueados: só mudam automaticamente via CEP */
.shipping-calculator-form .select2-container--disabled .select2-selection--single {
    background: var(--surface);
    color: var(--text-light);
    cursor: not-allowed;
}

.shipping-calculator-form .button {
    margin-top: 4px;
}

.wc-proceed-to-checkout {
    margin-top: var(--space-md);
}

.wc-proceed-to-checkout .checkout-button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 16px;
    font-size: 16px;
    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
    color: white;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-soft);
    transition: all var(--transition-smooth);
}

.wc-proceed-to-checkout .checkout-button:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-medium);
}

/* ---------- Cross-sell (largura total, abaixo do grid) ---------- */
.cross-sells {
    margin-top: var(--space-xxl);
}

.cross-sells h2 {
    font-size: 24px;
    color: var(--text-primary);
    margin-bottom: var(--space-md);
}

/* ---------- Carrinho Vazio ---------- */
.cart-empty-state {
    text-align: center;
    padding: var(--space-xxl) var(--space-lg);
    max-width: 500px;
    margin: 0 auto;
}

.cart-empty-icon {
    font-size: 64px;
    color: var(--text-lighter);
    margin-bottom: var(--space-md);
}

.cart-empty-message {
    color: var(--text-light);
    margin-bottom: var(--space-lg);
}

/* ---------- Responsivo ---------- */
@media (max-width: 959px) {
    .cart-page-layout {
        grid-template-columns: 1fr;
    }

    .cart-summary-column {
        position: static;
    }
}

@media (max-width: 599px) {
    .cart-item-card {
        grid-template-columns: 72px 1fr auto;
        grid-template-areas:
            "thumb info info"
            "thumb quantity quantity"
            "thumb subtotal remove";
        row-gap: var(--space-xs);
    }

    .cart-item-thumbnail { grid-area: thumb; }
    .cart-item-info { grid-area: info; }
    .cart-item-quantity { grid-area: quantity; }

    .cart-item-subtotal {
        grid-area: subtotal;
        align-self: center;
    }

    .cart-item-remove {
        grid-area: remove;
        align-self: center;
        justify-self: end;
    }

    .cart-item-thumbnail img {
        width: 72px;
        height: 72px;
    }

    .cart-actions-row {
        flex-direction: column;
        align-items: stretch;
    }

    .cart-continue-shopping {
        margin-right: 0;
        order: 3;
    }
}

/* ========== CHECKOUT PAGE ========== */
.woocommerce-checkout #customer_details {
    background: white;
    border-radius: var(--md-radius-md);
    box-shadow: var(--md-elevation-1);
    padding: var(--md-spacing-xl);
    margin-bottom: var(--md-spacing-lg);
}

.checkout-review-card {
    background: white;
    border-radius: var(--md-radius-md);
    box-shadow: var(--md-elevation-1);
    padding: var(--md-spacing-xl);
}

.woocommerce-checkout h3 {
    font: var(--md-font-h6);
    color: var(--md-primary);
    margin-bottom: var(--md-spacing-md);
    padding-bottom: var(--md-spacing-sm);
    border-bottom: 2px solid var(--md-divider);
}

/* Form Fields Material Design */
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea {
    width: 100%;
    padding: var(--md-spacing-md);
    border: 1px solid var(--md-divider);
    border-radius: var(--md-radius-sm);
    font: var(--md-font-body1);
    transition: all var(--md-transition-fast);
    background: var(--md-surface);
}

.woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout .form-row select:focus,
.woocommerce-checkout .form-row textarea:focus {
    outline: none;
    border-color: var(--md-primary);
    background: white;
    box-shadow: 0 0 0 2px rgba(217, 125, 140, 0.1);
}

.woocommerce-checkout .form-row label {
    font: var(--md-font-subtitle2);
    color: var(--md-text-secondary);
    margin-bottom: var(--md-spacing-xs);
    display: block;
}

/* Select2 (Estado) — mesmo visual dos demais campos */
.woocommerce-checkout .select2-container--default .select2-selection--single {
    height: auto;
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 var(--space-md);
    border: 1px solid var(--md-divider);
    border-radius: var(--md-radius-sm);
    background: var(--md-surface);
    transition: all var(--md-transition-fast);
}

.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 0;
    line-height: normal;
    color: var(--text-primary);
}

.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100%;
    top: 0;
    right: var(--space-sm);
}

.woocommerce-checkout .select2-container--default.select2-container--focus .select2-selection--single,
.woocommerce-checkout .select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--md-primary);
    background: white;
    box-shadow: 0 0 0 2px rgba(217, 125, 140, 0.1);
}

/* País/Estado bloqueados — valor continua sendo enviado no submit, só a interação é bloqueada */
.woocommerce-checkout select[id$="_country"] {
    background: var(--md-surface);
    color: var(--md-text-hint);
    cursor: not-allowed;
}

.woocommerce-checkout .select2-container.is-locked .select2-selection--single {
    background: var(--md-surface);
    color: var(--md-text-hint);
    cursor: not-allowed;
}

/* Layout dos campos de cobrança: linhas fixas via CSS Grid (independe da ordem/prioridade
   original do plugin de campos) — 1ª linha com 3 campos, demais com 2 campos cada. */
.woocommerce-billing-fields__field-wrapper {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-template-areas:
        "cpf        cpf        nome  nome  sobrenome sobrenome"
        "cep        cep        cep   pais  pais      pais"
        "estado     estado     estado cidade cidade  cidade"
        "endereco   endereco   endereco numero numero numero"
        "bairro     bairro     bairro complemento complemento complemento"
        "email      email      email telefone telefone telefone";
    gap: 0 var(--space-md);
}

#billing_document_field      { grid-area: cpf; }
#billing_first_name_field    { grid-area: nome; }
#billing_last_name_field     { grid-area: sobrenome; }
#billing_postcode_field      { grid-area: cep; }
#billing_country_field       { grid-area: pais; }
#billing_state_field         { grid-area: estado; }
#billing_city_field          { grid-area: cidade; }
#billing_address_1_field     { grid-area: endereco; }
#billing_number_field        { grid-area: numero; }
#billing_neighborhood_field  { grid-area: bairro; }
#billing_address_2_field     { grid-area: complemento; }
#billing_email_field         { grid-area: email; }
#billing_phone_field         { grid-area: telefone; }

@media (max-width: 959px) {
    .woocommerce-billing-fields__field-wrapper {
        grid-template-columns: 1fr;
        grid-template-areas:
            "cpf"
            "nome"
            "sobrenome"
            "cep"
            "pais"
            "estado"
            "cidade"
            "endereco"
            "numero"
            "bairro"
            "complemento"
            "email"
            "telefone";
    }
}

/* Layout dos campos de entrega: mesmo agrupamento em linhas da cobrança
   (sem CPF/Email, que só existem em cobrança) */
.woocommerce-shipping-fields__field-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-areas:
        "nome      sobrenome"
        "cep       pais"
        "estado    cidade"
        "endereco  numero"
        "bairro    complemento"
        "telefone  telefone";
    gap: 0 var(--space-md);
}

#shipping_first_name_field   { grid-area: nome; }
#shipping_last_name_field    { grid-area: sobrenome; }
#shipping_postcode_field     { grid-area: cep; }
#shipping_country_field      { grid-area: pais; }
#shipping_state_field        { grid-area: estado; }
#shipping_city_field         { grid-area: cidade; }
#shipping_address_1_field    { grid-area: endereco; }
#shipping_number_field       { grid-area: numero; }
#shipping_neighborhood_field { grid-area: bairro; }
#shipping_address_2_field    { grid-area: complemento; }
#shipping_phone_field        { grid-area: telefone; }

@media (max-width: 959px) {
    .woocommerce-shipping-fields__field-wrapper {
        grid-template-columns: 1fr;
        grid-template-areas:
            "nome"
            "sobrenome"
            "cep"
            "pais"
            "estado"
            "cidade"
            "endereco"
            "numero"
            "bairro"
            "complemento"
            "telefone";
    }
}

/* ---------- Progresso do Wizard ---------- */
.checkout-page-title h1 {
    margin-bottom: var(--space-xs);
}

/* Avisos e erros de validação do WooCommerce viram snackbar via JS */
.checkout-page .woocommerce-notices-wrapper,
.checkout-page .woocommerce-NoticeGroup-checkout {
    display: none;
}

.checkout-progress {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-sm);
    margin-bottom: var(--space-xl);
}

.checkout-progress-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    opacity: 0.5;
    transition: opacity var(--transition-quick);
}

.checkout-progress-step.is-active,
.checkout-progress-step.is-complete {
    opacity: 1;
}

.checkout-progress-circle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-round);
    background: var(--surface);
    border: 2px solid var(--divider);
    color: var(--text-secondary);
    font-weight: 500;
    transition: all var(--transition-quick);
}

.checkout-progress-step.is-active .checkout-progress-circle {
    background: var(--primary);
    border-color: var(--primary);
    color: white;
}

.checkout-progress-step.is-complete .checkout-progress-circle {
    background: var(--primary-lighter);
    border-color: var(--primary);
    color: var(--primary-dark);
}

.checkout-progress-label {
    font-size: 12px;
    color: var(--text-secondary);
    text-align: center;
}

.checkout-progress-connector {
    width: 48px;
    height: 2px;
    background: var(--divider);
    margin-top: -20px;
}

/* ---------- Etapas ---------- */
.checkout-step {
    display: none;
}

.checkout-step.is-active {
    display: block;
    animation: checkout-step-in var(--transition-smooth);
}

@keyframes checkout-step-in {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

.checkout-step-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
    margin-top: var(--space-lg);
}

.checkout-step-actions .checkout-step-next {
    margin-left: auto;
}

.checkout-step-actions .material-symbols-outlined {
    font-size: 18px;
}

.form-row.checkout-field-error input.input-text,
.form-row.checkout-field-error select,
.form-row.checkout-field-error .select2-container--default .select2-selection--single {
    border-color: #e03131;
}

/* ---------- Etapa 2: Frete ---------- */
.checkout-shipping-card {
    background: white;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-subtle);
    padding: var(--space-lg);
}

.checkout-shipping-card h3 {
    margin-top: 0;
}

.checkout-shipping-loading {
    color: var(--text-light);
    text-align: center;
    margin: 0;
}

/* ---------- Etapa 3: Tabela de Revisão ---------- */
.woocommerce-checkout-review-order-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: var(--space-lg);
}

.woocommerce-checkout-review-order-table thead th {
    text-align: left;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: var(--text-light);
    padding-bottom: var(--space-sm);
    border-bottom: 1px solid var(--divider);
}

.woocommerce-checkout-review-order-table thead th.product-total {
    text-align: right;
}

.woocommerce-checkout-review-order-table tbody td {
    padding: var(--space-sm) 0;
    border-bottom: 1px solid var(--divider);
    font-size: 14px;
    color: var(--text-primary);
}

.woocommerce-checkout-review-order-table tbody td.product-total {
    text-align: right;
    white-space: nowrap;
}

.woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout-review-order-table tfoot td {
    padding: var(--space-sm) 0;
    font-size: 14px;
}

.woocommerce-checkout-review-order-table tfoot td {
    text-align: right;
}

.woocommerce-checkout-review-order-table tfoot tr.order-total th,
.woocommerce-checkout-review-order-table tfoot tr.order-total td {
    padding-top: var(--space-sm);
    border-top: 1px solid var(--divider);
    font-size: 18px;
    font-weight: 500;
    color: var(--primary-dark);
}

/* ---------- Métodos de pagamento (só o wrapper — conteúdo interno é do Mercado Pago) ---------- */
.wc_payment_methods {
    list-style: none;
    margin: 0 0 var(--space-lg) 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.wc_payment_method {
    border: 1px solid var(--divider);
    border-radius: var(--radius-md);
    padding: var(--space-md);
    transition: border-color var(--transition-quick);
}

.wc_payment_method:has(input:checked) {
    border-color: var(--primary);
    background: var(--primary-light);
}

.wc_payment_method > label {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    font-size: 15px;
    color: var(--text-primary);
    cursor: pointer;
}

.wc_payment_method > label img {
    height: 22px;
    width: auto;
}

.wc_payment_method .payment_box {
    margin-top: var(--space-md);
}

/* Place Order Button */
#place_order {
    width: 100%;
    background: var(--md-primary);
    color: white;
    border: none;
    border-radius: var(--md-radius-sm);
    padding: var(--md-spacing-md) var(--md-spacing-xl);
    font: var(--md-font-button);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    cursor: pointer;
    transition: all var(--md-transition-normal);
    box-shadow: var(--md-elevation-2);
}

#place_order:hover {
    background: var(--md-primary-dark);
    box-shadow: var(--md-elevation-4);
}

/* ========== RESPONSIVE ========== */
@media (max-width: 959px) {
    .woocommerce .products {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--md-spacing-md);
    }
}

@media (max-width: 599px) {
    .woocommerce .products {
        grid-template-columns: 1fr;
    }

    .single-product .product .summary {
        padding-left: 0;
        margin-top: var(--md-spacing-lg);
    }
}
