/* Finish information: inline trigger, floating preview card and the calculator finish tiles.
   Supplied samples stay independent checkbox choices; a photo is never the user's model. */
.finish-choice{display:inline-flex;align-items:center;gap:2px}
.finish-info-trigger{display:inline-flex;align-items:center;justify-content:center;gap:4px;flex-shrink:0;min-width:28px;min-height:28px;padding:4px;border:0;border-radius:var(--radius-sm);background:transparent;color:#527493;font:inherit;vertical-align:middle;cursor:pointer}
.finish-info-trigger:hover,.finish-info-trigger[aria-expanded="true"]{background:var(--accent-soft);color:var(--accent)}
.finish-info-trigger:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.finish-info-label{padding:2px 6px;font-size:var(--text-sm);line-height:1.35;color:var(--ink-2)}
.finish-info-symbol{display:inline-grid;place-items:center;width:var(--icon-sm);height:var(--icon-sm);color:#527493}
.finish-info-trigger:is(:hover,[aria-expanded="true"]) .finish-info-symbol{color:inherit}
.finish-info-symbol>.icon{width:var(--icon-sm);height:var(--icon-sm)}
.finish-preview-card{position:fixed;z-index:1100;width:min(360px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain;isolation:isolate;border:1px solid #d4e1ef;border-radius:var(--radius);background:var(--surface);box-shadow:0 16px 48px #15345126,0 3px 10px #15345112;color:var(--ink);text-align:left;animation:finish-preview-in .14s ease-out}
.finish-preview-image{position:relative;height:180px;border-bottom:1px solid #e6edf5;background:var(--surface-2)}
.finish-preview-image img{display:block;width:100%;height:100%;object-fit:contain;border-radius:var(--radius) var(--radius) 0 0;background:#fff}
.finish-preview-image img[hidden]{display:none}
.finish-preview-image>span{position:absolute;bottom:10px;left:12px;padding:2px 8px;border:1px solid #d8e3ee;border-radius:var(--radius-sm);background:#ffffffec;color:#516d88;font-size:var(--text-xs);font-weight:600}
.finish-preview-close{position:absolute;top:8px;right:8px;display:grid;place-items:center;width:32px;height:32px;padding:0;border:1px solid #d8e3ee;border-radius:50%;background:#ffffffed;color:#294a69;cursor:pointer}
.finish-preview-close>.icon{width:var(--icon-md);height:var(--icon-md)}
.finish-preview-copy{padding:var(--space-3) var(--space-4) var(--space-4)}
.finish-preview-copy h2{margin:0 0 6px;font-size:var(--text-xl);line-height:1.3;color:var(--ink)}
.finish-preview-copy p{margin:0;font-size:var(--text-sm);line-height:1.55}
.finish-preview-copy .finish-preview-note{margin-top:var(--space-2);font-size:var(--text-xs);color:var(--muted)}
.finish-preview-document{margin-top:var(--space-3);padding-top:var(--space-3);border-top:1px solid #e4ebf3;font-size:var(--text-xs);color:#526e88}
.finish-preview-document>div{display:flex;flex-wrap:wrap;gap:var(--space-4);margin-top:4px}
.finish-preview-document a{padding:4px 0;color:var(--accent);font-size:var(--text-sm);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.finish-preview-card :focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@keyframes finish-preview-in{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}

/* Calculator finish tiles: photo, title, description; checkbox top right, information bottom right */
.calculator-visual .customer-finishes{container:finish-options/inline-size;min-width:0;margin:0;padding:0;border:0}
.calculator-visual .customer-finishes>legend{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.calculator-visual .customer-finishes>.cluster{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch;gap:var(--space-2)}
.calculator-visual .finish-choice-card{position:relative;display:block;min-width:0;border:1px solid var(--line);border-radius:var(--radius-control);background:var(--surface);color:var(--ink)}
.calculator-visual .finish-choice-card .finish-card-control{display:grid;grid-template-columns:40px minmax(0,1fr);align-items:center;gap:10px;width:100%;min-width:0;margin:0;padding:8px 30px 8px 8px;color:inherit;cursor:pointer}
.calculator-visual .finish-card-control>img{display:block;width:40px;height:40px;object-fit:cover;border:1px solid var(--line-soft);border-radius:var(--radius-sm);background:#fff}
.calculator-visual .finish-card-control>input{position:absolute;top:8px;right:8px;margin:0}
.calculator-visual .finish-card-standard{cursor:default}
.calculator-visual .finish-standard-mark{position:absolute;top:8px;right:8px;display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:var(--accent);color:#fff;visibility:hidden}
.calculator-visual .finish-standard-mark>.icon{width:12px;height:12px}
.calculator-visual .finish-card-copy{display:block;min-width:0;font-size:var(--text-xs);line-height:1.4}
.calculator-visual .finish-card-copy strong{display:block;margin-bottom:1px;font-size:var(--text-sm);font-weight:650;line-height:1.35;color:var(--ink);overflow-wrap:break-word;hyphens:auto}
.calculator-visual .finish-card-copy small{font-size:var(--text-xs);color:var(--muted);overflow-wrap:break-word}
.calculator-visual .finish-card-example{font-size:var(--text-xs);color:var(--subtle)}
.calculator-visual .finish-card-example::before{content:" · "}
/* K9-ORCH-354: príplatok za kus bez DPH alebo „cena po výbere“ zo slotu ostrova karty; prázdny slot nezaberá miesto. */
.calculator-visual .finish-card-copy>.finish-card-price{display:block;margin-top:2px;font-weight:600;color:var(--ink-2);font-variant-numeric:tabular-nums}
.calculator-visual .finish-card-copy>.finish-card-price:empty{display:none}
.calculator-visual .finish-choice-card:has(input:checked) .finish-card-price{color:var(--accent)}
.calculator-visual .finish-choice-card>.finish-info-trigger{position:absolute;right:2px;bottom:2px}
.calculator-visual .finish-choice-card>.finish-info-trigger{bottom:32px}
.finish-enlarge-trigger{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;min-height:30px;padding:4px 8px;border:0;border-top:1px solid var(--line-soft);border-radius:0 0 var(--radius-control) var(--radius-control);background:transparent;color:var(--accent);font:inherit;font-size:var(--text-xs);font-weight:600;cursor:pointer}
.finish-enlarge-trigger:hover{background:var(--accent-soft)}
.finish-enlarge-trigger:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
dialog.finish-lightbox{width:min(1000px,calc(100vw - 32px));max-width:1000px;max-height:calc(100dvh - 32px);padding:0;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);color:var(--ink);overflow:auto;box-shadow:0 24px 80px #0b203d40}
dialog.finish-lightbox::backdrop{background:#10223799;backdrop-filter:blur(3px)}
.finish-lightbox-header{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 16px;border-bottom:1px solid var(--line);background:var(--surface)}
.finish-lightbox-header span{font-size:var(--text-xs);color:var(--muted)}
.finish-lightbox-header h2{margin:2px 0 0;font-size:var(--text-xl)}
.finish-lightbox-content{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:20px;padding:16px}
.finish-lightbox-content figure{position:relative;display:grid;place-items:center;min-width:0;margin:0;border:1px solid var(--line-soft);border-radius:var(--radius-control);background:#fff;overflow:hidden}
.finish-lightbox-content figure>img{display:block;width:100%;height:min(58dvh,520px);object-fit:contain}
.finish-lightbox-content figure>img[hidden]{display:none}
.finish-lightbox-content figcaption{padding:8px 12px;font-size:var(--text-xs);color:var(--muted)}
.finish-lightbox-side{display:grid;align-content:start;gap:16px;font-size:var(--text-sm);line-height:1.5}
.finish-lightbox-side p{margin:0}
.finish-lightbox-choices{display:grid;gap:8px}
.finish-lightbox-choices button{display:flex;align-items:center;gap:12px;min-height:60px;padding:6px 10px;border:1px solid var(--line);border-radius:var(--radius-control);background:var(--surface);font:inherit;text-align:left;color:var(--ink);cursor:pointer}
.finish-lightbox-choices img{width:72px;height:48px;object-fit:cover;background:#fff;border-radius:4px}
.finish-lightbox-choices button[aria-pressed="true"]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:var(--accent-soft);font-weight:650}
.finish-lightbox-note{padding-top:12px;border-top:1px solid var(--line);font-size:var(--text-xs);color:var(--muted)}
.finish-lightbox :focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.calculator-visual .finish-choice-card:has(input:checked),.calculator-visual .customer-finishes:not(:has(input[name="black"]:checked,input[name="polyshot"]:checked)) .finish-choice-card[data-finish-kind="natural"]{border-color:var(--accent);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent)}
.calculator-visual .customer-finishes:not(:has(input[name="black"]:checked,input[name="polyshot"]:checked)) .finish-standard-mark{visibility:visible}
.calculator-visual .finish-choice-card:has(input:focus-visible){outline:3px solid #93b4ff;outline-offset:2px}
.calculator-visual .customer-finishes>.notice{margin:var(--space-2) 0 0}
/* Disabled Dichtol card: muted, with its short reason on its own row under the cards */
.calculator-visual .finish-choice-card:has(input:disabled) .finish-card-control{cursor:not-allowed}
.calculator-visual .finish-choice-card:has(input:disabled) .finish-card-control>:is(img,.finish-card-copy){opacity:.55}
.calculator-visual .customer-finishes>.cluster>.calculator-dichtol-hint{grid-column:1/-1;margin:0;font-size:var(--text-xs);line-height:1.45;color:var(--muted)}
@container finish-options (max-width:760px){
 .calculator-visual .customer-finishes>.cluster{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@container finish-options (max-width:520px){
 .calculator-visual .customer-finishes>.cluster{grid-template-columns:minmax(0,1fr)}
 .calculator-visual .finish-choice-card .finish-card-control{grid-template-columns:16px 40px minmax(0,1fr);padding:6px 40px 6px 10px}
 .calculator-visual .finish-card-control>:is(input,.finish-standard-mark){position:static;grid-column:1;grid-row:1}
 .calculator-visual .finish-card-control>img{grid-column:2;grid-row:1}
 .calculator-visual .finish-card-control>.finish-card-copy{grid-column:3;grid-row:1}
 .calculator-visual .finish-choice-card>.finish-info-trigger{top:4px;bottom:auto;right:4px}
}
@media(max-width:699px){
 .finish-info-trigger{min-width:44px;min-height:44px}
 .finish-preview-image{height:160px}
 .finish-preview-copy{padding:var(--space-3)}
 .finish-preview-close{width:44px;height:44px}
 .calculator-visual .finish-choice-card .finish-card-control{padding-right:48px}
 .calculator-visual .finish-choice-card>.finish-info-trigger{right:0;height:44px}
 .finish-enlarge-trigger{min-height:44px}
 dialog.finish-lightbox{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}
 .finish-lightbox-content{grid-template-columns:minmax(0,1fr);gap:12px;padding:12px}
 .finish-lightbox-content figure>img{height:40dvh}
 .finish-lightbox-side{gap:12px}
 .finish-lightbox-choices{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
 .finish-lightbox-choices img{width:100%;max-width:72px}
 .finish-lightbox-choices button{flex-direction:column;gap:4px;justify-content:center;padding:6px 2px;text-align:center;font-size:var(--text-xs)}
 .finish-lightbox-header .icon-btn{min-width:44px;min-height:44px}
}
@media(prefers-reduced-motion:reduce){.finish-preview-card{animation:none}}

/* PRE-08 a O1 V617-KARTA-POVRCH: sprievodca povrchmi (web/finish-guide.js), modálny dialog so zoznamom vľavo a veľkou fotkou s listovaním;
   pod 900 px ide zoznam nad fotku a posúva sa vodorovne. */
dialog.finish-guide{width:min(1040px,calc(100vw - 32px));max-width:1040px;max-height:calc(100dvh - 32px);padding:0;border:1px solid var(--line);
 border-radius:var(--radius);background:var(--surface);color:var(--ink);overflow:auto;box-shadow:var(--shadow)}
dialog.finish-guide::backdrop{background:#10223799}
.finish-guide-header{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 16px;
 border-bottom:1px solid var(--line);background:var(--surface)}
.finish-guide-header h2{margin:0;font-size:var(--text-xl)}
.finish-guide-intro,.finish-guide-note{margin:0;padding:12px 16px 0;font-size:var(--text-sm);color:var(--muted)}
.finish-guide-note{padding-bottom:16px;font-size:var(--text-xs)}
.finish-guide-body{display:grid;grid-template-columns:minmax(200px,240px) minmax(0,1fr);gap:16px;padding:12px 16px 0}
.finish-guide-list{display:flex;flex-direction:column;gap:8px;min-width:0;margin:0;padding:0;list-style:none}
.finish-guide-option{display:flex;align-items:center;gap:10px;width:100%;min-height:60px;padding:6px 10px;border:1px solid var(--line);
 border-radius:var(--radius-control);background:var(--surface);color:var(--ink);font:inherit;font-size:var(--text-sm);text-align:left;cursor:pointer}
.finish-guide-option img{flex:0 0 auto;width:72px;height:48px;object-fit:cover;border-radius:4px;background:#fff}
.finish-guide-option span{display:grid;gap:2px;min-width:0}
.finish-guide-option small{font-size:var(--text-xs);color:var(--muted)}
.finish-guide-option[data-selected] small{color:var(--accent);font-weight:650}
.finish-guide-option[aria-current="true"]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:var(--accent-soft)}
.finish-guide-view{display:grid;align-content:start;gap:8px;min-width:0;font-size:var(--text-sm);line-height:1.45}
.finish-guide-view h3,.finish-guide-view p{margin:0}
.finish-guide-photo{position:relative;margin:0;border:1px solid var(--line-soft);border-radius:var(--radius-control);background:#fff;overflow:hidden}
.finish-guide-photo>img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.finish-guide-photo figcaption{position:absolute;left:8px;bottom:8px;padding:2px 8px;border-radius:999px;background:#ffffffe6;font-size:var(--text-xs);
 color:var(--muted)}
.finish-guide-nav{position:absolute;top:50%;min-width:44px;min-height:44px;border:1px solid var(--line);border-radius:50%;background:#fffffff2;color:var(--ink);
 transform:translateY(-50%)}
.finish-guide-nav[data-finish-guide-step="prev"]{left:8px}
.finish-guide-nav[data-finish-guide-step="next"]{right:8px}
.finish-guide-combine,.finish-guide-reason{color:var(--muted)}
.finish-guide-price{font-weight:650;color:var(--accent);font-variant-numeric:tabular-nums}
.finish-guide-view>.btn{min-height:44px;justify-self:start}
.finish-guide :focus-visible{outline:2px solid var(--accent);outline-offset:2px}
[data-calculator-root] .calculator-finish-guide{display:inline-flex;align-items:center;gap:6px;min-height:44px;flex:1 1 100%;grid-column:1/-1}
@media(max-width:899px){.finish-guide-body{grid-template-columns:minmax(0,1fr)}.finish-guide-list{flex-direction:row;overflow-x:auto;padding-bottom:4px}
 .finish-guide-list li{flex:0 0 auto}.finish-guide-option{width:auto;min-height:44px}}
@media(max-width:560px){dialog.finish-guide{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}.finish-guide-body{padding:12px 12px 0}
 .finish-guide-option img{width:48px;height:32px}.finish-guide-view>.btn{justify-self:stretch}}