/* ==========================================================================
   The Dreams - theme.css
   Fonts (IBM Plex Sans Arabic, self-hosted), RTL/Arabic overrides, interactive
   component behavior, and post-content typography. Loaded after main.css.
   ========================================================================== */

/* ---- IBM Plex Sans Arabic (self-hosted, Arabic + Latin subsets) ---------- */
@font-face {
	font-family: "IBM Plex Sans Arabic";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/ibm-plex-sans-arabic-arabic-400-normal.woff2") format("woff2");
	unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E;
}
@font-face {
	font-family: "IBM Plex Sans Arabic";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/ibm-plex-sans-arabic-latin-400-normal.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "IBM Plex Sans Arabic";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("../fonts/ibm-plex-sans-arabic-arabic-500-normal.woff2") format("woff2");
	unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E;
}
@font-face {
	font-family: "IBM Plex Sans Arabic";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("../fonts/ibm-plex-sans-arabic-latin-500-normal.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "IBM Plex Sans Arabic";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/ibm-plex-sans-arabic-arabic-600-normal.woff2") format("woff2");
	unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E;
}
@font-face {
	font-family: "IBM Plex Sans Arabic";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/ibm-plex-sans-arabic-latin-600-normal.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "IBM Plex Sans Arabic";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/ibm-plex-sans-arabic-arabic-700-normal.woff2") format("woff2");
	unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E;
}
@font-face {
	font-family: "IBM Plex Sans Arabic";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/ibm-plex-sans-arabic-latin-700-normal.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD;
}

/* ---- Apply the family everywhere (override Tailwind's --font-sans) -------- */
:root {
	--font-sans: "IBM Plex Sans Arabic", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
html,
body,
button,
input,
select,
textarea,
optgroup {
	font-family: var(--font-sans);
}

/* ---- Directional icons (RTL-aware) --------------------------------------- */
[dir="rtl"] .tw-dir-icon { transform: scaleX(-1); }
.tw-pag-prev { transform: scaleX(-1); }            /* arrow points left in LTR */
[dir="rtl"] .tw-pag-prev { transform: none; }
[dir="rtl"] .tw-pag-next { transform: scaleX(-1); }

/* ---- Desktop nav dropdowns (replaces Headless UI behavior) --------------- */
.menu-dropdown > .sub-menu,
.menu-megamenu > .sub-menu {
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity .15s ease, transform .15s ease, visibility .15s ease;
	pointer-events: none;
}
.menu-dropdown:hover > .sub-menu,
.menu-dropdown:focus-within > .sub-menu,
.menu-megamenu:hover > .sub-menu,
.menu-megamenu:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: none;
	pointer-events: auto;
}

/* ---- Mobile drawer + search panel + back-to-top -------------------------- */
.thedreams-mobile-menu .thedreams-mobile-panel {
	transform: translateX(100%);
	transition: transform .25s ease;
}
[dir="rtl"] .thedreams-mobile-menu .thedreams-mobile-panel {
	transform: translateX(-100%);
}
.thedreams-mobile-menu.is-open .thedreams-mobile-panel { transform: none; }
.thedreams-to-top.is-visible { display: inline-flex; }
body.thedreams-no-scroll { overflow: hidden; }

/* ---- Post content typography (raw WP content, Arabic-friendly) ----------- */
.nc-single-content {
	font-size: 1.05rem;
	line-height: 2;
	color: var(--color-neutral-800, #262626);
}
.dark .nc-single-content { color: var(--color-neutral-300, #d4d4d4); }
.nc-single-content > * + * { margin-top: 1.5em; }
.nc-single-content h2 { font-size: 1.6rem; font-weight: 700; line-height: 1.4; margin-top: 1.8em; }
.nc-single-content h3 { font-size: 1.3rem; font-weight: 700; line-height: 1.45; margin-top: 1.6em; }
.nc-single-content h4 { font-size: 1.12rem; font-weight: 600; margin-top: 1.4em; }
.nc-single-content p { margin-top: 1.2em; }
.nc-single-content a { color: var(--color-primary-600, #2563eb); text-decoration: underline; text-underline-offset: 3px; }
.nc-single-content ul,
.nc-single-content ol { padding-inline-start: 1.6em; margin-top: 1.2em; }
.nc-single-content ul { list-style: disc; }
.nc-single-content ol { list-style: decimal; }
.nc-single-content li + li { margin-top: .5em; }
.nc-single-content blockquote {
	border-inline-start: 4px solid var(--color-primary-500, #3b82f6);
	padding-inline-start: 1.25em;
	font-style: normal;
	color: var(--color-neutral-600, #525252);
	margin-top: 1.5em;
}
.nc-single-content img,
.nc-single-content iframe,
.nc-single-content video {
	max-width: 100%;
	height: auto;
	border-radius: 1rem;
}
.nc-single-content figure { margin-top: 1.5em; }
.nc-single-content figcaption { font-size: .875rem; color: var(--color-neutral-500, #737373); margin-top: .5em; text-align: center; }
.nc-single-content table { width: 100%; border-collapse: collapse; margin-top: 1.5em; font-size: .95rem; }
.nc-single-content th,
.nc-single-content td { border: 1px solid var(--color-neutral-200, #e5e5e5); padding: .6em .8em; text-align: start; }
.dark .nc-single-content th,
.dark .nc-single-content td { border-color: var(--color-neutral-700, #404040); }
.nc-single-content pre {
	background: var(--color-neutral-900, #171717);
	color: #f5f5f5;
	padding: 1em 1.25em;
	border-radius: .75rem;
	overflow-x: auto;
	direction: ltr;
	text-align: left;
	margin-top: 1.5em;
}

/* Search form (get_search_form) styled to the design */
.thedreams-search-panel .search-form,
.thedreams-mobile-panel .search-form { display: flex; gap: .5rem; }
.search-form input[type="search"] {
	flex: 1 1 auto;
	border-radius: 9999px;
	border: 1px solid var(--color-neutral-200, #e5e5e5);
	background: var(--color-neutral-50, #fafafa);
	padding: .7rem 1.2rem;
	font-size: .95rem;
}
.dark .search-form input[type="search"] {
	border-color: var(--color-neutral-700, #404040);
	background: var(--color-neutral-800, #262626);
	color: #fff;
}
.search-form button[type="submit"] {
	border-radius: 9999px;
	background: var(--color-neutral-900, #171717);
	color: #fff;
	padding: .7rem 1.4rem;
	font-weight: 600;
	font-size: .95rem;
}
.dark .search-form button[type="submit"] { background: #fff; color: #171717; }

/* RankMath breadcrumb spacing inside our wrappers */
.rank-math-breadcrumb { font-size: .875rem; color: var(--color-neutral-500, #737373); }
