/* Home/Catalog use the approved service bar only on tablet and mobile. */
#homeContactDock,#sddServiceBar{display:none!important}
#mobileService{display:none}
@media(max-width:1100px){
 #homeContactDock,#sddServiceBar{display:none!important}
 #mobileService{display:block;position:fixed;bottom:env(safe-area-inset-bottom,0px);left:0;right:0;z-index:60;padding:6px 10px 8px;font-family:'Noto Sans Thai',sans-serif}
 #mobileService>nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
 #mobileService>nav>a,#mobileService>nav>button{display:flex;align-items:center;justify-content:center;gap:4px;height:44px;min-width:0;padding:4px 2px;border:1px solid #ffffffa0;border-radius:9px;box-shadow:0 3px 12px #101a3b26;font:700 11px/1.3 'Noto Sans Thai',sans-serif;text-decoration:none;white-space:nowrap;cursor:pointer;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
 #mobileService svg{width:20px;height:20px;flex-shrink:0}#mobileService img{width:23px;height:23px;object-fit:contain}
 #mobileService .ms-line{background:#06c755f5;color:#fff}#mobileService .ms-contact{background:#ffffffe8;color:#101a3b;border-color:#d9dfe8}#mobileService .ms-ai{background:#d71932f5;color:white}
 #mobileContactPanel{position:absolute;bottom:calc(100% + 8px);left:10px;right:10px;padding:16px;background:#fffffff2;border:1px solid #ffffffcc;border-radius:16px;box-shadow:0 8px 28px #101a3b26;color:#101a3b;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);max-height:calc(100dvh - 100px);overflow:auto}
 #mobileContactPanel header{display:flex;justify-content:space-between;align-items:center}#mobileContactPanel header button{width:44px;height:44px;border:0;background:transparent;font-size:24px;cursor:pointer}#mobileContactPanel p{font-size:12px;color:#596078;margin:0 0 8px}#mobileContactPanel>a{display:flex;justify-content:space-between;align-items:center;min-height:48px;border-top:1px solid #e8ebf1;color:#101a3b;text-decoration:none;font-size:14px}.mobile-service-legal{display:flex;flex-wrap:wrap;gap:12px;border-top:1px solid #e8ebf1}.mobile-service-legal a{display:flex;align-items:center;min-height:44px;color:#596078;font-size:12px}
 #mobileService :focus-visible{outline:3px solid #2871cf;outline-offset:3px}body.sdd-overlay-open #mobileService{display:none}body.sdd-has-tray #mobileService{display:none}
 body:has(#mobileService){padding-bottom:calc(74px + env(safe-area-inset-bottom))}
}
@supports not (backdrop-filter:blur(1px)){#mobileContactPanel,#mobileService .ms-contact{background:white}}
@media(prefers-reduced-transparency:reduce){#mobileContactPanel,#mobileService .ms-contact{background:white}}
@media(max-width:370px){#mobileService>nav{grid-template-columns:.7fr 1fr 1.25fr;gap:5px}#mobileService>nav>a,#mobileService>nav>button{gap:3px}#mobileService svg{width:18px;height:18px}}
/* Compact visible faces: 36px, with transparent 44px touch targets. */
@media(max-width:1100px){
 #mobileService{padding:0 10px 2px}
 #mobileService>nav>a,#mobileService>nav>button{position:relative;isolation:isolate;background:transparent!important;border:0!important;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;height:44px}
 #mobileService>nav>a::before,#mobileService>nav>button::before{content:'';position:absolute;inset:4px 0;border:1px solid #ffffffa0;border-radius:8px;box-shadow:0 2px 8px #101a3b24;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:-1;pointer-events:none}
 #mobileService .ms-line::before{background:#06c755f5}#mobileService .ms-contact::before{background:#ffffffe8;border-color:#d9dfe8}#mobileService .ms-ai::before{background:#d71932f5}
}
@media(prefers-reduced-transparency:reduce){#mobileService .ms-contact::before{background:white}}

/* One bottom action surface while a purchase/compare overlay is active. */
body:has(#tray:not([hidden])) #mobileService,body:has(.pdp-dock) #mobileService,body:has(#sheet.on) #mobileService,body:has(#dlg.on) #mobileService{display:none!important}