.ba-container{position:relative;overflow:hidden;--position: 50%;height:100%}@media screen and (max-width: 749px){.ba-container{width:100vw;margin-left:-1.4rem}.mm-modal-container .ba-container{margin-left:-2rem}}.mm-modal-container{overflow:hidden}.ba-image-container{aspect-ratio:1.09}.ba-image{position:absolute;display:block;width:100%;max-width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:left;object-position:left}.before-image{position:absolute;top:0;right:0;bottom:0;left:0;width:var(--position);z-index:2}.after-image{position:absolute;z-index:1}.ba-range-slider{position:absolute;top:0;right:0;bottom:0;left:0;cursor:pointer;opacity:0;width:100%;height:100%;z-index:3}.ba-range-slider:focus-visible~.ba-slider-button{outline:2px solid black;outline-offset:2px}.ba-slider-line{position:absolute;top:0;right:0;bottom:0;left:0;width:.2rem;height:100%;background-color:#fff;left:var(--position);transform:translate(-50%);pointer-events:none;z-index:3}.ba-slider-button{position:absolute;background-color:#fff;color:rgb(var(--color-foreground));padding:.8rem;border-radius:100vw;display:-ms-grid;display:grid;place-items:center;top:50%;left:var(--position);transform:translate(-50%,-50%);pointer-events:none;box-shadow:1px 1px 1px #08030380;width:4.8rem;height:4.8rem;z-index:3}.before-label,.after-label{position:absolute;top:2.4rem;z-index:4;padding:.4rem .8rem;background-color:#ffffffe6;border-radius:.4rem}.before-label{left:2.4rem}.after-label{right:2.4rem}.mobile-before-after-button{display:none;transition:opacity .2s ease-in-out}@media screen and (max-width: 749px){.ba-range-slider,.ba-slider-line,.ba-slider-button{display:none}.before-label{opacity:0;left:unset;right:1.6rem;transition:opacity .2s ease-in-out}.after-label{right:unset;left:1.6rem;transition:opacity .2s ease-in-out}.ba-image{object-position:center}.before-image{width:100%;opacity:0;transition:opacity .2s ease-in-out}.mobile-before-after-button{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;justify-content:center;align-items:center;transition:opacity .2s ease-in-out;z-index:5;border:none;background-color:transparent;color:#fff}.mobile-before-after-button-content{width:17rem}.mobile-before-after-button svg{display:inline-block;margin-bottom:1.6rem}}@media screen and (min-width: 750px){.lens-color-guide{display:grid;grid-template-columns:calc(66% - 1.4rem) calc(34% - 1.4rem);gap:3.6rem;align-items:start}.ba-image-container{aspect-ratio:1.6567}}.current-lens-image img{display:block;width:100%;height:auto;margin-bottom:2.4rem}.lens-color-guide-swatches-wrap,.lens-color-guide-description,.lens-color-guide .quick-features{margin-bottom:1.6rem}.lens-color-guide-description p{margin-top:0}.lens-color-guide-swatches .product-form__input{margin-bottom:0}@media screen and (max-width: 749px){.lens-color-guide-swatches-wrap{margin-top:1.6rem}}.lens-color-guide-summary{display:flex;width:100%;justify-content:space-between;align-items:center;padding:1.2rem .01rem;border-top:rgba(0,0,0,.12) solid 1px;border-bottom:rgba(0,0,0,.12) solid 1px}.lens-color-guide-conditions,.lens-color-guide-vlt{display:flex;align-items:center}.lens-color-guide-vlt{justify-content:flex-end}.lens-color-guide-vlt span{margin-left:.8rem}.lens-color-guide-vlt svg{display:block}.lens-color-guide-conditions svg{display:block;margin-right:.5rem;width:20px;height:20px}.vlt-title{font-weight:500}.vlt-info{position:relative}.vlt-info-link{display:block;border:none;padding:0;margin:0;background-color:transparent;color:rgb(var(--color-foreground))!important;font-family:var(--font-body-family)}.tooltip-toggle{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.vlt-info-label{position:relative;display:inline-block;cursor:pointer}.custom-tooltip{position:relative;display:inline-block}.tooltip-content{position:absolute;bottom:100%;right:-10px;margin-bottom:10px;visibility:hidden;opacity:0;transition:opacity .2s,visibility .2s,transform .2s;transform:translateY(10px);z-index:10;pointer-events:none}.tooltip-text{display:block;width:220px;background-color:#101010f2;color:#fff;text-align:left;padding:8px 10px;border-radius:2px;font-size:14px;white-space:normal;word-wrap:break-word}.tooltip-arrow{position:absolute;bottom:-5px;right:10px;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:5px solid rgba(16,16,16,.95)}.custom-tooltip:hover .tooltip-content{visibility:visible;opacity:1;transform:translateY(0)}.tooltip-toggle:checked~.custom-tooltip .tooltip-content{visibility:visible;opacity:1;transform:translateY(0)}.tooltip-toggle:focus~.custom-tooltip{outline:1px dotted #000;outline-offset:2px}.lens-color-guide .swatch-input__input+.swatch-input__label.large-swatch{--swatch-input--size: 4.8rem}@media screen and (max-width: 749px){.lens-color-guide .swatch-input__input+.swatch-input__label.large-swatch{--swatch-input--size: 13.75vw}}.lens-color-guide .variant-option-name,.lens-color-guide .product-form__input--dropdown{display:none}.lens-color-guide fieldset.product-form__input .form__label{margin-bottom:1.2rem;font-size:1.6rem;line-height:1.5}@media screen and (min-width: 750px){.lens-color-guide fieldset.product-form__input .form__label{margin-bottom:.8rem}}.lens-color-guide fieldset.product-form__input .form__label .normal-weight{font-weight:500}.lens-color-guide-wrap-button{margin-top:0;margin-bottom:2.4rem}.lens-color-guide-wrap-button .link{font-size:1.6rem;font-weight:500;line-height:1.5;padding:0}@media screen and (min-width: 750px){.lens-color-guide-wrap-button{margin-bottom:3.2rem}}.pop-lens-color-guide-modal .mm-modal-close{width:4.8rem;height:4.8rem;padding:.8rem;border-color:#00000052;color:rgb(var(--color-foreground))}.pop-lens-color-guide-modal .svg-wrapper{width:26px;height:26px}.pop-lens-color-guide-modal .lens-color-guide{margin-top:1rem}@media screen and (min-width: 750px){.pop-lens-color-guide-modal .lens-color-guide{grid-template-columns:calc(57% - 1.2rem) calc(43% - 1.2rem);gap:2.4rem;align-items:start}.pop-lens-color-guide-modal .ba-image-container{aspect-ratio:1.075}}@media screen and (min-width: 750px) and (max-height: 900px){.pop-lens-color-guide-modal .lens-color-guide{grid-template-columns:1fr}.pop-lens-color-guide{scroll-margin-top:9rem}.pop-lens-color-guide-modal .lens-color-guide-info{grid-row-start:1;display:grid;grid-template-columns:calc(46% - .8rem) calc(54% - .8rem);gap:0 1.6rem}.pop-lens-color-guide-modal .current-lens-image{grid-row-start:1;grid-row-end:5}.pop-lens-color-guide-modal .ba-container{aspect-ratio:1.5/1}}lens-color-guide,guide-selects{display:block}
/*# sourceMappingURL=/cdn/shop/t/513/assets/section-lens-color-guide.css.map */