.detail-modal.detail-batch-active{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;max-height:88vh;overflow:hidden}.detail-batch-active>.detail-gallery,.detail-batch-active>.detail-info{min-height:0;overflow:auto;max-height:calc(88vh - 86px);overscroll-behavior:contain}.detail-batch-active .detail-variant-row{grid-template-columns:minmax(80px,1fr) auto auto auto}.detail-batch-active .detail-variant-row .variant-add{display:none}.detail-multi-footer{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 20px;border-top:1px solid #dae4dd;background:#fff;position:relative;z-index:3;box-shadow:0 -4px 15px #143d2908}.detail-multi-footer>div:first-child{min-width:0}.detail-multi-footer b{font-size:13px}.detail-multi-footer strong{margin-left:15px;color:#e36a25;font-size:19px}.detail-multi-footer small{display:block;margin-top:4px;font-size:11px;color:#78877f}.detail-multi-actions{display:flex;gap:8px;flex-shrink:0}.detail-multi-actions button{padding:10px 16px;white-space:nowrap}.detail-multi-actions button:disabled{opacity:.45;cursor:not-allowed}.detail-batch-active .qty-stepper input{min-width:38px}@media(max-width:750px){.detail-modal.detail-batch-active{grid-template-columns:1fr;grid-template-rows:minmax(0,27vh) minmax(0,43vh) auto;max-height:92vh}.detail-batch-active>.detail-gallery{max-height:27vh}.detail-batch-active>.detail-info{max-height:43vh;padding:16px}.detail-multi-footer{padding:10px;gap:8px;flex-wrap:wrap}.detail-multi-footer small{display:none}.detail-multi-actions{margin-left:auto}.detail-multi-actions button{padding:9px 10px}}

/* Keep selection and purchase together in the right column, even with sixteen colors. */
.detail-modal.detail-batch-active{height:min(88vh,900px);grid-template-rows:minmax(0,1fr)}.detail-batch-active>.detail-gallery{grid-column:1;grid-row:1;height:100%;max-height:none}.detail-batch-active>.detail-info{grid-column:2;grid-row:1;display:flex;flex-direction:column;min-height:0;height:100%;max-height:none;overflow:hidden;padding:24px 24px 0}.detail-multi-content{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;padding:0 5px 12px 0}.detail-info>.detail-multi-footer{display:grid;grid-template-columns:minmax(0,1fr);gap:7px;flex:0 0 auto;margin:0 -24px;padding:11px 18px;border-top:1px solid #d8e3dc;box-shadow:0 -3px 12px #163e2608}.detail-multi-actions{display:flex;gap:8px;width:100%;margin:0}.detail-multi-actions button{flex:1;min-width:0;padding:11px 8px}.detail-batch-active .detail-variant-row{grid-template-columns:minmax(85px,1fr) auto auto auto auto;gap:7px}.detail-batch-active .detail-variant-row .variant-add{display:block}.detail-batch-active .multi-option-pick{font-size:11px;padding:7px;min-width:61px}.detail-batch-active [data-color],.detail-batch-active [data-gp-color],.detail-batch-active [data-spm-pair]{position:relative}.detail-batch-active .has-multi-selection{padding-right:29px!important}.multi-color-count{position:absolute;top:3px;right:3px;padding:1px 4px;border-radius:5px;background:#e0f1e5;color:#20603b;font-size:9px!important;line-height:1.3;pointer-events:none}.multi-show-selection{border:0;background:none;color:#346b57;padding:3px 0;font-size:11px;cursor:pointer;display:block}.detail-selection-list[hidden]{display:none}.detail-selection-list{max-height:118px;overflow:auto;padding:6px;background:#f3f8f4;border-radius:5px}.detail-selection-list>div{display:flex;justify-content:space-between;gap:9px;padding:4px;font-size:11px}.detail-selection-list>div>span{overflow-wrap:anywhere;min-width:0}.detail-selection-list b{white-space:nowrap;font-size:11px}.detail-multi-footer small{font-size:10px}@media(max-width:750px){.detail-modal.detail-batch-active{height:92vh;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,27vh) minmax(0,1fr)}.detail-batch-active>.detail-gallery{grid-column:1;grid-row:1;max-height:none}.detail-batch-active>.detail-info{grid-column:1;grid-row:2;max-height:none;padding:14px 14px 0}.detail-info>.detail-multi-footer{margin:0 -14px;padding:8px 12px}.detail-batch-active .detail-variant-row{display:flex;flex-wrap:wrap;gap:6px}.detail-batch-active .detail-variant-row>div:first-child{flex:1 0 100%}.detail-multi-footer small{display:block}}

.detail-batch-active .detail-color-options{max-height:min(22vh,200px);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:3px 3px 3px 0}.detail-multi-footer>div:first-child{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px}.detail-multi-footer>div:first-child>b{font-size:12px}.detail-multi-footer>div:first-child>strong{margin-left:0;font-size:18px}.detail-multi-footer>div:first-child>small{flex-basis:100%;order:3;margin:0;font-size:10px}.detail-multi-footer .multi-show-selection{display:inline-block;margin-left:auto;padding:1px 0;font-size:10px}.detail-batch-active .detail-info h2{margin-top:5px;margin-bottom:12px}@media(max-width:750px){.detail-batch-active .detail-color-options{max-height:18vh}.detail-multi-footer>div:first-child>small{display:none}}