/* =======================================================
   Doafeer Brand – Icon Grid + Generic Grid + Ratios + Chips + Badges
   ======================================================= */

/* متغيرات (مع fallback) ومنسجمة مع theme.json */
:root{
  --s-2: 12px;
  --s-3: 16px;
  --border: #e2e8f0;
  --brand-lime: var(--wp--preset--color--doaf-secondary, #68a00b);
  --brand-primary: var(--wp--preset--color--doaf-primary, #1e374e);
  --chip-bg: #f8fafc;
  --chip-text: #223;
  --chip-border: #e2e8f0;
  --chip-bg-hover: #eef2f7;
  --chip-border-hover: #cbd5e1;

  /* فترة نبضة لمعان الشعار (يمكن تعديلها 8s–10s) */
  --doaf-logo-shine-period: 9s;

  /* نصوص محتوى المقال ثابتة اللون للقراءة في الوضعين */
  --doaf-content-ink:#0f172a;

  /* لون نص زر الفيديو المُفعّل */
  --doaf-active-ink:#0f172a;
}

:root[data-theme="dark"]{
  --border: #203040;
  --chip-bg: #10161d;
  --chip-text: #e6edf3;
  --chip-border: #233445;
  --chip-bg-hover: #0f1a22;
  --chip-border-hover: #32506b;
}

/* لون أيقونة الهلال */
.doaf-toggle .doaf-icon--moon { display:block; width:22px; height:22px; color: var(--brand-primary); }
:root[data-theme="dark"] .doaf-toggle .doaf-icon--moon { color:#8ab4ff; }

/* لون أيقونة القائمة (4 شرطات) */
.doaf-nav__toggle .doaf-icon--menu { display:block; width:22px; height:22px; color: var(--brand-primary); }
:root[data-theme="dark"] .doaf-nav__toggle .doaf-icon--menu { color:#8ab4ff; }

 
/* إخفاء حقل البحث في هيدر الموقع */
.doaf-header__actions .doaf-search{ display:none !important; }
 
/* شاشة قارئ */
.screen-reader-text{
  position:absolute !important; height:1px; width:1px; overflow:hidden; clip:rect(1px,1px,1px,1px);
  white-space:nowrap; border:0; padding:0; margin:-1px;
}

/* =======================================================
   Generic Grid (fallback) – تُستخدم في قوائم المقالات/الأرشيف
   ======================================================= */
.df-grid{ display:grid; gap: var(--s-3,16px); }
.df-grid-cols-1{ grid-template-columns: repeat(1,1fr); }
.df-grid-cols-2{ grid-template-columns: repeat(2,1fr); }
.df-grid-cols-3{ grid-template-columns: repeat(3,1fr); }
.df-grid-cols-4{ grid-template-columns: repeat(4,1fr); }
.df-grid-cols-5{ grid-template-columns: repeat(5,1fr); }
.df-grid-cols-6{ grid-template-columns: repeat(6,1fr); }

@media (max-width: 980px){
  .df-grid-cols-6,.df-grid-cols-5,.df-grid-cols-4{ grid-template-columns: repeat(3,1fr); }
  .df-grid-cols-3{ grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 700px){
  .df-grid-cols-6,.df-grid-cols-5,.df-grid-cols-4,.df-grid-cols-3{ grid-template-columns: repeat(3,1fr); }
}
@media (max-width: 560px){
  .df-grid-cols-6,.df-grid-cols-5,.df-grid-cols-4,.df-grid-cols-3,.df-grid-cols-2{ grid-template-columns: repeat(2, 1fr); }
}

/* بطاقة عامة (fallback ناعم لو لم يوجد doaf-home.css) */
.df-card{
  background: transparent;
  border-radius: 12px;
}
.df-card__img-wrap{ position: relative; }

/* عنصر الصورة العام لبطاقات المقالات (خارج Icon Grid) */
.df-card__img{
  display:block; width:100%;
  background-color:#fff; background-size:cover; background-position:50% 50%; background-repeat:no-repeat;
  border:1px solid var(--border);
  border-radius:12px;
  transition: transform .15s ease, box-shadow .15s ease;
}
.df-card__img:hover{ transform: translateY(-2px); }

/* عنوان البطاقة العام */
.df-card__title{
  display:block;
  margin-top:8px;
  font-weight:700;
  line-height:1.4;
  text-decoration:none;
  color: inherit;
}

/* =======================================================
   Aspect Ratios لبطاقات المقالات (خارج Icon Grid)
   ======================================================= */
.df-ar-1x1{ position:relative; padding-top:100%; }
.df-ar-5x4{ position:relative; padding-top:80%; }
.df-ar-4x5{ position:relative; padding-top:125%; }

.df-ar-1x1,
.df-ar-5x4,
.df-ar-4x5{
  /* تحويل العنصر إلى خلفية مغطية داخل نفس العنصر */
}
.df-ar-1x1::before,
.df-ar-5x4::before,
.df-ar-4x5::before{
  content:""; display:block; position:absolute; inset:0;
  /* الخلفية مطبّقة مباشرة على العنصر نفسه عبر style="background-image:..." */
}

/* =======================================================
   Icon Grid mode (ثابت المقاسات + 6 أعمدة دِسك توب / 2 موبايل)
   ======================================================= */
.df-grid-icons{
  display: grid !important;
  gap: var(--s-3, 16px);
  grid-template-columns: repeat(6, 1fr);
}
@media (max-width: 1200px){ .df-grid-icons{ grid-template-columns: repeat(5, 1fr); } }
@media (max-width: 980px) { .df-grid-icons{ grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 700px) { .df-grid-icons{ grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .df-grid-icons{ grid-template-columns: repeat(2, 1fr); } }

/* البطاقة داخل Icon Grid */
.df-grid-icons .df-card{
  text-align: center;
  padding: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}

/* الغلاف الحاوي للصورة */
.df-grid-icons .df-card__img-wrap{ display:block; position:relative; }

/* الصورة داخل البطاقة: افتراضي = أيقونة صفوف 140x140 */
.df-grid-icons .df-card__img{
  display: block;
  width: 140px;
  height: 140px;
  border-radius: 14px;
  margin-inline: auto;
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  border: 1px solid var(--border, #e2e8f0);
  border-bottom: 0;
  transition: transform .15s ease, box-shadow .15s ease;
}

/* كسر أي نسب بُعديّة قادمة من df-ar-* داخل وضع الأيقونات */
.df-grid-icons .df-card__img[class*="df-ar-"]{
  aspect-ratio: auto !important;
  padding-top: 0 !important;
  height: 140px !important;
}

/* === الأنماط الأربعة === */
/* أيقونة رئيسية: 150x120 */
.df-grid-icons .df-card__img.df-main{
  width: 150px;
  height: 120px;
  border-radius: 12px;
}

/* أيقونة صفوف: 140x140 */
.df-grid-icons .df-card__img.df-term{
  width: 140px;
  height: 140px;
  border-radius: 14px;
}

/* أيقونة غلاف: 140x170 */
.df-grid-icons .df-card__img.df-cover{
  width: 140px;
  height: 170px;
  border-radius: 12px;
}

/* أيقونة فرعية: 150x130 */
.df-grid-icons .df-card__img.df-sub{
  width: 150px;
  height: 130px;
  border-radius: 12px;
}

/* توافق خلفي: "بلاطة" = 150x120 */
.df-grid-icons .df-card__img.df-tile{
  width: 150px;
  height: 120px;
  border-radius: 12px;
}

/* تحسين التفاعل داخل Icon Grid */
.df-grid-icons .df-card__img:hover{
  transform: translateY(-2px);
}
.df-grid-icons .df-card__img:focus-visible{
  outline: 2px solid color-mix(in srgb, var(--brand-lime) 55%, transparent);
  outline-offset: 2px;
}

/* اسم التصنيف/العنصر أسفل الصورة — التفاف + قصّ لسطرين */
.df-grid-icons .df-card__title{
  margin-top: 10px;
  font-weight: 700;
  line-height: 1.4;
  text-decoration: none;
  max-width: 95%;
  margin-inline: auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* =======================================================
   Badges – شارات أعلى الصورة (تُستخدم في term-grid)
   ======================================================= */
.df-badge{
  position:absolute; top:6px; inset-inline-end:6px;
  display:inline-block;
  padding:2px 8px;
  border-radius:999px;
  color:#fff;
  font-size:.75rem;
  line-height:1.6;
  box-shadow:0 1px 2px rgba(0,0,0,.12);
  background: var(--brand-lime);
}

/* =======================================================
   شرائح الأبناء داخل بطاقة التصنيف (Chips)
   ======================================================= */
.df-grid-icons .df-card__children{
  margin-top: var(--s-2, 12px);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 8px;
  max-width: 100%;
}

.df-grid-icons .df-chip{
  display: inline-block;
  font-size: 0.875rem;
  line-height: 1.8;
  padding-block: 2px;
  padding-inline: 10px;
  border-radius: 999px;
  background: var(--chip-bg);
  color: var(--chip-text);
  border: 1px solid var(--chip-border);
  text-decoration: none;
  white-space: nowrap;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: background-color .15s ease, border-color .15s ease, transform .15s ease;
}
.df-grid-icons .df-chip:hover{
  background: var(--chip-bg-hover);
  border-color: var(--chip-border-hover);
  transform: translateY(-1px);
}
.df-grid-icons .df-chip:focus-visible{
  outline: 2px solid color-mix(in srgb, var(--brand-lime) 55%, transparent);
  outline-offset: 2px;
}

/* =======================================================
   تقليل الحركة – مراعاة الوصول
   ======================================================= */
@media (prefers-reduced-motion: reduce){
  *{ transition:none !important; }
  .df-grid-icons .df-card__img:hover,
  .df-grid-icons .df-chip:hover,
  .df-card__img:hover{
    transform:none !important;
  }
}

/* === Titles: multi-line clamp with clean word wrapping === */
:root {
  --df-title-lines: 2;
  --df-title-lh: 1.35;
}
.df-grid.df-grid-icons .df-card .df-card__title,
.doaf-term-children .df-card__title,
.doaf-term-posts .df-card__title {
  white-space: normal !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: var(--df-title-lines);
  line-clamp: var(--df-title-lines);
  overflow: hidden;
  line-height: var(--df-title-lh);
  min-height: calc(1em * var(--df-title-lh) * var(--df-title-lines));
}
.df-grid.df-grid-icons .df-card .df-card__title,
.doaf-term-children .df-card__title,
.doaf-term-posts .df-card__title {
  display: -webkit-box !important;
}

/* =======================================================
   Doafeer Identity Bridge – logo, fonts, breadcrumbs, icons
   ======================================================= */
:root{
  --doaf-primary-color: #1e374e;
  --doaf-secondary-color: #68a00b;
  --doaf-light-text-color: #666666;

  --brand-primary: var(--doaf-primary-color);
  --brand-lime: var(--doaf-secondary-color);
  --text: #333333;
  --surface: #ffffff;

  --doaf-radius: 8px;
  --doaf-shadow-light: 0 2px 8px rgba(0,0,0,0.08);
  --doaf-shadow-medium: 0 5px 15px rgba(0,0,0,0.12);
}
:root[data-theme="dark"]{
  --text: #e6edf3;
  --surface: #0b1116;
}
body{
  font-family: "Cairo", "Open Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--text);
  line-height: 1.6;
}
h1, h2{
  font-family: "Cairo", sans-serif;
  font-weight: 700;
  color: var(--doaf-primary-color);
  line-height: 1.2;
}
h1,
h1.section__title{
  font-size: clamp(1.4rem, 1.8rem + 0.6vw, 2.3rem);
  letter-spacing: .02em;
  text-align: center;
  padding: 20px 30px;
  margin: 30px auto;
  max-width: min(800px, 92%);
  border-radius: var(--doaf-radius);
  background: linear-gradient(135deg, rgba(255,255,255,0.9) 0%, rgba(245,247,251,0.9) 100%);
  border: 2px solid var(--doaf-secondary-color);
  box-shadow: var(--doaf-shadow-medium);
  color: var(--doaf-primary-color);
}
h2,
h2.section__title{
  font-size: clamp(1.125rem, 1.3rem + .3vw, 1.6rem);
  font-weight: 600;
  color: #34495e;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(30,55,78,0.12);
  margin-bottom: 1.2em;
}

/* ========= الشعار ========= */
.doaf-brand{
  position: relative;
  display: inline-block;
  border-radius: var(--doaf-radius);
  overflow: hidden;
  isolation: isolate;
}
.doaf-brand .custom-logo{
  max-height: 56px;
  height: auto;
  width: auto;
  border-radius: inherit;
  box-shadow: var(--doaf-shadow-light);
  display: block;
  transition: transform .25s ease, box-shadow .25s ease;
}
.doaf-brand::after{
  content: none !important;
  background: none !important;
  opacity: 0 !important;
}
.doaf-brand::before{
  content: "";
  position: absolute;
  top: -30%;
  bottom: -30%;
  left: -60%;
  width: 40%;
  background: linear-gradient(
    75deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.75) 48%,
    rgba(255,255,255,0) 100%
  );
  transform: translateX(-10%) skewX(-18deg);
  filter: blur(1.2px);
  opacity: 0;
  z-index: 2;
  pointer-events: none;
  will-change: transform, opacity;
  animation: doafLogoPulse var(--doaf-logo-shine-period, 9s) linear infinite;
}
.doaf-brand:hover .custom-logo,
.doaf-brand:focus-within .custom-logo{
  transform: translateY(-1px) scale(1.012);
  box-shadow: var(--doaf-shadow-medium);
}
.doaf-brand:hover::before,
.doaf-brand:focus-within::before{
  animation:
    doafLogoPulse var(--doaf-logo-shine-period, 9s) linear infinite,
    doafLogoShine 1.25s ease-out 1;
  opacity: 1;
}
@keyframes doafLogoShine{
  0%   { transform: translateX(-10%) skewX(-18deg); }
  100% { transform: translateX(220%) skewX(-18deg); }
}
@keyframes doafLogoPulse{
  0%   { transform: translateX(-10%) skewX(-18deg); opacity: 0; }
  82%  { transform: translateX(-10%) skewX(-18deg); opacity: 0; }
  83%  { transform: translateX(-10%) skewX(-18deg); opacity: 1; }
  100% { transform: translateX(220%) skewX(-18deg); opacity: 0; }
}
@media (prefers-reduced-motion: reduce){
  .doaf-brand::before{
    animation: none !important;
    opacity: 0 !important;
  }
  .doaf-brand .custom-logo{
    transition: box-shadow .15s ease;
  }
}
:root[data-theme="dark"] .doaf-brand::after{
  background: linear-gradient(
    to bottom,
    rgba(255,255,255,.18) 0%,
    rgba(255,255,255,.10) 22%,
    rgba(255,255,255,.04) 40%,
    rgba(255,255,255,0) 60%
  );
}

/* ========= Breadcrumbs ========= */
.doaf-breadcrumbs{
  font-size: .95rem;
  color: var(--doaf-light-text-color);
  margin: 10px 0 15px;
  padding: 10px 0;
  border-bottom: 1px solid #eee;
}
.doaf-breadcrumbs a{
  color: var(--doaf-light-text-color);
  text-decoration: none;
  transition: color .2s ease;
}
.doaf-breadcrumbs a:hover{
  color: var(--doaf-secondary-color);
  text-decoration: underline;
}
.doaf-breadcrumbs [aria-current="page"]{
  font-weight: 700;
  color: var(--doaf-primary-color);
}

/* ========= أزرار الأيقونات ========= */
.doaf-nav__toggle{
  background: var(--surface);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 12px;
  box-shadow: var(--doaf-shadow-light);
  color: var(--brand-primary);
  transition: background .2s, color .2s, border-color .2s, box-shadow .2s;
}
.doaf-nav__toggle:hover{
  color: var(--brand-lime);
  box-shadow: var(--doaf-shadow-medium);
}
.doaf-nav__bar{
  display:block;
  width:22px;
  height:2px;
  margin:4px 0;
  border-radius:2px;
  background: currentColor;
}
#doaf-theme-toggle{
  background: var(--surface);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 12px;
  box-shadow: var(--doaf-shadow-light);
  color: var(--brand-primary);
  transition: background .2s, color .2s, border-color .2s, box-shadow .2s;
}
#doaf-theme-toggle:hover{
  color: var(--brand-lime);
  box-shadow: var(--doaf-shadow-medium);
}
.doaf-toggle__icon{
  inline-size: 22px;
  block-size: 22px;
  display: inline-block;
  background: currentColor;
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23000' d='M12 2a10 10 0 1 0 9.5 13.1A7 7 0 0 1 12 2z'/></svg>");
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23000' d='M12 2a10 10 0 1 0 9.5 13.1A7 7 0 0 1 12 2z'/></svg>");
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%; mask-size: 100% 100%;
}
:root[data-theme="dark"] .doaf-nav__toggle,
:root[data-theme="dark"] #doaf-theme-toggle{
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.12);
  color: #8ab4ff;
}
:root[data-theme="dark"] .doaf-nav__toggle:hover,
:root[data-theme="dark"] #doaf-theme-toggle:hover{
  color: var(--brand-lime);
}

/* =========================================
   Force black text inside Icon Cards in dark mode
   ========================================= */
:root[data-theme="dark"] .df-grid-icons{
  --chip-bg: #ffffff;
  --chip-text: #000000;
  --chip-border: #e5e7eb;
}
:root[data-theme="dark"] .df-grid-icons .df-card__title,
:root[data-theme="dark"] .df-grid-icons .df-card__title a{
  color:#000 !important;
  text-shadow:none !important;
}
:root[data-theme="dark"] .df-grid-icons .df-term-count{
  color:#000 !important;
}
:root[data-theme="dark"] .df-grid-icons .df-chip,
:root[data-theme="dark"] .df-grid-icons .df-chip:link,
:root[data-theme="dark"] .df-grid-icons .df-chip:visited{
  background:#fff !important;
  color:#000 !important;
  border-color:#e5e7eb !important;
}
:root[data-theme="dark"] .df-grid-icons .df-chip:hover,
:root[data-theme="dark"] .df-grid-icons .df-chip:focus-visible{
  background:#f3f4f6 !important;
  color:#000 !important;
  border-color:#e5e7eb !important;
}
:root[data-theme="dark"] .df-grid-icons .df-card a{
  color:#000 !important;
}
:root[data-theme="dark"] .df-grid-icons .df-card a:hover{
  color:#000 !important;
  text-decoration: underline;
}

/* ===== Doafeer: Share Hero (Medium) ===== */
:root{
  --df-ink:#0f172a;
  --df-card:#ffffff;
  --df-bg:#f6f7fb;
  --df-ring:rgba(15,23,42,.08);
  --df-shadow:0 8px 25px rgba(2,8,23,.08), 0 2px 6px rgba(2,8,23,.06);
  --df-frame:#0e6372;
  --df-circle:#f3ffdb;
  --df-focus:#3b82f6;
  --df-x:#000;
  --df-wa:#25D366;
  --df-tg:#0088CC;
}
.df-share-hero{
  position:relative;
  display:grid;
  place-items:center;
  padding:36px 14px 44px;
  background:
    radial-gradient(900px 520px at 50% -12%, #eef5ff, transparent 62%) var(--df-bg);
  color:var(--df-ink);
  overflow:clip;
}
.df-share-card{
  position:relative;
  width:min(680px, 94%);
  background:var(--df-card);
  border:1px solid var(--df-ring);
  border-radius:22px;
  box-shadow:var(--df-shadow);
  padding:40px 16px 22px;
  isolation:isolate;
}
.df-frame{
  position:relative;
  border:4px solid var(--df-frame);
  border-radius:26px;
  padding:26px 12px 14px;
  text-align:center;
}
.df-frame::before,
.df-frame::after{
  content:"";
  position:absolute; top:50%; transform:translateY(-50%);
  width:16px; height:16px; border-radius:50%;
  border:4px solid var(--df-frame);
  background:var(--df-circle);
  box-shadow:0 0 6px rgba(243,255,219,.7);
}
.df-frame::before{inset-inline-start:-12px}
.df-frame::after{inset-inline-end:-12px}
.df-title-pill{
  position:absolute; top:-18px; left:50%; transform:translateX(-50%);
  background:var(--df-circle);
  color:var(--df-ink);
  padding:6px 14px;
  font-weight:800;
  font-size:clamp(0.95rem, .72rem + 1.2vw, 1.2rem);
  white-space:nowrap;
  border:1px solid var(--df-frame);
  border-radius:10px;
  text-shadow:0 1px 2px rgba(0,0,0,.08);
}
.df-share-actions{
  position:relative; display:flex; justify-content:center;
  gap:12px; flex-wrap:wrap;
}
.df-btn{
  --h:44px; --padX:16px;
  position:relative; display:inline-flex; align-items:center; gap:10px;
  height:var(--h); padding-inline:var(--padX);
  border-radius:12px; font-weight:700;
  font-size:clamp(.85rem,.7rem + .3vw,.95rem);
  letter-spacing:.01em; text-decoration:none; color:#fff;
  transition:transform .3s ease, box-shadow .3s ease, filter .3s ease;
  box-shadow:0 6px 14px rgba(2,8,23,.12), 0 2px 4px rgba(2,8,23,.08);
  outline:none;
}
.df-btn:hover{transform:translateY(-3px) scale(1.04)}
.df-btn svg{width:24px; height:24px; flex:0 0 24px; transition:transform .3s ease}
.df-btn::after{
  content:""; position:absolute; inset:0; border-radius:inherit;
  background:linear-gradient(120deg, rgba(255,255,255,.22), rgba(255,255,255,0) 70%);
  opacity:0; transition:opacity .3s ease; pointer-events:none;
}
.df-btn:hover::after{opacity:1}
.df-btn:focus-visible{
  box-shadow:0 0 0 3px #fff, 0 0 0 5px var(--df-focus),
             0 6px 14px rgba(2,8,23,.12), 0 2px 4px rgba(2,8,23,.08);
}
.btn-x{background:var(--df-x)}
.btn-x:hover svg{transform:rotate(5deg) scale(1.1)}
.btn-wa{
  background:var(--df-wa);
  border:2px solid #fff;
  box-shadow:0 4px 12px rgba(37,211,102,.35)
}
.btn-wa:hover svg{transform:rotate(-10deg)}
.btn-tg{
  background:var(--df-tg);
  box-shadow:0 4px 12px rgba(34,158,217,.35)
}
.btn-tg svg{filter:drop-shadow(0 2px 4px rgba(0,0,0,.18))}
.btn-tg:hover svg{transform:translateY(-2px) translateX(2px)}
@media (max-width:700px){
  .df-share-card{padding:28px 12px 16px}
  .df-frame{padding:22px 10px 12px}
  .df-title-pill{top:-16px}
  .df-btn{--h:42px; --padX:14px}
}
@media (max-width:430px){
  .df-btn{
    width:80%;
    justify-content:center;
    margin-inline:auto;
  }
}
@media (prefers-reduced-motion: reduce){
  .df-btn, .df-btn svg{transition:none}
  .df-btn:hover{transform:none}
  .btn-wa:hover svg, .btn-x:hover svg, .btn-tg:hover svg{transform:none}
  .df-btn::after{display:none}
}

/* توسيط محتوى الفوتر */
footer, .site-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  color: #010854;
  gap: 8px;
  padding: 20px 16px;
  margin-top: 20px;
  clear: both;
}

/* =======================================================
   تحسين القراءة داخل مساحة المقال
   ======================================================= */
:where(
  .entry-content,
  .wp-block-post-content,
  .post-content,
  .single .content,
  .single-post .content,
  article .entry-content
)
:is(
  p, .wp-block-paragraph,
  li, .wp-block-list li,
  blockquote, .wp-block-quote,
  figcaption,
  table, th, td
):not(.has-text-color){
  color: var(--doaf-content-ink) !important;
}
:where(
  .entry-content,
  .wp-block-post-content,
  .post-content,
  .single .content,
  .single-post .content,
  article .entry-content
)
:is(p, .wp-block-paragraph, li, .wp-block-list li, blockquote, .wp-block-quote)
a:not(.has-text-color){
  color: inherit;
}

/* =======================================================
   وضوح نص زر العنصر المُفعّل في قائمة الفيديو
   ======================================================= */
.doaf-video-player-wrap .doaf-playlist-item.is-active,
.doaf-video-player-wrap .doaf-playlist-item.is-active:visited,
.doaf-video-player-wrap .doaf-playlist-item.is-active:hover,
.doaf-video-player-wrap .doaf-playlist-item.is-active:focus {
  color: var(--doaf-active-ink) !important;
}
.doaf-video-player-wrap .doaf-playlist-item.is-active .doaf-playlist-label,
.doaf-video-player-wrap .doaf-playlist-item.is-active .doaf-playlist-index {
  color: inherit !important;
}

/* =========================================================
   ICON GRID – FIX width clamp (150px → لا يُقص إلى 140px)
   يعلو على كل ما سبق ويُطبّق فقط داخل .df-grid-icons
   ========================================================= */
:root{
  /* أبعاد الأنماط الأربعة كمتغيرات للاستخدام المنطقي */
  --df-main-w: 150px;  --df-main-h: 120px;  /* أيقونة رئيسية */
  --df-term-w: 140px;  --df-term-h: 140px;  /* أيقونة صفوف */
  --df-cover-w: 140px; --df-cover-h: 170px;  /* غلاف */
  --df-sub-w: 150px;   --df-sub-h: 130px;   /* فرعية */
}

/* اجعل الغلاف مُرناً ويحتضن الحجم الحقيقي للصورة */
.df-grid-icons .df-card__img-wrap{
  display:flex;
  align-items:center;
  justify-content:center;

  /* ألغِ أي قيود عرض/أقصى عرض قد تأتي من ملفات أخرى */
  inline-size:auto;
  max-inline-size:none;
  min-inline-size:0;
  block-size:auto;
  max-block-size:none;
  min-block-size:0;
}

/* امنع تقلّص الصورة داخل عمود الفلكس، وألغِ أي حدود قصوى */
.df-grid-icons .df-card__img{
  inline-size:auto;
  block-size:auto;
  max-inline-size:none;
  max-block-size:none;
  flex:0 0 auto;           /* لا تنكمش مع الفلكس */
  aspect-ratio:auto;
}

/* ثبّت الأبعاد بالبكسل لكل نمط */
.df-grid-icons .df-card__img.df-main  { inline-size: var(--df-main-w);  block-size: var(--df-main-h);  }
.df-grid-icons .df-card__img.df-term  { inline-size: var(--df-term-w);  block-size: var(--df-term-h);  }
.df-grid-icons .df-card__img.df-cover { inline-size: var(--df-cover-w); block-size: var(--df-cover-h); }
.df-grid-icons .df-card__img.df-sub   { inline-size: var(--df-sub-w);   block-size: var(--df-sub-h);   }

/* توافق خلفي: tile/wide = main */
.df-grid-icons .df-card__img.df-tile,
.df-grid-icons .df-card__img.df-wide  { inline-size: var(--df-main-w); block-size: var(--df-main-h); }

/* فالبك للمتصفحات القديمة دون logical props */
@supports not (inline-size: 1px){
  .df-grid-icons .df-card__img.df-main  { width: 150px; height:120px; }
  .df-grid-icons .df-card__img.df-term  { width: 140px; height:140px; }
  .df-grid-icons .df-card__img.df-cover { width: 140px; height:170px; }
  .df-grid-icons .df-card__img.df-sub   { width: 150px; height:130px; }
  .df-grid-icons .df-card__img.df-tile,
  .df-grid-icons .df-card__img.df-wide  { width: 150px; height:120px; }
}

/* ================= ICON GRID — FIX v3 (final clamp breaker) ================= */
:root{
  --df-main-w:150px;  --df-main-h:120px;  /* أيقونة رئيسية */
  --df-term-w:140px;  --df-term-h:140px;  /* أيقونة صفوف (الافتراضي) */
  --df-cover-w:140px; --df-cover-h:170px; /* غلاف */
  --df-sub-w:150px;   --df-sub-h:130px;   /* فرعية */
}

/* خلّي الغلاف يحتضن الحجم الفعلي، وكسر أي max/width سابقة */
.df-grid-icons .df-card__img-wrap{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  height:auto !important;
  max-height:none !important;
  min-height:0 !important;
  overflow:visible !important;
}

/* امنع الانكماش مع الفلكس وأزل أي نسب أو حدود قصوى */
.df-grid-icons .df-card__img{
  flex:0 0 auto !important;
  width:auto !important;
  height:auto !important;
  max-width:none !important;
  max-height:none !important;
  aspect-ratio:auto !important;
}

/* المقاسات الأربعة — بقيم صريحة لا يمكن قصّها */
.df-grid-icons .df-card__img.df-main{
  width:var(--df-main-w) !important;  height:var(--df-main-h) !important;  border-radius:12px !important;
}
.df-grid-icons .df-card__img.df-term{
  width:var(--df-term-w) !important;  height:var(--df-term-h) !important;  border-radius:14px !important;
}
.df-grid-icons .df-card__img.df-cover{
  width:var(--df-cover-w) !important; height:var(--df-cover-h) !important; border-radius:12px !important;
}
.df-grid-icons .df-card__img.df-sub{
  width:var(--df-sub-w) !important;   height:var(--df-sub-h) !important;   border-radius:12px !important;
}

/* توافق خلفي: tile/wide = main */
.df-grid-icons .df-card__img.df-tile,
.df-grid-icons .df-card__img.df-wide{
  width:var(--df-main-w) !important;  height:var(--df-main-h) !important;  border-radius:12px !important;
}
/* Legacy aspect-ratio bridge */
.df-card__img.df-ar-1x1 { aspect-ratio: 1 / 1; display:block; }
.df-card__img.df-tile   { aspect-ratio: 5 / 4; display:block; }  /* ~150x120 */
.df-card__img.df-cover  { aspect-ratio: 14 / 17; display:block; }/* ~140x170 */