/**
 * DPS Signature - Flatsome shell containment.
 *
 * Shared compatibility layer for DPS surfaces rendered inside the WordPress
 * Flatsome shell. The theme mobile right navigation can keep a desktop-sized
 * flex row alive below 600px; this constrains that shell only when a DPS
 * surface is present while keeping every menu item visible.
 *
 * @package Desi_Pet_Shower_Base
 */

@media (max-width: 600px) {
    body:has(:is(.dps-site-page, .dps-base-wrapper, .dps-client-detail, .dps-finance-app, .dps-client-portal, .dps-client-portal-access-page, .dps-ai-public-chat, .dps-dashboard-wrapper, .dps-agenda-admin-page, .dps-agenda-wrapper, .dps-registration-form, .dps-booking-form)) {
        overflow-x: clip;
    }

    body:has(:is(.dps-site-page, .dps-base-wrapper, .dps-client-detail, .dps-finance-app, .dps-client-portal, .dps-client-portal-access-page, .dps-ai-public-chat, .dps-dashboard-wrapper, .dps-agenda-admin-page, .dps-agenda-wrapper, .dps-registration-form, .dps-booking-form)) #wrapper,
    body:has(:is(.dps-site-page, .dps-base-wrapper, .dps-client-detail, .dps-finance-app, .dps-client-portal, .dps-client-portal-access-page, .dps-ai-public-chat, .dps-dashboard-wrapper, .dps-agenda-admin-page, .dps-agenda-wrapper, .dps-registration-form, .dps-booking-form)) #main {
        max-width: 100vw;
        overflow-x: clip;
    }

    body:has(:is(.dps-site-page, .dps-base-wrapper, .dps-client-detail, .dps-finance-app, .dps-client-portal, .dps-client-portal-access-page, .dps-ai-public-chat, .dps-dashboard-wrapper, .dps-agenda-admin-page, .dps-agenda-wrapper, .dps-registration-form, .dps-booking-form)) .header-main .flex-col.show-for-medium.flex-right {
        flex: 0 1 auto;
        min-width: 0;
        max-width: calc(100vw - 170px);
        overflow: visible;
    }

    body:has(:is(.dps-site-page, .dps-base-wrapper, .dps-client-detail, .dps-finance-app, .dps-client-portal, .dps-client-portal-access-page, .dps-ai-public-chat, .dps-dashboard-wrapper, .dps-agenda-admin-page, .dps-agenda-wrapper, .dps-registration-form, .dps-booking-form)) .header-main .mobile-nav.nav-right {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-end;
        gap: 0 6px;
        min-width: 0;
        max-width: 100%;
        overflow: visible;
        white-space: normal;
    }

    body:has(:is(.dps-site-page, .dps-base-wrapper, .dps-client-detail, .dps-finance-app, .dps-client-portal, .dps-client-portal-access-page, .dps-ai-public-chat, .dps-dashboard-wrapper, .dps-agenda-admin-page, .dps-agenda-wrapper, .dps-registration-form, .dps-booking-form)) .header-main .mobile-nav.nav-right > li {
        flex: 0 1 auto;
        max-width: 100%;
    }

    body:has(:is(.dps-site-page, .dps-base-wrapper, .dps-client-detail, .dps-finance-app, .dps-client-portal, .dps-client-portal-access-page, .dps-ai-public-chat, .dps-dashboard-wrapper, .dps-agenda-admin-page, .dps-agenda-wrapper, .dps-registration-form, .dps-booking-form)) .header-main .mobile-nav.nav-right .nav-top-link {
        min-height: 32px;
        padding: 6px 5px;
        line-height: 1.15;
        white-space: normal;
    }
}

@media (max-width: 480px) {
    body:has(:is(.dps-site-page, .dps-base-wrapper, .dps-client-detail, .dps-finance-app, .dps-client-portal, .dps-client-portal-access-page, .dps-ai-public-chat, .dps-dashboard-wrapper, .dps-agenda-admin-page, .dps-agenda-wrapper, .dps-registration-form, .dps-booking-form)) .header-main .flex-col.show-for-medium.flex-right {
        max-width: calc(100vw - 140px);
    }

    body:has(:is(.dps-site-page, .dps-base-wrapper, .dps-client-detail, .dps-finance-app, .dps-client-portal, .dps-client-portal-access-page, .dps-ai-public-chat, .dps-dashboard-wrapper, .dps-agenda-admin-page, .dps-agenda-wrapper, .dps-registration-form, .dps-booking-form)) .header-main .mobile-nav.nav-right {
        gap: 0 4px;
    }

    body:has(:is(.dps-site-page, .dps-base-wrapper, .dps-client-detail, .dps-finance-app, .dps-client-portal, .dps-client-portal-access-page, .dps-ai-public-chat, .dps-dashboard-wrapper, .dps-agenda-admin-page, .dps-agenda-wrapper, .dps-registration-form, .dps-booking-form)) .header-main .mobile-nav.nav-right .nav-top-link {
        padding-right: 4px;
        padding-left: 4px;
        font-size: 0.72rem;
    }
}