/* Kuyumcu canlı kur ekranı — siyah & altın tema, 16:9 TV için ölçeklenir */
:root {
  --u: 1vh;
  --u: min(1vh, .5625vw);
  --sol: 42%;
  --vurgu: #d9c2a0;
  --altin-1: #f3dfb2;
  --altin-2: #d6b06e;
  --altin-3: #a77c3e;
  --altin-cizgi: rgba(214, 176, 110, .32);
  --zemin: #111113;
  --metin: #f5f1ea;
  --soluk: rgba(245, 241, 234, .55);
  --cok-soluk: rgba(245, 241, 234, .32);
  --cizgi: rgba(255, 255, 255, .06);
  --kart: rgba(255, 255, 255, .025);
  --yukari: #4fd18b;
  --asagi: #ff6b5e;
  --serif: "Cormorant Garamond", Georgia, serif;
  --marka-font: Cinzel, "Cormorant Garamond", Georgia, serif;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  height: 100%;
  overflow: hidden;
  background: var(--zemin);
  color: var(--metin);
  font-family: Manrope, "Segoe UI", Roboto, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  user-select: none;
}

body {
  background:
    radial-gradient(70% 60% at 82% 8%, rgba(167, 124, 62, .16) 0%, rgba(167, 124, 62, 0) 70%),
    radial-gradient(60% 70% at 0% 100%, rgba(167, 124, 62, .08) 0%, rgba(167, 124, 62, 0) 70%),
    radial-gradient(90% 90% at 20% 10%, #1d1d21 0%, #111113 70%);
}

body.imlecsiz, body.imlecsiz * { cursor: none !important; }

.susleme {
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.ekran {
  position: fixed;
  top: 0; right: 0; bottom: 0; left: 0;
  display: grid;
  grid-template-columns: var(--sol) 1fr;
  grid-template-rows: minmax(0, 1fr) auto;
  grid-column-gap: calc(var(--u) * 3.6);
  padding: calc(var(--u) * 2.6) calc(var(--u) * 3.6) calc(var(--u) * 2.4);
}

/* ================= Sol: kur tablosu ================= */
.sol {
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
}

.baslik-kutu { text-align: center; margin-bottom: calc(var(--u) * 1.8); }

.baslik {
  display: flex;
  align-items: center;
  margin: 0;
  font-weight: 500;
  font-size: calc(var(--u) * 3.6);
  letter-spacing: .38em;
  color: var(--metin);
  line-height: 1.1;
}

.baslik span { padding: 0 .55em 0 .93em; white-space: nowrap; }

.baslik::before, .baslik::after {
  content: "";
  flex: 1;
  height: 1px;
}
.baslik::before { background: linear-gradient(90deg, rgba(214, 176, 110, 0), var(--altin-2)); }
.baslik::after  { background: linear-gradient(90deg, var(--altin-2), rgba(214, 176, 110, 0)); }

.alt-baslik {
  margin: calc(var(--u) * 1) 0 0;
  font-size: calc(var(--u) * 1.3);
  font-weight: 600;
  letter-spacing: .62em;
  padding-left: .62em;
  color: var(--soluk);
}

.tablo-bas, .satir {
  display: grid;
  grid-template-columns: 1.15fr 1fr 1fr;
  align-items: center;
}

.tablo-bas {
  font-size: calc(var(--u) * 1.75);
  color: var(--soluk);
  padding: 0 calc(var(--u) * 2.4) calc(var(--u) * 1);
  border-bottom: 1px solid var(--cizgi);
}

.tablo-bas span:not(:first-child) { text-align: right; }

.tablo {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding-top: calc(var(--u) * 1);
  font-size: var(--fs, calc(var(--u) * 2.4));
}

.blok {
  display: flex;
  flex-direction: column;
  min-height: 0;
  margin-top: calc(var(--u) * 1.6);
  border: 1px solid var(--cizgi);
  border-radius: calc(var(--u) * .9);
  background: var(--kart);
  overflow: hidden;
}
.blok:first-child { margin-top: 0; }

.grup {
  flex: 1 1 0;
  display: flex;
  align-items: center;
  padding: 0 calc(var(--u) * 2.4);
  font-size: .72em;
  font-weight: 700;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--altin-1);
  background: linear-gradient(90deg, rgba(214, 176, 110, .26), rgba(214, 176, 110, .08) 60%, rgba(214, 176, 110, .03));
  border-bottom: 1px solid var(--altin-cizgi);
  min-height: 0;
}

.satir {
  flex: 1 1 0;
  padding: 0 calc(var(--u) * 2.4);
  border-bottom: 1px solid var(--cizgi);
  min-height: 0;
}

.satir:last-child { border-bottom: 0; }

.satir .ad {
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.fiyat {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 1.2em;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.fiyat .d { transition: color .6s ease; }

.fiyat .yon {
  font-size: .72em;
  width: 1.4em;
  text-align: center;
  opacity: 0;
  transition: opacity .6s ease, color .6s ease;
}

/* Kalıcı ok: günün yönü (kaynak veriyorsa) ya da son değişimin yönü */
.fiyat.g-yukari .yon { opacity: 1; color: var(--yukari); }
.fiyat.g-asagi .yon  { opacity: 1; color: var(--asagi); }

/* Anlık değişimde rakam kısa süre renklenir */
.fiyat.yukari .d { animation: yukari 1.6s ease-out; }
.fiyat.asagi .d  { animation: asagi 1.6s ease-out; }

@keyframes yukari { 0%, 35% { color: var(--yukari); } 100% { color: var(--metin); } }
@keyframes asagi  { 0%, 35% { color: var(--asagi); }  100% { color: var(--metin); } }

.sol-alt {
  display: flex;
  align-items: center;
  padding: calc(var(--u) * 1.6) calc(var(--u) * 2) 0;
  font-size: calc(var(--u) * 1.6);
  color: var(--soluk);
}

.sol-alt b { color: var(--metin); font-weight: 600; margin-left: .35em; }

.nokta {
  width: calc(var(--u) * 1);
  height: calc(var(--u) * 1);
  border-radius: 50%;
  background: var(--cok-soluk);
  margin-right: .8em;
  flex: none;
}

.nokta.canli { background: var(--yukari); animation: nabiz 2s infinite; }
.nokta.uyari { background: #f2b84b; }
.nokta.hata  { background: var(--asagi); }

@keyframes nabiz {
  0%   { box-shadow: 0 0 0 0 rgba(79, 209, 139, .55); }
  70%  { box-shadow: 0 0 0 calc(var(--u) * 1) rgba(79, 209, 139, 0); }
  100% { box-shadow: 0 0 0 0 rgba(79, 209, 139, 0); }
}

/* ================= Sağ: marka ================= */
.sag {
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
}

.marka {
  flex: none;
  height: calc(var(--u) * 14.5);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: calc(var(--u) * 1.6);
}

.marka-ic {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  max-width: 100%;
}

.marka-ad {
  text-align: center;
  line-height: 1;
  min-width: 0;
}

.marka-ad strong {
  display: block;
  font-family: var(--marka-font);
  font-weight: 600;
  font-size: calc(var(--u) * 7.4);
  letter-spacing: .06em;
  padding-left: .06em;
  color: var(--altin-2);
  background: linear-gradient(180deg, var(--altin-1) 10%, var(--altin-2) 55%, var(--altin-3) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  white-space: nowrap;
}

.marka-ad .kavis {
  display: block;
  width: 118%;
  height: calc(var(--u) * 2.6);
  margin: calc(var(--u) * -.6) -9% 0;
}

.marka-ad small {
  display: block;
  margin-top: calc(var(--u) * .4);
  font-family: var(--marka-font);
  font-size: calc(var(--u) * 2.4);
  font-weight: 500;
  letter-spacing: .5em;
  padding-left: .5em;
  color: var(--altin-1);
  white-space: nowrap;
}

.marka img { max-height: 100%; max-width: 70%; object-fit: contain; }


/* ================= Sekmeler ================= */
.sekmeler {
  flex: none;
  display: flex;
  flex-wrap: nowrap;
  overflow: hidden;
  align-self: flex-start;
  max-width: 100%;
  margin-bottom: calc(var(--u) * 1.2);
  padding: calc(var(--u) * .35);
  border: 1px solid var(--cizgi);
  border-radius: calc(var(--u) * .9);
  background: rgba(255, 255, 255, .03);
}

.sekme {
  flex: none;
  min-width: calc(var(--u) * 20);
  padding: calc(var(--u) * 1.1) calc(var(--u) * 2.6);
  border: 0;
  border-radius: calc(var(--u) * .65);
  background: transparent;
  color: var(--soluk);
  font: 700 calc(var(--u) * 1.55) Manrope, "Segoe UI", Arial, sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .3s, color .3s;
}

.sekme + .sekme { margin-left: calc(var(--u) * .35); }
.sekme:hover { color: var(--metin); }
.sekme:focus { outline: none; }
.sekme:focus-visible { box-shadow: inset 0 0 0 1px var(--altin-2); }

.sekme.aktif {
  background: linear-gradient(180deg, var(--altin-1), var(--altin-2) 60%, #c39a58);
  color: #1b1712;
  box-shadow: 0 calc(var(--u) * .5) calc(var(--u) * 1.6) rgba(214, 176, 110, .25);
}

/* ================= Video ================= */
.oynatici {
  flex: 1;
  min-height: 0;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}

.video {
  position: relative;
  width: 100%;
  height: 100%;
  background: #000;
  border-radius: calc(var(--u) * .9);
  overflow: hidden;
  border: 1px solid var(--altin-cizgi);
  box-shadow: 0 calc(var(--u) * 1.4) calc(var(--u) * 5) rgba(0, 0, 0, .6), 0 0 calc(var(--u) * 4) rgba(214, 176, 110, .08);
}

/* Alt kenarda ince altın parıltı */
.video::after {
  content: "";
  position: absolute;
  left: 8%; right: 8%; bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, rgba(243, 223, 178, 0), var(--altin-1), rgba(243, 223, 178, 0));
  pointer-events: none;
  z-index: 2;
}

.video iframe {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.canli-rozet {
  position: absolute;
  top: calc(var(--u) * 1.6);
  left: calc(var(--u) * 1.6);
  z-index: 3;
  display: flex;
  align-items: center;
  padding: calc(var(--u) * .7) calc(var(--u) * 1.5);
  border-radius: 99px;
  background: rgba(10, 10, 12, .72);
  border: 1px solid rgba(255, 255, 255, .1);
  font-size: calc(var(--u) * 1.5);
  font-weight: 600;
  pointer-events: none;
  transition: opacity 1s ease;
}

.canli-rozet.gizli { opacity: 0; }

.canli-rozet::before {
  content: "";
  width: calc(var(--u) * 1);
  height: calc(var(--u) * 1);
  border-radius: 50%;
  margin-right: .6em;
  background: #ff4d4d;
  animation: kirmizi-nabiz 1.6s infinite;
}

@keyframes kirmizi-nabiz { 50% { opacity: .35; } }

.video .bos {
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--cok-soluk);
  font-size: calc(var(--u) * 1.8);
  letter-spacing: .1em;
  background: radial-gradient(circle at 50% 40%, #232227, #121214);
}

/* ================= Sağ alt: hesap, QR, saat ================= */
.sag-alt {
  flex: none;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  padding-top: calc(var(--u) * 2.4);
}

.hesap {
  min-width: 0;
  padding-right: calc(var(--u) * 2.4);
  transition: opacity .5s ease;
}

.hesap.gecis { opacity: 0; }

.hesap .etiket {
  display: flex;
  align-items: center;
  font-size: calc(var(--u) * 1.3);
  font-weight: 700;
  letter-spacing: .4em;
  color: var(--altin-2);
}

.hesap .etiket::after {
  content: "";
  flex: 1;
  height: 1px;
  margin-left: 1em;
  background: linear-gradient(90deg, var(--altin-cizgi), rgba(214, 176, 110, 0));
}

.hesap .banka {
  margin-top: calc(var(--u) * 1.2);
  font-family: var(--serif);
  font-size: calc(var(--u) * 3.4);
  font-weight: 700;
  line-height: 1.05;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.hesap .sahip {
  margin-top: calc(var(--u) * .4);
  font-size: calc(var(--u) * 1.65);
  color: var(--altin-2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.hesap .iban {
  margin-top: calc(var(--u) * 1.2);
  font-size: calc(var(--u) * 2.3);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.hesap .iban em { font-style: normal; color: var(--altin-2); margin-right: .45em; }

.qr {
  padding: calc(var(--u) * 1) calc(var(--u) * 1) calc(var(--u) * .7);
  border: 1px solid var(--altin-2);
  border-radius: calc(var(--u) * 1.1);
  background: rgba(214, 176, 110, .05);
  text-align: center;
  margin-right: calc(var(--u) * 3);
}

.qr[hidden] { display: none; }

.qr .kod {
  width: calc(var(--u) * 11);
  height: calc(var(--u) * 11);
  background: #fff;
  border-radius: calc(var(--u) * .5);
  padding: calc(var(--u) * .6);
}

.qr .kod svg { display: block; width: 100%; height: 100%; }

.qr span {
  display: block;
  margin-top: calc(var(--u) * .7);
  font-size: calc(var(--u) * 1.3);
  font-weight: 600;
  color: var(--altin-1);
}

.saat-kutu {
  text-align: center;
  padding-left: calc(var(--u) * 3);
  border-left: 1px solid var(--altin-cizgi);
  min-width: calc(var(--u) * 25);
}

.saat {
  font-family: var(--serif);
  font-size: calc(var(--u) * 7.2);
  font-weight: 600;
  line-height: 1;
  font-variant-numeric: lining-nums tabular-nums;
  color: var(--metin);
}

.tarih {
  margin-top: calc(var(--u) * 1);
  font-family: var(--serif);
  font-size: calc(var(--u) * 2.3);
  font-variant-numeric: lining-nums;
  color: var(--soluk);
}

/* ================= Kayan yazı ================= */
.kayan {
  grid-column: 1 / -1;
  margin-top: calc(var(--u) * 2);
  height: calc(var(--u) * 4.6);
  overflow: hidden;
  position: relative;
  border-radius: calc(var(--u) * .7);
  border: 1px solid var(--altin-cizgi);
  background: linear-gradient(90deg, rgba(214, 176, 110, .1), rgba(214, 176, 110, .03));
}

.kayan[hidden] { display: none; }

.kayan-ic {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  display: flex;
  align-items: center;
  white-space: nowrap;
  font-size: calc(var(--u) * 2);
  font-weight: 600;
  color: var(--altin-1);
  will-change: transform;
  animation: kay var(--sure, 30s) linear infinite;
}

@keyframes kay {
  from { transform: translateX(var(--bas, 100vw)); }
  to   { transform: translateX(var(--son, -100%)); }
}

/* ================= Dikey ekran ================= */
@media (max-aspect-ratio: 1/1) {
  :root { --u: 1.1vw; }
  .ekran {
    grid-template-columns: 1fr;
    grid-template-rows: auto minmax(0, 1fr) auto;
    padding: 2vh 3vw;
  }
  .sag { order: -1; }
  .oynatici { flex: none; height: calc(94vw * 9 / 16); }
  .sol { padding-top: 2.5vh; }
}

/* ================= Medya alanı (tüm temalarda ortak) ================= */
/* YouTube: arayüzsüz oynatıcı + üstte şeffaf kalkan + açılışta perde */
.video .yt-kap, .video .yt-kap iframe {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.video-kalkan { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 2; }

.video-perde {
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at 50% 40%, #2a2724, #0f0e0d 75%);
  opacity: 0;
  pointer-events: none;
  transition: opacity .9s ease;
}
.video.yukleniyor .video-perde { opacity: 1; }

.perde-halka {
  width: calc(var(--u) * 5);
  height: calc(var(--u) * 5);
  border-radius: 50%;
  border: 2px solid rgba(217, 178, 108, .2);
  border-top-color: #d9b26c;
  animation: perde-don 1.1s linear infinite;
}
.video.hatali .perde-halka { animation: none; border-color: rgba(217, 178, 108, .35); }
.perde-yazi { margin-top: calc(var(--u) * 1.6); font-size: calc(var(--u) * 1.6); letter-spacing: .08em; color: rgba(255, 255, 255, .55); }
@keyframes perde-don { to { transform: rotate(360deg); } }

.ses-ipucu {
  position: absolute;
  left: 50%;
  top: calc(var(--u) * 2);
  transform: translateX(-50%);
  z-index: 4;
  padding: calc(var(--u) * .8) calc(var(--u) * 1.8);
  border-radius: 99px;
  background: rgba(10, 10, 12, .78);
  border: 1px solid rgba(255, 255, 255, .14);
  color: #fff;
  font-size: calc(var(--u) * 1.5);
  font-weight: 600;
  white-space: nowrap;
  pointer-events: none;
}
.ses-ipucu[hidden] { display: none; }

/* Kampanya slider'ı: yumuşak geçişli görseller */
.video.slider { background: #000; }
.slayt {
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  overflow: hidden;
  opacity: 0;
  transition: opacity 1.1s ease;
}
.slayt.aktif { opacity: 1; }
.slayt img { position: relative; display: block; width: 100%; height: 100%; object-fit: cover; }
.slayt.sigdir img { object-fit: contain; }
.slayt-arka {
  position: absolute;
  top: -8%; right: -8%; bottom: -8%; left: -8%;
  background-size: cover;
  background-position: center;
  filter: blur(28px) brightness(.55);
}

/* Tema 1 slider modunda sekme yok: görsel dikeyde ortalanır */
.mod-slider .oynatici { align-items: center; }

/* Slider seçili ama görsel yokken video gösterilir; kanal sekmeleri yine gizli */
body.sekmesiz #sekmeler { display: none !important; }

/* ================= Mobil: yalnızca kur listesi (telefondan girilince) ================= */
html:has(body.mobil), body.mobil { height: auto; overflow: auto; }
body.mobil {
  --u: 1.4vw;
  min-height: 100vh;
  -webkit-text-size-adjust: 100%;
}
body.mobil .susleme { position: absolute; height: 100%; }
body.mobil .ekran {
  position: static;
  display: block;
  padding: calc(var(--u) * 5) calc(var(--u) * 1.6) calc(var(--u) * 6);
}
body.mobil .sag,
body.mobil .kayan { display: none !important; }
body.mobil .sol { padding-top: 0; }
body.mobil .baslik { font-size: calc(var(--u) * 5.4); }
body.mobil .alt-baslik { font-size: calc(var(--u) * 1.8); }
body.mobil .tablo-bas { font-size: calc(var(--u) * 2.6); padding: 0 calc(var(--u) * 1.6) calc(var(--u) * 1.4); }
body.mobil .tablo { flex: none; --fs: calc(var(--u) * 2.8); }
/* Başlık ve satırlar ayrı ızgara: fiyat sütunları sabit genişlikte ki hizalı kalsın */
body.mobil .tablo-bas, body.mobil .satir { grid-template-columns: minmax(0, 1fr) calc(var(--u) * 18.4) calc(var(--u) * 18.4); grid-column-gap: calc(var(--u) * 1.4); }
body.mobil .blok { flex: none !important; margin-top: calc(var(--u) * 2.4); }
body.mobil .grup,
body.mobil .satir { flex: none; padding: 0 calc(var(--u) * 1.6); }
body.mobil .grup { height: 2.15em; }
body.mobil .satir { height: 2.15em; }
body.mobil .fiyat { padding-left: 0; }
body.mobil .sol-alt { font-size: calc(var(--u) * 2.5); padding: calc(var(--u) * 3) calc(var(--u) * 2) 0; justify-content: flex-start; }
@media (min-width: 600px) { body.mobil { --u: 6px; } body.mobil .ekran { max-width: 640px; margin: 0 auto; } }

/* Kanal sekmeleri: kaç kanal olursa olsun hepsi görünsün — genişliği paylaşır, sığmazsa alt satıra geçer */
.sekmeler { align-self: stretch; flex-wrap: wrap; gap: calc(var(--u) * .35); }
.sekme { flex: 1 1 auto; min-width: calc(var(--u) * 12); max-width: calc(var(--u) * 26); padding: calc(var(--u) * 1.05) calc(var(--u) * 1.6); letter-spacing: .1em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sekme + .sekme { margin-left: 0; }

/* Panelden yüklenen QR görseli */
.qr .kod img { display: block; width: 100%; height: 100%; object-fit: contain; }

/* Hesap notu (IBAN altında) */
.hesap .hesap-not {
  margin-top: calc(var(--u) * .8);
  font-size: calc(var(--u) * 1.6);
  color: var(--soluk);
  white-space: nowrap;
}
.hesap .hesap-not em { font-style: normal; font-weight: 600; color: var(--altin-2); margin-right: .25em; }

/* Hesaplar "hepsi birlikte": kartlar yan yana, her biri kendi küçük QR'ıyla */
.hesap.coklu .hesap-liste {
  display: grid;
  grid-template-columns: repeat(var(--adet, 2), minmax(0, 1fr));
  grid-column-gap: calc(var(--u) * 2.4);
  margin-top: calc(var(--u) * 1.2);
}
.hesap.coklu .hesap-kart { display: flex; align-items: center; min-width: 0; }
.hesap.coklu .mini-qr {
  flex: none;
  width: calc(var(--u) * 9);
  height: calc(var(--u) * 9);
  margin-right: calc(var(--u) * 1.4);
  padding: calc(var(--u) * .5);
  border-radius: calc(var(--u) * .6);
  background: #fff;
}
.mini-qr svg, .mini-qr img { display: block; width: 100%; height: 100%; object-fit: contain; }
.hesap.coklu .hesap-metin { flex: 1; min-width: 0; }
.hesap.coklu .kart-ad { font-family: var(--serif); font-size: calc(var(--u) * 2.5); font-weight: 700; line-height: 1.1; white-space: nowrap; }
.hesap.coklu .kart-banka { margin-top: calc(var(--u) * .2); font-size: calc(var(--u) * 1.4); color: var(--altin-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hesap.coklu .kart-iban { margin-top: calc(var(--u) * .5); font-size: calc(var(--u) * 1.75); font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; }
.hesap.coklu .kart-iban em { font-style: normal; color: var(--altin-2); margin-right: .35em; }
.hesap.coklu .hesap-not { margin-top: calc(var(--u) * .4); font-size: calc(var(--u) * 1.3); }
.hesap.coklu .kart-ad { overflow: hidden; text-overflow: ellipsis; }
.hesap.coklu .kart-iban { font-size: calc(var(--u) * 1.8); line-height: 1.3; }
.hesap.coklu .kart-iban em { display: block; font-size: .7em; letter-spacing: .1em; margin: 0; }
.hesap.coklu .kart-iban span { display: block; white-space: nowrap; }
.hesap.coklu .hesap-not { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* Kart sayısı arttıkça QR küçülür (2 hesap: 9u, 3 hesap: 7u); saat bölümü daralır */
.hesap.coklu .mini-qr {
  width: min(calc(var(--u) * 21 / var(--adet, 2)), calc(var(--u) * 9));
  height: min(calc(var(--u) * 21 / var(--adet, 2)), calc(var(--u) * 9));
  margin-right: calc(var(--u) * 1);
}
.hesap.coklu .hesap-liste { grid-column-gap: calc(var(--u) * 1.6); }
body.hesap-coklu .saat-kutu { min-width: 0; padding-left: calc(var(--u) * 2); }
body.hesap-coklu .saat { font-size: calc(var(--u) * 6); }
body.hesap-coklu .hesap { padding-right: calc(var(--u) * 1.6); }
.hesap.coklu .kart-ad { font-size: min(calc(var(--u) * 2.5), calc(var(--u) * 6.3 / var(--adet, 2))); }

/* Logo: tüm temalarda aynı kutu (en dar temaya göre 58u × 12u = Full HD'de 626 × 130 px, %100'de).
   Panelden ayarlanan boyut (Firma Bilgileri) kutuyu oranlı küçültür. */
.marka img {
  max-height: calc(var(--u) * 12 * var(--logo-carpan, .8));
  max-width: calc(var(--u) * 58 * var(--logo-carpan, .8));
  object-fit: contain;
}

/* Tema 1: logo sol üstte (kur tablosunun üstünde); "Alış/Satış" etiketleri her grup şeridinde, rakamların üstünde */
/* Logo ekranın tam ortasında, iki kolonun üstünde tek satır */
.ekran { grid-template-rows: auto minmax(0, 1fr) auto; }
.marka-ust { grid-column: 1 / -1; grid-row: 1; margin-bottom: calc(var(--u) * 1.4); }
.ekran > .sol, .ekran > .sag { grid-row: 2; }
.ekran > .kayan { grid-row: 3; }
.marka-ust[data-konum="sol"], .marka-ust[data-konum="sol"] .marka-ic { justify-content: flex-start; }
.marka-ust[data-konum="sag"], .marka-ust[data-konum="sag"] .marka-ic { justify-content: flex-end; }
.marka-ust[data-konum="sol"] .marka-ad { text-align: left; }
.marka-ust[data-konum="sag"] .marka-ad { text-align: right; }
/* yazı modundaki altın kavis kenardan taşmasın: tek yöne uzar */
.marka-ust[data-konum="sol"] .marka-ad .kavis { margin-left: 0; margin-right: -18%; }
.marka-ust[data-konum="sag"] .marka-ad .kavis { margin-left: -18%; margin-right: 0; }
.marka-ust.bos { display: none; } /* logo ve yazı kapalı: tablo ve kanallar en üste çıkar */
@media (max-aspect-ratio: 1/1) {
  .ekran { grid-template-rows: auto auto minmax(0, 1fr) auto; }
  .ekran > .sag { grid-row: 2; }
  .ekran > .sol { grid-row: 3; }
  .ekran > .kayan { grid-row: 4; }
}
.sol .grup {
  display: grid;
  grid-template-columns: 1.15fr 1fr 1fr;
}
.sol .grup span:not(:first-child) { text-align: right; margin-right: -.26em; }
.sag .sekmeler { margin-top: 0; }
body.mobil .marka-ust { height: calc(var(--u) * 12); margin-bottom: calc(var(--u) * 1); }
body.mobil .sol .grup { grid-template-columns: minmax(0, 1fr) calc(var(--u) * 18.4) calc(var(--u) * 18.4); grid-column-gap: calc(var(--u) * 1.4); }

/* ================= Tema 4: Klasik Beyaz (Tema 1 yerleşimi, açık renk) ================= */
body.tema-4 {
  --altin-1: #9a6f2c;
  --altin-2: #b8894a;
  --altin-3: #8a6224;
  --altin-cizgi: rgba(167, 124, 62, .38);
  --zemin: #f7f4ef;
  --metin: #1f1b16;
  --soluk: rgba(31, 27, 22, .58);
  --cok-soluk: rgba(31, 27, 22, .32);
  --cizgi: rgba(60, 45, 25, .1);
  --kart: rgba(255, 255, 255, .78);
  --yukari: #1f9d5c;
  --asagi: #d2443a;
  background:
    radial-gradient(70% 60% at 82% 8%, rgba(214, 176, 110, .22) 0%, rgba(214, 176, 110, 0) 70%),
    radial-gradient(60% 70% at 0% 100%, rgba(214, 176, 110, .14) 0%, rgba(214, 176, 110, 0) 70%),
    linear-gradient(135deg, #fbf9f5 0%, #f1ece4 100%);
}
body.tema-4 .blok { box-shadow: 0 calc(var(--u) * .4) calc(var(--u) * 1.6) rgba(80, 60, 30, .07); }
body.tema-4 .grup { background: linear-gradient(90deg, rgba(214, 176, 110, .34), rgba(214, 176, 110, .14) 60%, rgba(214, 176, 110, .06)); }
body.tema-4 .sekmeler { background: rgba(255, 255, 255, .7); border-color: rgba(167, 124, 62, .22); }
body.tema-4 .video { box-shadow: 0 calc(var(--u) * 1.2) calc(var(--u) * 4) rgba(60, 45, 25, .22); }
body.tema-4 .marka img.acik-logo { filter: brightness(0) invert(.11); } /* beyaz logo açık zeminde koyu görünsün */
body.tema-4 .susleme { opacity: .6; }
body.tema-4 .video { color: #f5f1ea; } /* video kutusu koyu kalır: içindeki rozet ve yazılar açık renk */

/* Hesap: "Banka Adı: …" üstte, "Hesap Adı: …" altında; etiketler vurgu renginde (Tema 1 ve 4) */
.hesap .kimlik-satir { white-space: nowrap; line-height: 1.2; }
.hesap .kimlik-satir em { font-style: normal; font-family: Manrope, "Segoe UI", Roboto, Arial, sans-serif; font-weight: 600; color: var(--altin-2); margin-right: .45em; }
.hesap .kimlik-banka { margin-top: calc(var(--u) * 1.2); font-size: calc(var(--u) * 1.9); }
.hesap .kimlik-banka span { font-weight: 600; }
.hesap .kimlik-ad { margin-top: calc(var(--u) * .5); font-size: calc(var(--u) * 2.9); font-family: var(--serif); font-weight: 700; }
.hesap .kimlik-ad em { font-size: .66em; vertical-align: .12em; }
.hesap .iban { margin-top: calc(var(--u) * .8); }
.hesap .hesap-not { font-size: calc(var(--u) * 1.9); } /* not bir tık büyük */

/* Mobilde logo / firma adı her zaman ortada (paneldeki konum seçimi yalnızca TV ekranı için) */
body.mobil .marka-ust, body.mobil .marka-ust .marka-ic { justify-content: center; }
body.mobil .marka-ust .marka-ad { text-align: center; }
body.mobil .marka-ust .marka-ad .kavis { margin-left: -9%; margin-right: -9%; }

/* Arama motorları ve ekran okuyucular için sayfa başlığı (görünmez) */
.seo-baslik { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* Alt bilgi (copyright): ekranın en altında, üstten ince çizgiyle ayrılmış şerit. Görünürken içerik şeridin üstünde biter. */
.telif {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 4;
  height: calc(var(--u) * 2.6);
  display: block; /* flex değil: kalın yazı / bağlantı arasındaki boşluklar korunur */
  line-height: calc(var(--u) * 2.6);
  text-align: center;
  padding: 0 calc(var(--u) * 3);
  border-top: 1px solid var(--altin-cizgi);
  background: rgba(0, 0, 0, .14);
  font-size: calc(var(--u) * 1.15);
  letter-spacing: .05em;
  color: var(--soluk);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  pointer-events: none;
}
.telif[hidden] { display: none; }
body.telifli .ekran { bottom: calc(var(--u) * 2.6); padding-top: calc(var(--u) * 1.4); padding-bottom: calc(var(--u) * 1); } /* şerit varken alt boşluk daralır: video alanı küçülmesin */
body.mobil .telif { position: static; height: auto; line-height: 1.5; margin: 0 calc(var(--u) * 1.6); padding: calc(var(--u) * 2.4) 0 calc(var(--u) * 4); background: none; font-size: calc(var(--u) * 2); white-space: normal; text-align: center; }
body.mobil.telifli .ekran { bottom: auto; padding-bottom: calc(var(--u) * 3); }

body.tema-4 .telif { background: rgba(255, 255, 255, .55); } /* açık temada şerit zemini beyazımsı */
/* Alt bilgideki bağlantılar tıklanabilir (şeridin geri kalanı tıklamayı geçirir) */
.telif a { pointer-events: auto; color: inherit; text-decoration: underline; text-underline-offset: .2em; text-decoration-color: currentColor; }
.telif a:hover { opacity: .85; }
.telif strong { font-weight: 700; }

