/**
 * Mindcommerce — Carrinho e Checkout (Tasks 12–13, D-19)
 *
 * Referência de layout: itens e etapas em cartões brancos, resumo do pedido
 * num painel cinza, botão verde de conversão, selos de confiança abaixo.
 * Só classes genéricas do WooCommerce Blocks — nenhuma de gateway específico
 * (a base serve PagBank, Mercado Pago ou qualquer outro).
 * Carregado só em is_cart() / is_checkout(). Somente tokens (check-tokens P4).
 *
 * @package mindcommerce
 */

/* =============================================================================
   CAMPOS E BOTÕES (carrinho e checkout)
   ============================================================================= */
.wc-block-components-text-input input,
.wc-block-components-combobox .wc-block-components-combobox-control input,
.wc-block-components-select-input select,
.wc-blocks-components-select .wc-blocks-components-select__select,
.wc-block-components-textarea {
	border-color: var(--color-border-strong);
	border-radius: var(--radius-sm);
}

.wc-block-components-text-input input:focus,
.wc-block-components-combobox .wc-block-components-combobox-control input:focus,
.wc-blocks-components-select .wc-blocks-components-select__select:focus,
.wc-block-components-textarea:focus {
	border-color: var(--color-border-focus);
	box-shadow: 0 0 0 var(--border-width) var(--color-border-focus);
}

.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
	min-height: var(--button-height-lg);
	background: var(--color-conversion);
	color: var(--color-on-conversion);
	border-radius: var(--radius-sm);
	font-size: var(--text-button);
	font-weight: var(--font-weight-semibold);
	letter-spacing: var(--letter-spacing-button);
	text-transform: uppercase;
}

.wc-block-cart__submit-button:hover,
.wc-block-cart__submit-button:focus-visible,
.wc-block-components-checkout-place-order-button:hover,
.wc-block-components-checkout-place-order-button:focus-visible {
	background: var(--color-conversion-hover);
	color: var(--color-on-conversion);
}

/* Selo "Economize R$ X" em verde, como na referência */
.wc-block-components-product-badge.wc-block-components-sale-badge {
	background: var(--color-success-bg);
	color: var(--color-success);
	border-color: var(--color-success-border);
	border-radius: var(--radius-sm);
	font-weight: var(--font-weight-semibold);
}

/* =============================================================================
   RESUMO DO PEDIDO — painel cinza (carrinho e checkout)
   ============================================================================= */
.wc-block-cart .wc-block-cart__sidebar,
.wc-block-checkout .wp-block-woocommerce-checkout-order-summary-block {
	padding: var(--space-lg);
	background: var(--color-bg-subtle);
	border: 0;
	border-radius: var(--radius-lg);
}

.wc-block-cart .wc-block-cart__totals-title,
.wc-block-checkout .wc-block-components-checkout-order-summary__title-text {
	font-size: var(--text-h3);
	line-height: var(--line-height-h3);
	font-weight: var(--font-weight-bold);
	color: var(--color-text-primary);
	text-transform: none;
}

.wc-block-components-totals-wrapper {
	border-color: var(--color-border-default);
}

.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	font-size: var(--text-h3);
	font-weight: var(--font-weight-bold);
	color: var(--color-text-primary);
}

/* =============================================================================
   CARRINHO — itens em cartão
   ============================================================================= */
/* O selo "Economize R$ X" não pode forçar a tabela além da tela no celular */
.wc-block-cart .wc-block-components-sale-badge {
	white-space: normal;
}

.wc-block-cart .wc-block-cart-items__row td {
	border-color: var(--color-border-default);
}

.wc-block-cart .wc-block-components-product-name {
	font-weight: var(--font-weight-semibold);
	color: var(--color-text-primary);
}

.wc-block-cart .wc-block-cart-item__image img {
	background: var(--color-bg-subtle);
	border-radius: var(--radius-sm);
}

.wc-block-components-quantity-selector {
	border-color: var(--color-border-strong);
	border-radius: var(--radius-sm);
}

/* =============================================================================
   CHECKOUT — etapas em cartões numerados
   ============================================================================= */
.wc-block-checkout .wc-block-components-checkout-step {
	margin-bottom: var(--space-lg);
	padding: var(--space-lg);
	background: var(--color-bg-card);
	border: var(--border-width) solid var(--color-border-default);
	border-radius: var(--radius-lg);
}

.wc-block-checkout .wc-block-components-checkout-step__title {
	font-size: var(--text-h3);
	line-height: var(--line-height-h3);
	font-weight: var(--font-weight-bold);
	color: var(--color-text-primary);
}

/* Número da etapa (opção "Mostrar números das etapas" do bloco Checkout) */
.wc-block-checkout__form--with-step-numbers .wc-block-components-checkout-step--with-step-number .wc-block-components-checkout-step__title::before {
	background: var(--color-primary);
	color: var(--color-on-primary);
}

/* A linha vertical entre os números não faz sentido com etapas em cartões */
.wc-block-checkout__form--with-step-numbers .wc-block-components-checkout-step--with-step-number::after {
	display: none;
}

/* Meios de pagamento e de entrega: opções em cartões, a escolhida em destaque */
.wc-block-checkout .wc-block-components-radio-control__option,
.wc-block-checkout .wc-block-components-radio-control-accordion-option {
	border-radius: var(--radius-md);
}

.wc-block-checkout .wc-block-components-radio-control__input:checked {
	border-color: var(--color-primary);
}

.wc-block-checkout .wc-block-components-radio-control__input:checked::before {
	background: var(--color-primary);
}

.wc-block-checkout .wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option--checked-option-highlighted,
.wc-block-checkout .wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control__option--checked-option-highlighted {
	background: var(--color-primary-tint);
	box-shadow: inset 0 0 0 var(--border-width-strong) var(--color-primary);
}

/* Termos e aviso de convidado */
.wc-block-checkout .wc-block-checkout__terms,
.wc-block-checkout .wc-block-checkout__guest-checkout-notice {
	font-size: var(--text-body-sm);
	color: var(--color-text-secondary);
}

/* =============================================================================
   SELOS DE CONFIANÇA (widgets "Cart/Checkout Custom Area")
   ============================================================================= */
.mc-trust-area {
	margin: var(--space-lg) 0 var(--space-3xl);
}

/* Enquanto o bloco carrega (classe is-loading, removida pelo React) a área fica
   invisível: evita deslocamento de layout (CLS) quando o bloco cresce (D-27). */
.wp-block-woocommerce-cart.is-loading ~ .mc-trust-area,
.wp-block-woocommerce-checkout.is-loading ~ .mc-trust-area {
	visibility: hidden;
}

.mc-trust {
	display: grid;
	gap: var(--space-md);
	margin: 0;
	padding: 0;
	list-style: none;
}

.mc-trust li {
	padding: var(--space-md) var(--space-lg);
	background: var(--color-bg-subtle);
	border-radius: var(--radius-md);
	font-size: var(--text-body-sm);
	line-height: var(--line-height-body-sm);
	color: var(--color-text-secondary);
}

.mc-trust strong {
	display: block;
	font-size: var(--text-body);
	font-weight: var(--font-weight-semibold);
	color: var(--color-text-primary);
}

@media (min-width: 768px) {
	.mc-trust {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}