/* DWe V18: iOS Safari / Chrome-on-iPhone responsive stabilization.
   Deliberately last in cascade. Desktop retains original Performance layout. */
@media screen and (max-width:850px){
 html,body{max-width:100%;overflow-x:hidden;overflow-x:clip}
 body{min-width:0}
 #builder.custom-wrap{width:calc(100% - 24px);max-width:100%;min-width:0}
 #builder .builder-layout,#builder .builder-main,#builder .builder-sidebar,
 #builder .builder-panel{min-width:0;max-width:100%}
 /* Keep quote/navigation in the document flow: iOS sticky layers occluded steps. */
 #builder .quote-sticky-wrap{position:static!important;top:auto!important;
  z-index:auto!important;transform:none!important;max-height:none!important;
  overflow:visible!important;box-shadow:0 3px 10px #0002}
 #builder .steps.step-track{position:static!important;top:auto!important;z-index:auto!important}
 #builder .builder-sidebar,#builder .builder-sidebar.collapsed{
  position:static!important;top:auto!important;left:auto!important;
  transform:none!important;z-index:auto!important;
  width:100%!important;max-height:none!important;height:auto!important;
  overflow:visible!important;order:-1;margin:0 0 12px}
 #builder .builder-sidebar.collapsed .sidebar-body{display:none!important}
 #builder .builder-sidebar:not(.collapsed) .sidebar-body{
  display:flex!important;max-height:none!important;height:auto!important;overflow:visible!important}
 #builder .sidebar-selections{overflow:visible!important}
 #builder .sidebar-toggle{display:inline-flex!important;min-height:42px;align-items:center;justify-content:center}
 #builder .builder-panel{scroll-margin-top:14px!important}
 #builder .package-option,#builder .bundle-group,#builder .option,
 #builder .finish-option,#builder .mode-card{min-width:0;max-width:100%}
 #builder .bundle-group-grid,#builder .package-list,#builder .option-grid,
 #builder .finish-grid,#builder .addon-list{min-width:0}
 #builder .package-option strong,#builder .bundle-group strong,#builder .mode-card strong{overflow-wrap:anywhere}
 /* Native modal is not used for phone review; More Info still works. */
 #builder .dwe-preview-dialog:not([open]),#builder .bundle-info-dialog:not([open]){display:none!important}
 #builder .bundle-info-dialog[open]{max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);max-width:calc(100vw - 20px);
  overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
}
@media screen and (max-width:600px){
 #builder .quote-sticky-reference{display:flex!important;flex-wrap:wrap!important;padding:11px 12px!important;gap:8px!important}
 #builder .quote-sticky-ident{width:100%;min-width:0;overflow-wrap:anywhere}
 #builder .quote-sticky-actions{width:100%;justify-content:flex-start}
 #builder .quote-sticky-actions .btn{min-height:42px;font-size:12px;padding:9px 13px}
 #builder .steps.step-track{grid-template-columns:repeat(6,minmax(0,1fr));padding:10px 3px}
 #builder .steps.step-track a.progress-step{min-width:0;padding:0 2px 3px}
 #builder .steps.step-track .progress-copy strong{font-size:10px;overflow-wrap:anywhere}
 #builder .builder-panel{padding:16px!important}
 #builder .bundle-group-grid,#builder .option-grid,#builder .mode-grid{grid-template-columns:1fr!important}
 #builder .finish-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 #builder .package-option{grid-template-columns:1fr!important}
 #builder .package-thumb{max-width:100%}
 #builder button,#builder .btn{touch-action:manipulation}
 #builder input,#builder textarea,#builder select{font-size:16px}
 #builder .review-line{min-width:0;flex-wrap:wrap}
 #builder .review-line b{margin-left:auto}
 .hero h1{font-size:clamp(40px,11vw,57px)!important}
}


/* V19: compact photographic bundle categories across desktop and phones. */
#builder .bundle-group-grid{gap:9px;align-items:stretch}
#builder .bundle-group-card .bundle-group{
 display:grid;grid-template-columns:108px minmax(0,1fr);column-gap:12px;
 align-items:center;align-content:center;min-height:96px;padding:10px 12px 4px;
}
#builder .bundle-group-kit-photo{
 grid-row:1/span 2;width:108px;height:86px;min-height:0;margin:0;
 border-radius:8px;
}
#builder .bundle-group-card .bundle-group strong{font-size:14px;line-height:1.28}
#builder .bundle-group-card .bundle-group small{font-size:11px;line-height:1.35;margin-top:4px}
#builder .bundle-group-card .bundle-more-info{margin:0 0 5px 122px;padding:4px 0;font-size:11px}
#builder #packages .package-detail{scroll-margin-top:154px}
@media screen and (max-width:850px){
 #builder #packages .package-detail{scroll-margin-top:12px}
}
@media screen and (max-width:600px){
 #builder .bundle-group-grid{gap:8px}
 #builder .bundle-group-card .bundle-group{
  grid-template-columns:78px minmax(0,1fr);column-gap:11px;
  min-height:84px;padding:9px 11px 3px;
 }
 #builder .bundle-group-kit-photo{width:78px;height:72px}
 #builder .bundle-group-card .bundle-group strong{font-size:14px}
 #builder .bundle-group-card .bundle-more-info{margin-left:100px}
}

/* V20: final factory kit choices shown directly as priced selection cards. */
#builder .direct-kit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#builder .direct-kit-tile{display:flex;flex-direction:column;min-width:0;background:#fff;border:1px solid #d9d9d9;border-radius:12px;overflow:hidden}
#builder .direct-kit-tile.active{border:2px solid #ed6928;background:#fff9f4;box-shadow:0 0 0 1px #ed6928}
#builder .direct-kit-main{display:grid;grid-template-columns:122px minmax(0,1fr);align-items:center;gap:12px;padding:12px;flex:1}
#builder .direct-kit-image{width:122px;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;background:#f9f9f9;border:1px solid #eee;border-radius:9px;overflow:hidden}
#builder .direct-kit-image img{display:block;width:100%;height:100%;object-fit:contain}
#builder .direct-kit-image.empty{font-size:11px;text-align:center;color:#888}
#builder .direct-kit-description{min-width:0}
#builder .direct-kit-description h4{font-size:15px;line-height:1.3;margin:4px 0 7px}
#builder .direct-kit-description .package-badges{margin:0 0 4px}
#builder .direct-kit-includes{list-style:none;padding:0;margin:0;display:grid;gap:3px}
#builder .direct-kit-includes li{font-size:11px;line-height:1.3;color:#555}
#builder .direct-kit-includes li::before{content:'✓';color:#bb4e17;font-weight:800;margin-right:5px}
#builder .direct-kit-footer{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px 9px;padding:10px 12px 12px;border-top:1px solid #ececec;align-items:center}
#builder .direct-kit-sku{color:#666;font:11px/1.3 ui-monospace,monospace;overflow-wrap:anywhere}
#builder .direct-kit-price{font-size:18px;color:#b84b13;white-space:nowrap}
#builder .direct-kit-actions{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:9px}
#builder .direct-kit-info{border:0;background:transparent;padding:8px 0;color:#a44714;text-decoration:underline;cursor:pointer;font-size:12px;font-weight:800}
#builder .direct-kit-select{border:1px solid #ee762f;background:#f36a25;color:#151515;border-radius:8px;min-height:40px;padding:8px 13px;font-size:12px;font-weight:900;cursor:pointer;touch-action:manipulation}
#builder .direct-kit-select.selected{background:#171717;border-color:#171717;color:white}
#builder .direct-kit-select:disabled{opacity:.55;cursor:wait}
#builder .direct-kit-select:focus-visible,#builder .direct-kit-info:focus-visible{outline:3px solid #f36a2580;outline-offset:2px}
@media(max-width:850px){#builder .direct-kit-grid{grid-template-columns:1fr}#builder .direct-kit-main{grid-template-columns:100px minmax(0,1fr)}#builder .direct-kit-image{width:100px}#builder .direct-kit-tile{width:100%;max-width:100%}}
@media(max-width:370px){#builder .direct-kit-main{grid-template-columns:86px minmax(0,1fr);gap:9px;padding:9px}#builder .direct-kit-image{width:86px}#builder .direct-kit-description h4{font-size:13px}}
@media print{#builder .direct-kit-grid{display:none!important}}
