/* =========================================================
   RezepteChef Child 1.0.2 — État actif du menu + réseaux sociaux mobiles
   Remplace les ~20 blocs « MENU ACTIF / FINAL FIX » empilés dans
   0307-header.css et 0631-category-menu.css, qui se contredisaient
   (ligne posée à 10 px du bas → elle traversait le texte ; barre orange
   sous l'élément actif du menu mobile ; icônes du menu mobile masquées).
   Chargé en dernier.
   ========================================================= */

/* ---------- 1. Ordinateur (≥ 1025 px) ----------
   « .menu.menu » : priorité juste au-dessus des règles « body.page #masthead … » de 0307. */
@media (min-width: 1025px) {
  html body #masthead .header-navigation .menu.menu > li > a {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 10px 16px 14px !important;  /* 14 px en bas : place du trait */
    white-space: nowrap !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #2f3540 !important;
    text-decoration: none !important;
    transition: background-color .18s ease, color .18s ease !important;
  }

  /* Survol / focus clavier : pastille claire, sans trait */
  html body #masthead .header-navigation .menu.menu > li:hover > a,
  html body #masthead .header-navigation .menu.menu > li > a:focus-visible {
    color: #ff642e !important;
    background: #fff1ec !important;
  }

  /* Élément actif : pastille claire + un seul trait, SOUS le texte */
  html body #masthead .header-navigation .menu.menu > li.current-menu-item > a,
  html body #masthead .header-navigation .menu.menu > li.current_page_item > a,
  html body #masthead .header-navigation .menu.menu > li.current-menu-parent > a,
  html body #masthead .header-navigation .menu.menu > li.current-menu-ancestor > a,
  html body #masthead .header-navigation .menu.menu > li.current_page_parent > a,
  html body #masthead .header-navigation .menu.menu > li.current_page_ancestor > a,
  html body #masthead .header-navigation .menu.menu > li > a[aria-current="page"] {
    color: #ff642e !important;
    background: #fff1ec !important;
  }

  html body #masthead .header-navigation .menu.menu > li > a::before {
    content: none !important;
  }

  html body #masthead .header-navigation .menu.menu > li > a::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    bottom: 5px !important;           /* texte à 14 px du bas → 6 px d'écart, jamais sur le texte */
    width: 28px !important;
    height: 3px !important;
    border-radius: 99px !important;
    background: #ff642e !important;
    transform: translateX(-50%) scaleX(0) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: transform .18s ease, opacity .18s ease !important;
  }

  html body #masthead .header-navigation .menu.menu > li.current-menu-item > a::after,
  html body #masthead .header-navigation .menu.menu > li.current_page_item > a::after,
  html body #masthead .header-navigation .menu.menu > li.current-menu-parent > a::after,
  html body #masthead .header-navigation .menu.menu > li.current-menu-ancestor > a::after,
  html body #masthead .header-navigation .menu.menu > li.current_page_parent > a::after,
  html body #masthead .header-navigation .menu.menu > li.current_page_ancestor > a::after,
  html body #masthead .header-navigation .menu.menu > li > a[aria-current="page"]::after {
    transform: translateX(-50%) scaleX(1) !important;
    opacity: 1 !important;
  }

  html body #masthead .header-navigation .menu.menu > li:hover > a *,
  html body #masthead .header-navigation .menu.menu > li[class*="current"] > a * {
    color: inherit !important;
  }
}

/* ---------- 2. Menu mobile : élément actif = texte orange, sans barre ---------- */
#mobile-drawer .mobile-navigation li > a::after,
#mobile-drawer .mobile-navigation .drawer-nav-drop-wrap > a::after {
  content: none !important;
}

#mobile-drawer .mobile-navigation li.current-menu-item > a,
#mobile-drawer .mobile-navigation li.current_page_item > a,
#mobile-drawer .mobile-navigation li.current-menu-parent > .drawer-nav-drop-wrap > a,
#mobile-drawer .mobile-navigation li.current-menu-ancestor > .drawer-nav-drop-wrap > a {
  color: #ff5a2a !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

/* Icône « Schnelle Rezepte » (les autres entrées en avaient déjà une) */
#mobile-drawer .mobile-navigation li > a[href*="schnelle-rezepte"]::before {
  background-image: url("data:image/svg+xml,%3Csvg width='34' height='34' viewBox='0 0 34 34' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='17' cy='18' r='10.5' stroke='%23111111' stroke-width='2.3'/%3E%3Cpath d='M17 12.5V18L20.5 20.5' stroke='%23ff5a2a' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M14 4.8H20' stroke='%23111111' stroke-width='2.3' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}

/* ---------- 3. Réseaux sociaux dans le menu mobile ---------- */
/* Jamais affichés hors du tiroir mobile */
.rc-mobile-socials {
  display: none !important;
}

#mobile-drawer .mobile-navigation li.rc-mobile-socials {
  display: block !important;
  width: 100% !important;
  margin: 26px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  list-style: none !important;
}

#mobile-drawer .mobile-navigation li.rc-mobile-socials::before,
#mobile-drawer .mobile-navigation li.rc-mobile-socials::after {
  content: none !important;
}

#mobile-drawer .rc-mobile-socials__title {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 0 16px !important;
  color: rgba(31, 20, 15, 0.62) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 1.4 !important;
  white-space: nowrap !important;
}

#mobile-drawer .rc-mobile-socials__title::before,
#mobile-drawer .rc-mobile-socials__title::after {
  content: "" !important;
  flex: 1 1 auto !important;
  height: 1px !important;
  background: rgba(255, 90, 42, 0.24) !important;
}

#mobile-drawer .rc-mobile-socials__links {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;               /* comme l'en-tête ordinateur */
  margin: 0 !important;
  padding: 0 0 4px !important;
}

/* Même style que les icônes sociales de l'en-tête ordinateur (0307-header.css) :
   rond blanc 34 px, icône grise 16 px, ombre légère ; survol orange, icône blanche. */
#mobile-drawer .mobile-navigation li.rc-mobile-socials a.rc-mobile-socials__link {
  display: inline-flex !important;
  flex: 0 0 34px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.92) !important;
  color: #4b5563 !important;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.035) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  transition: all 0.22s ease !important;
}

#mobile-drawer .mobile-navigation li.rc-mobile-socials a.rc-mobile-socials__link::before,
#mobile-drawer .mobile-navigation li.rc-mobile-socials a.rc-mobile-socials__link::after {
  content: none !important;
}

#mobile-drawer .mobile-navigation li.rc-mobile-socials a.rc-mobile-socials__link:hover,
#mobile-drawer .mobile-navigation li.rc-mobile-socials a.rc-mobile-socials__link:active,
#mobile-drawer .mobile-navigation li.rc-mobile-socials a.rc-mobile-socials__link:focus-visible {
  padding: 0 !important;
  background: #ff6b2c !important;
  color: #ffffff !important;
  transform: translateY(-2px) !important;
}

#mobile-drawer .rc-mobile-socials__link .kadence-svg-iconset {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}

#mobile-drawer .rc-mobile-socials__link svg {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px !important;
  fill: currentColor !important;
  color: currentColor !important;
}

/* ---------- 4. Pas de ligne sous la dernière entrée (« Kontakt ») ----------
   Les séparateurs passent du bas au haut de chaque entrée : il n'y en a plus
   ni au-dessus de la première, ni sous la dernière. */
#mobile-drawer .mobile-navigation .menu > li {
  border-bottom: 0 !important;
  border-top: 1px solid rgba(255, 90, 42, 0.14) !important;
}

#mobile-drawer .mobile-navigation .menu > li:first-child,
#mobile-drawer .mobile-navigation .menu > li.rc-mobile-socials {
  border-top: 0 !important;
}
