/* =====================================================================
   مقصد - تنسيقات الصفحات الداخلية للتصميم الجديد
   تعتمد على نفس ألوان وخطوط home.css
   ===================================================================== */

:root {
  --mk-red: #E72B4A;
  --mk-red-dark: #811829;
  --mk-pink: #BF2955;
  --mk-purple: #97235b;
  --mk-blue: #2b2b2b;
  --mk-blue-light: #555555;
  --mk-gray: #808080;
  --mk-bg: #F5F4FA;
  --mk-grad-red: linear-gradient(90deg, #E72B4A 0%, #811829 100%);
  --mk-grad-red-btn: linear-gradient(90deg, #bf2955 50%, #e72b4a 100%);
  --mk-grad-blue: linear-gradient(269.04deg, #2b2b2b -1.07%, #555555 99.29%);
  --mk-shadow: 1px 1px 10px 2px rgba(0, 0, 0, 0.15);
}

body {
  font-family: "Cairo", sans-serif;
  color: #222;
  background: #fff;
}

a {
  text-decoration: none;
}

.mk-main {
  min-height: 50vh;
}

/* ------------------------------ الهيدر: حالة المستخدم ------------------------------ */
.header-auth-buttons a.login-btn,
.header-auth-buttons a.signup-btn {
  width: 178px;
  height: 46px;
  font-weight: 800;
  font-size: 18px;
  color: #fff;
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  transition: background 0.5s ease, box-shadow 0.5s ease;
}

.header-auth-buttons a.login-btn {
  background: linear-gradient(90deg, #bf2955 50%, #e72b4a 100%);
}

.header-auth-buttons a.signup-btn {
  box-shadow: 1px 1px 7px rgba(0, 0, 0, 0.4);
  background: linear-gradient(90deg, #e72b4a 0%, #97235b 100%);
}

.header-auth-buttons a.login-btn:hover,
.header-auth-buttons a.signup-btn:hover {
  box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.527);
  color: #fff;
}

.header-logo a {
  display: inline-flex;
}

.mk-user-menu .mk-user-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 2px solid var(--mk-red);
  border-radius: 30px;
  padding: 4px 6px 4px 14px;
  background: #fff;
  color: var(--mk-blue);
  font-weight: 700;
  cursor: pointer;
}

[dir="rtl"] .mk-user-menu .mk-user-toggle {
  padding: 4px 14px 4px 6px;
}

.mk-user-menu .mk-user-toggle img {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  object-fit: cover;
}

.mk-user-menu .dropdown-menu {
  border-radius: 12px;
  box-shadow: var(--mk-shadow);
  border: none;
  padding: 8px;
  text-align: start;
}

.mk-user-menu .dropdown-item {
  border-radius: 8px;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--mk-blue);
}

.mk-user-menu .dropdown-item:hover {
  background: var(--mk-bg);
  color: var(--mk-red);
}

.header-navbar .language-switch {
  display: flex;
  align-items: center;
  gap: 2px;
  color: var(--mk-red);
  font-weight: 700;
  font-size: 15px;
  cursor: pointer;
}

.header-navbar .dropdown-menu {
  border-radius: 12px;
  border: none;
  box-shadow: var(--mk-shadow);
}

.header-navbar .dropdown-item {
  font-size: 16px;
  padding: 8px 16px;
}

.header-navbar .dropdown-item:hover {
  background: var(--mk-bg);
  color: var(--mk-red);
}

.NavFixed.FixedNavBar {
  left: 50%;
  transform: translateX(-50%);
  z-index: 1000;
}

/* ------------------------------ ترويسة الصفحة (Hero) ------------------------------ */
.page-hero {
  position: relative;
  min-height: 340px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin-top: -40px;
  background: var(--mk-grad-blue);
}

.page-hero > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.page-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(179.14deg, rgba(231, 43, 74, 0.75) -42.42%, rgba(0, 0, 0, 0.8) 99.26%);
}

.page-hero.page-hero-blue::after {
  background: linear-gradient(180deg, rgba(43, 43, 43, 0.88) 22.63%, rgba(31, 41, 55, 0.88) 100%);
}

.page-hero-content {
  position: relative;
  z-index: 2;
  color: #fff;
  text-align: center;
  padding: 90px 20px 50px;
  max-width: 900px;
}

.page-hero-content h1 {
  font-weight: 900;
  font-size: 40px;
  margin-bottom: 14px;
}

.page-hero-content p {
  font-size: 20px;
  line-height: 1.9;
  margin-bottom: 0;
}

.page-hero-content .mk-btn {
  margin-top: 24px;
}

.mk-breadcrumb {
  display: flex;
  justify-content: center;
  gap: 8px;
  font-size: 15px;
  margin-bottom: 10px;
  opacity: 0.9;
}

.mk-breadcrumb a {
  color: #fff;
}

.mk-breadcrumb a:hover {
  color: #ffd6dd;
}

@media (max-width: 768px) {
  .page-hero {
    min-height: 260px;
  }

  .page-hero-content h1 {
    font-size: 28px;
  }

  .page-hero-content p {
    font-size: 16px;
  }
}

/* ------------------------------ عناوين الأقسام ------------------------------ */
.mk-section {
  padding: 50px 0;
}

.mk-section-title {
  text-align: center;
  margin-bottom: 36px;
}

.mk-section-title h2 {
  background: linear-gradient(90deg, #2b2b2b 0%, #555555 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 30px;
  font-weight: 900;
  display: inline-block;
  margin-bottom: 12px;
}

.mk-section-title.red h2 {
  background: var(--mk-grad-red);
  -webkit-background-clip: text;
  background-clip: text;
}

.mk-section-title p {
  font-size: 19px;
  font-weight: 500;
  color: #444;
  max-width: 850px;
  margin: 0 auto;
  line-height: 1.9;
}

.mk-section-title .mk-line {
  width: 90px;
  height: 5px;
  border-radius: 5px;
  background: var(--mk-grad-red);
  margin: 0 auto 14px;
}

/* مربع بإطار أحمر وعنوان في المنتصف (نفس أسلوب "تصنيفات مميزة") */
.mk-frame {
  position: relative;
  border: 4px solid var(--mk-pink);
  border-radius: 40px;
  padding: 50px 35px 35px;
  margin-top: 70px;
}

.mk-frame > .mk-frame-title {
  position: absolute;
  top: -26px;
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  padding: 0 18px;
  white-space: nowrap;
}

.mk-frame > .mk-frame-title h2,
.mk-frame > .mk-frame-title h5 {
  background: linear-gradient(90deg, #2b2b2b 0%, #555555 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 30px;
  font-weight: 900;
  margin: 0;
}

@media (max-width: 610px) {
  .mk-frame {
    padding: 45px 15px 20px;
    border-radius: 25px;
  }

  .mk-frame > .mk-frame-title h2,
  .mk-frame > .mk-frame-title h5 {
    font-size: 22px;
  }
}

/* شريط أزرق بخلفية متدرجة (نفس أسلوب أحدث الدورات) */
.mk-band {
  background: var(--mk-grad-blue);
  border-radius: 20px;
  padding: 30px 35px;
  color: #fff;
}

.mk-band.red {
  background: linear-gradient(90.16deg, #E72B4A -0.62%, #811829 100.76%);
}

/* ------------------------------ الأزرار ------------------------------ */
.mk-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 160px;
  height: 50px;
  padding: 0 24px;
  border: none;
  border-radius: 10px;
  color: #fff !important;
  font-weight: 800;
  font-size: 17px;
  cursor: pointer;
  background: var(--mk-grad-red-btn);
  box-shadow: 1px 1px 10px #00000040;
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.2);
  transition: background 0.5s ease, box-shadow 0.3s ease, transform 0.2s ease;
}

.mk-btn:hover {
  background: linear-gradient(90deg, #e72b4a 0%, #97235b 100%);
  box-shadow: 2px 2px 14px rgba(0, 0, 0, 0.45);
}

.mk-btn:disabled,
.mk-btn.disabled {
  opacity: 0.65;
  cursor: not-allowed;
}

.mk-btn.blue {
  background: linear-gradient(90deg, #2b2b2b 0%, #555555 100%);
}

.mk-btn.blue:hover {
  background: linear-gradient(270deg, #2b2b2b 0%, #555555 100%);
}

.mk-btn.green {
  background: linear-gradient(90deg, #05753c 0%, #19a463 100%);
}

.mk-btn.outline {
  background: #fff;
  color: var(--mk-red) !important;
  border: 2px solid var(--mk-red);
  text-shadow: none;
  box-shadow: none;
}

.mk-btn.outline:hover {
  background: var(--mk-red);
  color: #fff !important;
}

.mk-btn.white {
  background: #fff;
  color: var(--mk-blue) !important;
  text-shadow: none;
}

.mk-btn.sm {
  min-width: auto;
  height: 38px;
  font-size: 15px;
  padding: 0 16px;
  border-radius: 19px;
}

.mk-btn.block {
  width: 100%;
}

.mk-btn .mk-spinner {
  display: none;
}

.mk-btn.loading .mk-spinner {
  display: inline-block;
}

.mk-btn.loading {
  pointer-events: none;
  opacity: 0.85;
}

/* ------------------------------ البطاقات ------------------------------ */
.mk-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: 24px;
}

.mk-card {
  background: #fff;
  border-radius: 0 20px;
  box-shadow: var(--mk-shadow);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.mk-card:hover {
  transform: translateY(-4px);
  box-shadow: 2px 4px 18px 4px rgba(0, 0, 0, 0.18);
}

.mk-card-img {
  position: relative;
  height: 210px;
  background: var(--mk-bg);
}

.mk-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mk-card-img img.contain {
  object-fit: contain;
  padding: 10px;
}

.mk-card-date {
  position: absolute;
  top: 12px;
  inset-inline-start: 12px;
  background: var(--mk-grad-red);
  color: #fff;
  border-radius: 12px;
  padding: 6px 12px;
  text-align: center;
  line-height: 1.2;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.25);
}

.mk-card-date strong {
  display: block;
  font-size: 22px;
  font-weight: 900;
}

.mk-card-date span {
  font-size: 13px;
}

.mk-card-badge {
  position: absolute;
  top: 12px;
  inset-inline-end: 12px;
  background: var(--mk-blue);
  color: #fff;
  border-radius: 20px;
  padding: 3px 14px;
  font-size: 14px;
  font-weight: 700;
}

.mk-card-body {
  padding: 16px 18px 18px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}

.mk-card-tag {
  align-self: flex-start;
  background: var(--mk-blue);
  color: #fff;
  border-radius: 5px;
  padding: 2px 10px;
  font-size: 13px;
}

.mk-card-title {
  font-size: 18px;
  font-weight: 800;
  color: var(--mk-blue);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.mk-card-text {
  font-size: 14px;
  color: var(--mk-gray);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 63px;
}

.mk-card-footer {
  margin-top: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding-top: 8px;
}

/* ------------------------------ صناديق المعلومات والميزات ------------------------------ */
.mk-feature-box {
  background: #fff;
  border-radius: 15px;
  box-shadow: 0px 4px 10px 0px #00000030;
  padding: 26px 18px;
  text-align: center;
  height: 100%;
  transition: transform 0.25s ease;
}

.mk-feature-box:hover {
  transform: scale(1.03);
}

.mk-feature-box img {
  width: 64px;
  height: 64px;
  object-fit: contain;
  margin-bottom: 14px;
}

.mk-feature-box h3,
.mk-feature-box h6 {
  font-weight: 800;
  color: var(--mk-blue);
  font-size: 19px;
}

.mk-feature-box p {
  color: #555;
  font-size: 15px;
  margin: 0;
  line-height: 1.8;
}

.mk-feature-box .mk-num {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  margin: 0 auto 14px;
  background: var(--mk-grad-red);
  color: #fff;
  font-weight: 900;
  font-size: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* نص مع صورة بجانبه (نفس أسلوب أقسام الإرشاد الأكاديمي) */
.mk-split {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  gap: 30px;
}

.mk-split .mk-split-img {
  width: 38%;
  text-align: center;
}

.mk-split .mk-split-img img {
  max-width: 100%;
  max-height: 340px;
  object-fit: contain;
}

.mk-split .mk-split-text {
  width: 55%;
  border: 4px solid var(--mk-red);
  border-radius: 12px;
  padding: 24px;
  line-height: 2;
  font-weight: 500;
  font-size: 17px;
}

.mk-split .mk-split-text h2,
.mk-split .mk-split-text h3 {
  color: var(--mk-blue);
  font-weight: 800;
  margin-bottom: 10px;
}

.mk-split.reverse {
  flex-direction: row-reverse;
}

.mk-split.reverse .mk-split-text h2,
.mk-split.reverse .mk-split-text h3 {
  color: var(--mk-red);
}

.mk-split .mk-split-steps {
  width: 55%;
}

.mk-split-sep {
  width: 1px;
  height: 70px;
  margin: 10px auto;
  border: 3px solid #bb0725;
}

@media (max-width: 798px) {
  .mk-split,
  .mk-split.reverse {
    flex-direction: column;
  }

  .mk-split .mk-split-img,
  .mk-split .mk-split-text,
  .mk-split .mk-split-steps {
    width: 100%;
  }
}

/* قائمة نقاط بأرقام */
.mk-list {
  list-style: none;
  padding: 0;
  margin: 0;
  counter-reset: mk;
}

.mk-list li {
  position: relative;
  padding-inline-start: 52px;
  margin-bottom: 18px;
  font-size: 17px;
  line-height: 1.9;
  min-height: 38px;
}

.mk-list li::before {
  counter-increment: mk;
  content: counter(mk);
  position: absolute;
  inset-inline-start: 0;
  top: 0;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--mk-grad-red);
  color: #fff;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
}

.mk-list.blue li::before {
  background: linear-gradient(90deg, #2b2b2b 0%, #555555 100%);
}

/* خط زمني للمراحل */
.mk-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 20px;
  counter-reset: step;
}

.mk-step {
  position: relative;
  background: #fff;
  color: #222;
  border-radius: 15px;
  padding: 50px 16px 20px;
  text-align: center;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.18);
  margin-top: 30px;
}

.mk-step .mk-step-num {
  position: absolute;
  top: -28px;
  left: 50%;
  transform: translateX(-50%);
  width: 58px;
  height: 58px;
  border-radius: 50%;
  border: 4px solid #fff;
  background: var(--mk-grad-red);
  color: #fff;
  font-weight: 900;
  font-size: 21px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.25);
}

.mk-step h3 {
  font-size: 19px;
  font-weight: 800;
  color: var(--mk-blue);
}

.mk-step p {
  font-size: 15px;
  color: #555;
  margin: 0;
  line-height: 1.8;
}

/* بطاقة جانبية لتفاصيل عنصر (دورة / منحة / خبر) */
.mk-side-card {
  background: #fff;
  border-radius: 20px;
  box-shadow: var(--mk-shadow);
  overflow: hidden;
  position: sticky;
  top: 100px;
}

.mk-side-card .mk-side-media {
  position: relative;
  background: var(--mk-bg);
}

.mk-side-card .mk-side-media img {
  width: 100%;
  max-height: 300px;
  object-fit: cover;
  display: block;
}

.mk-side-card .mk-side-media .mk-video {
  position: relative;
  padding-top: 56.25%;
}

.mk-side-card .mk-side-media .mk-video iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.mk-info-list {
  list-style: none;
  margin: 0;
  padding: 8px 20px 16px;
}

.mk-info-list li {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px dashed #e2e2e2;
  font-size: 15px;
}

.mk-info-list li:last-child {
  border-bottom: none;
}

.mk-info-list li .mk-info-label {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--mk-blue);
  font-weight: 800;
  white-space: nowrap;
}

.mk-info-list li .mk-info-label .material-icons {
  color: var(--mk-red);
  font-size: 20px;
}

.mk-info-list li .mk-info-value {
  color: #444;
  text-align: end;
}

.mk-side-card .mk-side-actions {
  padding: 0 20px 20px;
}

/* محتوى مقال */
.mk-article {
  background: #fff;
  border-radius: 20px;
  box-shadow: var(--mk-shadow);
  padding: 28px;
  margin-bottom: 24px;
}

.mk-article > h2,
.mk-article .mk-article-title {
  font-weight: 900;
  color: var(--mk-blue);
  font-size: 26px;
  margin-bottom: 12px;
}

.mk-article .mk-box-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 800;
  color: var(--mk-red);
  font-size: 20px;
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 3px solid var(--mk-bg);
}

.mk-article .mk-box-title::before {
  content: "";
  width: 8px;
  height: 26px;
  border-radius: 4px;
  background: var(--mk-grad-red);
}

.mk-content {
  font-size: 17px;
  line-height: 2;
  color: #333;
  overflow-wrap: anywhere;
}

.mk-content img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
}

.mk-content table {
  width: 100%;
  margin-bottom: 1rem;
}

.mk-content a {
  color: var(--mk-blue-light);
}

/* ------------------------------ الفلاتر والبحث ------------------------------ */
.mk-filter {
  position: relative;
  z-index: 5;
  margin-top: -70px;
  background: #fff;
  border-radius: 20px;
  box-shadow: 2px 4px 18px rgba(0, 0, 0, 0.18);
  padding: 26px;
}

.mk-filter .mk-filter-title {
  color: var(--mk-blue);
  font-weight: 900;
  font-size: 22px;
  text-align: center;
  margin-bottom: 18px;
}

.mk-filter label {
  font-weight: 700;
  color: var(--mk-blue);
  margin-bottom: 6px;
  font-size: 15px;
}

.mk-filter .form-select,
.mk-filter .form-control {
  height: 48px;
  border-radius: 10px;
  border: 2px solid #e3e7ee;
}

.select2-container--default .select2-selection--single {
  height: 48px !important;
  border-radius: 10px !important;
  border: 2px solid #e3e7ee !important;
  display: flex;
  align-items: center;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 44px !important;
  width: 100%;
  color: #333;
  font-family: "Cairo", sans-serif;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 44px !important;
}

.select2-dropdown {
  border-radius: 10px !important;
  border: 2px solid #e3e7ee !important;
  overflow: hidden;
  font-family: "Cairo", sans-serif;
}

.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background: var(--mk-red) !important;
}

/* ------------------------------ النماذج ------------------------------ */
.mk-form-card {
  background: #fff;
  border-radius: 25px;
  box-shadow: 2px 4px 20px rgba(0, 0, 0, 0.15);
  padding: 34px;
  position: relative;
}

.mk-form-card h2 {
  font-weight: 900;
  color: var(--mk-blue);
  font-size: 26px;
  text-align: center;
  margin-bottom: 6px;
}

.mk-form-card .mk-form-sub {
  text-align: center;
  color: #666;
  margin-bottom: 22px;
}

.mk-field {
  margin-bottom: 16px;
}

.mk-field label {
  display: block;
  font-weight: 700;
  color: var(--mk-blue);
  margin-bottom: 6px;
  font-size: 15px;
}

.mk-field .form-control,
.mk-field .form-select,
.mk-input {
  width: 100%;
  min-height: 50px;
  border-radius: 10px;
  border: 2px solid #e3e7ee;
  padding: 10px 14px;
  font-family: "Cairo", sans-serif;
  font-size: 16px;
  background: #fbfbfd;
  transition: border-color 0.2s ease, background 0.2s ease;
}

.mk-field textarea.form-control {
  min-height: 110px;
}

.mk-field .form-control:focus,
.mk-field .form-select:focus,
.mk-input:focus {
  outline: none;
  border-color: var(--mk-blue-light) !important;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(85, 85, 85, 0.15) !important;
}

.mk-field .mk-error,
.mk-error {
  display: none;
  color: var(--mk-red);
  font-size: 14px;
  margin-top: 4px;
}

.mk-alert-error {
  display: none;
  background: #fdecef;
  color: var(--mk-red-dark);
  border-radius: 10px;
  padding: 10px 14px;
  margin-bottom: 14px;
  font-weight: 600;
}

.mk-alert-success {
  display: none;
  background: #e8f7ef;
  color: #05753c;
  border-radius: 10px;
  padding: 10px 14px;
  margin-bottom: 14px;
  font-weight: 600;
}

.mk-form-link {
  color: var(--mk-red);
  font-weight: 700;
}

.mk-form-link:hover {
  color: var(--mk-blue);
}

.iti {
  width: 100%;
  direction: ltr;
}

.mk-form-loading {
  position: absolute;
  inset: 0;
  z-index: 20;
  background: rgba(255, 255, 255, 0.75);
  border-radius: inherit;
  display: none;
  align-items: center;
  justify-content: center;
}

.mk-form-loading.active {
  display: flex;
}

.mk-checks .form-check {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  margin-bottom: 8px;
  border: 2px solid #eef0f4;
  border-radius: 10px;
  transition: border-color 0.2s ease, background 0.2s ease;
}

.mk-checks .form-check:has(input:checked) {
  border-color: var(--mk-red);
  background: #fff5f7;
}

.mk-checks .form-check-input {
  float: none;
  margin: 0;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.mk-checks .form-check-input:checked {
  background-color: var(--mk-red);
  border-color: var(--mk-red);
}

.mk-checks .form-check-label {
  flex: 1;
  cursor: pointer;
}

.mk-checks .mk-price {
  color: var(--mk-blue);
  font-weight: 800;
  white-space: nowrap;
}

/* ------------------------------ مؤشر التحميل ------------------------------ */
.mk-spinner {
  width: 22px;
  height: 22px;
  border: 3px solid rgba(255, 255, 255, 0.4);
  border-top-color: #fff;
  border-radius: 50%;
  animation: mk-spin 0.8s linear infinite;
}

.mk-spinner.lg {
  width: 60px;
  height: 60px;
  border-width: 5px;
  border-color: #f1d3d9;
  border-top-color: var(--mk-red);
}

.mk-loading-box {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 60px 0;
  width: 100%;
}

@keyframes mk-spin {
  to {
    transform: rotate(360deg);
  }
}

.mk-empty {
  text-align: center;
  padding: 50px 20px;
  color: var(--mk-gray);
  font-size: 18px;
  font-weight: 600;
}

.mk-empty .material-icons {
  font-size: 60px;
  color: #e3c1c8;
  display: block;
  margin-bottom: 10px;
}

/* ------------------------------ ترقيم الصفحات ------------------------------ */
.mk-pagination {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 36px 0 10px;
  padding: 0;
  list-style: none;
  user-select: none;
}

.mk-pagination li a,
.mk-pagination li span {
  min-width: 44px;
  height: 44px;
  padding: 0 12px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  color: var(--mk-blue);
  background: #fff;
  border: 2px solid #e3e7ee;
  cursor: pointer;
  transition: all 0.2s ease;
}

.mk-pagination li a:hover {
  border-color: var(--mk-red);
  color: var(--mk-red);
}

.mk-pagination li.active a,
.mk-pagination li.active span {
  background: var(--mk-grad-red);
  border-color: transparent;
  color: #fff;
}

.mk-pagination li.disabled a,
.mk-pagination li.disabled span {
  opacity: 0.45;
  pointer-events: none;
}

/* ------------------------------ الأكورديون ------------------------------ */
.mk-accordion-item {
  background: #fff;
  border-radius: 15px;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.1);
  margin-bottom: 14px;
  overflow: hidden;
}

.mk-accordion-head {
  width: 100%;
  border: none;
  background: #fff;
  padding: 18px 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-family: "Cairo", sans-serif;
  font-weight: 800;
  font-size: 19px;
  color: var(--mk-blue);
  cursor: pointer;
  text-align: start;
}

.mk-accordion-head .mk-acc-icon {
  display: flex;
  align-items: center;
  gap: 10px;
}

.mk-accordion-head .mk-acc-icon .material-icons {
  color: var(--mk-red);
}

.mk-accordion-head .mk-acc-arrow {
  transition: transform 0.3s ease;
  color: var(--mk-red);
}

.mk-accordion-item.open > .mk-accordion-head .mk-acc-arrow {
  transform: rotate(180deg);
}

.mk-accordion-item.open > .mk-accordion-head {
  border-bottom: 2px solid var(--mk-bg);
}

.mk-accordion-body {
  display: none;
  padding: 20px 22px;
}

.mk-accordion-item.open > .mk-accordion-body {
  display: block;
}

.mk-accordion-item.sub {
  box-shadow: none;
  border: 2px solid #eef0f4;
  border-radius: 12px;
  margin-bottom: 10px;
}

.mk-accordion-item.sub > .mk-accordion-head {
  font-size: 16px;
  padding: 12px 16px;
  background: var(--mk-bg);
}

.mk-accordion-item.sub > .mk-accordion-body {
  padding: 0;
}

/* جدول البرامج */
.mk-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 15px;
}

.mk-table th {
  background: var(--mk-blue);
  color: #fff;
  font-weight: 700;
  padding: 10px 12px;
  text-align: start;
}

.mk-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #eef0f4;
  vertical-align: middle;
}

.mk-table tr:last-child td {
  border-bottom: none;
}

.mk-table tr:hover td {
  background: #fafbfd;
}

.mk-table-wrap {
  overflow-x: auto;
}

/* ------------------------------ الجامعات ------------------------------ */
.mk-uni-item {
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 3px 14px rgba(0, 0, 0, 0.1);
  margin-bottom: 18px;
  overflow: hidden;
  border-inline-start: 6px solid var(--mk-red);
}

.mk-uni-row {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 18px 22px;
}

.mk-uni-logo {
  width: 96px;
  height: 96px;
  flex-shrink: 0;
  border-radius: 16px;
  background: var(--mk-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.mk-uni-logo img {
  max-width: 85%;
  max-height: 85%;
  object-fit: contain;
}

.mk-uni-info {
  flex: 1;
  min-width: 0;
}

.mk-uni-info h3 {
  font-weight: 900;
  font-size: 20px;
  color: var(--mk-blue);
  margin-bottom: 8px;
}

.mk-uni-info h3 a {
  color: inherit;
}

.mk-uni-info h3 a:hover {
  color: var(--mk-red);
}

.mk-uni-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  color: #555;
  font-size: 15px;
}

.mk-uni-meta span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.mk-uni-meta .material-icons {
  font-size: 19px;
  color: var(--mk-red);
}

.mk-uni-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-shrink: 0;
}

.mk-uni-toggle {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 2px solid var(--mk-red);
  background: #fff;
  color: var(--mk-red);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.25s ease;
}

.mk-uni-toggle:hover,
.mk-uni-item.open .mk-uni-toggle {
  background: var(--mk-red);
  color: #fff;
}

.mk-uni-item.open .mk-uni-toggle .material-icons {
  transform: rotate(180deg);
}

.mk-uni-programs {
  display: none;
  background: #fafbfd;
  padding: 18px 22px;
  border-top: 2px solid var(--mk-bg);
  max-height: 460px;
  overflow: auto;
}

.mk-uni-item.open .mk-uni-programs {
  display: block;
}

@media (max-width: 680px) {
  .mk-uni-row {
    flex-wrap: wrap;
  }

  .mk-uni-actions {
    width: 100%;
    justify-content: space-between;
  }
}

/* ترويسة صفحة جامعة */
.mk-uni-hero {
  background: var(--mk-grad-blue);
  color: #fff;
  margin-top: -40px;
  padding: 90px 0 40px;
}

.mk-uni-hero .mk-uni-logo {
  width: 140px;
  height: 140px;
  background: #fff;
  border-radius: 25px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
}

.mk-uni-hero h1 {
  font-weight: 900;
  font-size: 34px;
  margin-bottom: 12px;
}

.mk-uni-hero .mk-uni-meta {
  color: #e8f1fb;
}

.mk-uni-hero .mk-uni-meta .material-icons {
  color: #ffb3c0;
}

.mk-uni-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

.mk-uni-stat {
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 15px;
  padding: 12px 18px;
  min-width: 150px;
  text-align: center;
}

.mk-uni-stat strong {
  display: block;
  font-size: 24px;
  font-weight: 900;
}

.mk-uni-stat span {
  font-size: 14px;
  opacity: 0.9;
}

.mk-uni-links {
  display: flex;
  gap: 10px;
}

.mk-uni-links a {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: #fff;
  color: var(--mk-red);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s ease;
}

.mk-uni-links a:hover {
  transform: scale(1.1);
}

.mk-dropzone.dropzone {
  border: 2px dashed var(--mk-blue-light);
  border-radius: 14px;
  background: #fbfbfd;
  min-height: 130px;
  font-family: "Cairo", sans-serif;
  color: var(--mk-blue);
  font-weight: 700;
}

.mk-dropzone .dz-remove {
  color: var(--mk-red);
  font-weight: 700;
}

.mk-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}

.mk-gallery img {
  width: 100%;
  height: 120px;
  object-fit: cover;
  border-radius: 12px;
}

/* ------------------------------ الدورات ------------------------------ */
.mk-lesson-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-height: 75vh;
  overflow: auto;
  padding: 4px;
}

.mk-lesson-item {
  display: flex;
  gap: 12px;
  align-items: center;
  background: #fff;
  border-radius: 14px;
  padding: 8px;
  border: 2px solid #eef0f4;
  color: #222;
  transition: all 0.2s ease;
}

.mk-lesson-item:hover {
  border-color: var(--mk-blue-light);
  color: #222;
}

.mk-lesson-item.active {
  border-color: var(--mk-red);
  background: #fff5f7;
}

.mk-lesson-item img {
  width: 96px;
  height: 64px;
  object-fit: cover;
  border-radius: 10px;
  flex-shrink: 0;
}

.mk-lesson-item .mk-lesson-num {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--mk-grad-red);
  color: #fff;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.mk-lesson-item h4 {
  font-size: 15px;
  font-weight: 800;
  color: var(--mk-blue);
  margin: 0 0 2px;
}

.mk-lesson-item p {
  font-size: 13px;
  color: var(--mk-gray);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.mk-player {
  position: relative;
  padding-top: 56.25%;
  border-radius: 20px;
  overflow: hidden;
  background: #000;
  box-shadow: var(--mk-shadow);
}

.mk-player iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.mk-tabs {
  display: flex;
  gap: 8px;
  border-bottom: 3px solid var(--mk-bg);
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.mk-tabs button {
  border: none;
  background: none;
  padding: 10px 18px;
  font-family: "Cairo", sans-serif;
  font-weight: 800;
  font-size: 17px;
  color: var(--mk-gray);
  border-bottom: 4px solid transparent;
  margin-bottom: -3px;
  cursor: pointer;
}

.mk-tabs button.active {
  color: var(--mk-red);
  border-bottom-color: var(--mk-red);
}

.mk-tab-pane {
  display: none;
}

.mk-tab-pane.active {
  display: block;
}

.mk-comment-box {
  display: flex;
  gap: 10px;
}

.mk-comment-box .mk-input {
  flex: 1;
}

/* ------------------------------ الباقات والخدمات الطلابية ------------------------------ */
.mk-package {
  display: flex;
  align-items: center;
  gap: 30px;
  background: #fff;
  border-radius: 25px;
  box-shadow: var(--mk-shadow);
  overflow: hidden;
  margin-bottom: 28px;
}

.mk-package:nth-child(even) {
  flex-direction: row-reverse;
}

.mk-package .mk-package-img {
  width: 42%;
  align-self: stretch;
  min-height: 240px;
  background: var(--mk-bg);
  position: relative;
}

.mk-package .mk-package-img img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mk-package .mk-package-text {
  flex: 1;
  padding: 26px;
}

.mk-package .mk-package-num {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--mk-grad-red);
  color: #fff;
  font-weight: 900;
  font-size: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
}

.mk-package:nth-child(even) .mk-package-num {
  background: linear-gradient(90deg, #2b2b2b 0%, #555555 100%);
}

.mk-package h3 {
  font-weight: 900;
  color: var(--mk-blue);
  font-size: 22px;
}

.mk-package p {
  color: #555;
  line-height: 1.9;
  font-size: 16px;
  margin: 0;
}

@media (max-width: 768px) {
  .mk-package,
  .mk-package:nth-child(even) {
    flex-direction: column;
  }

  .mk-package .mk-package-img {
    width: 100%;
    min-height: 200px;
  }
}

/* ------------------------------ النوافذ المنبثقة ------------------------------ */
.mk-modal .modal-content {
  border: none;
  border-radius: 25px;
  overflow: hidden;
  font-family: "Cairo", sans-serif;
}

.mk-modal .modal-header {
  background: var(--mk-grad-red);
  color: #fff;
  border: none;
  padding: 16px 22px;
}

.mk-modal .modal-header.blue {
  background: var(--mk-grad-blue);
}

.mk-modal .modal-title {
  font-weight: 800;
  font-size: 20px;
  color: #fff;
  background: none;
  -webkit-text-fill-color: #fff;
  margin: 0;
}

.mk-modal .btn-close {
  filter: invert(1) grayscale(1) brightness(2);
  opacity: 1;
  margin: 0;
}

.mk-modal .modal-body {
  padding: 24px;
  position: relative;
}

/* ------------------------------ الاختبارات ------------------------------ */
.mk-test-shell {
  background: #fff;
  border-radius: 25px;
  box-shadow: 2px 4px 20px rgba(0, 0, 0, 0.12);
  padding: 26px;
}

.mk-test-nav {
  display: flex;
  gap: 10px;
  list-style: none;
  padding: 0;
  margin: 0 0 22px;
  overflow-x: auto;
}

.mk-test-nav li {
  flex: 1;
  min-width: 150px;
  padding: 12px 14px;
  border-radius: 14px;
  background: var(--mk-bg);
  color: var(--mk-gray);
  font-weight: 800;
  text-align: center;
  position: relative;
  transition: all 0.25s ease;
  user-select: none;
}

.mk-test-nav li.active {
  background: linear-gradient(90deg, #2b2b2b 0%, #555555 100%);
  color: #fff;
  cursor: pointer;
}

.mk-test-nav li.current {
  background: var(--mk-grad-red);
  color: #fff;
  box-shadow: 0 4px 12px rgba(231, 43, 74, 0.35);
}

.mk-test-nav li .mk-test-index {
  display: block;
  font-size: 13px;
  font-weight: 600;
  opacity: 0.85;
}

.mk-progress {
  display: flex;
  gap: 6px;
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
  flex-wrap: wrap;
  justify-content: center;
}

.mk-progress li {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 3px solid #e3e7ee;
  color: var(--mk-gray);
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  transition: all 0.25s ease;
}

.mk-progress li.active {
  background: var(--mk-red);
  border-color: var(--mk-red);
  color: #fff;
}

.mk-stage-scroll {
  max-height: 65vh;
  overflow-y: auto;
  padding: 6px 10px;
}

.mk-question {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  border: 2px solid #eef0f4;
  border-radius: 18px;
  padding: 16px;
  margin-bottom: 16px;
}

.mk-question .mk-question-img {
  width: 160px;
  flex-shrink: 0;
}

.mk-question .mk-question-img img {
  width: 100%;
  border-radius: 12px;
}

.mk-question .mk-question-body {
  flex: 1;
}

.mk-question .mk-question-title {
  background: var(--mk-grad-red);
  color: #fff;
  border-radius: 10px;
  padding: 8px 14px;
  font-weight: 700;
  font-size: 16px;
  margin-bottom: 10px;
}

.mk-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-radius: 10px;
  margin-bottom: 6px;
  background: #fafbfd;
  border: 2px solid transparent;
  cursor: pointer;
  transition: all 0.2s ease;
  font-size: 15px;
}

.mk-option:hover {
  border-color: #dce6f2;
}

.mk-option input {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  accent-color: var(--mk-red);
  cursor: pointer;
}

.mk-option:has(input:checked) {
  border-color: var(--mk-red);
  background: #fff5f7;
}

.mk-stage-actions {
  display: flex;
  justify-content: center;
  gap: 14px;
  padding: 16px 0 4px;
}

@media (max-width: 600px) {
  .mk-question {
    flex-direction: column;
  }

  .mk-question .mk-question-img {
    width: 100%;
    text-align: center;
  }

  .mk-question .mk-question-img img {
    max-width: 200px;
  }
}

/* بطاقات النتائج */
.mk-result-list {
  list-style: none;
  padding: 0;
  margin: 0;
  counter-reset: res;
}

.mk-result-list li {
  position: relative;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 3px 14px rgba(0, 0, 0, 0.1);
  padding: 18px 18px 18px 18px;
  padding-inline-start: 78px;
  margin-bottom: 14px;
  overflow: hidden;
}

.mk-result-list li::before {
  counter-increment: res;
  content: counter(res);
  position: absolute;
  inset-inline-start: 16px;
  top: 18px;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--mk-grad-red);
  color: #fff;
  font-weight: 900;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.mk-result-list li:nth-child(2)::before {
  background: linear-gradient(90deg, #2b2b2b 0%, #555555 100%);
}

.mk-result-list li:nth-child(3)::before {
  background: linear-gradient(90deg, #bf8a10 0%, #e3b23c 100%);
}

.mk-result-list h3 {
  font-size: 19px;
  font-weight: 900;
  color: var(--mk-blue);
  margin-bottom: 6px;
}

.mk-result-list p {
  color: #555;
  margin: 0;
  line-height: 1.8;
  font-size: 15px;
}

.mk-result-block {
  margin-bottom: 40px;
}

.mk-chart-box {
  position: relative;
  min-height: 360px;
  height: 100%;
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 3px 14px rgba(0, 0, 0, 0.1);
  padding: 14px;
}

/* ------------------------------ صفحة 404 ------------------------------ */
.mk-404 {
  text-align: center;
  padding: 60px 20px 40px;
}

.mk-404 .mk-404-code {
  font-size: 140px;
  font-weight: 1000;
  line-height: 1;
  background: var(--mk-grad-red);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.mk-404 img {
  max-width: 380px;
  width: 100%;
  border-radius: 20px;
  margin: 10px 0 20px;
}

.mk-404 h1 {
  color: var(--mk-blue);
  font-weight: 900;
  font-size: 30px;
}

.mk-404 p {
  color: #555;
  font-size: 18px;
}

/* ------------------------------ صفحات الدخول والتسجيل ------------------------------ */
.mk-auth {
  padding: 40px 0 20px;
}

.mk-auth-side {
  background: var(--mk-grad-blue);
  border-radius: 25px;
  color: #fff;
  padding: 36px;
  height: 100%;
  position: relative;
  overflow: hidden;
}

.mk-auth-side::after {
  content: "";
  position: absolute;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.07);
  bottom: -80px;
  inset-inline-end: -80px;
}

.mk-auth-side h2 {
  font-weight: 900;
  font-size: 28px;
  line-height: 1.6;
  margin-bottom: 10px;
}

.mk-auth-side > p {
  font-size: 17px;
  opacity: 0.95;
  line-height: 1.9;
}

.mk-auth-feature {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 18px 0;
  font-size: 17px;
  font-weight: 600;
}

.mk-auth-feature .material-icons {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.mk-auth-side .mk-auth-join {
  margin-top: 26px;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.25);
}

.mk-auth-side .mk-auth-join h3 {
  font-weight: 900;
  font-size: 22px;
}

.mk-auth-side .mk-auth-join p {
  line-height: 1.9;
  margin: 0;
  opacity: 0.95;
}

.mk-auth-logo {
  display: block;
  margin: 0 auto 14px;
  width: 130px;
}

/* ------------------------------ تواصل معنا ------------------------------ */
.mk-contact {
  background: var(--mk-grad-blue);
  border-radius: 30px;
  color: #fff;
  padding: 40px;
  margin: 60px auto 20px;
}

.mk-contact h2 {
  font-weight: 900;
  font-size: 30px;
}

.mk-contact p {
  font-size: 17px;
  line-height: 1.9;
  opacity: 0.95;
}

.mk-contact .mk-contact-ways a {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #fff;
  font-weight: 700;
  font-size: 18px;
  margin-bottom: 12px;
  direction: ltr;
  justify-content: flex-end;
}

[dir="ltr"] .mk-contact .mk-contact-ways a {
  justify-content: flex-start;
}

.mk-contact .mk-contact-ways .material-icons {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.18);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ------------------------------ الفوتر ------------------------------ */
footer dl a {
  color: #fff;
}

footer dl a:hover {
  color: #bdbdbd;
}

footer .footer-contact a {
  color: #fff;
  direction: ltr;
  display: inline-block;
}

/* ------------------------------ إشعار منبثق ------------------------------ */
.mk-toast {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%) translateY(30px);
  z-index: 99999;
  background: var(--mk-blue);
  color: #fff;
  border-radius: 14px;
  padding: 14px 24px;
  font-weight: 700;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
  opacity: 0;
  pointer-events: none;
  transition: all 0.35s ease;
  max-width: 90vw;
  text-align: center;
}

.mk-toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

.mk-toast.success {
  background: #05753c;
}

.mk-toast.error {
  background: var(--mk-red);
}

/* ------------------------------ Dropzone ------------------------------ */
.dropzone {
  border: 2px dashed var(--mk-blue-light) !important;
  border-radius: 15px !important;
  background: #f7fbff !important;
  min-height: 140px !important;
}

.dropzone .dz-message {
  font-family: "Cairo", sans-serif;
  color: var(--mk-blue);
  font-weight: 700;
}

/* =====================================================================
   أحجام مقبولة للأزرار والخطوط
   يجب أن يبقى هذا القسم في آخر الملف ليطغى على home.css وما سبقه
   ===================================================================== */

/* الهيدر */
.header-navbar nav {
  min-height: 64px;
}

.header-navbar a {
  font-size: 15px;
}

.header-auth-buttons button,
.header-auth-buttons a.login-btn,
.header-auth-buttons a.signup-btn {
  width: 140px;
  height: 38px;
  font-size: 15px;
}

.header-navbar .contact-btn {
  width: 150px;
  height: 40px;
  font-size: 15px;
}

.header-navbar .language-icon {
  font-size: 30px;
}

.header-navbar .dropdown-item {
  font-size: 15px;
}

.mk-user-menu .mk-user-toggle img {
  width: 32px;
  height: 32px;
}

@media (max-width: 1228px) {
  .header-navbar a,
  .header-auth-buttons button,
  .header-navbar .contact-btn {
    font-size: 15px;
  }
}

@media (max-width: 510px) {
  .header-auth-buttons button,
  .header-auth-buttons a.login-btn,
  .header-auth-buttons a.signup-btn,
  .header-navbar .contact-btn {
    width: 120px;
    height: 36px;
    font-size: 13px;
  }

  .header-navbar a {
    font-size: 14px;
  }
}

/* الصفحة الرئيسية والفوتر */
h5 {
  font-size: 24px;
}

.carousel-caption .btn {
  width: 160px;
  height: 44px;
  font-size: 15px;
}

.Latest-courses-header p,
.Latest-grants-header p,
.our-partners-header p {
  font-size: 17px;
}

.Latest-courses-content-header h6,
.Latest-grants-content-header h6 {
  font-size: 17px;
}

.Latest-grants-content-footer .btn,
.Latest-courses-content-footer .btn,
.maksed-Blog-content-footer .btn {
  font-size: 16px;
}

.contact-us-info p:first-child {
  font-size: 21px;
}

.contact-us-info p:last-child {
  font-size: 16px;
}

footer dt {
  font-size: 19px;
}

/* صفحة الإرشاد الأكاديمي */
.caption p {
  font-size: 19px;
  line-height: 36px;
}

.caption .btn,
.caption-personality-test .btn {
  height: 42px;
  font-size: 15px;
}

.caption-personality-test p,
.caption-personality-test ol li,
.caption-personality-test ol h6,
.test-help .text-box ul li {
  font-size: 17px;
  line-height: 34px;
}

/* ترويسة الصفحات وعناوين الأقسام */
.page-hero-content h1 {
  font-size: 32px;
}

.page-hero-content p {
  font-size: 17px;
}

.mk-section-title h2,
.mk-frame > .mk-frame-title h2,
.mk-frame > .mk-frame-title h5 {
  font-size: 25px;
}

.mk-section-title p {
  font-size: 16px;
}

/* الأزرار */
.mk-btn {
  min-width: 130px;
  height: 42px;
  padding: 0 20px;
  font-size: 15px;
  border-radius: 8px;
}

.mk-btn.sm {
  height: 32px;
  padding: 0 14px;
  font-size: 13px;
  border-radius: 16px;
}

.mk-tabs button {
  padding: 8px 14px;
  font-size: 15px;
}

.mk-pagination li a,
.mk-pagination li span {
  min-width: 38px;
  height: 38px;
}

.mk-uni-toggle,
.mk-uni-links a {
  width: 40px;
  height: 40px;
}

/* البطاقات والمحتوى */
.mk-card-title {
  font-size: 16px;
}

.mk-card-date strong {
  font-size: 18px;
}

.mk-feature-box h6,
.mk-step h3,
.mk-result-list h3 {
  font-size: 17px;
}

.mk-feature-box p,
.mk-step p {
  font-size: 14px;
}

.mk-feature-box .mk-num,
.mk-package .mk-package-num {
  width: 44px;
  height: 44px;
  font-size: 19px;
}

.mk-step .mk-step-num {
  width: 48px;
  height: 48px;
  font-size: 18px;
}

.mk-split .mk-split-text,
.mk-list li,
.mk-content {
  font-size: 16px;
}

.mk-info-list li {
  font-size: 14px;
}

.mk-article .mk-article-title,
.mk-form-card h2 {
  font-size: 22px;
}

.mk-article .mk-box-title {
  font-size: 17px;
}

.mk-filter .mk-filter-title {
  font-size: 19px;
}

.mk-accordion-head {
  padding: 14px 18px;
  font-size: 17px;
}

.mk-accordion-item.sub > .mk-accordion-head {
  font-size: 15px;
}

.mk-uni-logo {
  width: 80px;
  height: 80px;
}

.mk-uni-info h3 {
  font-size: 18px;
}

.mk-uni-hero h1 {
  font-size: 28px;
}

.mk-uni-stat strong {
  font-size: 20px;
}

.mk-package h3 {
  font-size: 19px;
}

.mk-package p {
  font-size: 15px;
}

.mk-modal .modal-title {
  font-size: 18px;
}

.mk-empty {
  font-size: 16px;
}

.mk-empty .material-icons {
  font-size: 48px;
}

/* حقول النماذج */
.mk-field .form-control,
.mk-field .form-select,
.mk-input {
  min-height: 44px;
  font-size: 15px;
}

.mk-filter .form-select,
.mk-filter .form-control,
.select2-container--default .select2-selection--single {
  height: 42px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 38px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 38px !important;
}

/* صفحات الدخول والتواصل و404 */
.mk-auth-side h2 {
  font-size: 23px;
}

.mk-auth-side > p,
.mk-auth-feature,
.mk-contact p {
  font-size: 15px;
}

.mk-auth-side .mk-auth-join h3 {
  font-size: 19px;
}

.mk-contact h2,
.mk-404 h1 {
  font-size: 25px;
}

.mk-contact .mk-contact-ways a,
.mk-404 p {
  font-size: 16px;
}

.mk-404 .mk-404-code {
  font-size: 110px;
}

@media (max-width: 768px) {
  .page-hero-content h1 {
    font-size: 24px;
  }

  .page-hero-content p {
    font-size: 15px;
  }

  .mk-section-title h2,
  .mk-frame > .mk-frame-title h2,
  .mk-frame > .mk-frame-title h5 {
    font-size: 20px;
  }
}

/* =====================================================================
   حاوية المحتوى: الخلفيات بعرض الشاشة والمحتوى لا يتجاوز 1500px
   ===================================================================== */
:root {
  --mk-max: 1500px;
}

@media (min-width: 1560px) {
  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: var(--mk-max);
  }
}

.header-container > .row:not(:has(.header-top-line)) {
  padding-inline: max(0px, calc((100% - var(--mk-max)) / 2));
}

.header-navbar nav {
  max-width: var(--mk-max);
}

.carousel-caption {
  left: max(15%, calc((100% - var(--mk-max)) / 2));
  right: max(15%, calc((100% - var(--mk-max)) / 2));
}

.featured-categories,
.Latest-courses-header,
.Latest-courses-content,
.Latest-grants-header,
.Latest-grants-content,
.maksed-Blog-content,
.statistics {
  max-width: var(--mk-max);
}

.featured-categories,
.Latest-courses-content,
.Latest-grants-content,
.maksed-Blog-content {
  margin-inline: auto !important;
}

@media (min-width: 1596px) {
  .featured-categories,
  .Latest-courses-content,
  .Latest-grants-content,
  .maksed-Blog-content {
    width: var(--mk-max);
  }
}

.Latest-courses-header,
.Latest-grants-header,
.statistics {
  margin-inline: auto;
}

footer > .component_1-row2 {
  padding-inline: max(0px, calc((100% - var(--mk-max)) / 2));
}

.caption,
.caption-personality-test {
  padding-inline: max(40px, calc((100% - var(--mk-max)) / 2));
}

.caption {
  width: 100%;
}

.test-help {
  max-width: var(--mk-max);
  margin-inline: auto !important;
}

@media (min-width: 1596px) {
  .test-help {
    width: var(--mk-max);
  }
}

html,
body {
  overflow-x: clip;
}

@media (max-width: 576px) {
  .slick-prev,
  .slick-next {
    z-index: 2;
  }

  .slick-prev {
    left: 0;
  }

  .slick-next {
    right: 0;
  }

  [dir="rtl"] .slick-prev {
    left: auto;
    right: 0;
  }

  [dir="rtl"] .slick-next {
    right: auto;
    left: 0;
  }
}

/* =====================================================================
   الرئيسية حسب تصميم Figma (Home V3)
   ===================================================================== */
.Latest-courses-content,
.Latest-grants-content,
.maksed-Blog-content {
  padding: 28px 32px 24px;
  border-radius: 20px;
}

.Latest-courses-content-header h6,
.Latest-grants-content-header h6 {
  font-size: 22px;
  font-weight: 700;
  margin: 0;
}

.Latest-courses-content-header a,
.Latest-grants-content-header a {
  font-size: 13px;
  font-weight: 600;
  margin: 0 16px !important;
}

.maksed-Blog-content-header h5 {
  font-size: 26px;
  font-weight: 700;
}

.LastCurses .slick-track,
.LastScholarships .slick-track,
.LastBlogs .slick-track {
  display: flex !important;
}

.LastCurses .slick-slide,
.LastScholarships .slick-slide,
.LastBlogs .slick-slide {
  height: auto;
}

.LastCurses .slick-slide > div,
.LastCurses .slick-slide > div > div,
.LastScholarships .slick-slide > div,
.LastScholarships .slick-slide > div > div,
.LastBlogs .slick-slide > div,
.LastBlogs .slick-slide > div > div {
  height: 100%;
}

.LastCurses .slick-slide > div > div,
.LastScholarships .slick-slide > div > div,
.LastBlogs .slick-slide > div > div {
  padding: 10px 8px !important;
}

.Latest-courses-content .card,
.Latest-grants-content .card,
.maksed-Blog-content .card {
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 6px;
  border: none;
  border-radius: 14px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

[dir="rtl"] .Latest-courses-content .card,
[dir="rtl"] .Latest-grants-content .card,
[dir="rtl"] .maksed-Blog-content .card {
  direction: rtl;
}

.Latest-courses-content .card .card-img-top,
.Latest-grants-content .card .card-img-top {
  width: 100%;
  height: 150px;
  object-fit: cover;
  border-radius: 10px;
  background: var(--mk-bg);
}

.maksed-Blog-content .card {
  padding: 0;
}

.maksed-Blog-content .card .card-img-top {
  width: 100%;
  height: 170px;
  object-fit: cover;
  border-radius: 0;
  background: var(--mk-bg);
}

.Latest-courses-content .card .card-img-top.is-placeholder,
.Latest-grants-content .card .card-img-top.is-placeholder,
.maksed-Blog-content .card .card-img-top.is-placeholder {
  object-fit: contain;
  padding: 24px;
}

.Latest-courses-content .card .card-body,
.Latest-grants-content .card .card-body,
.maksed-Blog-content .card .card-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 8px 6px;
  text-align: start;
}

.maksed-Blog-content .card .card-body {
  padding: 14px 16px 16px;
}

.Latest-courses-content .card .card-title,
.Latest-grants-content .card .card-title,
.maksed-Blog-content .card .card-body .card-title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  min-height: 3em;
  margin: 0;
  padding: 0;
  background: none;
  border-radius: 0;
  font-family: "Cairo", sans-serif;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
  color: #222;
  text-decoration: none;
}

.maksed-Blog-content .card .card-body .card-title {
  font-size: 15px;
  font-weight: 700;
  color: #1d1d1f;
}

.Latest-courses-content .card .card-title:hover,
.Latest-grants-content .card .card-title:hover,
.maksed-Blog-content .card .card-body .card-title:hover {
  color: var(--mk-blue);
}

.Latest-courses-content .card .card-text,
.Latest-grants-content .card .card-text {
  display: none;
}

.maksed-Blog-content .card .card-text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  min-height: 3.2em;
  margin: 0;
  font-family: "Cairo", sans-serif;
  font-size: 12px;
  line-height: 1.6;
  color: var(--mk-gray);
}

.mk-card-meta {
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 12px;
  color: #444;
}

.Latest-courses-content .mk-card-meta .btn,
.Latest-grants-content .mk-card-meta .btn {
  width: auto;
  min-width: 76px;
  height: 28px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 14px;
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  background: var(--mk-red);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 60%;
}

.Latest-grants-content .mk-card-meta .btn {
  background: var(--mk-blue);
}

.Latest-courses-content .mk-card-meta .btn:hover,
.Latest-grants-content .mk-card-meta .btn:hover {
  color: #fff;
  transform: none;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.25);
}

.mk-tag {
  align-self: flex-start;
  padding: 2px 8px;
  border-radius: 4px;
  background: var(--mk-blue);
  color: #fff;
  font-size: 11px;
  line-height: 1.6;
}

.maksed-Blog-content .card .card-body .mk-card-more {
  margin-top: auto;
  align-self: flex-end;
  width: auto;
  min-width: 0;
  height: 30px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #555;
  border-radius: 6px;
  background: #fff;
  color: #333;
  font-size: 12px;
  font-weight: 500;
}

.maksed-Blog-content .card .card-body .mk-card-more .material-icons {
  font-size: 16px;
}

.maksed-Blog-content .card .card-body .mk-card-more:hover {
  background: var(--mk-blue);
  border-color: var(--mk-blue);
  color: #fff;
}

.mk-slider-nav {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  gap: 10px;
  padding: 14px 8px 0;
  direction: ltr;
}

[dir="ltr"] .mk-slider-nav {
  justify-content: flex-end;
}

.mk-slider-nav .mk-slider-btn {
  position: static;
  transform: none;
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 6px;
  background: #fff;
  color: var(--mk-purple);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
  cursor: pointer;
}

[dir="rtl"] .mk-slider-nav .mk-slider-next {
  order: -1;
}

.mk-slider-nav .mk-slider-btn .material-icons {
  font-size: 20px;
}

.mk-slider-nav .mk-slider-btn.slick-disabled {
  background: rgba(255, 255, 255, 0.4);
  color: #fff;
  box-shadow: none;
  cursor: default;
}

.mk-slider-nav .mk-slider-btn::before {
  content: none;
}

/* الرعاية */
.mk-sponsor {
  margin-top: 70px;
}

.mk-sponsor h5 {
  font-size: 26px;
  font-weight: 700;
  background: var(--mk-grad-blue);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.mk-sponsor-logo {
  width: 160px;
  height: 130px;
  margin: 30px auto 0;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #333;
  border-radius: 12px;
}

.mk-sponsor-logo img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

/* تواصل معنا في الرئيسية */
.mk-home-contact {
  margin-top: 80px;
}

.mk-home-contact-title {
  margin-bottom: 30px;
  text-align: center;
  font-size: 26px;
  font-weight: 700;
  background: var(--mk-grad-blue);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.mk-home-contact-box {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 360px;
}

.mk-home-contact-info {
  width: 55%;
  margin-inline-start: auto;
  min-height: 360px;
  padding: 70px 40px 40px 34%;
  border-radius: 30px;
  background: linear-gradient(135deg, #f4f6fa 0%, #e6ebf2 100%);
  order: 2;
}

[dir="rtl"] .mk-home-contact-info {
  margin-inline-start: 0;
  padding: 70px 50px 40px 30%;
  order: 0;
}

[dir="ltr"] .mk-home-contact-info {
  padding: 70px 30% 40px 50px;
}

.mk-home-contact-info h3 {
  max-width: 420px;
  font-size: 26px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--mk-blue);
}

.mk-home-contact-info p {
  max-width: 300px;
  margin-top: 40px;
  font-size: 15px;
  line-height: 1.7;
  color: #333;
}

.mk-home-contact-form {
  position: absolute;
  inset-inline-end: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 50%;
  padding: 26px 28px;
  border-radius: 24px;
  background: linear-gradient(120deg, #d6d6d6 0%, #e9eef5 100%);
  box-shadow: 0 6px 20px rgba(43, 43, 43, 0.08);
}

.mk-home-contact-form .form-label {
  margin-bottom: 6px;
  font-size: 12px;
  color: #333;
}

.mk-home-contact-form .form-control {
  min-height: 34px;
  border: none;
  border-radius: 4px;
  font-size: 12px;
}

.mk-home-contact-send {
  margin-top: 26px;
  margin-inline-start: 0;
  min-width: 56px;
  height: 30px;
  padding: 0 16px;
  border: none;
  border-radius: 8px;
  background: var(--mk-blue);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}

.mk-home-contact-send:hover {
  background: var(--mk-blue-light);
  color: #fff;
}

@media (max-width: 900px) {
  .mk-home-contact-box {
    flex-direction: column;
    min-height: 0;
  }

  .mk-home-contact-info,
  [dir="rtl"] .mk-home-contact-info,
  [dir="ltr"] .mk-home-contact-info {
    width: 100%;
    min-height: 0;
    padding: 30px 24px 90px;
  }

  .mk-home-contact-info p {
    margin-top: 16px;
  }

  .mk-home-contact-form {
    position: relative;
    inset: auto;
    transform: none;
    width: calc(100% - 32px);
    margin: -70px auto 0;
  }
}

/* الفوتر */
.mk-footer-social {
  justify-content: flex-start;
  gap: 10px;
  margin: 0;
}

.mk-footer-copy {
  direction: rtl;
  text-align: right;
  font-size: 13px;
}

[dir="ltr"] .mk-footer-copy {
  direction: ltr;
}

.mk-footer-sponsor {
  padding: 18px 16px;
  background: #fff;
  color: #111;
  text-align: center;
  font-size: 15px;
  font-weight: 700;
}

@media (max-width: 576px) {
  .mk-footer-social {
    justify-content: center;
    margin-top: 10px;
  }

  .mk-footer-copy {
    text-align: center;
  }
}

/* صفحات الدخول والتسجيل واستعادة كلمة المرور حسب تصميم Figma */
.mk-authx {
  position: relative;
  padding: 60px 0 70px;
}

.mk-authx::before {
  content: "";
  position: absolute;
  inset: 0 0 0 0;
  background: linear-gradient(180deg, #7d1527 0%, #b81f3c 55%, #e72c4c 100%);
  border-radius: 140px 0 140px 0;
  z-index: 0;
}

[dir="ltr"] .mk-authx::before {
  border-radius: 0 140px 0 140px;
}

.mk-authx > .container {
  position: relative;
  z-index: 1;
}

.mk-form-card.mk-authx-card {
  border-radius: 16px;
  padding: 44px 48px 56px;
  box-shadow: 0 6px 14px rgba(60, 0, 10, 0.35);
}

.mk-authx-title {
  color: var(--mk-red);
  font-weight: 700;
  font-size: 32px;
  text-align: center;
  margin: 0 0 40px;
}

.mk-authx-intro h2 {
  color: var(--mk-blue);
  font-weight: 700;
  font-size: 30px;
  text-align: center;
  margin: 0 0 22px;
}

.mk-authx-intro p {
  color: var(--mk-blue);
  font-size: 15px;
  line-height: 2;
  text-align: center;
  margin-bottom: 18px;
}

.mk-authx-intro a {
  color: var(--mk-red);
  font-weight: 700;
}

.mk-authx-steps {
  color: var(--mk-blue);
  font-size: 15px;
  line-height: 2;
}

.mk-authx-steps p,
.mk-authx-steps ol {
  text-align: start;
  margin-bottom: 4px;
}

.mk-authx-steps ol {
  padding-inline-start: 20px;
}

.mk-authx-steps .mk-authx-note {
  color: var(--mk-red);
  font-weight: 700;
}

.mk-authx-steps a {
  color: var(--mk-red);
  text-decoration: underline;
  font-weight: 400;
}

.mk-authx-form .mk-field {
  margin-bottom: 18px;
}

.mk-authx-form .form-control,
.mk-authx-form .form-select {
  height: 44px;
  border: 1px solid #b9c2c8;
  border-radius: 8px;
  font-size: 14px;
  box-shadow: none;
}

.mk-authx-form .form-control::placeholder {
  color: #9aa3a9;
}

.mk-authx-form .form-control:focus {
  border-color: var(--mk-blue);
}

.mk-authx-register .mk-authx-form .form-control {
  border-radius: 14px;
}

.mk-authx-form .iti {
  width: 100%;
}

.mk-authx-forgot {
  display: inline-block;
  color: #222;
  font-size: 13px;
  margin-top: -6px;
}

.mk-authx-forgot:hover {
  color: var(--mk-red);
}

.mk-form-card .mk-authx-sub {
  text-align: start;
  color: var(--mk-red);
  font-weight: 700;
  font-size: 24px;
  margin-bottom: 30px;
}

.mk-authx-btn {
  min-width: 140px;
  height: 44px;
  border: none;
  border-radius: 8px;
  color: #fff;
  font-weight: 700;
  font-size: 16px;
  background: linear-gradient(90deg, #e22c4b 0%, #a3204a 100%);
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
  transition: filter 0.2s;
}

.mk-authx-btn:hover {
  filter: brightness(1.08);
}

.mk-authx-form .mk-authx-terms {
  font-weight: 400;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #222;
  cursor: pointer;
  margin-bottom: 0;
}

.mk-authx-terms .form-check-input {
  margin: 0;
  border-radius: 2px;
  border-color: #333;
}

.mk-authx-success {
  display: none;
}

@media (max-width: 991px) {
  .mk-authx::before {
    border-radius: 60px 0 60px 0;
  }
  [dir="ltr"] .mk-authx::before {
    border-radius: 0 60px 0 60px;
  }
  .mk-form-card.mk-authx-card {
    padding: 30px 22px 36px;
  }
  .mk-authx-title {
    font-size: 26px;
    margin-bottom: 24px;
  }
  .mk-authx-intro h2 {
    font-size: 24px;
  }
}

/* صفحة التعريف باختبارات الشخصية حسب تصميم Figma */
.mk-tests-hero {
  position: relative;
  color: #fff;
  padding: 110px 0 120px;
  background: linear-gradient(180deg, rgba(200, 36, 64, 0.82) 0%, rgba(120, 20, 40, 0.78) 55%, rgba(30, 10, 20, 0.9) 100%), url('/Assets1/images/tests/hero.webp') center / cover no-repeat;
}

.mk-tests-hero-body {
  max-width: 720px;
}

.mk-tests-hero h1 {
  font-size: 34px;
  font-weight: 700;
  margin-bottom: 22px;
}

.mk-tests-hero p {
  font-size: 17px;
  line-height: 2.1;
  margin-bottom: 30px;
}

.mk-tests-hero-btn {
  height: 50px;
  padding: 0 26px;
  border: none;
  border-radius: 8px;
  background: #fff;
  color: var(--mk-red);
  font-weight: 700;
  font-size: 16px;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.25);
  transition: transform 0.2s;
}

.mk-tests-hero-btn:hover {
  transform: translateY(-2px);
}

.mk-tests-timeline {
  padding: 70px 0 40px;
}

.mk-tests-row {
  position: relative;
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  gap: 40px;
  margin-bottom: 70px;
}

.mk-tests-row.is-alt {
  flex-direction: row;
}

.mk-tests-row:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  width: 2px;
  height: 70px;
  background: var(--mk-red);
}

.mk-tests-box {
  flex: 0 0 56%;
  border: 2px solid var(--mk-red);
  border-radius: 10px;
  padding: 28px 30px 34px;
  background: #fff;
}

.mk-tests-box h2 {
  font-size: 26px;
  font-weight: 700;
  color: var(--mk-red);
  margin-bottom: 16px;
}

.mk-tests-row.is-alt .mk-tests-box h2 {
  color: var(--mk-blue);
}

.mk-tests-box p {
  font-size: 16px;
  line-height: 2.2;
  color: #222;
  margin: 0;
}

.mk-tests-img {
  flex: 1;
  text-align: center;
}

.mk-tests-img img {
  max-width: 100%;
  max-height: 330px;
}

.mk-tests-rules {
  color: #fff;
  padding: 70px 0;
  background: linear-gradient(180deg, rgba(43, 43, 43, 0.95) 0%, rgba(24, 24, 24, 0.88) 50%, rgba(20, 25, 35, 0.92) 100%), url('/Assets1/images/tests/hero.webp') center / cover no-repeat;
}

.mk-tests-rules h2 {
  text-align: center;
  font-size: 34px;
  font-weight: 700;
  margin-bottom: 14px;
}

.mk-tests-rules-sub {
  text-align: center;
  font-size: 19px;
  margin-bottom: 36px;
}

.mk-tests-rules h3 {
  font-size: 21px;
  font-weight: 700;
  margin-bottom: 14px;
}

.mk-tests-rules ol {
  font-size: 18px;
  line-height: 2.2;
  margin-bottom: 36px;
}

.mk-tests-rules ol strong {
  font-weight: 400;
}

.mk-tests-helps {
  position: relative;
  border: 2px solid var(--mk-red);
  border-radius: 30px;
  padding: 60px 40px 40px;
  margin-top: 30px;
}

.mk-tests-helps h2 {
  position: absolute;
  top: -24px;
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  padding: 0 40px;
  margin: 0;
  white-space: nowrap;
  color: var(--mk-red);
  font-size: 30px;
  font-weight: 700;
}

.mk-tests-helps ul {
  list-style: square;
  font-size: 19px;
  line-height: 2.1;
  margin: 0;
}

.mk-tests-helps li + li {
  margin-top: 22px;
}

.mk-tests-helps li::marker {
  font-size: 14px;
}

.mk-tests-helps img {
  max-width: 100%;
  max-height: 320px;
}

@media (max-width: 991px) {
  .mk-tests-hero {
    padding: 60px 0 70px;
  }
  .mk-tests-hero h1 {
    font-size: 26px;
  }
  .mk-tests-row,
  .mk-tests-row.is-alt {
    flex-direction: column-reverse;
    gap: 20px;
    margin-bottom: 50px;
  }
  .mk-tests-row:not(:last-child)::after {
    height: 50px;
  }
  .mk-tests-box {
    flex-basis: auto;
    width: 100%;
  }
  .mk-tests-img img {
    max-height: 220px;
  }
  .mk-tests-helps {
    padding: 50px 20px 30px;
  }
  .mk-tests-helps h2 {
    font-size: 22px;
    padding: 0 14px;
  }
  .mk-tests-helps ul {
    font-size: 16px;
  }
}

/* صفحة أسئلة الاختبار حسب تصميم Figma */
.mk-testx-hero {
  color: #fff;
  text-align: center;
  padding: 120px 0 140px;
  background: linear-gradient(180deg, rgba(231, 43, 74, 0.85) 0%, rgba(150, 25, 45, 0.8) 55%, rgba(25, 10, 15, 0.92) 100%), url('/Assets1/images/tests/hero.webp') center / cover no-repeat;
}

.mk-testx-hero h1 {
  font-size: 34px;
  font-weight: 700;
  margin-bottom: 18px;
}

.mk-testx-hero p {
  font-size: 30px;
  margin: 0;
}

.mk-testx-tests,
.mk-testx-stages {
  list-style: none;
  display: flex;
  justify-content: space-between;
  position: relative;
  padding: 0;
  margin: 0 auto 40px;
}

.mk-testx-tests {
  max-width: 900px;
}

.mk-testx-tests::before,
.mk-testx-stages::before {
  content: "";
  position: absolute;
  top: 24px;
  left: 30px;
  right: 30px;
  height: 2px;
  background: #d9d9d9;
}

.mk-testx-stages::before {
  top: 17px;
}

.mk-testx-tests li,
.mk-testx-stages li {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  min-width: 60px;
}

.mk-testx-dot {
  display: block;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: #fff;
  border: 5px dashed var(--mk-red);
}

.mk-testx-stages .mk-testx-dot {
  width: 36px;
  height: 36px;
  border-width: 3px;
}

.mk-testx-tests li.active .mk-testx-dot,
.mk-testx-stages li.active .mk-testx-dot {
  background: var(--mk-red);
  border-style: solid;
}

.mk-testx-tests li.active {
  cursor: pointer;
}

.mk-testx-tests li.current .mk-testx-dot {
  box-shadow: 0 0 0 5px rgba(231, 43, 74, 0.2);
}

.mk-testx-label {
  font-size: 14px;
  color: #222;
}

.mk-testx-num {
  font-size: 15px;
  font-weight: 700;
  color: #222;
}

.mk-testx-group {
  --mk-g: var(--mk-blue);
  position: relative;
  border: 2px solid var(--mk-g);
  border-radius: 30px;
  padding: 70px 34px 34px;
  margin: 50px 0 40px;
}

.mk-testx-group.is-red {
  --mk-g: var(--mk-red);
}

.mk-testx-group-title {
  position: absolute;
  top: -32px;
  inset-inline-start: 40px;
  inset-inline-end: 90px;
  background: var(--mk-g);
  color: #fff;
  border-radius: 10px;
  padding: 16px 24px;
  font-size: 18px;
  font-weight: 700;
}

.mk-testx-group-body {
  display: flex;
  gap: 24px;
  align-items: flex-start;
}

.mk-testx-group-img {
  width: 160px;
  border-radius: 10px;
  order: 2;
}

.mk-testx-options {
  flex: 1;
}

.mk-testx-option {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 18px;
  color: #222;
  padding: 6px 0;
  cursor: pointer;
}

.mk-testx-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.mk-testx-check {
  flex: 0 0 36px;
  height: 36px;
  border: 1px solid #cfcfcf;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12);
  position: relative;
  transition: background 0.15s;
}

.mk-testx-option input:checked + .mk-testx-check {
  background: #2ecc5b;
  border-color: #2ecc5b;
}

.mk-testx-option input:checked + .mk-testx-check::after {
  content: "";
  position: absolute;
  left: 12px;
  top: 6px;
  width: 11px;
  height: 18px;
  border: solid #fff;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}

.mk-testx-option input:focus-visible + .mk-testx-check {
  outline: 2px solid var(--mk-blue);
  outline-offset: 2px;
}

.mk-testx-actions {
  display: flex;
  align-items: center;
  gap: 16px;
}

.mk-testx-side {
  flex: 1;
}

.mk-testx-side.end {
  display: flex;
  justify-content: flex-end;
}

.mk-testx-count {
  font-size: 22px;
  color: #222;
  direction: ltr;
}

.mk-testx-actions .mk-authx-btn {
  min-width: 160px;
  height: 50px;
}

.mk-testx-back {
  min-width: 120px;
  height: 46px;
  border: 1px solid var(--mk-red);
  border-radius: 8px;
  background: #fff;
  color: var(--mk-red);
  font-weight: 700;
}

.mk-authx-btn .mk-spinner {
  display: none;
}

.mk-authx-btn.loading .mk-spinner {
  display: inline-block;
}

/* بطاقات النتائج */
.mk-rx-title {
  text-align: center;
  color: var(--mk-blue);
  font-size: 30px;
  font-weight: 700;
  padding-bottom: 18px;
  margin: 0 auto 40px;
  width: fit-content;
  min-width: 320px;
  max-width: 100%;
  padding-inline: 20px;
  border-bottom: 2px solid var(--mk-red);
}

.mk-rx-sub {
  text-align: center;
  color: var(--mk-red);
  font-size: 22px;
  margin: -20px 0 30px;
}

.mk-rx-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 34px 24px;
}

.mk-rx-card {
  --mk-c: linear-gradient(135deg, #8b1fd6, #6a12b8);
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.18);
  padding: 84px 18px 18px;
  min-height: 200px;
}

.mk-rx-card.c2 { --mk-c: linear-gradient(135deg, #3a3a3a, #1a1a1a); }
.mk-rx-card.c3 { --mk-c: linear-gradient(135deg, #ff7a1a, #f04e0c); }
.mk-rx-card.c4 { --mk-c: linear-gradient(135deg, #ff2d92, #d1146d); }

.mk-rx-num {
  position: absolute;
  top: -10px;
  inset-inline-end: 18px;
  width: 44%;
  height: 54px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 32px;
  font-weight: 700;
  background: var(--mk-c);
  border-radius: 14px 14px 30px 14px;
}

.mk-rx-card h3 {
  position: absolute;
  top: 12px;
  inset-inline-start: 18px;
  width: 46%;
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  color: #222;
  line-height: 1.8;
}

.mk-rx-card p {
  font-size: 13px;
  line-height: 1.9;
  color: #333;
  margin: 0 0 8px;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.mk-rx-card.open p {
  -webkit-line-clamp: unset;
}

.mk-rx-more {
  justify-self: center;
  border: none;
  background: none;
  color: #222;
  text-decoration: underline;
  font-size: 14px;
  padding: 0;
}

.mk-rx-card:has(h3:empty) {
  display: none;
}

.mk-rx-banner {
  color: #fff;
  text-align: center;
  padding: 34px 0;
  background: linear-gradient(180deg, #e72b4a 0%, #8f1b31 60%, #2b0a12 100%);
}

.mk-rx-banner h3 {
  font-size: 30px;
  font-weight: 700;
  margin-bottom: 14px;
}

.mk-rx-banner p {
  font-size: 16px;
  line-height: 2;
  margin: 0;
}

.mk-chart-box {
  height: 340px;
}

.mk-rx-hero h1 {
  font-size: 44px;
  margin-bottom: 20px;
}

.mk-rx-hero h2 {
  font-size: 40px;
  font-weight: 700;
  margin-bottom: 50px;
}

.mk-rx-hero p {
  font-size: 18px;
  line-height: 2;
  max-width: 1000px;
  margin: 0 auto 36px;
}

.mk-rx-social {
  list-style: none;
  display: flex;
  justify-content: center;
  gap: 12px;
  padding: 0;
  margin: 0;
}

.mk-rx-social a {
  display: flex;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #fff;
  align-items: center;
  justify-content: center;
}

.mk-rx-social img {
  width: 16px;
  height: 16px;
  filter: brightness(0);
}

.mk-rx-lead {
  text-align: center;
  font-size: 22px;
  line-height: 1.9;
  color: #222;
  margin-bottom: 40px;
}

.mk-rx-text h3 {
  font-size: 17px;
  font-weight: 700;
  color: #8a8a8a;
  margin: 0 0 6px;
}

.mk-rx-text .t2 h3 { color: #2b2b2b; }
.mk-rx-text .t3 h3 { color: #f07a1a; }

.mk-rx-text p {
  font-size: 15px;
  line-height: 2;
  margin-bottom: 14px;
}

.mk-rx-text div:has(h3:empty) {
  display: none;
}

.mk-rx-back {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 240px;
  height: 52px;
  color: #fff;
  text-decoration: none;
}

@media (max-width: 991px) {
  .mk-testx-hero {
    padding: 60px 0 70px;
  }
  .mk-testx-hero h1 {
    font-size: 26px;
  }
  .mk-testx-hero p {
    font-size: 20px;
  }
  .mk-testx-stages {
    overflow-x: auto;
    gap: 14px;
    padding-bottom: 6px;
  }
  .mk-testx-stages::before {
    display: none;
  }
  .mk-testx-label {
    font-size: 12px;
    text-align: center;
  }
  .mk-testx-dot {
    width: 38px;
    height: 38px;
    border-width: 4px;
  }
  .mk-testx-tests::before {
    top: 19px;
  }
  .mk-testx-group {
    padding: 64px 18px 24px;
  }
  .mk-testx-group-title {
    inset-inline: 18px;
    font-size: 16px;
    padding: 12px 16px;
  }
  .mk-testx-group-body {
    flex-direction: column;
  }
  .mk-testx-option {
    font-size: 16px;
  }
  .mk-testx-actions .mk-authx-btn {
    min-width: 110px;
  }
  .mk-rx-cards {
    grid-template-columns: 1fr;
  }
  .mk-rx-banner h3 {
    font-size: 22px;
  }
  .mk-rx-hero h1,
  .mk-rx-hero h2 {
    font-size: 26px;
  }
  .mk-rx-title {
    font-size: 22px;
    min-width: 0;
  }
  .mk-rx-hero p,
  .mk-rx-lead {
    font-size: 16px;
  }
}

/* صفحة عن الخدمات التعليمية حسب تصميم Figma */
.mk-svc-hero {
  color: #fff;
  padding: 130px 0 110px;
  background: linear-gradient(180deg, rgba(222, 32, 40, 0.78) 0%, rgba(160, 15, 25, 0.8) 55%, rgba(20, 5, 8, 0.92) 100%), url('/Assets1/images/30f145e6ea0f225c191ab41e77209d69097c5501.jpg') center / cover no-repeat;
}

.mk-svc-hero-text {
  max-width: 1150px;
}

.mk-svc-hero h1 {
  font-size: 34px;
  font-weight: 700;
  margin-bottom: 30px;
}

.mk-svc-hero p {
  font-size: 22px;
  line-height: 2.1;
  margin: 0;
}

.mk-svc-hero-actions {
  display: flex;
  justify-content: flex-start;
  margin-top: 70px;
}

.mk-svc-hero-actions .mk-authx-btn,
.mk-svc-available .mk-authx-btn,
.mk-svc-features .mk-authx-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 220px;
  height: 64px;
  padding: 0 30px;
  font-size: 20px;
  color: #fff;
  text-decoration: none;
  border: 1px solid rgba(255, 255, 255, 0.8);
}

.mk-svc-steps {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

.mk-svc-steps ol {
  list-style: none;
  counter-reset: svc;
  padding: 0;
  margin: 0;
  flex: 1;
}

.mk-svc-steps li {
  counter-increment: svc;
  font-size: 26px;
  line-height: 1.65;
  color: #222;
}

.mk-svc-steps li::before {
  content: counter(svc) "-";
}

.mk-svc-steps img {
  width: 460px;
  max-width: 40%;
}

.mk-svc-available {
  color: #fff;
  padding: 120px 0;
  background: linear-gradient(180deg, #4a4a4a 0%, #222222 55%, #0d0d0d 100%);
}

.mk-svc-available .container {
  display: flex;
  align-items: center;
  gap: 60px;
}

.mk-svc-available-text {
  flex: 1;
}

.mk-svc-available h2 {
  font-size: 30px;
  font-weight: 700;
  margin-bottom: 40px;
}

.mk-svc-available p {
  font-size: 20px;
  line-height: 2;
  margin-bottom: 70px;
}

.mk-svc-available .mk-authx-btn {
  min-width: 230px;
  height: 62px;
}

.mk-svc-available-img {
  position: relative;
  flex: 0 0 620px;
  max-width: 45%;
  padding: 0 0 0 22px;
}

.mk-svc-available-img::before {
  content: "";
  position: absolute;
  top: -22px;
  bottom: 40px;
  left: 0;
  right: 22px;
  border: 3px solid #fff;
  border-radius: 20px;
}

.mk-svc-available-img img {
  position: relative;
  width: 100%;
  border-radius: 20px;
}

.mk-svc-features {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
  padding: 40px 56px 50px;
}

.mk-svc-features ul {
  list-style: none;
  padding: 0;
  margin: 0 0 60px;
}

.mk-svc-features li {
  display: flex;
  align-items: center;
  gap: 26px;
  font-size: 26px;
  font-weight: 700;
  color: #222;
  margin-bottom: 36px;
}

.mk-svc-features-icon img {
  width: 96px;
  margin: -14px;
}

.mk-svc-features p {
  font-size: 24px;
  color: #222;
  margin-bottom: 70px;
}

@media (max-width: 991px) {
  .mk-svc-hero {
    padding: 60px 0;
  }
  .mk-svc-hero h1 {
    font-size: 26px;
  }
  .mk-svc-hero p {
    font-size: 17px;
  }
  .mk-svc-hero-actions {
    margin-top: 36px;
  }
  .mk-svc-steps,
  .mk-svc-available .container {
    flex-direction: column;
  }
  .mk-svc-steps li {
    font-size: 19px;
  }
  .mk-svc-steps img {
    max-width: 70%;
  }
  .mk-svc-available {
    padding: 60px 0;
  }
  .mk-svc-available p {
    font-size: 17px;
    margin-bottom: 36px;
  }
  .mk-svc-available-img {
    flex-basis: auto;
    max-width: 100%;
    margin-top: 30px;
  }
  .mk-svc-features {
    padding: 24px 18px 30px;
  }
  .mk-svc-features li {
    font-size: 17px;
    gap: 14px;
  }
  .mk-svc-features-icon img {
    width: 70px;
    margin: -10px;
  }
  .mk-svc-features p {
    font-size: 18px;
    margin-bottom: 30px;
  }
  .mk-svc-hero-actions .mk-authx-btn,
  .mk-svc-available .mk-authx-btn,
  .mk-svc-features .mk-authx-btn {
    height: 52px;
    font-size: 17px;
  }
}

/* صفحتا الخدمات الطلابية واختيار الخدمات حسب تصميم Figma */
.mk-svc-hero.is-students {
  background-image: linear-gradient(180deg, rgba(222, 32, 40, 0.8) 0%, rgba(160, 15, 25, 0.82) 55%, rgba(20, 5, 8, 0.93) 100%), url('/Assets1/images/services/students.webp');
}

.mk-svc-card {
  display: flex;
  align-items: stretch;
  min-height: 520px;
  margin: 0 0 110px;
  border-radius: 70px 0 70px 0;
  overflow: hidden;
  background: #2b2b2b;
}

.mk-svc-card.is-alt {
  flex-direction: row-reverse;
}

.mk-svc-card-text {
  position: relative;
  z-index: 1;
  flex: 0 0 48%;
  align-self: center;
  background: #fff;
  border-radius: 20px;
  padding: 60px 36px;
  margin-inline-start: 60px;
  margin-inline-end: -6%;
  min-height: 390px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.mk-svc-card.is-alt .mk-svc-card-text {
  margin-inline-start: -6%;
  margin-inline-end: 60px;
}

.mk-svc-card-text h2 {
  color: #2b2b2b;
  font-size: 30px;
  font-weight: 700;
  margin: 0 0 24px;
}

.mk-svc-card-text p {
  font-size: 21px;
  line-height: 2.1;
  color: #222;
  margin: 0;
}

.mk-svc-card-img {
  flex: 1;
  overflow: hidden;
}

.mk-svc-card-img img {
  width: 134%;
  height: 100%;
  margin-inline: -17%;
  object-fit: cover;
  display: block;
}

.mk-svc-discover {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 380px;
  height: 110px;
  font-size: 40px;
  color: #fff;
  text-decoration: none;
}

.mk-svc-awaiting {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border: 2px solid var(--mk-red);
  border-radius: 16px;
  padding: 24px 30px;
  margin-bottom: 60px;
}

.mk-svc-awaiting h3 {
  color: var(--mk-red);
  font-size: 22px;
  font-weight: 700;
}

.mk-svc-awaiting p {
  margin: 0;
}

.mk-svc-awaiting .mk-authx-btn {
  display: inline-flex;
  align-items: center;
  padding: 0 30px;
  height: 52px;
  color: #fff;
  text-decoration: none;
}

.mk-svc-package {
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.22);
  padding: 50px 64px 70px;
}

.mk-svc-package h2 {
  text-align: center;
  color: var(--mk-red);
  font-size: 34px;
  font-weight: 700;
  margin-bottom: 50px;
}

.mk-svc-package-note {
  text-align: center;
  color: #2b2b2b;
  font-weight: 700;
  margin: -30px 0 30px;
}

.mk-svc-package h3 {
  font-size: 26px;
  font-weight: 700;
  color: #222;
  margin-bottom: 26px;
}

.mk-svc-package-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 21px;
  color: #222;
  margin-bottom: 14px;
  cursor: pointer;
}

.mk-svc-package-item input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.mk-svc-package-box {
  flex: 0 0 38px;
  height: 38px;
  border: 1px solid #8a8a8a;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18);
  position: relative;
}

.mk-svc-package-item input:checked + .mk-svc-package-box {
  background: #2ecc5b;
  border-color: #2ecc5b;
}

.mk-svc-package-item input:checked + .mk-svc-package-box::after {
  content: "";
  position: absolute;
  left: 13px;
  top: 6px;
  width: 11px;
  height: 19px;
  border: solid #fff;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}

.mk-svc-package-item input:focus-visible + .mk-svc-package-box {
  outline: 2px solid #2b2b2b;
  outline-offset: 2px;
}

.mk-svc-package-info {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #444;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  font-family: serif;
  cursor: help;
}

.mk-svc-package textarea {
  min-height: 170px;
  border: 1px solid #8a8a8a;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}

.mk-svc-package #btnSavePackage {
  min-width: 200px;
  height: 64px;
  font-size: 22px;
  margin-top: 80px;
}

@media (max-width: 991px) {
  .mk-svc-card,
  .mk-svc-card.is-alt {
    flex-direction: column-reverse;
    min-height: 0;
    margin-bottom: 50px;
    border-radius: 40px 0 40px 0;
  }
  .mk-svc-card-img {
    height: 220px;
    flex: none;
  }
  .mk-svc-card-text,
  .mk-svc-card.is-alt .mk-svc-card-text {
    margin: -40px 16px 20px;
    min-height: 0;
    padding: 26px 20px;
  }
  .mk-svc-card-text h2 {
    font-size: 22px;
    margin-bottom: 12px;
  }
  .mk-svc-card-text p {
    font-size: 16px;
  }
  .mk-svc-discover {
    min-width: 240px;
    height: 64px;
    font-size: 24px;
  }
  .mk-svc-package {
    padding: 30px 18px 40px;
  }
  .mk-svc-package h2 {
    font-size: 24px;
    margin-bottom: 30px;
  }
  .mk-svc-package h3 {
    font-size: 20px;
  }
  .mk-svc-package-item {
    font-size: 17px;
  }
  .mk-svc-package #btnSavePackage {
    margin-top: 40px;
  }
}

/* صفحة عن التدريب حسب تصميم Figma */
.mk-svc-hero.is-training {
  background-image: linear-gradient(180deg, rgba(74, 74, 74, 0.85) 0%, rgba(34, 34, 34, 0.82) 55%, rgba(13, 13, 13, 0.92) 100%), url('/Assets1/images/services/students.webp');
}

.mk-svc-hero-actions {
  gap: 40px;
}

.mk-rx-title.is-dark {
  color: #222;
  min-width: 480px;
  border-bottom-width: 5px;
  margin-bottom: 80px;
}

.mk-train-steps {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 30px;
  text-align: center;
}

.mk-train-step img {
  width: 90px;
  height: 90px;
  object-fit: contain;
  margin-bottom: 14px;
}

.mk-train-step h3 {
  font-size: 22px;
  font-weight: 700;
  color: #222;
  margin-bottom: 26px;
}

.mk-train-step p {
  font-size: 17px;
  line-height: 1.9;
  color: #222;
  max-width: 220px;
  margin: 0 auto;
}

.mk-train-title {
  text-align: center;
  color: #2b2b2b;
  font-size: 34px;
  font-weight: 700;
  margin-bottom: 70px;
}

.mk-train-about p {
  font-size: 21px;
  line-height: 2.1;
  color: #222;
  margin-bottom: 26px;
}

.mk-train-about .mk-authx-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 270px;
  height: 66px;
  font-size: 22px;
  color: #fff;
  text-decoration: none;
}

.mk-train-about img {
  width: 410px;
}

@media (max-width: 991px) {
  .mk-train-steps {
    grid-template-columns: repeat(2, 1fr);
  }
  .mk-rx-title.is-dark {
    min-width: 0;
    margin-bottom: 40px;
  }
  .mk-train-title {
    font-size: 24px;
    margin-bottom: 30px;
  }
  .mk-train-about p {
    font-size: 17px;
  }
  .mk-svc-hero-actions {
    gap: 14px;
    flex-wrap: wrap;
  }
}

/* صفحة تصفح الدورات حسب تصميم Figma */
.mk-course-hero .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.mk-course-hero h1 {
  margin-bottom: 70px;
}

.mk-course-filters {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  width: 100%;
  max-width: 1000px;
  margin-bottom: 70px;
}

.mk-course-hero .mk-course-filters .select2-container--default .select2-selection--single {
  height: 50px !important;
  border: 1px solid #2b2b2b !important;
  border-radius: 12px !important;
  display: flex;
  align-items: center;
}

.mk-course-hero .mk-course-filters .select2-container--default .select2-selection__rendered {
  font-size: 17px;
  color: #222;
  line-height: 48px !important;
  padding-inline: 18px 40px;
}

.mk-course-hero .mk-course-filters .select2-container--default .select2-selection__arrow {
  height: 48px !important;
  inset-inline-end: 12px;
}

.mk-course-hero .btnSearch {
  min-width: 300px;
  height: 80px;
  font-size: 26px;
}

.mk-course-sec-title {
  width: fit-content;
  font-size: 40px;
  font-weight: 700;
  color: #222;
  padding-bottom: 14px;
  border-bottom: 5px solid #e32847;
  margin: 70px 0 40px;
}

.mk-course-group:first-child .mk-course-sec-title,
#CoursesResults .mk-course-sec-title {
  margin-top: 0;
}

.mk-course-panel {
  display: block !important;
  margin: 0 !important;
}

.mk-course-panel .Latest-courses-content-header h6 {
  color: #fff;
}

.mk-course-panel .Latest-courses-content-header a {
  color: #fff;
  text-decoration: none;
}

.mk-course-none {
  color: #fff;
  font-size: 17px;
  text-align: center;
  padding: 50px 0;
  margin: 0;
}

.mk-course-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 991px) {
  .mk-course-filters {
    grid-template-columns: repeat(2, 1fr);
    margin-bottom: 30px;
  }
  .mk-course-hero h1 {
    margin-bottom: 30px;
  }
  .mk-course-hero .btnSearch {
    min-width: 200px;
    height: 56px;
    font-size: 20px;
  }
  .mk-course-sec-title {
    font-size: 26px;
  }
  .mk-course-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .mk-course-filters,
  .mk-course-grid {
    grid-template-columns: 1fr;
  }
}

/* صفحة الدورة حسب تصميم Figma */
.mk-cd-hero .container {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 60px;
}

.mk-cd-hero-text {
  flex: 1;
  max-width: 640px;
}

.mk-cd-hero h1 {
  font-size: 32px;
  line-height: 1.6;
  margin-bottom: 30px;
}

.mk-cd-lead {
  font-size: 19px !important;
  font-weight: 700;
  margin-bottom: 26px !important;
}

.mk-cd-infos {
  list-style: none;
  padding: 0;
  margin: 0;
}

.mk-cd-infos li {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 18px;
  color: #fff;
  margin-bottom: 22px;
}

.mk-cd-infos .material-icons {
  font-size: 26px;
}

.mk-cd-card {
  width: 400px;
  flex-shrink: 0;
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.25);
  margin-bottom: -120px;
  position: relative;
  z-index: 2;
}

.mk-cd-media .mk-video {
  position: relative;
  padding-top: 56.25%;
}

.mk-cd-media .mk-video iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.mk-cd-media img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  display: block;
}

.mk-cd-card-body {
  padding: 24px 30px 30px;
  color: #222;
}

.mk-cd-card-body h3 {
  font-size: 21px;
  font-weight: 700;
  color: #2b2b2b;
  margin-bottom: 20px;
}

.mk-cd-card-body ul {
  list-style: none;
  padding: 0;
  margin: 0 0 34px;
}

.mk-cd-card-body li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  margin-bottom: 10px;
}

.mk-cd-card-body li .material-icons {
  color: #e32847;
  font-size: 20px;
}

.mk-cd-card-body .mk-authx-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 62px;
  font-size: 21px;
  color: #fff;
  text-decoration: none;
}

.mk-cd-body {
  padding-top: 80px;
}

.mk-cd-body .container > :first-child {
  margin-top: 60px;
}

.mk-cd-title {
  width: fit-content;
  font-size: 34px;
  font-weight: 700;
  color: #2b2b2b;
  padding-bottom: 10px;
  border-bottom: 4px solid #2b2b2b;
  margin: 70px 0 40px;
}

.mk-cd-accordion details {
  border: 1px solid #bbb;
  background: #f4f4f8;
}

.mk-cd-accordion summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  list-style: none;
  cursor: pointer;
  padding: 14px 22px;
  font-size: 24px;
  font-weight: 700;
  color: #111;
  background: #f4f4f8;
}

.mk-cd-accordion summary::-webkit-details-marker {
  display: none;
}

.mk-cd-accordion summary .material-icons {
  font-size: 34px;
  transition: transform 0.2s;
}

.mk-cd-accordion details[open] summary {
  border-bottom: 1px solid #bbb;
}

.mk-cd-accordion details[open] summary .material-icons {
  transform: rotate(180deg);
}

.mk-cd-accordion ul {
  list-style: none;
  padding: 20px 30px;
  margin: 0;
}

.mk-cd-accordion li a {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 21px;
  color: #222;
  text-decoration: none;
  padding: 6px 0;
}

.mk-cd-accordion li a:hover {
  color: #e32847;
}

.mk-cd-accordion li .material-icons {
  color: #e32847;
  font-size: 20px;
}

.mk-cd-none {
  padding: 20px 30px;
  margin: 0;
  color: #666;
}

.mk-cd-desc {
  font-size: 18px;
  line-height: 2;
  color: #222;
}

.mk-cd-similar {
  margin-top: 40px;
}

@media (max-width: 991px) {
  .mk-cd-hero .container {
    flex-direction: column;
    align-items: stretch;
    gap: 30px;
  }
  .mk-cd-card {
    width: 100%;
    margin-bottom: 0;
  }
  .mk-cd-hero h1 {
    font-size: 24px;
  }
  .mk-cd-body {
    padding-top: 30px;
  }
  .mk-cd-body .container > :first-child {
    margin-top: 0;
  }
  .mk-cd-title {
    font-size: 26px;
    margin: 40px 0 24px;
  }
  .mk-cd-accordion summary {
    font-size: 19px;
  }
  .mk-cd-accordion li a {
    font-size: 17px;
  }
}

.LastCurses:not(.slick-initialized) {
  display: none;
}

.LastCurses.is-empty {
  display: flex;
  justify-content: center;
}

.LastCurses.is-empty > div {
  width: 300px;
}

.header-top-line {
  background: var(--mk-red);
}

.featured-categories {
  justify-content: center !important;
  gap: 60px;
}

/* الأزرار المعبأة كلها بأحمر المنصة الموحد */
.login-btn,
.signup-btn,
.contact-btn,
.btn-danger,
.mk-btn:not(.outline):not(.white),
.mk-authx-btn,
.mk-home-contact-send,
.mk-card-meta .btn,
.Latest-courses-content .mk-card-meta .btn,
.Latest-grants-content .mk-card-meta .btn,
.maksed-website .btn {
  background: var(--mk-red) !important;
  border-color: var(--mk-red) !important;
  color: #fff !important;
}

.login-btn:hover,
.signup-btn:hover,
.contact-btn:hover,
.btn-danger:hover,
.mk-btn:not(.outline):not(.white):hover,
.mk-authx-btn:hover,
.mk-home-contact-send:hover,
.mk-card-meta .btn:hover,
.Latest-courses-content .mk-card-meta .btn:hover,
.Latest-grants-content .mk-card-meta .btn:hover,
.maksed-website .btn:hover {
  background: #c8213d !important;
  border-color: #c8213d !important;
  color: #fff !important;
}

.mk-btn.outline {
  border-color: var(--mk-red) !important;
  color: var(--mk-red) !important;
}

.mk-slider-btn:not(.slick-disabled) {
  color: var(--mk-red);
}