/*
 Theme Name: Sydney Child
 Theme URI: https://salrefaieemarketing.com/
 Description: قالب ابن مخصص لمؤسسة صالح الرفاعي للخدمات التجارية
 Author: Saleh Al-Rifaie
 Template: sydney
 Version: 1.0.0
 Text Domain: sydney-child
*/

/* يمكنك إضافة أي تنسيقات CSS مخصصة هنا مستقبلاً */


/* =================================================================
   اللمسات الجمالية والأناقة - مؤسسة صالح الرفاعي
   ================================================================= */

/* 1. تحسين حركة الأزرار (تفاعل عصري عند مرور الماوس) */
.elementor-button, .button, input[type="submit"], .roll-button {
    border-radius: 8px !important;
    transition: all 0.3s ease-in-out !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
    letter-spacing: 0.5px; /* مسافة بسيطة بين الحروف لفخامة أكثر */
}

.elementor-button:hover, .button:hover, input[type="submit"]:hover, .roll-button:hover {
    transform: translateY(-3px) !important; /* ارتفاع الزر للأعلى قليلاً */
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2) !important; /* زيادة الظل لإبراز الزر */
}

/* 2. ظلال بارزة وعصرية للصور وصناديق الخدمات (تأثير البطاقات) */
.elementor-widget-image img, .elementor-icon-box-wrapper, .service-widget {
    border-radius: 12px;
    transition: all 0.4s ease;
}

.elementor-icon-box-wrapper:hover, .service-widget:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.08);
    background-color: #fdfdfd;
}

/* 3. تحسين قراءة النصوص (Typography) */
body {
    color: #3b4252; /* لون رمادي داكن مريح جداً للعين أفضل من الأسود الخالص */
    line-height: 1.8;
}

/* توحيد ألوان العناوين بلون أزرق أو رمادي داكن يعكس الثقة */
h1, h2, h3, h4, h5, h6, .widget-title {
    font-weight: 700;
    color: #2e3440; 
}

/* 4. تنظيف الهيدر (الشريط العلوي) وتقليل المسافات */
.site-header {
    box-shadow: 0 2px 15px rgba(0,0,0,0.05); /* ظل خفيف جداً يفصل الهيدر عن المحتوى */
}

/* 5. تحسين شكل حقول الإدخال في نماذج الاتصال */
input[type="text"], input[type="email"], textarea {
    border-radius: 6px;
    border: 1px solid #e5e9f2;
    transition: all 0.3s ease;
}

input[type="text"]:focus, input[type="email"]:focus, textarea:focus {
    border-color: #5e81ac; /* لون هادئ عند الكتابة داخل الحقل */
    box-shadow: 0 0 8px rgba(94, 129, 172, 0.2);
}


/* =================================================================
   إصلاحات التنسيق - خلفيات الخدمات والهيدر
   ================================================================= */

/* 1. إصلاح صندوق الخدمة المخفي (توحيد لون الخلفية إلى الأسود لجميع الصناديق) */
.elementor-widget-icon-box .elementor-icon-box-wrapper,
.service-widget {
    background-color: #000000 !important; /* فرض اللون الأسود للخلفية */
}

/* التأكد من أن النص والوصف باللون الأبيض داخل الصناديق السوداء */
.elementor-widget-icon-box .elementor-icon-box-title,
.elementor-widget-icon-box .elementor-icon-box-description,
.service-widget .title,
.service-widget .content {
    color: #ffffff !important;
}

/* 2. إصلاح المسافة الزائدة في الهيدر */
.site-header {
    padding-bottom: 10px !important; /* تقليل المسافة السفلية في الهيدر */
}

.sydney-hero-area {
    margin-top: 0 !important; /* إزالة أي مسافة زائدة فوق منطقة الصورة الرئيسية */
}


/* =================================================================
   التصميم الزجاجي الفخم لصناديق الخدمات - بألوان المؤسسة
   ================================================================= */

/* إعطاء القسم الذي يحتوي على الخدمات خلفية بالتدرج اللوني (أسود، بني، أحمر داكن) */
.elementor-section:has(.service-widget), /* للمتصفحات الحديثة */
.elementor-section:has(.elementor-widget-icon-box) {
    background: linear-gradient(135deg, #0a0a0a 0%, #3e1f15 50%, #5a1010 100%) !important;
}

/* تحويل صناديق الخدمات إلى بطاقات زجاجية بيضاء شفافة */
.elementor-widget-icon-box .elementor-icon-box-wrapper,
.service-widget {
    background-color: rgba(255, 255, 255, 0.08) !important; /* أبيض شفاف جداً */
    backdrop-filter: blur(16px); /* تأثير الضبابية للزجاج */
    -webkit-backdrop-filter: blur(16px); /* لدعم متصفح سفاري */
    border: 1px solid rgba(255, 255, 255, 0.2) !important; /* إطار أبيض زجاجي خفيف */
    border-radius: 16px !important;
    box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.5) !important; /* ظل داكن لرفع البطاقة */
    transition: all 0.4s ease !important;
}

/* حركة أنيقة عند مرور الماوس على الزجاج */
.elementor-widget-icon-box .elementor-icon-box-wrapper:hover,
.service-widget:hover {
    background-color: rgba(255, 255, 255, 0.15) !important; /* زيادة البياض قليلاً عند اللمس */
    transform: translateY(-10px);
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
}

/* التأكد من أن النصوص والأيقونات داخل الزجاج بيضاء وناصعة */
.elementor-widget-icon-box .elementor-icon-box-title,
.elementor-widget-icon-box .elementor-icon-box-description,
.elementor-widget-icon-box .elementor-icon-box-icon i,
.service-widget .title,
.service-widget .content {
    color: #ffffff !important;
    text-shadow: 0 2px 4px rgba(0,0,0,0.5); /* ظل للنص لزيادة القراءة */
}