/* === الأساسيات العامة للواجهة === */
body{
  background:#f4f5fb;
  margin:0;
}

.card-shadow{
  box-shadow:0 18px 40px rgba(15,23,42,.10);
  border-radius:1.25rem;
}

.resume-preview{
  background:#fff;
  padding:2rem;
  border-radius:1.25rem;
  box-shadow:0 18px 35px rgba(15,23,42,.18);
}

.resume-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  border-bottom:3px solid rgba(15,23,42,.08);
  padding-bottom:1rem;
  margin-bottom:1.5rem;
}

.resume-name{
  font-size:1.8rem;
  font-weight:800;
}

.section-title{
  font-size:.9rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  margin-bottom:.6rem;
}

.badge-soft{
  background:rgba(15,23,42,.04);
  border-radius:999px;
  padding:.35rem .9rem;
  font-size:.78rem;
}

.color-dot{
  width:26px;
  height:26px;
  border-radius:50%;
  border:2px solid transparent;
  cursor:pointer;
}

.color-dot.selected{
  border-color:#0f172a;
}

/* === إعدادات الطباعة: طباعة السيرة فقط بدون الهيدر/الفوتر === */
@media print{
  nav.navbar,
  footer,
  .no-print{
    display:none !important;
  }

  body{
    background:#fff !important;
    margin:0;
  }

  main > .container{
    max-width:100% !important;
    padding:0 !important;
    margin:0 !important;
  }

  .resume-preview{
    box-shadow:none !important;
    border-radius:0 !important;
    padding:0 !important;
  }

  *{
    -webkit-print-color-adjust:exact !important;
    print-color-adjust:exact !important;
  }
}

/* === تمييز لون القالب المختار === */

.makescv-theme-color-option span {
  transition: transform .15s ease, box-shadow .15s ease, outline-color .15s ease;
}

/* سواء عن طريق :checked أو بإضافة is-active من الجافاسكربت */
.makescv-theme-color-option .btn-check:checked + span,
.makescv-theme-color-option.is-active span {
  outline: 2px solid #2563eb !important;
  outline-offset: 2px;
  box-shadow: 0 0 0 2px rgba(148,163,184,0.5);
  transform: scale(1.1);
}

/* ========================================= */
/* === RTL: ضبط السايدبار (الأيقونات + النصوص) لكل القوالب 1–20 === */
/*
نمط الأسماء المفترض:
cv1-wrapper / cv1-rtl / cv1-sidebar / cv1-side-list / cv1-side-bullets / cv1-side-label / cv1-side-value
cv2-wrapper / cv2-rtl / cv2-sidebar / ...
...
cv20-wrapper / cv20-rtl / ...
*/

/* 1) الأيقونات + العناصر داخل السايدبار: flex row (الأول يظهر في يمين السطر في RTL) */
.cv1-wrapper.cv1-rtl .cv1-sidebar .cv1-side-list li,
.cv1-wrapper.cv1-rtl .cv1-sidebar .cv1-side-bullets li,
.cv2-wrapper.cv2-rtl .cv2-sidebar .cv2-side-list li,
.cv2-wrapper.cv2-rtl .cv2-sidebar .cv2-side-bullets li,
.cv3-wrapper.cv3-rtl .cv3-sidebar .cv3-side-list li,
.cv3-wrapper.cv3-rtl .cv3-sidebar .cv3-side-bullets li,
.cv4-wrapper.cv4-rtl .cv4-sidebar .cv4-side-list li,
.cv4-wrapper.cv4-rtl .cv4-sidebar .cv4-side-bullets li,
.cv5-wrapper.cv5-rtl .cv5-sidebar .cv5-side-list li,
.cv5-wrapper.cv5-rtl .cv5-sidebar .cv5-side-bullets li,
.cv6-wrapper.cv6-rtl .cv6-sidebar .cv6-side-list li,
.cv6-wrapper.cv6-rtl .cv6-sidebar .cv6-side-bullets li,
.cv7-wrapper.cv7-rtl .cv7-sidebar .cv7-side-list li,
.cv7-wrapper.cv7-rtl .cv7-sidebar .cv7-side-bullets li,
.cv8-wrapper.cv8-rtl .cv8-sidebar .cv8-side-list li,
.cv8-wrapper.cv8-rtl .cv8-sidebar .cv8-side-bullets li,
.cv9-wrapper.cv9-rtl .cv9-sidebar .cv9-side-list li,
.cv9-wrapper.cv9-rtl .cv9-sidebar .cv9-side-bullets li,
.cv10-wrapper.cv10-rtl .cv10-sidebar .cv10-side-list li,
.cv10-wrapper.cv10-rtl .cv10-sidebar .cv10-side-bullets li,
.cv11-wrapper.cv11-rtl .cv11-sidebar .cv11-side-list li,
.cv11-wrapper.cv11-rtl .cv11-sidebar .cv11-side-bullets li,
.cv12-wrapper.cv12-rtl .cv12-sidebar .cv12-side-list li,
.cv12-wrapper.cv12-rtl .cv12-sidebar .cv12-side-bullets li,
.cv13-wrapper.cv13-rtl .cv13-sidebar .cv13-side-list li,
.cv13-wrapper.cv13-rtl .cv13-sidebar .cv13-side-bullets li,
.cv14-wrapper.cv14-rtl .cv14-sidebar .cv14-side-list li,
.cv14-wrapper.cv14-rtl .cv14-sidebar .cv14-side-bullets li,
.cv15-wrapper.cv15-rtl .cv15-sidebar .cv15-side-list li,
.cv15-wrapper.cv15-rtl .cv15-sidebar .cv15-side-bullets li,
.cv16-wrapper.cv16-rtl .cv16-sidebar .cv16-side-list li,
.cv16-wrapper.cv16-rtl .cv16-sidebar .cv16-side-bullets li,
.cv17-wrapper.cv17-rtl .cv17-sidebar .cv17-side-list li,
.cv17-wrapper.cv17-rtl .cv17-sidebar .cv17-side-bullets li,
.cv18-wrapper.cv18-rtl .cv18-sidebar .cv18-side-list li,
.cv18-wrapper.cv18-rtl .cv18-sidebar .cv18-side-bullets li,
.cv19-wrapper.cv19-rtl .cv19-sidebar .cv19-side-list li,
.cv19-wrapper.cv19-rtl .cv19-sidebar .cv19-side-bullets li,
.cv20-wrapper.cv20-rtl .cv20-sidebar .cv20-side-list li,
.cv20-wrapper.cv20-rtl .cv20-sidebar .cv20-side-bullets li {
  display:flex;
  align-items:flex-start;
  flex-direction:row; /* العنصر الأول (الأيقونة) يظهر في يمين السطر في RTL */
}

/* 2) ليبل وقيمة CONTACT (الهاتف، الإيميل، العنوان، الموقع) يمين بالكامل */
.cv1-wrapper.cv1-rtl .cv1-sidebar .cv1-side-list li > div,
.cv2-wrapper.cv2-rtl .cv2-sidebar .cv2-side-list li > div,
.cv3-wrapper.cv3-rtl .cv3-sidebar .cv3-side-list li > div,
.cv4-wrapper.cv4-rtl .cv4-sidebar .cv4-side-list li > div,
.cv5-wrapper.cv5-rtl .cv5-sidebar .cv5-side-list li > div,
.cv6-wrapper.cv6-rtl .cv6-sidebar .cv6-side-list li > div,
.cv7-wrapper.cv7-rtl .cv7-sidebar .cv7-side-list li > div,
.cv8-wrapper.cv8-rtl .cv8-sidebar .cv8-side-list li > div,
.cv9-wrapper.cv9-rtl .cv9-sidebar .cv9-side-list li > div,
.cv10-wrapper.cv10-rtl .cv10-sidebar .cv10-side-list li > div,
.cv11-wrapper.cv11-rtl .cv11-sidebar .cv11-side-list li > div,
.cv12-wrapper.cv12-rtl .cv12-sidebar .cv12-side-list li > div,
.cv13-wrapper.cv13-rtl .cv13-sidebar .cv13-side-list li > div,
.cv14-wrapper.cv14-rtl .cv14-sidebar .cv14-side-list li > div,
.cv15-wrapper.cv15-rtl .cv15-sidebar .cv15-side-list li > div,
.cv16-wrapper.cv16-rtl .cv16-sidebar .cv16-side-list li > div,
.cv17-wrapper.cv17-rtl .cv17-sidebar .cv17-side-list li > div,
.cv18-wrapper.cv18-rtl .cv18-sidebar .cv18-side-list li > div,
.cv19-wrapper.cv19-rtl .cv19-sidebar .cv19-side-list li > div,
.cv20-wrapper.cv20-rtl .cv20-sidebar .cv20-side-list li > div {
  text-align:right;
  width:100%;
}

/* side-label/side-value يمين في جميع القوالب RTL */
.cv1-wrapper.cv1-rtl .cv1-sidebar .cv1-side-label,
.cv1-wrapper.cv1-rtl .cv1-sidebar .cv1-side-value,
.cv2-wrapper.cv2-rtl .cv2-sidebar .cv2-side-label,
.cv2-wrapper.cv2-rtl .cv2-sidebar .cv2-side-value,
.cv3-wrapper.cv3-rtl .cv3-sidebar .cv3-side-label,
.cv3-wrapper.cv3-rtl .cv3-sidebar .cv3-side-value,
.cv4-wrapper.cv4-rtl .cv4-sidebar .cv4-side-label,
.cv4-wrapper.cv4-rtl .cv4-sidebar .cv4-side-value,
.cv5-wrapper.cv5-rtl .cv5-sidebar .cv5-side-label,
.cv5-wrapper.cv5-rtl .cv5-sidebar .cv5-side-value,
.cv6-wrapper.cv6-rtl .cv6-sidebar .cv6-side-label,
.cv6-wrapper.cv6-rtl .cv6-sidebar .cv6-side-value,
.cv7-wrapper.cv7-rtl .cv7-sidebar .cv7-side-label,
.cv7-wrapper.cv7-rtl .cv7-sidebar .cv7-side-value,
.cv8-wrapper.cv8-rtl .cv8-sidebar .cv8-side-label,
.cv8-wrapper.cv8-rtl .cv8-sidebar .cv8-side-value,
.cv9-wrapper.cv9-rtl .cv9-sidebar .cv9-side-label,
.cv9-wrapper.cv9-rtl .cv9-sidebar .cv9-side-value,
.cv10-wrapper.cv10-rtl .cv10-sidebar .cv10-side-label,
.cv10-wrapper.cv10-rtl .cv10-sidebar .cv10-side-value,
.cv11-wrapper.cv11-rtl .cv11-sidebar .cv11-side-label,
.cv11-wrapper.cv11-rtl .cv11-sidebar .cv11-side-value,
.cv12-wrapper.cv12-rtl .cv12-sidebar .cv12-side-label,
.cv12-wrapper.cv12-rtl .cv12-sidebar .cv12-side-value,
.cv13-wrapper.cv13-rtl .cv13-sidebar .cv13-side-label,
.cv13-wrapper.cv13-rtl .cv13-sidebar .cv13-side-value,
.cv14-wrapper.cv14-rtl .cv14-sidebar .cv14-side-label,
.cv14-wrapper.cv14-rtl .cv14-sidebar .cv14-side-value,
.cv15-wrapper.cv15-rtl .cv15-sidebar .cv15-side-label,
.cv15-wrapper.cv15-rtl .cv15-sidebar .cv15-side-value,
.cv16-wrapper.cv16-rtl .cv16-sidebar .cv16-side-label,
.cv16-wrapper.cv16-rtl .cv16-sidebar .cv16-side-value,
.cv17-wrapper.cv17-rtl .cv17-sidebar .cv17-side-label,
.cv17-wrapper.cv17-rtl .cv17-sidebar .cv17-side-value,
.cv18-wrapper.cv18-rtl .cv18-sidebar .cv18-side-label,
.cv18-wrapper.cv18-rtl .cv18-sidebar .cv18-side-value,
.cv19-wrapper.cv19-rtl .cv19-sidebar .cv19-side-label,
.cv19-wrapper.cv19-rtl .cv19-sidebar .cv19-side-value,
.cv20-wrapper.cv20-rtl .cv20-sidebar .cv20-side-label,
.cv20-wrapper.cv20-rtl .cv20-sidebar .cv20-side-value {
  display:block;
  width:100%;
  text-align:right;
  direction:rtl;
}

/* 3) نص المهارات واللغات داخل side-bullets (آخر span في li) يمين لكل القوالب */
.cv1-wrapper.cv1-rtl .cv1-sidebar .cv1-side-bullets li span:last-child,
.cv2-wrapper.cv2-rtl .cv2-sidebar .cv2-side-bullets li span:last-child,
.cv3-wrapper.cv3-rtl .cv3-sidebar .cv3-side-bullets li span:last-child,
.cv4-wrapper.cv4-rtl .cv4-sidebar .cv4-side-bullets li span:last-child,
.cv5-wrapper.cv5-rtl .cv5-sidebar .cv5-side-bullets li span:last-child,
.cv6-wrapper.cv6-rtl .cv6-sidebar .cv6-side-bullets li span:last-child,
.cv7-wrapper.cv7-rtl .cv7-sidebar .cv7-side-bullets li span:last-child,
.cv8-wrapper.cv8-rtl .cv8-sidebar .cv8-side-bullets li span:last-child,
.cv9-wrapper.cv9-rtl .cv9-sidebar .cv9-side-bullets li span:last-child,
.cv10-wrapper.cv10-rtl .cv10-sidebar .cv10-side-bullets li span:last-child,
.cv11-wrapper.cv11-rtl .cv11-sidebar .cv11-side-bullets li span:last-child,
.cv12-wrapper.cv12-rtl .cv12-sidebar .cv12-side-bullets li span:last-child,
.cv13-wrapper.cv13-rtl .cv13-sidebar .cv13-side-bullets li span:last-child,
.cv14-wrapper.cv14-rtl .cv14-sidebar .cv14-side-bullets li span:last-child,
.cv15-wrapper.cv15-rtl .cv15-sidebar .cv15-side-bullets li span:last-child,
.cv16-wrapper.cv16-rtl .cv16-sidebar .cv16-side-bullets li span:last-child,
.cv17-wrapper.cv17-rtl .cv17-sidebar .cv17-side-bullets li span:last-child,
.cv18-wrapper.cv18-rtl .cv18-sidebar .cv18-side-bullets li span:last-child,
.cv19-wrapper.cv19-rtl .cv19-sidebar .cv19-side-bullets li span:last-child,
.cv20-wrapper.cv20-rtl .cv20-sidebar .cv20-side-bullets li span:last-child {
  display:block;
  width:100%;
  text-align:right !important;
  direction:rtl;
}

/* ========================================= */
/* === الخطوط: تطبيق خط عربي على جميع قوالب السير الذاتية 1–20 في RTL === */

/* عند اللغة العربية نفترض أن الـ wrapper يكون cvN-wrapper cvN-rtl */
.cv1-wrapper.cv1-rtl,
.cv2-wrapper.cv2-rtl,
.cv3-wrapper.cv3-rtl,
.cv4-wrapper.cv4-rtl,
.cv5-wrapper.cv5-rtl,
.cv6-wrapper.cv6-rtl,
.cv7-wrapper.cv7-rtl,
.cv8-wrapper.cv8-rtl,
.cv9-wrapper.cv9-rtl,
.cv10-wrapper.cv10-rtl,
.cv11-wrapper.cv11-rtl,
.cv12-wrapper.cv12-rtl,
.cv13-wrapper.cv13-rtl,
.cv14-wrapper.cv14-rtl,
.cv15-wrapper.cv15-rtl,
.cv16-wrapper.cv16-rtl,
.cv17-wrapper.cv17-rtl,
.cv18-wrapper.cv18-rtl,
.cv19-wrapper.cv19-rtl,
.cv20-wrapper.cv20-rtl {
  font-family:'Droid Arabic Kufi','Tahoma',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}

/* في اللغة الإنجليزية (LTR) نترك الخط الافتراضي اللاتيني */
.cv1-wrapper.cv1-ltr,
.cv2-wrapper.cv2-ltr,
.cv3-wrapper.cv3-ltr,
.cv4-wrapper.cv4-ltr,
.cv5-wrapper.cv5-ltr,
.cv6-wrapper.cv6-ltr,
.cv7-wrapper.cv7-ltr,
.cv8-wrapper.cv8-ltr,
.cv9-wrapper.cv9-ltr,
.cv10-wrapper.cv10-ltr,
.cv11-wrapper.cv11-ltr,
.cv12-wrapper.cv12-ltr,
.cv13-wrapper.cv13-ltr,
.cv14-wrapper.cv14-ltr,
.cv15-wrapper.cv15-ltr,
.cv16-wrapper.cv16-ltr,
.cv17-wrapper.cv17-ltr,
.cv18-wrapper.cv18-ltr,
.cv19-wrapper.cv19-ltr,
.cv20-wrapper.cv20-ltr {
  font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}


/* =================================================== */
/* RTL: ضبط السايدبار في القالب الثاني cv2 (أيقونات + نصوص) */

/* 1) قوائم CONTACT (الهاتف، الإيميل، العنوان، الموقع) */
.cv2-wrapper.cv2-rtl .cv2-sidebar ul.cv2-side-list li {
  display: flex;
  align-items: flex-start;
  flex-direction: row;  /* العنصر الأول (الأيقونة) يكون في يمين السطر */
}

/* النص داخل الـ div الذي يحتوي label + value يكون يمين بالكامل */
.cv2-wrapper.cv2-rtl .cv2-sidebar ul.cv2-side-list li > div {
  width: 100%;
  text-align: right;
}

/* ليبل وقيمة الـ CONTACT يمين */
.cv2-wrapper.cv2-rtl .cv2-sidebar .cv2-side-label,
.cv2-wrapper.cv2-rtl .cv2-sidebar .cv2-side-value {
  display: block;
  width: 100%;
  text-align: right;
  direction: rtl;
}

/* 2) قوائم المهارات / اللغات في cv2 (cv2-bullets) */
.cv2-wrapper.cv2-rtl .cv2-sidebar ul.cv2-bullets li {
  display: flex;
  align-items: flex-start;
  flex-direction: row;  /* النقطة (cv2-bullet) يمين، ثم النص */
}

/* النص بعد النقطة (مثل "تحليل بيانات الحملات الإعلانية") يمين */
.cv2-wrapper.cv2-rtl .cv2-sidebar ul.cv2-bullets li span:last-child {
  display: block;
  width: 100%;
  text-align: right !important;
  direction: rtl;
}


/* =================================================== */
/* RTL: ضبط السايدبار في القالب الثالث cv3 (أيقونات + نصوص) */

/* 1) قوائم CONTACT (الهاتف، الإيميل، العنوان، الموقع) في cv3 */
.cv3-wrapper.cv3-rtl .cv3-sidebar ul.cv3-side-list li {
  display: flex;
  align-items: flex-start;
  flex-direction: row;  /* الأيقونة أول عنصر في يمين السطر */
}

/* النص داخل الـ div (label + value) يمين بالكامل */
.cv3-wrapper.cv3-rtl .cv3-sidebar ul.cv3-side-list li > div {
  width: 100%;
  text-align: right;
}

/* ليبل وقيمة الـ CONTACT يمين */
.cv3-wrapper.cv3-rtl .cv3-sidebar .cv3-side-label,
.cv3-wrapper.cv3-rtl .cv3-sidebar .cv3-side-value {
  display: block;
  width: 100%;
  text-align: right;
  direction: rtl;
}

/* 2) قوائم المهارات / اللغات في cv3 (cv3-bullets) */
.cv3-wrapper.cv3-rtl .cv3-sidebar ul.cv3-bullets li {
  display: flex;
  align-items: flex-start;
  flex-direction: row;  /* النقطة (bullet) يمين، ثم النص */
}

/* النص بعد النقطة (مثل "تحليل بيانات الحملات الإعلانية") يمين */
.cv3-wrapper.cv3-rtl .cv3-sidebar ul.cv3-bullets li span:last-child {
  display: block;
  width: 100%;
  text-align: right !important;
  direction: rtl;
}


/* تصحيح خاص للقالب الخامس cv5 في RTL:
   في بعض عناصر cv5-side-list لا توجد أيقونة، فقط نصين داخل li،
   لذلك نرجعها لسلوك block بدل flex. */
.cv5-wrapper.cv5-rtl .cv5-sidebar ul.cv5-side-list li {
  display: block;           /* يلغي flex من التعميم السابق */
}

/* النصوص داخل li تبقى يمين */
.cv5-wrapper.cv5-rtl .cv5-sidebar ul.cv5-side-list li > div {
  text-align: right;
  width: 100%;
}


/* =================================================== */
/* تصحيح Timeline الخبرة العملية في القالب الخامس cv5 عند RTL */

/* نقل خط التايم لاين إلى يمين المحتوى بدلاً من اليسار */
.cv5-wrapper.cv5-rtl .cv5-exp-list {
  position: relative;
  padding-right: 30px;  /* مساحة للخط + الدائرة على اليمين */
  padding-left: 0;
}

/* الخط العمودي */
.cv5-wrapper.cv5-rtl .cv5-exp-line {
  position: absolute;
  right: 15px;          /* بدلاً من left إذا كان مستخدم داخلياً */
  left: auto;
}

/* الدائرة (البولت) */
.cv5-wrapper.cv5-rtl .cv5-exp-bullet {
  position: absolute;
  right: 15px;          /* تلتصق بالخط في اليمين */
  left: auto;
}

/* جعل محتوى الخبرة نفسه لا يلتصق بالخط */
.cv5-wrapper.cv5-rtl .cv5-exp-item {
  padding-right: 10px;
}

/* =================================================== */
/* تصحيح Timeline الخبرة العملية في القالب الخامس cv5 */

/* LTR (الإنجليزية): الخط والدائرة على اليسار */
.cv5-wrapper.cv5-ltr .cv5-exp-list {
  position: relative;
  padding-left: 30px;    /* مساحة للخط + الدائرة على اليسار */
  padding-right: 0;
}

.cv5-wrapper.cv5-ltr .cv5-exp-line {
  position: absolute;
  left: 15px;
  right: auto;
}

.cv5-wrapper.cv5-ltr .cv5-exp-bullet {
  position: absolute;
  left: 15px;
  right: auto;
}

/* إبعاد المحتوى قليلاً عن الخط في LTR */
.cv5-wrapper.cv5-ltr .cv5-exp-item {
  padding-left: 10px;
}

/* RTL (العربية): الخط والدائرة على اليمين */
.cv5-wrapper.cv5-rtl .cv5-exp-list {
  position: relative;
  padding-right: 30px;   /* مساحة للخط + الدائرة على اليمين */
  padding-left: 0;
}

.cv5-wrapper.cv5-rtl .cv5-exp-line {
  position: absolute;
  right: 15px;
  left: auto;
}

.cv5-wrapper.cv5-rtl .cv5-exp-bullet {
  position: absolute;
  right: 15px;
  left: auto;
}

/* إبعاد المحتوى قليلاً عن الخط في RTL */
.cv5-wrapper.cv5-rtl .cv5-exp-item {
  padding-right: 10px;
}

/* إخفاء دائرة التايملاين في القالب الخامس cv5 لتجنب تداخلها مع النص */
.cv5-exp-bullet {
  display: none !important;
}


/* إخفاء دائرة التايملاين في القالب 11 لتجنب تداخلها مع النص */
.cv11-wrapper .cv11-exp-dot {
  display: none !important;
}

































