/* ==========================================================================
   BTA33KAR - UI-P2D-A2 - mobile listing map expansion (Option A).

   Gate: UI-P2D-A1, 2026-09-18. In-flow expansion with a deliberate scroll.
   Deliberately NOT a modal: no backdrop, no body scroll lock, no inert
   background, no reserved-height placeholder, no focus trap.

   Immutable path. This file is never edited in place once published - a
   correction ships as css/bta-map-expand-1.1.css and the registration in
   platform/themes/flex-home/functions/fixes-assets.php moves to it.
   ========================================================================== */

/* 1. TOGGLE - hidden at every width by default. The mobile listing rule below
      is the only thing that reveals it, so a browser without :has() support
      simply never shows the control and the map keeps its static P2C height.

      Physically top-right in BOTH directions, not inline-end: Leaflet places
      its controls physically, so the zoom cluster is physical-LEFT in LTR and
      RTL alike, and UI-P2D-B1 moved the RTL attribution to physical
      bottom-left. Physical top-right is therefore the only corner that is free
      in both languages. Measured 0 px2 overlap against zoom, attribution, the
      phone CTA and back-to-top in all six mobile cells. */
#bta-map-toggle {
    display: none;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 1000;
    min-inline-size: 44px;
    min-block-size: 44px;
    align-items: center;
    justify-content: center;
    padding-inline: 12px;
    padding-block: 0;
    border: 1px solid rgba(0, 0, 0, .18);
    border-radius: 8px;
    background: #fff;
    color: #063a5d;
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    cursor: pointer;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .25);
    white-space: nowrap;
}

/* 2. FOCUS RING - the UI-P2D-B1 ring, repeated here so the control carries it
      without depending on another sheet's selector list. */
#bta-map-toggle:focus-visible {
    outline: solid 3px #063a5d;
    outline-offset: 2px;
    box-shadow: 0 0 0 2px #fff;
}

/* 3. POSITIONING ANCESTOR - the wrapper already carries an inline
      position:relative from the immutable listing partial, which wins over
      this rule. This exists only so the toggle keeps its anchor if that inline
      style is ever removed; it is never the active declaration today. */
#properties-map-horizontal {
    position: relative;
}

/* 4. MOBILE LISTING SCOPE - body:has(#properties-list) keeps this off the
      projects listing, the homepage shortcodes and the detail pages, all of
      which share other partials. Wrapped in @supports so engines without
      :has() degrade to "no toggle, static map" rather than to a broken state.

      The expanded height needs !important: bta-listing.css section 9 pins the
      mobile map with
        #properties-list #map { block-size: clamp(280px,40svh,320px) !important }
      This selector carries three ID-level components against that rule's two,
      so it wins at !important parity. min-block-size/min-height are zeroed for
      the same reason section 9 zeroes them - style.css sets an unconditional
      #map{min-height:730px}. */
@supports selector(:has(*)) {
    @media (max-width: 767.98px) {
        body:has(#properties-list) #bta-map-toggle {
            display: inline-flex;
        }

        body:has(#properties-list) #properties-map-horizontal.bta-map-expanded #map {
            block-size: 70svh !important;
            height: 70svh !important;
            min-block-size: 0 !important;
            min-height: 0 !important;
        }
    }
}