/* Make Your Own Combo — every selector is scoped under .myoc-page / myoc- prefix. */
.myoc-page{--myoc-navy:#572f88;--myoc-red:#6a3fbf;--myoc-sky:#f6f2ff;--myoc-sky2:#e9defc;--myoc-line:#ececf2;--myoc-text:#171820;--myoc-muted:#4b4c56;--myoc-green:#07934a;
	color:var(--myoc-text);font-family:inherit;max-width:1200px;margin:0 auto;padding:0 16px 48px;box-sizing:border-box}
.myoc-page *,.myoc-page *::before,.myoc-page *::after{box-sizing:border-box}
.myoc-page .screen-reader-text{position:absolute;clip:rect(1px,1px,1px,1px);width:1px;height:1px;overflow:hidden}
.myoc-page [hidden]{display:none!important}

.myoc-hero{text-align:center;padding:40px 0 24px}
.myoc-hero__title{margin:0 0 10px;font-size:clamp(28px,5vw,46px);line-height:1.1;color:var(--myoc-navy);font-weight:800}
.myoc-hero__sub{margin:0 auto;max-width:620px;font-size:16px;color:var(--myoc-muted)}
.myoc-steps{list-style:none;display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:center;margin:22px 0 0;padding:0;font-weight:600;color:var(--myoc-navy);font-size:14px}
.myoc-steps li{display:flex;align-items:center;gap:8px;margin:0}
.myoc-steps span{display:inline-flex;width:26px;height:26px;border-radius:50%;background:var(--myoc-navy);color:#fff;align-items:center;justify-content:center;font-size:13px}

.myoc-section{padding:28px 20px;margin:0 0 24px;border-radius:20px}
.myoc-section--blue{background:var(--myoc-sky)}
.myoc-h2{margin:0 0 18px;text-align:center;text-transform:uppercase;letter-spacing:.02em;font-size:clamp(18px,3vw,26px);color:var(--myoc-navy);font-weight:800}
.myoc-hint{text-align:center;color:var(--myoc-muted);margin:0 0 14px;font-size:14px}

.myoc-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:18px}
.myoc-category-tabs{display:flex;gap:8px;overflow-x:auto;padding:2px 0 8px;margin-bottom:6px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.myoc-toolbar .myoc-category-tabs{margin:0;flex:1 1 320px}
.myoc-tab{flex:0 0 auto;border:1px solid var(--myoc-line);background:#fff;color:var(--myoc-navy);border-radius:999px;padding:9px 18px;font-size:14px;font-weight:600;cursor:pointer;line-height:1.2}
.myoc-tab.is-active{background:var(--myoc-navy);border-color:var(--myoc-navy);color:#fff}
.myoc-tab:focus-visible,.myoc-btn:focus-visible,.myoc-variant:focus-visible,.myoc-slot__remove:focus-visible{outline:3px solid #b79bef;outline-offset:2px}
.myoc-search input{width:100%;min-width:220px;padding:10px 14px;border:1px solid var(--myoc-line);border-radius:999px;font-size:14px;background:#fff}

.myoc-page{max-width:1320px}
.myoc-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
@media (min-width:1001px){.myoc-grid .myoc-product-card__title{font-size:13px}.myoc-grid .myoc-product-card__body{padding:10px}.myoc-grid .myoc-price strong{font-size:16px}.myoc-grid .myoc-actions .myoc-btn{font-size:12px;padding:10px 4px}}
@media (min-width:601px) and (max-width:1000px){.myoc-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.myoc-product-card{background:#fff;border-radius:18px;border:2px solid transparent;box-shadow:0 2px 12px rgba(27,42,92,.08);overflow:hidden;display:flex;flex-direction:column;transition:border-color .15s,box-shadow .15s}
.myoc-product-card.is-selected{border-color:var(--myoc-navy);box-shadow:0 4px 18px rgba(27,42,92,.2)}
.myoc-product-card.is-disabled:not(.is-selected){opacity:.6}
.myoc-product-card__img{aspect-ratio:1/1;background:linear-gradient(160deg,#f6f2ff,#e9defc);display:flex;align-items:center;justify-content:center}
.myoc-product-card__img img{width:100%;height:100%;object-fit:contain;display:block}
.myoc-product-card__body{padding:14px;display:flex;flex-direction:column;gap:10px;flex:1}
.myoc-product-card__title{margin:0;font-size:15px;line-height:1.3;font-weight:700;color:var(--myoc-text);height:2.6em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;text-overflow:ellipsis}
.myoc-price{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px}
.myoc-price strong{font-size:18px;color:var(--myoc-navy)}
.myoc-price s{color:#7a8296;font-size:13px}
.myoc-badge{background:#e6f6ec;color:var(--myoc-green);font-size:11px;font-weight:800;border-radius:4px;padding:2px 6px}
.myoc-variants{display:flex;flex-wrap:wrap;gap:8px}
.myoc-variant{width:38px;height:38px;padding:0;border-radius:50%;border:2px solid var(--myoc-line);background:#fff;overflow:hidden;cursor:pointer}
.myoc-variant img{width:100%;height:100%;object-fit:cover;display:block}
.myoc-variant.is-active{border-color:var(--myoc-navy);box-shadow:0 0 0 2px #e9defc}
.myoc-actions{display:flex;gap:8px;margin-top:auto}
.myoc-actions .myoc-btn{flex:1;padding:11px 8px;font-size:13px}

.myoc-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:12px;background:var(--myoc-red);color:#fff;font-weight:700;text-transform:uppercase;letter-spacing:.03em;cursor:pointer;text-decoration:none;padding:14px 28px;font-size:14px;line-height:1.2;transition:filter .15s}
.myoc-btn:hover:not(:disabled){filter:brightness(.92);color:#fff}
.myoc-btn:disabled{background:#e4e6ea;color:#8a90a0;cursor:not-allowed}
.myoc-btn--ghost{background:#f1ebfd;color:var(--myoc-red)}
.myoc-btn--ghost:hover:not(:disabled){color:var(--myoc-red)}
.myoc-btn--picked{background:#fff;color:#be2929;box-shadow:inset 0 0 0 2px #be2929}
.myoc-btn--picked:hover:not(:disabled){color:#be2929}
.myoc-more{text-align:center;margin-top:18px}

.myoc-status{text-align:center;color:var(--myoc-muted);padding:10px 0;font-size:14px;min-height:1px}
.myoc-status--error{color:#b3202a}
.myoc-status--loading::before{content:"";display:inline-block;width:14px;height:14px;margin-right:8px;border:2px solid var(--myoc-navy);border-right-color:transparent;border-radius:50%;vertical-align:-2px;animation:myoc-spin .7s linear infinite}
@keyframes myoc-spin{to{transform:rotate(360deg)}}

.myoc-combo-summary{background:#fff;border:1px solid var(--myoc-line);max-width:820px;margin-left:auto;margin-right:auto}
.myoc-selected-products{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-bottom:18px}
.myoc-slot{display:flex;align-items:center;gap:10px;padding:10px;background:var(--myoc-sky);border:1px solid var(--myoc-line);border-radius:14px;position:relative;min-height:76px}
.myoc-slot img{width:56px;height:56px;object-fit:contain;border-radius:8px;background:#fff;flex:0 0 auto}
.myoc-slot__info{display:flex;flex-direction:column;min-width:0;font-size:13px;gap:2px}
.myoc-slot__info strong{color:var(--myoc-navy);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.myoc-slot--empty{justify-content:center;border-style:dashed;color:var(--myoc-navy);font-weight:700;font-size:13px;text-transform:uppercase}
.myoc-slot__remove{position:absolute;top:2px;right:2px;width:34px;height:34px;border:0;background:transparent;font-size:22px;color:#5a6378;cursor:pointer;border-radius:50%}

.myoc-totals{text-align:center;margin:0 0 16px;transition:opacity .15s}
.myoc-totals.is-loading{opacity:.5}
.myoc-totals__row{display:flex;justify-content:center;gap:10px;align-items:baseline;color:var(--myoc-muted)}
.myoc-totals__row--main strong{font-size:28px;color:var(--myoc-navy)}
.myoc-totals__save{color:var(--myoc-green);font-weight:700;margin-top:4px}
.myoc-totals__bank{font-size:13px;color:var(--myoc-muted);margin-top:4px}

.myoc-pin{max-width:420px;margin:0 auto 16px}
.myoc-pin label{display:block;font-weight:700;color:var(--myoc-navy);margin-bottom:6px;font-size:14px}
.myoc-pin__row{display:flex;gap:8px}
.myoc-pin__row input{flex:1;min-width:0;padding:10px 14px;border:1px solid var(--myoc-line);border-radius:999px;font-size:15px}
.myoc-pin__row .myoc-btn{padding:10px 20px}
.myoc-pin__msg{margin:6px 0 0;font-size:13px;min-height:1em}
.myoc-pin__msg.is-ok{color:var(--myoc-green)}.myoc-pin__msg.is-error{color:#b3202a}

.myoc-notice{max-width:520px;margin:0 auto 14px;padding:10px 14px;border-radius:10px;font-size:14px;text-align:center;background:#eef1f6}
.myoc-notice--error{background:#fdecee;color:#9b1c25}
.myoc-notice--success{background:#e6f6ec;color:var(--myoc-green)}
.myoc-add-to-cart{display:flex;margin:0 auto;min-width:260px}

.myoc-why__list{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:0;padding:0;text-align:center;font-weight:700;color:var(--myoc-navy)}
.myoc-why__list li{background:#fff;border-radius:14px;padding:16px 10px;margin:0}

@media (max-width:600px){
	.myoc-section{padding:20px 12px;border-radius:16px}
	.myoc-grid{grid-template-columns:repeat(2,1fr);gap:10px}
	.myoc-product-card__body{padding:10px}
	.myoc-product-card__title{font-size:13px}
	.myoc-price strong{font-size:16px}
	.myoc-add-to-cart{width:100%}
	.myoc-search{width:100%}
}
@media (prefers-reduced-motion:reduce){.myoc-page *{transition:none!important;animation:none!important}}

/* ---- polish ---- */
.myoc-hero{background:linear-gradient(135deg,#f6f2ff 0%,#e9defc 100%);border-radius:24px;padding:44px 20px 30px;margin-top:16px;margin-bottom:28px;position:relative;overflow:hidden}
.myoc-hero::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:rgba(106,63,191,.1)}
.myoc-hero__title{background:linear-gradient(90deg,#572f88,#a72f85);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.myoc-steps li{background:#fff;border-radius:999px;padding:8px 16px 8px 8px;box-shadow:0 2px 8px rgba(87,47,136,.1)}
.myoc-steps span{background:var(--myoc-red)}
.myoc-section--blue{border:1px solid #e9defc}
.myoc-h2{position:relative;padding-bottom:12px}
.myoc-h2::after{content:"";display:block;width:48px;height:3px;border-radius:3px;background:linear-gradient(90deg,#6a3fbf,#a72f85);margin:10px auto 0}
.myoc-product-card{border:1px solid var(--myoc-line);box-shadow:0 2px 10px rgba(23,24,32,.05)}
.myoc-product-card:hover{box-shadow:0 8px 22px rgba(106,63,191,.16);transform:translateY(-2px)}
.myoc-product-card{transition:border-color .15s,box-shadow .2s,transform .2s}
.myoc-product-card.is-selected{border:2px solid var(--myoc-red);box-shadow:0 6px 20px rgba(106,63,191,.22)}
.myoc-product-card.is-selected .myoc-product-card__img::after{content:"✓";position:absolute;top:10px;right:10px;width:28px;height:28px;border-radius:50%;background:var(--myoc-red);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800}
.myoc-product-card__img{position:relative}
.myoc-tab{border-color:#e4dbf6}
.myoc-tab.is-active{background:var(--myoc-red);border-color:var(--myoc-red)}
.myoc-price strong{color:var(--myoc-text)}
.myoc-combo-summary{border:1px solid #e4dbf6;box-shadow:0 10px 30px rgba(106,63,191,.12)}
.myoc-slot{background:var(--myoc-sky);border-color:#e4dbf6}
.myoc-slot--empty{background:#fff;border:2px dashed #cdbcf0;color:var(--myoc-red)}
.myoc-totals{background:var(--myoc-sky);border-radius:16px;padding:14px}
.myoc-totals__row--main strong{color:var(--myoc-red)}
.myoc-add-to-cart{font-size:15px;padding:16px 28px;box-shadow:0 8px 18px rgba(106,63,191,.3)}
.myoc-add-to-cart:disabled{box-shadow:none}
.myoc-why__list li{border:1px solid #e4dbf6}
@media (max-width:600px){
	.myoc-hero{padding:30px 14px 22px;border-radius:18px}
	.myoc-steps{flex-direction:column;align-items:stretch;gap:8px}
	.myoc-steps li{justify-content:flex-start}
}


/* ---- group tabs + comparison ---- */
.myoc-group-tabs{display:flex;gap:10px;justify-content:center;margin:0 0 14px;flex-wrap:wrap}
.myoc-group-tab{border:2px solid var(--myoc-red);background:#fff;color:var(--myoc-red);border-radius:12px;padding:12px 24px;font-size:15px;font-weight:800;cursor:pointer}
.myoc-group-tab.is-active{background:var(--myoc-red);color:#fff}
.myoc-group-tab:disabled{opacity:.4;cursor:not-allowed}
.myoc-group-tab:focus-visible{outline:3px solid #b79bef;outline-offset:2px}
.myoc-category-tabs{justify-content:flex-start}
.myoc-compare{text-align:left;margin:0 0 14px;border:1px solid #e4dbf6;border-radius:12px;background:#fff;overflow:hidden}
.myoc-compare__row{display:grid;grid-template-columns:minmax(0,2.4fr) 1fr 1fr 1.2fr;gap:8px;padding:10px 12px;align-items:center;font-size:13px;border-top:1px solid var(--myoc-line)}
.myoc-compare__row--head{background:#efe8fb;color:var(--myoc-navy);font-weight:800;border-top:0;text-transform:uppercase;font-size:11px;letter-spacing:.04em}
.myoc-compare__name{font-weight:600;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical}
.myoc-compare__old s{color:#8a8d98}
.myoc-compare__new{color:var(--myoc-red)}
.myoc-compare__save{color:var(--myoc-green);font-weight:700}
@media (max-width:600px){
	.myoc-compare__row--head{display:none}
	.myoc-compare__row{grid-template-columns:1fr 1fr 1fr}
	.myoc-compare__name{grid-column:1/-1}
	.myoc-compare__row [data-label]::before{content:attr(data-label);display:block;font-size:10px;color:#8a8d98;font-weight:600;text-transform:uppercase}
	.myoc-group-tab{flex:1 1 100%;text-align:center}
}

/* ---- round 3 ---- */
/* 1. swatches: one scrolling line, so cards stay the same height */
.myoc-variants-wrap{display:flex;align-items:center;gap:4px;min-height:42px}
.myoc-variants{display:flex;flex-wrap:nowrap;gap:8px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;flex:1;min-width:0;padding:2px}
.myoc-variants::-webkit-scrollbar{display:none}
.myoc-variant{flex:0 0 auto;scroll-snap-align:start}
.myoc-variants-nav{display:none;flex:0 0 24px;width:24px;height:24px;border:0;border-radius:50%;background:#f1ebfd;color:var(--myoc-red);font-size:16px;line-height:1;cursor:pointer;padding:0}
.myoc-variants-wrap.has-arrows .myoc-variants-nav{display:block}

/* 2. wider combo card, products side by side 1-2-3 */
.myoc-combo-summary{max-width:1100px}
.myoc-selected-products{grid-template-columns:repeat(3,minmax(0,1fr))}
.myoc-slot{padding:12px 34px 12px 12px}
.myoc-slot__info strong{font-size:14px}
@media (max-width:700px){.myoc-selected-products{grid-template-columns:1fr}}

/* 3. price list: one line per product, larger */
.myoc-compare__row{font-size:15px;padding:14px 16px;grid-template-columns:minmax(0,3fr) 1fr 1.1fr 1.3fr}
.myoc-compare__row--head{font-size:12px}
.myoc-compare__name{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;-webkit-line-clamp:unset}
.myoc-compare__new{font-size:16px}
@media (max-width:600px){.myoc-compare__row{font-size:14px;padding:12px}.myoc-compare__name{white-space:nowrap}}

/* 4. bank offer cards (product-page style) */
.myoc-totals__bank{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:22px;text-align:center}
.myoc-totals__bank:empty{display:none}
.myoc-bank__card{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;border:1.5px solid #a72f85;border-radius:18px;padding:26px 10px 14px;background:#fff}
.myoc-bank__label{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:#fff;border:1px solid #cfe3ee;border-radius:999px;padding:4px 18px;font-size:13px;font-weight:800;color:#09a4da;text-transform:uppercase;white-space:nowrap}
.myoc-bank__price{font-size:22px;color:#2d5b97}
.myoc-bank__extra{font-size:14px;font-weight:700;color:#a72f85}
.myoc-bank__via{font-size:13px;color:var(--myoc-muted)}
@media (max-width:700px){.myoc-totals__bank{grid-template-columns:1fr;gap:20px}}

/* ---- round 4: numbering + cart-style offers ---- */
.myoc-compare__prod{display:flex;align-items:center;gap:12px;min-width:0}
.myoc-compare__no{flex:0 0 28px;width:28px;height:28px;border-radius:50%;background:var(--myoc-red);color:#fff;font-weight:800;font-size:13px;display:inline-flex;align-items:center;justify-content:center}
.myoc-compare__prod .myoc-compare__name{flex:1;min-width:0}
.myoc-compare__row--head span:first-child{padding-left:40px}
.myoc-totals__bank{display:block;margin-top:22px}
.myoc-offers{margin:0;padding:0}
.myoc-offers .offers-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:22px 16px;overflow:visible;transform:none}
.myoc-offers .offer-card{margin:0;width:auto;min-width:0;flex:none}
.myoc-offer-detail{margin-top:10px;padding:10px;border-radius:10px;background:#f6f2ff;font-size:12px;text-align:left;color:#4b4c56}
.myoc-offer-detail p{margin:0 0 4px}

/* ---- View: text button on desktop, eye icon on the image on phones ---- */
.myoc-page .myoc-view-icon{display:none}
@media (max-width:767px){
	.myoc-page .myoc-view-icon{display:flex;position:absolute;top:auto;right:10px;bottom:10px;left:auto;width:38px;height:38px;border-radius:50%;background:#fff;color:var(--myoc-red);font-size:16px;box-shadow:0 4px 12px rgba(23,24,32,.2);align-items:center;justify-content:center;text-decoration:none;z-index:3}
	.myoc-page .myoc-view-text{display:none}
	.myoc-page .myoc-actions .myoc-btn{flex:1}
}

/* mobile/any width: the theme gives .offer-card flex:0 0 43% (slider item) — make it a full grid cell */
.myoc-page .myoc-offers .offers-grid{display:grid;overflow:visible;transform:none;gap:26px 16px}
.myoc-page .myoc-offers .offers-grid .offer-card{flex:none;width:100%;max-width:none;min-width:0;margin:30px 0 4px;box-sizing:border-box}
@media (max-width:700px){.myoc-page .myoc-offers .offers-grid{grid-template-columns:1fr}}

/* the theme's (max-width:480px) rules use !important on this selector; out-rank them */
.myoc-page .myoc-offers.cart-offer-card .offers-grid .offer-card{flex:none!important;max-width:none!important;width:100%!important}
@media (max-width:700px){.myoc-page .myoc-offers .offers-grid{gap:0}}

/* ---- round 7: mobile price list + swipeable offers ---- */
.myoc-page .myoc-offers{position:relative}
.myoc-page .myoc-offers-nav{display:none}
@media (max-width:700px){
	/* price list: product on its own line, then Price | Combo | Save in one straight line */
	.myoc-compare__row{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 6px;padding:12px}
	.myoc-compare__row .myoc-compare__prod{grid-column:1/-1}
	.myoc-compare__row .myoc-compare__name{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:14px;line-height:1.3}
	.myoc-compare__row [data-label]{white-space:nowrap;font-size:14px;min-width:0}
	.myoc-compare__row [data-label]::before{white-space:nowrap}
	.myoc-compare__new{font-size:15px}

	/* offers: horizontal swipe row like the checkout page */
	.myoc-page .myoc-offers .offers-grid{display:flex;flex-wrap:nowrap;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:0 2px 6px}
	.myoc-page .myoc-offers .offers-grid::-webkit-scrollbar{display:none}
	.myoc-page .myoc-offers.cart-offer-card .offers-grid .offer-card{flex:0 0 62%!important;width:62%!important;max-width:62%!important;scroll-snap-align:start}
	.myoc-page .myoc-offers-nav{display:flex;position:absolute;top:52%;z-index:5;width:26px;height:26px;border:0;border-radius:50%;align-items:center;justify-content:center;padding:0;font-size:12px;color:#fff;cursor:pointer;background:linear-gradient(to right,#09a4da 0%,#1b5c9c 51%,#a72f85 100%);box-shadow:0 3px 8px rgba(0,0,0,.3)}
	.myoc-page .myoc-offers-nav[hidden]{display:none}
	.myoc-page .myoc-offers-nav--prev{left:4px}
	.myoc-page .myoc-offers-nav--next{right:4px}
}

/* step-1 category tabs: wrap onto several lines instead of one hidden scroll row */


/* category tabs: a single scrolling line with arrows */
.myoc-tabs-rail{position:relative;display:flex;align-items:center;gap:6px;min-width:0}
.myoc-toolbar .myoc-tabs-rail{flex:1 1 320px}
.myoc-tabs-rail .myoc-category-tabs{flex:1;min-width:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0;padding:2px 0}
.myoc-tabs-rail .myoc-category-tabs::-webkit-scrollbar{display:none}
.myoc-tabs-nav{flex:0 0 34px;width:34px;height:34px;border:0;border-radius:50%;background:#fff;color:var(--myoc-red);font-size:22px;line-height:1;cursor:pointer;padding:0;box-shadow:0 2px 8px rgba(23,24,32,.18)}
.myoc-tabs-nav[hidden]{display:none}
@media (max-width:767px){.myoc-tabs-nav{display:none}}