/* =========================================================
   ARROTONDA - HEADER: DROPDOWN MENU ACCOUNT UTENTE
   Estratto da account-profile.css: queste regole servono su
   tutto il sito (il menu utente e' nell'header), mentre
   account-profile.css viene caricato solo nell'area /profilo.
   ========================================================= */

.menu-item--user-account .sub-menu.hp-menu--user-account {
  position: absolute !important;
      top: calc(100% + 10px) !important;
      right: 0 !important;
      left: auto !important;
      min-width: 248px !important;
      max-width: 258px !important;
      max-height: none !important;
      padding: 10px !important;
      margin: 0 !important;
      overflow: visible !important;
      background: linear-gradient(180deg, rgba(255,255,255,0.97), rgba(248,249,250,0.95)) !important;
      backdrop-filter: blur(18px) !important;
      -webkit-backdrop-filter: blur(18px) !important;
      border: 1px solid rgba(31,43,55,0.07) !important;
      border-radius: 22px !important;
      box-shadow: 0 22px 50px rgba(31,43,55,0.14), 0 8px 20px rgba(31,43,55,0.05), inset 0 2px 0 rgba(214,163,24,0.9), inset 0 1px 0 rgba(255,255,255,0.82) !important;
      z-index: 10100 !important;
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transform: translateY(6px) scale(0.985);
      transform-origin: top right;
      transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease !important;
}

.menu-item--user-account:hover .sub-menu.hp-menu--user-account, .menu-item--user-account:focus-within .sub-menu.hp-menu--user-account {
  opacity: 1 !important;
      visibility: visible !important;
      pointer-events: auto !important;
      transform: translateY(0) scale(1) !important;
}

.menu-item--user-account .sub-menu.hp-menu--user-account::before {
  content: "" !important;
      position: absolute !important;
      top: -8px !important;
      right: 24px !important;
      width: 15px !important;
      height: 15px !important;
      background: rgba(255,255,255,0.95) !important;
      border-left: 1px solid rgba(31,43,55,0.07) !important;
      border-top: 1px solid rgba(31,43,55,0.07) !important;
      transform: rotate(45deg) !important;
}

.menu-item--user-account .sub-menu.hp-menu--user-account::after {
  content: "" !important;
      position: absolute !important;
      top: -14px !important;
      right: 0 !important;
      width: 100% !important;
      height: 16px !important;
      background: transparent !important;
}

.menu-item--user-account .sub-menu li {
  margin: 0 !important;
      padding: 0 !important;
      list-style: none !important;
}

.menu-item--user-account .sub-menu li + li {
  margin-top: 4px !important;
}

.menu-item--user-account .sub-menu li a {
  display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      min-height: 50px !important;
      padding: 0 15px !important;
      margin: 0 !important;
      border-radius: 15px !important;
      background: transparent !important;
      border: 1px solid transparent !important;
      box-shadow: none !important;
      color: #3f4b56 !important;
      font-size: 15px !important;
      font-weight: 500 !important;
      line-height: 1 !important;
      text-decoration: none !important;
      transition: background 0.16s ease, color 0.16s ease, border-color 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease !important;
}

.menu-item--user-account .sub-menu li a:hover {
  background: linear-gradient(180deg, rgba(0,168,107,0.10), rgba(0,168,107,0.06)) !important;
      border-color: rgba(0,168,107,0.10) !important;
      color: #007a4d !important;
      transform: translateX(2px) !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.35) !important;
}

.menu-item--user-account .sub-menu li a span {
  flex: 1 1 auto !important;
      text-align: left !important;
      color: inherit !important;
}

.menu-item--user-account .sub-menu li:last-child {
  margin-top: 8px !important;
      padding-top: 8px !important;
      border-top: 1px solid rgba(31,43,55,0.06) !important;
}

.menu-item--user-account .sub-menu li.hp-menu__item--user-logout a, .menu-item--user-account .sub-menu li:last-child a {
  color: #5a6570 !important;
}

.menu-item--user-account .sub-menu li.hp-menu__item--user-logout a:hover, .menu-item--user-account .sub-menu li:last-child a:hover {
  color: #26313b !important;
}
.menu-item--user-account .sub-menu .hp-menu__item--listings-edit a::before, .menu-item--user-account .sub-menu .hp-menu__item--messages-thread a::before, .menu-item--user-account .sub-menu .hp-menu__item--listings-favorite a::before, .menu-item--user-account .sub-menu .hp-menu__item--user-edit-settings a::before, .menu-item--user-account .sub-menu .hp-menu__item--user-logout a::before {
  display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      width: 26px !important;
      min-width: 26px !important;
      height: 26px !important;
      margin-right: 12px !important;
      border-radius: 50% !important;
      background: rgba(31,43,55,0.045) !important;
      color: #64707c !important;
      font-size: 14px !important;
      font-weight: 600 !important;
      line-height: 1 !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.6) !important;
}

.menu-item--user-account .sub-menu .hp-menu__item--listings-edit a::before {
  content: "▦" !important;
}

.menu-item--user-account .sub-menu .hp-menu__item--listings-favorite a::before {
  content: "♥" !important;
      font-size: 13px !important;
}

.menu-item--user-account .sub-menu .hp-menu__item--user-edit-settings a::before {
  content: "⚙" !important;
      font-size: 14px !important;
}

.menu-item--user-account .sub-menu .hp-menu__item--user-logout a::before {
  content: "↗" !important;
      font-size: 13px !important;
}

.menu-item--user-account .sub-menu li a:hover::before {
  background: rgba(0,168,107,0.10) !important;
      color: #007a4d !important;
}

.menu-item--user-account .sub-menu .hp-menu__item--messages-thread a::before {
  content: "\2709" !important;
      font-size: 13px !important;
}