/* orbit — ürün listesi ve ürün detayı */

/* Liste: solda kategori ağacı */
.or-yanli { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 24px; padding-top: 26px; padding-bottom: 40px; }
.or-agac { align-self: start; position: sticky; top: 78px; padding: 8px 0 12px; border: 1px solid var(--or-cizgi); border-radius: var(--or-kose); background: var(--or-beyaz); }
.or-agac-bas { display: flex; align-items: center; gap: 8px; margin: 0; padding: 8px 16px 10px; border-bottom: 1px solid var(--or-cizgi); font-weight: 700; color: var(--or-baslik); }
.or-agac-bas svg { width: 18px; height: 18px; color: var(--or-ana); }
.or-agac > ul { padding-top: 6px; }
.or-agac a { display: block; padding: 7px 16px; font-size: 14px; font-weight: 500; color: var(--or-baslik); transition: color .2s, background-color .2s; }
.or-agac a:hover, .or-agac li.is-secili > a, .or-agac li.is-secili > details > summary > a { color: var(--or-ana); }
.or-agac li.is-secili > a { background: var(--or-ana-acik); font-weight: 700; }
.or-agac summary { display: flex; align-items: center; justify-content: space-between; padding-right: 12px; cursor: pointer; list-style: none; }
.or-agac summary::-webkit-details-marker { display: none; }
.or-agac summary a { flex: 1 1 auto; }
.or-agac summary svg { width: 15px; height: 15px; color: var(--or-soluk); transition: transform .2s; }
.or-agac details[open] > summary svg { transform: rotate(180deg); }
.or-agac details ul { padding-left: 12px; }
.or-agac details a { font-size: 13px; color: var(--or-yazi); }
.or-icerik { min-width: 0; }
.or-kat-aciklama { margin-bottom: 20px; padding: 20px 24px; border-radius: var(--or-kose); background: var(--or-beyaz); }
.or-kat-aciklama img { width: auto !important; max-height: 320px; margin: 0 auto; object-fit: contain; }
.or-altkat { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; }
.or-altkat a { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid var(--or-cizgi); border-radius: var(--or-dugme-kose); background: var(--or-beyaz); font-size: 14px; font-weight: 600; color: var(--or-baslik); transition: border-color .2s, color .2s; }
.or-altkat a img { width: 26px; height: 26px; object-fit: contain; }
.or-altkat a svg { width: 14px; height: 14px; color: var(--or-soluk); }
.or-altkat a:hover { border-color: var(--or-ana); color: var(--or-ana); }
.or-urun-izgara-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* Detay */
.or-urun-detay { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 36px; padding: 28px; border-radius: var(--or-kose); background: var(--or-beyaz); }
.or-urun-gorseller { min-width: 0; }
.or-urun-ana { display: grid; place-items: center; aspect-ratio: 1; padding: 24px; border: 1px solid var(--or-cizgi); border-radius: var(--or-kose); background: var(--or-beyaz); cursor: zoom-in; }
.or-urun-ana img { width: 100%; height: 100%; object-fit: contain; }
.or-urun-ana.is-bos { cursor: default; background: var(--or-zemin); }
.or-urun-ana.is-bos img { width: 30%; height: auto; opacity: .5; }
.or-urun-kucukler { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.or-urun-kucukler a { display: grid; place-items: center; aspect-ratio: 1; padding: 6px; border: 1px solid var(--or-cizgi); border-radius: 6px; transition: border-color .2s; }
.or-urun-kucukler a:hover { border-color: var(--or-ana); }
.or-urun-kucukler img { width: 100%; height: 100%; object-fit: contain; }
.or-urun-bilgi { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.or-urun-baslik { font-size: clamp(22px, 2.4vw, 30px); font-weight: 800; }
.or-urun-satir { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; width: 100%; padding-bottom: 14px; border-bottom: 1px solid var(--or-cizgi); }
.or-urun-kod { font-size: 13px; color: var(--or-soluk); }
.or-urun-kod b { color: var(--or-baslik); }
.or-paylas { display: flex; gap: 6px; }
.or-paylas a { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--or-cizgi); border-radius: var(--or-dugme-kose); color: var(--or-yazi); transition: border-color .2s, color .2s; }
.or-paylas a:hover { border-color: var(--or-ana); color: var(--or-ana); }
.or-paylas svg { width: 15px; height: 15px; }
.or-urun-ozet { width: 100%; }
.or-urun-tel { display: inline-flex; align-items: center; gap: 8px; margin-top: -4px; font-size: 14px; color: var(--or-yazi); }
.or-urun-tel svg { width: 16px; height: 16px; color: var(--or-ana); }
.or-urun-tel b { color: var(--or-baslik); }
.or-urun-kutular { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; width: 100%; }
.or-urun-kutular div { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; border-radius: var(--or-kose); background: var(--or-zemin); }
.or-urun-kutular b { font-size: 14px; color: var(--or-baslik); }
.or-urun-kutular span { font-size: 13px; }
.or-akordeon { width: 100%; border: 1px solid var(--or-cizgi); border-radius: var(--or-kose); }
.or-akordeon details + details { border-top: 1px solid var(--or-cizgi); }
.or-akordeon summary { display: flex; align-items: center; justify-content: space-between; padding: 13px 16px; font-weight: 700; color: var(--or-baslik); cursor: pointer; list-style: none; }
.or-akordeon summary::-webkit-details-marker { display: none; }
.or-akordeon summary svg { width: 16px; height: 16px; color: var(--or-soluk); transition: transform .2s; }
.or-akordeon details[open] summary svg { transform: rotate(180deg); }
.or-akordeon ul { padding: 0 16px 14px; }
.or-akordeon li { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 6px; font-size: 14px; }
.or-akordeon li svg { width: 16px; height: 16px; margin-top: 4px; color: var(--or-ana); }
.or-sekme { margin-top: 20px; padding: 26px 28px; border-radius: var(--or-kose); background: var(--or-beyaz); }
.or-sekme h3 { margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--or-cizgi); font-size: 18px; }

/* Hizmet bölgesi etiketleri */
.or-bolge { padding-bottom: 40px; }
.or-bolge h3 { display: flex; align-items: center; gap: 8px; margin-bottom: 14px; font-size: 15px; }
.or-bolge h3 svg { width: 17px; height: 17px; color: var(--or-ana); }
.or-bolge-etiketler { display: flex; flex-wrap: wrap; gap: 6px; }
.or-bolge-etiketler span { padding: 5px 12px; border: 1px solid var(--or-cizgi); border-radius: var(--or-dugme-kose); background: var(--or-beyaz); font-size: 12px; color: var(--or-yazi); }
.or-bolge-etiketler span.is-gizli { display: none; }
.or-bolge-devam { margin-top: 12px; padding: 7px 14px; border: 1px solid var(--or-cizgi); border-radius: var(--or-dugme-kose); background: var(--or-beyaz); font-size: 13px; font-weight: 600; color: var(--or-ana); cursor: pointer; }

@media (max-width: 991px) {
	.or-yanli { grid-template-columns: minmax(0, 1fr); padding-top: 16px; }
	.or-agac { position: static; order: 2; }
	.or-urun-izgara-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.or-urun-detay { grid-template-columns: minmax(0, 1fr); gap: 22px; padding: 18px; }
}
@media (max-width: 640px) {
	.or-urun-kutular { grid-template-columns: minmax(0, 1fr); }
	.or-sekme { padding: 20px 18px; }
}
