
.job-card {
    background-color: var(--three-1);
    border-radius: 20px;
    border: 1px solid var(--three-1);
    padding: 20px;
    width: auto;
    color: #333333;
}
.job-card:hover{
    /*  border: 1px solid var(--three-2); */
}
.job-card h2 {
    font-size: 18px;
    margin-bottom: 10px;
}
.job-card .recruiter {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}
.job-card .recruiter img {
    border-radius: 20px;
    width: 40px;
    height: 40px;
    margin-right: 10px;
}
.job-card .recruiter .name {
    font-weight: bold;
}

.job-card .tags {
    display: flex;
    gap: 5px;
    margin-bottom: 15px;
    align-items: center; /* Aligne les items au centre verticalement */
    flex-wrap: wrap; /* Permet aux éléments de passer à la ligne suivante si nécessaire */

}
.job-card .tags span {
    background-color: var(--one-1);
    border-radius: 69px;
    padding: 4px 7px;
    font-size: 12px;
}
.tags {
    display: flex;
    gap: 10px; /* Espace entre les colonnes */
    align-items: center;
    justify-content: space-between;
}

.job-card .tags{
    justify-content: flex-start;
}

.tags span {
    display: flex;
    align-items: center;
    gap: 5px; /* Espace entre l'icône et le texte */
}

.icon-category img {
    filter: grayscale(100%);
    width:24px;
    height: 24px;
}

.icon-category img,
.icon-jobtype i,
.icon-location i {
    line-height: 18px;
    color:var(--five-5);
    font-size: 18px;
    display: inline-block;
}
.n-detail-transparent .n-single-meta-2 ul li{
    margin-bottom:0;
}

.job-card .apply-button {
    background-color: var(--four-4);
    color: #ffffff;
    text-align: center;
    padding: 10px;
    border-radius: 69px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s;
}
.job-card .apply-button:hover {
    background-color: var(--four-5);
}
.job-card .apply-button a{
    color:var(--one-1);
}
.job-card .footer {
    display: flex;
    justify-content: space-between;
    margin-top: 15px;
    font-size: 12px;
    color: #999999;
}
.job-card .footer .deadline {
    display: flex;
    align-items: center;
    gap: 5px;
}

.job-card .footer .deadline::before {
    content: '⚠️';
}

.n-featured-jobs .n-featured-job-boxes .n-job-single{
    box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px !important;
    border:2px solid transparent;
    display: flex;
    align-items: center;
    background: #fff;
    border-radius: 5px;
    overflow: hidden;
}
.n-featured-jobs .n-featured-job-boxes .n-job-single:hover,
.n-featured-jobs .n-featured-job-boxes .n-job-single.isjob-single-selected{
    border: 2px solid var(--main-color);
}



.n-featured-jobs .n-featured-job-boxes .n-job-single .n-job-detail{
    border-left:0 !important;
}
.n-search-listing.n-featured-jobs.featured .n-job-single,
.n-featured-jobs .n-featured-job-boxes .n-job-single .n-job-detail{
    box-shadow: none !important;
}
.n-single-job.n-detail-transparent .n-single-job-company,
.n-single-job.n-detail-transparent .n-single-detail,
.n-job-tags,
.n-single-meta-2,
.jobs-alert-box,
.n-skills,
.new-sidebar,
.app-deadline{
    /*  box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px !important; */
    border-radius: 10px;
}

.n-featured-jobs .n-featured-job-boxes .n-job-single .n-job-img{
    padding:0px !important;
    padding-left:20px !important;
}


.job_post-template-default .n-single-job.light-grey.n-detail-transparent{
    padding-bottom:50px;
}

#breadcrumbs span{
    color:#3D3D3D;
    font-weight: 300 !important;
}
#breadcrumbs a{
    font-weight: 400 !important;

}

.design_custom_job_wrap{
    background-color: var(--one-1) !important;
    border: 0 !important;
    box-shadow: none !important;
}

.n-single-job.n-detail-transparent,
.n-detail-transparent .n-single-meta-2{
    padding:0 !important;
}


.li3col{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap:0px;
}

.li3col li{
    box-sizing: border-box; /* Inclure les bordures et le padding dans la largeur totale */
    padding: 10px 20px; /* Optionnel : ajouter du padding pour l'espacement */
    width: auto !important;
    border-left:1px solid var(--one-3);
}
.li3col li:first-child{
    border-left:0;
    padding-left:0;
}

.li3col li div{
    text-align: left; /* Centrer le contenu à l'intérieur de chaque <li> */
}

.li3col li small{
    color:var(--five-3);
    font-size:14px !important;
}

.li3col li strong{
    color:var(--five-5);
    font-size:16px !important;
}
.n-job-pages-section{
    padding-bottom:0;
}
.icon_svg_rightUp{
    height:10px;
    width: 10px;
    background: url("../img/icons/arrow-rightUp.svg");
    display: inline-block;
    background-size: cover;
}

.n-job-pages-section .n-jobpost,
.jobs-alert-box,
.n-single-job-attach,
.n-skills{
    background-color: var(--one-1) !important;
    border: 2px solid var(--one-3) !important;
    box-shadow: none !important;
    border-radius: 20px !important;
}

.n-job-pages-section .n-jobpost{
    margin-top:0;
}

.n-job-pages-section .n-job-margin-less{
    margin-top:-200px;
}
.n-single-job.n-detail-transparent .n-skills{
    padding:20px;
    margin:0;

}
.n-skills-top{
    margin-top:50px;
}
.n-skills-tags a{
     background-color: #fff !important;
     border: 1px solid var(--one-2);
     color: var(--five-5);
     border-radius: 69px !important;
     padding: 4px 7px;
    font-size:14px !important;
 }
.n-skills-tags a:hover{
    color: var(--five-5);
}
.job_edit_sidebar_wrap
{
    background: #fff !important;
    border: 1px solid var(--one-2) !important;
    padding:20px;
    box-shadow: var(--box-shadow);
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
    border-bottom:0;
}
#modifyCity{
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
}
#location_for_helper{
    border-radius: 8px;
}

.n-job-pages-section-hours .n-jobpost .acf-fields{
    background: #fff !important;
    border:1px solid #ccc;
}

.n-job-pages-section .n-jobpost .acf-form-submit{
    display:none !important;
}

/* Style de base pour tout le monde */
.gov_container {
    display: flex;
    flex-direction: column;
}

.n-detail-transparent .n-single-meta-2{
    margin-bottom: 0;
}

.jobs-alert-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    background-color: #fefefe; /* Couleur de fond */
    border-radius: 8px; /* Coins arrondis */
    border: 1px solid #ececec; /* Bordure */
    margin-bottom: 0;
}

/* Assurez-vous que les colonnes utilisent toute la largeur disponible */
.jobs-alert-box .col-lg-8,
.jobs-alert-box .col-md-8,
.jobs-alert-box .col-sm-8,
.jobs-alert-box .col-xs-12 {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.jobs-alert-box .col-lg-4,
.jobs-alert-box .col-md-4,
.jobs-alert-box .col-sm-4,
.jobs-alert-box .col-xs-12 {
    display: flex;
    justify-content: flex-end;
}



/* Style spécifique pour les écrans de bureau */
@media (min-width: 1024px) {
    .gov_container {
        flex-direction: row;
    }

    .gov_code-block {
        width: 50%;
    }

    .gov_left {
        margin-right: 1%;
    }

    .gov_right {
        margin-left: 1%;
    }

    .section-job-left{
        float: left;
        width: 30%;
    }
    .section-job-right{
        float: right;
        width: 70%;
    }

}

.colJobLocHead{
    padding-top:50px;
    border-top:1px solid var(--one-2);
}


/* Job POST Update */
.section-job-loc{
    background-color: var(--one-1) !important;
    border: 2px solid var(--one-3) !important;
    box-shadow: none !important;
    border-radius: 20px !important;
    max-width: 1170px;
    margin: 0 auto;
    padding: 30px 15px;
}


.acf-basic-uploader path,.acf-basic-uploader svg{
    fill:var(--three-3);
    stroke:var(--three-3);
}

.imageUploadAcf .acf-label{
    display: none !important;
}

.inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.inputfile + label {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--three-4);
    background: var(--three-1);
    display: inline-block;
    cursor: pointer;
    padding: 3em;
    border-radius: 100%;
    border:2px solid var(--three-1);
    transition: 0.3s;
}

.inputfile + label svg {
    vertical-align: middle;
    margin-right: 0.25rem;
}

.inputfile:focus + label,
.inputfile + label:hover {
    background: var(--three-1);
    border:2px solid var(--three-2);
}

@media (min-width:769px){
    /* Nouveau CSS pour le layout en flex */
    .gov_job-post-grid {
        width: 100%;
        display: grid;
        gap: 10px;
        grid-template-columns: repeat(3, 1fr);
        grid-auto-rows: minmax(100px, auto);
        align-items: stretch; /* Assure que tous les éléments ont la même hauteur */
    }

    .gov_job-post-grid .row-image{
        grid-column: 1;
        grid-row: 1;

    }
    .gov_job-post-grid .row-map{
        grid-column: 2 / 4;
        grid-row: 1;
    }

    .colJobLoc{
        padding-right:50px;
    }
}
@media (max-width:768px){
    /* Nouveau CSS pour le layout en flex */
    .gov_job-post-grid {
        width: 100%;
        display: block;
       margin-bottom:10px;
    }

    .colJobLoc{
        margin-top:50px;
    }

    .imageUploadAcf .acf-form-submit{
        width: 100%;
        text-align: center;
    }

}


#acf-form-4 .acf-field-66681aa6b3cfa {
    padding-top:0;
    padding-left:0;
}
#acf-form-4 .acf-image-uploader{
    text-align: center;
    background: #fff;
    border-radius: 8px;
    padding: 10px;
}


.imageUploadAcf .acf-form-submit{
    margin-right:20px;
}

/* Media query pour les écrans de moins de 900px de large */
@media (max-width: 630px) {
    .acf-tab-group li{
        margin: 0;
    }
    .acf-tab-group li a{
        margin:0;
        padding: 5px 0;
        font-size: 10px;
    }
}