/* Wadi site font: IBM Plex Sans Arabic, self-hosted (SIL OFL 1.1). */
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/IBMPlexSansArabic-Regular.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/IBMPlexSansArabic-SemiBold.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fonts/IBMPlexSansArabic-Bold.woff2') format('woff2');
}

:root { --wadi-font: 'IBM Plex Sans Arabic', system-ui, 'Segoe UI', Tahoma, sans-serif; }

/* "html body" raises specificity over the theme's plain "body"/element rules. No !important.
   Icon fonts are untouched: only text containers are listed, never "*". */
html body,
html body .post-content,
html body .entry-content,
html body .entry-content p,
html body h1, html body h2, html body h3, html body h4, html body h5, html body h6,
html body .entry-title,
html body .post-title,
html body .the-subtitle,
html body .widget-title,
html body .comment-reply-title,
html body .logo-text,
html body .main-nav,
html body .main-nav a,
html body .main-nav li a,
html body #main-nav .menu > li > a,
html body #main-nav .menu ul li a,
html body .top-nav a,
html body .tie-btn,
html body .button,
html body input,
html body select,
html body textarea,
html body button {
  font-family: var(--wadi-font);
}

html body { line-height: 1.85; }
html body .entry-content { font-size: 16px; line-height: 1.85; }
html body h1, html body h2, html body h3,
html body h4, html body h5, html body h6,
html body .entry-title, html body .post-title { font-weight: 700; }
html body .entry-content p,
html body .post-content p { font-size: 16px; line-height: 1.85; }
html body .entry-content h2, html body .post-content h2 { font-size: 24px; line-height: 1.5; }
html body .entry-content h3, html body .post-content h3 { font-size: 20px; line-height: 1.55; }

@media (min-width: 768px) {
  html body .entry-content { font-size: 17px; }
  html body .entry-content p,
  html body .post-content p { font-size: 17px; }
}