.subscription-selector{--sub-primary: var(--scheme-text, var(--color-primary, #0D1445));--sub-secondary: var(--scheme-accent, var(--color-secondary, #3B5AE8));--sub-success: var(--scheme-success, var(--color-success, #047857));--sub-border: var(--scheme-border, #D1D5DB);--sub-bg: var(--scheme-bg, #fff);--sub-text: var(--scheme-text, var(--color-primary, #0D1445));--sub-text-muted: var(--scheme-text-secondary, #6B7280);--sub-radius: 8px;--sub-selected-bg: var(--scheme-accent, var(--color-secondary, #3B5AE8));--sub-selected-text: var(--scheme-accent-contrast, #fff);background-color:transparent}.subscription-selector__options--cards{display:flex;flex-direction:column;gap:8px}.subscription-option{position:relative;border:2px solid var(--sub-border);border-radius:var(--sub-radius);padding:16px;cursor:pointer;transition:border-color .15s ease,background-color .15s ease,color .15s ease;background:var(--sub-bg);color:var(--sub-primary)}.subscription-option[data-option-type=onetime]{--sub-bg: var(--vs-subscription-onetime-bg, var(--scheme-bg, #fff));--sub-primary: var(--vs-subscription-onetime-text, var(--scheme-text, #0D1445));--sub-text: var(--vs-subscription-onetime-text, var(--scheme-text, #0D1445));--sub-text-muted: color-mix(in srgb, var(--vs-subscription-onetime-text, var(--scheme-text, #0D1445)) 70%, var(--vs-subscription-onetime-bg, var(--scheme-bg, #fff)))}.subscription-option[data-option-type=subscription]{--sub-bg: var(--vs-subscription-subscribe-bg, var(--scheme-bg, #fff));--sub-primary: var(--vs-subscription-subscribe-text, var(--scheme-text, #0D1445));--sub-text: var(--vs-subscription-subscribe-text, var(--scheme-text, #0D1445));--sub-text-muted: color-mix(in srgb, var(--vs-subscription-subscribe-text, var(--scheme-text, #0D1445)) 90%, var(--vs-subscription-subscribe-bg, var(--scheme-bg, #fff)))}.subscription-option:hover{border-color:var(--sub-secondary)}.subscription-option:has(>input[type=radio]:focus-visible),.subscription-option:has(.subscription-option__choice>input[type=radio]:focus-visible){outline:2px solid var(--sub-secondary);outline-offset:2px}.subscription-option__choice{display:block;cursor:pointer}.subscription-option--selected{border-color:var(--sub-selected-bg);background:var(--sub-selected-bg);color:var(--sub-selected-text)}.subscription-option[data-option-type=onetime].subscription-option--selected{--sub-selected-bg: var(--vs-subscription-onetime-active-bg, var(--scheme-accent, var(--color-secondary, #3B5AE8)));--sub-selected-text: var(--vs-subscription-onetime-active-text, var(--scheme-accent-contrast, #fff))}.subscription-option[data-option-type=subscription].subscription-option--selected{--sub-selected-bg: var(--vs-subscription-subscribe-active-bg, var(--scheme-accent, var(--color-secondary, #3B5AE8)));--sub-selected-text: var(--vs-subscription-subscribe-active-text, var(--scheme-accent-contrast, #fff))}.subscription-option--selected .subscription-option__title,.subscription-option--selected .subscription-option__description,.subscription-option--selected .subscription-option__price-current,.subscription-option--selected .subscription-option__price-original,.subscription-option--selected .subscription-option__frequency-label{color:var(--sub-selected-text)}.subscription-option--selected .subscription-option__radio{border-color:var(--sub-selected-text)}.subscription-option--selected .subscription-option__radio:after{background:var(--sub-selected-text)}.subscription-option__header{display:flex;align-items:center;gap:12px}.subscription-option__radio{width:20px;height:20px;border:2px solid var(--sub-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:border-color .15s ease}.subscription-option__radio:after{content:"";width:10px;height:10px;border-radius:50%;background:var(--sub-primary);transform:scale(0);transition:transform .15s ease}.subscription-option--selected .subscription-option__radio:after{transform:scale(1)}.subscription-option__content{flex:1;display:flex;flex-direction:column;gap:2px}.subscription-option__title{font-weight:600;font-size:15px;display:flex;align-items:center;gap:8px;color:var(--sub-text)}.subscription-option__badge{background:var(--sub-success);color:#fff;font-size:11px;font-weight:700;padding:2px 6px;border-radius:4px}.subscription-option__badge:empty{display:none}.subscription-option__description{font-size:13px;color:var(--sub-text-muted)}.subscription-option__price{text-align:right;flex-shrink:0;display:flex;flex-direction:column;align-items:flex-end}.subscription-option__price-current{font-weight:700;font-size:16px;color:var(--sub-text)}.subscription-option__price-original{font-size:12px;color:var(--sub-text-muted);text-decoration:line-through}.subscription-option__savings{font-size:12px;color:var(--sub-text);font-weight:600}.subscription-option--selected .subscription-option__savings{color:var(--sub-selected-text)}.subscription-option__frequency{margin-top:12px;padding-top:12px;border-top:1px solid var(--sub-border);display:none}.subscription-option--selected .subscription-option__frequency{display:block}.subscription-option__frequency-label{font-size:13px;font-weight:500;margin-bottom:8px;color:var(--sub-text-muted);display:block}.subscription-option__frequency-options{display:flex;gap:8px;flex-wrap:wrap}.subscription-frequency-btn{padding:8px 14px;border:1px solid var(--sub-border);border-radius:6px;background:var(--sub-bg);font-size:13px;cursor:pointer;transition:border-color .15s ease,background-color .15s ease,color .15s ease;color:var(--sub-text)}.subscription-frequency-btn:hover{border-color:var(--sub-secondary)}.subscription-frequency-btn--active{background:var(--sub-selected-text);color:var(--sub-selected-bg);border-color:var(--sub-selected-text)}.subscription-option--selected .subscription-frequency-btn{background:transparent;border-color:var(--sub-selected-text);color:var(--sub-selected-text)}.subscription-option--selected .subscription-frequency-btn--active{background:var(--sub-selected-text);color:var(--sub-selected-bg);border-color:var(--sub-selected-text)}.subscription-compact{display:flex;border:2px solid var(--sub-border);border-radius:var(--sub-radius);overflow:hidden}.subscription-compact__tab{flex:1;padding:14px 16px;text-align:center;cursor:pointer;border:none;border-right:1px solid var(--sub-border);transition:background-color .15s ease,color .15s ease;background:#fff;color:var(--color-primary, #0D1445);display:flex;flex-direction:column;align-items:center;gap:2px}.subscription-compact__tab:first-child{border-radius:calc(var(--sub-radius) - 2px) 0 0 calc(var(--sub-radius) - 2px)}.subscription-compact__tab:last-child{border-right:none;border-radius:0 calc(var(--sub-radius) - 2px) calc(var(--sub-radius) - 2px) 0}.subscription-compact__tab:hover{background:var(--sub-bg-warm)}.subscription-compact__tab--selected{background:var(--sub-selected-bg);color:var(--sub-selected-text)}.subscription-compact__tab--selected:hover{background:var(--sub-selected-bg)}.subscription-compact__tab--selected .subscription-compact__title,.subscription-compact__tab--selected .subscription-compact__subtitle{color:var(--sub-selected-text)}.subscription-compact__title{font-weight:600;font-size:14px;color:inherit}.subscription-compact__subtitle{font-size:12px;color:color-mix(in srgb,var(--color-primary, #0D1445) 70%,#fff)}.subscription-compact__tab--selected .subscription-compact__subtitle{color:var(--sub-selected-text);opacity:.9}.subscription-compact__frequency{margin-top:12px;display:none}.subscription-compact__frequency--visible{display:block}.subscription-compact__select{width:100%;padding:10px 12px;border:2px solid var(--sub-border);border-radius:var(--sub-radius);font-size:14px;background:var(--sub-bg);cursor:pointer;color:var(--sub-text);accent-color:var(--sub-primary, #0D1445)}.subscription-compact__select option{padding:8px 12px}.subscription-compact__select option:checked{background:var(--sub-primary, #0D1445);color:#fff}.subscription-compact__select:focus{outline:none;border-color:var(--sub-primary)}.subscription-compact__savings{margin-top:8px;font-size:13px;color:var(--sub-text);font-weight:600;text-align:center;display:none}.subscription-compact__savings--visible{display:block}.subscription-benefits{--sub-bg-warm: var(--vs-subscription-benefits-bg, var(--sub-bg-warm, var(--scheme-bg)));margin-top:16px;padding:12px;background:var(--sub-bg-warm);color:var(--vs-subscription-benefits-text, var(--scheme-text));border-radius:var(--sub-radius);display:none}.subscription-benefits--visible{display:block}.subscription-benefits__item{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--sub-text-muted)}.subscription-benefits__item+.subscription-benefits__item{margin-top:6px}.subscription-benefits__icon{color:var(--sub-success);font-weight:700;flex-shrink:0}.subscription-selector__button{display:inline-flex;align-items:center;justify-content:center;gap:0;width:100%;margin-top:16px;padding:14px 24px;border:none;border-radius:8px;background:var(--scheme-bg);color:var(--scheme-text);font-family:var(--font-body);font-size:16px;font-weight:600;cursor:pointer;transition:opacity .2s ease,transform .1s ease}.subscription-selector__button:hover{opacity:.9}.subscription-selector__button:active{transform:scale(.98)}.subscription-selector__button:disabled{cursor:not-allowed;opacity:.7}.subscription-selector__button--loading{position:relative}.subscription-selector__button--success{background:var(--sub-success)!important;color:#fff!important}.subscription-selector__button--error{background:#dc2626!important;color:#fff!important}.subscription-selector__button--preorder{background:var(--color-info, #3B5AE8);color:#fff}.subscription-selector__button--backorder{background:var(--color-warning, #f59e0b);color:#fff}.subscription-selector__button-icon{display:inline-flex;align-items:center;justify-content:center;margin-right:8px;flex-shrink:0}.subscription-selector__button-icon--right{margin-right:0;margin-left:8px}.subscription-selector__button-icon svg{width:20px;height:20px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/*# sourceMappingURL=/cdn/shop/t/23/assets/subscription-selector.css.map */