/* TrendSatıcı tanıtım sitesi (/tanitim) — "Günlük işler de aynı panelde." bölümü, "Bir iş günü" (önek tgb-).
   20.10.2026, kullanıcı B'yi seçti. İşaretleme: templates/reklam/_gunluk.html (gunluk_isler makrosu); hareket:
   static/js/tanitim-gunluk-2026.js. Yalnız /tanitim'de, tanitim-2026.css'ten sonra yüklenir (bölümün kuralları
   tanitim-2026.css'in değişkenlerini ve .tn-h2 başlığını kullanır).
   Başlangıç: .tgb-hazir (adım durumlarının iskeleti) sayfa ayrıştırılırken şablondaki satır içi betikle verilir; betik
   gelmezse sayfa yüklenince kaldırılır. JS yokken ve hareket azaltılmışken her sahnenin son hâli görünür. */

/* Menüdeki çapalar (#alan-icerik, #alan-operasyon) gruplarda; JS ölçüp bölümün başına göre yeniden verir (JS yokken bu) */
.tn-gunluk__alan { scroll-margin-top: calc(var(--tn-bar) + 16px); }

/* ── Sahneler panelin gerçek parçaları (renk-2026 / bilesenler-2026
   ölçüleri) ve demo mağazanın gerçek verisiyle kuruldu. Hareket: yalnız opacity / transform / clip-path; sahne ekranda
   değilken ya da sekme gizliyken hiçbir şey çalışmaz; azaltılmış harekette her sahnenin durağan son hâli. ── */
.tgb { --tgb-e: cubic-bezier(.2, 0, 0, 1); }
.tgb-gizli { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.tgb-simge { position: absolute; width: 0; height: 0; overflow: hidden; }

/* Gün çizelgesi */
.tgb-cizelge { position: relative; height: 22px; margin: 32px 10px 0; }
.tgb-cizelge__ray { position: absolute; left: 0; right: 0; top: 10px; height: 2px; border-radius: 1px; background: rgba(243, 239, 233, .12); overflow: hidden; }
.tgb-cizelge__dolu { position: absolute; inset: 0; background: #A69D93; transform-origin: 0 50%; transform: scaleX(0); }
.tgb-an { position: absolute; top: -1px; left: calc(var(--x) * 1%); width: 24px; height: 24px; margin-left: -12px; padding: 0; border: 0;
  background: none; color: inherit; font: inherit; cursor: pointer; }
.tgb-an__nokta { position: absolute; left: 7px; top: 7px; width: 10px; height: 10px; border-radius: 50%; background: var(--tn-gece-2);
  box-shadow: inset 0 0 0 1.5px #7C736B; }
.tgb-an__nokta::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: #A69D93; opacity: 0; transform: scale(.5);
  transition: opacity .3s var(--tgb-e), transform .3s var(--tgb-e); }
.tgb-an.gecti .tgb-an__nokta::after { opacity: 1; transform: scale(.5); }
.tgb-an.aktif .tgb-an__nokta { box-shadow: inset 0 0 0 1.5px #F3EFE9; }
.tgb-an.aktif .tgb-an__nokta::after { opacity: 1; transform: scale(1); background: #F3EFE9; }
.tgb-an__saat { display: none; }
.tgb-cizelge__uc { position: absolute; top: 26px; font-size: 12px; line-height: 16px; color: #A69D93; font-variant-numeric: tabular-nums; }
.tgb-cizelge__uc--bas { left: -10px; } .tgb-cizelge__uc--son { right: -10px; }
.tgb-cizelge { margin-bottom: 28px; }   /* denetim 20.10: uç saatler (alt satır 42 px) sahneye 2 px yapışıktı */
@media (min-width: 1024px) {
  /* Cila: kısa yazım (margin) alt boşluğu sıfırlıyordu; saatler sahneye 4 px yapışıktı. Uç saatler sütun kenarına hizalı.
     20.10 (geri bildirim): çizelge sağ sütunda, sahneyle aynı genişlikte; üst boşluğu yerleşim ızgarası verir. */
  .tgb-cizelge { height: 44px; margin: 0 0 20px; }
  .tgb-an { width: 44px; height: 44px; margin-left: -22px; }
  .tgb-an__nokta { left: 17px; }
  .tgb-an__saat { display: block; position: absolute; left: 0; right: 0; top: 24px; text-align: center; font-size: 12px; line-height: 16px;
    color: #A69D93; font-variant-numeric: tabular-nums; }
  .tgb-an[data-i="0"] .tgb-an__saat { left: 22px; right: auto; text-align: left; }
  .tgb-an:hover .tgb-an__saat { color: #D3CCC3; }
  .tgb-an.aktif .tgb-an__saat { color: #F3EFE9; font-weight: 500; }
  .tgb-cizelge__uc--bas { display: none; }
  .tgb-cizelge__uc--son { top: 23px; right: 0; }
}

/* Alt yazı: sayfadaki video alt yazılarıyla aynı dil (başlık 17/20 px · 500, gövde tn-govde ölçüsü); saat tn-etiket gibi */
.tgb-alt { margin-top: 16px; min-height: 76px; }
.tgb-alt__metin { min-width: 0; display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 10px; row-gap: 6px; }
.tgb-alt__saat { font-size: 13px; line-height: 16px; font-weight: 500; color: var(--tn-marka-gece); font-variant-numeric: tabular-nums; }
.tgb-alt__ad { font-size: 17px; line-height: 22px; font-weight: 500; color: var(--tn-beyaz); }
.tgb-alt__aciklama { flex-basis: 100%; font-size: 16px; line-height: 23px; color: var(--tn-k-yazi-3); }
@media (min-width: 768px) { .tgb-alt__aciklama { font-size: 17px; line-height: 24px; } }
@media (min-width: 1024px) { .tgb-alt { margin-top: 24px; min-height: 57px; } .tgb-alt__ad { font-size: 20px; line-height: 26px; } .tgb-alt__aciklama { font-size: 18px; line-height: 25px; } }

/* Durdur / oynat: sayfadaki videolarla aynı kural (20.10.2026, kullanıcı: "ekranda durdur tuşu öyle görünmesin") —
   oynarken görünmez; fareyle sahnenin üstüne gelince, klavyeyle odaklanınca ya da durdurulmuşken görünür. */
/* 20.10 (geri bildirim): sahne artık bölümün tamamını kaplamıyor; sağ sütunda. Sahnenin iç düzeni pencereye değil kendi
   genişliğine göre seçilir (kap sorgusu): ≥ 840 px masaüstü düzeni, altı sıkı düzen (tablet / telefon). */
.tgb-cerceve { position: relative; cursor: pointer; container: tgb-sahne / inline-size; }
.tgb-oynat { position: absolute; right: 12px; bottom: 12px; z-index: 2; display: grid; place-items: center; width: 36px; height: 36px; padding: 0;
  border: 0; border-radius: 50%; cursor: pointer; color: #F3EFE9; background: rgba(21, 19, 17, .62);
  box-shadow: 0 0 0 1px rgba(243, 239, 233, .14); opacity: 0; transition: opacity .2s ease, background-color .15s ease; }
.tgb-oynat[data-durum="durdu"], .tgb-oynat:focus-visible { opacity: 1; }
@media (hover: hover) and (pointer: fine) { .tgb-cerceve:hover .tgb-oynat { opacity: 1; } }
.tgb-oynat:hover { background: rgba(21, 19, 17, .86); }
.tgb-oynat:focus-visible { outline: 2px solid #F3EFE9; outline-offset: 2px; }
.tgb-oynat[hidden] { display: none; }
.tgb-oynat svg { width: 18px; height: 18px; grid-area: 1 / 1; }
.tgb-oynat .tgb-oynat__oynat, .tgb-oynat[data-durum="durdu"] .tgb-oynat__durdur { display: none; }
.tgb-oynat[data-durum="durdu"] .tgb-oynat__oynat { display: block; }
@container tgb-sahne (min-width: 840px) { .tgb-oynat { right: 16px; bottom: 16px; } }

/* ── Yerleşim (20.10, geri bildirim: "sayfanın hepsini kaplıyor; sağında veya solunda adları yazsın").
   Masaüstü: solda özellik adları (dikey liste), sağda ~2/3 genişlikte çizelge + sahne + alt yazı. Altında: tek sütun,
   liste alt yazının altında. DOM sırası değişmedi (çizelge → sahne → alt yazı → liste); ızgara yalnız yerleştirir. ── */
.tgb-duzen { display: grid; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1024px) {
  .tgb-duzen { grid-template-columns: 196px minmax(0, 1fr); grid-template-rows: auto auto auto; column-gap: 32px; margin-top: 40px; }
  .tgb-duzen > .tgb-cizelge { grid-area: 1 / 2; }
  .tgb-duzen > .tgb-cerceve { grid-area: 2 / 2; }
  .tgb-duzen > .tgb-alt { grid-area: 3 / 2; }
  .tgb-duzen > .tgb-listeler { grid-area: 2 / 1 / 4 / 2; align-self: start; }
}
@media (min-width: 1200px) { .tgb-duzen { grid-template-columns: 220px minmax(0, 1fr); } }
@media (min-width: 1280px) { .tgb-duzen { grid-template-columns: 240px minmax(0, 1fr); column-gap: 40px; } }
@media (min-width: 1440px) { .tgb-duzen { grid-template-columns: 264px minmax(0, 1fr); column-gap: 48px; } }

/* Özellik adları: iki grup, okuma sırası günün sırası (her grupta saat sırasıyla). O anki özellik parlak ve solundaki
   ince rayda 2 px çizgiyle belirgin (yalnız transform). Tıklayınca o ana atlar; ↑ ↓ Home End ile listede gezilir. */
.tgb-listeler { display: grid; gap: 24px; margin-top: 32px; }
.tgb-grup { display: grid; gap: 8px; align-content: start; }
.tgb-grup__ad { font-size: 13px; line-height: 16px; font-weight: 500; color: var(--tn-marka-gece); }
.tgb-maddeler { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 12px; }
.tgb-madde { position: relative; display: flex; align-items: center; width: 100%; min-height: 40px; padding: 8px 4px 8px 14px; border: 0;
  background: none; box-shadow: inset 1px 0 0 var(--tn-k-cizgi); color: var(--tn-k-yazi-3); font: inherit; font-size: 14px; line-height: 20px;
  text-align: left; cursor: pointer; border-radius: 0; }
.tgb-madde::before { content: ""; position: absolute; left: 0; top: 7px; bottom: 7px; width: 2px; border-radius: 1px; background: var(--tn-beyaz);
  transform: scaleY(0); transition: transform .45s var(--tgb-e); }
.tgb-madde[aria-current="true"]::before { transform: none; }
.tgb-madde strong { font-weight: 400; }
.tgb-madde:hover, .tgb-madde[aria-current="true"] { color: var(--tn-beyaz); }
.tgb-madde[aria-current="true"] strong { font-weight: 500; }
.tgb-madde:focus-visible { outline-offset: -2px; }
@media (min-width: 640px) {
  .tgb-listeler { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; }
  .tgb-maddeler { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 1024px) {
  .tgb-listeler { grid-template-columns: minmax(0, 1fr); gap: 28px; margin-top: 0; }
  .tgb-madde { min-height: 38px; padding: 9px 4px 9px 16px; font-size: 15px; }
}

/* ── Sahne: panelin açık zemini; boy sabit ── */
.tgb-sahne { position: relative; height: 460px; border-radius: 16px; background: #f7f7f7; overflow: hidden; contain: strict;
  pointer-events: none; user-select: none; -webkit-user-select: none; color: #303030; font-size: 13px; line-height: 18px; font-weight: 400;
  font-variant-numeric: tabular-nums; letter-spacing: 0; text-align: left; }
@container tgb-sahne (min-width: 840px) { .tgb-sahne { height: 500px; border-radius: 24px; } }
.tgb-sahne p { margin: 0; }
/* Sahne geçişi (cila): iki yoğun ekran üst üste binmesin. Eski sahne hızla söner (hızlanan eğri); yenisi o tam sönünce
   (200 ms) açılır ve 8 px yükselerek yerine oturur (panelin yumuşak sayfa geçişi gibi). Yalnız opacity + transform. */
.tgb-s { position: absolute; inset: 0; opacity: 0; visibility: hidden;
  transition: opacity .2s cubic-bezier(.4, 0, 1, 1), visibility 0s linear .2s; }
.tgb-s.aktif { opacity: 1; visibility: visible; transition: opacity .34s var(--tgb-e) .2s; }
.tgb-s > * { transition: transform .55s var(--tgb-e) .2s; }
.tgb-s:not(.aktif) > * { transform: translateY(8px); transition: transform 0s linear .2s; }

/* Tek odak (cila): adımın konusu olmayan satır ve kartlar geri çekilir; göz yalnız değişen yere gider. Yalnız opacity. */
.tgb-hazir .tgb-s .tgb-sat:not([data-g]), .tgb-hazir .tgb-s .tgb-kart:not([data-g]), .tgb-hazir .tgb-s .tgb-serit { transition: opacity .45s var(--tgb-e), transform .12s var(--tgb-e); }
.tgb-hazir .tgb-s .sonuk, .tgb-hazir .tgb-s [data-g].on.sonuk { opacity: .4; }
.tgb-p { position: absolute; inset: 0; display: flex; flex-direction: column; gap: 12px; padding: 14px; }
@container tgb-sahne (min-width: 840px) { .tgb-p { gap: 14px; padding: 20px 24px; } }

/* Adım durumları: data-g = o adımda belirir, data-x = o adımda söner. JS yokken son hâl görünür. */
.tgb-hazir .tgb-s [data-g] { opacity: 0; transform: translateY(4px);
  transition: opacity .32s var(--tgb-e) var(--d, 0s), transform .32s var(--tgb-e) var(--d, 0s); }
.tgb-hazir .tgb-s [data-g].on { opacity: 1; transform: none; }
.tgb-hazir .tgb-s [data-x] { transition: opacity .25s var(--tgb-e), transform .25s var(--tgb-e); }
.tgb-hazir .tgb-s [data-x].off { opacity: 0; }
.tgb:not(.tgb-hazir) [data-x] { opacity: 0; }
.tgb-hazir .tgb-s .tgb-k-yok[data-g] { transform: none; }
.tgb-hazir .tgb-s .tgb-k-sag[data-g] { transform: translateX(18px); }
.tgb-hazir .tgb-s .tgb-k-asagi[data-g] { transform: translateY(-6px); }
.tgb-hazir .tgb-s .tgb-k-olcek[data-g] { transform: scale(.97); }
.tgb-hazir .tgb-s .tgb-k-sag[data-g].on, .tgb-hazir .tgb-s .tgb-k-asagi[data-g].on, .tgb-hazir .tgb-s .tgb-k-olcek[data-g].on { transform: none; }
.tgb-hazir .tgb-s .tgb-k-perde[data-g] { opacity: 1; transform: none; clip-path: inset(0 100% 0 0);
  transition: clip-path var(--yaz, .8s) steps(var(--n, 16), end) var(--d, 0s); }
.tgb-hazir .tgb-s .tgb-k-perde-y[data-g] { opacity: 1; transform: none; clip-path: inset(0 0 100% 0);
  transition: clip-path var(--yaz, .9s) var(--tgb-e) var(--d, 0s); }
.tgb-hazir .tgb-s .tgb-k-perde[data-g].on, .tgb-hazir .tgb-s .tgb-k-perde-y[data-g].on { clip-path: inset(0); }
.tgb-hazir .tgb-s [data-g][data-x].on.off { opacity: 0; }
/* Anlık kurulum yalnız içeriğe: sahne kabının kendi geçişi kesilmesin (aynı sahneye yeniden tıklayınca bir an tam opak parlıyordu) */
.tgb-anlik *, .tgb-anlik *::before, .tgb-anlik *::after { transition: none !important; animation: none !important; }
.tgb-takas { display: inline-grid; justify-items: start; }
.tgb-takas > * { grid-area: 1 / 1; }
.tgb-hazir .tgb-s .tgb-takas > [data-g] { transform: none; }
.tgb-takas--sag { justify-items: end; } .tgb-takas--orta { justify-items: center; }

/* Panel parçaları (Polaris ölçüleri) */
.tgb-bas { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex: none; }
.tgb-bas__sol { min-width: 0; }
.tgb-bas__ad { font-size: 17px; line-height: 22px; font-weight: 650; color: #1a1a1a; letter-spacing: -.01em; }
.tgb-bas__alt { margin-top: 2px; font-size: 12px; line-height: 16px; color: #616161; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tgb-bas__eylem { display: flex; align-items: center; gap: 8px; flex: none; }
@container tgb-sahne (min-width: 840px) { .tgb-bas__ad { font-size: 20px; line-height: 26px; } .tgb-bas__alt { font-size: 13px; line-height: 18px; } }
.tgb-kart { position: relative; background: #fff; border-radius: 12px; box-shadow: 0 0 0 1px rgba(0, 0, 0, .07), 0 1px 0 rgba(0, 0, 0, .06); overflow: hidden; }
.tgb-kart__bas { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; padding: 8px 14px;
  border-bottom: 1px solid #ebebeb; }
.tgb-kart__ad { font-weight: 600; color: #303030; }
.tgb-kart__alt { font-size: 12px; line-height: 16px; color: #616161; }
.tgb-gri { color: #616161; } .tgb-soluk { color: #8a8a8a; } .tgb-kalin { font-weight: 600; }
.tgb-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; letter-spacing: 0; }
.tgb-kes { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.tgb-sag { justify-self: end; text-align: right; }
.tgb-i { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

.tgb-r { display: inline-flex; align-items: center; gap: 5px; padding: 1px 8px 1px 6px; border-radius: 8px; font-size: 12px; line-height: 18px;
  font-weight: 500; white-space: nowrap; background: #ebebeb; color: #4a4a4a; }
.tgb-r::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #8a8a8a; flex: none; }
.tgb-r--yalin { padding: 1px 8px; } .tgb-r--yalin::before { display: none; }
.tgb-r--basari { background: #affebf; color: #014b40; } .tgb-r--basari::before { background: #047b5d; }
.tgb-r--bilgi { background: #d5ebff; color: #003a5a; } .tgb-r--bilgi::before { background: #0094d5; }
.tgb-r--dikkat { background: #ffeb78; color: #4f4700; } .tgb-r--dikkat::before { background: #8a6d00; }
.tgb-r--kritik { background: #fed1d7; color: #8e0b21; } .tgb-r--kritik::before { background: #e22c38; }

.tgb-d { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 28px; padding: 0 12px;
  border-radius: 8px; background: #fff; color: #303030; font-size: 13px; line-height: 18px; font-weight: 500; white-space: nowrap;
  box-shadow: inset 0 0 0 1px #e3e3e3, inset 0 -1px 0 0 #b5b5b5; transition: transform .12s var(--tgb-e); }
.tgb-d--ana { background: #303030; color: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), inset 0 -1px 0 rgba(0, 0, 0, .55), 0 1px 1px rgba(0, 0, 0, .12); }
.tgb-d--k { height: 26px; padding: 0 10px; font-size: 12px; }
.tgb-d--tam { display: flex; width: 100%; }
.tgb-d::after { content: ""; position: absolute; inset: -3px; border-radius: 11px; box-shadow: 0 0 0 2px #005bd3; opacity: 0;
  transition: opacity .15s; }
.tgb-d.basili, .tgb-sekme.basili, .tgb-cip.basili, .tgb-sat.basili { transform: scale(.97); }
.tgb-d.basili::after { opacity: 1; }
.tgb-say { padding: 0 6px; border-radius: 6px; background: rgba(255, 255, 255, .16); font-size: 12px; line-height: 18px; }
.tgb-d__ort { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 6px; border-radius: 8px;
  background: #e3e3e3; color: #303030; }
.tgb-d__ort .tgb-say { background: rgba(0, 0, 0, .08); }
.tgb-bag { color: #005bd3; font-weight: 500; white-space: nowrap; }
.tgb-secim { display: inline-flex; align-items: center; justify-content: space-between; gap: 8px; height: 28px; padding: 0 8px 0 10px;
  border-radius: 8px; background: #fff; box-shadow: inset 0 0 0 1px #c9c9c9; white-space: nowrap; }
.tgb-secim .tgb-i { width: 14px; height: 14px; color: #616161; }
.tgb-etk { color: #616161; white-space: nowrap; }
.tgb-girdi { display: flex; align-items: center; height: 28px; padding: 0 8px; border-radius: 8px; background: #fff; box-shadow: inset 0 0 0 1px #c9c9c9;
  white-space: nowrap; overflow: hidden; }
.tgb-girdi--bos { color: #8a8a8a; text-overflow: ellipsis; display: block; line-height: 28px; }
.tgb-sekmeler { display: flex; align-items: center; gap: 2px; min-width: 0; overflow: hidden; }
.tgb-sekme { position: relative; z-index: 0; flex: none; padding: 4px 10px; border-radius: 8px; font-weight: 500; color: #303030; white-space: nowrap;
  transition: transform .12s var(--tgb-e); }
.tgb-sekme small { margin-left: 4px; font-size: 12px; font-weight: 400; color: #616161; }
.tgb-sekme::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 8px; background: #ebebeb; opacity: 0;
  transition: opacity .2s var(--tgb-e); }
.tgb-sekme.secili::before { opacity: 1; }
.tgb-seg { display: inline-flex; padding: 2px; border-radius: 9px; box-shadow: inset 0 0 0 1px #e3e3e3; background: #fff; }
.tgb-seg--tam { display: flex; }
.tgb-seg__o { position: relative; z-index: 0; flex: 1; padding: 3px 9px; border-radius: 7px; text-align: center; white-space: nowrap; color: #303030; font-size: 12px; }
.tgb-seg__o::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 7px; background: #ebebeb; opacity: 0; transition: opacity .2s var(--tgb-e); }
.tgb-seg__o.secili::before { opacity: 1; }
.tgb-seg__o.secili { font-weight: 500; }
.tgb-menu { position: absolute; z-index: 6; background: #fff; border-radius: 12px; padding: 6px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .08), 0 12px 28px -8px rgba(0, 0, 0, .22); }
.tgb-menu__o { position: relative; z-index: 0; display: block; padding: 6px 10px; border-radius: 8px; white-space: nowrap; }
.tgb-menu__o::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 8px; background: #f1f1f1; opacity: 0; transition: opacity .2s; }
.tgb-menu__o.uzerinde::before { opacity: 1; }
.tgb-ipucu { position: absolute; z-index: 7; padding: 6px 8px; border-radius: 8px; background: #1a1a1a; color: #fff; font-size: 12px; line-height: 16px;
  font-weight: 500; white-space: nowrap; box-shadow: 0 4px 12px rgba(0, 0, 0, .18); }
.tgb-arka { position: absolute; inset: 0; z-index: 8; background: rgba(0, 0, 0, .34); }
.tgb-pencere { position: absolute; z-index: 9; background: #fff; border-radius: 12px; overflow: hidden;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .08), 0 24px 48px -16px rgba(0, 0, 0, .35); }
.tgb-pencere__bas { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid #ebebeb; }
.tgb-pencere__ad { font-size: 14px; line-height: 20px; font-weight: 600; color: #1a1a1a; }
.tgb-pencere__kapat { margin-left: auto; color: #616161; }
.tgb-pencere__alt { display: flex; justify-content: flex-end; gap: 8px; padding: 10px 16px; border-top: 1px solid #ebebeb; }
.tgb-kucukresim { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 8px; background: #f1f1f1;
  box-shadow: inset 0 0 0 1px #e3e3e3; color: #8a8a8a; }
.tgb-kutu { position: relative; display: inline-block; flex: none; width: 15px; height: 15px; border-radius: 4px; box-shadow: inset 0 0 0 1px #8a8a8a; background: #fff; }
.tgb-kutu::after { content: ""; position: absolute; inset: 0; border-radius: 4px; opacity: 0; transform: scale(.6);
  background: #303030 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.4l2.6 2.6L12 5.6' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 13px no-repeat;
  transition: opacity .2s var(--tgb-e) var(--d, 0s), transform .2s var(--tgb-e) var(--d, 0s); }
.tgb-kutu.isaretli::after { opacity: 1; transform: none; }
.tgb-anahtar { position: relative; display: inline-block; flex: none; width: 34px; height: 20px; border-radius: 10px; background: #d4d4d4;
  transition: transform .12s var(--tgb-e); }
.tgb-anahtar.basili { transform: scale(.94); box-shadow: 0 0 0 2px #fff, 0 0 0 4px #005bd3; }
.tgb-anahtar::before { content: ""; position: absolute; inset: 0; border-radius: 10px; background: #303030; transition: opacity .25s var(--tgb-e); }
.tgb-anahtar::after { content: ""; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: #fff;
  transform: translateX(14px); transition: transform .25s var(--tgb-e); box-shadow: 0 1px 2px rgba(0, 0, 0, .25); }
.tgb-anahtar.kapali::before { opacity: 0; } .tgb-anahtar.kapali::after { transform: none; }
.tgb-vurgu-alan { position: relative; z-index: 0; }
.tgb-vurgu-alan::before { content: ""; position: absolute; inset: -3px -6px; z-index: -1; border-radius: 8px; background: #fff1b8; opacity: 0;
  transition: opacity .35s var(--tgb-e); }
.tgb-vurgu-alan.vurgu::before { opacity: 1; }

/* Tablo satırları (grid) */
.tgb-sat { display: grid; grid-template-columns: var(--sut); column-gap: 12px; align-items: center; min-height: 42px; padding: 4px 14px;
  border-top: 1px solid #ebebeb; transition: transform .12s var(--tgb-e); }
.tgb-sat > * { min-width: 0; }
.tgb-sat--bas { min-height: 32px; padding-top: 0; padding-bottom: 0; border-top: 0; border-bottom: 1px solid #ebebeb; background: #f7f7f7;
  color: #616161; font-size: 12px; font-weight: 500; white-space: nowrap; }
.tgb-sat--bas + .tgb-sat { border-top: 0; }
.tgb-c2 b { display: block; font-weight: 500; color: #303030; }
.tgb-c2 small { display: block; font-size: 12px; line-height: 16px; color: #616161; }
.tgb-c2 b, .tgb-c2 small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tgb-tg, .tgb-tgi { display: none; }

/* ── 0 · Paketleme ── */
.tgb-ikili { display: grid; grid-template-columns: minmax(0, 1fr) 336px; gap: 14px; flex: 1; min-height: 0; }
.tgb-pk-tb { --sut: 84px 96px minmax(0, 1fr) 82px 108px 64px; }
.tgb-pk-yan { position: relative; display: flex; flex-direction: column; gap: 12px; min-height: 0; }
.tgb-qr { display: flex; align-items: center; gap: 12px; padding: 10px 12px; }
.tgb-qr__kod { width: 64px; height: 64px; flex: none; }
.tgb-qr__ad { font-weight: 600; }
.tgb-qr p + p { font-size: 12px; line-height: 16px; color: #616161; }
.tgb-deste { position: relative; flex: 1; min-height: 0; }
.tgb-deste__arka { position: absolute; inset: 0; border-radius: 10px; background: #fff; box-shadow: 0 0 0 1px rgba(0, 0, 0, .07); }
.tgb-deste__arka--1 { transform: translateY(-6px) scaleX(.96); } .tgb-deste__arka--2 { transform: translateY(-12px) scaleX(.92); }
.tgb-a4 { position: absolute; inset: 0; display: flex; flex-direction: column; border-radius: 10px; background: #fff; overflow: hidden;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .09), 0 6px 16px -6px rgba(0, 0, 0, .18); font-size: 12px; line-height: 16px; }
.tgb-a4__ust { display: flex; justify-content: flex-end; padding: 8px 12px; border-bottom: 1px solid #ebebeb; text-align: right; }
.tgb-a4__ust b { display: block; font-size: 13px; font-weight: 600; }
.tgb-a4__ust small { display: block; font-size: 12px; color: #8a8a8a; }
.tgb-a4__orta { display: grid; grid-template-columns: 1.2fr 1fr; border-bottom: 1px solid #ebebeb; }
.tgb-a4__orta > div { padding: 8px 12px; }
.tgb-a4__orta > div + div { border-left: 1px solid #ebebeb; }
.tgb-a4__bas { font-weight: 600; margin-bottom: 4px !important; }
.tgb-a4 dl { margin: 0; display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 1px 8px; }
.tgb-a4 dt { white-space: nowrap; }
.tgb-a4 dt { color: #616161; } .tgb-a4 dd { margin: 0; white-space: nowrap; }
.tgb-a4__barkod { position: relative; text-align: center; }
.tgb-barkod { display: block; width: 100%; height: 40px; margin: 2px 0 2px; }
.tgb-tarama { position: absolute; left: 8px; right: 8px; top: 26px; height: 2px; border-radius: 1px; background: #e22c38; opacity: 0;
  box-shadow: 0 0 0 1px rgba(226, 44, 56, .15); }
.tgb-hazir .tgb-s .tgb-tarama.on { opacity: 0; }
.tgb-oyna .tgb-s.aktif .tgb-tarama.tara { animation: tgb-tara 1s var(--tgb-e) 1 both; }
@keyframes tgb-tara { 0% { opacity: 0; transform: translateY(0); } 15%, 80% { opacity: 1; } 100% { opacity: 0; transform: translateY(40px); } }
.tgb-a4__urun { padding: 8px 12px; border-bottom: 1px solid #ebebeb; flex: 1; }
.tgb-a4__urun p + p { margin-top: 2px !important; }
.tgb-a4__alt { display: flex; align-items: center; justify-content: space-between; padding: 6px 12px; color: #616161; }
.tgb-ep { top: 62px; right: 24px; width: 316px; padding: 14px; display: flex; flex-direction: column; gap: 8px; }
.tgb-ep__ad { font-weight: 600; font-size: 14px; }
.tgb-ep__etk { font-size: 12px; color: #616161; margin-top: 2px !important; }
.tgb-ep__ozel { display: flex; align-items: center; gap: 8px; color: #616161; }
.tgb-ep__ozel .tgb-girdi { flex: 1; }
.tgb-ep__say { text-align: center; color: #303030; }

/* ── 1 · Stok ── */
.tgb-metrik { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); flex: none; }
.tgb-metrik__o { padding: 10px 16px; }
.tgb-metrik__o + .tgb-metrik__o { border-left: 1px solid #ebebeb; }
.tgb-metrik__o p:first-child { font-size: 12px; line-height: 16px; color: #616161; }
.tgb-metrik__o p:last-child { display: flex; align-items: baseline; gap: 6px; margin-top: 2px; color: #616161; white-space: nowrap; }
.tgb-metrik__o b { font-size: 26px; line-height: 32px; font-weight: 600; color: #1a1a1a; letter-spacing: -.01em; }
.tgb-metrik__o .tgb-r { align-self: center; }
.tgb-metrik__o .tgb-vurgu-alan { margin-right: 5px; }   /* vurgu zemini 6 px taşar; "adet" ona yapışmasın */
.tgb-st-tb { --sut: minmax(0, 1fr) 92px 104px 112px 104px 132px 76px 72px; }
.tgb-st-ipucu { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 14px; border-bottom: 1px solid #ebebeb; font-size: 12px; color: #616161; }
.tgb-suz { width: 12px; height: 12px; margin-left: 5px; vertical-align: -2px; color: #8a8a8a; stroke-width: 1.5; }
.tgb-st-ipucu .tgb-suz { margin: 0 2px; }
.tgb-st-tb .tgb-sat:not(.tgb-sat--bas) { min-height: 60px; }
.tgb-cubuk { display: inline-block; vertical-align: middle; position: relative; width: 40px; height: 4px; margin-left: 8px; border-radius: 2px; background: #ebebeb; overflow: hidden; }
.tgb-cubuk::after { content: ""; position: absolute; inset: 0; background: #0a98e3; transform-origin: 0 50%; transform: scaleX(var(--p)); }
.tgb-ipuclu { position: relative; }
.tgb-ipuclu > .tgb-ipucu { bottom: calc(100% + 8px); left: 50%; translate: -50% 0; }
.tgb-sat small.tgb-birim { font-size: 12px; color: #8a8a8a; }

/* ── 2 · Ürünler ── */
.tgb-ur-slot { display: grid; min-height: 48px; border-bottom: 1px solid #ebebeb; }
.tgb-ur-slot > * { grid-area: 1 / 1; display: flex; align-items: center; gap: 8px; padding: 8px 14px; min-width: 0; }
.tgb-ur-slot .tgb-girdi { width: 190px; }
.tgb-ur-tb { --sut: 15px minmax(0, 1fr) 128px 150px 128px 60px 104px 60px 84px; }
.tgb-ur-tb .tgb-sat:not(.tgb-sat--bas) { min-height: 54px; }
.tgb-fiyat b { display: block; font-weight: 500; text-align: right; }
.tgb-fiyat small { display: block; text-align: right; font-size: 12px; color: #8a8a8a; white-space: nowrap; }
.tgb-fiyat s { color: #8a8a8a; }
.tgb-giris { display: flex; gap: 4px; }
.tgb-giris .tgb-girdi { flex: 1; justify-content: flex-end; min-width: 0; }
.tgb-giris .tgb-d { padding: 0 8px; }
.tgb-kar b { display: block; font-weight: 600; text-align: right; color: #303030; }
.tgb-kar small { display: block; text-align: right; font-size: 12px; color: #616161; }
.tgb-ust-sekme { display: flex; gap: 4px; flex: none; margin-top: -2px; border-bottom: 1px solid #e3e3e3; }
.tgb-ust-sekme span { position: relative; padding: 4px 12px 9px; font-weight: 500; color: #616161; }
.tgb-ust-sekme .secili { color: #1a1a1a; }
.tgb-ust-sekme .secili::after { content: ""; position: absolute; left: 8px; right: 8px; bottom: -1px; height: 2px; border-radius: 1px; background: #303030; }
.tgb-ur-menu { top: 56px; right: 128px; width: 220px; }
.tgb-ur-ipucu { top: 98px; right: 360px; width: 280px; white-space: normal; }

/* ── 3 · Müşteri soruları ── */
.tgb-ms-tb { --sut: minmax(0, 1fr) 84px 118px 104px 196px; }
.tgb-ms-tb .tgb-sat:not(.tgb-sat--bas) { min-height: 66px; padding-top: 8px; padding-bottom: 8px; align-items: start; }
.tgb-ms-soru { display: flex; gap: 10px; min-width: 0; }
.tgb-ms-soru > div { min-width: 0; }
.tgb-ms-soru small { display: block; font-size: 12px; line-height: 16px; color: #616161; }
.tgb-ms-soru b { display: block; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tgb-ms-cevap { display: block; font-size: 12px; line-height: 16px; color: #616161; min-height: 16px; }
.tgb-ms-eylem { display: flex; justify-content: flex-end; gap: 6px; }
.tgb-ms-pen { left: 50%; top: 18px; width: 600px; margin-left: -300px; }
.tgb-ms-govde { display: flex; flex-direction: column; gap: 8px; padding: 12px 16px; }
.tgb-ms-govde .tgb-soru-ad { font-size: 14px; font-weight: 500; color: #1a1a1a; }
.tgb-ms-meta { display: flex; align-items: center; gap: 8px; color: #616161; font-size: 12px; }
.tgb-cip { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 8px; background: #f1f1f1; color: #303030; font-size: 12px; line-height: 16px; white-space: nowrap;
  transition: transform .12s var(--tgb-e); }
.tgb-ms-satir { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 2px; }
.tgb-ms-oneri { position: relative; height: 76px; }
.tgb-ms-oneri__kutu { position: absolute; inset: 0; padding: 8px 12px; border-radius: 10px; box-shadow: inset 0 0 0 1px #e3e3e3; }
.tgb-ms-oneri__ust { display: flex; justify-content: space-between; align-items: center; color: #616161; font-size: 12px; }
.tgb-ms-oneri__metin { margin-top: 4px; color: #303030; }
.tgb-ms-yaz { position: relative; height: 60px; padding: 8px 12px; border-radius: 10px; box-shadow: inset 0 0 0 1px #b5b5b5; }
.tgb-ms-yaz > * { position: absolute; left: 12px; right: 12px; top: 8px; }
.tgb-ms-not { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; color: #616161; }
.tgb-ms-not > .tgb-takas { flex: none; white-space: nowrap; }

/* ── 4 · İhracat ── */
.tgb-ih { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 14px; flex: 1; min-height: 0; }
.tgb-ih-sol { display: grid; min-height: 0; }
.tgb-ih-sol > .tgb-ih-gorunum { grid-area: 1 / 1; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.tgb-ih-tb { --sut: 124px 96px 56px 52px minmax(0, 1fr) 92px; }
.tgb-ih-urun { --sut: minmax(0, 1fr) 56px 96px 64px; }
.tgb-ih-urun .tgb-sat:not(.tgb-sat--bas) { min-height: 46px; }
.tgb-ih-urun .tgb-ad-res { display: flex; align-items: center; gap: 10px; min-width: 0; }
.tgb-ih-urun .tgb-kucukresim { width: 30px; height: 30px; }
.tgb-ih-ozet { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tgb-ih-ozet .tgb-metrik__o b { font-size: 22px; line-height: 28px; }
.tgb-ih-yan { display: flex; flex-direction: column; }
.tgb-ih-yan .tgb-metrik__o { border-bottom: 1px solid #ebebeb; }
.tgb-ih-yan .tgb-metrik__o + .tgb-metrik__o { border-left: 0; }
.tgb-ih-yan .tgb-metrik__o b { font-size: 22px; line-height: 28px; }
.tgb-ulkeler { padding: 10px 16px; display: flex; flex-direction: column; gap: 4px; }
.tgb-ulkeler p:first-child { font-size: 12px; color: #616161; margin-bottom: 2px !important; }
.tgb-ulke { display: flex; justify-content: space-between; gap: 8px; }
.tgb-ulke span { color: #616161; }
.tgb-ih-not { padding: 0 16px 12px; font-size: 12px; line-height: 16px; color: #8a8a8a; }
.tgb-sat.secili-sat { background: #f7f7f7; }

/* ── 5 · Kargo ── */
.tgb-kg-tb { --sut: 118px 84px 88px 124px minmax(0, 1fr) 82px 82px 96px 70px; }
.tgb-kg-tb .tgb-sat:not(.tgb-sat--bas) { min-height: 40px; }
.tgb-kg-takim { display: grid; }
.tgb-kg-takim > div { grid-area: 1 / 1; }
.tgb-kg-alt { display: flex; justify-content: space-between; gap: 12px; padding: 8px 14px; border-top: 1px solid #ebebeb; font-size: 12px; color: #616161; }
.tgb-kg-ara { display: block; width: 260px; line-height: 28px; color: #8a8a8a; text-overflow: ellipsis; }
.tgb-zarar { color: #d72c0d; font-weight: 500; }

/* ── 6 · Görsel stüdyo ── */
.tgb-gs { display: grid; grid-template-columns: 448px minmax(0, 1fr); gap: 14px; flex: 1; min-height: 0; }
.tgb-gs-sol { display: flex; flex-direction: column; gap: 10px; padding: 14px 16px; }
.tgb-gs-satir { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.tgb-gs-satir small { font-size: 12px; color: #8a8a8a; }
.tgb-gs-yukle { display: flex; gap: 10px; align-items: center; }
.tgb-gs-alan { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; height: 46px; border-radius: 10px;
  border: 1px dashed #c9c9c9; color: #616161; }
.tgb-gs-alan small { color: #8a8a8a; font-size: 12px; }
.tgb-gs-foto { position: relative; width: 46px; height: 46px; flex: none; }
.tgb-gs-foto .tgb-kucukresim { width: 46px; height: 46px; }
.tgb-gs-foto .tgb-x { position: absolute; top: -6px; right: -6px; width: 18px; height: 18px; border-radius: 50%; background: #fff;
  box-shadow: 0 0 0 1px #e3e3e3; display: grid; place-items: center; color: #303030; }
.tgb-gs-foto .tgb-x .tgb-i { width: 10px; height: 10px; stroke-width: 2.4; }
.tgb-gs-komut { position: relative; height: 92px; padding: 8px 10px; border-radius: 10px; box-shadow: inset 0 0 0 1px #c9c9c9; overflow: hidden; }
.tgb-gs-komut > * { position: absolute; left: 10px; right: 10px; top: 8px; }
.tgb-cipler { display: flex; flex-wrap: wrap; gap: 6px; max-height: 54px; overflow: hidden; }
.tgb-cipler .tgb-cip { background: #fff; box-shadow: inset 0 0 0 1px #e3e3e3; padding: 3px 9px; position: relative; z-index: 0; }
.tgb-cipler .tgb-cip::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 8px; background: #303030; opacity: 0; transition: opacity .2s; }
.tgb-cipler .tgb-cip.secili { color: #fff; }
.tgb-cipler .tgb-cip.secili::before { opacity: 1; }
.tgb-gs-sag { display: grid; place-items: center; }
.tgb-gs-sag > * { grid-area: 1 / 1; }
.tgb-bos { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; color: #616161; }
.tgb-bos .tgb-i { width: 28px; height: 28px; color: #8a8a8a; stroke-width: 1.3; }
.tgb-bos b { color: #303030; font-weight: 600; }
.tgb-donen { width: 26px; height: 26px; border-radius: 50%; box-shadow: inset 0 0 0 3px #ebebeb; position: relative; }
.tgb-donen::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 3px solid transparent; border-top-color: #303030; }
.tgb-oyna .tgb-s.aktif .tgb-donen-kap.on .tgb-donen { animation: tgb-don .8s linear infinite; }
@keyframes tgb-don { to { transform: rotate(360deg); } }
.tgb-gs-sonuc { display: flex; align-items: flex-end; gap: 14px; }
.tgb-gs-sonuc img { display: block; width: 300px; height: 300px; object-fit: cover; object-position: 50% 54%; border-radius: 10px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .06); }
.tgb-gs-sonuc__d { display: flex; flex-direction: column; gap: 8px; }
.tgb-kota { width: 220px; font-size: 12px; color: #616161; text-align: right; }
.tgb-kota i { display: block; height: 4px; margin-top: 6px; border-radius: 2px; background: #ebebeb; overflow: hidden; position: relative; }
.tgb-kota i::after { content: ""; position: absolute; inset: 0; background: #303030; transform-origin: 0 50%; transform: scaleX(.24); }

/* ── 7 · Ekip ── */
.tgb-ek { display: grid; grid-template-columns: 208px minmax(0, 1fr); gap: 20px; flex: 1; min-height: 0; }
.tgb-ayar { display: flex; flex-direction: column; padding: 8px 6px; }
.tgb-ayar__bas { padding: 4px 10px 6px; font-size: 12px; line-height: 16px; color: #8a8a8a; }
.tgb-ayar span { padding: 4px 10px; border-radius: 8px; line-height: 18px; color: #303030; white-space: nowrap; }
.tgb-ayar .secili { background: #ebebeb; font-weight: 600; color: #1a1a1a; }
.tgb-ayar i { display: block; height: 1px; margin: 4px 8px; background: #ebebeb; }
.tgb-ek-sol { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.tgb-serit { padding: 8px 12px; border-radius: 10px; background: #e0f5fd; color: #003a5a; font-size: 12px; line-height: 16px; }
.tgb-ek-tb { --sut: minmax(0, 1fr) minmax(0, 1.4fr) 48px 74px; }
.tgb-ek-tb .tgb-sat:not(.tgb-sat--bas) { min-height: 52px; }
.tgb-uye { display: flex; align-items: center; gap: 10px; min-width: 0; }
.tgb-uye__harf { width: 28px; height: 28px; border-radius: 8px; background: #f1f1f1; box-shadow: inset 0 0 0 1px #e3e3e3; display: grid; place-items: center;
  color: #616161; font-weight: 500; flex: none; }
.tgb-ek-pen { left: 50%; top: 14px; width: 600px; margin-left: -300px; }
.tgb-izinler { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 10px 16px 12px; }
.tgb-izinler > p { grid-column: 1 / -1; font-size: 12px; color: #616161; }
.tgb-izin { position: relative; z-index: 0; padding: 6px 10px; border-radius: 8px; background: #fafafa; box-shadow: inset 0 0 0 1px #e3e3e3; min-width: 0; }
.tgb-izin::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 8px; background: #fff; box-shadow: inset 0 0 0 1.5px #303030; opacity: 0;
  transition: opacity .25s var(--tgb-e); }
.tgb-izin.secili::before { opacity: 1; }
.tgb-izin b { display: flex; align-items: center; gap: 4px; font-weight: 500; color: #4a4a4a; }
.tgb-izin small { display: block; font-size: 12px; line-height: 16px; color: #8a8a8a; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tgb-izin__tik { width: 0; overflow: hidden; opacity: 0; transition: opacity .2s; display: inline-flex; }
.tgb-izin__tik .tgb-i { width: 12px; height: 12px; stroke-width: 2.2; }
.tgb-izin.secili b { color: #1a1a1a; }
.tgb-izin.secili .tgb-izin__tik { width: auto; opacity: 1; }
.tgb-menu-on__satir { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: flex-start; gap: 4px 16px; padding: 10px 14px 14px; }
@container tgb-sahne (min-width: 1100px) { .tgb-menu-on__satir { justify-content: space-between; column-gap: 8px; } }
.tgb-mo-g { position: relative; z-index: 0; display: flex; flex-direction: column; gap: 2px; padding: 6px 8px; border-radius: 8px; transition: opacity .4s var(--tgb-e); }
.tgb-mo-g::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 8px; background: #f1f1f1; opacity: 0; transition: opacity .4s var(--tgb-e) .2s; }
.tgb-mo-g.yeni::before { opacity: 1; }
.tgb-mo { font-weight: 500; color: #303030; white-space: nowrap; }
.tgb-mo--alt { font-size: 12px; line-height: 16px; color: #616161; white-space: nowrap; }
.tgb-mo-g.kapali { opacity: .3; }

/* ── 8 · Bildirim kuralları ── */
.tgb-bk { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 14px; flex: 1; min-height: 0; }
.tgb-bk-tb { --sut: minmax(0, 1fr) 140px 64px 76px; }
.tgb-bk-tb .tgb-sat:not(.tgb-sat--bas) { min-height: 40px; }
.tgb-sat--tur { background: #fafafa; min-height: 36px; }
.tgb-sat--tur b { font-weight: 600; }
.tgb-sat--tur small { margin-left: 8px; font-size: 12px; color: #616161; }
.tgb-sat--kural > span:first-child { padding-left: 16px; }
.tgb-bk-kural { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.tgb-bk-kural--genis { grid-column: span 2; }
.tgb-zil { display: flex; flex-direction: column; }
.tgb-zil__bas { display: flex; align-items: center; gap: 6px; padding: 10px 14px; border-bottom: 1px solid #ebebeb; }
.tgb-zil__bas b { font-weight: 600; }
.tgb-zil__bas small { margin-left: auto; font-size: 12px; color: #616161; white-space: nowrap; }   /* 300 px sütunda iki satıra kırılıyordu */
.tgb-zil__liste { --sat-h: 58px; position: relative; flex: 1; overflow: hidden; }
.tgb-zs { position: absolute; left: 0; right: 0; top: 0; height: var(--sat-h); padding: 9px 14px 0 26px; border-bottom: 1px solid #ebebeb;
  transform: translateY(calc(var(--sira, 0) * var(--sat-h))); transition: transform .45s var(--tgb-e), opacity .3s var(--tgb-e); background: #fff; }
.tgb-zs::before { content: ""; position: absolute; left: 12px; top: 15px; width: 6px; height: 6px; border-radius: 50%; background: #005bd3; }
.tgb-zs__ust { display: flex; justify-content: space-between; gap: 8px; }
.tgb-zs__ust b { font-weight: 500; }
.tgb-zs__ust span { font-size: 12px; color: #616161; }
.tgb-zs p:last-child { font-size: 12px; color: #616161; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tgb-hazir .tgb-s .tgb-zs[data-g] { transform: translateY(calc(var(--sira, 0) * var(--sat-h))); }
.tgb-zs.disari { opacity: 0; }
.tgb-zil__alt { padding: 9px; text-align: center; border-top: 1px solid #ebebeb; font-weight: 500; }

/* ── 9 · TrendBot ── */
.tgb-tb-p { position: absolute; inset: 0; padding: 20px 24px; }
.tgb-tb-pano { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 22px; padding: 24px; }
.tgb-tb-selam { text-align: center; }
.tgb-tb-selam span { display: block; font-size: 18px; line-height: 24px; color: #4a4a4a; }
.tgb-tb-selam b { display: block; font-size: 22px; line-height: 28px; font-weight: 650; color: #1a1a1a; letter-spacing: -.01em; }
.tgb-tb-kutu { position: relative; width: 620px; max-width: 100%; height: 104px; padding: 14px 16px; border-radius: 16px; background: #fff;
  box-shadow: 0 0 0 1px #e3e3e3, 0 6px 16px -10px rgba(0, 0, 0, .25); }
.tgb-tb-kutu__metin { position: absolute; left: 16px; right: 16px; top: 14px; font-size: 14px; line-height: 20px; }
.tgb-tb-kutu__alt { position: absolute; left: 14px; right: 12px; bottom: 10px; display: flex; align-items: center; gap: 12px; }
.tgb-tb-kutu__alt .tgb-gri { margin-left: auto; font-weight: 500; color: #303030; }
.tgb-isaret { width: 22px; height: 22px; flex: none; }
.tgb-dusun svg { display: block; width: 28px; height: 28px; margin-top: -4px; overflow: visible; }
.tgb-dusun circle { transform-box: fill-box; transform-origin: center; }
.tgb-oyna .tgb-s.aktif .tgb-dusun.nefes circle { opacity: .55; animation: tgb-nefes 1.2s ease-in-out infinite; animation-delay: calc(var(--k) * .1s); }
.tgb-oyna .tgb-s.aktif .tgb-dusun.nefes circle:first-child { animation-name: tgb-nefes-c; }
@keyframes tgb-nefes { 0%, 100% { transform: scale(1); opacity: .55; } 45% { transform: scale(1.18); opacity: 1; } }
@keyframes tgb-nefes-c { 0%, 100% { transform: scale(1); opacity: .8; } 45% { transform: scale(1.06); opacity: 1; } }
.tgb-gonder { width: 30px; height: 30px; border-radius: 9px; background: #303030; color: #fff; display: grid; place-items: center; transition: transform .12s var(--tgb-e); position: relative; }
.tgb-gonder.basili { transform: scale(.94); }
.tgb-gonder::after { content: ""; position: absolute; inset: -3px; border-radius: 12px; box-shadow: 0 0 0 2px #005bd3; opacity: 0; transition: opacity .15s; }
.tgb-gonder.basili::after { opacity: 1; }
.tgb-tb-cerceve { position: absolute; inset: 0; border-radius: 14px; background: #fff; box-shadow: 0 0 0 1px #e3e3e3; transform-origin: 0 0; }
.tgb-tb-sohbet { position: absolute; inset: 0; display: flex; flex-direction: column; }
.tgb-tb-sohbet__bas { display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 46px; padding: 0 18px; flex: none;
  font-weight: 600; font-size: 14px; color: #1a1a1a; }
.tgb-tb-baslik { display: grid; grid-template-columns: minmax(0, 1fr); justify-items: stretch; min-width: 0; overflow: hidden; }
.tgb-tb-baslik > * { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tgb-tb-sohbet__govde { flex: 1; min-height: 0; overflow: hidden; padding: 4px 24px 0; display: flex; flex-direction: column; gap: 14px; max-width: 820px; width: 100%; margin: 0 auto; }
.tgb-balon { align-self: flex-end; max-width: 80%; padding: 8px 14px; border-radius: 18px; background: #f1f1f1; font-size: 14px; line-height: 20px; }
.tgb-yanit { display: flex; gap: 12px; align-items: flex-start; }
.tgb-yanit__ic { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px; font-size: 14px; line-height: 20px; }
.tgb-tbt { --sut: minmax(0, 1fr) 44px 108px; width: 520px; max-width: 100%; }
.tgb-tbt .tgb-sat { min-height: 30px; padding: 0; column-gap: 14px; }
.tgb-tbt .tgb-sat--bas { background: none; border-bottom-color: #e3e3e3; font-size: 12px; min-height: 28px; }
.tgb-tbt .tgb-sat:not(.tgb-sat--bas) { border-top: 1px solid #ebebeb; }
.tgb-tbt .tgb-sat--bas + .tgb-sat { border-top: 0; }
.tgb-tb-sohbet__yaz { flex: none; margin: 0 auto 14px; width: calc(100% - 48px); max-width: 772px; height: 46px; padding: 0 8px 0 14px; display: flex;
  align-items: center; justify-content: space-between; border-radius: 14px; box-shadow: inset 0 0 0 1px #c9c9c9; color: #8a8a8a; }
.tgb-tb-sohbet__yaz .tgb-gonder { background: #ebebeb; color: #8a8a8a; width: 28px; height: 28px; }

/* ── Dar masaüstü sahnesi (sahne 840–1099 px; 20.10'dan beri sağ sütundaki her masaüstü sahnesi): sabit sütunlar ad
   sütununu ezmesin ── */
@container tgb-sahne (min-width: 840px) and (max-width: 1099.98px) {
  .tgb-gnis { display: none !important; }
  .tgb-ikili { grid-template-columns: minmax(0, 1fr) 300px; }
  .tgb-pk-tb { --sut: 84px 96px minmax(0, 1fr) 108px 64px; }
  .tgb-ep { width: 290px; }
  .tgb-st-tb { --sut: minmax(0, 1fr) 72px 96px 116px 100px 128px 76px; }
  .tgb-ur-tb { --sut: 15px minmax(0, 1fr) 120px 150px 104px 84px; }
  .tgb-kg-tb { --sut: 118px 96px minmax(0, 1fr) 82px 82px 96px 70px; }
  .tgb-gs { grid-template-columns: 380px minmax(0, 1fr); }
  .tgb-gs-sonuc img { width: 240px; height: 240px; }
  .tgb-gs-komut { height: 110px; }
  .tgb-ek { grid-template-columns: 184px minmax(0, 1fr); }
  /* İhracat (20.10): tutarlar ₺ oldu ("8.539,70 ₺" EUR yazımından uzun); toplam tutar hücresi geniş, yan özet biraz dar */
  .tgb-ih { grid-template-columns: minmax(0, 1fr) 296px; }
  .tgb-ih-ozet { grid-template-columns: minmax(0, 1.7fr) repeat(3, minmax(0, 1fr)); }
  .tgb-bk { grid-template-columns: minmax(0, 1fr) 300px; }
  /* Denetim 20.10: 132 px'te "Uygulanan 2.500,00 ₺" kırılıyor, ₺ tek başına alt satıra düşüyordu */
  .tgb-bk-tb { --sut: minmax(0, 1fr) 150px 64px 76px; }
  .tgb-bk-tb .tgb-sat > span:nth-child(2) { white-space: nowrap; }
}
/* En dar masaüstü sahnesi (840–919 px; ör. 1200–1279 px pencere): ürün ve ad sütunu okunur kalsın diye ikincil sütun
   gizlenir (paketlemede sipariş no, stokta 30 gün satış; ikisi de sahnenin başka yerinde var) */
@container tgb-sahne (min-width: 840px) and (max-width: 919.98px) {
  .tgb-pk-tb { --sut: 84px minmax(0, 1fr) 108px 64px; }
  .tgb-pk-tb .c-no { display: none; }
  .tgb-st-tb { --sut: minmax(0, 1fr) 72px 96px 116px 128px 76px; }
  .tgb-st-tb .c-satis { display: none; }
  .tgb-st-ek { display: none; }
  .tgb-bk { grid-template-columns: minmax(0, 1fr) 280px; }
  .tgb-bk-tb { --sut: minmax(0, 1fr) 150px 64px 76px; }
  .tgb-zil__bas small { display: none; }
}

/* ── Sıkı düzen (sahne 840 px'ten dar: telefon, tablet, 1024–1199 px pencere): aynı sahneler ── */
@container tgb-sahne (max-width: 839.98px) {
  .tgb-mg { display: none !important; }
  .tgb-tg { display: block; }
  .tgb-tgi { display: inline; }
  .tgb-sat--bas { display: none; }
  .tgb-sat--bas + .tgb-sat { border-top: 0; }
  .tgb-sat { min-height: 0; padding: 8px 12px; column-gap: 8px; row-gap: 3px; }
  .tgb-d { height: 26px; padding: 0 10px; font-size: 12px; }
  .tgb-kart__bas { min-height: 38px; padding: 6px 12px; }

  .tgb-ikili { grid-template-columns: 1fr; }
  .tgb-pk-tb .tgb-sat { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "ad no durum" "urun urun eylem"; }
  .tgb-pk-tb .c-ad { grid-area: ad; } .tgb-pk-tb .c-no { grid-area: no; color: #616161; font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .tgb-pk-tb .c-urun { grid-area: urun; color: #616161; } .tgb-pk-tb .c-durum { grid-area: durum; justify-self: end; }
  .tgb-pk-tb .c-eylem { grid-area: eylem; }
  .tgb-pk-yan { position: absolute; left: 14px; right: 14px; bottom: 14px; height: 168px; }
  .tgb-a4__ust { padding: 6px 10px; } .tgb-a4__orta > div { padding: 6px 10px; } .tgb-a4__urun { padding: 6px 10px; }
  .tgb-barkod { height: 32px; }
  .tgb-a4__urun .tgb-a4__bas { display: none; }
  .tgb-ep { top: 52px; right: 14px; width: 300px; }

  .tgb-metrik { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tgb-metrik__o { padding: 8px 12px; }
  .tgb-metrik__o b { font-size: 20px; line-height: 26px; }
  .tgb-st-tb .tgb-sat { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-areas: "ad ad durum" "stok gunluk bitis" "oneri oneri satis"; }
  .tgb-st-tb .c-ad { grid-area: ad; } .tgb-st-tb .c-stok { grid-area: stok; } .tgb-st-tb .c-gunluk { grid-area: gunluk; }
  .tgb-st-tb .c-bitis { grid-area: bitis; } .tgb-st-tb .c-satis { grid-area: satis; justify-self: end; } .tgb-st-tb .c-oneri { grid-area: oneri; }
  .tgb-st-tb .c-durum { grid-area: durum; justify-self: end; }
  .tgb-st-tb em.tgb-tg { font-style: normal; font-size: 12px; color: #616161; display: block; }

  .tgb-ur-slot { min-height: 40px; }
  .tgb-ur-slot > * { padding: 6px 12px; }
  .tgb-ur-slot .tgb-girdi { width: 100%; }
  .tgb-ur-tb .tgb-sat { grid-template-columns: 15px minmax(0, 1fr) auto; grid-template-areas: "kutu ad ad" ". fiyat maliyet" ". kar buybox"; row-gap: 6px; }
  .tgb-ur-tb .c-kutu { grid-area: kutu; align-self: start; margin-top: 2px; } .tgb-ur-tb .c-ad { grid-area: ad; }
  .tgb-ur-tb .c-fiyat { grid-area: fiyat; } .tgb-ur-tb .c-maliyet { grid-area: maliyet; width: 140px; }
  .tgb-ur-tb .c-kar { grid-area: kar; } .tgb-ur-tb .c-buybox { grid-area: buybox; justify-self: end; }
  .tgb-ur-tb .tgb-fiyat b, .tgb-ur-tb .tgb-fiyat small, .tgb-ur-tb .tgb-kar b, .tgb-ur-tb .tgb-kar small { text-align: left; display: inline; }
  .tgb-ur-tb .tgb-kar small { margin-left: 6px; } .tgb-ur-tb .tgb-fiyat small { display: none; }
  /* Denetim 20.10: kâr ve marj ayrı ayrı bölünmesin ("%14,8" / "marj" kırılıyordu); dar kalırsa iki temiz satır */
  .tgb-ur-tb .tgb-kar b, .tgb-ur-tb .tgb-kar small { white-space: nowrap; }
  .tgb-ur-menu { top: 48px; right: 92px; width: 200px; }
  .tgb-ur-ipucu { top: 160px; right: 14px; width: 230px; }

  .tgb-ms-tb .tgb-sat { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "soru durum" "kisi kisi"; }
  .tgb-ms-tb .c-soru { grid-area: soru; } .tgb-ms-tb .c-durum { grid-area: durum; } .tgb-ms-tb .c-kisi { grid-area: kisi; font-size: 12px; color: #616161; padding-left: 46px; }
  .tgb-ms-pen { left: 0; right: 0; top: auto; bottom: 0; width: auto; margin-left: 0; border-radius: 16px 16px 0 0; }
  .tgb-hazir .tgb-s .tgb-ms-pen[data-g], .tgb-hazir .tgb-s .tgb-ek-pen[data-g] { transform: translateY(28px); }
  .tgb-hazir .tgb-s .tgb-ms-pen[data-g].on, .tgb-hazir .tgb-s .tgb-ek-pen[data-g].on { transform: none; }
  .tgb-ms-govde { padding: 10px 14px; gap: 7px; }
  .tgb-ms-oneri { height: 84px; } .tgb-ms-yaz { height: 54px; }

  .tgb-ih { grid-template-columns: 1fr; }
  .tgb-ih-yan { display: none; }
  .tgb-ih-tb .tgb-sat { grid-template-columns: auto auto minmax(0, 1fr); grid-template-areas: "no durum tarih" "ozet ozet ozet"; }
  .tgb-ih-tb .c-no { grid-area: no; font-weight: 600; } .tgb-ih-tb .c-durum { grid-area: durum; } .tgb-ih-tb .c-tarih { grid-area: tarih; justify-self: end; color: #616161; }
  .tgb-ih-tb .c-ozet { grid-area: ozet; color: #616161; }
  .tgb-ih-ozet { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tgb-ih-ozet .tgb-metrik__o:nth-child(n+3) { border-top: 1px solid #ebebeb; }
  .tgb-ih-ozet .tgb-metrik__o:nth-child(3) { border-left: 0; }
  .tgb-ih-ozet .tgb-metrik__o b { font-size: 18px; line-height: 24px; }
  .tgb-ih-urun .tgb-sat { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "ad durum" "ad fiyat"; }
  .tgb-ih-urun .c-ad { grid-area: ad; } .tgb-ih-urun .c-durum { grid-area: durum; justify-self: end; } .tgb-ih-urun .c-fiyat { grid-area: fiyat; justify-self: end; }
  .tgb-ih-ulke-tel { display: flex !important; flex-wrap: wrap; gap: 2px 10px; padding: 7px 12px 8px; border-top: 1px solid #ebebeb; font-size: 12px; line-height: 16px; color: #616161; }
  .tgb-ih-ulke-tel b { color: #303030; font-weight: 500; }

  .tgb-kg-tb .tgb-sat { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "no durum" "kisi desi"; }
  .tgb-kg-tb .c-no { grid-area: no; } .tgb-kg-tb .c-durum { grid-area: durum; justify-self: end; }
  .tgb-kg-tb .c-kisi { grid-area: kisi; color: #616161; font-size: 12px; } .tgb-kg-tb .c-desi { grid-area: desi; justify-self: end; font-size: 12px; }
  .tgb-kg-tb .tgb-ipuclu > .tgb-ipucu { left: auto; right: 0; translate: none; }
  .tgb-sekmeler--sar { flex-wrap: wrap; row-gap: 2px; }

  .tgb-gs { grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); gap: 10px; }
  .tgb-gs-sol { padding: 10px 12px; gap: 8px; }
  .tgb-gs-komut { height: 70px; }   /* 20.10: Türkçe komut; üç tam satır görünsün, satır ortadan kesilmesin */
  .tgb-cipler { max-height: 28px; }
  .tgb-gs-sonuc img { width: 124px; height: 124px; }   /* denetim 20.10: 140 px kutuda 138 px görsel kenarlara yapışıktı */
  .tgb-gs-sonuc { align-items: center; }
  .tgb-bos .tgb-i { width: 22px; height: 22px; }

  .tgb-ek { grid-template-columns: 1fr; grid-template-rows: auto auto; align-content: start; }
  .tgb-ek-tb .tgb-sat { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "uye izin" "bolum bolum"; }
  .tgb-ek-tb .c-uye { grid-area: uye; } .tgb-ek-tb .c-izin { grid-area: izin; } .tgb-ek-tb .c-bolum { grid-area: bolum; color: #616161; font-size: 12px; padding-left: 38px; }
  .tgb-ek-pen { left: 0; right: 0; top: auto; bottom: 0; width: auto; margin-left: 0; border-radius: 16px 16px 0 0; }
  .tgb-izinler { padding: 8px 12px 10px; gap: 5px; }
  .tgb-izin { padding: 5px 8px; } .tgb-izin small { display: none; }
  .tgb-menu-on .tgb-kart__bas p { font-size: 12px; line-height: 16px; }
  .tgb-menu-on__satir { flex-wrap: wrap; justify-content: flex-start; gap: 4px; padding: 10px 12px 12px; }
  .tgb-mo-g { padding: 3px 8px; box-shadow: inset 0 0 0 1px #e3e3e3; }
  .tgb-mo--alt { display: none; }

  .tgb-bk { grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); gap: 10px; }
  .tgb-bk-tb .tgb-sat { grid-template-columns: minmax(0, 1fr) auto; }
  .tgb-bk-kural--genis { grid-column: auto; }
  .tgb-sat--tur small { display: none; }
  .tgb-zil__liste { --sat-h: 52px; }
  .tgb-zs { padding-top: 7px; }

  .tgb-tb-p { padding: 12px; }
  .tgb-tb-kutu { height: 96px; }
  .tgb-tb-selam span { font-size: 15px; line-height: 20px; } .tgb-tb-selam b { font-size: 17px; line-height: 22px; }
  .tgb-tb-kutu__alt .tgb-gri { display: none; }
  .tgb-tb-sohbet__bas { height: 40px; padding: 0 14px; font-size: 13px; }
  .tgb-tb-sohbet__govde { padding: 4px 14px 0; gap: 10px; }
  .tgb-balon, .tgb-yanit__ic { font-size: 13px; line-height: 18px; }
  .tgb-yanit { gap: 8px; }
  .tgb-tbt { --sut: minmax(0, 1fr) 30px 92px; }
  .tgb-tbt .tgb-sat { grid-template-columns: var(--sut); padding: 0; min-height: 28px; column-gap: 8px; }
  .tgb-tbt .tgb-sat--bas { display: grid; }
  .tgb-tb-sohbet__yaz { width: calc(100% - 28px); height: 40px; margin-bottom: 10px; }
}
/* Sıkı düzen ama geniş sahne (560–839 px; tablet, 1024–1199 px pencere): ürünlerdeki ipucu menünün üstüne binmesin,
   üzerine gelinen "Hedef marj" satırının soluna otursun */
@container tgb-sahne (min-width: 560px) and (max-width: 839.98px) {
  .tgb-ur-ipucu { top: 84px; right: 300px; width: 230px; }
}
/* Telefon sahnesi (560 px'ten dar; denetim 20.10): yanda yer yok, ipucu menünün altına oturur (menü 48 + 162 px) */
@container tgb-sahne (max-width: 559.98px) {
  .tgb-ur-ipucu { top: 218px; }
}
/* Dar telefon sahnesi (≤ 350 px; 320–375 px telefon; denetim 20.10): görsel stüdyo komutu 4 satıra çıkıp ortadan
   kesiliyordu; 12/16 px dört tam satır, ikincil küçük notlar saklanır, sonuç görseli kutusuna sığar */
@container tgb-sahne (max-width: 350px) {
  .tgb-gs-satir small, .tgb-gs-alan small { display: none; }
  .tgb-gs-komut { height: 82px; font-size: 12px; line-height: 16px; }
  .tgb-gs-sonuc img { width: 112px; height: 112px; }
}
/* En dar telefon sahnesi (≤ 340 px; 320–360 px telefon) */
@container tgb-sahne (max-width: 340px) {
  .tgb-ur-tb .c-maliyet { width: 120px; }
  /* "Ürünler" başlığı iki düğmeyle çakışıyordu; ana düğme saklanır, menü kendi düğmesinin altına kayar */
  .tgb-ur-ekle { display: none; }
  .tgb-ur-menu { right: 14px; }
  /* Kesilen tek satırlar iki satıra iner: paketleme sayacı, kargo özeti ("289 başarılı teslimat"), soru sekmeleri */
  .tgb-bas__alt--sar { white-space: normal; }
  .tgb-metrik__o p:last-child { flex-wrap: wrap; white-space: normal; row-gap: 0; }
  /* TrendBot: yanıt yazı kutusunun altına taşıyordu; son özet paragrafı saklanır */
  .tgb-yanit__ic > p:last-child { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .tgb *, .tgb *::before, .tgb *::after { transition: none !important; animation: none !important; }
  .tgb-cerceve { cursor: auto; }
  /* Durağan son hâl tam okunur: odak sönükleştirmesi yok */
  .tgb-hazir .tgb-s .sonuk, .tgb-hazir .tgb-s [data-g].on.sonuk { opacity: 1; }
}