/* Custom order mobile media + supply picker v20 */
.supply-photo>img.supply-direct-photo{width:100%;height:100%;display:block;object-fit:cover}
.wizard-supply-card:has(input[data-base-supply]:checked){border-color:#4f8567!important;background:#fbfdfb!important;box-shadow:0 0 0 2px rgba(46,112,74,.06)!important}
.wizard-supply-head>[data-supply-action]{font-style:normal;white-space:nowrap}

/* Flower color quick preview — real flower thumbnail + color + label on every viewport. */
.wizard-flower-summary .flower-family-colors{display:none!important}
.flower-color-quick-picker{display:flex;align-items:stretch;gap:7px;overflow-x:auto;overflow-y:hidden;padding:9px 10px 10px;border-top:1px solid #eff3f0;background:#fff;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
.flower-color-quick-picker::-webkit-scrollbar{display:none}
.flower-color-quick{appearance:none;position:relative;flex:0 0 60px;width:60px;min-width:60px;min-height:68px;border:1px solid #dfe8e1;border-radius:13px;background:#f8faf8;padding:4px;display:grid;grid-template-rows:44px auto;gap:4px;align-items:center;justify-items:stretch;color:#315744;font:inherit;cursor:pointer;touch-action:manipulation;transition:border-color .16s ease,background .16s ease,box-shadow .16s ease,transform .16s ease}
.flower-color-quick:hover{border-color:#9ab6a5;background:#f4f8f5;box-shadow:0 5px 14px rgba(33,82,55,.07)}
.flower-color-quick:active{transform:scale(.97)}
.flower-color-quick-media{width:50px;height:44px;border-radius:9px;overflow:hidden;display:block;background:#edf2ee}
.flower-color-quick-media>img,.flower-color-quick-media>span{display:block;width:100%;height:100%;object-fit:cover;background-repeat:no-repeat;background-size:cover}
.flower-color-quick-media>span.inventory-real-photo{background-size:400% 400%}
.flower-color-quick-dot{position:absolute;top:6px;right:6px;width:12px;height:12px;border-radius:50%;background:var(--flower-color,#d8ded9);border:2px solid #fff;box-shadow:0 0 0 1px rgba(25,55,40,.18)}
.flower-color-quick-label{display:block;max-width:100%;padding:0 2px;font-size:8px;line-height:1.5;font-weight:850;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#4c6457}
.flower-color-quick.is-preview{border-color:#3f7e5b;background:#eff7f1;box-shadow:0 0 0 2px rgba(42,105,70,.09)}
.flower-color-quick.is-preview .flower-color-quick-label{color:#17543b}
.flower-color-quick:focus-visible{outline:2px solid #2d7650;outline-offset:2px}
.wizard-flower-card.has-color-preview .wizard-flower-summary .flower-family-summary-copy>small{color:#2f6a49;font-weight:750}

@media(max-width:680px){
  .wizard-flower-photo{height:auto!important;aspect-ratio:4/3!important;background:#f6f4ee!important}
  .wizard-flower-photo>img,
  .wizard-flower-photo>span>img.inventory-direct-photo-img{object-fit:contain!important;object-position:center!important;background:#f6f4ee!important}

  .flower-color-quick-picker{gap:8px;padding:10px 10px 11px}
  .flower-color-quick{flex-basis:58px;width:58px;min-width:58px;min-height:64px;grid-template-rows:42px auto}
  .flower-color-quick-media{width:48px;height:42px}

  .wizard-supply-label{align-items:flex-start!important;display:grid!important;gap:4px!important;padding:10px 12px!important;margin-bottom:10px!important}
  .wizard-supply-label strong{font-size:14px!important}
  .wizard-supply-label small{font-size:9px!important;line-height:1.8!important}
  .wizard-supply-search{width:100%!important;height:44px!important;margin-bottom:10px!important}
  .wizard-supply-grid{gap:8px!important}
  .wizard-supply-card{border-radius:15px!important;box-shadow:none!important;background:#fff!important}
  .wizard-supply-head{grid-template-columns:72px minmax(0,1fr) auto!important;gap:10px!important;min-height:92px!important;padding:10px!important}
  .wizard-supply-head .supply-photo{width:72px!important;height:72px!important;border-radius:13px!important;background:#f2f4f1!important}
  .wizard-supply-head .supply-family-choice-copy{min-width:0}
  .wizard-supply-head .supply-family-choice-copy strong{font-size:13px!important;line-height:1.6!important}
  .wizard-supply-head .supply-family-choice-copy small{font-size:8.5px!important;line-height:1.7!important;margin-top:2px!important;display:block!important}
  .wizard-supply-head>[data-supply-action]{min-width:58px;max-width:92px;padding:7px 8px;border-radius:999px;background:#f0f5f1;color:#2e6647!important;font-size:8.5px!important;font-weight:900!important;text-align:center;overflow:hidden;text-overflow:ellipsis}
  .wizard-supply-card.is-selected .wizard-supply-head>[data-supply-action],
  .wizard-supply-card:has(input[data-base-supply]:checked) .wizard-supply-head>[data-supply-action]{background:#174b34!important;color:#fff!important}
  .wizard-supply-card.is-open .wizard-supply-head>[data-supply-action]{background:#eaf3ed;color:#205d3d!important}

  .wizard-supply-variants{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important;padding:8px!important;background:#f8faf8!important}
  .supply-variant-option{min-width:0}
  .supply-variant-option>span{min-height:42px!important;padding:7px 8px!important;border-radius:10px!important;gap:6px!important;min-width:0!important}
  .supply-variant-option i{width:15px!important;height:15px!important;flex-basis:15px!important}
  .supply-variant-option b{font-size:9px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .supply-variant-option em{font-size:7.5px!important;margin-right:auto;white-space:nowrap}
  [data-base-panel='bouquet'] .supply-variant-option em{display:none!important}
  [data-base-panel='bouquet'] .supply-variant-option>span{justify-content:flex-start!important}
}

@media(max-width:390px){
  .flower-color-quick-picker{gap:7px;padding-inline:9px}
  .flower-color-quick{flex-basis:55px;width:55px;min-width:55px}
  .flower-color-quick-media{width:45px}
  .wizard-supply-head{grid-template-columns:64px minmax(0,1fr) auto!important;padding:9px!important;gap:8px!important;min-height:84px!important}
  .wizard-supply-head .supply-photo{width:64px!important;height:64px!important}
  .wizard-supply-head>[data-supply-action]{min-width:52px;max-width:76px;padding-inline:6px}
  .wizard-supply-variants{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}