
/* =========================================
   GLOBAL STYLES
========================================= */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  text-size-adjust: 100%;
  /* Keep visible so sticky header works; clip horizontal bleed on main instead. */
  overflow-x: visible;
}

body {
  margin: 0;
  background: var(--shamsa-color-background);
  color: var(--shamsa-color-text);
  font-family: var(--shamsa-font, "Yekan Bakh", Tahoma, Arial, sans-serif);
  font-size: var(--shamsa-fs-body, 1rem);
  line-height: var(--shamsa-lh-body, 1.85);
  overflow-x: visible;
}

.shamsa-main {
  overflow-x: clip;
  max-width: 100%;
}

.shamsa-skip-link {
  position: absolute;
  inset-inline-start: 16px;
  top: 0;
  z-index: calc(var(--shamsa-z-toast, 400) + 1);
  padding: 8px 14px;
  border-radius: var(--shamsa-radius-sm, 6px);
  background: var(--shamsa-color-primary);
  color: #fff;
  font-size: var(--shamsa-fs-meta, 0.875rem);
  font-weight: 700;
  text-decoration: none;
  transform: translateY(-120%);
}

.shamsa-skip-link:focus {
  transform: translateY(12px);
}


body.shme-nav-locked {
  overflow: hidden;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

button {
  font: inherit;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
}

/* Homepage Custom HTML (experience): keep ::before full-bleed; clip only inner overflow */
.experience-upgraded {
  max-width: none !important;
  overflow-x: visible !important;
}
.experience-upgraded > .container,
.experience-upgraded .learning-shell,
.experience-upgraded .learning-stage {
  max-width: 100%;
  overflow-x: clip;
}
.experience-upgraded .learning-stage {
  overflow: hidden !important;
}
.experience-upgraded .learning-orbit {
  left: 50% !important;
  width: min(375px, 100%) !important;
  height: min(375px, 100%) !important;
  transform: translateX(-50%) !important;
  overflow: hidden !important;
  pointer-events: none !important;
}
.experience-upgraded .learning-orbit:after {
  inset: 0 !important;
}







/* Yekan Bakh Font Family */

@font-face {
    font-family: 'Yekan Bakh';
    src: url('../font/Yekan%20Bakh%20Fa-En%2001%20Hairline.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Yekan Bakh';
    src: url('../font/Yekan%20Bakh%20Fa-En%2002%20Thin.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Yekan Bakh';
    src: url('../font/Yekan%20Bakh%20Fa-En%2003%20Light%20%281%29.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Yekan Bakh';
    src: url('../font/Yekan%20Bakh%20Fa-En%2004%20Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Yekan Bakh';
    src: url('../font/Yekan%20Bakh%20Fa-En%2005%20Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Yekan Bakh';
    src: url('../font/Yekan%20Bakh%20Fa-En%2006%20Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Yekan Bakh';
    src: url('../font/Yekan%20Bakh%20Fa-En%2007%20Heavy.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Yekan Bakh';
    src: url('../font/Yekan%20Bakh%20Fa-En%2008%20Fat.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

/* Apply font to website */

body,
button,
input,
textarea,
select {
    font-family: var(--shamsa-font, "Yekan Bakh", Tahoma, Arial, sans-serif);
}










.shamsa-container {
  width: min(calc(100% - 32px), var(--shamsa-wide-width, 1200px));
  margin-inline: auto;
}

.shamsa-container--content {
  width: min(calc(100% - 32px), var(--shamsa-content-width, 760px));
  margin-inline: auto;
}

.shamsa-main {
  min-height: 60vh;
}

/* Consultation page: guaranteed gap under sticky header (always via main.css) */
.shamsa-main .shamsa-consultation-page,
.shamsa-main [class*="consultation-page"] > .shamsa-consultation-page {
  display: block;
  padding-top: 66px !important;
  padding-bottom: 2.5rem;
  margin-top: 0 !important;
}

.shamsa-main .shamsa-consultation-banner {
  margin-top: 0;
}

@media (max-width: 720px) {
  .shamsa-main .shamsa-consultation-page,
  .shamsa-main [class*="consultation-page"] > .shamsa-consultation-page {
    padding-top: 40px !important;
  }
}


/* =========================================
   FOOTER
========================================= */


/* ========================================
   Shamsa Footer — Elementor reference
======================================== */

.shamsa-footer,
.shamsa-footer *,
.shamsa-footer *::before,
.shamsa-footer *::after {
	box-sizing: border-box;
}

.shamsa-footer {
	display: flex;
	flex-direction: column;
	justify-content: space-between;

	width: 100%;
	max-width: none;

	margin: 40px 0 0;
	padding: 40px 0;

	background: #141826;
	color: #07080D;
	direction: rtl;
	font-family: shamsafont, Tahoma, Arial, sans-serif;
}

/* Main columns — هم‌عرض جعبه آبی اسلایدر */
.shamsa-footer__inner {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: 40px 48px;

	box-sizing: border-box;
	width: min(calc(100% - 32px), 1200px);
	max-width: none;
	min-height: 252px;

	margin: 0 auto;
	padding: 0;
}

/* Columns */

.shamsa-footer__column {
	display: flex;
	flex-direction: column;
	flex-shrink: 1;

	min-width: 0;
	margin: 0;
	padding: 0;

	gap: 0;

	font-family: shamsafont, Tahoma, Arial, sans-serif;
	font-size: var(--shamsa-fs-meta);
	font-weight: 400;
}

.shamsa-footer__brand-column {
	flex: 1 1 300px;
	width: auto;
	max-width: 360px;
	padding-inline-end: 12px;
}

.shamsa-footer__related,
.shamsa-footer__quick-links {
	flex: 0 1 180px;
	width: auto;
}

.shamsa-footer__contact {
	flex: 0 1 260px;
	width: auto;
}

/* Brand */

.shamsa-footer__brand {
	display: flex;
	align-items: center;
	gap: 12px;
}

.shamsa-footer__brand a {
	display: inline-flex;
	flex-shrink: 0;
}

.shamsa-footer__brand img {
	display: block;

	width: 77px;
	height: 77px;
	max-width: 100%;

	object-fit: contain;
}

.shamsa-footer__brand h2 {
	margin: 0;
	padding: 0;

	color: #141826;
	font-family: shamsafont, Tahoma, Arial, sans-serif;
	font-size: var(--shamsa-fs-body);
	font-weight: 400;
}

/* Description */

.shamsa-footer__description {
	margin: 24px 0;
	padding: 0;
	padding-inline-end: 8px;
	max-width: 34em;

	color: #737373;

	font-family: shamsafont, Tahoma, Arial, sans-serif;
	font-size: var(--shamsa-fs-meta);
	font-weight: 400;
	line-height: 28px;
	text-align: justify;
}

/* Column headings */

.shamsa-footer__column > h2 {
	margin: 0 0 24px;
	padding: 0;

	color: #141826;

	font-family: shamsafont, Tahoma, Arial, sans-serif;
	font-size: var(--shamsa-fs-body);
	font-weight: 400;
	line-height: 1.8;
}

/* Lists */

.shamsa-footer__column ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.shamsa-footer__column li {
	margin: 0;
	padding: 0;
}

.shamsa-footer__column li + li {
	margin-top: 12px;
}

/* Links */

.shamsa-footer__column a {
	color: #737373;

	font-family: shamsafont, Tahoma, Arial, sans-serif;
	font-size: var(--shamsa-fs-meta);
	font-weight: 400;
	line-height: 1.8;

	text-decoration: none;
	transition: color 0.2s ease;
}

.shamsa-footer__column a:hover {
	color: #C71E31;
}

/* Contact */

.shamsa-footer__contact p {
	margin: 0 0 12px;
	padding: 0;

	color: #737373;
	font-size: var(--shamsa-fs-meta);
	font-weight: 400;
	line-height: 28px;
}

/* Social icons / links */

.shamsa-footer__socials {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;

	gap: 16px;

	margin: 0;
	padding: 0;

	list-style: none;
}

.shamsa-footer__socials li,
.shamsa-footer__socials li + li {
	margin: 0;
	padding: 0;
}

.shamsa-footer__socials a {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 20px;

	color: #737373;
	font-size: var(--shamsa-fs-meta);
	line-height: 1.5;
	text-decoration: none;
}

/* Bottom section */

.shamsa-footer__bottom {
	display: flex;
	flex-direction: column;

	box-sizing: border-box;
	width: min(calc(100% - 32px), 1200px);
	max-width: none;

	margin: 0 auto;
	padding: 0;
}

.shamsa-footer__divider {
	width: 100%;
	height: 1px;

	margin: 0;
	padding: 0;

	background: #252937;
}

/* خط قرمز زیر عنوان ستون‌های فوتر، به‌جز عنوان برند */
.shamsa-footer .text-footer h3 {
    position: relative;
    margin-bottom: 24px;
    padding-bottom: 5px;
    color: #fff;
    font-family: shamsafont, Tahoma, Arial, sans-serif;
    font-size: var(--shamsa-fs-card);
    font-weight: 700;
    line-height: 32px;
    text-align: right;
}

.shamsa-footer .text-footer h3::after {
    position: absolute;
    right: 0;
    bottom: -2px;
    display: block;
    width: 48px;
    height: 2px;
    content: "";
    border-radius: 50px;
    background-color: #c71e31;
}


.shamsa-footer__copyright {
	margin: 0;
	padding: 12px 0 0;

	color: #737373;

	font-family: shamsafont, Tahoma, Arial, sans-serif;
	font-size: var(--shamsa-fs-meta);
	font-weight: 400;
	line-height: 28px;
	text-align: center;
}

/* Responsive */

@media (max-width: 1366px) {
	.shamsa-footer {
		padding: 15px 0;
	}
}

@media (max-width: 1100px) {
	.shamsa-footer__inner {
		gap: 28px 32px;
	}

	.shamsa-footer__brand-column {
		flex: 1 1 calc(50% - 16px);
		max-width: none;
		padding-inline-end: 0;
	}

	.shamsa-footer__related,
	.shamsa-footer__quick-links {
		flex: 1 1 calc(25% - 24px);
	}

	.shamsa-footer__contact {
		flex: 1 1 calc(50% - 16px);
	}

	.shamsa-footer__description {
		max-width: none;
		padding-inline-end: 0;
	}
}

@media (max-width: 992px) {
	.shamsa-footer__inner,
	.shamsa-footer__bottom {
		width: min(calc(100% - 40px), 760px);
	}
}

@media (max-width: 767px) {
	.shamsa-footer {
		margin-top: 40px;
		padding: 24px 0;
	}

	.shamsa-footer__inner,
	.shamsa-footer__bottom {
		width: calc(100% - 24px);
		flex-direction: column;
		flex-wrap: nowrap;
		gap: 32px;
		min-height: 0;
	}

	.shamsa-footer__column,
	.shamsa-footer__brand-column,
	.shamsa-footer__related,
	.shamsa-footer__quick-links,
	.shamsa-footer__contact {
		width: 100%;
		max-width: 100%;
	}

	.shamsa-footer__bottom {
		margin-top: 28px;
	}

	.shamsa-footer__copyright {
		font-size: var(--shamsa-fs-meta-sm);
	}
}



/* =========================================
   SHAMSA HEADER VARIABLES
========================================= */

:root {
  --shme-max: var(--shamsa-wide-width, 1200px);
  --shme-gap: 16px;
  --shme-bg: #fff;
  --shme-surface: #f8fafc;
  --shme-border: #e5e7eb;
  --shme-txt: #0f172a;
  --shme-muted: #6b7280;
  --shme-primary: #d61f45;
  --shme-accent: #0ea5e9;
  --shme-radius: 14px;
  --shme-shadow: 0 14px 40px rgb(0 0 0 / 8%);
}


/* =========================================
   HEADER LAYOUT
========================================= */

.shme-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  width: 100%;
  border-bottom: 1px solid var(--shme-border);
  background: var(--shme-bg);
  direction: rtl;
}

.shme-header *,
.shme-header *::before,
.shme-header *::after {
  box-sizing: border-box;
}

.shme-nav {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: min(var(--shme-max), calc(100% - 32px));
  margin-inline: auto;
  padding: 10px 0;
}


/* =========================================
   BRAND AND LOGO
========================================= */

.shme-brand {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 10px;
  min-width: 0;
  color: #07080d;
  text-decoration: none;
}

.shme-brand-logo {
  display: grid;
  flex: 0 0 40px;
  place-items: center;
  width: 40px;
  height: 40px;
  overflow: hidden;
  border-radius: 50%;
}

.shme-brand-logo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.shme-brand-title {
  color: #07080d;
  font-size: var(--shamsa-fs-header, var(--shamsa-fs-body));
  font-weight: 800;
  white-space: nowrap;
}

.shamsa-footer .shamsa-footer__column h2,
.shamsa-footer .shamsa-footer__column h3 {
	color: #fff !important;
}

/* =========================================
   DESKTOP NAVIGATION
========================================= */

.shme-phone-divider {
  flex: 0 0 1px;
  width: 1px;
  height: 22px;
  background: var(--shme-border);
}

.shme-nav-main {
  display: flex;
  flex: 1 1 0;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-width: 0;
}

.shme-item {
  position: relative;
  flex: 0 0 auto;
}

.shme-link {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 10px 8px;
  border-radius: 10px;
  color: #07080D;
  font-size: var(--shamsa-fs-header, var(--shamsa-fs-body));
  font-weight: 400;
  line-height: 1.5;
  text-decoration: none;
  white-space: nowrap;
}

.shme-link:hover {
  background: var(--shme-surface);
}


.shamsa-footer__brand {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 12px;
}

.shamsa-footer__brand > a {
	display: block;
	flex: 0 0 77px;
	width: 77px;
	height: 77px;
}

.shamsa-footer__brand img {
	display: block;
	width: 77px;
	height: 77px;
	object-fit: contain;
}

.shamsa-footer__brand h2 {
	margin: 0;
	font-family: shamsafont, Tahoma, Arial, sans-serif;
	font-size: var(--shamsa-fs-card);
	font-weight: 700;
	line-height: 32px;
	color: #dfe0da;
}


.shme-link svg {
  flex: 0 0 auto;
  transition: transform 0.2s ease;
}

.shme-has-mega:hover > .shme-link svg,
.shme-has-mega:focus-within > .shme-link svg {
  transform: rotate(180deg);
}


/* =========================================
   DESKTOP MEGA MENU
========================================= */

.shme-has-mega {
  position: static;
}

.shme-has-mega > .shme-mega {
  position: absolute;
  top: 100%;
  left: 50%;
  z-index: 1001;
  width: min(1000px, 92vw);
  min-height: 274px;
  padding: 18px;
  transform: translateX(-50%);
  border: 1px solid var(--shme-border);
  border-radius: var(--shme-radius);
  background: #fff;
  box-shadow: var(--shme-shadow);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.2s ease, visibility 0.2s ease;
}

@media (hover: hover) and (min-width: 1001px) {
  .shme-has-mega:hover > .shme-mega,
  .shme-has-mega:focus-within > .shme-mega,
  .shme-has-mega.is-open > .shme-mega {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
}

.shme-has-mega.is-open > .shme-mega {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

@media (prefers-reduced-motion: reduce) {
  .shme-has-mega > .shme-mega,
  .shme-mobile-submenu-toggle svg,
  .shme-mobile-nested-toggle svg {
    transition: none;
  }
}

.shme-mega-row {
  display: flex;
  min-height: 237px;
  align-items: stretch;
  gap: 18px;
  direction: ltr;
}

.shme-col {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px;
  border-radius: 12px;
  box-sizing: border-box;
}

.shme-left {
  flex: 1.2 1 0;
  align-self: flex-start;
  min-width: 100px;
  min-height: 237px;
  border: none;
}

.shme-mid {
  flex: 1 1 0;
  min-width: 0;
  max-height: min(70vh, 520px);
  overflow-y: auto;
}

.shme-category-panel--static + .shme-category-panel--static,
.shme-category-panel[data-mega-content]:not([hidden]) + .shme-category-panel--static {
  margin-top: 2px;
  padding-top: 8px;
  border-top: 1px solid var(--shme-border, #e7e7eb);
}

.shme-right {
  flex: 0.8 1 0;
  min-width: 180px;
  gap: 10px;
  background: #f4f4f4;
}

.shme-left [dir],
.shme-mid [dir],
.shme-right [dir] {
  direction: rtl;
}


/* =========================================
   MEGA MENU FEATURED CONTENT
========================================= */

.shme-badge {
  display: flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  color: #07080d;
  font-size: var(--shamsa-fs-meta);
  font-weight: 700;
}

.shme-left .shme-badge span {
  margin-right: 10px;
}

.shme-hero {
  display: block;
  flex: 0 0 auto;
  width: 100%;
  height: 180px;
  min-height: 180px;
  max-height: 180px;
  overflow: hidden;
  border-radius: 10px;
}

.shme-hero img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.shme-hero--placeholder {
  display: grid;
  place-items: center;
  background-color: #173c34;
  background-image:
    linear-gradient(180deg, rgb(10 20 29 / 7%) 18%, rgb(10 20 29 / 23%) 46%, rgb(10 20 29 / 78%) 100%),
    linear-gradient(145deg, #067b52, #00543e 54%, #111827);
  color: rgb(255 255 255 / 75%);
}

.shme-course-card {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  width: 100%;
  height: 180px;
  min-height: 180px;
  max-height: 180px;
  align-items: flex-end;
  color: #fff;
  background-color: #173c34;
  background-image: linear-gradient(145deg, #067b52, #00543e 54%, #111827);
  text-decoration: none;
}

.shme-course-card.is-no-image {
  background-image:
    linear-gradient(180deg, rgb(10 20 29 / 7%) 18%, rgb(10 20 29 / 23%) 46%, rgb(10 20 29 / 78%) 100%),
    linear-gradient(122deg, transparent 0 24%, rgb(0 0 0 / 8%) 24.2% 39%, transparent 39.2% 52%, rgb(0 0 0 / 9%) 52.2% 68%, transparent 68.2%),
    linear-gradient(145deg, #067b52, #00543e 54%, #111827);
}

.shme-course-card::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgb(0 0 0 / 8%) 25%, rgb(0 0 0 / 72%) 100%);
  content: "";
}

.shme-course-card img {
  position: absolute;
  inset: 0;
  min-height: 0;
  object-fit: cover;
  transition: transform .25s ease;
}

.shme-course-card:hover img {
  transform: scale(1.04);
}

.shme-course-card__label,
.shme-course-card__footer {
  position: absolute;
  z-index: 1;
}

.shme-course-card__label {
  top: 10px;
  right: 10px;
  max-width: calc(100% - 20px);
  overflow: hidden;
  padding: 4px 10px;
  border: 1px solid rgb(255 255 255 / 45%);
  border-radius: 20px;
  background: rgb(255 255 255 / 18%);
  color: #fff;
  font-size: var(--shamsa-fs-meta-sm);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.shme-course-card__footer {
  right: 12px;
  bottom: 12px;
  left: 12px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px;
}

.shme-course-card__title {
  display: -webkit-box;
  overflow: hidden;
  font-size: var(--shamsa-fs-button);
  font-weight: 700;
  line-height: 1.7;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.shme-course-card__arrow {
  flex: 0 0 auto;
  font-size: var(--shamsa-fs-h3);
  line-height: 1;
}

.shme-hero--placeholder svg {
  width: 96px;
  max-width: 50%;
  height: auto;
}


/* =========================================
   MEGA MENU CATEGORIES
========================================= */

.shme-all-categories {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  justify-content: flex-start;
}

.shme-category-panel {
  display: flex;
  min-width: 0;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 4px;
}

.shme-category-panel[hidden] {
  display: none !important;
}

.shme-category-links {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.shme-category-title {
  display: block;
  padding: 4px 8px;
  color: #07080d;
  font-weight: 700;
  text-decoration: none;
}

.shme-category-child-title {
  display: block;
  padding: 3px 0;
  color: #424b62;
  font-weight: 700;
  text-decoration: none;
}

.shme-category-title:hover {
  color: var(--shme-primary);
}

.shme-all-categories .shme-category-list {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 2px 10px;
}

.shme-category-list > a {
  flex: 0 0 calc(50% - 5px);
  box-sizing: border-box;
  padding: 4px 8px;
  line-height: 1.45;
  color: #07080d;
  text-decoration: none;
}

.shme-category-list > a::before {
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-left: 6px;
  border-radius: 50%;
  background: #07080d;
  content: "";
}

.shme-category-list > a:hover,
.shme-nested-links a:hover {
  color: var(--shme-primary);
}

.shme-nested-links {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding-inline-start: 16px;
}

.shme-nested-links a {
  display: block;
  padding: 3px 8px;
  line-height: 1.45;
  color: var(--shme-muted);
  text-decoration: none;
}


/* =========================================
   MEGA MENU CATEGORY LINKS
========================================= */

.shme-tabs {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.shme-tab-btn {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: #fff;
  color: #737373;
  cursor: pointer;
  font: inherit;
  font-weight: 500;
  text-align: center;
  text-decoration: none;
  transition: border-color .18s ease, color .18s ease, background-color .18s ease;
}

.shme-tab-btn:hover,
.shme-tab-btn[aria-selected="true"] {
  border-color: var(--shme-primary);
  color: var(--shme-txt);
}

.shme-tab-btn[aria-selected="true"] {
  background: #f8f8f8;
}

.shme-tab-btn:focus-visible {
  outline: 2px solid var(--shme-primary);
  outline-offset: 2px;
}

.shme-tab-btn span {
  margin-right: 0;
}

.shme-tab-btn svg {
  flex: 0 0 20px;
}


/* =========================================
   HEADER ACTIONS
========================================= */

.shme-actions {
  display: flex;
  flex: 0 0 auto;
  flex-shrink: 0;
  align-items: center;
  gap: 14px;
  margin-inline-start: 4px;
  padding-inline-start: 14px;
  border-inline-start: 1px solid var(--shme-border);
  background: var(--shme-bg, #fff);
  position: relative;
  z-index: 2;
}

.shme-actions-divider {
  flex: 0 0 1px;
  width: 1px;
  height: 24px;
  background: var(--shme-border);
}

.shme-phone {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  text-decoration: none;
}

.shme-phone-icon {
  flex: 0 0 24px;
}

.shme-phone-number {
  color: #2a3352;
  font-size: var(--shamsa-fs-header, var(--shamsa-fs-body));
  font-weight: 800;
  line-height: 1.5;
  white-space: nowrap;
}

.shme-phone-code {
  color: var(--shme-primary);
}

.shme-cta {
  flex: 0 0 auto;
  margin: 0;
  padding: 10px 16px;
  border: none;
  border-radius: 12px;
  background: #c71e31;
  color: #fff;
  font-size: var(--shamsa-fs-header, var(--shamsa-fs-body));
  font-weight: 700;
  line-height: 1.5;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.shme-cta__short {
  display: none;
}

.shme-cta:hover,
.shme-cta:focus-visible {
  transform: translateY(-1px);
  background: #c71e31;
  color: #fff;
}


/* =========================================
   MOBILE BURGER BUTTON
========================================= */

.shme-burger {
  display: none;
  flex: 0 0 40px;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: var(--shme-txt);
  cursor: pointer;
}

.shme-burger-lines,
.shme-burger-lines::before,
.shme-burger-lines::after {
  position: relative;
  display: block;
  width: 18px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
  content: "";
}

.shme-burger-lines::before,
.shme-burger-lines::after {
  position: absolute;
  right: 0;
}

.shme-burger-lines::before {
  top: -6px;
}

.shme-burger-lines::after {
  top: 6px;
}


/* =========================================
   MOBILE MENU CONTAINER
========================================= */

.shme-header .shme-nav-mobile {
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  z-index: 1002;
  display: block;
  width: 100%;
  max-height: calc(100vh - 70px);
  overflow-x: hidden;
  overflow-y: auto;
  padding: 8px 16px 20px;
  border-top: 1px solid var(--shme-border);
  background: #fff;
  box-shadow: var(--shme-shadow);
  direction: rtl;
  text-align: right;
}

/* Keep all hidden menu panels hidden regardless of other display rules. */
.shme-header .shme-nav-mobile[hidden],
.shme-header .shme-nav-mobile [hidden] {
  display: none !important;
}

/* Prevent mobile navigation from appearing on desktop. */
@media (min-width: 1001px) {
  .shme-header .shme-nav-mobile {
    display: none !important;
  }
}


/* =========================================
   MOBILE MENU ITEMS
========================================= */

.shme-mobile-item {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  border-bottom: 1px solid var(--shme-border);
}

.shme-mobile-item-row,
.shme-mobile-category-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
}

.shme-mobile-icon {
  display: grid;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  place-items: center;
  color: #2a3352;
}

.shme-mobile-icon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.6;
}

.shme-mobile-item:first-child .shme-mobile-icon svg {
  fill: var(--shme-primary);
  stroke: var(--shme-primary);
}

.shme-mobile-icon--small {
  width: 20px;
  height: 20px;
  flex-basis: 20px;
  color: #737373;
}

.shme-mobile-icon--small svg {
  width: 18px;
  height: 18px;
}

.shme-mobile-link,
.shme-mobile-category-row > a {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  padding: 12px 0;
  color: #07080d;
  line-height: 1.8;
  text-decoration: none;
}

.shme-mobile-link {
  font-size: var(--shamsa-fs-meta);
}

.shme-mobile-category-row > a {
  color: #424b62;
  font-size: var(--shamsa-fs-meta-sm);
}

.shme-mobile-link:hover,
.shme-mobile-category-row > a:hover {
  color: var(--shme-primary);
}


/* =========================================
   MOBILE SUBMENU TOGGLE BUTTONS
========================================= */

.shme-mobile-submenu-toggle,
.shme-mobile-nested-toggle {
  display: inline-flex;
  flex: 0 0 44px;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--shme-txt);
  cursor: pointer;
}

.shme-mobile-submenu-toggle svg,
.shme-mobile-nested-toggle svg {
  display: block;
  transition: transform 0.2s ease;
}

/* Rotate the arrow when its submenu is expanded. */
.shme-mobile-submenu-toggle[aria-expanded="true"] svg,
.shme-mobile-nested-toggle[aria-expanded="true"] svg {
  transform: rotate(180deg);
}


/* =========================================
   MOBILE FIRST-LEVEL SUBMENU
========================================= */

.shme-mobile-submenu {
  display: block;
  padding: 0 12px 10px 0;
  border-right: 2px solid #f0e1e3;
}

.shme-mobile-category {
  display: block;
  width: 100%;
  padding-block: 4px;
}

.shme-mobile-category-row {
  border-bottom: 1px solid #f3f3f3;
}


/* =========================================
   MOBILE NESTED SUBMENU
========================================= */

.shme-mobile-submenu-nested {
  display: block;
  padding: 4px 12px 10px 0;
}

.shme-mobile-submenu-nested a {
  display: block;
  padding: 9px 0;
  color: #5b6273;
  font-size: var(--shamsa-fs-meta-sm);
  line-height: 1.9;
  text-decoration: none;
}

.shme-mobile-submenu-nested a:hover {
  color: var(--shme-primary);
}


/* =========================================
   MOBILE PHONE AND CTA
========================================= */

.shme-mobile-phone {
  display: block;
  margin-top: 16px;
  padding: 12px 0;
  color: #2a3352;
  font-size: var(--shamsa-fs-meta);
  text-decoration: none;
}

.shme-mobile-cta {
  display: block;
  margin-top: 10px;
  padding: 12px 16px;
  border-radius: 12px;
  background: #c71e31;
  color: #fff;
  font-size: var(--shamsa-fs-meta);
  font-weight: 700;
  text-align: center;
  text-decoration: none;
}

.shme-mobile-cta:hover {
  filter: brightness(0.95);
}


/* =========================================
   KEYBOARD FOCUS
========================================= */

.shme-header a:focus-visible,
.shme-header button:focus-visible {
  outline: 2px solid var(--shme-primary);
  outline-offset: 3px;
}


/* =========================================
   TABLET AND MOBILE BREAKPOINT
========================================= */

@media (max-width: 1000px) {
  .shme-nav {
    gap: 8px;
    width: calc(100% - 24px);
    overflow: hidden;
  }

  .shme-brand {
    flex: 1 1 auto;
    min-width: 0;
  }

  .shme-brand-title {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .shme-nav-main {
    display: none !important;
  }

  .shme-phone-number,
  .shme-actions-divider {
    display: none !important;
  }

  .shme-actions {
    flex: 0 0 auto;
    flex-shrink: 0;
    gap: 6px;
    margin-inline-start: 0;
    padding-inline-start: 0;
    border-inline-start: 0;
  }

  /* Compact CTA to the right of phone; burger always stays on-screen. */
  .shme-cta {
    order: 1;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-height: 32px;
    max-width: none;
    padding: 6px 10px;
    border-radius: 8px;
    font-size: 0.75rem;
    line-height: 1.2;
  }

  .shme-cta__full {
    display: none;
  }

  .shme-cta__short {
    display: inline;
  }

  .shme-phone {
    order: 2;
    flex: 0 0 auto;
    padding: 2px;
  }

  .shme-burger {
    order: 3;
    flex: 0 0 40px;
    display: inline-flex !important;
  }

  .shme-mega {
    display: none !important;
  }
}


/* =========================================
   SMALL MOBILE SCREENS
========================================= */

@media (max-width: 720px) {
  .shme-nav {
    width: calc(100% - 24px);
  }

  .shme-brand {
    gap: 8px;
  }

  .shme-brand-logo {
    flex-basis: 36px;
    width: 36px;
    height: 36px;
  }

  .shme-brand-title {
    max-width: 120px;
    overflow: hidden;
    font-size: var(--shamsa-fs-meta-sm);
    text-overflow: ellipsis;
  }

  .shme-mega-row {
    flex-direction: column;
  }

  .shme-mid,
  .shme-right {
    min-width: 0;
  }

  .shme-category-list > a {
    flex: 1 1 100%;
  }

  .shme-header .shme-nav-mobile {
    max-height: calc(100vh - 60px);
    padding-right: 14px;
    padding-left: 14px;
  }

  .shamsa-footer__inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 14px;
  }

  .shamsa-footer__column {
    min-width: 0;
  }
}


/* =========================================
   EXTRA SMALL SCREENS
========================================= */

@media (max-width: 380px) {
  .shme-nav {
    width: calc(100% - 20px);
    gap: 8px;
  }

  .shme-brand {
    gap: 6px;
  }

  .shme-brand-title {
    max-width: 100px;
    font-size: var(--shamsa-fs-meta-sm);
  }

  .shme-actions {
    gap: 4px;
  }

  .shme-cta {
    min-height: 30px;
    padding: 5px 8px;
    font-size: 0.6875rem;
  }

  .shme-burger {
    flex-basis: 36px;
    width: 36px;
    height: 36px;
  }
}


/* =========================================
   LEGACY SHAMSA HEADER MOBILE SUPPORT
========================================= */

@media (max-width: 760px) {
  .shamsa-header__nav,
  .shamsa-header__actions .shamsa-button {
    display: none;
  }

  .shamsa-header__top,
  .shamsa-header__top-inner {
    min-height: 28px;
  }

  .shamsa-header__main {
    width: calc(100% - 24px);
    min-height: 56px;
    gap: 8px;
  }

  .shamsa-brand {
    order: 1;
  }

  .shamsa-menu-toggle {
    order: 2;
  }

  .shamsa-header__nav {
    order: 3;
  }

  .shamsa-header__actions {
    order: 4;
    margin: 0;
  }

  .shamsa-brand img {
    max-width: 36px;
    max-height: 36px;
  }

  .shamsa-menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 0;
    background: transparent;
    color: var(--shamsa-color-navy);
    font-size: var(--shamsa-fs-h2-lg);
  }

  .shamsa-header__nav.is-open {
    position: absolute;
    top: 56px;
    inset-inline: 0;
    z-index: 5;
    display: block;
    width: 100%;
    padding: 12px 16px 20px;
    background: #fff;
    box-shadow: 0 12px 22px rgb(20 25 40 / 10%);
  }

  .shamsa-header__nav:not(.is-open) {
    display: none;
  }

  .shamsa-header__nav.is-open .shamsa-menu {
    align-items: stretch;
    flex-direction: column;
    gap: 0;
  }

  .shamsa-header__nav.is-open .shamsa-menu a {
    display: block;
    padding: 10px 0;
    border-bottom: 1px solid var(--shamsa-color-border);
  }

  .shamsa-header__nav.is-open .shamsa-menu-item--mega {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 32px;
    align-items: center;
  }

  .shamsa-header__nav.is-open .shamsa-menu-item--mega > a {
    grid-column: 1;
    grid-row: 1;
  }

  .shamsa-header__nav.is-open .shamsa-submenu-toggle {
    grid-column: 2;
    grid-row: 1;
  }

  .shamsa-header__nav.is-open .shamsa-mega-menu {
    position: static;
    grid-column: 1 / -1;
    grid-template-columns: 1fr;
    width: 100%;
    gap: 0;
    padding: 0 8px 8px;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
  }

  .shamsa-header__nav.is-open .shamsa-mega-menu__featured {
    display: none;
  }

  .shamsa-header__nav.is-open .shamsa-mega-menu__groups {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .shamsa-header__nav.is-open .shamsa-mega-menu__heading {
    padding: 8px 4px;
    border-bottom: 1px solid var(--shamsa-color-border);
    background: transparent;
  }

  .shamsa-header__nav.is-open .shamsa-mega-menu__links {
    padding-bottom: 8px;
  }

  .shamsa-mega-backdrop {
    inset-block-start: 56px;
  }
}

/* =========================================
   FIXED MOBILE BOTTOM NAV + CALL BUTTON
   (shamsa.org pattern, theme colors)
========================================= */

.shamsa-callbtn,
.shamsa-mobile-nav {
  display: none;
}

@media (max-width: 1000px) {
  .shamsa-callbtn {
    position: fixed;
    left: 20px;
    bottom: calc(78px + env(safe-area-inset-bottom, 0px));
    z-index: calc(var(--shamsa-z-sticky, 200) + 20);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 9.5em;
    height: 2.15em;
    padding: 0 14px;
    border-radius: 999px;
    background: #ffcf0e;
    color: #122d40;
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 6px 18px rgba(18, 45, 64, 0.18);
    direction: ltr;
  }

  .shamsa-callbtn__icon {
    flex-shrink: 0;
  }

  .shamsa-callbtn__number {
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
  }

  .shamsa-mobile-nav {
    position: fixed;
    inset-inline: 0;
    bottom: 0;
    z-index: calc(var(--shamsa-z-sticky, 200) + 10);
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 4px;
    width: 100%;
    padding: 0 6px;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    box-sizing: border-box;
    background: #2a3352;
    box-shadow: 0 -6px 22px rgba(20, 25, 40, 0.18);
    direction: rtl;
  }

  .shamsa-mobile-nav__link {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    margin: 0 2px;
    padding: 12px 6px 14px;
    border-radius: 20px 20px 0 0;
    color: rgba(255, 255, 255, 0.88);
    text-align: center;
    text-decoration: none;
    box-sizing: border-box;
    transition:
      color 0.2s ease,
      background-color 0.2s ease,
      margin-top 0.2s ease,
      padding-bottom 0.2s ease,
      box-shadow 0.2s ease;
  }

  .shamsa-mobile-nav__link:hover,
  .shamsa-mobile-nav__link.is-active {
    color: #2a3352;
    background: var(--shamsa-color-primary, #d51f3b);
    margin-top: -15px;
    padding-bottom: 22px;
    box-shadow: 0 8px 18px rgba(213, 31, 59, 0.28);
  }

  .shamsa-mobile-nav__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
  }

  .shamsa-mobile-nav__icon svg {
    width: 100%;
    height: 100%;
  }

  .shamsa-mobile-nav__label {
    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1.25;
  }

  body {
    padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
  }

  body.shme-nav-locked .shamsa-mobile-nav,
  body.shme-nav-locked .shamsa-callbtn {
    visibility: hidden;
    pointer-events: none;
  }
}





















/* Apply Yekan Bakh across the website */

body,
body button,
body input,
body textarea,
body select,
body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body p,
body a,
body li,
body span,
body label,
body div {
    font-family: var(--shamsa-font, "Yekan Bakh", Tahoma, Arial, sans-serif);
}

footer,
footer * {
    font-family: var(--shamsa-font, "Yekan Bakh", Tahoma, Arial, sans-serif) !important;
}
