/**
 * PAP Afiliados Pro - Frontend CSS
 *
 * Estilos do card de produto para frontend E preview no Template Builder.
 * Referência: PAPAFPRO-FRONTEND-RENDERING-CONTRACT.md (estrutura HTML v1.2).
 *
 * Usa CSS custom properties --papafpro-* definidas inline por Template_CSS.
 *
 * @package PAP_Afiliados_Pro
 * @since   2.0.0
 */

/* ==========================================================================
   GRID LAYOUT
   ========================================================================== */

.papafpro-grid {
	display: grid;
	gap: var(--papafpro-card-spacing, 20px);
}

.papafpro-grid--cols-1 {
	grid-template-columns: 1fr;
}

.papafpro-grid--cols-2 {
	grid-template-columns: repeat(2, 1fr);
}

.papafpro-grid--cols-3 {
	grid-template-columns: repeat(3, 1fr);
}

.papafpro-grid--cols-4 {
	grid-template-columns: repeat(4, 1fr);
}

.papafpro-grid--cols-5 {
	grid-template-columns: repeat(5, 1fr);
}

.papafpro-grid--cols-6 {
	grid-template-columns: repeat(6, 1fr);
}

/* Horizontal cards always span a single column regardless of grid setting. */
.papafpro-grid .papafpro-template-horizontal {
	grid-column: 1 / -1;
}

/* === Single card wrapper — neutral container, sizing delegated to templates === */
.papafpro-single-card {
	/* no max-width here — each template defines its own below */
}

/* Center any card inside the single-card wrapper. Block-level cards with a
   max-width sit flush-left without explicit auto margins. */
.papafpro-single-card > .papafpro-card {
	margin-left: auto;
	margin-right: auto;
}

/* === Single card sizing per template ===
   Vertical templates: capped width to stay compact and centered.
   Horizontal templates (horizontal, standard-in-list): no cap — fill the
   parent container so they stay responsive in any theme content area. */

.papafpro-single-card .papafpro-template-standard {
	max-width: 400px;
}

.papafpro-single-card .papafpro-template-minimal {
	max-width: none;
}

.papafpro-single-card .papafpro-template-comparative {
	max-width: 450px;
}

.papafpro-single-card .papafpro-template-ranking {
	max-width: 450px;
}

.papafpro-single-card.papafpro-layout-list .papafpro-template-standard {
	max-width: none;
}

/* ==========================================================================
   CARD BASE
   ========================================================================== */

.papafpro-card {
	position: relative;
	overflow: hidden;
	border-radius: var(--papafpro-border-radius, 8px);
	background: var(--papafpro-card-bg, #ffffff);
	font-family: var(--papafpro-font-family, inherit);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	display: flex;
	flex-direction: column;
	height: 100%;
}

/* Estilos de card */
.papafpro-card--standard {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.papafpro-card--flat {
	box-shadow: none;
	border: 1px solid #e0e0e0;
}

.papafpro-card--elevated {
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.papafpro-card--bordered {
	box-shadow: none;
	border: 2px solid var(--papafpro-border-color, var(--papafpro-primary-color, #3498db));
}

.papafpro-card--moderno {
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
	border: 1px solid rgba(0, 0, 0, 0.06);
}

/* Hover com shadow (intensidade 'subtle' = padrão) */
.papafpro-card--shadow:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
}

/* Intensidade do hover configurável (v2.6.0).
   'none' anula o efeito; 'strong' aumenta deslocamento e sombra.
   Sem classe = 'subtle' (regra acima, inalterada). */
.papafpro-card.papafpro-hover--none:hover {
	transform: none;
	box-shadow: inherit;
}

.papafpro-card--shadow.papafpro-hover--strong:hover {
	transform: translateY(-6px);
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.22);
}

/* ==========================================================================
   BADGES
   ========================================================================== */

.papafpro-card__badge {
	position: absolute;
	z-index: 2;
	padding: 4px 10px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	border-radius: 3px;
	line-height: 1.4;
}

.papafpro-card__badge--custom {
	background: var(--papafpro-custom-badge-bg, #e74c3c);
	color: var(--papafpro-custom-badge-text, #ffffff);
}

.papafpro-card__badge--marketplace {
	background: var(--papafpro-badge-bg, #2ecc71);
	color: var(--papafpro-badge-text, #ffffff);
	z-index: 3;
}

a.papafpro-card__badge--marketplace {
	text-decoration: none;
	color: var(--papafpro-badge-text, #ffffff);
}

/* ==========================================================================
   BADGE STYLES SVG — v2.5.0 Fatia 3
   ========================================================================== */

/* --- Shared SVG badge --- */
.papafpro-badge-svg {
	display: block;
}

/* --- Position modifiers --- */
.papafpro-badge-pos--top-left {
	top: 8px;
	left: 8px;
	right: auto;
}

.papafpro-badge-pos--top-right {
	top: 8px;
	right: 8px;
	left: auto;
}

.papafpro-badge-pos--top-center {
	top: 8px;
	left: 50%;
	right: auto;
	transform: translateX(-50%);
}

/* --- Text (default) --- */
.papafpro-badge--text {
	/* Inherits base .papafpro-card__badge styles */
}

/* --- Ribbon (diagonal) --- */
.papafpro-badge--ribbon {
	padding: 0;
	background: none;
	border-radius: 0;
	overflow: hidden;
	width: 90px;
	height: 90px;
	top: 0;
	left: 0;
	color: var(--papafpro-custom-badge-bg, #e74c3c);
}

.papafpro-badge--ribbon .papafpro-badge-svg {
	width: 100%;
	height: 100%;
}

/* --- Star --- */
.papafpro-badge--star {
	padding: 0;
	background: none;
	border-radius: 0;
	width: 64px;
	height: 64px;
	color: var(--papafpro-custom-badge-bg, #e74c3c);
}

.papafpro-badge--star .papafpro-badge-svg {
	width: 100%;
	height: 100%;
}

/* --- Banner (centered horizontal strip) --- */
.papafpro-badge--banner {
	padding: 0;
	background: none;
	border-radius: 0;
	width: 90%;
	max-width: 360px;
	top: 12px;
	left: 50%;
	transform: translateX(-50%);
	color: var(--papafpro-custom-badge-bg, #e74c3c);
}

.papafpro-badge--banner .papafpro-badge-svg {
	width: 100%;
	height: auto;
}

/* --- Medal --- */
.papafpro-badge--medal {
	padding: 0;
	background: none;
	border-radius: 0;
	width: 52px;
	height: 64px;
	color: var(--papafpro-custom-badge-bg, #e74c3c);
}

.papafpro-badge--medal .papafpro-badge-svg {
	width: 100%;
	height: 100%;
}

/* --- Shield --- */
.papafpro-badge--shield {
	padding: 0;
	background: none;
	border-radius: 0;
	width: 48px;
	height: 58px;
	color: var(--papafpro-custom-badge-bg, #e74c3c);
}

.papafpro-badge--shield .papafpro-badge-svg {
	width: 100%;
	height: 100%;
}

/* --- Header Band (full-width bar) --- */
.papafpro-badge--header_band {
	position: static;
	width: 100%;
	padding: 6px 16px;
	border-radius: 0;
	text-align: center;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	background: var(--papafpro-custom-badge-bg, #e74c3c);
	color: var(--papafpro-custom-badge-text, #fff);
	box-sizing: border-box;
	transform: none;
	left: 0;
	margin: 0;
}

/* Header band in cards with border-radius: remove top radius */
.papafpro-card > .papafpro-badge--header_band:first-child {
	border-radius: var(--papafpro-border-radius, 8px)
				   var(--papafpro-border-radius, 8px)
				   0 0;
}

/* Header band + ranking header: band on top */
.papafpro-template-ranking > .papafpro-badge--header_band:first-child + .papafpro-card__ranking-header {
	border-radius: 0;
}

/* ==========================================================================
   BADGE EFFECTS
   ========================================================================== */

/* --- Flat (default) --- */
.papafpro-badge-fx--flat {
	/* base styles only */
}

/* --- 3D Shadow --- */
.papafpro-badge-fx--3d {
	box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.25);
}

.papafpro-badge-fx--3d.papafpro-badge--ribbon,
.papafpro-badge-fx--3d.papafpro-badge--star,
.papafpro-badge-fx--3d.papafpro-badge--banner,
.papafpro-badge-fx--3d.papafpro-badge--medal,
.papafpro-badge-fx--3d.papafpro-badge--shield {
	box-shadow: none; /* Container itself shouldn't have box shadow */
	filter: drop-shadow(2px 4px 6px rgba(0,0,0,0.35));
}

/* --- 3D Relief (Bevel) --- */
.papafpro-badge-fx--bevel {
	box-shadow: inset 2px 2px 4px rgba(255, 255, 255, 0.5), inset -2px -2px 4px rgba(0, 0, 0, 0.3), 1px 2px 4px rgba(0, 0, 0, 0.2);
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
	border: 1px solid rgba(0, 0, 0, 0.1);
}

.papafpro-badge-fx--bevel.papafpro-badge--ribbon,
.papafpro-badge-fx--bevel.papafpro-badge--star,
.papafpro-badge-fx--bevel.papafpro-badge--banner,
.papafpro-badge-fx--bevel.papafpro-badge--medal,
.papafpro-badge-fx--bevel.papafpro-badge--shield {
	box-shadow: none;
	border: none;
	filter: drop-shadow(1px 2px 3px rgba(0,0,0,0.3));
}

/* SVG filter defined in global <defs> block — see render_svg_filter_defs() / wp_footer hook */
.papafpro-badge-fx--bevel .papafpro-badge-svg {
	filter: url(#papafpro-bevel-filter);
}

/* --- Inset (Pressed) --- */
.papafpro-badge-fx--inset {
	box-shadow: inset 2px 3px 6px rgba(0, 0, 0, 0.4);
	text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.2);
}

.papafpro-badge-fx--inset.papafpro-badge--ribbon,
.papafpro-badge-fx--inset.papafpro-badge--star,
.papafpro-badge-fx--inset.papafpro-badge--banner,
.papafpro-badge-fx--inset.papafpro-badge--medal,
.papafpro-badge-fx--inset.papafpro-badge--shield {
	box-shadow: none;
}

/* SVG filter defined in global <defs> block — see render_svg_filter_defs() / wp_footer hook */
.papafpro-badge-fx--inset .papafpro-badge-svg {
	filter: url(#papafpro-inset-filter);
}

/* --- Neon Glow --- */
.papafpro-badge-fx--neon {
	box-shadow: 0 0 8px var(--papafpro-custom-badge-bg, #e74c3c), 0 0 16px var(--papafpro-custom-badge-bg, #e74c3c);
	border: 1px solid var(--papafpro-custom-badge-text, #fff);
	text-shadow: 0 0 4px var(--papafpro-custom-badge-text, #fff);
}

.papafpro-badge-fx--neon.papafpro-badge--ribbon,
.papafpro-badge-fx--neon.papafpro-badge--star,
.papafpro-badge-fx--neon.papafpro-badge--banner,
.papafpro-badge-fx--neon.papafpro-badge--medal,
.papafpro-badge-fx--neon.papafpro-badge--shield {
	box-shadow: none;
	border: none;
	filter: drop-shadow(0 0 6px var(--papafpro-custom-badge-bg, #e74c3c)) drop-shadow(0 0 12px var(--papafpro-custom-badge-bg, #e74c3c));
}

/* ==========================================================================
   IMAGEM
   ========================================================================== */

.papafpro-card__image-area {
	position: relative;
	overflow: hidden;
	background: var(--papafpro-image-bg, #f0f0f0);
}

.papafpro-card__image-area--1-1 {
	aspect-ratio: 1 / 1;
}

.papafpro-card__image-area--2-3 {
	aspect-ratio: 2 / 3;
}

.papafpro-card__image-area--4-3 {
	aspect-ratio: 4 / 3;
}

.papafpro-card__image-area--16-9 {
	aspect-ratio: 16 / 9;
}

.papafpro-card__image-area--auto {
	aspect-ratio: auto;
}

.papafpro-card__image-link {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 4px;
	box-sizing: border-box;
}

.papafpro-card__image-link--cover {
	padding: 0;
}

.papafpro-card__image {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	display: block;
	border-radius: var(--papafpro-image-border-radius, 0px);
}

.papafpro-card__image--cover {
	width: 100%;
	height: 100%;
	max-width: none;
	max-height: none;
	object-fit: cover;
}

.papafpro-card__image--contain {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: initial;
	border-radius: var(--papafpro-image-border-radius, 0px);
}

/* Fundo sólido (default) */
.papafpro-card__image-area--bg-solid {
	/* Usa background via custom property */
}

/* Fundo desfocado */
.papafpro-card__image-area--bg-blurred {
	position: relative;
}

.papafpro-card__image-area--bg-blurred::before {
	content: "";
	position: absolute;
	top: -10px;
	left: -10px;
	right: -10px;
	bottom: -10px;
	background-image: var(--papafpro-blur-image);
	background-size: cover;
	background-position: center;
	filter: blur(20px);
	z-index: 0;
}

.papafpro-card__image-area--bg-blurred .papafpro-card__image-link {
	z-index: 1;
}

/* ==========================================================================
   CONTEÚDO
   ========================================================================== */

.papafpro-card__content {
	padding: 16px;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

.papafpro-card__title {
	font-size: var(--papafpro-title-size, 15px);
	font-weight: var(--papafpro-title-weight, 600);
	margin: 0 0 8px;
	color: var(--papafpro-primary-color, #333333);
	line-height: 1.3;
}

.papafpro-card__title a {
	color: inherit;
	text-decoration: none;
}

.papafpro-card__title a:hover {
	color: var(--papafpro-title-hover-color, #0073aa);
}

.papafpro-card__description {
	font-size: var(--papafpro-desc-size, 13px);
	color: var(--papafpro-text-color, #333333);
	opacity: 0.8;
	margin-bottom: 8px;
	display: -webkit-box;
	-webkit-line-clamp: var(--papafpro-desc-lines, 2);
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.papafpro-card__price {
	font-size: var(--papafpro-price-size, 18px);
	font-weight: var(--papafpro-price-weight, 700);
	color: var(--papafpro-price-color, #e74c3c);
	margin-bottom: 12px;
}

/* ==========================================================================
   BOTÃO
   ========================================================================== */

.papafpro-card__button {
	display: inline-block;
	padding: 10px 20px;
	text-align: center;
	text-decoration: none;
	font-weight: 600;
	border-radius: var(--papafpro-button-radius, 4px);
	transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
	cursor: pointer;
	border: none;
	font-size: 14px;
	line-height: 1.4;
	align-self: center;
	margin-top: auto;
}

/* Estilo: Sólido */
.papafpro-card__button--solido {
	background: var(--papafpro-button-bg, #3498db);
	color: var(--papafpro-button-text, #ffffff);
}

.papafpro-card__button--solido:hover {
	background: var(--papafpro-button-hover-bg, #2980b9);
	color: var(--papafpro-button-hover-text, #ffffff);
}

/* Estilo: Gradiente Vertical */
.papafpro-card__button--gradiente_vertical {
	background: linear-gradient(
		to bottom,
		var(--papafpro-button-bg, #3498db),
		var(--papafpro-secondary-color, #2ecc71)
	);
	color: var(--papafpro-button-text, #ffffff);
}

.papafpro-card__button--gradiente_vertical:hover {
	background: linear-gradient(
		to bottom,
		var(--papafpro-secondary-color, #2ecc71),
		var(--papafpro-button-bg, #3498db)
	);
	color: var(--papafpro-button-hover-text, #ffffff);
}

/* Estilo: Gradiente Horizontal */
.papafpro-card__button--gradiente_horizontal {
	background: linear-gradient(
		to right,
		var(--papafpro-button-bg, #3498db),
		var(--papafpro-secondary-color, #2ecc71)
	);
	color: var(--papafpro-button-text, #ffffff);
}

.papafpro-card__button--gradiente_horizontal:hover {
	background: linear-gradient(
		to right,
		var(--papafpro-secondary-color, #2ecc71),
		var(--papafpro-button-bg, #3498db)
	);
	color: var(--papafpro-button-hover-text, #ffffff);
}

/* Estilo: Outline */
.papafpro-card__button--outline {
	background: transparent;
	color: var(--papafpro-button-bg, #3498db);
	border: 2px solid var(--papafpro-button-bg, #3498db);
}

.papafpro-card__button--outline:hover {
	background: var(--papafpro-button-bg, #3498db);
	color: var(--papafpro-button-text, #ffffff);
}

/* Shadow no botão */
.papafpro-card__button--shadow {
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}

.papafpro-card__button--shadow:hover {
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
}

/* ==========================================================================
   CARD-LEVEL BUTTON STYLE SELECTORS (Contract v1.2)
   ========================================================================== */

/* Solido (card-level) */
.papafpro-style-solido .papafpro-card__button {
	background: var(--papafpro-button-bg, #3498db);
	color: var(--papafpro-button-text, #ffffff);
}

.papafpro-style-solido .papafpro-card__button:hover {
	background: var(--papafpro-button-hover-bg, #2980b9);
	color: var(--papafpro-button-hover-text, #ffffff);
}

/* Gradiente Vertical (card-level) */
.papafpro-style-gradiente_vertical .papafpro-card__button {
	background: linear-gradient(
		to bottom,
		var(--papafpro-button-bg, #3498db),
		var(--papafpro-secondary-color, #2ecc71)
	);
	color: var(--papafpro-button-text, #ffffff);
}

.papafpro-style-gradiente_vertical .papafpro-card__button:hover {
	background: linear-gradient(
		to bottom,
		var(--papafpro-secondary-color, #2ecc71),
		var(--papafpro-button-bg, #3498db)
	);
	color: var(--papafpro-button-hover-text, #ffffff);
}

/* Gradiente Horizontal (card-level) */
.papafpro-style-gradiente_horizontal .papafpro-card__button {
	background: linear-gradient(
		to right,
		var(--papafpro-button-bg, #3498db),
		var(--papafpro-secondary-color, #2ecc71)
	);
	color: var(--papafpro-button-text, #ffffff);
}

.papafpro-style-gradiente_horizontal .papafpro-card__button:hover {
	background: linear-gradient(
		to right,
		var(--papafpro-secondary-color, #2ecc71),
		var(--papafpro-button-bg, #3498db)
	);
	color: var(--papafpro-button-hover-text, #ffffff);
}

/* Outline (card-level) */
.papafpro-style-outline .papafpro-card__button {
	background: transparent;
	color: var(--papafpro-button-bg, #3498db);
	border: 2px solid var(--papafpro-button-bg, #3498db);
}

.papafpro-style-outline .papafpro-card__button:hover {
	background: var(--papafpro-button-bg, #3498db);
	color: var(--papafpro-button-text, #ffffff);
}

/* ==========================================================================
   LAYOUT: LISTA
   ========================================================================== */

.papafpro-layout-list .papafpro-card {
	display: flex;
	flex-direction: row;
	height: auto;
}

.papafpro-layout-list .papafpro-card:has(> .papafpro-badge--header_band) {
	flex-wrap: wrap;
}

.papafpro-layout-list .papafpro-card + .papafpro-card {
	margin-top: var(--papafpro-card-spacing, 20px);
}

.papafpro-layout-list .papafpro-card__image-wrapper {
	flex: 0 0 auto;
	aspect-ratio: 1 / 1;
	min-width: 110px;
	max-width: 250px;
}

.papafpro-layout-list .papafpro-card__image-area {
	width: 100%;
	height: 100%;
}

.papafpro-layout-list .papafpro-card__content {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.papafpro-layout-list .papafpro-card__button {
	align-self: flex-start;
}

/* ==========================================================================
   TEMPLATES v2.5.0
   ========================================================================== */

/* --- Standard: vertical card (desktop). */
.papafpro-template-standard {
	/* Herda 100% dos estilos base de .papafpro-card (flex-direction: column) */
}

/* Stretched link only exists for the mobile tap-target pattern —
   never show/activate it at desktop widths. */
.papafpro-template-standard .papafpro-card__stretched-link {
	display: none;
}

/* ------------------------------------------------------------------
   Rating visibility, isolated per breakpoint so neither erases the
   other. Desktop/tablet: explicit rule (mirrors the element's own
   base display, kept explicit here so it can't be silently hidden by
   a future universal rule without touching this one too). Mobile:
   see the matching rule inside @media (max-width: 768px) below.
   ------------------------------------------------------------------ */
@media (min-width: 769px) {
	.papafpro-template-standard > .papafpro-card__content > .papafpro-card__rating {
		display: inline-flex !important;
		margin-top: 0;
		margin-bottom: 8px;
	}
}

/* Marketplace badge at card-level: in grid + header_band, push badge below the band.
   The band is ~30px tall (6px padding × 2 + 12px font × 1.4 line-height).
   Only applies in grid layout (list/horizontal reposition via their own rules). */
.papafpro-layout-grid .papafpro-card:has(> .papafpro-badge--header_band) > .papafpro-card__badge--marketplace {
	top: 38px;
}

/* --- Horizontal --- */
.papafpro-template-horizontal {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	height: auto;
}

/* Fix for header band in horizontal layout */
.papafpro-template-horizontal:has(> .papafpro-badge--header_band) {
	flex-wrap: wrap;
}

.papafpro-template-horizontal .papafpro-card__image-wrapper {
	flex: 0 0 auto;
	aspect-ratio: 1 / 1;
	min-width: 110px;
	max-width: 250px;
}

.papafpro-template-horizontal .papafpro-card__image-area {
	width: 100%;
	height: 100%;
}

.papafpro-template-horizontal .papafpro-card__image-link {
	height: 100%;
}

.papafpro-template-horizontal .papafpro-card__image {
	width: 100%;
	height: 100%;
}

.papafpro-template-horizontal .papafpro-card__content {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: var(--papafpro-card-spacing, 16px);
}

.papafpro-template-horizontal .papafpro-card__button {
	align-self: flex-start;
	margin-top: 0;
}

.papafpro-template-horizontal .papafpro-card__description {
	display: -webkit-box;
	-webkit-line-clamp: var(--papafpro-desc-lines, 2);
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-bottom: 8px;
}

/* --- Minimal --- */
.papafpro-template-minimal {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	padding: 0;
	gap: 0;
	border-radius: var(--papafpro-border-radius, 8px);
	height: auto;
}

.papafpro-template-minimal .papafpro-card__image-area {
	flex: 0 0 auto;
	aspect-ratio: 1 / 1;
	min-width: 80px;
	max-width: 180px;
	padding: 0;
	position: relative;
	border-radius: 0;
	overflow: hidden;
}

/* Minimal: disable blur pseudo-element (too small for blur effect). */
.papafpro-template-minimal .papafpro-card__image-area::before {
	display: none;
}

/* Minimal: position the link absolutely inside the image-area so nothing
   inside contributes to the container height (keeps the card compact).
   The link's flex centering + global image-fit classes (--cover / --contain)
   still work — contain-mode images show the image-area background around
   the product image, matching Standard template behaviour. */
.papafpro-template-minimal .papafpro-card__image-link {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.papafpro-template-minimal .papafpro-card__content {
	flex: 999 1 120px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	align-self: center;
	justify-content: center;
	gap: 4px;
	padding: 12px 16px;
	min-width: 0;
}

.papafpro-template-minimal .papafpro-card__title {
	margin: 0;
	font-size: var(--papafpro-title-size, 15px);
	line-height: 1.2;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 100%;
}

.papafpro-template-minimal .papafpro-card__price {
	margin: 0;
	font-size: var(--papafpro-price-size, 13px);
	font-weight: 500;
	opacity: 0.8;
}

.papafpro-template-minimal > .papafpro-card__button {
	flex: 1 1 auto;
	align-self: center;
	padding: 8px 16px;
	margin: 0 12px;
	font-size: 13px;
	white-space: nowrap;
	text-align: center;
}

/* ------------------------------------------------------------------
   MINIMAL TEMPLATE: Multi-column Grid Compact Mode
   When Minimal is inside a grid with 2 or more columns, force compact sizes 
   similar to mobile screens to prevent content from overlapping the button.
   ------------------------------------------------------------------ */
.papafpro-grid--cols-2 .papafpro-template-minimal .papafpro-card__image-area,
.papafpro-grid--cols-3 .papafpro-template-minimal .papafpro-card__image-area,
.papafpro-grid--cols-4 .papafpro-template-minimal .papafpro-card__image-area,
.papafpro-grid--cols-5 .papafpro-template-minimal .papafpro-card__image-area,
.papafpro-grid--cols-6 .papafpro-template-minimal .papafpro-card__image-area {
	min-width: 60px;
	max-width: 120px;
}

.papafpro-grid--cols-2 .papafpro-template-minimal .papafpro-card__content,
.papafpro-grid--cols-3 .papafpro-template-minimal .papafpro-card__content,
.papafpro-grid--cols-4 .papafpro-template-minimal .papafpro-card__content,
.papafpro-grid--cols-5 .papafpro-template-minimal .papafpro-card__content,
.papafpro-grid--cols-6 .papafpro-template-minimal .papafpro-card__content {
	padding: 8px 10px;
}

.papafpro-grid--cols-2 .papafpro-template-minimal .papafpro-card__title,
.papafpro-grid--cols-3 .papafpro-template-minimal .papafpro-card__title,
.papafpro-grid--cols-4 .papafpro-template-minimal .papafpro-card__title,
.papafpro-grid--cols-5 .papafpro-template-minimal .papafpro-card__title,
.papafpro-grid--cols-6 .papafpro-template-minimal .papafpro-card__title {
	font-size: 13px;
}

.papafpro-grid--cols-2 .papafpro-template-minimal .papafpro-card__price,
.papafpro-grid--cols-3 .papafpro-template-minimal .papafpro-card__price,
.papafpro-grid--cols-4 .papafpro-template-minimal .papafpro-card__price,
.papafpro-grid--cols-5 .papafpro-template-minimal .papafpro-card__price,
.papafpro-grid--cols-6 .papafpro-template-minimal .papafpro-card__price {
	font-size: 12px;
}

.papafpro-grid--cols-2 .papafpro-template-minimal > .papafpro-card__button,
.papafpro-grid--cols-3 .papafpro-template-minimal > .papafpro-card__button,
.papafpro-grid--cols-4 .papafpro-template-minimal > .papafpro-card__button,
.papafpro-grid--cols-5 .papafpro-template-minimal > .papafpro-card__button,
.papafpro-grid--cols-6 .papafpro-template-minimal > .papafpro-card__button {
	padding: 5px 10px;
	margin: 0 10px;
	font-size: 11px;
}

/* --- Rating (comparative + ranking) --- */
.papafpro-card__rating {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 8px;
	white-space: nowrap;
	overflow: hidden;
	max-width: 100%;
}

.papafpro-card__rating-stars {
	font-size: 16px;
	line-height: 1;
	letter-spacing: 1px;
}

.papafpro-star {
	color: #ccc;
}

.papafpro-star--full {
	color: var(--papafpro-rating-color, #ffc107);
}

.papafpro-star--half {
	color: var(--papafpro-rating-color, #ffc107);
	opacity: 0.6;
}

.papafpro-star--empty {
	color: #ccc;
}

.papafpro-card__rating-value {
	font-size: 14px;
	font-weight: 600;
	color: var(--papafpro-text-color, #333);
}

/* --- Pros & Cons (comparative + ranking) --- */
.papafpro-card__pros-cons {
	margin-bottom: 12px;
	padding: 8px 0;
	border-top: 1px solid rgba(0, 0, 0, 0.08);
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.papafpro-card__pros,
.papafpro-card__cons {
	list-style: none;
	margin: 0;
	padding: 0;
}

.papafpro-card__pros-item,
.papafpro-card__cons-item {
	padding: 3px 0;
	font-size: var(--papafpro-proscons-text-size, 13px);
	line-height: 1.4;
}

/* Label text color (v2.6.0). Falls back to the card text color when the
   dedicated control is left blank, preserving historical behavior.
   The icon spans keep their own color (set below), so only the label
   text is affected. */
.papafpro-card__pros-item {
	color: var(--papafpro-pros-text-color, var(--papafpro-text-color, #333333));
}

.papafpro-card__cons-item {
	color: var(--papafpro-cons-text-color, var(--papafpro-text-color, #333333));
}

.papafpro-card__pros-icon {
	color: var(--papafpro-pros-color, #4caf50);
	font-weight: 700;
	margin-right: 4px;
}

.papafpro-card__cons-icon {
	color: var(--papafpro-cons-color, #ef5350);
	font-weight: 700;
	margin-right: 4px;
}

/* Vertical layout (comparative) — sequential lists */
.papafpro-card__pros-cons .papafpro-card__cons {
	margin-top: 6px;
}

/* 2-column layout (ranking) — side by side */
.papafpro-card__pros-cons--columns {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 12px;
}

.papafpro-card__pros-cons--columns .papafpro-card__cons {
	margin-top: 0;
}

/* --- Wrapper for Image + Badges --- */
.papafpro-card__image-wrapper {
	position: relative;
}

/* --- Ranking --- */

/* --- Ranking Header --- */
.papafpro-card__ranking-header {
	background: var(--papafpro-ranking-bg, #ffc107);
	color: var(--papafpro-ranking-text, #4a1b0c);
	padding: 8px 16px;
	font-weight: 700;
	font-size: 14px;
	text-align: center;
	border-radius: var(--papafpro-border-radius, 8px)
	               var(--papafpro-border-radius, 8px)
	               0 0;
}

.papafpro-card__ranking-position {
	font-size: 18px;
	margin-right: 4px;
}

.papafpro-card__ranking-label {
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

/* Ranking card: remove top border-radius from image
   area when ranking header is present */
.papafpro-template-ranking .papafpro-card__ranking-header + .papafpro-card__badge--marketplace + .papafpro-card__image-area,
.papafpro-template-ranking .papafpro-card__ranking-header + .papafpro-card__image-area {
	border-radius: 0;
}

/* ==========================================================================
   RESPONSIVO
   ========================================================================== */

@media (max-width: 768px) {
	.papafpro-grid--cols-3,
	.papafpro-grid--cols-4,
	.papafpro-grid--cols-5,
	.papafpro-grid--cols-6 {
		grid-template-columns: repeat(2, 1fr);
	}

	/* Colunas de tablet explícitas (v2.6.0) — vencem o colapso acima por
	   ordem de fonte (mesma especificidade). Sem a classe = 2 colunas. */
	.papafpro-grid--tablet-1 {
		grid-template-columns: 1fr;
	}
	.papafpro-grid--tablet-2 {
		grid-template-columns: repeat(2, 1fr);
	}
	.papafpro-grid--tablet-3 {
		grid-template-columns: repeat(3, 1fr);
	}
	.papafpro-grid--tablet-4 {
		grid-template-columns: repeat(4, 1fr);
	}
	.papafpro-grid--tablet-5 {
		grid-template-columns: repeat(5, 1fr);
	}
	.papafpro-grid--tablet-6 {
		grid-template-columns: repeat(6, 1fr);
	}

	/* ------------------------------------------------------------------
	   LIST LAYOUT (Standard layout=list): stay horizontal, go compact.
	   Inspired by TudoCelular.com product cards on mobile.
	   ------------------------------------------------------------------ */
	.papafpro-layout-list .papafpro-card {
		flex-direction: row;
		align-items: stretch;
	}

	.papafpro-layout-list .papafpro-card__image-wrapper {
		flex: 0 0 auto;
		aspect-ratio: 1 / 1;
		min-width: 80px;
		max-width: 150px;
	}

	.papafpro-layout-list .papafpro-card__image-area {
		aspect-ratio: 1 / 1;
	}

	.papafpro-layout-list .papafpro-card__content {
		padding: 8px 10px;
		gap: 2px;
	}

	.papafpro-layout-list .papafpro-card__title {
		font-size: 13px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		margin-bottom: 2px;
	}

	.papafpro-layout-list .papafpro-card__description {
		font-size: 11px;
		-webkit-line-clamp: 1;
		margin-bottom: 4px;
	}

	.papafpro-layout-list .papafpro-card__price {
		font-size: 14px;
		margin-bottom: 4px;
	}

	.papafpro-layout-list .papafpro-card__button {
		padding: 6px 12px;
		font-size: 12px;
		align-self: flex-start;
		min-height: 32px;
	}

	/* Badges: shrink & stack for compact list cards */
	.papafpro-layout-list .papafpro-card__badge {
		font-size: 9px;
		padding: 2px 5px;
		max-width: calc(100% - 10px);
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.papafpro-layout-list .papafpro-card__badge--custom {
		top: 5px;
	}

	.papafpro-layout-list .papafpro-card__badge--marketplace {
		top: 5px;
		bottom: auto;
	}

	.papafpro-layout-list .papafpro-badge-pos--top-left {
		left: 5px;
		right: auto;
	}

	.papafpro-layout-list .papafpro-badge-pos--top-right {
		right: 5px;
		left: auto;
	}

	.papafpro-layout-list .papafpro-badge-pos--top-center {
		left: 50%;
		right: auto;
		transform: translateX(-50%);
	}

	.papafpro-layout-list .papafpro-badge--ribbon {
		width: 55px;
		height: 55px;
	}

	.papafpro-layout-list .papafpro-badge--star {
		width: 40px;
		height: 40px;
	}

	.papafpro-layout-list .papafpro-badge--medal {
		width: 36px;
		height: 44px;
	}

	.papafpro-layout-list .papafpro-badge--shield {
		width: 32px;
		height: 38px;
	}

	.papafpro-layout-list .papafpro-badge--banner {
		width: 90%;
		max-width: none;
	}

	/* ------------------------------------------------------------------
	   STANDARD TEMPLATE (mobile): price + marketplace badge share one row
	   at the bottom of the card, side by side (badge is no longer
	   absolutely positioned in this context — it moved into the row's
	   normal document flow, see the theme's card-standard.php override).
	   ------------------------------------------------------------------ */
	.papafpro-template-standard .papafpro-card__price-row {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 8px;
		margin-bottom: 4px;
		margin-top: auto;
	}

	.papafpro-template-standard .papafpro-card__price-row .papafpro-card__badge--marketplace {
		position: static;
		flex-shrink: 0;
	}

	/* ------------------------------------------------------------------
	   STANDARD TEMPLATE (mobile): rating — show only 1 star icon + the
	   numeric value (e.g. "⭐ 4.9") instead of the classic 5-star row.
	   ------------------------------------------------------------------ */
	.papafpro-template-standard .papafpro-card__rating .papafpro-star:not(:first-child) {
		display: none;
	}

	/* ------------------------------------------------------------------
	   STANDARD TEMPLATE (mobile): remove the sales count line
	   ("X mil vendidos") entirely — Shop Hub theme override addition.
	   ------------------------------------------------------------------ */
	.papafpro-template-standard .papafpro-card__sales {
		display: none;
	}

	/* ------------------------------------------------------------------
	   STANDARD TEMPLATE (mobile): remove the physical CTA button — the
	   whole card becomes the clickable area instead (see stretched-link).
	   ------------------------------------------------------------------ */
	.papafpro-template-standard .papafpro-card__button {
		display: none;
	}

	/* ------------------------------------------------------------------
	   STANDARD TEMPLATE (mobile): stretched link — covers the whole card
	   so any tap navigates like the removed button did. Explicit
	   top/right/bottom/left (not the "inset" shorthand) + width/height
	   for maximum browser support. z-index raised above every other
	   mobile element in this template so no sibling can shadow it.
	   ------------------------------------------------------------------ */
	.papafpro-template-standard .papafpro-card__stretched-link {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 5;
	}

	/* ------------------------------------------------------------------
	   STANDARD TEMPLATE: switch to a compact horizontal list row on mobile
	   (image left, content right) — shop-name/discount-badge hidden,
	   rating shown, matching the Horizontal template's mobile look.
	   ------------------------------------------------------------------ */
	.papafpro-template-standard {
		flex-direction: row;
		align-items: stretch;
	}

	.papafpro-template-standard > .papafpro-card__shop-name,
	.papafpro-template-standard .papafpro-card__discount-badge {
		display: none;
	}

	.papafpro-template-standard > .papafpro-card__content > .papafpro-card__rating {
		display: inline-flex !important;
		margin-top: 0;
		margin-bottom: 4px;
	}

	.papafpro-template-standard .papafpro-card__image-wrapper {
		flex: 0 0 auto;
		aspect-ratio: 1 / 1;
		min-width: 80px;
		max-width: 150px;
	}

	.papafpro-template-standard .papafpro-card__image-area {
		aspect-ratio: 1 / 1;
	}

	.papafpro-template-standard .papafpro-card__content {
		padding: 8px 10px;
		gap: 2px;
		min-width: 0;
	}

	.papafpro-template-standard .papafpro-card__title {
		font-size: 13px;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		overflow: hidden;
		margin-bottom: 2px;
		min-width: 0;
	}

	.papafpro-template-standard .papafpro-card__description {
		font-size: 11px;
		-webkit-line-clamp: 3;
		margin-bottom: 4px;
	}

	.papafpro-template-standard .papafpro-card__price {
		font-size: 14px;
		margin-bottom: 0;
	}

	.papafpro-template-standard .papafpro-card__button {
		padding: 6px 12px;
		font-size: 12px;
		align-self: flex-start;
		min-height: 32px;
	}

	/* ------------------------------------------------------------------
	   HORIZONTAL TEMPLATE: stay horizontal, go compact.
	   ------------------------------------------------------------------ */
	.papafpro-template-horizontal {
		flex-direction: row;
		align-items: stretch;
	}

	.papafpro-template-horizontal .papafpro-card__image-wrapper {
		flex: 0 0 auto;
		aspect-ratio: 1 / 1;
		min-width: 80px;
		max-width: 150px;
	}

	.papafpro-template-horizontal .papafpro-card__image-area {
		aspect-ratio: 1 / 1;
	}

	.papafpro-template-horizontal .papafpro-card__content {
		padding: 8px 10px;
		gap: 2px;
	}

	.papafpro-template-horizontal .papafpro-card__title {
		font-size: 13px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		margin-bottom: 2px;
	}

	.papafpro-template-horizontal .papafpro-card__description {
		font-size: 11px;
		-webkit-line-clamp: 1;
		margin-bottom: 4px;
	}

	.papafpro-template-horizontal .papafpro-card__price {
		font-size: 14px;
		margin-bottom: 4px;
	}

	.papafpro-template-horizontal .papafpro-card__button {
		padding: 6px 12px;
		font-size: 12px;
		align-self: flex-start;
		min-height: 32px;
	}

	/* Badges: shrink & stack for compact horizontal cards */
	.papafpro-template-horizontal .papafpro-card__badge {
		font-size: 9px;
		padding: 2px 5px;
		max-width: calc(100% - 10px);
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.papafpro-template-horizontal .papafpro-card__badge--custom {
		top: 5px;
	}

	.papafpro-template-horizontal .papafpro-card__badge--marketplace {
		top: 5px;
		bottom: auto;
	}

	.papafpro-template-horizontal .papafpro-badge-pos--top-left {
		left: 5px;
		right: auto;
	}

	.papafpro-template-horizontal .papafpro-badge-pos--top-right {
		right: 5px;
		left: auto;
	}

	.papafpro-template-horizontal .papafpro-badge-pos--top-center {
		left: 50%;
		right: auto;
		transform: translateX(-50%);
	}

	.papafpro-template-horizontal .papafpro-badge--ribbon {
		width: 55px;
		height: 55px;
	}

	.papafpro-template-horizontal .papafpro-badge--star {
		width: 40px;
		height: 40px;
	}

	.papafpro-template-horizontal .papafpro-badge--medal {
		width: 36px;
		height: 44px;
	}

	.papafpro-template-horizontal .papafpro-badge--shield {
		width: 32px;
		height: 38px;
	}

	.papafpro-template-horizontal .papafpro-badge--banner {
		width: 90%;
		max-width: none;
	}

	/* ------------------------------------------------------------------
	   MINIMAL TEMPLATE: stay horizontal, go compact.
	   ------------------------------------------------------------------ */
	.papafpro-template-minimal {
		padding: 0;
		gap: 0;
	}

	.papafpro-template-minimal .papafpro-card__image-area {
		flex: 0 0 auto;
		aspect-ratio: 1 / 1;
		min-width: 60px;
		max-width: 120px;
	}

	.papafpro-template-minimal .papafpro-card__content {
		padding: 8px 10px;
		gap: 2px;
	}

	.papafpro-template-minimal .papafpro-card__title {
		font-size: 13px;
	}

	.papafpro-template-minimal .papafpro-card__price {
		font-size: 12px;
	}

	.papafpro-template-minimal > .papafpro-card__button {
		padding: 6px 12px;
		margin: 0 10px;
		font-size: 12px;
	}

	/* Ranking 2-col → single col on tablet */
	.papafpro-card__pros-cons--columns {
		grid-template-columns: 1fr;
	}

	.papafpro-card__pros-cons--columns .papafpro-card__cons {
		margin-top: 6px;
	}
}

@media (max-width: 480px) {
	.papafpro-grid--cols-2,
	.papafpro-grid--cols-3,
	.papafpro-grid--cols-4,
	.papafpro-grid--cols-5,
	.papafpro-grid--cols-6 {
		grid-template-columns: 1fr;
	}

	/* Colunas de mobile explícitas (v2.6.0) — vencem o colapso para 1fr
	   por ordem de fonte. Sem a classe = 1 coluna. */
	.papafpro-grid--mobile-1 {
		grid-template-columns: 1fr;
	}
	.papafpro-grid--mobile-2 {
		grid-template-columns: repeat(2, 1fr);
	}
	.papafpro-grid--mobile-3 {
		grid-template-columns: repeat(3, 1fr);
	}
	.papafpro-grid--mobile-4 {
		grid-template-columns: repeat(4, 1fr);
	}
	.papafpro-grid--mobile-5 {
		grid-template-columns: repeat(5, 1fr);
	}
	.papafpro-grid--mobile-6 {
		grid-template-columns: repeat(6, 1fr);
	}

	/* Minimal → compact horizontal */
	.papafpro-template-minimal {
		padding: 0;
		gap: 0;
		align-items: stretch;
	}

	.papafpro-template-minimal .papafpro-card__image-area {
		flex: 0 0 auto;
		aspect-ratio: 1 / 1;
		min-width: 60px;
		max-width: 120px;
	}

	.papafpro-template-minimal .papafpro-card__content {
		flex: 1 1 0%;
		min-width: 0;
		padding: 8px 10px;
	}

	.papafpro-template-minimal .papafpro-card__title {
		font-size: 13px;
	}

	.papafpro-template-minimal .papafpro-card__price {
		font-size: 12px;
	}

	.papafpro-template-minimal > .papafpro-card__button {
		padding: 5px 10px;
		margin: 0 10px;
		font-size: 11px;
		white-space: nowrap;
		text-align: center;
	}
}

/* ----------------------------------------------------------------------------
   SHOP NAME & DISCOUNT BADGE (v2.9.0)
   ---------------------------------------------------------------------------- */
.papafpro-card__shop-name {
    font-size: 12px;
    font-weight: 600;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 4px 8px 2px;
    line-height: 1.4;
}
.papafpro-card__discount-badge {
    position: absolute;
    bottom: 8px;
    left: 8px;
    background: #e74c3c;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 4px;
    z-index: 2;
    line-height: 1.5;
}
