/* Trident Sport · Configuratore maglia — stili (prefisso .tsc per evitare conflitti col tema) */
.tsc{
  --tsc-panel:#fff;--tsc-ink:#10151d;--tsc-muted:#5d6878;--tsc-soft:#8a94a3;
  --tsc-line:#e4e9f1;--tsc-line2:#eef2f7;--tsc-accent:#1463ff;--tsc-accent-press:#0e4fcc;
  --tsc-accent-soft:#e9f0ff;--tsc-hot:#ff5a1f;--tsc-radius:16px;
  --tsc-shadow:0 1px 2px rgba(16,21,29,.04),0 12px 32px -18px rgba(16,21,29,.28);
  font-family:"Inter",system-ui,sans-serif;color:var(--tsc-ink);display:block;margin:26px 0;
}
.tsc *{box-sizing:border-box}
.tsc-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.tsc-head h3{font-family:"Archivo",sans-serif;font-weight:800;font-size:18px;margin:0 auto 0 0;letter-spacing:.2px}
.tsc-seg{display:inline-flex;background:var(--tsc-line2);border-radius:11px;padding:4px;gap:4px}
.tsc-seg button{border:0;background:transparent;cursor:pointer;font-family:"Archivo",sans-serif;font-weight:700;font-size:13px;color:var(--tsc-muted);padding:9px 18px;border-radius:8px;transition:.18s}
.tsc-seg button.on{background:#fff;color:var(--tsc-ink);box-shadow:var(--tsc-shadow)}

.tsc-grid{display:grid;grid-template-columns:1fr 360px;gap:18px;align-items:start}
@media(max-width:860px){.tsc-grid{grid-template-columns:1fr}}

.tsc-stage{background:var(--tsc-panel);border:1px solid var(--tsc-line);border-radius:var(--tsc-radius);box-shadow:var(--tsc-shadow);padding:20px;position:relative}
.tsc-stage-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.tsc-stage-head .lbl{font-family:"Archivo",sans-serif;font-weight:700;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--tsc-soft)}
.tsc-ghost{border:1px solid var(--tsc-line);background:#fff;color:var(--tsc-muted);cursor:pointer;font-weight:600;font-size:12px;padding:8px 12px;border-radius:9px}
.tsc-ghost:hover{border-color:var(--tsc-accent);color:var(--tsc-accent)}

.tsc-art{position:relative;width:min(100%,460px);aspect-ratio:1/1;margin:0 auto;container-type:size;user-select:none;touch-action:none}
.tsc-art .tsc-jersey{position:absolute;inset:0;width:100%;height:100%}
.tsc-jersey .fabric{fill:#e7ebf1}.tsc-jersey .shade{fill:#d7dde6}.tsc-jersey .stroke{fill:none;stroke:#c2cad6;stroke-width:.8}.tsc-jersey .collar{fill:#cdd5e0}
img.tsc-jersey{object-fit:contain}
@font-face{font-family:"Blacksword";src:url("fonts/Blacksword.woff") format("woff");font-display:swap}
.tsc-layer{position:absolute;inset:0}
.tsc-node{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);cursor:grab;touch-action:none;border-radius:7px;display:grid;place-items:center;text-align:center;outline:1.5px dashed transparent;outline-offset:5px}
.tsc-node:hover,.tsc-node.active{outline-color:var(--tsc-accent)}
.tsc-node:active{cursor:grabbing}
.tsc-node .grip{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:var(--tsc-accent);color:#fff;font-size:9px;font-weight:700;padding:2px 7px;border-radius:6px;opacity:0;transition:.12s;white-space:nowrap;pointer-events:none}
.tsc-node:hover .grip,.tsc-node.active .grip{opacity:1}
.tsc-node.text{color:#16202c;font-size:calc(var(--s,7)*1cqw);line-height:1.12;font-weight:700;padding:2px 6px;white-space:pre;text-align:center;text-shadow:0 1px 0 rgba(255,255,255,.35)}
.tsc-node.logo{width:calc(var(--s,22)*1cqw)}
.tsc-node.logo img{width:100%;display:block;pointer-events:none}
.tsc-hint{text-align:center;color:var(--tsc-soft);font-size:12px;margin-top:12px}

.tsc-panel{background:var(--tsc-panel);border:1px solid var(--tsc-line);border-radius:var(--tsc-radius);box-shadow:var(--tsc-shadow);overflow:hidden}
.tsc-acc{border-bottom:1px solid var(--tsc-line2)}.tsc-acc:last-child{border-bottom:0}
.tsc-acc-head{display:flex;align-items:center;gap:12px;padding:14px 16px}
.tsc-acc-head .ttl{font-family:"Archivo",sans-serif;font-weight:700;font-size:14px;flex:1}
.tsc-acc-head .ttl small{display:block;font-weight:500;color:var(--tsc-soft);font-size:11px;margin-top:1px;font-family:"Inter",sans-serif}
.tsc-acc-head .ptag{font-family:"Archivo",sans-serif;font-weight:700;font-size:12px;color:var(--tsc-hot);background:#fff3ee;padding:3px 9px;border-radius:20px}
.tsc-sw{position:relative;width:42px;height:24px;flex:none}
.tsc-sw input{opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.tsc-sw .track{position:absolute;inset:0;background:#d4dbe5;border-radius:20px;transition:.2s;pointer-events:none}
.tsc-sw .track::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;background:#fff;border-radius:50%;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.tsc-sw input:checked+.track{background:var(--tsc-accent)}
.tsc-sw input:checked+.track::after{transform:translateX(18px)}
.tsc-acc-body{display:none;padding:2px 16px 16px}
.tsc-acc.open .tsc-acc-body{display:block}
.tsc-field{margin-top:12px}
.tsc-field>label{display:block;font-size:11.5px;font-weight:600;color:var(--tsc-muted);margin-bottom:6px}
.tsc-input,.tsc-select{width:100%;border:1px solid var(--tsc-line);border-radius:10px;padding:11px 12px;font-family:"Inter",sans-serif;font-size:14px;color:var(--tsc-ink);background:#fbfcfe}
.tsc-input:focus,.tsc-select:focus{outline:none;border-color:var(--tsc-accent);background:#fff;box-shadow:0 0 0 3px var(--tsc-accent-soft)}
.tsc-chips{display:flex;gap:8px;flex-wrap:wrap}
.tsc-chip{width:26px;height:26px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--tsc-line);cursor:pointer}
.tsc-chip.on{box-shadow:0 0 0 2px var(--tsc-accent);transform:scale(1.08)}
.tsc-swatch{position:relative;width:26px;height:26px}
.tsc-swatch input{position:absolute;inset:0;opacity:0;cursor:pointer}
.tsc-swatch .tsc-chip{background:conic-gradient(red,orange,yellow,lime,cyan,blue,magenta,red)}
.tsc input[type=range]{-webkit-appearance:none;width:100%;height:5px;border-radius:5px;background:var(--tsc-line)}
.tsc input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--tsc-accent);cursor:pointer;border:3px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.25)}
.tsc-upload{border:1.5px dashed var(--tsc-line);border-radius:11px;padding:15px;text-align:center;cursor:pointer;color:var(--tsc-muted);font-size:13px}
.tsc-upload:hover{border-color:var(--tsc-accent);color:var(--tsc-accent);background:#fbfcff}
.tsc-upload input{display:none}
.tsc-prev{display:flex;align-items:center;gap:11px;margin-top:11px;padding:9px;border:1px solid var(--tsc-line);border-radius:10px;background:#fbfcfe}
.tsc-prev img{width:38px;height:38px;object-fit:contain;background:#fff;border-radius:7px;border:1px solid var(--tsc-line)}
.tsc-prev .nm{font-size:12.5px;flex:1;color:var(--tsc-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tsc-prev button{border:0;background:#fdeceb;color:#d23b29;font-weight:600;font-size:12px;padding:6px 10px;border-radius:7px;cursor:pointer}
.tsc-sum{margin-top:18px}
.tsc-sumlines{padding:14px 16px}
.tsc-sline{display:flex;justify-content:space-between;font-size:13.5px;padding:6px 0;color:var(--tsc-muted)}
.tsc-sline.base{color:var(--tsc-ink);font-weight:500}.tsc-sline .x{color:var(--tsc-hot);font-weight:600}
.tsc-sline.muted{color:var(--tsc-soft);font-style:italic}
.tsc-div{height:1px;background:var(--tsc-line2);margin:6px 0}
.tsc-total{display:flex;justify-content:space-between;align-items:baseline;padding:14px 16px;border-top:1px solid var(--tsc-line2);background:#fbfcfe}
.tsc-total .lab{font-family:"Archivo",sans-serif;font-weight:700;font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--tsc-muted)}
.tsc-total .amt{font-family:"Archivo",sans-serif;font-weight:800;font-size:25px}
.tsc-total .amt .cur{font-size:15px;color:var(--tsc-soft)}
.tsc-opt-row{padding:14px 16px;border-bottom:1px solid var(--tsc-line2)}
.tsc-opt-row:last-child{border-bottom:0}
.tsc-opt-row .ol{font-family:"Archivo",sans-serif;font-weight:700;font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--tsc-muted);margin-bottom:9px}
.tsc-seg2{display:flex;gap:8px}
.tsc-seg2 button{flex:1;border:1px solid var(--tsc-line);background:#fbfcfe;color:var(--tsc-muted);cursor:pointer;font-family:"Inter",sans-serif;font-weight:600;font-size:13px;padding:11px 8px;border-radius:10px;transition:.15s}
.tsc-seg2 button:hover{border-color:var(--tsc-accent);color:var(--tsc-accent)}
.tsc-seg2 button.on{border-color:var(--tsc-accent);background:var(--tsc-accent-soft);color:var(--tsc-accent-press)}
.tsc-seg2 .badge{display:inline-block;margin-left:5px;font-size:10px;font-weight:800;color:var(--tsc-hot)}
.tsc-sline.cfg{color:var(--tsc-soft)}
.tsc-sline.cfg span:last-child{color:var(--tsc-ink);font-weight:500}

/* loghi multipli */
.tsc-logo-card{border:1px solid var(--tsc-line);border-radius:12px;padding:12px 13px;margin-top:10px;background:#fbfcfe}
.tsc-logo-card:first-of-type{margin-top:4px}
.tsc-logo-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}
.tsc-logo-head .ln{font-family:"Archivo",sans-serif;font-weight:700;font-size:13px}
.tsc-rm{border:0;background:#fdeceb;color:#d23b29;font-weight:600;font-size:12px;padding:6px 10px;border-radius:7px;cursor:pointer}
.tsc-addlogo{width:100%;margin-top:12px;border:1.5px dashed var(--tsc-line);background:#fff;color:var(--tsc-accent);font-family:"Inter",sans-serif;font-weight:600;font-size:13px;padding:11px;border-radius:11px;cursor:pointer;transition:.15s}
.tsc-addlogo:hover{border-color:var(--tsc-accent);background:var(--tsc-accent-soft)}

/* textarea testo su 2 righe */
.tsc-text2{resize:none;line-height:1.4;font-family:"Inter",sans-serif}

/* Brush Script: usa il font di sistema "Brush Script MT" (Windows/Mac);
   se carichi un file webfont in fonts/BrushScript.woff2 viene usato quello. */
@font-face{
  font-family:"Brush Script";
  src:url("fonts/BrushScript.woff2") format("woff2"),
      local("Brush Script MT"),local("BrushScriptMT"),local("Brush Script Std");
  font-display:swap;
}
