@import url('/assets/fonts/Almarai/Almarai-Regular.ttf');



body:lang(ar),
html:lang(ar) *{
    font-family: 'Almarai', sans-serif !important;
    text-align: right;

}

.dropdown-menu-dark {
    background-color: #0f0f0f !important;
}

.feature-card img {
    height: 500px;              
    object-fit: cover; 
    width: 100%;
}

.img-card{
    width:500px;
    height:500px;
}

.img-container img{
    width:fit-content ;
    /* height: 100%; */
    object-fit: cover;
    transition: transform 0.6s ease;
}

.img-container{
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
    height: 100%;
}

.text-grey{
    color: #9A9A9A !important;
}
.btn-primary{
    background-color: #1C2AFF  !important;
}
.text-xl{
    font-size: 1.25rem;
    line-height: 1.75rem;
}

.text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem;
}
.max-w-48{
    max-width: 48rem;
}

.text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
}
.text-3xl {
    font-size: 1.875rem;
    line-height: 2.25rem;
}
.text-4xl{
    font-size: 2.25rem;
    line-height: 2.5rem;
}
.hover\:bg-blue:hover{
    background-color: #1C2AFF;
    color:#fff;
}

.hover\:border-blue:hover{
    border-color: #1C2AFF;
}

.hover\:text-gray-900:hover {
    --tw-text-opacity: 1;
    color: rgb(17 24 39 / var(--tw-text-opacity, 1));
}

.fw-semibold {
    font-weight: 600;
}

.text-gray-600 {
    --bs-text-opacity: 1;
    color: rgb(75 85 99 / var(--bs-text-opacity, 1));
}

.duration-300 {
    transition-duration: 300ms;
}
.transition-colors {
    transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}


.scale-105{
    transform: scale(1.05,1.05);
}

.border-blue{
    border-color: #1C2AFF;
}

.bg-gray-50 {
    --bs-bg-opacity: 1;
    background-color: rgb(249 250 251 / var(--bs-bg-opacity, 1));
}

.bg-gray-100 {
    --bs-bg-opacity: 1;
    background-color: rgb(243 244 246 / var(--bs-bg-opacity, 1));
}

.bg-white\/90 {
    background-color: rgb(255 255 255 / 0.9);
}

.bg-neutral-800 {
    --bs-bg-opacity: 1;
    background-color: rgb(38 38 38 / var(--bs-bg-opacity, 1));
}
.bg-neutral-700 {
    --bs-bg-opacity: 1;
    background-color: rgb(64 64 64 / var(--bs-bg-opacity, 1));
}

.border-neutral-700 {
    --bs-border-opacity: 1;
    border-color: rgb(64 64 64 / var(--bs-border-opacity, 1));
}

.percentage-card{
    width: 90%;
    position: absolute;
    bottom: 23%;
    left: 5%;
}

.text-sm {
    font-size: 0.875rem;
    line-height: 1.25rem;
}

.rounded-full {
    border-radius: 9999px;
}
.text-neutral-300 {
    --bs-text-opacity: 1;
    color: rgb(212 212 212 / var(--bs-text-opacity, 1));
}

.text-neutral-400 {
    --tw-text-opacity: 1;
    color: rgb(163 163 163 / var(--tw-text-opacity, 1));
}
.text-blue-500 {
    --tw-text-opacity: 1;
    color: rgb(59 130 246 / var(--tw-text-opacity, 1));
}

.transition-all {
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.h-1 {
    height: 0.25rem;
}
.w-6 {
    width: 1.5rem;
}

.h-6 {
    height: 1.5rem;
}
.w-5 {
    width: 1.25rem;
}
.h-5 {
    height: 1.25rem;
}
.w-4 {
    width: 1rem;
}
.h-4 {
    height: 1rem;
}
.line{
    width:100px;
}
.feature-list{
    width: fit-content;
}

.bg-black{
    background-color:#0f0f0f !important;
}

#wave-wrapper{
    position: relative;
    overflow:hidden;
    height: 6rem;

}
#wave{
    position: absolute;
    bottom: 0;
    height: 100%;
    width: 100%;
}

.bg-blue-500 {
    --bs-bg-opacity: 1;
    background-color: rgb(59 130 246 / var(--bs-bg-opacity, 1));
}
.items-start {
    align-items: flex-start;
}

.text-blue-500 {
        --bs-text-opacity: 1;
        color: rgb(59 130 246 / var(--bs-text-opacity, 1));

}

.bg-blue-100 {
    --bs-bg-opacity: 1;
    background-color: rgb(219 234 254 / var(--bs-bg-opacity, 1));
}

.text-neutral-600 {
    --bs-text-opacity: 1;
    color: rgb(82 82 82 / var(--bs-text-opacity, 1));
}

.bg-purple-500\/10 {
        background-color: rgb(168 85 247 / 0.1); 
        width:42px;
}  
.text-purple-500 {
    --bs-text-opacity: 1;
    color: rgb(168 85 247 / var(--bs-text-opacity, 1));
 }
.bg-pink-500\/10 {
    background-color: rgb(236 72 153 / 0.1);
    width:42px;
}
.text-pink-500 {
    --bs-text-opacity: 1;
    color: rgb(236 72 153 / var(--bs-text-opacity, 1));
}

.border-neutral-800 {
    --bs-border-opacity: 1;
    border-bottom: 1px solid rgb(38 38 38 / var(--bs-border-opacity, 1));
}


.rounded-5{
    border-radius: 15px !important;
}
.rounded-4{
    border-radius: 10px !important;
}
.bg-red-500\/10 {
    background-color: rgb(239 68 68 / 0.1);
}
.text-red-500 {
    --bs-text-opacity: 1;
    color: rgb(239 68 68 / var(--bs-text-opacity, 1));
}
.bg-yellow-500\/10 {
    background-color: rgb(234 179 8 / 0.1);
}
.text-yellow-500 {
    --bs-text-opacity: 1;
    color: rgb(234 179 8 / var(--bs-text-opacity, 1));
}
.bg-green-500\/10 {
    background-color: rgb(34 197 94 / 0.1);
}
.text-green-500 {
    --bs-text-opacity: 1;
    color: rgb(34 197 94 / var(--bs-text-opacity, 1));
}
.bg-indigo-500\/10 {
    background-color: rgb(99 102 241 / 0.1);
}
.text-indigo-500 {
    --bs-text-opacity: 1;
    color: rgb(99 102 241 / var(--bs-text-opacity, 1));
}
.bg-amber-500\/10 {
    background-color: rgb(245 158 11 / 0.1);
}
.text-amber-500 {
    --bs-text-opacity: 1;
    color: rgb(245 158 11 / var(--bs-text-opacity, 1));
}
.bg-teal-500\/10 {
    background-color: rgb(20 184 166 / 0.1);
}
.text-teal-500 {
    --bs-text-opacity: 1;
    color: rgb(20 184 166 / var(--bs-text-opacity, 1));
}

.bg-dark{
    background-color: #1E1E1E !important;
}

.accordion-button:focus {
    z-index: 3 !important;
    border-color: #1E1E1E !important;
    outline: 0 !important;
    box-shadow: 0 0 0 0 !important;
}

.text-red{
    color:rgb(237 49 46 / var(--bs-text-opacity, 1));
}

.bg-neutral-700\/50 {
    background-color: rgb(64 64 64 / 0.5);
}

.btn-red{
    color:#fff !important;
    background-color: #D62926 !important;
    border: #D62926;
}
.banner-font{
    font-size: 3.75rem;
  
}
.bg-darked{
    background-color: #262626;
}
.text-danger{
    color: #ED312E !important;
}

.btn-danger{
    background-color: #ED312E !important;
}
.btn-danger:hover{
    background-color: #B91C1C !important;
}
.btn-outline-danger{
    color: #ED312E !important;
    border-color: #ED312E !important;
    background-color: #000;
}
.bg-\[\#FEE7E7\] {
    --bs-bg-opacity: 1;
    background-color: rgb(254 231 231 / var(--bs-bg-opacity, 1));
}
.w-14 {
    width: 3.5rem;
}
.text-red-200{
    color: #FECACA;
}

.bg-danger{
    background-color: #ED312E !important;
}

.h-14 {
    height: 3.5rem;
}

.w-8 {
    width: 2rem;
}

.h-12 {
    height: 3rem;
}

.w-12 {
    width: 3rem;
}

.h-8 {
    height: 2rem;
}
.h-9 {
    height: 4rem;
}
.w-3{
    width:3rem;
}
.h-3{
    height:3rem;
}
.text-light-grey{
   color: #4B5563;
}

.bg-darked-2{
 background-color: #404040;
}

.text-grey1{
color: #D4D4D4;
}

.form-control:focus {
    color: #fff !important;
    background-color: #404040 !important;
    border-color: #ED312E !important;
    outline: 0 !important;
    box-shadow: 0 0 0 .25rem rgba(44, 46, 49, 0.25) !important;
}

.dot{
    width: 15px;
    height: 15px;
}

.support-div{
    max-width: max-content;
    /* width: 220px; */
    right: 25rem;
    top: 27rem;
}

.duration-300 {
    transition: transform 0.3s ease-in-out;
}

.duration-300:hover{
    transform: scale(1.03);
}
.feature:hover{
    background-color:#404040 ;
}



@media  (max-width:426px) {
    .banner-font{
        font-size: 40px;
      
    }
   

}

@media  (min-width:426px) and (max-width:769px) {
    .banner-font{
        font-size: 3rem;      
    }
    /* .feature-card{
        width:22rem !important;
    }
    .feature-card img{
        height:100px;
    } */


}

@media (max-width:769px) {
    /* .feature-card{
        width:35rem !important;
    } */
}