/* LuxRolety V16 Rolety: od nowa — niezależne geometryczne warstwy rolety. */
.lx12-room {
  position:relative; isolation:isolate; overflow:hidden; width:100%;
  aspect-ratio:672 / 736; border-radius:17px;
  background:#e5e0d5 url('okno-luxrolety-roleta-v3.webp') center/100% 100% no-repeat;
  --lx12-profile-base:#f3f4f1; --lx12-profile-image:none;
  --lx12-chain-light:#f2f2f0; --lx12-chain-dark:#c7c7c4;
}
.lx12-room .scene-lights { position:absolute;top:2.45%;left:2.3%;width:35.4%;height:7.7%;z-index:25; }
.lx12-light {position:absolute;inset:0;pointer-events:none;z-index:12;mix-blend-mode:screen;opacity:0}
/* W V11 kaseta była 7% wysokości fotografii za nisko. */
.lx12-stage {position:absolute;left:30.45%;width:54.85%;top:14.35%;height:69.22%;z-index:5;isolation:isolate;transform:translateZ(0);transition:transform .18s ease}
/* Każda powierzchnia korzysta z tego samego koloru bazowego i pliku okleiny. */
.lx12-cassette,.lx12-rail,.lx12-bottom-bar {
  background-color:var(--lx12-profile-base)!important;
  background-image:linear-gradient(180deg,rgba(255,255,255,.18),rgba(0,0,0,.15)),var(--lx12-profile-image)!important;
  background-position:center,center!important;
  background-size:100% 100%,cover!important;
  background-repeat:no-repeat,no-repeat!important;
}
.lx12-fabric {position:absolute;left:8px;right:8px;top:22px;z-index:2;height:68%;overflow:visible;
  --lx12-cloth:#d7c8a8;--lx12-day-opaque:rgba(215,200,168,.96);--lx12-day-sheer:rgba(215,200,168,.20);
  background-color:var(--lx12-cloth);
  background-image:linear-gradient(90deg,rgba(0,0,0,.1),transparent 10%,rgba(255,255,255,.04) 46%,transparent 87%,rgba(0,0,0,.08)),repeating-linear-gradient(0deg,rgba(0,0,0,.018) 0 1px,transparent 1px 5px);
  box-shadow:inset 2px 0 5px rgba(0,0,0,.12),inset -2px 0 5px rgba(0,0,0,.12),0 4px 6px rgba(0,0,0,.10);
  transition:height .14s ease;touch-action:none;
}
.lx12-fabric[data-fabric-type="dzien-noc"]{
  background-color:transparent;
  background-image:linear-gradient(90deg,rgba(0,0,0,.11),transparent 13%,rgba(255,255,255,.03) 52%,transparent 86%,rgba(0,0,0,.10)),
   repeating-linear-gradient(to bottom,
      var(--lx12-day-opaque) 0 21px,
      var(--lx12-day-opaque) 21px 37px,
      var(--lx12-day-sheer-edge,rgba(215,200,168,.35)) 37px 39px,
      var(--lx12-day-sheer) 39px 62px,
      var(--lx12-day-sheer-edge,rgba(215,200,168,.35)) 62px 64px);
}
.lx12-fabric-shimmer {position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.06),transparent 8%,rgba(255,255,255,.09) 48%,transparent 91%,rgba(0,0,0,.07));opacity:.55}
.lx12-fabric[data-fabric-type="dzien-noc"] .lx12-fabric-shimmer{opacity:.18}
.lx12-bottom-bar {position:absolute;bottom:-6px;left:-2px;right:-2px;height:13px;z-index:7;border-radius:2px 2px 5px 5px;
  border:1px solid rgba(18,30,23,.22);box-shadow:0 3px 6px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.24);
  cursor:ns-resize;touch-action:none}
.lx12-bottom-bar:hover,.lx12-bottom-bar:focus-visible {outline:3px solid rgba(203,148,57,.55);outline-offset:2px}
.lx12-rail{position:absolute;top:19px;bottom:0;width:9px;z-index:5;border:1px solid rgba(0,0,0,.2);
  box-shadow:inset 1px 0 rgba(255,255,255,.28),0 0 3px rgba(0,0,0,.20)}
.lx12-rail-left{left:0;border-radius:2px 0 0 2px}
.lx12-rail-right{right:0;border-radius:0 2px 2px 0}
.lx12-stage[data-guide="plaska-lukowa"] .lx12-rail{width:11px;border-radius:5px;box-shadow:inset 3px 0 3px rgba(255,255,255,.22),0 0 3px rgba(0,0,0,.23)}
.lx12-cassette{position:absolute;z-index:8;left:-2px;right:-2px;top:0;height:25px;
  border-radius:9px 9px 3px 3px;border:1px solid rgba(20,30,20,.24);
  box-shadow:0 4px 7px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.28)}
.lx12-cassette:after{content:'';position:absolute;left:2px;right:2px;bottom:-1px;height:3px;background:var(--lx12-profile-base);filter:brightness(.82);border-radius:4px}
.lx12-cassette-shine{position:absolute;inset:3px 3px 6px;border-radius:8px;background:linear-gradient(180deg,rgba(255,255,255,.3),rgba(255,255,255,.02) 60%,rgba(0,0,0,.07))}
.lx12-chain{position:absolute;right:3px;top:23px;width:23px;height:52%;z-index:9;touch-action:none;cursor:ns-resize;filter:drop-shadow(0 1px 2px rgba(0,0,0,.18))}
.lx12-chain.left{left:3px;right:auto}
.lx12-chain:before,.lx12-chain:after {content:'';position:absolute;top:0;bottom:24px;width:5px;border-radius:12px;background:radial-gradient(circle at center,var(--lx12-chain-light) 0 44%,transparent 47%) 50% var(--pull-position,0px)/5px 8px repeat-y,linear-gradient(var(--lx12-chain-dark),var(--lx12-chain-dark)) center/1px 100% no-repeat}
.lx12-chain:before{left:4px}.lx12-chain:after{right:4px}
.lx12-loop{position:absolute;left:4px;right:4px;bottom:18px;height:12px;border:2px solid var(--lx12-chain-dark);border-top:0;border-radius:0 0 12px 12px;opacity:.7}
.lx12-chain-end{position:absolute;left:2px;bottom:0;width:19px;height:26px;border:1px solid #aea9a1;border-radius:11px 11px 9px 9px;background:linear-gradient(130deg,#fafaf9,#d5d6d1);box-shadow:inset -2px -2px 3px rgba(0,0,0,.09),0 2px 3px rgba(0,0,0,.13)}
.lx12-chain-end:after{content:'';position:absolute;left:7px;top:5px;width:5px;height:7px;border-radius:50%;background:rgba(255,255,255,.72);border:1px solid #caccca}
.lx12-chain.is-napinacz .lx12-chain-end{left:2px;bottom:0;width:19px;height:30px;border-radius:4px 4px 8px 8px;background:linear-gradient(140deg,#fdfdfb,#e5e8e4)}
.lx12-chain.is-napinacz .lx12-chain-end:after{left:6px;top:5px;width:5px;height:15px;border-radius:99px}
.lx12-room[data-view="back"] .lx12-chain,.lx12-room[data-view="detail"] .lx12-chain{display:none!important}
.lx12-room[data-view="back"] .lx12-stage{transform:scaleX(-1)}
.lx12-room[data-view="detail"] .lx12-stage{transform:scale(1.12);transform-origin:50% 48%}
.lx12-room .scene-hint{position:absolute;left:2.2%;top:55.6%;width:30%;min-height:11.5%;height:auto;z-index:21;padding:10px 12px;font-size:clamp(9px,1vw,12px)}
.lx12-room .room-bottom-actions{position:absolute;bottom:0;left:2%;z-index:24}
.lx12-room .scene-pill{position:absolute;bottom:1.6%;right:2%;z-index:20}
.lx12-room .fabric-zoom{position:absolute;z-index:18;inset:17% 11% 18%;display:flex;flex-direction:column;overflow:hidden;background:white;border:8px solid white;border-radius:16px;box-shadow:0 18px 65px rgba(0,0,0,.24)}
.lx12-room .fabric-zoom[hidden]{display:none!important}
.lx12-room .fabric-zoom img{display:block;width:100%;height:calc(100% - 42px);object-fit:contain;background:#f8f8f6}
.lx12-room .scene-hint[hidden]{display:none!important}
@media(max-width:660px){.lx12-room .scene-hint{font-size:9px;padding:7px 8px;width:36%}.lx12-chain{height:44%}}

/* Zachowane, zaakceptowane kafelki podsumowania i wygląd finalizacji V11. */

.summary-visuals{display:grid;gap:9px}
.summary-choice{display:flex;align-items:center;min-height:88px;padding:8px 10px;border:1px solid #e0eae4;border-radius:17px;background:#fff;box-shadow:none;transition:border-color .15s,background .15s}
.summary-choice:hover{border-color:#9fbfae;background:#f7fbf8}
.summary-choice .thumb{width:78px;height:76px;flex:0 0 78px;border-radius:12px;overflow:hidden;background:#f8faf8}
.summary-choice .thumb img{width:100%;height:100%;object-fit:cover}
.summary-choice .thumb .summary-placeholder{font-size:29px;line-height:1;background:#f7faf8;color:#9cb5a8;border:1px dashed #c4dbcd}
.summary-choice .choice-copy{display:grid;gap:6px;min-width:0;flex:1;padding:0 8px 0 11px}
.summary-choice .choice-copy .kicker{letter-spacing:.09em;color:#b07825}
.summary-choice .choice-copy strong{font-size:13px;color:#174839;line-height:1.38}
.summary-choice .choice-copy small{font-size:11px;color:#94a69d}
.summary-card #summaryList{margin-top:13px;border-top:1px solid #e9f0ea}
.summary-card #summaryList .summary-row{margin:0;border-bottom:1px solid #ebf0ec;display:flex;align-items:center;justify-content:space-between;min-height:49px;padding:8px 6px}
.summary-card #summaryList .summary-row dt{color:#b07c39;font-size:11px;letter-spacing:.08em;font-weight:750;text-transform:uppercase}
.summary-card #summaryList .summary-row dd{margin:0;color:#234c3e;font-size:13px;font-weight:800}
.summary-card #summaryList .summary-row dd.empty{color:#829b8e;font-weight:500}
.summary-qty-controls{display:inline-flex;gap:8px;align-items:center}
.summary-qty-controls button{width:28px;height:28px;display:grid;place-items:center;border:1px solid #d8e6df;background:#f7faf9;color:#194b3a;border-radius:9px;font-size:17px;cursor:pointer}
.summary-qty-controls button:hover{background:#e6f1eb}
.summary-qty-controls b{font-size:15px;min-width:18px;text-align:center}
/* Lupy zgodne ze spokojną stylistyką plis. */
.fabric-loupe{font-size:0;width:36px;height:36px;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.11);border-radius:10px;color:#164b3b}
.fabric-loupe svg{width:19px;height:19px;stroke:currentColor;stroke-width:2;fill:none}
.fabric-photo-label{padding-right:40px!important}
/* Ekran finalizacji: inspiracja istniejącym ekranem plis. */
.finish.lux-final{padding:34px;border-radius:27px;background:#fff;border:1px solid #e8eee8;box-shadow:0 10px 36px rgba(23,67,47,.06)}
.lux-final-top h2{font-size:clamp(25px,2.9vw,39px);font-weight:850;letter-spacing:-.035em}
.lux-done-icon{width:54px;height:54px;font-size:28px;border-radius:50%;background:#dbf5e6;color:#0b5a40}
.lux-final-code-card{background:#f4faf6;border:1px solid #dfede4;border-radius:21px;padding:23px 26px}
.lux-final-code-card .codeRow strong{font-size:clamp(24px,3vw,43px);letter-spacing:.02em;color:#134638}
.lux-final-price-card{border-radius:21px;background:linear-gradient(135deg,#104b37,#276d4e)}
.lux-final-instructions{border-radius:21px;padding:24px 20px}
.lux-checkout-number{background:linear-gradient(#f6d887,#d5a74c);color:#103f30;border:1px solid #c99c3f;box-shadow:0 4px 12px rgba(181,128,47,.2)}
.lux-checkout-step{border-radius:17px;background:#f6faf7}
.lux-checkout-step-third{background:#f7fbf8}
@media(max-width:600px){.finish.lux-final{padding:17px}.summary-choice .thumb{width:66px;height:65px;flex-basis:66px}}

/* V14: jedna duża próbka kategorii zamiast trzech zdjęć. */
.collection-hero{display:block;height:148px;overflow:hidden;border:1px solid #e4ebe5;border-radius:12px;background:#f4f5f1}
.collection-hero img{display:block;width:100%;height:100%;object-fit:cover}
.collection-hero-empty{display:grid;place-items:center;background:linear-gradient(145deg,#edeadf,#dbe8e0 45%,#fbf6e9)}
.collection-hero-empty>span{font-size:48px;color:#9eac9d}
@media(max-width:690px){.collection-hero{height:94px}}
/* Delikatniejszy połysk obudowy; realna tekstura okleiny ma pozostać czytelna. */
.lx12-cassette-shine{background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.02) 60%,rgba(0,0,0,.045))}

/* V16: ekran końcowy stylizowany według zaakceptowanego koszyka plis. */
.finish.lux-final{background:#fff;box-shadow:0 16px 48px rgba(18,50,35,.055)}
.lux-final-top h2{font-size:clamp(27px,3.2vw,38px)}
.lux-final-code-card{background:#f5faf7}
.lux-final-price-card{background:linear-gradient(115deg,#14503e,#266c51)}
.lux-final-instructions{background:#fff}
.lux-v32-example{background:#fff}

/* V17 Rolety — fotografie kroków 4, 5, 6 w oryginalnym kwadratowym kadrze.
   Nie przycinamy dolnej części zdjęcia z podpisem. */
.v17-illustrated .visual-option{gap:0;padding:7px;overflow:hidden}
.v17-illustrated .visual-option.selected{padding:6px}
.v17-illustrated .visual-option-photo{aspect-ratio:1/1;border:0;border-radius:12px;background:#fff;overflow:hidden}
.v17-illustrated .visual-option-photo img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}
.v17-illustrated .visual-option-copy{position:static;display:block;padding:8px 5px 7px;text-align:center;margin:0;width:100%}
.v17-illustrated .visual-option-copy strong{font-size:13px;line-height:1.3}
.v17-illustrated .visual-option-copy small{display:none}
.v17-illustrated .visual-option .option-selected{z-index:5;top:12px;right:12px}
/* Przy mniejszym ekranie dopasowujemy szerokości miniatur. */
@media (max-width:740px){.v17-illustrated.visual-options{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:450px){.v17-illustrated.visual-options{grid-template-columns:1fr}}
/* Wskazówki do tkanin — na wzór krótkich przypisów z konfiguratora plis. */
.v17-fabric-info{background:#f6faf7;border:1px solid #ddebe2;border-radius:12px;padding:12px 13px;margin-bottom:15px;color:#244a3b}
.v17-fabric-chips{display:flex;flex-wrap:wrap;gap:7px}
.v17-fabric-chips span{display:inline-block;padding:7px 9px;border:1px solid #dce9df;border-radius:9px;background:#fff;font-size:11px;line-height:1.35;color:#2a5b49}
.v17-fabric-chips b{color:#b07b32;font-weight:850}
.v17-fabric-info p{margin:9px 1px 1px;font-size:12px;line-height:1.55;color:#678879}
/* Duże, czytelne plansze pomiaru i montażu — nie przycinamy grafiki ani napisów. */
#helpModal .v17-guide-dialog{width:min(1150px,96vw);max-width:none;max-height:94vh;overflow-y:auto;padding:10px;border-radius:22px;position:relative}
#helpModal .v17-guide-dialog #helpTitle{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
#helpModal .v17-guide-dialog #helpContent{line-height:0;margin:0}
#helpModal .v17-guide-dialog .v17-help-poster{width:100%;height:auto;max-height:none;object-fit:contain;display:block;border-radius:16px}
#helpModal .v17-guide-dialog .modal-close{position:sticky;float:right;top:10px;right:10px;z-index:4;margin-bottom:-36px;width:36px;height:36px;background:#eaf3ee;color:#124535;border:1px solid #d7e8dd;box-shadow:0 2px 9px rgba(0,0,0,.11)}
#helpModal .v17-guide-dialog #helpOk{display:none}
@media(max-width:700px){#helpModal{padding:5px}#helpModal .v17-guide-dialog{width:100%;max-height:98vh;padding:4px;border-radius:12px}#helpModal .v17-guide-dialog .v17-help-poster{border-radius:10px}}

/* X nadrukowany na planszy jest jednocześnie klikalnym przyciskiem zamknięcia. */
#helpModal .v17-guide-dialog>.kicker{display:none}
#helpModal .v17-guide-dialog #closeHelp{display:none}
#helpModal .v17-help-poster-wrap{position:relative;line-height:0}
#helpModal .v17-help-poster-wrap .v17-poster-close{position:absolute;right:1.5%;top:4%;width:10%;height:13%;border:0;background:transparent;color:transparent;cursor:pointer;z-index:10;border-radius:50%}
#helpModal .v17-help-poster-wrap .v17-poster-close:focus-visible{outline:3px solid #0c624b;outline-offset:2px}

/* V18 ROLETY — dopasowanie stylistyki do konfiguratora plis LUXROLETY. */
:root{--lux-logo-gold:#b58737;--lux-logo-gold-light:#dfbd74;--lux-logo-gold-deep:#a8782e;--lr-green:#164d3f;font-family:Inter,'Segoe UI',system-ui,-apple-system,Arial,sans-serif!important;font-synthesis:none;color:#232326}
body{background:#fff;color:#23362e}
button,input,a{font:inherit}
.layout{max-width:1740px}
.hero h1{font-size:clamp(28px,3vw,42px)!important;font-weight:740!important;letter-spacing:-.055em!important;line-height:1.14!important}
.hero h1 em{color:#537d69}
.hero p{font-size:14px;color:#76736e}
.eyebrow,.kicker{font-size:10px;letter-spacing:.2em;font-weight:850;color:var(--lux-logo-gold-deep)}
.visual-head h2,.summary-head h2{font-size:20px;letter-spacing:-.035em;font-weight:800}
.visual-card,.wizard-card,.summary-card,.cart-card,.finish{border:1px solid #e6eee7;box-shadow:0 8px 30px rgba(51,40,20,.035)}
.wizard-card{padding:23px 22px}
.wizard-card h2{font-size:clamp(24px,2vw,32px);letter-spacing:-.055em;font-weight:790}
.step-number{background:var(--lr-green);font-size:15px}
.progress-track{background:#e7eee9}
.progress-track span{background:linear-gradient(90deg,#154d3e,#4e9274)}
.help-button{background:#fff;border:1px solid #d8e5da;border-radius:11px;color:#245c48}
.btn{border-radius:9px;font-size:12px;font-weight:850}
.btn.primary{background:#164d3f;color:#fff}
.btn.secondary{background:#f4f6f3;color:#4b7664}
.collection-card{border-radius:14px}
.collection-card-body strong{font-weight:850}
.collection-card-body small{color:#84948b}
.fabric-loupe{width:29px!important;height:29px!important;border-radius:7px!important;right:10px!important;bottom:10px!important;background:rgba(255,255,255,.96)!important;border:1px solid #d4e5db!important;box-shadow:0 2px 5px rgba(12,38,26,.12)!important;color:#165944!important;padding:4px!important}
.fabric-loupe svg{height:18px!important;width:18px!important;stroke-width:1.9px!important}
.fabric-loupe:hover{background:#e5f3e9!important}
.v18-safety-note{margin:15px 0 11px;border-radius:13px;padding:16px 18px;background:#fffaf1;border:1px solid #e9cb88;color:#715122;font-size:12px;line-height:1.55}
.v18-safety-note strong{display:block;font-size:13px;color:#84551e}
.v18-safety-note p{margin:6px 0}
.v18-safety-note small{font-size:11px;color:#796a53}
.v18-safety-check{display:flex;gap:10px;align-items:flex-start;background:#f8faf8;padding:12px;border-radius:11px;border:1px solid #d7e4dc;line-height:1.5;font-size:12px;color:#234f3d;cursor:pointer}
.v18-safety-check input{width:19px;height:19px;accent-color:#185d46;flex:0 0 19px;margin-top:2px}
.lx12-cassette,.lx12-rail,.lx12-bottom-bar{background-color:var(--lx12-profile-base)!important;background-image:var(--v18-profile-surface,linear-gradient(180deg,#fafafa,#d0d0d0))!important;background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important}
.lx12-cassette-shine{background:linear-gradient(180deg,rgba(255,255,255,.12),transparent 60%,rgba(0,0,0,.05))!important}
/* Detail view covers the whole window photo, exactly the mode used by plisy: fabric only. */
.lx12-room[data-view="detail"]{background-image:none!important;background:radial-gradient(circle at 50% 35%,#fcfcf9,#e5eee7)!important}
.lx12-room[data-view="detail"] .lx12-stage{visibility:hidden!important}
.lx12-room[data-view="detail"] .scene-hint,.lx12-room[data-view="detail"] .scene-pill,.lx12-room[data-view="detail"] .lx12-light{display:none!important}
.lx12-room .fabric-zoom{position:absolute;z-index:28;inset:12% 9% 11%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;overflow:visible;background:none;border:0;border-radius:0;box-shadow:none}
.lx12-room .fabric-zoom img{display:block;width:min(100%,390px);height:min(72%,445px);max-height:445px;object-fit:contain;background:#fff;box-shadow:0 8px 34px #1b4a3920;border-radius:17px;padding:12px}
.lx12-room .fabric-zoom .fabric-zoom-label{font-size:17px;font-weight:900;color:#164a3d;text-align:center;background:transparent;padding:6px}
.lx12-room .fabric-zoom .v18-detail-note{font-size:11px;font-weight:400;color:#7e8e85;margin-top:4px;display:block}
.lx12-room:not([data-view="detail"]) .fabric-zoom{display:none!important}
.lx12-room .scene-hint{min-height:0;height:auto;width:29%;padding:12px;font-weight:850}
.lx12-room[data-view="back"] .scene-hint{display:flex!important;width:32%;background:#fffffff0}
/* Slider: daylight changes room atmosphere substantially, but does not recolor fabric itself. */
.lx12-light{mix-blend-mode:normal;transition:opacity .12s linear}
.lx12-room .scene-lights input{accent-color:#1d5546}
/* Smaller and more coherent final panel, as in plisy. */
.finish.lux-final{padding:31px 30px;border-radius:23px}
.lux-final-top h2{font-size:clamp(28px,3vw,40px)!important;font-weight:790;letter-spacing:-.04em}
.lux-final-code-card{border:1px solid #ddebe2;background:#f5faf7;padding:22px 25px}
.lux-final-price-card{background:linear-gradient(115deg,#15503e,#22654e)}
.lux-final-code-card .codeRow{gap:14px;justify-content:space-between}
.lux-final-code-card .codeRow strong{letter-spacing:.015em!important;font-weight:900!important}
.lux-checkout-step{background:#f6faf7;border:1px solid #e0ece4}
.lux-checkout-number{background:linear-gradient(#f6d887,#d5a74c);color:#103f30}
.lux-final-instructions{background:white;border:1px solid #e5ece8}
.lux-v32-example{box-shadow:0 9px 22px rgba(17,52,38,.06)}
@media(max-width:650px){.lx12-room .fabric-zoom{inset:13% 5% 10%}.lx12-room .fabric-zoom img{width:min(95%,390px)}.lx12-room[data-view="back"] .scene-hint{width:40%;font-size:9px}.finish.lux-final{padding:17px}}
