/* ============================================================
   RIC MASJID EXPLORER
   IPHONE BOTTOM SHEET V2

   Mobile-only presentation authority.
   Desktop behavior is intentionally untouched.
   ============================================================ */

@media (max-width:800px){

    /*
     * Use dynamic viewport units so Safari's expanding/collapsing
     * browser chrome does not produce the old oversized card.
     */
    .ric-masjid-v12 .ric-masjid-workspace{
        position:relative !important;

        height:78dvh !important;
        min-height:560px !important;
        max-height:820px !important;

        overflow:hidden !important;
    }


    /*
     * LOCATION
     * Keep location context compact and readable.
     */
    .ric-masjid-v12 #ricMasjidLocationContext,
    .ric-masjid-v12 .ric-location-context{
        top:10px !important;
        left:12px !important;
        right:12px !important;

        width:auto !important;
        max-width:none !important;

        min-height:48px !important;
        max-height:64px !important;

        overflow:hidden !important;

        z-index:70 !important;
    }


    /*
     * SELECTED MASJID
     *
     * This rule intentionally comes after every V12 stylesheet.
     * It supersedes the legacy 58%-height mobile card.
     */
    .ric-masjid-v12 #ricMasjidProfile,
    .ric-masjid-v12 .ric-masjid-profile{
        position:absolute !important;

        top:auto !important;

        left:10px !important;
        right:10px !important;

        bottom:max(
            10px,
            env(safe-area-inset-bottom)
        ) !important;

        width:auto !important;
        max-width:none !important;

        /*
         * Compact default sheet.
         * Enough for identity + directions while preserving map.
         */
        height:auto !important;
        min-height:0 !important;

        max-height:min(
            34dvh,
            290px
        ) !important;

        margin:0 !important;

        border-radius:24px !important;

        overflow:hidden !important;

        box-shadow:
            0 14px 40px rgba(0,0,0,.20) !important;

        z-index:80 !important;

        overscroll-behavior:contain;
    }


    /*
     * Inner content scrolls instead of increasing sheet height.
     */
    .ric-masjid-v12 #ricMasjidProfileInner,
    .ric-masjid-v12 .ric-masjid-profile-inner{
        max-height:calc(
            min(34dvh,290px) - 24px
        ) !important;

        overflow-y:auto !important;
        overflow-x:hidden !important;

        -webkit-overflow-scrolling:touch;

        overscroll-behavior:contain;

        padding-bottom:max(
            18px,
            env(safe-area-inset-bottom)
        ) !important;
    }


    /*
     * Native-style drag affordance.
     */
    .ric-masjid-v12 .ric-mobile-handle{
        display:block !important;

        width:42px !important;
        height:5px !important;

        margin:8px auto 6px !important;

        border-radius:999px !important;

        background:rgba(18,57,48,.24) !important;

        flex:0 0 auto !important;
    }


    /*
     * Selected identity should consume much less vertical space.
     */
    .ric-masjid-v12 .ric-profile-id{
        margin-top:4px !important;
        margin-bottom:6px !important;

        font-size:11px !important;
        line-height:1.2 !important;
    }

    .ric-masjid-v12 .ric-profile-name{
        margin-top:4px !important;
        margin-bottom:5px !important;

        font-size:clamp(
            22px,
            6vw,
            29px
        ) !important;

        line-height:1.08 !important;
    }

    .ric-masjid-v12 .ric-profile-location{
        margin-top:0 !important;
        margin-bottom:10px !important;

        font-size:15px !important;
        line-height:1.35 !important;
    }


    /*
     * Directions remain immediately available.
     */
    .ric-masjid-v12 .ric-profile-actions{
        display:grid !important;

        grid-template-columns:
            repeat(2,minmax(0,1fr)) !important;

        gap:8px !important;

        margin:10px 0 12px !important;
    }

    .ric-masjid-v12 .ric-profile-actions a{
        min-height:48px !important;

        padding:10px 8px !important;

        border-radius:14px !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        text-align:center !important;

        font-size:15px !important;
        line-height:1.15 !important;
    }


    /*
     * Reduce vertical whitespace in detail sections.
     */
    .ric-masjid-v12 .ric-profile-section{
        margin-top:12px !important;
        padding-top:12px !important;
    }

    .ric-masjid-v12 .ric-profile-section h4{
        margin:0 0 6px !important;

        font-size:17px !important;
        line-height:1.25 !important;
    }

    .ric-masjid-v12 .ric-profile-section p{
        margin:4px 0 !important;

        font-size:14px !important;
        line-height:1.4 !important;
    }


    /*
     * Results and profile must not compete for the same bottom
     * position. When a selected profile is open, prioritize it.
     */
    .ric-masjid-v12 #ricMasjidProfile.is-open
        ~ #ricMasjidResults{
        visibility:hidden !important;
        pointer-events:none !important;
    }


    /*
     * Map controls stay above map but below selected sheet.
     */
    .ric-masjid-v12 .ric-map-controls,
    .ric-masjid-v12 .ric-map-status,
    .ric-masjid-v12 .ric-adhan-dock{
        z-index:60 !important;
    }
}


/*
 * Narrow iPhones: SE / mini-size layouts.
 */
@media (max-width:390px){

    .ric-masjid-v12 #ricMasjidProfile,
    .ric-masjid-v12 .ric-masjid-profile{
        left:8px !important;
        right:8px !important;

        max-height:min(
            32dvh,
            255px
        ) !important;

        border-radius:20px !important;
    }

    .ric-masjid-v12 #ricMasjidProfileInner,
    .ric-masjid-v12 .ric-masjid-profile-inner{
        max-height:calc(
            min(32dvh,255px) - 22px
        ) !important;
    }

    .ric-masjid-v12 .ric-profile-name{
        font-size:22px !important;
    }

    .ric-masjid-v12 .ric-profile-actions a{
        min-height:44px !important;
        font-size:14px !important;
    }
}


/*
 * Landscape iPhone.
 */
@media
    (max-width:900px)
    and (orientation:landscape)
    and (max-height:500px){

    .ric-masjid-v12 .ric-masjid-workspace{
        height:82dvh !important;
        min-height:360px !important;
    }

    .ric-masjid-v12 #ricMasjidProfile,
    .ric-masjid-v12 .ric-masjid-profile{
        left:auto !important;
        right:10px !important;

        width:min(
            360px,
            46vw
        ) !important;

        max-height:calc(
            100dvh -
            env(safe-area-inset-top) -
            env(safe-area-inset-bottom) -
            40px
        ) !important;
    }

    .ric-masjid-v12 #ricMasjidProfileInner,
    .ric-masjid-v12 .ric-masjid-profile-inner{
        max-height:calc(
            100dvh -
            env(safe-area-inset-top) -
            env(safe-area-inset-bottom) -
            70px
        ) !important;
    }
}

/* RIC_IPHONE_BOTTOM_SHEET_V2_END */