:root {
    --islamic-pattern: url("../images/bg-haj-2026.png");
    --main-color-bg-1: #fafafa;
    --main-color-bg-2: #f5f5f5;
    --main-color-bg-3: #eeeeee;
    --main-color-bg4: #ffffff;
    --main-color-bg5: #fff;
    --main-color-bg6: #1a1a1a;
    --main-bg-with-pattern: var(--islamic-pattern), #fafafa;
    --main-color-gradient-1: linear-gradient(180deg, rgb(253, 238, 189) 45%, rgba(212,175,55,0) 100%);
    --main-color-gradient-2: linear-gradient(180deg, rgba(253, 238, 189,0) 0%, rgba(253, 238, 189,1) 50%);
    --main-color-primary: #D4AF37;
    --main-color-second: #222222;
    --main-color-third: #000000;
    --main-color-text-1: #666666;
    --main-color-hr: #D4AF37;
    --bs-nav-link-color: #222222;
    --bs-navbar-active-color: #D4AF37;
    --bs-body-font-family: tajawal;
    --main-opacity: 0.5;
}

/* Apply pattern to the body or main container */
body {
    background-image: var(--islamic-pattern);
    background-color: var(--main-color-bg-1);
}
.btn-outline-primary {
    --bs-btn-color: #D4AF37;
    --bs-btn-bg: #ffffff;
    --bs-btn-border-color: #D4AF37;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #D4AF37;
    --bs-btn-hover-border-color: #D4AF37;
    --bs-btn-focus-shadow-rgb: 212, 175, 55;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #B8860B;
    --bs-btn-active-border-color: #B8860B;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #D4AF37;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #D4AF37;
    --bs-gradient: none;
    border-radius: 8px; /* Slightly rounded for a modern look */
}

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #d4af37;
    --bs-btn-border-color: #d4af37;
    --bs-btn-hover-color: #D4AF37;
    --bs-btn-hover-bg: #000000;
    --bs-btn-hover-border-color: #D4AF37;
    --bs-btn-focus-shadow-rgb: 34, 34, 34;
    --bs-btn-active-color: #D4AF37;
    --bs-btn-active-bg: #000000;
    --bs-btn-active-border-color: #000000;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: rgba(0, 0, 0, 0.5);
    --bs-btn-disabled-bg: #eeeeee;
    --bs-btn-disabled-border-color: #eeeeee;
}

.nav {
    --bs-nav-link-color: #222222;
    --bs-nav-link-hover-color: #D4AF37;
    /* Added a bottom border decoration for navigation */
    border-bottom: 1px solid var(--main-color-hr);
}

.nav-pills {
    --bs-nav-pills-link-active-color: #fff;
    --bs-nav-pills-link-active-bg: #D4AF37;
}

/* Extra Touch: Decorative Divider */
hr {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, transparent, var(--main-color-hr), transparent);
}


.offer-img {
    width: 88px;
    height: 88px;
    background: url('../images/haj-2026.png');
    top: -40px;
    left: 20px;
    /* border-radius: 0 !important; */
    border: 4px solid white;
}
.product-slider-box .col-auto h5 {
    background-image: linear-gradient( 90deg, rgba(212,175,55,0) 0%, rgb(212,175,55) 100%);
    height: 50px;
    line-height: 2;
    border-radius: 50px;
    padding-right: 20px;
    width: 250px;
}


@media (990px >= width) {

    .product-slider-box .owl-theme .owl-nav .next-custom {
        top: -67px !important;
        left: 150px !important;
    }
    .product-slider-box .owl-theme .owl-nav .prev-custom {
        top: -67px !important;
        left: 108px !important;
    }
    .offer-img {
        background-size: 60px;
    }
}