/**
 * 2007-2025 PrestaShop and Contributors
 * Module: pgcustomersubmenu
 * License: Academic Free License 3.0 (AFL-3.0)
 */

/* front.css */

.pgcustomersubmenu.submenu-user {
  position: absolute;
  z-index: 999;
  background: #e9e9e9;
  padding: 10px 20px;
  border: 1px solid #cbcbcb;
  margin-bottom: 0;
  flex-direction: column !important;
  display: block !important;
  z-index: 999;
}

.pgcustomersubmenu.submenu-user a {
  font-weight: 400;
  padding: 10px 0;
  text-shadow: inherit !important;
  line-height: 18px;
  display: block !important;
  width: 100% !important;
}

.pgcustomersubmenu.submenu-user li {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
}

#header .pgcustomersubmenu.submenu-user a.submenu-logout { color: inherit !important; }

#_desktop_user_info .user-info > .logout { display: none !important; }

#_desktop_user_info .user-info > a:not(.account) i { float: left; margin-right: 4px; }

#_desktop_user_info .user-info > .account i { display: block!important; float:right; }

.header-nav, #header .header-nav, .header-nav .right-nav { overflow: visible !important; }

.submenu-user > li > a { color: inherit !important; }

.user-info a i{margin-left: 6px;}

@media (max-width: 1024px) {
  #_desktop_user_info .user-info { position: relative; }
  #_desktop_user_info .pgcustomersubmenu.submenu-user {
    right: 0;         /* ancla al borde derecho del contenedor */
    left: auto;
    max-width: 90vw;  /* evita desbordar la pantalla */
  }
}

/* Solo móvil para el acceso rápido "Mi cuenta" */
@media (min-width: 1025px) {
  .pgcustomersubmenu.submenu-user li.pgcs-mobile-only { display: none !important; }
}
@media (max-width: 1024px) {
  .pgcustomersubmenu.submenu-user li.pgcs-mobile-only { display: block !important; }
}
@media (max-width: 1024px) {
  .pgcustomersubmenu.submenu-user .my-account-item a {
    /*padding-bottom: 10px;
    margin-bottom: 8px;
    border-bottom: 1px solid rgba(0,0,0,.08); */
  }
}

.far{ 
  font-weight: 400;
}

/* ============================
   TRIGGERS UNIFICADOS (abrir)
   ============================ */

/* Cualquier tipo (incluye none/fade/slide) — anula display:none inline al abrir */
#_desktop_user_info .user-info:is(:hover, :focus-within) .pgcustomersubmenu.submenu-user,
#_desktop_user_info .pgcustomersubmenu.submenu-user:hover {
  display: block !important;
}

/* ============================
   ANIMACIÓN: FADE
   ============================ */
.pgcustomersubmenu.submenu-user.animation-fade {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.28s ease, visibility 0s linear 0.28s;
}

/* Visible si el trigger está activo o el propio submenu está en hover */
#_desktop_user_info .user-info:is(:hover, :focus-within) .pgcustomersubmenu.submenu-user.animation-fade,
#_desktop_user_info .pgcustomersubmenu.submenu-user.animation-fade:hover {
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}

/* ============================
   ANIMACIÓN: SLIDE
   ============================ */
.pgcustomersubmenu.submenu-user.animation-slide {
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  transition:
    transform 0.28s ease,
    opacity 0.28s ease,
    visibility 0s linear 0.28s;
}

#_desktop_user_info .user-info:is(:hover, :focus-within) .pgcustomersubmenu.submenu-user.animation-slide,
#_desktop_user_info .pgcustomersubmenu.submenu-user.animation-slide:hover {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition-delay: 0s;
}

/* ============================
   SIN ANIMACIÓN (NONE)
   ============================ */
.pgcustomersubmenu.submenu-user.animation-none { display: none; }

#_desktop_user_info .user-info:is(:hover, :focus-within) .pgcustomersubmenu.submenu-user.animation-none,
#_desktop_user_info .pgcustomersubmenu.submenu-user.animation-none:hover {
  display: block !important;
}

/* Accesibilidad: respeta reducción de movimiento */
@media (prefers-reduced-motion: reduce) {
  .pgcustomersubmenu.submenu-user.animation-fade,
  .pgcustomersubmenu.submenu-user.animation-slide {
    transition: none;
  }
}

/* ============================
   COMPATIBILIDAD MÓVIL
   ============================ */
@media (max-width: 1024px) {
  /* Oculto por defecto; se abrirá con JS */
  .pgcustomersubmenu.submenu-user {
    display: none !important;
  }

  /* Cuando el JS abre el menú */
  .pgcustomersubmenu.submenu-user.pgcs-open {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
    transition: none !important;
    right: 1%;
    left: auto;
    max-width: 100vw;
    width: 98%;
  }
}