/*
Theme Name: Hello Elementor Child
Template: hello-elementor
Description: Thème enfant de Hello Elementor pour Le Comptoir Des Langues
Author: Lk-interactive
Version: 1.0
*/
/* 
*********************** GENERAL *************************
*/

/* SPAN TITRE -- COULEUR */

.titre_vert span {
  color: #8fd8b6;
}
.titre_orange span {
  color: #ff6e3b;
}
.titre_violet span {
  color: #5760cc;
}
.titre_bleu_nuit span {
  color: #283244;
}
.titre_jaune span {
  color: #f7c027;
}
.titre_jaune2 span {
  color: #EDA644
}
.titre_bleu span {
  color: #5989c5;
}

/* 
*********************** HEADER *************************
*/

/* MENU BANDEAU DESKTOP */

.liste_bandeau_desktop ul li:last-child {
  padding-left: 20px;
}

.liste_bandeau_desktop ul li a:hover,
.liste_bandeau_desktop ul li a:focus {
  text-decoration: underline;
  text-decoration-color: white;
}

/* MENU DESKTOP -- sous-menu Autres langues & Autres formations */

.menu_desktop_lk nav ul li a:hover,
.menu_desktop_lk nav ul li a:focus {
  background-color: #283244;
}

/* Apparition images -- sous menu Anglais*/

.bloc_image_sous_menu_lk div img {
  transition:
    opacity 0.3s ease,
    transform 0.3s ease;
}

.bloc_image_sous_menu_lk.e-active div img {
  animation: fadeInSlide 0.3s ease forwards;
}

@keyframes fadeInSlide {
  from {
    opacity: 0;
    transform: translateX(10px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* MENU MOBILE */
@media screen and (max-width: 500px) {
  #bloc_menu_lk {
    background-color: #ffffff00;
  }
}

#menu_mobile_lk nav ul li a {
  border-radius: 0px 50px 50px 0px;
}
#menu_mobile_lk nav ul li a span.sub-arrow {
  padding-left: 5px;
}
#menu_mobile_lk nav ul li a span svg.e-font-icon-svg {
  width: 10px;
  height: 10px;
}
#menu_mobile_lk nav ul li a:hover {
  background-color: #5760cc;
}
#menu_mobile_lk nav ul li .elementor-item.elementor-item-active {
  background-color: #283244;
} 
#menu_mobile_lk nav ul li ul li a {
  background-color: #5760cc;
  border-radius: 50px;
  margin-bottom: 10px;
  margin-left: 10px;
  width: 140%;
}
#menu_mobile_lk nav ul li ul li a:hover{
  background-color: #283244;
}

#menu_mobile_lk nav ul li ul li a.elementor-sub-item.elementor-item-active{
  background-color: #283244;
} 

#menu_mobile_lk .menu_anglais_mobile_lk a::after{
  content:"";
  width: 10px;
  height: 10px;
  position: relative;
  left: 0;
  top: 0;
  margin-left: 5px;
  background-image: url("/wp-content/uploads/2026/02/chevron.svg");
  transform: rotate(-90deg);
  opacity: 1;
  background-color: #ffffff00;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 10px;
}
@media screen and (max-width: 500px) {
  .menu_onglet_anglais_mobile_lk .e-n-tabs-heading{
    width: 50%;
  }
}


/* 
*** ******************** FOOTER *************************
*/

.liste_footer_lk ul li a span:hover,
.copyright_lk a:hover,
.lien_tel_footer_lk a:hover {
  text-decoration: underline;
}

/* 
*** ******************** HOME *************************
*/

/* BLOC FORMEZ-VOUS */

/* lien avis google */
.lien_avis_google_lk a {
  color: #283244;
  text-decoration: underline;
}
.lien_avis_google_lk a:hover {
  color: #000;
}

/* txt flottant */
.txt_flottant_lk {
  animation: txtFlottant 4s linear infinite;
}
.txt_flottant_lk1 {
  animation: txtFlottant 8s linear infinite;
}
.txt_flottant_lk2 {
  animation: txtFlottant 12s linear infinite;
}

@keyframes txtFlottant {
  0% {
    transform: rotate(0deg) translateX(5px) rotate(0deg);
  }
  to {
    transform: rotate(1turn) translateX(5px) rotate(-1turn);
  }
}

/* BLOC CHOIX LANGUES */

.btn_decrouvrir_lk a span.elementor-button-icon,
.btn_decrouvrir_lk .elementor-icon {
  transition: transform 0.3s ease;
}
.bloc_grid_lk:hover {
  cursor: pointer;
  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
}
.bloc_grid_lk:hover
  + .bloc_txt_drapeaux_langues_lk
  .btn_decrouvrir_lk
  a
  span.elementor-button-icon {
  transform: rotate(48deg);
}
.btn_decrouvrir_lk:hover a span.elementor-button-icon {
  transform: rotate(48deg);
}
.bloc_grid_lk:hover .btn_decrouvrir_lk .elementor-icon {
  transform: rotate(40deg);
}
.bloc_grid_lk:hover .btn_decrouvrir_lk a span.elementor-button-icon {
  transform: rotate(48deg);
}


/*
*** PAGES SERVICES -- ANGLAIS ************************************
*/

/* ONGLETS MODULE  */

#lk-product-tabs .swiper {
  margin-top: 100px;
}

@media (min-width: 1024px) {
  #lk-product-tabs .elementor-swiper-button {
    display: none;
  }
}

#lk-product-tabs .swiper-pagination {
  display: flex;
  justify-content: space-between;
  width: 100%;
  height: 75px;
  background-color: #f6f0e9;
  z-index: 13;
  padding: 10px;
}
@media (min-width: 1024px) {
  #lk-product-tabs .swiper-pagination {
    border-radius: 30px;
  }
}

#lk-product-tabs .swiper-pagination-bullet {
  padding: 24px;
  width: auto;
  height: 55px;
  border-radius: 20px;
  background: transparent;
  border: 1px solid transparent;
  opacity: 1;
  font-size: 16px;
  font-family: "Bricolage Grotesque", Sans-serif;
  transition: all 0.3s ease;
}
/* Couleur orange */
#lk-product-tabs .swiper-pagination-bullet:hover {
  color: #fff;
  background-color: #ff6e3b;
}
#lk-product-tabs .swiper-pagination-bullet-active {
  background-color: #ff6e3b;
  border-color: #ff6e3b;
  color: #fff;
}
/* Couleur violet */
#lk-product-tabs.onglets_violet .swiper-pagination-bullet:hover {
  color: #fff;
  background-color: #5760cc;
}
#lk-product-tabs.onglets_violet .swiper-pagination-bullet-active {
  background-color: #5760cc;
  border-color: #5760cc;
  color: #fff;
}




@media (max-width: 1023px) {
  #lk-product-tabs
    .swiper-pagination-bullet:not(.swiper-pagination-bullet-active) {
    display: none;
  }
  #lk-product-tabs .swiper-pagination {
    display: none;
  }
  #lk-product-tabs .swiper-pagination-bullet {
    display: none;
  }
}

/* ANIMATION PROGRESSION AUTOUR IMAGE-- 6 étapes clés */

/* Conteneur SVG */
.container_prog_lk .container-progress-ring {
  pointer-events: none;
}

/* SVG */
.container_prog_lk .progress-ring {
  width: 100%;
  height: 100%;
  transform: rotate(-110deg);
  transform-origin: 50% 50%;
}

/* Cercle */
.container_prog_lk .progress-ring__circle {
  fill: transparent;
  stroke: #5760cc;
  stroke-width: 4;
  stroke-linecap: round;
  width: 241px;
  height: 241px;
  stroke-dasharray: 565;
  stroke-dashoffset: 565;
  transition: stroke-dashoffset 1.8s ease-out;
}

/*
*** PAGES CONTACTEZ-NOUS ************************************
*/

/* Marge CTA Envoyer */
.form_lk .e-form__buttons{
  margin-top: 20px;
}

/* Couleur lien politique de confidentialité */
.form_lk .elementor-field-group-accept a{
  color : #fff;
  text-decoration: underline;
}

.form_lk .elementor-field-group-accept a:hover{
  color : #5760cc
}

/* Style icone chevron pour les champs select */
.form_lk .elementor-field-type-select .select-caret-down-wrapper{
  display:none;
}
.form_lk .elementor-field-type-select .elementor-select-wrapper:after{
  content:"";
  background-image: url("/wp-content/uploads/2026/02/chevron.svg");
  width: 12px;
  height : 12px;
  position: absolute;
  right: 10px;
  top: 17px;
}

/* Style icone politique de confidentialité  */

.form_lk .elementor-field-group-accept input{
  display:none !important;
}
.form_lk .elementor-field-group-accept label:before {
  content: "";
    display: inline-block;
    margin-right: 10px;
    width: 15px;
    height: 15px;
    border: 1px solid #fff;
    background-color: transparent;
}
.form_lk .elementor-field-type-acceptance .elementor-acceptance-field:checked + label{
  cursor:pointer;
}
.form_lk .elementor-field-type-acceptance .elementor-acceptance-field:checked + label::after {
    content: "\2714";
    position: absolute;
    top: 3px;
    left: 12px;
    color: #fff;
    font-size: 18px;

}

/*
*** PAGES SOFT SKILLS ************************************
*/

.bloc_contenu_lk {
  opacity: 0;
  overflow: hidden;
  min-height: 694px;
  transition: all 0.4s ease;
}

.bloc_contenu_lk.open {
  opacity: 1;
  min-height: 694px;
}

.bloc_contenu_lk.close {
  opacity: 0;
  z-index:-1;
}

/*
*** CTA BACK TO TOP ************************************
*/

#wpfront-scroll-top-container img{
  padding: 15px;
  border: 2px solid #5760cc;
  fill: #5760cc;
  border-radius: 50%;
  transform: rotate(180deg);
}

#wpfront-scroll-top-container img:hover{
  border-color: rgba(87, 97, 204, 0.7);
  fill: rgba(87, 97, 204, 0.7);
}