/* ================================
   Account-Menü – Grundlayout
   ================================ */

/* Liste resetten */
.hp-menu--user-account ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.hp-menu--user-account .hp-menu__item {
    margin: 0;
}

/* Links: Icon + Text nebeneinander, vertikal zentriert */
.hp-menu--user-account .hp-menu__item > a {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.45rem 1.2rem;
    text-decoration: none;
}

/* Aktiver Menüpunkt: nur fett, keine zusätzliche Einrückung */
.hp-menu--user-account .hp-menu__item--current > a {
    font-weight: 600;
}

/* ==========================================
   Icons: von <li> entfernen, an <a> anhängen
   ========================================== */

/* Alte Icons an <li>::before sicher deaktivieren */
.hp-menu--user-account .hp-menu__item::before {
    content: none !important;
}

/* Basis-Icon an <a>::before */
.hp-menu--user-account .hp-menu__item > a::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    display: inline-block;
    width: 1.4em;
    text-align: center;
    font-size: 1.1em;
    line-height: 1;
    color: #B38E58;                 /* Standard-Iconfarbe */
    content: "";
    transition: color 0.15s ease;   /* weicher Hover */
}

/* Hover- & aktiver Zustand: Icon-Farbe ändern */
.hp-menu--user-account .hp-menu__item > a:hover::before,
.hp-menu--user-account .hp-menu__item--current > a::before {
    color: #927141;
}

/* ================================
   Icon-Zuordnung je Menüpunkt
   ================================ */

/* Home */
.hp-menu--user-account .hp-menu__item--account-home > a::before {
    content: "\f015"; /* fa-home */
}

/* Suche */
.hp-menu--user-account .hp-menu__item--account-search > a::before {
    content: "\f002"; /* fa-search */
}

/* Wohnung einstellen */
.hp-menu--user-account .hp-menu__item--listing-submit > a::before {
    content: "\f1ad"; /* fa-building */
}

/* Eigene Anzeigen */
.hp-menu--user-account .hp-menu__item--listings-edit > a::before {
    content: "\f0ca"; /* fa-list-alt */
}

/* Nachrichten */
.hp-menu--user-account .hp-menu__item--messages-thread > a::before {
    content: "\f086"; /* fa-comments */
}

/* Bestellungen */
.hp-menu--user-account .hp-menu__item--orders-view > a::before {
    content: "\f0e0"; /* fa-envelope (oder Wunschicon) */
}

/* Einstellungen */
.hp-menu--user-account .hp-menu__item--user-edit-settings > a::before {
    content: "\f013"; /* fa-cog */
}

/* Adressen */
.hp-menu--user-account .hp-menu__item--account-addresses > a::before {
    content: "\f2bb"; /* fa-address-book */
}

/* Optional: Logout */
.hp-menu--user-account .hp-menu__item--user-logout > a::before {
    content: "\f2f5"; /* fa-sign-out-alt */
}

/* Text im Account-Menü wirklich linksbündig ausrichten */
.hp-menu--user-account,
.hp-menu--user-account .hp-menu__item,
.hp-menu--user-account .hp-menu__item > a {
    text-align: left !important;
}

/* Flex-Layout: Inhalte nach links schieben */
.hp-menu--user-account .hp-menu__item > a {
    justify-content: flex-start !important;
}

/* Nur auf: Mein Konto → Bestellungen */
body.woocommerce-account.woocommerce-orders {
    overflow-x: hidden !important;       /* horizontale Scrollbar weg */
}

/* Falls das Menü selbst breiter ist als der Inhalt: nicht über den Rand hinaus */
body.woocommerce-account.woocommerce-orders .woocommerce-MyAccount-navigation,
body.woocommerce-account.woocommerce-orders .hp-menu--user-account {
    max-width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box;
}