
/* Final shared mobile rules, loaded after legacy page and navbar styles. */
@media(max-width:900px){
 html:has(body:not(.backend-ui)){overflow-x:clip}
 body:not(.backend-ui){margin:0;min-width:0;width:100%;overflow-x:clip}
 body:not(.backend-ui) .global-trust-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 body:not(.backend-ui) .gts-item{min-width:0;padding:12px 10px;gap:8px}
 body:not(.backend-ui) .gts-item>div{min-width:0;overflow-wrap:anywhere}
 body:not(.backend-ui) .gts-icon{width:34px;height:34px;flex-shrink:0}
 body:not(.backend-ui) .filter-bar,body:not(.backend-ui) .fb-left,body:not(.backend-ui) .fb-right{flex-wrap:wrap;min-width:0;max-width:100%;gap:8px}
 body:not(.backend-ui) .fb-right{flex:1 1 100%}
 body:not(.backend-ui) .fb-select-sort{min-width:0;flex:1 1 120px}
 body:not(.backend-ui) .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));min-width:0}
 body:not(.backend-ui) .product-card{min-width:0;max-width:100%;transform:none!important}
 body:not(.backend-ui) .product-card h3,body:not(.backend-ui) .product-card p{overflow-wrap:anywhere}
 body:not(.backend-ui) .category-menu{max-width:calc(100vw - 24px);max-height:50dvh;overflow-y:auto}
 html body:not(.backend-ui) .global-whatsapp-button{right:14px;bottom:calc(16px + env(safe-area-inset-bottom,0px));width:48px;height:48px;font-size:25px;z-index:5000;transform:none}
 html body:not(.backend-ui) .scroll-buttons{position:fixed;right:16px;bottom:calc(78px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:8px;z-index:5000}
 html body:not(.backend-ui) .scroll-buttons button{width:44px;height:44px;padding:0;display:flex!important;align-items:center;justify-content:center;font-size:17px;transform:none}
 html body:not(.backend-ui) .global-inquiry-float{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:max-content;max-width:calc(100% - 28px);min-height:44px;height:auto;margin:12px auto;border:1px solid #b68c32;border-radius:12px;padding:10px 18px;transform:none;display:flex;flex-direction:row;justify-content:center;box-shadow:none;z-index:auto}
 html body:not(.backend-ui) .global-inquiry-float span{display:block;writing-mode:horizontal-tb;transform:none}
 html body:not(.backend-ui) .cat-dropdown:not(.open):hover .cat-dropdown-menu{opacity:0;visibility:hidden;pointer-events:none}
 html body:not(.backend-ui) .cat-dropdown.open .cat-dropdown-menu{opacity:1;visibility:visible;pointer-events:auto}
 html body:not(.backend-ui) .global-inquiry-overlay{padding:10px;z-index:6000}
 html body:not(.backend-ui) .global-inquiry-box{width:100%;max-width:560px;max-height:calc(100dvh - 20px);min-height:0}
 html body:not(.backend-ui) .global-inquiry-header{flex-shrink:0;padding:14px}
 html body:not(.backend-ui) .global-inquiry-header h3{font-size:19px}
 html body:not(.backend-ui) .global-inquiry-close{flex-shrink:0;width:44px;height:44px}
 html body:not(.backend-ui) .global-inquiry-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:16px}
 html body:not(.backend-ui) .global-form-row,html body:not(.backend-ui) .global-check-grid{grid-template-columns:minmax(0,1fr)}
 html body:not(.backend-ui) .global-form-group{min-width:0}
 html body:not(.backend-ui) .global-form-group input,html body:not(.backend-ui) .global-form-group textarea{box-sizing:border-box;max-width:100%;font-size:16px}
 html body:not(.backend-ui) .global-contact-methods{flex-wrap:wrap}
 html body:not(.backend-ui) .global-inquiry-footer{position:sticky;bottom:-16px;margin:18px 0 0;padding:12px 0;gap:8px;flex-direction:column}
 html body:not(.backend-ui) .global-inquiry-footer button{width:100%;min-height:46px;flex:none}
 body.global-inquiry-open .global-whatsapp-button,body.global-inquiry-open .scroll-buttons,body.global-inquiry-open .global-inquiry-float,
 body:has(.mobile-menu.open) .global-whatsapp-button,body:has(.mobile-menu.open) .scroll-buttons,body:has(.mobile-menu.open) .global-inquiry-float{visibility:hidden}
}
@media(max-width:359px){body:not(.backend-ui) .product-grid{grid-template-columns:minmax(0,1fr)}}

.drone-dropdown-toggle svg{width:11px;height:11px;flex-shrink:0}.global-whatsapp-button svg,.global-inquiry-float svg,.scroll-buttons svg{display:block;flex-shrink:0}
.navbar-main .drone-dropdown-toggle svg{display:block;width:14px;height:14px;stroke:currentColor;transition:transform .2s;pointer-events:none}
.navbar-main .cat-dropdown.open .drone-dropdown-toggle svg{transform:rotate(180deg)}
.global-whatsapp-button svg{width:28px;height:28px;color:#fff}
@media(max-width:900px){
 .navbar-main .drone-dropdown-toggle{min-width:44px;min-height:44px;padding:10px;color:#fff}
}

/* Center the SVG independently of legacy button padding and inline display styles. */
html body:not(.backend-ui) .scroll-buttons button { position:relative; padding:0; }
html body:not(.backend-ui) .scroll-buttons button svg {
 position:absolute;left:50%;top:50%;margin:0;
 width:22px;height:22px;transform:translate(-50%,-50%);pointer-events:none;
}

/* Compact storefront cards and viewport-mounted touch menus. */
@media(max-width:600px){
 body:not(.backend-ui) .product-card .product-img-wrap{height:150px;min-height:0;}
 body:not(.backend-ui) .product-card .product-img-wrap img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;}
}
@media(max-width:900px){
 body > .cat-dropdown-menu.mobile-category-open{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important;z-index:10000;white-space:normal;max-height:calc(100vh - var(--mobile-dropdown-top,145px) - 16px)!important;max-height:calc(100dvh - var(--mobile-dropdown-top,145px) - 16px)!important;-webkit-overflow-scrolling:touch;}
 .navbar-main .drone-dropdown-toggle{display:flex!important;flex:0 0 44px;visibility:visible!important;opacity:1!important;-webkit-appearance:none;touch-action:manipulation;}
}

/* Keep all three checkout stages inside narrow screens. */
@media(max-width:600px){
 body:not(.backend-ui) .checkout-progress-wrap{padding:14px 12px;}
 body:not(.backend-ui) .checkout-progress{display:grid;grid-template-columns:minmax(0,1fr) 10px minmax(0,1fr) 10px minmax(0,1fr);align-items:center;gap:4px;width:100%;padding:0;box-sizing:border-box;}
 body:not(.backend-ui) .checkout-progress .cp-step{min-width:0;flex-direction:column;justify-content:center;gap:6px;padding:8px 4px;font-size:11px;line-height:1.3;text-align:center;border-radius:12px;}
 body:not(.backend-ui) .checkout-progress .cp-step > span{white-space:normal;overflow-wrap:normal;}
 body:not(.backend-ui) .checkout-progress .cp-num{width:26px;height:26px;}
 body:not(.backend-ui) .checkout-progress .cp-arrow{margin:0;font-size:10px;justify-self:center;}
}
