/* =========================================================
   Allimoni Academy theme
   Warm cream / crimson / gold look applied on top of the
   default-new theme. Loaded last from includes_top.php.
   ========================================================= */

:root {
  --am-primary: #C8203F;
  --am-primary-dark: #8E1730;
  --am-primary-soft: #FBE3E7;
  --am-cream: #FBF6EC;
  --am-cream-2: #FFFCF6;
  --am-parchment: #F3E9D6;
  --am-gold: #C9A25A;
  --am-gold-soft: #F6EBD3;
  --am-green: #3E7D5A;
  --am-teal: #1F8A8A;
  --am-ink: #2B2B2B;
  --am-muted: #6B645A;
  --am-line: #EADFCB;

  --am-tint-pink: #FCE7EC;
  --am-tint-mint: #E3F4EA;
  --am-tint-lavender: #EEE7FA;
  --am-tint-peach: #FBEEDC;
  --am-tint-sky: #E3F0FA;
  --am-accent-pink: #D6395F;
  --am-accent-mint: #2E9A63;
  --am-accent-lavender: #7A4FC4;
  --am-accent-peach: #B9782B;
  --am-accent-sky: #2D7DC3;

  --am-radius: 16px;
  --am-radius-sm: 10px;
  --am-shadow: 0 6px 22px rgba(94, 64, 24, .08);
  --am-shadow-lg: 0 14px 40px rgba(94, 64, 24, .14);

  /* remap legacy theme tokens */
  --color-4: var(--am-primary);
  --color-7: var(--am-primary-dark);
  --color-12: rgba(200, 32, 63, .15);
  --color-15: rgba(200, 32, 63, .3);
  --color-17: var(--am-primary);
  --bg-white-2: var(--am-cream);
  --border-color: var(--am-line);
  --color-linear: linear-gradient(96deg, #FBF6EC 0%, #FCE7EC 100%);
  --box-shadow: var(--am-shadow);
}

/* ---------- Base ---------- */
body {
  background: var(--am-cream);
  color: var(--am-ink);
  font-family: "Tajawal", serif;
  scrollbar-gutter: stable; /* prevent layout shift when scrollbar appears/disappears */
}
body.dark-theme { background: #1d1a17; }

a { color: var(--am-primary); }
a:hover { color: var(--am-primary-dark); }

::selection { background: var(--am-primary); color: #fff; }

.form-control:focus,
.form-select:focus {
  border-color: var(--am-primary);
  box-shadow: 0 0 0 .2rem rgba(200, 32, 63, .15);
}

.btn-primary,
.btn.btn-primary {
  background: var(--am-primary) !important;
  border-color: var(--am-primary) !important;
  color: #fff !important;
  border-radius: 999px;
}
.btn-primary:hover,
.btn.btn-primary:hover { background: var(--am-primary-dark) !important; border-color: var(--am-primary-dark) !important; }
.btn-outline-primary { color: var(--am-primary); border-color: var(--am-primary); border-radius: 999px; }
.btn-outline-primary:hover { background: var(--am-primary); border-color: var(--am-primary); color: #fff; }
.text-primary { color: var(--am-primary) !important; }
.bg-primary { background-color: var(--am-primary) !important; }
.badge.bg-danger { background-color: var(--am-primary) !important; }

.page-link { color: var(--am-primary); }
.page-item.active .page-link { background: var(--am-primary); border-color: var(--am-primary); }

.accordion-button:not(.collapsed) { color: var(--am-primary-dark); background: var(--am-primary-soft); }
.accordion-button:focus { box-shadow: 0 0 0 .2rem rgba(200, 32, 63, .15); }
.accordion-item { border-color: var(--am-line); }

.nav-pills .nav-link.active { background: var(--am-primary); }

/* legacy hard-coded accent colors */
.menu_pro_btn .btn,
.search-item span:hover,
.popover-btns .purchase-btn,
.h-2-banner .h-2-banner-text .h-2-search-bar .search-btn,
.speech-item-content .inner .title::before { background-color: var(--am-primary); }
.m-search-icon { border-color: var(--am-primary); }
.courses-card-body .courses-text .courses-price .courses-price-right i,
.sing-up-right h3 span,
.sing-up-right .log-in .btn a,
.speech-item-content .no { color: var(--am-primary); }
.grid-view-body .courses-card .courses-text .review-icon span { background-color: var(--am-gold); }
.s_list_one li::before { background-color: rgba(200, 32, 63, .3); }

/* ---------- Shared components ---------- */
.am-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  padding: .7rem 1.6rem;
  border-radius: 999px;
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.2;
  border: 2px solid transparent;
  transition: all .2s ease;
  text-decoration: none;
  white-space: nowrap;
}
.am-btn-primary { background: var(--am-primary); color: #fff; box-shadow: 0 8px 20px rgba(200, 32, 63, .25); }
.am-btn-primary:hover { background: var(--am-primary-dark); color: #fff; transform: translateY(-1px); }
.am-btn-outline { background: #fff; color: var(--am-ink); border-color: var(--am-line); }
.am-btn-outline:hover { border-color: var(--am-primary); color: var(--am-primary); }
.am-btn-light { background: #fff; color: var(--am-green); }
.am-btn-light:hover { color: var(--am-primary); }
.am-btn-sm { padding: .4rem 1.1rem; font-size: .9rem; }
.am-btn .am-btn-ico {
  width: 22px; height: 22px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(255, 255, 255, .22); font-size: .75rem;
}
.am-btn-outline .am-btn-ico { background: var(--am-ink); color: #fff; }

.am-card {
  background: #fff;
  border-radius: var(--am-radius);
  box-shadow: var(--am-shadow);
  border: 1px solid rgba(234, 223, 203, .6);
}

.am-section { padding: 56px 0; }
.am-section-title { text-align: center; margin-bottom: 32px; }
.am-section-title h2 {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  color: var(--am-primary-dark);
  font-weight: 800;
  font-size: clamp(1.6rem, 3vw, 2.3rem);
  margin: 0 0 8px;
}
.am-section-title h2::before,
.am-section-title h2::after {
  content: "";
  width: 30px; height: 30px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%233E7D5A' d='M4 28C6 14 16 5 29 4c-1 13-10 23-25 24z'/%3E%3Cpath fill='none' stroke='%23FBF6EC' stroke-width='1.4' d='M6 26C12 18 18 12 25 8'/%3E%3C/svg%3E") center / contain no-repeat;
  flex-shrink: 0;
}
.am-section-title h2::after { transform: scaleX(-1); }
.am-section-title p { color: var(--am-muted); font-size: 1.05rem; margin: 0; }

/* image slot placeholders (shown until real artwork is uploaded) */
.am-slot {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, var(--am-gold-soft), var(--am-parchment));
}
.am-slot img { width: 100%; height: 100%; object-fit: cover; display: block; }
.am-slot.is-empty::after {
  content: "\f03e";
  font-family: "Font Awesome 6 Free", "Font Awesome 5 Free";
  font-weight: 400;
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 2rem;
  color: rgba(185, 120, 43, .35);
}

/* ---------- Header ---------- */
header .am-topbar {
  background: var(--am-cream-2);
  border-bottom: 1px solid var(--am-line);
  font-size: .9rem;
}
header .am-topbar .container { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 40px; }
header .am-topbar .am-tagline { color: var(--am-primary-dark); font-weight: 700; display: flex; align-items: center; gap: 8px; margin: 0; }
header .am-topbar .am-tagline i { color: var(--am-green); }
header .am-topbar .am-topbar-end { display: flex; align-items: center; gap: 14px; }
.am-socials { display: flex; align-items: center; gap: 8px; list-style: none; margin: 0; padding: 0; }
.am-socials a {
  width: 30px; height: 30px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--am-primary-dark); color: #fff; font-size: .85rem;
  transition: background .2s;
}
.am-socials a:hover { background: var(--am-primary); color: #fff; }
/* language selector – compact pill */
header .am-topbar .language-control .nice-select {
  width: auto !important;
  min-width: 90px;
  height: 28px; line-height: 26px;
  border-radius: 999px;
  border-color: var(--am-line);
  background: rgba(255,255,255,.85);
  font-size: .8rem;
  padding: 0 28px 0 10px;
  color: var(--am-ink);
}
header .am-topbar .language-control .nice-select::after {
  width: 6px; height: 6px; margin-top: -5px; border-color: var(--am-ink);
}
header .am-topbar .language-control .nice-select .list {
  border-radius: 10px; min-width: 110px; font-size: .82rem;
}

.menubar { background: rgba(255, 252, 246, .96); box-shadow: 0 2px 14px rgba(94, 64, 24, .06); }
.menubar .navbar { padding: 10px 0; }
.menubar .logo img { max-height: 58px; width: auto; }
.am-mainnav { display: flex; align-items: center; gap: 0; list-style: none; margin: 0; padding: 0; flex-shrink: 1; }
.am-mainnav > li { position: relative; }
.am-mainnav > li > a {
  display: block;
  padding: 10px 9px;
  color: var(--am-ink);
  font-weight: 600;
  font-size: .95rem;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  text-decoration: none;
}
.am-mainnav > li > a:hover,
.am-mainnav > li > a.active { color: var(--am-primary); border-bottom-color: var(--am-primary); }

/* dropdown menus: hidden by default, revealed on hover */
.am-mainnav li ul.navbarHover,
.am-mainnav li ul.sub-category-menu {
  position: absolute;
  inset-inline-start: 0;   /* RTL: aligns LEFT edge of li → dropdown opens leftward ✓ */
  top: calc(100% + 4px);   /* small gap so hover doesn't break */
  z-index: 1050;
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease, visibility .2s ease, transform .2s ease;
  transform: translateY(-6px);
  list-style: none;
  margin: 0;
  padding: 6px 0;
  min-width: 210px;
  background: #fff;
  border-radius: 12px;
  border-top: 3px solid var(--am-primary);
  box-shadow: 0 8px 28px rgba(43,29,12,.16);
}
.am-mainnav > li:hover > ul.navbarHover,
.am-mainnav > li:focus-within > ul.navbarHover,
.am-mainnav li .dropdown-submenu:hover > ul.sub-category-menu,
.am-mainnav li .dropdown-submenu:focus-within > ul.sub-category-menu {
  opacity: 1; visibility: visible; transform: translateY(0);
}

.am-mainnav > li > a .am-dd-caret { font-size: .7rem; margin-inline-start: 4px; transition: transform .2s ease; }
.am-mainnav > li:hover > a .am-dd-caret { transform: rotate(180deg); }

/* sub-category panel opens beside the main panel (to the left in RTL) */
.am-mainnav li ul.sub-category-menu {
  inset-inline-start: 100%;
  inset-inline-end: auto;
  top: -6px;
  margin-inline-start: 6px;
  min-width: 190px;
  border-top: 3px solid var(--am-primary);
  transform: translateX(-6px);
}
[dir="ltr"] .am-mainnav li ul.sub-category-menu { transform: translateX(6px); }
/* invisible bridge so the pointer can cross the 6px gap */
.am-mainnav li ul.sub-category-menu::before {
  content: ""; position: absolute; top: 0; bottom: 0; width: 8px; inset-inline-end: 100%;
}

/* ── Dropdown items: one row style for every entry ─────────────────── */
.am-mainnav li ul.navbarHover li { position: relative; list-style: none; }
.am-mainnav li ul.navbarHover li > a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  margin: 2px 6px;
  color: var(--am-ink) !important;
  background: transparent;
  font-size: .9rem;
  font-weight: 600;
  white-space: nowrap;
  text-decoration: none;
  border-radius: 8px;
  transition: background .15s, color .15s;
}
.am-mainnav li ul.navbarHover li > a .icons {
  width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--am-cream); color: var(--am-primary); font-size: .8rem;
  transition: background .15s, color .15s;
}
.am-mainnav li ul.navbarHover li > a .text-cat { flex: 1; }
.am-mainnav li ul.navbarHover li > a .has-sub-category {
  float: none; margin-inline-start: auto; line-height: 1; font-size: .75rem; color: var(--am-muted);
}
.am-mainnav li ul.navbarHover li > a:hover,
.am-mainnav li ul.navbarHover li:hover > a,
.am-mainnav li ul.navbarHover li > a:focus-visible {
  background: var(--am-primary-soft);
  color: var(--am-primary) !important;
}
.am-mainnav li ul.navbarHover li:hover > a .icons { background: var(--am-primary); color: #fff; }
.am-mainnav li ul.navbarHover li:hover > a .has-sub-category { color: var(--am-primary); }
.am-mainnav li ul.navbarHover li.am-dd-all { margin-top: 4px; padding-top: 4px; border-top: 1px solid var(--am-line); }
/* nice-select language dropdown: open toward the left in RTL */
header .am-topbar .language-control .nice-select .list {
  inset-inline-start: 0;
  inset-inline-end: auto;
}

.menubar .right-menubar { display: flex; align-items: center; gap: 6px; }
.menubar .right-menubar .am-login-link { color: var(--am-ink); font-weight: 600; margin-inline: 6px; white-space: nowrap; }
.menubar .right-menubar .am-login-link:hover { color: var(--am-primary); }
.menubar .right-menubar .menu_number { background: var(--am-primary); }
.menubar .search-input-button { color: var(--am-ink); }
.menubar .search-input-button:hover { color: var(--am-primary); }

/* ── Desktop navbar fit ──────────────────────────────────────────────
   Bootstrap container caps at 1140px (no xxl in this build).
   8 Arabic nav items + search + cart/login/signup overflows at that
   width, so:
   ≥ 1200 : tighter nav padding, hide inline search, compact signup
            (home overlay already hides search & uses wider container)
   992–1199 : collapse to mobile hamburger nav
   ─────────────────────────────────────────────────────────────────── */
@media (min-width: 1200px) {
  .am-mainnav > li > a { padding: 10px 6px; font-size: .88rem; }
  .menubar .d-lg-flex.align-items-center { display: none !important; }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .menubar .navbar-collapse { display: none !important; }
  .menubar .menu-offcanves { display: flex !important; }
}
@media (max-width: 991.98px) {
  header.am-header-overlay .menubar { position: static; padding-top: 0; background: rgba(255, 252, 246, .96); }
  header.am-header-overlay .menubar .navbar > .container { border-radius: 0; box-shadow: none; background: transparent; }
  .am-mainnav { display: none; }
  header .am-topbar .am-tagline span { display: none; }
}

/* mobile offcanvas */
.mobile-view-offcanves .offcanvas { background: var(--am-cream) !important; }
.mobile-view-offcanves .offcanves-btn .signUp-btn { background: var(--am-primary); border-color: var(--am-primary); border-radius: 999px; }
.mobile-view-offcanves .offcanves-btn .logIn-btn { border-radius: 999px; color: var(--am-primary); border-color: var(--am-primary); }
.mobile-view-offcanves .am-offcanvas-nav a {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 18px; color: var(--am-ink); font-weight: 600;
  border-bottom: 1px solid var(--am-line);
}
.mobile-view-offcanves .am-offcanvas-nav a:hover { color: var(--am-primary); background: #fff; }
.mobile-view-offcanves .am-offcanvas-nav i { color: var(--am-primary); width: 18px; text-align: center; }

/* ---------- Footer ---------- */
.footer.am-footer {
  position: relative;
  background: var(--am-cream);
  color: var(--am-ink);
  padding: 0;
  overflow: hidden;
}
.am-footer .am-footer-art {
  height: 180px;
  background: linear-gradient(180deg, var(--am-cream) 0%, var(--am-gold-soft) 100%);
}
.am-footer .am-footer-art.has-image { background-size: cover; background-position: center bottom; }
.am-footer .am-footer-main { background: var(--am-cream-2); border-top: 1px solid var(--am-line); padding: 36px 0 18px; }
.am-footer h1 { color: var(--am-primary-dark); font-size: 1.1rem; font-weight: 800; margin-bottom: 14px; }
.am-footer p { color: var(--am-muted); }
.am-footer ul { list-style: none; padding: 0; }
.am-footer li { margin-bottom: 6px; }
.am-footer a { color: var(--am-ink); }
.am-footer a:hover { color: var(--am-primary); }
/* Social icons on light-cream footer must keep white icon color */
.am-footer .am-socials a { color: #fff; }
.am-footer .am-socials a:hover { color: #fff; }
.am-footer .am-footer-logo { max-height: 60px; width: auto; margin-bottom: 12px; }
.am-footer .am-footer-tag { color: var(--am-primary-dark); font-weight: 700; }
.am-footer .am-newsletter { position: relative; max-width: 480px; }
.am-footer .am-newsletter .form-control {
  border-radius: 999px;
  padding-inline-start: 14px;
  padding-inline-end: 52px;
  border-color: var(--am-line);
  height: 46px;
  font-size: .95rem;
}
/* the footer row caps at Bootstrap's 1140px container on big screens,
   so the 27-char Arabic placeholder only fits when it's its own (smaller) size */
.am-footer .am-newsletter .form-control::placeholder {
  font-size: .85rem;
  text-overflow: ellipsis;
}
.am-footer .am-newsletter button {
  position: absolute; inset-inline-end: 4px; top: 4px;
  width: 38px; height: 38px; border-radius: 50%; border: 0;
  background: var(--am-primary); color: #fff;
}
[dir="rtl"] .am-footer .am-newsletter button i { transform: scaleX(-1); }
.am-footer .am-footer-bottom {
  border-top: 1px solid var(--am-line);
  margin-top: 18px; padding-top: 16px;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px;
}
.am-footer .am-footer-links { display: flex; flex-wrap: wrap; gap: 4px 0; margin: 0; }
.am-footer .am-footer-links li { margin: 0; }
.am-footer .am-footer-links li + li::before { content: "|"; color: var(--am-line); margin-inline: 10px; }
.am-footer .am-copy { color: var(--am-muted); font-size: .9rem; margin: 0; }

/* ══════════════════════════════════════════════════════════════
   Generic page polish – breadcrumb, cards, forms
══════════════════════════════════════════════════════════════ */
.bread-crumb, .breadcrumb-section, .h-1-banner-breadcrumb {
  background: linear-gradient(135deg, var(--am-cream) 0%, var(--am-tint-pink) 100%) !important;
  padding: 28px 0 24px !important;
  border-bottom: 1px solid var(--am-line);
  position: relative;
  overflow: hidden;
}
/* soft radial glow in the inline-end corner */
.bread-crumb::after {
  content: "";
  position: absolute;
  inset-inline-end: -60px; top: -60px;
  width: 240px; height: 240px;
  border-radius: 50%;
  background: radial-gradient(circle, var(--am-primary-soft) 0%, transparent 70%);
  pointer-events: none;
}
.bread-crumb .container,
.bread-crumb > .container { position: relative; z-index: 1; }
.bread-crumb h1 {
  font-family: "Tajawal", serif;
  font-weight: 800;
  font-size: clamp(1.4rem, 3vw, 2rem);
  color: var(--am-ink);
  margin: 6px 0 0;
}
.bread-crumb .breadcrumb {
  background: none !important;
  margin: 0; padding: 0;
}
.bread-crumb .breadcrumb li i { color: var(--am-muted); font-size: .8rem; }
.breadcrumb-item a {
  color: #000 !important; /* changed to black per request (was var(--am-teal)) */
  font-weight: 600;
  text-decoration: none;
}
.breadcrumb-item a:hover { color: var(--am-primary) !important; }
.breadcrumb-item.active span { color: #000; } /* changed to black per request (was var(--am-muted)) */
.bread-crumb .book-img { opacity: .18; }

/* shared cards */
.courses-card-body, .courses-card, .blog-card, .instructor-card, .world-cls-card, .single-blog {
  border-radius: var(--am-radius) !important;
  background: #fff;
}
.courses-card-body:hover, .instructor-card:hover { box-shadow: var(--am-shadow-lg); }
.courses-card .courses-text h5, .courses-card-body h5 { color: var(--am-ink); }
.courses-card .courses-text h5:hover, .courses-card-body h5:hover { color: var(--am-primary); }
h1, h2, h3 { font-family: "Tajawal", serif; }
.courses .courses-head h1, .top-categories h1, .expert-instructor h1, .faq h1, .blog h1 { color: var(--am-primary-dark); }
.sing-up-right, .sign-up-left, .log-in-form, .login-form { border-radius: var(--am-radius); }
.sing-up-right .btn, .sign-up .btn-primary, .log-in .btn { border-radius: 999px; }
.course-sidebar, .course-details-card, .shopping-cart .card, .my-course-1-full-body, .user-dashboard .card {
  border-radius: var(--am-radius) !important;
}
.nav-tabs .nav-link.active { color: var(--am-primary); border-bottom-color: var(--am-primary); }

/* ══════════════════════════════════════════════════════════════
   About Us / Privacy Policy page
══════════════════════════════════════════════════════════════ */
.privacy-policy {
  padding: 48px 0 64px;
  background: var(--am-cream);
}
.privacy-policy .col-12 {
  background: #fff;
  border-radius: var(--am-radius);
  padding: 36px 40px;
  box-shadow: var(--am-shadow);
  border: 1px solid var(--am-line);
}
.privacy-policy h1, .privacy-policy h2, .privacy-policy h3 { color: var(--am-primary-dark); margin-top: 1.4em; }
.privacy-policy p { color: var(--am-ink); line-height: 1.9; }
.privacy-policy img { border-radius: var(--am-radius-sm); max-width: 100%; }

/* ══════════════════════════════════════════════════════════════
   Contact Us page
══════════════════════════════════════════════════════════════ */
.contact-page { padding: 48px 0 64px; background: var(--am-cream); }
.contact-heading { margin-bottom: 28px; }
.contact-heading h3 {
  font-family: "Tajawal", serif;
  font-weight: 800;
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  color: var(--am-ink);
  margin-bottom: 10px;
}
.contact-heading p { color: var(--am-muted); line-height: 1.8; }

/* contact image */
.contact-image { border-radius: var(--am-radius); overflow: hidden; margin-bottom: 24px; }
.contact-image img { width: 100%; height: 240px; object-fit: cover; border-radius: var(--am-radius); }

/* info cards */
.office-time { margin-top: 8px; }
.office-hour {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  background: #fff;
  border: 1px solid var(--am-line);
  border-radius: var(--am-radius-sm);
  padding: 16px;
  font-size: .9rem;
}
.office-hour .icon {
  flex-shrink: 0;
  width: 42px; height: 42px;
  border-radius: 50%;
  background: var(--am-primary-soft);
  display: flex; align-items: center; justify-content: center;
  color: var(--am-primary);
  font-size: 1.05rem;
}
.office-hour-text h4 {
  font-family: "Tajawal", serif;
  font-weight: 700;
  font-size: .95rem;
  color: var(--am-ink);
  margin: 0 0 4px;
}
.office-hour-text { color: var(--am-muted); }

/* contact form */
.form-section {
  background: #fff;
  border-radius: var(--am-radius);
  padding: 32px;
  box-shadow: var(--am-shadow);
  border: 1px solid var(--am-line);
}
.form-section .form-control {
  border-color: var(--am-line);
  border-radius: var(--am-radius-sm);
  padding: 10px 16px;
  font-size: .95rem;
  background: var(--am-cream);
}
.form-section .form-control:focus {
  border-color: var(--am-primary);
  background: #fff;
  box-shadow: 0 0 0 .2rem rgba(200,32,63,.12);
}
.form-section textarea.form-control { min-height: 120px; resize: vertical; }
.form-section .form-btn { margin-top: 18px; }
.form-section .form-btn .btn-primary {
  background: var(--am-primary) !important;
  border-color: var(--am-primary) !important;
  border-radius: 999px !important;
  padding: 10px 32px;
  font-weight: 700;
  font-size: .95rem;
}
.cheack-box .form-check-input:checked { background-color: var(--am-primary); border-color: var(--am-primary); }

/* ══════════════════════════════════════════════════════════════
   Courses listing page
══════════════════════════════════════════════════════════════ */
.grid-view.courses-list-view { padding: 32px 0 64px; background: var(--am-cream); }

/* sidebar */
.course-all-category {
  background: #fff;
  border-radius: var(--am-radius);
  padding: 20px;
  border: 1px solid var(--am-line);
  box-shadow: var(--am-shadow);
  position: sticky;
  top: 90px;
}
.course-all-category .course-category { padding-bottom: 18px; margin-bottom: 18px; border-bottom: 1px solid var(--am-line); }
.course-all-category .course-category:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.course-all-category .course-category h3 {
  font-family: "Tajawal", serif;
  font-weight: 800;
  font-size: 1rem;
  color: var(--am-primary-dark);
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--am-primary-soft);
}
.course-all-category .form-check-input:checked { background-color: var(--am-primary); border-color: var(--am-primary); }
.course-all-category .form-check-label { color: var(--am-ink); font-size: .9rem; cursor: pointer; }
.course-all-category .form-check-label:hover { color: var(--am-primary); }
.course-all-category .show-more a { font-size: .85rem; color: var(--am-teal); font-weight: 600; }
/* star ratings in sidebar */
.course-all-category .course-icon .form-check-icon ul { list-style: none; padding: 0; display: flex; gap: 2px; }
.course-all-category .course-icon .icon-color { color: var(--am-gold); }

/* sort bar */
.list-card-control {
  background: #fff;
  border: 1px solid var(--am-line);
  border-radius: var(--am-radius-sm);
  padding: 10px 16px;
  margin-bottom: 20px;
  gap: 10px;
}
.list-btn {
  width: 36px; height: 36px;
  border-radius: var(--am-radius-sm) !important;
  border: 1px solid var(--am-line) !important;
  color: var(--am-muted) !important;
  padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
}
.list-btn.active, .list-btn:hover {
  background: var(--am-primary-soft) !important;
  border-color: var(--am-primary) !important;
  color: var(--am-primary) !important;
}
.list-card-control p { color: var(--am-muted); font-size: .85rem; margin: 0; }
.list-card-control .select-box .nice-select {
  border-radius: 999px;
  border-color: var(--am-line);
  font-size: .88rem;
  min-width: 160px;
}

/* ══════════════════════════════════════════════════════════════
   Course detail / program page  (.bread-crumb.courses-details)
══════════════════════════════════════════════════════════════ */
.bread-crumb.courses-details {
  background: linear-gradient(135deg, var(--am-ink) 0%, #3a1a2a 100%) !important;
  padding: 40px 0 44px !important;
  border-bottom: none;
}
.bread-crumb.courses-details::after { display: none; }
.bread-crumb.courses-details h1 {
  color: #fff;
  font-size: clamp(1.5rem, 3vw, 2.4rem);
  margin-bottom: 10px;
}
.bread-crumb.courses-details p { color: rgba(255,255,255,.82); }
.bread-crumb.courses-details .created-by-instructor { color: var(--am-gold) !important; }
.bread-crumb.courses-details .course-heading-info { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.bread-crumb.courses-details .info-tag {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: rgba(255,255,255,.1);
  border-radius: 999px;
  padding: 4px 12px;
  font-size: .85rem;
  color: rgba(255,255,255,.9);
}
.bread-crumb.courses-details .info-tag i { color: var(--am-gold); }
.bread-crumb.courses-details .info-tag .fa-star { color: var(--am-gold); }
.bread-crumb.courses-details .info-tag p { margin: 0; color: rgba(255,255,255,.9); font-size: .85rem; }
.bread-crumb.courses-details .info-tag a { color: var(--am-gold); }

/* ══════════════════════════════════════════════════════════════
   Blog listing & sidebar
══════════════════════════════════════════════════════════════ */
.blog-body.blog { padding-bottom: 48px; }
.blog-body.blog .container > h1 {
  font-family: "Tajawal", serif;
  font-weight: 800;
  font-size: clamp(1.5rem, 3vw, 2rem);
  color: var(--am-primary-dark);
  margin-bottom: 6px;
}
.blog-body.blog .container > h1 span { color: var(--am-primary); }
.blog-body.blog > .container > p { color: var(--am-muted); margin-bottom: 28px; }

/* blog hero banner */
.image-placeholder-2 {
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(142,23,48,.65) 0%, rgba(26,26,46,.55) 100%);
}

/* blog sidebar */
.right-section {
  background: #fff;
  border-radius: var(--am-radius);
  padding: 24px;
  border: 1px solid var(--am-line);
  box-shadow: var(--am-shadow);
}
.right-section .search .search-bar {
  margin-bottom: 24px;
}
.right-section .search .search-bar form {
  display: flex;
  align-items: center;
  border: 1.5px solid var(--am-line);
  border-radius: 999px;
  overflow: hidden;
  background: var(--am-cream);
}
.right-section .search .search-bar .form-control {
  border: none !important;
  background: transparent;
  padding: 8px 14px;
  box-shadow: none !important;
}
.right-section .search .search-bar .search-btn {
  background: var(--am-primary);
  border: none;
  color: #fff;
  width: 38px; height: 38px;
  border-radius: 50%;
  margin: 3px;
  flex-shrink: 0;
}
.right-section .title h4 {
  font-family: "Tajawal", serif;
  font-weight: 800;
  font-size: 1rem;
  color: var(--am-primary-dark);
  border-inline-start: 3px solid var(--am-primary);
  padding-inline-start: 10px;
  margin-bottom: 14px;
}
.right-section .categories ul { list-style: none; padding: 0; }
.right-section .categories li {
  padding: 8px 0;
  border-bottom: 1px solid var(--am-line);
  font-size: .9rem;
}
.right-section .categories li:last-child { border-bottom: none; }
.right-section .categories a { color: var(--am-ink); font-weight: 600; text-decoration: none; }
.right-section .categories a:hover { color: var(--am-primary); }
.right-section .categories .badge.bg-primary { background: var(--am-primary) !important; }
.right-section .post {
  padding: 12px 0;
  border-bottom: 1px dashed var(--am-line);
}
.right-section .post:last-child { border-bottom: none; }
.right-section .post h5 { font-size: .9rem; font-weight: 700; color: var(--am-ink); margin-bottom: 4px; }
.right-section .post h5:hover { color: var(--am-primary); }
.right-section .post p { font-size: .8rem; color: var(--am-muted); margin: 0; }
.right-section .post img { border-radius: var(--am-radius-sm); object-fit: cover; width: 100%; aspect-ratio: 4/3; }

/* ---------- Home (home_7) ---------- */
.am-home { background: var(--am-cream); overflow-x: clip; }

/* hero */
.am-hero {
  --am-navy: #163A5F;
  position: relative;
  overflow: hidden;
  padding: 120px 0 34px;
  background:
    radial-gradient(ellipse 40% 55% at 12% 30%, rgba(255, 246, 222, .95), transparent 70%),
    radial-gradient(ellipse 35% 50% at 88% 25%, rgba(255, 250, 238, .9), transparent 70%),
    repeating-linear-gradient(90deg, rgba(201, 162, 90, .06) 0 2px, transparent 2px 60px),
    linear-gradient(180deg, #FFF8EC 0%, #F8EEDC 60%, #F3E6CF 100%);
}
.am-hero.has-bg { background-size: cover; background-position: center; }
.am-hero.has-bg::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(255, 250, 240, .35), rgba(255, 250, 240, .15) 50%, rgba(255, 250, 240, .35));
  pointer-events: none;
}
.am-hero-inner { position: relative; z-index: 1; max-width: 1480px; margin: 0 auto; padding: 0 28px; }
.am-hero-grid {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(200px, .85fr) minmax(400px, 1.65fr) minmax(200px, 280px);
  align-items: end;
  min-height: 520px;
}

/* decorative leaves */
.am-leaf {
  position: absolute; z-index: 0; width: 170px; height: 220px; pointer-events: none; opacity: .9;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 160'%3E%3Cpath d='M60 158 C58 110 62 60 90 6' stroke='%236B8E4E' stroke-width='2' fill='none'/%3E%3Cg fill='%237FA35D'%3E%3Cellipse cx='75' cy='40' rx='7' ry='17' transform='rotate(-35 75 40)'/%3E%3Cellipse cx='92' cy='34' rx='6' ry='15' transform='rotate(40 92 34)'/%3E%3Cellipse cx='64' cy='75' rx='7' ry='18' transform='rotate(-40 64 75)'/%3E%3Cellipse cx='82' cy='70' rx='6' ry='16' transform='rotate(45 82 70)'/%3E%3Cellipse cx='55' cy='108' rx='7' ry='18' transform='rotate(-45 55 108)'/%3E%3Cellipse cx='73' cy='104' rx='6' ry='16' transform='rotate(40 73 104)'/%3E%3Cellipse cx='52' cy='140' rx='6' ry='15' transform='rotate(-40 52 140)'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain;
}
.am-leaf-tr { top: 70px; right: -30px; transform: rotate(-20deg); }
.am-leaf-tl { top: -10px; left: -20px; transform: scaleX(-1) rotate(-15deg); }
.am-leaf-bl { bottom: 40px; left: -40px; transform: scaleX(-1) rotate(30deg); width: 140px; }

/* founder bio card */
.am-founder {
  align-self: center;
  background: rgba(255, 253, 248, .93);
  border-radius: 22px;
  box-shadow: 0 10px 34px rgba(94, 64, 24, .12);
  padding: 26px 24px 22px;
  backdrop-filter: blur(4px);
}
.am-founder-name { font-size: 2.1rem; font-weight: 800; color: var(--am-primary); margin: 0 0 4px; text-align: center; }
.am-founder-role { color: var(--am-teal); font-weight: 700; font-size: 1.05rem; margin: 0 0 16px; text-align: center; }
.am-founder-bio p { color: #2F2A24; font-size: .92rem; line-height: 1.95; margin: 0 0 6px; }
.am-founder-bio p:last-child { margin: 0; }

/* portrait */
.am-hero-portrait { align-self: end; display: flex; justify-content: center; margin-inline-end: -40px; position: relative; z-index: 0; }
.am-hero-portrait img { width: 100%; max-width: 440px; max-height: 560px; object-fit: contain; object-position: bottom; display: block; }
.am-hero-portrait.is-empty {
  height: 460px; width: 100%; max-width: 340px; margin-inline: auto;
  border-radius: 170px 170px 18px 18px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .6), rgba(201, 162, 90, .22));
  align-items: center;
}
.am-hero-portrait.is-empty i { font-size: 7rem; color: rgba(43, 43, 43, .25); }

/* headline */
.am-hero-text { align-self: center; text-align: start; padding: 0 10px 20px; position: relative; z-index: 1; }
.am-hero-text h1 { margin: 0 0 20px; line-height: 1.22; font-weight: 800; }
.am-hero-text h1 .l1 { display: flex; align-items: flex-start; gap: 8px; font-size: clamp(2.6rem, 5vw, 4.6rem); color: var(--am-navy); }
.am-hero-text h1 .l1 .dots { color: var(--am-navy); }
.am-hero-text h1 .l2 { display: block; font-size: clamp(2.6rem, 5vw, 4.6rem); color: #A3123F; }
.am-hero-text h1 .l3 { display: block; font-size: clamp(1.7rem, 3.1vw, 3.4rem); color: #A3123F; white-space: nowrap; }
.am-sprout {
  width: 34px; height: 46px; display: inline-block; margin-top: 6px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 46'%3E%3Cpath d='M17 45 C17 30 17 20 19 10' stroke='%235E8C3E' stroke-width='2' fill='none'/%3E%3Cellipse cx='11' cy='20' rx='6' ry='13' transform='rotate(-25 11 20)' fill='%237FA35D'/%3E%3Cellipse cx='24' cy='14' rx='6' ry='13' transform='rotate(25 24 14)' fill='%2390B86A'/%3E%3C/svg%3E") no-repeat center / contain;
}
.am-hero-text p { color: #2F2A24; font-size: 1.08rem; line-height: 2; max-width: 540px; margin: 0 0 28px; }
.am-hero-ctas { display: flex; flex-wrap: wrap; gap: 14px; justify-content: flex-start; }
@media (min-width: 1100px) { .am-hero-ctas { flex-wrap: nowrap; } .am-hero-ctas .am-btn { white-space: nowrap; } }
.am-btn-lg { padding: .85rem 1.8rem; font-size: 1.1rem; border-radius: 14px; gap: 12px; }
.am-hero .am-btn-primary { background: #D5245A; border-color: #D5245A; box-shadow: 0 8px 20px rgba(213, 36, 90, .28); }
.am-hero .am-btn-primary:hover { background: #B81B4B; border-color: #B81B4B; }
.am-btn-ghost {
  background: rgba(255, 255, 255, .85); color: var(--am-navy);
  border: 1.5px solid var(--am-teal); font-weight: 700;
}
.am-btn-ghost:hover { background: #fff; color: var(--am-navy); }
.am-play {
  width: 30px; height: 30px; border-radius: 50%; background: var(--am-navy); color: #fff;
  display: inline-flex; align-items: center; justify-content: center; font-size: .7rem;
}
.am-play i { transform: scaleX(-1); }

/* arched window + book stack */
.am-hero-books { align-self: stretch; display: flex; flex-direction: column; justify-content: space-between; gap: 18px; }
.am-arch {
  height: 230px; border-radius: 120px 120px 0 0;
  border: 10px solid rgba(255, 253, 248, .95);
  background: linear-gradient(180deg, #F6D9A8 0%, #EED7B5 55%, #DCE6D5 100%);
  display: flex; align-items: flex-end; justify-content: center; overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(201, 162, 90, .35);
}
.am-hero.has-bg .am-arch { visibility: hidden; }
.am-arch i { font-size: 6rem; color: rgba(255, 255, 255, .85); margin-bottom: -6px; }
.am-books-img { width: 100%; object-fit: contain; }
.am-book-stack { display: flex; flex-direction: column; gap: 4px; padding-inline-end: 6%; }
.am-book-stack span {
  position: relative; display: flex; align-items: center; justify-content: center;
  height: 64px; border-radius: 6px 14px 14px 6px;
  box-shadow: 0 6px 12px rgba(40, 25, 10, .25), inset 0 -6px 0 rgba(0, 0, 0, .18), inset 0 4px 0 rgba(255, 255, 255, .08);
}
.am-book-stack span::before,
.am-book-stack span::after {
  content: ""; position: absolute; top: 8px; bottom: 8px; width: 16px;
  border: 2px solid rgba(214, 178, 106, .8); border-radius: 3px;
}
.am-book-stack span::before { right: 12px; }
.am-book-stack span::after  { left: 12px; }
.am-book-stack em {
  font-style: normal; font-weight: 800; font-size: 1.25rem; color: #E9C77F;
  padding: 2px 18px; border: 1.5px solid rgba(214, 178, 106, .7); border-radius: 30px;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .3);
}
.am-book-stack .b1 { background: linear-gradient(180deg, #1F5145, #153A31); margin-inline-start: 4%; }
.am-book-stack .b2 { background: linear-gradient(180deg, #8A2433, #641723); }
.am-book-stack .b3 { background: linear-gradient(180deg, #1D4B48, #133533); margin-inline-start: 2%; }
.am-book-stack .b4 { background: linear-gradient(180deg, #275A43, #1A3F2E); margin-inline-end: -4%; }

/* features strip */
.am-features {
  position: relative; z-index: 2;
  margin: 26px auto 0; max-width: 1380px;
  display: grid; grid-template-columns: repeat(5, 1fr);
  background: rgba(255, 253, 248, .95); border-radius: 22px;
  box-shadow: 0 10px 30px rgba(94, 64, 24, .10);
  padding: 8px 0;
}
.am-feature { text-align: center; padding: 18px 10px; display: flex; flex-direction: column; align-items: center; }
.am-feature + .am-feature { border-inline-start: 1px solid var(--am-line); }
.am-feature i { font-size: 2.2rem; color: #1F8A8A; margin-bottom: 12px; }
.am-feature:nth-child(3) i { color: #D59A3A; }
.am-feature:nth-child(4) i { color: var(--am-navy); }
.am-feature strong { font-weight: 800; font-size: 1.2rem; color: var(--am-navy); line-height: 1.4; }
.am-feature span { font-size: 1rem; color: #4A5560; margin-top: 2px; }

/* navbar floats over the hero on the home page */
@media (min-width: 992px) {
header.am-header-overlay { position: relative; z-index: 30; }
header.am-header-overlay .menubar {
  position: absolute; top: 100%; left: 0; right: 0;
  background: transparent; box-shadow: none; padding-top: 16px;
}
header.am-header-overlay .menubar .navbar { padding: 0; }
header.am-header-overlay .menubar .navbar > .container {
  max-width: 1420px;
  background: rgba(255, 253, 248, .94);
  border-radius: 20px;
  box-shadow: 0 8px 26px rgba(94, 64, 24, .10);
  padding: 8px 22px;
}
header.am-header-overlay .menubar form.d-lg-flex { display: none !important; }
}
.am-signup-btn {
  display: inline-flex !important; align-items: center; gap: 10px; white-space: nowrap; line-height: 1.2 !important;
  background: #D5245A !important; border-color: #D5245A !important;
  border-radius: 12px !important; padding: .55rem 1.1rem .55rem .7rem !important; font-size: 1rem !important;
}
.am-arrow-ring {
  width: 26px; height: 26px; border-radius: 50%; border: 1.5px solid #fff;
  display: inline-flex; align-items: center; justify-content: center; font-size: .75rem;
}

/* hero as a single scalable photo (desktop); HTML hero remains for small screens */
.am-hero-photo { display: none; }
@media (min-width: 992px) {
  .am-hero.has-photo { padding: 0; background: var(--am-cream); }
  .am-hero.has-photo::before { display: none; }
  .am-hero.has-photo .am-hero-inner,
  .am-hero.has-photo .am-leaf { display: none; }
  .am-hero-photo { display: block; position: relative; width: 100%; aspect-ratio: 1672 / 941; }
  .am-hero-photo img { display: block; width: 100%; height: 100%; }
  .am-hotspot {
    position: absolute; top: 64.08%; height: 6.59%;
    border-radius: 1.2% / 18%;
    transition: background-color .2s ease, box-shadow .2s ease, transform .2s ease;
  }
  .am-hotspot-start { left: 40.55%; width: 15.37%; }
  .am-hotspot-about { left: 25.60%; width: 14.06%; }
  .am-hotspot:hover { background: rgba(255, 255, 255, .14); box-shadow: 0 8px 22px rgba(94, 64, 24, .22); transform: translateY(-2px); }
  .am-hotspot:focus-visible { outline: 3px solid #1F8A8A; outline-offset: 3px; }

  /* real navbar sits exactly over the navbar drawn in the photo */
  header.am-header-overlay.am-hero-photo-on { container-type: inline-size; }
  header.am-header-overlay.am-hero-photo-on .menubar { padding-top: 3.2cqw; }
  header.am-header-overlay.am-hero-photo-on .menubar .navbar > .container {
    width: 93.6cqw; max-width: none; min-height: 5.9cqw;
    background: #FFFCF6;
  }
  header.am-header-overlay.am-hero-photo-on .menubar .logo img { max-height: clamp(40px, 3.4cqw, 64px); }

  /* inner pages: same floating bar, same spot, but in normal flow */
  header:not(.am-header-overlay) { container-type: inline-size; background: var(--am-cream); }
  header:not(.am-header-overlay) .menubar {
    position: relative; z-index: 30;
    background: transparent; box-shadow: none;
    padding: 3.2cqw 0 14px;
  }
  header:not(.am-header-overlay) .menubar .navbar { padding: 0; }
  header:not(.am-header-overlay) .menubar .navbar > .container {
    width: 93.6cqw; max-width: none; min-height: 5.9cqw;
    background: #FFFCF6;
    border-radius: 20px;
    box-shadow: 0 8px 26px rgba(94, 64, 24, .10);
    padding: 8px 22px;
  }
  header:not(.am-header-overlay) .menubar .logo img { max-height: clamp(40px, 3.4cqw, 64px); }
}

/* programs */
.am-programs-grid { display: grid; grid-template-columns: repeat(var(--am-cols, 5), 1fr); gap: 18px; }
.am-program .am-slot img { width: 100%; height: 100%; object-fit: cover; display: block; }
.am-program li { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-program {
  --tint: var(--am-tint-sky);
  --accent: var(--am-accent-sky);
  display: flex; flex-direction: column;
  background: var(--tint);
  border-radius: var(--am-radius);
  overflow: hidden;
  box-shadow: var(--am-shadow);
  border: 1px solid rgba(255, 255, 255, .8);
  transition: transform .2s ease, box-shadow .2s ease;
}
.am-program:hover { transform: translateY(-4px); box-shadow: var(--am-shadow-lg); }
.am-program.t-pink { --tint: var(--am-tint-pink); --accent: var(--am-accent-pink); }
.am-program.t-mint { --tint: var(--am-tint-mint); --accent: var(--am-accent-mint); }
.am-program.t-lavender { --tint: var(--am-tint-lavender); --accent: var(--am-accent-lavender); }
.am-program.t-peach { --tint: var(--am-tint-peach); --accent: var(--am-accent-peach); }
.am-program.t-sky { --tint: var(--am-tint-sky); --accent: var(--am-accent-sky); }
.am-program .am-slot { aspect-ratio: 16 / 10; background: linear-gradient(135deg, #fff, var(--tint)); }
.am-program-body { padding: 14px 16px 16px; text-align: center; display: flex; flex-direction: column; flex: 1; }
.am-program h3 { color: var(--am-primary-dark); font-weight: 800; font-size: 1.2rem; margin: 0 0 2px; }
.am-program .am-age { color: var(--accent); font-weight: 700; font-size: .9rem; margin-bottom: 10px; }
.am-program ul { list-style: none; padding: 0; margin: 0 0 14px; text-align: start; flex: 1; }
.am-program li { position: relative; padding-inline-start: 16px; font-size: .9rem; color: var(--am-ink); line-height: 1.75; }
.am-program li::before {
  content: ""; position: absolute; inset-inline-start: 0; top: .7em;
  width: 7px; height: 7px; border-radius: 50%; background: var(--accent);
}
.am-program .am-btn-outline { align-self: center; border-color: var(--accent); color: var(--accent); padding: .35rem 1.4rem; font-size: .9rem; }
.am-program .am-btn-outline:hover { background: var(--accent); color: #fff; }

/* why us */
.am-why-grid { display: grid; grid-template-columns: .9fr 2.2fr 1fr; gap: 22px; align-items: center; }
.am-why-quote {
  padding: 26px 22px;
  background: linear-gradient(160deg, #FFFCF6, var(--am-gold-soft));
  border: 1px solid var(--am-line);
  border-radius: 20px;
  color: var(--am-primary-dark);
  font-weight: 800; font-size: 1.35rem; line-height: 1.8; text-align: center;
}
.am-why-items { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.am-why-item { text-align: center; }
.am-why-item .ico {
  width: 64px; height: 64px; margin: 0 auto 10px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.6rem; color: #fff; box-shadow: var(--am-shadow);
}
.am-why-item:nth-child(1) .ico { background: linear-gradient(135deg, #9A6BE0, #7A4FC4); }
.am-why-item:nth-child(2) .ico { background: linear-gradient(135deg, #5B9BE0, #2D7DC3); }
.am-why-item:nth-child(3) .ico { background: linear-gradient(135deg, #F07C98, #D6395F); }
.am-why-item:nth-child(4) .ico { background: linear-gradient(135deg, #4FC08A, #2E9A63); }
.am-why-item:nth-child(5) .ico { background: linear-gradient(135deg, #E9C06E, #C9A25A); }
.am-why-item span { font-weight: 700; font-size: .92rem; line-height: 1.6; display: block; }
.am-stats { display: grid; grid-template-columns: 1fr 1fr; padding: 8px; }
.am-stat { text-align: center; padding: 14px 6px; }
.am-stat:nth-child(odd) { border-inline-end: 1px solid var(--am-line); }
.am-stat:nth-child(-n+2) { border-bottom: 1px solid var(--am-line); }
.am-stat i { font-size: 1.5rem; color: var(--am-teal); margin-bottom: 4px; display: block; }
.am-stat:nth-child(2) i { color: var(--am-accent-pink); }
.am-stat:nth-child(3) i { color: var(--am-green); }
.am-stat:nth-child(4) i { color: var(--am-gold); }
.am-stat strong { display: block; font-size: 1.5rem; font-weight: 800; color: var(--am-ink); direction: ltr; }
.am-stat span { color: var(--am-muted); font-size: .88rem; }

/* testimonials */
.am-testimonials { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.am-testimonial { padding: 22px 22px 18px; position: relative; display: flex; flex-direction: column; }
.am-testimonial::before {
  content: "\201D"; position: absolute; top: 4px; inset-inline-end: 16px;
  font-size: 4rem; line-height: 1; color: var(--am-gold-soft); font-family: Georgia, serif;
}
.am-stars { color: #F2B01E; font-size: .9rem; margin-bottom: 8px; }
.am-testimonial p { color: var(--am-ink); line-height: 1.9; font-size: .95rem; flex: 1; }
.am-testimonial-author { display: flex; align-items: center; gap: 12px; margin-top: 10px; }
.am-testimonial-author .am-slot { width: 52px; height: 52px; border-radius: 50%; flex-shrink: 0; }
.am-testimonial-author .am-slot.is-empty::after { content: "\f007"; font-weight: 900; font-size: 1.2rem; }
.am-avatar {
  --av-a: var(--am-primary); --av-b: var(--am-primary-dark);
  width: 52px; height: 52px; border-radius: 50%; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--av-a), var(--av-b));
  color: #fff; font-family: "Tajawal", sans-serif; font-weight: 800; font-size: 1.35rem; line-height: 1;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--am-gold);
}
.am-avatar-photo { object-fit: cover; object-position: center 25%; background: var(--am-cream); }
.am-testimonial:nth-child(3n+2) .am-avatar { --av-a: #2BA3A3; --av-b: var(--am-teal); }
.am-testimonial:nth-child(3n+3) .am-avatar { --av-a: #D9B670; --av-b: #A9813B; }
.am-testimonial-author strong { display: block; color: var(--am-primary-dark); }
.am-testimonial-author small { color: var(--am-muted); }

/* CTA band */
.am-cta { padding: 20px 0 56px; }
.am-cta-box {
  max-width: 760px; margin: 0 auto; text-align: center;
  padding: 30px 24px;
  border-radius: 24px;
  background: linear-gradient(135deg, #2F6E55, #1F5868);
  color: #fff; box-shadow: var(--am-shadow-lg);
}
.am-cta-box h2 { font-weight: 800; font-size: clamp(1.5rem, 3vw, 2.1rem); margin: 0 0 6px; color: #fff; }
.am-cta-box p { margin: 0 0 18px; color: rgba(255, 255, 255, .85); font-size: 1.05rem; }
.am-cta-box .am-hero-ctas .am-btn-light i { color: #25D366; font-size: 1.15rem; }

/* home responsive */
@media (max-width: 1399.98px) {
  .am-hero-inner { padding: 0 18px; }
  .am-hero-grid { grid-template-columns: 270px minmax(170px, .8fr) minmax(330px, 1.5fr) 190px; }
  .am-hero-portrait { margin-inline-end: -70px; }
  .am-founder { padding: 20px 18px; }
  .am-founder-name { font-size: 1.8rem; }
  .am-founder-role { font-size: .95rem; }
  .am-founder-bio p { font-size: .85rem; line-height: 1.85; }
  .am-btn-lg { padding: .7rem 1.2rem; font-size: 1rem; }
  .am-book-stack em { font-size: .95rem; padding: 1px 10px; }
  .am-book-stack span { height: 50px; }
  .am-book-stack span::before, .am-book-stack span::after { width: 10px; }
  .am-arch { height: 190px; }
}
@media (max-width: 1099.98px) {
  .am-hero-grid { grid-template-columns: 270px minmax(200px, 1fr) minmax(330px, 1.5fr); }
  .am-hero-books { display: none; }
}
@media (max-width: 1199.98px) {
  .am-programs-grid { grid-template-columns: repeat(3, 1fr); }
  .am-why-grid { grid-template-columns: 1fr 1fr; }
  .am-why-items { grid-column: 1 / -1; order: -1; }
}
@media (max-width: 991.98px) {
  .am-hero { padding-top: 40px; }
  .am-hero-grid { grid-template-columns: 1fr 1fr; min-height: 0; gap: 20px; }
  .am-hero-text { grid-column: 1 / -1; order: -2; text-align: center; }
  .am-hero-text h1 .l1 { justify-content: center; }
  .am-hero-text p { margin-inline: auto; }
  .am-hero-ctas { justify-content: center; }
  .am-hero-portrait { order: -1; margin: 0; }
  .am-hero-books { display: none; }
  .am-founder { grid-column: 1 / -1; }
  .am-features { grid-template-columns: repeat(3, 1fr); }
  .am-feature:nth-child(4) { border-inline-start: 0; }
  .am-feature:nth-child(n+4) { border-top: 1px solid var(--am-line); }
  .am-testimonials { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 767.98px) {
  .am-section { padding: 40px 0; }
  .am-hero-inner { padding: 0 16px; }
  .am-hero-grid { grid-template-columns: 1fr; }
  .am-hero-portrait.is-empty { height: 300px; max-width: 240px; }
  .am-leaf { display: none; }
  .am-features { grid-template-columns: 1fr 1fr; }
  .am-feature, .am-feature + .am-feature { border: 0; border-top: 1px solid var(--am-line); }
  .am-feature:nth-child(-n+2) { border-top: 0; }
  .am-feature:nth-child(even) { border-inline-start: 1px solid var(--am-line); }
  .am-feature:last-child { grid-column: 1 / -1; border-inline-start: 0; }
  .am-programs-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .am-why-grid { grid-template-columns: 1fr; }
  .am-why-items { grid-template-columns: repeat(3, 1fr); row-gap: 18px; }
  .am-testimonials { grid-template-columns: 1fr; }
}
@media (max-width: 479.98px) {
  .am-programs-grid { grid-template-columns: 1fr; }
  .am-why-items { grid-template-columns: repeat(2, 1fr); }
  .am-hero-ctas .am-btn { width: 100%; }
}

/* =========================================================
   Student Dashboard Area
   ========================================================= */

/* ---------- Wrapper background ---------- */
.wish-list-body {
  background: var(--am-cream) !important;
  padding: 40px 0 64px;
}

/* ---------- Sidebar card ---------- */
.wish-list-body .wish-list-search {
  background: #fff !important;
  border-radius: var(--am-radius) !important;
  border: 1px solid var(--am-line) !important;
  box-shadow: var(--am-shadow) !important;
  padding: 0 !important;
  overflow: hidden;
  position: sticky;
  top: 90px;
  margin-top: 0 !important;
}

/* Profile info header strip */
.wish-list-body .wish-list-search .student-profile-info {
  background: linear-gradient(135deg, var(--am-cream) 0%, var(--am-tint-pink) 100%);
  padding: 24px 20px 18px;
  text-align: center;
  border-bottom: 1px solid var(--am-line);
}
.wish-list-body .wish-list-search .student-profile-info img {
  width: 84px;
  height: 84px;
  border-radius: 50%;
  border: 3px solid #fff;
  outline: 2px solid var(--am-gold);
  object-fit: cover;
  margin-bottom: 10px;
  display: block;
  margin-inline: auto;
}
.wish-list-body .wish-list-search .student-profile-info h5 {
  font-family: 'Tajawal', sans-serif;
  font-weight: 800;
  font-size: 15px;
  color: var(--am-ink);
  margin-bottom: 4px;
}
.wish-list-body .wish-list-search .student-profile-info p,
.wish-list-body .wish-list-search .student-profile-info small {
  font-size: 12px;
  color: var(--am-muted);
  word-break: break-all;
}

/* Menu items */
.wish-list-body .wish-list-search .wish-list-course {
  padding: 12px 12px;
}
.wish-list-body .wish-list-search .wish-list-course .btn-profile-menu,
.wish-list-body .wish-list-search .wish-list-course .my-cosre {
  display: flex !important;
  align-items: center;
  padding: 10px 16px;
  border-radius: var(--am-radius-sm);
  background: transparent !important;
  color: var(--am-ink) !important;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 2px;
  transition: background .18s, color .18s;
  border-inline-start: 3px solid transparent;
  margin-top: 0 !important;
}
.wish-list-body .wish-list-search .wish-list-course .btn-profile-menu i,
.wish-list-body .wish-list-search .wish-list-course .my-cosre i {
  color: var(--am-muted);
  font-size: 16px;
  margin-inline-end: 10px;
  width: 20px;
  text-align: center;
  flex-shrink: 0;
  transition: color .18s;
}
.wish-list-body .wish-list-search .wish-list-course .btn-profile-menu:hover,
.wish-list-body .wish-list-search .wish-list-course .my-cosre:hover {
  background: var(--am-cream) !important;
  color: var(--am-primary) !important;
}
.wish-list-body .wish-list-search .wish-list-course .btn-profile-menu:hover i,
.wish-list-body .wish-list-search .wish-list-course .my-cosre:hover i {
  color: var(--am-primary);
}
.wish-list-body .wish-list-search .wish-list-course .btn-profile-menu.active,
.wish-list-body .wish-list-search .wish-list-course .my-cosre.active {
  background: var(--am-primary-soft) !important;
  color: var(--am-primary) !important;
  border-inline-start: 3px solid var(--am-primary);
}
.wish-list-body .wish-list-search .wish-list-course .btn-profile-menu.active i,
.wish-list-body .wish-list-search .wish-list-course .my-cosre.active i {
  color: var(--am-primary);
}
/* Unread badge inside sidebar */
.wish-list-body .wish-list-search .wish-list-course .badge {
  margin-inline-start: auto;
  background: var(--am-primary) !important;
  color: #fff !important;
  border-radius: 999px;
  font-size: 10px;
  padding: 2px 7px;
}

/* ---------- My Courses content area ---------- */
.my-course-1-full-body {
  background: #fff;
  border-radius: var(--am-radius);
  border: 1px solid var(--am-line);
  box-shadow: var(--am-shadow);
  padding: 28px 24px;
}
.my-course-1-full-body h1 {
  font-family: 'Tajawal', sans-serif !important;
  font-weight: 800 !important;
  font-size: 20px !important;
  color: var(--am-ink) !important;
  border-inline-start: 4px solid var(--am-primary);
  padding-inline-start: 12px;
  margin-bottom: 24px !important;
}

/* Course card */
.my-course-1-full-body .my-course-1-full-body-card {
  display: flex;
  gap: 20px;
  background: var(--am-cream-2);
  border-radius: var(--am-radius-sm);
  border: 1px solid var(--am-line);
  padding: 16px;
  margin-bottom: 14px !important;
  transition: box-shadow .2s, background .2s;
  cursor: pointer;
}
.my-course-1-full-body .my-course-1-full-body-card:hover {
  box-shadow: var(--am-shadow-lg);
  background: #fff;
}
.my-course-1-full-body .my-course-1-full-body-card:last-child {
  margin-bottom: 0 !important;
}
.my-course-1-full-body .my-course-1-full-body-card .my-course-1-img img {
  border-radius: var(--am-radius-sm);
  object-fit: cover;
  width: 200px;
  height: 130px;
  flex-shrink: 0;
}
.my-course-1-full-body .my-course-1-full-body-card .my-course-1-text {
  margin-left: 0 !important;
  flex: 1;
}
.my-course-1-full-body .my-course-1-full-body-card .my-course-1-text .my-course-1-text-heading h3 {
  font-family: 'Tajawal', sans-serif;
  font-weight: 700;
  font-size: 15px;
  color: var(--am-ink);
}

/* Meta icon chips */
.my-course-1-lesson-text .icon-1 {
  display: flex;
  align-items: center;
  gap: 4px;
  background: var(--am-cream);
  border-radius: 999px;
  padding: 3px 10px;
  margin-inline-end: 8px !important;
  margin-top: 0 !important;
}
.my-course-1-lesson-text .icon-1 p {
  font-size: 11px !important;
  color: var(--am-muted);
  margin: 0 !important;
}
.my-course-1-lesson-text .icon-1 i {
  color: var(--am-teal);
}

/* Progress bar */
.skill-bar-container {
  background-color: var(--am-line) !important;
  height: 8px !important;
  border-radius: 999px !important;
  overflow: hidden;
}
.skill-bar {
  background: linear-gradient(90deg, var(--am-primary) 0%, var(--am-gold) 100%) !important;
  height: 8px !important;
  border-radius: 999px !important;
}

/* Course card CTA + instructor row */
.my-course-1-last .my-course-1-btn .btn {
  background: var(--am-primary) !important;
  color: #fff !important;
  border-radius: 999px !important;
  border: none !important;
  padding: 6px 20px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}
.my-course-1-last .my-course-1-btn .btn a {
  color: #fff !important;
}
.my-course-1-last .icon-img img {
  border: 2px solid var(--am-line);
}
.my-course-1-last .icon-img .star .gold {
  color: var(--am-gold) !important;
}

/* Empty state card */
.am-empty-state {
  text-align: center;
  padding: 48px 24px;
  color: var(--am-muted);
}
.am-empty-state i {
  font-size: 40px;
  color: var(--am-line);
  margin-bottom: 14px;
}
.am-empty-state h5 {
  font-family: 'Tajawal', sans-serif;
  font-weight: 700;
  color: var(--am-ink);
  margin-bottom: 8px;
}
.am-empty-state p {
  font-size: 14px;
  margin-bottom: 20px;
}
.am-empty-state .am-btn {
  display: inline-block;
  background: var(--am-primary);
  color: #fff;
  border-radius: 999px;
  padding: 10px 28px;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  transition: background .2s;
}
.am-empty-state .am-btn:hover { background: var(--am-primary-dark); color: #fff; }

/* ---------- Profile page ---------- */
.profile .profile-bg {
  margin-top: 32px !important;
  height: 120px;
  background: linear-gradient(135deg, var(--am-primary) 0%, var(--am-primary-dark) 100%);
  border-radius: var(--am-radius) var(--am-radius) 0 0;
}
.profile .profile-ful-body.common-card {
  background: #fff !important;
  border-radius: 0 0 var(--am-radius) var(--am-radius) !important;
  border: 1px solid var(--am-line) !important;
  border-top: 0 !important;
  box-shadow: var(--am-shadow) !important;
  padding: 20px 28px 32px !important;
  margin-bottom: 24px;
}
.profile .profile-parrent {
  margin-top: -52px;
  margin-bottom: 24px !important;
}
.profile .profile-parrent .profile-child img {
  border: 3px solid #fff;
  box-shadow: 0 0 0 2px var(--am-gold);
}
.profile .profile-parrent .profile-child h5 {
  font-family: 'Tajawal', sans-serif;
  font-weight: 700;
}
.profile .profile-input-section h4 {
  font-family: 'Tajawal', sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: var(--am-ink);
  border-inline-start: 4px solid var(--am-primary);
  padding-inline-start: 10px;
  margin-bottom: 16px;
}
.profile .profile-input-section .input-group-text {
  background: var(--am-cream) !important;
  border-color: var(--am-line) !important;
  color: var(--am-primary);
}
.profile .profile-input-section .form-control.bg-white-2 {
  border-color: var(--am-line) !important;
  background: var(--am-cream-2) !important;
}
.profile .profile-input-section .form-control.bg-white-2:focus {
  border-color: var(--am-primary) !important;
  box-shadow: 0 0 0 3px rgba(200, 32, 63, .12) !important;
  background: #fff !important;
}
.profile .purchase-btn {
  background: var(--am-primary) !important;
  color: #fff !important;
  border-radius: 999px !important;
  border: none !important;
  padding: 8px 28px !important;
  font-weight: 600 !important;
}
.profile .purchase-btn:hover { background: var(--am-primary-dark) !important; }

/* Upload label button */
.profile .profile-parrent .profile-child label[for] {
  border: 2px solid var(--am-primary);
  color: var(--am-primary);
  border-radius: 999px;
  padding: 5px 16px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background .18s;
}
.profile .profile-parrent .profile-child label[for]:hover {
  background: var(--am-primary-soft);
}

/* ---------- Purchase history table ---------- */
.wish-list-body table thead tr {
  background: var(--am-cream) !important;
}
.wish-list-body table thead th {
  color: var(--am-ink) !important;
  font-weight: 700 !important;
  border-color: var(--am-line) !important;
}
.wish-list-body table tbody td {
  border-color: var(--am-line) !important;
}
.wish-list-body table tbody tr:hover td {
  background: var(--am-cream-2) !important;
}

/* ---------- Mobile responsive ---------- */
@media (max-width: 991.98px) {
  .wish-list-body .wish-list-search {
    position: static !important;
    margin-bottom: 24px;
  }
  .my-course-1-full-body .my-course-1-full-body-card {
    flex-direction: column;
  }
  .my-course-1-full-body .my-course-1-full-body-card .my-course-1-img img {
    width: 100%;
    height: 180px;
  }
}
@media (max-width: 575.98px) {
  .my-course-1-full-body {
    padding: 16px 14px;
  }
  .profile .profile-ful-body.common-card {
    padding: 14px 14px 24px !important;
  }
}

/* ========= Course detail — column alignment ========= */
/* both columns lift by the SAME offset so their top edges line up
   (tabs box top flush with the course card / courses-card-image top) */
@media (min-width: 992px) {
  .course-decription .row > [class*="col-lg-"] {
    position: relative;
    z-index: 2;
  }
  .course-decription .course-left-side,
  .course-decription .course-card {
    margin-top: -150px !important;
  }
}
@media (max-width: 991.98px) {
  .course-decription .course-left-side,
  .course-decription .course-card {
    margin-top: 0 !important;
  }
}

/* ========= Course detail — left column inner spacing ========= */
/* (col-lg-8 order-2 order-lg-1 → .course-left-side and everything in it) */
.course-decription .course-left-side {
  padding: 16px 20px 22px;
}
@media (max-width: 767.98px) {
  .course-decription .course-left-side {
    padding: 12px 14px 16px;
  }
}
/* tabs bar aligns its underline with the content edges below */
.course-decription .course-left-side .nav-tabs {
  padding: 4px 20px 0;
  margin-bottom: 6px;
}
.course-decription .course-left-side .nav-tabs .nav-link {
  padding: 15px 10px 11px;
}
/* every tab pane shares one breathing inset */
.course-decription .course-left-side .tab-pane {
  padding: 16px 20px 8px;
}
/* stacked content blocks: consistent gaps, no run-on edges */
.course-decription .course-description {
  margin: 0 0 22px;
}
.course-decription .course-description:last-child {
  margin-bottom: 0;
}
.course-decription .description-head {
  margin: 0 0 12px;
  font-weight: 700;
  color: var(--am-ink);
  line-height: 1.4;
}
.course-decription .course-description p,
.course-decription .course-description ul {
  padding-inline-start: 22px;
  margin: 0 0 8px;
  line-height: 1.65;
}
.course-decription .step-down,
.course-decription .course-description ul:last-child {
  margin-bottom: 0;
}
.course-decription .course-description li {
  margin: 0 0 8px;
  line-height: 1.65;
}
.course-decription .faq-accrodion .accordion {
  margin: 0 0 10px;
}
.course-decription .faq-accrodion .accordion:last-child {
  margin-bottom: 0;
}