/* Mobile layout corrections shared by the storefront, product pages and admin. */
html{width:100%;max-width:100%;overflow-x:clip}
body{min-width:320px;max-width:100%;overflow-x:clip}
img,video,canvas,svg{max-width:100%}
@media(max-width:680px){
  .site-header{width:100%;gap:8px;padding:9px 12px}
  .site-header .brand img{width:96px}
  .site-header .account-open,.site-header .cart-open{font-size:10px;padding:8px 9px}
  .site-header .header-search{min-width:0}
  .category-nav{width:100%;overflow-x:auto!important;overflow-y:hidden!important;justify-content:flex-start!important;gap:5px!important;padding:0 10px!important;scrollbar-width:none}
  .category-nav::-webkit-scrollbar{display:none}
  .category-nav .nav-chip[href]{display:inline-flex!important;flex:none!important;padding:7px 8px!important;font-size:10px!important}
  .category-nav .all-categories,.category-nav .nav-design{flex:none!important}
  .category-section .category-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;overflow:visible!important}
  .category-section .category-card{display:flex!important;position:relative!important;align-items:flex-start!important;justify-content:space-between!important;width:100%!important;height:auto!important;min-height:145px!important;aspect-ratio:auto!important;flex-direction:column!important;padding:12px!important;border-radius:10px!important}
  .category-section .category-card .category-label{display:block!important;order:0!important;max-width:100%!important;font-size:12px!important;line-height:1.25!important;font-weight:800!important}
  .category-section .category-card img{display:block!important;align-self:flex-end!important;width:clamp(70px,23vw,104px)!important;height:clamp(70px,23vw,104px)!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important}
  .category-section .category-card span{display:block!important}
  .product-detail-dialog{width:calc(100% - 16px)!important;max-width:none!important;max-height:calc(100dvh - 16px)!important;overflow-y:auto!important;padding:15px!important}
  .detail-main-image{max-width:100%;overflow:hidden}
  .detail-main-image img{max-width:100%;object-fit:contain}
  .detail-thumbnails{max-width:100%;overflow-x:auto}
  .detail-actions{position:sticky;bottom:0;background:#fff;padding:8px 0 calc(8px + env(safe-area-inset-bottom));z-index:2}
  .cp-header,.cp-footer{max-width:100%;padding-left:14px;padding-right:14px}
  .cp-hero,.cp-products,.cp-bottom{max-width:calc(100% - 24px)}
  .cp-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cp-card,.cp-card-body{min-width:0}
  .cp-card h3,.cp-card p{overflow-wrap:anywhere}
  .dash-head{max-width:100%;overflow:hidden}
  .dash{width:100%;max-width:100%;overflow:hidden}
  .admin-nav{max-width:100%;overflow-x:auto}
  .wrap{max-width:100%}
  input,select,textarea,button{max-width:100%}
}
@media(max-width:380px){
  .site-header .brand img{width:82px}
  .site-header .account-open,.site-header .cart-open{padding:7px;font-size:9px}
  .category-section .category-card{min-height:128px!important;padding:9px!important}
  .category-section .category-card .category-label{font-size:11px!important}
  .cp-card-actions button{white-space:normal}
}

/* 2026-10-13: case-study mobile layout repair */
@media (max-width: 850px) {
  .case-section,.case-section.wrap{min-width:0!important;max-width:calc(100% - 28px)!important;margin-left:auto!important;margin-right:auto!important}
  .case-layout{display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%!important;gap:16px!important}
  .case-preview-panel,.case-list-panel{width:100%!important;min-width:0!important;max-width:100%!important;box-sizing:border-box!important}
  .case-preview-panel{display:flex!important;flex-direction:column!important;align-items:stretch!important}
  .case-preview-panel .case-step,.case-preview-panel h3,.case-preview-panel>p,.case-preview-panel>.button,.case-privacy,.case-mini-preview{grid-column:auto!important;grid-row:auto!important;max-width:100%!important}
  .case-mini-preview{width:100%!important;height:auto!important;aspect-ratio:16/10;min-height:0!important;margin-top:18px!important}
  .case-mini-preview>img{width:100%!important;height:100%!important;object-fit:contain!important}
  .case-list{width:100%!important;min-width:0!important}
  .case-list-item{width:100%!important;min-width:0!important;grid-template-columns:64px minmax(0,1fr) 22px!important}
  .case-item-main{min-width:0!important;overflow-wrap:break-word!important}
  .case-item-main b,.case-item-main small,.case-item-main em{overflow-wrap:break-word!important;word-break:normal!important;white-space:normal!important}
}
@media (max-width:620px){
  .case-preview-panel{padding:20px!important}
  .case-list-panel{padding:18px 14px!important}
  .case-list-item{grid-template-columns:58px minmax(0,1fr) 20px!important;gap:10px!important}
  .case-preview-panel h3{font-size:clamp(22px,6vw,28px)!important}
  .case-mini-preview .logo-preview{width:70px!important;height:43px!important}
}
