/* ==========================================================================
   Bilbao — Carrinho + Checkout (clássico)
   Ref. Figma: Carrinho/Checkout (4255:1677) e Checkout (4239:240)
   ========================================================================== */

/* --- Header/Footer minimalistas do checkout --- */
.checkout-header { border-bottom: 1px solid var(--c-border); }
.checkout-header__topbar {
  background: var(--c-brand-900);
  color: #fff;
  text-align: center;
  font: var(--t-body-xs);
  padding: 8px 16px;
}
.checkout-header__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 88px;
}
.checkout-header__bar .site-logo { margin: 0 auto; }
.checkout-header__bar .site-logo img { height: 40px; width: auto; }
.checkout-header__back { font: var(--t-body-sm); color: var(--c-neutral-700); white-space: nowrap; }
.checkout-header__spacer { width: 120px; }
.checkout-footer { border-top: 1px solid var(--c-border); text-align: center; padding: 32px 16px; }
.checkout-footer p { font: var(--t-body-xs); color: var(--c-neutral-500); }

/* --- Layout: 2 colunas --- */
.woocommerce-cart .woocommerce {
  display: grid;
  align-items: start;
}
/* Carrinho: tabela à esquerda (larga) + resumo à direita (360). O
   .woocommerce-notices-wrapper (vazio) NÃO pode ocupar uma célula, então é
   forçado a ocupar a linha inteira; tabela e resumo ficam alinhados. */
.woocommerce-cart .woocommerce {
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 0 48px;
}
.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
.woocommerce-cart .woocommerce-cart-form { grid-column: 1; min-width: 0; overflow-x: auto; }
.woocommerce-cart .cart-collaterals { grid-column: 2; }
.woocommerce table.cart { table-layout: fixed; width: 100%; min-width: 0; }
.woocommerce table.cart thead .product-subtotal,
.woocommerce table.cart td.product-subtotal { display: none; }

/* --- Tabela do carrinho --- */
.woocommerce table.shop_table { width: 100%; border-collapse: collapse; border: 0; }
.woocommerce table.cart thead th {
  text-align: left;
  font: var(--t-label-sm-bold);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: var(--c-neutral-500);
  padding: 0 12px 16px;
  border-bottom: 1px solid var(--c-border);
}
.woocommerce table.cart tbody td {
  padding: 20px 12px;
  border-bottom: 1px solid var(--c-border);
  vertical-align: middle;
}
/* Larguras das colunas — X estreito (não deixa vão gigante), imagem fixa. */
.woocommerce table.cart .product-remove { width: 44px; text-align: center; padding-left: 0; padding-right: 0; }
.woocommerce table.cart .product-thumbnail { width: 88px; }
.woocommerce table.cart .product-price { width: 108px; }
.woocommerce table.cart .product-quantity { width: 104px; }
.woocommerce table.cart .product-name { word-break: break-word; }
.woocommerce table.cart .product-thumbnail img { width: 84px; height: 108px; object-fit: cover; background: var(--c-neutral-0); }
.woocommerce table.cart .product-name a { font: var(--t-body-sm); color: var(--c-neutral-900); }
.woocommerce table.cart .product-name .variation { margin: 6px 0 0; font: var(--t-body-xs); color: var(--c-neutral-500); }
.woocommerce table.cart .product-name .variation dt,
.woocommerce table.cart .product-name .variation dd { margin: 0; display: inline; }
.woocommerce table.cart .product-name .variation p { margin: 0; }
.woocommerce .product-price,
.woocommerce .product-subtotal { font: var(--t-label-lg-bold); letter-spacing: 0; color: var(--c-neutral-900); }

.woocommerce a.remove {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; color: var(--c-neutral-500); font-size: 18px; border-radius: 4px;
}
.woocommerce a.remove:hover { color: var(--c-brand-500); background: var(--c-brand-300); }

/* Stepper de quantidade */
.woocommerce .quantity { display: inline-flex; align-items: center; border: 1px solid var(--c-neutral-100); border-radius: 6px; overflow: hidden; }
.woocommerce .quantity input.qty {
  width: 52px; height: 42px; text-align: center; border: 0; font: var(--t-body-sm);
  -moz-appearance: textfield;
}
.woocommerce .quantity input.qty::-webkit-outer-spin-button,
.woocommerce .quantity input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* Ações (cupom + atualizar). O td.actions PRECISA continuar table-cell (colspan)
   — se virar flex, perde o colspan e colapsa. Cupom à esquerda, atualizar à direita. */
.woocommerce table.cart td.actions { padding: 24px 0; border: 0; }
.woocommerce table.cart td.actions::after { content: ""; display: table; clear: both; }
.woocommerce .coupon { float: left; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.woocommerce .coupon .input-text { width: 200px; max-width: 100%; border: 1px solid var(--c-neutral-100); border-radius: 6px; padding: 13px 14px; font: var(--t-body-sm); }
.woocommerce table.cart td.actions .button[name="update_cart"] { float: right; }

/* --- Resumo (cart totals / order review) --- */
.cart_totals, .woocommerce-checkout-review-order {
  background: #fff; border: 1px solid var(--c-border); border-radius: 8px; padding: 28px;
}
.cart_totals h2, #order_review_heading {
  font: var(--t-title-sm); font-size: 18px; color: var(--c-neutral-900); margin: 0 0 18px;
}
.cart_totals table, .woocommerce-checkout-review-order-table { width: 100%; }
.cart_totals th, .cart_totals td,
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
  padding: 12px 0; font: var(--t-body-sm); color: var(--c-neutral-700); text-align: left; border: 0;
}
.cart_totals td, .woocommerce-checkout-review-order-table td { text-align: right; color: var(--c-neutral-900); }
.cart_totals .order-total th, .cart_totals .order-total td,
.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order-table .order-total td {
  font: var(--t-title-sm); font-size: 18px; color: var(--c-neutral-900); border-top: 1px solid var(--c-border); padding-top: 16px;
}
.woocommerce-checkout-review-order-table thead th {
  font: var(--t-label-sm-bold); letter-spacing: var(--ls-label); text-transform: uppercase;
  color: var(--c-neutral-500); border-bottom: 1px solid var(--c-border); padding-bottom: 12px;
}
.woocommerce-checkout-review-order-table .cart_item td { border-bottom: 1px solid var(--c-border); }

/* Botões brown */
.wc-proceed-to-checkout { margin-top: 20px; }
.woocommerce .checkout-button,
.woocommerce #place_order,
.woocommerce-cart .wc-proceed-to-checkout a.button {
  display: block; width: 100%; text-align: center;
  background: var(--c-brand-900); color: #fff; border-radius: 6px;
  padding: 16px 14px; border: 0;
  font-family: var(--font-sans); font-weight: 700; font-size: 11px; line-height: 1.3;
  letter-spacing: 0.3px; text-transform: uppercase; white-space: nowrap;
}
.woocommerce .checkout-button:hover,
.woocommerce #place_order:hover { background: #3f2016; opacity: 1; }
/* Remove o <br> hardcoded no texto do botão (vinha do plugin/config). */
.woocommerce .checkout-button br,
.woocommerce #place_order br,
.woocommerce .wc-proceed-to-checkout a.button br { display: none; }

/* --- Checkout: colunas --- */
/* Checkout em FLOATS (colunas com alturas independentes — sem vão).
   Esquerda: dados do cliente. Direita: "Seu pedido" + resumo empilhados. */
.woocommerce-checkout form.checkout.woocommerce-checkout { display: block; }
.woocommerce-checkout form.checkout.woocommerce-checkout::after { content: ""; display: table; clear: both; }
.woocommerce-checkout #customer_details { float: left; width: calc(100% - 448px); }
.woocommerce-checkout #order_review_heading { float: right; clear: right; width: 400px; margin: 0 0 20px; }
.woocommerce-checkout #order_review { float: right; clear: right; width: 400px; }
.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout .col2-set .col-2 { width: 100%; float: none; margin-bottom: 24px; }
.woocommerce-checkout h3 { font: var(--t-title-sm); font-size: 18px; color: var(--c-neutral-900); margin: 0 0 16px; }

/* Campos do formulário */
.woocommerce form .form-row { margin: 0 0 16px; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.woocommerce form .form-row label { font: var(--t-label-sm-bold); letter-spacing: 1px; text-transform: uppercase; color: var(--c-neutral-500); }
.woocommerce form .form-row .required { color: var(--c-brand-500); border: 0; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .select2-container .select2-selection {
  border: 1px solid var(--c-neutral-100) !important;
  border-radius: 6px; padding: 14px 16px; font: var(--t-body-sm);
  color: var(--c-neutral-900); min-height: 50px; background: #fff;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row select:focus { outline: none; border-color: var(--c-brand-900); }
/* Campos em GRID 2 colunas: alinhado e com espaçamento uniforme (premium).
   wide = ocupa as 2 colunas; first = col 1; last = col 2. */
.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper,
.woocommerce-additional-fields__field-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px 16px;
}
.woocommerce-billing-fields__field-wrapper .form-row,
.woocommerce-shipping-fields__field-wrapper .form-row,
.woocommerce-additional-fields__field-wrapper .form-row { grid-column: 1 / -1; margin: 0; }
.woocommerce form .form-row-first { grid-column: 1; }
.woocommerce form .form-row-last { grid-column: 2; }
.woocommerce form .clear { display: none; }
.woocommerce-checkout #payment { background: transparent; border-radius: 0; margin-top: 8px; }
.woocommerce-checkout #payment ul.payment_methods { border: 0; padding: 0; margin: 0 0 16px; list-style: none; }
.woocommerce-checkout #payment ul.payment_methods li { padding: 12px 0; border-bottom: 1px solid var(--c-border); }
.woocommerce-checkout #payment div.payment_box { background: var(--c-brand-300); border-radius: 6px; font: var(--t-body-xs); color: var(--c-neutral-700); }
.woocommerce-checkout #payment div.payment_box::before { display: none; }

/* --- Responsivo --- */
@media (max-width: 900px) {
  .woocommerce-cart .woocommerce { grid-template-columns: 1fr; }
  .woocommerce-cart .woocommerce-cart-form,
  .woocommerce-cart .cart-collaterals { grid-column: 1; }
  .woocommerce-checkout #customer_details,
  .woocommerce-checkout #order_review_heading,
  .woocommerce-checkout #order_review { float: none; width: 100%; }
  .woocommerce-checkout #order_review_heading { margin-top: 24px; }
  .woocommerce table.cart .product-thumbnail img { width: 64px; height: 84px; }
  .checkout-header__spacer { display: none; }
}