/*
 * GBZ420 - GBZ Search layer: touch floor on the compact / phone composition.
 *
 * The search family carries no maquette (CHARTE-GRAPHIQUE.md section 2, family B),
 * so the 44 x 44 px touch floor of section 4.4 is the governing rule for the
 * overlay controls. Measured on the local copy at 390 px before this layer:
 * close 40 x 40, back 32 x 32, popular chip 68 x 29.
 *
 * close / back: the box grows to 44 x 44 and a negative margin keeps the layout
 *    footprint (40 x 40 and 32 x 32), so the row height, the search field width
 *    and the position of both glyphs are identical to the previous rendering.
 *    The 44 px box stays clear of the search field (8 px header gap below
 *    1099 px): close spans 336..380, the field ends at 330, back spans 6..50 and
 *    the field starts at 52.
 * popular chips: the pill is the visible control, so the pill itself takes
 *    min-height 44 px. Horizontal padding, radius, border and label size are
 *    unchanged and the label stays optically centred in the taller pill.
 *
 * Every selector is qualified by .gbzs-root (0,2,0), so it wins over the module's
 * own .gbzs-* rules whatever order the cascade receives, and nothing outside the
 * search layer can match. Above 1099 px the composition is pointer-driven and
 * keeps the previous geometry untouched.
 * Owner: qa-search-touch-20260924 (mobile search overlay).
 */
@media (max-width: 1099px) {
    .gbzs-root .gbzs-close {
        width: 44px;
        height: 44px;
        margin: -2px;
    }

    .gbzs-root .gbzs-back {
        width: 44px;
        height: 44px;
        margin: -6px;
    }

    .gbzs-root .gbzs-popular-term {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
        padding-top: 0;
        padding-bottom: 0;
    }

    /* ---------------------------------------------------- filter sheet ---- */
    /* Header close: 36 x 36 -> 44 x 44. The negative margin keeps the 36 x 36
       footprint, so the sheet head, the result count and the X stay in place;
       4 px of extra reach land in the head's own padding. */
    .gbzs-root .gbzs-sheet-close {
        width: 44px;
        height: 44px;
        margin: -4px;
    }

    /* Footer reset: a transparent text button (103 x 15), so the box itself can
       take the floor: min-height 44 px with a -14.5 px vertical margin keeps the
       15 px footprint in the foot row and the label optically centred on the same
       baseline. Nothing is painted around the label, so no visual delta. */
    .gbzs-root .gbzs-sheet-clear {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
        margin: -14.5px 0;
    }

    /* Footer apply: the filled pill is a visible shape, so the pill keeps its
       39 px height and the 44 px target is carried by a centred pseudo-element
       (186.5 x 44). The extension is 2.5 px into the foot padding, where no other
       control lives, and the label does not move. */
    .gbzs-root .gbzs-sheet-apply {
        position: relative;
    }

    .gbzs-root .gbzs-sheet-apply::after {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        top: 50%;
        height: 44px;
        margin-top: -22px;
    }

    /* Recent-chip remove: 24 x 24 -> 44 x 44. Same pseudo-element technique, but
       the box is anchored on the 2 px gap between the label and the X instead of
       being centred: left -2 px makes the box start exactly at the label's right
       edge, so the query label keeps every pixel of its own target, and the
       remaining 18 px of reach fall in the chip's 4 px padding, the 1 px border,
       the 8 px row gap and the next chip's 12 px padding. The X glyph itself is
       untouched: the pseudo-element is invisible and carries no layout. */
    .gbzs-root .gbzs-chip-remove {
        position: relative;
    }

    .gbzs-root .gbzs-chip-remove::after {
        content: '';
        position: absolute;
        left: -2px;
        top: 50%;
        width: 44px;
        height: 44px;
        margin-top: -22px;
    }
}