:root{
    /* color */
    --color-blue-dark: #0070AD;
    --color-blue-light: #12ABDB;

    --font-1:'Ubuntu', sans-serif;
}


/**************************************************/


.case{
    border: black dashed 1px;
    padding: 10px;
}

/* -----------------------------------------------------------------------------------------------  menu */
.image-radio {
    position: relative;
    cursor: pointer;
}

.image-radio input[type="radio"] {
    display: none;
}

.image-radio img {
    border: 2px solid transparent;
    border-radius: 5px;
    transition: border-color 0.3s;
}

/* Bordure bleue pour l'option sélectionnée */
.image-radio input[type="radio"]:checked + img {
    border-color: var(--color-blue-light);
}

/* 🌟 Changement d’image au hover */
.image-radio.colombia img {
    content: url("assets/pictures/icons/es.gif"); /* Image par défaut */
}

.image-radio.colombia:hover img {
    content: url("assets/pictures/icons/co.gif"); /* Image au survol */
}



.separator{
    border-bottom: var(--color-blue-light) 1px solid;
    width: 75%;
    margin: 10px 12.5%;
}

body {
    font-family: var(--font-1);
    font-size: 12px;
}

.nom {
    font-weight: bold;
    margin-bottom: 5px;
}
.niveau {
    display: flex;
    gap: 3px;
}
.circle {
    position: relative;
    top: 5px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: var(--color-blue-light) solid 2px;
}
.filled {
    background: var(--color-blue-light);
}

.category-title::first-letter {
    font-size: larger;
}
.category-title {
    background-color: var(--color-blue-dark);
    color: white;
    padding: 5px 20px;
    font-size: 17px;
    font-weight: bold;
    text-transform: uppercase;
}

#TRG{
    margin-top: 4px;
    color: var(--color-blue-dark);
    font-size: 20px;
}

#SKILLS, #SOFTSKILLS, #LANGUAGES,#DIPLOMASLIST, #CERTIFLIST{
    padding:10px;
}

.head-container{
    text-align: center;
}

.logo{
    padding: 25px 50px;

}

.left{
 width:50%;
 min-width: 50vw;
 border-radius: 0px 50px 50px 0px;
}

.right{
    position: relative;
    left: 0%;
    transform-origin: left;
    width: 100%;
    min-width: 30vw;
    border-radius: 50px 0px 0px 50px;
   }

ul {
    list-style-type: disc; /* Vous pouvez changer ce style si nécessaire */
}

ul li::marker {
    color: var(--color-blue-light); /* Change uniquement la couleur de la puce */
}

.tasks ul{
    list-style-type: none; /* Vous pouvez changer ce style si nécessaire */
}


#LANGUAGES{
position: relative;
left: 25px;
}
#CERTIFLIST{
    position: relative;
    left: 57px;
    }

.container-lang{
position: absolute;
padding: 5px 10px 15px 5px;
background-color: var(--color-blue-dark);
border-radius: 0 0 50px 0;
}

.focus{
    color: var(--color-blue-light);
    font-weight: bold;
}
.highfocus{
    color: var(--color-blue-light);
    font-weight: bold;
    font-size: larger;
    text-transform: uppercase;
}
.darkfocus{
    color: var(--color-blue-dark);
    font-weight: bold;
}

.whitefocus{
    color: white;
    border-radius: 50px 10px 50px 50px / 50px 50px 50px 50px;
    background-color: var(--color-blue-light);
    padding: 2px 10px;
    width: fit-content;
    font-size: 12px;
}

.redfocus{
    color: white ;
    background-color: red;
    padding: 2px 10px;
    border-radius: 50px;
    font-weight: bold;
    font-size: 16px;
    text-transform: uppercase;
}

.redfocus::first-letter {
    font-size: larger;
}

.smallfocus{
    color: var(--color-blue-light);
}
.darksmallfocus{
    color: var(--color-blue-dark);
}
#XPPRO{
    font-size: 12px;
}

#WORDS{
    color: var(--color-blue-dark);
    text-transform: capitalize;
}

#BESTPOSITION{
    font-size: 14;
    left: 5%;
    position: relative;
    padding: 5% 15% 0% 15%;
    width: 95%;
    height:fit-content;
    background-color: var(--color-blue-dark);
    border-radius:75% 50% 25% 0% / 40% 10% 0% 0%;
}

#BESTPOSITION ul li::marker {
    color: red; 
}

#EXPERIENCE{
    margin-top: 5px;
}
#XPPRO{
    margin-bottom: 5px;
}
#T-BP{
    color: white;
    font-size: 16px;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    text-decoration: underline white 1px solid;
    padding-bottom: 15px;
}


.best-position{
    margin: 0px;
}

#T-BP::first-letter {
    font-size: larger;
}
.positions-title{
    position: relative;
    top: 50%;
}

.position-header, .position-tasks{
    color: white;
    margin: 0px;
    padding: 0px;
}

.competence-name{
    font-size: 14px;
    break-inside: avoid;
}

.card-enterprise{
    margin: 50px;
}

.colombia, .fr, .en {
    width: 16px;
    height: 11px;
    background-size: cover;
    display: inline-block;
}

.fr {
    background-image: url("https://arnaudlemascon.fr/assets/pictures/icons/fr.gif");
}
.en {
    background-image: url("https://arnaudlemascon.fr/assets/pictures/icons/gb.gif");
}
.colombia {
    background-image: url("https://arnaudlemascon.fr/assets/pictures/icons/es.gif");
}

.colombia:hover {
    background-image: url("https://arnaudlemascon.fr/assets/pictures/icons/co.gif");
}


.diplomadesc{
    font-size: 12px;
}





@media print {
    .container-lang {
        display: none;
    }
@media print {
  .page1-container {
    display: flex;
    flex-direction: column;
    min-height: 297mm; /* hauteur d'une page A4 */
    page-break-after: always; /* pour que page 1 s'arrête là */
  }

  #BESTPOSITION {
    margin-top: auto; /* pousse vers le bas du conteneur */
    background-color: var(--color-blue-dark);
    color: white;
    border-radius: 75% 50% 25% 0% / 40% 10% 0% 0%;
    padding: 5% 15% 0% 15%;
    bottom: -2px;
  }

  #T-POSITIONS {
    page-break-before: always; /* commence bien à la page 2 */
  }
}


    .card-enterprise{
        break-inside: avoid;
    }

    @page:first {
        margin: 0;
    }

    @page {
        size: A4; /* Peut être A3, A4, Letter, etc. */
        margin: 15mm 0mm; /* Ajustez les marges */
    }

    * {
        -webkit-print-color-adjust: exact; /* Safari et Chrome */
        print-color-adjust: exact; /* Standard */
      }

}