/* V17.00 FINAL CHECKOUT WIZARD — one clear step per screen */
body.md-order-wizard-active{overflow:hidden!important}
body.md-order-wizard-active #productModal.product-modal{position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;padding:0!important;display:block!important;background:#050b16!important;z-index:2147483000!important}
body.md-order-wizard-active #productModal[hidden]{display:none!important}
body.md-order-wizard-active #productModal .product-modal-backdrop{display:none!important}
body.md-order-wizard-active #productModal .product-modal-card{position:relative!important;width:100vw!important;max-width:none!important;height:100dvh!important;max-height:none!important;margin:0!important;border:0!important;border-radius:0!important;overflow:auto!important;background:linear-gradient(180deg,#07111f,#091526)!important;box-shadow:none!important}
body.md-order-wizard-active #productModal .product-modal-close{position:fixed!important;top:max(14px,env(safe-area-inset-top))!important;left:16px!important;right:auto!important;width:46px!important;height:46px!important;margin:0!important;border-radius:50%!important;z-index:2147483600!important}
/* The old left product panel caused the narrow checkout. Hide it while buying. */
body.md-order-wizard-active #productModal .product-order-summary{display:none!important}
body.md-order-wizard-active #productModal .product-order-layout{display:block!important;width:100%!important;max-width:none!important;min-height:100dvh!important;padding:0!important;margin:0!important}
body.md-order-wizard-active #productModal .customer-order-form{display:block!important;width:min(1120px,calc(100% - 48px))!important;max-width:1120px!important;min-width:0!important;min-height:100dvh!important;margin:0 auto!important;padding:82px 0 120px!important}
body.md-order-wizard-active #productModal .md-order-wizard{display:grid!important;gap:22px!important;width:100%!important;max-width:none!important;padding:clamp(18px,3vw,34px)!important;border:1px solid rgba(96,165,250,.28)!important;border-radius:26px!important;background:linear-gradient(145deg,rgba(12,27,48,.98),rgba(15,25,48,.96))!important;box-shadow:0 25px 80px rgba(0,0,0,.36)!important}
body.md-order-wizard-active #productModal .md-order-progress{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:9px!important;width:100%!important}
body.md-order-wizard-active #productModal .md-order-progress span{display:grid!important;place-items:center!important;height:44px!important;min-width:0!important;border-radius:12px!important;font-size:14px!important;font-weight:900!important;white-space:nowrap!important}
body.md-order-wizard-active #productModal .md-order-step-heading{padding:8px 0 4px!important}
body.md-order-wizard-active #productModal .md-order-step-heading h3{margin:5px 0 8px!important;font-size:clamp(30px,4vw,48px)!important;line-height:1.04!important;letter-spacing:-.025em!important}
body.md-order-wizard-active #productModal .md-order-step-heading p{max-width:760px!important;margin:0!important;font-size:17px!important;line-height:1.55!important;color:#b7c9dc!important;word-break:normal!important;overflow-wrap:normal!important}
body.md-order-wizard-active #productModal .md-order-step{width:100%!important;max-width:none!important;min-width:0!important;margin:0!important}
body.md-order-wizard-active #productModal fieldset.md-order-step,
body.md-order-wizard-active #productModal .md-quantity-step,
body.md-order-wizard-active #productModal #customerInfoFields,
body.md-order-wizard-active #productModal #orderNotesField,
body.md-order-wizard-active #productModal .md-order-review{padding:26px!important;border:1px solid rgba(88,153,218,.30)!important;border-radius:20px!important;background:#0b182a!important}
body.md-order-wizard-active #productModal .order-field-grid,
body.md-order-wizard-active #productModal #customerInfoFields,
body.md-order-wizard-active #productModal #shippingInfoFields .order-field-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px!important}
body.md-order-wizard-active #productModal label{display:grid!important;gap:8px!important;min-width:0!important;font-size:14px!important;font-weight:800!important;line-height:1.35!important;word-break:normal!important;overflow-wrap:normal!important}
body.md-order-wizard-active #productModal input,
body.md-order-wizard-active #productModal select,
body.md-order-wizard-active #productModal textarea{width:100%!important;min-width:0!important;min-height:52px!important;padding:12px 14px!important;border-radius:13px!important;font-size:16px!important;line-height:1.3!important}
body.md-order-wizard-active #productModal textarea{min-height:160px!important;resize:vertical!important}
body.md-order-wizard-active #productModal #genericQuantityField{grid-column:1/-1!important;max-width:420px!important}
body.md-order-wizard-active #productModal #shippingInfoFields .field-span-2{grid-column:1/-1!important}
body.md-order-wizard-active #productModal .md-live-quantity-total{margin-top:20px!important}
body.md-order-wizard-active #productModal .customer-file-preview{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(180px,1fr))!important;gap:14px!important}
body.md-order-wizard-active #productModal .customer-file-row img{width:100%!important;aspect-ratio:4/5!important;object-fit:contain!important;background:#050a12!important;border-radius:12px!important}
body.md-order-wizard-active #productModal .business-card-wizard .customer-file-row img,
body.md-order-wizard-active.bc-wizard-active #productModal .customer-file-row img{aspect-ratio:1.75/1!important;object-fit:contain!important}
body.md-order-wizard-active #productModal .md-upload-wait{padding:18px!important;border-radius:16px!important}
body.md-order-wizard-active #productModal .md-order-wizard-nav{position:sticky!important;bottom:0!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:14px!important;width:100%!important;padding:18px 0 4px!important;background:linear-gradient(180deg,rgba(8,17,31,0),rgba(8,17,31,.98) 32%)!important;z-index:30!important}
body.md-order-wizard-active #productModal .md-order-wizard-nav button{min-height:58px!important;border-radius:15px!important;font-size:17px!important;font-weight:950!important}
body.md-order-wizard-active #productModal .md-add-another{grid-column:1/-1!important;order:3!important}
body.md-order-wizard-active #productModal .order-price-summary{position:static!important;width:100%!important;margin-top:18px!important}
body.md-order-wizard-active #productModal .md-review-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important}
body.md-order-wizard-active #productModal .md-review-grid>div.wide{grid-column:1/-1!important}
@media(max-width:760px){
 body.md-order-wizard-active #productModal .customer-order-form{width:100%!important;padding:70px 12px 100px!important}
 body.md-order-wizard-active #productModal .md-order-wizard{padding:16px!important;border-radius:0!important;border-left:0!important;border-right:0!important}
 body.md-order-wizard-active #productModal .md-order-progress{grid-template-columns:repeat(7,1fr)!important;gap:5px!important}
 body.md-order-wizard-active #productModal .md-order-progress span{height:34px!important;font-size:11px!important}
 body.md-order-wizard-active #productModal .md-order-step-heading h3{font-size:32px!important}
 body.md-order-wizard-active #productModal .md-order-step-heading p{font-size:15px!important}
 body.md-order-wizard-active #productModal .order-field-grid,
 body.md-order-wizard-active #productModal #customerInfoFields,
 body.md-order-wizard-active #productModal #shippingInfoFields .order-field-grid,
 body.md-order-wizard-active #productModal .md-review-grid{grid-template-columns:1fr!important}
 body.md-order-wizard-active #productModal #shippingInfoFields .field-span-2,
 body.md-order-wizard-active #productModal .md-review-grid>div.wide{grid-column:1!important}
 body.md-order-wizard-active #productModal fieldset.md-order-step,
 body.md-order-wizard-active #productModal .md-quantity-step,
 body.md-order-wizard-active #productModal #customerInfoFields,
 body.md-order-wizard-active #productModal #orderNotesField,
 body.md-order-wizard-active #productModal .md-order-review{padding:18px!important}
 body.md-order-wizard-active #productModal .md-order-wizard-nav button{min-height:54px!important;font-size:16px!important}
}

/* V18.21 business card + keychain additions */
.bc-production-guide{margin:14px 0 0;padding:14px 16px;border:1px solid rgba(62,196,255,.28);border-radius:16px;background:rgba(10,29,48,.7);line-height:1.5}.bc-production-guide p{margin:6px 0}.bc-choice-btn:disabled{opacity:.35;cursor:not-allowed}.photo-builder-callout:has(#openKeychainBuilder){border-color:rgba(117,97,255,.38)}
#keychainBuilderFields .order-field-grid{margin-top:16px}.photo-native-select{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}

/* V18.22 — compact keychain package selector + clean summaries */
.keychain-compact-package{max-width:760px}
.keychain-package-label{display:block;font-weight:800;margin:0 0 8px}
.keychain-package-select{display:block!important;position:static!important;left:auto!important;width:100%!important;height:auto!important;min-height:54px!important;padding:12px 14px!important;border-radius:14px!important;font:inherit!important}
.keychain-package-picked{margin-top:10px;padding:12px 14px;border:1px solid rgba(62,196,255,.28);border-radius:14px;display:flex;justify-content:space-between;gap:12px;align-items:center}
#keychainPackageButtons{display:none!important}
#keychainSummary span{display:block;margin-top:6px}
#bcProductionGuide{font-size:15px}
@media(max-width:760px){
  .keychain-package-picked{align-items:flex-start;flex-direction:column}
  #bcProductionGuide{font-size:14px}
}

/* V18.23 — reliable touch/mouse selection repair */
#businessCardBuilderFields{position:relative;isolation:isolate}
#businessCardBuilderFields .bc-choice-buttons{position:relative;z-index:20;pointer-events:auto!important}
#businessCardBuilderFields .bc-choice-btn{
  position:relative!important;z-index:21!important;pointer-events:auto!important;
  touch-action:manipulation!important;-webkit-tap-highlight-color:rgba(50,200,255,.22);
  cursor:pointer!important;user-select:none!important;-webkit-user-select:none!important;
}
#businessCardBuilderFields .bc-choice-btn.selected{
  outline:2px solid rgba(52,207,255,.85)!important;
  outline-offset:1px;
}
.bc-selection-status{margin:10px 0 0;padding:10px 12px;border-radius:12px;border:1px solid rgba(62,196,255,.25);font-weight:700}
#keychainPackagePreset,#keychainShape,#keychainLetterColor{
  pointer-events:auto!important;touch-action:manipulation!important;cursor:pointer!important;
  position:relative!important;z-index:25!important;
}

/* V18.24 — keychain selector reliability */
#keychainBuilderFields select,
#keychainPackagePreset,
#keychainShape,
#keychainLetterColor{
  display:block!important;
  position:relative!important;
  left:auto!important;
  top:auto!important;
  width:100%!important;
  min-height:56px!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  touch-action:manipulation!important;
  -webkit-appearance:auto!important;
  appearance:auto!important;
  z-index:40!important;
  cursor:pointer!important;
}
#keychainBuilderFields select:disabled{opacity:.55!important;cursor:not-allowed!important}
.keychain-selection-status,.bc-selection-status{
  margin-top:8px;padding:9px 12px;border:1px solid rgba(62,196,255,.3);
  border-radius:10px;font-weight:700;min-height:18px;
}

/* V18.25 — custom keychain pickers, no native select dependency */
#keychainBuilderFields .keychain-model-select{
  position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;
  opacity:0!important;pointer-events:none!important;
}
.keychain-picker-trigger{
  width:100%!important;min-height:58px!important;padding:13px 16px!important;border:2px solid #28506f!important;
  border-radius:14px!important;background:#0b1b2c!important;color:#f6f9ff!important;font:inherit!important;
  font-weight:800!important;text-align:left!important;cursor:pointer!important;touch-action:manipulation!important;
}
.keychain-picker-trigger::after{content:"▾";float:right;color:#47d2ff;font-size:20px}
.keychain-picker-trigger:active{transform:scale(.995)}
.keychain-picker-sheet[hidden]{display:none!important}
.keychain-picker-sheet{position:fixed!important;inset:0!important;z-index:2147483000!important;display:flex!important;align-items:flex-end!important;justify-content:center!important}
.keychain-picker-backdrop{position:absolute!important;inset:0!important;background:rgba(0,0,0,.72)!important}
.keychain-picker-panel{position:relative!important;width:min(760px,100%)!important;max-height:78vh!important;background:#071827!important;border:1px solid #356281!important;border-radius:22px 22px 0 0!important;padding:18px!important;box-shadow:0 -18px 60px rgba(0,0,0,.45)!important;overflow:hidden!important}
.keychain-picker-panel header{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin-bottom:12px!important}
.keychain-picker-panel header h3{margin:0!important;font-size:22px!important}
.keychain-picker-panel header button{width:48px!important;height:48px!important;border-radius:13px!important;border:1px solid #355a76!important;background:#0d2235!important;color:#fff!important;font-size:30px!important}
.keychain-picker-options{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;max-height:62vh!important;overflow:auto!important;-webkit-overflow-scrolling:touch!important;padding-bottom:12px!important}
.keychain-picker-option{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;min-height:54px!important;padding:12px 14px!important;border:1px solid #315673!important;border-radius:14px!important;background:#0a2033!important;color:#fff!important;font:inherit!important;font-weight:750!important;text-align:left!important;cursor:pointer!important;touch-action:manipulation!important}
.keychain-picker-option.selected{border-color:#32d4ff!important;box-shadow:0 0 0 2px rgba(50,212,255,.22)!important;background:#12314a!important}
.keychain-picker-option b{color:#3ee7aa!important;font-size:20px!important}
body.keychain-picker-open{overflow:hidden!important}
@media(max-width:600px){
  .keychain-picker-options{grid-template-columns:1fr!important}
  .keychain-picker-panel{max-height:82vh!important}
}

/* V18.26 — keychain has no extra Quantity or Upload Photos step */
body.md-order-wizard-active #productModal #quantityStepFields[hidden],
body.md-order-wizard-active #productModal #customerUploadFields[hidden]{display:none!important}
