/*
Theme Name: Elephant Bleu Convention
Theme URI: https://www.elephant-bleu.fr
Author: Elephant Bleu
Author URI: https://www.elephant-bleu.fr
Description: Thème WordPress personnalisé pour la convention annuelle Elephant Bleu 2025
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: eb-convention
*/

/* Variables globales */
:root {
  --color-1: #f49400;
  --color-2: #00558a;
  --color-3: #00b6ec;
  --color-4: #182946;
  --color-5: #1e3868;
  --color-6: #fcdfb2b3;
  --box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.15);
  --font-1: "Jost", sans-serif;
  --font-2: "Nothing You Could Do", cursive;
}

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

.font-nothing{
 font-family: var(--font-2) !important;
}

/* Reset WordPress */
.wp-block {
  max-width: 100%;
}

.container {
  max-width: 1240px;
}

.btn-user:before {
  content: url(assets/img/user.svg);
  display: inline-block;
  margin-right: 5px;
}

.link-9 {
  transition: 0.4s;
  position: relative;
  font-weight: 400;
}

nav .link-9 {
  color: var(--color-5);
}

.current-menu-item .link-9 {
  font-weight: 500;
}

.link-9::before {
  content: "";
  position: absolute;
  width: 0;
  height: 2px;
  background-color: var(--color-1);
  bottom: -10px;
  left: 0;
  transition: width 0.4s;
}
.link-9:hover::before,
.current-menu-item .link-9::before {
  width: 100%;
}

/*@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
*/

section:last-of-type:after {
  content: "";
  width: 100%;
  background-image: url(assets/img/bg-footer.svg);
  background-size: cover;
  background-position: -60px 10px;
  background-repeat: no-repeat;
  height: 670px;
  display: inline-block;
  margin-bottom: -10px;
}

/* Navigation */
#mainNav {
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

#mainNav.fixed {
  margin: 1rem auto;
}

/* Menu mobile */
#mobileMenu {
  transition: max-height 0.3s ease-in-out, padding 0.3s ease-in-out,
    opacity 0.3s ease-in-out;
}

/* Icônes du menu */
#hamburgerIcon,
#closeIcon {
  transition: opacity 0.3s ease-in-out;
}

.apple.btn-arrow:before {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25' fill='none'%3E%3Cg clip-path='url(%23clip0_88_79)'%3E%3Cpath d='M12.022 2.91211C12.23 2.10653 12.7 1.39299 13.358 0.883822C14.016 0.374656 14.8247 0.0987759 15.6567 0.0996113H15.7505C15.9494 0.0996113 16.1401 0.178629 16.2808 0.319281C16.4214 0.459933 16.5005 0.650699 16.5005 0.849611C16.5005 1.04852 16.4214 1.23929 16.2808 1.37994C16.1401 1.52059 15.9494 1.59961 15.7505 1.59961H15.6567C15.1579 1.59957 14.6731 1.76531 14.2787 2.07077C13.8844 2.37623 13.6027 2.8041 13.478 3.28711C13.4282 3.47981 13.304 3.64486 13.1326 3.74595C12.9611 3.84704 12.7566 3.8759 12.5639 3.82617C12.3712 3.77645 12.2061 3.65221 12.1051 3.48079C12.004 3.30937 11.9751 3.10481 12.0248 2.91211H12.022ZM20.9348 15.9987C20.8786 15.8701 20.7877 15.7598 20.6723 15.6799C19.0814 14.5868 18.7505 12.7221 18.7505 11.3496C18.7505 9.69305 20.0133 8.25024 20.7661 7.5368C20.8401 7.46671 20.8991 7.38226 20.9394 7.28861C20.9797 7.19496 21.0005 7.09407 21.0005 6.99211C21.0005 6.89015 20.9797 6.78927 20.9394 6.69561C20.8991 6.60196 20.8401 6.51751 20.7661 6.44742C19.5773 5.32524 17.6086 4.59961 15.7505 4.59961C14.4157 4.6008 13.1111 4.99644 12.0005 5.7368C10.7049 4.86807 9.1472 4.47793 7.59516 4.63346C6.04311 4.78899 4.59377 5.48047 3.49639 6.58899C2.84036 7.25873 2.32563 8.05348 1.98275 8.92604C1.63988 9.7986 1.47587 10.7312 1.50045 11.6684C1.53726 13.2502 1.889 14.8089 2.53513 16.2533C3.18126 17.6977 4.10882 18.9988 5.26358 20.0805C5.95902 20.7376 6.88028 21.1024 7.83702 21.0996H16.057C16.5685 21.1006 17.0747 20.9965 17.5443 20.7938C18.0139 20.5911 18.4369 20.2941 18.787 19.9212C19.4356 19.2232 19.9966 18.4487 20.4576 17.6149C21.1158 16.4121 21.0314 16.2246 20.9348 15.9987Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_88_79'%3E%3Crect width='24' height='24' fill='white' transform='translate(0 0.0996094)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
  margin-right: 4px;
  transform: translateY(4px);
}

.google.btn-arrow:before {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25' fill='none'%3E%3Cpath d='M22.4832 10.8038L6.75003 1.80188C6.52067 1.66813 6.25992 1.59766 5.99441 1.59766C5.7289 1.59766 5.46815 1.66813 5.23878 1.80188C5.01281 1.93146 4.82532 2.11875 4.69552 2.34459C4.56571 2.57043 4.49825 2.82671 4.50003 3.08719V21.1116C4.49929 21.3718 4.56764 21.6275 4.69809 21.8527C4.82854 22.0779 5.01642 22.2644 5.24253 22.3931C5.4719 22.5269 5.73265 22.5974 5.99816 22.5974C6.26367 22.5974 6.52442 22.5269 6.75378 22.3931L22.4832 13.3931C22.7155 13.2658 22.9093 13.0783 23.0443 12.8504C23.1792 12.6225 23.2505 12.3624 23.2505 12.0975C23.2505 11.8326 23.1792 11.5725 23.0443 11.3446C22.9093 11.1167 22.7155 10.9292 22.4832 10.8019V10.8038ZM15 13.1597L16.7738 14.9334L8.47691 19.6828L15 13.1597ZM8.47503 4.51501L16.7747 9.26532L15 11.0391L8.47503 4.51501ZM18.1228 14.1619L16.0603 12.0994L18.1228 10.0369L21.7257 12.0994L18.1228 14.1619Z' fill='white'/%3E%3C/svg%3E");
  margin-right: 4px;
  transform: translateY(4px);
}

.btn-arrow:after {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' viewBox='0 0 25 25' fill='none'%3E%3Cpath d='M14.5306 4.71896L21.2806 11.469C21.3504 11.5386 21.4057 11.6213 21.4434 11.7124C21.4812 11.8034 21.5006 11.901 21.5006 11.9996C21.5006 12.0981 21.4812 12.1957 21.4434 12.2868C21.4057 12.3778 21.3504 12.4606 21.2806 12.5302L14.5306 19.2802C14.3899 19.4209 14.199 19.5 14 19.5C13.801 19.5 13.6101 19.4209 13.4694 19.2802C13.3286 19.1395 13.2496 18.9486 13.2496 18.7496C13.2496 18.5506 13.3286 18.3597 13.4694 18.219L18.9397 12.7496L4.25 12.7496C4.05109 12.7496 3.86032 12.6706 3.71967 12.5299C3.57902 12.3893 3.5 12.1985 3.5 11.9996C3.5 11.8007 3.57902 11.6099 3.71967 11.4693C3.86032 11.3286 4.05109 11.2496 4.25 11.2496L18.9397 11.2496L13.4694 5.78021C13.3286 5.63948 13.2496 5.44861 13.2496 5.24958C13.2496 5.05056 13.3286 4.85969 13.4694 4.71896C13.6101 4.57823 13.801 4.49917 14 4.49917C14.199 4.49917 14.3899 4.57823 14.5306 4.71896Z' fill='white'/%3E%3C/svg%3E");
  display: inline-block;
  margin-left: 5px;
  transform: translateY(4px);
}

.btn-arrow.bg-white:not(:hover)::after, .btn-prev:hover::before {
  filter: invert(1);
}

.btn-arrow:hover::after {
  animation: moveRight 0.8s linear;
}

.swiper-slide {
  width: 350px !important;
  height: 504px !important;
  border-radius: 16px;
  overflow: hidden;
}

.swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after,
.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after,
.swiper-button-next-2:after,
.swiper-rtl .swiper-button-prev-2:after,
.swiper-button-prev-2:after,
.swiper-rtl .swiper-button-next-2:after,
.swiper-button-next-3:after,
.swiper-rtl .swiper-button-prev-3:after,
.swiper-button-prev-3:after,
.swiper-rtl .swiper-button-next-3:after {
  font-size: 20px !important;
  content: "\279C" !important;
  color: white !important;
}

.swiper-button-next:after,
.swiper-rtl .swiper-button-next:after,
.swiper-button-next-2:after,
.swiper-rtl .swiper-button-next-2:after,
.swiper-button-next-3:after,
.swiper-rtl .swiper-button-next-3:after {
  transform: rotate(180deg);
}

.swiper-wrapper {
  max-width: 750px;
}

/* Styles pour le logo SVG */
.custom-logo {
  max-width: 100%;
  height: auto;
}

.custom-logo svg,
.custom-logo {
  width: 100%;
  height: auto;
}

/* Ajustement spécifique pour le logo dans le header */
header .custom-logo {
  max-width: 270px; /* Ajustez cette valeur selon vos besoins */
  margin: 0 auto;
}

.stepper-step {
  color: black;
}

.stepper-step.active {
  color: #000000;
}

.stepper-step.completed {
  color: #000000;
}

.stepper-step .stepper-circle {
  transition: all 0.3s ease;
}

.stepper-step.active .stepper-circle {
  background-color: var(--color-1) !important;
  color: white !important;
}

.stepper-step.completed .stepper-circle {
  background-color: var(--color-1) !important;
  color: white !important;
}

.stepper-step:not(.active):not(.completed) .stepper-circle {
  background-color: #e5e7eb !important;
  color: black !important;
}

.page-fade-in {
  animation: fadeIn 0.5s ease-in-out;
}

.btn-prev:before {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25' fill='none'%3E%3Cpath d='M9.96937 19.3807L3.21938 12.6307C3.14964 12.561 3.09432 12.4783 3.05658 12.3872C3.01884 12.2962 2.99941 12.1986 2.99941 12.1C2.99941 12.0015 3.01884 11.9039 3.05658 11.8128C3.09432 11.7218 3.14964 11.6391 3.21938 11.5694L9.96938 4.8194C10.1101 4.67867 10.301 4.59961 10.5 4.59961C10.699 4.59961 10.8899 4.67867 11.0306 4.8194C11.1714 4.96013 11.2504 5.151 11.2504 5.35003C11.2504 5.54905 11.1714 5.73992 11.0306 5.88065L5.56031 11.35L20.25 11.35C20.4489 11.35 20.6397 11.429 20.7803 11.5697C20.921 11.7103 21 11.9011 21 12.1C21 12.2989 20.921 12.4897 20.7803 12.6304C20.6397 12.771 20.4489 12.85 20.25 12.85L5.56031 12.85L11.0306 18.3194C11.1714 18.4601 11.2504 18.651 11.2504 18.85C11.2504 19.049 11.1714 19.2399 11.0306 19.3807C10.8899 19.5214 10.699 19.6004 10.5 19.6004C10.301 19.6004 10.1101 19.5214 9.96937 19.3807Z' fill='%23182946'/%3E%3C/svg%3E");
  display: inline-block;
  margin-right: 5px;
  transform: translateY(4px) !important;
}

.btn-prev:hover::before {
  animation: moveLeft 0.8s linear;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
    transform: translateY(-10px);
    filter: blur(10px);
  }
  50% {
    opacity: 0.5;
    transform: translateY(-2.5px);
    filter: blur(2.5px);
  }
  75% {
    opacity: 0.75;
    transform: translateY(-1.25px);
    filter: blur(1.25px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}

@keyframes moveRight {
  0% {
    opacity: 1;
    transform: translateX(0) translateY(4px) scale(1);
  }

  25% {
    opacity: 0;
    transform: translateX(20px) translateY(4px) scale(0.9);
  }
  26% {
    opacity: 0;
    transform: translateX(-40px) translateY(4px) scale(0.9);
  }
  55% {
    opacity: 1;
    transform: translateX(0) translateY(4px) scale(1);
  }
}

@keyframes moveLeft {
  0% {
    opacity: 1;
    transform: translateX(0) translateY(4px) scale(1);
  }

  25% {
    opacity: 0;
    transform: translateX(-20px) translateY(4px) scale(0.9);
  }
  26% {
    opacity: 0;
    transform: translateX(40px) translateY(4px) scale(0.9);
  }
  55% {
    opacity: 1;
    transform: translateX(0) translateY(4px) scale(1);
  }
}

@media screen and (max-width: 768px) {
  section:last-of-type:after {
    height: 330px;
  }

  header .custom-logo {
    max-width: 300px;
  }
}