/* ==========================================================================
   Sousènsi — loja: cards de produto, página de produto, vídeos de quem usa,
   carrinho e checkout
   ========================================================================== */

/* -------------------------------------------------------------- cards de produto */

/* O card fica com o mesmo fundo da seção e só uma sombra baixa e difusa o separa, sem
   contraste de cor nem contorno. No hover a sombra só se abre um pouco. Foto, nome e preço
   alinhados à esquerda, em leitura editorial. */
body.sd .c-product-grid__item {
	background: var(--sd-paper) !important;
	border: 0 !important;
	border-radius: 4px;
	box-shadow: 0 1px 2px rgba(42, 39, 36, .035), 0 10px 28px -14px rgba(42, 39, 36, .11) !important;
	transition: box-shadow .5s var(--sd-ease);
}
body.sd .c-product-grid__item:hover {
	box-shadow: 0 1px 3px rgba(42, 39, 36, .04), 0 14px 32px -14px rgba(42, 39, 36, .14) !important;
}

body.sd .c-product-grid__thumb-wrap,
body.sd .c-product-grid__thumb {
	background: #efeeea;
}
body.sd .c-product-grid__thumb-wrap { border-radius: 4px 4px 0 0; overflow: hidden; }

body.sd .c-product-grid__details {
	display: flex !important;
	flex-direction: column !important;
	background: transparent !important;
	padding: 20px 20px 0 !important;
	text-align: left !important;
	align-items: stretch !important;
	justify-content: flex-start !important;
}
body.sd .c-product-grid__title-wrap {
	text-align: left !important;
	min-height: 0 !important;
	margin-bottom: 10px;
	flex: 1 1 auto;   /* empurra os preços para a mesma linha em toda a fileira */
}
body.sd .c-product-grid__price-wrap {
	justify-content: flex-start !important;
	text-align: left !important;
	margin-top: 0 !important;
}
body.sd .c-product-grid__item .star-rating { margin: 6px 0 0 !important; }

/* Nome do produto: sans regular, porque em corpo pequeno a Light fica fraca */
body.sd .woocommerce-loop-product__title {
	font-size: var(--sd-step-1) !important;
	line-height: 1.3 !important;
	padding: 0 !important;
	min-height: 0 !important;
}
body.sd .woocommerce-loop-product__title,
body.sd .c-product-grid__title {
	font-weight: 400 !important;
	letter-spacing: 0 !important;
}

/* Subtítulo do card (campo do produto, inc/loja.php) */
body.sd .sd-card__sub {
	font-family: var(--sd-text) !important;
	font-size: 0.875rem !important;
	font-weight: var(--sd-light-weight) !important;
	line-height: 1.45 !important;
	color: var(--sd-ink-soft) !important;
	margin: 6px 0 0 !important;
}

body.sd .c-product-grid__item .price,
body.sd .c-product-grid__item .price * {
	font-family: var(--sd-text) !important;
	letter-spacing: 0 !important;
}
body.sd .price ins .amount,
body.sd .price > .amount {
	font-weight: 500 !important;
	color: var(--sd-ink) !important;
}
body.sd .price del,
body.sd .price del .amount {
	color: var(--sd-ink-soft) !important;
	font-weight: 400 !important;
	font-size: 0.875em;
	text-decoration-thickness: 1px;
}

body.sd .star-rating,
body.sd .star-rating span::before { color: var(--sd-clay) !important; }

/* Selos sobre a foto: pílulas claras; o desconto em pílula cheia no Azul profundo, para ser
   visto (pedido da fundadora; branco nesse azul tem 5,1:1) */
body.sd .c-product-grid__badges { left: 12px; top: 12px; }
body.sd .c-badge {
	font-family: var(--sd-text) !important;
	font-size: 0.625rem !important;
	font-weight: 500 !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	background: rgba(255, 255, 255, .92) !important;
	color: var(--sd-ink) !important;
	padding: 6px 10px !important;
	border-radius: var(--sd-pill);
}
body.sd .c-badge--custom { display: inline-block; }
body.sd .c-badge--sale {
	background: var(--sd-blue-deep) !important;
	color: var(--sd-white) !important;
	font-size: 0.75rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.04em !important;
}

/* Botão do card: link com filete em cima, não um segundo botão cheio */
body.sd .c-product-grid__atc {
	background: transparent !important;
	border: 0 !important;
	border-top: 1px solid var(--sd-line) !important;
	border-radius: 0 !important;
	color: var(--sd-ink) !important;
	min-height: 0 !important;
	height: auto !important;
	line-height: 1.3 !important;
	margin-top: 16px !important;
	padding: 14px 0 !important;
	left: 20px !important;
	right: 20px !important;
	width: auto !important;
	justify-content: flex-start !important;
	text-align: left !important;
}
body.sd .c-product-grid__atc-text {
	font-family: var(--sd-text) !important;
	font-size: var(--sd-caps-size) !important;
	font-weight: 500 !important;
	letter-spacing: var(--sd-caps-tracking) !important;
	text-transform: uppercase !important;
}
body.sd .c-product-grid__atc:hover { background: transparent !important; color: var(--sd-blue-deep) !important; }

/* O carrossel corta o que passa da sua caixa: espaço embaixo para a sombra aparecer inteira */
body.sd .c-product-grid__list {
	padding-top: 8px !important;
	padding-bottom: 40px !important;
	margin-bottom: -32px !important;
}

@media (max-width: 767px) {
	body.sd .c-product-grid__details { padding: 14px 14px 0 !important; }
	body.sd .c-product-grid__badges { left: 8px; top: 8px; }
	body.sd .woocommerce-loop-product__title { font-size: 1.0625rem !important; }
	/* "Adicionar ao carrinho" não cabe numa linha com dois cards por vez: quebra em duas */
	body.sd .c-product-grid__atc { left: 14px !important; right: 14px !important; align-items: center !important; gap: 8px; }
	body.sd .c-product-grid__atc svg { flex: none; }
	body.sd .c-product-grid__atc-text {
		font-size: 0.625rem !important;
		letter-spacing: 0.08em !important;
		white-space: normal !important;
		line-height: 1.4 !important;
		text-align: left;
	}
}

/* -------------------------------------------------------------- página de produto */

body.sd .c-product__title {
	font-size: var(--sd-step-4) !important;
	line-height: 1.08 !important;
	margin-bottom: 14px !important;
}

/* Decisão de compra perto do título: preço e botão antes da descrição e dos vídeos */
body.sd .summary.entry-summary {
	display: flex;
	flex-direction: column;
}
body.sd .summary.entry-summary > * { order: 10; }
body.sd .summary.entry-summary > .c-product__title { order: 1; }
body.sd .summary.entry-summary > .price { order: 2; }
body.sd .summary.entry-summary > .c-product__atc-wrap { order: 3; }
body.sd .summary.entry-summary > .c-product__custom-html { order: 4; }
body.sd .summary.entry-summary > .c-product__short-description { order: 5; margin-top: 28px; }
body.sd .summary.entry-summary > .reelswp-group-short-code { order: 6; }
body.sd .summary.entry-summary > .c-product__tabs { order: 7; }

body.sd .summary .price {
	font-size: var(--sd-step-2) !important;
	margin: 0 0 22px !important;
}

/* Botão desabilitado (versão ainda não escolhida) continua legível */
body.sd .single_add_to_cart_button.disabled,
body.sd .single_add_to_cart_button:disabled {
	opacity: 1 !important;
	background-color: var(--sd-mist) !important;
	border-color: var(--sd-mist) !important;
	color: var(--sd-ink-soft) !important;
}

body.sd .variations_form .variations label,
body.sd .variations_form .variations td,
body.sd .variations_form .variations th {
	font-family: var(--sd-text) !important;
	font-size: 0.9375rem !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}

body.sd .c-product__tabs-list a,
body.sd .c-product__tabs-list li {
	font-family: var(--sd-text) !important;
	font-size: 0.875rem !important;
	font-weight: 500 !important;
	letter-spacing: 0.01em !important;
	text-transform: none !important;
}

body.sd .c-product__tabs-panel {
	font-size: var(--sd-step-0);
	line-height: 1.75;
	max-width: 68ch;
}

/* Ícones de benefícios da descrição (widget "image list" do tema) */
body.sd .c-ip-image-list-1__title {
	display: block;
	font-family: var(--sd-text) !important;
	font-size: 0.8125rem !important;
	font-weight: 500 !important;
	font-style: normal !important;
	letter-spacing: 0.01em !important;
	text-transform: none !important;
	line-height: 1.4 !important;
}
body.sd .c-ip-image-list-1__title::first-letter { text-transform: uppercase; }

@media (max-width: 767px) {
	body.sd .c-product__title { font-size: var(--sd-step-3) !important; }
}

/* -------------------------------------------------------------- vídeos de quem usa
   Plugin ecomm-reels (home e páginas de produto): tocam sozinhos, sem som, ao entrar na tela */

body.sd .ecr-thumb__frame { border-radius: 4px !important; overflow: hidden; }

/* Etiqueta do produto: o objetivo é prova de uso, não venda. Fica só o nome e as estrelas,
   numa etiqueta clara; saem o preço, a miniatura e a faixa escura. */
body.sd .ecr-product-card-one {
	background: rgba(247, 247, 245, .58) !important;
	-webkit-backdrop-filter: blur(6px) saturate(1.1);
	backdrop-filter: blur(6px) saturate(1.1);
	border-radius: 4px !important;
	box-shadow: none !important;
	box-sizing: border-box;
	width: 100% !important;
	margin: 0 !important;
	padding: 11px 14px !important;
}
/* afastada 12px das bordas do vídeo (o plugin cola a etiqueta a 4px) */
body.sd .ecr-admin-reelitem-links {
	left: 12px !important;
	right: 12px !important;
	bottom: 12px !important;
	width: auto !important;
	transform: none !important;
}
body.sd .ecr-product-card-one__thumb-link,
body.sd .ecr-product-card-one__price { display: none !important; }
body.sd .ecr-product-card-one__title {
	font-family: var(--sd-text) !important;
	font-weight: 500 !important;
	font-size: 0.8125rem !important;
	color: var(--sd-ink) !important;
	text-shadow: none !important;
}
body.sd .ecr-product-card-one__rating,
body.sd .ecr-product-card-one__rating * { color: var(--sd-clay) !important; fill: var(--sd-clay) !important; }

/* -------------------------------------------------------------- carrinho e checkout
   Os snippets "Cart CSS" e "bouton checkout… orange" estilizam estas páginas com variáveis
   próprias (--ss-*) e botões laranja. Aqui as variáveis apontam para a paleta e os botões
   seguem a mesma pílula do resto do site. */

body.sd.woocommerce-cart,
body.sd.woocommerce-checkout {
	--ss-azul: var(--sd-blue-deep);
	--ss-azul-profundo: var(--sd-ink);
	--ss-marrom: var(--sd-ink);
	--ss-texto: var(--sd-ink);
	--ss-texto-suave: var(--sd-ink-soft);
	--ss-raio: 2px;
}

body.sd.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
body.sd.woocommerce-cart .wc-proceed-to-checkout .c-button,
body.sd .fc-step__next-step,
body.sd .fc-step__substep-save,
body.sd button.fc-step__substep-save,
body.sd .fc-place-order-button,
body.sd.woocommerce-checkout #place_order {
	font-family: var(--sd-text) !important;
	font-size: 0.75rem !important;
	font-weight: 500 !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	padding: 15px 30px !important;
	background: var(--sd-blue-deep) !important;
	border: 1px solid var(--sd-blue-deep) !important;
	color: var(--sd-white) !important;
	border-radius: var(--sd-pill) !important;
	box-shadow: none !important;
	min-height: 54px !important;
}
body.sd.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
body.sd.woocommerce-cart .wc-proceed-to-checkout .c-button:hover,
body.sd .fc-step__next-step:hover,
body.sd .fc-place-order-button:hover,
body.sd.woocommerce-checkout #place_order:hover {
	background: var(--sd-ink) !important;
	border-color: var(--sd-ink) !important;
	box-shadow: none !important;
}

/* O botão do carrinho é um link: centraliza o texto na altura mínima da pílula */
body.sd.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
}

/* Rótulos do resumo sem caixa-alta gritando */
body.sd .c-cart__coupon-header,
body.sd .c-cart__sub-header,
body.sd .c-cart__sub-sub-header,
body.sd.woocommerce-cart .cart_totals tr.order-total th,
body.sd.woocommerce-cart .cart_totals::before {
	font-family: var(--sd-text) !important;
	text-transform: none !important;
	letter-spacing: 0.01em !important;
	font-weight: 500 !important;
}
body.sd .c-cart__shop-td--product-name a {
	font-family: var(--sd-display) !important;
	font-weight: var(--sd-display-weight) !important;
	font-size: var(--sd-step-1) !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	line-height: 1.3;
}