/* ============================================================
   TEMPA REKLAM — Tabela Tasarım Modülü (3D tabela + 2D cam giydirme)
   Panel solda, sahne sağda; telefonda sahne üstte, panel altta.
   ============================================================ */
.tsm{
  --tsm-tr:#e67e22; --tsm-tr2:#cf6d17;
  --tsm-ant:#1a1e21; --tsm-ant2:#2d3436;
  --tsm-zemin:#f4f4f2; --tsm-kart:#ffffff; --tsm-cizgi:#e4e3de;
  --tsm-yazi:#1a1e21; --tsm-ikincil:#636e72; --tsm-sahne:#20252a;
  --tsm-r:10px;
  font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;
  color:var(--tsm-yazi); background:var(--tsm-zemin);
  max-width:1440px; margin:0 auto; padding:16px max(16px, env(safe-area-inset-right, 0px)) 24px max(16px, env(safe-area-inset-left, 0px));
  box-sizing:border-box;
}
.tsm *,.tsm *::before,.tsm *::after{box-sizing:border-box}
.tsm [hidden]{display:none!important}

/* Üst şerit: başlık + mod seçimi */
.tsm-ust{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.tsm-ust h1{font-size:22px;font-weight:800;margin:0;letter-spacing:-.2px;text-wrap:balance}
.tsm-ust p{margin:2px 0 0;font-size:13px;color:var(--tsm-ikincil)}
.tsm-mod{display:inline-flex;background:var(--tsm-kart);border:1px solid var(--tsm-cizgi);border-radius:12px;padding:4px;gap:4px}
.tsm-mod button{border:0;background:none;font:inherit;font-size:13px;font-weight:700;padding:9px 16px;border-radius:9px;cursor:pointer;color:var(--tsm-ikincil);display:flex;align-items:center;gap:7px}
.tsm-mod button.ak{background:var(--tsm-ant);color:#fff}
.tsm-mod button small{font-weight:600;opacity:.7;font-size:11px}

.tsm-govde{display:grid;grid-template-columns:340px minmax(0,1fr);gap:16px;align-items:start}

/* Sol panel */
.tsm-panel{background:var(--tsm-kart);border:1px solid var(--tsm-cizgi);border-radius:14px;max-height:calc(100vh - 150px);overflow:auto;position:sticky;top:110px}
.tsm-bolum{padding:14px 16px;border-bottom:1px solid var(--tsm-cizgi);display:flex;flex-direction:column;gap:10px}
.tsm-bolum:last-child{border-bottom:0}
.tsm-bolum h3{margin:0;font-size:11px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--tsm-ikincil);display:flex;align-items:center;gap:6px}
.tsm-bolum h3 i{color:var(--tsm-tr);font-size:15px}
.tsm-alan{display:flex;flex-direction:column;gap:5px;min-width:0}
.tsm-alan>label,.tsm-etiket{font-size:12px;font-weight:600;color:var(--tsm-yazi)}
.tsm-alan small{font-size:11px;color:var(--tsm-ikincil)}
.tsm-ikili{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.tsm-uclu{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.tsm input[type=text],.tsm input[type=number],.tsm select,.tsm textarea{
  width:100%;border:1.5px solid #dcdbd4;border-radius:9px;padding:8px 10px;font:inherit;font-size:13px;color:var(--tsm-yazi);background:#fff;outline:none;min-width:0
}
.tsm textarea{resize:vertical;min-height:58px;font-size:15px;font-weight:600}
.tsm input:focus,.tsm select:focus,.tsm textarea:focus{border-color:var(--tsm-tr)}
.tsm-birim{position:relative}
.tsm-birim input{padding-right:34px}
.tsm-birim::after{content:attr(data-birim);position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:11px;color:var(--tsm-ikincil);pointer-events:none}
.tsm-kutu{display:flex;align-items:center;gap:8px;font-size:12.5px;cursor:pointer}
.tsm-kutu input{accent-color:var(--tsm-tr);width:16px;height:16px}

/* Renk kutucukları */
.tsm-renkler{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.tsm-renkler button{width:26px;height:26px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #cfcdc6;cursor:pointer;padding:0}
.tsm-renkler button.ak{box-shadow:0 0 0 2px var(--tsm-tr)}
.tsm-renkler button.dn{background:linear-gradient(135deg,#16181b 50%,#fff 50%)!important}
.tsm-renkler input[type=color]{width:30px;height:28px;border:0;padding:0;background:none;cursor:pointer}
.tsm-renk-ad{font-size:11px;color:var(--tsm-ikincil);min-height:14px}

/* Segment düğmeleri */
.tsm-seg{display:inline-flex;border:1px solid var(--tsm-cizgi);border-radius:9px;overflow:hidden;background:#fff}
.tsm-seg button{border:0;background:none;font:inherit;font-size:12px;font-weight:600;padding:7px 11px;cursor:pointer;color:var(--tsm-ikincil);display:flex;align-items:center;gap:5px}
.tsm-seg button+button{border-left:1px solid var(--tsm-cizgi)}
.tsm-seg button.ak{background:var(--tsm-ant);color:#fff}

.tsm-dugme{border:1.5px solid #dcdbd4;background:#fff;border-radius:9px;padding:8px 10px;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;color:var(--tsm-yazi)}
.tsm-dugme:hover{border-color:var(--tsm-tr);color:var(--tsm-tr2)}
.tsm-dugme.kucuk{padding:6px 8px;font-size:12px}
.tsm-dugme.sil:hover{border-color:#c0392b;color:#c0392b}
.tsm-araclar{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tsm-bilgi{font-size:12px;color:var(--tsm-ikincil);background:var(--tsm-zemin);border-radius:8px;padding:8px 10px;line-height:1.5}
.tsm-bilgi b{color:var(--tsm-yazi)}

/* Sahne */
.tsm-sahne-kutu{display:flex;flex-direction:column;gap:12px;min-width:0}
.tsm-sahne{position:relative;background:var(--tsm-sahne);border-radius:14px;overflow:hidden;height:calc(100vh - 230px);min-height:420px}
.tsm-sahne canvas{display:block}
#tsm-s3d,#tsm-s2d{position:absolute;inset:0}
#tsm-s3d canvas{width:100%!important;height:100%!important;touch-action:none}
.tsm-yukleniyor{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#cfd3d6;font-size:13px;gap:8px;pointer-events:none}
.tsm-ustbar{position:absolute;left:12px;right:12px;top:12px;display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;pointer-events:none;z-index:2}
.tsm-ustbar>*{pointer-events:auto}
.tsm-cam{background:rgba(20,23,26,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.12);border-radius:11px;padding:4px;display:flex;gap:3px;flex-wrap:wrap}
.tsm-cam button{border:0;background:none;color:rgba(255,255,255,.75);font:inherit;font-size:12px;font-weight:600;padding:7px 10px;border-radius:8px;cursor:pointer;display:flex;align-items:center;gap:5px}
.tsm-cam button:hover{color:#fff}
.tsm-cam button.ak{background:#fff;color:var(--tsm-ant)}
.tsm-cam button.gece.ak{background:#2b3a67;color:#ffe9a8}
.tsm-olcu-cip{position:absolute;left:12px;bottom:12px;z-index:2;background:rgba(20,23,26,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fff;border-radius:10px;padding:8px 12px;font-size:12px;line-height:1.5;font-variant-numeric:tabular-nums;pointer-events:none;max-width:calc(100% - 24px)}
.tsm-olcu-cip b{color:#ffc58f}
.tsm-ipucu{position:absolute;right:12px;bottom:12px;z-index:2;color:rgba(255,255,255,.55);font-size:11px;pointer-events:none}

/* Alt şerit */
.tsm-alt{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--tsm-kart);border:1px solid var(--tsm-cizgi);border-radius:14px;padding:12px 14px;flex-wrap:wrap}
.tsm-ozet{font-size:13px;color:var(--tsm-ikincil);min-width:0;flex:1 1 260px}
.tsm-ozet b{color:var(--tsm-yazi)}
.tsm-fiyat{border:0;background:var(--tsm-tr);color:#fff;font:inherit;font-size:15px;font-weight:800;padding:13px 22px;border-radius:11px;cursor:pointer;display:flex;align-items:center;gap:8px;box-shadow:0 6px 18px rgba(230,126,34,.35)}
.tsm-fiyat:hover{background:var(--tsm-tr2)}
.tsm-fiyat:disabled{opacity:.6;cursor:wait}
.tsm-fiyat small{display:block;font-size:11px;font-weight:600;opacity:.85}

/* 3D öğe listesi */
.tsm-ogeler{display:flex;flex-direction:column;gap:6px}
.tsm-oge{display:flex;align-items:center;gap:8px;border:1.5px solid var(--tsm-cizgi);border-radius:9px;padding:7px 8px;cursor:pointer;background:#fff;text-align:left;font:inherit;width:100%}
.tsm-oge.ak{border-color:var(--tsm-tr);background:#fff8f1}
.tsm-oge-no{width:22px;height:22px;border-radius:6px;background:var(--tsm-ant);color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none}
.tsm-oge.ak .tsm-oge-no{background:var(--tsm-tr)}
.tsm-oge-ad{flex:1;min-width:0;display:flex;flex-direction:column}
.tsm-oge-ad b{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tsm-oge-ad small{font-size:11px;color:var(--tsm-ikincil);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tsm-oge-btn{border:0;background:none;color:var(--tsm-ikincil);cursor:pointer;padding:4px;border-radius:6px;font-size:14px;line-height:1}
.tsm-oge-btn:hover{background:var(--tsm-zemin);color:var(--tsm-yazi)}
.tsm-secili-bolum{background:#fffaf5}

/* 2D seçili öğe */
.tsm-secili-yok{font-size:12px;color:var(--tsm-ikincil)}

/* Gönderim önizleme (yalnızca sitenin teklif formu yoksa) */
.tsm-demo{position:fixed;inset:0;background:rgba(10,12,14,.6);z-index:9999;display:flex;align-items:center;justify-content:center;padding:16px}
.tsm-demo-kutu{background:#fff;border-radius:16px;max-width:760px;width:100%;max-height:90vh;overflow:auto;padding:20px;display:flex;flex-direction:column;gap:12px}
.tsm-demo-kutu h2{margin:0;font-size:18px}
.tsm-demo-gorseller{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.tsm-demo-gorseller img{width:100%;border-radius:10px;display:block}
.tsm-demo-kutu pre{white-space:pre-wrap;font:inherit;font-size:12.5px;background:var(--tsm-zemin);border-radius:10px;padding:12px;margin:0}

@media (max-width:900px){
  .tsm-govde{grid-template-columns:minmax(0,1fr)}
  .tsm-sahne-kutu{order:-1}
  .tsm-sahne{height:58vh;min-height:340px}
  .tsm-panel{position:static;max-height:none}
  .tsm-ipucu{display:none}
}
@media (max-width:480px){
  .tsm-mod{width:100%}
  .tsm-mod button{flex:1;justify-content:center;padding:9px 8px}
  .tsm-mod button small{display:none}
  .tsm-fiyat{width:100%;justify-content:center}
  .tsm-demo-gorseller{grid-template-columns:1fr}
  .tsm-olcu-cip{font-size:10.5px;padding:6px 9px}
  .tsm-cam button{padding:6px 8px;font-size:11.5px}
}
@media (prefers-reduced-motion:reduce){.tsm *{transition:none!important}}

/* Görselli seçici (harf modeli / zemin) */
.tsm-secici{position:relative;flex:1;min-width:0}
.tsm-secici-dugme{width:100%;display:flex;align-items:center;gap:10px;padding:6px 10px 6px 6px;border:1px solid var(--tsm-cizgi);border-radius:9px;background:#fff;font:inherit;font-size:13px;text-align:left;cursor:pointer;color:var(--tsm-yazi)}
.tsm-secici.acik .tsm-secici-dugme{border-color:var(--tsm-tr)}
.tsm-ok{margin-left:auto;color:var(--tsm-ikincil)}
.tsm-secici-liste{margin-top:6px;border:1px solid var(--tsm-cizgi);border-radius:9px;background:#fff;max-height:340px;overflow:auto;padding:4px}
.tsm-secici-grup{font-size:10px;font-weight:800;letter-spacing:.7px;text-transform:uppercase;color:var(--tsm-ikincil);padding:8px 8px 4px}
.tsm-secici-oge{display:flex;align-items:center;gap:10px;padding:5px 6px;border-radius:7px;cursor:pointer;font-size:13px}
.tsm-secici-oge:hover{background:#f6f4ef}
.tsm-secici-oge.ak{background:#fdf0e3}
.tsm-secici-ad{min-width:0;line-height:1.25}
.tsm-secici-ad b{display:block;font-size:11px;color:var(--tsm-tr2);letter-spacing:.3px}
.tsm-kucuk{flex:none;width:44px;height:44px;border-radius:6px;overflow:hidden;background:#eceae5;display:flex;align-items:center;justify-content:center}
.tsm-kucuk img{width:100%;height:100%;object-fit:cover;display:block}
.tsm-gorsel-yok{font-size:9px;font-weight:700;color:#9a9893;text-align:center;line-height:1.15}
.tsm-gorsel-yok small{font-weight:500;font-size:8px}
.tsm-gorsel-pop{position:fixed;z-index:9999;width:280px;background:#fff;border:1px solid var(--tsm-cizgi);border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.18);overflow:hidden;pointer-events:none}
.tsm-pop-gorsel{height:200px;background:#eceae5;display:flex;align-items:center;justify-content:center}
.tsm-pop-gorsel img{width:100%;height:100%;object-fit:cover}
.tsm-pop-gorsel .tsm-gorsel-yok{font-size:14px}
.tsm-pop-gorsel .tsm-gorsel-yok small{font-size:11px}
.tsm-pop-yazi{padding:10px 12px;font-size:13px;line-height:1.35}
.tsm-pop-yazi small{display:block;color:var(--tsm-ikincil);font-size:12px;margin-top:4px}

/* 2D hazır şablon düğmeleri */
.tsm-sablonlar{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.tsm-sablon{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 4px 8px;border:1px solid var(--tsm-cizgi);border-radius:10px;background:#fff;font:inherit;font-size:12px;font-weight:700;cursor:pointer;color:var(--tsm-yazi)}
.tsm-sablon small{font-weight:500;font-size:10px;color:var(--tsm-ikincil)}
.tsm-sablon.ak{border-color:var(--tsm-tr);background:#fdf0e3}
.tsm-sablon-ikon{width:26px;height:40px;position:relative;display:block}
.tsm-sablon-ikon.rollup{background:linear-gradient(var(--tsm-tr) 0 30%,#fff 30%);border:1.5px solid #7d8389;border-bottom-width:5px;border-radius:2px}
.tsm-sablon-ikon.xbanner{background:linear-gradient(var(--tsm-tr) 0 30%,#fff 30%);border:1.5px solid #7d8389;height:32px;margin-bottom:8px}
.tsm-sablon-ikon.xbanner::after{content:"";position:absolute;left:2px;right:2px;bottom:-9px;height:8px;border-left:1.5px solid #7d8389;border-right:1.5px solid #7d8389;transform:perspective(20px) rotateX(-30deg)}
.tsm-sablon-ikon.olta{border-left:2px solid #7d8389}
.tsm-sablon-ikon.olta::after{content:"";position:absolute;left:0;top:0;width:22px;height:36px;background:var(--tsm-tr);border-radius:0 14px 4px 0 / 0 12px 30px 0}

/* Sayfa altı: yönlendirmeler ve galeriler */
.tsm-yonlendir{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;margin-top:22px}
.tsm-ykart{display:flex;align-items:center;gap:14px;justify-content:space-between;padding:16px 18px;background:var(--tsm-ant);color:#fff;border-radius:14px;text-decoration:none;font-size:13px;line-height:1.4}
.tsm-ykart b{display:block;font-size:15px;margin-bottom:2px}
.tsm-ykart span{color:#c9cdd0}
.tsm-ykart span b{color:#fff}
.tsm-ykart em{font-style:normal;font-weight:700;color:var(--tsm-tr);white-space:nowrap;font-size:13px}
.tsm-galeri-bolum{margin-top:30px}
.tsm-galeri-bas h2{margin:0;font-size:20px;font-weight:800}
.tsm-galeri-bas p{margin:4px 0 12px;font-size:13px;color:var(--tsm-ikincil)}
.tsm-galeri-grup{margin:16px 0 8px;font-size:11px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--tsm-ikincil)}
.tsm-galeri{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.tsm-gkart{background:var(--tsm-kart);border:1px solid var(--tsm-cizgi);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.tsm-gkart-gorsel{aspect-ratio:4/3;background:#eceae5;display:flex;align-items:center;justify-content:center}
.tsm-gkart-gorsel img{width:100%;height:100%;object-fit:cover;display:block}
.tsm-gkart-gorsel .tsm-gorsel-yok{font-size:13px}
.tsm-gkart-gorsel .tsm-gorsel-yok small{font-size:11px}
.tsm-gkart-yazi{padding:10px 12px 6px;flex:1}
.tsm-gkart-yazi b{font-size:11px;color:var(--tsm-tr2);letter-spacing:.3px}
.tsm-gkart-yazi h3{margin:2px 0 4px;font-size:14px;line-height:1.3}
.tsm-gkart-yazi p{margin:0;font-size:12px;color:var(--tsm-ikincil);line-height:1.4}
.tsm-gkart .tsm-dugme{margin:6px 12px 12px}
@media (max-width:600px){.tsm-galeri{grid-template-columns:1fr 1fr;gap:8px}.tsm-gkart-yazi p{display:none}.tsm-ykart{flex-direction:column;align-items:flex-start}}
.tsm-sablon-ikon.ayakli{height:26px;margin-bottom:14px;background:linear-gradient(var(--tsm-tr) 0 35%,#fff 35%);border:2px solid #7d8389}
.tsm-sablon-ikon.ayakli::after{content:"";position:absolute;left:3px;right:3px;top:24px;height:14px;border-left:2px solid #7d8389;border-right:2px solid #7d8389}
.tsm-sablon-ikon.arac{width:52px;height:24px;margin:8px 0;background:var(--tsm-tr);border-radius:4px 12px 4px 4px}
.tsm-sablon-ikon.arac::before,.tsm-sablon-ikon.arac::after{content:"";position:absolute;bottom:-5px;width:11px;height:11px;border-radius:50%;background:#2d3436;border:2px solid #fff}
.tsm-sablon-ikon.arac::before{left:7px}.tsm-sablon-ikon.arac::after{right:7px}

/* Teklif İste açılır menüsü */
.tsm-teklif{position:relative}
.tsm-fiyat .tsm-ok{color:#fff;margin-left:6px;font-size:13px}
.tsm-teklif-menu{position:absolute;right:0;bottom:calc(100% + 8px);z-index:20;width:320px;max-width:calc(100vw - 32px);background:#fff;border:1px solid var(--tsm-cizgi);border-radius:12px;box-shadow:0 14px 36px rgba(0,0,0,.18);padding:6px;display:flex;flex-direction:column;gap:4px}
.tsm-teklif-menu button{display:flex;align-items:center;gap:12px;text-align:left;border:0;background:none;font:inherit;padding:10px;border-radius:9px;cursor:pointer;color:var(--tsm-yazi)}
.tsm-teklif-menu button:hover{background:#f6f4ef}
.tsm-teklif-menu b{display:block;font-size:14px}
.tsm-teklif-menu small{display:block;font-size:12px;color:var(--tsm-ikincil);line-height:1.35}
.tsm-kanal{flex:none;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:13px}
.tsm-kanal.wa{background:#25d366}.tsm-kanal.ep{background:var(--tsm-ant)}
.tsm-wa-kutu p{margin:0;font-size:14px;line-height:1.5}
a.tsm-wa-ac{background:#25d366;box-shadow:0 6px 18px rgba(37,211,102,.35);justify-content:center;text-decoration:none}
a.tsm-wa-ac:hover{background:#1eb757}
@media (max-width:900px){.tsm-teklif{width:100%}.tsm-teklif-menu{left:0;right:auto;width:100%}}

/* Kaplama butonları (test) */
.tsm-kaplama{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.tsm-kaplama button{display:flex;align-items:center;gap:8px;padding:7px 9px;border:1px solid #dcdcd8;border-radius:9px;background:#fff;font:inherit;font-size:13px;cursor:pointer;text-align:left;color:#1a1e21}
.tsm-kaplama button span{width:22px;height:22px;border-radius:50%;flex:none;border:1px solid rgba(0,0,0,.15)}
.tsm-kaplama button.ak{border-color:#e67e22;box-shadow:0 0 0 2px rgba(230,126,34,.25);font-weight:600}

/* Canva gibi doğrudan düzenleme: seçili öğe kutusu ve köşe tutamakları */
.tsm-secim{position:absolute;z-index:3;border:1.5px solid #e67e22;border-radius:3px;box-shadow:0 0 0 1px rgba(255,255,255,.55);pointer-events:none}
.tsm-secim i{position:absolute;width:16px;height:16px;background:#fff;border:2.5px solid #e67e22;border-radius:50%;pointer-events:auto;touch-action:none;box-shadow:0 1px 4px rgba(0,0,0,.3)}
.tsm-secim-olcu{position:absolute;left:50%;top:100%;transform:translate(-50%,8px);background:#e67e22;color:#fff;font-size:11px;font-weight:700;padding:3px 8px;border-radius:6px;white-space:nowrap}
@media (pointer:coarse){.tsm-secim i{width:24px;height:24px;margin:-4px}}
.tsm-sablon-ikon.fener{width:34px;height:40px;border-left:2px solid #7d8389}
.tsm-sablon-ikon.fener::before{content:"";position:absolute;left:0;top:5px;width:12px;height:2px;background:#7d8389}
.tsm-sablon-ikon.fener::after{content:"";position:absolute;left:8px;top:9px;width:24px;height:24px;border-radius:50%;background:var(--tsm-tr);border:2px solid #7d8389;box-sizing:border-box}
.tsm-segment{display:flex;gap:4px;background:#eef0f2;border-radius:8px;padding:3px}
.tsm-segment button{flex:1;border:0;background:transparent;padding:7px 6px;border-radius:6px;font:inherit;font-size:13px;cursor:pointer;color:#2d3436}
.tsm-segment button.ak{background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.15);color:var(--tsm-tr);font-weight:600}