/* Selinay — ürün listesi ve detayı */
.sl-yanli { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 40px; align-items: start; padding-top: 34px; padding-bottom: 40px; }
.sl-yanli.is-sag { grid-template-columns: minmax(0, 1fr) 270px; }
.sl-agac { position: sticky; top: 20px; }
.sl-agac .sl-baslik { margin-bottom: 14px; font-size: 24px; }
.sl-agac > ul > li { border-bottom: 1px solid var(--sl-cizgi); }
.sl-agac a { display: block; padding: 10px 4px; font-size: 14px; color: var(--sl-koyu); transition: color .2s, padding-left .25s var(--sl-gecis); }
.sl-agac a:hover { padding-left: 10px; color: var(--sl-kirmizi); }
.sl-agac summary { display: flex; align-items: center; justify-content: space-between; cursor: pointer; list-style: none; }
.sl-agac summary::-webkit-details-marker { display: none; }
.sl-agac summary svg { width: 16px; height: 16px; flex: 0 0 auto; transition: transform .25s; }
.sl-agac details[open] > summary svg { transform: rotate(180deg); }
.sl-agac details ul { padding: 0 0 10px 12px; border-left: 2px solid var(--sl-kirmizi-acik); margin-left: 4px; }
.sl-agac details ul a { padding: 6px 8px; font-size: 13px; color: var(--sl-yazi); }
.sl-agac li.is-secili > a, .sl-agac li.is-secili > details > summary > a { color: var(--sl-kirmizi); font-weight: 700; }

.sl-urun-detay { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: start; }
.sl-urun-ana { display: grid; place-items: center; padding: 20px; border: 1px solid var(--sl-cizgi); overflow: hidden; }
.sl-urun-ana img { max-height: 420px; width: auto; transition: transform .8s var(--sl-gecis); }
.sl-urun-ana:hover img { transform: scale(1.06); }
.sl-urun-kucukler { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.sl-urun-kucukler a { display: grid; place-items: center; aspect-ratio: 1; padding: 6px; border: 1px solid var(--sl-cizgi); transition: border-color .25s; }
.sl-urun-kucukler a:hover { border-color: var(--sl-kirmizi); }
.sl-urun-kucukler img { max-height: 100%; width: auto; }
.sl-urun-bilgi .sl-metin { padding-bottom: 18px; border-bottom: 1px solid var(--sl-cizgi); }
.sl-urun-kat { margin-top: 16px; font-size: 14px; }
.sl-urun-kat a { color: var(--sl-kirmizi); }
.sl-sekme { margin-top: 40px; }
.sl-sekme h2 { display: inline-block; margin-bottom: 18px; padding: 10px 20px; border: 1px solid var(--sl-cizgi); border-bottom-color: var(--sl-beyaz); font-size: 15px; font-weight: 700; margin-bottom: -1px; position: relative; background: var(--sl-beyaz); }
.sl-sekme .sl-metin { padding: 24px; border: 1px solid var(--sl-cizgi); }
.sl-benzer { margin-top: 50px; }
.sl-benzer .sl-baslik { margin-bottom: 16px; }

@media (max-width: 991px) {
	.sl-yanli, .sl-yanli.is-sag { grid-template-columns: minmax(0, 1fr); gap: 30px; }
	.sl-yanli .sl-agac { order: 2; }
	.sl-agac { position: static; }
}
@media (max-width: 640px) {
	.sl-yanli { padding-top: 22px; }
	.sl-urun-detay { grid-template-columns: minmax(0, 1fr); gap: 24px; }
	.sl-sekme .sl-metin { padding: 16px; }
}