material-variant-selector{display:block}.material-selector__label-row{margin-block-end:.5rem;font-size:.875rem;line-height:1.4}.material-selector__trigger{display:grid;grid-template-columns:3.5rem minmax(0,1fr) auto;align-items:center;gap:.875rem;width:100%;min-height:4.5rem;padding:.5rem .875rem .5rem .5rem;border:1px solid rgb(var(--border-color));border-radius:var(--input-border-radius);background:rgb(var(--input-background, var(--background)));color:rgb(var(--input-text-color, var(--text-color)));text-align:start;box-shadow:0 1px 3px rgb(var(--text-color) / .08);transition:border-color .18s ease,box-shadow .18s ease}.material-selector__trigger:hover,.material-selector__trigger:focus-visible,.material-selector__trigger[aria-expanded=true]{border-color:rgb(var(--text-color) / .75);box-shadow:0 1px 4px rgb(var(--text-color) / .12);outline:none}.material-selector__trigger-media{display:grid;place-items:center;width:3.5rem;height:3.5rem;overflow:hidden;border-radius:max(2px,calc(var(--input-border-radius) * .65));background:rgb(var(--text-color) / .05)}.material-selector__trigger-media>img,.material-selector__card-media>img{width:100%;height:100%;object-fit:cover}.material-selector__trigger-copy{display:flex;min-width:0;align-items:center;flex-wrap:wrap;gap:.4rem .625rem}.material-selector__trigger-value{overflow:hidden;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.material-selector__trigger-badge,.material-selector__card-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:rgb(var(--accent));color:rgb(var(--button-text-color));font-size:.6875rem;font-weight:700;line-height:1;letter-spacing:.04em;text-transform:uppercase}.material-selector__trigger-badge{padding:.35rem .55rem}.material-selector__chevron{width:.75rem;transition:transform .2s ease}.material-selector__trigger[aria-expanded=true] .material-selector__chevron{transform:rotate(180deg)}.material-selector__dialog{width:min(58rem,calc(100vw - 2rem));max-width:none;max-height:min(88dvh,52rem);margin:auto;padding:0;overflow:hidden;border:0;border-radius:.75rem;background:rgb(var(--background));background-image:var(--background-gradient);color:rgb(var(--text-color));box-shadow:0 1.5rem 5rem #00000042}.material-selector__dialog::backdrop{background:#0000008f;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.material-selector__dialog[open]{animation:material-selector-enter .22s ease both}.material-selector__dialog-shell{max-height:min(88dvh,52rem);padding:1.75rem;overflow-y:auto;overscroll-behavior:contain}.material-selector__dialog-header{position:relative;display:flex;align-items:flex-start;justify-content:center;gap:1.5rem;margin-block-end:1.5rem;padding-inline:3rem;text-align:center}.material-selector__dialog-header>div{width:100%}.material-selector__dialog-title{margin:0;font-family:var(--heading-font-family);font-size:clamp(1.15rem,2.4vw,1.65rem);font-weight:var(--heading-font-weight);line-height:1.25}.material-selector__dialog-intro{max-width:42rem;margin:.45rem auto 0;color:rgb(var(--text-color) / .68);font-size:.9rem;line-height:1.55}.material-selector__close{position:absolute;inset-block-start:0;inset-inline-end:0;display:grid;flex:0 0 auto;width:2.25rem;height:2.25rem;place-items:center;border:1px solid rgb(var(--border-color));border-radius:999px;color:inherit;transition:background .18s ease,border-color .18s ease}.material-selector__close:hover,.material-selector__close:focus-visible{border-color:rgb(var(--text-color) / .55);background:rgb(var(--text-color) / .06);outline:none}.material-selector__close svg{width:1.05rem}.material-selector__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.material-selector__card{display:flex;min-width:0;height:100%;flex-direction:column;overflow:hidden;border:1px solid rgb(var(--border-color));border-radius:.5rem;background:rgb(var(--background));color:inherit;text-align:start;text-decoration:none;box-shadow:0 .125rem .75rem rgb(var(--text-color) / .05);transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}.material-selector__card:not(:disabled):hover,.material-selector__card:not(:disabled):focus-visible{border-color:rgb(var(--text-color) / .55);box-shadow:0 .5rem 1.5rem rgb(var(--text-color) / .1);transform:translateY(-2px);outline:none}.material-selector__card.is-selected{border-color:rgb(var(--accent))}.material-selector__card.is-unavailable:not(.is-selected){opacity:.68}.material-selector__card-media{position:relative;display:grid;width:100%;aspect-ratio:1;place-items:center;overflow:hidden;background:rgb(var(--text-color) / .05)}.material-selector__media-placeholder{display:grid;width:100%;height:100%;place-items:center;color:rgb(var(--text-color) / .32);background:linear-gradient(135deg,rgb(var(--text-color) / .035) 25%,transparent 25%) -.5rem 0 / 1rem 1rem,linear-gradient(225deg,rgb(var(--text-color) / .035) 25%,transparent 25%) -.5rem 0 / 1rem 1rem}.material-selector__media-placeholder svg{width:2rem}.material-selector__trigger-media .material-selector__media-placeholder svg{width:1.35rem}.material-selector__card-badge{position:absolute;inset-block-start:.65rem;inset-inline-start:.65rem;padding:.42rem .6rem;box-shadow:0 .125rem .5rem #0000001f}.material-selector__card-body{display:flex;flex:1;flex-direction:column;gap:.55rem;padding:1rem}.material-selector__card-heading{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.material-selector__card-title{font-family:var(--heading-font-family);font-size:1rem;font-weight:650;line-height:1.3}.material-selector__check{display:grid;flex:0 0 auto;width:1.35rem;height:1.35rem;place-items:center;border:1px solid rgb(var(--border-color));border-radius:999px;color:transparent}.material-selector__check svg{width:.85rem}.material-selector__card.is-selected .material-selector__check{border-color:rgb(var(--accent));background:rgb(var(--accent));color:rgb(var(--button-text-color))}.material-selector__card-text{color:rgb(var(--text-color) / .68);font-size:.8125rem;line-height:1.5}.material-selector__sold-out{display:inline-flex;align-self:flex-start;margin-block-start:auto;font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}html.material-selector-dialog-open{overflow:hidden}@keyframes material-selector-enter{0%{opacity:0;transform:translateY(.75rem) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}@media screen and (max-width:699px){.material-selector__trigger{grid-template-columns:3rem minmax(0,1fr) auto;min-height:4rem}.material-selector__trigger-media{width:3rem;height:3rem}.material-selector__dialog{width:calc(100vw - 1rem);max-height:calc(100dvh - 1rem);border-radius:.6rem}.material-selector__dialog-shell{max-height:calc(100dvh - 1rem);padding:1rem}.material-selector__dialog-header{gap:1rem;margin-block-end:1rem;padding-inline:2.25rem}.material-selector__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.material-selector__card-body{gap:.4rem;padding:.75rem}.material-selector__card-title{font-size:.9rem}.material-selector__card-text{font-size:.75rem;line-height:1.4}.material-selector__check{width:1.2rem;height:1.2rem}.material-selector__card-badge{inset-block-start:.45rem;inset-inline-start:.45rem;padding:.35rem .45rem;font-size:.6rem}}@media(prefers-reduced-motion:reduce){.material-selector__dialog[open]{animation:none}.material-selector__trigger,.material-selector__chevron,.material-selector__card,.material-selector__close{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/12/assets/material-variant-selector.css.map */