/* TETAŞ yeni tasarım: ürün listesi (ProductList.aspx) ve ürün detayı (ProductDetail.aspx).
   Değişkenler, header, footer ve düğmeler ts-ortak.css'te. Eski site CSS'i bu sayfalarda yüklenmez. */
html{scroll-behavior:smooth}
body{margin:0;background:#fff;font-family:Figtree,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:17px;line-height:1.6;color:var(--ts-ink)}
.ts-page *{box-sizing:border-box}
.ts-page img{max-width:100%;display:block}
.ts-page a{color:inherit;text-decoration:none}
.ts-page svg{flex:none;display:block}
.ts-page :focus-visible{outline:3px solid var(--ts-yellow);outline-offset:2px}
.ts-page h1,.ts-page h2,.ts-page h3{font-family:inherit}

/* Sayfa başlığı ve ekmek kırıntısı (BreadcrumbControl: div.brg > a); ölçüler taslak sayfalarındaki ortak başlıkla aynı (ts-taslak.css) */
.ts-phead{background:linear-gradient(180deg,var(--ts-sky-soft),#fff);padding-top:118px;border-bottom:1px solid var(--ts-line)}
.ts-phead .ts-wrap{padding-top:92px;padding-bottom:34px}
.ts-phead .brg{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;font-size:.9375rem;color:var(--ts-muted);margin:0 0 24px}
.ts-phead .brg a{color:var(--ts-navy);text-decoration:underline;text-underline-offset:3px}
.ts-phead .brg a+a::before{content:"/";display:inline-block;margin-right:10px;color:var(--ts-muted)}
.ts-phead .brg a:last-child{color:var(--ts-ink);font-weight:600;text-decoration:none;pointer-events:none}
.ts-phead.ts-slim .ts-wrap{padding-bottom:26px}
.ts-phead.ts-slim .brg{margin:0}
.ts-phead h1{margin:0;font-size:clamp(2rem,3.5vw,3.25rem);line-height:1.15;font-weight:800;letter-spacing:-.02em;color:var(--ts-navy-deep)}
.ts-phead .ts-sub{margin:14px 0 0;font-size:1.125rem;line-height:1.65;color:var(--ts-muted);max-width:65ch}
@media (max-width:929px){.ts-phead .ts-wrap{padding-top:76px}}
@media (max-width:640px){
  .ts-phead .ts-wrap{padding-top:60px;padding-bottom:26px}
  .ts-phead .brg{font-size:.875rem;gap:8px;margin-bottom:20px}
  .ts-phead h1{font-size:2rem}
  .ts-phead .ts-sub{font-size:1rem}
}

/* İki sütunlu gövde: solda kategori menüsü */
.ts-wrap.ts-body{display:grid;grid-template-columns:270px minmax(0,1fr);gap:40px;padding-top:40px;padding-bottom:72px;align-items:start}
.ts-side{display:flex;flex-direction:column;gap:18px;position:sticky;top:96px}
.ts-cats{border:1px solid var(--ts-line);border-radius:var(--ts-radius);overflow:hidden;background:#fff}
.ts-cats h2{margin:0;padding:14px 18px;font-size:1.0625rem;font-weight:800;color:var(--ts-navy-deep);background:var(--ts-plate);border-bottom:1px solid var(--ts-line)}
/* ProductCategoryMenu: ul#menu > li > a (+ gizli alt menüler) */
.ts-cats #menu{list-style:none;margin:0;padding:0}
.ts-cats #menu li{list-style:none;margin:0;padding:0;border-bottom:1px solid var(--ts-line)}
.ts-cats #menu>li:last-child{border-bottom:0}
.ts-cats #menu a{display:block;padding:11px 18px;font-size:15.5px;line-height:1.35;color:var(--ts-ink)}
.ts-cats #menu a:hover{background:var(--ts-sky-soft);color:var(--ts-navy-2)}
.ts-cats #menu a.ts-on{background:var(--ts-sky-soft);color:var(--ts-navy);font-weight:700;box-shadow:inset 4px 0 0 var(--ts-yellow)}
.ts-cats #menu ul{display:none!important}
.ts-mcats{display:none}
.ts-help{border-radius:var(--ts-radius);background:var(--ts-navy);color:#fff;padding:20px}
.ts-help h2{margin:0 0 6px;font-size:1.125rem;font-weight:700}
.ts-help p{margin:0 0 14px;color:#cfdcf2;font-size:15px;line-height:1.5}
.ts-help .ts-btn{width:100%;margin-top:8px}
.ts-help .ts-btn-line{background:transparent;border-color:rgba(255,255,255,.55);color:#fff!important}
.ts-help .ts-btn-line:hover{background:#fff;color:var(--ts-navy)!important}
.ts-help .ts-cat{display:block;margin-top:14px;color:#fff;font-weight:600;font-size:15px;text-decoration:underline;text-underline-offset:3px}

/* Ürün listesi: arama + kartlar (ProductCategoryList) */
.ts-tools{display:flex;align-items:center;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.ts-search{flex:1;min-width:240px;position:relative}
.ts-search input{width:100%;height:48px;border:1px solid #b9c7da;border-radius:4px;padding:0 14px 0 42px;font:inherit;font-size:16px;color:var(--ts-ink);background:#fff}
.ts-search input:focus{outline:none;border-color:var(--ts-navy-2);box-shadow:0 0 0 3px rgba(26,66,144,.15)}
.ts-search svg{position:absolute;left:14px;top:50%;width:18px;height:18px;margin-top:-9px;color:var(--ts-muted)}
.ts-sort{display:flex;align-items:center;gap:8px;font-size:15px;color:var(--ts-muted);white-space:nowrap}
.ts-sort select{height:48px;border:1px solid #b9c7da;border-radius:4px;padding:0 10px;font:inherit;font-size:16px;color:var(--ts-ink);background:#fff;cursor:pointer}
.ts-sort select:focus{outline:none;border-color:var(--ts-navy-2);box-shadow:0 0 0 3px rgba(26,66,144,.15)}
.ts-count{color:var(--ts-muted);font-size:15px;white-space:nowrap}
.ts-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.ts-grid>li{margin:0;padding:0;list-style:none}
.ts-card{display:flex;flex-direction:column;height:100%;border:1px solid var(--ts-line);border-radius:var(--ts-radius);overflow:hidden;background:#fff;transition:border-color .15s,box-shadow .15s}
.ts-card:hover{border-color:#a9bfdc;box-shadow:0 14px 28px -18px rgba(14,47,110,.45)}
.ts-card .ts-ph{height:210px;display:flex;align-items:center;justify-content:center;padding:14px;background:#fff;border-bottom:1px solid var(--ts-line)}
.ts-card .ts-ph img{max-height:100%;width:auto;object-fit:contain}
.ts-card .ts-tx{padding:14px 16px 16px;display:flex;flex-direction:column;gap:4px;flex:1}
.ts-card h3{margin:0;font-size:16px;line-height:1.35;font-weight:700;color:var(--ts-ink);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ts-card .ts-code{color:var(--ts-muted);font-size:14px}
.ts-card .ts-go{margin-top:auto;padding-top:8px;font-weight:700;color:var(--ts-navy-2);display:flex;align-items:center;gap:6px;font-size:15px}
.ts-card .ts-go svg{width:15px;height:15px;transition:transform .15s}
.ts-card:hover .ts-go svg{transform:translateX(3px)}
.ts-card:hover h3{color:var(--ts-navy-2)}
.ts-empty{display:none;padding:28px;border:1px dashed #b9c7da;border-radius:var(--ts-radius);color:var(--ts-muted);text-align:center}
.ts-empty.ts-show{display:block}

/* Ürün detayı */
.ts-pd{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:40px;align-items:start}
.ts-pd #UrunDetay{display:contents}
.ts-gal{grid-column:1;grid-row:1}
.ts-gal-main{border:1px solid var(--ts-line);border-radius:var(--ts-radius);background:#fff;aspect-ratio:1/1;max-height:520px;width:100%;display:flex;align-items:center;justify-content:center;padding:24px;overflow:hidden}
.ts-gal-main img{max-height:100%;width:auto;object-fit:contain}
.ts-thumbs{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.ts-thumbs li{list-style:none;margin:0}
.ts-thumbs button{width:76px;height:76px;padding:6px;border:1px solid var(--ts-line);border-radius:4px;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}
.ts-thumbs button[aria-current="true"]{border-color:var(--ts-navy);box-shadow:0 0 0 2px var(--ts-navy)}
.ts-thumbs img{max-height:100%;object-fit:contain}
.ts-thumbs:has(li:only-child){display:none}
.ts-info{grid-column:2;grid-row:1}
.ts-info .ts-kicker{display:inline-block;color:var(--ts-navy-2);font-weight:700;font-size:15px;margin-bottom:6px}
.ts-info h1{margin:0;font-size:clamp(1.5rem,2.4vw,2.125rem);line-height:1.18;font-weight:800;color:var(--ts-navy-deep);letter-spacing:-.01em}
.ts-info .ts-pcode{margin:10px 0 0;color:var(--ts-muted);font-size:16px}
.ts-info .ts-pcode strong{color:var(--ts-ink);font-weight:700}
.ts-ask{margin-top:24px;padding-top:22px;border-top:1px solid var(--ts-line)}
.ts-ask h3{margin:0 0 4px;font-size:1.1875rem;font-weight:700;color:var(--ts-navy-deep)}
.ts-ask p{margin:0 0 16px;color:var(--ts-muted);font-size:16px}
.ts-ask .ts-btn{width:100%;margin-bottom:10px;min-height:52px}
.ts-ask .ts-btn svg{width:18px;height:18px}
.ts-ask small{display:block;color:var(--ts-muted);font-size:14px;margin-top:4px}
.ts-desc{grid-column:1/-1;grid-row:2;border-top:1px solid var(--ts-line);padding-top:30px}
.ts-desc h2{margin:0 0 12px;font-size:1.5rem;font-weight:800;color:var(--ts-navy-deep)}
.ts-desc .ts-desc-body{max-width:78ch;color:#33415c;line-height:1.75}
.ts-desc .ts-desc-body *{font-family:inherit!important;font-size:inherit!important;color:inherit!important;line-height:inherit!important;background:none!important}
.ts-desc .ts-desc-body p{margin:0 0 14px}
.ts-desc .ts-desc-body table{border-collapse:collapse;max-width:100%;display:block;overflow-x:auto}
.ts-desc .ts-desc-body td,.ts-desc .ts-desc-body th{border:1px solid var(--ts-line);padding:6px 10px}
.ts-desc .ts-desc-body img{height:auto}
.ts-pd #Sagicerik:empty{display:none}
.ts-pd #Sagicerik{grid-column:2;grid-row:auto}

/* Gizli: eski sunucu çıktıları */
.ts-hide{display:none!important}

@media (max-width:1100px){
  .ts-wrap.ts-body{grid-template-columns:1fr;gap:24px}
  .ts-side{position:static;order:2}
  .ts-cats{display:none}
  .ts-mcats{display:block;margin:0 0 4px}
  .ts-mcats label{display:block;font-weight:700;font-size:15px;margin-bottom:6px;color:var(--ts-navy-deep)}
  /* MobilProductMenu: select.menuContMenu */
  .ts-mcats select{width:100%;height:48px;border:1px solid #b9c7da;border-radius:4px;padding:0 12px;font:inherit;font-size:16px;background:#fff;color:var(--ts-ink)}
  .ts-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:929px){.ts-phead{padding-top:0}}
@media (max-width:860px){
  .ts-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ts-pd{grid-template-columns:1fr;gap:24px}
  .ts-gal,.ts-info,.ts-desc,.ts-pd #Sagicerik{grid-column:1;grid-row:auto}
  .ts-info{order:-1}
}
@media (max-width:640px){
  .ts-wrap.ts-body{padding-top:22px;padding-bottom:48px}
  .ts-grid{gap:12px}
  .ts-tools{gap:10px}
  .ts-search{flex:1 1 100%}
  .ts-sort{flex:1}
  .ts-sort select{flex:1;min-width:0}
  .ts-card .ts-ph{height:150px;padding:10px}
  .ts-card .ts-tx{padding:10px 12px 12px}
  .ts-card h3{font-size:15px}
  .ts-card .ts-code{font-size:13px}
  .ts-card .ts-go{font-size:14px}
  .ts-gal-main{padding:14px;max-height:360px}
  .ts-thumbs button{width:64px;height:64px}
  .ts-desc{padding-top:22px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ts-page *{transition:none!important}}