/* Charline customize editor — load only on jewelry/customize.php */ #customize{--cb-alert-bg:var(--color-cream);--cb-alert-border:var(--color-cream-dark);--cb-alert-fg:var(--color-brown);--cb-border:var(--color-cream-dark);--cb-commerce-fg:var(--color-primary);--cb-info-accent:var(--color-gold);--cb-meta-fg:var(--color-gold-dark);--cb-notice-bg:var(--color-cream);--cb-notice-border:var(--color-gold-light);--cb-notice-fg:var(--color-gold-dark);--cb-pink:var(--color-primary);--cb-pink-border:var(--pink-26);--cb-pink-light:var(--pink-07);--cb-pink-mid:var(--pink-16);--cb-popin-accent:var(--color-primary);--cb-preview-img:#f5efee;--cb-preview-well:#faefed;--cb-progress-fill:var(--color-primary);--cb-progress-track:var(--color-primary-bg);--cb-select-bg:var(--color-primary-bg);--cb-select-border:var(--color-primary);--cb-select-ring:var(--pink-16);--cb-shadow-md:var(--sh-lift);--cb-transition:var(--motion-duration) var(--motion-ease);--customize-sticky-top:max(.5rem,calc(env(safe-area-inset-top,0px) + 9rem))} body#customize #customRefLightbox .customize-ref-lightbox__panel,body#customize #customizePreviewExpand .customize-preview-expand__panel{border-top:4px solid var(--cb-popin-accent)} #customize #breadcrumbs{margin-bottom:22px} #customize .customize-load-error{background:var(--cb-alert-bg);border:1px solid var(--cb-alert-border);border-radius:var(--r-md);color:var(--cb-alert-fg);line-height:1.45;margin:0 auto 16px;max-width:640px;padding:12px 16px;text-align:center} #customize .customize-step{display:none;flex-direction:column} #customize .customize-step.customize-step--active{display:flex} .customize-step-meta{margin-bottom:16px} #customize .customize-step-indicator{color:var(--color-charcoal);display:block;font-family:var(--font-body);font-size:14px;font-weight:600;line-height:1.35;margin-bottom:8px} .customize-step-progress{background:var(--cb-progress-track);border-radius:var(--r-pill);height:8px;overflow:hidden} .customize-step-progress-fill{background:var(--cb-progress-fill);border-radius:var(--r-pill);height:100%;transition:width var(--motion-duration) var(--motion-ease);width:20%} .customize-step-nav{align-items:flex-start;display:flex;flex-wrap:nowrap;gap:12px;justify-content:space-between;margin-top:16px} .customize-step-nav__prev{flex:1 1 0;min-width:0} .customize-step-nav__next-wrap{align-items:stretch;display:flex;flex:1 1 0;flex-direction:column;gap:8px;margin-left:0;max-width:none;min-width:0} .customize-step-nav .button2{border:1.5px solid var(--color-primary)} .customize-step-nav__prev--ghost{pointer-events:none;visibility:hidden} #customize #customPrevStep.customize-step-nav__prev--off,#customize #customPrevStep[hidden],#customize #previewLabel{display:none} #customize .customize-step-nav__main-row--solo-cta #customPrevStep{display:none!important} #customize .customize-step-nav__main-row{align-items:flex-start;display:flex;flex:1 1 0;flex-direction:row;flex-wrap:nowrap;gap:12px;min-width:0;width:100%} #customize .customize-sticky-actions .customize-step-nav,#customize .customize-sticky-actions .customize-step-nav__main-row{align-items:center} #customize .customize-sticky-actions .customize-step-nav__main-row .button,#customize .customize-sticky-actions .customize-step-nav__main-row .button2{align-items:center;box-sizing:border-box;display:inline-flex;font-size:14px;height:auto;justify-content:center;line-height:1.25;margin:0;max-height:none;min-height:36px;padding:7px 14px} #customize .customize-step-nav__main-row.customize-step-nav__main-row--solo-cta .customize-step-nav__next-wrap{align-items:stretch;flex:1 1 0;flex-direction:row;gap:12px;margin-left:0;max-width:none} #customize .customize-step-nav__main-row.customize-step-nav__main-row--solo-cta #customEditCancel,#customize .customize-step-nav__main-row.customize-step-nav__main-row--solo-cta #customEditSave{flex:1 1 0;width:100%} #customize .customize-sticky-actions .customize-step-nav__main-row.customize-step-nav__main-row--solo-cta .customize-step-nav__next-wrap{align-items:stretch;display:flex;flex:1 1 0;flex-direction:row;gap:12px;margin:0;min-width:0} #customize #customAddToCart.customize-step-nav__checkout,#customize #customNextStep{align-self:stretch;width:100%} #customize #customAddToCart.customize-step-nav__checkout,#customize #customAddToCartDock.customize-preview-dock__cta{align-items:center;display:inline-flex;gap:8px;justify-content:center} #customize #customAddToCart.customize-step-nav__checkout:before,#customize #customAddToCartDock.customize-preview-dock__cta:before{-webkit-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 7V6a5 5 0 0 1 10 0v1h2a1 1 0 0 1 1 1l-1.2 13.2a2 2 0 0 1-1.99 2.8H7.19a2 2 0 0 1-1.99-2.8L4 8a1 1 0 0 1 1-1zm2 0h6V6a3 3 0 0 0-6 0z'/%3E%3C/svg%3E") no-repeat center/contain;background-color:currentColor;content:"";display:inline-block;flex:0 0 auto;height:20px;mask:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 7V6a5 5 0 0 1 10 0v1h2a1 1 0 0 1 1 1l-1.2 13.2a2 2 0 0 1-1.99 2.8H7.19a2 2 0 0 1-1.99-2.8L4 8a1 1 0 0 1 1-1zm2 0h6V6a3 3 0 0 0-6 0z'/%3E%3C/svg%3E") no-repeat center/contain;width:20px} #customize .customize-layout--step-5 #customAddToCart:before,#customize .customize-layout--step-5 #customAddToCartDock:before{-webkit-mask:none;content:none;display:none;height:0;mask:none;width:0} #customize #customAddToCartHelp.customize-cta-help{display:block;min-height:2.8em} #customize #customCartError.customize-cart-error{min-height:2.9em} #customize #customCartError.customize-cart-error[hidden]{display:block;visibility:hidden} #customize .customize-sticky-actions #customAddToCartHelp.customize-cta-help:empty,#customize .customize-sticky-actions #customCartError.customize-cart-error[hidden]{display:none!important;height:0;margin:0;min-height:0;overflow:hidden;padding:0;visibility:hidden} #customize #customCartError.customize-cart-error:not([hidden]){visibility:visible} #customize #customEditCancel,#customize #customEditSave{order:0} #customize #customAddToCart.customize-step-nav__checkout,#customize #customNextStep{order:1} #customize #customAddToCartHelp{order:3} #customize #customCartError{order:4} #customize .customize-card{background:var(--color-page);border-radius:var(--r-md);box-shadow:var(--sh-card);margin-bottom:16px;padding:16px} #customize .customize-section-title{color:var(--color-charcoal);font-family:var(--font-body);font-size:18px;font-weight:600;margin:0 0 12px} #customize .customize-field{margin-bottom:12px} #customize .customize-field-heading{align-items:center;display:flex;flex-wrap:wrap;gap:8px 12px;justify-content:space-between;margin-bottom:8px} #customize .customize-field-heading .customize-label{flex:1 1 auto;margin-bottom:0} #customize .customize-ref-btn{-webkit-appearance:none;appearance:none;background:var(--btn-outline-bg);border:1px solid var(--cb-pink-border);border-radius:var(--r-pill);box-sizing:border-box;color:var(--btn-outline-fg);cursor:pointer;font-family:inherit;font-size:13px;font-weight:600;line-height:1.25;transition:background var(--cb-transition),border-color var(--cb-transition),color var(--cb-transition)} #customize .customize-ref-btn:hover{background:var(--btn-outline-bg-hover);border-color:var(--btn-outline-border);color:var(--btn-outline-fg)} #customize .customize-ref-btn:focus-visible{outline:var(--focus-ring);outline-offset:var(--focus-ring-offset)} #customize .customize-ref-inline{flex:0 1 auto;margin:0;padding:6px 12px;white-space:nowrap} #customize .customize-label{display:block;font-weight:600;margin-bottom:6px} #customize .customize-label.customize-label{cursor:default} #customize .customize-input{border:1px solid var(--color-cream-dark);border-radius:var(--control-radius);box-sizing:border-box;font-size:16px;max-width:100%;outline:none;padding:10px 12px;width:100%} #customize input.ccsp-qty-input.customize-input{border:1.5px solid var(--ccsp-qty-border);font-size:15px;font-weight:600;height:var(--ccsp-qty-control-height);line-height:1;max-width:var(--ccsp-qty-input-max-width);min-height:var(--ccsp-qty-control-height);min-width:var(--ccsp-qty-input-min-width);padding:0 6px;width:var(--ccsp-qty-input-width)} #customize .customize-input.customize-input--sr{height:1px;opacity:0;pointer-events:none;position:absolute;width:1px} #customize .customize-inline{align-items:center;display:flex;flex-wrap:wrap;gap:10px 12px} #customize .customize-inline .customize-input{flex:1 1 200px;min-width:0;width:auto} #customize .customize-tooltip{color:var(--cb-meta-fg);font-weight:600;text-decoration:none;white-space:nowrap} #customize .customize-inline .customize-tooltip{flex:0 1 160px;line-height:1.35;text-align:end;white-space:normal} #customize .customize-label-note{font-size:12px;font-weight:600;margin-left:6px;opacity:.7} #customize .customize-either-or{margin-top:10px} #customize .customize-baby-toggle{align-items:center;color:var(--color-charcoal);display:flex;font-size:13px;gap:10px;margin:0 0 10px;user-select:none} #customize .customize-baby-toggle input{flex:0 0 auto;height:16px;width:16px} #customize .customize-inline--hw{margin-top:0} #customize .customize-size-rec{margin-bottom:4px} #customize .customize-hw-toggle{background:none;border:none;color:var(--cb-meta-fg);cursor:pointer;display:inline;font-size:13px;font-weight:600;line-height:1.4;margin:4px 0 0;padding:0;text-decoration:underline;text-underline-offset:2px} #customize .customize-hw-toggle:hover{opacity:.75} #customize .customize-either-or__path--hw,#customize .customize-either-or__path--wrist{transition:filter var(--motion-duration) var(--motion-ease),opacity var(--motion-duration) var(--motion-ease)} #customize .customize-either-or:has(#customHeightCm:not(:placeholder-shown),#customWeightKg:not(:placeholder-shown)) .customize-either-or__path--wrist,#customize .customize-either-or:has(#customWristSize:not(:placeholder-shown)) .customize-either-or__path--hw,#customize .customize-step[data-step="4"] .customize-card:has(#customIsBabyBracelet:checked) .customize-either-or__path--hw,#customize .customize-step[data-step="4"] .customize-card:has(#customIsBabyBracelet:checked) .customize-either-or__path--wrist{filter:grayscale(.15);opacity:.45} #customize .customize-unit-field--cm #customWristSize{max-width:100%;width:92px} #customize .customize-preview-label{background:var(--color-cream);flex-shrink:0;font-size:13px;font-weight:600;padding:8px 10px} #customize #customBraceletSVG{background:transparent;display:block;filter:drop-shadow(0 1px 2px rgba(0,0,0,.06));flex:1 1 auto;height:auto;max-height:none;min-height:300px;transform:translateY(12px) scale(1.04);transform-origin:center;width:100%} #customize .customize-preview-chips{align-items:center;color:var(--color-muted);display:flex;flex-wrap:wrap;font-size:12px;gap:6px 12px;letter-spacing:.02em;line-height:1.4;padding:4px 6px 6px} #customize .customize-preview-chip{align-items:center;display:flex;gap:5px} #customize .customize-preview-chip__value{color:var(--color-charcoal);font-size:12px;font-weight:600;letter-spacing:.03em} #customize .customize-preview-chip__sep{color:var(--color-cream-dark);font-size:11px;font-weight:300;letter-spacing:0;line-height:1} #customize .customize-total-inline .customize-section-title{font-size:14px;margin:0 0 6px} #customize .customize-total-inline .customize-total-amount{color:var(--cb-commerce-fg);font-size:20px;font-weight:600;margin-bottom:4px} #customize .customize-total-inline .customize-total-sub{color:var(--color-muted);font-size:12px} #customize .customize-total-box{background:var(--color-page);border:1px solid var(--color-cream-dark);border-radius:var(--r-md);padding:8px 11px} #customize .customize-total-amount{color:var(--cb-commerce-fg);font-size:26px;font-weight:600;margin-bottom:4px} #customize .customize-preview-dock__total-amt{color:var(--cb-commerce-fg);font-size:18px;font-weight:600} #customize .customize-total-sub{font-size:13px;opacity:.75} #customize .customize-inline-warn-slot{box-sizing:border-box;color:var(--cb-pink);font-size:13px;line-height:1.45;margin-top:0;min-height:0} #customize .customize-inline-warn-slot--step4:has(.customize-inline-warn.is-visible){margin-top:12px} #customize .customize-step[data-step="1"] .customize-inline-warn-slot:not(.customize-inline-warn-slot--step4){margin-top:8px;min-height:20px} #customize .customize-step[data-step="1"] .customize-inline-warn-slot:not(.customize-inline-warn-slot--step4) .customize-inline-warn{line-height:20px;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} #customize .customize-inline-warn-slot .customize-inline-warn{color:inherit;font-size:inherit;line-height:inherit;margin:0;opacity:0;transition:opacity var(--motion-duration) var(--motion-ease),visibility var(--motion-duration) var(--motion-ease);visibility:hidden} #customize .customize-step[data-step="1"] .customize-inline-warn-slot:not(.customize-inline-warn-slot--step4) .customize-inline-warn.is-visible{opacity:1;visibility:visible} #customize .customize-inline-warn-slot .customize-inline-warn.is-visible{opacity:1;visibility:visible} #customize .material-cards{display:grid;gap:12px;grid-template-columns:1fr 1fr;margin-top:8px} #customize .material-card{background:var(--color-page);border:1.5px solid var(--cb-border);border-radius:var(--r-md);cursor:pointer;padding:12px 36px 12px 14px;position:relative;text-align:left;transition:border-color var(--cb-transition),box-shadow var(--cb-transition)} #customize .material-card.active{background:var(--cb-select-bg);border-color:var(--cb-select-border);border-width:2px;box-shadow:0 0 0 2px var(--cb-select-ring)} #customize .material-card .finishing-card-label strong{color:var(--color-charcoal);display:block;font-size:15px;font-weight:600;margin-bottom:4px} #customize .material-card .finishing-card-label span{color:var(--color-muted);display:block;font-size:12px;line-height:1.4} #customize .material-card .finishing-card-check{align-items:center;border:1.5px solid var(--cb-border);border-radius:var(--r-pill);color:transparent;display:flex;font-size:12px;font-weight:600;height:22px;justify-content:center;position:absolute;right:10px;top:10px;transition:border-color var(--cb-transition),background var(--cb-transition),color var(--cb-transition);width:22px} #customize .material-card.active .finishing-card-check{background:var(--cb-select-border);border-color:var(--cb-select-border);color:var(--color-page);font-weight:600} #customize .customize-color-dots{align-items:center;display:flex;flex-wrap:wrap;gap:10px;overflow:visible;padding:6px 0} #customize .customize-field--colors .customize-label--secondary{display:block;margin:12px 0 8px} #customize .customize-color-dot{border:2px solid rgba(0,0,0,.12);border-radius:var(--r-pill);cursor:pointer;flex-shrink:0;height:24px;outline:none;position:relative;width:24px} #customize .customize-color-dot .customize-color-dot__num{display:none} #customize .customize-color-dot.active{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--pink-16);outline:2.5px solid var(--color-primary);outline-offset:2px} #customize #customColorSelectionLive{color:var(--color-charcoal);font-size:1rem;font-weight:600;margin-top:12px} #customize .customize-charm-list{display:grid;gap:10px;margin-bottom:0;min-height:80px;overflow-x:hidden} #customize .customize-charm-row{align-items:center;border:1px solid var(--color-cream-dark);border-radius:var(--r-md);display:grid;gap:8px 10px;grid-template-columns:64px minmax(0,1fr) minmax(156px,max-content) 40px;min-width:0;padding:10px} #customize .customize-charm-row--unavailable{background:var(--cb-notice-bg);border-color:var(--cb-notice-border);grid-template-columns:64px minmax(0,1fr) 40px} #customize #customAddToCartDock.button:disabled,#customize .customize-step-nav .button2:disabled,#customize .customize-step-nav .button:disabled{cursor:not-allowed;opacity:.45;pointer-events:none} #customize .customize-charm-info{min-width:0} #customize .customize-charm-qty{align-items:center;display:inline-flex;flex-wrap:nowrap;gap:6px;justify-self:end;max-width:100%;min-width:0} #customize .customize-charm-qty .customCharmQty,#customize .customize-charm-qty input.ccsp-qty-input.customize-input{box-sizing:border-box;flex:0 0 auto;font-size:15px;font-weight:600;height:var(--ccsp-qty-control-height);line-height:1;max-width:var(--ccsp-qty-input-max-width);min-height:var(--ccsp-qty-control-height);min-width:var(--ccsp-qty-input-min-width);padding:0 6px;text-align:center;width:var(--ccsp-qty-input-width)} #customize .customize-charm-qty .customCharmQty::-webkit-inner-spin-button,#customize .customize-charm-qty .customCharmQty::-webkit-outer-spin-button{appearance:none;margin:0} #customize .customize-charm-qty .customCharmQty{-moz-appearance:textfield} #customize .customize-charm-qty .customize-charm-qty-step{align-items:center;background:var(--color-page);border:1px solid var(--color-cream-dark);border-radius:var(--control-radius);box-sizing:border-box;color:var(--color-charcoal);display:inline-flex;flex:0 0 auto;font-size:16px;font-weight:600;height:var(--ccsp-qty-control-height);justify-content:center;line-height:1;min-height:var(--ccsp-qty-control-height);min-width:32px;padding:0;width:32px} #customize .customize-charm-qty .customize-charm-qty-step:active{transform:translateY(1px)} #customize .customize-charm-remove{align-items:center;display:flex;justify-content:center;justify-self:center;width:40px} #customize .customCharmRemove{align-items:center;background:transparent;border:0;border-radius:var(--r-sm);box-sizing:border-box;color:var(--color-muted);cursor:pointer;display:inline-flex;flex-shrink:0;height:var(--ccsp-qty-control-height);justify-content:center;line-height:0;min-height:var(--ccsp-qty-control-height);min-width:var(--ccsp-qty-control-height);padding:0;transition:background var(--motion-duration) var(--motion-ease),color var(--motion-duration) var(--motion-ease);width:var(--ccsp-qty-control-height)} #customize .customCharmRemove:focus-visible,#customize .customCharmRemove:hover{background:var(--pink-07);color:var(--color-charcoal)} #customize .customCharmRemove:focus-visible{outline:2px solid var(--pink-40);outline-offset:2px} #customize .customCharmRemove .nav-btn__svg,#customize .customCharmRemove .storefront-icon{display:block;height:18px;width:18px} #customize .customize-charm-thumb img{border-radius:var(--r-sm);height:64px;object-fit:cover;width:64px} .customize-charm-thumb a{border-radius:var(--r-sm);display:block;overflow:hidden} .customize-charm-thumb a img{transition:opacity var(--motion-duration) var(--motion-ease)} .customize-charm-thumb a:focus-visible img,.customize-charm-thumb a:hover img{opacity:.72} #customize .customize-charm-name{font-weight:600} #customize .customize-charm-sub{font-size:13px;margin-top:2px;opacity:.7} #customize .customize-charm-warn{background:var(--cb-alert-bg);border:1px solid var(--cb-alert-border);border-radius:var(--r-md);color:var(--cb-alert-fg);font-size:14px;font-weight:600;line-height:1.4;margin:10px 0 0;padding:10px 12px} #customize .customize-charm-add-wrap{display:flex;justify-content:center;margin-top:10px} #customize .customize-empty{border:1px dashed var(--color-cream-dark);border-radius:var(--r-md);color:var(--color-muted);opacity:.9;padding:12px} #customize #customBraceletSVG .cb-charm-disk--appear{animation:cbCharmDiskPop .25s ease-out;transform-box:fill-box;transform-origin:center} #customize #customCharmQuickAddPrev.custom-charm-quick-add-nav:disabled,#customize #customCharmQuickAddPrev.custom-charm-quick-add-nav[disabled]{border-color:var(--color-cream-dark);color:var(--color-muted);opacity:.35} .customize-charm-browse-btn{margin:0 0 14px;width:100%} #customize #customCharmPopin.popin.open{align-items:center;background:transparent;border-radius:0;border-top:none;box-shadow:none;box-sizing:border-box;display:flex;height:100%;inset:0;justify-content:center;left:0;max-width:none;padding:max(16px,env(safe-area-inset-top,0px)) 16px max(16px,env(safe-area-inset-bottom,0px));position:fixed;top:0;transform:none;width:100%;z-index:2200} #customize #customCharmPopin.popin:not(.open){display:none;pointer-events:none;visibility:hidden} #customize #customCharmPopin .custom-charm-popin-backdrop{background:rgba(15,15,15,.38);cursor:pointer;inset:0;position:absolute} #customize #customCharmPopin .custom-charm-popin-panel{background:var(--color-page);border-radius:var(--r-lg);border-top:4px solid var(--cb-popin-accent);box-shadow:var(--sh-pop);display:flex;flex-direction:column;max-height:90vh;min-height:min(84vh,780px);overflow:hidden;position:relative;width:min(1240px,100%);z-index:1} #customize #customCharmPopin .custom-charm-popin-panel>.custom-charm-popin__close{background:transparent;border:none;cursor:pointer;line-height:0;margin:10px;padding:0;position:absolute;right:0;z-index:2} #customize #customCharmPopin .content{box-sizing:border-box;flex:1;max-height:none;min-height:0;overflow:auto;padding:20px 44px 20px 20px;scrollbar-gutter:stable;width:100%} #customize #customCharmPopin h2{margin-top:0} #customize #customCharmPopin .ccsp-header{display:grid;gap:10px;grid-template-columns:1fr;margin-bottom:12px} #customize #customCharmPopin .ccsp-title{margin:0} #customize #customCharmPopin .ccsp-stock-warn{background:var(--cb-alert-bg);border:1px solid var(--cb-alert-border);border-radius:var(--r-md);color:var(--cb-alert-fg);display:none;font-size:14px;font-weight:600;line-height:1.4;margin:0 0 12px;padding:10px 12px} #customize #customCharmPopin #ccspBraceletSummaryWrap.ccsp-charm-tag-wrap{align-items:center;border-top:1px solid var(--color-cream-dark);display:flex;flex-wrap:wrap;gap:6px 8px;margin-top:8px;max-height:96px;min-height:0;overflow-y:auto;padding:8px 12px;-webkit-overflow-scrolling:touch} #customize #customCharmPopin #ccspBraceletSummaryWrap .ccsp-charm-tag-label{flex:0 0 auto;line-height:1.2;margin-bottom:0;white-space:nowrap} #customize #customCharmPopin #ccspBraceletSummaryWrap #ccspBraceletSummaryCount:empty{display:none} #customize #customCharmPopin #ccspBraceletSummaryWrap .ccsp-charm-tag-row{flex:1 1 auto;gap:6px;min-width:0} #customize #customCharmPopin .ccsp-symbol-filters{align-items:center;display:flex;flex-wrap:wrap;gap:8px;margin:0} #customize #customCharmPopin .ccsp-symbol-btn{appearance:none;background:var(--color-page);border:1.5px solid var(--cb-border);border-radius:var(--control-radius);color:var(--color-charcoal);cursor:pointer;font:inherit;font-size:13px;font-weight:600;line-height:1.25;margin:0;padding:8px 12px;transition:border-color var(--cb-transition),box-shadow var(--cb-transition),background var(--cb-transition)} #customize #customCharmPopin .ccsp-symbol-btn:hover{border-color:var(--color-gold-light)} #customize #customCharmPopin .ccsp-symbol-btn.active{background:var(--cb-pink-light);border-color:var(--cb-pink);box-shadow:0 0 0 2px var(--cb-pink-mid);color:var(--color-primary)} #customize #customCharmPopin .ccsp-symbol-btn:focus-visible{outline:2px solid var(--cb-pink);outline-offset:2px} #customize #customCharmPopin .ccsp-body{align-items:stretch;display:grid;gap:16px;grid-template-columns:minmax(160px,1.35fr) minmax(260px,.95fr);min-height:0} #customize #customCharmPopin .ccsp-left{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;min-width:0;overflow:hidden} #customize #customCharmPopin .ccsp-meta-row{align-items:center;display:flex;flex-shrink:0;gap:12px;justify-content:space-between;margin:2px 0 8px} #customize #customCharmPopin .ccsp-meta{font-size:13px;margin:2px 0 8px;opacity:.75} #customize #customCharmPopin .ccsp-sort{align-items:center;display:flex;gap:8px} #customize #customCharmPopin .ccsp-sort-label{font-size:13px;opacity:.75;white-space:nowrap} #customize #customCharmPopin #ccspSortBy.customize-input{font-size:14px;padding:8px 10px} #customize #customCharmPopin .ccsp-right{align-self:stretch;background:var(--color-page);border:1px solid var(--cb-border);border-radius:var(--r-md);box-shadow:none;display:flex;flex-direction:column;min-height:0;min-width:0;padding:14px} #customize #customCharmPopin .ccsp-preview-empty{align-items:center;box-sizing:border-box;display:flex;flex:1;justify-content:center;min-height:0;opacity:.85;overflow:hidden;padding:20px 14px;text-align:center} #customize #customCharmPopin .ccsp-preview-empty p{color:var(--color-muted);font-size:14px;line-height:1.45;margin:0;max-width:14em} #customize #customCharmPopin .ccsp-preview{box-sizing:border-box;position:relative} #customize #customCharmPopin .ccsp-preview,#customize #customCharmPopin .ccsp-preview-wrap,.ccsp-mobile-preview .ccsp-preview-wrap{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden} #customize #customCharmPopin .ccsp-preview-wrap .ccsp-preview-stock,#customize #customCharmPopin .ccsp-preview-wrap .ccsp-preview-title{flex-shrink:0} #customize #customCharmPopin #ccspPreview.ccsp-preview .ccsp-preview-loading{align-items:center;background:rgba(255,255,255,.82);box-sizing:border-box;color:var(--color-muted);display:flex;font-size:14px;font-weight:600;inset:0;justify-content:center;margin:0;padding:12px;pointer-events:none;position:absolute;z-index:4} #customize #customCharmPopin #ccspPreview.ccsp-preview .ccsp-preview-loading--placeholder{align-items:center;background:var(--cb-preview-img);border-radius:var(--r-md);color:var(--color-muted);display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;margin:0 auto;min-height:0;pointer-events:none;position:relative;width:100%} #customize #customCharmPopin #ccspPreview.ccsp-preview .ccsp-preview-loading__txt{position:relative;z-index:1} #customize #customCharmPopin .ccsp-right-footer,.ccsp-mobile-preview .ccsp-right-footer{background:transparent;border-top:1px solid var(--color-cream-dark);flex-shrink:0;margin-top:auto;padding-top:14px;position:relative} #customize #customCharmPopin .ccsp-right-actions{align-items:center;display:flex;justify-content:center;width:100%} #customize #customCharmPopin .ccsp-qty-add{max-width:100%;min-width:0;width:auto} #customize #customCharmPopin .ccsp-qty-row{align-items:center;display:flex;flex-direction:row;flex-wrap:nowrap;gap:10px;justify-content:center;min-width:0} .ccsp-mobile-preview .ccsp-right-actions{align-items:stretch;display:flex;justify-content:stretch;width:100%} .ccsp-mobile-preview .ccsp-qty-add{max-width:100%;min-width:0;width:100%} .ccsp-mobile-preview .ccsp-qty-row{align-items:center;display:flex;flex-direction:row;flex-wrap:nowrap;gap:10px;min-width:0} #customize #customCharmPopin .ccsp-qty-label,.ccsp-mobile-preview .ccsp-qty-label{color:var(--color-charcoal);flex-shrink:0;font-size:13px;font-weight:600;margin-bottom:0;opacity:.75} #customize #customCharmPopin .ccsp-qty-step,.ccsp-mobile-preview .ccsp-qty-step{align-items:center;background:var(--color-page);border-radius:var(--control-radius);border:1px solid var(--color-cream-dark);box-sizing:border-box;color:var(--color-charcoal);display:inline-flex;flex:0 0 auto;font-size:18px;font-weight:600;height:var(--ccsp-qty-control-height);justify-content:center;line-height:1;min-height:var(--ccsp-qty-control-height);padding:0;width:36px} #customize #customCharmPopin .ccsp-qty-step:active,.ccsp-mobile-preview .ccsp-qty-step:active{transform:translateY(1px)} #customize #customCharmPopin .ccsp-add-btn.button:disabled,#customize #customCharmPopin .ccsp-qty-step:disabled,.ccsp-mobile-preview .ccsp-qty-step:disabled{cursor:not-allowed;opacity:.45} #customize #customCharmPopin .ccsp-qty-input.customize-input,.ccsp-mobile-preview .ccsp-qty-input.customize-input{background:var(--color-page);border-radius:var(--control-radius);border:1.5px solid var(--cb-border);box-sizing:border-box;flex:0 0 auto;font-size:15px;font-weight:600;height:var(--ccsp-qty-control-height);line-height:1;margin:0;max-width:var(--ccsp-qty-input-max-width);min-height:var(--ccsp-qty-control-height);min-width:var(--ccsp-qty-input-min-width);padding:0 6px;text-align:center;transition:border-color var(--cb-transition),box-shadow var(--cb-transition);width:var(--ccsp-qty-input-width)} #customize #customCharmPopin #customCharmQty::-webkit-inner-spin-button,#customize #customCharmPopin #customCharmQty::-webkit-outer-spin-button{appearance:none;margin:0} #customize #customCharmPopin #customCharmQty{-moz-appearance:textfield} #customize #customCharmPopin .ccsp-qty-row:focus-within .ccsp-qty-input.customize-input,.ccsp-mobile-preview .ccsp-qty-row:focus-within .ccsp-qty-input.customize-input{border-color:var(--cb-pink-border);box-shadow:0 0 0 2px var(--cb-pink-mid)} #customize #customCharmPopin .ccsp-add-btn.button,.ccsp-mobile-preview .ccsp-add-btn.button{align-items:center;border-radius:var(--control-radius);border:none;box-sizing:border-box;display:flex;font-size:15px;font-weight:600;justify-content:center;line-height:1.25;margin:0;min-height:46px;min-width:0;padding:12px 14px;white-space:nowrap;width:auto} #customize #customCharmPopin .ccsp-add-btn.button{flex:0 0 auto;max-width:220px} .ccsp-mobile-preview .ccsp-add-btn.button{flex:1 1 auto} #customize #customCharmPopin .ccsp-preview-title{align-items:start;display:grid;gap:10px;grid-template-columns:1fr auto;margin-bottom:8px} .ccsp-mobile-preview .ccsp-preview-title{display:none} .ccsp-mobile-preview .ccsp-preview-wrap{min-height:0;overflow:visible} .ccsp-mobile-preview__header{align-items:center;box-sizing:border-box;display:flex;flex:0 0 auto;justify-content:flex-end;padding:max(10px,env(safe-area-inset-top,0px)) 14px 4px} .ccsp-mobile-preview__img-link{left:8px;pointer-events:none;position:absolute;top:8px;z-index:3} .ccsp-mobile-preview__img-link .ccsp-preview-product-link--overlay{background:rgba(255,255,255,.92);border-radius:var(--r-pill);box-shadow:0 1px 4px rgba(15,15,15,.1);color:var(--color-primary);display:inline-block;font-size:12px;font-weight:600;line-height:1.2;padding:6px 10px;pointer-events:auto;text-decoration:none!important} .ccsp-mobile-preview__img-link .ccsp-preview-product-link--overlay:hover{opacity:.88;text-decoration:none!important} .ccsp-mobile-preview__img-link .ccsp-preview-product-link--overlay:active{opacity:.85} .ccsp-mobile-preview .ccsp-right-footer{border-top:none;margin-top:0;padding-top:0} .ccsp-mobile-preview__stock{color:var(--cb-alert-fg);font-size:13px;font-weight:600;line-height:1.35;margin:2px 0 10px} .ccsp-mobile-preview__stock:empty{display:none} #customize #customCharmPopin .ccsp-preview-name,.ccsp-mobile-preview .ccsp-preview-name{min-width:0} #customize #customCharmPopin .ccsp-preview-name-zh,.ccsp-mobile-preview .ccsp-preview-name-zh{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} #customize #customCharmPopin .ccsp-preview-stock,.ccsp-mobile-preview .ccsp-preview-stock{font-size:13px;margin-bottom:10px;opacity:.75} #customize #customCharmPopin .ccsp-preview-product-link,.ccsp-mobile-preview .ccsp-preview-product-link{color:var(--color-primary);display:inline-block;font-size:13px;font-weight:600;margin:0;text-decoration:underline;text-underline-offset:2px} #customize #customCharmPopin .ccsp-preview-product-link:hover,.ccsp-mobile-preview .ccsp-preview-product-link:hover{opacity:.75} #customize #customCharmPopin .ccsp-preview-main,.ccsp-mobile-preview .ccsp-preview-main{align-items:center;background:var(--cb-preview-img);border-radius:var(--r-md);display:flex;flex:1 1 auto;justify-content:center;min-height:0;overflow:hidden;position:relative;width:100%} #customize #customCharmPopin .ccsp-preview-main picture,.ccsp-mobile-preview .ccsp-preview-main picture{align-items:center;display:flex;height:100%;justify-content:center;margin:auto;max-height:100%;max-width:100%;width:100%} #customize #customCharmPopin .ccsp-preview-main img,.ccsp-mobile-preview .ccsp-preview-main img{display:block;height:auto;margin:auto;max-height:100%;max-width:100%;object-fit:contain;width:auto} #customize #customCharmPopin .ccsp-preview-thumbs,.ccsp-mobile-preview .ccsp-preview-thumbs{display:grid;flex-shrink:0;gap:8px;grid-template-columns:repeat(4,1fr);margin-top:8px} #customize #customCharmPopin .ccsp-preview-thumbs img,.ccsp-mobile-preview .ccsp-preview-thumbs img{aspect-ratio:1;border-radius:var(--r-sm);display:block;object-fit:cover;width:100%} #customCharmPopin #customCharmSearchResults{align-content:start;align-items:stretch;box-sizing:border-box;display:grid;flex:1 1 auto;gap:12px;grid-auto-rows:max-content;grid-template-columns:repeat(3,minmax(96px,1fr));justify-items:stretch;max-height:none;min-height:200px;overflow-x:hidden;overflow-y:auto;padding-inline-end:2px;scrollbar-color:var(--color-cream-dark) transparent;scrollbar-gutter:stable;scrollbar-width:thin} #customCharmPopin #customCharmSearchResults::-webkit-scrollbar{width:10px} #customCharmPopin #customCharmSearchResults::-webkit-scrollbar-track{background:transparent} #customCharmPopin #customCharmSearchResults::-webkit-scrollbar-thumb{background:var(--color-cream-dark);background-clip:content-box;border:3px solid transparent;border-radius:var(--r-pill)} #customCharmPopin #customCharmSearchResults::-webkit-scrollbar-thumb:hover{background:var(--color-gold);background-clip:content-box} #customCharmPopin #customCharmSearchResults:has(>.customize-empty:only-child){align-items:center;display:flex;flex-direction:column;justify-content:center} .ccsp-mobile-preview{align-items:center;box-sizing:border-box;display:flex;inset:0;justify-content:center;padding:16px;position:fixed;z-index:2400} .ccsp-mobile-preview[hidden],.ccsp-mobile-preview[aria-hidden="true"]{display:none!important;pointer-events:none} @media (min-width:901px){.ccsp-mobile-preview{display:none!important;pointer-events:none}} .ccsp-mobile-preview__backdrop{background:rgba(0,0,0,.5);inset:0;position:absolute} .ccsp-mobile-preview__panel{background:var(--color-page);border-radius:var(--r-lg);display:flex;flex-direction:column;height:auto;max-height:92dvh;overflow:hidden;position:relative;width:100%;z-index:1} .ccsp-mobile-preview__close{background:transparent;border:none;cursor:pointer;line-height:0;margin:-6px -6px -6px 0;padding:6px} .ccsp-mobile-preview__body{-webkit-overflow-scrolling:touch;box-sizing:border-box;flex:0 1 auto;min-height:0;overflow:auto;padding:14px} .ccsp-mobile-preview__footer{background:var(--color-page);border-top:1px solid var(--color-cream-dark);box-sizing:border-box;flex:0 0 auto;padding:10px 14px max(12px,env(safe-area-inset-bottom,0px))} .ccsp-mobile-preview__footer .ccsp-right-footer{margin:0;padding:0} .ccsp-mobile-preview .ccsp-selected{font-weight:600;opacity:.85} .ccsp-mobile-preview .ccsp-add-btn.button:disabled,.ccsp-mobile-preview .ccsp-right-footer .ccsp-selected{margin-bottom:8px} #customize #ccspMobilePreviewBody .ccsp-preview-loading--placeholder{align-items:center;background:var(--cb-preview-img);border-radius:var(--r-md);color:var(--color-muted);display:flex;flex-direction:column;justify-content:center;margin:0;min-height:220px;pointer-events:none;position:relative;width:100%} #customize .customize-optional-details__summary{color:var(--cb-meta-fg);cursor:pointer;font-size:14px;font-weight:600;list-style:none;padding:2px 0} #customize .customize-optional-details__summary:before{color:var(--color-gold);content:"▸";display:inline-block;font-size:13px;margin-right:6px;transition:transform var(--motion-duration) var(--motion-ease)} #customize .customize-optional-details[open] .customize-optional-details__summary:before{transform:rotate(90deg)} #customize .summary-total-amount{color:var(--cb-commerce-fg);font-weight:600} #customize .customize-step[data-step="5"] .summary-reassurance{margin-top:28px} #customize #customSummary{box-sizing:border-box;min-width:0;width:100%} #customize .summary-table{border-collapse:collapse;box-sizing:border-box;max-width:100%;width:100%} #customize .summary-table tr{border-bottom:1px solid var(--color-cream-dark)} #customize .summary-table tr:last-child{border-bottom:0} #customize .summary-table .summary-label{color:var(--color-muted);font-weight:600} #customize .summary-table .summary-label,#customize .summary-table .summary-value{line-height:1.5;padding:12px 18px;vertical-align:top} #customize .summary-table .summary-value{color:var(--color-charcoal)} #cpbSizingChip,#cpbSizingSep{display:none} #customize .customize-step-intro{color:var(--color-muted);font-size:13px;font-weight:400;margin:0 0 8px} #customize .summary-table .summary-charm-row{align-items:baseline;display:flex;flex-wrap:wrap;gap:4px;margin:0 0 6px} #customize .summary-table .summary-charm-row:last-child{margin-bottom:0} #customize .summary-table .summary-charm-name{flex:0 1 auto;min-width:0} #customize .summary-table .summary-charm-qty{color:var(--color-muted);flex:0 0 auto;font-variant-numeric:tabular-nums;white-space:nowrap} #customize .summary-remark-attachments,#customize .summary-remark-body{display:block} #customize .summary-remark-chip{background:var(--pink-10);border:1px solid var(--pink-16);border-radius:var(--r-pill);box-sizing:border-box;color:var(--color-primary);display:inline-block;font-size:13px;font-weight:600;line-height:1.25;padding:4px 10px} #customize #customSummaryStockAlert.customize-charm-warn{font-weight:400;margin:0 0 14px} #customize #customSummaryStockAlert>p:first-child{font-weight:600} #customize #customSummaryStockAlert ul{font-weight:400;margin:8px 0 0;padding-left:1.2em} #customize #customSummaryStockAlert ul li{font-weight:400;margin:0 0 4px} #customize #customSummaryStockAlert p+p{font-weight:400;margin-top:8px} #customize #customDiscardConfirm,#customize #customNoCharmConfirm{align-items:center;animation:cbConfirmFadeIn .18s;backdrop-filter:blur(3px);background:rgba(15,15,15,.30);border-radius:0;display:none;inset:0;justify-content:center;position:fixed;z-index:2000} #customize #customDiscardConfirm .customize-inline-confirm-card,#customize #customNoCharmConfirm .customize-inline-confirm-card{animation:cbConfirmSlideUp var(--motion-duration) var(--motion-ease);background:var(--color-page);border:1.5px solid var(--color-cream-dark);border-radius:var(--r-md);box-shadow:var(--sh-pop);padding:20px 22px;width:min(440px,90%)} #customize .customize-inline-confirm-text{color:var(--color-charcoal);font-size:15px;line-height:1.55;margin:0 0 4px} #customize .customize-inline-confirm-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;margin-top:14px} #customize .customize-inline-confirm-actions .button,#customize .customize-inline-confirm-actions .button2{border-radius:var(--control-radius);font-size:14px;margin-top:0;padding:8px 18px} #customize .customize-line-inline-link{color:var(--cb-meta-fg);font-weight:600;text-decoration:underline} #customize #customNoCharmConfirm .customize-inline-confirm-actions{flex-wrap:nowrap} #customize .customize-draft-banner[hidden]{display:none} #customize .customize-step-shell.is-draft-pending .customize-step[data-step="1"]>.customize-card{display:none!important} #customize .customize-layout--draft-pending .customize-sticky-actions{display:none!important} #customize .customize-layout--draft-pending #customizeMobileTotalStrip{display:none!important} #customize{background:var(--color-page)} #customize .customize-left{background:var(--color-page);border:1px solid var(--color-cream-dark);box-shadow:none} .customize-step-progress{background:var(--cb-progress-track)} #customize .material-card{border-color:var(--color-cream-dark);transition:border-color var(--motion-duration) var(--motion-ease), background var(--motion-duration) var(--motion-ease)} #customize .material-card:hover{border-color:var(--color-primary-light)} @media (max-width:900px){ body#customize{--customize-mobile-nav-h:calc(68px + env(safe-area-inset-bottom,0px))} #customize .customize-layout{box-sizing:border-box;display:flex;flex-direction:column;flex-wrap:nowrap;gap:0;margin-bottom:0;padding-bottom:0;width:100%} #customize .customize-right{max-width:100%;min-width:0;order:1;width:100%} #customize .customize-left{display:none;order:3} #customize .customize-sticky-actions,#customize .customize-sticky-actions__inner{display:contents} #customize .customize-step-nav{order:4} #customize .customize-right .customize-card{background:transparent;box-shadow:none;margin-bottom:0;padding:0} #customize .customize-right{flex:0 1 auto} #customize .customize-step[data-step="1"],#customize .customize-step[data-step="1"]>.customize-card{flex:0 1 auto} #customize .customize-mobile-preview-slot{margin-top:8px;order:2} #customize .customize-step-nav #customCartError.customize-cart-error[hidden]{display:none;height:0;margin:0;min-height:0;overflow:hidden;padding:0;visibility:hidden} #customize .customize-step-nav #customCartError.customize-cart-error:not([hidden]){display:block;margin-top:8px;min-height:0;visibility:visible} #customize .customize-color-dot{flex:0 0 auto;height:34px;width:34px} #customize #customBraceletSVG{flex:0 1 auto;max-height:min(440px,52vh);min-height:200px;transform:translateY(14px)} #customize #customizeMobilePreviewSlot{align-items:center;box-sizing:border-box;display:flex;flex-direction:column;gap:12px;margin-top:0;padding:0 0 calc(var(--customize-mobile-nav-h) + 12px);width:100%} #customize #customizeMobilePreviewSlot .customize-preview{background:var(--color-page);border-radius:var(--r-md);box-shadow:var(--sh-card);box-sizing:border-box;margin:0 auto;max-width:640px;order:1;padding:12px;width:100%} #customize #customizeMobilePreviewSlot #customizeMobileTotalStrip{box-sizing:border-box;display:block;margin:0 auto;max-width:640px;order:3;scroll-margin-bottom:var(--customize-mobile-nav-h);width:100%} #customize #customizeMobilePreviewSlot .customize-preview-one{background:var(--cb-preview-well);cursor:pointer;display:flex;flex-direction:column;width:100%} #customize #customizeMobilePreviewSlot #customBraceletSVG{display:block;height:min(86vw,520px);margin:0 auto;min-height:360px;transform:translateY(20px) scale(1.04);transform-origin:center;width:100%} #customize #customizeMobilePreviewSlot .customize-preview-chips{display:flex;justify-content:center;margin:0;max-width:520px;order:2;padding:0;width:100%} #customize .customize-color-dots{align-items:center;display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-start;overflow:visible;padding:4px 0} #customize .customize-color-dot .customize-color-dot__num{display:block;font-size:11px;font-weight:600;left:50%;line-height:1;pointer-events:none;position:absolute;text-shadow:0 1px 2px rgba(0,0,0,.18);top:50%;transform:translate(-50%,-50%);user-select:none} #customize .customize-step[data-step="1"] .customize-field:not(.customize-field--colors){margin-bottom:16px} #customize .customize-field--colors{margin-bottom:0} #customize #customCharmPopin .ccsp-header{align-items:stretch;gap:12px;grid-template-columns:1fr;margin-bottom:0} #customize #customCharmPopin .ccsp-title{font-size:17px;line-height:1.2;padding-right:36px;white-space:normal} #customize #customCharmPopin .ccsp-search{min-width:0;width:100%} #customize #customCharmPopin .ccsp-search .customize-input{box-sizing:border-box;font-size:14px;padding:8px 10px;width:100%} #customize #customCharmPopin .ccsp-symbol-filters-scroll{grid-column:1;min-width:0;position:relative} #customize #customCharmPopin .ccsp-symbol-filters-scroll:after,#customize #customCharmPopin .ccsp-symbol-filters-scroll:before{bottom:2px;content:"";opacity:0;pointer-events:none;position:absolute;top:0;transition:opacity var(--motion-duration) var(--motion-ease);width:22px;z-index:1} #customize #customCharmPopin .ccsp-symbol-filters-scroll:before{background:linear-gradient(90deg,var(--color-page),rgba(255,255,255,0));left:0} #customize #customCharmPopin .ccsp-symbol-filters-scroll:after{background:linear-gradient(270deg,var(--color-page),rgba(255,255,255,0));right:0} #customize #customCharmPopin .ccsp-symbol-filters-scroll.ccsp-symbol-filters-scroll--fade-end:after,#customize #customCharmPopin .ccsp-symbol-filters-scroll.ccsp-symbol-filters-scroll--fade-start:before{opacity:1} #customize #customCharmPopin .ccsp-symbol-filters{-webkit-overflow-scrolling:touch;flex-wrap:nowrap;gap:6px;min-width:0;overflow-x:auto;overflow-y:hidden;padding-bottom:4px;scrollbar-width:none} #customize #customCharmPopin .ccsp-symbol-btn{flex-shrink:0;font-size:12px;padding:7px 10px;white-space:nowrap} #customize #customCharmPopin .ccsp-stock-warn{margin-bottom:6px} #customize #customCharmPopin .ccsp-right{display:none} #customize #customCharmPopin.popin.open{align-items:stretch;justify-content:stretch;padding:0} #customize #customCharmPopin.popin.open .custom-charm-popin-panel{border-radius:0;display:flex;flex-direction:column;height:100dvh;margin:0;max-height:100dvh;min-height:0;max-width:100%;overflow:hidden;width:100%} #customize #customCharmPopin.popin.open .custom-charm-popin-panel .content{-webkit-overflow-scrolling:touch;padding:max(16px,env(safe-area-inset-top,0px)) 44px max(16px,env(safe-area-inset-bottom,0px)) 16px} #customize #customCharmPopin #ccspBraceletSummaryWrap.ccsp-charm-tag-wrap{max-height:104px;padding:8px 10px} #customize #customCharmPopin #ccspBraceletSummaryWrap .ccsp-charm-tag-row{gap:5px} #customCharmPopin #customCharmSearchResults{grid-template-columns:repeat(2,minmax(96px,1fr));min-height:min(50vh,480px)} #customize #customCharmPopin.popin.open .custom-charm-popin-panel .content{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;overflow:hidden} #customize #customCharmPopin.popin.open .ccsp-body{display:grid;flex:1 1 auto;gap:14px;grid-template-columns:1fr;grid-template-rows:minmax(0,1fr);min-height:0} #customize #customCharmPopin.custom-charm-popin--sheet-mode{align-items:stretch;justify-content:stretch;padding:0} #customize #customCharmPopin.custom-charm-popin--sheet-mode .custom-charm-popin-backdrop{background:rgba(0,0,0,.45)} #customize #customCharmPopin.custom-charm-popin--sheet-mode .custom-charm-popin-panel{border-radius:0;display:flex;flex-direction:column;height:100dvh;margin:0;max-height:100dvh;max-width:100%;overflow:hidden;position:relative;width:100%} #customize #customCharmPopin.custom-charm-popin--sheet-mode .custom-charm-popin-handle{background:var(--color-page);display:flex;flex-shrink:0;justify-content:center;padding:10px 0 6px} #customize #customCharmPopin.custom-charm-popin--sheet-mode .custom-charm-popin-handle__bar{background:rgba(0,0,0,.2);border-radius:99px;height:4px;width:40px} #customize #customCharmPopin.custom-charm-popin--sheet-mode .custom-charm-popin-panel>.custom-charm-popin__close{top:14px} #customize #customCharmPopin.custom-charm-popin--sheet-mode .custom-charm-popin-panel .content{-webkit-overflow-scrolling:touch;display:flex;flex:1 1 auto;flex-direction:column;min-height:0;overflow:hidden} #customize #customCharmPopin.custom-charm-popin--sheet-mode .ccsp-body{flex:1 1 auto;min-height:0} #customize .customize-draft-banner{position:sticky;top:0;z-index:5} #customize .customize-step-shell.is-draft-pending{box-sizing:border-box;display:grid;grid-template-rows:auto 1fr;min-height:100dvh;padding-bottom:max(12px,env(safe-area-inset-bottom,0px))} #customize .customize-step-shell.is-draft-pending .customize-step[data-step="1"]{gap:8px;grid-row:2;justify-content:center;transform:translateY(-16vh)} #customize .customize-step-shell.is-draft-pending .customize-draft-banner{margin:0;position:static;top:auto} #customize .customize-step-shell.is-draft-pending .customize-draft-hint{margin:0} .customize-step-shell.is-draft-pending .customize-step-meta{margin-bottom:10px} #customize .customize-step-nav{background:var(--color-page);border-top:1px solid var(--color-cream-dark);bottom:0;box-shadow:0 -4px 24px rgba(0,0,0,.06);left:0;margin:0 auto;max-width:720px;padding:10px 12px max(10px,env(safe-area-inset-bottom,0px));position:fixed;right:0;z-index:1800} #customize .customize-step-nav .button,#customize .customize-step-nav .button2{border-radius:var(--control-radius);font-size:16px;line-height:1.15;margin-top:0;padding:12px 14px} #customize .customize-step-nav__next-wrap,#customize .customize-step-nav__prev{flex:1 1 0} body#customize:has(.customize-layout--step-5){--customize-mobile-nav-h:calc(168px + env(safe-area-inset-bottom,0px))} #customize .customize-layout--step-5 #customizeMobilePreviewSlot #customizeMobileTotalStrip{display:none} #customize .customize-layout--step-5 #customizeMobilePreviewSlot{padding-bottom:calc(var(--customize-mobile-nav-h) + 12px);scroll-margin-bottom:var(--customize-mobile-nav-h)} #customize .customize-layout--step-5 .customize-sticky-actions{background:var(--color-page);border-top:1px solid var(--color-cream-dark);bottom:0;box-shadow:0 -4px 24px rgba(0,0,0,.06);box-sizing:border-box;display:block;left:0;margin:0 auto;max-width:720px;padding:10px 12px max(10px,env(safe-area-inset-bottom,0px));position:fixed;right:0;width:100%;z-index:1800} #customize .customize-layout--step-5 .customize-sticky-actions__inner{align-items:center;display:flex;flex-direction:column;gap:10px} #customize .customize-layout--step-5 .customize-bottom-bar{display:block;flex:0 0 auto;margin:0;padding:0;width:100%} #customize .customize-layout--step-5 .customize-step-nav{background:transparent;border-top:0;bottom:auto;box-shadow:none;display:block;left:auto;margin:0;max-width:none;padding:0;position:static;right:auto;width:100%;z-index:auto} #customize .customize-layout--step-5 .customize-step-nav__main-row{align-items:center;box-sizing:border-box;display:grid;gap:12px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-width:0;width:100%} #customize .customize-layout--step-5 .customize-sticky-actions .customize-step-nav__main-row--final-edit{align-items:center;display:flex;flex-wrap:nowrap;gap:12px;width:100%} #customize .customize-layout--step-5 .customize-sticky-actions .customize-step-nav__main-row--final-edit .customize-step-nav__next-wrap{align-items:stretch;display:flex;flex:1 1 0;flex-direction:column;margin:0;min-width:0} #customize .customize-layout--step-5 .customize-sticky-actions .customize-step-nav__main-row--final-edit #customPrevStep{flex:1 1 0;grid-column:unset;grid-row:unset;min-width:0;width:100%} #customize .customize-layout--step-5 .customize-sticky-actions .customize-step-nav__main-row--final-edit #customAddToCart{align-self:auto;flex:1 1 auto;grid-column:unset;grid-row:unset;min-width:0;width:100%} #customize .customize-layout--step-5 .customize-step-nav__next-wrap{display:contents} #customize .customize-layout--step-5 .customize-sticky-actions #customAddToCartHelp.customize-cta-help:empty,#customize .customize-layout--step-5 .customize-sticky-actions #customCartError.customize-cart-error[hidden]{display:none!important;height:0;margin:0;min-height:0;overflow:hidden;padding:0;visibility:hidden} #customize .customize-layout--step-5 .customize-sticky-actions #customAddToCartHelp.customize-cta-help:not(:empty),#customize .customize-layout--step-5 .customize-sticky-actions #customCartError.customize-cart-error:not([hidden]){grid-column:1 / -1;margin:0;min-height:0} #customize .customize-layout--step-5 .customize-sticky-actions .customize-step-nav__main-row:not(.customize-step-nav__main-row--final-edit) #customPrevStep{grid-column:1;grid-row:1} #customize .customize-layout--step-5 .customize-sticky-actions .customize-step-nav__main-row:not(.customize-step-nav__main-row--final-edit) #customAddToCart{grid-column:2;grid-row:1} #customize .customize-layout--step-5 .customize-sticky-actions .customize-step-nav__main-row--final-solo #customAddToCart{grid-column:1 / -1} #customize .customize-layout--step-5 .customize-sticky-actions .customize-step-nav__main-row--solo-cta #customEditCancel{grid-column:1;grid-row:1} #customize .customize-layout--step-5 .customize-sticky-actions .customize-step-nav__main-row--solo-cta #customEditSave{grid-column:2;grid-row:1} #customize .customize-layout--step-5 .customize-sticky-actions #customEditCancel,#customize .customize-layout--step-5 .customize-sticky-actions #customEditSave,#customize .customize-layout--step-5 .customize-sticky-actions #customNextStep{display:none!important} .customize-layout--step-5 .customize-step-nav .button2{border-radius:var(--control-radius);font-size:14px;padding:10px 12px} body#customize #content,body#customize main#content{padding-bottom:calc(var(--customize-mobile-nav-h) + 16px)} body#customize .scrollTop{bottom:calc(var(--customize-mobile-nav-h) + 8px);right:14px;z-index:1905} body#customize #customizeToast:not(.customize-toast--in-charm-popin){bottom:auto;top:calc(var(--nav-bar-h,60px) + 8px)} body#customize #customizeToast.customize-toast--in-charm-popin{bottom:max(16px,env(safe-area-inset-bottom,0px));top:auto} } @media (min-width:901px){ #customize .customize-layout{align-items:flex-start;box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:wrap;gap:clamp(16px,2.5vw,32px);margin:0 auto 40px;max-width:1320px;padding-bottom:72px;width:100%} #customize .customize-left{box-shadow:var(--sh-card);flex:0 0 clamp(420px,38vw,640px);flex-direction:column;gap:16px;position:sticky;top:var(--customize-sticky-top)} #customize .customize-left,#customize .customize-right{align-self:flex-start;background:var(--color-page);border-radius:var(--r-md);box-sizing:border-box;display:flex;min-width:0;padding:16px} #customize .customize-right{flex:1 1 0;flex-direction:column} #customize .customize-right .customize-card{background:transparent;border-radius:0;box-shadow:none;margin-bottom:16px;padding:0} #customize .customize-right .customize-card:last-child{margin-bottom:0} #customize .customize-color-dots{box-sizing:border-box;flex-wrap:nowrap;gap:6px;overflow-x:hidden;padding:6px 10px} #customize .customize-step.customize-step--active{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;overflow:auto;padding-right:0} #customize .customize-step.customize-step--active>.customize-card{display:flex;flex:1 1 auto;flex-direction:column;margin-bottom:0;min-height:0} #customize .customize-step.customize-step--active[data-step="2"] .customize-card{display:flex;flex:0 1 auto;flex-direction:column;min-height:0} #customize .customize-step.customize-step--active[data-step="2"] #customCharmList{flex:0 1 auto;max-height:none;min-height:0;overflow-x:hidden;overflow-y:visible} #customize .customize-preview,#customize .customize-preview-one{display:flex;flex-direction:column;min-height:0} #customize .customize-preview-one{background:var(--cb-preview-well);border:1px solid var(--color-cream-dark);border-radius:var(--r-md);overflow:hidden} #customize .customize-sticky-actions{background:var(--color-page);border-top:1px solid var(--color-cream-dark);bottom:0;box-shadow:0 -2px 8px rgba(0,0,0,.06);left:0;position:fixed;right:0;width:100%;z-index:10} #customize .customize-sticky-actions .customize-sticky-actions__inner{align-items:center;box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:nowrap;gap:16px;margin:0 auto;max-width:1320px;padding:12px 0;width:90%} #customize .customize-sticky-actions .customize-bottom-bar{align-items:center;background:transparent;border:none;box-shadow:none;display:flex;flex:0 0 auto;flex-direction:row;margin:0;padding:0} #customize .customize-sticky-actions .customize-total{align-self:center;flex:0 0 auto;flex-shrink:0;min-width:0;text-align:left} #customize .customize-sticky-actions .customize-step-nav{align-items:center;display:flex;flex:1 1 auto;flex-direction:row;gap:12px;margin-left:auto;margin-top:0;max-width:600px;min-width:0} #customize .customize-sticky-actions .customize-step-nav__prev{box-sizing:border-box;flex:1 1 0;margin:0;max-width:none;min-width:0;width:100%} #customize .customize-sticky-actions .customize-step-nav__next-wrap{align-items:stretch;display:flex;flex:1 1 0;flex-direction:column;margin:0;min-width:0} #customize .customize-sticky-actions .customize-step-nav__main-row.customize-step-nav__main-row--solo-cta .customize-step-nav__next-wrap{align-items:stretch;display:flex;flex:1 1 0;flex-direction:row;gap:12px;margin:0;min-width:0} #customize .customize-sticky-actions .customize-step-nav__next-wrap .button,#customize .customize-sticky-actions .customize-step-nav__next-wrap .button2{box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%} #customize .customize-sticky-actions #customPrevStep{box-sizing:border-box;width:100%} #customize .customize-sticky-actions #customPrevStep.customize-step-nav__prev--off,#customize .customize-sticky-actions #customPrevStep[hidden]{display:none!important} #customize #customPrevStep.button2.customize-step-nav__prev:not(.customize-step-nav__prev--ghost){background:var(--btn-outline-bg);border:1.5px solid var(--btn-outline-border);color:var(--btn-outline-fg)} #customize #customPrevStep.button2.customize-step-nav__prev:not(.customize-step-nav__prev--ghost):hover{background:var(--btn-outline-bg-hover)} #customize .customize-layout--step-5 .customize-sticky-actions .customize-step-nav{align-items:center;display:flex;flex:1 1 auto;flex-direction:row;margin-left:auto;margin-top:0;max-width:600px;min-width:0} #customize .customize-layout--step-5 .customize-sticky-actions .customize-step-nav__main-row--final-edit{align-items:center;display:flex;flex-wrap:nowrap;gap:12px;width:100%} #customize .customize-layout--step-5 .customize-sticky-actions .customize-step-nav__main-row--final-edit .customize-step-nav__next-wrap{align-items:stretch;display:flex;flex:1 1 0;flex-direction:column;margin:0;min-width:0} #customize .customize-layout--step-5 .customize-sticky-actions .customize-step-nav__main-row--final-edit #customPrevStep{flex:1 1 0;grid-column:unset;grid-row:unset;min-width:0;width:100%} #customize .customize-layout--step-5 .customize-sticky-actions .customize-step-nav__main-row--final-edit #customAddToCart{align-self:auto;flex:1 1 auto;grid-column:unset;grid-row:unset;min-width:0;width:100%} #customize .customize-layout--step-5 .customize-sticky-actions #customCartError.customize-cart-error:not([hidden]){display:block;margin-top:8px;visibility:visible} #customize #customCharmPopin.popin.open .custom-charm-popin-panel{box-sizing:border-box;height:min(94vh,1000px);max-height:min(94vh,1000px);min-height:0;width:min(1720px,calc(100vw - 48px))} #customize #customCharmPopin.popin.open .custom-charm-popin-panel .content{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;overflow:hidden} #customize #customCharmPopin .ccsp-body{flex:1 1 auto;grid-template-rows:minmax(0,1fr);min-height:0;overflow:hidden} #customize #customCharmPopin #ccspBraceletSummaryWrap,#customize #customCharmPopin .ccsp-header,#customize #customCharmPopin .ccsp-stock-warn{flex-shrink:0} #customize #customCharmPopin .ccsp-right{overflow:hidden} #customCharmPopin #customCharmSearchResults{grid-template-columns:repeat(5,minmax(96px,1fr))} #customize .customize-mobile-preview-slot{display:none} #customize .customize-left,#customize .customize-right{order:unset} #customize #customBraceletSVG{max-height:100%;min-height:0} #customize #customBraceletSVG{flex:0 1 auto;max-height:min(440px,52vh);min-height:200px} #customize .material-cards{grid-template-columns:1fr} #customize .customize-layout--draft-pending{padding-bottom:40px} #customize .customize-layout--draft-pending .customize-right{align-self:stretch;flex:1 1 0;min-height:min(560px,calc(100vh - var(--customize-sticky-top) - 5rem))} #customize .customize-layout--draft-pending .customize-step-shell.is-draft-pending{display:flex;flex:1 1 auto;flex-direction:column;min-height:0} #customize .customize-layout--draft-pending .customize-step-shell.is-draft-pending .customize-step-meta{flex:0 0 auto;margin-bottom:12px} #customize .customize-layout--draft-pending .customize-step-shell.is-draft-pending .customize-step.customize-step--active{align-items:center;flex:1 1 auto;justify-content:center;overflow:visible;text-align:center} #customize .customize-layout--draft-pending .customize-step-shell.is-draft-pending .customize-draft-banner{margin-inline:auto;max-width:480px;width:100%} #customize .customize-layout--draft-pending .customize-step-shell.is-draft-pending .customize-draft-hint{margin-inline:auto;max-width:480px} }