/* T-Shirt-Konfigurator: bewusst nur Schwarz, Weiß und neutrale Grautöne */
.customizer-page{background:#fff;color:#111}
.customizer-header{background:#000;border-bottom:1px solid #222}
.customizer-header .nav a{color:#fff}
.customizer-header .nav a.active,.customizer-header .nav a:hover{color:#fff;border-color:#fff}
.customizer-back{color:#fff;border:1px solid #fff;padding:8px 13px;border-radius:3px;font-size:13px}
.customizer-hero{background:#000;color:#fff;padding:58px 0 52px}
.customizer-hero span,.panel-heading>div>span{font-size:12px;letter-spacing:2px;font-weight:700}
.customizer-hero h1{font-family:Georgia,serif;font-size:48px;font-weight:400;margin:7px 0 12px}
.customizer-hero p{max-width:650px;color:#ddd;margin:0;font-size:17px}
.customizer-section{padding:38px 0 65px;background:#fff}
.customizer-layout{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(360px,.88fr);gap:28px;align-items:start}
.preview-panel,.controls-panel{border:1px solid #ddd;background:#fff}
.preview-panel{padding:22px;position:sticky;top:105px}
.panel-heading{display:flex;justify-content:space-between;gap:18px;align-items:start;border-bottom:1px solid #ddd;padding-bottom:16px}
.panel-heading h2{font-size:21px;margin:4px 0 0}
.outline-btn,.reset-btn{background:#fff;color:#111;border:1px solid #111;padding:9px 12px;cursor:pointer;border-radius:3px;font-weight:700;font-size:12px}
.canvas-wrap{display:grid;place-items:center;background:#f5f5f5;margin-top:18px;min-height:520px;overflow:hidden}
#shirtCanvas{width:min(100%,620px);height:auto;display:block}
.preview-hint{font-size:12px;color:#666;margin:13px 2px 0}
.control-card{padding:22px;border-bottom:1px solid #ddd}
.control-card:last-child{border-bottom:0}
.step{display:inline-grid;place-items:center;border:1px solid #111;width:28px;height:28px;border-radius:50%;font-size:11px;font-weight:700;margin-bottom:8px}
.control-card h2{font-size:19px;margin:0 0 17px}
.control-card label{font-size:13px}
.field-label{display:block;font-weight:700;margin:18px 0 7px}
.field-label span{font-weight:400;color:#777}
.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.choice{border:1px solid #ccc;padding:11px;display:flex;align-items:center;gap:9px;cursor:pointer}
.choice:has(input:checked){border-color:#000;box-shadow:inset 0 0 0 1px #000}
.choice input{position:absolute;opacity:0}
.choice-swatch{width:25px;height:25px;border:1px solid #111;display:block}
.choice-swatch.white{background:#fff}
.choice-swatch.black{background:#000}
.choice b{font-size:13px}
.controls-panel select,.controls-panel input[type=text],.controls-panel textarea{width:100%;border:1px solid #bbb;background:#fff;color:#111;padding:11px;border-radius:3px;outline:none}
.controls-panel select:focus,.controls-panel input:focus,.controls-panel textarea:focus{border-color:#000}
.upload-box{border:2px dashed #999;min-height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;cursor:pointer;padding:15px}
.upload-box:hover{border-color:#111}
.upload-box input{display:none}
.upload-icon{font-size:28px;line-height:1}
.upload-box strong{margin-top:4px}
.upload-box small{color:#666;margin-top:3px}
.motif-status{font-size:12px;color:#666;margin-top:9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.range-row{display:grid;grid-template-columns:1fr auto;gap:5px 12px;align-items:center;margin:15px 0}
.range-row label{font-weight:700}
.range-row output{font-size:12px}
.range-row input[type=range]{grid-column:1/-1;width:100%;accent-color:#000}
.reset-btn{margin-top:2px}
.whatsapp-btn{width:100%;background:#000;color:#fff;border:1px solid #000;padding:13px 15px;border-radius:3px;cursor:pointer;font-weight:700;margin-top:14px}
.whatsapp-btn:hover{background:#222}
.whatsapp-note{font-size:11px;line-height:1.45;color:#666;margin:10px 0 0}
.customizer-footer{background:#000;color:#fff;padding:22px 0;font-size:12px}
.customizer-footer a{text-decoration:underline}
@media(max-width:900px){
  .customizer-layout{grid-template-columns:1fr}
  .preview-panel{position:static}
  .customizer-header .nav{gap:18px}
}
@media(max-width:650px){
  .customizer-hero{padding:40px 0}
  .customizer-hero h1{font-size:36px}
  .customizer-hero p{font-size:15px}
  .customizer-layout{gap:16px}
  .preview-panel{padding:14px}
  .panel-heading{display:block}
  .outline-btn{margin-top:12px}
  .canvas-wrap{min-height:0}
  .customizer-header .nav{display:none}
  .customizer-header .nav.open{display:flex;position:absolute;top:84px;left:0;right:0;background:#000;flex-direction:column;padding:15px 24px;gap:0;align-items:flex-start}
  .customizer-header .nav.open a{padding:12px 0}
  .customizer-header .menu-toggle{display:block}
}

.editor-actions,.quick-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.secondary-btn{background:#fff;color:#111;border:1px solid #111;padding:9px 11px;cursor:pointer;border-radius:3px;font-weight:700;font-size:12px}
.secondary-btn:hover{background:#111;color:#fff}
.editor-help,.touch-help{font-size:11px;line-height:1.5;color:#666;margin:10px 0 0}
.touch-help{background:#f5f5f5;border:1px solid #ddd;padding:10px;color:#333}
.canvas-wrap{touch-action:none}
#shirtCanvas{touch-action:none;cursor:grab}
#shirtCanvas.dragging{cursor:grabbing}
@media(max-width:650px){
  .editor-actions .secondary-btn,.quick-actions .secondary-btn{flex:1}
}

.preview-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.whatsapp-preview-btn{background:#111;color:#fff}
.whatsapp-preview-btn:hover{background:#333}
@media(max-width:650px){.preview-actions{justify-content:flex-start}.preview-actions .outline-btn{width:100%}}