/* src/static/css/jobs/jobs.css */
.jobs_hero_banner{
    padding: 40px 0;
    background-size: cover;
    margin-top: 0;
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
}
.jobs_hero_banner::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color:#2d3031cf;
}

.jobs_hero_banner .jobs-hero-content h1{
    font-size: 3em;
    font-family: "Cairo", sans-serif;
    font-style: bold;
    font-weight: 600;
    text-transform: none;
    margin-top: 1.64285714rem;
    margin-bottom: .82142857rem;
    /* color: #ea980b; */
    color: #ff7a18;
    vertical-align: inherit;
}

.jobs_hero_banner .jobs-hero-content p{
    color: #ffff;
    margin-bottom: 20px;
}

.jobs_hero_banner .container {
    -webkit-font-smoothing: antialiased;
    text-align: center;
    margin-right: auto;
    margin-left: auto;
    padding-left: 1.07142857em;
    padding-right: 1.07142857em;
}

.jobs_hero_banner a{
    display: inline-block;
    margin-bottom: 0;
    font-size: 15px;
    font-weight: 600;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    line-height: 1;
    user-select: none;
    color: #fff;
    border-radius: 3px;
    padding: 15px 25px 15px 25px;

}

.jobs_hero_banner .btn_primary{
    text-align: left;
    background-color: #e74517;
    /* margin: 20px auto; */
    border: 1px solid #dedede;
}

.jobs_hero_banner .jobs-hero-buttons{
    text-align: center;
    margin-right: auto;
    margin-left: auto;
    padding-left: 1.07142857em;
    padding-right: 1.07142857em;
}

.jobs_hero_banner .jobs-hero-buttons .btn_add_new{
    background-color: #ea980b;
    display: flex;
    justify-items: center;
    gap: 10px;
}

.jobs_hero_banner .jobs-hero-buttons .btn_secondary{
    background-color: #0476D0;
    display: flex;
    justify-items: center;
    gap: 10px;
}

/* ------------------------------
JOB FILTER SECTION
/* ------------------------------ */

.job_filter_form{
    max-width: 97%;
    margin: 0 auto;
}

.job_filter_form label{
    font-weight: 500;
    color: #bab7c1;
    margin-bottom: 10px;
    display: none;
}

/* === Job Advanced Search === */
.job-advanced-search {
    /* background: #fff; */
    padding: 18px 20px;
    border-radius: 6px;
    /* box-shadow: 0 2px 10px rgba(0,0,0,.08); */
    margin-bottom: 25px;
    max-width: 95%;
    margin: 30px auto;
    border-radius: .5rem;
    box-shadow: 0 .25rem 1rem rgba(0, 0, 0, 0.164);
}

.job-advanced-search.horizontal .job-filter-form {
    display: grid;
    grid-template-columns: repeat(4, 1fr) auto;
    gap: 12px;
    align-items: center;
}

.job-advanced-search .form-group {
    margin: 0;
}

.job-advanced-search input,
.job-advanced-search select {
    width: 100%;
    height: 44px;
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
    background-color: #fff;
    color: #869094;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: none;
}

.dark-mode .job-advanced-search input,
.dark-mode .job-advanced-search select{
    background-color: #37393b;
    border: 1px solid #585757;
}

.job-advanced-search select {
    padding-right: 36px;
}

/* Custom arrow ONLY for selects */
.job-advanced-search .form-group:has(select)::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 14px;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #869094;
    transform: translateY(-50%);
    pointer-events: none;
}


body.lang_ar .job-advanced-search .form-group::after {
    right: auto;
    left: 14px;
}

body.lang_ar .job-advanced-search select {
    padding-right: 12px;
    padding-left: 36px;
}
.job-advanced-search select:focus + *,
.job-advanced-search .form-group:hover::after {
    border-top-color: #1e88e5;
}


.job-advanced-search input:focus,
.job-advanced-search select:focus {
    border-color: #1e88e5;
    outline: none;
}

.job-advanced-search button {
    height: 44px;
    padding: 0 22px;
    border-radius: 4px;
    font-weight: 600;
    background: #1e88e5;
    border: none;
    color: #fff;
    cursor: pointer;
}

.job-advanced-search button:hover {
    background: #1565c0;
}

/* Mobile */
@media (max-width: 991px) {
    .job-advanced-search.horizontal .job-filter-form {
        grid-template-columns: 1fr;
    }
}



.job_lists{
    max-width: 97%;
    margin: 0 auto;
    gap: 30px;
}

.jobs_featured_wrapper{
    width: 300px;
    width: 350px;
    max-width: 35%;
    /* background-color: #fff; */
}

.posts_loop_title{
    margin-bottom: 30px;
}
.posts_loop_title h3{
    font-size: 23px;
    font-family: "Cairo", sans-serif;
    font-weight: 600;
}
.job_cards_wrapper {
    width: 65%;
    max-width: 1100px;
}

.homepage_eng_job_grid .job_cards_wrapper{width:100%;margin:auto;}

.job_list_wrapper > article:hover{
    background-color:#44494B;
}

.elem00e1mg .job_list_wrapper > article:hover{
    background-color: #123a75;
}

.job_list_wrapper > article{
    position: relative;
    background-color: #fff;
    border: thin solid #ddd;
    margin-bottom: 20px;
    box-sizing: content-box;
    width: 100%;
    transition: all 0.3s ease-in-out;
}

.promoted_job_slider .job_cards_wrapper > article:hover{
    /* background-color: #44494b85; */
    background-color: #123a75;
}

.job_cards_wrapper > article:hover a,
.job_cards_wrapper > article:hover p,
.job_cards_wrapper > article:hover h1,
.job_cards_wrapper > article:hover h2,
.job_cards_wrapper > article:hover h3,
.job_cards_wrapper > article:hover .job-tools > span,
.job_cards_wrapper > article:hover .content-meta .job_type,
.job_cards_wrapper > article:hover .job_date_ago,
.job_cards_wrapper > article:hover .show_quick_view{
    color: #fff;
    opacity: 1;
}

.homepage_eng_job_grid .tm_row .blog-item:hover a,
.homepage_eng_job_grid .tm_row .blog-item:hover p,
.homepage_eng_job_grid .tm_row .blog-item:hover h1,
.homepage_eng_job_grid .tm_row .blog-item:hover h2,
.homepage_eng_job_grid .tm_row .blog-item:hover h3,
.homepage_eng_job_grid .tm_row .blog-item:hover .job-tools > span,
.homepage_eng_job_grid .tm_row .blog-item:hover .content-meta .job_type,
.homepage_eng_job_grid .tm_row .blog-item:hover .show_quick_view{
    color: #fff;
    opacity: 1;
}

.job_cards_wrapper > article .company_logo{
    /* overflow: hidden; */
    /* width: 80px; */
    /* height: 80px; */
    background-color: #fff;
    /* min-width: 70px; */
    /* display: table-cell; */
    /* float: left; */
    position: relative;
    transition: .5s;
}

.dark-mode .job_cards_wrapper > article .company_logo{
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6);
    background: rgba(30, 30, 30, 0.7);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 50px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    -ms-border-radius: 50px;
    -o-border-radius: 50px;
}

.job_cards_wrapper > article:hover .company_logo{
    border-radius: 50%;
}

.job_cards_wrapper > article .company_logo img{
    width: 80px;
    height: auto;
    border-radius: 50px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    -ms-border-radius: 50px;
    -o-border-radius: 50px;
}
.vertical_ad a img{
    width: 100%;
    max-width: 350px;
    height: auto;
}

.job_cards_wrapper > article a{
    color: #44494b;
}

.job_cards_wrapper .loop-item-content{
    padding: 30px;
    background: transparent;
}

.promoted_job_slider .job_cards_wrapper .loop-item-content{
    padding: 0;
}

.promoted_job_slider .loop_item_wrap{
    padding: 20px;
}
.job_cards_wrapper .job_card_job_title{
    color: #44494b;
    -webkit-font-smoothing: antialiased;
    margin-bottom: 5px;
    font-family: "Cairo", sans-serif;
    font-weight: 600;
    text-transform: none;
    line-height: normal;
    margin-top: 15px;
}

.promoted_job_slider .job_cards_wrapper .job_card_job_title{
    margin: 0;
}

.job_cards_wrapper .content-meta{
    margin: 10px 0;
}

.job_cards_wrapper .content-meta, 
.job-tools > span,
.job-tools > span a{
    color: #003060;
    /* display: inline-table; */
    font-style: italic;
    font-size: 14px;
}

.lang_en .job-tools>span i {padding-right: 10px;}
.lang_ar .job-tools>span i {padding-right: 10px;}

.lang_en .job_cards_wrapper .content-meta > span.info,
.lang_en .job-tools > span{
    padding-left: 10px;
}

.lang_ar .job_cards_wrapper .content-meta>span.info,
.lang_ar .job-tools>span {
    padding-right: 10px;
}


.job_cards_wrapper .content-meta > span.info svg{
    width: 15px;
    height: auto;
}
.job_cards_wrapper .content-meta .job_type{
    color: #f14e3b;
}

.job_cards_wrapper .show_view_more{
    position: absolute;
    top: 10px;
    right: 10px;
    width: 100px;
    height: 100%;
}

.promoted_job_slider .show_view_more{
    position: relative;
    right: 0;
    top: 8px;
    align-items: flex-end;
    width: 100%;
}

.promoted_job_slider .show_view_more{
    height: auto
}

.job_cards_wrapper > article .show_view_more a{
    padding:5px 10px;
    color: #fff;
    text-align: center;
    font-weight: bolder;
    background-color: #FF7A18;
}

.job_cards_wrapper .job_date_ago{
    position: absolute;
    right: 25px;
    bottom: 18px;
    font-size: 12px;
    /* min-width: 70px; */
}

.job_cards_wrapper .show_quick_view{
    display: block;
    opacity: 0;
    position: absolute;
    right: 0;
    bottom: 0;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}

.job_cards_wrapper .show_quick_view a:before{
    border-bottom: solid 0 transparent;
    /* border-right: solid 40px #555353; */
    border-right: 40px solid #bfc8cb85;
    border-top: solid 40px transparent;
    position: absolute;
    right: 0;
    bottom: 0;
    content: "";
}

.job_cards_wrapper .show_quick_view a::after{
    content: "";
    position: absolute;
    right: 6px;
    bottom: 3px;
    width: 16px;
    height: 16px;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 5c-7 0-11 7-11 7s4 7 11 7 11-7 11-7-4-7-11-7zm0 11a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-2.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3z'/%3E%3C/svg%3E");
}

/* -------------------------------
JOB DETAILS PAGE
-------------------------------- */

.jbd_main{
    max-width: 670px;
    padding: 30px;
    background-color: #fff;
    border-radius: 10px 0 0 10px;
}

.job-detail-page{
    max-width: 100%;
}

.jbd_header{
    padding: 60px 0 230px;
    margin-bottom: 75px;
    background-repeat: repeat;
    background-size: cover;
    display: block;
}

.jbd_header .jbd_container{
    z-index: 2;
}

.page_heading_info{
    padding: 0 25px
}

.jbd_header .views_count{
font-size: 15px;
    color: #fff;
    padding: 6px 10px;
    background-color: #3e5db7;
    border-radius: 50px;
    line-height: normal;
}

.jbd_header .heading_title{
    color:#fff;
    font-size: 42px;
    font-family: "Cairo", sans-serif;
    margin-top: 20px;
}

.jbd_header .parallax{
    background-position: 50% 50% 0px;
    background-repeat: no-repeat;

    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 400px;
    /* z-index: -1; */
    background-attachment: fixed;
    background-position: 50% 0;
    background-repeat: repeat;
    background-size: cover !important;
}

.page_sub_heading_info{
    opacity: 1;
    position: absolute;
    top: 220px; 
    left: 0;
    right: 0;
    width: 90%;
    margin: 0 auto;
    padding: 25px 25px 10px 25px;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 5px 5px 0 #ddd;
    color: #44494b;
}

.jbd_header .content_meta{
    font-size: 16px;
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}

.jbd_header .company_logo img{
    min-width: 100px
}

.job_details_container_wrap .jbd_container_boxed{
    padding-top: 30px;
    padding-bottom: 70px;
    margin: 0 auto;
    max-width: 1200px;
}

.row {
    margin-left: -1.07142857em -15px;
    margin-right: -1.07142857em;
}

.company-custom-fields ul,
.job-custom-fields ul,
.job-desc ul,
.more-jobs ul {
    list-style: none;
    padding-left: 0;
    position: relative;
}

.job-desc ul {
    list-style: disc;
    padding-left: 30px;
}

.company-custom-fields ul li strong:after,
.job-custom-fields ul li strong:after,
.job-desc ul li strong:after,
.more-jobs ul li strong:after {
    content: ':';
}

.expired_job_page .expired_job_content{
    max-width: 97%;
    margin: 90px auto;
}

.expired_job_page .expired_job_content .jm-status-job-expired .icon{
    font-size: 14px;
    background: #c07474;
    padding: 7px 20px;
    margin-right: 15px;
    border-radius: 18px;
    white-space: nowrap;
    width: 117px;
    max-width: 90%;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: normal;
    color: #fff;
}

.jbd_sidebar_wrap {
    width: 400px;
    background-color: #ffffff;
    border-radius: 0 10px 10px 0;
    overflow: hidden;
}

.job-detail-page .follow_company{
    margin: 30px auto;
}

.job-detail-page .company-title{
    max-width: 90%;
    display: block;
    line-height: normal;
}

.job-social {
    padding: 2.14285714em;
    background: #ebeeef;
    margin-bottom: 30px;
}

.job-social .noo-social-title {
    font-family: 'Montserrat', sans-serif;
    display: block;
    font-weight: 600;
}

.job-social .noo-icon {
    background-color: #d3dcdf;
    width: 35px;
    height: 35px;
    display: inline-block;
    line-height: 35px;
    text-align: center;
    border-radius: 50%;
    margin-right: 5px;
    margin: 1.07142857em 5px 0 0;
}

#company-desc .company-header .company-info-style2 a.noo-icon.fa-link {
    background: #d34836;
}

#company-desc .company-header .company-info-style2 a.noo-icon.fa-facebook,
#company-desc .company-header .company-info-style2 a.noo-icon.fa-facebook-f {
    background: #5873b1;
}

#company-desc .company-header .company-info-style2 a.noo-icon.fa-twitter {
    background: #4099FF;
}

#company-desc .company-header .company-info-style2 a.noo-icon.fa-linkedin {
    background: #4875B4;
}

#company-desc .company-header .company-info-style2 a.noo-icon.fa-instagram {
    background: #517fa4;
}

.noo-icon {
    background-color: #d3dcdf;
    width: 35px;
    height: 35px;
    display: inline-block;
    line-height: 35px;
    text-align: center;
    border-radius: 50%;
    margin-right: 5px;
    margin: 1.07142857em 5px 0 0;
}

#company-desc{
    padding: 0 20px;
}
#company-desc .company-header .company-info-style2  a.noo-icon {
    width: 25px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    color: white;
    border-radius: 0;
    margin: 0 0 5px 0;
}

.job-detail-page .jbd_company_info{
    padding: 20px;
}

.job-detail-page .jbd_company_info i,
.job_more_info i{
    color: #ff7a18;
    border: 1px dashed #ff7a18;
    padding: 7px 8px;
    border-radius: 40px;
}

.job_wrapper ul li{
    font-size: 18px;
    line-height: 1.77778rem;
    list-style-type: disc;
    list-style-position: inside;
}

.job_wrapper .job_more_info ul li{
    list-style-type:none
}

.employment_benefits ul li::marker,
.job_wrapper ul li::marker {
    color: #ff7a18;
}

.jbdr h3{
    font-size: 2.14285714em;
    font-weight: 600;
    line-height: 1.2;
    padding: 20px 0;
}

/* ------------------------------
ADS CSS
--------------------------------*/
.horizontal_ad{
    max-width: 1200px;
    max-width: 90%;
    margin: 0 auto;
}
.horizontal_ad img{
    width: 100%;
    max-width: 100%;
    /* height: 225px; */
    height: 110px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
}


/* =========================
VERTICAL AD SLIDER CSS
========================= */

/* Slider container */
.vertical-ad-slider {
    position: relative;
    overflow: hidden;  /* hide overflowing slides */
    width: 100%;
}

/* Slides wrapper: flex container for sliding */
.slides-wrapper {
    display: flex; /* horizontal row of slides */
    transition: transform 0.6s ease-in-out;  /* smooth slide animation */
    width: 100%;
}

/* Each slide */
.ad-slide {
    min-width: 100%;    /* occupy full container width */
    flex-shrink: 0;     /* prevent shrinking */
}

/* Slide images */
.ad-slide img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 5px; /* optional */
}

/* Navigation buttons container */
.ad_slider_btns {
    z-index: 5;
    pointer-events: none; /* allows clicks only on buttons */
}

/* Buttons */
.ad_slider_btns button {
    pointer-events: auto; /* enable clicks */
    background: #ff7a18;
    color: #fff;
    border: none;
    padding: 0 7px;
    cursor: pointer;
    border-radius: 50%;
    transition: background 0.3s;
}

.hot_posts_slider_btns{
    position: absolute;
}

.ad_slider_btns button:hover {
    background: rgba(0, 0, 0, 0.7);
}

.ad-slide + .ad-slide {
    position: relative;
    margin-left: 0px; /* no gap, slides touch each other */
}

.ad-slide::before,
.promoted_job:before{
    border-top: solid 0 transparent;
    border-left: solid 50px #f5d006;
    border-bottom: solid 50px transparent;
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    z-index:1;
}

.ad-slide:after{
    content: "★";
    font-size: 18px;
    font-weight: 900;
    position: absolute;
    left: 8px;
    top: 0;
    color: #fff;
    z-index: 1;
}

.turbo::after {
    content: "";
    position: absolute;
    left: 8px;
    top: 3px;
    width: 20px;
    height: 20px;

    background-color: #F93852; /* Change icon color here */

    mask: url("/media/uploads/2026/images/icons/svgs/turbo.svg") no-repeat center;
    mask-size: contain;
    -webkit-mask: url("/media/uploads/2026/images/icons/svgs/turbo.svg") no-repeat center;
    -webkit-mask-size: contain;
    z-index: 1;
}

.promoted_job.premium-badge:after{
    content: '';
    position: absolute;
    left: 8px;
        top: 3px;
    width: 21px;
    height: 20px;
    background: #000000;

    mask: url("data:image/svg+xml;utf8,<svg viewBox='0 0 21 20' xmlns='http://www.w3.org/2000/svg'><path fill='black' d='M17.0273 8.24533C17.0273 12.8116 13.4251 16.5123 8.97534 16.5123C4.5256 16.5123 0.923431 12.8116 0.923431 8.24533C0.923431 3.67902 4.5256 0 8.97534 0C13.4251 0 17.0273 3.67902 17.0273 8.24533ZM0.859863 19.0227L4.3349 18.1354L5.45793 21.6413L7.78874 17.313C5.94528 17.0533 4.29252 16.231 2.99998 15.019L0.859863 19.0227ZM14.9507 15.019C13.637 16.231 11.9842 17.0533 10.1619 17.313L12.4928 21.6413L13.6158 18.1354L17.0908 19.0227L14.9507 15.019Z'/></svg>") no-repeat center;
    
    -webkit-mask: url("data:image/svg+xml;utf8,<svg viewBox='0 0 21 20' xmlns='http://www.w3.org/2000/svg'><path fill='black' d='M17.0273 8.24533C17.0273 12.8116 13.4251 16.5123 8.97534 16.5123C4.5256 16.5123 0.923431 12.8116 0.923431 8.24533C0.923431 3.67902 4.5256 0 8.97534 0C13.4251 0 17.0273 3.67902 17.0273 8.24533ZM0.859863 19.0227L4.3349 18.1354L5.45793 21.6413L7.78874 17.313C5.94528 17.0533 4.29252 16.231 2.99998 15.019L0.859863 19.0227ZM14.9507 15.019C13.637 16.231 11.9842 17.0533 10.1619 17.313L12.4928 21.6413L13.6158 18.1354L17.0908 19.0227L14.9507 15.019Z'/></svg>") no-repeat center;
    mask-size: contain;
    -webkit-mask-size: contain;
    z-index: 1;
}

.ajw_content .apply_btn,
.ajw_content .btn_default{
    padding: 10px 15px;
    color: #fff;
    font-weight: 800;
    background-color: #FF7A18;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
}

.ajw_content .btn_default{
    padding: 10px 15px;
    background-color: #3E5DB7;
}

@media (max-width: 991px) {
    .vertical-ad-slider {
        width: 100%;
    }

    .ad_slide img {
        height: auto;
    }

}


/* --------------------------
PAGINATIONS
----------------------------*/
/* PAGINATION WRAPPER */
.job_list_page .pagination-wrapper {
    display: flex;
    justify-content: center;
    margin: 40px 0;
}

.job_list_page .pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.job_list_page .page-item {
    display: inline-block;
}

.job_list_page .page-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    height: 42px;
    padding: 0 14px;

    font-size: 14px;
    font-weight: 600;
    text-decoration: none;

    color: #374151;
    background: #ffffff;

    border: 1px solid #e5e7eb;
    border-radius: 8px;

    transition: all 0.25s ease;
}

.job_list_page .page-link:hover {
    background: #f3f4f6;
    border-color: #d1d5db;
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}

.job_list_page .page-item.active .page-link {
    background: #2563eb;
    border-color: #2563eb;
    color: white;
    box-shadow: 0 6px 14px rgba(37, 99, 235, 0.3);
}

.job_list_page .page-item.disabled .page-link {
    color: #9ca3af;
    background: #f9fafb;
    border-color: #e5e7eb;
    cursor: not-allowed;
    pointer-events: none;
}

.job_list_page .page-link:contains("Previous"),
.job_list_page .page-link:contains("Next") {
    padding: 0 16px;
}


/* -----------------------
JOB APPLICATION MODAL FORM
------------------------- */
.custom-modal{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    inset:0;
    display: flex;
    justify-content: center;
    align-items: center;

    background: rgba(0,0,0,.45);
    z-index: 1050;
    display:none;
}

.custom-modal.active{
    display:flex;
}

.custom-modal .modal-backdrop{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.55);
}

#applyModal .modal_dialog{
    width: 650px;
    max-width: 95%;
    position:relative;
    z-index:2;
    animation: modalFade 1s ease;
    -webkit-animation: modalFade 1s ease;
}

#applyModal .modal_dialog .modal_content{
    width: 100%;
    max-width: 95%;
    max-height: 90vh;
    overflow: auto;
    position: relative;
    background-color:#fff;
    display: flex;
    flex-direction: column;
    border-radius: 8px;
    margin: 0 auto;
}

.modal-body {
    position: relative;
    padding: 30px;
    overflow: auto;
}

.apply_job_wrapper .modal_header{
    padding:12px 18px;
    background-color:#ebeeef;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.modal-close{
    border:none;
    background:none;
    font-size:20px;
    cursor:pointer;
}

.apply_job_wrapper .modal_header h5 {
    font-size: 21px;
}

.apply_job_wrapper .modal_header svg {
    stroke: #be3232;
    cursor: pointer;
}

.apply_job_wrapper .input-group{
    margin:15px 0;
    display:flex;
    flex-direction:column;
}

/* .apply_job_wrapper .input-group label{
    margin-bottom:6px;
    font-weight:500;
} */

.apply_job_wrapper .input-group input,
.apply_job_wrapper .input-group textarea{
    width:100%;
    padding: 15px;
}

.apply_job_wrapper form label{
    color: #5e5858;
    margin-bottom: 5px;
}

.apply_job_wrapper form svg{
    stroke: #5e585870;
}

.apply_job_wrapper form ::placeholder{
    color: #4caf50;
    /* color: #ff7a18; */
    font-style: italic;
}

.apply_job_wrapper .btn_primary.btn_success{
    margin: 20px auto;
    display: block;
}
/* --------
UPLOAD FILE
---------- */

#resumeInput{display:none}

.upload-area{
    border:2px dashed #cfd4da;
    border-radius:8px;
    padding:30px;
    text-align:center;
    transition:.2s;
    cursor:pointer;
}

.upload-area:hover{
    border-color:#4caf50;
    background:#fafafa;
}

.upload-area.dragover{
    border-color:#4caf50;
    background:#f3fff6;
}

.upload-content svg{
    margin-bottom:10px;
    color:#777;
}

.upload-btn{
    margin-top:10px;
    padding:8px 16px;
    border:none;
    border-radius:6px;
    background:#4caf50;
    color:#fff;
    cursor:pointer;
}

.file-preview{
    margin-top:10px;
    font-size:14px;
    color:#333;
}


@keyframes modalFade{
    from{
        opacity:0;
        transform:translateY(-20px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}
/* #applyModal{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    background-color: #fff;
    z-index: 10;
    overflow: auto;
}

#applyModal .modal_dialog{
    position: relative;
    background-color: #404040;
    overflow: auto;
    z-index: 1;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 650px;
}

#applyModal .modal_dialog .modal_content{
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color: #fff;
    width: 650px;
    max-width: 90%;
    margin: 30px auto;
    border-radius: 4px;
}

.apply_job_wrapper .modal_header{
    padding: 5px 15px;
    background-color: #ebeeef;
}
#applyModal .modal_dialog .modal_content #applyForm{
    padding: 20px;
}

.apply_job_wrapper .modal_header h5{
    font-size: 21px
}

.apply_job_wrapper .modal_header svg{
    stroke:#be3232;
    cursor: pointer;
}

.apply_job_wrapper .input-group{
    margin: 20px 0;
}

.apply_job_wrapper .input-group input,
.apply_job_wrapper .input-group textarea{
    width:100%
} */


/* RTL Language Support (Arabic) */
[dir="rtl"] .apply-form label{
    text-align:right;
}

[dir="rtl"] .apply-form input,
[dir="rtl"] .apply-form textarea{
    text-align:right;
}

.apply-loading{
    opacity:.6;
    pointer-events:none;
}





/* -------------------------
MEDIA QUERIES
-------------------------- */

@media (max-width: 900px){
    .jbd_container_boxed > div > .row{
        flex-flow: column;
    }
}
@media (min-width: 1200px) {
    .jbd_container_boxed {
        width: 97%;
    }
}


@media (max-width: 645px){
    .jbd_header{
        padding: 20px 0 0 0;
        margin-bottom: 0;
    }
    

    .page_sub_heading_info{
        position:relative;
        top: 0;
        left:0;
        margin-top: 30px;
        padding: 20px;
    }
}

@media (max-width: 500px){
    .page_sub_heading_info{
        flex-flow: column;
        justify-content: center;
        align-items: center;
    }

    .jbd_sidebar_wrap{
        width:100%
    }
}

/* TEST */