/* ==========================================================================
   Clube SMK — Página de produto (PDP)
   ========================================================================== */

.csmk-shop--single { padding-block: var(--s-6) var(--s-16); }

.csmk-product__top {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	gap: var(--s-10) var(--s-12);
	align-items: start;
}
@media (max-width: 980px) {
	.csmk-product__top { grid-template-columns: 1fr; gap: var(--s-8); }
}

/* ===== Galeria ===== */
.csmk-product__gallery { position: sticky; top: var(--sticky-offset); align-self: start; }
@media (max-width: 980px) { .csmk-product__gallery { position: static; } }
.csmk-gallery { position: relative; border-radius: var(--r-lg); overflow: hidden; background: var(--bg-soft); }
.csmk-gallery .woocommerce-product-gallery__wrapper { margin: 0; }
.csmk-gallery .woocommerce-product-gallery__image { border-radius: var(--r-lg); overflow: hidden; }
.csmk-gallery .woocommerce-product-gallery__image a { display: block; }
.csmk-gallery img { border-radius: var(--r-lg); }
.csmk-gallery .flex-control-thumbs {
	display: flex; gap: var(--s-2); margin-top: var(--s-3); padding: 0; list-style: none; flex-wrap: wrap;
}
.csmk-gallery .flex-control-thumbs li { width: 72px; }
.csmk-gallery .flex-control-thumbs img {
	border-radius: var(--r-sm); cursor: pointer; opacity: .6;
	border: 2px solid transparent; transition: opacity var(--t-fast), border-color var(--t-fast);
}
.csmk-gallery .flex-control-thumbs img.flex-active,
.csmk-gallery .flex-control-thumbs img:hover { opacity: 1; border-color: var(--c-purple); }
.csmk-product__gallery .onsale,
.csmk-product__gallery .csmk-badge--sale {
	position: absolute; top: var(--s-4); left: var(--s-4); z-index: 3;
}
.woocommerce-product-gallery__trigger {
	position: absolute; top: var(--s-4); right: var(--s-4); z-index: 3;
	width: 44px; height: 44px; border-radius: 50%;
	background: #fff; box-shadow: var(--sh-1);
	display: flex; align-items: center; justify-content: center;
}

/* ===== Resumo ===== */
.csmk-product__summary { min-width: 0; }
.csmk-product__eyebrow { display: inline-block; font-size: var(--fs-12); text-transform: uppercase; letter-spacing: 0.08em; color: var(--c-purple); font-weight: var(--fw-bold); margin-bottom: var(--s-2); }
.csmk-product__title { font-size: var(--fs-32); line-height: var(--lh-tight); margin-bottom: var(--s-3); }
.csmk-product__rating { display: inline-flex; align-items: center; gap: var(--s-2); margin-bottom: var(--s-4); color: var(--text-soft); font-size: var(--fs-13); }
.csmk-product__rating-link strong { color: var(--text); }

.csmk-product__price.price { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-1); font-family: var(--font-sans); margin-bottom: var(--s-5); line-height: 1.1; }
.csmk-product__price.price > br { display: none; }
.csmk-product__price.price > .woocommerce-Price-amount,
.csmk-product__price.price > ins,
.csmk-product__price.price > .price { order: 1; font-size: var(--fs-32); font-weight: var(--fw-bold); color: var(--text); }
.csmk-product__price.price > del { order: 1; color: var(--text-faint); font-weight: var(--fw-reg); font-size: var(--fs-20); }
.csmk-product__price.price ins { text-decoration: none; }
/* "À vista no Pix" — pill premium (sobrescreve o estilo do plugin PagBank) */
.csmk-product__price.price > .rm-pagbank-price {
	order: 2;
	display: inline-flex;
	align-items: center;
	gap: var(--s-2);
	margin: var(--s-1) 0 0;
	padding: 0.42rem 0.85rem 0.42rem 0.6rem;
	background: var(--success-bg);
	border: 1px solid rgba(31, 157, 85, 0.22);
	border-radius: var(--r-pill);
	font-family: var(--font-body);
	font-size: var(--fs-13);
	font-weight: var(--fw-semi);
	color: var(--success);
	line-height: 1.2;
}
.csmk-product__price.price .rm-pagbank-price .icon-pix { width: 20px; height: 20px; }
.csmk-product__price.price .rm-pagbank-price b { margin-left: 1px; }
.csmk-product__price.price .rm-pagbank-price .woocommerce-Price-amount,
.csmk-product__price.price .rm-pagbank-price b {
	font-size: var(--fs-14);
	font-weight: var(--fw-bold);
	color: var(--success);
}

.woocommerce-product-details__short-description,
.csmk-product__summary .woocommerce-product-details__short-description {
	color: var(--text-soft); margin-bottom: var(--s-5); line-height: var(--lh);
}
.woocommerce-product-details__short-description ul { list-style: disc; padding-left: 1.2em; }

.csmk-product__summary .stock { font-size: var(--fs-14); font-weight: var(--fw-med); margin-bottom: var(--s-4); }
.csmk-product__summary .stock.in-stock { color: var(--success); }
.csmk-product__summary .stock.out-of-stock { color: var(--error); }

/* Add to cart */
.csmk-add-to-cart { margin-bottom: var(--s-5); }
.csmk-add-to-cart__row { display: flex; gap: var(--s-3); align-items: stretch; }
.csmk-add-to-cart .csmk-qty { flex-shrink: 0; }
.csmk-add-to-cart .csmk-qty button { width: 48px; height: 56px; }
.csmk-add-to-cart .csmk-qty input { width: 56px; height: 56px; font-size: var(--fs-16); }
.single_add_to_cart_button { flex: 1; }
@media (max-width: 420px) { .csmk-add-to-cart__row { flex-direction: column; } .csmk-add-to-cart .csmk-qty { align-self: flex-start; } }

/* Wishlist row */
.csmk-product__wishrow { display: flex; align-items: center; gap: var(--s-2); margin-bottom: var(--s-5); }
.csmk-product__wish { width: 40px; height: 40px; }
.csmk-product__wishlabel { font-size: var(--fs-14); color: var(--text-soft); }

/* Benefits */
.csmk-product__benefits { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-3); padding: var(--s-5); background: var(--bg-soft); border-radius: var(--r); margin-bottom: var(--s-5); }
.csmk-product__benefits li { display: flex; align-items: center; gap: var(--s-2); font-size: var(--fs-13); color: var(--text-soft); }
.csmk-product__benefits svg { color: var(--c-purple); flex-shrink: 0; }
@media (max-width: 480px) { .csmk-product__benefits { grid-template-columns: 1fr; } }

/* Meta */
.csmk-product__meta { font-size: var(--fs-13); color: var(--text-soft); display: flex; flex-direction: column; gap: var(--s-1); border-top: 1px solid var(--border); padding-top: var(--s-4); }
.csmk-product__meta a { color: var(--text-soft); }
.csmk-product__meta a:hover { color: var(--c-purple); }
.csmk-meta-label { font-weight: var(--fw-semi); color: var(--text); }

/* Swatches */
.csmk-swatches { display: flex; flex-wrap: wrap; gap: var(--s-2); margin: var(--s-2) 0 var(--s-4); }
.csmk-swatch { min-width: 44px; height: 44px; padding: 0 var(--s-3); border: 1.5px solid var(--border-strong); border-radius: var(--r-sm); font-size: var(--fs-14); font-weight: var(--fw-med); display: inline-flex; align-items: center; justify-content: center; }
.csmk-swatch--color { width: 44px; padding: 0; border-radius: 50%; }
.csmk-swatch--image { width: 56px; height: 56px; padding: 0; overflow: hidden; }
.csmk-swatch--image img { width: 100%; height: 100%; object-fit: cover; }
.csmk-swatch:hover { border-color: var(--c-purple); }
.csmk-swatch.is-selected { border-color: var(--c-purple); box-shadow: 0 0 0 2px var(--c-purple-050); }

/* ===== Extra (tabs, related) ===== */
.csmk-product__extra { margin-top: var(--s-12); clear: both; }

/* Tabs (premium: chips + painel em card) */
.csmk-tabs { margin-top: var(--s-10); }

/* Navegação — chips/pílulas roláveis no mobile */
.csmk-tabs__nav {
	display: flex;
	gap: var(--s-2);
	flex-wrap: wrap;
	padding: 0;
	margin: 0 0 var(--s-5);
	list-style: none;
	border-bottom: 0;
}
.csmk-tabs__tab { margin: 0; }
.csmk-tabs__tab a {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	padding: 0.7rem 1.25rem;
	border-radius: var(--r-pill);
	font-family: var(--font-display);
	font-weight: var(--fw-semi);
	font-size: var(--fs-14);
	letter-spacing: -0.01em;
	color: var(--text-soft);
	background: var(--bg-soft);
	border: 1.5px solid transparent;
	transition: color var(--t-fast) var(--ease), background var(--t-fast) var(--ease),
		border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease), transform var(--t-fast) var(--ease);
}
.csmk-tabs__tab a:hover {
	color: var(--text);
	background: var(--surface);
	border-color: var(--border-strong);
}
.csmk-tabs__tab.active a {
	color: #fff;
	background: var(--c-purple);
	border-color: var(--c-purple);
	box-shadow: 0 10px 22px -10px rgba(254, 92, 0, 0.6);
	transform: translateY(-1px);
}

/* Ícone (mask herda currentColor → muda junto com o estado) */
.csmk-tabs__tab.description_tab a::before,
.csmk-tabs__tab.additional_information_tab a::before,
.csmk-tabs__tab.reviews_tab a::before {
	content: "";
	width: 16px;
	height: 16px;
	flex: none;
	background-color: currentColor;
	-webkit-mask: var(--csmk-tabicon) center / contain no-repeat;
	mask: var(--csmk-tabicon) center / contain no-repeat;
}
.csmk-tabs__tab.description_tab a {
	--csmk-tabicon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 3v5h5'/%3E%3Cpath d='M9 13h6'/%3E%3Cpath d='M9 17h6'/%3E%3C/svg%3E");
}
.csmk-tabs__tab.additional_information_tab a {
	--csmk-tabicon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 6h12'/%3E%3Cpath d='M8 12h12'/%3E%3Cpath d='M8 18h12'/%3E%3Cpath d='M4 6h.01'/%3E%3Cpath d='M4 12h.01'/%3E%3Cpath d='M4 18h.01'/%3E%3C/svg%3E");
}
.csmk-tabs__tab.reviews_tab a {
	--csmk-tabicon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='12 3 14.9 8.8 21.3 9.7 16.6 14.2 17.8 20.6 12 17.6 6.2 20.6 7.4 14.2 2.7 9.7 9.1 8.8 12 3'/%3E%3C/svg%3E");
}

/* Painel em card */
.csmk-tabs__panel {
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: var(--r-lg);
	padding: clamp(var(--s-5), 4vw, var(--s-8));
	box-shadow: var(--sh-1);
	line-height: var(--lh);
	color: var(--text-soft);
}
.csmk-tabs__panel h2 { display: none; } /* o título da aba já aparece na nav */
.csmk-tabs__panel > :first-child { margin-top: 0; }
.csmk-tabs__panel > :last-child { margin-bottom: 0; }
.csmk-tabs__panel > p,
.csmk-tabs__panel > ul,
.csmk-tabs__panel > ol,
.csmk-tabs__panel > h3,
.csmk-tabs__panel > h4 { max-width: 74ch; }
.csmk-tabs__panel p { margin: 0 0 var(--s-4); }
.csmk-tabs__panel strong, .csmk-tabs__panel b { color: var(--text); }
.csmk-tabs__panel ul { list-style: disc; padding-left: 1.3rem; margin: 0 0 var(--s-4); }
.csmk-tabs__panel ol { padding-left: 1.3rem; margin: 0 0 var(--s-4); }
.csmk-tabs__panel li { margin-bottom: var(--s-1); }
.csmk-tabs__panel a { color: var(--c-purple); text-decoration: underline; text-underline-offset: 2px; }

/* Tabela de atributos (Informação adicional) */
.csmk-tabs__panel table.shop_attributes {
	width: 100%;
	max-width: none;
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid var(--border);
	border-radius: var(--r);
	overflow: hidden;
}
.csmk-tabs__panel table.shop_attributes th,
.csmk-tabs__panel table.shop_attributes td {
	text-align: left;
	padding: var(--s-3) var(--s-4);
	border-bottom: 1px solid var(--border);
}
.csmk-tabs__panel table.shop_attributes tr:last-child th,
.csmk-tabs__panel table.shop_attributes tr:last-child td { border-bottom: 0; }
.csmk-tabs__panel table.shop_attributes th {
	width: 32%;
	color: var(--text);
	font-weight: var(--fw-semi);
	background: var(--bg-soft);
}
.csmk-tabs__panel table.shop_attributes td { color: var(--text-soft); }
.csmk-tabs__panel table.shop_attributes p { margin: 0; }

@media (max-width: 600px) {
	.csmk-tabs__nav {
		flex-wrap: nowrap;
		overflow-x: auto;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
		margin-inline: calc(-1 * var(--s-1));
		padding-inline: var(--s-1);
	}
	.csmk-tabs__nav::-webkit-scrollbar { display: none; }
	.csmk-tabs__tab { flex: 0 0 auto; }
}

/* Related */
.csmk-related { margin-top: var(--s-16); }
.csmk-related .csmk-section__title { font-size: var(--fs-28); }

/* ===== Avaliações ===== */
#reviews { scroll-margin-top: var(--sticky-offset); }
/* O h2 "Avaliações" fica oculto no painel (o chip da aba já comunica isso). */

.woocommerce-noreviews {
	margin: 0 0 var(--s-6);
	padding: var(--s-4) var(--s-5);
	background: var(--bg-soft);
	border: 1px dashed var(--border-strong);
	border-radius: var(--r);
	color: var(--text-soft);
	font-size: var(--fs-14);
	font-weight: var(--fw-med);
}

/* Lista de avaliações existentes */
.commentlist { list-style: none; padding: 0; margin: 0 0 var(--s-6); display: flex; flex-direction: column; gap: var(--s-4); }
.commentlist .comment_container { display: flex; gap: var(--s-4); background: var(--surface); border: 1px solid var(--border); padding: var(--s-5); border-radius: var(--r-lg); box-shadow: var(--sh-1); }
.commentlist .avatar { border-radius: 50%; width: 48px; height: 48px; flex: none; }
.commentlist .comment-text { flex: 1; min-width: 0; }
.commentlist .star-rating { margin-bottom: var(--s-2); }
.commentlist .meta { font-size: var(--fs-13); color: var(--text-soft); margin-bottom: var(--s-2); }
.commentlist .meta strong { color: var(--text); font-weight: var(--fw-semi); }

/* Formulário de avaliação */
.comment-respond {
	margin-top: 0;
	background: var(--bg-soft);
	border: 1px solid var(--border);
	padding: clamp(var(--s-5), 3vw, var(--s-7));
	border-radius: var(--r-lg);
}
.comment-reply-title {
	display: block;
	font-family: var(--font-display);
	font-weight: var(--fw-semi);
	font-size: var(--fs-18);
	letter-spacing: -0.01em;
	color: var(--text);
	margin-bottom: var(--s-4);
}
.comment-reply-title small { font-weight: var(--fw-reg); font-size: var(--fs-14); }
.comment-notes { color: var(--text-soft); font-size: var(--fs-14); margin: 0 0 var(--s-5); }

.comment-form { display: flex; flex-direction: column; gap: var(--s-4); margin: 0; }
.comment-form > p { margin: 0; }
.comment-form label { display: block; font-weight: var(--fw-semi); color: var(--text); margin-bottom: var(--s-2); font-size: var(--fs-14); }
.comment-form .required { color: var(--c-purple); }

.comment-form-cookies-consent { display: flex; align-items: flex-start; gap: var(--s-2); }
.comment-form-cookies-consent label { margin: 0; font-weight: var(--fw-reg); color: var(--text-soft); font-size: var(--fs-13); }
.comment-form-cookies-consent input { width: 18px; height: 18px; accent-color: var(--c-purple); margin-top: 1px; flex: none; }

.form-submit { margin: 0; }
.comment-form .form-submit input[type="submit"],
.comment-form input#submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.9rem 2.25rem;
	background: var(--c-purple);
	color: #fff;
	border: none;
	border-radius: var(--r-pill);
	font-family: var(--font-display);
	font-weight: var(--fw-semi);
	font-size: var(--fs-16);
	cursor: pointer;
	box-shadow: 0 10px 22px -10px rgba(254, 92, 0, 0.6);
	transition: background var(--t-fast) var(--ease), transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
.comment-form .form-submit input[type="submit"]:hover,
.comment-form input#submit:hover {
	background: var(--c-purple-600);
	transform: translateY(-1px);
	box-shadow: 0 14px 28px -10px rgba(254, 92, 0, 0.7);
}

/* Seletor de nota — estrelas interativas (substitui os links de texto do WC) */
.comment-form-rating { margin: 0; }
p.stars { display: inline-flex; margin: 0; line-height: 1; }
p.stars > span { display: inline-flex; gap: 0.2rem; }
p.stars a {
	font-size: 0; /* esconde o texto "X de 5 estrelas" do WooCommerce */
	width: 2.1rem; height: 2.1rem;
	display: inline-flex; align-items: center; justify-content: center;
	cursor: pointer; text-decoration: none;
}
p.stars a::before {
	content: "★";
	font-size: 1.8rem; line-height: 1;
	color: var(--border-strong);
	transition: color var(--t-fast) var(--ease), transform var(--t-fast) var(--ease);
}
p.stars a:hover::before { transform: scale(1.12); }
p.stars:hover a::before { color: #f5a623; }
p.stars:hover a:hover ~ a::before { color: var(--border-strong); }
p.stars.selected a:not(.active)::before { color: #f5a623; }
p.stars.selected a.active::before { color: #f5a623; }
p.stars.selected a.active ~ a::before { color: var(--border-strong); }

/* ==========================================================================
   Simulação de frete (Melhor Envio) — card premium na página de produto.
   Markup do plugin é FIXO: só CSS, tudo escopado sob .csmk-product para vencer
   a especificidade do CSS do plugin. NÃO declarar display em
   .resultado-frete/.tableResult/#calcular-frete-loader (o JS controla a
   visibilidade — estilizamos só os filhos/container).
   ========================================================================== */

.csmk-product .containerCalculator {
	--csmk-ic-truck: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23fe5c00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 18V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v11a1 1 0 0 0 1 1h2'/%3E%3Cpath d='M15 18H9'/%3E%3Cpath d='M19 18h2a1 1 0 0 0 1-1v-3.65a1 1 0 0 0-.22-.624l-3.48-4.35A1 1 0 0 0 17.52 8H14'/%3E%3Ccircle cx='17' cy='18' r='2'/%3E%3Ccircle cx='7' cy='18' r='2'/%3E%3C/svg%3E");
	--csmk-ic-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23fe5c00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
	margin: var(--s-5) 0;
	padding: var(--s-5);
	background: var(--bg-soft);
	border: 1px solid var(--border);
	border-radius: var(--r-lg);
	color: var(--text);
	box-shadow: none;
}

/* Reset floats/larguras do plugin + clearfix defensivo */
.csmk-product .containerCalculator .calculatorRow,
.csmk-product .containerCalculator .row,
.csmk-product .containerCalculator .col-75 {
	float: none;
	width: 100%;
	margin: 0;
	padding: 0;
}
.csmk-product .containerCalculator .row::after {
	content: "";
	display: table;
	clear: both;
}
.csmk-product .containerCalculator input[type="hidden"] {
	display: none;
}

/* Rótulo "Simulação de frete" como eyebrow laranja + ícone truck */
.csmk-product .containerCalculator .col-75 > p {
	display: flex;
	align-items: center;
	gap: var(--s-2);
	margin: 0 0 var(--s-3);
	font-family: var(--font-body);
	font-size: var(--fs-12);
	font-weight: var(--fw-bold);
	line-height: var(--lh-snug);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--c-purple);
}
.csmk-product .containerCalculator .col-75 > p::before {
	content: "";
	width: 18px;
	height: 18px;
	flex: none;
	background: var(--csmk-ic-truck) no-repeat center / contain;
}

/* Input CEP — sobrescreve o estilo do plugin (#ccc, radius 4px) */
.csmk-product .containerCalculator input[type="text"],
.csmk-product .containerCalculator input#inputCep.iptCep {
	box-sizing: border-box;
	display: block;
	width: 100%;
	max-width: 280px;
	margin: 0;
	padding: 0.75rem 0.9rem 0.75rem 2.6rem;
	font-family: var(--font-body);
	font-size: var(--fs-14);
	font-weight: var(--fw-med);
	line-height: var(--lh-snug);
	color: var(--text);
	background-color: var(--surface);
	background-image: var(--csmk-ic-pin);
	background-repeat: no-repeat;
	background-position: 0.85rem center;
	background-size: 18px 18px;
	border: 1px solid var(--border-strong);
	border-radius: var(--r-sm);
	box-shadow: var(--sh-1);
	transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
.csmk-product .containerCalculator input[type="text"]::placeholder,
.csmk-product .containerCalculator input#inputCep.iptCep::placeholder {
	color: var(--text-faint);
	font-weight: var(--fw-reg);
}
.csmk-product .containerCalculator input[type="text"]:hover,
.csmk-product .containerCalculator input#inputCep.iptCep:hover {
	border-color: var(--c-purple);
}
.csmk-product .containerCalculator input[type="text"]:focus,
.csmk-product .containerCalculator input#inputCep.iptCep:focus {
	outline: none;
	border-color: var(--c-purple);
	box-shadow: 0 0 0 3px var(--c-purple-050);
}

/* Loader: esconde o gif e mostra spinner CSS (sem tocar no display, controlado por JS) */
.csmk-product .containerCalculator #calcular-frete-loader {
	align-items: center;
	justify-content: flex-start;
	gap: var(--s-2);
	margin-top: var(--s-4);
}
.csmk-product .containerCalculator #calcular-frete-loader img {
	display: none;
}
.csmk-product .containerCalculator #calcular-frete-loader::after {
	content: "";
	width: 22px;
	height: 22px;
	border-radius: var(--r-circle);
	border: 2.5px solid var(--c-purple-050);
	border-top-color: var(--c-purple);
	animation: csmk-shipspin 0.7s linear infinite;
}
@keyframes csmk-shipspin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
	.csmk-product .containerCalculator #calcular-frete-loader::after { animation-duration: 2.5s; }
}

/* Resultados (visibilidade fica com o JS; o bloco fica sempre no DOM, por isso
   escondemos os <small> vazios via :empty para não vazar chip/caption vazios). */
.csmk-product .containerCalculator .resultado-frete {
	margin-top: var(--s-3);
}
.csmk-product .containerCalculator #destiny-shipping-mehor-envio:empty,
.csmk-product .containerCalculator .observation-shipping-free:empty {
	display: none;
}
.csmk-product .containerCalculator .resultado-frete table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: separate;
	border-spacing: 0 var(--s-2);
	table-layout: auto;
	background: transparent;
}
.csmk-product .containerCalculator .resultado-frete thead { display: none; }
.csmk-product .containerCalculator .resultado-frete tbody tr { display: block; }
.csmk-product .containerCalculator .resultado-frete tbody td {
	display: flex;
	align-items: center;
	gap: var(--s-2);
	width: 100%;
	margin: 0;
	padding: 0.7rem 0.85rem;
	font-family: var(--font-body);
	font-size: var(--fs-14);
	font-weight: var(--fw-med);
	line-height: var(--lh-snug);
	color: var(--text);
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: var(--r);
	box-shadow: var(--sh-1);
}
.csmk-product .containerCalculator .resultado-frete tbody td::before {
	content: "";
	width: 16px;
	height: 16px;
	flex: none;
	background: var(--csmk-ic-truck) no-repeat center / contain;
}

/* Caption "Frete para X" */
.csmk-product .containerCalculator #destiny-shipping-mehor-envio {
	display: block;
	margin: var(--s-3) 0 0;
	font-family: var(--font-body);
	font-size: var(--fs-12);
	font-weight: var(--fw-med);
	line-height: var(--lh-snug);
	color: var(--text-faint);
}
.csmk-product .containerCalculator .resultado-frete br { display: none; }

/* Aviso de frete grátis → badge de sucesso */
.csmk-product .containerCalculator .observation-shipping-free {
	display: inline-flex;
	align-items: center;
	gap: var(--s-1);
	margin-top: var(--s-3);
	padding: 0.3rem 0.65rem;
	font-family: var(--font-body);
	font-size: var(--fs-12);
	font-weight: var(--fw-semi);
	line-height: var(--lh-snug);
	color: var(--success);
	background: var(--success-bg);
	border-radius: var(--r-pill);
}

@media (max-width: 480px) {
	.csmk-product .containerCalculator input[type="text"],
	.csmk-product .containerCalculator input#inputCep.iptCep { max-width: 100%; }
}