/**
* Theme Name: ClassiadsPro Child Child
* Description: This is a child theme of ClassiadsPro Child, generated by Designinvento Templates.
* Author: <a href="http://themeforest.net/user/designinvento">DesignInvento</a>
* Template: classiadspro
* Version: 6.2.1
*/

/* إزالة المظهر الافتراضي وإضافة سهم أنيق لحقل المحافظات */
 {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="%2334495e" d="M7 10l5 5 5-5z"/></svg>');
background-repeat: no-repeat;
background-position: left 10px center;
padding-left: 35px;
transition: border-color 0.3s, box-shadow 0.3s;
}

/* تنسيق التركيز لحقل المحافظات */
.stylish-sidebar .province-select:focus {
border-color: #3498db;
box-shadow: 0 0 8px rgba(52, 152, 219, 0.7);
outline: none;
}
/* ------------------------------------
1. التنسيق العام (إزالة الهامش السفلي الكبير)
------------------------------------ */
.stylish-sidebar {
margin-bottom: 0px !important;
padding-bottom: 0px !important;
}

/* ------------------------------------
2. تحسينات التجاوب (Mobile Friendly) - الحل النهائي لضغط الهيدر
------------------------------------ */
@media screen and (max-width: 600px) {

/* ضغط أعلى Elementor */
.elementor-section {
padding-top: 0px !important;
padding-bottom: 3px !important;
}

/* إزالة جميع الهوامش والحشوات من الكُنتينر الرئيسي */
.stylish-sidebar {
margin-bottom: 0px !important;
padding: 0px !important;
}
/* ========================================================= */
/* --- 1. تنسيق الحقول بأسلوب ناعم وموحد --- */
/* ========================================================= */

.form-control.directorypress-default-field,
.stylish-sidebar .province-select {
    width: 95% !important;
    margin-top: 6px !important;
    margin-bottom: 6px !important;
    padding: 6px 12px !important;
    font-size: 16px !important;
    border-radius: 22px !important;
    transition: 0.25s ease;
}

/* --------------------------------------------------------- */
/* --- 1.1. التنسيق الخاص لحقل البحث (ماذا تبحث عنه؟) --- */
/* --------------------------------------------------------- */

.form-control.directorypress-default-field {
    /* خلفية بيضاء / رمادية فاتحة لتجنب مشكلة النص */
    background-color: #F7F7F7 !important;
    color: #333333 !important; /* لون نص داكن واضح */

    /* إطار أزرق خفيف ليظل التنسيق عصرياً */
    border: 1px solid #1F1F1F !important;
    /* إزالة الشادو الداخلي */
    box-shadow: none !important;
}

/* --------------------------------------------------------- */
/* --- 1.2. التنسيق الداكن Soft Dark لحقل المحافظة فقط --- */
/* --------------------------------------------------------- */

.stylish-sidebar .province-select {
    /* تطبيق الخلفية الداكنة المتدرجة كما طلبت */
    background: linear-gradient(160deg, #1A1A1A, #111111) !important;
    color: #EDEDED !important;

    /* إطار خفيف وراقي */
    border: 1px solid #1F1F1F !important;

    /* توهج داخلي خفي (Dark Neumorphism) */
    box-shadow: inset 0 0 14px rgba(38,103,255,0.13);
}

/* ========================================================= */
/* --- 2. تأثير عند التركيز (Focus) ناعم وعصري --- */
/* ========================================================= */

/* تأثير التركيز لحقل البحث (إطار أزرق ساطع) */
.form-control.directorypress-default-field:focus {
    outline: none !important;
    border-color: #2667FF !important;
    box-shadow: 0 0 10px rgba(38,103,255,0.4) !important;
}

/* تأثير التركيز لحقل المحافظة (Soft Dark Focus) */
.stylish-sidebar .province-select:focus {
    outline: none !important;

    /* تعزيز التوهج الداخلي والخارجي */
    box-shadow:
        inset 0 0 20px rgba(38,103,255,0.22),
        0 0 12px rgba(38,103,255,0.25);
    
    border-color: #2667FF !important;
}


/* ======== شريط ترحيبي أنيق (Cyber Smart Banner) ======== */
.smart-banner {
position: relative;
bottom: 25px; /* يرفع الشريط قليلاً فوق الأسفل */
width: 92%;
margin: 0 auto;
padding: 14px 22px;
border-radius: 18px;
text-align: center;
font-family: 'Cairo', sans-serif;
color: #fff;
font-size: 16px;
background: rgba(0, 20, 40, 0.65);
backdrop-filter: blur(10px);
box-shadow: 0 0 25px rgba(0,234,255,0.35);
animation: neonPulse 6s ease-in-out infinite;
transition: 0.3s;
}

.smart-banner:hover {
transform: scale(1.03);
box-shadow: 0 0 35px rgba(0,234,255,0.5);
}

@keyframes neonPulse {
0%,100% { box-shadow: 0 0 18px rgba(0,234,255,0.3); }
50% { box-shadow: 0 0 40px rgba(0,234,255,0.6); }
}

.smart-banner b {
color: #00eaff;
}

/* ===================================================
دمج تصميم الصورة 1 و 2 + نبض خفيف للإطار الخارجي
=================================================== */

/* خلفية الحقول الداخلية (مثل الصورة رقم 1) */
.directorypress-submit-form-section input.form-control,
.directorypress-submit-form-section select.form-control,
.directorypress-submit-form-section textarea.form-control {
background: #0e0f12 !important; /* لون خلفية داخلي داكن ناعم */
border: 1px solid #02c4ff !important; /* لون حدود أزرق مشع مثل الصورة 1 */
color: #e6f3ff !important;
box-shadow: inset 0 0 5px rgba(2,196,255,0.25);
}

/* عند التركيز */
.directorypress-submit-form-section input.form-control:focus,
.directorypress-submit-form-section select.form-control:focus,
.directorypress-submit-form-section textarea.form-control:focus {
border-color: #00ffff !important;
box-shadow: 0 0 6px rgba(0,255,255,0.45);
}

/* الإطارات الخارجية (مثل الصورة رقم 2) */
.directorypress-submit-form-section .field-wrap {
background: rgba(10, 12, 15, 0.9);
border: 1px solid rgba(0,255,255,0.25);
box-shadow: 0 0 10px rgba(0,255,255,0.08), inset 0 0 6px rgba(0,255,255,0.05);
border-radius: 16px;
position: relative;
animation: glowPulse 4s ease-in-out infinite;
}

/* حركة النبض الخفيفة */
@keyframes glowPulse {
0% {
box-shadow: 0 0 10px rgba(0,255,255,0.08), inset 0 0 6px rgba(0,255,255,0.05);
}
50% {
box-shadow: 0 0 15px rgba(0,255,255,0.15), inset 0 0 8px rgba(0,255,255,0.1);
}
100% {
box-shadow: 0 0 10px rgba(0,255,255,0.08), inset 0 0 6px rgba(0,255,255,0.05);
}
}

/* تحسين النصوص والعناوين */
.directorypress-submit-form-section label {
color: #b8e8ff !important;
}

/* =======================================================
🎨 تنسيق حقل الوصف (بسيط وأنيق مثل الحقول العادية)
======================================================= */
.directorypress-submit-form-section textarea[name="post_content"],
textarea[name="post_content"] {
width: 100%;
min-height: 180px;
padding: 14px 18px;
font-size: 16px;
font-family: "Tajawal", sans-serif;
color: #222;
background-color: #fff;
border: 1.5px solid #e2e8f0;
border-radius: 10px;
box-shadow: inset 0 1px 4px rgba(0,0,0,0.05);
transition: all 0.3s ease;
resize: vertical;
}

.directorypress-submit-form-section textarea[name="post_content"]:focus,
textarea[name="post_content"]:focus {
border-color: #00bcd4;
box-shadow: 0 0 8px rgba(0,188,212,0.25);
outline: none;
background-color: #f9ffff;
}

.directorypress-submit-form-section textarea[name="post_content"]::placeholder {
color: #999;
font-style: italic;
}


/* =======================================================
🚀 زر نشر الإعلان
======================================================= */
input[type="submit"].submit-listing-button,
button.submit-listing-button {
display: inline-block;
background: linear-gradient(90deg, #00bcd4, #00e0a0);
color: #fff;
border: none;
border-radius: 30px;
padding: 14px 40px;
font-size: 17px;
font-weight: 600;
cursor: pointer;
box-shadow: 0 0 10px rgba(0,188,212,0.3);
transition: all 0.3s ease;
}

input[type="submit"].submit-listing-button:hover,
button.submit-listing-button:hover {
background: linear-gradient(90deg, #00e0a0, #00bcd4);
transform: translateY(-2px);
box-shadow: 0 0 15px rgba(0,188,212,0.4);
}


.directorypress-submit-form-section label[for*="upload"]:hover,
.directorypress-submit-form-section .custom-upload-btn:hover {
background: linear-gradient(90deg, #00bcd4, #00e0a0);
transform: translateY(-2px);
box-shadow: 0 0 15px rgba(0,188,212,0.35);
}

/* ===== royal gold dark grey design ===== */
section[data-id="1e20101"] {
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
/* تغيير الخلفية لتكون أغمق وأقرب للرمادي الداكن في الصورة */
background: radial-gradient(circle, #1a1a1a, #121212 80%) !important;
direction: rtl;
font-family: "tajawal", sans-serif;
padding: 60px 15px;
}

section[data-id="1e20101"] .register-box,
section[data-id="1e20101"] .elementor-widget-container {
/* تغيير الخلفية لتتناسب مع لون الرمادي الداكن في الصورة */
background: rgba(30,30,30,0.95); /* أغمق وأقل شفافية قليلاً */
border: 1px solid rgba(255,215,0,0.08); /* إطار ذهبي أضعف */
border-radius: 16px;
padding: 45px 35px;
/* ظل خافت جداً يميل للرمادي */
box-shadow: 0 0 15px rgba(0,0,0,0.4);
color: #e0e0e0; /* لون نص أفتح قليلاً */
width: 100%;
max-width: 430px;
animation: goldpulse 8s ease-in-out infinite; /* زيادة مدة الأنميشن لجعله أبطأ */
}

/* تعديل تأثير النبض ليكون أضعف وأبطأ */
@keyframes goldpulse {
0%, 100% { box-shadow: 0 0 10px rgba(255,215,0,0.08); border-color: rgba(255,215,0,0.15); }
50% { box-shadow: 0 0 20px rgba(255,215,0,0.18); border-color: rgba(255,215,0,0.3); }
}

section[data-id="1e20101"] h2 {
text-align: center;
font-weight: 700;
color: #ffde75; /* يمكن الإبقاء على الذهبي للعناوين لتمييزها */
margin-bottom: 20px;
font-size: 26px;
}

section[data-id="1e20101"] input,
section[data-id="1e20101"] button {
width: 100%;
border-radius: 10px;
padding: 12px 14px;
border: none;
outline: none;
margin-bottom: 14px;
box-sizing: border-box;
font-size: 15px;
}

section[data-id="1e20101"] input {
/* خلفية حقول الإدخال لتتناسب مع الرمادي الداكن */
background: #252525;
border: 1px solid rgba(255,215,0,0.05); /* إطار ذهبي أضعف جداً */
color: #f0f0f0; /* لون نص أبيض نقي تقريباً */
}

section[data-id="1e20101"] input:focus {
border-color: #ffd700; /* يمكن الإبقاء على الذهبي عند التركيز */
box-shadow: 0 0 8px rgba(255,215,0,0.2); /* ظل تركيز أضعف */
}

section[data-id="1e20101"] button {
/* يمكن الإبقاء على الزر الذهبي البارز كعنصر مميز أو تغييره لرمادي */
background: linear-gradient(90deg, #ffcc33, #e0a400);
color: #111;
font-weight: 700;
cursor: pointer;
transition: 0.3s;
animation: btnglow 4s ease-in-out infinite; /* زيادة مدة الأنميشن للزر */
}

/* تعديل تأثير توهج الزر ليكون أضعف وأبطأ */
@keyframes btnglow {
0%, 100% { box-shadow: 0 0 8px rgba(255,215,0,0.2); }
50% { box-shadow: 0 0 18px rgba(255,215,0,0.4); }
}

section[data-id="1e20101"] button:hover {
transform: translatey(-2px);
filter: brightness(1.1);
}

.flickity-viewport {
height: auto !important;
min-height: 0 !important;
transition: height 0.3s ease !important;
overflow: hidden !important;
}
.elementor-image-carousel .swiper-container {
height: auto !important;
}
.elementor-image-carousel .swiper-slide {
height: auto !important;
}
.elementor-image-carousel img {
width: 100%;
height: auto !important;
object-fit: contain !important;
border-radius: 15px;
}
.double-row-slider {
width: 100%;
overflow: hidden; /* 👈 ضروري يمنع تمدد العناصر */
direction: ltr;
position: relative;
padding-top: 0;
}

/* ✅ إصلاح مشكلة الفراغ المؤقت في سلايدر الكاروسيل */
.swiper-slide {
min-height: unset !important;
}

.swiper-slide-image {
display: block !important;
width: 100% !important;
height: auto !important;
aspect-ratio: 16 / 3 !important; /* 👈 يعطي ارتفاع ثابت مؤقت لتجنب الفراغ */
object-fit: cover !important;
vertical-align: middle;
}

/* تأكد أن الحاوية نفسها لا تضيف فراغ */
.swiper-wrapper {
align-items: stretch !important;
}

/* أحيانًا Elementor يضيف ارتفاع وهمي، نحذفه */
.elementor-element img.swiper-slide-image {
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* ==========================
Recommended Ads — Fix overlay + remove black gap
========================== */

/* حاوية البطاقة */
.recommended-ads-wrapper .recommended-ad-card {
position: relative; /* مهم لوضع العنوان كـ overlay */
overflow: hidden;
border-radius: 18px !important;
background: linear-gradient(180deg,#222,#151515) !important;
box-shadow: 0 6px 18px rgba(0,0,0,0.35);
}

/* رابط البطاقة يبقى block ليغطي كل المساحة */
.recommended-ads-wrapper .recommended-ad-card > a {
display: block;
color: inherit;
text-decoration: none;
}

/* حاوية الصورة: نعطيها ارتفاع ثابت أو نسّق متجاوب */
.recommended-ads-wrapper .recommended-ad-card .ad-thumb {
position: relative;
width: 100%;
height: 220px; /* غيّر القيمة لو تبي الصورة أكبر (مثلاً 240px أو 260px) */
overflow: hidden;
margin: 0;
padding: 0;
background: none !important;
}

/* الصورة تغطي الحاوية بالكامل بدون فراغ */
.recommended-ads-wrapper .recommended-ad-card .ad-thumb img {
display: block;
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
-o-object-fit: cover !important;
border-radius: 18px 18px 0 0 !important; /* يحافظ على نعومة الزوايا العلوية */
margin: 0;
padding: 0;
background: none !important;
}

/* العنوان: نجعله overlay فوق الصورة لإزالة الشريط الأسود */
.recommended-ads-wrapper .recommended-ad-card .ad-info {
position: absolute !important;
bottom: 0;
left: 0;
width: 100%;
box-sizing: border-box;
padding: 10px 12px !important;
margin: 0 !important;
background: linear-gradient(to top, rgba(0,0,0,0.78), rgba(0,0,0,0.25)) !important;
pointer-events: none; /* يترك النقر يمر للرابط الرئيسي */
}

/* عنوان داخل ad-info */
.recommended-ads-wrapper .recommended-ad-card .ad-info h4,
.recommended-ads-wrapper .recommended-ad-card .ad-info .ad-title {
margin: 0 !important;
padding: 0 !important;
color: #fff !important;
font-size: 15px;
font-weight: 600;
text-align: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
pointer-events: none;
}

/* تأثير hover/لمس */
.recommended-ads-wrapper .recommended-ad-card:hover {
transform: translateY(-6px);
box-shadow: 0 12px 30px rgba(0,0,0,0.45), 0 0 10px rgba(0,180,255,0.08);
}

/* للـ mobile: نجعل الارتفاع أقل قليلاً */
@media (max-width: 767px) {
.recommended-ads-wrapper .recommended-ad-card .ad-thumb {
height: 180px;
}
.recommended-ads-wrapper .recommended-ad-card .ad-info {
padding: 8px 10px;
}
.recommended-ads-wrapper .recommended-ad-card .ad-info h4 {
font-size: 14px;
}
}
/* 💎 تأثير الانعكاس الخفيف أسفل الصورة */
.ad-thumb img { ... }
.ad-thumb img::after { ... }
/* 🌙 تأثير الإطار المتوهّج عند المرور */
.recommended-ad-card:hover { ... }
/* تدرّج بسيط داخل البطاقة ... */
.recommended-ad-card { ... }
/* تأثير الإضاءة من الأعلى ... */
.recommended-ad-card::before { ... }
/* 🔹 إزالة الفراغ بين الشريط والفئات الكبيرة */
.elementor-element-b84b6a2 {
margin-top: 0 !important;
margin-bottom: 0 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}

	/* 🔹 تقليل المسافة بين الشريط والفئات الكبيرة قليلاً */
.elementor-element-b84b6a2 .top-categories-bar {
margin-bottom: 5px !important;
}
	
/* ====== صفحة تسجيل الدخول بتصميم متوهج راقي ====== */
.directorypress-default-login-form {
  background: linear-gradient(180deg, rgba(3,10,25,0.95), rgba(0,20,40,0.9));
  border-radius: 30px;
  box-shadow: 0 0 25px rgba(0,123,255,0.25);
  padding: 40px 30px;
  border: 1px solid rgba(0,123,255,0.25);
  animation: glowFrame 6s ease-in-out infinite;
  max-width: 420px;
  margin: 40px auto;
  position: relative;
  overflow: hidden;
}

@keyframes glowFrame {
  0%, 100% {
    box-shadow: 0 0 20px rgba(0,123,255,0.35),
                0 0 40px rgba(255,140,0,0.15);
  }
  50% {
    box-shadow: 0 0 35px rgba(255,140,0,0.35),
                0 0 60px rgba(0,123,255,0.25);
  }
}

/* ====== الحقول ====== */
.directorypress-default-login-form .form-control,
#user_login,
#user_pass {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(0,123,255,0.25);
  color: #f0f8ff;
  border-radius: 20px; /* ← ناعمة أكثر */
  padding: 14px 16px;
  transition: all 0.3s ease;
  width: 100%;
  font-size: 15px;
  box-shadow: 0 0 10px rgba(0,123,255,0.15);
}

.directorypress-default-login-form .form-control::placeholder,
#user_login::placeholder,
#user_pass::placeholder {
  color: rgba(200,220,255,0.7);
}

.directorypress-default-login-form .form-control:focus,
#user_login:focus,
#user_pass:focus {
  border-color: #ff8c00;
  box-shadow: 0 0 18px rgba(255,140,0,0.4);
  background: rgba(255,255,255,0.08);
  outline: none;
}

/* ====== زر تسجيل الدخول ====== */
.directorypress-login-button,
#wp-submit {
  display: block;
  width: 100%;
  text-align: center;
  background: linear-gradient(90deg, #006eff, #ff8c00);
  border: none;
  color: #fff !important;
  padding: 15px;
  border-radius: 25px; /* ← ناعمة تمامًا */
  font-weight: 600;
  font-size: 17px;
  box-shadow: 0 0 18px rgba(0,123,255,0.3);
  transition: all 0.3s ease;
  text-decoration: none;
}

.directorypress-login-button:hover,
#wp-submit:hover {
  transform: translateY(-3px);
  box-shadow: 0 0 25px rgba(255,140,0,0.5),
              0 0 40px rgba(0,123,255,0.3);
}

/* ====== الروابط السفلية ====== */
.directorypress-default-login-form #nav a {
  color: #00eaff;
  transition: 0.3s;
  font-weight: 500;
}

.directorypress-default-login-form #nav a:hover {
  color: #ff8c00;
  text-shadow: 0 0 8px rgba(255,140,0,0.5);
}

/* ====== تنظيم المسافات ====== */
.directorypress-default-login-form p.form-group {
  margin-bottom: 18px;
  position: relative;
}

/* 🔹 تحسينات دقيقة للنسخة النهائية */

/* الهالة حول الصندوق بالكامل */
.directorypress-default-login-form::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 30px;
  box-shadow: 0 0 40px rgba(0,123,255,0.2),
              0 0 60px rgba(255,140,0,0.1);
  z-index: -1;
}

/* ضبط الأيقونات داخل الحقول */
.directorypress-default-login-form p.form-group {
  position: relative;
}

.directorypress-default-login-form p.form-group i {
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  color: #00bfff;
  font-size: 18px;
  pointer-events: none;
}

/* تعديل padding بحيث لا يغطي النص الأيقونة */
#user_login,
#user_pass {
  padding-right: 45px !important;
}

/* توسيط نص الزر تمامًا */
.directorypress-login-button {
  display: flex !important;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
  text-align: center;
}

/* تنسيق “تذكرني” */
.directorypress-default-login-form .checkbox label {
  color: rgba(220,230,255,0.8);
  font-size: 14px;
  font-weight: 500;
  transition: 0.3s;
}

.directorypress-default-login-form .checkbox label:hover {
  color: #ff8c00;
  text-shadow: 0 0 8px rgba(255,140,0,0.4);
}

.directorypress-default-login-form .checkbox input[type="checkbox"] {
  accent-color: #00bfff;
  transform: scale(1.1);
}
	
/* العبارة أعلى نموذج تسجيل الدخول */
.directorypress-default-login-form::before {
  content: "قم بتسجيل الدخول للبدء في إنشاء إعلان جديد";
  display: block;
  color: #00eaff !important;
  font-weight: 600;
  font-size: clamp(13px, 4vw, 17px); /* يتغير تلقائياً حسب عرض الشاشة */
  text-align: center;
  margin: 0 0 18px 0;
  text-shadow: 0 0 8px rgba(0, 234, 255, 0.45);
  font-family: 'Cairo', sans-serif;
  position: relative;
  z-index: 5;
  white-space: nowrap; /* يبقي النص في سطر واحد */
  overflow: visible;   /* يسمح للنص بالظهور بالكامل */
}

/* ========== LOGIN STYLE: GOSMART LUXE GRADIENT ========== */
body.page-id-14360 section[data-id="869a40d"],
body.page-id-14360 .elementor-element-869a40d {
  background: linear-gradient(270deg, #020617, #031c32, #0a0f1f, #001a2e);
  background-size: 400% 400%;
  animation: loginBG 14s ease infinite;
  font-family: 'Cairo', sans-serif;
  padding: 40px 0;
}

@keyframes loginBG {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

/* ========== الإطار الخارجي المتوهج ========== */
body.page-id-14360 .wpfb-form-container,
body.page-id-14360 .wpfb-form-wrapper {
  background: rgba(10, 15, 30, 0.9);
  border-radius: 26px;
  padding: 40px 30px;
  border: 2px solid transparent;
  background-image: linear-gradient(#0a0f1f, #0a0f1f),
    linear-gradient(135deg, #0066ff, #f98b23);
  background-origin: border-box;
  background-clip: padding-box, border-box;
  box-shadow: 0 0 25px rgba(249, 139, 35, 0.25), 0 0 45px rgba(0, 102, 255, 0.15);
  backdrop-filter: blur(10px);
  transition: all 0.4s ease;
}

body.page-id-14360 .wpfb-form-container:hover,
body.page-id-14360 .wpfb-form-wrapper:hover {
  transform: scale(1.02);
  box-shadow: 0 0 30px rgba(249, 139, 35, 0.4), 0 0 50px rgba(0, 102, 255, 0.35);
}

/* ========== الحقول ========== */
body.page-id-14360 .wpfb-form-control {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(0, 102, 255, 0.3);
  color: #f0f8ff;
  border-radius: 16px;
  padding: 13px 15px;
  margin-bottom: 18px;
  width: 100%;
  transition: all 0.3s ease;
}

body.page-id-14360 .wpfb-form-control::placeholder {
  color: rgba(200, 220, 255, 0.7);
}

body.page-id-14360 .wpfb-form-control:focus {
  border-color: #f98b23;
  box-shadow: 0 0 12px rgba(249, 139, 35, 0.5);
  background: rgba(255, 255, 255, 0.08);
}

/* ========== زر تسجيل الدخول ========== */
body.page-id-14360 .wpfb-form-submit {
  background: linear-gradient(90deg, #0066ff, #f98b23, #0066ff);
  background-size: 200% 100%;
  color: #fff;
  border: none;
  border-radius: 22px;
  padding: 15px;
  width: 100%;
  font-weight: 600;
  font-size: 17px;
  cursor: pointer;
  box-shadow: 0 0 20px rgba(0, 102, 255, 0.3), 0 0 25px rgba(249, 139, 35, 0.25);
  transition: all 0.4s ease;
  animation: gradientShift 5s ease infinite;
}

@keyframes gradientShift {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

body.page-id-14360 .wpfb-form-submit:hover {
  transform: translateY(-3px);
  box-shadow: 0 0 30px rgba(249, 139, 35, 0.6), 0 0 45px rgba(0, 102, 255, 0.45);
}

/* ========== النصوص الإضافية (تذكرني، إنشاء حساب، الخ) ========== */
body.page-id-14360 .wpfb-form-checkbox label span {
  color: #d0e4ff;
  font-size: 15px;
}

body.page-id-14360 .elementor-element-c6e76df p,
body.page-id-14360 .elementor-element-dd4bd21 p {
  color: #f98b23;
  font-weight: 600;
  text-align: center;
}

/* ===== تأثيرات الإضاءة المتوهجة الخفيفة العامة ===== */
@keyframes glowBlue {
  0%, 100% { box-shadow: 0 0 15px rgba(0, 102, 255, 0.25); }
  50% { box-shadow: 0 0 25px rgba(249, 139, 35, 0.25); }
}
	
/* ========== تحسين حجم وتوهج المربع العلوي الخاص بإنشاء حساب ========== */
body.page-id-14360 .elementor-element-c6e76df {
  background: linear-gradient(135deg, #151515, #0c0c0c);
  border: 1px solid rgba(249, 139, 35, 0.5);
  box-shadow: 0 0 18px rgba(249, 139, 35, 0.25);
  border-radius: 16px;
  padding: 15px 10px; /* ← تقليل التباعد الداخلي */
  color: #fff;
  margin-bottom: 15px;
  text-align: center;
  transition: all 0.3s ease-in-out;
  max-width: 95%;
  margin-left: auto;
  margin-right: auto;
}

/* الجملة */
body.page-id-14360 .elementor-element-c6e76df p {
  color: #ff9c33;
  font-weight: 600;
  font-size: 16px;
  margin-bottom: 10px; /* تقليل المسافة قبل الزر */
  text-shadow: 0 0 6px rgba(249, 139, 35, 0.35);
}

/* الزر */
body.page-id-14360 .elementor-element-3606f2b .elementor-button {
  background: linear-gradient(90deg, #f98b23, #ffb347, #f98b23);
  border-radius: 10px;
  color: #fff;
  font-weight: 600;
  padding: 10px 20px; /* زر أنحف قليلاً */
  font-size: 15px;
  transition: all 0.3s ease;
  box-shadow: 0 0 14px rgba(249, 139, 35, 0.3);
}

/* التأثير عند المرور */
body.page-id-14360 .elementor-element-3606f2b .elementor-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 25px rgba(249, 139, 35, 0.55);
  filter: brightness(1.08);
}

/* توهج خفيف عند مرور المؤشر على المربع */
body.page-id-14360 .elementor-element-c6e76df:hover {
  box-shadow:
    0 0 22px rgba(249, 139, 35, 0.4),
    0 0 30px rgba(0, 102, 255, 0.15);
}
body.page-id-14360 .elementor-element-c6e76df p {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 15px;
  font-weight: 600;
  color: #ff9c33;
  text-align: center;
  text-shadow: 0 0 6px rgba(249, 139, 35, 0.35);
}
	
/* مؤشر السحب لسلايدر Slick */
.slick-slider {
  position: relative;
}

/* الصندوق الذي يظهر مرة واحدة */
.slick-slider::after {
  content: "↔ اسحب للمزيد";
  position: absolute;
  bottom: 10px;
  right: 10px;
  background: rgba(0, 0, 0, 0.45);
  color: #fff;
  padding: 6px 12px;
  border-radius: 8px;
  font-size: 13px;
  opacity: 0;
  pointer-events: none;
  animation: slickSwipeHint 2.4s ease-out 0.5s forwards;
  z-index: 999;
}

/* حركة لطيفة يمين/يسار */
@keyframes slickSwipeHint {
  0% { opacity: 0; transform: translateX(20px); }
  25% { opacity: 1; transform: translateX(0); }
  75% { opacity: 1; transform: translateX(-10px); }
  100% { opacity: 0; transform: translateX(0); }
}
	
/* ================================
   إعداد الشكل العام للصور الكبيرة
==================================*/
.directorypress-single-listing-logo-wrap .slick-list,
.directorypress-single-listing-logo-wrap img {
    border-radius: 14px !important;
    overflow: hidden;
}

.directorypress-single-listing-logo-wrap img {
    width: 100% !important;
    height: 420px !important; /* مقاس الصورة الموحدة */
    object-fit: cover !important;
    box-shadow: 0 8px 20px rgba(0,0,0,0.25);
    transform: translateZ(0);
    transition: transform 0.35s ease, filter 0.35s ease;
}

.directorypress-single-listing-logo-wrap img:hover {
    transform: scale(1.03);
    filter: brightness(1.08);
}

/* ================================
   تنسيق الأسهم (برفشنال)
==================================*/
.slick-prev, .slick-next {
    background: #ffffffcc !important;
    backdrop-filter: blur(6px);
    border-radius: 50%;
    width: 48px;
    height: 48px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.25);
    color: #333 !important;
    font-weight: bold;
    font-size: 0;
    z-index: 20 !important;
}

.slick-prev:before, .slick-next:before {
    font-size: 22px;
    color: #333;
}

.slick-prev:hover, .slick-next:hover {
    background: #007bff !important;
    color: #fff !important;
}

.slick-prev:before { content: "←"; }
.slick-next:before { content: "→"; }

/* إعادة التموضع */
.slick-prev { right: 10px !important; left: unset !important; }
.slick-next { left: 10px !important; right: unset !important; }

/* ================================
   الصور المصغرة Thumbnails
==================================*/
.slider-nav img {
    border-radius: 10px !important;
    object-fit: cover;
    height: 95px !important;
    width: 135px !important;
    cursor: pointer;
    opacity: 0.7;
    transition: 0.25s ease;
    border: 2px solid transparent;
}

.slider-nav img:hover {
    opacity: 1;
    transform: scale(1.05);
}

.slider-nav .slick-current img {
    opacity: 1 !important;
    border-color: #007bff !important;
    box-shadow: 0 0 10px rgba(0,123,255,0.55);
}

/* العداد الراقي — نسخة مصغرة وشفافة */
.smart-counter {
    position: absolute;
    bottom: 15px;
    right: 10px;
    background: rgba(0, 0, 0, 0.01); /* شفافية أعلى */
    padding: 1px 8px 0px 8px; /* تصغير الحجم */
    border-radius: 22px; /* أصغر */
    color: #fff;
    font-size: 16px; /* أصغر */
    font-weight: 600;
    backdrop-filter: blur(1px);
    -webkit-backdrop-filter: blur(1px);
    box-shadow: 0 2px 8px rgba(0,0,0,0.01);
    z-index: 200;
    display: flex;
    align-items: center;
    gap: 3px;
    transition: transform .25s ease, box-shadow .25s ease;
}

/* أرقام واضحة */
.smart-counter span {
    display: inline-block;
}

/* تأثير نبض راقي */
.smart-counter.pulse {
    transform: scale(1.12);
    box-shadow: 0 0 10px rgba(0, 200, 255, 0.7);
}

/* دخول ناعم */
.smart-counter {
    animation: fadeIn 0.4s ease-out;
}

@keyframes fadeIn {
    from {opacity: 0; transform: translateY(8px);}
    to {opacity: 1; transform: translateY(0);}
}