html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}
/*.branch-card {
    border-radius: 14px;
    overflow: hidden;
    transition: 0.3s ease;
    background: #fff;
    border: 1px solid #eee;
}

    .branch-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 8px 25px rgba(0,0,0,0.15);
    }

    .branch-card .card-header {
        font-weight: bold;
    }*/
/*.branch-card {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    border-radius: 12px;
}

    .branch-card:hover {
        transform: translateY(-5px);
        box-shadow: 0px 10px 20px rgba(0,0,0,0.15);
    }
*/

.branch-card {
    background: #fff;
    border-radius: 16px;
    padding: 25px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06);
    transition: all 0.3s ease;
    height: 100%;
}

    .branch-card:hover {
        transform: translateY(-8px);
        box-shadow: 0 10px 28px rgba(0,0,0,0.12);
    }

.branch-icon {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: #ffe5e5; /* ????? ????? ????? ??? ?????? */
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
    font-size: 30px;
    color: #d62828; /* ?????? ?????? ?????? */
    border: 3px solid #d62828; /* ???? ???? ???? */
}


.branch-content h3 {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 10px;
}

.branch-content p {
    color: #666;
    margin-bottom: 12px;
}

.branch-features {
    list-style: none;
    padding: 0;
    margin: 0 0 15px 0;
}

    .branch-features li {
        margin-bottom: 6px;
        font-size: 15px;
        color: #333;
    }

    .branch-features i {
        margin-right: 6px;
        color: #28a745;
    }

.branch-btn {
    display: inline-block;
    color: #007bff;
    font-weight: 600;
    text-decoration: none;
    margin-top: 10px;
    transition: 0.3s;
}

    .branch-btn:hover {
        padding-right: 5px;
        color: #0056b3;
    }

    /* تغيير لون النافبار - سكاي ون */
/*.header-area,
.main-header,
.header-bottom {
    background-color: #e63946 !important;
}*/

/* لون روابط المنيو */
/*#navigation li a {
    color: #ffffff !important;
}*/

/* لون الرابط عند الـ hover */
/*#navigation li a:hover {
    color: #ffe5e5 !important;
}*/

/* زر التسجيل/الدخول */
/*.add-list a {
    background-color: #ffffff !important;
    color: #e63946 !important;
    padding: 8px 15px;
    border-radius: 5px;
    transition: 0.3s ease;
}

.add-list a:hover {
    background-color: #ffe5e5 !important;
}*/
/* ===== سكاي ون - تنسيق الهيدر والنافبار ===== */

/* خلفية الهيدر والنافبار (ديسكتوب + موبايل) */
.header-area,
.header-transparent,
.main-header,
.header-bottom {
    background-color: #e63946 !important; /* أحمر سكاي ون */
}

/* شفافية الهيدر الشفاف - نخليه ثابت بلون أحمر */
.header-transparent {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 9;
    background-color: #e63946 !important;
}

/* اللوجو والنص بجانبه */
.logo .navbar-brand img {
    max-height: 42px;
    width: auto;
}

.logo .navbar-brand span {
    color: #ffffff;
    font-weight: 600;
}

/* روابط المنيو (ديسكتوب) */
#navigation li a {
    color: #ffffff !important;
    font-size: 0.95rem;
    font-weight: 500;
    padding: 15px 18px;
    transition: color 0.2s ease, background-color 0.2s ease;
}

    /* هوفر على الروابط */
    #navigation li a:hover {
        color: #ffe5e5 !important;
    }

/* الزرين (تسجيل / دخول) */
#navigation li.add-list a {
    background-color: #ffffff !important;
    color: #e63946 !important;
    border-radius: 4px;
    padding: 8px 16px;
    font-weight: 600;
}

    #navigation li.add-list a:hover {
        background-color: #ffe5e5 !important;
    }

/* أيقونة السلة داخل الهيدر */
#navigation li a .bi-cart4 {
    vertical-align: middle;
}

/* ===== موبايل / تابلت ===== */
@media (max-width: 991.98px) {
    /* تقليل ارتفاع الهيدر في الموبايل */
    .header-area,
    .header-bottom {
        padding-top: 6px;
        padding-bottom: 6px;
    }

    .logo .navbar-brand img {
        max-height: 36px;
    }

    .logo .navbar-brand span {
        font-size: 1.1rem;
    }

    /* منيو الموبايل (لو تستخدم slicknav / mobile_menu من التيمبلت) */
    .slicknav_menu,
    .mobile_menu {
        background-color: #e63946 !important;
    }

    .slicknav_nav a {
        color: #ffffff !important;
        font-size: 0.95rem;
        padding: 10px 15px;
    }

        .slicknav_nav a:hover {
            background-color: rgba(255, 255, 255, 0.08);
            color: #ffe5e5 !important;
        }

    .slicknav_btn {
        background-color: transparent !important;
    }

    .slicknav_icon-bar {
        background-color: #ffffff !important;
    }
}
/* موبايل: إخفاء منيو الديسكتوب وإظهار منيو الموبايل */
@media (max-width: 991.98px) {
    .header-bottom .main-menu {
        display: none;
    }

    .mobile_menu,
    .slicknav_menu {
        display: block !important;
        background-color: #e63946;
    }

    .slicknav_nav a {
        color: #ffffff !important;
        font-size: 0.95rem;
        padding: 10px 15px;
    }

        .slicknav_nav a:hover {
            background-color: rgba(255, 255, 255, 0.08);
            color: #ffe5e5 !important;
        }

    .slicknav_btn {
        background-color: transparent !important;
    }

    .slicknav_icon-bar {
        background-color: #ffffff !important; /* الثلاث شرطات بيض */
    }
}
/* ضبط شكل الهيرو تحت الهيدر */
.slider-area.hero-overly {
    border-radius: 0 0 30px 30px;
    overflow: hidden;
}

/* موبايل: تقليل ارتفاع الهيرو وتصفير المسافة */
@media (max-width: 575.98px) {
   /* .slider-height {
        min-height: 320px !important;
    }*/

    .slider-area.hero-overly {
        margin-top: 0;
    }
}
/* تقليل البادينج العلوي لقسم المنتجات */
.popular-location.section-padding30 {
    padding-top: 15px;
}
/* عنوان الأقسام بشكل Pill */
.section-tittle h2 {
    display: inline-block;
    background-color: #e63946; /* لون سكاي ون */
    color: #ffffff;
    padding: 8px 26px;
    border-radius: 999px;
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 0;
}

/* ضبط المسافات فوق وتحت العنوان */
.section-tittle {
    margin-top: 10px;
    margin-bottom: 25px;
}

@media (max-width: 575.98px) {
    .section-tittle {
        margin-top: 15px;
        margin-bottom: 20px;
    }
}
/* ===== منيو الموبايل – سكاي ون ===== */
@media (max-width: 991.98px) {

    /* حاوية منيو الموبايل */
    .slicknav_menu {
        background-color: #e63946 !important; /* نفس لون الشعار */
        padding: 5px 12px;
    }

    /* مكان القائمة المنسدلة */
    .slicknav_nav {
        background-color: #ffffff; /* خلي الخلفية بيضاء عشان النص يبان */
        border-radius: 0 0 16px 16px;
        margin-top: 6px;
        padding: 5px 0;
        box-shadow: 0 8px 18px rgba(0,0,0,0.15);
    }

        /* عناصر القائمة */
        .slicknav_nav li {
            border-bottom: 1px solid #f1f1f1;
        }

            .slicknav_nav li:last-child {
                border-bottom: none;
            }

        /* روابط المنيو */
        .slicknav_nav a {
            color: #222222 !important; /* أسود غامق واضح */
            font-size: 0.95rem;
            padding: 8px 16px;
        }

            /* عند الضغط أو المرور */
            .slicknav_nav a:hover,
            .slicknav_nav .slicknav_row:hover {
                background-color: #ffe5e5;
                color: #e63946 !important; /* أحمر الشعار */
            }

    /* زر الهامبورغر (الثلاث شرطات) */
    .slicknav_btn {
        background: transparent !important;
        margin-top: 0;
    }

    .slicknav_icon-bar {
        background-color: #ffffff !important; /* الشرطات بيضاء فوق الأحمر */
    }
}
/* ضبط الناف بار + الهيرو في وضع الموبايل (شاشات صغيرة) */
@media (max-width: 575.98px) {

    /* تقليل ارتفاع الهيدر نفسه */
    .header-area.header-transparent,
    .header-area .main-header .header-bottom {
        padding-top: 4px;
        padding-bottom: 4px;
    }

    /* تصغير اللوجو والنص في الهيدر */
    .header-area .logo img {
        height: 30px;
        width: auto;
    }

    .header-area .logo span {
        font-size: 0.9rem;
    }

    /* تقليل ارتفاع منطقة الهيرو الحمراء تحت الناف بار */
    /*.slider-height {
        min-height: 110px;*/ /* بدل 320px */
    /*}*/

    /* تصغير عنوان الهيرو حتى ما ياخذ مساحة كبيرة */
    .single-slider .hero__caption h1 {
        font-size: 1.2rem;
        line-height: 1.5;
    }

    .single-slider .hero__caption span {
        font-size: 0.9rem;
    }
}
/* إزالة الزيادة السفلية للنافبار */
@media (max-width: 575.98px) {
    .header-area .logo span {
        font-size: 1.3rem !important; /* جرّب 1.2 أو 1.3 لين يعجبك */
    }
}
/* تكبير حجم النص في السلايدر للموبايل */
@media (max-width: 575.98px) {
    .hero__caption span {
       
        font-size: 1.5rem !important; /* العنوان الرئيسي */
        line-height: 2.4rem !important;
    }

    .hero-caption p {
        font-size: 1.2rem !important; /* النص تحت العنوان */
        line-height: 1.8rem !important;
    }
}
/* ================================
   Footer – SkyOne Red Theme
   اللون: #E60023
================================= */

.footer-area {
    background-color: #E60023 !important;
    padding-top: 50px;
    padding-bottom: 20px;
}

/* عناوين الأقسام */
.footer-tittle h4 {
    color: #ffffff !important;
    font-weight: 700;
    margin-bottom: 20px;
}

/* الروابط */
.footer-tittle ul li a {
    color: #ffe6e6 !important;
    font-size: 15px;
}

    .footer-tittle ul li a:hover {
        color: #ffffff !important;
    }

/* حقوق النشر */
.footer-copy-right p {
    color: #ffffff !important;
    font-size: 15px;
}

/* الأيقونات */
.footer-social a i {
    color: white !important;
    background-color: rgba(255, 255, 255, 0.25);
    padding: 10px;
    border-radius: 50%;
    transition: 0.3s;
}

    .footer-social a i:hover {
        background-color: white;
        color: #E60023 !important;
    }

/* زر بلون شعار سكاي ون */
.btn-skyone {
    background-color: #E60023 !important;
    border-color: #E60023 !important;
    color: #ffffff !important;
    font-weight: 600;
    transition: 0.3s;
}

    .btn-skyone:hover {
        background-color: #c8001f !important; /* لون أغمق قليلاً */
        border-color: #c8001f !important;
        color: #ffffff !important;
    }
.branch-card {
    background: transparent !important;
    border: 1px solid #E60023 !important; /* لون شعار سكاي ون */
    border-radius: 12px;
    padding: 20px;
}
/* الكارت نفسه */
.product-card {
    background: #ffffff;
    border-radius: 14px;
    padding: 18px 20px; /* كان 12px تقريباً */
    border: 1px solid #eee;
    box-shadow: 0 6px 14px rgba(0,0,0,0.10);
    transition: 0.25s ease;
}

    .product-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 10px 20px rgba(0,0,0,0.15);
    }

/* الصورة – كبّرنا ارتفاعها */
.product-image img {
    width: 100%;
    height: 200px; /* كان 110px */
    object-fit: cover;
    border-radius: 12px;
}

/* تكبير خط العنوان والوصف */
.product-title {
    font-size: 1.15rem; /* كان 1rem */
    font-weight: 700;
    color: #E60023;
    margin-bottom: 6px;
}

.product-desc {
    font-size: 0.98rem; /* كان 0.9rem */
    color: #555;
    margin-bottom: 6px;
}

.product-date {
    font-size: 0.85rem;
    color: #999;
}

/* ضبط للموبايل بحيث ما تكبر هلبا */
@media (max-width: 576px) {
    .product-card {
        padding: 14px 16px;
    }

    .product-image img {
        height: 150px;
    }

    .product-title {
        font-size: 1.05rem;
    }

    .product-desc {
        font-size: 0.9rem;
    }
}
/* ألوان قائمة الحساب المنسدلة بعد تسجيل الدخول */
.header-area .dropdown-menu,
.navbar .dropdown-menu {
    background-color: #ffffff; /* الخلفية تبقى بيضاء */
}

    /* لون الروابط داخل القائمة */
    .header-area .dropdown-menu a,
    .navbar .dropdown-menu .dropdown-item {
        color: #E60023 !important; /* أحمر مثل لون الشعار */
    }

        /* لون الروابط عند المرور بالماوس */
        .header-area .dropdown-menu a:hover,
        .navbar .dropdown-menu .dropdown-item:hover {
            background-color: #E60023;
            color: #ffffff !important; /* نص أبيض على خلفية حمراء */
        }
/* ضبط ألوان قائمة الحساب المنسدلة بعد تسجيل الدخول */

/* خلفية القائمة */
.dropdown-menu {
    background-color: #ffffff !important;
}

    /* لون النص داخل القائمة */
    .dropdown-menu a,
    .dropdown-menu .dropdown-item,
    .dropdown-menu li a {
        color: #E60023 !important; /* أحمر نفس لون الشعار */
        font-size: 0.95rem;
    }

        /* عند المرور بالماوس */
        .dropdown-menu a:hover,
        .dropdown-menu .dropdown-item:hover,
        .dropdown-menu li a:hover {
            background-color: #E60023 !important;
            color: #ffffff !important; /* نص أبيض */
        }