/*
Theme Name: Astra Child
Template: astra
Version: 1.0.0
*/

/* ========================================= */
/* === RESET E AJUSTES GERAIS DO SITE === */
/* ========================================= */

/* 
  Remove margens e paddings padrão de HTML e BODY.
  Define fundo branco e oculta rolagem horizontal para evitar quebras visuais.
*/
body, html {
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  overflow-x: hidden !important;
  background-color: #fff !important;
}

/* 
  Remove limite de largura e espaçamentos do container principal do tema Astra.
  Deixa o fundo branco e largura total para ocupar 100% da tela.
*/
.ast-container {
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  background-color: #fff !important;
}

/* 
  Remove margens internas, paddings e limitações de largura dos containers do Elementor.
  Deixa os elementos mais soltos para facilitar controle visual via layout personalizado.
*/
.elementor-container,
.elementor-section,
.elementor-column,
.elementor-inner-section,
.elementor-widget-container {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box;
}


/* ========================== */
/* === ESTILO DO METASLIDER === */
/* ========================== */

/* Move os pontos de navegação (bolinhas) para fora do slide */
.metaslider .flex-control-nav {
  position: absolute !important;
  bottom: -25px !important;
  left: 0;
  width: 100%;
  text-align: center;
  z-index: 10;
}

/* Define o tamanho das bolinhas */
.metaslider .flex-control-nav li {
  width: 6px !important;
  height: 6px !important;
  margin: 0 4px !important;
}

/* Estilo das bolinhas inativas */
.metaslider .flex-control-nav li a {
  width: 6px !important;
  height: 6px !important;
  background: #999 !important;
  opacity: 0.4 !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  transition: all 0.3s ease-in-out;
}

/* Estilo da bolinha ativa */
.metaslider .flex-control-nav li a.flex-active {
  background: #000 !important;
  opacity: 1 !important;
  transform: scale(1.2);
}

/* Estilo moderno para as setas de navegação */
.metaslider .flex-direction-nav a {
  width: 40px !important;
  height: 40px !important;
  background: #fff !important;
  color: #000 !important;
  border-radius: 50% !important;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%);
  z-index: 20 !important;
  opacity: 0 !important;
  transition: opacity 0.3s ease-in-out;
}

/* Exibe as setas somente ao passar o mouse */
.metaslider:hover .flex-direction-nav a {
  opacity: 1 !important;
}

/* Posição da seta esquerda */
.metaslider .flex-direction-nav .flex-prev {
  left: 10px !important;
}

/* Posição da seta direita */
.metaslider .flex-direction-nav .flex-next {
  right: 10px !important;
}


/* ====================================== */
/* === CORREÇÃO DO GRID DE PRODUTOS ===== */
/* ====================================== */

/* Layout vertical com altura fixa para os produtos no grid */
.woocommerce ul.products li.product {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  height: 580px;
  box-sizing: border-box;
  padding: 0 10px;
}

/* Imagem do produto centralizada e com proporção adequada */
.woocommerce ul.products li.product img {
  width: 100%;
  height: 260px;
  object-fit: contain;
  display: block;
  margin: 0 auto;
}


/* ========================================= */
/* === AJUSTES DE TÍTULO, ESTRELAS E BOTÃO === */
/* ========================================= */

/* Título centralizado abaixo da imagem */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  text-align: center;
  font-size: 16px;
  line-height: 1.3;
  min-height: 48px;
  margin: 10px 0 5px 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Exibe corretamente a estrela de avaliação */
.woocommerce ul.products li.product .star-rating {
  margin: 8px auto;
  display: block;
  height: 1.5em;
  overflow: visible !important;
}

/* Botão com ícone e texto centralizados */
.woocommerce ul.products li.product a.button,
.woocommerce a.button.wc-forward,
.woocommerce button.button {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

/* Remove o ícone de carrinho padrão do WooCommerce */
.woocommerce ul.products li.product a.button::before {
  display: none !important;
}


/* ====================================== */
/* === COMPORTAMENTO DO MENU DO ASTRA === */
/* ====================================== */

/* Exibe submenus ao passar o mouse */
.ast-header-break-point .main-header-bar-navigation .menu-item-has-children:hover > .sub-menu,
.main-header-bar-navigation .menu-item-has-children:hover > .sub-menu {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
  transition: all 0.3s ease-in-out;
}

/* Esconde submenus por padrão */
.ast-header-break-point .main-header-bar-navigation .menu-item-has-children > .sub-menu,
.main-header-bar-navigation .menu-item-has-children > .sub-menu {
  visibility: hidden;
  opacity: 0;
  transform: translateY(10px);
  transition: all 0.3s ease-in-out;
}

/* Remove a seta indicadora de submenu */
.ast-icon.icon-arrow {
  display: none !important;
}


/* ====================================== */
/* === ESTILOS DE HOVER NO MENU SECUNDÁRIO === */
/* ====================================== */

/* Cor do link ao passar o mouse (menu secundário) */
.ast-secondary-header-navigation .menu-item a:hover {
  color: #FF0000; /* Cor ao passar o mouse — vermelho aqui */
}

/* Cor do item pai no menu ao passar o mouse */
.ast-secondary-header-navigation li.menu-item:hover > a.menu-link {
  color: #FF0000 !important; /* Troque por outra cor, se desejar */
  transition: color 0.3s ease;
}


/* ========================================= */
/* === ESTILO DO MENU SECUNDÁRIO – NORMAL === */
/* ========================================= */

.ast-secondary-header-navigation li.menu-item > a.menu-link {
  color: #000000; /* Cor padrão do menu */
  transition: color 0.3s ease;
}


/* ========================================= */
/* === BLOCO DE MODELOS INTERATIVOS (Hover) === */
/* ========================================= */

.modelos-container {
  display: flex;
  justify-content: center;
  overflow: visible;
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  padding: 0;
  position: relative;
}

.modelo {
  position: relative;
  flex: 0 0 auto;
  width: 12.5%;
  height: 900px;
  min-width: 120px;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  transition: all 0.4s ease;
  z-index: 1; /* todos começam com z-index 1 */
}

/* Camada invisível por cima */
.modelo .extra-hover {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  opacity: 0;
  transition: all 0.4s ease;
  z-index: 2; /* hover acima do normal */
}

/* Ao passar o mouse sobre o bloco */
.modelo:hover {
  z-index: 10;
}

.modelo:hover .extra-hover {
  width: 600px;        /* antes era 400px */
  height: 1400px;      /* antes era 1200px */
  opacity: 1;
  background-image: inherit;
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.5);
  transform: translate(-45%, -20%);
}


/* ========================================= */
/* === AJUSTES GERAIS DE CONTEÚDO / LAYOUT === */
/* ========================================= */

/* Remove o título principal das páginas internas */
h1.entry-title {
  display: none;
}

/* Remove botão “Adicionar à Sacola” e estrelas no grid de produtos (home, loja e categorias) */
body.archive ul.products li.product a.add_to_cart_button,
body.shop ul.products li.product a.add_to_cart_button,
body.home ul.products li.product a.add_to_cart_button,
body.archive ul.products li.product .star-rating,
body.shop ul.products li.product .star-rating,
body.home ul.products li.product .star-rating {
  display: none !important;
}

/* Remove margens/padding gerais da página e evita rolagem lateral */
body, html {
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
}

/* Garante que os containers ocupem 100% da largura da tela */
.elementor-container,
.ast-container,
.site-content,
.elementor-section,
.elementor-column {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}



/* ========================================= */
/* === GRID DE MODELOS (HOME) === */
/* ========================================= */

/* Container do grid de modelos */
.gufe-grid-modelos {
  display: flex;
  width: 100%;
  margin: 0;
  padding: 0;
}

/* Cada item do grid */
.gufe-grid-modelos .gufe-item {
  position: relative;
  width: 33.33%;
  height: auto;
  display: block;
}

/* Imagem do modelo */
.gufe-grid-modelos .gufe-item img {
  width: 100%;
  height: auto;
  display: block;
}

/* Texto sobre a imagem */
.gufe-grid-modelos .gufe-texto {
  position: absolute;
  bottom: 20px;
  left: 20px;
  text-align: left;
  background: none;
  padding: 0;
  margin: 0;
  color: #fff; /* Altere aqui a cor do texto se quiser */
  font-weight: bold;
  line-height: 1.2;
}


/* ========================================= */
/* === AJUSTES NO METASLIDER (CARROSSEL) === */
/* ========================================= */

/* Força o metaslider ocupar altura completa e manter espaçamento */
.metaslider {
  position: relative;
  display: block;
  overflow: visible; /* Deixe como VISIBLE */
  margin-bottom: 50px; /* Espaço inferior */
}

/* Bolinhas do carrossel fora do slider */
.metaslider .flex-control-nav {
  position: absolute !important;
  left: 0;
  bottom: -30px !important;
  width: 100%;
  text-align: center;
  z-index: 10;
}

/* Bolinhas padrão */
.metaslider .flex-control-nav li a {
  width: 8px !important;
  height: 8px !important;
  background: #999 !important;
  opacity: 0.4 !important;
  border-radius: 50% !important;
  transition: all 0.3s ease-in-out;
}

/* Bolinha ativa (slider atual) */
.metaslider .flex-control-nav li a.flex-active {
  background: #000 !important;
  opacity: 1 !important;
  transform: scale(1.2);
}


/* ========================================= */
/* === BLOCO DE MODELO FIXO (EXTRA) === */
/* ========================================= */

.modelo-fixo {
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  width: 100%;
  max-width: 700px;
  height: 600px;
  background-size: cover;
  background-position: center;
  position: relative;
  text-decoration: none;
  padding: 20px;
  box-sizing: border-box;
  overflow: hidden;
}

/* Remove efeito hover no modelo fixo */
.modelo-fixo .extra-hover {
  display: none;
}

/* Legenda dentro do modelo fixo */
.modelo-fixo .gufe-legenda {
  color: white;
  font-weight: bold;
  font-size: 1.3rem;
  line-height: 1.4;
  text-shadow: 1px 1px 3px rgba(0,0,0,0.8);
  position: relative;
  z-index: 1;
}


/* ========================================= */
/* === VARIAÇÃO DE COR (PLUGIN WPC Linked Variations) === */
/* ========================================= */

/* Bloco externo da cor (fora do <form>) */
.single-product .wpclv-attributes {
  display: flex !important;
  flex-direction: column;
  align-items: flex-start;
  margin: 0 0 15px 0;
}

/* Título “Cor” */
.single-product .wpclv-attributes-label {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 6px;
  display: block;
}

/* Estilo das miniaturas de cor */
.single-product .wpclv-term-image {
  margin-right: 10px;
  border-radius: 4px;
  overflow: hidden;
  border: 2px solid transparent;
  transition: all 0.3s ease;
}

/* Miniatura ativa (selecionada) */
.single-product .wpclv-term-image.wpclv-active {
  border-color: #0073e6;
}

/* Esconde o campo original da cor dentro do formulário */
form.variations_form .variations tr:has(select[name*=pa_cor]),
form.variations_form .variations tr:has(.label-pa_cor),
form.variations_form .variations tr:has(.wpclv-attribute-pa_cor) {
  display: none !important;
}


/* ========================================= */
/* === TAMANHO E BOTÃO "ADICIONAR À SACOLA" === */
/* ========================================= */

/* Força layout flex para organizar os elementos */
form.variations_form {
  display: flex;
  flex-direction: column;
}

/* Ordem da tabela de tamanhos */
form.variations_form table.variations {
  order: 1;
  margin-bottom: 12px;
}

/* Ordem do botão “Adicionar à Sacola” */
form.variations_form .single_variation_wrap {
  order: 2;
  margin-top: 20px;
}


/* ========================================= */
/* === CONTADOR DA SACOLA (HEADER) === */
/* ========================================= */

/* Botão da sacola com contador */
#gufe-cart-toggle {
  display: inline-block;
  position: relative;
}

/* Bolinha de contador vermelha */
#gufe-cart-count {
  position: absolute;
  top: -8px;
  right: -10px;
  background: red;
  color: white;
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 50%;
  font-weight: bold;
  display: none;
  line-height: 1;
}


/* ========================================= */
/* === TAMANHO SELECIONADO (ESTILO C&A) === */
/* ========================================= */

.swatchly-selected {
  background-color: #80ded9 !important;
  border-color: #80ded9 !important;
  color: #000 !important;
  box-shadow: 0 0 0 2px #80ded9 !important;
}


/* ========================================= */
/* === POPUP DE AVISO – SELECIONE UM TAMANHO === */
/* ========================================= */

/* Camada escura de fundo */
.popup-tamanho-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.5);
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

/* Caixa branca do popup */
.popup-tamanho-box {
  background: white;
  padding: 30px;
  max-width: 420px;
  width: 90%;
  border-radius: 10px;
  text-align: center;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  position: relative;
  animation: popupEntrada 0.3s ease-out;
}

/* Animação de entrada do popup */
@keyframes popupEntrada {
  from {
    transform: scale(0.9);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}

/* Título do popup */
.popup-tamanho-box h3 {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 12px;
}

/* Texto explicativo */
.popup-tamanho-box p {
  font-size: 15px;
  margin-bottom: 20px;
}

/* Botões de tamanho dentro do popup */
.popup-tamanhos {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-bottom: 20px;
}

/* === BOTÕES DE TAMANHO PADRÃO (POPUP) === */
.btn-tamanho-popup {
  background-color: #fff;
  border: 1px solid #000;
  color: #000;
  padding: 8px 14px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.3s ease;
  min-width: 40px;
  text-align: center;
  display: inline-block;
}

.btn-tamanho-popup:hover {
  background-color: #0073e6;
  color: #fff;
  border-color: #0073e6;
}

.btn-tamanho-popup.selected {
  background-color: #80ded9;
  border-color: #80ded9;
  color: #000;
  box-shadow: 0 0 0 2px #80ded9;
}

/* === BOTÃO AZUL "Adicionar à Sacola" (POPUP) === */
.popup-btn-adicionar {
  background-color: #0073e6;
  color: #fff;
  border: none;
  padding: 12px 24px;
  border-radius: 30px;
  font-size: 14px;
  font-weight: bold;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.popup-btn-adicionar:hover {
  background-color: #005bb5;
}

/* === BOTÃO "X" DE FECHAR POPUP === */
.popup-close {
  position: absolute;
  top: 10px;
  right: 14px;
  font-size: 22px;
  font-weight: bold;
  background: transparent;
  border: none;
  color: #888;
  cursor: pointer;
}

/* === MINI-CART (Sacola Lateral) – ITEM === */
.woocommerce-mini-cart-item {
  display: flex;
  gap: 12px;
  margin-bottom: 20px;
  padding-bottom: 15px;
  border-bottom: 1px solid #eee;
  position: relative;
}

.woocommerce-mini-cart-item img {
  width: 70px;
  height: auto;
  object-fit: contain;
  border-radius: 6px;
}

/* === TEXTO DO ITEM DA SACOLA === */
.woocommerce-mini-cart-item .gufe-cart-texto {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.gufe-cart-nome {
  font-size: 14px;
  font-weight: 600;
  color: #000;
  margin-bottom: 4px;
}

.gufe-cart-var {
  font-size: 13px;
  color: #555;
  line-height: 1.3;
  margin-bottom: 10px;
}

.gufe-cart-preco {
  font-size: 14px;
  color: #000;
  font-weight: bold;
  margin-bottom: 6px;
}

/* === CONTROLES DE QUANTIDADE E REMOVER === */
.gufe-cart-controles {
  display: flex;
  align-items: center;
  gap: 10px;
}

.gufe-cart-controles select {
  padding: 4px 8px;
  font-size: 13px;
  border: 1px solid #ccc;
  border-radius: 4px;
}

.gufe-cart-controles .gufe-cart-remove {
  background: none;
  border: none;
  font-size: 18px;
  color: #888;
  cursor: pointer;
  transition: color 0.3s ease;
}

.gufe-cart-controles .gufe-cart-remove:hover {
  color: red;
}


/* === MINI-CART – FUNDO ESCURO (Overlay) === */
.gufe-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 9998;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.gufe-overlay.ativa {
  display: block;
  opacity: 1;
}

/* === MINI-CART – ESTRUTURA LATERAL === */
.gufe-mini-cart {
  position: fixed;
  top: 0;
  right: -400px; /* Escondido por padrão */
  width: 360px;
  height: 100vh;
  background: #fff;
  box-shadow: -4px 0 15px rgba(0, 0, 0, 0.2);
  padding: 20px;
  overflow-y: hidden;
  z-index: 9999;
  transition: right 0.3s ease;
}

.gufe-mini-cart.aberta {
  right: 0; /* Mostra a sacola */
}

/* === BOTÃO "X" PARA FECHAR SACOLA === */
.gufe-cart-close {
  background: none;
  border: none;
  font-size: 24px;
  cursor: pointer;
  float: right;
  color: #333;
}

/* === CABEÇALHO DA SACOLA === */
.gufe-cart-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: bold;
  font-size: 20px;
  margin-bottom: 12px;
}

/* === ÁREA DE ITENS DA SACOLA (conteúdo) === */
#gufe-cart-content {
  max-height: calc(100vh - 70px);
  overflow-y: auto;
}

/* === ÁREA SCROLLÁVEL INTERNA (sem ocultar rodapé) === */
.gufe-cart-scroll {
  max-height: calc(100vh - 300px);
  overflow-y: auto;
  margin-bottom: 0;
  padding-right: 5px;
}

/* === RODAPÉ FIXO DA SACOLA === */
.gufe-cart-footer {
  position: relative;
  background: #fff;
  padding: 20px 10px 30px;
  border-top: 1px solid #eee;
  box-shadow: 0 -2px 6px rgba(0, 0, 0, 0.04);
}

/* === ÁREA DO CUPOM DE DESCONTO === */
.gufe-cupom-area {
  padding: 0 10px;
  margin-top: 14px;
  text-align: left;
}

/* === LINK "Adicionar cupom" === */
.gufe-cupom-link {
  display: inline-block;
  font-size: 15px;
  font-weight: bold;
  color: #0073e6;
  text-decoration: underline;
  cursor: pointer;
  margin-bottom: 8px;
  transition: color 0.3s ease;
}

.gufe-cupom-link:hover {
  color: #005bb5;
}

/* === FORMULÁRIO DO CUPOM (inicialmente oculto) === */
#gufe-cupom-form {
  display: none;
  padding-top: 10px;
}

/* === INPUT DO CUPOM === */
#gufe-cupom-form input[type="text"] {
  width: calc(100% - 100px);
  padding: 10px;
  font-size: 14px;
  border: 1px solid #ccc;
  border-radius: 6px 0 0 6px;
  outline: none;
}

/* === BOTÃO "Aplicar" DO CUPOM === */
#gufe-cupom-form button {
  width: 100px;
  padding: 10px;
  background: #0073e6;
  color: white;
  font-weight: bold;
  border: none;
  border-radius: 0 6px 6px 0;
  cursor: pointer;
  font-size: 14px;
}

#gufe-cupom-form button:hover {
  background: #005bb5;
}


/* ========================================= */
/* === MINI-CART – TOTAIS E AÇÕES FINAIS === */
/* ========================================= */

/* === RESUMO DOS TOTAIS === */
.gufe-cart-total {
  display: block !important;
  padding: 15px 10px 0;
  font-size: 16px;
  font-weight: 500;
  color: #333;
  background: #fff;
  visibility: visible !important;
  opacity: 1 !important;
}

.gufe-cart-total p {
  display: flex;
  justify-content: space-between;
  margin: 8px 0;
  font-size: 15px;
  line-height: 1.4;
}

.gufe-cart-subtotal {
  font-weight: 500;
  color: #666;
}

.gufe-cart-desconto {
  color: #d40000;
  font-weight: 600;
}

.gufe-cart-total-valor {
  font-weight: bold;
  color: #111;
}

/* === LINHAS DE TOTALIZAÇÃO === */
.gufe-total-linha {
  display: flex;
  justify-content: space-between;
  font-size: 15px;
  color: #666;
  margin: 6px 0;
}

.gufe-total-linha.total {
  font-size: 17px;
  font-weight: bold;
  color: #111;
}

.gufe-total-info {
  font-size: 13px;
  color: #777;
  margin-top: 12px;
  line-height: 1.5;
}

/* === BOTÃO FINALIZAR PEDIDO (Mini-Cart) === */
.gufe-cart-actions {
  margin-top: 20px;
  padding: 0 10px;
}

.gufe-btn-finalizar {
  background-color: #3600d3;
  color: white;
  width: 100%;
  padding: 16px;
  display: block;
  text-align: center;
  font-weight: bold;
  font-size: 16px;
  border-radius: 40px;
  text-decoration: none;
  transition: background 0.3s ease;
}

.gufe-btn-finalizar:hover {
  background-color: #2a00aa;
}

/* ========================================= */
/* === CHECKOUT – RESUMO DO PEDIDO (C&A) === */
/* ========================================= */

/* Etapas de checkout */
.resumo-passo {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 40px;
  margin-bottom: 40px;
  border-bottom: 2px solid #f0f0f0;
  padding-bottom: 10px;
  font-size: 15px;
  font-weight: 500;
  color: #999;
}

.resumo-passo .passo {
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #999;
  font-size: 14px;
  text-transform: lowercase;
}

.resumo-passo .passo .icone {
  width: 45px;
  height: 45px;
  border: 2px solid #ccc;
  border-radius: 50%;
  margin-bottom: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.resumo-passo .passo .icone img {
  width: 20px;
  height: 20px;
}

.resumo-passo .passo.ativo {
  color: #000;
  font-weight: bold;
}

.resumo-passo .passo.ativo .icone {
  border-color: #000;
}

/* Container geral */
.resumo-container {
  max-width: 900px;
  margin: 40px auto;
  padding: 20px;
  text-align: center;
}

/* Produto no resumo */
.resumo-produto {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}

.resumo-produto img {
  width: 100px;
  height: 100px;
  object-fit: cover;
  border-radius: 6px;
  margin-right: 20px;
}

.resumo-info-produto {
  font-size: 16px;
  color: #222;
  text-align: left;
}

/* Total geral */
.resumo-total {
  margin-top: 25px;
  font-size: 22px;
  font-weight: bold;
  color: #222;
  border-top: 1px solid #eee;
  padding-top: 15px;
}

/* Frete e info */
.resumo-frete {
  font-size: 14px;
  color: #555;
  margin-top: 15px;
}

/* Layout de duas colunas */
.resumo-duas-colunas {
  display: flex;
  gap: 40px;
  justify-content: center;
  margin-top: 40px;
  flex-wrap: wrap;
}

.resumo-col-esquerda {
  flex: 1;
  min-width: 280px;
  max-width: 500px;
}

.resumo-col-direita {
  flex: 1;
  min-width: 280px;
  max-width: 400px;
  padding-top: 20px;
}

/* Botão aplicar cupom */
.gufe-btn-aplicar {
  background-color: #0073e6;
  color: white;
  font-weight: bold;
  padding: 10px 20px;
  margin-left: 10px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
}

.gufe-btn-aplicar:hover {
  background-color: #005bb5;
}

/* Botão continuar / finalizar pedido (Checkout) */
.gufe-btn-continuar {
  background-color: #4200cc;
  color: #fff;
  font-weight: bold;
  padding: 15px 30px;
  border-radius: 30px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  transition: background 0.3s ease;
}

.gufe-btn-continuar:hover {
  background: #3700b3;
}