/* The simple sticky header : phone layout.
 * Enqueued with a media attribute of (max-width: Elementor's mobile breakpoint) , so there is no
 * media query in here. Shorter , and only the logo , the search bar and the two icons. */

.czsh { height: 64px; max-height: 64px; }
.czsh .czsh-inner { gap: 12px; padding: 0 12px; }
/* the logo keeps its own width , the search bar takes what is left */
.czsh .czsh-logo { flex: none; max-width: 96px; }
.czsh .czsh-logo img { max-height: 36px; max-width: 96px; }
.czsh .czsh-logo span { font-size: 15px; max-width: 96px; overflow: hidden; text-overflow: ellipsis; }
.czsh .czsh-contact { gap: 12px; }
.czsh .czsh-link svg { width: 24px; height: 24px; }
/* the cart's list opens across the screen , under the header */
.czsh .czsh-cart { position: static; }
.czsh .czsh-pop { left: 10px; right: 10px; width: auto; }
/* the room the products page leaves for this header follows its height here */
.czp { --czp-header-offset: 64px !important; }