/* Vime - Checkout estilo Hotmart
   Cartoes claros sobre o fundo azul-marinho do site.
   !important e usado de proposito: o widget de checkout do Elementor
   e o escuro.css tem regras mais especificas do que estas. */

.woocommerce-checkout .woocommerce{padding:0 12px}

.woocommerce-checkout .e-checkout__container{
  display:flex !important;flex-direction:column;gap:14px;
  max-width:660px;width:100%;margin:0 auto}
.woocommerce-checkout .e-checkout__column-start,
.woocommerce-checkout .e-checkout__column-end,
.woocommerce-checkout .e-checkout__column-inner{display:contents !important}
.woocommerce-checkout .e-woocommerce-login-section{order:1}
.woocommerce-checkout .e-checkout__order_review{order:2}
.woocommerce-checkout #customer_details{order:3}
.woocommerce-checkout .e-checkout__order_review-2{order:4}

.woocommerce-checkout .e-woocommerce-login-section,
.woocommerce-checkout .e-checkout__order_review,
.woocommerce-checkout #customer_details,
.woocommerce-checkout #payment{
  background:#FFFFFF !important;border:1px solid #E4E7F2 !important;
  border-radius:16px !important;padding:18px !important;
  box-shadow:0 12px 34px rgba(0,0,0,.30);width:100% !important}
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2{
  background:transparent !important;padding:0 !important;
  width:100% !important;float:none !important}
.woocommerce-checkout #customer_details .col-2:empty{display:none}

.woocommerce-checkout .woocommerce h3{
  font-size:15px !important;font-weight:700 !important;
  color:#0D1030 !important;margin:0 0 14px !important;line-height:1.3}

/* --- resumo do pedido --- */
.woocommerce-checkout .woocommerce-checkout-review-order-table{
  background:transparent !important;border:0 !important;width:100%;margin:0 !important}
.woocommerce-checkout .woocommerce-checkout-review-order-table thead{display:none}
.woocommerce-checkout .cart_item td{
  background:transparent !important;border:0 !important;
  border-bottom:1px solid #EEF0F7 !important;padding:10px 0 !important;
  color:#0D1030 !important;font-size:14px !important;vertical-align:middle}
.woocommerce-checkout .cart_item td.product-total{text-align:right;white-space:nowrap;font-weight:700}
.woocommerce-checkout .vime-item{display:flex;align-items:center;gap:12px;text-align:left}
.woocommerce-checkout .vime-item img{
  width:54px;height:54px;border-radius:10px;object-fit:cover;
  flex:none;border:1px solid #E4E7F2;background:#F7F8FC;margin:0}
.woocommerce-checkout .vime-item .emoji{width:1em;height:1em;border:0;border-radius:0}
.woocommerce-checkout .product-quantity{
  background:transparent !important;color:#6B7291 !important;
  font-weight:500 !important;font-size:13px !important;display:block}
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot td{
  background:transparent !important;border:0 !important;padding:10px 0 0 !important;
  color:#0D1030 !important;font-size:14px !important}
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot td{text-align:right}
.woocommerce-checkout tfoot .order-total th{font-size:15px !important;font-weight:700 !important}
.woocommerce-checkout tfoot .order-total .amount{
  font-size:26px !important;font-weight:800 !important;color:#0D1030 !important}


/* Os titulos vem de outro plugin e nao passam pelo filtro de traducao,
   entao sao trocados aqui. */
.woocommerce-checkout .woocommerce-billing-fields>h3,
.woocommerce-checkout .e-checkout__order_review>h3{display:none !important}
.woocommerce-checkout .woocommerce-billing-fields:before,
.woocommerce-checkout .e-checkout__order_review:before{
  display:block;font-size:15px;font-weight:700;color:#0D1030;
  margin:0 0 14px;line-height:1.3}
.woocommerce-checkout .woocommerce-billing-fields:before{content:"Seus dados"}
.woocommerce-checkout .e-checkout__order_review:before{content:"Resumo da compra"}
