/* Faz 40.15J-E / 40.15J-E-R1 — tema ÜRÜN SAYFASI (/temalar/<themeId>/; HTML'i core-api sunucu tarafında üretir: theme-product-page.ts;
   istemci iyileştirmesi: theme-detail.js). TicariSoft kurumsal renkleri ve tipografisi (styles.css :root token'ları, pages.css tasarım
   katmanı: --ts-card-radius / --ts-card-line). Üst bölüm: okunur yol, TEK H1, solda büyük kapak + düzenli galeri ızgarası (yatay kaydırma
   YOK), sağda satın alma paneli. Alt bölüm: tek sütun anlatım + yanda kompakt teknik bilgiler; kopuk büyük kutular yerine çizgiyle ayrılan
   bölümler. */
.tdp{background:var(--paper)}
.tdp-top{padding:clamp(22px,3vw,40px) 0 clamp(36px,5vw,64px);background:radial-gradient(900px 380px at 100% 0%,rgba(216,248,111,.18),transparent 62%),linear-gradient(180deg,#f3f6f3,var(--paper))}

/* Yol (breadcrumb): büyük harf/aralık yerine okunur cümle düzeni; son öğe geçerli sayfa. */
.tdp-breadcrumb{margin:0 0 14px}
.tdp-breadcrumb ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:4px 0;font-size:13.5px;line-height:1.5;color:#5f6d68}
.tdp-breadcrumb li{display:inline-flex;align-items:center;min-width:0}
.tdp-breadcrumb li+li:before{content:"/";margin:0 9px;color:#aeb7b3}
.tdp-breadcrumb a{color:#44534e;text-decoration:underline;text-decoration-color:rgba(68,83,78,.35);text-underline-offset:3px}
.tdp-breadcrumb a:hover{color:#4d6a12;text-decoration-color:currentColor}
.tdp-breadcrumb a:focus-visible{outline:3px solid #99b93b;outline-offset:2px;border-radius:4px}
.tdp-breadcrumb [aria-current]{color:var(--ink);font-weight:600;overflow-wrap:anywhere}

.tdp-title{font:800 clamp(30px,4vw,48px)/1.08 var(--display);letter-spacing:-.028em;margin:0 0 clamp(20px,2.6vw,30px);max-width:24ch;overflow-wrap:anywhere;color:var(--ink)}
.tdp-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(300px,.7fr);gap:clamp(24px,3.6vw,52px);align-items:start}
.tdp-media{min-width:0}

/* Kapak: KIRPILMAZ ve BÜYÜTÜLMEZ (contain + kaynak piksel boyutuyla sınırlı max-width/height); sabit 3:2 çerçeve → düzen kayması YOK. */
.tdp-cover{aspect-ratio:3/2;border:1px solid var(--ts-card-line,#dfe5e2);border-radius:var(--ts-card-radius,22px);background:#eef2f0;box-shadow:0 22px 55px rgba(17,38,31,.1)}
.tdp .tdp-cover img{width:100%;height:100%;object-fit:contain;transition:opacity .25s}
.tdp-cover .tsf-img-fallback{font-size:14px;padding:20px;text-align:center}

/* Galeri: kapağın altında sarılan düzenli ızgara (yatay kaydırma çubuğu YOK); küçük resimler 3:2, kırpma yalnızca küçük resimde (oran bozulmaz).
   Faz 40.15J-E-R1 kapanış: 5 yerine 4 sütun (mobille aynı) — tipik 8 görsel (kapak + 7) iki TAM satır olur; 5 sütunda ikinci satır 3 öğeyle
   yarım kalıyor ve sağda boşluk bırakıyordu. */
.tdp-thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:14px}
.tdp-thumb{display:block;width:100%;min-width:0;padding:0;border:2px solid transparent;border-radius:12px;background:#eef2f0;cursor:pointer;overflow:hidden;opacity:.82;transition:opacity .2s,border-color .2s,box-shadow .2s}
.tdp-thumb:hover{opacity:1}
.tdp-thumb.active{border-color:var(--ink);opacity:1;box-shadow:0 6px 16px rgba(17,38,31,.12)}
.tdp-thumb:focus-visible{outline:3px solid #99b93b;outline-offset:2px;opacity:1}
.tdp-thumb-frame{display:block;aspect-ratio:3/2;pointer-events:none}
.tdp-thumb-frame img{display:block;width:100%;height:100%;object-fit:cover}

/* Satın alma paneli */
.tdp-info{min-width:0;display:flex;flex-direction:column;gap:16px;background:#fff;border:1px solid var(--ts-card-line,#dfe5e2);border-radius:var(--ts-card-radius,22px);padding:clamp(20px,2.4vw,30px);box-shadow:0 18px 45px rgba(17,38,31,.06)}
.tdp-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.tdp-category{font-size:11.5px;font-weight:800;letter-spacing:1.6px;text-transform:uppercase;color:#5f6d68;overflow-wrap:anywhere}
.tdp-badge{font-size:12px;font-weight:700;border-radius:999px;padding:4px 12px;white-space:nowrap;border:1px solid #d6ec9a;background:#eef8d2;color:#3f5b36}
.tdp-badge.is-sale{background:#2f6b3f;border-color:#2f6b3f;color:#fff}
.tdp-badge.is-preview{background:#fff4e6;border-color:#f1d3a8;color:#7a4d10}
.tdp-desc{margin:0;color:#44534e;font-size:15.5px;line-height:1.65;overflow-wrap:anywhere}
.tdp-price{display:flex;flex-direction:column;gap:4px;padding:16px 18px;border-radius:16px;background:#f4f8ea;border:1px solid #dce7bc}
.tdp-price p{margin:0}
.tdp-price-label{font-size:11px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:#56692c}
.tdp-price-line{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.tdp-price-amount{font:800 clamp(32px,3.4vw,40px)/1.1 var(--display);letter-spacing:-.02em;color:var(--ink)}
.tdp-price-period{font:700 17px var(--display);color:#44534e}
.tdp-price-vat{font-size:13.5px;font-weight:600;color:#3b4a45}
.tdp-price-note,.tdp-price-unavailable{font-size:13px;line-height:1.55;color:#4f5d58}
.tdp .tdp-price-note{margin-top:4px;padding-top:8px;border-top:1px dashed #d3dfb2}
.tdp-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
.tdp .tdp-actions .button{margin:0;width:100%}
.tdp-buy{min-height:56px;font-size:15.5px}
.tdp-actions .button:focus-visible{outline:3px solid #99b93b;outline-offset:2px}
.tdp-assure{list-style:none;margin:0;padding:0;display:grid;gap:7px;font-size:13px;color:#44534e}
.tdp-assure li{position:relative;padding-left:22px;line-height:1.5}
.tdp-assure li:before{content:"";position:absolute;left:3px;top:.42em;width:9px;height:5px;border-left:2px solid #4d7a2a;border-bottom:2px solid #4d7a2a;transform:rotate(-45deg)}
.tdp-state-box{border:1px solid #f1d3a8;background:#fff8ee;border-radius:16px;padding:16px 18px}
.tdp-state-box strong{display:block;font:700 16px var(--display);margin-bottom:4px;color:#6d4710}
.tdp-state-box p{margin:0;font-size:13.5px;color:#5c4a2c;line-height:1.65}

/* Durum iletileri: bulunamadı / yüklenemedi / eski adresten yönlendirme */
.tdp-message{max-width:640px;background:#fff;border:1px solid var(--ts-card-line,#dfe5e2);border-radius:var(--ts-card-radius,22px);padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;gap:14px}
.tdp-message-title{font:800 clamp(26px,3.2vw,36px)/1.1 var(--display);letter-spacing:-.02em;margin:0}
.tdp-message p{margin:0;color:#44534e}
.tdp-message .tdp-actions{grid-template-columns:auto;justify-content:start}

/* Alt bölümler: tek anlatım sütunu + yanda kompakt teknik bilgiler (masaüstü); mobilde DOM sırası: detaylar → teknik → ürün → SSS → hakkında. */
.tdp-body{padding:clamp(40px,5vw,72px) 0 clamp(56px,7vw,96px);background:#fff;border-top:1px solid var(--line)}
.tdp-body-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,330px);column-gap:clamp(28px,4.5vw,64px);align-items:start}
.tdp-section{min-width:0;grid-column:1;padding:0 0 clamp(28px,3.4vw,40px);margin:0 0 clamp(28px,3.4vw,40px);border-bottom:1px solid #e7ecea}
.tdp-section:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.tdp-s-tech{grid-column:2;grid-row:1 / span 5;position:sticky;top:104px;background:var(--soft);border:1px solid var(--ts-card-line,#dfe5e2);border-radius:18px;padding:20px 22px;margin:0}
.tdp-s-tech .tdp-h2{font-size:18px;margin-bottom:10px}
.tdp-h2{font:800 clamp(22px,2.3vw,28px)/1.15 var(--display);letter-spacing:-.02em;margin:0 0 18px;color:var(--ink)}
.tdp-block{margin:0 0 20px}
.tdp-block:last-child{margin-bottom:0}
.tdp-block h3{font:700 14px var(--sans);letter-spacing:.1px;margin:0 0 10px;color:var(--ink)}
.tdp-pages{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px;counter-reset:tdp-page}
.tdp-pages li{counter-increment:tdp-page;display:flex;align-items:center;gap:10px;min-width:0;padding:10px 12px;border:1px solid #e2e8e5;border-radius:12px;background:#fbfcfb;font-size:14px;font-weight:600;color:#2c3d37;overflow-wrap:anywhere}
.tdp-pages li:before{content:counter(tdp-page);flex:0 0 auto;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#eef8d2;color:#3f5b36;font-size:12px;font-weight:800}
.tdp-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:7px}
.tdp-chips li{font-size:13px;font-weight:600;padding:6px 12px;border-radius:999px;background:#f0f3f1;border:1px solid #e2e8e5;color:#2c3d37;overflow-wrap:anywhere}
.tdp-fact{margin:0;font-size:14px;line-height:1.6;color:#44534e}
.tdp-table{margin:0;display:grid}
.tdp-row{display:grid;grid-template-columns:minmax(120px,30%) minmax(0,1fr);gap:16px;padding:12px 0;border-bottom:1px solid #edf1ef}
.tdp-row:last-child{border-bottom:0;padding-bottom:0}
.tdp-row:first-child{padding-top:0}
.tdp-row dt{font-size:13px;font-weight:700;color:#5f6d68}
.tdp-row dd{margin:0;font-size:14.5px;line-height:1.6;color:var(--ink);overflow-wrap:anywhere}
.tdp-s-tech .tdp-row{grid-template-columns:minmax(0,1fr);gap:1px;padding:9px 0}
.tdp-s-tech .tdp-row dt{font-size:12px}
.tdp-s-tech .tdp-row dd{font-size:14px}

/* SSS: yerel <details>/<summary> (klavye + ekran okuyucu durumu tarayıcıdan); her öğede AYNI artı/eksi simgesi (CSS çizimi, metin karakteri YOK). */
.tdp-faq-list{border:1px solid var(--ts-card-line,#dfe5e2);border-radius:16px;background:#fff;overflow:hidden}
.tdp-faq-item{border-bottom:1px solid #e7ecea}
.tdp-faq-item:last-child{border-bottom:0}
.tdp-faq-item summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;cursor:pointer;font-weight:700;font-size:15px;line-height:1.45;color:var(--ink)}
.tdp-faq-item summary::-webkit-details-marker{display:none}
.tdp-faq-item summary:hover{background:#f7faf8}
.tdp-faq-item summary:focus-visible{outline:3px solid #99b93b;outline-offset:-3px}
.tdp-faq-q{min-width:0;overflow-wrap:anywhere}
.tdp-faq-icon{position:relative;flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:var(--soft);transition:background .2s}
.tdp-faq-icon:before,.tdp-faq-icon:after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;border-radius:2px;background:var(--ink);transition:transform .2s}
.tdp-faq-icon:after{transform:rotate(90deg)}
.tdp-faq-item[open] .tdp-faq-icon{background:var(--lime)}
.tdp-faq-item[open] .tdp-faq-icon:after{transform:rotate(0deg)}
.tdp-faq-a{padding:0 20px 18px}
.tdp-faq-a p{margin:0;font-size:14.5px;line-height:1.7;color:#44534e;max-width:70ch}

/* "Bu Tema Hakkında": okunur düz metin (satır uzunluğu sınırlı). */
.tdp-prose{max-width:72ch;font-size:15.5px;line-height:1.75;color:#34443f}
.tdp-prose p{margin:0 0 14px}
.tdp-prose h3{font:800 18px/1.3 var(--display);margin:22px 0 10px;color:var(--ink)}
.tdp-prose ul{margin:0 0 14px;padding-left:20px}
.tdp-prose li{margin:0 0 6px}
.tdp-prose>:last-child{margin-bottom:0}

@media(max-width:1024px){
  .tdp-grid{grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr)}
}
@media(max-width:900px){
  .tdp-grid{grid-template-columns:minmax(0,1fr)}
  .tdp-body-grid{grid-template-columns:minmax(0,1fr)}
  .tdp-s-tech{grid-column:1;grid-row:auto;position:static;margin:0 0 clamp(28px,3.4vw,40px)}
  .tdp-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  .tdp-cover{border-radius:16px}
  .tdp-info,.tdp-message{border-radius:18px}
  .tdp-actions{grid-template-columns:minmax(0,1fr)}
  .tdp-thumbs{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
  .tdp-row{grid-template-columns:minmax(0,1fr);gap:2px}
  .tdp-pages{grid-template-columns:minmax(0,1fr)}
  .tdp-faq-item summary{padding:14px 16px}
  .tdp-faq-a{padding:0 16px 16px}
}
@media(prefers-reduced-motion:reduce){.tdp-thumb,.tdp-faq-icon,.tdp-faq-icon:before,.tdp-faq-icon:after,.tdp .tdp-cover img{transition:none}}