/* NEU: Kontomenue im Kopf (Berggut_AccountMenu). Praefix .bam = berggut account menu.
   Stand 2026-09-25, im echten Infortis-Kopf auf Staging gemessen:
   - das Theme setzt display:block und vererbt line-height:40px (zerlegt die zwei Textzeilen),
   - Konto-Links sind dort weiss (.account-links a {color:#fff!important}) — auf hellgrauem Kopf schwach lesbar,
   - Buttons bekommen beim Hover einen dunklen Hintergrund (vom Shopbetreiber nicht gewuenscht).
   Die Regeln sind deshalb auf #header-account gescoped und teils !important. */

.berggut-account-menu { list-style: none; position: relative; }

#header-account .berggut-account-menu .bam {
    position: relative; display: inline-flex !important; align-items: center; gap: 10px;
    font-size: 14px; line-height: 1.25; text-align: left;
}
#header-account .berggut-account-menu .bam * { line-height: 1.25; }
.bam--placeholder { width: 150px; height: 40px; }

/* Ausloeser: Gast-Link bzw. Button. Ohne Maus etwas heller, mit Maus kraeftiger — kein Hintergrund. */
#header-account .berggut-account-menu .bam__trigger,
#header-account .berggut-account-menu a.bam--guest {
    display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 6px; margin: 0;
    background: transparent !important; border: 0 !important; box-shadow: none !important;
    color: #555 !important; font: inherit; text-align: left; text-decoration: none; cursor: pointer;
    transition: color .15s ease;
}
#header-account .berggut-account-menu .bam__trigger:hover,
#header-account .berggut-account-menu .bam__trigger:focus,
#header-account .berggut-account-menu .bam__trigger:active,
#header-account .berggut-account-menu .bam--open .bam__trigger,
#header-account .berggut-account-menu a.bam--guest:hover,
#header-account .berggut-account-menu a.bam--guest:focus {
    background: transparent !important; color: #111 !important; text-decoration: none;
}
#header-account .berggut-account-menu .bam--recognized a { color: #555 !important; transition: color .15s ease; }
#header-account .berggut-account-menu .bam--recognized a:hover { color: #111 !important; }

#header-account .berggut-account-menu .bam__text { display: inline-flex; flex-direction: column; justify-content: center; gap: 2px; }
#header-account .berggut-account-menu .bam__hello,
#header-account .berggut-account-menu .bam__sub { display: inline-flex; }
.bam__hello { font-weight: 700; font-size: 15px; white-space: nowrap; }
.bam__sub { align-items: center; gap: 8px; font-size: 12px; white-space: nowrap; }
.bam__sub--strong { font-weight: 700; text-decoration: underline; }
.bam__chevron { transition: transform .15s ease; }
.bam--open .bam__chevron { transform: rotate(180deg); }

.bam__icon, .bam__avatar {
    flex: none; width: 36px; height: 36px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box;
}
.bam__icon { border: 2px solid currentColor; }
.bam__avatar { background: #d20f23; color: #fff; border: 2px solid #fff; font-weight: 700; font-size: 16px; }
.bam__avatar--outline { background: #fff; color: #d20f23; border-color: #d20f23; }

/* Panel: oeffnet bei Maus (hover), Tastatur (focus-within) und Klick/Touch (.bam--open) */
.bam__panel {
    display: none; position: absolute; top: 100%; right: 0; z-index: 1000; width: 290px; margin-top: 6px;
    background: #fff; color: #222; border: 1px solid #e6e2dc; border-radius: 10px;
    box-shadow: 0 12px 32px rgba(40, 30, 20, .16); text-align: left; overflow: hidden;
}
.bam--in:hover .bam__panel,
.bam--in:focus-within .bam__panel,
.bam--open .bam__panel { display: block; }
/* Unsichtbare Bruecke, damit das Panel beim Wechsel der Maus vom Ausloeser nicht zuklappt */
.bam--in:hover::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 8px; }

.bam__who { display: flex; flex-direction: column; gap: 2px; padding: 14px 18px 10px; border-bottom: 1px solid #efebe6; }
.bam__who-label { font-size: 12px; color: #5c5750; }
.bam__who-name { font-size: 15px; font-weight: 700; color: #222; }
.bam__nav { display: flex; flex-direction: column; padding: 6px 0; }
.bam__sep { height: 1px; background: #e6e2dc; margin: 0 18px; }

/* Menuepunkte: Hover ohne Hintergrund, nur kraeftigere Farbe */
#header-account .bam__panel a.bam__item,
.bam__panel a.bam__item {
    display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 0 18px;
    font-size: 15px; color: #333 !important; background: transparent !important; text-decoration: none;
    transition: color .15s ease;
}
#header-account .bam__panel a.bam__item svg,
.bam__panel a.bam__item svg { color: #d20f23; flex: none; }
#header-account .bam__panel a.bam__item:hover,
.bam__panel a.bam__item:hover { color: #d20f23 !important; }
/* Abmelden bewusst abgesetzt, kleiner und grau: schwer zu verwechseln, leicht zu finden */
#header-account .bam__panel a.bam__item--logout,
.bam__panel a.bam__item--logout { font-size: 14px; color: #6b665f !important; margin: 6px 0 8px; }
#header-account .bam__panel a.bam__item--logout svg,
.bam__panel a.bam__item--logout svg { color: #6b665f; }
#header-account .bam__panel a.bam__item--logout:hover,
.bam__panel a.bam__item--logout:hover { color: #222 !important; }

/* Mobil: Das Infortis-Theme zeigt die Kopf-Links in einem eigenen aufklappbaren Bereich (#header-account).
   Dort fuellt das Menue die volle Breite: Kopfzeile linksbuendig, darunter eine weisse Liste wie in einer App. */
@media (max-width: 767px) {
    #header-account .berggut-account-menu { display: block; width: 100%; float: none; }
    #header-account .berggut-account-menu .bam,
    #header-account .berggut-account-menu a.bam--guest { display: flex !important; width: 100%; box-sizing: border-box; }
    #header-account .berggut-account-menu .bam--in { flex-direction: column; align-items: stretch; gap: 12px; }
    #header-account .berggut-account-menu .bam__trigger { width: 100%; justify-content: flex-start; padding: 0; cursor: default; }
    .bam--in .bam__chevron { display: none; }
    .bam__panel,
    .bam--in:hover .bam__panel { display: block; position: static; width: 100%; margin: 0; box-shadow: none; border-radius: 10px; }
    .bam--in:hover::after { display: none; }
    .bam__who { display: none; }
    .bam__nav { padding: 0; }
    #header-account .bam__panel a.bam__item,
    .bam__panel a.bam__item { min-height: 50px; padding: 0 16px; border-bottom: 1px solid #efebe6; }
    .bam__nav a.bam__item:last-child { border-bottom: 0; }
    /* Pfeil rechts, wie man es von Listen in Apps kennt */
    .bam__nav a.bam__item::after {
        content: ""; margin-left: auto; width: 7px; height: 7px;
        border-top: 2px solid #b5afa6; border-right: 2px solid #b5afa6; transform: rotate(45deg);
    }
    .bam__sep { margin: 0; }
    #header-account .bam__panel a.bam__item--logout,
    .bam__panel a.bam__item--logout { margin: 0; border-bottom: 0; }
}