/* =====================================================
   Omar Site-global Only CSS
   هذا الملف يتحمل فقط في صفحات الموقع ككل
===================================================== */

/* =====================================================
   381183 - نقل ال button.mobile-search-toggle على اليمين قليلا (CSS) عربي و انجليزي
===================================================== */
@media (max-width: 992px) {
  /* ✅ زر العدسة في الوضع الإنجليزي (LTR): يتحرك نحية اليمين 20px */
  html[dir="ltr"] button.mobile-search-toggle {
    position: absolute;
    top: 0;
    right: 20px;
    left: auto; /* نلغي أي left سابق */
    height: 100%;
    padding: 0;
    display: flex;
    align-items: center;
    cursor: pointer;
    background-color: transparent;
  }

  /* ✅ زر العدسة في الوضع العربي (RTL): يتحرك نحية الشمال 20px */
  html[dir="rtl"] button.mobile-search-toggle {
    position: absolute;
    top: 0;
    left: 20px;
    right: auto; /* نلغي أي right سابق */
    height: 100%;
    padding: 0;
    display: flex;
    align-items: center;
    cursor: pointer;
    background-color: transparent;
  }
}
/* =====================================================
   381650 - Extra Mobile Menu widgets- Phone - Social Icons (CSS)
===================================================== */
/* ✅ حاوية الأيقونات */
.social-icons {
  display: flex;
  align-items: center;
  gap: 6px; /* ← المسافة بين أيقونات السوشيال */
  margin-top: 10px;
  padding: 0;
}

/* ✅ الإعدادات العامة */
.social-icons a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  text-decoration: none;
  transition: transform 0.2s ease;
  margin-right: 0; /* لأننا استخدمنا gap */
}

/* ✅ إزالة المسافة من آخر أيقونة */
.social-icons a:last-child {
  margin-right: 0;
}

/* ✅ تأثير التحويم */
.social-icons a:hover {
  transform: scale(1.1);
}

/* ✅ فيسبوك */
.social-icons a.facebook {
  background-color: #3b5998;
  color: white !important;
  border-radius: 50%;
  font-size: 20px;
  width: 32px;
  height: 32px;
}

/* ✅ انستجرام */
.social-icons a.instagram {
  background: linear-gradient(45deg, #feda75, #fa7e1e, #d62976, #962fbf, #4f5bd5);
  color: white !important;
  border-radius: 8px;
  font-size: 25px;
  width: 30px;
  height: 30px;
}

/* ✅ بنترست */
.social-icons a.pinterest {
  background-color: #E60023 !important;
  color: white !important;
  border-radius: 50%;
  font-size: 25px;
  width: 32px;
  height: 32px;
}

/* ✅ تيك توك */
.social-icons a.tiktok {
  background-color: #000000 !important;
  color: white !important;
  border-radius: 50%;
  font-size: 22px;
  width: 32px;
  height: 32px;
}

/* ✅ يوتيوب */
.social-icons a.youtube {
  background: none !important;
  color: #FF0000 !important;
  font-size: 35px;
  width: auto;
  height: auto;
  line-height: 1;
}

/* ✅ ماسنجر */
.social-icons a.messenger {
  background: none !important;
  color: #0084FF !important;
  font-size: 30px;
  width: auto;
  height: auto;
  line-height: 1;
}

/* ✅ واتساب */
.social-icons a.whatsapp {
  background: none !important;
  color: #25D366 !important;
  font-size: 32px;
  width: auto;
  height: auto;
  line-height: 1;
}



.contact-line {
  margin-top: 10px;       /* مسافة من الأعلى */
  line-height: 1.2;       /* ارتفاع سطر طبيعي */
}

/* تنسيق السطر الأول */
.call-text {
  display: block;         /* يجعلها في سطر منفصل */
  margin-bottom: 10px;     /* مسافة بين النص وأرقام التليفون */
  font-weight: 500;
}

/* سطر الأرقام */
.phones {
  display: flex;          /* ترتيب الأرقام في صف */
  gap: 6px;              /* مسافة بين الرقمين */
}


/* تنسيق أرقام التليفون */
.phone-number {
  color: #007bff !important;
  text-decoration: none;
  font-weight: 500;
  display: inline-flex;   /* لعرض الأيقونة والرقم بجانب بعض */
  align-items: center;
  gap: 6px;
}



.phone-number {
  direction: ltr;
  unicode-bidi: embed;
  text-align: left; /* اختياري */
}

/* =====================================================
   Omar Social SVG Icons
   بديل Font Awesome داخل social-icons
   يوضع أسفل كود 381650 القديم
===================================================== */
.social-icons .omar-social-svg {
    width: 1em;
    height: 1em;
    display: block;
    fill: currentColor;
    pointer-events: none;
}

/* تثبيت إيموجي الهاتف بجوار الرقم */
.phone-number .omar-phone-emoji {
    display: inline-block;
    font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", "Twemoji Mozilla", sans-serif;
    line-height: 1;
    vertical-align: -0.08em;
    margin-inline-end: 2px;
    white-space: nowrap;
}

/* =====================================================
   382114 - Waving hand - Logo (Css) بدون JS
===================================================== */
/* 🎯 ضبط مساحة اللوجو الأساسي */
.custom-logo-link {
  position: relative;
  display: inline-block;
  overflow: hidden;
}

/* 🖼️ المربع الأبيض */
.custom-logo-link::before {
  content: "";
  position: absolute;
  top: 0;
  right: -100%;
  width: 100%;
  height: 100%;
  background: white;
  z-index: 2;
  animation: whiteSlide 33s infinite;
}

/* 🖼️ الصورتين الجديد */
.custom-logo-link::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background:
    url("https://watchesprime.com/wp-content/uploads/2025/08/Hello-there.gif") left center no-repeat,
    url("https://watchesprime.com/wp-content/uploads/2025/08/Ahlan.png") right center no-repeat;
  background-size: auto 100%, auto 100%;
  opacity: 0;
  z-index: 3;
  animation: showCustomImages 33s infinite;
}

/* 🎬 إخفاء/إظهار اللوجو الأساسي مع تأثير FadeIn */
.custom-logo-link img {
  animation: logoHide 33s infinite;
}

@keyframes whiteSlide {
  0%, 90.9%, 100% { right: -100%; }
  90.91%, 100% { right: 0; }
}

@keyframes showCustomImages {
  0%, 90.9%, 100% { opacity: 0; }
  93.9%, 100% { opacity: 1; }
}

@keyframes logoHide {
  0% { opacity: 0; }
  5% { opacity: 1; }
  90.9% { opacity: 1; }
  93.9% { opacity: 0; }
  100% { opacity: 0; }
}

/* =====================================================
   382439 - تصغير العناصر المنيو
===================================================== */
/* 🎯 تصغير العناصر _mi _before _image */
._mi._before._image {
    width: 24px;
    height: 24px;
}



/* =====================================================
   Lightweight WhatsApp Button for Blog Pages
   زر واتساب خفيف للمقالات وصفحة المدونة بدون JoinChat
===================================================== */

.omar-post-whatsapp-link {
    position: fixed;
    right: 16px;
    bottom: 78px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #25D366;
    color: #fff !important;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9998;
    text-decoration: none !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.18);
}

html[dir="rtl"] .omar-post-whatsapp-link {
    right: auto;
    left: 16px;
}

.omar-post-whatsapp-link svg {
    width: 26px;
    height: 26px;
    display: block;
    fill: currentColor;
}

@media (max-width: 768px) {
    .omar-post-whatsapp-link {
        right: 14px;
        bottom: 86px;
        width: 46px;
        height: 46px;
    }

    html[dir="rtl"] .omar-post-whatsapp-link {
        right: auto;
        left: 14px;
    }
}






/* =====================================================
   Omar Footer Emoji Fix
   تثبيت شكل ومحاذاة إيموجي الفوتر بدون Font Awesome
===================================================== */

.omar-copyright-text {
    line-height: 1.8;
}

.omar-copyright-text div {
    margin: 0;
    padding: 0;
}

.omar-footer-emoji {
    display: inline-block;
    font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", "Twemoji Mozilla", sans-serif;
    font-size: 1em;
    line-height: 1;
    vertical-align: -0.08em;
    margin: 0 0.12em;
    white-space: nowrap;
}






/* =====================================================
   Smooth Scroll for Article Table of Contents
   انتقال ناعم عند الضغط على روابط محتوى المقال
===================================================== */

/* تفعيل الانتقال الناعم عند الضغط على روابط # داخل الصفحة */
html {
  scroll-behavior: smooth;
}

/* ترك مسافة فوق العنوان بعد الانتقال حتى لا يختفي تحت الهيدر */
.single-post h2[id],
.single-post h3[id],
.single-post h4[id] {
  scroll-margin-top: 90px;
}

/* احترام إعدادات المستخدم لو مفعّل تقليل الحركة */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}







/* =====================================================
   Global RTL/LTR Content Lists Fix
   إصلاح ظهور نقاط وقوائم li خارج الشاشة في محتوى الموقع
   Articles / Products / Pages / Categories only
===================================================== */

/* مناطق المحتوى فقط - بدون لمس المنيو أو الفوتر */

.entry-content ul,
.entry-content ol,
.woocommerce-product-details__short-description ul,
.woocommerce-product-details__short-description ol,
.woocommerce-Tabs-panel ul,
.woocommerce-Tabs-panel ol,
.term-description ul,
.term-description ol,
.page-description ul,
.page-description ol {
  margin-top: 0.75em;
  margin-bottom: 1.25em;
  list-style-position: outside;
}

/* العربي RTL */
html[dir="rtl"] .entry-content ul,
html[dir="rtl"] .entry-content ol,
html[dir="rtl"] .woocommerce-product-details__short-description ul,
html[dir="rtl"] .woocommerce-product-details__short-description ol,
html[dir="rtl"] .woocommerce-Tabs-panel ul,
html[dir="rtl"] .woocommerce-Tabs-panel ol,
html[dir="rtl"] .term-description ul,
html[dir="rtl"] .term-description ol,
html[dir="rtl"] .page-description ul,
html[dir="rtl"] .page-description ol,
html[lang="ar"] .entry-content ul,
html[lang="ar"] .entry-content ol,
html[lang="ar"] .woocommerce-product-details__short-description ul,
html[lang="ar"] .woocommerce-product-details__short-description ol,
html[lang="ar"] .woocommerce-Tabs-panel ul,
html[lang="ar"] .woocommerce-Tabs-panel ol,
html[lang="ar"] .term-description ul,
html[lang="ar"] .term-description ol,
html[lang="ar"] .page-description ul,
html[lang="ar"] .page-description ol {
  padding-right: 1.75em;
  padding-left: 0;
}

/* الإنجليزي LTR */
html[dir="ltr"] .entry-content ul,
html[dir="ltr"] .entry-content ol,
html[dir="ltr"] .woocommerce-product-details__short-description ul,
html[dir="ltr"] .woocommerce-product-details__short-description ol,
html[dir="ltr"] .woocommerce-Tabs-panel ul,
html[dir="ltr"] .woocommerce-Tabs-panel ol,
html[dir="ltr"] .term-description ul,
html[dir="ltr"] .term-description ol,
html[dir="ltr"] .page-description ul,
html[dir="ltr"] .page-description ol,
html[lang="en-US"] .entry-content ul,
html[lang="en-US"] .entry-content ol,
html[lang="en-US"] .woocommerce-product-details__short-description ul,
html[lang="en-US"] .woocommerce-product-details__short-description ol,
html[lang="en-US"] .woocommerce-Tabs-panel ul,
html[lang="en-US"] .woocommerce-Tabs-panel ol,
html[lang="en-US"] .term-description ul,
html[lang="en-US"] .term-description ol,
html[lang="en-US"] .page-description ul,
html[lang="en-US"] .page-description ol {
  padding-left: 1.35em;
  padding-right: 0;
}

/* ضبط المسافة بين عناصر القوائم داخل المحتوى فقط */
.entry-content li,
.woocommerce-product-details__short-description li,
.woocommerce-Tabs-panel li,
.term-description li,
.page-description li {
  margin-bottom: 0.35em;
}

/* القوائم المتداخلة */
.entry-content li > ul,
.entry-content li > ol,
.woocommerce-product-details__short-description li > ul,
.woocommerce-product-details__short-description li > ol,
.woocommerce-Tabs-panel li > ul,
.woocommerce-Tabs-panel li > ol,
.term-description li > ul,
.term-description li > ol,
.page-description li > ul,
.page-description li > ol {
  margin-top: 0.35em;
  margin-bottom: 0.35em;
}






/* =====================================================
   Article Typography Control
   التحكم في مقاسات خطوط المقالات فقط
===================================================== */

/* نص المقال الأساسي */
.single-post .entry-content {
  font-size: 18px;
  line-height: 1.9;
}

/* الفقرات */
.single-post .entry-content p {
  font-size: 18px;
  line-height: 1.9;
  margin-bottom: 1.1em;
}

/* عنوان H1 الخاص بالمقال */
.single-post h1.entry-title {
  font-size: 34px;
  line-height: 1.35;
  font-weight: 800;
}

/* عناوين H2 داخل المقال */
.single-post .entry-content h2 {
  font-size: 28px;
  line-height: 1.45;
  font-weight: 800;
  margin-top: 1.6em;
  margin-bottom: 0.7em;
}

/* عناوين H3 داخل المقال */
.single-post .entry-content h3 {
  font-size: 23px;
  line-height: 1.5;
  font-weight: 700;
  margin-top: 1.4em;
  margin-bottom: 0.6em;
}

/* القوائم */
.single-post .entry-content li {
  font-size: 18px;
  line-height: 1.8;
}

/* الموبايل */
@media (max-width: 768px) {
  .single-post .entry-content,
  .single-post .entry-content p,
  .single-post .entry-content li {
    font-size: 17px;
    line-height: 1.85;
  }

  .single-post h1.entry-title {
    font-size: 27px;
    line-height: 1.4;
  }

  .single-post .entry-content h2 {
    font-size: 24px;
    line-height: 1.45;
  }

  .single-post .entry-content h3 {
    font-size: 21px;
    line-height: 1.45;
  }
}