/*
 * Tarot Masterz — Etsy SEO Orchestrator skin
 * Re-skins the plugin's front-end components to the Celestial Arcana palette.
 * Loaded AFTER the plugin's eso-public.css, so matching selectors win by order.
 * Uses the theme's CSS variables (defined in style.css :root).
 */

/* Shop / product cards */
body .eso-card {
	background: linear-gradient(180deg, var(--tm-panel), var(--tm-bg-2));
	border: 1px solid var(--tm-line-soft);
	border-radius: var(--tm-radius-lg);
	box-shadow: none;
}
body .eso-card:hover {
	transform: translateY(-5px);
	border-color: var(--tm-line);
	box-shadow: var(--tm-glow);
}
body .eso-card-thumb { background: #0a0717; }
body .eso-card-ph { color: var(--tm-gold); }
body .eso-card-body { gap: .55rem; }
body .eso-card-title { font-family: var(--tm-display); font-weight: 600; }
body .eso-card-title a { color: var(--tm-ink); }
body .eso-card-title a:hover { color: var(--tm-gold-2); }
body .eso-card-tagline { color: var(--tm-muted); font-size: 1.05rem; }
body .eso-card-price { color: var(--tm-gold); font-family: var(--tm-display); letter-spacing: .03em; }

/* Buttons */
body .eso-btn {
	font-family: var(--tm-display);
	text-transform: uppercase;
	letter-spacing: .12em;
	font-size: .76rem;
	border-radius: 999px;
	padding: .7rem 1.3rem;
}
body .eso-btn-primary {
	background: linear-gradient(135deg, var(--tm-gold-2), var(--tm-gold));
	border-color: transparent;
	color: #1b1335;
	box-shadow: 0 10px 24px rgba(212,175,55,.25);
}
body .eso-btn-primary:hover {
	background: linear-gradient(135deg, #f2d585, var(--tm-gold-2));
	color: #100b22;
	transform: translateY(-2px);
}
body .eso-btn-ghost {
	background: transparent;
	color: var(--tm-ink);
	border: 1px solid var(--tm-line);
}
body .eso-btn-ghost:hover {
	border-color: var(--tm-gold);
	color: var(--tm-gold-2);
	background: transparent;
}

/* Call-to-action banner */
body .eso-cta {
	background: linear-gradient(135deg, #241646 0%, #140d2b 100%);
	border: 1px solid var(--tm-line);
	border-radius: var(--tm-radius-lg);
	box-shadow: var(--tm-shadow);
	position: relative;
	overflow: hidden;
}
body .eso-cta::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(420px 160px at 12% 0%, rgba(212,175,55,.14), transparent 60%);
	pointer-events: none;
}
body .eso-cta-text { color: var(--tm-ink); font-family: var(--tm-display); font-weight: 500; letter-spacing: .01em; }
body .eso-cta-button {
	background: linear-gradient(135deg, var(--tm-gold-2), var(--tm-gold));
	color: #1b1335;
	border-radius: 999px;
	font-family: var(--tm-display);
	text-transform: uppercase;
	letter-spacing: .12em;
	box-shadow: 0 10px 24px rgba(212,175,55,.28);
}
body .eso-cta-button:hover { background: linear-gradient(135deg, #f2d585, var(--tm-gold-2)); color: #100b22; }

/* Related */
body .eso-related-title,
body .eso-section-title { font-family: var(--tm-display); color: var(--tm-ink); }

/* Single shop / product templates from the plugin */
body .eso-single { max-width: var(--tm-wide); }
body .eso-single-title,
body .eso-archive-title { font-family: var(--tm-display); color: var(--tm-ink); }
body .eso-single-price { color: var(--tm-gold); font-family: var(--tm-display); }
body .eso-single-content { color: var(--tm-ink); font-size: 1.22rem; }
body .eso-single-content h2,
body .eso-single-content h3 { font-family: var(--tm-display); color: var(--tm-ink); }
body .eso-archive { max-width: var(--tm-wide); }
body .eso-archive-desc { color: var(--tm-muted); }

/* Breadcrumb */
body .eso-breadcrumb { color: var(--tm-faint); }
body .eso-breadcrumb a { color: var(--tm-muted); }
body .eso-breadcrumb a:hover { color: var(--tm-gold-2); }
body .eso-breadcrumb .sep { color: var(--tm-line); }

/* Store link & empty state */
body .eso-store-link { color: var(--tm-gold-2); font-family: var(--tm-display); letter-spacing: .04em; }
body .eso-store-link:hover { color: var(--tm-gold); }
body .eso-empty {
	background: linear-gradient(180deg, var(--tm-panel), var(--tm-bg-2));
	border: 1px solid var(--tm-line-soft);
	border-radius: var(--tm-radius-lg);
	color: var(--tm-muted);
}

/* Pagination inside plugin archive template */
body .eso-pagination .page-numbers {
	font-family: var(--tm-display);
	border: 1px solid var(--tm-line-soft);
	border-radius: 10px;
	color: var(--tm-muted);
	padding: .55rem .85rem;
}
body .eso-pagination .page-numbers.current,
body .eso-pagination .page-numbers:hover { color: var(--tm-gold-2); border-color: var(--tm-gold); }