/* Premium Gaming Shop Helper — أنماط عناصر المحتوى المستورد فقط (hero/cards/faq/cta/
   term-extras/price-table)، مستقلة عن أي ثيم. ألوان العلامة ثابتة هنا (hex) بدل متغيرات
   theme.json لأن القالب الحالي Woodmart ولا يوفّر هذه المتغيرات. خصائص منطقية لدعم RTL/LTR. */

:root {
	--pgs-ink: #0b0f14;
	--pgs-surface: #ffffff;
	--pgs-ground: #f4f5f7;
	--pgs-accent: #dc0a1c;
	--pgs-accent-deep: #a30714;
	--pgs-muted: #5b6472;
	--pgs-border: #e3e5e9;
	--pgs-radius-card: 10px;
	--pgs-radius-section: 16px;
	--pgs-radius-button: 8px;
}

/* ===== Hero / section intro (homepage + category intro) ===== */
.pgs-hero, .pgs-hero--thin {
	background: linear-gradient(135deg, var(--pgs-ink) 0%, #1a2230 100%);
	color: #fff;
	padding-block: 56px;
	border-radius: var(--pgs-radius-section);
	margin-block: 24px;
	padding-inline: 32px;
}
.pgs-hero--thin { padding-block: 36px; }
.pgs-hero__title, .pgs-hero--thin .pgs-hero__title { color: #fff; margin-block-end: 12px; font-size: clamp(1.6rem, 3vw, 2.4rem); }
.pgs-hero__subtitle { color: #cfd3d8; max-width: 70ch; font-size: 1.05rem; }
.pgs-badge {
	display: inline-block;
	background: rgba(220,10,28,0.18);
	color: #ff6b78;
	border: 1px solid rgba(220,10,28,0.4);
	border-radius: 999px;
	padding: 4px 14px;
	font-size: 0.8rem;
	font-weight: 600;
	margin-block-end: 14px;
}

/* ===== Category / link cards grid (homepage + related categories) ===== */
.pgs-cards, .pgs-related__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 16px;
	margin-block-end: 24px;
}
.pgs-card, .pgs-related__card {
	display: block;
	background: var(--pgs-ground);
	border: 1px solid var(--pgs-border);
	border-radius: var(--pgs-radius-card);
	padding: 18px 20px;
	font-weight: 600;
	color: var(--pgs-ink);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.pgs-card a { color: inherit; }
.pgs-card:hover, .pgs-related__card:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(0,0,0,0.08);
	color: var(--pgs-accent-deep);
}

/* ===== FAQ (homepage, category pages, articles) ===== */
.pgs-faq { margin-block: 32px; }
.pgs-faq__title { margin-block-end: 14px; }
.pgs-faq__item {
	border: 1px solid var(--pgs-border);
	border-radius: var(--pgs-radius-card);
	padding: 14px 18px;
	margin-block-end: 10px;
}
.pgs-faq__item summary { font-weight: 600; cursor: pointer; }
.pgs-faq__item p { margin-block-start: 10px; color: var(--pgs-muted); }

/* ===== Related categories ===== */
.pgs-related { margin-block: 32px; }
.pgs-related__title { margin-block-end: 14px; }

/* ===== CTA buttons ===== */
.pgs-cta-row { display: flex; gap: 12px; flex-wrap: wrap; margin-block: 20px; }
.pgs-cta-row .wp-block-button__link {
	display: inline-block;
	background: var(--pgs-accent);
	color: #fff;
	padding: 12px 26px;
	border-radius: var(--pgs-radius-button);
	font-weight: 700;
}
.pgs-cta-row .wp-block-button__link:hover { background: var(--pgs-accent-deep); color: #fff; }

/* ===== Category (term) intro + extras wrapper ===== */
.pgs-term-content { padding-block: 10px 0; }
.pgs-term-section { margin-block-end: 18px; }
.pgs-term-extras { padding-block: 10px 40px; }

/* ===== Article FAQ block spacing re-use above ===== */

/* ===== Price table (used in some hand-written content) ===== */
.pgs-price-table table { width: 100%; border-collapse: collapse; margin-block: 16px; }
.pgs-price-table th, .pgs-price-table td { border: 1px solid var(--pgs-border); padding: 10px 14px; text-align: start; }
.pgs-price-table th { background: var(--pgs-ground); }

/* ===== Optional breadcrumbs (only if [pgs_breadcrumbs] is placed manually) ===== */
.pgs-breadcrumbs { margin: 14px 0; }
.pgs-breadcrumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; font-size: 0.85rem; color: var(--pgs-muted); }
.pgs-breadcrumbs li:not(:last-child)::after { content: "/"; margin-inline-start: 6px; color: var(--pgs-border); }
.pgs-breadcrumbs a { color: var(--pgs-muted); }
.pgs-breadcrumbs a:hover { color: var(--pgs-accent-deep); }
html[dir="rtl"] .pgs-breadcrumbs li:not(:last-child)::after { content: "\\"; }

@media (max-width: 640px) {
	.pgs-hero, .pgs-hero--thin { padding-inline: 20px; padding-block: 32px; }
}