/* buclea · Impresión 3D (curso de venta) — lo que este curso añade sobre la
 * piel del módulo escolar (modulos/fabricacio/estils.css, cargada antes).
 * Solo lo que el mapa por productos y bloques necesita. */

/* Cabecera de bloque dentro de la rejilla de cápsulas: ocupa toda la fila. */
.sess-grid .bloque-cap {
  grid-column: 1 / -1;
  display: flex; align-items: baseline; gap: 10px;
  margin: 10px 0 -4px; font-size: 14px; font-weight: 700; letter-spacing: -.01em;
  color: var(--profund);
}
.sess-grid .bloque-cap:first-child { margin-top: 0; }
.sess-grid .bloque-cap .chip { font-size: 10.5px; }

/* «Para quien va solo»: el profesor en la sombra, bajo las pistas. */
.solo-card { padding: 10px 16px; margin-top: 10px; border-color: var(--ocre-clar, #FBF1DE); background: var(--ocre-clar, #FBF1DE); }
.solo-card .label { color: var(--ocre, #C8841A); }
.solo-card .solo-fila { margin: 6px 0 0; font-size: 12.5px; line-height: 1.45; }
.solo-card .solo-fila b { color: var(--ocre, #C8841A); font-weight: 700; }

/* Fotografías del bloque 0 y de la clínica en la tarjeta grande. */
.curso-imagenes { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; margin: 0 0 14px; }
.curso-img { margin: 0; background: var(--paper); border-radius: 12px; overflow: hidden; border: 1px solid var(--linia); }
.curso-img img { display: block; width: 100%; height: auto; }
.curso-img .curso-img-alt { display: none; padding: 26px 16px; font-size: 13px; color: var(--pissarra); text-align: center; line-height: 1.45; }
.curso-img.falta img { display: none; }
.curso-img.falta .curso-img-alt { display: block; }
.curso-img figcaption { padding: 8px 12px; font-size: 12.5px; color: var(--pissarra); line-height: 1.4; }

/* Demostraciones con el motor (F1 retracción, F4 flujo). */
.curso-demo { background: var(--paper); border: 1px solid var(--linia); border-radius: 12px; padding: 12px 14px; margin: 0 0 14px; }
.curso-demo .demo-cap { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.curso-demo .demo-cap .muted { font-size: 12px; }
.curso-demo .demo-txt { margin: 8px 0 0; font-size: 13px; line-height: 1.45; }
.curso-demo .demo-modos, .curso-demo .demo-ctl { display: flex; align-items: center; gap: 8px; margin: 6px 0; font-size: 13px; }
.curso-demo .demo-ctl input[type=range] { flex: 1; }
.curso-demo .demo-stats { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.curso-demo .demo-code { margin: 8px 0 0; padding: 8px 10px; background: var(--blanc); border: 1px solid var(--linia); border-radius: 8px; font-family: var(--mono); font-size: 11.5px; line-height: 1.5; overflow-x: auto; }
.curso-demo .demo-code .retr { color: var(--profund); font-weight: 700; background: var(--menta-clar); }
.curso-demo .demo-formula { margin: 8px 0 0; font-size: 12px; color: var(--pissarra); }
.curso-demo .demo-planta { width: 100%; height: auto; display: block; background: var(--blanc); border-radius: 8px; border: 1px solid var(--linia); }
.curso-demo .demo-planta .torre { fill: var(--menta-clar); stroke: var(--verd); stroke-width: 0.4; }
.curso-demo .demo-planta .viaje { stroke: var(--verd); stroke-width: 0.25; stroke-dasharray: 1 0.7; opacity: .8; }
.curso-demo .demo-planta .hilo { stroke: var(--ocre, #C8841A); stroke-width: 0.25; opacity: .85; }
.curso-demo .demo-seccion { width: 100%; max-width: 420px; height: auto; display: block; background: var(--blanc); border-radius: 8px; border: 1px solid var(--linia); margin: 6px 0; }
.curso-demo .demo-seccion .cama { stroke: var(--pissarra); stroke-width: 1.2; }
.curso-demo .demo-seccion .linea { fill: var(--menta); stroke: var(--verd); stroke-width: 0.8; }
.curso-demo .demo-seccion .linea.huecos { fill: var(--ocre-clar, #FBF1DE); stroke: var(--ocre, #C8841A); }
.curso-demo .demo-seccion .linea.sobra { fill: var(--ocre-clar, #FBF1DE); stroke: var(--ocre, #C8841A); opacity: .75; }

/* Enlaces a la cápsula del motor que repara el fallo, y botón del peine. */
.curso-enlaces { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 4px; }

/* Las pestañas de producto llevan nombre largo: que quepan en dos líneas. */
#prod-tabs { flex-wrap: wrap; justify-content: flex-end; max-width: 520px; }
#prod-tabs .btn { white-space: normal; text-align: left; line-height: 1.25; }

/* ------------------------------------------------------------ Tu taller -- */
.sess-grid .taller-card-mapa { border-style: dashed; background: var(--paper); }
.sess-grid .taller-card-mapa:hover { background: var(--blanc); }
.taller-accions { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.taller-accions .btn { background: rgba(255,255,255,.15); border-color: rgba(255,255,255,.4); color: #fff; }
.taller-accions .btn[aria-pressed="true"] { background: #fff; color: var(--profund); border-color: transparent; }
.taller-accions .btn[disabled] { opacity: .5; cursor: default; }
.taller-cos { flex: 1; min-height: 0; display: grid; grid-template-columns: 330px minmax(0, 1fr) 300px; gap: 0; }
.taller-rail, .taller-panell { min-height: 0; overflow: auto; padding: 14px 12px 20px; display: flex; flex-direction: column; gap: 10px; }
.taller-rail { padding-left: 18px; }
.taller-panell { padding-right: 18px; }
.taller-visor { min-width: 0; min-height: 0; display: flex; flex-direction: column; padding: 14px 6px 12px; }
.taller-visor .visor-card { flex: 1; min-height: 360px; margin-top: 8px; }
.taller-visor .workspace-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.taller-visor .vistes, .taller-visor .camera-tools { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.taller-tall { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 600; color: var(--pissarra); }
.taller-tall input { width: 90px; }
.taller-card { padding: 12px 14px; }
.taller-card .p-cap { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.taller-card .p-cap b { font-size: 13.5px; }
.taller-llista { display: flex; flex-direction: column; gap: 4px; }
.taller-peca { display: flex; align-items: center; gap: 8px; padding: 5px 8px; border-radius: 10px; border: 1px solid var(--linia); background: var(--blanc); cursor: pointer; font-size: 12.5px; }
.taller-peca:hover { border-color: var(--verd); }
.taller-peca.sel { border-color: var(--verd); background: var(--menta-clar); }
.taller-peca.ocult .nom { opacity: .45; text-decoration: line-through; }
.taller-peca .glif { width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: 12px; flex: none; background: var(--paper); color: var(--pissarra); }
.taller-peca .glif.afegeix { background: var(--menta-clar); color: var(--profund); }
.taller-peca .glif.resta { background: var(--ocre-clar); color: var(--ocre); }
.taller-peca .glif.interseca { background: #E3EDF9; color: #2C5DA8; }
.taller-peca .nom { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.taller-peca .ops { display: flex; gap: 2px; opacity: .55; }
.taller-peca:hover .ops, .taller-peca.sel .ops { opacity: 1; }
.taller-peca .mini { border: 0; background: transparent; cursor: pointer; font-size: 11px; padding: 2px 4px; border-radius: 6px; color: var(--pissarra); font-family: var(--font); }
.taller-peca .mini:hover { background: var(--blanc); color: var(--profund); }
.taller-peca .mini[disabled] { opacity: .3; cursor: default; }
.taller-afegeix { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 10px; }
.taller-afegeix .btn { padding: 4px 10px; font-size: 12px; }
.taller-sub { font-size: 11px; font-weight: 700; color: var(--pissarra); text-transform: uppercase; letter-spacing: .06em; margin: 12px 0 2px; }
.taller-camp .taller-dual { display: flex; gap: 6px; align-items: center; }
.taller-camp .taller-dual input[type=range] { flex: 1; min-width: 0; margin: 0; }
.taller-camp .taller-dual input[type=number] { width: 62px; font-family: var(--mono); font-size: 11.5px; padding: 2px 4px; border: 1px solid var(--linia); border-radius: 6px; }
.taller-nom, .taller-text { font-family: var(--font); font-size: 12.5px; padding: 4px 8px; border: 1px solid var(--linia); border-radius: 8px; min-width: 0; }
.taller-text { flex: 1; }
.taller-inline { font-size: 11.5px; display: inline-flex; align-items: center; gap: 4px; }
#p-taller select { font-family: var(--font); font-size: 12px; padding: 4px 6px; border: 1px solid var(--linia); border-radius: 8px; background: var(--blanc); }
.taller-check { display: flex; gap: 8px; align-items: flex-start; font-size: 12.5px; line-height: 1.4; padding: 5px 0; border-top: 1px solid var(--linia); }
.taller-check:first-child { border-top: 0; }
.taller-check .pic { width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; font-weight: 700; flex: none; margin-top: 1px; }
.taller-check.ok .pic { background: var(--menta-clar); color: var(--profund); }
.taller-check.avis .pic { background: var(--ocre-clar); color: var(--ocre); }
.taller-check.mal .pic { background: var(--error-clar); color: var(--error); }
.taller-check.info .pic { background: var(--paper); color: var(--pissarra); }
.taller-opcio { display: flex; align-items: center; gap: 8px; font-size: 12.5px; margin: 6px 0; flex-wrap: wrap; }
.taller-opcio > span:first-child { min-width: 62px; font-weight: 600; color: var(--pissarra); }
.taller-opcio input[type=range] { flex: 1; min-width: 60px; }
.taller-opcio input[type=number] { font-family: var(--mono); font-size: 11.5px; padding: 2px 4px; border: 1px solid var(--linia); border-radius: 6px; }
.taller-lam { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; font-size: 12px; }
@media (max-width: 1100px) {
  .taller-cos { grid-template-columns: 300px minmax(0, 1fr); }
  .taller-panell { grid-column: 1 / -1; padding-left: 18px; }
}
@media (max-width: 760px) {
  .taller-cos { grid-template-columns: 1fr; }
  .taller-rail, .taller-panell, .taller-visor { padding-left: 16px; padding-right: 16px; }
}

/* Tu taller · cotas dibujadas sobre el visor y ayuda del ratón */
#taller-cotes, .taller-dims { pointer-events: none; }
.taller-dims { z-index: 3; }
.taller-ajuda { position: absolute; left: 14px; top: 12px; z-index: 4; font-size: 11.5px; color: var(--pissarra); background: rgba(255,255,255,.85); border-radius: 999px; padding: 3px 10px; pointer-events: none; }
.taller-ajuda:empty { display: none; }
.taller-visor .visor-card canvas#taller-gl.movent { cursor: move; }
.taller-alinea { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 4px; }
.taller-alinea .btn { padding: 3px 9px; font-size: 11.5px; }
.taller-malla { font-size: 12px; color: var(--pissarra); margin: 6px 0; line-height: 1.4; }

/* Tu taller · paramétrico y croquis */
.taller-fx { border: 1px solid var(--linia); background: var(--blanc); color: var(--pissarra); border-radius: 6px; font: italic 700 12px Georgia, serif; width: 22px; height: 22px; cursor: pointer; padding: 0; flex: none; }
.taller-fx[aria-pressed="true"] { background: var(--menta-clar); color: var(--profund); border-color: var(--verd); }
.taller-expr { font-family: var(--mono); font-size: 11.5px; padding: 3px 6px; border: 1px solid var(--verd); border-radius: 6px; background: var(--menta-clar); min-width: 0; flex: 1; color: var(--profund); }
.taller-expr.mal { border-color: var(--error); background: var(--error-clar); color: var(--error); }
.taller-params .p-cap .btn { padding: 2px 9px; font-size: 11.5px; }
.taller-param { display: flex; align-items: center; gap: 5px; margin: 4px 0; font-size: 12px; }
.taller-param input[type=text] { min-width: 0; }
.taller-param input[data-param-nom] { width: 78px; font-family: var(--mono); font-size: 11.5px; padding: 3px 6px; border: 1px solid var(--linia); border-radius: 6px; }
.taller-param input.mal { border-color: var(--error); }
.taller-param b { min-width: 40px; text-align: right; color: var(--profund); }
.taller-param .mini { border: 0; background: transparent; cursor: pointer; color: var(--pissarra); font-size: 11px; }
.taller-errors:empty { display: none; }
.taller-error { font-size: 11.5px; color: var(--error); margin-top: 4px; }
.taller-croquis { display: block; width: 100%; height: auto; border: 1px solid var(--linia); border-radius: 10px; touch-action: none; cursor: crosshair; margin-top: 4px; }
.taller-croquis:focus-visible { outline: 2px solid var(--menta); }
.taller-croquis-barra .btn { padding: 3px 9px; font-size: 11.5px; }
.taller-punt { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 12px; margin: 6px 0; }
.taller-punt label { display: inline-flex; align-items: center; gap: 3px; font-family: var(--mono); font-size: 11.5px; }
.taller-punt input { width: 64px; }
.taller-punt .mini { border: 0; background: transparent; cursor: pointer; color: var(--pissarra); }
.taller-visor .visor-card canvas#taller-gl.girant { cursor: grab; }

/* Tu taller · restricciones del croquis y parámetros con rango */
.taller-restr-btns .btn { padding: 2px 8px; font-size: 11px; }
.taller-restr-llista { display: flex; flex-direction: column; gap: 3px; margin: 4px 0; }
.taller-restr { display: flex; align-items: center; gap: 6px; font-size: 11.5px; padding: 2px 6px; border-radius: 6px; background: var(--paper); }
.taller-restr.mal { background: var(--error-clar); color: var(--error); }
.taller-restr .glif { width: 16px; text-align: center; font-weight: 700; color: var(--profund); }
.taller-restr input { width: 70px; flex: none; }
.taller-restr .mini { border: 0; background: transparent; cursor: pointer; color: var(--pissarra); }
.taller-croquis-barra .btn.mal { border-color: var(--error); color: var(--error); }
.taller-param-rang { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: 11px; margin: 0 0 4px 8px; }
.taller-param-rang input[type=number] { width: 54px; font-family: var(--mono); font-size: 11px; padding: 2px 4px; border: 1px solid var(--linia); border-radius: 6px; }
.taller-param-rang input[type=text] { flex: 1; min-width: 80px; font-size: 11px; padding: 2px 6px; border: 1px solid var(--linia); border-radius: 6px; }
.taller-param-slider { display: flex; align-items: center; gap: 8px; margin: 0 0 6px 8px; font-size: 11px; }
.taller-param-slider input { flex: 1; }

/* Tu taller · cantos */
.taller-visor .visor-card canvas#taller-gl.cantos { cursor: crosshair; }
#taller-cantos .taller-opcio input[type=number] { font-family: var(--mono); }

/* Tu taller · tutoriales in situ */
.taller-tut { border-color: var(--menta); background: var(--menta-clar); }
.taller-tut .p-cap b { color: var(--profund); }
.taller-tut-barra { height: 6px; border-radius: 999px; background: rgba(255,255,255,.7); overflow: hidden; margin: 2px 0 8px; }
.taller-tut-barra i { display: block; height: 100%; background: var(--verd); border-radius: 999px; transition: width .3s; }
.taller-tut-text { margin: 0 0 8px; font-size: 13px; line-height: 1.45; }
.taller-pista { outline: 3px solid var(--ocre, #C8841A); outline-offset: 2px; animation: taller-pulsa 1.2s ease-in-out infinite; border-radius: 8px; }
@keyframes taller-pulsa { 0%, 100% { outline-color: var(--ocre, #C8841A); } 50% { outline-color: transparent; } }

/* Tu taller · arcos del croquis */
.taller-arc { margin: 4px 0; gap: 6px; }
.taller-arc .btn { padding: 3px 9px; font-size: 11.5px; }

/* P2j: pestañas de dos croquis (base/tapa, camino/perfil) y estado del croquis */
.taller-croquis-tabs .btn[aria-pressed="true"] { background: var(--verd-fosc, #02604A); color: #fff; }
.taller-croquis-estat { font-size: 11.5px; color: #2C5DA8; margin: 4px 0 2px; font-weight: 600; }
.taller-croquis-estat.be { color: #02604A; }
.taller-croquis-estat.mal { color: #C63D2F; }

/* P2m: dependencias y errores en la lista de piezas */
.taller-peca .taller-dep { display: block; font-size: 10.5px; font-weight: 400; color: #5C6B65; white-space: normal; }
.taller-peca .taller-dep.mal, .taller-peca.mal .nom { color: #C63D2F; }
.taller-peca.mal { box-shadow: inset 3px 0 0 #C63D2F; }

/* P2m·C: paleta de color por pieza, miniaturas de proyectos guardados */
.taller-paleta .taller-color { width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid #B7C4BE; padding: 0; cursor: pointer; font-size: 11px; line-height: 1; color: #5C6B65; background: #fff; }
.taller-paleta .taller-color[aria-pressed="true"] { box-shadow: 0 0 0 2px #fff, 0 0 0 4px #057C5E; }
.taller-mini { width: 40px; height: 30px; object-fit: cover; border-radius: 4px; margin-right: 8px; border: 1px solid #DCE6E1; flex: none; }

/* P3: lista de comprobación de una cápsula (L5) */
.taller-llista-feta { display: flex; flex-direction: column; gap: 6px; margin: 8px 0; }
.llista-pas { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.4; padding: 6px 8px; border-radius: 8px; background: #F4FAF7; cursor: pointer; }
.llista-pas input { margin-top: 3px; flex: none; }
.llista-pas.fet { background: #E3F6EE; color: #02604A; }
.llista-pas.fet span { text-decoration: line-through; text-decoration-color: rgba(2,96,74,.4); }

/* Cápsulas del curso completo vistas desde la prueba gratuita (academy). */
.sess-card.bloqueada{opacity:.68;background:repeating-linear-gradient(135deg,transparent 0 10px,rgba(0,0,0,.025) 10px 12px)}
.sess-card.bloqueada:hover{opacity:.85}