/* ==========================================================
   CORREÇÃO DE LAYOUT E ALINHAMENTO DA PÁGINA DE CARRINHO
   ========================================================== */

/* 1. Unificar e Centralizar os Botões de 'Adicionar ao Carrinho' nas Sugestões */
.woocommerce-cart .cross-sells ul.products li.product .button {
    width: 100% !important;        /* Botões com largura total da coluna */
    max-width: 250px !important;    /* Define um tamanho máximo elegante */
    display: block !important;
    margin: 10px auto 0 !important; /* Centraliza horizontalmente e dá espaço no topo */
    padding: 15px !important;
    font-size: 14px !important;     /* Tamanho de texto legível */
    text-transform: uppercase;
    text-align: center;
}

/* 2. Ajuste Global do Título Principal (Carrinho) */
.woocommerce-cart h1.page-title,
.woocommerce-cart .woocommerce-billing-fields h3 {
    text-align: center !important;  /* Centraliza o título 'Carrinho' */
    margin-bottom: 30px !important;
}

/* 3. Correção de Espaçamento e Alinhamento nas Sugestões ("Você pode se interessar por...") */
.woocommerce-cart .cross-sells {
    margin-top: 50px !important;   /* Mais espaço antes da seção de sugestões */
    text-align: center;
}

.woocommerce-cart .cross-sells h2 {
    font-size: 20px !important;
    margin-bottom: 20px !important;
}

.woocommerce-cart .cross-sells ul.products li.product {
    margin-bottom: 20px !important; /* Espaço entre as linhas de produtos sugeridos */
    display: inline-block !important; /* Força os produtos a ficarem lado a lado */
    float: none !important;           /* Remove floats antigos do tema */
}

/* 4. Correção para o "Bloco Adicionar bloco" e Botão de Finalizar */
.woocommerce-cart .cart-collaterals .wc-proceed-to-checkout .checkout-button {
    width: 100% !important;
    margin-top: 15px !important;
}

/* 5. Ajustes para Celular (Responsividade) */
@media (max-width: 768px) {
    .woocommerce-cart table.shop_table_responsive tr td {
        text-align: left !important; /* Alinha o texto à esquerda no celular */
    }

    .woocommerce-cart .cross-sells ul.products li.product .button {
        width: 100% !important;    /* Botão full-width no celular */
        max-width: none !important;
    }
}