.ero-color-picker{width:calc(351 * var(--u));display:flex;align-items:flex-start;justify-content:space-between;gap:calc(10 * var(--u))}@media(max-width:989px){.ero-color-picker{margin-top:calc(8 * var(--u));margin-bottom:calc(-8 * var(--u));padding-top:0}}.ero-color-card{position:relative;flex:0 0 calc(110 * var(--u));width:calc(110 * var(--u));height:calc(115 * var(--u));min-height:calc(115 * var(--u));margin:0;padding:0;border:0;border-radius:calc(10 * var(--u));background:#ffffff1a;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;cursor:pointer;appearance:none;-webkit-appearance:none;overflow:visible;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.ero-color-card[data-color-key=nebula-blue]{--ero-picker-rgb: 0, 184, 212}.ero-color-card[data-color-key=nebula-orange]{--ero-picker-rgb: 243, 163, 99}.ero-color-card[data-color-key=ero-black]{--ero-picker-rgb: 155, 109, 255}.ero-color-card[data-color-key=white]{--ero-picker-rgb: 0, 184, 212}.ero-color-card[data-color-key=black]{--ero-picker-rgb: 155, 109, 255}.ero-color-card.is-selected{background:rgba(var(--ero-picker-rgb, 0, 184, 212),.2)}.ero-color-card__frame{position:absolute;top:0;right:0;bottom:0;left:0;display:block;border:calc(1 * var(--u)) solid rgba(255,255,255,.5);border-radius:calc(10 * var(--u));pointer-events:none}.ero-color-card.is-selected .ero-color-card__frame{border-color:#fff;box-shadow:0 0 .14px rgba(var(--ero-picker-rgb, 0, 184, 212),.7),0 0 .28px rgba(var(--ero-picker-rgb, 0, 184, 212),.7),0 0 .97px rgba(var(--ero-picker-rgb, 0, 184, 212),.7),0 0 1.95px rgba(var(--ero-picker-rgb, 0, 184, 212),.7),0 0 3.34px rgba(var(--ero-picker-rgb, 0, 184, 212),.7),0 0 5.85px rgba(var(--ero-picker-rgb, 0, 184, 212),.7),inset 0 0 .14px rgba(var(--ero-picker-rgb, 0, 184, 212),.7),inset 0 0 .28px rgba(var(--ero-picker-rgb, 0, 184, 212),.7),inset 0 0 .97px rgba(var(--ero-picker-rgb, 0, 184, 212),.7),inset 0 0 1.95px rgba(var(--ero-picker-rgb, 0, 184, 212),.7),inset 0 0 3.34px rgba(var(--ero-picker-rgb, 0, 184, 212),.7),inset 0 0 5.85px rgba(var(--ero-picker-rgb, 0, 184, 212),.7)}.ero-color-card__img{position:absolute;top:calc(5.82 * var(--u));left:calc(50% - 41.175 * var(--u));display:block;width:calc(82.35 * var(--u));height:calc(82.35 * var(--u));object-fit:contain;pointer-events:none;user-select:none;-webkit-user-select:none}.ero-color-card__label{position:absolute;top:calc(94 * var(--u));left:0;right:0;display:block;font-family:var(--font-body),"Space Grotesk",sans-serif;font-weight:400;font-synthesis:none;font-size:calc(12 * var(--u));line-height:calc(12.98 * var(--u));letter-spacing:calc(.36 * var(--u));text-align:center;color:#fff}.ero-pdp-buy-box .ero-color-card__label{top:calc(91.05 * var(--u));font-weight:300;font-size:calc(10 * var(--u));line-height:calc(12.98 * var(--u));letter-spacing:.03em}.ero-color-card[data-unavailable=true]{opacity:.55;cursor:not-allowed}@media(max-width:989px){.ero-color-card{flex:1 1 0;min-width:0}}@supports (-webkit-touch-callout: none){.ero-color-card{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}}@media(min-width:990px){.ero-color-picker{width:100%;justify-content:flex-start;gap:calc(var(--cp-gap-desktop, 19) * var(--u-desktop))}.ero-color-card{--ero-picker-glow-hover: 0 0 calc(.14 * var(--u-desktop)) rgba(var(--ero-picker-rgb), .4), 0 0 calc(.28 * var(--u-desktop)) rgba(var(--ero-picker-rgb), .4), 0 0 calc(.97 * var(--u-desktop)) rgba(var(--ero-picker-rgb), .4), 0 0 calc(1.95 * var(--u-desktop)) rgba(var(--ero-picker-rgb), .4), 0 0 calc(3.34 * var(--u-desktop)) rgba(var(--ero-picker-rgb), .4), 0 0 calc(5.85 * var(--u-desktop)) rgba(var(--ero-picker-rgb), .4), inset 0 0 calc(.14 * var(--u-desktop)) rgba(var(--ero-picker-rgb), .4), inset 0 0 calc(.28 * var(--u-desktop)) rgba(var(--ero-picker-rgb), .4), inset 0 0 calc(.97 * var(--u-desktop)) rgba(var(--ero-picker-rgb), .4), inset 0 0 calc(1.95 * var(--u-desktop)) rgba(var(--ero-picker-rgb), .4), inset 0 0 calc(3.34 * var(--u-desktop)) rgba(var(--ero-picker-rgb), .4), inset 0 0 calc(5.85 * var(--u-desktop)) rgba(var(--ero-picker-rgb), .4);flex:1 1 0;min-width:0;height:calc(158 * var(--u-desktop));min-height:calc(158 * var(--u-desktop));padding:calc(20 * var(--u-desktop)) 0 calc(16 * var(--u-desktop));border:0;border-radius:calc(14 * var(--u-desktop));background:#ffffff1a;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:none}.ero-color-card[data-color-key=nebula-blue].is-selected{background:#00b8d433}.ero-color-card[data-color-key=nebula-orange].is-selected{background:#f3a36333}.ero-color-card[data-color-key=ero-black].is-selected{background:#9b6dff33}.ero-color-card[data-color-key=white].is-selected{background:#00b8d433}.ero-color-card[data-color-key=black].is-selected{background:#9b6dff33}.ero-color-card__frame{border:2px solid rgba(255,255,255,.5);border-radius:calc(14 * var(--u-desktop));z-index:2}.ero-color-card[data-color-key=nebula-blue].is-selected .ero-color-card__frame{border-color:#fff;box-shadow:0 0 0 1px color-mix(in srgb,rgba(0,184,212,var(--bb-glow-flavor, .8)) 90%,transparent),0 0 3px 1px color-mix(in srgb,color-mix(in srgb,rgba(0,184,212,var(--bb-glow-flavor, .8)) 75%,white) 80%,transparent),0 0 8px 2px color-mix(in srgb,rgba(0,184,212,var(--bb-glow-flavor, .8)) 55%,transparent),0 0 16px 3px color-mix(in srgb,rgba(0,184,212,var(--bb-glow-flavor, .8)) 25%,transparent),inset 0 0 8px 2px color-mix(in srgb,rgba(0,184,212,var(--bb-glow-flavor, .8)) 20%,transparent)}.ero-color-card[data-color-key=nebula-orange].is-selected .ero-color-card__frame{border-color:#fff;box-shadow:0 0 0 1px color-mix(in srgb,rgba(243,163,99,var(--bb-glow-flavor, .8)) 90%,transparent),0 0 3px 1px color-mix(in srgb,color-mix(in srgb,rgba(243,163,99,var(--bb-glow-flavor, .8)) 75%,white) 80%,transparent),0 0 8px 2px color-mix(in srgb,rgba(243,163,99,var(--bb-glow-flavor, .8)) 55%,transparent),0 0 16px 3px color-mix(in srgb,rgba(243,163,99,var(--bb-glow-flavor, .8)) 25%,transparent),inset 0 0 8px 2px color-mix(in srgb,rgba(243,163,99,var(--bb-glow-flavor, .8)) 20%,transparent)}.ero-color-card[data-color-key=ero-black].is-selected .ero-color-card__frame{border-color:#fff;box-shadow:0 0 0 1px color-mix(in srgb,rgba(155,109,255,var(--bb-glow-flavor, .8)) 90%,transparent),0 0 3px 1px color-mix(in srgb,color-mix(in srgb,rgba(155,109,255,var(--bb-glow-flavor, .8)) 75%,white) 80%,transparent),0 0 8px 2px color-mix(in srgb,rgba(155,109,255,var(--bb-glow-flavor, .8)) 55%,transparent),0 0 16px 3px color-mix(in srgb,rgba(155,109,255,var(--bb-glow-flavor, .8)) 25%,transparent),inset 0 0 8px 2px color-mix(in srgb,rgba(155,109,255,var(--bb-glow-flavor, .8)) 20%,transparent)}.ero-color-card[data-color-key=white].is-selected .ero-color-card__frame{border-color:#fff;box-shadow:0 0 0 1px color-mix(in srgb,rgba(0,184,212,var(--bb-glow-flavor, .8)) 90%,transparent),0 0 3px 1px color-mix(in srgb,color-mix(in srgb,rgba(0,184,212,var(--bb-glow-flavor, .8)) 75%,white) 80%,transparent),0 0 8px 2px color-mix(in srgb,rgba(0,184,212,var(--bb-glow-flavor, .8)) 55%,transparent),0 0 16px 3px color-mix(in srgb,rgba(0,184,212,var(--bb-glow-flavor, .8)) 25%,transparent),inset 0 0 8px 2px color-mix(in srgb,rgba(0,184,212,var(--bb-glow-flavor, .8)) 20%,transparent)}.ero-color-card[data-color-key=black].is-selected .ero-color-card__frame{border-color:#fff;box-shadow:0 0 0 1px color-mix(in srgb,rgba(155,109,255,var(--bb-glow-flavor, .8)) 90%,transparent),0 0 3px 1px color-mix(in srgb,color-mix(in srgb,rgba(155,109,255,var(--bb-glow-flavor, .8)) 75%,white) 80%,transparent),0 0 8px 2px color-mix(in srgb,rgba(155,109,255,var(--bb-glow-flavor, .8)) 55%,transparent),0 0 16px 3px color-mix(in srgb,rgba(155,109,255,var(--bb-glow-flavor, .8)) 25%,transparent),inset 0 0 8px 2px color-mix(in srgb,rgba(155,109,255,var(--bb-glow-flavor, .8)) 20%,transparent)}.ero-color-card__img{top:calc(4 * var(--u-desktop));left:calc(50% - 60 * var(--u-desktop));display:block;width:calc(120 * var(--u-desktop));height:calc(120 * var(--u-desktop));object-fit:contain}.ero-color-card__label{top:calc(122 * var(--u-desktop));z-index:2;font-size:calc(20 * var(--u-desktop));line-height:1;letter-spacing:calc(.39 * var(--u-desktop))}.ero-pdp-buy-box .ero-color-card__label{top:calc(126 * var(--u-desktop));font-size:calc(16 * var(--u-desktop));line-height:1;letter-spacing:calc(.39 * var(--u-desktop))}@supports (-webkit-touch-callout: none){.ero-color-card{-webkit-backdrop-filter:blur(4px)}}}
/*# sourceMappingURL=/cdn/shop/t/10/assets/ero-color-picker.css.map */
