.kb-shade-drawer{--kb-shade-drawer-rail: 300px;--kb-shade-drawer-width: 940px;--kb-shade-drawer-gutter: var(--scale-56);--kb-shade-drawer-slide-mobile: 248px;--kb-shade-drawer-slide-desktop: 516px;--kb-shade-drawer-slide-dim: .4;--kb-shade-drawer-segment-track: var(--border-default);--kb-shade-drawer-progress-width: var(--kb-shade-drawer-slide-mobile)}.kb-shade-drawer__dialog{padding:0;background:var(--fill-inverse);color:var(--text-secondary);--backdrop-opacity: .6}.kb-shade-drawer__dialog[open]{display:flex;flex-direction:column;animation-duration:.3s}@media(min-width:990px){.kb-shade-drawer__dialog.dialog-modal{inline-size:min(var(--kb-shade-drawer-width),100vw);max-inline-size:min(var(--kb-shade-drawer-width),100vw);block-size:100dvh;max-block-size:100dvh;margin-block:0;margin-inline:auto 0;border-radius:0}}.kb-shade-drawer__header{display:flex;align-items:center;justify-content:space-between;gap:var(--scale-12);padding-block:var(--scale-16);padding-inline:var(--kb-shade-drawer-gutter) var(--scale-16);border-block-end:var(--border-width-xxs) solid var(--border-default)}.kb-shade-drawer__heading,.kb-shade-drawer__label,.kb-shade-drawer__shade-name,.kb-shade-drawer__shade-status,.kb-shade-drawer__shade-description,.kb-shade-drawer__pro-tip-label,.kb-shade-drawer__pro-tip-text{margin:0}.kb-shade-drawer__heading{color:var(--text-highlight-inverse);font-size:var(--font-size-mobile-19);line-height:var(--font-line-height-mobile-26);letter-spacing:var(--font-letter-spacing-3)}.kb-shade-drawer__close{display:inline-flex;align-items:center;justify-content:center;inline-size:var(--scale-40);block-size:var(--scale-40);padding:0;background:none;border:var(--border-width-xs) solid var(--border-default);border-radius:var(--border-radius-r-4);color:inherit;cursor:pointer;transition:background-color var(--animation-speed-slow) var(--animation-easing),border-color var(--animation-speed-slow) var(--animation-easing)}.kb-shade-drawer__close:hover,.kb-shade-drawer__close:focus-visible{background-color:var(--colour-neutral-100);border-color:var(--border-strong)}.kb-shade-drawer__close svg path{stroke:currentColor}.kb-shade-drawer__close .svg-wrapper{inline-size:var(--scale-16);block-size:var(--scale-16)}.kb-shade-drawer__body{flex:1 1 auto;min-block-size:0;display:flex;flex-direction:column;gap:var(--scale-28);padding-block:var(--scale-28) var(--scale-36);overflow-y:auto}.kb-shade-drawer__selectors,.kb-shade-drawer__detail,.kb-shade-drawer__pro-tip{padding-inline:var(--kb-shade-drawer-gutter)}.kb-shade-drawer__selectors{display:flex;flex-direction:column;gap:var(--scale-20)}.kb-shade-drawer__selector{display:flex;flex-direction:column;gap:var(--scale-8)}.kb-shade-drawer__label{color:var(--text-primary);font-weight:var(--font-weight-medium);font-size:var(--font-size-mobile-11);line-height:var(--font-line-height-mobile-14);letter-spacing:var(--font-letter-spacing-1-5)}.kb-shade-drawer__swatches{display:flex;flex-direction:column;gap:var(--scale-8)}.kb-shade-drawer .kb-pdp-swatch-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--scale-6)}.kb-shade-drawer__detail{display:flex;flex-direction:column;gap:var(--scale-12)}.kb-shade-drawer__detail:empty,.kb-shade-drawer__shade-name:empty,.kb-shade-drawer__shade-description:empty{display:none}.kb-shade-drawer__shade-name{color:var(--text-secondary);font-size:var(--font-size-mobile-16);line-height:var(--font-line-height-mobile-22);letter-spacing:var(--font-letter-spacing-2-5)}.kb-shade-drawer__shade-status{color:var(--border-strong)}.kb-shade-drawer__shade-status[hidden]{display:none}.kb-shade-drawer__shade-description{color:var(--text-secondary);font-size:var(--font-size-mobile-13);line-height:var(--font-line-height-mobile-16)}.kb-shade-drawer__pro-tip{display:flex;flex-direction:column;gap:var(--scale-12);color:var(--text-secondary)}.kb-shade-drawer__pro-tip[hidden]{display:none}.kb-shade-drawer__pro-tip-label{font-size:var(--font-size-mobile-9);line-height:var(--font-line-height-mobile-10);letter-spacing:var(--font-letter-spacing-1-25);font-weight:var(--font-weight-medium)}.kb-shade-drawer__pro-tip-text{font-size:var(--font-size-mobile-13);line-height:var(--font-line-height-mobile-16)}.kb-shade-drawer__carousel{display:flex;flex-direction:column;align-items:center;gap:var(--scale-14);min-inline-size:0}.kb-shade-drawer__carousel[hidden]{display:none}.kb-shade-drawer__track{display:flex;gap:var(--scale-20);inline-size:100%;min-inline-size:0;padding-inline:var(--scale-16);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;cursor:grab;-webkit-user-select:none;user-select:none}.kb-shade-drawer__track::-webkit-scrollbar{display:none}.kb-shade-drawer__track[dragging]{cursor:grabbing}.kb-shade-drawer__track:focus-visible{outline:var(--border-width-s) solid var(--border-brand);outline-offset:calc(-1 * var(--border-width-s))}.kb-shade-drawer__slide{flex:0 0 auto;inline-size:min(var(--kb-shade-drawer-slide-mobile),70vw);scroll-snap-align:center;scroll-snap-stop:always;opacity:calc(1 - (1 - var(--kb-shade-drawer-slide-dim)) * clamp(0,var(--kb-slider-slide-distance, 0),1))}.kb-shade-drawer__track .kb-shade-drawer__slide:only-child{inline-size:100%;max-inline-size:100%}.kb-shade-drawer__figure{position:relative;inline-size:100%;aspect-ratio:31 / 40;overflow:hidden}.kb-shade-drawer__image,.kb-shade-drawer__video{display:block;inline-size:100%;block-size:100%;object-fit:cover}.kb-shade-drawer__video-toggle{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:0;background:transparent;border:none;cursor:pointer}.kb-shade-drawer__video-toggle .svg-wrapper{display:inline-flex;align-items:center;justify-content:center;inline-size:var(--scale-40);block-size:var(--scale-40);color:var(--icon-primary);font-size:var(--scale-24);background:var(--colour-alpha-taupe-40);border:var(--border-width-xs) solid var(--border-strong);border-radius:var(--border-radius-r-4);-webkit-backdrop-filter:blur(var(--scale-6));backdrop-filter:blur(var(--scale-6));transition:opacity var(--animation-speed, .2s) ease,background-color var(--animation-speed-slow) var(--animation-easing)}.kb-shade-drawer__slide:not(.is-video-paused) .kb-shade-drawer__video-toggle .svg-wrapper{opacity:0}.kb-shade-drawer__video-toggle:focus-visible .svg-wrapper{opacity:1}.kb-shade-drawer__video-toggle:hover .svg-wrapper,.kb-shade-drawer__video-toggle:focus-visible .svg-wrapper{background:var(--colour-alpha-taupe-70)}.kb-shade-drawer__slide.kb-slider__clone .kb-shade-drawer__video-toggle{pointer-events:none}.kb-shade-drawer__caption{margin-block-start:var(--scale-6);color:var(--text-highlight-inverse);font-size:var(--font-size-mobile-11);line-height:normal;letter-spacing:1.65px;font-weight:var(--font-weight-medium)}.kb-shade-drawer__caption:empty{display:none}.kb-shade-drawer__progress{position:relative;inline-size:var(--kb-shade-drawer-progress-width);max-inline-size:100%;block-size:var(--border-width-xs);border-radius:var(--border-radius-round);overflow:hidden}.kb-shade-drawer__progress[hidden]{display:none}.kb-shade-drawer__progress-track,.kb-shade-drawer__progress-lead{position:absolute;inset-block:0;inset-inline-start:0;inline-size:100%;border-radius:var(--border-radius-round)}.kb-shade-drawer__progress-track{background:var(--kb-shade-drawer-segment-track)}.kb-shade-drawer__progress-lead{background:var(--text-secondary);transform:scaleX(var(--kb-slider-progress, 0));transform-origin:left center}@media(min-width:990px){.kb-shade-drawer{--kb-shade-drawer-gutter: var(--scale-24);--kb-shade-drawer-progress-width: var(--kb-shade-drawer-slide-desktop)}.kb-shade-drawer__body{display:grid;grid-template-columns:var(--kb-shade-drawer-rail) 1fr;grid-template-rows:auto 1fr auto auto;column-gap:var(--scale-36);row-gap:var(--scale-36);padding-block:var(--scale-36)}.kb-shade-drawer__selectors,.kb-shade-drawer__detail,.kb-shade-drawer__pro-tip{padding-inline:var(--kb-shade-drawer-gutter) 0}.kb-shade-drawer__selectors{grid-column:1;grid-row:1}.kb-shade-drawer__detail{grid-column:1;grid-row:3}.kb-shade-drawer__pro-tip{grid-column:1;grid-row:4}.kb-shade-drawer__carousel{grid-column:2;grid-row:1 / span 4;align-items:flex-start;justify-content:space-between;block-size:100%}.kb-shade-drawer__track{padding-inline:0}.kb-shade-drawer__slide{inline-size:var(--kb-shade-drawer-slide-desktop);max-inline-size:90%;scroll-snap-align:start}.kb-shade-drawer__heading{font-size:var(--font-size-desktop-24);line-height:var(--font-line-height-desktop-32);letter-spacing:var(--font-letter-spacing-3-5)}.kb-shade-drawer__label{font-size:var(--font-size-desktop-14);line-height:var(--font-line-height-desktop-18);letter-spacing:var(--font-letter-spacing-2)}.kb-shade-drawer__shade-name{font-size:var(--font-size-desktop-20);line-height:var(--font-line-height-desktop-28);letter-spacing:var(--font-letter-spacing-3)}.kb-shade-drawer__shade-description,.kb-shade-drawer__pro-tip-text{font-size:var(--font-size-desktop-16);line-height:var(--font-line-height-desktop-20)}.kb-shade-drawer__pro-tip-label{font-size:var(--font-size-desktop-10);line-height:var(--font-line-height-desktop-12)}}@media(prefers-reduced-motion:reduce){.kb-shade-drawer__video-toggle .svg-wrapper,.kb-shade-drawer__progress-lead,.kb-shade-drawer__close{transition:none}.kb-shade-drawer__dialog[open]{animation-duration:.01ms}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/kb-shade-drawer.css.map */