/* [cazrom_search] : phone layout.
 * Enqueued with a media attribute of (max-width: Elementor's mobile breakpoint) , so there is no
 * media query in here. On a phone the pop-up is the whole screen. */

:is(.czs, .czs-pop) .czs-bar { height: 46px; padding-left: 16px; }
:is(.czs, .czs-pop) .czs-submit { width: 36px; height: 36px; }
.czs-panel { top: 0; left: 0; width: 100%; height: 100%; max-height: none; border-radius: 0; box-shadow: none; transform: translateY(-10px); }
.czs-head { gap: 8px; padding: 10px 10px 10px 12px; }
.czs-pop .czs-x { width: 40px; height: 40px; }
.czs-body { gap: 20px; padding: 8px 14px calc(20px + env(safe-area-inset-bottom, 0px)); }
/* still one row : it scrolls sideways */
.czs-products { display: flex; gap: 12px; margin: 0 -14px; padding: 0 14px 4px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; }
.czs-products::-webkit-scrollbar { display: none; }
.czs-card { flex: 0 0 44%; scroll-snap-align: start; }