/* ==========================================================================
   وحدة الكتب — تنسيق الواجهة العامة (يُحمَّل في صفحات الكتب فقط)
   يعتمد على متغيرات الموقع (--brand, --line, --bg-soft ...) فيتوافق مع الوضع الليلي تلقائيا
   ========================================================================== */

/* ---------- غلاف الكتاب ---------- */
.bk-cover{ display:block; width:100%; height:auto; aspect-ratio:2/3; object-fit:cover; border-radius:6px 12px 12px 6px; box-shadow:0 14px 34px rgba(15,23,32,.22); background:var(--bg-soft); }
.bk-cover-lg{ max-width:340px; margin-inline:auto; }
.bk-cover-ph{ display:flex; align-items:center; justify-content:center; width:100%; aspect-ratio:2/3; border-radius:6px 12px 12px 6px; background:var(--brand-light); color:var(--brand); font-size:56px; }

/* ---------- شارات ---------- */
.bk-badges{ display:flex; flex-wrap:wrap; gap:8px; margin:14px 0; }
.bk-badge{ display:inline-flex; align-items:center; gap:6px; padding:4px 12px; border-radius:999px; background:var(--brand-light); color:var(--brand-dark); font-size:13px; font-weight:700; }

/* ---------- بطاقات المكتبة ---------- */
.bk-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:28px; }
.bk-card{ display:flex; flex-direction:column; background:var(--bg); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); transition:transform .25s ease, box-shadow .25s ease; }
.bk-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow-lg); }
.bk-card-cover{ display:block; padding:22px 40px 8px; background:var(--bg-soft); }
.bk-card-body{ padding:18px 20px 22px; display:flex; flex-direction:column; flex:1; }
.bk-card-body h3{ margin:0 0 4px; font-size:20px; line-height:1.5; }
.bk-card-body h3 a{ color:var(--ink); }
.bk-sub{ margin:0 0 8px; color:var(--brand-dark); font-weight:700; font-size:15px; }
.bk-ex{ margin:0; color:var(--muted); font-size:15px; line-height:1.8; }
.bk-card-body .btn{ margin-top:auto; justify-content:center; }
.bk-card-body .bk-badges{ margin:12px 0 16px; }

/* ---------- هيرو صفحة الكتاب ---------- */
.bk-hero{ padding:48px 0 40px; background:linear-gradient(180deg,var(--bg-soft),var(--bg)); border-bottom:1px solid var(--line); }
.bk-hero-in{ display:grid; grid-template-columns:minmax(220px,340px) 1fr; gap:48px; align-items:center; }
.bk-hero h1{ margin:0 0 6px; font-size:clamp(28px,4.4vw,46px); line-height:1.35; font-family:var(--font-head); }
.bk-hero-sub{ margin:0 0 12px; font-size:clamp(17px,2.2vw,22px); color:var(--brand-dark); font-weight:700; }
.bk-author{ margin:0 0 14px; color:var(--ink-soft); font-weight:700; }
.bk-author i{ color:var(--brand); margin-inline-end:6px; }
.bk-hero-ex{ margin:0 0 6px; color:var(--ink-soft); max-width:60ch; }
.bk-cta{ display:flex; flex-wrap:wrap; gap:12px; margin-top:18px; }

/* ---------- شريط التنقل الفرعي (عن الكتاب / اقرأ / استمع / شاهد) ---------- */
.bk-subnav{ display:flex; flex-wrap:wrap; gap:8px; padding-top:20px; padding-bottom:6px; }
.bk-subnav a{ display:inline-flex; align-items:center; gap:7px; padding:8px 18px; border-radius:999px; border:1px solid var(--line); color:var(--ink-soft); font-weight:700; font-size:15px; background:var(--bg); }
.bk-subnav a:hover{ border-color:var(--brand); color:var(--brand-dark); text-decoration:none; }
.bk-subnav a.active{ background:var(--brand); border-color:var(--brand); color:var(--on-brand,#fff); }

/* ---------- عن الكتاب + بيانات الكتاب ---------- */
.bk-about{ display:grid; grid-template-columns:1fr; gap:32px; }
.bk-about:has(.bk-facts):has(.post-body){ grid-template-columns:minmax(0,1fr) 300px; align-items:start; }
.bk-facts{ margin:0; padding:20px 22px; border:1px solid var(--line); border-radius:var(--radius); background:var(--bg-soft); }
.bk-facts div{ display:flex; justify-content:space-between; gap:16px; padding:9px 0; border-bottom:1px dashed var(--line); }
.bk-facts div:last-child{ border-bottom:0; }
.bk-facts dt{ color:var(--muted); font-size:14px; }
.bk-facts dd{ margin:0; font-weight:700; text-align:end; }

/* ---------- الفهرس ---------- */
.bk-toc-box{ max-width:760px; margin-inline:auto; padding:8px 4px; }
.bk-toc-list, .bk-toc-list ol{ list-style:none; margin:0; padding:0; }
.bk-toc-ch{ margin:0; border-bottom:1px solid var(--line); }
.bk-toc-ch > a{ display:block; padding:12px 6px; font-weight:800; color:var(--ink); }
.bk-toc-list a:hover{ color:var(--brand-dark); text-decoration:none; }
.bk-toc-list a.active{ color:var(--brand); }
.bk-toc-list ol{ padding:0 22px 12px 0; }
.bk-toc-list ol a{ display:block; padding:5px 6px; color:var(--ink-soft); font-weight:600; font-size:.95em; }
.bk-toc-list i.fa-lock{ font-size:.8em; color:var(--muted); }

/* ---------- الشراء والتحميل ---------- */
.bk-buy-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:24px; align-items:start; }
.bk-buy-box{ padding:24px; border:1px solid var(--line); border-radius:var(--radius); background:var(--bg); box-shadow:var(--shadow); }
.bk-buy-box h3{ margin:0 0 14px; font-size:20px; }
.bk-buy-box h3 i{ color:var(--brand); margin-inline-end:6px; }
.bk-price{ margin:0 0 14px; font-size:30px; font-weight:800; color:var(--brand-dark); font-family:var(--font-head); }
.bk-buy-actions{ display:flex; flex-wrap:wrap; gap:10px; }
.bk-note{ margin:14px 0 0; color:var(--muted); font-size:14px; }
.bk-file{ display:flex; align-items:center; gap:14px; padding:12px 0; border-bottom:1px solid var(--line); flex-wrap:wrap; }
.bk-file:last-child{ border-bottom:0; }
.bk-file-ic{ display:inline-flex; align-items:center; justify-content:center; width:46px; height:46px; border-radius:12px; background:var(--brand-light); color:var(--brand); font-size:20px; flex:none; }
.bk-file-info{ flex:1; min-width:140px; display:flex; flex-direction:column; }
.bk-file-info small{ color:var(--muted); font-size:13px; line-height:1.6; }
.bk-file .btn{ padding:9px 18px; font-size:14px; }

/* ---------- قفل المحتوى ---------- */
.bk-lock{ margin:26px 0; padding:30px 22px; text-align:center; border:2px dashed var(--line); border-radius:var(--radius); background:var(--bg-soft); }
.bk-lock > i{ font-size:34px; color:var(--brand); }
.bk-lock h3{ margin:10px 0 6px; }
.bk-lock p{ margin:6px 0; color:var(--ink-soft); }



/* ---------- صفحة القراءة ---------- */
.bk-progress{ position:fixed; top:0; inset-inline:0; height:4px; z-index:1200; background:transparent; }
.bk-progress span{ display:block; height:100%; width:0; background:var(--brand); transition:width .12s linear; }
.bk-reader-wrap{ display:grid; grid-template-columns:290px minmax(0,1fr); gap:44px; padding-top:28px; padding-bottom:50px; align-items:start; }
.bk-toc{ position:sticky; top:84px; max-height:calc(100vh - 110px); overflow:auto; padding:16px 18px; border:1px solid var(--line); border-radius:var(--radius); background:var(--bg-soft); font-size:15px; }
.bk-toc-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; padding-bottom:10px; border-bottom:1px solid var(--line); }
.bk-toc-close{ display:none; border:0; background:none; font-size:20px; color:var(--ink); cursor:pointer; }
.bk-article{ min-width:0; max-width:760px; width:100%; }
.bk-tools{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-bottom:18px; padding:8px 10px; border:1px solid var(--line); border-radius:999px; background:var(--bg-soft); }
.bk-tools button{ border:0; background:var(--bg); color:var(--ink); border-radius:999px; min-width:38px; height:38px; padding:0 12px; cursor:pointer; font-weight:800; border:1px solid var(--line); }
.bk-tools button:hover{ border-color:var(--brand); color:var(--brand-dark); }
.bk-tools-sp{ flex:1; }
.bk-ch-title{ margin:0 0 20px; font-size:clamp(26px,3.6vw,38px); line-height:1.45; font-family:var(--font-head); }
.bk-content{ --bk-fs:1; --bk-lh:2; font-size:calc(19px * var(--bk-fs) * var(--fs-scale,1)); line-height:var(--bk-lh); }
.bk-content.is-serif{ font-family:'Amiri','Scheherazade New','Noto Naskh Arabic','Times New Roman',serif; }
.bk-content img{ max-width:100%; height:auto; border-radius:8px; }
.bk-sub-topics{ line-height:2.2; }
.bk-ch-media{ margin-top:34px; padding-top:24px; border-top:1px solid var(--line); }
.bk-ch-media h4{ margin:0 0 14px; }
.bk-pager{ display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-top:44px; padding-top:24px; border-top:1px solid var(--line); }
.bk-pager .btn{ max-width:100%; }

/* ---------- الجوال ---------- */
@media (max-width:900px){
  .bk-hero-in{ grid-template-columns:1fr; gap:28px; text-align:center; }
  .bk-hero-ex{ margin-inline:auto; }
  .bk-badges, .bk-cta{ justify-content:center; }
  .bk-cover-lg{ max-width:240px; }
  .bk-about:has(.bk-facts):has(.post-body){ grid-template-columns:1fr; }
  .bk-reader-wrap{ grid-template-columns:1fr; gap:0; }
  .bk-toc{ position:fixed; inset:0 0 0 auto; width:min(86vw,340px); max-height:none; border-radius:0; z-index:1300; transform:translateX(105%); transition:transform .28s ease; box-shadow:var(--shadow-lg); background:var(--bg); }
  html[dir="rtl"] .bk-toc{ inset:0 auto 0 0; transform:translateX(-105%); }
  .bk-toc.is-open, html[dir="rtl"] .bk-toc.is-open{ transform:none; }
  .bk-toc-close{ display:block; }
  .bk-pager .btn{ flex:1; justify-content:center; font-size:14px; }
}

/* ---------- بطاقات الفصول في صفحة الكتاب ---------- */
.bk-chcards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr)); gap:22px; align-items:start; }
.bk-chcard{ background:var(--bg); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden; }
.bk-chcard-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 18px; background:var(--brand-light); border-bottom:1px solid var(--line); }
.bk-chcard-head h3{ margin:0; font-size:19px; line-height:1.5; flex:1; min-width:0; }
.bk-chcard-head h3 a{ color:var(--ink); }
.bk-chcard-head h3 a:hover{ color:var(--brand-dark); text-decoration:none; }
.bk-chcard-all{ flex:none; padding:7px 16px; font-size:14px; white-space:nowrap; }
.bk-lines{ list-style:none; margin:0; padding:0; }
.bk-line{ display:flex; align-items:center; gap:12px; padding:11px 18px; border-bottom:1px solid var(--line); }
.bk-line:last-child{ border-bottom:0; }
.bk-line:hover{ background:var(--bg-soft); }
.bk-line-t{ flex:1; min-width:0; color:var(--ink); font-weight:700; line-height:1.7; }
.bk-line-t:hover{ color:var(--brand-dark); text-decoration:none; }
.bk-line-t i{ color:var(--muted); font-size:.85em; }
.bk-line-acts{ display:flex; align-items:center; gap:6px; flex:none; }
.bk-act{ display:inline-flex; align-items:center; gap:5px; padding:5px 11px; border-radius:999px; font-size:13px; font-weight:800; border:1px solid var(--line); background:var(--bg); color:var(--ink-soft); white-space:nowrap; }
.bk-act:hover{ text-decoration:none; border-color:var(--brand); color:var(--brand-dark); }
.bk-act-read{ background:var(--brand); border-color:var(--brand); color:var(--on-brand,#fff); }
.bk-act-read:hover{ color:var(--on-brand,#fff); filter:brightness(1.08); }
.bk-act-watch i{ color:#DC2626; }
.bk-act-listen i{ color:var(--brand); }
.bk-topics-h{ margin:36px 0 10px; font-size:20px; }
.bk-lines-full{ border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
@media (max-width:560px){
  .bk-chcard-head{ flex-wrap:wrap; }
  .bk-line{ flex-wrap:wrap; }
  .bk-line-t{ flex:1 1 100%; }
  .bk-line-acts{ flex-wrap:wrap; }
}

/* ==========================================================================
   نافذة الفيديو المنبثقة
   ========================================================================== */
html.bk-noscroll{ overflow:hidden; }
.bk-modal{ position:fixed; inset:0; z-index:1600; display:flex; align-items:center; justify-content:center; padding:20px; }
.bk-modal[hidden]{ display:none; }
.bk-modal-back{ position:absolute; inset:0; background:rgba(8,10,16,.78); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); animation:bkFade .18s ease; }
.bk-modal-box{ position:relative; width:min(960px,100%); max-height:100%; overflow:auto; border-radius:18px; background:var(--bg); box-shadow:0 30px 80px rgba(0,0,0,.5); outline:0; animation:bkPop .22s cubic-bezier(.2,.9,.3,1.2); }
.bk-modal-stage{ position:relative; aspect-ratio:16/9; background:#000; border-radius:18px 18px 0 0; overflow:hidden; }
.bk-modal-stage iframe, .bk-modal-stage video{ position:absolute; inset:0; width:100%; height:100%; border:0; background:#000; }
.bk-modal-x{ position:absolute; top:10px; inset-inline-start:10px; z-index:3; width:40px; height:40px; border:0; border-radius:50%; background:rgba(0,0,0,.6); color:#fff; font-size:18px; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.bk-modal-x:hover{ background:rgba(0,0,0,.85); }
.bk-modal-info{ padding:14px 20px 18px; display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; }
.bk-modal-title{ margin:0; font-size:18px; line-height:1.6; flex:1 1 100%; }
.bk-modal-list{ display:flex; flex-wrap:wrap; gap:8px; flex:1 1 auto; }
.bk-modal-pick{ border:1px solid var(--line); background:var(--bg-soft); color:var(--ink); border-radius:999px; padding:6px 14px; font-size:14px; font-weight:700; cursor:pointer; }
.bk-modal-pick.is-on{ background:var(--brand); border-color:var(--brand); color:var(--on-brand,#fff); }
.bk-modal-yt{ margin-inline-start:auto; font-size:14px; font-weight:700; color:var(--muted); }
.bk-modal-yt i{ color:#DC2626; }
@keyframes bkFade{ from{ opacity:0; } to{ opacity:1; } }
@keyframes bkPop{ from{ opacity:0; transform:translateY(14px) scale(.97); } to{ opacity:1; transform:none; } }

/* ==========================================================================
   شريط الصوت السفلي
   ========================================================================== */
html.bk-has-bar body{ padding-bottom:var(--bk-bar-h,0px); }
html.bk-has-bar .scroll-top-btn{ bottom:calc(var(--bk-bar-h,0px) + 16px) !important; }
.bk-bar{ position:fixed; inset-inline:0; bottom:0; z-index:1400; background:color-mix(in srgb, var(--bg) 92%, transparent); backdrop-filter:blur(14px) saturate(1.4); -webkit-backdrop-filter:blur(14px) saturate(1.4); border-top:1px solid var(--line); box-shadow:0 -10px 34px rgba(15,23,32,.16); padding-bottom:env(safe-area-inset-bottom,0px); animation:bkUp .25s ease; }
.bk-bar[hidden]{ display:none; }
@keyframes bkUp{ from{ transform:translateY(100%); } to{ transform:none; } }
.bk-bar-in{ max-width:1280px; margin:0 auto; padding:10px 18px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) auto; align-items:center; gap:18px; }
.bk-bar-info{ display:flex; align-items:center; gap:12px; min-width:0; }
.bk-bar-cover{ width:48px; height:64px; object-fit:cover; border-radius:4px 8px 8px 4px; box-shadow:0 4px 12px rgba(0,0,0,.25); flex:none; }
.bk-bar-txt{ display:flex; flex-direction:column; min-width:0; }
.bk-bar-txt strong{ font-size:15px; line-height:1.6; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bk-bar-txt small{ color:var(--muted); font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bk-bar.is-error .bk-bar-txt strong{ color:#DC2626; white-space:normal; }
.bk-bar-main{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.bk-bar-ctrls{ display:flex; align-items:center; justify-content:center; gap:6px; direction:ltr; } /* أزرار التشغيل تبقى بترتيب المشغلات المعتاد في كل اللغات */
.bk-bar button, .bk-bar-dl{ font-family:inherit; }
.bk-bar-ctrls button, .bk-bar-tools button{ position:relative; border:0; background:transparent; color:var(--ink); width:38px; height:38px; border-radius:50%; cursor:pointer; font-size:17px; display:inline-flex; align-items:center; justify-content:center; }
.bk-bar-ctrls button:hover, .bk-bar-tools button:hover{ background:var(--bg-soft); }
.bk-bar-ctrls button:disabled{ opacity:.3; cursor:default; }
.bk-bar-ctrls button b{ position:absolute; font-size:8.5px; font-weight:800; top:50%; left:50%; transform:translate(-50%,-46%); pointer-events:none; }
.bk-bar svg{ display:block; pointer-events:none; }
.bk-bar-ctrls svg.mir{ transform:scaleX(-1); }
.bk-bar-play{ width:48px !important; height:48px !important; background:var(--brand) !important; color:var(--on-brand,#fff) !important; font-size:18px !important; box-shadow:0 6px 16px rgba(var(--brand-rgb),.4); }
.bk-bar-play:hover{ filter:brightness(1.1); }
.bk-bar-seek{ display:flex; align-items:center; gap:10px; font-size:12px; color:var(--muted); font-variant-numeric:tabular-nums; direction:ltr; }
.bk-bar-seek span{ min-width:38px; text-align:center; }
.bk-bar input[type=range]{ -webkit-appearance:none; appearance:none; height:6px; border-radius:999px; outline:0; cursor:pointer; flex:1; margin:0; }
.bk-bar-seek input[type=range]{ background:linear-gradient(to right, var(--brand) var(--p,0%), var(--line) var(--p,0%)); }
.bk-bar input[type=range]::-webkit-slider-thumb{ -webkit-appearance:none; width:14px; height:14px; border-radius:50%; background:var(--brand); border:2px solid var(--bg); box-shadow:0 1px 4px rgba(0,0,0,.35); }
.bk-bar input[type=range]::-moz-range-thumb{ width:12px; height:12px; border-radius:50%; background:var(--brand); border:2px solid var(--bg); }
.bk-bar-tools{ display:flex; align-items:center; gap:4px; }
.bk-bar-tools [data-speed]{ width:auto; min-width:44px; padding:0 8px; border-radius:999px; font-size:13px; font-weight:800; font-variant-numeric:tabular-nums; border:1px solid var(--line); background:var(--bg-soft); }
.bk-bar-tools [data-sleep] b{ font-size:10px; font-weight:800; margin-inline-start:2px; }
.bk-bar-tools [data-sleep].is-on{ color:var(--brand-dark); background:var(--brand-light); width:auto; padding:0 10px; }
.bk-bar-vol{ display:inline-flex; align-items:center; gap:2px; }
.bk-bar-vol input[type=range]{ width:78px; flex:none; background:var(--line); }
.bk-bar-dl{ display:inline-flex; align-items:center; gap:7px; margin-inline:6px; padding:8px 16px; border-radius:999px; background:var(--brand); color:var(--on-brand,#fff); font-size:14px; font-weight:800; white-space:nowrap; }
.bk-bar-dl:hover{ text-decoration:none; filter:brightness(1.1); color:var(--on-brand,#fff); }
.bk-bar-queue{ max-width:1280px; margin:0 auto; max-height:min(40vh,320px); overflow:auto; padding:8px 18px 0; border-bottom:1px solid var(--line); }
.bk-bar-queue[hidden]{ display:none; }
.bk-bar-q{ display:flex; align-items:center; gap:12px; width:100%; border:0; background:transparent; color:var(--ink); padding:9px 10px; border-radius:10px; cursor:pointer; font:inherit; text-align:start; }
.bk-bar-q:hover{ background:var(--bg-soft); }
.bk-bar-q.is-on{ background:var(--brand-light); color:var(--brand-dark); font-weight:800; }
.bk-bar-q .n{ width:24px; text-align:center; color:var(--muted); font-size:13px; }
.bk-bar-q .t{ flex:1; }
.bk-bar-q .d{ color:var(--muted); font-size:12px; direction:ltr; }

@media (max-width:900px){
  .bk-bar-in{ grid-template-columns:1fr auto; grid-template-areas:"info tools" "main main"; gap:6px 10px; padding:8px 12px 10px; }
  .bk-bar-info{ grid-area:info; }
  .bk-bar-tools{ grid-area:tools; }
  .bk-bar-main{ grid-area:main; }
  .bk-bar-vol, .bk-bar-dl span{ display:none; }
  .bk-bar-dl{ padding:0; width:38px; height:38px; justify-content:center; margin:0; font-size:16px; }
  .bk-bar-cover{ width:36px; height:48px; }
  .bk-bar-tools [data-speed]{ min-width:40px; }
}
@media (max-width:420px){
  .bk-bar-tools [data-sleep]{ display:none; }
  .bk-bar-ctrls{ gap:2px; }
}
@media (prefers-reduced-motion:reduce){
  .bk-bar, .bk-modal-box, .bk-modal-back{ animation:none; }
}

/* صف أزرار شاهد/استمع تحت عنوان الموضوع */
.bk-reader-acts{ display:flex; flex-wrap:wrap; gap:8px; margin:-6px 0 24px; }
.bk-reader-acts .bk-act{ padding:7px 16px; font-size:14px; }