/* ==========================================================================
   مِداد — قالب واجهة متجر كتب لمنصّة «ناشر»
   مستوحى من طابع قالب Autoas: أقسام داكنة تتبادل مع أقسام رماديّة فاتحة،
   بطاقات مستديرة، عناوين ثقيلة، ولون مميّز واحد.
   ألوان الهويّة متغيّرات يختارها الناشر؛ كلّ ما عداها ألوان محايدة.
   ========================================================================== */

:root {
	/* ألوان الهويّة (قيم تجريبيّة يستبدلها الناشر) */
	--store-primary: #FFB120;
	--store-primary-dark: #E09600;
	--store-accent: #111111;
	--store-bg: #F6F6F7;
	--store-text: #1A1A1A;

	/* ألوان محايدة ثابتة */
	--white: #FFFFFF;
	--muted: #646464;          /* نصّ ثانويّ: 5.4 على --store-bg */
	--line: rgba(0, 0, 0, .1);
	--line-dark: rgba(255, 255, 255, .12);
	--dark: #111111;           /* خلفيّة الأقسام الداكنة */
	--dark-2: #1C1C1C;
	--on-dark: #FFFFFF;
	--on-dark-muted: rgba(255, 255, 255, .72);
	--frame: #EDEDEF;          /* إطار الغلاف */
	--star: #F2A900;           /* النجوم ذهبيّة دائمًا */
	--danger: #B3261E;

	/* ألوان أنواع الكتب (القاعدة 6) */
	--type-print: #DB7056;
	--type-ebook: #5675A3;
	--type-audio: #986AB0;
	--type-edu: #3f8f6b;

	--font: "Tajawal", system-ui, sans-serif;
	--radius-sm: 8px;
	--radius: 10px;
	--radius-lg: 20px;
	--shadow: 0 10px 30px rgba(0, 0, 0, .08);
	--container: 1320px;
	--gutter: 16px;
	--books-per-row: 4;
}

/* خيار: الزوايا الحادّة */
body[data-corners="sharp"] {
	--radius-sm: 0;
	--radius: 0;
	--radius-lg: 0;
}

body[data-books-per-row="3"] { --books-per-row: 3; }
body[data-books-per-row="4"] { --books-per-row: 4; }
body[data-books-per-row="5"] { --books-per-row: 5; }
body[data-books-per-row="6"] { --books-per-row: 6; }

/* --------------------------------------------------------------------------
   الأساس
   -------------------------------------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 150px; }

body {
	margin: 0;
	font-family: var(--font);
	font-size: 15px;
	line-height: 1.7;
	color: var(--store-text);
	background: var(--white);
	overflow-x: clip;
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2, h3, h4, p { margin: 0; }
ul, ol { list-style: none; margin: 0; padding: 0; }

.icon { width: 20px; height: 20px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.icon-fill { fill: currentColor; stroke: none; }

.container {
	width: 100%;
	max-width: var(--container);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.section { padding-block: 72px; }
.section-gray { background: var(--store-bg); }
.section-dark { background: var(--dark); color: var(--on-dark); }

.visually-hidden {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden; clip: rect(0 0 0 0);
	white-space: nowrap;
}

:focus-visible { outline: 3px solid var(--store-primary); outline-offset: 2px; }

/* --------------------------------------------------------------------------
   الأزرار
   -------------------------------------------------------------------------- */

.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 48px;
	padding: 10px 24px;
	border: 1px solid transparent;
	border-radius: var(--radius);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	white-space: nowrap;
	transition: background-color .25s, color .25s, border-color .25s, transform .25s;
}

.btn .icon { width: 18px; height: 18px; transition: transform .25s; }
.btn:hover .icon-arrow { transform: translateX(-4px); }

/* نصّ الزرّ الأساسيّ بلون --store-accent لا بالأبيض (قرار «نور» للتباين) */
.btn-primary { background: var(--store-primary); color: var(--store-accent); }
.btn-primary:hover { background: var(--store-primary-dark); }

.btn-dark { background: var(--dark); color: var(--white); }
.btn-dark:hover { background: #2A2A2A; }

.btn-outline { border-color: currentColor; background: transparent; }
.btn-outline:hover { background: var(--store-text); border-color: var(--store-text); color: var(--white); }
.section-dark .btn-outline:hover, .on-dark .btn-outline:hover { background: var(--white); border-color: var(--white); color: var(--dark); }

.btn-light { background: var(--white); color: var(--dark); }
.btn-light:hover { background: var(--store-primary); }

.btn-sm { min-height: 40px; padding: 8px 16px; font-size: 14px; }
.btn-lg { min-height: 56px; padding: 14px 32px; font-size: 16px; }
.btn-block { width: 100%; }

.btn:disabled, .btn[aria-disabled="true"] {
	background: #E4E4E6;
	color: #5C5C5C;
	border-color: transparent;
	cursor: not-allowed;
}

.icon-btn {
	display: inline-grid;
	place-items: center;
	width: 42px; height: 42px;
	border: 0;
	border-radius: 50%;
	background: var(--white);
	color: var(--store-text);
	box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
	transition: background-color .25s, color .25s;
}
.icon-btn:hover, .icon-btn[aria-pressed="true"] { background: var(--store-primary); color: var(--store-accent); }
.icon-btn .icon { width: 18px; height: 18px; }

.link-arrow {
	display: inline-flex; align-items: center; gap: 8px;
	font-weight: 700;
	border-bottom: 2px solid var(--store-primary);
	padding-bottom: 2px;
}

/* --------------------------------------------------------------------------
   عنوان القسم
   -------------------------------------------------------------------------- */

.section-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: 36px;
}
.section-head.center { flex-direction: column; align-items: center; text-align: center; }

.eyebrow {
	display: inline-flex; align-items: center; gap: 8px;
	margin-bottom: 10px;
	font-size: 14px; font-weight: 700;
	color: var(--muted);
}
.eyebrow::before {
	content: "";
	width: 10px; height: 10px;
	border-radius: 50%;
	background: var(--store-primary);
}
.section-dark .eyebrow, .on-dark .eyebrow, .spot-card .eyebrow, .banner .eyebrow, .mega-card .eyebrow { color: var(--on-dark-muted); }
.banner.highlight .eyebrow { color: inherit; }
.banner.highlight .eyebrow::before { background: currentColor; }

.section-title {
	font-size: clamp(26px, 3.2vw, 40px);
	font-weight: 800;
	line-height: 1.3;
	max-width: 640px;
}

/* --------------------------------------------------------------------------
   الرأس
   -------------------------------------------------------------------------- */

.site-header { background: var(--white); position: sticky; top: 0; z-index: 50; }

.header-main { border-bottom: 1px solid var(--line); }
.header-main .container {
	display: flex;
	align-items: center;
	gap: 32px;
	min-height: 84px;
}

.brand { display: inline-flex; align-items: center; gap: 10px; flex-shrink: 0; }
.brand img { width: 44px; height: 44px; border-radius: var(--radius); }
.brand-name { font-size: 22px; font-weight: 800; }

.header-search {
	flex: 1;
	display: flex;
	align-items: center;
	max-width: 620px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--store-bg);
	overflow: hidden;
}
.header-search input {
	flex: 1; min-width: 0;
	height: 48px;
	padding-inline: 18px;
	border: 0;
	background: transparent;
	outline: none;
}
.header-search input::placeholder { color: var(--muted); }
.header-search button {
	display: grid; place-items: center;
	width: 52px; height: 48px;
	border: 0;
	background: var(--store-primary);
	color: var(--store-accent);
}

.header-actions { display: flex; align-items: center; gap: 22px; margin-inline-start: auto; }
.header-actions a { display: inline-flex; align-items: center; gap: 8px; font-weight: 500; }
.header-actions .icon { width: 22px; height: 22px; }

.cart-link { position: relative; }
.cart-count {
	position: absolute;
	top: -8px; inset-inline-start: 12px;
	min-width: 20px; height: 20px;
	padding-inline: 5px;
	border-radius: 10px;
	background: var(--store-primary);
	color: var(--store-accent);
	font-size: 12px; font-weight: 700;
	line-height: 20px; text-align: center;
}

.menu-toggle { display: none; }

.header-nav .container { display: flex; align-items: center; gap: 28px; min-height: 58px; }

.nav-list { display: flex; align-items: center; gap: 28px; }
.nav-list > li > a, .nav-list > li > button {
	display: inline-flex; align-items: center; gap: 6px;
	padding-block: 18px;
	border: 0; background: none;
	font-weight: 700;
	transition: color .2s;
}
.nav-list > li > a:hover, .nav-list > li > button:hover { color: var(--muted); }
.nav-list .icon { width: 16px; height: 16px; }

.has-mega { position: static; }
.header-nav { position: relative; }
.mega {
	position: absolute;
	inset-inline: 0; top: 100%;
	opacity: 0; visibility: hidden;
	transform: translateY(8px);
	transition: opacity .2s, transform .2s, visibility .2s;
	background: var(--white);
	border-top: 1px solid var(--line);
	box-shadow: var(--shadow);
}
.has-mega:hover .mega, .has-mega:focus-within .mega, .has-mega.open .mega { opacity: 1; visibility: visible; transform: none; }
.mega .container { display: grid; grid-template-columns: 1fr 1fr 1.4fr 1.4fr; gap: 32px; padding-block: 32px; }
.mega h3 { font-size: 16px; font-weight: 800; margin-bottom: 14px; }
.mega-links li + li { margin-top: 10px; }
.mega-links a { color: var(--muted); transition: color .2s; }
.mega-links a:hover { color: var(--store-text); }
.mega-card {
	position: relative;
	display: flex; flex-direction: column; justify-content: flex-end;
	min-height: 200px;
	padding: 22px;
	border-radius: var(--radius-lg);
	overflow: hidden;
	color: var(--on-dark);
}
.mega-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mega-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0, 0, 0, .78), rgba(0, 0, 0, .1)); }
.mega-card > *:not(img) { position: relative; z-index: 1; }
.mega-card strong { font-size: 20px; font-weight: 800; }

.nav-extra { display: flex; align-items: center; gap: 22px; margin-inline-start: auto; }
.sale-tag {
	padding: 6px 14px;
	border-radius: 30px;
	background: var(--store-primary);
	color: var(--store-accent);
	font-size: 13px; font-weight: 700;
}
.header-phone { display: inline-flex; align-items: center; gap: 10px; }
.header-phone .icon-btn { box-shadow: none; background: var(--store-bg); }
.header-phone small { display: block; font-size: 12px; color: var(--muted); line-height: 1.3; }
.header-phone b { font-size: 15px; direction: ltr; unicode-bidi: isolate; }

/* الدرج الجانبيّ للهاتف */
.drawer-backdrop {
	position: fixed; inset: 0;
	background: rgba(0, 0, 0, .5);
	opacity: 0; visibility: hidden;
	transition: opacity .25s, visibility .25s;
	z-index: 90;
}
.drawer {
	position: fixed;
	top: 0; bottom: 0; inset-inline-start: 0;
	width: min(320px, 86vw);
	padding: 20px;
	background: var(--white);
	transform: translateX(100%);
	transition: transform .3s;
	z-index: 100;
	overflow-y: auto;
}
.drawer-open .drawer { transform: none; }
.drawer-open .drawer-backdrop { opacity: 1; visibility: visible; }
.drawer-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.drawer-nav li a { display: block; padding: 12px 0; border-bottom: 1px solid var(--line); font-weight: 700; }
.drawer-nav .sub a { padding-inline-start: 14px; font-weight: 500; color: var(--muted); }
.drawer .header-phone { margin-top: 24px; }

/* --------------------------------------------------------------------------
   شارات نوع الكتاب (دائرة ملوّنة بأيقونة)
   -------------------------------------------------------------------------- */

.type-dot {
	display: inline-grid; place-items: center;
	width: 34px; height: 34px;
	border-radius: 50%;
	color: var(--white);
	box-shadow: 0 2px 6px rgba(0, 0, 0, .18);
}
.type-dot .icon { width: 17px; height: 17px; }
.type-dot[data-type="print"] { background: var(--type-print); }
.type-dot[data-type="ebook"] { background: var(--type-ebook); }
.type-dot[data-type="audio"] { background: var(--type-audio); }
.type-dot[data-type="educational"] { background: var(--type-edu); }

/* --------------------------------------------------------------------------
   التقييم
   -------------------------------------------------------------------------- */

.rating { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--muted); }
.stars { display: inline-flex; gap: 2px; color: var(--star); }
.stars .icon { width: 15px; height: 15px; }
.stars .off { color: #D6D6D9; }
.rating-lg .stars .icon { width: 20px; height: 20px; }
.rating-lg { font-size: 15px; }

/* --------------------------------------------------------------------------
   السعر
   -------------------------------------------------------------------------- */

.price { display: inline-flex; align-items: baseline; gap: 8px; flex-wrap: wrap; font-weight: 800; font-size: 18px; }
.price del { font-size: 14px; font-weight: 500; color: var(--muted); }
.price-lg { font-size: 28px; }
.price-lg del { font-size: 18px; }

/* --------------------------------------------------------------------------
   بطاقة الكتاب
   -------------------------------------------------------------------------- */

.book-grid {
	display: grid;
	grid-template-columns: repeat(var(--books-per-row), minmax(0, 1fr));
	gap: 28px 24px;
}

.book-card { position: relative; display: flex; flex-direction: column; }

.book-media {
	position: relative;
	padding: 22px 22px 26px;
	border-radius: var(--radius-lg);
	background: var(--frame);
	overflow: hidden;
}
.book-media a { display: block; }
.book-media img {
	width: 100%;
	aspect-ratio: 2 / 3;
	object-fit: cover;
	border-radius: 4px;
	box-shadow: 0 12px 24px rgba(0, 0, 0, .18);
	transition: transform .4s;
}
.book-card:hover .book-media img { transform: translateY(-4px) scale(1.02); }

.book-media .type-dot { position: absolute; top: 12px; inset-inline-start: 12px; z-index: 2; }

.book-badges { position: absolute; top: 12px; inset-inline-end: 12px; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; z-index: 2; }
.badge {
	padding: 3px 10px;
	border-radius: 30px;
	font-size: 12px; font-weight: 700;
	line-height: 1.6;
}
.badge-sale { background: var(--store-primary); color: var(--store-accent); }
.badge-new { background: var(--dark); color: var(--white); }

.book-actions {
	position: absolute;
	inset-inline-end: 12px; bottom: 14px;
	display: flex; flex-direction: column; gap: 8px;
	z-index: 2;
	opacity: 0;
	transform: translateX(-10px);
	transition: opacity .25s, transform .25s;
}
.book-card:hover .book-actions, .book-card:focus-within .book-actions { opacity: 1; transform: none; }
@media (hover: none) { .book-actions { opacity: 1; transform: none; } }

.stock-band {
	position: absolute;
	inset-inline: 0; bottom: 0;
	padding: 8px;
	background: rgba(17, 17, 17, .86);
	color: var(--white);
	font-size: 13px; font-weight: 700;
	text-align: center;
	z-index: 1;
}
.book-card.is-out .book-media img { filter: grayscale(.85); opacity: .75; }

.book-body { padding: 16px 4px 0; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.book-title { font-size: 16px; font-weight: 800; line-height: 1.5; }
.book-title a:hover { text-decoration: underline; text-decoration-color: var(--store-primary); text-underline-offset: 4px; }
.book-author { font-size: 14px; color: var(--muted); }
.book-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 8px; }

/* شكل البطاقة: مؤطَّرة */
body[data-card-style="framed"] .book-card { padding: 12px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--white); }
body[data-card-style="framed"] .book-media { background: var(--store-bg); border-radius: calc(var(--radius-lg) - 6px); }
body[data-card-style="framed"] .book-body { padding-inline: 4px; padding-bottom: 4px; }

/* شكل البطاقة: بسيطة */
body[data-card-style="minimal"] .book-media { padding: 0; background: none; overflow: visible; }
body[data-card-style="minimal"] .book-media img { border-radius: var(--radius-sm); box-shadow: 0 6px 16px rgba(0, 0, 0, .14); }
body[data-card-style="minimal"] .stock-band { border-radius: 0 0 var(--radius-sm) var(--radius-sm); }

/* بطاقة كتاب داكنة (قسم «مختارات») */
.spot-card {
	display: grid;
	grid-template-columns: 1fr 120px;
	align-items: center;
	gap: 20px;
	padding: 28px;
	border-radius: var(--radius-lg);
	background: var(--dark);
	color: var(--on-dark);
	overflow: hidden;
	position: relative;
}
.spot-card::before {
	content: "";
	position: absolute;
	width: 220px; height: 220px;
	inset-inline-end: -60px; bottom: -80px;
	border-radius: 50%;
	background: var(--store-primary);
	opacity: .14;
}
.spot-card img { width: 120px; aspect-ratio: 2 / 3; object-fit: cover; border-radius: 4px; box-shadow: 0 14px 28px rgba(0, 0, 0, .45); position: relative; }
.spot-card .book-title { font-size: 20px; }
.spot-card .book-author { color: var(--on-dark-muted); }
.spot-card .price del { color: var(--on-dark-muted); }
.spot-card .btn { margin-top: 16px; }

/* --------------------------------------------------------------------------
   بطاقة التصنيف، المؤلّف، البانر
   -------------------------------------------------------------------------- */

.cat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.cat-card {
	display: flex; align-items: center; gap: 16px;
	padding: 16px;
	border-radius: var(--radius-lg);
	background: var(--white);
	border: 1px solid var(--line);
	transition: border-color .25s, box-shadow .25s;
}
.cat-card:hover { border-color: transparent; box-shadow: var(--shadow); }
.cat-card img { width: 64px; height: 64px; border-radius: var(--radius); object-fit: cover; }
.cat-card h3 { font-size: 16px; font-weight: 800; }
.cat-card span { font-size: 13px; color: var(--muted); }

.author-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.author-card {
	border: 1px solid var(--line);
	padding: 24px 18px;
	border-radius: var(--radius-lg);
	background: var(--white);
	text-align: center;
	transition: box-shadow .25s, transform .25s;
}
.author-card:hover { box-shadow: var(--shadow); transform: translateY(-3px); }
.author-card img { width: 96px; height: 96px; margin: 0 auto 14px; border-radius: 50%; object-fit: cover; }
.author-card h3 { font-size: 16px; font-weight: 800; }
.author-card span { font-size: 13px; color: var(--muted); }

.banner {
	position: relative;
	display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
	gap: 10px;
	min-height: 240px;
	padding: 36px;
	border-radius: var(--radius-lg);
	overflow: hidden;
	color: var(--on-dark);
	background: var(--dark);
}
.banner > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.banner::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to left, rgba(0, 0, 0, .8), rgba(0, 0, 0, .25)); }
.banner > *:not(img) { position: relative; z-index: 1; }
.banner h3 { font-size: 26px; font-weight: 800; line-height: 1.35; max-width: 380px; }
.banner p { color: var(--on-dark-muted); max-width: 380px; }
.banner.highlight { background: var(--store-primary); color: var(--store-accent); }
.banner.highlight::after { display: none; }
.banner.highlight p { color: inherit; opacity: .85; }
.banner-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }

/* --------------------------------------------------------------------------
   شريط الثقة
   -------------------------------------------------------------------------- */

.trust-section { margin-top: 28px; }
.trust-bar {
	display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	background: var(--white);
}
.trust-item { display: flex; align-items: center; gap: 14px; padding: 18px 22px; }
.trust-item + .trust-item { border-inline-start: 1px solid var(--line); }
.trust-item .trust-icon {
	display: grid; place-items: center;
	width: 46px; height: 46px; flex-shrink: 0;
	border-radius: 50%;
	background: var(--dark);
	color: var(--store-primary);
}
.trust-item .icon { width: 22px; height: 22px; }
.trust-item h3 { font-size: 15px; font-weight: 800; line-height: 1.4; }
.trust-item p { font-size: 13px; color: var(--muted); line-height: 1.5; }

/* --------------------------------------------------------------------------
   رأي قارئ
   -------------------------------------------------------------------------- */

.review-card {
	display: flex; flex-direction: column; gap: 14px;
	padding: 26px;
	border-radius: var(--radius-lg);
	background: var(--white);
	border: 1px solid var(--line);
}
.review-card p { color: var(--muted); }
.review-who { display: flex; align-items: center; gap: 12px; margin-top: auto; }
.review-avatar {
	display: grid; place-items: center;
	width: 44px; height: 44px;
	border-radius: 50%;
	background: var(--store-bg);
	font-weight: 800;
}
.review-who b { display: block; font-weight: 800; }
.review-who small { color: var(--muted); }

/* --------------------------------------------------------------------------
   ترقيم الصفحات
   -------------------------------------------------------------------------- */

.pagination { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; }
.pagination a, .pagination span {
	display: grid; place-items: center;
	min-width: 44px; height: 44px;
	padding-inline: 12px;
	border-radius: var(--radius);
	border: 1px solid var(--line);
	font-weight: 700;
	transition: background-color .2s, border-color .2s;
}
.pagination a:hover { border-color: var(--store-text); }
.pagination [aria-current="page"] { background: var(--store-primary); border-color: var(--store-primary); color: var(--store-accent); }
.pagination .gap { border: 0; min-width: 24px; padding: 0; }
.pagination .icon { width: 18px; height: 18px; }

/* --------------------------------------------------------------------------
   التذييل
   -------------------------------------------------------------------------- */

.site-footer { background: var(--dark); color: var(--on-dark); padding-top: 72px; }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.5fr; gap: 40px; padding-bottom: 48px; }
.footer-about p { margin-top: 16px; color: var(--on-dark-muted); max-width: 320px; }
.footer-about .brand img { background: var(--white); }
.social { display: flex; gap: 10px; margin-top: 22px; }
.social a {
	display: grid; place-items: center;
	width: 40px; height: 40px;
	border-radius: 50%;
	border: 1px solid var(--line-dark);
	transition: background-color .2s, color .2s, border-color .2s;
}
.social a:hover { background: var(--store-primary); border-color: var(--store-primary); color: var(--store-accent); }
.social .icon { width: 17px; height: 17px; }
.footer-col h3 { font-size: 18px; font-weight: 800; margin-bottom: 18px; }
.footer-col li + li { margin-top: 10px; }
.footer-col a { color: var(--on-dark-muted); transition: color .2s; }
.footer-col a:hover { color: var(--on-dark); }
.newsletter { display: flex; gap: 8px; margin-bottom: 22px; }
.newsletter input {
	flex: 1; min-width: 0;
	height: 48px;
	padding-inline: 16px;
	border: 1px solid var(--line-dark);
	border-radius: var(--radius);
	background: transparent;
	color: var(--on-dark);
}
.newsletter input::placeholder { color: var(--on-dark-muted); }
.footer-contact li { display: flex; align-items: center; gap: 10px; color: var(--on-dark-muted); }
.footer-contact .icon { width: 18px; height: 18px; color: var(--store-primary); }
.footer-contact bdi { direction: ltr; }
.footer-bottom {
	display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px;
	padding-block: 22px;
	border-top: 1px solid var(--line-dark);
	font-size: 14px;
	color: var(--on-dark-muted);
}

/* --------------------------------------------------------------------------
   الظهور عند التمرير (يضيفه theme.js)
   -------------------------------------------------------------------------- */

.js .reveal { opacity: 0; transform: translateY(18px); transition: opacity .6s, transform .6s; }
.js .reveal.is-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
	.js .reveal { opacity: 1; transform: none; }
}

/* --------------------------------------------------------------------------
   الرئيسيّة: السلايدر وصندوق البحث
   -------------------------------------------------------------------------- */

.hero { position: relative; background: var(--dark); color: var(--on-dark); }
.slider { position: relative; overflow: hidden; }
.slides {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	scroll-behavior: smooth;
}
.slides::-webkit-scrollbar { display: none; }
.slide {
	position: relative;
	flex: 0 0 100%;
	scroll-snap-align: start;
	min-height: 600px;
	display: flex;
	align-items: center;
	padding-block: 80px 170px;
}
.slide > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.slide::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to left, rgba(0, 0, 0, .82) 15%, rgba(0, 0, 0, .35)); }
.slide .container { position: relative; z-index: 1; }
.slide h1, .slide h2 { font-size: clamp(32px, 5vw, 60px); font-weight: 800; line-height: 1.25; max-width: 720px; }
.slide p { max-width: 560px; margin-top: 16px; font-size: 17px; color: var(--on-dark-muted); }
.slide .btn { margin-top: 28px; }
.slider-nav {
	position: absolute;
	inset-inline-end: max(var(--gutter), calc((100% - var(--container)) / 2 + var(--gutter)));
	bottom: 190px;
	display: flex; align-items: center; gap: 10px;
	z-index: 2;
}
.slider-nav { padding: 6px; border-radius: 40px; background: rgba(0, 0, 0, .55); }
.slider-nav .icon-btn { background: rgba(255, 255, 255, .12); color: var(--white); box-shadow: none; }
.slider-nav .icon-btn:hover { background: var(--store-primary); color: var(--store-accent); }
.slider-dots { display: flex; gap: 6px; margin-inline: 6px; }
.slider-dots button { width: 10px; height: 10px; padding: 0; border: 0; border-radius: 10px; background: rgba(255, 255, 255, .35); transition: width .25s, background-color .25s; }
.slider-dots button[aria-current="true"] { width: 28px; background: var(--store-primary); }

.find-box {
	position: relative;
	z-index: 3;
	margin-top: -120px;
	padding: 28px 32px;
	border-radius: var(--radius-lg);
	background: var(--white);
	color: var(--store-text);
	box-shadow: var(--shadow);
}
.find-box h2 { font-size: 22px; font-weight: 800; margin-bottom: 18px; }
/* إن أخفى الناشر السلايدر صار الصندوق أوّل ما في الصفحة */
main > .container:first-child .find-box { margin-top: 32px; }
.find-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; gap: 14px; }
.field, .find-fields select, .find-fields input {
	width: 100%;
	height: 52px;
	padding-inline: 16px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--store-bg);
	outline: none;
}
select.field, .find-fields select {
	appearance: none;
	padding-inline-end: 40px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23646464' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: 18px;
	background-position: left 14px center;
}
.field:focus, .find-fields select:focus, .find-fields input:focus { border-color: var(--store-text); }
.find-fields .btn { height: 52px; }

/* --------------------------------------------------------------------------
   الرئيسيّة: الأقسام
   -------------------------------------------------------------------------- */

.spot-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }

.types-box { display: grid; grid-template-columns: 1.1fr 1fr; gap: 24px; align-items: stretch; }
.types-box .banner { min-height: 460px; justify-content: flex-end; }
.types-info {
	padding: 18px 22px;
	border-radius: var(--radius);
	background: rgba(255, 255, 255, .1);
	backdrop-filter: blur(6px);
}
.types-list { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.type-tile {
	display: flex; flex-direction: column; justify-content: space-between; gap: 22px;
	padding: 26px;
	border-radius: var(--radius-lg);
	background: var(--white);
	transition: box-shadow .25s, transform .25s;
}
.type-tile:hover { box-shadow: var(--shadow); transform: translateY(-3px); }
.type-tile .type-dot { width: 54px; height: 54px; }
.type-tile .type-dot .icon { width: 26px; height: 26px; }
.type-tile h3 { font-size: 19px; font-weight: 800; }
.type-tile p { font-size: 14px; color: var(--muted); }
.type-tile .link-arrow { align-self: flex-start; font-size: 14px; }

.offers-grid { display: grid; grid-template-columns: 1fr 1fr 1.25fr; gap: 24px; }
.offers-grid .banner { min-height: 300px; }
.banner-wide { min-height: 260px; margin-top: 24px; }

.reviews-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.reviews-summary {
	display: flex; flex-direction: column; justify-content: center; gap: 10px;
	padding: 28px;
	border-radius: var(--radius-lg);
	background: var(--dark);
	color: var(--on-dark);
}
.reviews-summary strong { font-size: 56px; font-weight: 800; line-height: 1; }
.reviews-summary .rating { color: var(--on-dark-muted); }

.contact-band {
	display: grid; grid-template-columns: 1.2fr 1fr; gap: 32px; align-items: center;
	padding: 40px;
	border-radius: var(--radius-lg);
	background: var(--store-bg);
}
.contact-items { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.contact-item {
	display: flex; align-items: center; gap: 14px;
	padding: 18px;
	border-radius: var(--radius-lg);
	background: var(--white);
}
.contact-item .trust-icon { display: grid; place-items: center; width: 48px; height: 48px; flex-shrink: 0; border-radius: 50%; background: var(--store-primary); color: var(--store-accent); }
.contact-item small { display: block; color: var(--muted); font-size: 13px; }
.contact-item b { font-size: 16px; }

.recent-row { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px; }
.recent-row .book-media { padding: 12px 12px 14px; }
.recent-row .book-title { font-size: 14px; }
.recent-row .price { font-size: 15px; }

/* --------------------------------------------------------------------------
   رأس الصفحات الداخليّة
   -------------------------------------------------------------------------- */

.page-head { position: relative; padding-block: 56px; background: var(--dark); color: var(--on-dark); overflow: hidden; }
.page-head > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .35; }
.page-head .container { position: relative; }
.page-head h1 { font-size: clamp(28px, 4vw, 46px); font-weight: 800; }
.page-head p { color: var(--on-dark-muted); max-width: 620px; margin-top: 8px; }
.breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 12px; font-size: 14px; color: var(--on-dark-muted); }
.breadcrumb a:hover { color: var(--on-dark); }
.breadcrumb li + li::before { content: "/"; margin-inline-end: 8px; opacity: .6; }
.breadcrumb.on-light { color: var(--muted); }
.breadcrumb.on-light a:hover { color: var(--store-text); }

.chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.chip {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 7px 16px;
	border-radius: 30px;
	border: 1px solid var(--line-dark);
	font-size: 14px; font-weight: 500;
	transition: background-color .2s, color .2s, border-color .2s;
}
.chip:hover, .chip[aria-current="page"] { background: var(--store-primary); border-color: var(--store-primary); color: var(--store-accent); }
.chips.on-light .chip { border-color: var(--line); }

/* --------------------------------------------------------------------------
   صفحة التصنيف
   -------------------------------------------------------------------------- */

.listing { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 32px; align-items: start; }
.filters {
	position: sticky; top: 162px;
	display: flex; flex-direction: column; gap: 14px;
}
.filter-box { padding: 22px; border-radius: var(--radius-lg); background: var(--store-bg); }
.filter-box h3 { font-size: 17px; font-weight: 800; margin-bottom: 14px; }
.check { display: flex; align-items: center; gap: 10px; padding-block: 6px; cursor: pointer; }
.check input { width: 18px; height: 18px; accent-color: var(--store-accent); }
.check .count { margin-inline-start: auto; font-size: 13px; color: var(--muted); }
.price-range { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.price-range .field { height: 44px; background: var(--white); }
.filters-head { display: none; }

.toolbar {
	display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px;
	margin-bottom: 26px;
	padding: 12px 16px;
	border-radius: var(--radius);
	background: var(--store-bg);
}
.toolbar p { color: var(--muted); }
.toolbar .field { width: auto; height: 44px; background-color: var(--white); }
.toolbar-actions { display: flex; align-items: center; gap: 10px; }
.filters-toggle { display: none; }
.listing .pagination { margin-top: 44px; }
.listing .book-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px 18px; }

/* --------------------------------------------------------------------------
   صفحة الكتاب
   -------------------------------------------------------------------------- */

.pdp { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 48px; align-items: start; }
.gallery { display: grid; grid-template-columns: 84px 1fr; gap: 16px; }
.gallery-main {
	display: grid; place-items: center;
	padding: 48px;
	border-radius: var(--radius-lg);
	background: var(--frame);
	position: relative;
}
.gallery-main img { width: min(100%, 340px); aspect-ratio: 2 / 3; object-fit: cover; border-radius: 4px; box-shadow: 0 24px 44px rgba(0, 0, 0, .25); }
.gallery-main .type-dot { position: absolute; top: 18px; inset-inline-start: 18px; width: 42px; height: 42px; }
.gallery-main .book-badges { top: 18px; inset-inline-end: 18px; }
.thumbs { display: flex; flex-direction: column; gap: 12px; }
.thumbs button {
	padding: 8px;
	border: 2px solid transparent;
	border-radius: var(--radius);
	background: var(--frame);
}
.thumbs button[aria-pressed="true"] { border-color: var(--store-text); }
.thumbs img { aspect-ratio: 2 / 3; object-fit: cover; border-radius: 2px; }

.pdp-info { display: flex; flex-direction: column; gap: 16px; }
.pdp-type { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; color: var(--muted); }
.pdp-type .type-dot { width: 30px; height: 30px; }
.pdp-type .type-dot .icon { width: 15px; height: 15px; }
.pdp-info h1 { font-size: clamp(26px, 3.4vw, 40px); font-weight: 800; line-height: 1.3; }
.pdp-author { color: var(--muted); }
.pdp-author a { color: var(--store-text); font-weight: 700; border-bottom: 2px solid var(--store-primary); }
.pdp-lead { color: var(--muted); }
.stock { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: 14px; }
.stock::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: #2E7D32; }
.stock.out::before { background: var(--danger); }
.pdp-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.meta-item { padding: 14px 16px; border-radius: var(--radius); background: var(--store-bg); }
.meta-item small { display: block; font-size: 13px; color: var(--muted); }
.meta-item b { font-size: 15px; }
.pdp-buttons { display: flex; flex-wrap: wrap; gap: 12px; padding-top: 6px; }
.pdp-buttons .btn-primary, .pdp-buttons .btn-dark { flex: 1; min-width: 180px; }
.pdp-perks { display: grid; gap: 10px; padding: 18px; border-radius: var(--radius-lg); border: 1px solid var(--line); }
.pdp-perks li { display: flex; align-items: center; gap: 10px; font-size: 14px; }
.pdp-perks .icon { color: var(--muted); }

.sample-box {
	display: flex; align-items: center; gap: 16px;
	padding: 18px;
	border-radius: var(--radius-lg);
	background: var(--dark);
	color: var(--on-dark);
}
.sample-box p { color: var(--on-dark-muted); font-size: 14px; }
.sample-box b { display: block; font-size: 16px; }
.sample-box .btn { margin-inline-start: auto; }
.wave { display: flex; align-items: center; gap: 3px; height: 34px; }
.wave span { width: 4px; border-radius: 4px; background: var(--store-primary); opacity: .8; }

.tabs { margin-top: 64px; }
.tab-list { display: flex; gap: 6px; border-bottom: 1px solid var(--line); overflow-x: auto; }
.tab-list button {
	padding: 14px 22px;
	border: 0; border-bottom: 3px solid transparent;
	background: none;
	font-weight: 800; color: var(--muted);
	white-space: nowrap;
}
.tab-list button[aria-selected="true"] { color: var(--store-text); border-bottom-color: var(--store-primary); }
.tab-panel { padding-top: 28px; }
.tab-panel[hidden] { display: none; }
.prose { max-width: 820px; color: #3C3C3C; }
.prose p + p { margin-top: 14px; }
.spec-table { width: 100%; max-width: 720px; border-collapse: collapse; }
.spec-table th, .spec-table td { padding: 14px 16px; border-bottom: 1px solid var(--line); text-align: start; }
.spec-table th { width: 220px; font-weight: 700; color: var(--muted); }
.reviews-layout { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 32px; align-items: start; }
.rating-bars li { display: grid; grid-template-columns: 52px 1fr 36px; align-items: center; gap: 10px; font-size: 14px; color: var(--muted); }
.rating-bars li + li { margin-top: 8px; }
.bar { height: 8px; border-radius: 8px; background: #E4E4E6; overflow: hidden; }
.bar span { display: block; height: 100%; background: var(--star); }
.review-list { display: grid; gap: 16px; }
.review-note { margin-top: 18px; padding: 14px; border-radius: var(--radius); background: var(--store-bg); font-size: 14px; color: var(--muted); }

/* --------------------------------------------------------------------------
   صفحة المؤلّف
   -------------------------------------------------------------------------- */

.author-hero { padding-block: 64px; }
.author-hero .container { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 40px; align-items: center; }
.author-hero .avatar { width: 220px; height: 220px; border-radius: 50%; object-fit: cover; border: 6px solid rgba(255, 255, 255, .08); }
.author-hero h1 { font-size: clamp(30px, 4vw, 48px); font-weight: 800; }
.author-hero .bio { color: var(--on-dark-muted); max-width: 720px; margin-top: 12px; }
.author-stats { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 24px; }
.author-stats div { padding: 12px 20px; border-radius: var(--radius); background: rgba(255, 255, 255, .08); }
.author-stats b { display: block; font-size: 22px; font-weight: 800; color: var(--store-primary); }
.author-stats small { color: var(--on-dark-muted); }

/* --------------------------------------------------------------------------
   السلّة
   -------------------------------------------------------------------------- */

.cart-layout { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 32px; align-items: start; }
.cart-table { width: 100%; border-collapse: collapse; }
.cart-table th { padding: 0 12px 14px; font-size: 14px; font-weight: 700; color: var(--muted); text-align: start; border-bottom: 1px solid var(--line); }
.cart-table td { padding: 18px 12px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.cart-book { display: flex; align-items: center; gap: 16px; }
.cart-book img { width: 72px; aspect-ratio: 2 / 3; object-fit: cover; border-radius: 4px; box-shadow: 0 6px 14px rgba(0, 0, 0, .14); }
.cart-book h3 { font-size: 16px; font-weight: 800; }
.cart-book p { font-size: 14px; color: var(--muted); }
.cart-book .pdp-type { font-size: 13px; margin-top: 4px; }
.cart-book .pdp-type .type-dot { width: 22px; height: 22px; }
.cart-book .pdp-type .type-dot .icon { width: 12px; height: 12px; }
.qty { display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.qty button { width: 38px; height: 42px; border: 0; background: var(--store-bg); font-size: 18px; font-weight: 700; }
.qty button:hover { background: var(--store-primary); color: var(--store-accent); }
.qty input { width: 48px; height: 42px; border: 0; text-align: center; font-weight: 700; -moz-appearance: textfield; }
.qty input::-webkit-outer-spin-button, .qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.cart-remove { border: 0; background: none; color: var(--muted); padding: 8px; border-radius: 50%; }
.cart-remove:hover { color: var(--danger); background: var(--store-bg); }
.cart-under { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 14px; margin-top: 22px; }
.summary { padding: 28px; border-radius: var(--radius-lg); background: var(--store-bg); position: sticky; top: 162px; }
.summary h2 { font-size: 20px; font-weight: 800; margin-bottom: 18px; }
.summary-row { display: flex; justify-content: space-between; gap: 12px; padding-block: 10px; }
.summary-row span:first-child { color: var(--muted); }
.summary-total { margin-top: 8px; padding-top: 16px; border-top: 1px solid var(--line); font-size: 20px; font-weight: 800; }
.coupon { display: flex; gap: 8px; margin-block: 18px; }
.coupon .field { background: var(--white); height: 48px; }
.coupon-applied { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 14px; border-radius: var(--radius); background: var(--white); border: 1px dashed var(--muted); font-size: 14px; }
.coupon-applied button { border: 0; background: none; font-weight: 700; text-decoration: underline; }
.summary .btn-block { margin-top: 18px; }
.summary .note { margin-top: 12px; font-size: 13px; color: var(--muted); text-align: center; }
.empty-cart { text-align: center; padding: 48px 24px; border: 1px dashed var(--line); border-radius: var(--radius-lg); }
.empty-cart .trust-icon { display: inline-grid; place-items: center; width: 72px; height: 72px; border-radius: 50%; background: var(--store-bg); margin-bottom: 14px; }
.empty-cart .icon { width: 32px; height: 32px; }
.empty-cart h2 { font-size: 22px; font-weight: 800; }
.empty-cart p { color: var(--muted); margin: 6px 0 18px; }

/* --------------------------------------------------------------------------
   404
   -------------------------------------------------------------------------- */

.notfound { padding-block: 96px; text-align: center; }
.notfound .big { font-size: clamp(110px, 20vw, 220px); font-weight: 800; line-height: 1; color: var(--store-primary); }
.notfound h1 { font-size: clamp(26px, 3.4vw, 38px); font-weight: 800; margin-top: 10px; }
.notfound p { color: var(--on-dark-muted); margin: 10px auto 28px; max-width: 520px; }
.notfound .header-search { margin-inline: auto; background: var(--white); color: var(--store-text); }
.notfound .btns { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 24px; }

/* إخفاء الأقسام التي يطفئها الناشر */
body[data-show-trust-bar="false"] .trust-section,
body[data-show-reviews="false"] .reviews-section { display: none; }

/* --------------------------------------------------------------------------
   صفحة المكوّنات (components.html) فقط
   -------------------------------------------------------------------------- */

.kit-intro { padding-block: 48px; background: var(--store-bg); }
.kit-intro h1 { font-size: clamp(28px, 4vw, 44px); font-weight: 800; }
.kit-intro p { color: var(--muted); max-width: 720px; margin-top: 8px; }
.kit-block { padding-block: 48px; border-bottom: 1px solid var(--line); }
.kit-block > .container > h2 { font-size: 22px; font-weight: 800; margin-bottom: 6px; }
.kit-block > .container > p.kit-note { color: var(--muted); font-size: 14px; margin-bottom: 24px; }
.kit-row { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.kit-row + .kit-row { margin-top: 18px; }
.kit-label { display: block; font-size: 13px; color: var(--muted); margin-top: 8px; }
.kit-dark { padding: 24px; border-radius: var(--radius-lg); background: var(--dark); color: var(--on-dark); }
.kit-types { display: flex; flex-wrap: wrap; gap: 28px; }
.kit-types figure { margin: 0; display: flex; align-items: center; gap: 10px; }
.kit-spot { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }

/* --------------------------------------------------------------------------
   العروض
   -------------------------------------------------------------------------- */

@media (max-width: 1199px) {
	.header-main .container { gap: 20px; }
	.header-actions .label { display: none; }
	.nav-list { gap: 20px; }
	.sale-tag { display: none; }
	.book-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.cat-grid, .author-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.footer-grid { grid-template-columns: 1fr 1fr; }
	.mega .container { grid-template-columns: 1fr 1fr 1.4fr; }
	.mega .mega-card:last-child { display: none; }
	.kit-spot { grid-template-columns: 1fr; }
}

@media (max-width: 991px) {
	.header-nav, .header-phone-wrap { display: none; }
	.menu-toggle { display: inline-grid; box-shadow: none; background: var(--store-bg); }
	.header-main .container { flex-wrap: wrap; min-height: 0; padding-block: 12px; row-gap: 10px; }
	.header-search { order: 3; flex-basis: 100%; max-width: none; }
	.trust-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.trust-item:nth-child(3) { border-inline-start: 0; }
	.trust-item:nth-child(n+3) { border-top: 1px solid var(--line); }
	.section-head { flex-direction: column; align-items: flex-start; }
	.section-head.center { align-items: center; }
}

@media (max-width: 767px) {
	.section { padding-block: 52px; }
	.brand-name { font-size: 19px; }
	.brand img { width: 38px; height: 38px; }
	.header-actions { gap: 14px; }
	.header-actions .hide-sm { display: none; }
	.book-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 14px; }
	.book-media { padding: 14px 14px 18px; }
	.book-title { font-size: 15px; }
	.cat-grid, .author-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
	.cat-card { flex-direction: column; text-align: center; gap: 10px; }
	.banner-pair { grid-template-columns: 1fr; }
	.banner { min-height: 200px; padding: 26px; }
	.banner h3 { font-size: 22px; }
	.spot-card { grid-template-columns: 1fr 92px; padding: 22px; }
	.spot-card img { width: 92px; }
	.footer-grid { grid-template-columns: 1fr; gap: 32px; }
	.site-footer { padding-top: 52px; }
}

/* --------------------------------------------------------------------------
   العروض: الصفحات
   -------------------------------------------------------------------------- */

@media (max-width: 1199px) {
	.spot-row { grid-template-columns: 1fr 1fr; }
	.spot-row > :last-child { display: none; }
	.offers-grid { grid-template-columns: 1fr 1fr; }
	.offers-grid > :last-child { grid-column: 1 / -1; }
	.recent-row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.recent-row > :nth-child(n+5) { display: none; }
	.listing { grid-template-columns: 240px minmax(0, 1fr); gap: 24px; }
	.listing .book-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.pdp { gap: 32px; }
	.cart-layout { grid-template-columns: minmax(0, 1fr) 320px; }
	.reviews-row { grid-template-columns: 1fr 1fr; }
	.reviews-row > :last-child { display: none; }
}

@media (max-width: 991px) {
	.find-fields { grid-template-columns: 1fr 1fr; }
	.find-fields .btn { grid-column: 1 / -1; }
	.types-box { grid-template-columns: 1fr; }
	.types-box .banner { min-height: 340px; }
	.contact-band { grid-template-columns: 1fr; }
	.listing { grid-template-columns: 1fr; }
	.filters {
		position: fixed;
		top: 0; bottom: 0; inset-inline-start: 0;
		width: min(340px, 88vw);
		padding: 20px;
		background: var(--white);
		overflow-y: auto;
		z-index: 100;
		transform: translateX(100%);
		transition: transform .3s;
	}
	.filters-open .filters { transform: none; }
	.filters-open .drawer-backdrop { opacity: 1; visibility: visible; }
	.filters-head { display: flex; align-items: center; justify-content: space-between; }
	.filters-head h2 { font-size: 20px; font-weight: 800; }
	.filters-toggle { display: inline-flex; }
	.pdp { grid-template-columns: 1fr; }
	.reviews-layout { grid-template-columns: 1fr; }
	.author-hero .container { grid-template-columns: 1fr; text-align: center; justify-items: center; }
	.author-hero .bio { margin-inline: auto; }
	.author-stats { justify-content: center; }
	.cart-layout { grid-template-columns: 1fr; }
	.summary { position: static; }
}

@media (max-width: 767px) {
	.slide { display: block; min-height: 0; padding: 0 0 28px; }
	.slide > img { position: static; height: auto; aspect-ratio: 16 / 9; object-position: left center; }
	.slide::after { display: none; }
	.slide .container { padding-top: 22px; }
	.slide p { font-size: 15px; margin-top: 10px; }
	.slide .btn { margin-top: 18px; min-height: 48px; padding: 10px 24px; }
	.slider-nav { top: calc(56.25vw - 56px); bottom: auto; }
	/* في الهاتف يكفي بحث الرأس، فيُطوى صندوق «ابحث عن كتابك» ليصل الزائر إلى الكتب أسرع */
	.find-box { display: none; }
	main > .container:first-child .find-box { display: block; margin-top: 16px; padding: 16px; box-shadow: none; border: 1px solid var(--line); }
	.find-box h2 { font-size: 17px; margin-bottom: 10px; }
	.find-fields { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
	.find-fields select { grid-column: span 3; }
	.find-fields input { grid-column: span 4; }
	.find-fields .btn { grid-column: span 2; padding-inline: 10px; }
	.find-fields select, .find-fields input, .find-fields .btn { height: 46px; }
	.slide > img { aspect-ratio: 2 / 1; }
	.slider-nav { top: calc(50vw - 56px); }
	.spot-row > :last-child { display: grid; }
	.types-list { grid-template-columns: 1fr 1fr; gap: 12px; }
	.type-tile { padding: 18px; gap: 14px; }
	.type-tile p { display: none; }
	.offers-grid { grid-template-columns: 1fr; }
	.reviews-row { grid-template-columns: 1fr; }
	.reviews-row > :last-child { display: flex; }
	.contact-band { padding: 24px 18px; }
	.contact-items { grid-template-columns: 1fr; }
	.recent-row { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
	.recent-row > :nth-child(n+4) { display: none; }
	.page-head { padding-block: 40px; }
	.listing .book-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.gallery { grid-template-columns: 1fr; }
	.thumbs { flex-direction: row; order: 2; }
	.thumbs button { width: 72px; }
	.gallery-main { padding: 32px; }
	.gallery-main img { width: min(100%, 240px); }
	.pdp-meta { grid-template-columns: 1fr 1fr; }
	.sample-box { flex-wrap: wrap; }
	.sample-box .btn { margin-inline-start: 0; width: 100%; }
	.tabs { margin-top: 44px; }
	.spec-table th { width: 42%; }
	.author-hero .avatar { width: 160px; height: 160px; }
	.cart-table thead { display: none; }
	.cart-table, .cart-table tbody, .cart-table tr, .cart-table td { display: block; width: 100%; }
	.cart-table tr { position: relative; padding-block: 16px; border-bottom: 1px solid var(--line); }
	.cart-table td { padding: 4px 0; border: 0; }
	.cart-table td[data-label] { display: flex; justify-content: space-between; align-items: center; padding-inline-start: 88px; }
	.cart-table td[data-label]::before { content: attr(data-label); color: var(--muted); font-size: 14px; }
	.cart-table .cell-remove { position: absolute; top: 12px; inset-inline-end: 0; width: auto; }
	.cart-book { padding-inline-end: 40px; }
	.notfound { padding-block: 64px; }
}

/* --------------------------------------------------------------------------
   الأسئلة الشائعة (منطقة faq، ميزة المنصّة)
   -------------------------------------------------------------------------- */
.faq-wrap { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px; align-items: start; }
.faq-intro { position: sticky; top: 110px; display: grid; justify-items: start; gap: 14px; }
.faq-intro p { color: var(--muted); max-width: 46ch; }
.faq-list { display: grid; gap: 16px; }
.faq-item { background: var(--store-bg); border-radius: var(--radius); overflow: hidden; }
.faq-item summary { list-style: none; position: relative; display: flex; gap: 8px; padding: 20px 20px 20px 58px; cursor: pointer; font-size: 17px; font-weight: 700; line-height: 1.45; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-n { flex: none; color: var(--store-text); font-variant-numeric: tabular-nums; }
.faq-sign { position: absolute; inset-inline-end: 18px; top: 50%; width: 26px; height: 26px; margin-top: -13px; border-radius: 50%; background: var(--dark); }
.faq-sign::before, .faq-sign::after { content: ""; position: absolute; top: 12px; inset-inline: 7px; height: 2px; background: var(--white); transition: transform .2s; }
.faq-sign::after { transform: rotate(90deg); }
.faq-item[open] .faq-sign { background: var(--store-primary); }
.faq-item[open] .faq-sign::before, .faq-item[open] .faq-sign::after { background: var(--store-accent); }
.faq-item[open] .faq-sign::after { transform: rotate(0); }
.faq-item p { margin: 0; padding: 18px 20px 20px; border-top: 1px solid var(--line); color: var(--muted); }
@media (max-width: 991px) {
	.faq-wrap { grid-template-columns: minmax(0, 1fr); gap: 26px; }
	.faq-intro { position: static; }
}
@media (max-width: 767px) {
	.faq-item summary { font-size: 15.5px; padding: 16px 16px 16px 52px; }
	.faq-item p { padding: 14px 16px 16px; }
}

/* --------------------------------------------------------------------------
   الإصدار الثاني: زرّ السلّة على البطاقة، والدوّار، والعروض بعدّاد،
   والتبويبات، والمدوّنة، واختيار الصيغة، وعرض القائمة
   -------------------------------------------------------------------------- */

/* زرّ السلّة في صفّ السعر (البند 7): ظاهرٌ دائمًا ومدمج، والمفضّلة والنظرة السريعة تطفوان فوق الغلاف */
.cart-btn {
	display: inline-grid; place-items: center;
	width: 40px; height: 40px; flex-shrink: 0;
	border: 0; border-radius: 50%;
	background: var(--store-primary);
	color: var(--store-accent);
	transition: background-color .2s, transform .2s;
}
.cart-btn:hover { background: var(--store-primary-dark); transform: translateY(-2px); }
.cart-btn .icon { width: 18px; height: 18px; }
.cart-btn:disabled { background: #E4E4E6; color: #8A8A8E; cursor: not-allowed; transform: none; }
.book-foot .price { min-width: 0; }

/* أدوات رأس القسم: سهما الدوّار وزرّ «عرض الكلّ» */
.head-tools { display: flex; align-items: center; gap: 10px; }
.carousel-btn { box-shadow: none; border: 1px solid var(--line); }
.carousel-btn:disabled { opacity: .4; cursor: default; background: var(--white); color: var(--store-text); }
.no-scroll .carousel-btn { display: none; }

/* الدوّار الأفقيّ: يُمرَّر باللمس، وبالسهمين في الحاسوب */
.carousel-track {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - 24px * (var(--books-per-row) - 1)) / var(--books-per-row));
	gap: 24px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	overscroll-behavior-x: contain;
	align-items: start;
}
.carousel-track::-webkit-scrollbar { display: none; }
.carousel-track > * { scroll-snap-align: start; }

/* تبويبات صفّ الكتب (القاعدة 16): مصادر يختارها الناشر، والشريط يختفي إن بقي مصدرٌ واحد */
.section-head.has-tabs { flex-wrap: wrap; }
.row-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-inline-start: auto; }
.row-tab {
	min-height: 42px;
	padding: 8px 18px;
	border: 1px solid var(--line);
	border-radius: 30px;
	background: var(--white);
	font-size: 14px; font-weight: 700;
	transition: background-color .2s, color .2s, border-color .2s;
}
.row-tab:hover { border-color: var(--store-text); }
.row-tab[aria-selected="true"] { background: var(--dark); border-color: var(--dark); color: var(--white); }
[data-slot="section.tabs"]:not(:has([data-repeat="tab"] ~ [role="tab"])) { display: none; }
.is-switching { animation: midad-tab .35s ease; }
@keyframes midad-tab { from { opacity: .35; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* سطر بعد عنوان القسم */
.section-sub { margin-top: 8px; color: var(--muted); max-width: 560px; }
.section-dark .section-sub { color: var(--on-dark-muted); }

/* العروض محدودة المدّة: قسمٌ داكن بعدّادٍ واحد (offer.ends_at) */
.deal-head { align-items: center; }
.countdown { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.countdown[hidden] { display: none; }
.cd-label { display: inline-flex; align-items: center; gap: 8px; margin-inline-end: 4px; font-weight: 700; color: var(--on-dark-muted); }
.cd-label .icon { color: var(--store-primary); }
.cd-unit {
	display: grid; place-items: center;
	min-width: 70px;
	padding: 10px 8px;
	border-radius: var(--radius);
	background: var(--dark-2);
	border: 1px solid var(--line-dark);
}
.cd-unit b { font-size: 26px; font-weight: 800; line-height: 1.15; color: var(--store-primary); font-variant-numeric: tabular-nums; }
.cd-unit small { font-size: 12px; color: var(--on-dark-muted); }
.section-dark .book-media { background: var(--dark-2); }
.section-dark .book-author, .section-dark .rating, .section-dark .price del { color: var(--on-dark-muted); }
.section-dark .stars .off { color: #4A4A4E; }
body[data-card-style="framed"] .section-dark .book-card { background: var(--dark-2); border-color: var(--line-dark); }
body[data-card-style="framed"] .section-dark .book-media { background: #2A2A2A; }

/* المدوّنة: بطاقة المقال، وصفحتا المدوّنة والمقال */
.post-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.post-grid.is-blog { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.post-card {
	display: flex; flex-direction: column;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	background: var(--white);
	overflow: hidden;
	transition: box-shadow .25s, transform .25s;
}
.post-card:hover { box-shadow: var(--shadow); transform: translateY(-3px); }
.post-media img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.post-body { display: grid; gap: 8px; padding: 20px 22px 24px; }
.post-date { font-size: 13px; font-weight: 700; color: var(--muted); }
.post-title { font-size: 18px; font-weight: 800; line-height: 1.5; }
.post-title a:hover { text-decoration: underline; text-decoration-color: var(--store-primary); text-underline-offset: 4px; }
.post-excerpt { font-size: 14px; color: var(--muted); }
.article-wrap { max-width: 820px; }
.article-head { margin-top: 18px; display: grid; gap: 8px; }
.article-title { font-size: clamp(28px, 4vw, 44px); font-weight: 800; line-height: 1.3; }
.article-img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; margin-block: 28px; border-radius: var(--radius-lg); }
.article-body { max-width: none; font-size: 17px; line-height: 1.9; }
.article-body h2 { margin-top: 28px; margin-bottom: 8px; font-size: 22px; font-weight: 800; color: var(--store-text); }
.article-body blockquote {
	margin: 24px 0; padding: 18px 22px;
	border-inline-start: 4px solid var(--store-primary);
	border-radius: var(--radius);
	background: var(--store-bg);
	font-size: 19px; font-weight: 700; color: var(--store-text);
}
.article-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 32px; padding-top: 22px; border-top: 1px solid var(--line); }

/* الأسئلة الشائعة على خلفيّةٍ رماديّة */
.section-gray .faq-item { background: var(--white); }

/* صفحة الكتاب: اختيار الصيغة (book.formats)، ويختفي إن لم يكن للعنوان غير صيغةٍ واحدة */
.formats-box { display: grid; gap: 10px; }
.formats-label { font-size: 14px; font-weight: 700; color: var(--muted); }
.formats { display: flex; flex-wrap: wrap; gap: 10px; }
.format-opt {
	display: flex; align-items: center; gap: 10px;
	min-width: 148px;
	padding: 10px 14px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--white);
	transition: border-color .2s;
}
.format-opt:hover { border-color: var(--store-text); }
.format-opt[aria-current="page"] { border-color: var(--store-text); box-shadow: inset 0 0 0 1px var(--store-text); }
.format-opt .type-dot { width: 30px; height: 30px; box-shadow: none; }
.format-opt .type-dot .icon { width: 15px; height: 15px; }
.format-opt b { display: block; font-size: 14px; line-height: 1.4; }
.format-opt small { display: block; font-size: 13px; color: var(--muted); }
[data-slot="book.formats"]:not(:has([data-repeat="format"] ~ [data-preview-copy])) { display: none; }
.pdp-buttons .qty button { width: 44px; height: 56px; display: grid; place-items: center; }
.pdp-buttons .qty input { height: 56px; }
.qty .icon { width: 16px; height: 16px; }

/* صفحة التصنيف: التصفية المختارة، والعرض شبكةً أو قائمة */
.view-switch { display: inline-flex; border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); overflow: hidden; }
.view-switch button { display: grid; place-items: center; width: 44px; height: 44px; border: 0; background: none; color: var(--muted); }
.view-switch button[aria-pressed="true"] { background: var(--dark); color: var(--white); }
.active-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: -8px 0 22px; font-size: 14px; color: var(--muted); }
.active-filters .chip { padding: 5px 12px; border-color: var(--line); background: var(--white); color: var(--store-text); }
.active-filters .chip .icon { width: 14px; height: 14px; }
.clear-filters { font-weight: 700; color: var(--store-text); text-decoration: underline; text-underline-offset: 3px; }
.listing .book-grid.is-list { grid-template-columns: minmax(0, 1fr); gap: 14px; }
.book-grid.is-list .book-card { flex-direction: row; align-items: center; gap: 20px; padding: 12px; border: 1px solid var(--line); border-radius: var(--radius-lg); }
.book-grid.is-list .book-media { width: 140px; flex-shrink: 0; padding: 12px; }
.book-grid.is-list .book-body { padding: 0; }
.book-grid.is-list .book-foot { justify-content: flex-start; gap: 18px; margin-top: 6px; }

/* العروض: الدوّار والتبويبات والمدوّنة والأشرطة المتمرّرة في الهاتف */
/* الجهاز اللوحيّ: صفوفٌ متوازنة بلا بطاقةٍ يتيمة في آخرها */
@media (min-width: 768px) and (max-width: 1199px) {
	.book-grid:has(> :nth-child(4):last-child), .author-grid:has(> :nth-child(4):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px 16px; }
	.cat-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
}
@media (min-width: 768px) and (max-width: 991px) {
	.cat-card { flex-direction: column; text-align: center; gap: 10px; }
	.author-card { padding: 18px 10px; }
	.author-card img { width: 80px; height: 80px; }
}
@media (max-width: 1199px) {
	.carousel-track { grid-auto-columns: calc((100% - 48px) / 3); }
	.trust-item { padding: 16px; }
}
@media (max-width: 991px) {
	.post-grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
	.post-grid::-webkit-scrollbar { display: none; }
	.post-grid > * { flex: 0 0 min(340px, 80%); scroll-snap-align: start; }
	.post-grid.is-blog { display: grid; grid-template-columns: 1fr 1fr; overflow: visible; }
	.row-tabs { margin-inline-start: 0; }
	.deal-head { align-items: flex-start; }
}
@media (max-width: 767px) {
	.section { padding-block: 44px; }
	.section-head { margin-bottom: 24px; gap: 14px; }
	/* أشرطة تُمرَّر بالإصبع بدل الشبكات الطويلة */
	.trust-bar, .cat-grid, .banner-pair, .spot-row, .author-grid {
		display: flex; gap: 12px;
		overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
		margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter);
	}
	.trust-bar::-webkit-scrollbar, .cat-grid::-webkit-scrollbar, .banner-pair::-webkit-scrollbar, .spot-row::-webkit-scrollbar, .author-grid::-webkit-scrollbar { display: none; }
	.trust-bar > *, .cat-grid > *, .banner-pair > *, .spot-row > *, .author-grid > * { scroll-snap-align: start; }
	.trust-section { margin-top: 16px; }
	.trust-bar { border: 0; border-radius: 0; background: none; }
	.trust-item { flex: 0 0 auto; padding: 10px 14px; gap: 10px; border: 1px solid var(--line) !important; border-radius: var(--radius-lg); }
	.trust-item .trust-icon { width: 38px; height: 38px; }
	.trust-item .icon { width: 18px; height: 18px; }
	.trust-item h3 { font-size: 14px; }
	.trust-item p { font-size: 12px; white-space: nowrap; }
	.cat-grid > * { flex: 0 0 auto; }
	.cat-card { flex-direction: row; text-align: start; gap: 10px; padding: 10px 14px 10px 10px; }
	.cat-card img { width: 46px; height: 46px; }
	.cat-card h3 { font-size: 15px; white-space: nowrap; }
	.banner-pair[style] { margin-top: 16px !important; }
	.banner-pair > * { flex: 0 0 86%; }
	.banner-pair .banner { min-height: 170px; }
	.spot-row > * { flex: 0 0 86%; }
	.author-grid > * { flex: 0 0 150px; }
	.author-card { padding: 18px 12px; }
	.author-card img { width: 80px; height: 80px; }
	.carousel-track { grid-auto-columns: calc((100% - 14px) / 2.25); gap: 14px; }
	.head-tools .carousel-btn { display: none; }
	.row-tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; max-width: 100%; }
	.row-tabs::-webkit-scrollbar { display: none; }
	.row-tab { white-space: nowrap; }
	.countdown { gap: 6px; }
	.cd-label { width: 100%; }
	.cd-unit { min-width: 0; flex: 1; padding: 8px 4px; }
	.cd-unit b { font-size: 22px; }
	.post-grid.is-blog { grid-template-columns: 1fr; }
	.article-body { font-size: 16px; }
	.book-grid.is-list .book-media { width: 104px; padding: 8px; }
	.book-grid.is-list .book-card { gap: 12px; padding: 10px; }
	.toolbar-actions { flex-wrap: wrap; }
	.pdp-buttons .qty { order: -1; }
	.pdp-meta > :last-child:nth-child(odd) { grid-column: 1 / -1; }
	.formats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
	.format-opt { min-width: 0; flex-direction: column; text-align: center; gap: 6px; padding: 10px 6px; }
	.banner::after { background: linear-gradient(to left, rgba(0, 0, 0, .86) 35%, rgba(0, 0, 0, .5)); }
	.pdp-buttons .btn-primary, .pdp-buttons .btn-dark { min-width: 140px; }
}

/* نصّ الرأي: أربعة أسطر على الأكثر، والنصّ الكامل في title (الملحق، البند 5) */
[data-slot="review.text"] { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; line-clamp: 4; overflow: hidden; }