#strong-configurator-preview{ --scp-accent:#ff6a00; --scp-accent-strong:#f45d00; --scp-ink:#1e2227; --scp-muted:#747b84; --scp-border:#e4e6e8; --scp-soft:#f7f7f6; --scp-soft-2:#f2f3f3; --scp-bg:#fff; --scp-radius:14px; --scp-shadow:0 10px 30px rgba(26,31,36,.055); } #strong-configurator-preview,#strong-configurator-preview *{box-sizing:border-box} body.strong-preview-body{scroll-behavior:smooth} body.strong-preview-body{margin:0!important;background:#fff!important;color:var(--scp-ink);font-family:'Montserrat',Arial,sans-serif!important;font-size:14px;line-height:1.45} body.strong-preview-body button,body.strong-preview-body input,body.strong-preview-body select{font:inherit} body.strong-preview-body svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} .scp-shell{min-height:100vh;padding:12px 18px 28px;background:#fff} .scp-preview-ribbon{max-width:1830px;margin:0 auto 14px;padding:9px 14px;border:1px solid #e5e7e9;border-radius:10px;background:#fafafa;display:flex;align-items:center;justify-content:space-between;gap:16px;color:#676d74;font-size:11px} .scp-preview-ribbon__left{display:flex;align-items:center;gap:10px;min-width:0}.scp-preview-ribbon strong{color:#252a2f;font-size:12px}.scp-preview-ribbon a{color:#252a2f;text-decoration:none;font-weight:600;white-space:nowrap}.scp-preview-chip{padding:4px 8px;border-radius:999px;background:#252a2f;color:#fff;font-weight:700;font-size:9px;letter-spacing:.08em} .scp-configurator{max-width:1830px;margin:0 auto;display:grid;grid-template-columns:minmax(580px,1.5fr) minmax(330px,.7fr) minmax(390px,.72fr);gap:22px;align-items:start} .scp-visual-column,.scp-flow-column,.scp-drawer{min-width:0} .scp-visual-card{position:relative;background:#f4f4f2;border:1px solid #efefee;border-radius:14px;overflow:hidden;aspect-ratio:1.16/1;box-shadow:var(--scp-shadow)} .scp-visual-card>img{width:100%;height:100%;display:block;object-fit:cover;transition:opacity .22s ease,transform .35s ease}.scp-visual-card:hover>img{transform:scale(1.004)} .scp-image-placeholder{height:100%;display:flex;align-items:center;justify-content:center;color:var(--scp-muted)} .scp-gallery{position:absolute;z-index:4;left:20px;right:20px;bottom:16px;display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;padding:2px}.scp-gallery::-webkit-scrollbar{display:none}.scp-gallery button{border:2px solid rgba(255,255,255,.9);border-radius:8px;padding:0;background:#fff;overflow:hidden;width:82px;height:66px;flex:0 0 auto;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.11);transition:.15s ease}.scp-gallery button:hover{transform:translateY(-1px)}.scp-gallery button.is-active{border-color:var(--scp-accent);box-shadow:0 0 0 1px var(--scp-accent),0 4px 14px rgba(0,0,0,.08)}.scp-gallery img{width:100%;height:100%;object-fit:cover;display:block} .scp-summary-card,.scp-price-card,.scp-drawer,.scp-benefits{border:1px solid var(--scp-border);background:#fff;border-radius:var(--scp-radius)} .scp-summary-card{margin-top:18px;padding:20px 22px}.scp-summary-head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px}.scp-summary-head h2{font-size:17px;line-height:1.2;margin:3px 0 0;font-weight:600;color:#20252a}.scp-kicker{display:block;color:#8a9096;font-size:10px;font-weight:600;letter-spacing:.025em}.scp-text-action{border:0;background:transparent;color:var(--scp-accent);font-size:11px;font-weight:600;display:flex;align-items:center;gap:7px;cursor:pointer;padding:6px}.scp-text-action svg{width:14px;height:14px}.scp-summary-content{display:flex;align-items:center;gap:20px}.scp-summary-thumb{width:92px;height:66px;border-radius:8px;background:#f4f4f3;overflow:hidden;flex:0 0 auto}.scp-summary-thumb img{width:100%;height:100%;object-fit:cover}.scp-summary{flex:1;display:flex;align-items:stretch;overflow-x:auto;scrollbar-width:none}.scp-summary::-webkit-scrollbar{display:none}.scp-summary-item{min-width:132px;padding:5px 18px;border-left:1px solid var(--scp-border)}.scp-summary-item:first-child{border-left:0;padding-left:0}.scp-summary-item small{display:block;font-size:9px;color:#6f757c;margin-bottom:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.scp-summary-item strong{display:block;font-size:10px;font-weight:500;color:#353a40;line-height:1.45}.scp-summary-empty{color:#92979d;font-size:11px} .scp-benefits{margin-top:18px;padding:17px 20px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.scp-benefit{display:flex;align-items:center;gap:10px;padding:3px 8px}.scp-benefit svg{width:25px;height:25px;color:var(--scp-accent);flex:0 0 auto}.scp-benefit strong,.scp-benefit span{display:block}.scp-benefit strong{font-size:9px;font-weight:600}.scp-benefit span{font-size:8px;color:#777d84;margin-top:2px} .scp-flow-column{display:flex;flex-direction:column;gap:14px}.scp-stage-list{display:flex;flex-direction:column;gap:12px}.scp-stage{width:100%;border:1px solid var(--scp-border);border-radius:13px;background:#fff;padding:17px 17px;display:grid;grid-template-columns:34px minmax(0,1fr) 26px;gap:12px;align-items:center;text-align:left;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}.scp-stage:hover:not(.is-disabled){border-color:#c8cbcf;transform:translateY(-1px)}.scp-stage.is-active{border-color:var(--scp-accent);box-shadow:0 0 0 1px var(--scp-accent)}.scp-stage.is-disabled{cursor:not-allowed;opacity:.52;background:#fbfbfb}.scp-stage-number{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#30353a;color:#fff;font-size:11px;font-weight:700}.scp-stage.is-active .scp-stage-number{background:var(--scp-accent)}.scp-stage-copy{min-width:0}.scp-stage-title{font-size:12px;font-weight:600;color:#252a2f;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.scp-stage-value{display:block;margin-top:4px;font-size:10px;color:#767c84;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.scp-stage-arrow{display:flex;align-items:center;justify-content:flex-end;color:#34393f}.scp-stage-arrow svg{width:17px;height:17px}.scp-stage.is-complete .scp-stage-value{color:#5e646b}.scp-stage.is-attention .scp-stage-number{background:#fff3e9;color:var(--scp-accent);border:1px solid #ffd0ad} .scp-price-card{padding:19px 18px;position:sticky;top:16px;box-shadow:var(--scp-shadow)}.scp-price-row{display:flex;align-items:flex-end;justify-content:space-between;gap:15px;margin-bottom:16px}.scp-price-row span{font-size:10px;color:#4f555c;display:block}.scp-price-row small{font-size:8px;color:#90959a;display:block;margin-top:3px}.scp-price-row strong{font-size:28px;line-height:1;font-weight:500;letter-spacing:-.04em;white-space:nowrap;color:#22272c}.scp-primary-btn,.scp-secondary-btn{width:100%;border-radius:8px;padding:14px 15px;font-weight:600;font-size:12px;cursor:pointer;transition:.15s ease}.scp-primary-btn{border:1px solid var(--scp-accent);background:var(--scp-accent);color:#fff}.scp-primary-btn:hover{background:var(--scp-accent-strong);border-color:var(--scp-accent-strong)}.scp-secondary-btn{margin-top:10px;border:1px solid var(--scp-accent);background:#fff;color:var(--scp-accent);display:flex;align-items:center;justify-content:center;gap:8px}.scp-secondary-btn:hover{background:#fff8f3}.scp-secondary-btn svg{width:15px;height:15px}.scp-price-note{font-size:8px;color:#8c9197;line-height:1.5;margin:12px 2px 0} .scp-drawer{padding:22px;position:sticky;top:16px;max-height:calc(100vh - 32px);overflow:auto;scrollbar-width:thin;box-shadow:var(--scp-shadow)}.scp-drawer-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px}.scp-drawer-head h2{font-size:19px;line-height:1.25;margin:5px 0 0;font-weight:600;letter-spacing:-.02em}.scp-drawer-head p{font-size:10px;color:#6d737b;line-height:1.5;margin:7px 0 0;max-width:340px}.scp-drawer-head p a{color:var(--scp-accent);font-weight:600;text-decoration:underline}.scp-drawer-head p .scp-step-hint{display:block;margin-top:6px;color:#8b9197;font-weight:500} .scp-option-description{display:block;margin-top:6px;font-size:9px;line-height:1.45;color:#6d737b;font-weight:400} .scp-option-price{font-weight:600;color:#2d3237}.scp-icon-btn{width:32px;height:32px;border:0;background:#fff;color:#2b3035;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:50%;flex:0 0 auto}.scp-icon-btn:hover{background:#f6f6f6}.scp-icon-btn svg{width:19px;height:19px}.scp-drawer-back-wrap{margin:-6px 0 14px}.scp-back-btn{border:0;background:transparent;padding:5px 0;color:#666d75;font-size:10px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px}.scp-back-btn svg{width:14px;height:14px} .scp-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.scp-option{border:1px solid var(--scp-border);border-radius:11px;background:#fafafa;padding:9px;text-align:left;cursor:pointer;position:relative;min-height:72px;transition:border-color .15s ease,box-shadow .15s ease,background .15s ease,transform .15s ease;color:#2d3237}.scp-option:hover{border-color:#c6c9cd;background:#fff;transform:translateY(-1px)}.scp-option.is-selected{border-color:var(--scp-accent);box-shadow:0 0 0 1px var(--scp-accent);background:#fff}.scp-option-check{position:absolute;right:9px;top:9px;width:22px;height:22px;border-radius:50%;background:#fff;border:1.5px solid var(--scp-accent);color:var(--scp-accent);display:flex;align-items:center;justify-content:center;z-index:2}.scp-option-check svg{width:12px;height:12px;stroke-width:2.4}.scp-option img{width:100%;aspect-ratio:1.12/1;object-fit:cover;border-radius:8px;margin-bottom:9px;background:#eee;display:block}.scp-option-label{font-size:10px;font-weight:500;display:block;padding-right:18px;line-height:1.4}.scp-option-meta{font-size:9px;color:#81868c;display:block;margin-top:4px;line-height:1.35}.scp-option-price{font-size:9px;color:var(--scp-accent);display:block;margin-top:5px;font-weight:600}.scp-options.is-textual .scp-option{min-height:64px;display:flex;flex-direction:column;justify-content:center;padding:15px 14px}.scp-options.is-textual .scp-option-label{font-size:11px}.scp-options.is-textual .scp-option img{display:none}.scp-options.is-textual .scp-option-check{top:50%;transform:translateY(-50%)} .scp-extra-list{display:flex;flex-direction:column;gap:9px;grid-column:1/-1}.scp-extra-row{border:1px solid var(--scp-border);border-radius:11px;background:#fff;padding:14px 14px;display:grid;grid-template-columns:minmax(0,1fr) 18px;gap:10px;align-items:center;cursor:pointer;text-align:left;transition:.15s ease}.scp-extra-row:hover{border-color:#c9ccd0;background:#fafafa}.scp-extra-row strong{display:block;font-size:11px;font-weight:600}.scp-extra-row span{display:block;font-size:9px;color:#7f858b;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.scp-extra-row svg{width:16px;height:16px;color:#343a40}.scp-extra-row.is-hidden-by-rule{display:none} .scp-empty-state{grid-column:1/-1;border:1px dashed #d8dade;border-radius:12px;padding:22px 18px;text-align:center;color:#7f858c;background:#fafafa}.scp-empty-state strong{display:block;color:#343a40;font-size:12px;margin-bottom:5px}.scp-empty-state span{font-size:10px;line-height:1.5}.scp-summary-drawer{grid-column:1/-1}.scp-summary-drawer-row{display:flex;justify-content:space-between;gap:15px;padding:12px 0;border-bottom:1px solid #eee}.scp-summary-drawer-row span{font-size:10px;color:#747a81}.scp-summary-drawer-row strong{font-size:10px;font-weight:600;text-align:right}.scp-summary-drawer-total{display:flex;justify-content:space-between;align-items:center;padding-top:18px}.scp-summary-drawer-total span{font-size:10px;color:#676d74}.scp-summary-drawer-total strong{font-size:20px;font-weight:600} .scp-show-more-wrap{margin-top:12px}.scp-show-more{width:100%;border:1px solid #d6d8db;background:#fff;border-radius:8px;padding:11px;color:#3c4248;font-size:10px;font-weight:600;cursor:pointer}.scp-show-more:hover{border-color:#bfc3c7;background:#fafafa}.scp-debug{margin-top:16px;padding:12px 0 0;border-top:1px solid #ededed;font-size:8px;color:#8c9196;line-height:1.55}.scp-error{color:#9d2e1f;background:#fff4f1;border:1px solid #ffe0d8;border-radius:8px;padding:9px;margin-top:8px}.scp-runtime-ok{color:#63716b}.scp-runtime-warning{color:#916036} .scp-reopen-drawer{position:fixed;right:20px;bottom:20px;z-index:20;border:0;border-radius:999px;background:#252a2f;color:#fff;padding:11px 16px;font-size:10px;font-weight:600;box-shadow:0 10px 30px rgba(0,0,0,.16);cursor:pointer}.scp-shell.is-drawer-collapsed .scp-configurator{grid-template-columns:minmax(620px,1.7fr) minmax(350px,.76fr)}.scp-shell.is-drawer-collapsed .scp-drawer{display:none} .scp-toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);z-index:40;background:#252a2f;color:#fff;padding:11px 16px;border-radius:9px;font-size:10px;font-weight:500;opacity:0;pointer-events:none;transition:.2s ease;box-shadow:0 12px 35px rgba(0,0,0,.18)}.scp-toast.is-visible{opacity:1;transform:translate(-50%,0)} @media(max-width:1450px){.scp-configurator{grid-template-columns:minmax(500px,1.35fr) minmax(300px,.68fr) minmax(340px,.72fr);gap:16px}.scp-shell{padding-left:12px;padding-right:12px}.scp-stage{padding:14px}.scp-drawer{padding:18px}.scp-benefits{grid-template-columns:repeat(2,1fr)}} @media(max-width:1150px){.scp-configurator{grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr)}.scp-drawer{grid-column:1/-1;position:relative;top:auto;max-height:none}.scp-shell.is-drawer-collapsed .scp-configurator{grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr)}.scp-shell.is-drawer-collapsed .scp-drawer{display:none}.scp-options{grid-template-columns:repeat(4,minmax(0,1fr))}} @media(max-width:780px){body.strong-preview-body{background:#f8f8f7!important}.scp-shell{padding:8px 8px 96px}.scp-preview-ribbon{margin-bottom:8px;border-radius:8px}.scp-preview-ribbon__left span:not(.scp-preview-chip){display:none}.scp-configurator,.scp-shell.is-drawer-collapsed .scp-configurator{display:block}.scp-visual-card{aspect-ratio:1.03/1;border-radius:11px}.scp-arrangement-btn{left:12px;top:12px;padding:8px 10px}.scp-gallery{left:10px;right:10px;bottom:10px}.scp-gallery button{width:64px;height:50px}.scp-flow-column{margin-top:10px}.scp-stage-list{gap:8px}.scp-stage{padding:13px 12px;border-radius:10px}.scp-price-card{position:fixed;z-index:30;left:8px;right:8px;bottom:8px;top:auto;padding:10px 12px;border-radius:12px;display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;box-shadow:0 14px 40px rgba(0,0,0,.18)}.scp-price-row{margin:0;display:block}.scp-price-row small{display:none}.scp-price-row strong{font-size:20px;margin-top:4px;display:block}.scp-primary-btn{width:auto;padding:12px 16px}.scp-secondary-btn,.scp-price-note{display:none}.scp-drawer{position:fixed;z-index:60;left:0;right:0;bottom:0;top:auto;max-height:82vh;border-radius:18px 18px 0 0;padding:20px 15px 24px;box-shadow:0 -14px 50px rgba(0,0,0,.18);transform:translateY(0);transition:transform .22s ease}.scp-shell.is-drawer-collapsed .scp-drawer{display:block;transform:translateY(105%)}.scp-reopen-drawer{right:12px;bottom:88px}.scp-options{grid-template-columns:repeat(2,minmax(0,1fr))}.scp-summary-card{padding:15px;margin-top:10px}.scp-summary-head{margin-bottom:12px}.scp-summary-content{gap:12px}.scp-summary-thumb{width:72px;height:56px}.scp-summary-item{min-width:115px;padding:4px 12px}.scp-benefits{display:none}.scp-lightbox{padding:18px}.scp-lightbox-close{right:14px;top:14px}.scp-toast{bottom:100px;max-width:calc(100vw - 30px);white-space:nowrap}.scp-preview-ribbon a{font-size:10px}} /* v0.4.1 - sequential flow, high-resolution option images and PDF export */ .scp-stage-list{max-height:none}.scp-stage.is-disabled{opacity:.42}.scp-stage.is-complete .scp-stage-number{background:#2f353a}.scp-stage.is-complete:not(.is-active) .scp-stage-number::after{content:'âś“';position:absolute;font-size:9px;right:-4px;top:-4px;width:14px;height:14px;border-radius:50%;background:#fff;color:#2f7d45;border:1px solid #cde9d5;display:flex;align-items:center;justify-content:center}.scp-stage-number{position:relative} .scp-option-image{image-rendering:auto;-ms-interpolation-mode:bicubic}.scp-options.is-mattress-options .scp-option{background:#fff;padding:12px}.scp-options.is-mattress-options .scp-option-image{object-fit:contain;aspect-ratio:1.42/1;background:#fff;padding:10px;border:1px solid #f0f0f0}.scp-options.is-fabric-options .scp-option-image{object-fit:cover} .scp-summary-item{appearance:none;border:0;background:transparent;text-align:left;cursor:pointer}.scp-summary-item:hover strong{color:var(--scp-accent)}.scp-summary-edit-row{width:100%;border:0;background:#fff;cursor:pointer;text-align:left}.scp-summary-edit-row:hover{background:#fafafa}.scp-summary-edit-row strong{max-width:62%} .scp-pdf-btn{width:100%;margin-top:9px;border:1px solid #d9dbde;background:#f7f7f6;color:#30353a;border-radius:8px;padding:12px 14px;font-size:11px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:.15s ease}.scp-pdf-btn:hover{border-color:#bfc3c7;background:#fff}.scp-pdf-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.scp-pdf-btn.is-loading{opacity:.65;cursor:wait} @media(max-width:780px){.scp-price-card{grid-template-columns:1fr 42px auto}.scp-pdf-btn{width:42px;height:42px;padding:0;margin:0;grid-column:2;grid-row:1;border-radius:9px}.scp-pdf-btn span{display:none}.scp-pdf-btn svg{width:18px;height:18px}.scp-primary-btn{grid-column:3;grid-row:1}.scp-price-row{grid-column:1;grid-row:1}.scp-secondary-btn{display:none}} /* v0.5.0 production state */ body.is-strong-production .scp-debug{display:none!important} body.is-strong-production .scp-shell{padding-top:20px} .scp-primary-btn:disabled{opacity:.48;cursor:not-allowed;transform:none!important} .strong-cart-edit{margin-top:5px;font-size:11px}.strong-cart-edit a{font-weight:600;color:#ff6500} /* v0.5.3 — peĹ‚na lista wariantĂłw przewijana kółkiem myszy */ #strong-configurator-preview .scp-drawer{overscroll-behavior:contain;scrollbar-gutter:stable} #strong-configurator-preview .scp-options{padding-right:3px} #strong-configurator-preview .scp-show-more-wrap{display:none!important} #strong-configurator-preview .scp-options.is-fabric-options,#strong-configurator-preview .scp-options.is-mattress-options{align-content:start} @media(min-width:1151px){#strong-configurator-preview .scp-drawer{overflow-y:auto;scroll-behavior:smooth}} /* v0.6.4 — mobile UX polish */ #strong-configurator-preview .scp-summary-item, #strong-configurator-preview .scp-summary-item:link, #strong-configurator-preview .scp-summary-item:visited, #strong-configurator-preview .scp-summary-item:hover, #strong-configurator-preview .scp-summary-item:active, #strong-configurator-preview .scp-summary-item:focus, #strong-configurator-preview .scp-summary-edit-row, #strong-configurator-preview .scp-summary-edit-row:hover, #strong-configurator-preview .scp-summary-edit-row:focus{ color:#20252a!important; text-decoration:none!important; box-shadow:none!important; outline-color:var(--scp-accent); } #strong-configurator-preview .scp-summary-item small{color:#6f757c!important} #strong-configurator-preview .scp-summary-item strong, #strong-configurator-preview .scp-summary-item:hover strong, #strong-configurator-preview .scp-summary-edit-row strong{ color:#20252a!important; text-decoration:none!important; } #strong-configurator-preview .scp-summary-item:hover{background:#fafafa!important} #strong-configurator-preview .scp-summary-drawer-row, #strong-configurator-preview .scp-summary-drawer-row span, #strong-configurator-preview .scp-summary-drawer-row strong{color:#20252a!important;text-decoration:none!important} #strong-configurator-preview .scp-summary-cart-wrap{margin-top:18px;padding-top:16px;border-top:1px solid #eceeef} #strong-configurator-preview .scp-summary-cart-btn{width:100%;border:1px solid var(--scp-accent);background:var(--scp-accent);color:#fff;border-radius:9px;padding:14px 16px;font-size:12px;font-weight:700;cursor:pointer;transition:.15s ease} #strong-configurator-preview .scp-summary-cart-btn:hover:not(:disabled){background:var(--scp-accent-strong);border-color:var(--scp-accent-strong);transform:translateY(-1px)} #strong-configurator-preview .scp-summary-cart-btn:disabled{opacity:.45;cursor:not-allowed} #strong-configurator-preview .scp-summary-cart-note{display:block;margin-top:8px;text-align:center;color:#8b9197;font-size:9px;line-height:1.45} #strong-configurator-preview .scp-drawer-backdrop{display:none} @media(max-width:780px){ body.strong-preview-body{overflow-x:hidden!important} #strong-configurator-preview.scp-shell{padding:8px 8px calc(34px + env(safe-area-inset-bottom))!important} #strong-configurator-preview .scp-configurator{overflow:visible} #strong-configurator-preview .scp-flow-column{margin-top:12px!important;gap:10px!important;position:relative;z-index:1} #strong-configurator-preview .scp-stage-list{gap:8px!important;padding:0 0 8px!important;position:relative;z-index:1} #strong-configurator-preview .scp-stage{padding:13px 12px!important;min-height:70px;scroll-margin-top:72px;scroll-margin-bottom:110px} #strong-configurator-preview .scp-stage-title{white-space:normal;line-height:1.3} #strong-configurator-preview .scp-stage-value{white-space:normal;line-height:1.35;max-height:2.7em} /* Cena i gĹ‚Ăłwny CTA sÄ… na koĹ„cu krokĂłw — nic nie przykrywa treĹ›ci mobilnej. */ #strong-configurator-preview .scp-price-card{ position:relative!important; z-index:2!important; left:auto!important;right:auto!important;bottom:auto!important;top:auto!important; display:block!important; margin:4px 0 78px!important; padding:16px!important; border-radius:13px!important; box-shadow:0 8px 24px rgba(25,29,33,.08)!important; } #strong-configurator-preview .scp-price-row{display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:12px!important;margin:0 0 14px!important} #strong-configurator-preview .scp-price-row small{display:block!important;margin-top:4px!important} #strong-configurator-preview .scp-price-row strong{font-size:24px!important;margin:0!important} #strong-configurator-preview .scp-primary-btn{display:block!important;width:100%!important;padding:14px 15px!important;grid-column:auto!important;grid-row:auto!important} #strong-configurator-preview .scp-secondary-btn{display:flex!important;width:100%!important;margin-top:9px!important} #strong-configurator-preview .scp-pdf-btn{display:flex!important;width:100%!important;height:auto!important;padding:12px 14px!important;margin-top:9px!important;grid-column:auto!important;grid-row:auto!important} #strong-configurator-preview .scp-pdf-btn span{display:inline!important} #strong-configurator-preview .scp-price-note{display:block!important;margin-top:10px!important} /* Bottom sheet jest odseparowany od krokĂłw przyciemnieniem tĹ‚a, wiÄ™c nie wyglÄ…da jak nakĹ‚adka-chaos. */ #strong-configurator-preview .scp-drawer-backdrop{ display:block; position:fixed; inset:0; z-index:54; background:rgba(20,24,28,.28); backdrop-filter:blur(1px); opacity:1; pointer-events:auto; transition:opacity .2s ease; } #strong-configurator-preview.is-drawer-collapsed .scp-drawer-backdrop{opacity:0;pointer-events:none} #strong-configurator-preview .scp-drawer{ position:fixed!important; z-index:60!important; left:8px!important;right:8px!important; bottom:calc(10px + env(safe-area-inset-bottom))!important; top:auto!important; max-height:min(72svh,680px)!important; border-radius:18px!important; padding:18px 14px calc(18px + env(safe-area-inset-bottom))!important; box-shadow:0 -8px 34px rgba(0,0,0,.20)!important; transform:translateY(0); overflow-y:auto!important; overscroll-behavior:contain; } #strong-configurator-preview.is-drawer-collapsed .scp-drawer{display:block!important;transform:translateY(calc(100% + 24px))!important;pointer-events:none} #strong-configurator-preview .scp-drawer-head{position:sticky;top:-18px;z-index:5;background:#fff;padding:18px 0 10px;margin-bottom:8px;border-bottom:1px solid #f0f0f0} #strong-configurator-preview .scp-options{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;padding-bottom:4px} #strong-configurator-preview .scp-option{min-width:0} #strong-configurator-preview .scp-reopen-drawer{right:12px!important;bottom:calc(18px + env(safe-area-inset-bottom))!important;z-index:52!important} /* Cookie badge zwykle siedzi na dole po lewej; zostawiamy tam bezpiecznÄ… strefÄ™. */ #strong-configurator-preview .scp-price-card, #strong-configurator-preview .scp-summary-card{scroll-margin-bottom:92px} #strong-configurator-preview .scp-toast{bottom:calc(24px + env(safe-area-inset-bottom))!important;z-index:80!important;max-width:calc(100vw - 28px)!important;white-space:normal!important;text-align:center} #strong-configurator-preview .scp-summary-card{padding:15px!important;margin-top:10px!important} #strong-configurator-preview .scp-summary-content{display:block!important} #strong-configurator-preview .scp-summary-thumb{display:none!important} #strong-configurator-preview .scp-summary{display:grid!important;grid-template-columns:1fr 1fr;gap:7px;overflow:visible!important} #strong-configurator-preview .scp-summary-item{min-width:0!important;padding:10px 11px!important;border:1px solid #eceeef!important;border-radius:9px!important;background:#fafafa!important} #strong-configurator-preview .scp-summary-item:first-child{padding-left:11px!important} #strong-configurator-preview .scp-summary-item small{white-space:normal!important;margin-bottom:4px!important} #strong-configurator-preview .scp-summary-cart-btn{padding:15px 16px;font-size:13px} } @media(max-width:430px){ #strong-configurator-preview .scp-options{grid-template-columns:repeat(2,minmax(0,1fr))!important} #strong-configurator-preview .scp-option{padding:8px!important} #strong-configurator-preview .scp-option-label{font-size:9.5px!important} #strong-configurator-preview .scp-summary{grid-template-columns:1fr!important} #strong-configurator-preview .scp-price-row strong{font-size:21px!important} } /* v0.6.6 — mobile always-visible cart dock + denser first viewport */ @media(max-width:780px){ #strong-configurator-preview.scp-shell{ padding-bottom:calc(92px + env(safe-area-inset-bottom))!important; } /* More product + first step visible without losing the CTA. */ #strong-configurator-preview .scp-visual-card{ aspect-ratio:auto!important; height:clamp(235px,54svh,390px)!important; min-height:235px!important; } #strong-configurator-preview .scp-gallery button{width:56px!important;height:44px!important} #strong-configurator-preview .scp-flow-column{margin-top:8px!important} #strong-configurator-preview .scp-stage-list{gap:6px!important} #strong-configurator-preview .scp-stage{ min-height:58px!important; padding:10px 11px!important; grid-template-columns:30px minmax(0,1fr) 22px!important; gap:9px!important; scroll-margin-bottom:94px!important; } #strong-configurator-preview .scp-stage-number{width:26px!important;height:26px!important;font-size:10px!important} #strong-configurator-preview .scp-stage-title{font-size:11px!important} #strong-configurator-preview .scp-stage-value{font-size:9.5px!important;margin-top:3px!important} /* Fixed purchase dock: CTA is visible from the first screen, without covering steps. */ #strong-configurator-preview .scp-price-card{ position:fixed!important; z-index:48!important; left:8px!important; right:8px!important; bottom:calc(8px + env(safe-area-inset-bottom))!important; margin:0!important; min-height:62px!important; padding:8px 9px 8px 58px!important; /* safe zone for the cookie badge at bottom-left */ border-radius:13px!important; display:grid!important; grid-template-columns:minmax(76px,.72fr) minmax(148px,1.28fr)!important; align-items:center!important; gap:8px!important; box-shadow:0 12px 34px rgba(17,22,27,.18)!important; } #strong-configurator-preview .scp-price-row{ display:block!important; min-width:0!important; margin:0!important; } #strong-configurator-preview .scp-price-row span{font-size:8.5px!important;line-height:1.15!important} #strong-configurator-preview .scp-price-row small{display:none!important} #strong-configurator-preview .scp-price-row strong{ display:block!important; margin:3px 0 0!important; font-size:17px!important; line-height:1.05!important; white-space:nowrap!important; } #strong-configurator-preview .scp-primary-btn{ display:block!important; width:100%!important; min-height:44px!important; padding:11px 10px!important; margin:0!important; font-size:11px!important; border-radius:9px!important; grid-column:2!important; grid-row:1!important; } #strong-configurator-preview .scp-secondary-btn, #strong-configurator-preview .scp-pdf-btn, #strong-configurator-preview .scp-price-note{display:none!important} /* Option sheet stays above the purchase dock. */ #strong-configurator-preview .scp-drawer{z-index:70!important} #strong-configurator-preview .scp-drawer-backdrop{z-index:64!important} #strong-configurator-preview .scp-reopen-drawer{bottom:calc(82px + env(safe-area-inset-bottom))!important;z-index:62!important} #strong-configurator-preview .scp-toast{bottom:calc(86px + env(safe-area-inset-bottom))!important} #strong-configurator-preview .scp-summary-card{ scroll-margin-bottom:104px!important; margin-bottom:4px!important; } } @media(max-width:430px){ #strong-configurator-preview .scp-visual-card{height:clamp(220px,48svh,330px)!important} #strong-configurator-preview .scp-price-card{ padding-left:54px!important; grid-template-columns:minmax(72px,.68fr) minmax(145px,1.32fr)!important; } #strong-configurator-preview .scp-price-row strong{font-size:15.5px!important} #strong-configurator-preview .scp-primary-btn{font-size:10.5px!important} } /* v0.6.7 — mobile summary raised, internal scroll + always-visible final CTA */ #strong-configurator-preview .scp-summary-drawer-list{min-width:0} #strong-configurator-preview .scp-summary-drawer-footer{background:#fff} @media(max-width:780px){ /* W podsumowaniu korzystamy z CTA wewnÄ…trz panelu, wiÄ™c nie dublujemy dolnego docka. */ #strong-configurator-preview.is-summary-active .scp-price-card{display:none!important} #strong-configurator-preview.is-summary-active.scp-shell{ padding-bottom:calc(18px + env(safe-area-inset-bottom))!important; } /* Podsumowanie wjeĹĽdĹĽa wyĹĽej i zajmuje praktycznie caĹ‚y ekran. */ #strong-configurator-preview .scp-drawer.is-summary-view{ top:8px!important; bottom:calc(8px + env(safe-area-inset-bottom))!important; height:auto!important; max-height:none!important; border-radius:18px!important; padding:14px 14px calc(12px + env(safe-area-inset-bottom))!important; display:flex!important; flex-direction:column!important; overflow:hidden!important; } #strong-configurator-preview.is-drawer-collapsed .scp-drawer.is-summary-view{ transform:translateY(calc(100% + 32px))!important; } #strong-configurator-preview .scp-drawer.is-summary-view .scp-drawer-head{ position:relative!important; top:auto!important; flex:0 0 auto!important; margin:0 0 6px!important; padding:4px 0 10px!important; background:#fff!important; } #strong-configurator-preview .scp-drawer.is-summary-view .scp-drawer-head h2{ font-size:17px!important; margin-top:3px!important; } #strong-configurator-preview .scp-drawer.is-summary-view .scp-drawer-head p{ margin-top:4px!important; font-size:9px!important; } #strong-configurator-preview .scp-drawer.is-summary-view .scp-drawer-back-wrap, #strong-configurator-preview .scp-drawer.is-summary-view .scp-show-more-wrap, #strong-configurator-preview .scp-drawer.is-summary-view .scp-debug{ display:none!important; } #strong-configurator-preview .scp-drawer.is-summary-view .scp-options{ display:block!important; flex:1 1 auto!important; min-height:0!important; overflow:hidden!important; padding:0!important; } #strong-configurator-preview .scp-drawer.is-summary-view .scp-summary-drawer{ height:100%!important; min-height:0!important; display:flex!important; flex-direction:column!important; } /* ScrollujÄ… siÄ™ wyĹ‚Ä…cznie parametry. Cena i przycisk pozostajÄ… na ekranie. */ #strong-configurator-preview .scp-drawer.is-summary-view .scp-summary-drawer-list{ flex:1 1 auto!important; min-height:0!important; overflow-y:auto!important; overscroll-behavior:contain!important; -webkit-overflow-scrolling:touch!important; padding:0 3px 4px 0!important; } #strong-configurator-preview .scp-drawer.is-summary-view .scp-summary-drawer-row{ padding:8px 2px!important; min-height:36px!important; } #strong-configurator-preview .scp-drawer.is-summary-view .scp-summary-drawer-row span, #strong-configurator-preview .scp-drawer.is-summary-view .scp-summary-drawer-row strong{ font-size:9.5px!important; line-height:1.3!important; } #strong-configurator-preview .scp-drawer.is-summary-view .scp-summary-drawer-footer{ flex:0 0 auto!important; position:relative!important; z-index:4!important; margin:0 -2px!important; padding:9px 2px 0!important; border-top:1px solid #eceeef!important; box-shadow:0 -12px 22px rgba(255,255,255,.96)!important; } #strong-configurator-preview .scp-drawer.is-summary-view .scp-summary-drawer-total{ padding:0 2px 9px!important; } #strong-configurator-preview .scp-drawer.is-summary-view .scp-summary-drawer-total strong{ font-size:18px!important; } #strong-configurator-preview .scp-drawer.is-summary-view .scp-summary-cart-wrap{ margin:0!important; padding:0!important; border-top:0!important; } #strong-configurator-preview .scp-drawer.is-summary-view .scp-summary-cart-btn{ min-height:48px!important; padding:13px 16px!important; font-size:12.5px!important; border-radius:10px!important; } #strong-configurator-preview .scp-drawer.is-summary-view .scp-summary-cart-note{ display:none!important; } } @media(max-width:430px){ #strong-configurator-preview .scp-drawer.is-summary-view{ top:6px!important; left:6px!important; right:6px!important; bottom:calc(6px + env(safe-area-inset-bottom))!important; padding-left:12px!important; padding-right:12px!important; } #strong-configurator-preview .scp-drawer.is-summary-view .scp-summary-drawer-row{ padding:7px 1px!important; } } #strong-configurator-preview .scp-summary-secondary-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px} #strong-configurator-preview .scp-summary-secondary-btn{min-height:42px;border:1px solid #dcdfe2;background:#fff;color:#252a2f;border-radius:9px;padding:10px 12px;font-size:10px;font-weight:650;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:.15s ease} #strong-configurator-preview .scp-summary-secondary-btn:hover:not(:disabled){border-color:#bfc4c9;background:#fafafa;transform:translateY(-1px)} #strong-configurator-preview .scp-summary-secondary-btn:disabled{opacity:.55;cursor:wait} #strong-configurator-preview .scp-summary-secondary-btn svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} @media(max-width:780px){#strong-configurator-preview .scp-summary-secondary-actions{grid-template-columns:1fr 1fr;gap:7px;margin-top:8px}#strong-configurator-preview .scp-summary-secondary-btn{min-height:40px;padding:9px 8px;font-size:9.5px}} /* v0.6.9 — subtle Froosolutions attribution */ #strong-configurator-preview .scp-powered{ max-width:1830px; margin:16px auto 0; display:flex; align-items:center; justify-content:flex-end; gap:4px; color:#9a9fa5; font-size:9px; line-height:1.4; letter-spacing:.01em; } #strong-configurator-preview .scp-powered a, #strong-configurator-preview .scp-powered a:visited{ color:#5f656c!important; text-decoration:none!important; font-weight:600; transition:color .15s ease; } #strong-configurator-preview .scp-powered a:hover, #strong-configurator-preview .scp-powered a:focus{ color:var(--scp-accent)!important; text-decoration:none!important; } @media(max-width:780px){ #strong-configurator-preview .scp-powered{ justify-content:center; margin:12px auto 3px; padding:0 8px; font-size:8.5px; } } /* v0.6.10 — branded startup loader */ body.strong-preview-body .scp-boot-loader{ position:fixed; inset:0; z-index:999999; display:flex; align-items:center; justify-content:center; padding:24px; background:#f7f7f6; opacity:1; visibility:visible; transition:opacity .32s ease,visibility .32s ease; } body.strong-preview-body .scp-boot-loader.is-ready{ opacity:0; visibility:hidden; pointer-events:none; } body.strong-preview-body .scp-boot-loader__card{ width:min(390px,calc(100vw - 40px)); display:flex; flex-direction:column; align-items:center; text-align:center; font-family:'Montserrat',Arial,sans-serif; } body.strong-preview-body .scp-boot-loader__logo{ display:block; width:min(230px,62vw); max-height:58px; object-fit:contain; margin:0 auto 22px; } body.strong-preview-body .scp-boot-loader__title{ color:#20252a; font-size:17px; line-height:1.25; font-weight:650; letter-spacing:-.02em; } body.strong-preview-body .scp-boot-loader__text{ margin-top:7px; color:#858b91; font-size:10px; line-height:1.5; font-weight:500; } body.strong-preview-body .scp-boot-loader__track{ position:relative; width:152px; height:3px; margin-top:22px; overflow:hidden; border-radius:999px; background:#e3e5e6; } body.strong-preview-body .scp-boot-loader__track span{ position:absolute; inset:0 auto 0 0; width:48%; border-radius:inherit; background:var(--scp-accent,#ff6500); animation:scpBootProgress 1s cubic-bezier(.4,0,.2,1) infinite; } body.strong-preview-body .scp-boot-loader__powered{ display:flex; align-items:center; justify-content:center; gap:5px; margin-top:16px; color:#9a9ea2; font-size:10px; line-height:1.3; font-weight:500; } body.strong-preview-body .scp-boot-loader__powered a{ color:#20252a; font-weight:650; text-decoration:none; transition:color .18s ease; } body.strong-preview-body .scp-boot-loader__powered a:hover{ color:var(--scp-accent,#ff6500); } @keyframes scpBootProgress{ 0%{transform:translateX(-110%)} 55%{transform:translateX(115%)} 100%{transform:translateX(235%)} } @media(max-width:780px){ body.strong-preview-body .scp-boot-loader{padding:20px} body.strong-preview-body .scp-boot-loader__logo{width:min(205px,64vw);margin-bottom:18px} body.strong-preview-body .scp-boot-loader__title{font-size:15px} body.strong-preview-body .scp-boot-loader__text{font-size:9px} body.strong-preview-body .scp-boot-loader__track{width:132px;margin-top:18px} body.strong-preview-body .scp-boot-loader__powered{font-size:9px;margin-top:14px} } @media(prefers-reduced-motion:reduce){ body.strong-preview-body .scp-boot-loader__track span{animation:none;width:100%} } /* v0.6.16 — visible lead time + back button, synced totals */ #strong-configurator-preview .scp-benefits{grid-template-columns:repeat(3,minmax(0,1fr))} #strong-configurator-preview .scp-benefit strong{font-size:11px} #strong-configurator-preview .scp-benefit span{font-size:10px} #strong-configurator-preview .scp-drawer-back-wrap{margin:0 0 16px} #strong-configurator-preview .scp-back-btn{ width:100%; border:1.5px solid #ffb072; background:#fff7f0; color:#c24e00; border-radius:10px; padding:12px 14px; font-size:13px; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px; box-shadow:0 4px 14px rgba(255,106,0,.08); } #strong-configurator-preview .scp-back-btn:hover{ background:#ffefdf; border-color:var(--scp-accent); color:#a94400; } #strong-configurator-preview .scp-back-btn svg{width:18px;height:18px;stroke-width:2.2} #strong-configurator-preview .scp-summary-line-price{ display:block; margin-top:4px; font-style:normal; font-size:11px; font-weight:600; color:var(--scp-accent); } #strong-configurator-preview .scp-summary-price-tip{ margin:10px 0 0; font-size:11px; line-height:1.5; color:#6a7077; } /* Lead time — tylko w podsumowaniu, typografia zamiast „pomaraĹ„czowego boxa” */ #strong-configurator-preview .scp-summary-leadtime{ margin-top:22px; padding:18px 0 4px; border-top:1px solid #e6e8ea; } #strong-configurator-preview .scp-summary-leadtime__label{ margin:0 0 6px; font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:#8a9097; } #strong-configurator-preview .scp-summary-leadtime__title{ margin:0 0 8px; font-size:20px; line-height:1.2; font-weight:650; letter-spacing:-.02em; color:#1f2429; } #strong-configurator-preview .scp-summary-leadtime__text{ margin:0; max-width:34em; font-size:13px; line-height:1.55; color:#555c64; } #strong-configurator-preview .scp-headboard-note{ grid-column:1/-1; margin-top:8px; padding:16px 18px; border-left:3px solid #2d3237; background:#f4f5f5; color:#1f2429; font-size:14px; line-height:1.45; font-weight:500; } #strong-configurator-preview .scp-headboard-note strong{ font-weight:700; margin-right:4px; } #strong-configurator-preview .scp-headboard-note em{ font-style:normal; font-weight:700; text-decoration:underline; text-underline-offset:2px; } #strong-configurator-preview .scp-drawer-head p .scp-inline-link{ display:inline; border:0; background:transparent; padding:0; margin:0; color:var(--scp-accent); font:inherit; font-weight:600; text-decoration:underline; text-underline-offset:2px; cursor:pointer; } #strong-configurator-preview .scp-drawer-head p .scp-inline-link:hover{ color:var(--scp-accent-strong); } /* Fabric info modal */ body.scp-fabric-modal-open{overflow:hidden} .scp-simple-info-modal .scp-fabric-modal__body{ grid-template-columns:1fr; } .scp-simple-info-modal__content{ max-width:720px; margin:0 auto; width:100%; } .scp-fabric-modal{ position:fixed; inset:0; z-index:12000; display:flex; align-items:center; justify-content:center; padding:18px; } .scp-fabric-modal[hidden]{display:none!important} .scp-fabric-modal__backdrop{ position:absolute; inset:0; background:rgba(18,22,26,.58); backdrop-filter:blur(2px); } .scp-fabric-modal__panel{ position:relative; z-index:1; width:min(980px,100%); max-height:min(860px,calc(100vh - 36px)); background:#fff; border:1px solid #e4e6e8; border-radius:16px; box-shadow:0 28px 80px rgba(16,22,28,.28); display:flex; flex-direction:column; overflow:hidden; font-family:'Montserrat',Arial,sans-serif; color:#1e2227; } .scp-fabric-modal__head{ display:flex; justify-content:space-between; align-items:flex-start; gap:18px; padding:22px 24px 16px; border-bottom:1px solid #eceeef; background:linear-gradient(180deg,#fff 0%,#fafafa 100%); flex:0 0 auto; } .scp-fabric-modal__head-main{min-width:0;flex:1} .scp-fabric-modal__kicker{ margin:0 0 4px; font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#ff6a00; } .scp-fabric-modal__head h2{ margin:0; font-size:22px; line-height:1.2; letter-spacing:-.02em; font-weight:700; } .scp-fabric-modal__lead{ margin:8px 0 0; font-size:13px; line-height:1.5; color:#667078; max-width:42em; } .scp-fabric-modal__picker-wrap{ display:none; margin-top:14px; width:100%; max-width:420px; } .scp-fabric-modal__picker-label{ display:block; margin-bottom:6px; font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:#5f666e; } .scp-fabric-modal__picker{ width:100%; appearance:none; -webkit-appearance:none; border:1px solid #d7dce1; border-radius:10px; background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232b3035' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center; background-size:16px; color:#1e2227; font:inherit; font-size:15px; font-weight:600; line-height:1.3; padding:14px 42px 14px 14px; min-height:48px; box-shadow:0 1px 2px rgba(16,22,28,.04); } .scp-fabric-modal__picker:focus{ outline:none; border-color:#ff6a00; box-shadow:0 0 0 2px rgba(255,106,0,.18); } .scp-fabric-modal__close{ width:40px; height:40px; border:1px solid #e4e6e8; border-radius:999px; background:#fff; color:#2b3035; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; flex:0 0 auto; } .scp-fabric-modal__close:hover{border-color:#cfd3d6;background:#f7f7f6} .scp-fabric-modal__close svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round} .scp-fabric-modal__body{ display:grid; grid-template-columns:240px minmax(0,1fr); min-height:0; flex:1; } .scp-fabric-modal__nav{ border-right:1px solid #eceeef; background:#f7f7f6; overflow:auto; padding:12px; display:flex; flex-direction:column; gap:6px; -webkit-overflow-scrolling:touch; } .scp-fabric-modal__nav-item{ width:100%; text-align:left; border:1px solid transparent; background:transparent; border-radius:10px; padding:12px; cursor:pointer; color:#1e2227; transition:border-color .15s ease,background .15s ease,box-shadow .15s ease; } .scp-fabric-modal__nav-item:hover{ background:#fff; border-color:#e4e6e8; } .scp-fabric-modal__nav-item.is-active{ background:#fff; border-color:#ff6a00; box-shadow:0 0 0 1px #ff6a00; } .scp-fabric-modal__nav-eyebrow{ display:block; font-size:9px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#8a9198; margin-bottom:4px; } .scp-fabric-modal__nav-item strong{ display:block; font-size:13px; font-weight:700; line-height:1.3; } .scp-fabric-modal__content{ overflow:auto; padding:22px 26px 72px; background:#fff; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; } .scp-fabric-modal__content-spacer{ height:48px; width:100%; } .scp-fabric-modal__eyebrow{ margin:0 0 6px; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#ff6a00; } .scp-fabric-modal__content h3{ margin:0 0 16px; font-size:28px; line-height:1.15; letter-spacing:-.02em; font-weight:700; } .scp-fabric-modal__rich{ font-size:14px; line-height:1.65; color:#3a4148; padding-bottom:8px; } .scp-fabric-modal__rich .strong-fabric-section{ margin-top:20px; padding-top:16px; border-top:1px solid #eceeef; } .scp-fabric-modal__rich .strong-fabric-section:first-child{ margin-top:0; padding-top:0; border-top:0; } .scp-fabric-modal__rich h2{ margin:0 0 8px; font-size:15px; line-height:1.3; font-weight:700; color:#1e2227; } .scp-fabric-modal__rich p{margin:0 0 10px} .scp-fabric-modal__rich .strong-fabric-bullets{ list-style:none; margin:0; padding:0; display:grid; gap:8px; } .scp-fabric-modal__rich .strong-fabric-bullets li{ position:relative; padding:10px 12px 10px 34px; background:#f7f7f6; border:1px solid #eceeef; border-radius:8px; font-size:13px; line-height:1.45; color:#2b3138; } .scp-fabric-modal__rich .strong-fabric-bullets li::before{ content:""; position:absolute; left:12px; top:50%; width:8px; height:8px; margin-top:-4px; border-radius:50%; background:#ff6a00; } /* Tablet + mobile: dropdown + wrap grid of all fabrics */ @media(max-width:1100px){ .scp-fabric-modal{ padding:0; align-items:stretch; justify-content:stretch; } .scp-fabric-modal__panel{ width:100%; max-width:none; max-height:none; height:100%; border-radius:0; border:0; } .scp-fabric-modal__head{ padding:16px 16px 14px; position:sticky; top:0; z-index:3; } .scp-fabric-modal__head h2{font-size:20px} .scp-fabric-modal__lead{font-size:12px} .scp-fabric-modal__picker-wrap{display:block;max-width:none} .scp-fabric-modal__body{ grid-template-columns:1fr; grid-template-rows:minmax(0,1fr); min-height:0; } /* Na mobile lista kart jest zbÄ™dna — wystarczy select + opis */ .scp-fabric-modal__nav{display:none!important} .scp-fabric-modal__content{ padding:18px 16px 120px; } .scp-fabric-modal__content h3{font-size:22px} .scp-fabric-modal__content-spacer{height:88px} } @media(max-width:560px){ .scp-fabric-modal__picker{ font-size:16px; /* iOS zoom prevention */ } } @media(max-width:780px){ #strong-configurator-preview .scp-benefits{display:none} #strong-configurator-preview .scp-back-btn{font-size:14px;padding:13px 14px} #strong-configurator-preview .scp-summary-leadtime__title{font-size:18px} #strong-configurator-preview .scp-headboard-note{font-size:15px;padding:15px 16px} } /* ========== Studio layout (visual redesign v0.6.24) ========== */ html.strong-preview-html, body.strong-preview-body{ width:100%!important; max-width:none!important; margin:0!important; padding:0!important; min-height:100%!important; background:#f3f4f6!important; overflow-x:hidden!important; transform:none!important; zoom:normal!important; } body.strong-preview-body #wpadminbar{display:none!important} body.strong-preview-body{ font-family:'Montserrat',system-ui,sans-serif!important; color:#1e2227; font-size:15px; line-height:1.45; } #strong-configurator-preview.scp-shell--studio{ --scp-accent:#ff6a00; --scp-accent-strong:#ef5a00; --scp-ink:#1c2127; --scp-muted:#6b7280; --scp-border:#e5e7eb; --scp-soft:#f3f4f6; --scp-card:#ffffff; box-sizing:border-box; width:100%!important; max-width:none!important; min-height:100vh; margin:0!important; padding:0 0 92px!important; background:var(--scp-soft)!important; display:flex; flex-direction:column; } #strong-configurator-preview.scp-shell--studio *, #strong-configurator-preview.scp-shell--studio *::before, #strong-configurator-preview.scp-shell--studio *::after{box-sizing:border-box} #strong-configurator-preview.scp-shell--studio .scp-preview-ribbon{ margin:10px 20px 0;border-radius:12px; } /* ---- Top bar ---- */ #strong-configurator-preview.scp-shell--studio .scp-topbar{ display:grid; grid-template-columns:160px minmax(0,1fr) 190px; gap:18px; align-items:center; width:100%; padding:12px clamp(16px,2.2vw,28px); background:#fff; border-bottom:1px solid var(--scp-border); position:sticky; top:0; z-index:40; flex:0 0 auto; } #strong-configurator-preview.scp-shell--studio .scp-brand{ display:inline-flex;align-items:baseline;gap:1px; text-decoration:none;color:var(--scp-ink); font-weight:800;letter-spacing:.01em;font-size:17px;line-height:1; } #strong-configurator-preview.scp-shell--studio .scp-brand__strong{color:var(--scp-accent)} #strong-configurator-preview.scp-shell--studio .scp-help{ display:flex;align-items:center;justify-content:flex-end;gap:10px; text-decoration:none;color:var(--scp-ink); } #strong-configurator-preview.scp-shell--studio .scp-help__icon{ width:34px;height:34px;border-radius:50%; border:1px solid var(--scp-border); display:inline-flex;align-items:center;justify-content:center; font-weight:800;color:var(--scp-accent);background:#fff;font-size:14px; } #strong-configurator-preview.scp-shell--studio .scp-help__copy{display:flex;flex-direction:column;line-height:1.2} #strong-configurator-preview.scp-shell--studio .scp-help__copy strong{font-size:12px;font-weight:700} #strong-configurator-preview.scp-shell--studio .scp-help__copy small{font-size:10px;color:var(--scp-muted);font-weight:500} /* Compact stepper — number + label, no values, no scrollbar when possible */ #strong-configurator-preview.scp-shell--studio .scp-stage-list{ display:flex!important; flex-direction:row!important; flex-wrap:nowrap; justify-content:center; align-items:stretch; gap:4px!important; overflow-x:auto; scrollbar-width:none; padding:2px 0; min-width:0; } #strong-configurator-preview.scp-shell--studio .scp-stage-list::-webkit-scrollbar{display:none} #strong-configurator-preview.scp-shell--studio .scp-stage{ display:flex!important; flex-direction:column!important; align-items:center; justify-content:center; gap:5px!important; flex:1 1 0; min-width:64px; max-width:96px; padding:8px 4px!important; border-radius:12px!important; border:1px solid transparent!important; background:transparent!important; box-shadow:none!important; cursor:pointer; transform:none!important; } #strong-configurator-preview.scp-shell--studio .scp-stage:hover:not(.is-disabled){ background:#f8f9fa!important; border-color:var(--scp-border)!important; } #strong-configurator-preview.scp-shell--studio .scp-stage.is-active{ background:#fff!important; border-color:var(--scp-accent)!important; box-shadow:0 0 0 1px var(--scp-accent)!important; } #strong-configurator-preview.scp-shell--studio .scp-stage-number{ width:28px!important;height:28px!important; border-radius:50%!important; display:inline-flex!important;align-items:center;justify-content:center; font-size:12px!important;font-weight:700!important; background:#eef0f2!important;color:#374151!important;border:0!important; line-height:1; } #strong-configurator-preview.scp-shell--studio .scp-stage.is-active .scp-stage-number, #strong-configurator-preview.scp-shell--studio .scp-stage.is-complete .scp-stage-number{ background:var(--scp-accent)!important;color:#fff!important; } #strong-configurator-preview.scp-shell--studio .scp-stage.is-complete:not(.is-active) .scp-stage-number{ background:#16a34a!important; } #strong-configurator-preview.scp-shell--studio .scp-stage-number::after{ display:none!important;content:none!important; } #strong-configurator-preview.scp-shell--studio .scp-stage-copy, #strong-configurator-preview.scp-shell--studio .scp-stage-value, #strong-configurator-preview.scp-shell--studio .scp-stage-arrow{display:none!important} #strong-configurator-preview.scp-shell--studio .scp-stage-title{ display:block!important; font-size:10px!important; font-weight:600!important; color:#4b5563!important; text-align:center; white-space:nowrap; line-height:1.2; max-width:100%; overflow:hidden; text-overflow:ellipsis; } #strong-configurator-preview.scp-shell--studio .scp-stage.is-active .scp-stage-title{color:var(--scp-ink)!important} /* ---- Main 60/40 ---- */ #strong-configurator-preview.scp-shell--studio .scp-configurator{ display:grid!important; grid-template-columns:minmax(0,1.25fr) minmax(380px,.9fr)!important; gap:clamp(16px,2vw,28px)!important; width:100%; max-width:1680px; margin:18px auto 0!important; padding:0 clamp(16px,2.2vw,28px); align-items:start; flex:1 1 auto; } #strong-configurator-preview.scp-shell--studio .scp-flow-column{display:none!important} #strong-configurator-preview.scp-shell--studio .scp-visual-column{ display:flex;flex-direction:column;gap:12px;min-width:0; } #strong-configurator-preview.scp-shell--studio .scp-visual-card{ position:relative; aspect-ratio:4/3!important; max-height:min(62vh,720px); border-radius:18px!important; background:#fff!important; border:1px solid var(--scp-border)!important; box-shadow:0 14px 40px rgba(15,23,42,.07)!important; overflow:hidden; } #strong-configurator-preview.scp-shell--studio .scp-visual-card>img{ width:100%;height:100%;object-fit:cover;display:block; } #strong-configurator-preview.scp-shell--studio .scp-fullscreen-btn{ position:absolute;z-index:5;left:14px;top:14px; display:inline-flex;align-items:center;gap:7px; border:0;border-radius:999px;padding:9px 13px; background:rgba(255,255,255,.94);color:#2b3035; font-size:12px;font-weight:600;cursor:pointer; box-shadow:0 4px 14px rgba(0,0,0,.08); } #strong-configurator-preview.scp-shell--studio .scp-fullscreen-btn svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.8} #strong-configurator-preview.scp-shell--studio .scp-gallery-nav{ position:absolute;z-index:5;top:50%;transform:translateY(-50%); width:42px;height:42px;border-radius:50%;border:0; background:rgba(255,255,255,.94);color:#2b3035;cursor:pointer; display:inline-flex;align-items:center;justify-content:center; box-shadow:0 4px 14px rgba(0,0,0,.1); } #strong-configurator-preview.scp-shell--studio .scp-gallery-nav svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8} #strong-configurator-preview.scp-shell--studio .scp-gallery-nav--prev{left:12px} #strong-configurator-preview.scp-shell--studio .scp-gallery-nav--next{right:12px} #strong-configurator-preview.scp-shell--studio .scp-gallery{ position:relative!important;left:auto!important;right:auto!important;bottom:auto!important; display:flex;gap:8px;overflow-x:auto;padding:2px 1px;scrollbar-width:thin; } #strong-configurator-preview.scp-shell--studio .scp-gallery button{ width:84px!important;height:64px!important;border-radius:10px!important; border:2px solid #fff!important;box-shadow:0 2px 10px rgba(0,0,0,.08); padding:0;overflow:hidden;flex:0 0 auto;cursor:pointer;background:#fff; } #strong-configurator-preview.scp-shell--studio .scp-gallery button.is-active{ border-color:var(--scp-accent)!important; box-shadow:0 0 0 1px var(--scp-accent),0 2px 10px rgba(0,0,0,.08); } #strong-configurator-preview.scp-shell--studio .scp-gallery img{width:100%;height:100%;object-fit:cover;display:block} /* Benefits under gallery */ #strong-configurator-preview.scp-shell--studio .scp-benefits--under-gallery{ display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:6px!important; margin:0!important; padding:14px 10px!important; border-radius:14px!important; background:#fff!important; border:1px solid var(--scp-border)!important; box-shadow:0 6px 18px rgba(15,23,42,.04); } #strong-configurator-preview.scp-shell--studio .scp-benefits--under-gallery .scp-benefit{ display:flex;align-items:center;gap:9px;padding:2px 6px;min-width:0; } #strong-configurator-preview.scp-shell--studio .scp-benefits--under-gallery .scp-benefit svg{ width:22px;height:22px;color:var(--scp-accent);flex:0 0 auto; stroke:currentColor;fill:none;stroke-width:1.7; } #strong-configurator-preview.scp-shell--studio .scp-benefits--under-gallery .scp-benefit strong{ display:block;font-size:11px!important;font-weight:700;color:var(--scp-ink);line-height:1.25; } #strong-configurator-preview.scp-shell--studio .scp-benefits--under-gallery .scp-benefit span{ display:block;font-size:10px!important;color:#8b929a;margin-top:1px; } /* ---- Right options panel ---- */ #strong-configurator-preview.scp-shell--studio .scp-drawer{ position:sticky!important; top:84px!important; left:auto!important;right:auto!important;bottom:auto!important; max-height:calc(100vh - 180px)!important; display:flex!important; flex-direction:column; padding:22px 20px!important; border-radius:18px!important; border:1px solid var(--scp-border)!important; box-shadow:0 14px 40px rgba(15,23,42,.06)!important; background:#fff!important; min-height:0; overflow:auto!important; transform:none!important; pointer-events:auto!important; } #strong-configurator-preview.scp-shell--studio.is-drawer-collapsed .scp-drawer{ display:flex!important;transform:none!important;pointer-events:auto!important; } #strong-configurator-preview.scp-shell--studio .scp-drawer-backdrop, #strong-configurator-preview.scp-shell--studio .scp-reopen-drawer, #strong-configurator-preview.scp-shell--studio #scp-drawer-close{display:none!important} #strong-configurator-preview.scp-shell--studio .scp-drawer-head{ display:flex;align-items:flex-start;justify-content:space-between;gap:12px; margin-bottom:12px!important;position:static!important;padding:0!important;border:0!important;background:transparent!important; } #strong-configurator-preview.scp-shell--studio .scp-drawer-head__main{display:flex;gap:12px;align-items:flex-start;min-width:0} #strong-configurator-preview.scp-shell--studio .scp-step-badge{ width:38px;height:38px;border-radius:50%;flex:0 0 auto; display:inline-flex;align-items:center;justify-content:center; background:var(--scp-accent);color:#fff;font-weight:800;font-size:15px; } #strong-configurator-preview.scp-shell--studio .scp-drawer-head__meta{display:flex;align-items:center;gap:10px;margin-bottom:3px} #strong-configurator-preview.scp-shell--studio .scp-kicker{font-size:11px;font-weight:600;color:#9ca3af;letter-spacing:.02em} #strong-configurator-preview.scp-shell--studio .scp-step-progress{ display:inline-block;width:64px;height:3px;border-radius:999px;background:#eceff2;overflow:hidden; } #strong-configurator-preview.scp-shell--studio .scp-step-progress>span{ display:block;height:100%;background:var(--scp-accent);border-radius:999px; } #strong-configurator-preview.scp-shell--studio .scp-drawer-head h2{ font-size:22px!important;margin:0!important;letter-spacing:-.02em;font-weight:700;color:var(--scp-ink); } #strong-configurator-preview.scp-shell--studio .scp-drawer-head p{ max-width:none!important;font-size:13px!important;color:#6b7280!important;margin-top:6px!important;line-height:1.45; } #strong-configurator-preview.scp-shell--studio .scp-drawer-tip{ display:flex;gap:12px;align-items:flex-start; margin:0 0 14px;padding:13px 14px; border-radius:12px;background:#eaf4ff;color:#1e3a5f; border:1px solid #d3e7fb; } #strong-configurator-preview.scp-shell--studio .scp-drawer-tip[hidden]{display:none!important} #strong-configurator-preview.scp-shell--studio .scp-drawer-tip__icon{ width:28px;height:28px;border-radius:50%;background:#fff;color:#3b82c4; display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto; box-shadow:0 1px 4px rgba(40,80,120,.08); } #strong-configurator-preview.scp-shell--studio .scp-drawer-tip__icon svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2} #strong-configurator-preview.scp-shell--studio .scp-drawer-tip p{margin:0;font-size:12.5px;line-height:1.45} /* Compact back control */ #strong-configurator-preview.scp-shell--studio .scp-drawer-back-wrap{margin:0 0 12px!important} #strong-configurator-preview.scp-shell--studio .scp-back-btn{ width:auto!important; max-width:100%; border:0!important; background:transparent!important; color:#4b5563!important; border-radius:8px!important; padding:6px 2px!important; font-size:13px!important; font-weight:600!important; display:inline-flex!important; align-items:center; justify-content:flex-start!important; gap:6px!important; box-shadow:none!important; } #strong-configurator-preview.scp-shell--studio .scp-back-btn:hover{color:var(--scp-accent)!important;background:transparent!important} #strong-configurator-preview.scp-shell--studio .scp-back-btn svg{width:16px;height:16px} /* Options grids */ #strong-configurator-preview.scp-shell--studio .scp-options{ grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:12px!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-textual, #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options{ grid-template-columns:repeat(2,minmax(0,1fr))!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-options, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options{ grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:10px!important; } #strong-configurator-preview.scp-shell--studio .scp-option{ border-radius:14px!important; border:1.5px solid #e8eaec!important; background:#fff!important; padding:12px!important; box-shadow:0 3px 12px rgba(15,23,42,.045)!important; transform:none!important; min-width:0; } #strong-configurator-preview.scp-shell--studio .scp-option:hover{ border-color:#d1d5db!important; background:#fff!important; transform:none!important; } #strong-configurator-preview.scp-shell--studio .scp-option.is-selected{ border-color:var(--scp-accent)!important; box-shadow:0 0 0 1px var(--scp-accent),0 3px 12px rgba(15,23,42,.045)!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-textual .scp-option{ min-height:96px!important; display:flex!important; flex-direction:column!important; justify-content:center!important; align-items:stretch!important; padding:16px 16px 14px!important; text-align:center; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-price{ order:-1; margin:0 0 8px!important; text-align:left!important; font-size:13px!important; font-weight:700!important; color:var(--scp-accent)!important; } #strong-configurator-preview.scp-shell--studio .scp-option-label{ font-size:15px!important;font-weight:700!important;color:var(--scp-ink)!important; text-align:center;padding-right:0!important;line-height:1.25; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-label{ font-size:17px!important;letter-spacing:-.01em; } #strong-configurator-preview.scp-shell--studio .scp-option-price{ display:block!important; margin-top:8px!important; font-size:12px!important; font-weight:700!important; color:var(--scp-accent)!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-options .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option{ padding:8px!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-options .scp-option-image, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option-image{ aspect-ratio:1/1!important; border-radius:10px!important; margin-bottom:8px!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-options .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option-label{ font-size:11px!important;font-weight:600!important;text-align:left;line-height:1.3; } #strong-configurator-preview.scp-shell--studio .scp-options.is-textual .scp-option-check, #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-check{ top:10px!important;right:10px!important;transform:none!important; } /* ---- Sticky footer ---- */ #strong-configurator-preview.scp-shell--studio .scp-footerbar{ position:fixed!important; left:0;right:0;bottom:0; z-index:55; margin:0;padding:0; background:rgba(255,255,255,.96); backdrop-filter:blur(10px); border-top:1px solid var(--scp-border); box-shadow:0 -10px 30px rgba(15,23,42,.06); } #strong-configurator-preview.scp-shell--studio .scp-footerbar .scp-price-card{ max-width:1680px; margin:0 auto!important; display:flex!important; align-items:center; justify-content:space-between; gap:20px; padding:12px clamp(16px,2.2vw,28px)!important; border:0!important;border-radius:0!important; background:transparent!important;box-shadow:none!important; position:relative!important; left:auto!important;right:auto!important;bottom:auto!important;top:auto!important; width:100%; } #strong-configurator-preview.scp-shell--studio .scp-price-row{ margin:0!important;display:block!important;flex:0 1 auto;min-width:0; } #strong-configurator-preview.scp-shell--studio .scp-price-row span{font-size:12px;color:var(--scp-muted);font-weight:600} #strong-configurator-preview.scp-shell--studio .scp-price-row small{display:block!important;font-size:11px;color:#9ca3af;margin-top:2px} #strong-configurator-preview.scp-shell--studio .scp-price-row strong{ font-size:28px!important;display:block;margin-top:2px;font-weight:800;letter-spacing:-.03em;color:var(--scp-ink); } #strong-configurator-preview.scp-shell--studio .scp-primary-btn{ display:inline-flex!important; align-items:center;justify-content:center;gap:10px; flex:0 1 420px; min-width:240px; max-width:480px; width:auto!important; border:0;border-radius:12px; padding:15px 22px; background:var(--scp-accent);color:#fff; font-size:15px;font-weight:700;cursor:pointer;white-space:nowrap; box-shadow:0 10px 24px rgba(255,106,0,.26); } #strong-configurator-preview.scp-shell--studio .scp-primary-btn:hover{background:var(--scp-accent-strong)} #strong-configurator-preview.scp-shell--studio .scp-primary-btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none} #strong-configurator-preview.scp-shell--studio .scp-primary-btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8} #strong-configurator-preview.scp-shell--studio .scp-powered, #strong-configurator-preview.scp-shell--studio .scp-pdf-btn, #strong-configurator-preview.scp-shell--studio .scp-secondary-btn{display:none!important} @media(max-width:1280px){ #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-options, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options{ grid-template-columns:repeat(2,minmax(0,1fr))!important; } } @media(max-width:1150px){ #strong-configurator-preview.scp-shell--studio .scp-topbar{ grid-template-columns:1fr auto;gap:10px; } #strong-configurator-preview.scp-shell--studio .scp-stage-list{grid-column:1/-1;order:3;justify-content:flex-start} #strong-configurator-preview.scp-shell--studio .scp-stage{flex:0 0 auto;min-width:72px} #strong-configurator-preview.scp-shell--studio .scp-configurator{ grid-template-columns:1fr!important; } #strong-configurator-preview.scp-shell--studio .scp-drawer{ position:relative!important;top:auto!important;max-height:none!important; } #strong-configurator-preview.scp-shell--studio .scp-visual-card{ max-height:none;aspect-ratio:1.15/1!important; } #strong-configurator-preview.scp-shell--studio .scp-benefits--under-gallery{ grid-template-columns:repeat(2,minmax(0,1fr))!important; } } @media(max-width:780px){ #strong-configurator-preview.scp-shell--studio{ padding:0 0 calc(88px + env(safe-area-inset-bottom))!important; } #strong-configurator-preview.scp-shell--studio .scp-topbar{padding:10px 12px} #strong-configurator-preview.scp-shell--studio .scp-help__copy{display:none} #strong-configurator-preview.scp-shell--studio .scp-configurator{ display:flex!important;flex-direction:column!important; padding:0 10px;margin-top:12px!important;gap:12px!important; } #strong-configurator-preview.scp-shell--studio .scp-visual-card{aspect-ratio:1/1!important;border-radius:14px!important} #strong-configurator-preview.scp-shell--studio .scp-fullscreen-btn span{display:none} #strong-configurator-preview.scp-shell--studio .scp-benefits--under-gallery{ display:grid!important;order:3; } #strong-configurator-preview.scp-shell--studio .scp-drawer{ order:2;padding:16px 14px!important;border-radius:14px!important; position:relative!important;left:auto!important;right:auto!important;bottom:auto!important; max-height:none!important;overflow:visible!important; } #strong-configurator-preview.scp-shell--studio .scp-drawer-backdrop{display:none!important} #strong-configurator-preview.scp-shell--studio .scp-drawer-head h2{font-size:19px!important} #strong-configurator-preview.scp-shell--studio .scp-options, #strong-configurator-preview.scp-shell--studio .scp-options.is-textual, #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-options, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options{ grid-template-columns:1fr 1fr!important; } #strong-configurator-preview.scp-shell--studio .scp-footerbar{padding-bottom:env(safe-area-inset-bottom)} #strong-configurator-preview.scp-shell--studio .scp-footerbar .scp-price-card{padding:10px 12px!important;gap:10px} #strong-configurator-preview.scp-shell--studio .scp-price-row strong{font-size:20px!important} #strong-configurator-preview.scp-shell--studio .scp-price-row small{display:none!important} #strong-configurator-preview.scp-shell--studio .scp-primary-btn{ flex:1 1 auto;min-width:0;max-width:none;padding:13px 14px;font-size:13px; } } /* ========== Studio polish v0.6.25 ========== */ html.strong-preview-html, body.strong-preview-body{ height:100%!important; overflow:hidden!important; overscroll-behavior:none!important; } body.strong-preview-body .woosc-popup, body.strong-preview-body .woosc-bar, body.strong-preview-body .woosc-area, body.strong-preview-body .cky-btn-revisit-wrapper, body.strong-preview-body .cky-consent-container, body.strong-preview-body .cky-overlay, body.strong-preview-body .cky-modal, body.strong-preview-body #ckyBannerTemplate{ display:none!important; visibility:hidden!important; pointer-events:none!important; opacity:0!important; } #strong-configurator-preview.scp-shell--studio{ height:100vh!important; height:100dvh!important; max-height:100vh!important; max-height:100dvh!important; overflow:hidden!important; padding:0!important; display:flex!important; flex-direction:column!important; } #strong-configurator-preview.scp-shell--studio .scp-topbar{ grid-template-columns:150px minmax(0,1fr) 200px; padding:8px clamp(14px,2vw,24px); flex:0 0 auto; } #strong-configurator-preview.scp-shell--studio .scp-brand{ display:inline-flex;align-items:center;max-width:150px; } #strong-configurator-preview.scp-shell--studio .scp-brand__logo{ display:block;width:auto;height:42px;max-width:140px;object-fit:contain; } #strong-configurator-preview.scp-shell--studio .scp-help__icon{ width:36px;height:36px;border-radius:50%; border:1px solid var(--scp-border); display:inline-flex;align-items:center;justify-content:center; background:#fff;color:var(--scp-accent); } #strong-configurator-preview.scp-shell--studio .scp-help__icon svg{ width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8; } #strong-configurator-preview.scp-shell--studio .scp-help__copy small{ font-size:12px;color:var(--scp-accent);font-weight:700;letter-spacing:.01em; } /* Step icons */ #strong-configurator-preview.scp-shell--studio .scp-stage{ min-width:58px;max-width:88px;padding:6px 4px!important;gap:4px!important; } #strong-configurator-preview.scp-shell--studio .scp-stage-number{display:none!important} #strong-configurator-preview.scp-shell--studio .scp-stage-icon{ width:30px;height:30px;border-radius:50%; display:inline-flex;align-items:center;justify-content:center; background:#eef0f2;color:#4b5563; } #strong-configurator-preview.scp-shell--studio .scp-stage-icon svg{ width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.8; } #strong-configurator-preview.scp-shell--studio .scp-stage.is-active .scp-stage-icon, #strong-configurator-preview.scp-shell--studio .scp-stage.is-complete .scp-stage-icon{ background:var(--scp-accent);color:#fff; } #strong-configurator-preview.scp-shell--studio .scp-stage.is-complete:not(.is-active) .scp-stage-icon{ background:#16a34a;color:#fff; } #strong-configurator-preview.scp-shell--studio .scp-stage-title{font-size:9px!important} /* Lock page scroll; only options panel scrolls */ #strong-configurator-preview.scp-shell--studio .scp-configurator{ flex:1 1 auto!important; min-height:0!important; margin:12px auto 0!important; padding:0 clamp(14px,2vw,24px)!important; overflow:hidden!important; align-items:stretch!important; padding-bottom:0!important; } #strong-configurator-preview.scp-shell--studio .scp-visual-column{ min-height:0;overflow:hidden; display:flex;flex-direction:column;gap:10px; } #strong-configurator-preview.scp-shell--studio .scp-visual-card{ flex:1 1 auto; min-height:0; aspect-ratio:auto!important; max-height:none; } #strong-configurator-preview.scp-shell--studio .scp-gallery{flex:0 0 auto} #strong-configurator-preview.scp-shell--studio .scp-benefits--under-gallery{flex:0 0 auto} #strong-configurator-preview.scp-shell--studio .scp-drawer{ position:relative!important; top:auto!important; height:100%!important; max-height:none!important; min-height:0!important; overflow:hidden!important; display:flex!important; flex-direction:column!important; padding:16px 16px 12px!important; } #strong-configurator-preview.scp-shell--studio .scp-drawer-head, #strong-configurator-preview.scp-shell--studio .scp-drawer-tip, #strong-configurator-preview.scp-shell--studio .scp-drawer-back-wrap, #strong-configurator-preview.scp-shell--studio .scp-show-more-wrap, #strong-configurator-preview.scp-shell--studio .scp-debug{ flex:0 0 auto; } #strong-configurator-preview.scp-shell--studio .scp-options{ flex:1 1 auto; min-height:0; overflow:auto!important; align-content:start; padding-right:4px; scrollbar-width:thin; } #strong-configurator-preview.scp-shell--studio .scp-drawer-head h2{font-size:18px!important} #strong-configurator-preview.scp-shell--studio .scp-drawer-head p{font-size:12px!important} #strong-configurator-preview.scp-shell--studio .scp-step-badge{width:32px;height:32px;font-size:13px} /* Compact centered option cards: title then price */ #strong-configurator-preview.scp-shell--studio .scp-option{ min-height:0!important; padding:12px 10px!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-textual .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option{ min-height:72px!important; display:flex!important; flex-direction:column!important; justify-content:center!important; align-items:center!important; text-align:center!important; padding:14px 12px!important; } #strong-configurator-preview.scp-shell--studio .scp-option-label{ font-size:12px!important; font-weight:600!important; text-align:center!important; line-height:1.3!important; padding-right:0!important; color:var(--scp-ink)!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-label{ font-size:13px!important;font-weight:700!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option-label{ font-size:12px!important;font-weight:600!important;text-align:center!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-options .scp-option-label{ font-size:11px!important;font-weight:600!important;text-align:center!important; } #strong-configurator-preview.scp-shell--studio .scp-option-price{ margin-top:6px!important; text-align:center!important; font-size:11px!important; font-weight:700!important; color:var(--scp-accent)!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-price{ order:0!important; margin-top:6px!important; text-align:center!important; font-size:11px!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option-image{ display:none!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-options .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option-label{ text-align:center!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-textual .scp-option-check, #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-check, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option-check{ top:8px!important;right:8px!important;transform:none!important; width:18px;height:18px; } #strong-configurator-preview.scp-shell--studio .scp-footerbar{ position:relative!important; flex:0 0 auto; box-shadow:0 -8px 24px rgba(15,23,42,.05); } #strong-configurator-preview.scp-shell--studio .scp-footerbar .scp-price-card{ padding:10px clamp(14px,2vw,24px)!important; } #strong-configurator-preview.scp-shell--studio .scp-price-row strong{font-size:24px!important} #strong-configurator-preview.scp-shell--studio .scp-primary-btn{ flex:0 1 380px;padding:13px 18px;font-size:14px; } @media(max-width:1150px){ html.strong-preview-html, body.strong-preview-body{ height:auto!important; overflow:auto!important; } #strong-configurator-preview.scp-shell--studio{ height:auto!important; max-height:none!important; overflow:visible!important; padding-bottom:calc(88px + env(safe-area-inset-bottom))!important; } #strong-configurator-preview.scp-shell--studio .scp-configurator{ overflow:visible!important; height:auto!important; } #strong-configurator-preview.scp-shell--studio .scp-drawer{ height:auto!important; overflow:visible!important; } #strong-configurator-preview.scp-shell--studio .scp-options{ overflow:visible!important; } #strong-configurator-preview.scp-shell--studio .scp-footerbar{ position:fixed!important; } #strong-configurator-preview.scp-shell--studio .scp-visual-card{ aspect-ratio:1.1/1!important; max-height:52vh; } } /* ========== Fix clipped option titles/prices v0.6.26 ========== */ #strong-configurator-preview.scp-shell--studio .scp-options{ align-items:start!important; align-content:start!important; grid-auto-rows:auto!important; overflow-x:hidden!important; overflow-y:auto!important; padding-bottom:28px!important; -webkit-overflow-scrolling:touch; } #strong-configurator-preview.scp-shell--studio .scp-option{ height:auto!important; min-height:auto!important; max-height:none!important; overflow:visible!important; align-self:start!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:flex-start!important; padding:10px!important; } #strong-configurator-preview.scp-shell--studio .scp-option img, #strong-configurator-preview.scp-shell--studio .scp-option-image{ flex:0 0 auto!important; width:100%!important; height:auto!important; max-height:none!important; display:block!important; margin:0 0 8px!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options{ grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:12px!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option{ padding:10px 10px 12px!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option-image{ aspect-ratio:1.55/1!important; object-fit:contain!important; background:#fff!important; border:1px solid #f0f0f0!important; border-radius:8px!important; padding:6px!important; margin-bottom:8px!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-options .scp-option-image{ aspect-ratio:1/1!important; object-fit:cover!important; margin-bottom:8px!important; } #strong-configurator-preview.scp-shell--studio .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-option-meta, #strong-configurator-preview.scp-shell--studio .scp-option-price{ flex:0 0 auto!important; position:static!important; overflow:visible!important; white-space:normal!important; text-overflow:unset!important; max-height:none!important; width:100%!important; text-align:center!important; display:block!important; } #strong-configurator-preview.scp-shell--studio .scp-option-label{ font-size:12px!important; font-weight:600!important; line-height:1.35!important; margin:0!important; padding:0!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option-label{ font-size:12px!important; font-weight:700!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-options .scp-option-label{ font-size:11px!important; text-align:center!important; } #strong-configurator-preview.scp-shell--studio .scp-option-price{ margin-top:4px!important; font-size:11px!important; font-weight:700!important; color:var(--scp-accent)!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-price, #strong-configurator-preview.scp-shell--studio .scp-options.is-textual .scp-option-price{ order:0!important; margin-top:6px!important; text-align:center!important; } /* Keep page locked; only options list scrolls */ html.strong-preview-html, body.strong-preview-body{ height:100%!important; overflow:hidden!important; } #strong-configurator-preview.scp-shell--studio{ height:100vh!important; height:100dvh!important; overflow:hidden!important; } #strong-configurator-preview.scp-shell--studio .scp-drawer{ overflow:hidden!important; } #strong-configurator-preview.scp-shell--studio .scp-visual-column, #strong-configurator-preview.scp-shell--studio .scp-configurator{ overflow:hidden!important; } /* ========== None-option icon + hide tips v0.6.27 ========== */ #strong-configurator-preview.scp-shell--studio .scp-drawer-tip, #strong-configurator-preview .scp-drawer-tip{ display:none!important; } #strong-configurator-preview.scp-shell--studio .scp-option.is-none-option .scp-option-image.is-none-image, #strong-configurator-preview .scp-option.is-none-option .scp-option-image.is-none-image{ aspect-ratio:1/1!important; object-fit:contain!important; object-position:center!important; background:#f7f7f7!important; border:1px solid #eceeef!important; border-radius:10px!important; padding:18%!important; margin-bottom:8px!important; } #strong-configurator-preview.scp-shell--studio .scp-option.is-none-option .scp-option-label{ text-align:center!important; font-size:12px!important; font-weight:600!important; } /* ========== Equal option cards v0.6.28 ========== */ #strong-configurator-preview.scp-shell--studio .scp-option-meta, #strong-configurator-preview.scp-shell--studio .scp-option-description, #strong-configurator-preview .scp-option-meta, #strong-configurator-preview .scp-option-description{ display:none!important; } #strong-configurator-preview.scp-shell--studio .scp-options{ align-items:stretch!important; align-content:start!important; grid-auto-rows:auto!important; } #strong-configurator-preview.scp-shell--studio .scp-option{ height:100%!important; min-height:0!important; max-height:none!important; overflow:hidden!important; display:flex!important; flex-direction:column!important; align-items:stretch!important; justify-content:flex-start!important; padding:10px!important; align-self:stretch!important; } #strong-configurator-preview.scp-shell--studio .scp-option img, #strong-configurator-preview.scp-shell--studio .scp-option-image{ flex:0 0 auto!important; width:100%!important; margin:0 0 8px!important; } #strong-configurator-preview.scp-shell--studio .scp-option-body{ flex:1 1 auto; min-height:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; width:100%; text-align:center; } #strong-configurator-preview.scp-shell--studio .scp-option-label{ flex:1 1 auto!important; width:100%!important; min-height:2.6em!important; display:flex!important; align-items:center!important; justify-content:center!important; text-align:center!important; font-size:12px!important; font-weight:600!important; line-height:1.3!important; margin:0!important; padding:0 4px!important; overflow:hidden!important; } #strong-configurator-preview.scp-shell--studio .scp-option-price{ flex:0 0 auto!important; margin-top:auto!important; min-height:1.25em!important; width:100%!important; text-align:center!important; font-size:11px!important; font-weight:700!important; color:var(--scp-accent)!important; padding-top:6px!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-textual .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-parent-options .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option{ min-height:88px!important; padding:14px 12px!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-parent-options .scp-option-image, #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-parent-options .is-none-image{ display:none!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-options, #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options{ grid-auto-rows:auto!important; align-items:stretch!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-options .scp-option-image{ aspect-ratio:1/1!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option-image{ aspect-ratio:1.5/1!important; object-fit:contain!important; } /* ========== HOTFIX equal readable cards v0.6.29 ========== */ #strong-configurator-preview.scp-shell--studio .scp-options{ align-items:stretch!important; align-content:start!important; grid-auto-rows:auto!important; } #strong-configurator-preview.scp-shell--studio .scp-option{ height:auto!important; min-height:0!important; max-height:none!important; overflow:visible!important; display:flex!important; flex-direction:column!important; align-items:stretch!important; align-self:stretch!important; padding:10px!important; box-sizing:border-box!important; } #strong-configurator-preview.scp-shell--studio .scp-option img, #strong-configurator-preview.scp-shell--studio .scp-option-image{ flex:0 0 auto!important; width:100%!important; height:auto!important; max-height:none!important; min-height:0!important; margin:0 0 8px!important; display:block!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-options .scp-option-image{ aspect-ratio:1/1!important; object-fit:cover!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option-image{ aspect-ratio:1.45/1!important; object-fit:contain!important; background:#fff!important; } #strong-configurator-preview.scp-shell--studio .scp-option.is-none-option .scp-option-image.is-none-image{ aspect-ratio:1/1!important; object-fit:contain!important; object-position:center!important; background:#f6f6f6!important; padding:22%!important; border:1px solid #eceeef!important; border-radius:10px!important; } #strong-configurator-preview.scp-shell--studio .scp-option-body{ flex:1 1 auto!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:flex-start!important; width:100%!important; min-height:3.4em!important; overflow:visible!important; } #strong-configurator-preview.scp-shell--studio .scp-option-label{ flex:1 1 auto!important; width:100%!important; min-height:2.5em!important; max-height:none!important; overflow:visible!important; display:flex!important; align-items:center!important; justify-content:center!important; text-align:center!important; white-space:normal!important; font-size:12px!important; font-weight:600!important; line-height:1.3!important; color:#1e2227!important; margin:0!important; padding:0 2px!important; } #strong-configurator-preview.scp-shell--studio .scp-option-price{ flex:0 0 auto!important; margin-top:auto!important; width:100%!important; min-height:1.2em!important; overflow:visible!important; text-align:center!important; font-size:11px!important; font-weight:700!important; color:var(--scp-accent)!important; padding-top:4px!important; } #strong-configurator-preview.scp-shell--studio .scp-option-meta, #strong-configurator-preview.scp-shell--studio .scp-option-description{ display:none!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-textual .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-parent-options .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option{ min-height:92px!important; } /* ========== CRITICAL fix min-height collapse v0.6.30 ========== */ #strong-configurator-preview.scp-shell--studio .scp-option{ min-height:auto!important; height:auto!important; max-height:none!important; overflow:visible!important; align-self:stretch!important; } #strong-configurator-preview.scp-shell--studio .scp-options{ align-items:stretch!important; grid-auto-rows:max-content!important; } #strong-configurator-preview.scp-shell--studio .scp-option-image, #strong-configurator-preview.scp-shell--studio .scp-option img{ flex:0 0 auto!important; min-height:auto!important; height:auto!important; } #strong-configurator-preview.scp-shell--studio .scp-option-body, #strong-configurator-preview.scp-shell--studio .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-option-price{ overflow:visible!important; min-height:auto!important; } #strong-configurator-preview.scp-shell--studio .scp-option-label{ min-height:2.5em!important; } #strong-configurator-preview.scp-shell--studio .scp-option-body{ min-height:3.4em!important; } #strong-configurator-preview.scp-shell--studio .scp-option-price{ margin-top:auto!important; } /* ========== Equal boxes FINAL v0.6.31 ========== */ #strong-configurator-preview.scp-shell--studio .scp-brand{ flex-shrink:0!important; min-width:120px!important; max-width:160px!important; } #strong-configurator-preview.scp-shell--studio .scp-brand__logo{ display:block!important; height:44px!important; width:auto!important; max-width:150px!important; object-fit:contain!important; opacity:1!important; visibility:visible!important; } #strong-configurator-preview.scp-shell--studio .scp-options{ align-items:stretch!important; align-content:start!important; grid-auto-rows:auto!important; } #strong-configurator-preview.scp-shell--studio .scp-option{ display:flex!important; flex-direction:column!important; align-items:stretch!important; align-self:stretch!important; height:auto!important; min-height:auto!important; max-height:none!important; overflow:visible!important; padding:10px!important; box-sizing:border-box!important; } #strong-configurator-preview.scp-shell--studio .scp-option-media{ flex:0 0 auto!important; width:100%!important; aspect-ratio:1/1!important; border-radius:10px!important; background:#f5f6f7!important; border:1px solid #eceeef!important; overflow:hidden!important; display:flex!important; align-items:center!important; justify-content:center!important; margin:0 0 8px!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option-media{ aspect-ratio:1.45/1!important; } #strong-configurator-preview.scp-shell--studio .scp-option-media img, #strong-configurator-preview.scp-shell--studio .scp-option-media .scp-option-image{ width:100%!important; height:100%!important; max-width:100%!important; max-height:100%!important; object-fit:contain!important; object-position:center!important; display:block!important; margin:0!important; padding:0!important; border:0!important; background:transparent!important; aspect-ratio:auto!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-options .scp-option-media img{ object-fit:cover!important; } #strong-configurator-preview.scp-shell--studio .scp-option.is-none-option .scp-option-media img, #strong-configurator-preview.scp-shell--studio .scp-option-media .is-none-image{ width:62%!important; height:62%!important; object-fit:contain!important; padding:0!important; } #strong-configurator-preview.scp-shell--studio .scp-option-body{ flex:0 0 auto!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:flex-start!important; width:100%!important; min-height:calc(2.6em + 1.35em + 6px)!important; overflow:visible!important; } #strong-configurator-preview.scp-shell--studio .scp-option-label{ flex:0 0 auto!important; width:100%!important; height:2.6em!important; min-height:2.6em!important; max-height:2.6em!important; display:flex!important; align-items:center!important; justify-content:center!important; text-align:center!important; font-size:11px!important; font-weight:600!important; line-height:1.3!important; color:#1e2227!important; overflow:hidden!important; margin:0!important; padding:0 2px!important; } #strong-configurator-preview.scp-shell--studio .scp-option-price{ flex:0 0 auto!important; width:100%!important; height:1.35em!important; min-height:1.35em!important; margin:6px 0 0!important; padding:0!important; display:flex!important; align-items:center!important; justify-content:center!important; text-align:center!important; font-size:11px!important; font-weight:700!important; color:var(--scp-accent)!important; line-height:1.2!important; } #strong-configurator-preview.scp-shell--studio .scp-option-price.is-empty{ visibility:hidden!important; } /* Text-only steps: still fixed title+price slots */ #strong-configurator-preview.scp-shell--studio .scp-options.is-textual .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-parent-options .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option{ min-height:96px!important; justify-content:center!important; padding:12px 10px!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-parent-options .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-options.is-textual .scp-option-label{ font-size:12px!important; } #strong-configurator-preview.scp-shell--studio .scp-drawer-head h2{ font-size:18px!important; } #strong-configurator-preview.scp-shell--studio .scp-option-meta, #strong-configurator-preview.scp-shell--studio .scp-option-description{ display:none!important; } html.strong-preview-html, body.strong-preview-body{ height:100%!important; overflow:hidden!important; } #strong-configurator-preview.scp-shell--studio{ height:100vh!important; height:100dvh!important; overflow:hidden!important; } /* ========== Pixel-equal cards v0.6.32 ========== */ /* Staly border 2px � zaznaczenie nie przesuwa tresci o 1-2px */ #strong-configurator-preview.scp-shell--studio .scp-option{ border:2px solid #e8eaec!important; box-shadow:0 3px 12px rgba(15,23,42,.045)!important; } #strong-configurator-preview.scp-shell--studio .scp-option:hover, #strong-configurator-preview.scp-shell--studio .scp-option.is-selected{ border-width:2px!important; box-shadow:0 3px 12px rgba(15,23,42,.045)!important; } #strong-configurator-preview.scp-shell--studio .scp-option.is-selected{ border-color:var(--scp-accent)!important; } /* Tytul + cena w stalych slotach � ta sama linia w calym rzedzie */ #strong-configurator-preview.scp-shell--studio .scp-option-body{ position:relative!important; display:block!important; width:100%!important; height:calc(2.6em + 1.35em + 6px)!important; min-height:calc(2.6em + 1.35em + 6px)!important; max-height:calc(2.6em + 1.35em + 6px)!important; overflow:hidden!important; } #strong-configurator-preview.scp-shell--studio .scp-option-label{ position:absolute!important; left:0!important; right:0!important; top:0!important; height:2.6em!important; order:0!important; } #strong-configurator-preview.scp-shell--studio .scp-option-price, #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-price{ position:absolute!important; left:0!important; right:0!important; top:calc(2.6em + 6px)!important; height:1.35em!important; margin:0!important; order:0!important; } /* ========== Center titles in box v0.6.33 ========== */ #strong-configurator-preview.scp-shell--studio .scp-option{ text-align:center!important; } #strong-configurator-preview.scp-shell--studio .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-option-price, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-options .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option-label{ text-align:center!important; justify-content:center!important; align-items:center!important; margin-left:auto!important; margin-right:auto!important; } /* Kroki bez cen: naglowek w pionowym i poziomym srodku boksa */ #strong-configurator-preview.scp-shell--studio .scp-options.is-unpriced-options:not(.is-media-options) .scp-option{ justify-content:center!important; align-items:center!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-unpriced-options:not(.is-media-options) .scp-option-body{ position:static!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; height:auto!important; min-height:0!important; max-height:none!important; overflow:visible!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-unpriced-options:not(.is-media-options) .scp-option-label{ position:static!important; left:auto!important; right:auto!important; top:auto!important; height:auto!important; min-height:0!important; max-height:none!important; width:100%!important; } /* Media bez cen: tytul pod zdjeciem, wycentrowany, bez pustego slotu ceny */ #strong-configurator-preview.scp-shell--studio .scp-options.is-unpriced-options.is-media-options .scp-option-body{ position:static!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; height:auto!important; min-height:2.6em!important; max-height:none!important; overflow:visible!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-unpriced-options.is-media-options .scp-option-label{ position:static!important; left:auto!important; right:auto!important; top:auto!important; height:auto!important; min-height:2.6em!important; max-height:none!important; width:100%!important; display:flex!important; } /* Media z cenami: nadal stale sloty, ale tytul zawsze na srodku */ #strong-configurator-preview.scp-shell--studio .scp-options.is-priced-options.is-media-options .scp-option-label{ display:flex!important; width:100%!important; } /* ========== Legs: hide baked-in image captions + tighter title center v0.6.34 ========== */ #strong-configurator-preview.scp-shell--studio .scp-options.is-legs-options .scp-option-media{ overflow:hidden!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-legs-options .scp-option-media img, #strong-configurator-preview.scp-shell--studio .scp-options.is-legs-options .scp-option-media .scp-option-image{ object-fit:cover!important; object-position:center 58%!important; width:130%!important; height:130%!important; max-width:none!important; max-height:none!important; transform:translateY(6%)!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-legs-options .scp-option.is-none-option .scp-option-media img{ width:62%!important; height:62%!important; max-width:62%!important; max-height:62%!important; object-fit:contain!important; transform:none!important; object-position:center!important; } /* Naglowki zawsze na srodku (poziom + blok) */ #strong-configurator-preview.scp-shell--studio .scp-option .scp-option-body, #strong-configurator-preview.scp-shell--studio .scp-option .scp-option-label{ text-align:center!important; margin-left:auto!important; margin-right:auto!important; } #strong-configurator-preview.scp-shell--studio .scp-option .scp-option-label{ display:flex!important; justify-content:center!important; align-items:center!important; width:100%!important; max-width:100%!important; box-sizing:border-box!important; } /* ========== Legs: mask baked-in captions v0.6.35 ========== */ #strong-configurator-preview.scp-shell--studio .scp-options.is-legs-options .scp-option:not(.is-none-option) .scp-option-media{ position:relative!important; background:#fff!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-legs-options .scp-option:not(.is-none-option) .scp-option-media::before, #strong-configurator-preview.scp-shell--studio .scp-options.is-legs-options .scp-option:not(.is-none-option) .scp-option-media::after{ content:''!important; position:absolute!important; left:0!important; right:0!important; height:24%!important; background:#fff!important; z-index:2!important; pointer-events:none!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-legs-options .scp-option:not(.is-none-option) .scp-option-media::before{top:0!important;} #strong-configurator-preview.scp-shell--studio .scp-options.is-legs-options .scp-option:not(.is-none-option) .scp-option-media::after{bottom:0!important;} #strong-configurator-preview.scp-shell--studio .scp-options.is-legs-options .scp-option:not(.is-none-option) .scp-option-media img{ object-fit:contain!important; object-position:center center!important; width:88%!important; height:88%!important; max-width:88%!important; max-height:88%!important; transform:none!important; } /* Tkaniny glowne: wymus srodek w calym boxie */ #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option{ display:flex!important; flex-direction:column!important; justify-content:center!important; align-items:center!important; text-align:center!important; padding:18px 12px!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option-body, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option-label{ position:static!important; inset:auto!important; height:auto!important; min-height:0!important; max-height:none!important; width:100%!important; display:flex!important; align-items:center!important; justify-content:center!important; text-align:center!important; margin:0!important; padding:0!important; } /* ========== Title + price centering v0.6.36 ========== */ /* Wymiary / tekstowe z cena: grupa tytul+cena w srodku boksa, maly odstep */ #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-priced-options:not(.is-media-options) .scp-option{ display:flex!important; flex-direction:column!important; justify-content:center!important; align-items:center!important; text-align:center!important; min-height:96px!important; padding:16px 12px!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-body, #strong-configurator-preview.scp-shell--studio .scp-options.is-priced-options:not(.is-media-options) .scp-option-body{ position:static!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; gap:8px!important; width:100%!important; height:auto!important; min-height:0!important; max-height:none!important; overflow:visible!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-price, #strong-configurator-preview.scp-shell--studio .scp-options.is-priced-options:not(.is-media-options) .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-options.is-priced-options:not(.is-media-options) .scp-option-price{ position:static!important; left:auto!important; right:auto!important; top:auto!important; height:auto!important; min-height:0!important; max-height:none!important; margin:0!important; order:0!important; width:100%!important; display:flex!important; align-items:center!important; justify-content:center!important; text-align:center!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-label{ font-size:14px!important; font-weight:700!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-price{ font-size:12px!important; font-weight:700!important; color:var(--scp-accent)!important; } /* Media z cena (pojemnik/LED): cena lekko pod tytulem, oba wycentrowane */ #strong-configurator-preview.scp-shell--studio .scp-options.is-priced-options.is-media-options .scp-option-body{ position:static!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:flex-start!important; gap:6px!important; width:100%!important; height:auto!important; min-height:calc(2.6em + 1.35em + 6px)!important; max-height:none!important; overflow:visible!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-priced-options.is-media-options .scp-option-label{ position:static!important; left:auto!important; right:auto!important; top:auto!important; height:auto!important; min-height:2.6em!important; max-height:none!important; margin:0!important; width:100%!important; display:flex!important; align-items:center!important; justify-content:center!important; text-align:center!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-priced-options.is-media-options .scp-option-price{ position:static!important; left:auto!important; right:auto!important; top:auto!important; height:auto!important; min-height:1.35em!important; margin:0!important; width:100%!important; display:flex!important; align-items:center!important; justify-content:center!important; text-align:center!important; } /* ========== MOBILE studio overhaul v0.6.37 ========== */ @media (max-width: 780px) { /* Odblokuj scroll strony — na mobile naturalny stack, nie 100vh lock */ html.strong-preview-html, body.strong-preview-body { height: auto !important; min-height: 100% !important; max-height: none !important; overflow-x: hidden !important; overflow-y: auto !important; overscroll-behavior-y: contain !important; background: #f3f4f6 !important; } #strong-configurator-preview.scp-shell--studio { height: auto !important; min-height: 100dvh !important; max-height: none !important; overflow: visible !important; display: flex !important; flex-direction: column !important; padding: 0 0 calc(76px + env(safe-area-inset-bottom)) !important; } /* Topbar: logo | telefon, pod spodem stepy */ #strong-configurator-preview.scp-shell--studio .scp-topbar { position: sticky !important; top: 0 !important; z-index: 40 !important; display: grid !important; grid-template-columns: 1fr auto !important; grid-template-areas: "brand help" "stages stages" !important; gap: 8px 10px !important; align-items: center !important; padding: 10px 12px 8px !important; background: #fff !important; border-bottom: 1px solid #eceff2 !important; box-shadow: 0 4px 16px rgba(15, 23, 42, 0.04) !important; } #strong-configurator-preview.scp-shell--studio .scp-brand { grid-area: brand !important; min-width: 0 !important; max-width: 140px !important; width: auto !important; } #strong-configurator-preview.scp-shell--studio .scp-brand__logo { height: 34px !important; max-width: 130px !important; width: auto !important; display: block !important; } #strong-configurator-preview.scp-shell--studio .scp-help { grid-area: help !important; display: inline-flex !important; align-items: center !important; justify-content: flex-end !important; gap: 0 !important; min-width: 0 !important; width: auto !important; text-decoration: none !important; } #strong-configurator-preview.scp-shell--studio .scp-help__copy { display: none !important; } #strong-configurator-preview.scp-shell--studio .scp-help__icon { width: 40px !important; height: 40px !important; border-radius: 50% !important; border: 1.5px solid #f3d5c0 !important; background: #fff7f0 !important; color: var(--scp-accent) !important; } #strong-configurator-preview.scp-shell--studio .scp-stage-list { grid-area: stages !important; display: flex !important; flex-wrap: nowrap !important; gap: 6px !important; width: 100% !important; max-width: 100% !important; overflow-x: auto !important; overflow-y: hidden !important; -webkit-overflow-scrolling: touch !important; scrollbar-width: none !important; padding: 2px 0 6px !important; margin: 0 !important; } #strong-configurator-preview.scp-shell--studio .scp-stage-list::-webkit-scrollbar { display: none !important; } #strong-configurator-preview.scp-shell--studio .scp-stage { flex: 0 0 auto !important; min-width: 64px !important; max-width: 78px !important; padding: 6px 4px !important; gap: 4px !important; border-radius: 12px !important; } #strong-configurator-preview.scp-shell--studio .scp-stage-icon { width: 28px !important; height: 28px !important; } #strong-configurator-preview.scp-shell--studio .scp-stage-icon svg { width: 14px !important; height: 14px !important; } #strong-configurator-preview.scp-shell--studio .scp-stage-title { font-size: 9px !important; line-height: 1.15 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; max-width: 70px !important; } /* Stack: galeria -> opcje */ #strong-configurator-preview.scp-shell--studio .scp-configurator { display: flex !important; flex-direction: column !important; flex: 0 0 auto !important; height: auto !important; min-height: 0 !important; margin: 10px 0 0 !important; padding: 0 10px !important; gap: 10px !important; overflow: visible !important; align-items: stretch !important; } #strong-configurator-preview.scp-shell--studio .scp-visual-column { order: 1 !important; height: auto !important; min-height: 0 !important; overflow: visible !important; gap: 8px !important; display: contents !important; } #strong-configurator-preview.scp-shell--studio .scp-visual-card { order: 1 !important; flex: none !important; height: auto !important; min-height: 0 !important; aspect-ratio: 1 / 1 !important; max-height: min(52svh, 420px) !important; border-radius: 14px !important; } #strong-configurator-preview.scp-shell--studio .scp-fullscreen-btn span { display: none !important; } #strong-configurator-preview.scp-shell--studio .scp-gallery { order: 2 !important; position: static !important; left: auto !important; right: auto !important; bottom: auto !important; padding: 0 !important; gap: 6px !important; } #strong-configurator-preview.scp-shell--studio .scp-gallery button { width: 58px !important; height: 46px !important; border-radius: 8px !important; } #strong-configurator-preview.scp-shell--studio .scp-benefits--under-gallery { order: 4 !important; display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 6px 8px !important; padding: 10px !important; margin: 0 !important; border-radius: 12px !important; } #strong-configurator-preview.scp-shell--studio .scp-benefits--under-gallery .scp-benefit { gap: 8px !important; padding: 2px !important; } #strong-configurator-preview.scp-shell--studio .scp-benefits--under-gallery .scp-benefit strong { font-size: 10px !important; } #strong-configurator-preview.scp-shell--studio .scp-benefits--under-gallery .scp-benefit span { font-size: 9px !important; } #strong-configurator-preview.scp-shell--studio .scp-benefits--under-gallery .scp-benefit svg { width: 18px !important; height: 18px !important; } /* Drawer / opcje — naturalna wysokość, scroll strony */ #strong-configurator-preview.scp-shell--studio .scp-drawer { order: 3 !important; position: relative !important; top: auto !important; left: auto !important; right: auto !important; bottom: auto !important; height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; transform: none !important; pointer-events: auto !important; padding: 14px 12px 16px !important; border-radius: 14px !important; box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05) !important; } #strong-configurator-preview.scp-shell--studio .scp-drawer-backdrop, #strong-configurator-preview.scp-shell--studio .scp-reopen-drawer, #strong-configurator-preview.scp-shell--studio #scp-drawer-close { display: none !important; } #strong-configurator-preview.scp-shell--studio .scp-drawer-head { margin-bottom: 10px !important; } #strong-configurator-preview.scp-shell--studio .scp-drawer-head h2 { font-size: 17px !important; line-height: 1.25 !important; } #strong-configurator-preview.scp-shell--studio .scp-drawer-head p { font-size: 12px !important; max-width: none !important; } #strong-configurator-preview.scp-shell--studio .scp-step-badge { width: 30px !important; height: 30px !important; font-size: 12px !important; } #strong-configurator-preview.scp-shell--studio .scp-options { flex: none !important; height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; grid-template-columns: 1fr 1fr !important; gap: 8px !important; padding-right: 0 !important; } /* Karty opcji — zawsze środek */ #strong-configurator-preview.scp-shell--studio .scp-option { min-width: 0 !important; padding: 10px 8px !important; text-align: center !important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-textual .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-fabric-parent-options .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-parent-options .scp-option, #strong-configurator-preview.scp-shell--studio .scp-options.is-priced-options:not(.is-media-options) .scp-option { min-height: 84px !important; display: flex !important; flex-direction: column !important; justify-content: center !important; align-items: center !important; text-align: center !important; padding: 14px 10px !important; } #strong-configurator-preview.scp-shell--studio .scp-option-body, #strong-configurator-preview.scp-shell--studio .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-option-price { text-align: center !important; justify-content: center !important; align-items: center !important; margin-left: auto !important; margin-right: auto !important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-body, #strong-configurator-preview.scp-shell--studio .scp-options.is-priced-options:not(.is-media-options) .scp-option-body { position: static !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 6px !important; height: auto !important; min-height: 0 !important; max-height: none !important; width: 100% !important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-price, #strong-configurator-preview.scp-shell--studio .scp-options.is-priced-options:not(.is-media-options) .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-options.is-priced-options:not(.is-media-options) .scp-option-price { position: static !important; left: auto !important; right: auto !important; top: auto !important; height: auto !important; min-height: 0 !important; margin: 0 !important; width: 100% !important; display: flex !important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-label { font-size: 13px !important; font-weight: 700 !important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-price { font-size: 11px !important; } #strong-configurator-preview.scp-shell--studio .scp-option-label { font-size: 11px !important; } #strong-configurator-preview.scp-shell--studio .scp-option-media { aspect-ratio: 1 / 1 !important; margin-bottom: 6px !important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option-media { aspect-ratio: 1.35 / 1 !important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-priced-options.is-media-options .scp-option-body { position: static !important; display: flex !important; flex-direction: column !important; align-items: center !important; gap: 6px !important; height: auto !important; min-height: 0 !important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-priced-options.is-media-options .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-options.is-priced-options.is-media-options .scp-option-price { position: static !important; top: auto !important; height: auto !important; min-height: 0 !important; margin: 0 !important; } /* Sticky footer */ #strong-configurator-preview.scp-shell--studio .scp-footerbar { position: fixed !important; left: 0 !important; right: 0 !important; bottom: 0 !important; z-index: 50 !important; padding: 0 !important; background: transparent !important; } #strong-configurator-preview.scp-shell--studio .scp-footerbar .scp-price-card { position: relative !important; left: auto !important; right: auto !important; bottom: auto !important; margin: 0 !important; border-radius: 0 !important; border-left: 0 !important; border-right: 0 !important; border-bottom: 0 !important; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)) !important; display: flex !important; align-items: center !important; gap: 10px !important; box-shadow: 0 -8px 28px rgba(15, 23, 42, 0.12) !important; background: #fff !important; } #strong-configurator-preview.scp-shell--studio .scp-price-row { flex: 0 1 auto !important; margin: 0 !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: center !important; gap: 0 !important; min-width: 0 !important; } #strong-configurator-preview.scp-shell--studio .scp-price-row span { font-size: 10px !important; } #strong-configurator-preview.scp-shell--studio .scp-price-row small { display: none !important; } #strong-configurator-preview.scp-shell--studio .scp-price-row strong { font-size: 18px !important; line-height: 1.1 !important; white-space: nowrap !important; } #strong-configurator-preview.scp-shell--studio .scp-primary-btn { flex: 1 1 auto !important; width: auto !important; max-width: none !important; min-width: 0 !important; padding: 12px 12px !important; font-size: 12px !important; white-space: nowrap !important; } #strong-configurator-preview.scp-shell--studio .scp-powered { display: none !important; } } @media (max-width: 430px) { #strong-configurator-preview.scp-shell--studio .scp-drawer-head h2 { font-size: 16px !important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-dimension-options .scp-option-label { font-size: 12px !important; } #strong-configurator-preview.scp-shell--studio .scp-primary-btn span { font-size: 12px !important; } } /* ========== v0.6.39 mobile polish + summary CTA + mattress prices ========== */ #strong-configurator-preview .scp-summary-cart-wrap, #strong-configurator-preview .scp-summary-secondary-actions{ display:none!important; } /* Materace: stały slot tytułu → ceny w jednej linii w rzędzie */ #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option-body{ position:static!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:flex-start!important; gap:6px!important; width:100%!important; height:auto!important; min-height:calc(4.2em + 1.35em + 6px)!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option-label{ position:static!important; top:auto!important; left:auto!important; right:auto!important; width:100%!important; height:4.2em!important; min-height:4.2em!important; max-height:4.2em!important; display:flex!important; align-items:center!important; justify-content:center!important; text-align:center!important; margin:0!important; overflow:hidden!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option-price{ position:static!important; top:auto!important; left:auto!important; right:auto!important; width:100%!important; height:1.35em!important; min-height:1.35em!important; display:flex!important; align-items:center!important; justify-content:center!important; text-align:center!important; margin:0!important; } @media (max-width: 780px) { #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option-label{ height:4.6em!important; min-height:4.6em!important; max-height:4.6em!important; font-size:11px!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option-body{ min-height:calc(4.6em + 1.35em + 6px)!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option-price{ font-size:11px!important; } /* Sticky CTA: widoczny zawsze, aktywny tylko w podsumowaniu (JS disabled) */ #strong-configurator-preview.scp-shell--studio .scp-primary-btn:disabled{ opacity:.45!important; cursor:not-allowed!important; } } /* Fabric modal: nie otwieraj pickera automatycznie — treść pierwsza */ .scp-fabric-modal__picker:focus{ outline:2px solid var(--scp-accent); outline-offset:2px; } @media (max-width: 1100px) { .scp-fabric-modal__lead{ margin-bottom:10px; } .scp-fabric-modal__picker-wrap{ margin-top:4px; } } /* Mattress equal title slots v0.6.41 */ #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option-body, #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options.is-unpriced-options .scp-option-body, #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options.is-media-options .scp-option-body{ position:static!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:flex-start!important; gap:6px!important; width:100%!important; height:auto!important; min-height:0!important; max-height:none!important; overflow:visible!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options.is-unpriced-options .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options.is-media-options .scp-option-label{ position:static!important; left:auto!important; right:auto!important; top:auto!important; width:100%!important; height:4.2em!important; min-height:4.2em!important; max-height:4.2em!important; display:flex!important; align-items:center!important; justify-content:center!important; text-align:center!important; margin:0!important; overflow:hidden!important; } #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option-price{ position:static!important; width:100%!important; height:1.35em!important; min-height:1.35em!important; display:flex!important; align-items:center!important; justify-content:center!important; text-align:center!important; margin:0!important; } @media (max-width:780px){ #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options.is-unpriced-options .scp-option-label, #strong-configurator-preview.scp-shell--studio .scp-options.is-mattress-options.is-media-options .scp-option-label{ height:4.8em!important; min-height:4.8em!important; max-height:4.8em!important; font-size:11px!important; } } /* ========== v0.6.42 footer z-index + mobile help text ========== */ @media (max-width: 780px) { /* Stopka zawsze nad treścią podsumowania / drawerem */ #strong-configurator-preview.scp-shell--studio .scp-footerbar { position: fixed !important; left: 0 !important; right: 0 !important; bottom: 0 !important; z-index: 10050 !important; isolation: isolate !important; pointer-events: none !important; } #strong-configurator-preview.scp-shell--studio .scp-footerbar .scp-price-card { pointer-events: auto !important; position: relative !important; z-index: 1 !important; background: #fff !important; box-shadow: 0 -10px 32px rgba(15, 23, 42, 0.18) !important; } #strong-configurator-preview.scp-shell--studio .scp-drawer, #strong-configurator-preview.scp-shell--studio .scp-configurator, #strong-configurator-preview.scp-shell--studio .scp-visual-card, #strong-configurator-preview.scp-shell--studio .scp-options, #strong-configurator-preview.scp-shell--studio .scp-summary-drawer { z-index: auto !important; } #strong-configurator-preview.scp-shell--studio .scp-topbar { z-index: 10040 !important; } /* Help: pokaż tekst jak na desktopie */ #strong-configurator-preview.scp-shell--studio .scp-help { display: inline-flex !important; align-items: center !important; justify-content: flex-end !important; gap: 8px !important; max-width: 58% !important; min-width: 0 !important; } #strong-configurator-preview.scp-shell--studio .scp-help__copy { display: flex !important; flex-direction: column !important; align-items: flex-start !important; line-height: 1.15 !important; min-width: 0 !important; } #strong-configurator-preview.scp-shell--studio .scp-help__copy strong { display: block !important; font-size: 10px !important; font-weight: 700 !important; color: #1f2937 !important; white-space: nowrap !important; } #strong-configurator-preview.scp-shell--studio .scp-help__copy small { display: block !important; font-size: 11px !important; font-weight: 700 !important; color: var(--scp-accent) !important; white-space: nowrap !important; } #strong-configurator-preview.scp-shell--studio .scp-help__icon { flex: 0 0 auto !important; width: 36px !important; height: 36px !important; } #strong-configurator-preview.scp-shell--studio .scp-brand { max-width: 110px !important; } #strong-configurator-preview.scp-shell--studio .scp-brand__logo { height: 30px !important; max-width: 110px !important; } } /* ========== v0.6.43 mobile bottom padding under sticky CTA ========== */ @media (max-width: 780px) { /* Nie chowaj sticky CTA w podsumowaniu (stary mobile sheet) */ #strong-configurator-preview.scp-shell--studio.is-summary-active .scp-footerbar, #strong-configurator-preview.scp-shell--studio.is-summary-active .scp-footerbar .scp-price-card, #strong-configurator-preview.scp-shell--studio.is-summary-active .scp-price-card { display: flex !important; } #strong-configurator-preview.scp-shell--studio, #strong-configurator-preview.scp-shell--studio.is-summary-active { padding-bottom: calc(128px + env(safe-area-inset-bottom)) !important; } #strong-configurator-preview.scp-shell--studio .scp-configurator { padding-bottom: 24px !important; } #strong-configurator-preview.scp-shell--studio .scp-drawer, #strong-configurator-preview.scp-shell--studio .scp-drawer.is-summary-view { padding-bottom: 28px !important; margin-bottom: 8px !important; } #strong-configurator-preview.scp-shell--studio .scp-options, #strong-configurator-preview.scp-shell--studio .scp-drawer.is-summary-view .scp-options { padding-bottom: 36px !important; } #strong-configurator-preview.scp-shell--studio .scp-summary-drawer, #strong-configurator-preview.scp-shell--studio .scp-summary-drawer-footer, #strong-configurator-preview.scp-shell--studio .scp-summary-leadtime { padding-bottom: 12px !important; } #strong-configurator-preview.scp-shell--studio .scp-benefits--under-gallery { margin-bottom: 16px !important; padding-bottom: 14px !important; } #strong-configurator-preview.scp-shell--studio .scp-toast { bottom: calc(96px + env(safe-area-inset-bottom)) !important; } } /* ========== v0.6.44 mobile bottom padding — umiar ========== */ @media (max-width: 780px) { #strong-configurator-preview.scp-shell--studio.is-summary-active .scp-footerbar, #strong-configurator-preview.scp-shell--studio.is-summary-active .scp-footerbar .scp-price-card, #strong-configurator-preview.scp-shell--studio.is-summary-active .scp-price-card { display: flex !important; } /* Tylko wysokość stopki + mały zapas (bez gigantycznej pustki) */ #strong-configurator-preview.scp-shell--studio, #strong-configurator-preview.scp-shell--studio.is-summary-active { padding-bottom: calc(84px + env(safe-area-inset-bottom)) !important; } #strong-configurator-preview.scp-shell--studio .scp-configurator { padding-bottom: 8px !important; } #strong-configurator-preview.scp-shell--studio .scp-drawer, #strong-configurator-preview.scp-shell--studio .scp-drawer.is-summary-view { padding-bottom: 14px !important; margin-bottom: 0 !important; } #strong-configurator-preview.scp-shell--studio .scp-options, #strong-configurator-preview.scp-shell--studio .scp-drawer.is-summary-view .scp-options { padding-bottom: 12px !important; } #strong-configurator-preview.scp-shell--studio .scp-summary-drawer, #strong-configurator-preview.scp-shell--studio .scp-summary-drawer-footer, #strong-configurator-preview.scp-shell--studio .scp-summary-leadtime { padding-bottom: 4px !important; } #strong-configurator-preview.scp-shell--studio .scp-benefits--under-gallery { margin-bottom: 4px !important; padding-bottom: 10px !important; } #strong-configurator-preview.scp-shell--studio .scp-toast { bottom: calc(88px + env(safe-area-inset-bottom)) !important; } }