/*
 * برق — نظام الشبكة وصناديق المحتوى. خصائص منطقية بالكامل (RTL أصيل).
 * ١٢ هيئة شبكة + تحكم أعمدة لكل مقاس شاشة + مكتبة صناديق محتوى.
 */

/* ===== الأساس: تحكم الأعمدة لكل مقاس شاشة ===== */
.barq-grid {
	display: grid;
	gap: var(--barq-grid-gap, 1.5rem);
	--cols: 3;         /* سطح المكتب */
	--cols-md: 2;      /* لوحي */
	--cols-sm: 1;      /* جوال */
	grid-template-columns: repeat(var(--cols), minmax(0, 1fr));
}
@media (max-width: 1024px) { .barq-grid { grid-template-columns: repeat(var(--cols-md), minmax(0, 1fr)); } }
@media (max-width: 600px)  { .barq-grid { grid-template-columns: repeat(var(--cols-sm), minmax(0, 1fr)); } }

/* بطاقة أساسية تُستخدم في أغلب الهيئات */
.barq-card {
	background: var(--wp--preset--color--base, #fff);
	border: 1px solid var(--wp--preset--color--border, #e2e6ec);
	border-radius: 14px;
	overflow: clip;
	display: flex;
	flex-direction: column;
	block-size: 100%;
}
.barq-card .wp-block-post-featured-image img,
.barq-card img { inline-size: 100%; block-size: 170px; object-fit: cover; }
.barq-card > :where(:not(img):not(figure)) { padding-inline: 1rem; }
.barq-card > :first-child { margin-block-start: 0; }
.barq-card .wp-block-post-title { margin-block: 0.6rem 0.3rem; font-size: 1.15rem; }
.barq-card .wp-block-post-excerpt { color: var(--wp--preset--color--muted, #5b6472); }
.barq-card .barq-card__foot { margin-block-start: auto; padding-block: 0.8rem; color: var(--wp--preset--color--muted, #5b6472); font-size: 0.85rem; }

/* ===== ١٢ هيئة ===== */
/* 1-3) بطاقات ٢/٣/٤ أعمدة */
.barq-grid--cards2 { --cols: 2; --cols-md: 2; }
.barq-grid--cards3 { --cols: 3; --cols-md: 2; }
.barq-grid--cards4 { --cols: 4; --cols-md: 2; }

/* 4) قائمة وسائط (صورة جانبية) */
.barq-grid--media { --cols: 1; --cols-md: 1; gap: 1rem; }
.barq-grid--media .barq-card { flex-direction: row; align-items: stretch; }
.barq-grid--media .barq-card img { inline-size: 190px; block-size: auto; flex: none; }
@media (max-width: 600px) { .barq-grid--media .barq-card { flex-direction: column; } .barq-grid--media .barq-card img { inline-size: 100%; block-size: 170px; } }

/* 5) قائمة بسيطة (عنوان + مقتطف، بلا صور) */
.barq-grid--list { --cols: 1; --cols-md: 1; gap: 0; }
.barq-grid--list > * { border-block-end: 1px solid var(--wp--preset--color--border, #e2e6ec); padding-block: 1.1rem; }

/* 6) مجلّة (أول عنصر كبير) */
.barq-grid--magazine { --cols: 3; --cols-md: 2; }
.barq-grid--magazine > :first-child { grid-column: 1 / -1; }
.barq-grid--magazine > :first-child.barq-card { flex-direction: row; }
.barq-grid--magazine > :first-child.barq-card img { inline-size: 50%; block-size: auto; }
@media (max-width: 700px) { .barq-grid--magazine > :first-child.barq-card { flex-direction: column; } .barq-grid--magazine > :first-child.barq-card img { inline-size: 100%; block-size: 200px; } }

/* 7) تراكب (عنوان فوق الصورة) */
.barq-grid--overlay { --cols: 3; --cols-md: 2; }
.barq-grid--overlay .barq-card { position: relative; }
.barq-grid--overlay .barq-card img { block-size: 220px; }
.barq-grid--overlay .barq-card__body {
	position: absolute; inset-block-end: 0; inset-inline: 0;
	background: linear-gradient(to top, rgba(0,0,0,.75), transparent);
	color: #fff; padding: 1rem;
}
.barq-grid--overlay .barq-card__body .wp-block-post-title { color: #fff; }

/* 8) مضغوط (كثيف، عنوان فقط) */
.barq-grid--compact { --cols: 2; --cols-md: 1; gap: 0.4rem; }
.barq-grid--compact > * { padding: 0.5rem 0.7rem; border-radius: 8px; }
.barq-grid--compact > :hover { background: var(--wp--preset--color--surface, #f6f7f9); }

/* 9) مرقّم (ترتيب بالأرقام) */
.barq-grid--numbered { --cols: 1; --cols-md: 1; counter-reset: barq; gap: 0.6rem; }
.barq-grid--numbered > * { counter-increment: barq; display: flex; gap: 0.9rem; align-items: baseline; }
.barq-grid--numbered > *::before {
	content: counter(barq); font-weight: 800; color: var(--wp--preset--color--primary, #0b7d5a);
	font-size: 1.4rem; min-inline-size: 1.6rem;
}

/* 10) مختلط (مميّز + شبكة) */
.barq-grid--mixed { --cols: 2; --cols-md: 1; }
.barq-grid--mixed > :first-child { grid-row: span 2; }

/* 11) تمرير أفقي */
.barq-grid--scroll { display: flex; overflow-x: auto; gap: 1rem; scroll-snap-type: x mandatory; padding-block-end: 0.5rem; }
.barq-grid--scroll > * { flex: 0 0 min(78%, 300px); scroll-snap-align: start; }

/* 12) خطوط (عنوان + تاريخ، فواصل) */
.barq-grid--lines { --cols: 1; gap: 0; }
.barq-grid--lines > * { display: flex; justify-content: space-between; gap: 1rem; padding-block: 0.8rem; border-block-end: 1px dashed var(--wp--preset--color--border, #e2e6ec); }

/* ===== مكتبة صناديق المحتوى (١٢) ===== */
.barq-box {
	border: 1px solid var(--wp--preset--color--border, #e2e6ec);
	border-inline-start: 4px solid var(--wp--preset--color--primary, #0b7d5a);
	background: var(--wp--preset--color--surface, #f6f7f9);
	border-radius: 12px;
	padding: 1rem 1.15rem;
	margin-block: 1.2rem;
}
.barq-box > :first-child { margin-block-start: 0; }
.barq-box > :last-child { margin-block-end: 0; }
.barq-box__title { font-weight: 700; margin: 0 0 0.35rem; display: flex; align-items: center; gap: 0.5rem; }
.barq-box__title svg { inline-size: 1.15rem; block-size: 1.15rem; flex: none; }

.barq-box--info    { border-inline-start-color: #2563eb; }
.barq-box--tip     { border-inline-start-color: #0b7d5a; }
.barq-box--success { border-inline-start-color: #15803d; }
.barq-box--warning { border-inline-start-color: #b45309; background: color-mix(in srgb, #b45309 8%, var(--wp--preset--color--surface, #f6f7f9)); }
.barq-box--danger  { border-inline-start-color: #b91c1c; background: color-mix(in srgb, #b91c1c 8%, var(--wp--preset--color--surface, #f6f7f9)); }
.barq-box--note    { border-inline-start-color: #6b7280; }
.barq-box--quote   { border-inline-start-color: var(--wp--preset--color--accent, #d97706); font-style: italic; }
.barq-box--official{ border-inline-start-color: #15803d; }
.barq-box--deadline{ border-inline-start-color: #b91c1c; }
.barq-box--salary  { border-inline-start-color: #6b7280; }

/* صندوق إحصائية */
.barq-box--stat { display: flex; flex-direction: column; align-items: center; text-align: center; border-inline-start-width: 1px; }
.barq-box--stat .barq-stat__num { font-size: 2.4rem; font-weight: 800; color: var(--wp--preset--color--primary, #0b7d5a); line-height: 1.1; }

/* صندوق خطوات */
.barq-box--steps ol { margin: 0; padding-inline-start: 1.3rem; }
.barq-box--steps li { margin-block: 0.4rem; }

/* صندوق دعوة داخل المقال */
.barq-box--cta { border: none; background: linear-gradient(135deg, var(--wp--preset--color--primary, #0b7d5a), var(--wp--preset--color--primary-hover, #075e44)); color: #fff; text-align: center; }
.barq-box--cta .wp-block-button__link { background: #fff; color: var(--wp--preset--color--primary, #0b7d5a); }

/* ===== أقسام الصفحة الرئيسية ===== */
.barq-section { padding-block: var(--wp--preset--spacing--60, 3rem); }
.barq-section__head { text-align: center; margin-block-end: 1.5rem; }
.barq-hero-split { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 2rem; align-items: center; }
@media (max-width: 782px) { .barq-hero-split { grid-template-columns: 1fr; } }
.barq-cats { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 0.8rem; }
.barq-cat {
	display: flex; align-items: center; gap: 0.6rem; padding: 0.9rem 1rem;
	border: 1px solid var(--wp--preset--color--border, #e2e6ec); border-radius: 12px;
	background: var(--wp--preset--color--base, #fff); text-decoration: none; color: inherit;
}
.barq-cat:hover { border-color: var(--wp--preset--color--primary, #0b7d5a); }