/**
 * Override: Layout do frete idêntico ao famosinhosshop.com
 * - Página produto: ícone caminhão + badge "Frete grátis" (pill verde) + "Receba até [data]" + Taxa de envio riscada
 * - Checkout: linha Frete | valor com mesmo estilo
 */

/* ========== CARDS: badges idênticos ao site de referência ========== */

/* Remove padding extra do wrapper de info (inline style do React)
   para dar espaço suficiente para os badges ficarem na mesma linha */
div:has(> .product-badges) {
  padding: 0 !important;
}

.product-badges {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  align-items: center !important;
  margin-bottom: 6px !important;
}

.product-badges .product-badge-discount {
  display: flex !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: normal !important;
  color: rgb(255, 43, 86) !important;
  background: rgb(255, 227, 234) !important;
  padding: 0 4px !important;
  margin: 0 !important;
  border-radius: 4px !important;
  gap: 4px !important;
  align-items: center !important;
}

.product-badges .product-badge {
  display: flex !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: normal !important;
  color: rgb(0, 181, 23) !important;
  background: rgb(225, 255, 255) !important;
  padding: 0 4px !important;
  border-radius: 4px !important;
  align-items: center !important;
}

/* Ícone cupom */
.product-badge-discount svg,
.product-badge-discount-icon {
  width: 10px !important;
  height: 10px !important;
  flex-shrink: 0;
}

/* Linha original de frete (React): oculta quando substituída pelo bloco customizado */
[data-frete-original="1"] {
  display: none !important;
}

/* ========== PÁGINA DE PRODUTO: bloco frete grátis (idêntico famosinhos) ========== */
.product-frete-block {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding-bottom: 12px !important;
  margin-bottom: 12px !important;
  border-bottom: 1px solid rgb(240, 240, 240) !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif !important;
}

.product-badge.product-badge-frete {
  display: inline-flex !important;
  align-items: center !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #27BF93 !important;
  background: #EDF7F5 !important;
}

.product-frete-block .product-frete-date {
  font-size: 12px !important;
  color: rgb(117, 117, 117) !important;
  font-weight: 400 !important;
}

.product-frete-block .product-frete-taxa {
  font-size: 12px !important;
  color: rgb(117, 117, 117) !important;
  font-weight: 400 !important;
}

.product-frete-block .product-frete-taxa span {
  text-decoration: line-through !important;
}

/* Layout base da linha de frete (idêntico ao HTML de referência) */
.checkout-summary-totals .checkout-summary-row,
.checkout-cart-summary .checkout-summary-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding-bottom: 12px !important;
  margin-bottom: 12px !important;
  border-bottom: 1px solid rgb(240, 240, 240) !important;
  font-size: 13px !important;
  color: rgb(34, 34, 34) !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif !important;
}

.checkout-summary-totals .checkout-summary-row > *:last-child,
.checkout-cart-summary .checkout-summary-row > *:last-child {
  font-size: 13px !important;
  color: rgb(34, 34, 34) !important;
  font-weight: 500 !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif !important;
}

/* Linha de resumo quando o frete é grátis */
.checkout-summary-row:has(.checkout-free) {
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 12px;
}

/* Label "Frete" vira badge "Frete grátis" (verde, pill) */
.checkout-summary-row:has(.checkout-free) > *:first-child {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #e8f5e9;
  color: #2e7d32;
  padding: 4px 10px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 14px;
}

.checkout-summary-row:has(.checkout-free) > *:first-child::after {
  content: " grátis";
}

/* Valor "R$ 0,00" ou "Grátis" em verde */
.checkout-summary-row .checkout-free {
  color: #2e7d32 !important;
  font-weight: 700 !important;
  background: transparent;
}

/* Bloco de frete no resumo: quando grátis, taxa original riscada */
.checkout-summary-totals .checkout-summary-row.checkout-frete-row .checkout-taxa-envio-original,
.checkout-summary-row:has(.checkout-free) + .checkout-summary-row span:last-child,
.checkout-shipping-section .checkout-summary-row:has(.checkout-free) ~ * .checkout-taxa-envio-valor {
  text-decoration: line-through !important;
  color: #999 !important;
  font-weight: 400;
}

/* Seção de frete no checkout: título + opção grátis com badge */
.checkout-shipping-price-free {
  color: #2e7d32 !important;
  font-weight: 700 !important;
  background: #e8f5e9;
  padding: 2px 8px;
  border-radius: 6px;
}

/* Cart: banner frete grátis (reforçar estilo do print) */
.cart-free-shipping-banner {
  background: #F0FAFB !important;
  border-radius: 8px;
}

.cart-free-shipping-banner span {
  color: #2e7d32 !important;
  font-weight: 600 !important;
}

.checkout-container .cart-free-shipping-banner span,
.cart-content .cart-free-shipping-banner span {
  color: #222 !important;
}

/* Resumo checkout: linha "Frete" com valor grátis - data de entrega em cinza ao lado do badge */
.checkout-summary-row:has(.checkout-free) .checkout-entrega-date {
  color: #666;
  font-size: 13px;
  font-weight: 400;
}

/* ========== CHECKOUT: Payment section — card igual ao resumo ========== */
.checkout-form-section.checkout-payment-section,
.checkout-payment-section {
  background: #fff !important;
  padding: 12px !important;
  margin: 0 16px 50px !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

/* ========== CHECKOUT: Order Bump / Upsell (exact copy from achadinhos-online.com) ========== */
.checkout-add-to-purchase {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid #e0e0e0;
  margin-left: calc(-1 * var(--spacing-lg));
  margin-right: calc(-1 * var(--spacing-lg));
  padding-left: var(--spacing-lg);
  padding-right: var(--spacing-lg);
}

.checkout-add-to-purchase-title {
  font-size: 14px;
  font-weight: 600;
  color: #222;
  margin-bottom: 12px;
}

.checkout-upsell-card {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px;
  background: #e8f5e9;
  border: 1px solid rgba(76, 175, 80, 0.2);
  border-radius: 8px;
  transition: 0.2s;
}

.checkout-upsell-image {
  width: 100px;
  height: 100px;
  object-fit: cover;
  border-radius: 6px;
  flex-shrink: 0;
}

.checkout-upsell-info {
  flex: 1;
  min-width: 0;
}

.checkout-upsell-name {
  font-size: 14px;
  font-weight: 500;
  color: #222;
  margin-bottom: 4px;
}

.checkout-upsell-desc {
  font-size: 12px;
  color: #666;
  margin-bottom: 4px;
}

.checkout-upsell-price {
  font-size: 20px;
  font-weight: 600;
  color: #222;
}

.checkout-upsell-btn {
  padding: 6px 12px;
  font-size: 12px;
  font-weight: 600;
  color: #4caf50;
  background: transparent;
  border: 1px solid rgb(76, 175, 80);
  border-radius: 4px;
  cursor: pointer;
  transition: 0.2s;
  white-space: nowrap;
  align-self: center;
}

.checkout-upsell-btn:hover {
  background: rgba(76, 175, 80, 0.08);
}

/* ========== CHECKOUT: Summary card override ========== */
div:has(> .checkout-summary-totals):not(.checkout-shipping-section):not(.checkout-cart-summary) {
  background: #fff !important;
  border-radius: 8px !important;
  padding: 12px !important;
  margin: 0 16px 12px !important;
  border: 0 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

/* Título "Resumo do pedido" maior */
div:has(> .checkout-summary-totals) > h2 {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #222 !important;
  margin-bottom: 12px !important;
}

/* Descontos: label e valor em rosa */
.checkout-summary-row.discount span,
.checkout-container .checkout-summary-row.discount span,
.checkout-summary-totals .checkout-summary-row.discount span {
  color: #e91e63 !important;
}

/* Frete Grátis no resumo: desfazer badge, manter texto simples */
.checkout-summary-totals .checkout-summary-row:has(.checkout-free) > *:first-child {
  display: inline !important;
  background: none !important;
  color: var(--color-text-secondary) !important;
  padding: 0 !important;
  border-radius: 0 !important;
  font-weight: 400 !important;
  font-size: 14px !important;
}

.checkout-summary-totals .checkout-summary-row:has(.checkout-free) > *:first-child::after {
  content: none !important;
}

.checkout-summary-totals .checkout-summary-row:has(.checkout-free) {
  flex-wrap: nowrap !important;
  gap: 0 !important;
}

/* Valor "Grátis" em verde */
.checkout-summary-totals .checkout-free,
.checkout-container .checkout-summary-row .checkout-free,
.checkout-container .checkout-free {
  color: #4caf50 !important;
  font-weight: 600 !important;
  background: transparent !important;
}

/* Rows compactas no resumo */
.checkout-summary-totals .checkout-summary-row {
  margin-bottom: 4px !important;
  padding-bottom: 4px !important;
}

/* ========== CHECKOUT: Shipping options override (match achadinhos-online.com) ========== */
.checkout-shipping-section {
  margin: 16px 0 0 0 !important;
  padding: 16px !important;
  border: 1px solid var(--color-border-light) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.checkout-shipping-option {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px !important;
  background: transparent !important;
  border: 2px solid #ddd !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  margin-bottom: 8px !important;
}

.checkout-shipping-option.selected {
  border-color: var(--color-primary) !important;
  background: rgba(255, 43, 86, 0.05) !important;
}

.checkout-shipping-option input[type="radio"] {
  position: absolute !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

.checkout-shipping-option-inner {
  flex: 1 !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 12px !important;
}

.checkout-shipping-info {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

.checkout-shipping-name {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #222 !important;
}

.checkout-shipping-desc {
  font-size: 14px !important;
  color: #222 !important;
  font-weight: 400 !important;
}

.checkout-shipping-price {
  margin-left: auto !important;
  font-size: 16px !important;
  color: #222 !important;
  font-weight: 700 !important;
  flex-shrink: 0 !important;
}

.checkout-shipping-price-free {
  margin-left: auto !important;
  font-size: 14px !important;
  color: #4caf50 !important;
  font-weight: 700 !important;
  flex-shrink: 0 !important;
}

/* ========== CARRINHO + CATEGORIA: botões abaixo de vendidos ========== */
.cart-content .product-list .product-info,
.cart-you-may-like-list .product-info,
.container:not(:has(> .nav-tabs)) > .product-list .product-info {
  display: flex !important;
  flex-direction: column !important;
}

.cart-content .product-list .product-info > .product-actions,
.cart-you-may-like-list .product-info > .product-actions,
.container:not(:has(> .nav-tabs)) > .product-list .product-info > .product-actions {
  width: 100% !important;
  margin-top: 8px !important;
}

.cart-content .product-list .product-actions .buy-btn,
.cart-you-may-like-list .product-actions .buy-btn,
.container:not(:has(> .nav-tabs)) > .product-list .product-actions .buy-btn {
  flex: 1 !important;
}

/* ========== HOME Produtos: esconder botão carrinho nos cards grid (só na home) ========== */
.container:has(> .nav-tabs) > .product-list .product-card .add-to-cart-btn {
  display: none !important;
}


/* ========== CATEGORIA: esconder barra de filtros ========== */
.container > .filter-chips + .product-list ~ .filter-chips,
.container:has(> .product-list) > .filter-chips {
  display: none !important;
}

/* ========== CATEGORIA: layout lista horizontal (igual carrinho) ========== */
.container:not(:has(> .nav-tabs)) > .product-list {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--spacing-md) !important;
}

.container:not(:has(> .nav-tabs)) > .product-list .product-card {
  flex-direction: row !important;
  margin-bottom: 0 !important;
  display: flex !important;
  gap: var(--spacing-md) !important;
}

.container:not(:has(> .nav-tabs)) > .product-list .product-card .product-image {
  width: 136px !important;
  height: 136px !important;
  aspect-ratio: auto !important;
  border-radius: var(--radius-md) !important;
  margin-bottom: 0 !important;
  flex-shrink: 0 !important;
}

.container:not(:has(> .nav-tabs)) > .product-list .product-card .product-info {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
}

.container:not(:has(> .nav-tabs)) > .product-list .product-card .product-price-section {
  flex-direction: column !important;
  align-items: stretch !important;
}

.container:not(:has(> .nav-tabs)) > .product-list .product-card .product-actions {
  width: 100% !important;
  margin-top: 8px !important;
}

.container:not(:has(> .nav-tabs)) > .product-list .product-card .product-actions .buy-btn {
  flex: 1 !important;
}

.container:not(:has(> .nav-tabs)) > .product-list .product-card .add-to-cart-btn {
  display: flex !important;
  border-radius: 6px 0 0 6px !important;
  width: auto !important;
  height: auto !important;
  padding: 6px 10px !important;
  min-width: 36px !important;
}

/* ========== PÁGINA PRODUTO: scroll até o final ========== */
html {
  overflow-x: hidden;
  overflow-y: scroll; /* força scroll no documento */
  -webkit-overflow-scrolling: touch;
  height: 100%;
}

body {
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  min-height: 100%;
  position: relative;
}

#root,
.container {
  overflow-x: hidden !important;
  overflow-y: visible !important;
  min-height: 100%;
}

.product-detail-page {
  overflow: visible !important;
  padding-bottom: 140px;
  min-height: auto;
}

/* Garantir que a galeria não impeça o scroll da página (só o horizontal da galeria) */
.product-gallery-wrap {
  touch-action: pan-y pinch-zoom;
}