/*
 * BarakaBits Arabic/RTL overrides
 * Based on design-system typography guidance.
 */

@font-face {
	font-family: "Hejaz";
	src: url("fonts/hejaz-regular.woff2") format("woff2"),
		url("fonts/hejaz-regular.woff") format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Hejaz";
	src: url("fonts/hejaz-bold.woff2") format("woff2"),
		url("fonts/hejaz-bold.woff") format("woff");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

:root {
	--bb-font-arabic-heading: "Hejaz", "Cairo", "Noto Sans Arabic", system-ui, sans-serif;
	--bb-font-arabic-body: "Cairo", "Noto Sans Arabic", system-ui, sans-serif;
}

html[dir="rtl"],
body.rtl {
	--cs-font-base-family: var(--bb-font-arabic-body);
	--cs-font-primary-family: var(--bb-font-arabic-body);
	--cs-font-secondary-family: var(--bb-font-arabic-body);
	--cs-font-menu-family: var(--bb-font-arabic-body);
	--cs-font-submenu-family: var(--bb-font-arabic-body);
	--cs-font-submenu-small-menu-family: var(--bb-font-arabic-body);
	--cs-font-input-family: var(--bb-font-arabic-body);
	--cs-font-post-meta-family: var(--bb-font-arabic-body);
	--cs-font-category-family: var(--bb-font-arabic-body);
	--cs-font-entry-excerpt-family: var(--bb-font-arabic-body);
	--cs-font-post-subtitle-family: var(--bb-font-arabic-body);
	--cs-font-post-content-family: var(--bb-font-arabic-body);
	--cs-font-footer-menu-family: var(--bb-font-arabic-body);
	--cs-font-footer-submenu-family: var(--bb-font-arabic-body);
	--cs-font-headings-family: var(--bb-font-arabic-heading);
	--cs-font-section-headings-family: var(--bb-font-arabic-heading);
	--cs-font-post-title-family: var(--bb-font-arabic-heading);
	--cs-font-entry-title-family: var(--bb-font-arabic-heading);
	--cs-font-menu-letter-spacing: 0;
	--cs-font-submenu-letter-spacing: 0;
	--cs-font-submenu-small-menu-letter-spacing: 0;
	--cs-font-post-meta-letter-spacing: 0;
	--cs-font-category-letter-spacing: 0;
	--cs-font-entry-excerpt-letter-spacing: 0;
	--cs-font-post-subtitle-letter-spacing: 0;
	--cs-font-post-content-letter-spacing: 0;
	--cs-font-headings-letter-spacing: 0;
	--cs-font-post-title-letter-spacing: 0;
	--cs-font-entry-title-letter-spacing: 0;
}

html[dir="rtl"] body,
html[lang^="ar"] body {
	font-family: var(--bb-font-arabic-body);
	letter-spacing: 0;
}

html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] .cs-entry__title,
html[dir="rtl"] .cs-page-title,
html[dir="rtl"] .cs-section-title,
html[dir="rtl"] .wp-block-heading {
	font-family: var(--bb-font-arabic-heading);
	font-weight: 700;
	letter-spacing: 0;
}

html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6,
html[dir="rtl"] p,
html[dir="rtl"] li,
html[dir="rtl"] a,
html[dir="rtl"] input,
html[dir="rtl"] select,
html[dir="rtl"] textarea,
html[dir="rtl"] button,
html[dir="rtl"] .cs-header__nav a,
html[dir="rtl"] .cs-footer a {
	font-family: var(--bb-font-arabic-body);
}

html[dir="rtl"] .cs-entry__excerpt,
html[dir="rtl"] .cs-entry__subtitle,
html[dir="rtl"] .wp-block-post-excerpt,
html[dir="rtl"] .wp-block-latest-posts__post-excerpt,
html[dir="rtl"] .wp-block-rss__item-excerpt,
html[dir="rtl"] .wp-block-latest-comments__comment-excerpt,
html[dir="rtl"] .cs-search-posts .cs-entry__excerpt {
	font-family: var(--bb-font-arabic-body);
	letter-spacing: 0;
}

/* Category + country badges/tags */
html[dir="rtl"] .cs-entry__category,
html[dir="rtl"] .cs-entry__category li a,
html[dir="rtl"] .cs-entry__post-meta .post-categories a,
html[dir="rtl"] .cs-page__header-category a,
html[dir="rtl"] .cs-meta-country ul.post-countries li a,
html[dir="rtl"] .barakabits-footer-countries__badge {
	font-family: var(--bb-font-arabic-body);
	letter-spacing: 0;
}

/* Replace "right" icon glyphs with left glyphs in RTL contexts */
html[dir="rtl"] .cs-icon-chevron-right:before {
	content: "\e90d";
}

html[dir="rtl"] .cs-icon-arrow-right:before {
	content: "\e913";
}

/* Burger menu parent items use pseudo-elements, not .cs-icon classes */
html[dir="rtl"] .cs-burger__nav-inner > li.menu-item-has-children > a:before {
	content: "\e90d";
}

html[dir="rtl"] .cs-burger__nav-inner > li.menu-item-has-children > a:after {
	content: "\e913";
}

/* Child-theme CTA button chevrons */
html[dir="rtl"] .cs-header__custom-button.cs-button-animated {
	padding: 0.34rem 10px 0.34rem 22px;
}

html[dir="rtl"] .cs-header__custom-button.cs-button-animated .cs-icon-chevron-right,
html[dir="rtl"] .cs-header__custom-button.cs-button-animated .cs-icon-arrow-right {
	left: 8px;
	right: auto;
}

html[dir="rtl"] .cs-header__custom-button.cs-button-animated:hover .cs-icon-chevron-right {
	transform: translateX(-2px);
}

/* Arrow placement fallback for post meta/footer links */
html[dir="rtl"] .cs-entry__post-meta .cs-meta-author-link {
	padding-left: 1.25rem;
	padding-right: 0;
}

html[dir="rtl"] .cs-entry__post-meta .cs-meta-author-link .cs-icon-chevron-right,
html[dir="rtl"] .cs-entry__post-meta .cs-meta-author-link .cs-icon-arrow-right {
	left: -2px;
	right: auto;
}

html[dir="rtl"] .cs-footer__nav > li > a {
	padding-left: 28px;
	padding-right: 0;
}

html[dir="rtl"] .cs-footer__nav > li > a:before,
html[dir="rtl"] .cs-footer__nav > li > a:after {
	left: 11px;
	right: auto;
}