/* Capa visual de Cotizar (it-41). Mismo lenguaje que app.css: tarjetas blancas, línea #d5ddd5, acento #b9d665. */
html.wizard-ui .raw{display:none!important}
/* cada paso es una grilla de 28px + 1fr: todo lo que no es el número va a la segunda columna */
html.wizard-ui .steps>li>*:not(.n){grid-column:2}
html.wizard-ui .steps>li>.n{grid-row:1}
.step-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin:0 0 10px}
.step-head h3{margin:0;font-size:13px;text-transform:none;letter-spacing:0;color:var(--ink);font-weight:650}
.step-head .hint{margin:0;grid-column:auto}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px;margin:0 0 16px}
.cards.products{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.card-opt{display:flex;gap:12px;align-items:flex-start;text-align:left;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px;cursor:pointer;font:inherit;color:var(--ink);transition:border-color .15s,box-shadow .15s}
.card-opt:hover{border-color:#9ebf5c}
.card-opt:focus-visible{outline:2px solid #91af71;outline-offset:2px}
.card-opt.on{border-color:#7fa441;box-shadow:0 0 0 2px var(--accent-soft) inset,0 0 0 1px #7fa441;background:#fbfdf6}
.card-opt.on::after{content:"✓";position:absolute}
.card-opt{position:relative}
.card-opt.on::after{top:8px;right:10px;width:18px;height:18px;border-radius:50%;background:var(--accent);color:var(--accent-ink);font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center}
.card-opt img{width:96px;height:72px;object-fit:contain;flex:none;background:#f7f9f3;border-radius:6px;padding:4px}
.card-opt.product img{width:64px;height:76px}
.card-opt .body{display:flex;flex-direction:column;gap:4px;min-width:0}
.card-opt .body b{font-size:14px}
.card-opt .frase{font-size:12px;color:var(--ink);line-height:1.35}
.card-opt .para{font-size:11px;color:var(--muted);line-height:1.35}
.card-opt .tec{font-size:10px;color:var(--muted);letter-spacing:.4px}
.card-opt .hechos{margin:4px 0 0;padding-left:14px;font-size:11px;color:#4c5f55;line-height:1.4}
.card-opt .hechos li{margin:0}
.fields.measures{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.fields.measures label{position:relative}
.field-hint{display:block;font-size:11px;color:var(--muted);text-transform:none;letter-spacing:0;min-height:14px;line-height:1.35}
.field-error{display:block;font-size:12px;color:var(--err);text-transform:none;letter-spacing:0;line-height:1.35;margin-top:2px}
input.bad{border-color:var(--err);outline-color:var(--err)}
button.info{border:0;background:none;padding:0;color:#4f7a3a;font:inherit;font-size:12px;cursor:pointer;text-decoration:underline dotted}
button.info[aria-expanded=true]{color:var(--accent-ink);font-weight:600}
label.check.inline{display:inline-flex;flex-direction:row;align-items:center;gap:6px;margin-left:14px;font-size:12px;text-transform:none;letter-spacing:0;color:var(--ink)}
label.check.inline input{width:14px;height:14px;accent-color:#5c7f3a;margin:0}
.help-panel{display:grid;grid-template-columns:260px 1fr;gap:16px;align-items:start;background:#f7f9f3;border:1px solid var(--line);border-radius:10px;padding:14px;margin:0 0 14px}
.help-panel img{width:100%;height:auto;max-width:300px}
.help-panel .text p{margin:0 0 8px;font-size:13px;line-height:1.45}
.help-panel .text ol{margin:4px 0 8px;padding-left:18px;font-size:12.5px;line-height:1.45}
.help-panel .text .hint{grid-column:auto;margin:0;font-size:11.5px}
#params-visual{display:flex;flex-direction:column;gap:14px;margin:0 0 10px}
.pgroup .ptitle{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:0 0 6px}
.pgroup .ptitle b{font-size:12.5px}
.pgroup .ptitle .hint{margin:0;grid-column:auto;font-size:11.5px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:flex;gap:8px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:9px;padding:6px 10px 6px 6px;cursor:pointer;font:inherit;color:var(--ink);text-align:left;min-width:120px;position:relative}
.chip img{width:54px;height:36px;object-fit:contain;flex:none}
.chip .lbl{display:flex;flex-direction:column;gap:1px;min-width:0}
.chip .lbl b{font-size:12.5px;font-weight:600}
.chip .lbl small{font-size:10.5px;color:var(--muted);line-height:1.3;max-width:200px}
.chip .reco{margin-left:6px;font-style:normal;font-size:9.5px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:#4f7a3a}
.chip:hover{border-color:#9ebf5c}
.chip.on{border-color:#7fa441;background:#fbfdf6;box-shadow:0 0 0 1px #7fa441}
.chip.off{opacity:.55;cursor:not-allowed;background:#f4f5f1}
.chip.off .lbl small{color:var(--err)}
.chip:focus-visible{outline:2px solid #91af71;outline-offset:2px}
.pcheck,.pnum{display:flex;align-items:center;gap:10px;font-size:12.5px;text-transform:none;letter-spacing:0;color:var(--ink);flex-direction:row}
.pcheck input{width:16px;height:16px;accent-color:#5c7f3a;margin:0}
.pcheck span,.pnum span{display:flex;flex-direction:column;gap:2px}
.pcheck small,.pnum small{font-size:11px;color:var(--muted);font-weight:400}
.pnum input{width:90px}
.live-result{margin:4px 0 0;font-size:13px;color:var(--ink);background:var(--accent-soft);border-radius:8px;padding:8px 12px;min-height:18px}
.live-result:empty{display:none}
.live-result.warn{background:var(--warn-bg);color:var(--warn)}
@media (max-width:700px){
  .cards,.cards.products{grid-template-columns:1fr}
  .card-opt img{width:72px;height:60px}
  .help-panel{grid-template-columns:1fr}
  .chip{min-width:150px;flex:1 1 calc(50% - 8px);padding:6px 8px 6px 6px}
  .chip img{width:40px;height:28px}
  .chip .lbl{min-width:0}
  .chip .lbl small{max-width:none}
  .chip .reco{font-size:9px;letter-spacing:.2px}
}

/* el selector de proveedor (técnica) ensanchaba la página en teléfono */
@media (max-width:700px){.bar label{max-width:100%;min-width:0!important}.bar select,.bar input{max-width:100%;min-width:0!important;box-sizing:border-box}}
/* ayuda de medidas: cerrada hasta tocar ⓘ */
.help-panel[hidden]{display:none}
/* el alzado en vivo acompaña al formulario: en pantalla ancha el panel del pedido queda fijo al desplazarse */
@media (min-width:901px){aside#order{position:sticky;top:12px;align-self:start;max-height:calc(100vh - 24px);overflow:auto}}
.preview-card{margin-top:14px;padding:10px}
.preview-card h4{font-size:12px;margin:0 0 6px}
.preview-card .thumbs.one{grid-template-columns:1fr}
.preview-card .thumbs img,.preview-card .thumbs svg{max-height:260px}
.preview-card .hint{grid-column:auto;margin:6px 0 0;font-size:11px;line-height:1.4}
/* bloque 2: vidrio y opciones */
.chips.glass{margin:0 0 6px}
.chip.wide{min-width:230px;flex:1 1 230px;max-width:360px;align-items:flex-start}
.chip .lbl small.tech{color:var(--ink);font-weight:500}
.chip .lbl small.muted{color:var(--muted)}
.chip .lbl small.bad{color:var(--err);font-weight:600}
.chip .lbl small.delta{font-weight:650;color:var(--ink)}
.chip .lbl small.delta.up{color:#8a4b00}.chip .lbl small.delta.down{color:#1b6b3a}
.chip.warnish{border-color:#e3c35a;background:#fffbea}
.chip .noimg{width:54px;height:36px;flex:none;border-radius:6px;background:repeating-linear-gradient(45deg,#f0f3ea 0 6px,#fff 0 12px)}
.chip .lbl small.tec{font-family:ui-monospace,monospace;font-size:10px;letter-spacing:.3px}
#options-visual,#options-adv-visual{display:flex;flex-direction:column;gap:14px;margin:0 0 10px}
#options-adv-visual{margin-top:10px}
/* bloque 3 */
html[data-lang=cliente] .tecnica-only{display:none!important}
abbr.gl{text-decoration:underline dotted #7fa441;text-underline-offset:2px;cursor:help}
.alk-tools{display:flex;align-items:center;gap:10px;margin-left:auto}
#mode-toggle{display:inline-flex;align-items:center;gap:0;border:1px solid #3f5a50;border-radius:999px;overflow:hidden;background:#1b2f2a}
#mode-toggle .lbl{font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:#bdceb8;padding:0 8px 0 10px}
#mode-toggle button{border:0;background:none;color:#d2dec9;font:inherit;font-size:12px;padding:5px 11px;cursor:pointer}
#mode-toggle button[aria-pressed=true]{background:#b9d665;color:#213832;font-weight:650}
#tour-btn{border:1px solid #3f5a50;background:none;color:#d2dec9;border-radius:999px;font:inherit;font-size:12px;padding:5px 11px;cursor:pointer}
#tour-btn:hover{background:#2f4a42}
#templates{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 14px;padding:10px 12px;background:#f3f6ec;border:1px solid var(--line);border-radius:10px}
#templates .lbl{font-size:12px;color:var(--muted);margin-right:4px}
#templates .tpl{display:flex;flex-direction:column;align-items:flex-start;gap:1px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:6px 10px;font:inherit;cursor:pointer;text-align:left}
#templates .tpl b{font-size:12.5px}#templates .tpl small{font-size:10.5px;color:var(--muted)}
#templates .tpl:hover{border-color:#9ebf5c}
#editing-note{margin:0 0 10px;font-size:12px;color:var(--warn);background:var(--warn-bg);border-radius:8px;padding:6px 10px}
#units li{position:relative}
#units li .est{display:block;color:var(--ink);font-weight:600;margin-top:2px}
.unit-actions{display:flex;gap:4px;margin-top:6px;flex-wrap:wrap}
.unit-actions button{font-size:11px;padding:3px 8px;border-radius:6px}
.order-estimate{margin:4px 0 10px;font-size:13px;font-weight:650;color:var(--ink)}.order-estimate:empty{display:none}
#tour{position:fixed;inset:0;z-index:50;pointer-events:none}
#tour .spot{position:fixed;border-radius:12px;box-shadow:0 0 0 9999px rgba(33,56,50,.55),0 0 0 3px #b9d665;transition:all .25s}
#tour .bubble{position:fixed;width:340px;max-width:calc(100vw - 24px);background:#fff;border-radius:10px;padding:14px 16px;box-shadow:0 12px 32px rgba(0,0,0,.25);pointer-events:auto;font-size:13px;line-height:1.45}
#tour .bubble b{display:block;font-size:14px;margin-bottom:4px}
#tour .bubble p{margin:0 0 10px}
#tour .bubble .row-actions{display:flex;gap:8px;align-items:center;justify-content:flex-end}
#tour .bubble .count{margin-right:auto;color:var(--muted);font-size:12px}
@media (max-width:700px){.alk-tools{margin-left:0;width:100%}}
/* §7 comparar variantes */
.live-result .linkish{margin-left:10px;border:0;background:none;color:#3f6b4a;text-decoration:underline dotted;font:inherit;font-size:12px;cursor:pointer}
#compare-panel{margin:10px 0 0;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px}
#compare-panel[hidden]{display:none}
.cmp-head{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}.cmp-head b{margin-right:6px}
.cmp-head select{font:inherit;font-size:12px;border:1px solid var(--line);border-radius:7px;padding:5px 8px;background:#fff;max-width:260px}
.cmp-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.cmp-col{border:1px solid var(--line);border-radius:8px;padding:10px;font-size:12.5px}.cmp-col.base{background:#fbfdf6;border-color:#7fa441}
.cmp-col b{display:block;margin-bottom:6px}.cmp-col p{margin:2px 0}.cmp-col .price{font-weight:650}.cmp-col .bad{color:var(--err)}
.cmp-col .delta.up{color:#8a4b00}.cmp-col .delta.down{color:#1b6b3a}
.cmp-svg svg{width:100%;height:auto;max-height:200px}.cmp-col.loading{color:var(--muted)}
.cmp-col button{margin-top:8px}
