@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@200;300;400;500;700;800;900&display=swap');


h1,h2,h3,h4,h5,h6,a,div,p,label,span, a, .carousel .list .item .buttons button,
.form-control, .bootstrap-select .text, #SR7_9_1-31-2, #SR7_9_1-33-2, #SR7_9_1-32-2 {
    font-family: 'Tajawal', sans-serif !important;
}

.rtl .menu-area .icon2 .navbar ul > li.menu-item-has-children > a:before {
    color: var(--primaryColor) !important;
    left: -10px !important;
}

.navbar ul > li.menu-item-has-children > a {
    margin-left: 16px;
    margin-right: unset !important;
}

.service .react-addon-services .services-part .services-text .services-btn-part .services-btn::after {
    left: usnet !important;
    right: 0;
}

.react-addon-services.services-style1 .services-btn-part a i {
    margin-left: unset !important;
    margin-right: 0;
}

.react-addon-services .services-part .services-text .services-btn-part .services-btn.icon-after span {
    float: right !important;
}

.service .react-addon-services .services-part .services-text p:nth-of-type(2) {
    height: 80px;
}

.react-addon-services.services-style1 .services-btn-part a i::before {
    content: "\f060" !important;
}

.react-addon-services.services-style1:hover i {
    margin-left: unset !important;
    margin-right: 7px !important;
}

#reactheme-header .menu-area .navbar ul li ul li .sub-menu {
    right: 100% !important;
}

.elementor-widget-n-tabs .e-n-tab-title[aria-selected="true"]::after {
    content: "";
    position: absolute;
    top: 50%;
    right:unset !important;
    left: 10px;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: unset !important;
    border-right: 10px solid white;
}

/* Arrow for inactive tabs (pointing down initially) */
.elementor-widget-n-tabs .e-n-tab-title::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%); /* Default pointing down */
    width: 0;
    height: 0;
    border-left: 10px solid transparent; /* Transparent left */
    border-right: 10px solid transparent; /* Transparent right */
    border-top: 10px solid #6708c0; /* Purple arrow pointing down */
    transition: transform 0.7s ease, border-color 0.2s ease; /* Smooth rotation and color change */
}

/* Hover effect for inactive tabs */
.elementor-widget-n-tabs .e-n-tab-title:hover::after {
    /* transform: translateY(-55%);  */
    border-top: 10px solid transparent; 
    border-left: 10px solid transparent;
    border-right: 10px solid white; 
    border-bottom: 10px solid transparent; 
}

/* Active tab arrow (pointing to the right) */
.elementor-widget-n-tabs .e-n-tab-title[aria-selected="true"]::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%); /* No rotation needed for active state */
    width: 0;
    height: 0;
    border-top: 10px solid transparent; /* Transparent top */
    border-bottom: 10px solid transparent; /* Transparent bottom */
    border-left: unset !important;
    border-right: 10px solid white;
}

/* General styling for all tabs */
.elementor-widget-n-tabs .e-n-tab-title {
    position: relative;
    display: inline-block;
    padding-left: 30px; /* Space for the arrow */
    text-align: right;
    transition: background-color 0.3s ease; /* Smooth background transition */
    padding: 15px 0px 15px 30px !important;
    line-height: 25px;
}