/* Omnex Pages — publish-guide.css (Yayın Rehberi; 2026-11-06). Yalnız kit değişkenleri; ayrı renk, yazı tipi ya da ölçü sistemi yok. */
.ox-guide-tabs { margin-bottom: var(--ox-space-5); }
.ox-guide-head { display: grid; gap: var(--ox-space-1); }
.ox-guide-title { margin: 0; font-size: var(--ox-text-xl); font-weight: var(--ox-weight-semibold); line-height: var(--ox-leading-tight); }
.ox-guide-lead { margin: 0; color: var(--ox-fg-muted); font-size: var(--ox-text-md); line-height: 1.55; }
.ox-guide-body { display: grid; gap: var(--ox-space-3); min-width: 0; font-size: var(--ox-text-base); line-height: 1.55; }
.ox-guide-body p { margin: 0; }
.ox-guide-body h3 { margin: 0; font-size: var(--ox-text-base); font-weight: var(--ox-weight-semibold); line-height: 1.3; }
.ox-guide-body ul { margin: 0; padding-left: 20px; display: grid; gap: 6px; }
.ox-guide-head-stack { display: grid; gap: 2px; }
.ox-guide-label { font-size: var(--ox-text-xs); font-weight: var(--ox-weight-semibold); letter-spacing: var(--ox-tracking-label); text-transform: uppercase; color: var(--ox-fg-muted); }
.ox-guide-muted { color: var(--ox-fg-muted); }
.ox-guide-small { font-size: var(--ox-text-sm); }
.ox-guide-stack { display: grid; gap: var(--ox-space-4); }
.ox-guide-grid { display: grid; gap: var(--ox-space-3); }
.ox-guide-g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ox-guide-g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ox-guide-g4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ox-guide-g5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
html[data-device="tablet"] .ox-guide-g4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* Tablet: beş kart üç + iki dizilir, tek kalan kart ve yanında boşluk olmaz */
html[data-device="tablet"] .ox-guide-g5 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
html[data-device="tablet"] .ox-guide-g5 > * { grid-column: span 2; }
html[data-device="tablet"] .ox-guide-g5 > :nth-last-child(-n+2) { grid-column: span 3; }
html[data-device="phone"] .ox-guide-g2, html[data-device="phone"] .ox-guide-g3, html[data-device="phone"] .ox-guide-g4, html[data-device="phone"] .ox-guide-g5 { grid-template-columns: minmax(0, 1fr); }
.ox-guide-item { border: 1px solid var(--ox-border); border-radius: var(--ox-radius-md); padding: var(--ox-space-3) var(--ox-space-4); display: grid; gap: 6px; align-content: start; min-width: 0; }
.ox-guide-item__head { display: flex; align-items: center; gap: 10px; }
.ox-guide-ico { width: 32px; height: 32px; border-radius: var(--ox-radius-md); display: flex; align-items: center; justify-content: center; background: var(--ox-primary-subtle); color: var(--ox-primary); flex: none; }
.ox-guide .ox-note { margin: 0; font-size: var(--ox-text-base); align-items: flex-start; padding: var(--ox-space-3) var(--ox-space-4); }
.ox-guide .ox-note__txt { line-height: 1.55; }
.ox-guide .ox-table:not(.ox-guide-cmp, .ox-guide-vt, .ox-guide-kvt) { width: 100%; font-variant-numeric: tabular-nums; }
.ox-guide .ox-table:not(.ox-guide-cmp, .ox-guide-vt, .ox-guide-kvt) tbody th { text-transform: none; letter-spacing: 0; font-size: var(--ox-text-base); font-weight: var(--ox-weight-semibold); color: var(--ox-fg); background: transparent; white-space: normal; text-align: left; vertical-align: top; padding: 9px 12px 9px 0; border-bottom: 1px solid var(--ox-border); }
.ox-guide .ox-table:not(.ox-guide-cmp, .ox-guide-vt, .ox-guide-kvt) thead th { background: transparent; padding: 6px 10px 6px 0; white-space: normal; text-align: left; vertical-align: bottom; }
.ox-guide .ox-table:not(.ox-guide-cmp, .ox-guide-vt, .ox-guide-kvt) td { vertical-align: top; padding: 9px 10px 9px 0; }
.ox-guide .ox-table:not(.ox-guide-cmp, .ox-guide-vt, .ox-guide-kvt) tbody th { white-space: nowrap; }
.ox-guide .ox-table:not(.ox-guide-cmp, .ox-guide-vt, .ox-guide-kvt) td .ox-badge { font-size: var(--ox-text-sm); }
.ox-guide .ox-table:not(.ox-guide-cmp, .ox-guide-vt, .ox-guide-kvt) tbody tr:last-child th { border-bottom: 0; }
.ox-guide .ox-table:not(.ox-guide-cmp, .ox-guide-vt, .ox-guide-kvt) tbody tr:hover { background: transparent; }
.ox-guide .ox-table:not(.ox-guide-cmp, .ox-guide-vt, .ox-guide-kvt) small { display: block; color: var(--ox-fg-muted); font-size: var(--ox-text-sm); font-weight: 400; }
.ox-guide-nw { white-space: nowrap; }
html[data-device="phone"] .ox-guide .ox-table:not(.ox-guide-cmp, .ox-guide-vt, .ox-guide-kvt) thead th { white-space: normal; }
html[data-device="phone"] .ox-guide .ox-table:not(.ox-guide-cmp, .ox-guide-vt, .ox-guide-kvt) tbody th, html[data-device="phone"] .ox-guide .ox-table:not(.ox-guide-cmp, .ox-guide-vt, .ox-guide-kvt) td { padding-right: 8px; font-size: var(--ox-text-sm); }
html[data-device="phone"] .ox-guide .ox-badge { height: 22px; padding: 0 8px; font-size: var(--ox-text-xs); }
.ox-guide-steps { list-style: none; margin: 0; padding: 0; counter-reset: s; }
/* Numara ve başlık aynı satırda, açıklama altta tam genişlik: üstteki ikonlu kartlarla aynı düzen ve aynı kenar boşluğu */
.ox-guide-steps li { counter-increment: s; border: 1px solid var(--ox-border); border-radius: var(--ox-radius-md); padding: var(--ox-space-3) var(--ox-space-4); display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 10px; align-items: center; align-content: start; }
.ox-guide-steps li > .ox-guide-muted { grid-column: 1 / -1; }
.ox-guide-steps li::before { content: counter(s); width: 24px; height: 24px; border-radius: 50%; background: var(--ox-primary); color: var(--ox-primary-fg); font-weight: var(--ox-weight-semibold); font-size: var(--ox-text-sm); display: flex; align-items: center; justify-content: center; }
.ox-guide-profile { border-top: 3px solid var(--ox-primary); }
.ox-guide-shapes { display: flex; gap: var(--ox-space-4); align-items: flex-end; min-height: 124px; }
.ox-guide-shape { display: grid; gap: 6px; justify-items: center; }
.ox-guide-shape i { display: block; border: 2px solid var(--ox-primary); border-radius: 4px; background: var(--ox-primary-subtle); }
.ox-guide-shape span { font-size: var(--ox-text-xs); color: var(--ox-fg-muted); font-weight: var(--ox-weight-medium); font-variant-numeric: tabular-nums; }
.ox-guide-row { display: flex; flex-wrap: wrap; gap: var(--ox-space-2); align-items: center; }
.ox-guide-next { display: flex; justify-content: flex-end; }

/* Karşılaştırma tablosu: kitin tablosu + sütun çizgileri (ox-table-wrap, ox-dt--collines). Sütun genişlikleri sabit, satır arttıkça kaymaz. */
.ox-guide-cmp { table-layout: fixed; }
.ox-guide-cmp thead th { color: var(--ox-fg-muted); white-space: normal; }
.ox-guide-cmp thead th:first-child { width: 24%; }
.ox-guide-cmp tbody th { text-transform: none; letter-spacing: 0; font-size: var(--ox-text-base); font-weight: var(--ox-weight-semibold); color: var(--ox-fg); white-space: normal; }
.ox-guide-cmp tbody tr:last-child th { border-bottom: 0; }
/* Telefon: her satır bir blok. Üstte özellik adı, altta iki değer yan yana, her değerin üstünde sütun adı. */
html[data-device="phone"] .ox-guide-cmp, html[data-device="phone"] .ox-guide-cmp tbody { display: block; }
html[data-device="phone"] .ox-guide-cmp thead { display: none; }
html[data-device="phone"] .ox-guide-cmp tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-bottom: 1px solid var(--ox-border); }
html[data-device="phone"] .ox-guide-cmp tr:last-child { border-bottom: 0; }
html[data-device="phone"] .ox-guide-cmp tbody th { grid-column: 1 / -1; padding: var(--ox-space-2) var(--ox-space-3); border-right: 0; border-bottom: 1px solid var(--ox-border); }
html[data-device="phone"] .ox-guide-cmp td { display: grid; gap: 2px; align-content: start; padding: var(--ox-space-3); border-bottom: 0; }
html[data-device="phone"] .ox-guide-cmp td::before { content: attr(data-label); font-size: var(--ox-text-xs); font-weight: var(--ox-weight-medium); color: var(--ox-fg-muted); }

/* Durum sütunlu tablo: durum ortalı ve dar, açıklama geniş */
.ox-guide-cmp--durum thead th:nth-child(2) { width: 150px; text-align: center; }
.ox-guide-cmp--durum td:nth-of-type(1) { text-align: center; }
html[data-device="phone"] .ox-guide-cmp--durum tr { grid-template-columns: 38% minmax(0, 1fr); }
/* Izgara tablo: cihaz sütunları ortalı; telefonda dört değer iki sıra iki sütun */
.ox-guide-cmp--izgara thead th:not(:first-child), .ox-guide-cmp--izgara td { text-align: center; }
/* Uzun çevirilerde rozet hücreden taşmasın: dar sütunda alt satıra iner. */
.ox-guide-cmp--izgara .ox-badge { height: auto; min-height: 22px; max-width: 100%; padding-block: 2px; white-space: normal; line-height: 1.25; text-align: center; }
.ox-guide-cmp--izgara td { overflow-wrap: anywhere; }
.ox-guide-cmp small { display: block; color: var(--ox-fg-muted); font-size: var(--ox-text-sm); font-weight: var(--ox-weight-regular); }
html[data-device="phone"] .ox-guide-cmp td { text-align: left; }
html[data-device="phone"] .ox-guide-cmp td > .ox-badge { justify-self: start; }
html[data-device="phone"] .ox-guide-cmp--izgara td:nth-child(odd) { border-right: 0; }
html[data-device="phone"] .ox-guide-cmp--izgara td:nth-child(2), html[data-device="phone"] .ox-guide-cmp--izgara td:nth-child(3) { border-bottom: 1px solid var(--ox-border); }
/* Metin solda, görsel kartları sağda; yer yetmezse alt alta */
.ox-guide-yan { display: grid; gap: var(--ox-space-5); grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.ox-guide-yan__metin { display: grid; gap: var(--ox-space-3); min-width: 0; }
@media (min-width: 1025px) and (max-width: 1320px) { html[data-device="desktop"] .ox-guide-yan { grid-template-columns: minmax(0, 1fr); } }
html[data-device="tablet"] .ox-guide-yan, html[data-device="phone"] .ox-guide-yan { grid-template-columns: minmax(0, 1fr); }
/* Mesafe tablosu: ölçü sütunları ortalı; telefonda dört değer iki sıra iki sütun, uygun içerik tam genişlik */
.ox-guide-cmp--mesafe thead th:first-child { width: 10%; }
.ox-guide-cmp--mesafe thead th:nth-child(2) { width: 17%; }
.ox-guide-cmp--mesafe thead th:nth-child(3), .ox-guide-cmp--mesafe thead th:nth-child(4), .ox-guide-cmp--mesafe thead th:nth-child(5) { width: 14%; text-align: center; }
.ox-guide-cmp--mesafe td:nth-of-type(2), .ox-guide-cmp--mesafe td:nth-of-type(3), .ox-guide-cmp--mesafe td:nth-of-type(4) { text-align: center; }
html[data-device="phone"] .ox-guide-cmp--mesafe td:nth-child(odd) { border-right: 0; }
html[data-device="phone"] .ox-guide-cmp--mesafe td:not(:last-child) { border-bottom: 1px solid var(--ox-border); }
html[data-device="phone"] .ox-guide-cmp--mesafe td:last-child { grid-column: 1 / -1; border-right: 0; }
/* Vurgu renginin koyusu: tema vurgusunu izler (kullanıcı kararı: HTML indir ve sonraki konu düğmeleri) */
.ox-guide .ox-btn--primary.ox-guide-koyu { background: var(--ox-primary-active); }
.ox-guide .ox-btn--primary.ox-guide-koyu:hover:not(:disabled) { background: var(--ox-primary-hover); }
/* Karşılaştırma tablosunda hücreler satıra sarar, taşmaz */
.ox-guide-cmp .ox-guide-nw { white-space: normal; }
/* Kart içi bölüm: ince çizgiyle ayrılır, başlıkta ikon + başlık aynı satır */
.ox-guide-bolum { display: grid; gap: var(--ox-space-3); min-width: 0; padding-top: var(--ox-space-4); border-top: 1px solid var(--ox-border); }
.ox-guide-bolum__baslik { display: flex; align-items: center; gap: 10px; }
.ox-guide-bolum__baslik h3 { font-size: var(--ox-text-md); }
.ox-guide-bolum .ox-note { margin: 0; }
.ox-guide-cmp--iki thead th:first-child { width: 26%; }
html[data-device="phone"] .ox-guide-cmp--iki tr { grid-template-columns: minmax(0, 1fr); }
html[data-device="phone"] .ox-guide-cmp--iki td { border-right: 0; }
/* Kart başlığında kapsam belirteci: bu karttaki her durum tek televizyonun içidir */
.ox-guide-ekran { flex: none; gap: 5px; }
.ox-guide-ekran__ic { display: inline-flex; }
/* Görselin sol üst köşesinde durum rozeti. Zemin opak: fotoğraf üstünde de okunur. */
.ox-guide-fig { position: relative; }
.ox-guide-fig__rozet { position: absolute; top: var(--ox-space-2); left: var(--ox-space-2); display: inline-flex; border-radius: var(--ox-radius-full); background: var(--ox-surface); box-shadow: var(--ox-shadow-sm); }

/* Rozetli kart: rozet başta, genişliği kadar */
.ox-guide-item > .ox-badge { justify-self: start; }
/* Sürüm tabloları: kitin tablosu + sütun çizgileri, içerik ortalı, sütun oranları üç tabloda aynı. Tablo kartın kenarına kadar uzanır, kısa tabloda satırlar kartı doldurur. */
.ox-guide-ver { display: grid; gap: var(--ox-space-3); grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (min-width: 1025px) and (max-width: 1320px) { html[data-device="desktop"] .ox-guide-ver { grid-template-columns: minmax(0, 1fr); } }
html[data-device="tablet"] .ox-guide-ver, html[data-device="phone"] .ox-guide-ver { grid-template-columns: minmax(0, 1fr); }
.ox-guide-ver > .ox-card { display: flex; flex-direction: column; min-width: 0; }
.ox-guide-ver .ox-card__body { flex: 1; display: block; }
.ox-guide-ver .ox-table-wrap { height: 100%; border: 0; border-radius: 0; background: transparent; }
.ox-guide-vt { table-layout: fixed; height: 100%; }
.ox-guide-vt th, .ox-guide-vt td { padding: 10px 6px; text-align: center; white-space: nowrap; }
.ox-guide-vt thead th { color: var(--ox-fg-muted); height: 38px; }
.ox-guide-vt thead th:nth-child(1) { width: 20%; }
.ox-guide-vt thead th:nth-child(2) { width: 24%; }
.ox-guide-vt thead th:nth-child(3) { width: 20%; }
.ox-guide-vt tbody th { text-transform: none; letter-spacing: 0; font-size: var(--ox-text-base); font-weight: var(--ox-weight-semibold); color: var(--ox-fg); }
.ox-guide-vt tbody tr:last-child th { border-bottom: 0; }

/* Profil tabloları: kitin tablosu + sütun çizgileri; sol sütun tonlu. Üç kart aynı boyda, kısa kartta satırlar tabloyu doldurur, altta boşluk kalmaz. */
.ox-guide-prof { display: grid; gap: var(--ox-space-3); grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (min-width: 1025px) and (max-width: 1320px) { html[data-device="desktop"] .ox-guide-prof { grid-template-columns: minmax(0, 1fr); } }
html[data-device="tablet"] .ox-guide-prof, html[data-device="phone"] .ox-guide-prof { grid-template-columns: minmax(0, 1fr); }
.ox-guide-prof > .ox-card { display: flex; flex-direction: column; min-width: 0; }
.ox-guide-prof .ox-card__body { flex: 1; grid-template-rows: auto auto 1fr auto; }
.ox-guide-prof .ox-table-wrap { height: 100%; min-width: 0; }
.ox-guide-kvt { table-layout: fixed; height: 100%; }
.ox-guide-kvt th, .ox-guide-kvt td { padding: 10px 12px; }
.ox-guide-kvt tbody th { width: 42%; text-transform: none; letter-spacing: 0; font-size: var(--ox-text-base); font-weight: var(--ox-weight-semibold); color: var(--ox-fg); white-space: normal; }
.ox-guide-kvt tbody tr:last-child th { border-bottom: 0; }
.ox-guide-kvt small { display: block; color: var(--ox-fg-muted); font-size: var(--ox-text-sm); font-weight: var(--ox-weight-regular); }

/* Görsel yerleri: görsel + başlık + açıklama her yerde tek kalıp (.ox-guide-item > .ox-guide-fig + h3 + p). Gerçek görselde .ox-guide-fig__ph yerine <img>. */
.ox-guide-fig { margin: 0; min-width: 0; }
.ox-guide-fig__ph { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--ox-space-2); width: 100%; background: var(--ox-surface-2); border: 1px dashed var(--ox-border-strong); border-radius: var(--ox-radius-md); color: var(--ox-fg-muted); }
/* Görselli kart: ikon görselin sol üst köşesinde rozet, başlık görselin altında tam genişlik. Zemin opak: fotoğraf üstünde de okunur. */
.ox-guide-item { position: relative; }
.ox-guide-item:has(> .ox-guide-fig) .ox-guide-ico { position: absolute; top: calc(var(--ox-space-3) + var(--ox-space-2)); left: calc(var(--ox-space-4) + var(--ox-space-2)); background: var(--ox-surface); box-shadow: var(--ox-shadow-sm); }
.ox-guide-figs { display: grid; gap: var(--ox-space-3); }
.ox-guide-figs--1 { grid-template-columns: minmax(0, 1fr); }
.ox-guide-figs--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ox-guide-figs--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ox-guide-figs--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
html[data-device="tablet"] .ox-guide-figs--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
html[data-device="phone"] .ox-guide-figs { grid-template-columns: minmax(0, 1fr); }
html[data-device="phone"] .ox-guide-fig__ph { aspect-ratio: 16/9 !important; }




.ox-guide .ox-table:not(.ox-guide-cmp, .ox-guide-vt, .ox-guide-kvt) td:last-child, .ox-guide .ox-table:not(.ox-guide-cmp, .ox-guide-vt, .ox-guide-kvt) th:last-child { padding-right: 0; }

/* Sekme paneli (kit Tabs.js hidden ile değiştirir) */
.ox-guide-page { display: grid; gap: var(--ox-space-4); min-width: 0; }
.ox-guide-page[hidden] { display: none; }
/* Tablo başlığı, sol sütun ve kart altı not açık vurgu tonunda: kit griyi (--ox-surface-2) sayfa zemininden ayrılmıyordu (kullanıcı 06.11; yalnız bu sayfa) */
.ox-guide .ox-table tbody th, .ox-guide .ox-card__footer { background: var(--ox-primary-subtle); }
/* Tablo başlık satırı koyu nötr ton, vurgu rengi değil (kullanıcı 06.11). Koyu temada kartın üstünde koyu ama ayrılan ton. */
.ox-guide { --ox-guide-thead-bg: var(--ox-fg); --ox-guide-thead-fg: var(--ox-surface); }
html[data-theme="dark"] .ox-guide { --ox-guide-thead-bg: color-mix(in srgb, var(--ox-fg) 22%, var(--ox-surface)); --ox-guide-thead-fg: var(--ox-fg); }
@media (prefers-color-scheme: dark) { html:not([data-theme]) .ox-guide { --ox-guide-thead-bg: color-mix(in srgb, var(--ox-fg) 22%, var(--ox-surface)); --ox-guide-thead-fg: var(--ox-fg); } }
.ox-guide .ox-table thead th { background: var(--ox-guide-thead-bg); color: var(--ox-guide-thead-fg); border-color: color-mix(in srgb, var(--ox-guide-thead-fg) 22%, transparent); }
/* Ne kadarı sığar: kit ölçek çubuğu (ox-meter), çubuklar gerçek oranda; metin sayfada olduğu için bütün dillere çevrilir */
.ox-guide-olcek { gap: var(--ox-space-3); }
.ox-guide-olcek .ox-meter { margin: 0; }
.ox-guide-olcek .ox-meter__row { align-items: center; font-size: var(--ox-text-base); }
.ox-guide-olcek .ox-guide-olcek__deger { display: inline-flex; align-items: center; gap: var(--ox-space-2); flex: none; color: var(--ox-fg); font-weight: var(--ox-weight-semibold); }
.ox-guide-olcek .ox-meter__bar { height: 12px; }
.ox-guide-olcek .ox-meter__bar > i { min-width: 4px; transition: none; }
/* Rozet görsele tıklamayı engellemez. Aynı anda kaç video: görselin üstünde başlık yazısı var, rozet televizyon ekranının sağ altında (kullanıcı 06.11) */
.ox-guide-fig__rozet { pointer-events: none; }
.ox-guide-figs--ekran-rozet .ox-guide-fig__rozet { top: auto; left: auto; bottom: 15%; right: 6%; }
/* Program zaman çizelgesi: resim değil sayfa bileşeni; metin çevrilir, firma rengini ve temayı izler, yön flex ile aynalanır */
.ox-guide-zaman { display: grid; gap: var(--ox-space-3); align-content: center; padding: var(--ox-space-4); border-radius: var(--ox-radius-md); background: var(--ox-surface-2); }
.ox-guide-zaman__satir { display: grid; gap: var(--ox-space-1); min-width: 0; }
.ox-guide-zaman__ad { font-size: var(--ox-text-sm); font-weight: var(--ox-weight-semibold); color: var(--ox-fg); }
.ox-guide-zaman__hat { display: flex; height: 22px; overflow: hidden; border-radius: var(--ox-radius-sm); background: var(--ox-surface); }
.ox-guide-zaman__s { display: flex; align-items: center; justify-content: center; min-width: 0; overflow: hidden; font-size: var(--ox-text-xs); white-space: nowrap; color: var(--ox-fg-muted); }
.ox-guide-zaman__s--normal { background: color-mix(in srgb, var(--ox-fg) 38%, var(--ox-surface)); }
.ox-guide-zaman__s--program { background: var(--ox-primary); }
.ox-guide-zaman__s--bekler { background: repeating-linear-gradient(135deg, var(--ox-surface-2) 0 6px, var(--ox-surface) 6px 12px); color: var(--ox-fg); font-weight: var(--ox-weight-medium); }
.ox-guide-zaman__eksen { display: flex; min-width: 0; font-size: var(--ox-text-xs); color: var(--ox-fg-muted); }
.ox-guide-zaman__aralik { display: flex; justify-content: space-between; gap: var(--ox-space-1); min-width: 0; padding-top: var(--ox-space-1); border-top: 1px dashed var(--ox-border-strong); white-space: nowrap; }
/* Mesafe ölçeği: resim değil sayfa bileşeni. Sütun genişlikleri mesafeyle (1 : 2 : 3 aralık), harf boyu kuralla (1 : 3 : 6) orantılı. */
.ox-guide-mesafe { display: grid; gap: var(--ox-space-3); padding: var(--ox-space-4); border-radius: var(--ox-radius-md); background: var(--ox-surface-2); }
.ox-guide-mesafe__olcek { display: grid; grid-template-columns: 32px 1fr 2fr 3fr; align-items: end; justify-items: end; width: 100%; max-width: 720px; margin-inline: auto; }
.ox-guide-mesafe__goz { display: inline-flex; justify-self: start; padding-bottom: var(--ox-space-1); color: var(--ox-fg-muted); }
.ox-guide-mesafe__harf { line-height: .78; padding-bottom: var(--ox-space-2); font-weight: var(--ox-weight-semibold); color: var(--ox-primary); }
html[dir="rtl"] .ox-guide-mesafe__harf { line-height: 1.1; padding-bottom: 0; }
.ox-guide-mesafe__etiket { display: grid; justify-items: end; width: 100%; padding-top: var(--ox-space-1); border-top: 2px solid var(--ox-border-strong); font-size: var(--ox-text-sm); line-height: 1.3; font-variant-numeric: tabular-nums; }
.ox-guide-mesafe__etiket small, .ox-guide-mesafe__not small { font-size: var(--ox-text-xs); color: var(--ox-fg-muted); }
.ox-guide-mesafe__not { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 2px var(--ox-space-2); font-size: var(--ox-text-sm); }
/* Raf etiketleri: kapsama sayfada çizilir, metni çevrilir. Halkalar yarıçapla orantılı (15 / 20). */
.ox-guide-kapsama { display: grid; gap: var(--ox-space-3); justify-items: center; min-width: 0; }
.ox-guide-kapsama__alan { position: relative; width: 100%; max-width: 320px; aspect-ratio: 1; }
.ox-guide-kapsama__halka { position: absolute; display: flex; align-items: flex-end; justify-content: center; border-radius: 50%; color: var(--ox-primary); font-size: var(--ox-text-sm); font-weight: var(--ox-weight-semibold); }
.ox-guide-kapsama__halka--dis { inset: 0; padding-bottom: 3.5%; background: var(--ox-primary-subtle); border: 1px dashed var(--ox-primary); }
.ox-guide-kapsama__halka--ic { inset: 12.5%; padding-bottom: 5%; background: color-mix(in srgb, var(--ox-primary) 20%, var(--ox-surface)); border: 1px solid var(--ox-primary); }
.ox-guide-kapsama__ap { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; font-size: var(--ox-text-sm); font-weight: var(--ox-weight-semibold); color: var(--ox-fg); }
.ox-guide-kapsama__ikon { display: inline-flex; padding: 8px; border-radius: 50%; background: var(--ox-primary); color: var(--ox-primary-fg); }
.ox-guide-kapsama__lejant { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--ox-space-2) var(--ox-space-5); font-size: var(--ox-text-sm); }
.ox-guide-kapsama__lejant > span { display: inline-flex; align-items: flex-start; gap: var(--ox-space-2); }
.ox-guide-kapsama__lejant small { display: block; font-size: var(--ox-text-xs); color: var(--ox-fg-muted); }
.ox-guide-kapsama__nokta { flex: none; width: 12px; height: 12px; margin-top: 3px; border-radius: 50%; background: color-mix(in srgb, var(--ox-primary) 20%, var(--ox-surface)); border: 1px solid var(--ox-primary); }
.ox-guide-kapsama__nokta--dis { background: var(--ox-primary-subtle); border-style: dashed; }
.ox-guide-renkler { display: inline-flex; gap: 4px; }
.ox-guide-renk { display: block; width: 18px; height: 18px; border-radius: 50%; border: 1px solid var(--ox-border-strong); }
/* Yatay kart: metin kendi görselinin yanında, dikeyde ortalı; sütunlar arasında boş alan kalmaz. Telefonda görsel üstte. */
.ox-guide-item--yatay { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--ox-space-4); align-items: center; }
.ox-guide-item--tel { grid-template-columns: minmax(0, 260px) minmax(0, 1fr); }
.ox-guide-item--orta { display: flex; align-items: center; justify-content: center; }
.ox-guide-aileler { grid-auto-rows: 1fr; }
.ox-guide-aileler > .ox-guide-item { display: grid; align-content: center; gap: var(--ox-space-2); }
.ox-guide-item__metin { display: grid; gap: var(--ox-space-2); min-width: 0; }
.ox-guide-item--teslim { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
html[data-device="phone"] .ox-guide-item--yatay { grid-template-columns: minmax(0, 1fr); }
html[data-device="phone"] .ox-guide-item--tel .ox-guide-fig { max-width: 260px; margin-inline: auto; width: 100%; }
html[data-device="phone"] .ox-guide .ox-guide-tipler { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ox-guide-tip { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px var(--ox-space-2); font-size: var(--ox-text-sm); font-variant-numeric: tabular-nums; }
.ox-guide-tip .ox-guide-renk { width: 14px; height: 14px; }
.ox-guide-etiket-olculer { display: flex; flex-wrap: wrap; gap: 6px; }
.ox-guide-etiket-olculer bdi { padding: 2px 8px; border-radius: var(--ox-radius-sm); background: var(--ox-surface-2); font-size: var(--ox-text-sm); font-variant-numeric: tabular-nums; }
.ox-guide-fig--ekran .ox-guide-fig__img { border: 1px solid var(--ox-border); }
/* Sekme başlığı kart başlıklarıyla aynı çizgide: kit kart iç boşluğu + 1 px kenarlık (components/card.css, mobile/cards.css) */
.ox-guide-page > .ox-guide-head { padding-inline: calc(var(--ox-space-6) + 1px); }
html:not([data-device="desktop"]) .ox-guide-page > .ox-guide-head { padding-inline: calc(var(--ox-space-4) + 1px); }
.ox-guide-i { display: inline-flex; flex: none; }
/* Telefon: başlık düğmeleri tam genişlik, eşit iki düğme */
html[data-device="phone"] .ox-guide .ox-page-header { flex-direction: column; flex-wrap: nowrap; align-items: stretch; }
html[data-device="phone"] .ox-guide .ox-page-header__left { flex: none; }
html[data-device="phone"] .ox-guide .ox-page-header__actions { flex: none; width: 100%; display: flex; flex-wrap: wrap; overflow: visible; gap: var(--ox-space-2); }
html[data-device="phone"] .ox-guide .ox-page-header__actions .ox-dropdown { flex: 1 1 auto; min-width: 0; }
html[data-device="phone"] .ox-guide .ox-page-header__actions .ox-btn { width: 100%; justify-content: center; }
.ox-guide-fig__open { display: block; width: 100%; padding: 0; border: 0; border-radius: var(--ox-radius-md); background: none; cursor: zoom-in; }
.ox-guide-fig__open:hover .ox-guide-fig__img { filter: brightness(.94); }
.ox-guide-fig__open:focus-visible { outline: 2px solid var(--ox-accent); outline-offset: 2px; }
.ox-guide-fig__img { display: block; width: 100%; height: auto; object-fit: cover; border-radius: var(--ox-radius-md); transition: filter .15s ease; }
.ox-guide-item:has(> .ox-guide-fig) .ox-guide-ico { pointer-events: none; }

/* Çıktı üstü marka satırı: yalnız yazdırma ve indirilen dosyada */
.ox-guide-brand { display: flex; align-items: center; gap: var(--ox-space-2); margin-bottom: var(--ox-space-3); font-size: var(--ox-text-md); }
.ox-guide-brand__logo { width: 28px; height: 28px; object-fit: contain; border-radius: var(--ox-radius-sm); }

/* Canlı sayfada yazdırma kökü ekranda görünmez; indirilen tek dosyada görünür */
html:not(.ox-guide-sa) #oxGuidePrint { display: none; }
html.ox-guide-sa * { box-sizing: border-box; }
html.ox-guide-sa [hidden] { display: none !important; }
html.ox-guide-sa, html.ox-guide-sa body { height: auto !important; min-height: 0 !important; overflow: auto !important; }
html.ox-guide-sa body { margin: 0; background: var(--ox-bg); color: var(--ox-fg); font-family: var(--ox-font-sans); font-size: var(--ox-text-base); line-height: var(--ox-leading-normal); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
html.ox-guide-sa #oxGuidePrint { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--ox-space-4); padding: 24px; }
html.ox-guide-sa[data-device="phone"] #oxGuidePrint { padding: 12px; }
/* Tek dosyada düğmeler açılır menüde değil, doğrudan şeritte: telefonda yan yana eşit, sığmazsa alt satıra. */
html.ox-guide-sa[data-device="phone"] .ox-guide .ox-page-header__actions > .ox-btn { flex: 1 1 auto; width: auto; min-width: 0; margin-inline-start: 0; height: var(--ox-control-h-md); }

/* PDF hazırlanırken düzen A4'e geçer: perde bu geçişi ekranda gizler, baskıya girmez. */
@media screen {
  html.ox-guide-print-cover body::after { content: attr(data-guide-print-note); position: fixed; inset: 0; z-index: 2147483000; display: flex; align-items: center; justify-content: center; padding: var(--ox-space-5); background: var(--ox-guide-cover, var(--ox-bg)); color: var(--ox-guide-cover-fg, var(--ox-fg)); font-size: var(--ox-text-md); text-align: center; }
}
.ox-guide-prof .ox-guide-kopya { justify-content: flex-start; }
.ox-guide-prof .ox-guide-kopya .ox-btn { width: 100%; justify-content: center; }

/* Yazdırma: kenar boşluğu sayfanın içinde (pencerede "Kenar boşlukları: Yok" seçili olsa da her sayfada kalır); izgara ve esnek kaplar sayfaya bölünürken kart bindirdiği için dış yerleşim düz akış */
@media print {
  html.ox-guide-printing, html.ox-guide-printing body { height: auto !important; min-height: 0 !important; overflow: visible !important; background: #fff !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  html.ox-guide-printing body { display: block !important; }
  html.ox-guide-printing body > *:not(#oxGuidePrint) { display: none !important; }
  html.ox-guide-printing #oxGuidePrint { display: block !important; padding: 14mm 12mm !important; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
  #oxGuidePrint .ox-guide-tabs, #oxGuidePrint .ox-guide-next, #oxGuidePrint .ox-page-header__actions, #oxGuidePrint .ox-guide-row, #oxGuidePrint .ox-guide-no-print { display: none !important; }
  #oxGuidePrint .ox-guide-page, #oxGuidePrint .ox-guide-page[hidden], #oxGuidePrint .ox-guide-stack, #oxGuidePrint .ox-guide-body, #oxGuidePrint .ox-guide-bolum { display: block !important; }
  html.ox-guide-print-tab #oxGuidePrint .ox-guide-page[hidden] { display: none !important; }
  html.ox-guide-print-tab #oxGuidePrint .ox-guide-page { break-before: auto !important; }
  #oxGuidePrint .ox-guide-profile { break-inside: avoid; }
  #oxGuidePrint .ox-page-header { margin-bottom: var(--ox-space-3); }
  #oxGuidePrint .ox-guide-page > *, #oxGuidePrint .ox-guide-stack > *, #oxGuidePrint .ox-guide-body > *, #oxGuidePrint .ox-guide-bolum > * { margin-bottom: var(--ox-space-3); }
  #oxGuidePrint .ox-guide-page > :last-child, #oxGuidePrint .ox-guide-stack > :last-child, #oxGuidePrint .ox-guide-body > :last-child, #oxGuidePrint .ox-guide-bolum > :last-child { margin-bottom: 0; }
  #oxGuidePrint .ox-guide-ver, #oxGuidePrint .ox-guide-prof, #oxGuidePrint .ox-guide-yan { display: block !important; }
  #oxGuidePrint .ox-guide-ver > .ox-card, #oxGuidePrint .ox-guide-prof > .ox-card { display: block !important; margin-bottom: var(--ox-space-3); }
  #oxGuidePrint .ox-guide-yan > * { margin-bottom: var(--ox-space-3); }
  #oxGuidePrint .ox-guide-yan__metin { display: block !important; break-inside: avoid; }
  #oxGuidePrint .ox-guide-yan__metin > * { margin-bottom: var(--ox-space-3); }
  /* Yatay kart A4'te dar kalır: görsel üstte, telefon görseli ortada; teslim notu iki sütun. Başlık ve giriş sonraki içerikten kopmaz. */
  #oxGuidePrint .ox-guide-item--yatay { grid-template-columns: minmax(0, 1fr); gap: var(--ox-space-2); }
  #oxGuidePrint .ox-guide-item--tel .ox-guide-fig { width: 100%; max-width: 190px; margin-inline: auto; }
  #oxGuidePrint .ox-guide-item--teslim { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  #oxGuidePrint .ox-card__header, #oxGuidePrint .ox-guide-body > h3, #oxGuidePrint .ox-guide-body > p { break-after: avoid; }
  #oxGuidePrint .ox-guide-body > p { break-inside: avoid; }
  #oxGuidePrint .ox-guide-body ul { display: block !important; }
  #oxGuidePrint .ox-guide-body li { margin-bottom: 6px; break-inside: avoid; }
  #oxGuidePrint .ox-stats { grid-template-columns: minmax(0, 1fr) !important; }
  #oxGuidePrint .ox-guide-page + .ox-guide-page { break-before: page; }
  #oxGuidePrint .ox-card { box-shadow: none !important; overflow: visible !important; }
  #oxGuidePrint .ox-card__body { padding: var(--ox-space-4) !important; }
  #oxGuidePrint .ox-card__body--tight { padding: 0 !important; }
  #oxGuidePrint .ox-guide-item, #oxGuidePrint .ox-statcard, #oxGuidePrint .ox-note, #oxGuidePrint .ox-guide-fig, #oxGuidePrint tr { break-inside: avoid; }
  #oxGuidePrint .ox-card__header, #oxGuidePrint .ox-guide-bolum__baslik, #oxGuidePrint .ox-guide-head, #oxGuidePrint .ox-guide-ico { break-inside: avoid; break-after: avoid; }
  #oxGuidePrint .ox-guide-bolum__baslik + p, #oxGuidePrint .ox-card__body > p:first-child { break-before: avoid; }
  #oxGuidePrint .ox-statcard { transform: none !important; }
  #oxGuidePrint .ox-table-wrap { overflow: visible !important; height: auto !important; }
  #oxGuidePrint .ox-guide-vt, #oxGuidePrint .ox-guide-kvt { height: auto !important; }
  #oxGuidePrint .ox-guide-g5 { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
  #oxGuidePrint .ox-guide-g5 > * { grid-column: span 2; }
  #oxGuidePrint .ox-guide-g5 > :nth-last-child(-n+2) { grid-column: span 3; }
  #oxGuidePrint .ox-guide-g4, #oxGuidePrint .ox-guide-figs--4 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  /* 11.11 (kullanıcı): Giriş doğrulaması sekmesi A4'te — üçlü ekran görüntüsü satırı ikiliye iner (tablet gibi), uzun ekran görüntüsü sayfayı
     doldurmaz (en çok 300 px, oran korunur, ortada); ikiliye inince tek kalan üçüncü öğe tam genişlikte yatay kart olur (görsel bir yanda,
     başlık + açıklama öbür yanda), satırın yarısı boş kalmaz. Yalnız bu sekmenin çıktısı; diğer sekmelerin onaylı baskı düzeni değişmez. */
  #oxGuidePrint [data-ox-panel="pguide:giris-dogrulama"] .ox-guide-figs--3 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #oxGuidePrint [data-ox-panel="pguide:giris-dogrulama"] .ox-guide-figs--3 > .ox-guide-item:nth-child(3):last-child { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--ox-space-3); align-items: center; }
  #oxGuidePrint [data-ox-panel="pguide:giris-dogrulama"] .ox-guide-figs--3 > .ox-guide-item:nth-child(3):last-child > .ox-guide-fig { grid-column: 1; grid-row: 1 / span 2; }
  #oxGuidePrint [data-ox-panel="pguide:giris-dogrulama"] .ox-guide-figs--3 > .ox-guide-item:nth-child(3):last-child > h3 { grid-column: 2; align-self: end; }
  #oxGuidePrint [data-ox-panel="pguide:giris-dogrulama"] .ox-guide-figs--3 > .ox-guide-item:nth-child(3):last-child > p { grid-column: 2; align-self: start; }
  #oxGuidePrint [data-ox-panel="pguide:giris-dogrulama"] .ox-guide-fig__img { width: auto; max-width: 100%; max-height: 300px; margin-inline: auto; object-fit: contain; }
}