/* Google Font Kufi */
@import url('https://fonts.googleapis.com/css2?family=Noto+Kufi+Arabic:wght@100..900&display=swap');

:root {
    --primary-color: #4C58A5;
    --primary-color-75: #4C58A5BF;
    --Secondary-color: #EFD98D;
    /* --third-color: #0B6668; */
    /* --fourth-color: #459D8C; */
    --light-color: #ffffff;
    --dark-color: #243040;
    --muted-color: #8E8E93;
    --muted-color-02: #707070;
}

* {
    font-family: "Noto Kufi Arabic", sans-serif;
}


.p-top-100 {
    padding-top: 135px;
}

.p-bottom-100 {
    margin-bottom: 60px;
}

.m-bottom-300 {
    margin-bottom: 300px;
}

.swiper-homePage .hero-content,
.section-faq {
    padding-top: 120px;
}

.fixed-social ul li a i {
    color: var(--light-color);
}

/* Start Header */
.header-mobile__toolbar {
    color: var(--Secondary-color);
}

.main-header {
    background-color: transparent;
    margin: 10px auto;
}

.main-header .container {
    background-color: var(--primary-color);
    padding-top: 12px;
    padding-bottom: 12px;
    border-radius: 24px;
}

.myCourses {
    border-radius: 12px;
    border: 1px solid var(--Secondary-color);
    padding: 0px 10px;
    background-color: var(--Secondary-color);
    color: #fff;
    font-size: clamp(12px, 18px, 4vw);
    transition: all .3s linear;
}

.myCourses:hover {
    background-color: transparent;
    color: var(--Secondary-color);
}

.main-header .menu-container .main-menu .menu_item .menu_link.link-profile {
    border: none;
}

.menu_link svg>*,
.link-notification svg>* {
    stroke: var(--light-color);
}

/* End Header */
.m-checkbox .checkmark {
    border: 1px solid var(--Secondary-color);
}

.m-checkbox .checkmark:after {
    background-color: var(--Secondary-color);
}

.single-page-hero-section {
    min-height: 45dvh;
    background-position: center;
}
.widget__item-faq{
    border-bottom: 1px solid var(--dark-color);
}
.widget__item-faq:not(.collapsed) {
    background-color: #24304008;
}
.widget__item-faq:not(.collapsed) span.icon{
    transition: all .3s linear;
    rotate: 180deg;
}
.bootstrap-select>.select-primary.dropdown-toggle{
    background-color: var(--Secondary-color) !important;
    border-color: var(--Secondary-color);
    color: var(--light-color) !important;
}
.bootstrap-select>.select-primary.dropdown-toggle:focus,
.bootstrap-select>.select-primary.dropdown-toggle:hover{
    border-color: var(--Secondary-color) !important;
}
.btn-primary{
    background-color: var(--primary-color);
}
.btn-primary::before{
    background-color: var(--primary-color);
}
.btn-primary:hover, .btn-primary:focus{
    background-color: var(--Secondary-color);
}
/* Start Footer */
.main-footer {
    background-color: var(--primary-color);
}

.main-footer .footer-logo {
    width: 100px;
    height: auto;
}

.main-footer .link-footer a:hover {
    color: var(--Secondary-color) !important;
}