/* Icon only: keep link minimal */
.theye-auth-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Google Material Symbols */
.theye-auth-link .material-symbols-outlined {
  font-size: 1.4em;
  line-height: 1;
  vertical-align: middle;
  font-variation-settings: 'FILL' 0;
}

/* Filled when logged */
.theye-auth-link.is-logged .material-symbols-outlined {
  font-variation-settings: 'FILL' 1;
}

/* Show only 2 submenu items depending on login state */
body.theye-auth-is-logged .utility_menu .theye-auth-item .theye-auth-logged-out {
  display: none !important;
}

body:not(.theye-auth-is-logged) .utility_menu .theye-auth-item .theye-auth-logged-in {
  display: none !important;
}

/* Hide theme caret/arrow for this menu item only */
.utility_menu .theye-auth-item>a::after,
.utility_menu .theye-auth-item>a::before {
  content: none !important;
  display: none !important;
}

/* Some themes add extra right padding for the caret */
.utility_menu .theye-auth-item>a {
  padding-right: 0 !important;
}

/* Make submenu floating and right-aligned (do not affect other dropdowns) */
.utility_menu li.theye-auth-item {
  position: relative;
}

/*
  IMPORTANT:
  Many themes hide dropdowns with opacity/visibility/transform (not display:none).
  If we use display:none/block we can end up with a tiny empty box (width/transform still collapsed).
  So we keep it display:block and toggle visibility/opacity, like the theme.
*/
.utility_menu li.theye-auth-item>ul.sub-menu {
  position: absolute !important;
  top: calc(100% + 12px) !important;
  right: 0 !important;
  left: auto !important;
  z-index: 99999;

  display: block !important;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translateY(6px);
  transition: opacity .15s ease, transform .15s ease, visibility .15s ease;

  /* Safety: avoid super narrow dropdowns in utility menu */
  min-width: 140px;
  width: max-content;
}

/* Open states: theme hover + our click toggle */
.utility_menu li.theye-auth-item:hover>ul.sub-menu,
.utility_menu li.theye-auth-item:focus-within>ul.sub-menu,
.utility_menu li.theye-auth-item.theye-auth-open>ul.sub-menu,
.utility_menu li.theye-auth-item.focus>ul.sub-menu {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

/* Ensure links stay inside the dropdown box */
.utility_menu li.theye-auth-item>ul.sub-menu>li>a {
  display: block;
  white-space: nowrap;
}

/* Ensure the dropdown isn't clipped by parent containers */
.utility_menu,
.utility_menu .menu {
  overflow: visible;
}

/* Fix padding hérité du thème sur les items du sous-menu du plugin */
.utility_menu li.theye-auth-item>ul.sub-menu>li {
  padding-left: 0 !important;
}

/* Ne jamais ouvrir au hover pour l'auth item */
.utility_menu li.theye-auth-item:hover>ul.sub-menu {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(10px) !important;
  /* adapte si ton thème utilise autre chose */
}

/* Ouverture uniquement via la classe togglée par JS */
.utility_menu li.theye-auth-item.theye-auth-open>ul.sub-menu {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateY(0) !important;
}

/* Icône noire quand pas logué */
body:not(.theye-auth-is-logged) .utility_menu .theye-auth-link,
body:not(.theye-auth-is-logged) .utility_menu .theye-auth-link .material-symbols-outlined {
  color: #000 !important;
}

/* Supprime le décalage horizontal (margin/padding) sur l’item icône */
nav.utility_menu ul.menu>li.theye-auth-item {
  margin-left: 0 !important;
  /* padding-left: 0 !important; */
}

/* Liens du sous-menu du plugin = même couleur que le thème (ul.menu li a) */
nav.utility_menu li.theye-auth-item>ul.sub-menu a {
  color: var(--color-main) !important;
}

/* hover: on laisse la règle thème faire, mais on s’assure que le lien peut hériter */
nav.utility_menu li.theye-auth-item>ul.sub-menu li:hover>a,
nav.utility_menu li.theye-auth-item>ul.sub-menu li:focus-within>a {
  color: inherit !important;
}/* --- Auth dropdown: open ONLY on click (class .theye-auth-open) --- */

/* Etat fermé (même si le thème tente d'ouvrir au hover/focus) */
nav.utility_menu.main_menu li.theye-auth-item:hover > ul.sub-menu,
nav.utility_menu.main_menu li.theye-auth-item:focus-within > ul.sub-menu,
nav.utility_menu.main_menu li.theye-auth-item.focus > ul.sub-menu {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(6px) !important;
}

/* Etat ouvert uniquement via JS */
nav.utility_menu.main_menu li.theye-auth-item.theye-auth-open > ul.sub-menu {
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translateY(0) !important;
}
