/* Navegación y notificaciones compartidas de Mba'appo. */
.maapo-mobile-nav-actions {
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.maapo-mobile-notifications {
    list-style: none;
    margin: 0;
    padding: 0;
}

.maapo-notification-nav { position: relative; }

.maapo-notification-toggle {
    align-items: center !important;
    background: #fff !important;
    border: 1px solid #d8e8f8 !important;
    border-radius: 14px !important;
    color: #102c4c !important;
    display: inline-flex !important;
    height: 42px !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    width: 42px !important;
}

.maapo-notification-toggle:hover,
.maapo-notification-toggle:focus,
.maapo-notification-toggle.show {
    background: #eaf7ff !important;
    border-color: #b9e4f8 !important;
    color: #087caf !important;
}

.maapo-notification-badge {
    align-items: center;
    background: #e91f3d;
    border: 2px solid #fff;
    border-radius: 999px;
    color: #fff;
    display: inline-flex;
    font-size: .68rem;
    font-weight: 800;
    height: 21px;
    justify-content: center;
    line-height: 1;
    min-width: 21px;
    padding: 0 5px;
    white-space: nowrap;
}

.maapo-notification-toggle > .maapo-notification-badge {
    position: absolute;
    right: -7px;
    top: -8px;
}

.maapo-chat-link > .maapo-notification-badge {
    border-width: 0;
    margin-left: 4px;
    position: static;
}

.maapo-notification-menu {
    border: 1px solid #d7e8f8 !important;
    border-radius: 20px !important;
    box-shadow: 0 20px 48px rgba(9, 46, 80, .18) !important;
    min-width: 330px !important;
    overflow: hidden;
    padding: 8px !important;
    width: 360px;
    z-index: 1090 !important;
}

.maapo-notification-title {
    align-items: center;
    display: flex;
    font-size: 1rem;
    font-weight: 800;
    justify-content: space-between;
    padding: 10px 12px 8px;
}

.maapo-notification-title strong {
    background: #fff0f2;
    border-radius: 999px;
    color: #d91838;
    font-size: .7rem;
    padding: 6px 9px;
}

.maapo-notification-item {
    align-items: center;
    border-radius: 13px !important;
    display: grid !important;
    gap: 10px;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    margin: 2px 0;
    padding: 9px 10px !important;
}

.maapo-notification-item:hover,
.maapo-notification-item:focus { background: #f0f9ff !important; }

.maapo-notification-item img {
    border-radius: 12px;
    height: 44px;
    object-fit: cover;
    width: 44px;
}

.maapo-notification-item span:not(.maapo-notification-badge) {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.maapo-notification-item strong,
.maapo-notification-item small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.maapo-notification-item strong { color: #0d2948; }
.maapo-notification-item small { color: #718199; }

.maapo-notification-empty {
    align-items: center;
    color: #6f8199;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 22px 12px;
    text-align: center;
}

.maapo-notification-empty i { color: #0c9fd7; font-size: 1.4rem; }
.maapo-notification-empty span { color: #173553; font-weight: 800; }

.maapo-notification-all {
    background: #eaf7ff;
    border-radius: 13px;
    color: #0879ad;
    display: block;
    font-weight: 800;
    margin-top: 5px;
    padding: 10px 12px;
    text-align: center;
    text-decoration: none;
}

@media (min-width: 992px) {
    .mb-main-nav > .container {
        max-width: min(1360px, calc(100% - 28px)) !important;
        width: 100% !important;
    }

    .mb-main-nav .navbar-brand {
        flex: 0 0 auto;
        margin-right: clamp(10px, 1.35vw, 22px) !important;
    }

    .mb-main-nav .navbar-collapse {
        flex: 1 1 auto;
        min-width: 0;
    }

    .mb-main-nav .navbar-collapse > .navbar-nav {
        flex-wrap: nowrap !important;
        min-width: 0;
    }

    .mb-main-nav .nav-link {
        font-size: clamp(.82rem, .88vw, .94rem) !important;
        padding-left: clamp(.48rem, .7vw, .82rem) !important;
        padding-right: clamp(.48rem, .7vw, .82rem) !important;
        white-space: nowrap !important;
    }

    .mb-main-nav .maapo-auth-nav {
        flex: 0 0 auto;
        margin-left: 8px !important;
    }

    .chat-pro-nav .container {
        max-width: min(1320px, calc(100% - 28px)) !important;
        width: 100% !important;
    }
}

@media (max-width: 1180px) and (min-width: 992px) {
    .mb-main-nav .navbar-brand img { max-width: 110px !important; }
    .mb-main-nav .nav-link {
        font-size: .78rem !important;
        padding-left: .4rem !important;
        padding-right: .4rem !important;
    }
}

@media (max-width: 991.98px) {
    body.market-nav-open .market-filter-tab {
        opacity: 0 !important;
        pointer-events: none !important;
        visibility: hidden !important;
    }

    .maapo-mobile-nav-actions { display: flex !important; }

    .mb-main-nav .navbar-brand,
    .chat-pro-nav .navbar-brand { margin-right: auto !important; }

    .mb-main-nav .navbar-collapse .maapo-notification-nav { display: none !important; }
    .maapo-mobile-nav-actions .navbar-toggler { margin-left: 0 !important; }

    .maapo-mobile-nav-actions .maapo-notification-menu {
        left: 12px !important;
        max-height: min(72vh, 560px);
        min-width: 0 !important;
        overflow-y: auto;
        position: fixed !important;
        right: 12px !important;
        top: calc(72px + env(safe-area-inset-top, 0px)) !important;
        transform: none !important;
        width: auto !important;
    }

    .mb-main-nav .maapo-auth-nav { align-items: stretch !important; width: 100%; }
    .mb-main-nav .maapo-auth-nav > .nav-item:not(.maapo-notification-nav),
    .mb-main-nav .maapo-auth-nav .login-link { width: 100%; }
    .mb-main-nav .maapo-auth-nav .login-link { justify-content: flex-start !important; }

    .chat-pro-nav .maapo-mobile-nav-actions .maapo-notification-toggle,
    .mb-main-nav .maapo-mobile-nav-actions .maapo-notification-toggle { margin: 0 !important; }
}


/* Ajustes responsive del panel profesional y del panel de chats. */
.chat-pro-nav .navbar-toggler {
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    border: 1px solid #d8e8f8 !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: none !important;
}

.chat-pro-nav .navbar-toggler:focus {
    box-shadow: 0 0 0 .2rem rgba(15, 126, 184, .12) !important;
}

.chat-pro-nav .navbar-toggler-icon {
    width: 24px !important;
    height: 24px !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%287,31,63,.94%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.4' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
    background-size: 24px 24px !important;
}

@media (max-width: 991.98px) {
    .chat-pro-nav {
        min-height: 72px !important;
    }

    .chat-pro-nav > .container {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 0 !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .chat-pro-nav .navbar-brand {
        min-width: 0 !important;
        max-width: calc(100% - 112px) !important;
        margin: 0 auto 0 0 !important;
        overflow: hidden !important;
    }

    .chat-pro-nav .navbar-brand span {
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-size: 1rem !important;
    }

    .chat-pro-nav .navbar-collapse {
        flex-basis: 100% !important;
        width: 100% !important;
        margin-top: 10px !important;
        padding: 12px 0 14px !important;
        border-top: 1px solid #e7f0f8 !important;
        background: #fff !important;
    }

    .chat-pro-nav .navbar-collapse .navbar-nav {
        width: 100% !important;
        gap: 4px !important;
    }

    .chat-pro-nav .navbar-collapse .nav-link {
        display: flex !important;
        align-items: center !important;
        min-height: 46px !important;
        width: 100% !important;
        padding: .72rem .85rem !important;
        border-radius: 13px !important;
    }

    .chat-pro-nav .navbar-collapse > .d-flex {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        width: 100% !important;
        gap: 8px !important;
        margin-top: 10px !important;
    }

    .chat-pro-nav .navbar-collapse > .d-flex > .btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-height: 44px !important;
        width: 100% !important;
    }
}

@media (max-width: 430px) {
    .chat-pro-nav .navbar-brand span { font-size: .92rem !important; }
    .chat-pro-nav .navbar-toggler,
    .chat-pro-nav .maapo-notification-toggle {
        width: 44px !important;
        height: 44px !important;
    }
}

/* ================================================================
   Menú profesional unificado: panel, bandeja y conversación.
   ================================================================ */
.chat-pro-nav {
    min-height: 72px !important;
    background: rgba(255, 255, 255, .98) !important;
    border-bottom: 1px solid #dbeafe !important;
    box-shadow: 0 12px 30px rgba(7, 31, 63, .06) !important;
    color: #071f3f !important;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.chat-pro-nav .pro-nav-container {
    max-width: min(1320px, calc(100% - 28px)) !important;
    width: 100% !important;
}

.chat-pro-nav .pro-nav-brand {
    display: inline-flex !important;
    align-items: center !important;
    min-width: 0 !important;
    gap: 10px !important;
    margin-right: 18px !important;
    color: #071f3f !important;
    text-decoration: none !important;
}

.chat-pro-nav .pro-brand-picture {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.chat-pro-nav .pro-brand-picture img {
    display: block !important;
    width: auto !important;
    height: 31px !important;
    max-width: 145px !important;
    object-fit: contain !important;
}

.chat-pro-nav .pro-nav-brand span {
    color: #071f3f !important;
    font-size: 1rem !important;
    font-weight: 900 !important;
    letter-spacing: -.025em !important;
    white-space: nowrap !important;
}

.chat-pro-nav .pro-nav-primary {
    align-items: center !important;
    gap: 4px !important;
}

.chat-pro-nav .pro-nav-primary .nav-link {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    min-height: 42px !important;
    padding: .62rem .78rem !important;
    border-radius: 13px !important;
    color: #29435f !important;
    font-size: .86rem !important;
    font-weight: 820 !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
}

.chat-pro-nav .pro-nav-primary .nav-link i {
    width: 17px !important;
    color: #167fae !important;
    font-size: .9rem !important;
    text-align: center !important;
}

.chat-pro-nav .pro-nav-primary .nav-link:hover,
.chat-pro-nav .pro-nav-primary .nav-link.active {
    background: #eaf7ff !important;
    color: #075985 !important;
}

.chat-pro-nav .pro-nav-secondary {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    margin-left: auto !important;
}

.chat-pro-nav .pro-nav-back,
.chat-pro-nav .pro-nav-small-action,
.chat-pro-nav .btn-maapo-support,
.chat-pro-nav .btn-maapo-exit {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: .58rem .75rem !important;
    border-radius: 12px !important;
    font-size: .79rem !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    box-shadow: none !important;
}

.chat-pro-nav .pro-nav-back {
    background: #f4faff !important;
    border: 1px solid #cfe7f8 !important;
    color: #0a638f !important;
}

.chat-pro-nav .pro-nav-back:hover {
    background: #e8f6ff !important;
    color: #074e73 !important;
}

.chat-pro-nav .pro-nav-actions {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
}

.chat-pro-nav .pro-nav-small-action {
    background: #fff !important;
    border: 1px solid #cfe1f1 !important;
    color: #087cad !important;
}

.chat-pro-nav .pro-nav-small-action:hover {
    background: #ecf8ff !important;
    border-color: #9fd9f3 !important;
    color: #075985 !important;
}

.chat-pro-nav .btn-maapo-support {
    background: #0e82b8 !important;
    border: 1px solid #0e82b8 !important;
    color: #fff !important;
}

.chat-pro-nav .btn-maapo-support:hover {
    background: #086d9d !important;
    border-color: #086d9d !important;
    color: #fff !important;
}

.chat-pro-nav .btn-maapo-exit {
    background: #dc263f !important;
    border: 1px solid #dc263f !important;
    color: #fff !important;
    box-shadow: 0 8px 20px rgba(220, 38, 63, .16) !important;
}

.chat-pro-nav .btn-maapo-exit:hover {
    background: #b9152d !important;
    border-color: #b9152d !important;
    color: #fff !important;
}

/* El botón nunca puede reaparecer dentro de la PWA instalada, incluso si
   Bootstrap u otra regla fuerza display:inline-flex con !important. */
.chat-pro-nav [data-pwa-install][hidden],
.chat-pro-nav [data-pwa-install].mbaappo-pwa-hidden,
html.mbaappo-is-installed .chat-pro-nav [data-pwa-install] {
    display: none !important;
}

@media (display-mode: standalone) {
    .chat-pro-nav [data-pwa-install] {
        display: none !important;
    }
}

@media (max-width: 1180px) and (min-width: 992px) {
    .chat-pro-nav .pro-nav-brand span { display: none !important; }
    .chat-pro-nav .pro-nav-primary .nav-link { padding-left: .58rem !important; padding-right: .58rem !important; }
    .chat-pro-nav .pro-nav-back span,
    .chat-pro-nav .pro-nav-small-action span,
    .chat-pro-nav .btn-maapo-support span,
    .chat-pro-nav .btn-maapo-exit span { display: none !important; }
    .chat-pro-nav .pro-nav-back,
    .chat-pro-nav .pro-nav-small-action,
    .chat-pro-nav .btn-maapo-support,
    .chat-pro-nav .btn-maapo-exit { width: 40px !important; padding: 0 !important; }
}

@media (max-width: 991.98px) {
    .chat-pro-nav {
        min-height: 76px !important;
    }

    .chat-pro-nav .pro-nav-container {
        display: flex !important;
        flex-wrap: wrap !important;
        max-width: 100% !important;
        padding: 10px 14px !important;
    }

    .chat-pro-nav .pro-nav-brand {
        flex: 1 1 auto !important;
        max-width: calc(100% - 108px) !important;
        gap: 8px !important;
        margin: 0 !important;
        overflow: hidden !important;
    }

    .chat-pro-nav .pro-nav-brand span {
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        font-size: .98rem !important;
    }

    .chat-pro-nav .pro-brand-picture img {
        width: 39px !important;
        height: 39px !important;
        max-width: 39px !important;
    }

    .chat-pro-nav .maapo-mobile-nav-actions {
        display: flex !important;
        flex: 0 0 auto !important;
        gap: 8px !important;
    }

    .chat-pro-nav .navbar-collapse {
        flex-basis: 100% !important;
        width: 100% !important;
        margin: 10px 0 0 !important;
        padding: 12px !important;
        border: 1px solid #dceaf6 !important;
        border-radius: 20px !important;
        background: #fff !important;
        box-shadow: 0 18px 42px rgba(7, 31, 63, .09) !important;
    }

    .chat-pro-nav .pro-nav-primary {
        display: grid !important;
        width: 100% !important;
        gap: 5px !important;
    }

    .chat-pro-nav .pro-nav-primary .nav-link {
        width: 100% !important;
        min-height: 47px !important;
        padding: .72rem .8rem !important;
        font-size: .94rem !important;
    }

    .chat-pro-nav .pro-nav-primary .nav-link.active {
        background: #e9f7ff !important;
    }

    .chat-pro-nav .pro-nav-secondary {
        display: block !important;
        width: 100% !important;
        margin: 11px 0 0 !important;
        padding-top: 11px !important;
        border-top: 1px solid #e7f0f8 !important;
    }

    .chat-pro-nav .pro-nav-back {
        width: 100% !important;
        min-height: 45px !important;
        justify-content: flex-start !important;
        padding: .72rem .85rem !important;
        font-size: .88rem !important;
    }

    .chat-pro-nav .pro-nav-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: 100% !important;
        gap: 8px !important;
        margin-top: 10px !important;
    }

    .chat-pro-nav .pro-nav-small-action,
    .chat-pro-nav .btn-maapo-support,
    .chat-pro-nav .btn-maapo-exit {
        width: 100% !important;
        min-height: 43px !important;
        padding: .62rem .55rem !important;
        font-size: .8rem !important;
    }

    .chat-pro-nav .pro-notifications-action {
        background: #fff !important;
        color: #087cad !important;
    }

    .chat-pro-nav .btn-maapo-exit {
        grid-column: 1 / -1 !important;
        min-height: 46px !important;
        font-size: .88rem !important;
    }

    .chat-pro-nav .pro-desktop-chat-alerts { display: none !important; }
}

@media (max-width: 420px) {
    .chat-pro-nav .pro-nav-container { padding-left: 10px !important; padding-right: 10px !important; }
    .chat-pro-nav .pro-nav-brand { max-width: calc(100% - 100px) !important; }
    .chat-pro-nav .pro-brand-picture img { width: 35px !important; height: 35px !important; max-width: 35px !important; }
    .chat-pro-nav .pro-nav-brand span { font-size: .9rem !important; }
    .chat-pro-nav .navbar-toggler,
    .chat-pro-nav .maapo-notification-toggle { width: 43px !important; height: 43px !important; }
}

/* ================================================================
   Barra inferior pública exclusiva de la PWA instalada.
   Inspirada en la navegación móvil de aplicaciones sociales: solo
   iconos, selección visible y soporte para el área segura del sistema.
   ================================================================ */
.mbaappo-app-bottom-nav {
    display: none;
}

@media (max-width: 1199.98px) {
    html.mbaappo-is-installed.maapo-has-app-bottom-nav body {
        padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px)) !important;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-nav {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1060;
        display: grid;
        grid-template-columns: repeat(var(--mbaappo-app-nav-count, 5), minmax(0, 1fr));
        height: calc(64px + env(safe-area-inset-bottom, 0px));
        padding: 0 5px env(safe-area-inset-bottom, 0px);
        border-top: 1px solid rgba(190, 214, 233, .92);
        background: rgba(255, 255, 255, .97);
        box-shadow: 0 -10px 34px rgba(7, 31, 63, .10);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
        isolation: isolate;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item {
        position: relative;
        display: flex;
        min-width: 0;
        height: 64px;
        align-items: center;
        justify-content: center;
        margin: 0;
        padding: 0;
        overflow: visible;
        border: 0;
        border-radius: 0;
        outline: 0;
        color: #66798e;
        background: transparent;
        box-shadow: none;
        font: inherit;
        text-decoration: none;
        -webkit-tap-highlight-color: transparent;
        transition: color .16s ease, transform .16s ease, background .16s ease;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item::before {
        content: '';
        position: absolute;
        top: 0;
        left: 18%;
        width: 64%;
        height: 3px;
        border-radius: 0 0 999px 999px;
        background: linear-gradient(90deg, #ff7b22 0%, #17b9de 48%, #0879d8 100%);
        opacity: 0;
        transform: scaleX(.35);
        transform-origin: center;
        transition: opacity .16s ease, transform .16s ease;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item i,
    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item .mbaappo-bottom-svg {
        position: relative;
        z-index: 1;
        width: 30px;
        height: 30px;
        flex: 0 0 30px;
        font-size: 1.45rem;
        line-height: 1;
        text-align: center;
        transition: transform .16s ease, color .16s ease;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item .mbaappo-bottom-svg {
        display: block;
        overflow: visible;
        fill: currentColor;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item .mbaappo-bottom-svg-professional {
        width: 31px;
        height: 31px;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item .mbaappo-bottom-svg-account,
    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item .mbaappo-bottom-svg-register {
        width: 29px;
        height: 29px;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item.active,
    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item[aria-current='page'] {
        color: #0787bf;
        background: linear-gradient(180deg, rgba(19, 174, 222, .08), transparent 72%);
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item.active::before,
    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item[aria-current='page']::before {
        opacity: 1;
        transform: scaleX(1);
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item.active i,
    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item[aria-current='page'] i,
    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item.active .mbaappo-bottom-svg,
    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item[aria-current='page'] .mbaappo-bottom-svg {
        transform: translateY(-1px) scale(1.06);
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item:active {
        transform: scale(.91);
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-button {
        appearance: none;
        -webkit-appearance: none;
        cursor: pointer;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-badge {
        position: absolute;
        top: 8px;
        left: calc(50% + 7px);
        z-index: 3;
        display: inline-flex;
        min-width: 19px;
        height: 19px;
        align-items: center;
        justify-content: center;
        padding: 0 5px;
        border: 2px solid #fff;
        border-radius: 999px;
        color: #fff;
        background: #e92342;
        box-shadow: 0 4px 10px rgba(196, 18, 47, .22);
        font-size: .64rem;
        font-weight: 900;
        line-height: 1;
        white-space: nowrap;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-badge[hidden] {
        display: none !important;
    }

    /* La campana superior deja de duplicarse dentro de la app instalada. */
    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mb-main-nav .maapo-mobile-notifications {
        display: none !important;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .footer-mbaapo-unified {
        padding-bottom: 18px !important;
    }
}

@media (max-width: 430px) {
    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-nav {
        padding-inline: 1px;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item i {
        font-size: 1.34rem;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item .mbaappo-bottom-svg {
        width: 28px;
        height: 28px;
        flex-basis: 28px;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-badge {
        top: 9px;
    }
}


/* Barra inferior PWA v2: todos los símbolos comparten la misma caja óptica. */
@media (max-width: 1199.98px) {
    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item {
        display: grid;
        place-items: center;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-bottom-icon {
        position: relative;
        z-index: 1;
        display: grid;
        width: 32px;
        height: 32px;
        place-items: center;
        flex: 0 0 32px;
        line-height: 0;
        transform-origin: center;
        transition: transform .16s ease, color .16s ease;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-bottom-icon svg {
        display: block;
        width: 27px;
        height: 27px;
        overflow: visible;
        fill: currentColor;
        transform: none !important;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item.active .mbaappo-bottom-icon,
    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item[aria-current='page'] .mbaappo-bottom-icon {
        transform: translateY(-1px) scale(1.06);
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item.active .mbaappo-bottom-icon svg,
    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-app-bottom-item[aria-current='page'] .mbaappo-bottom-icon svg {
        transform: none !important;
    }
}

@media (max-width: 430px) {
    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-bottom-icon {
        width: 30px;
        height: 30px;
        flex-basis: 30px;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav .mbaappo-bottom-icon svg {
        width: 26px;
        height: 26px;
    }
}


/* ================================================================
   Barra inferior compartida por perfiles, chats y administración.
   El navegador normal no cambia; estas reglas solo actúan en la PWA.
   ================================================================ */
@media (max-width: 1199.98px) {
    /* El submenú Inicio/Publicaciones del profesional queda encima de la barra global. */
    html.mbaappo-is-installed.maapo-has-app-bottom-nav body.professional-panel-page {
        padding-bottom: calc(138px + env(safe-area-inset-bottom, 0px)) !important;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav body.professional-panel-page .fixed-bottom-nav {
        bottom: calc(64px + env(safe-area-inset-bottom, 0px)) !important;
        z-index: 1055 !important;
        min-height: 62px;
        border-top-color: rgba(190, 214, 233, .92) !important;
        box-shadow: 0 -8px 22px rgba(7, 31, 63, .07);
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav body.professional-panel-page .fixed-bottom-nav .nav-link {
        min-height: 61px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        padding: 6px 5px !important;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav body.professional-panel-page .help-bubble {
        bottom: calc(142px + env(safe-area-inset-bottom, 0px)) !important;
    }

    /* En la conversación, el cuadro para escribir no debe quedar detrás de la barra. */
    html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-user .composer,
    html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-professional .composer {
        bottom: calc(64px + env(safe-area-inset-bottom, 0px)) !important;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-user .mobile-chat-tools,
    html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-professional .mobile-chat-tools {
        bottom: calc(128px + env(safe-area-inset-bottom, 0px)) !important;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-user .chat-toast.compact,
    html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-professional .chat-toast.compact {
        bottom: calc(136px + env(safe-area-inset-bottom, 0px)) !important;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-user .side-panel,
    html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-professional .side-panel {
        bottom: calc(64px + env(safe-area-inset-bottom, 0px)) !important;
        max-height: calc(82dvh - 64px - env(safe-area-inset-bottom, 0px)) !important;
    }

    html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-user .chat-shell,
    html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-professional .chat-shell {
        padding-bottom: calc(146px + env(safe-area-inset-bottom, 0px)) !important;
    }

    /* El panel administrativo reserva espacio para la navegación global. */
    html.mbaappo-is-installed.maapo-has-app-bottom-nav body.admin-app-page .main-content {
        padding-bottom: calc(94px + env(safe-area-inset-bottom, 0px)) !important;
    }
}


/* Menú profesional simplificado: acciones secundarias únicamente volver y salir. */
.pro-nav-actions-simple{display:flex;align-items:center;gap:10px}
.pro-nav-actions-simple .btn-maapo-exit{min-width:112px}
@media(max-width:991.98px){
  .chat-pro-nav .pro-nav-secondary{display:grid!important;gap:10px}
  .chat-pro-nav .pro-nav-actions-simple{display:grid!important;grid-template-columns:minmax(0,1fr)}
  .chat-pro-nav .pro-nav-actions-simple .btn-maapo-exit{width:100%!important}
}

/* El chat usa un solo scroll interno; la barra PWA solo reserva su propia altura. */
@media(max-width:1199.98px){
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-user,
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-professional{
    box-sizing:border-box!important;
    height:100dvh!important;
    padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))!important;
    overflow:hidden!important;
  }
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-user .chat-shell,
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-professional .chat-shell{
    padding-bottom:0!important;
  }
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-user .composer,
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-professional .composer{
    position:static!important;
    bottom:auto!important;
  }
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-user .mobile-chat-tools,
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-professional .mobile-chat-tools{
    bottom:calc(128px + env(safe-area-inset-bottom,0px))!important;
  }
}

/* ================================================================
   Corrección final: chat móvil bloqueado y modales sobre la barra PWA.
   En conversación solo se desplaza .messages. Encabezado y compositor
   permanecen dentro del alto útil de la aplicación.
   ================================================================ */
@media (max-width: 991.98px) {
  body.chat-user,
  body.chat-professional {
    height: var(--maapo-chat-viewport-height, 100dvh) !important;
    min-height: 0 !important;
    max-height: var(--maapo-chat-viewport-height, 100dvh) !important;
    overflow: hidden !important;
    overscroll-behavior: none !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    align-content: stretch !important;
  }

  body.chat-user > .mb-main-nav,
  body.chat-professional > .chat-pro-nav {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    flex: none !important;
    align-self: start !important;
    width: 100% !important;
    margin: 0 !important;
    z-index: 1040 !important;
  }

  body.chat-user .chat-shell,
  body.chat-professional .chat-shell {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin: 0 !important;
    padding: 4px 0 0 !important;
    overflow: hidden !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    align-content: stretch !important;
  }

  body.chat-user .chat-head,
  body.chat-professional .chat-head {
    position: relative !important;
    inset: auto !important;
    flex: none !important;
    align-self: start !important;
    min-height: 54px !important;
    max-height: 62px !important;
    margin: 0 8px 5px !important;
    padding: 5px 7px !important;
    overflow: hidden !important;
    z-index: 7 !important;
  }

  body.chat-user .chat-head img,
  body.chat-professional .chat-head img {
    width: 38px !important;
    height: 38px !important;
    border-radius: 11px !important;
  }

  body.chat-user .chat-head h1,
  body.chat-professional .chat-head h1 {
    font-size: .86rem !important;
    line-height: 1.03 !important;
    -webkit-line-clamp: 2 !important;
  }

  body.chat-user .chat-head .small-muted,
  body.chat-professional .chat-head .small-muted {
    font-size: .62rem !important;
    line-height: 1 !important;
  }

  body.chat-user .chat-head-actions,
  body.chat-professional .chat-head-actions {
    gap: 3px !important;
  }

  body.chat-user .chat-head-actions .btn,
  body.chat-professional .chat-head-actions .btn {
    min-height: 30px !important;
    padding: .26rem .42rem !important;
    border-radius: 10px !important;
    font-size: .68rem !important;
  }

  body.chat-user .chat-layout,
  body.chat-professional .chat-layout {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    display: block !important;
  }

  body.chat-user .chat-panel,
  body.chat-professional .chat-panel {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
    display: grid !important;
    grid-template-rows: minmax(0, 1fr) auto !important;
    border-radius: 0 !important;
  }

  body.chat-user .messages,
  body.chat-professional .messages {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    touch-action: pan-y !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 9px 9px 12px !important;
  }

  body.chat-user .composer,
  body.chat-professional .composer {
    position: relative !important;
    inset: auto !important;
    bottom: auto !important;
    flex: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 7px 8px !important;
    z-index: 8 !important;
  }
}

@media (max-width: 1199.98px) {
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-user,
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-professional {
    height: var(--maapo-chat-viewport-height, 100dvh) !important;
    max-height: var(--maapo-chat-viewport-height, 100dvh) !important;
    padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px)) !important;
    overflow: hidden !important;
  }

  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-user .chat-shell,
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-professional .chat-shell {
    height: 100% !important;
    max-height: 100% !important;
    padding-bottom: 0 !important;
  }

  /* Cuando hay un modal de Bootstrap abierto, la barra global se oculta.
     Así ningún botón Guardar/Enviar queda debajo de la navegación. */
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.modal-open .mbaappo-app-bottom-nav {
    display: none !important;
  }

  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.professional-panel-page.modal-open {
    padding-bottom: 0 !important;
    overflow: hidden !important;
  }

  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.professional-panel-page #profileEditModal .modal-dialog,
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.professional-panel-page #modalItem .modal-dialog {
    width: 100% !important;
    max-width: none !important;
    height: var(--maapo-modal-viewport-height, 100dvh) !important;
    min-height: var(--maapo-modal-viewport-height, 100dvh) !important;
    max-height: var(--maapo-modal-viewport-height, 100dvh) !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: stretch !important;
  }

  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.professional-panel-page #profileEditModal .modal-content,
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.professional-panel-page #modalItem .modal-content {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    border: 0 !important;
    border-radius: 0 !important;
  }

  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.professional-panel-page #profileEditModal .modal-header,
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.professional-panel-page #modalItem .modal-header {
    flex: 0 0 auto !important;
  }

  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.professional-panel-page #profileEditModal .modal-body,
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.professional-panel-page #modalItem .modal-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    padding-bottom: 22px !important;
  }

  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.professional-panel-page #profileEditModal .modal-footer,
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.professional-panel-page #modalItem .modal-footer {
    position: relative !important;
    inset: auto !important;
    flex: 0 0 auto !important;
    z-index: 4 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px)) !important;
    border-top: 1px solid #dbeafe !important;
    background: #fff !important;
    box-shadow: 0 -8px 24px rgba(7, 31, 63, .08) !important;
  }
}


/* ================================================================
   Ajuste de encabezado en conversación profesional móvil.
   El nav ocupa una fila compacta y el menú desplegable flota debajo;
   así no reserva un bloque blanco antes de la conversación.
   ================================================================ */
@media (max-width: 991.98px) {
  body.chat-professional {
    grid-template-rows: 72px minmax(0, 1fr) !important;
  }

  body.chat-professional > .chat-pro-nav {
    box-sizing: border-box !important;
    position: relative !important;
    top: auto !important;
    width: 100% !important;
    height: 72px !important;
    min-height: 72px !important;
    max-height: 72px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body.chat-professional > .chat-pro-nav .pro-nav-container {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 72px !important;
    min-height: 72px !important;
    margin: 0 !important;
    padding: 0 14px !important;
    align-items: center !important;
    align-content: center !important;
  }

  body.chat-professional > .chat-pro-nav .navbar-collapse {
    position: absolute !important;
    top: calc(100% + 6px) !important;
    right: 10px !important;
    left: 10px !important;
    width: auto !important;
    margin: 0 !important;
    z-index: 1090 !important;
  }

  body.chat-professional > .chat-shell {
    padding-top: 4px !important;
  }
}

/* =====================================================================
   CHAT PWA — ESTRUCTURA DEFINITIVA
   - El encabezado profesional vive fuera del área desplazable.
   - Abrir el menú hamburguesa no empuja la conversación.
   - Solo la lista de mensajes tiene scroll.
   - Solicitudes/Catálogo ocupa una fila propia y nunca tapa mensajes.
   ===================================================================== */
@media (max-width: 991.98px) {
  body.chat-professional {
    --maapo-chat-topbar: 72px;
    box-sizing: border-box !important;
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    height: var(--maapo-chat-viewport-height, 100dvh) !important;
    min-height: 0 !important;
    max-height: var(--maapo-chat-viewport-height, 100dvh) !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    display: block !important;
    overscroll-behavior: none !important;
  }

  body.chat-professional > .chat-pro-nav.pro-nav-chat-context {
    box-sizing: border-box !important;
    position: fixed !important;
    inset: 0 0 auto 0 !important;
    z-index: 1095 !important;
    width: 100% !important;
    height: var(--maapo-chat-topbar) !important;
    min-height: var(--maapo-chat-topbar) !important;
    max-height: var(--maapo-chat-topbar) !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: rgba(255,255,255,.985) !important;
  }

  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .pro-nav-container {
    box-sizing: border-box !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    align-content: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 14px !important;
  }

  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .pro-nav-brand {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: calc(100% - 58px) !important;
    margin: 0 !important;
  }

  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .maapo-mobile-nav-actions {
    flex: 0 0 auto !important;
    margin: 0 !important;
  }

  /* El menú desplegable flota sobre el chat; no forma parte del flujo. */
  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .navbar-collapse,
  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .navbar-collapse.collapsing {
    box-sizing: border-box !important;
    position: fixed !important;
    top: calc(var(--maapo-chat-topbar) + 7px) !important;
    right: 9px !important;
    bottom: auto !important;
    left: 9px !important;
    z-index: 1100 !important;
    width: auto !important;
    max-height: calc(var(--maapo-chat-viewport-height, 100dvh) - var(--maapo-chat-topbar) - 82px) !important;
    margin: 0 !important;
    padding: 12px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    border: 1px solid #dceaf6 !important;
    border-radius: 18px !important;
    background: #fff !important;
    box-shadow: 0 22px 54px rgba(7,31,63,.18) !important;
    transition: none !important;
  }

  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .navbar-collapse.collapse:not(.show) {
    display: none !important;
  }

  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .navbar-collapse.show,
  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .navbar-collapse.collapsing {
    display: block !important;
    height: auto !important;
  }

  body.chat-professional > .chat-shell {
    box-sizing: border-box !important;
    position: fixed !important;
    top: var(--maapo-chat-topbar) !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 1 !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 5px 0 0 !important;
    overflow: hidden !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    align-content: stretch !important;
  }

  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-professional > .chat-shell {
    bottom: calc(64px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body.chat-professional .chat-head {
    box-sizing: border-box !important;
    position: relative !important;
    inset: auto !important;
    z-index: 8 !important;
    display: grid !important;
    grid-template-columns: 40px minmax(0, 1fr) auto !important;
    align-items: center !important;
    width: auto !important;
    min-height: 52px !important;
    max-height: 58px !important;
    margin: 0 8px 5px !important;
    padding: 5px 7px !important;
    gap: 7px !important;
    overflow: hidden !important;
    border-radius: 15px !important;
  }

  body.chat-professional .chat-head img {
    width: 38px !important;
    height: 38px !important;
    border-radius: 11px !important;
  }

  body.chat-professional .chat-head h1 {
    max-width: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    font-size: .85rem !important;
    line-height: 1.03 !important;
    text-overflow: ellipsis !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
  }

  body.chat-professional .chat-head .small-muted {
    font-size: .61rem !important;
    line-height: 1 !important;
  }

  body.chat-professional .chat-head-actions {
    min-width: 0 !important;
    margin: 0 !important;
    gap: 3px !important;
  }

  body.chat-professional .chat-head-actions .btn {
    min-height: 31px !important;
    padding: .27rem .42rem !important;
    border-radius: 10px !important;
    font-size: .68rem !important;
  }

  body.chat-professional .chat-layout,
  body.chat-user .chat-layout {
    box-sizing: border-box !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
  }

  body.chat-professional .chat-panel,
  body.chat-user .chat-panel {
    box-sizing: border-box !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: grid !important;
    grid-template-rows: minmax(0, 1fr) auto auto !important;
  }

  body.chat-professional .messages,
  body.chat-user .messages {
    box-sizing: border-box !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    touch-action: pan-y !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 9px 9px 10px !important;
    scroll-padding-bottom: 14px !important;
  }

  body.chat-professional .chat-utility-bar,
  body.chat-user .chat-utility-bar {
    position: static !important;
    inset: auto !important;
    z-index: 7 !important;
    display: flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: 100% !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 4px 8px 3px !important;
    background: linear-gradient(180deg, rgba(245,251,255,.35), #fff) !important;
    box-shadow: none !important;
  }

  body.chat-professional .chat-utility-bar .btn,
  body.chat-user .chat-utility-bar .btn {
    width: auto !important;
    max-width: calc(100% - 8px) !important;
    min-height: 39px !important;
    margin: 0 !important;
    padding: .48rem .78rem !important;
    border-radius: 13px !important;
    box-shadow: 0 8px 20px rgba(15,126,184,.16) !important;
    font-size: .82rem !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
  }

  body.chat-professional .composer,
  body.chat-user .composer {
    box-sizing: border-box !important;
    position: static !important;
    inset: auto !important;
    z-index: 8 !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 7px 8px !important;
    background: #fff !important;
    box-shadow: 0 -7px 20px rgba(7,31,63,.07) !important;
  }

  body.chat-professional .side-panel,
  body.chat-user .side-panel {
    bottom: 0 !important;
  }

  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-professional .side-panel,
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-user .side-panel {
    bottom: calc(64px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

@media (max-width: 380px) {
  body.chat-professional .chat-head-actions .btn span {
    display: none !important;
  }
  body.chat-professional .chat-head-actions .btn {
    width: 32px !important;
    padding: 0 !important;
  }
}

/* =====================================================================
   CHAT MÓVIL/PWA — LAYOUT ÚNICO PARA CLIENTE Y PROFESIONAL (v22)
   El navegador superior, la ficha del contacto, las herramientas y el
   compositor quedan fuera del scroll. Solamente .messages se desplaza.
   ===================================================================== */
@media (max-width: 991.98px) {
  body.chat-user,
  body.chat-professional {
    --maapo-chat-topbar-h: 72px;
    --maapo-chat-contact-h: 58px;
    --maapo-chat-appnav-h: 0px;
    box-sizing: border-box !important;
    position: fixed !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: var(--maapo-chat-viewport-height, 100dvh) !important;
    min-height: 0 !important;
    max-height: var(--maapo-chat-viewport-height, 100dvh) !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    overscroll-behavior: none !important;
    background: #f5fbff !important;
  }

  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-user,
  html.mbaappo-is-installed.maapo-has-app-bottom-nav body.chat-professional {
    --maapo-chat-appnav-h: calc(64px + env(safe-area-inset-bottom, 0px));
    padding: 0 !important;
  }

  /* Encabezado público/profesional: siempre una fila independiente. */
  body.chat-user > .mb-main-nav,
  body.chat-professional > .chat-pro-nav.pro-nav-chat-context {
    box-sizing: border-box !important;
    position: absolute !important;
    inset: 0 0 auto 0 !important;
    z-index: 1120 !important;
    display: block !important;
    width: 100% !important;
    height: var(--maapo-chat-topbar-h) !important;
    min-height: var(--maapo-chat-topbar-h) !important;
    max-height: var(--maapo-chat-topbar-h) !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: rgba(255,255,255,.99) !important;
    border-bottom: 1px solid #dbeafe !important;
    box-shadow: 0 7px 22px rgba(7,31,63,.045) !important;
  }

  body.chat-user > .mb-main-nav > .container,
  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .pro-nav-container {
    box-sizing: border-box !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 16px !important;
  }

  body.chat-user > .mb-main-nav .navbar-brand,
  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .pro-nav-brand {
    display: flex !important;
    align-items: center !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: calc(100% - 58px) !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.chat-user > .mb-main-nav .navbar-brand img {
    display: block !important;
    width: auto !important;
    height: 31px !important;
    max-width: 150px !important;
    object-fit: contain !important;
  }

  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .pro-brand-picture img {
    display: block !important;
    width: 39px !important;
    height: 39px !important;
    object-fit: contain !important;
  }

  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .pro-nav-brand > span {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 1rem !important;
  }

  body.chat-user > .mb-main-nav .maapo-mobile-nav-actions,
  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .maapo-mobile-nav-actions {
    display: flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    margin: 0 !important;
  }

  body.chat-user > .mb-main-nav .navbar-toggler,
  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .navbar-toggler {
    width: 48px !important;
    height: 48px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 14px !important;
  }

  /* El menú hamburguesa flota; jamás aumenta la altura del body/chat. */
  body.chat-user > .mb-main-nav .navbar-collapse,
  body.chat-user > .mb-main-nav .navbar-collapse.collapsing,
  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .navbar-collapse,
  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .navbar-collapse.collapsing {
    box-sizing: border-box !important;
    position: fixed !important;
    top: calc(var(--maapo-chat-topbar-h) + 7px) !important;
    right: 9px !important;
    bottom: auto !important;
    left: 9px !important;
    z-index: 1220 !important;
    width: auto !important;
    height: auto !important;
    max-height: calc(var(--maapo-chat-viewport-height, 100dvh) - var(--maapo-chat-topbar-h) - var(--maapo-chat-appnav-h) - 14px) !important;
    margin: 0 !important;
    padding: 12px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    border: 1px solid #dceaf6 !important;
    border-radius: 18px !important;
    background: #fff !important;
    box-shadow: 0 22px 54px rgba(7,31,63,.2) !important;
    transition: none !important;
  }

  body.chat-user > .mb-main-nav .navbar-collapse.collapse:not(.show),
  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .navbar-collapse.collapse:not(.show) {
    display: none !important;
  }

  body.chat-user > .mb-main-nav .navbar-collapse.show,
  body.chat-user > .mb-main-nav .navbar-collapse.collapsing,
  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .navbar-collapse.show,
  body.chat-professional > .chat-pro-nav.pro-nav-chat-context .navbar-collapse.collapsing {
    display: block !important;
  }

  /* Área útil del chat: termina exactamente encima de la barra PWA. */
  body.chat-user > .chat-shell,
  body.chat-professional > .chat-shell {
    box-sizing: border-box !important;
    position: absolute !important;
    top: var(--maapo-chat-topbar-h) !important;
    right: 0 !important;
    bottom: var(--maapo-chat-appnav-h) !important;
    left: 0 !important;
    z-index: 2 !important;
    display: grid !important;
    grid-template-rows: var(--maapo-chat-contact-h) minmax(0, 1fr) !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 4px 0 0 !important;
    overflow: hidden !important;
  }

  body.chat-user .chat-head,
  body.chat-professional .chat-head {
    box-sizing: border-box !important;
    position: relative !important;
    inset: auto !important;
    z-index: 8 !important;
    display: grid !important;
    grid-template-columns: 40px minmax(0,1fr) auto !important;
    align-items: center !important;
    width: auto !important;
    height: 54px !important;
    min-height: 54px !important;
    max-height: 54px !important;
    margin: 0 8px 4px !important;
    padding: 5px 7px !important;
    gap: 7px !important;
    overflow: hidden !important;
    border-radius: 15px !important;
  }

  body.chat-user .chat-head img,
  body.chat-professional .chat-head img {
    width: 38px !important;
    height: 38px !important;
    border-radius: 11px !important;
  }

  body.chat-user .chat-head h1,
  body.chat-professional .chat-head h1 {
    display: -webkit-box !important;
    max-width: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    font-size: .84rem !important;
    line-height: 1.02 !important;
    text-overflow: ellipsis !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
  }

  body.chat-user .chat-head .small-muted,
  body.chat-professional .chat-head .small-muted {
    font-size: .61rem !important;
    line-height: 1 !important;
  }

  body.chat-user .chat-head-actions,
  body.chat-professional .chat-head-actions {
    min-width: 0 !important;
    margin: 0 !important;
    gap: 3px !important;
    flex-wrap: nowrap !important;
  }

  body.chat-user .chat-head-actions .btn,
  body.chat-professional .chat-head-actions .btn {
    min-height: 31px !important;
    margin: 0 !important;
    padding: .27rem .43rem !important;
    border-radius: 10px !important;
    font-size: .68rem !important;
    white-space: nowrap !important;
  }

  body.chat-user .chat-layout,
  body.chat-professional .chat-layout {
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
  }

  body.chat-user .chat-panel,
  body.chat-professional .chat-panel {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-rows: minmax(0,1fr) auto auto !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    border-radius: 0 !important;
  }

  body.chat-user .messages,
  body.chat-professional .messages {
    box-sizing: border-box !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    touch-action: pan-y !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 9px 9px 14px !important;
    scroll-padding-bottom: 16px !important;
  }

  body.chat-user .chat-utility-bar,
  body.chat-professional .chat-utility-bar {
    box-sizing: border-box !important;
    position: relative !important;
    inset: auto !important;
    z-index: 8 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: 100% !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 4px 8px 3px !important;
    background: linear-gradient(180deg,rgba(245,251,255,.35),#fff) !important;
  }

  body.chat-user .chat-utility-bar .btn,
  body.chat-professional .chat-utility-bar .btn {
    width: auto !important;
    max-width: calc(100% - 8px) !important;
    min-height: 39px !important;
    margin: 0 !important;
    padding: .48rem .78rem !important;
    border-radius: 13px !important;
    font-size: .82rem !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
  }

  body.chat-user .composer,
  body.chat-professional .composer {
    box-sizing: border-box !important;
    position: relative !important;
    inset: auto !important;
    z-index: 9 !important;
    display: flex !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    min-height: 58px !important;
    margin: 0 !important;
    padding: 7px 8px !important;
    background: #fff !important;
    box-shadow: 0 -7px 20px rgba(7,31,63,.07) !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body.chat-user .composer textarea,
  body.chat-professional .composer textarea {
    display: block !important;
    min-width: 0 !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 88px !important;
  }

  body.chat-user .composer .btn-main,
  body.chat-professional .composer .btn-main {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 46px !important;
    width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body.chat-user .side-panel,
  body.chat-professional .side-panel {
    bottom: var(--maapo-chat-appnav-h) !important;
  }
}

@media (max-width: 370px) {
  body.chat-user .chat-head-actions .btn span,
  body.chat-professional .chat-head-actions .btn span { display: none !important; }
  body.chat-user .chat-head-actions .btn,
  body.chat-professional .chat-head-actions .btn { width: 32px !important; padding: 0 !important; }
}

/* Navegación compacta para los módulos de geolocalización. */
body.client-geo-map-page .mb-main-nav,
body.professional-geo-page .chat-pro-nav,
body.geo-service-page .mb-main-nav,
body.geo-service-page .chat-pro-nav {
    position: fixed !important;
    inset: 0 0 auto 0 !important;
    z-index: 1040 !important;
    min-height: 72px !important;
    height: 72px !important;
    padding: 9px 0 !important;
    background: rgba(255,255,255,.98) !important;
    border-bottom: 1px solid #dbeafe !important;
    box-shadow: 0 8px 24px rgba(7,31,61,.06) !important;
}
body.client-geo-map-page .mb-main-nav .navbar-brand,
body.professional-geo-page .chat-pro-nav .navbar-brand,
body.geo-service-page .navbar-brand {
    min-width: 0 !important;
    padding: 0 !important;
    margin-right: 18px !important;
}
body.client-geo-map-page .mb-main-nav .navbar-brand img,
body.geo-service-page .mb-main-nav .navbar-brand img {
    width: 118px !important;
    max-width: 118px !important;
    height: 36px !important;
    object-fit: contain !important;
}
body.professional-geo-page .chat-pro-nav .pro-brand-picture img,
body.geo-service-page .chat-pro-nav .pro-brand-picture img {
    width: auto !important;
    max-width: 118px !important;
    height: 34px !important;
    object-fit: contain !important;
}
body.client-geo-map-page .navbar-toggler,
body.geo-service-page .mb-main-nav .navbar-toggler {
    width: 46px !important;
    height: 46px !important;
    padding: 0 !important;
    border: 1px solid #d8e8f8 !important;
    border-radius: 14px !important;
    background: #fff !important;
}
@media (max-width: 991.98px) {
    body.client-geo-map-page .mb-main-nav .navbar-brand img,
    body.geo-service-page .mb-main-nav .navbar-brand img {
        width: 112px !important;
        max-width: 112px !important;
        height: 34px !important;
    }
    body.professional-geo-page .chat-pro-nav .pro-brand-picture img,
    body.geo-service-page .chat-pro-nav .pro-brand-picture img {
        width: 36px !important;
        max-width: 36px !important;
        height: 36px !important;
    }
    body.client-geo-map-page .mb-main-nav .navbar-collapse,
    body.geo-service-page .mb-main-nav .navbar-collapse,
    body.professional-geo-page .chat-pro-nav .navbar-collapse,
    body.geo-service-page .chat-pro-nav .navbar-collapse {
        position: absolute !important;
        top: 72px !important;
        left: 10px !important;
        right: 10px !important;
        width: auto !important;
        padding: 12px !important;
        border: 1px solid #dbeafe !important;
        border-radius: 18px !important;
        background: #fff !important;
        box-shadow: 0 18px 42px rgba(7,31,61,.16) !important;
    }
}

/* ================================================================
   Corrección global 2026-07-25: menús móviles completos y desplazables.
   Evita que la barra inferior de la PWA o las cuentas desplegadas oculten
   acciones como "Cerrar sesión".
   ================================================================ */
@media (max-width: 991.98px) {
    .mb-main-nav .navbar-collapse,
    .chat-pro-nav .navbar-collapse {
        overscroll-behavior: contain !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .mb-main-nav .navbar-collapse.show,
    .mb-main-nav .navbar-collapse.collapsing,
    .chat-pro-nav .navbar-collapse.show,
    .chat-pro-nav .navbar-collapse.collapsing {
        max-height: calc(100dvh - 72px - 86px - env(safe-area-inset-bottom, 0px)) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        scrollbar-gutter: stable !important;
        padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
    }

    .mb-main-nav .navbar-collapse > .navbar-nav,
    .mb-main-nav .maapo-auth-nav,
    .chat-pro-nav .navbar-collapse > .navbar-nav,
    .chat-pro-nav .pro-nav-secondary {
        flex: 0 0 auto !important;
    }

    .mb-main-nav .navbar-collapse .nav-link,
    .chat-pro-nav .navbar-collapse .nav-link {
        min-height: 42px !important;
        padding-top: .58rem !important;
        padding-bottom: .58rem !important;
    }

    .mb-main-nav .maapo-auth-nav .dropdown-menu,
    .mb-main-nav .maapo-auth-nav .dropdown-menu.show {
        position: static !important;
        inset: auto !important;
        transform: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-height: none !important;
        margin: 7px 0 4px !important;
        overflow: visible !important;
        border-radius: 16px !important;
    }

    .mb-main-nav .maapo-auth-nav .dropdown-item,
    .mb-main-nav .maapo-auth-nav .dropdown-item-text {
        white-space: normal !important;
    }

    .mb-main-nav .maapo-account-logout-wrap {
        margin-bottom: 6px !important;
    }

    body.client-geo-map-page .mb-main-nav .navbar-collapse,
    body.geo-service-page .mb-main-nav .navbar-collapse,
    body.professional-geo-page .chat-pro-nav .navbar-collapse,
    body.geo-service-page .chat-pro-nav .navbar-collapse {
        max-height: calc(100dvh - 84px - 86px - env(safe-area-inset-bottom, 0px)) !important;
        overflow-y: auto !important;
    }
}
@media (max-width: 991.98px) {
    .mb-main-nav .maapo-account-logout-wrap {
        position: sticky !important;
        bottom: 0 !important;
        z-index: 3 !important;
        padding-bottom: 4px !important;
        background: #fff !important;
    }
}

/* Contador de solicitudes geolocalizadas pendientes */
[data-geo-service-nav] { position:relative; }
.maapo-geo-service-badge {
  display:inline-flex;
  min-width:19px;
  height:19px;
  align-items:center;
  justify-content:center;
  margin-left:.25rem;
  padding:0 5px;
  border:2px solid #fff;
  border-radius:999px;
  background:#e92342;
  color:#fff;
  box-shadow:0 4px 10px rgba(196,18,47,.2);
  font-size:.63rem;
  font-weight:900;
  line-height:1;
  vertical-align:middle;
}
.maapo-geo-service-badge[hidden] { display:none !important; }
@media(max-width:991.98px){
  .maapo-geo-service-badge { margin-left:auto; }
}

/* Badge rojo de solicitudes: visible también sobre el ícono inferior de la PWA. */
html.mbaappo-is-installed.maapo-has-app-bottom-nav [data-app-nav-key="geo-services"] {
  position:relative !important;
}
html.mbaappo-is-installed.maapo-has-app-bottom-nav [data-app-nav-key="geo-services"] > .mbaappo-app-bottom-badge {
  top:4px !important;
  left:calc(50% + 7px) !important;
  z-index:8 !important;
  min-width:20px !important;
  height:20px !important;
  background:#e92342 !important;
  color:#fff !important;
  border:2px solid #fff !important;
}

/* ================================================================
   Corrección 2026-07-25: navegación sobre el chat geolocalizado.
   El detalle móvil queda debajo del encabezado y de la barra PWA.
   ================================================================ */
body.geo-service-page .mb-main-nav,
body.geo-service-page .chat-pro-nav {
  z-index: 1300 !important;
}

@media (max-width: 991.98px) {
  body.geo-service-page .mb-main-nav .navbar-collapse,
  body.geo-service-page .chat-pro-nav .navbar-collapse,
  body.geo-service-page .mb-main-nav .navbar-collapse.collapsing,
  body.geo-service-page .chat-pro-nav .navbar-collapse.collapsing {
    z-index: 1310 !important;
  }
}

html.mbaappo-is-installed.maapo-has-app-bottom-nav body.geo-service-page .mbaappo-app-bottom-nav {
  z-index: 1260 !important;
}

/* ================================================================
   Corrección escritorio ancho: evita que los enlaces públicos se
   monten sobre notificaciones o la cuenta del usuario.
   ================================================================ */
@media (min-width: 992px) {
  body.geo-service-page .mb-main-nav > .container,
  .mb-main-nav > .container {
    max-width: min(1580px, calc(100% - 20px)) !important;
    width: 100% !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .mb-main-nav .navbar-collapse {
    display: flex !important;
    align-items: center !important;
    min-width: 0 !important;
    gap: .3rem !important;
  }

  .mb-main-nav .navbar-collapse > .navbar-nav:first-child {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    margin-right: .25rem !important;
  }

  .mb-main-nav .navbar-brand {
    margin-right: clamp(8px, 1vw, 16px) !important;
  }

  .mb-main-nav .navbar-brand img {
    max-width: 112px !important;
  }

  .mb-main-nav .nav-link {
    font-size: clamp(.76rem, .78vw, .9rem) !important;
    padding-left: clamp(.34rem, .52vw, .65rem) !important;
    padding-right: clamp(.34rem, .52vw, .65rem) !important;
    white-space: nowrap !important;
  }

  .mb-main-nav .maapo-auth-nav {
    flex: 0 0 auto !important;
    min-width: 0 !important;
    margin-left: .25rem !important;
  }

  .mb-main-nav .maapo-auth-nav .login-link {
    max-width: 168px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
}

@media (min-width: 992px) and (max-width: 1260px) {
  .mb-main-nav .nav-link {
    font-size: .74rem !important;
    padding-left: .3rem !important;
    padding-right: .3rem !important;
  }

  .mb-main-nav .maapo-auth-nav .login-link {
    max-width: 130px !important;
  }
}
