/* =========================================================
   BPP / REAL PROPERTY GURU — M20 GLOBAL ACCOUNT PANEL
   - Fixes duplicated account display names in account identity UI
   - Premium dashboard-style account panel on desktop hover/click
   - Public + account/dashboard
   ========================================================= */

.bpp-m20-account-trigger{
    cursor:pointer!important;
}

.bpp-m20-account-trigger [data-bpp-account-name],
.bpp-m20-account-trigger .bpp-m20-account-name{
    white-space:nowrap!important;
}

.bpp-m20-chevron{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin-left:4px!important;
    font-size:12px!important;
    line-height:1!important;
    transition:transform .18s ease!important;
}

.bpp-m20-account-trigger[aria-expanded="true"] .bpp-m20-chevron{
    transform:rotate(180deg)!important;
}

.bpp-m20-account-panel{
    --m20-green:#078e48;
    --m20-green-dark:#034b37;
    --m20-ink:#19231f;
    --m20-muted:#718078;
    --m20-soft:#f3f8f5;
    --m20-line:#dfe9e3;

    display:none;
    position:fixed!important;
    width:336px!important;
    max-width:calc(100vw - 24px)!important;
    max-height:calc(100dvh - 20px)!important;
    overflow:auto!important;
    overscroll-behavior:contain!important;
    z-index:15050!important;
    border:1px solid var(--m20-line)!important;
    border-radius:18px!important;
    background:#fff!important;
    box-shadow:0 24px 70px rgba(3,58,42,.24)!important;
    color:var(--m20-ink)!important;
    font-family:"Inter",Arial,sans-serif!important;
    font-size:13px!important;
    line-height:1.35!important;
    transform-origin:top right!important;
}

.bpp-m20-account-panel.is-open{
    display:block!important;
    animation:bppM20PanelIn .14s ease-out both!important;
}

@keyframes bppM20PanelIn{
    from{opacity:0;transform:translateY(-5px) scale(.985)}
    to{opacity:1;transform:translateY(0) scale(1)}
}

.bpp-m20-panel-head{
    position:relative!important;
    display:grid!important;
    grid-template-columns:52px minmax(0,1fr)!important;
    align-items:center!important;
    gap:12px!important;
    padding:17px!important;
    color:#fff!important;
    background:
        radial-gradient(circle at 92% 10%,rgba(72,203,129,.28),transparent 34%),
        linear-gradient(135deg,#034b37,#076d48)!important;
}

.bpp-m20-panel-avatar{
    width:52px!important;
    height:52px!important;
    border-radius:50%!important;
    overflow:hidden!important;
    display:grid!important;
    place-items:center!important;
    background:#19b86c!important;
    border:2px solid rgba(255,255,255,.78)!important;
    box-shadow:0 4px 16px rgba(0,0,0,.14)!important;
    color:#fff!important;
    font-size:20px!important;
    font-weight:800!important;
}

.bpp-m20-panel-avatar img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
}

.bpp-m20-panel-identity{
    min-width:0!important;
}

.bpp-m20-panel-name{
    display:block!important;
    margin:0 0 4px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    color:#fff!important;
    font-size:15px!important;
    line-height:1.2!important;
    font-weight:800!important;
}

.bpp-m20-panel-meta{
    display:flex!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    gap:7px!important;
    min-height:18px!important;
    color:#cae4d7!important;
    font-size:12px!important;
    line-height:1.25!important;
}

.bpp-m20-panel-verified{
    display:inline-flex!important;
    align-items:center!important;
    gap:4px!important;
    padding:3px 7px!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.13)!important;
    color:#fff!important;
    font-size:12px!important;
    font-weight:700!important;
}

.bpp-m20-credit{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    margin:12px 12px 0!important;
    padding:12px 13px!important;
    border:1px solid #d9e9df!important;
    border-radius:13px!important;
    background:linear-gradient(135deg,#f2faf5,#eaf7ef)!important;
}

.bpp-m20-credit-copy{
    min-width:0!important;
}

.bpp-m20-credit-label{
    display:block!important;
    margin-bottom:2px!important;
    color:#66776e!important;
    font-size:12px!important;
    font-weight:600!important;
}

.bpp-m20-credit-value{
    display:block!important;
    color:#075d3d!important;
    font-size:15px!important;
    line-height:1.15!important;
    font-weight:800!important;
}

.bpp-m20-credit a{
    flex:0 0 auto!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:34px!important;
    padding:0 10px!important;
    border-radius:9px!important;
    background:#f3d879!important;
    color:#173428!important;
    text-decoration:none!important;
    font-size:12px!important;
    font-weight:800!important;
}

.bpp-m20-panel-section-label{
    display:block!important;
    padding:13px 15px 7px!important;
    color:#87958e!important;
    font-size:12px!important;
    line-height:1.2!important;
    font-weight:800!important;
    letter-spacing:.05em!important;
    text-transform:uppercase!important;
}

.bpp-m20-panel-nav{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:6px!important;
    padding:0 10px 10px!important;
}

.bpp-m20-menu-item{
    min-width:0!important;
    min-height:42px!important;
    display:flex!important;
    align-items:center!important;
    gap:9px!important;
    padding:8px 9px!important;
    border:1px solid transparent!important;
    border-radius:10px!important;
    background:#fff!important;
    color:#26322c!important;
    text-decoration:none!important;
    font-size:12px!important;
    line-height:1.25!important;
    font-weight:650!important;
    transition:background .13s ease,border-color .13s ease,color .13s ease!important;
}

.bpp-m20-menu-item:hover,
.bpp-m20-menu-item:focus-visible{
    background:#f2f8f4!important;
    border-color:#dce9e1!important;
    color:#057843!important;
    outline:none!important;
}

.bpp-m20-menu-icon{
    width:27px!important;
    height:27px!important;
    flex:0 0 27px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:8px!important;
    background:#edf7f1!important;
    color:#078e48!important;
    font-size:14px!important;
    font-weight:800!important;
}

.bpp-m20-menu-label{
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

.bpp-m20-menu-badge{
    min-width:20px!important;
    height:20px!important;
    margin-left:auto!important;
    padding:0 5px!important;
    display:inline-grid!important;
    place-items:center!important;
    border-radius:999px!important;
    background:#078e48!important;
    color:#fff!important;
    font-size:12px!important;
    line-height:1!important;
    font-weight:800!important;
}

.bpp-m20-panel-divider{
    height:1px!important;
    margin:2px 12px 0!important;
    background:#e4ece7!important;
}

.bpp-m20-panel-footer{
    display:grid!important;
    grid-template-columns:1fr auto!important;
    align-items:center!important;
    gap:8px!important;
    padding:11px 12px 12px!important;
}

.bpp-m20-dashboard-link,
.bpp-m20-logout{
    min-height:38px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    padding:0 12px!important;
    border-radius:10px!important;
    font-family:inherit!important;
    font-size:12px!important;
    line-height:1.2!important;
    font-weight:800!important;
    text-decoration:none!important;
}

.bpp-m20-dashboard-link{
    background:#078e48!important;
    border:1px solid #078e48!important;
    color:#fff!important;
}

.bpp-m20-logout{
    border:1px solid #eed7d4!important;
    background:#fff7f6!important;
    color:#bd3c31!important;
    cursor:pointer!important;
}

.bpp-m20-panel-footer form{
    margin:0!important;
}

.bpp-m20-panel-caret{
    position:fixed!important;
    z-index:15049!important;
    display:none!important;
    width:12px!important;
    height:12px!important;
    transform:rotate(45deg)!important;
    background:#034b37!important;
    border-left:1px solid rgba(255,255,255,.06)!important;
    border-top:1px solid rgba(255,255,255,.06)!important;
}

.bpp-m20-panel-caret.is-open{
    display:block!important;
}

@media (max-width:1100px){
    .bpp-m20-account-panel,
    .bpp-m20-panel-caret{
        display:none!important;
    }
}


/* BPP_ACCOUNT_PANEL_LOGOUT_GUARD_V2001
 * Prevents the M20/M26 logout decoration/icon from expanding into a giant block.
 */
:is(#bpp-global-account-panel-m20,
    .bpp-global-account-panel-m20,
    .bpp-m20-panel,
    .bpp-account-panel,
    [data-bpp-account-panel],
    [data-bpp-global-account-panel-m20]) :is([class*="logout"], [data-bpp-logout]) {
    box-sizing: border-box !important;
    max-width: 100% !important;
    overflow: hidden !important;
}

:is(#bpp-global-account-panel-m20,
    .bpp-global-account-panel-m20,
    .bpp-m20-panel,
    .bpp-account-panel,
    [data-bpp-account-panel],
    [data-bpp-global-account-panel-m20]) :is([class*="logout"], [data-bpp-logout]) :is(svg, img, i) {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
    flex: 0 0 18px !important;
    object-fit: contain !important;
}

:is(#bpp-global-account-panel-m20,
    .bpp-global-account-panel-m20,
    .bpp-m20-panel,
    .bpp-account-panel,
    [data-bpp-account-panel],
    [data-bpp-global-account-panel-m20]) :is([class*="logout"], [data-bpp-logout]) :is(button, a) {
    min-height: 42px !important;
    max-height: 48px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 9px !important;
    overflow: hidden !important;
    font-family: "DM Sans", Inter, Arial, sans-serif !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
}

/* M26-specific naming variants used by earlier patches. */
:is(.bpp-m26-logout, .bpp-m26-logout-tab, [data-bpp-m26-logout]) :is(svg, img, i) {
    width: 18px !important;
    height: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
    object-fit: contain !important;
}

:is(.bpp-m26-logout, .bpp-m26-logout-tab, [data-bpp-m26-logout]) {
    min-height: 42px !important;
    max-height: 52px !important;
    overflow: hidden !important;
}
/* /BPP_ACCOUNT_PANEL_LOGOUT_GUARD_V2001 */