/**
 * 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: classe adicionada, sem mudanças visuais --- */
.papafpro-template-standard {
	/* Herda 100% dos estilos base de .papafpro-card */
}

/* 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;
	}

	/* ------------------------------------------------------------------
	   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;
	}
}

/* ==========================================================================
   ACESSIBILIDADE — FOCO DE TECLADO E REDUCED MOTION (v2.7.1)
   ========================================================================== */

/* Anel de foco de duas cores nos 4 alvos clicáveis do card.
   Duas cores porque o fundo de cada alvo é configurável pelo usuário:
   o anel escuro lê sobre fundo claro, o anel claro lê sobre fundo escuro.
   Anel único de cor fixa sumiria (o botão é azul por padrão).

   :focus-visible (e não :focus) para o anel não disparar em clique de mouse.
   outline + outline-offset em vez de box-shadow: o botão já usa box-shadow
   no hover (.papafpro-card__button--shadow:hover) e as duas regras
   competiriam pela mesma propriedade. */

/* Botão e badge: anel de duas voltas. Os dois são caixas retangulares — o
   botão é inline-block e o badge é absolute —, então o outline e o ::after
   desenham a mesma forma e as voltas ficam concêntricas. Cabe na folga
   existente: o conteúdo do card tem padding 16px e o badge fica a 8px da
   borda. */
.papafpro-card__button:focus-visible,
a.papafpro-card__badge--marketplace:focus-visible {
	outline: 2px solid #10171e;
	outline-offset: 2px;
}

/* Contexto de posicionamento para o ::after. O badge NÃO entra aqui: ele já é
   position: absolute e seria desposicionado. A imagem já é relative. */
.papafpro-card__button:focus-visible {
	position: relative;
}

.papafpro-card__button:focus-visible::after,
a.papafpro-card__badge--marketplace:focus-visible::after {
	content: "";
	position: absolute;
	inset: -6px;
	border: 2px solid #ffffff;
	border-radius: inherit;
	pointer-events: none;
}

/* Título: uma volta só, em currentColor.

   O <a> do título é inline e pode quebrar em várias linhas. Só o outline
   acompanha o recorte do texto nesse caso — ele contorna todos os pedaços.
   Anel em pseudo-elemento NÃO serve aqui: a caixa de um position: absolute
   dentro de um inline é formada pela borda esquerda do primeiro pedaço e pela
   direita do último, então com a segunda linha mais curta o retângulo corta o
   texto em vez de envolvê-lo.

   Sem pseudo-elemento não dá para ter a segunda volta, e por isso a cor é
   currentColor: é a cor do próprio título, que o usuário já escolheu legível
   sobre o fundo do card. O anel acompanha qualquer combinação de cores sem
   depender da volta clara. O offset de 2px abre uma folga da cor do fundo
   entre o texto e o anel, separando os dois. */
.papafpro-card__title a:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

/* Imagem: anel interno. O link ocupa a largura toda do card e
   .papafpro-card usa overflow: hidden, que recortaria um anel externo. */
.papafpro-card__image-link:focus-visible {
	outline: 2px solid #10171e;
	outline-offset: -4px;
}

.papafpro-card__image-link:focus-visible::after {
	content: "";
	position: absolute;
	inset: 2px;
	border: 2px solid #ffffff;
	border-radius: inherit;
	pointer-events: none;
}

/* Movimento reduzido: espelha o comportamento que o plugin já expõe pelo
   setting hover_effect = 'none' (.papafpro-card.papafpro-hover--none:hover).
   Mira apenas as duas transições e os dois hovers de elevação — nunca
   transform de forma ampla, porque as badges usam translateX(-50%) como
   POSICIONAMENTO (top-center, banner) e ficariam descentralizadas.
   box-shadow permanece: sombra não é movimento. */
@media (prefers-reduced-motion: reduce) {

	.papafpro-card,
	.papafpro-card__button {
		transition: none;
	}

	.papafpro-card--shadow:hover,
	.papafpro-card--shadow.papafpro-hover--strong:hover {
		transform: none;
	}
}

/* ==========================================================================
   AVISO DE SHORTCODE (somente para quem pode editar) — v2.7.1
   ========================================================================== */

/* Bloco neutro de diagnóstico. Cinzas fixos, deliberadamente FORA do sistema
   de tokens --papafpro-*: não é conteúdo do card e não deve herdar a
   aparência configurada pelo usuário. */
.papafpro-shortcode-notice {
	box-sizing: border-box;
	margin: 0 0 1em;
	padding: 12px 14px;
	border: 1px solid #d5d8dc;
	border-left: 3px solid #8c8f94;
	border-radius: 3px;
	background: #f6f7f7;
	color: #2c3338;
	font-size: 13px;
	line-height: 1.5;
}

.papafpro-shortcode-notice__label {
	font-weight: 600;
}

.papafpro-shortcode-notice__label::after {
	content: " — ";
}

.papafpro-shortcode-notice__hint {
	display: block;
	margin-top: 4px;
	font-size: 12px;
	opacity: 0.7;
}