/**
 * Faixa "Vistos recentemente" no Início da conta — Story 21 do épico
 * `03-conta-do-cliente`; desenho da vitrine do protótipo (`.showcase`,
 * épico `04-experiencia-da-conta`). `hidden` por padrão (removido pelo JS
 * só quando há produto pra mostrar) — nunca um espaço vazio piscando antes
 * da chamada AJAX responder.
 */

#ryanne-vistos-recentemente[hidden] {
	display: none;
}

.ryanne-vistos-topo {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
}

.woocommerce-account .woocommerce-MyAccount-content #ryanne-vistos-recentemente-limpar {
	background: none;
	border: 0;
	padding: 0;
	min-height: 0;
	font-family: inherit;
	font-size: 12px;
	font-weight: 700;
	color: var(--ryanne-cinza, #5d707a);
	text-decoration: underline;
	text-transform: none;
	letter-spacing: 0;
	cursor: pointer;
}

#ryanne-vistos-recentemente-lista {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
	gap: 10px;
}

.woocommerce-account .woocommerce-MyAccount-content a.ryanne-vistos-recentemente-card {
	display: flex;
	flex-direction: column;
	border: 1px solid #e5e5e5;
	border-radius: 10px;
	overflow: hidden;
	text-decoration: none;
	color: var(--ryanne-texto, #334449);
	background: #fff;
}

.woocommerce-account .woocommerce-MyAccount-content a.ryanne-vistos-recentemente-card:hover {
	border-color: #cfd6d8;
}

.ryanne-vistos-recentemente-card img {
	width: 100%;
	aspect-ratio: 1;
	height: auto;
	object-fit: cover;
	margin: 0;
	background: #f5f5f5;
}

.ryanne-vistos-recentemente-nome {
	padding: 8px 8px 0;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.3;
}

.ryanne-vistos-recentemente-preco {
	padding: 2px 8px 8px;
	font-size: 12px;
	color: var(--ryanne-cinza, #5d707a);
}