@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1;z-index:10}95%{opacity:.95;z-index:10}to{opacity:0;z-index:-1}}.gradient-overlay{z-index:-1;position:fixed;top:0;left:0;width:100%;height:100dvh;opacity:0}.gradient-overlay.closing{animation:fadeOut .3s ease-in-out forwards}.gradient-overlay.open{animation:fadeIn .3s ease-in-out forwards}.finish-drawer{position:fixed;top:0;right:-100vw;width:100%;max-width:501px;height:100dvh;background-color:var(--alabaster);z-index:11;transition:all .4s ease-in-out;display:flex;flex-direction:column;color:var(--night);font-family:var(--font-body);overflow-y:scroll;-ms-overflow-style:none;scrollbar-width:none;cursor:auto}.finish-drawer::-webkit-scrollbar{display:none}.open .finish-drawer{right:0}.finish-drawer .finish-header{display:flex;justify-content:space-between;align-items:center;margin:8px var(--page-margin-mobile) 16px;padding-bottom:7px;border-bottom:1px solid var(--tortilla)}.finish-drawer .close-icon{width:40px;height:40px;cursor:pointer}.finish-drawer .finish-options{display:flex;flex-direction:column;padding:0 var(--page-margin-mobile) 17px;gap:16px}.finish-drawer .finish-option{padding:15px 15px 13px;border:1px solid var(--tortilla);border-radius:4px;height:66px;transition:height 1s ease;cursor:pointer}.finish-drawer .option-selected.finish-option{background-color:var(--mindful);height:auto}.finish-drawer .select-btn{border-radius:50%;background-color:#fff;width:20px;height:20px;border:1px solid var(--tortilla);cursor:pointer;transition:all .2s ease-in-out;position:relative}.finish-drawer .option-selected .select-btn{background-color:var(--night);border:1px solid var(--night)}.finish-drawer .selected-dot{display:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:10px;height:10px;background-color:#fff;border-radius:50%}.finish-drawer .option-selected .selected-dot{display:block}.finish-drawer .title-and-select{display:flex;align-items:center;gap:12px}.finish-drawer .finish-description{color:var(--dusk);font-size:14px;line-height:1.6;height:0;overflow:hidden;opacity:0;padding-top:0;margin-top:0;border-top:none;transition:opacity .4s ease,padding-top .25s ease,margin-top .25s ease}.finish-drawer .option-selected .finish-description{opacity:1;padding-top:12px;margin-top:16px;border-top:1px solid var(--tortilla);height:100%}.finish-drawer .btn-container{margin-top:auto;padding:var(--page-margin-mobile) var(--page-margin-mobile);border-top:1px solid var(--tortilla);position:sticky;background-color:var(--alabaster);bottom:0}.finish-drawer .prices{display:flex;align-items:center;gap:4px}.finish-drawer .size-total .prices{gap:8px}.finish-drawer .calculator-link{display:flex;padding:8px var(--page-margin-mobile) 0;gap:16px}.finish-drawer .calculator-link p.coat{line-height:1.4;font-size:14px}.finish-drawer .calculator-link svg{flex-shrink:0;margin-top:4px}.finish-drawer .calculator-link .coat-bold{font-size:14px;line-height:1.4}.finish-drawer .size-options{margin:32px 16px 32px var(--page-margin-mobile)}.finish-drawer .size-option{display:grid;grid-template-columns:82px 1fr auto;gap:12px;padding:0 0 24px}.finish-drawer .size-total{opacity:0;display:grid;grid-template-columns:82px 1fr auto;gap:12px;border-top:1px solid var(--tortilla);transition:opacity .3s ease-in-out}.finish-drawer .size-total.show{opacity:1;padding:24px 0}.finish-drawer .p-bold{font-size:16px;line-height:1;font-weight:500;letter-spacing:-.01rem}.finish-drawer .coat-small{color:var(--dusk);line-height:1.4;letter-spacing:-.01rem}.finish-drawer .coat-underline{cursor:pointer}.finish-drawer .variant-litres,.finish-drawer .variant-pricing{padding-top:12px}@media screen and (min-width: 1000px){.finish-drawer .finish-header{margin:8px var(--page-margin-desktop) 16px}.finish-drawer .finish-options{padding:0 var(--page-margin-desktop) 17px}.finish-drawer .calculator-link{padding:8px var(--page-margin-desktop) 0;gap:20px}.finish-drawer .calculator-link svg{width:30px}.finish-drawer .size-options{margin:32px var(--page-margin-desktop)}.finish-drawer .size-option,.finish-drawer .size-total{grid-template-columns:120px 1fr auto}}
/*# sourceMappingURL=/cdn/shop/t/328/assets/coat-css-finish-drawer.css.map */