button.accordion-button.jobs-type {
    background-color: white;
}

div#searchbox {
    margin-bottom: 15px;
}

input.ais-SearchBox-input {
    padding: 5px 45px;
}
input.ais-SearchBox-input:focus {
    outline: 2px solid #028659;
    outline-offset: -2px;
    -webkit-box-shadow: inset 0 0 20px 20px #e7fff7;
    box-shadow: inset 0 0 20px 20px #e7fff7;
}


.custom-articale:hover {
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
}


.job-date {
    color: #cccccc;
    font-weight: bold;
}

.job-listings .job-listing-position h2 {
    margin-top: 0px;
}

.custom-job-contetn {
    width: 85%;
}

.job-description,
.job-salary {
    margin-left: 25px;
    font-size: 14px;
}

li.dropdown-header.optgroup-1 {
    color: black;
    margin-left: 20px;
    font-size: 20px;
}


.job-listings .badge {
    color: #000;
    padding: 4px 10px;
    font-weight: bold;
}

.job-salary-and-work-type {
    display: flex;
    gap: 33%;
}

.custom-articale {
    display: grid;
    grid-template-columns: 25% 75%;
    gap: 15px;
}

.job-listing-about1 {
    display: grid;
    grid-template-columns: 40% 30% 30%;
}

span.ais-Highlight-nonHighlighted {
    font-size: 16px;
}

.custom-articale .job-listing-about1>div {
    margin: 10px;
}

.job-listing-logo {
    display: flex;
    width: 100%;
    margin: 0px;
    padding: 0px;
}

.jobs-type {
    font-weight: 500;
    border: 1px solid #b3b0b0;
}

.ais-RefinementList.MyCustomRefinementList {
    margin: 0px 10px;
}

.accordion-body {
    padding: 0px;
}

.custom-head {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 20px 0px 0px 0px;
    flex-wrap: wrap;

}

.accordion-item {
    border: 0px;
}
@media (min-width: 2600px) { /* تعديل القاعدة لتُطبق على الشاشات الأكبر */
    .accordion {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
        margin-bottom: 15px;
    }
    .accordion .accordion-item {
        width: 23%; /* عرض كل عنصر 25% */
    }
}
.accordion-collapse{
    margin-top: 15px;
}

button.accordion-button.jobs-type {
    padding: 5px 10px ;
}
button.accordion-button.jobs-type:focus {
    padding: 12px 15px !important;
    outline: 2px solid #028659!important;
    outline-offset: -2px !important;
    -webkit-box-shadow: inset 0 0 20px 20px #e9fff7  !important;
    box-shadow: inset 0 0 20px 20px #e9fff7  !important;

}
.filter-button {
    margin: 10px 10px;
    padding: 5px 20px;
    border-radius: 0;
}
@media screen and (min-width: 1500px) and (max-width: 1920px) {
    .job-listing-about {
        width: 40vw !important;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-left: 1rem;
        margin-right: 1rem;
    }
}

@media screen and (min-width:767px) and (max-width:2600px) {

    .left-panel {
        width: auto;
        background-color: #fff;
        padding: 20px;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        text-wrap: nowrap;
        overflow-y: scroll;
        padding-right: 1.4rem;
        height: auto;
        top: 0;
        position: sticky;
        height: 100vh;
        overflow-x: hidden;
    }

    .left-panel h2 {
        margin-bottom: 10px;
        font-size: 18px;
        color: #333;
    }
}
@media screen and (min-width:992px) and (max-width:2600px) {
    .custom-page-layout {
        display: grid;
        grid-template-columns: 30% 70%;
    }
}
@media screen and (min-width:500px) and (max-width:991px) {
    .custom-page-layout {
        display: grid;
        grid-template-columns: 35% 65%;
    }
}
li.ais-Hits-item {
    width:32%;
  }
@media screen and (min-width: 767px) and (max-width: 1024px) {
    li.ais-Hits-item {
      width: 48%;
    }
  }
  /* الأجهزة المحمولة (موبايل) */
@media screen and (max-width: 767px) {
    li.ais-Hits-item {
      width: 100%; /* لتكون العناصر كاملة العرض في الموبايل */
    }
  }

@media screen and (min-width:200px) and (max-width:769px) {
    div#accordionExample {
        display: grid;
        grid-template-columns: 50% 50%;
        margin-bottom: 15px;
    }
    div#accordionExample > hr {
        display: none;
    }
    .custom-articale {
        display: block;
    }

    .job-listing-logo img {
        width: 100%;
        height: auto;
        object-fit: cover;
        border-radius: 4px;
        margin: auto;
    }
    .job-listing-about1 {
        display: flex;
        flex-wrap: wrap;
    }
}

/* محاذاة المحتوى لليمين (للغة العربية) */
html[dir="rtl"] .left-panel {
    /* margin-right: -35px; */
    margin-left: 0;
}

/* محاذاة المحتوى لليسار (للغة الإنجليزية) */
html[dir="ltr"] .left-panel {
    margin-left: -35px;
    margin-right: 0;
}
ol.ais-Hits-list {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}

img.user-image {
    max-width: fit-content;
    width: 150px;
}
.col-xl-3.sidebar {
    display: none;
}
/* main#main {
    width: 100%;
} */
h2.user-name {
    font-size: larger;
    margin-top: 0;
}
.user-info {
    display: grid;
    grid-template-rows: 200px 110px;
}
.user-image-container {
    display: block;
    margin: auto;
}
@media screen and (max-width: 769px) {
    div#accordionExample {
        display: grid;
        grid-template-columns: 100%;
        margin-bottom: 15px;
    }
    ol.ais-Hits-list {
        display: block;
        width: 100%;
    }
    li.ais-Hits-item {
        width: 100%;
        margin-bottom: 20px;
    }
}
.accordion-item:first-of-type>.accordion-header .accordion-button {
    border-radius: 0;
}
.accordion-item:last-of-type>.accordion-header .accordion-button.collapsed {
    border-radius: 0;
}

div#pagination {
    margin-top: 20px;

}
ul.ais-Pagination-list {
    justify-content: center;
    
}
li.ais-Pagination-item.ais-Pagination-item--page.ais-Pagination-item--selected a {
    background: #00b074 !important;
    color: white;
}
.ais-Pagination-item+.ais-Pagination-item>.ais-Pagination-link {
    color: #00b074;
    font-size: 24px;
}
.ais-Pagination-item:first-child>.ais-Pagination-link {
    color: #00b074;
    font-size: 24px;
}
a.ais-Pagination-link {
    font-size: 16px !important;
}

span.ais-Pagination-link:first-child {
    border-top-left-radius: 5px !important;
    border-bottom-left-radius: 5px !important;
}
span.ais-Pagination-link:last-child {
    border-top-right-radius: 5px !important;
    border-bottom-right-radius: 5px !important;
}
.custom-article {
    width:100% !important;   
}