.cl-root.cl-concept-hybrid .cl-metal-token{--cl-metal-shadow:#777d80;--cl-metal-mid:#c8cdd0;--cl-metal-light:#fbfcfd;position:relative;display:block;isolation:isolate;overflow:hidden;box-sizing:border-box;width:27px;height:27px;flex:0 0 27px;border:1px solid #919899;border-radius:50%;background:conic-gradient(from 25deg,var(--cl-metal-light),var(--cl-metal-mid) 17%,var(--cl-metal-shadow) 32%,var(--cl-metal-mid) 45%,var(--cl-metal-light) 58%,var(--cl-metal-mid) 74%,var(--cl-metal-shadow) 86%,var(--cl-metal-light));box-shadow:inset 0 0 0 1px #ffffffd6,0 1px 2px #171c191f}.cl-root.cl-concept-hybrid .cl-metal-token[data-alloy=yellow]{--cl-metal-shadow:#957038;--cl-metal-mid:#ddba74;--cl-metal-light:#fff2d2;border-color:#af9159}.cl-root.cl-concept-hybrid .cl-metal-token[data-alloy=yellow][data-purity="18K"]{--cl-metal-shadow:#976b2b;--cl-metal-mid:#ddb65f;--cl-metal-light:#fff1c5}.cl-root.cl-concept-hybrid .cl-metal-token[data-alloy=rose]{--cl-metal-shadow:#a47566;--cl-metal-mid:#dfb0a0;--cl-metal-light:#fff0e8;border-color:#b68b7d}.cl-root.cl-concept-hybrid .cl-metal-token[data-alloy=platinum]{--cl-metal-shadow:#74818a;--cl-metal-mid:#c3d0d7;--cl-metal-light:#f6fcff;border-color:#8f9ca4}.cl-root.cl-concept-hybrid .cl-metal-token:before{content:"";position:absolute;top:12%;right:12%;bottom:12%;left:12%;border-radius:inherit;background:radial-gradient(ellipse at 30% 24%,rgb(255 255 255/.72),transparent 55%),linear-gradient(135deg,var(--cl-metal-light),var(--cl-metal-mid) 40%,var(--cl-metal-shadow) 61%,var(--cl-metal-mid) 82%,var(--cl-metal-light));box-shadow:inset 0 0 1px #ffffffd9}.cl-root.cl-concept-hybrid .cl-metal-token:after{content:"";position:absolute;top:12%;right:12%;bottom:12%;left:12%;border-radius:inherit;background:linear-gradient(120deg,transparent 18%,rgb(255 255 255/.48) 37%,rgb(255 255 255/.1) 48%,transparent 61%);transform:translate(-5%);transition:transform .28s cubic-bezier(.22,1,.36,1)}.cl-root.cl-concept-hybrid .cl-metal-step summary{grid-template-columns:28px minmax(0,1fr) 18px}.cl-root.cl-concept-hybrid .cl-metal-step .cl-step-number{position:relative;width:28px;height:28px;border:0;font-size:0;line-height:0;color:transparent;overflow:visible}.cl-root.cl-concept-hybrid .cl-metal-step .cl-step-number>.cl-metal-token{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto}.cl-root.cl-concept-hybrid .cl-metal-step .cl-options-grid{gap:7px}.cl-root.cl-concept-hybrid .cl-metal-choice>label,.cl-root.cl-concept-hybrid .cl-metal-choice>label:has(.cl-delta:not([hidden])){display:grid;grid-template-columns:27px minmax(0,1fr) 14px;column-gap:12px;row-gap:0;align-items:center;min-height:68px;padding:20px 13px 13px;border-radius:2px;background:#fff;transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}.cl-root.cl-concept-hybrid .cl-metal-choice>label>.cl-metal-token{grid-column:1;grid-row:1}.cl-root.cl-concept-hybrid .cl-metal-choice .cl-value{grid-column:2;grid-row:1;min-width:0;font-size:15px;line-height:21px;white-space:normal;overflow-wrap:normal;word-break:normal}.cl-root.cl-concept-hybrid .cl-metal-choice>label .cl-option-check,.cl-root.cl-concept-hybrid .cl-metal-choice>label:has(.cl-delta:not([hidden])) .cl-option-check{position:static;grid-column:3;grid-row:1;align-self:center;justify-self:end;font-size:13px;line-height:18px}.cl-root.cl-concept-hybrid .cl-metal-choice>input:checked+label{border-color:#7f8983;background:#f7f9f8;box-shadow:inset 0 0 0 1px #7f8983}.cl-root.cl-concept-hybrid .cl-metal-choice>input:checked+label .cl-metal-token:after,.cl-root.cl-concept-hybrid .cl-metal-choice>label:hover .cl-metal-token:after{transform:translate(7%)}.cl-root.cl-concept-hybrid .cl-metal-step[open] .cl-metal-choice{animation:cl-metal-arrive 225ms cubic-bezier(.22,.75,.25,1) both;animation-delay:calc(var(--cl-metal-order,0)*15ms)}@keyframes cl-metal-arrive{0%{opacity:.35;transform:translate(-5px)}to{opacity:1;transform:translate(0)}}@media(max-width:359px){.cl-root.cl-concept-hybrid .cl-metal-choice>label,.cl-root.cl-concept-hybrid .cl-metal-choice>label:has(.cl-delta:not([hidden])){column-gap:10px;padding-inline:10px}.cl-root.cl-concept-hybrid .cl-metal-choice .cl-value{font-size:14px}}
/*# sourceMappingURL=/cdn/shop/t/174/assets/cs-hybrid-metal-refine.css.map */