/* Panou unic (dropdown Bootstrap), identic pe Desktop/Tabletă/Mobil —
   ancorat sub butonul „Contul meu" via poziționarea nativă a dropdown-ului
   (data-bs-display="static"), fără offcanvas, fără backdrop, fără JS custom. */
.account-menu-panel {
    width: 22rem;
    max-width: calc(100vw - 20px);
    max-height: 80vh;
    margin-top: 0.625rem;
    overflow-y: auto;
    border-radius: var(--radius-lg);
    box-shadow: 0 20px 40px rgba(16, 24, 40, 0.15);
}
.account-menu-panel.dropdown-menu[data-bs-popper]{
    margin-top: calc(var(--bs-dropdown-spacer) + 0.75rem);
}

/* Sub 768px (Navbar__mobile-tray): "Contul meu" devine offcanvas Bootstrap REAL
   (nu dropdown) — panou de jos în sus, model identic cu MiniCart/CategoriesMenu
   (`.mini-cart-offcanvas`/`.categories-menu-offcanvas`). `top:auto` (nu 30vh) —
   conținutul e mai scurt decât cel de cos/categorii, deci înălțimea se adaptează
   la conținut (max 80vh + scroll), fără spațiu mort dedesubt. */
@media (max-width: 767.98px) {
    .account-menu-offcanvas {
        top: auto !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        max-height: 80vh;
        overflow-y: auto;
        transform: translateY(100%) !important;
        border-top-left-radius: var(--radius-lg);
        border-top-right-radius: var(--radius-lg);
    }

    .account-menu-offcanvas.show:not(.hiding) {
        transform: translateY(0) !important;
    }
}

.account-menu__header {
    background-color: var(--color-bg-secondary);
}

.account-menu__avatar {
    width: 3rem;
    height: 3rem;
    border-radius: var(--radius-md);
    background-color: var(--color-bg-popular);
    color: var(--color-content-popular-inverse);
    font-weight: var(--font-weight-semibold);
}

.account-menu__name {
    font-weight: var(--font-weight-semibold);
    color: var(--color-content-primary);
}

.account-menu__email {
    font-size: var(--text-s-size);
    color: var(--color-content-tertiary);
}

.account-menu__balance {
    background-color: var(--color-bg-loyalty);
}

.account-menu__balance-label {
    color: var(--color-content-loyalty-secondary);
    font-size: var(--text-s-size);
}

.account-menu__balance-value {
    color: var(--color-content-loyalty-primary);
    font-weight: var(--font-weight-semibold);
    font-size: var(--text-m-size);
}

.account-menu__group {
    border-color: var(--color-border-primary) !important;
}

.account-menu__item {
    color: var(--color-content-primary);
    transition: background-color var(--transition-fast);
}

.account-menu__item:hover {
    background-color: var(--color-bg-secondary);
}

.account-menu__setting-row {
    color: var(--color-content-primary);
    border-color: var(--color-border-primary) !important;
}

.account-menu__toggle {
    border: 1px solid var(--color-border-primary);
    border-radius: var(--radius-md);
}

.account-menu__toggle-option {
    border: none;
    background-color: transparent;
    color: var(--color-content-primary);
    padding: 0.375rem 0.75rem;
    font-size: var(--text-s-size);
}

.account-menu__toggle-option--active {
    background-color: var(--color-bg-secondary);
    font-weight: var(--font-weight-semibold);
}

/* toggle-ul de temă (Sun/Mod) are stare activă aurie, distinctă de restul (gri) —
   token-uri semantice dedicate, neutilizate până acum (identice cu cele din Footer) */
.account-menu__toggle--theme .account-menu__toggle-option--active {
    background-color: var(--color-bg-switch-light);
}

.account-menu__logout {
    background-color: var(--color-bg-primary);
    border: 1px solid var(--color-border-negative-tertiary);
    color: var(--color-content-negative-primary);
    font-weight: var(--font-weight-semibold);
}