/*
Theme Name: Hemingway Enfant
Template: hemingway
Description: Thème enfant de Hemingway - version stabilisée avec corrections visuelles et sous-menu vert
Author: Régis & ChatGPT
Version: 1.3.1
*/

/* =====================================================================
   🌿 SOUS-MENU PRINCIPAL (main-navigation & blog-menu)
   ===================================================================== */
body .main-navigation ul.sub-menu,
body .blog-menu ul.sub-menu {
  background-color: rgba(55, 99, 63, 0.95) !important;
  border-radius: 8px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
  opacity: 0;
  transform: translateY(10px);
  transition: all 0.25s ease;
  z-index: 9999 !important;
}

body .main-navigation li:hover > ul.sub-menu,
body .blog-menu li:hover > ul.sub-menu {
  opacity: 1;
  transform: translateY(0);
}

/* 🌿 Liens du sous-menu */
body .main-navigation ul.sub-menu li a,
body .blog-menu ul.sub-menu li a {
  color: #fff !important;
  display: block;
  padding: 8px 20px !important;
  font-size: 15px;
  line-height: 1.4;
  text-decoration: none;
  background: transparent !important;
}

/* 🌿 Effet hover */
body .main-navigation ul.sub-menu li a:hover,
body .blog-menu ul.sub-menu li a:hover {
  background: rgba(255, 255, 255, 0.15) !important;
  color: #B84446 !important;
  border-radius: 6px;
}

/* 🌿 Cas spécial du dernier élément */
body .main-navigation ul.sub-menu li:last-child a,
body .blog-menu ul.sub-menu li:last-child a {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
  opacity: 0.95;
}

/* =====================================================================
   🔐 FORMULAIRE DE CONNEXION / INSCRIPTION
   ===================================================================== */

/* 🌿 Champs de saisie */
body .fls_login_wrapper input[type="text"],
body .fls_login_wrapper input[type="email"],
body .fls_login_wrapper input[type="password"] {
  border: 2px solid #37633F !important;
  border-radius: 6px !important;
  background-color: #f9f7ec !important;
  color: #333 !important;
  padding: 8px 12px !important;
  font-size: 15px !important;
  transition: all 0.3s ease;
}

/* 🌿 Focus */
body .fls_login_wrapper input:focus {
  border-color: #B84446 !important;
  box-shadow: 0 0 5px rgba(184, 68, 70, 0.4);
  outline: none !important;
}

/* 🌿 Boutons Log In, Inscription & Réinitialisation */
body .login-submit input[type="submit"],
body .fls_login_wrapper input.button.button-primary[type="submit"],
body .fls_login_wrapper #wp-submit,
#fls_submit,
#fls_reset_submit {
  background-color: #37633F !important;
  color: #fff !important;
  font-weight: 600;
  border: none !important;
  border-radius: 6px !important;
  padding: 10px 30px !important;
  width: auto;
  min-width: 160px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* 🌿 Effet hover */
body .login-submit input[type="submit"]:hover,
body .fls_login_wrapper input.button.button-primary[type="submit"]:hover,
body .fls_login_wrapper #wp-submit:hover,
#fls_submit:hover,
#fls_reset_submit:hover {
  background-color: #B84446 !important;
  color: #fff !important;
  transform: translateY(-2px) scale(1.05);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.25);
}

/* 🌿 Effet clic */
body .login-submit input[type="submit"]:active,
body .fls_login_wrapper input.button.button-primary[type="submit"]:active,
body .fls_login_wrapper #wp-submit:active,
#fls_submit:active,
#fls_reset_submit:active {
  transform: translateY(0) scale(0.98);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}

/* 🌿 Centrage du bouton Log In */
body .login-submit {
  display: flex !important;
  justify-content: center !important;
  margin-top: 10px;
}

/* =====================================================================
   ✅ CASE À COCHER "Remember Me"
   ===================================================================== */
body .fls_login_wrapper input[type="checkbox"],
body .login-submit input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 18px;
  height: 18px;
  border: 2px solid #37633F;
  border-radius: 4px;
  background: #f4f0dc;
  position: relative;
  cursor: pointer;
  vertical-align: middle;
  transition: all 0.25s ease-in-out;
}

body .fls_login_wrapper input[type="checkbox"]:checked,
body .login-submit input[type="checkbox"]:checked {
  background-color: #37633F;
  border-color: #37633F;
}

body .fls_login_wrapper input[type="checkbox"]:checked::after,
body .login-submit input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 5px;
  width: 4px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  animation: checkmark 0.25s ease forwards;
}

@keyframes checkmark {
  from {
    opacity: 0;
    transform: scale(0) rotate(45deg);
  }
  to {
    opacity: 1;
    transform: scale(1) rotate(45deg);
  }
}

/* =====================================================================
   🔗 LIENS ET ESPACEMENTS FORMULAIRE
   ===================================================================== */
body .fls_login_wrapper a {
  color: #37633F !important;
  font-weight: 600;
  transition: color 0.3s ease;
}

body .fls_login_wrapper a:hover {
  color: #B84446 !important;
}

body .fls_login_wrapper p {
  margin-bottom: 15px !important;
}

/* =====================================================================
   🌿 PATCH FINAL - Sous-menu vert + correction du padding et fond noir
   ===================================================================== */
body .main-navigation ul.sub-menu,
body .blog-menu ul.sub-menu,
body nav ul.sub-menu,
body ul.sub-menu {
  background-color: rgba(55, 99, 63, 0.95) !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25) !important;
  padding: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  list-style: none !important;
  border: none !important;
  z-index: 99999 !important;
}

body .main-navigation ul.sub-menu li,
body .blog-menu ul.sub-menu li,
body nav ul.sub-menu li,
body ul.sub-menu li {
  background: transparent !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body .main-navigation ul.sub-menu li a,
body .blog-menu ul.sub-menu li a,
body nav ul.sub-menu li a,
body ul.sub-menu li a {
  background: transparent !important;
  color: #fff !important;
  display: block;
  padding: 8px 20px !important;
  text-decoration: none !important;
  font-size: 15px;
  line-height: 1.4;
}

body .main-navigation ul.sub-menu li a:hover,
body .blog-menu ul.sub-menu li a:hover,
body nav ul.sub-menu li a:hover,
body ul.sub-menu li a:hover {
  background: rgba(255, 255, 255, 0.15) !important;
  color: #B84446 !important;
  border-radius: 6px;
}

body .main-navigation ul.sub-menu,
body .blog-menu ul.sub-menu {
  opacity: 0;
  transform: translateY(10px);
  transition: all 0.25s ease-in-out;
}

body .main-navigation li:hover > ul.sub-menu,
body .blog-menu li:hover > ul.sub-menu {
  opacity: 1;
  transform: translateY(0);
}
/* =====================================================================
   🌿 PATCH FINAL - Bouton "Réinitialisez votre mot de passe"
   ===================================================================== */
body .fls_reset_pass_wrapper input[type="submit"],
body .fls_reset_pass_wrapper button[type="submit"] {
  background-color: #37633F !important; /* ton vert nature */
  color: #fff !important;
  font-weight: 600 !important;
  border: none !important;
  border-radius: 6px !important;
  padding: 10px 30px !important;
  width: auto !important;
  min-width: 200px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  display: block;
  margin: 10px auto;
  text-align: center;
}

/* 🌿 Effet hover harmonisé */
body .fls_reset_pass_wrapper input[type="submit"]:hover,
body .fls_reset_pass_wrapper button[type="submit"]:hover {
  background-color: #B84446 !important; /* rouge du thème */
  color: #fff !important;
  transform: translateY(-2px) scale(1.05);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.25);
}

/* 🌿 Effet clic */
body .fls_reset_pass_wrapper input[type="submit"]:active,
body .fls_reset_pass_wrapper button[type="submit"]:active {
  transform: translateY(0) scale(0.98);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}
/* =====================================================================
   📱 MENU MOBILE HEMINGWAY - Correction responsive + compatibilité desktop
   ===================================================================== */

/* === BOUTON HAMBURGER === */
.menu-toggle,
button.menu-toggle {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.menu-toggle .bar {
  background-color: #3b7d3b !important; /* vert nature */
  height: 3px;
  width: 24px;
  display: block;
  margin: 5px 0;
  transition: background-color 0.3s ease;
}
.menu-toggle:hover .bar,
.menu-toggle[aria-expanded="true"] .bar {
  background-color: #2e662e !important; /* vert foncé */
}

/* === BARRE DE MENU SUPÉRIEURE === */
.main-navigation,
.site-header,
.header-cover {
  background-color: #3b7d3b !important; /* vert nature */
  border: none !important;
  box-shadow: none !important;
}

/* === MENU MOBILE DÉROULANT === */
.mobile-navigation,
.main-navigation ul {
  background-color: #f5f5dc !important; /* beige clair */
  border: none !important;
}
.mobile-navigation ul li,
.main-navigation ul li {
  border-bottom: 1px solid rgba(0,0,0,0.05);
}
.mobile-navigation ul li a,
.main-navigation ul li a {
  color: #3b7d3b !important;
  background: transparent !important;
  font-weight: 600;
  display: block;
  padding: 0.6em 1em;
  text-decoration: none !important;
  transition: all 0.3s ease;
}
.mobile-navigation ul li a:hover,
.main-navigation ul li a:hover,
.mobile-navigation ul li.current-menu-item a {
  background-color: rgba(59,125,59,0.1) !important;
  color: #2e662e !important;
}

/* === AFFICHAGE SPÉCIFIQUE AU MOBILE === */
@media screen and (max-width: 782px) {
  .main-navigation {
    background-color: #3b7d3b !important;
  }
  .mobile-navigation {
    background-color: #f5f5dc !important;
    animation: fadeInMenu 0.35s ease-in-out;
  }
}

/* Animation fluide */
@keyframes fadeInMenu {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* === DEBUG VISUEL MENU MOBILE === */
.nav-toggle,
.nav-toggle.active,
.mobile-navigation,
.main-navigation,
.menu-mobile,
.mobile-menu,
.nav-menu {
  outline: 2px dashed red !important; /* repère visuel */
  background-color: rgba(255, 0, 0, 0.05) !important;
}
