/* AltınPanel — ekran (TV/kiosk) stili. Tek dosya, CDN'siz.
   Altın/premium kimlik: sicak paleti hem koyu hem acik temada benimser. */
:root {
  --bg: #0a0908;
  --bg-soft: #17130c;
  --panel: #16130c;
  --line: #2c2519;
  --text: #f4efe3;
  --muted: #a99d88;
  --brand: #dab87c;
  --gold: #dab87c;
  --gold-bright: #f4d58d;
  --gold-dim: rgba(218, 184, 124, 0.35);
  --gold-glow: rgba(218, 184, 124, 0.10);
  --up: #5cb874;
  --down: #e0685f;
  --buy: #efe7d4;   /* fildisi/sampanya — Alis */
  --sell: #dab87c;  /* altin — Satis */
  --stripe: rgba(244, 239, 227, 0.035);
  --fit: 1;
  --user-scale: 1;
  --logo-scale: 1;
  /* Yazi tipi + rakam kalinligi (CDN'siz, sistem fontlari) */
  --font-family: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --num-weight: 800;
}

/* Yazi tipi gruplari (profil "FontFamily") */
body[data-font="modern"]    { --font-family: Arial, "Helvetica Neue", Helvetica, "Segoe UI", sans-serif; }
body[data-font="classic"]   { --font-family: Georgia, "Times New Roman", "Noto Serif", "PT Serif", serif; }
body[data-font="condensed"] { --font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI Condensed", "Segoe UI", sans-serif; }
body[data-font="mono"]      { --font-family: "Consolas", "SF Mono", "Roboto Mono", "DejaVu Sans Mono", "Courier New", monospace; }

/* Rakam kalinligi (profil "FontWeight") */
body[data-weight="normal"] { --num-weight: 600; }
body[data-weight="bold"]   { --num-weight: 800; }
body[data-weight="black"]  { --num-weight: 900; }

[data-theme="light"] {
  --bg: #f7f2e8;
  --bg-soft: #fffdf7;
  --panel: #fffdf7;
  --line: #e7dcc6;
  --text: #2b2417;
  --muted: #8a7d64;
  --brand: #9c7a3f;
  --gold: #a37e40;
  --gold-bright: #c49a52;
  --gold-dim: rgba(163, 126, 64, 0.40);
  --gold-glow: rgba(163, 126, 64, 0.12);
  --up: #2e8b52;
  --down: #c14a44;
  --buy: #4a4230;   /* koyu sicak — Alis */
  --sell: #a37e40;  /* altin — Satis */
  --stripe: rgba(43, 36, 23, 0.035);
}

* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }

body {
  background:
    radial-gradient(1300px 820px at 50% -14%, var(--gold-glow), transparent 60%),
    var(--bg);
  color: var(--text);
  font-family: var(--font-family);
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
}

.board {
  height: 100vh;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.board__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(0.6rem, 2vw, 2rem);
  flex: 0 0 auto;
  padding: clamp(0.6rem, 1.8vh, 1.6rem) clamp(0.8rem, 2vw, 2rem);
  border-bottom: 3px solid transparent;
  border-image: linear-gradient(90deg, transparent, var(--gold), var(--gold-bright), var(--gold), transparent) 1;
}

/* Sol: bizim marka (AltınPanel) — geniş logo, yükseklikle sınırlanır */
.brand-left { flex: 0 0 auto; display: flex; align-items: center; min-width: 0; }
.brand-left .applogo { height: clamp(1.8rem, 4.5vh, 3.4rem); width: auto; object-fit: contain; }

/* Orta: müşteri (kuyumcu) logosu — vitrin burası, en belirgin öğe */
.brand-center { flex: 1 1 auto; display: flex; align-items: center; justify-content: center; min-width: 0; overflow: hidden; }
.brand-center img { height: calc(clamp(2.4rem, 7vh, 5.2rem) * var(--logo-scale)); width: auto; max-width: 100%; object-fit: contain; }
.brand-center .name {
  font-size: clamp(1.2rem, 4vh, 3rem);
  font-weight: 800;
  letter-spacing: 0.5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background: linear-gradient(180deg, var(--gold-bright), var(--gold));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Sağ: canlı durum + saat */
.head-right { flex: 0 0 auto; display: flex; align-items: center; gap: clamp(0.7rem, 1.6vw, 1.6rem); }
.clock {
  font-variant-numeric: tabular-nums;
  font-size: clamp(1rem, 3vh, 2.2rem);
  font-weight: 700;
  color: var(--gold);
  letter-spacing: 1px;
}

.board__main {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  align-items: center; /* kisa tabloyu dikeyde ortala (manuel boyutta bosluk cirkin olmasin) */
  justify-content: center;
}

.prices {
  width: 100%;
  border-collapse: collapse;
  font-size: calc(clamp(1.1rem, 3vh, 3rem) * var(--fit) * var(--user-scale));
  table-layout: fixed;
}

.prices th {
  text-align: right;
  color: var(--gold);
  font-weight: 700;
  font-size: 0.6em;
  text-transform: uppercase;
  letter-spacing: 2px;
  padding: 0.4em 0.55em;
  border-bottom: 2px solid var(--gold-dim);
}
.prices th:first-child { text-align: left; }
/* Ürün adına daha fazla genişlik; sayı kolonları kalanı eşit paylaşır.
   Bu, yazının genişliğe erken takılmasını azaltıp fontu büyütür. */
.prices th:first-child, .prices td:first-child { width: 40%; }

.prices td {
  padding: 0.32em 0.55em;
  border-bottom: 1px solid var(--line);
  font-variant-numeric: tabular-nums;
  font-weight: var(--num-weight);
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: background-color 0.4s ease;
}

/* Zebra: TV'de okunurlugu artirir (profil ile ac/kapa) */
[data-zebra="on"] .prices tbody tr.row:nth-child(even) td { background: var(--stripe); }

/* Gosterim yogunlugu: kompakt (daha dar satirlar, daha cok urun sigar) */
[data-density="compact"] .prices td { padding: 0.14em 0.55em; }

/* Urun grup ayraci satiri (Altin / Doviz / Gumus ...) */
.prices tr.grouphead td {
  background: transparent;
  border-bottom: 2px solid var(--gold-dim);
  color: var(--gold);
  font-size: 0.58em;
  font-weight: 800;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  text-align: left;
  padding: 0.7em 0.55em 0.3em;
}

.prices .pname {
  text-align: left;
  color: var(--text);
  font-weight: 700;
  letter-spacing: 0.3px;
}
.prices .buy  { color: var(--buy); }
.prices .sell { color: var(--sell); }

.chg { font-size: 0.66em; font-weight: 800; }
.chg.up   { color: var(--up); }
.chg.down { color: var(--down); }
.chg .arrow { margin-right: 0.15em; }

tr.flash-up td   { background-color: color-mix(in srgb, var(--up) 22%, transparent) !important; }
tr.flash-down td { background-color: color-mix(in srgb, var(--down) 22%, transparent) !important; }

/* Alt bar: solda U-Core Digital markasi, sagda akan doviz seridi */
.ticker {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: clamp(0.6rem, 1.1vw, 1.8rem);
  overflow: hidden;
  border-top: 1px solid var(--gold-dim);
  padding: clamp(0.6rem, 1.8vh, 1.6rem) 0 clamp(0.6rem, 1.8vh, 1.6rem) clamp(0.8rem, 2vw, 2rem);
}
.ticker.hidden, .announce.hidden { display: none; }

.ticker__brand { flex: 0 0 auto; display: flex; align-items: center; opacity: 0.9; }
.ticker__brand img { height: clamp(1.3rem, 3.2vh, 2.4rem); width: auto; object-fit: contain; }

.ticker__viewport { flex: 1 1 auto; min-width: 0; overflow: hidden; }
.ticker__track {
  display: inline-flex;
  white-space: nowrap;
  will-change: transform;
}
/* Bosluk item'in kendi sag padding'inde: boylece serit tam periyodik olur
   ve dongu ekleme noktasinda "atlama" olmaz (JS tam bir kopya kadar kaydirir). */
.ticker__item {
  font-size: clamp(0.85rem, 2.4vh, 1.7rem);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  padding-right: clamp(1.6rem, 3vw, 3.2rem);
}
.ticker__item .lbl { color: var(--gold); margin-right: 0.4rem; letter-spacing: 0.5px; }
.ticker__item .up   { color: var(--up); }
.ticker__item .down { color: var(--down); }

/* Iki esit yarim icerik -> -50% kusursuz dongu */
@keyframes scroll-left {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* Duyuru seridi */
.announce {
  flex: 0 0 auto;
  background: linear-gradient(90deg, color-mix(in srgb, var(--gold) 10%, transparent), transparent);
  border: 1px solid var(--gold-dim);
  border-radius: 0.6rem;
  padding: 0.5rem 1rem;
  font-size: clamp(0.85rem, 2.2vh, 1.5rem);
  font-weight: 600;
  color: var(--gold-bright);
  text-align: center;
}

/* Canli durum rozeti (header sag) */
.status {
  display: inline-flex;
  align-items: center;
  gap: 0.45em;
  color: var(--muted);
  font-size: clamp(0.75rem, 2vh, 1.35rem);
  font-weight: 600;
  white-space: nowrap;
}
.dot { width: 0.7em; height: 0.7em; border-radius: 50%; background: var(--up); box-shadow: 0 0 8px var(--up); }
.dot.bad { background: var(--down); box-shadow: 0 0 8px var(--down); }
.dot.frozen { background: var(--gold); box-shadow: 0 0 8px var(--gold); }

/* Saat altinda opsiyonel tarih */
.clock .date { display: block; font-size: 0.5em; font-weight: 600; color: var(--muted); letter-spacing: 0.5px; text-align: right; }

/* Header opsiyonel baslik satiri */
.head-title {
  flex: 0 0 auto;
  text-align: center;
  font-size: clamp(0.8rem, 2vh, 1.4rem);
  font-weight: 700;
  letter-spacing: 0.5px;
  color: var(--gold-bright);
}
.head-title.hidden { display: none; }

/* Alt not seridi (adres/telefon) */
.footnote {
  flex: 0 0 auto;
  text-align: center;
  font-size: clamp(0.7rem, 1.8vh, 1.15rem);
  font-weight: 600;
  color: var(--muted);
  padding: 0.15rem 0.5rem 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.footnote.hidden { display: none; }

/* Mesai disi "Kapaliyiz" ekrani */
.closed-overlay {
  position: fixed; inset: 0; z-index: 50;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: clamp(1rem, 3vh, 2.2rem);
  background:
    radial-gradient(1200px 800px at 50% -10%, var(--gold-glow), transparent 60%),
    var(--bg);
  text-align: center; padding: 2rem;
}
.closed-overlay.hidden { display: none; }
.closed-overlay img.logo { max-height: clamp(4rem, 16vh, 11rem); max-width: 70%; object-fit: contain; }
.closed-overlay .title {
  font-size: clamp(2rem, 9vh, 6rem); font-weight: 800; letter-spacing: 1px;
  background: linear-gradient(180deg, var(--gold-bright), var(--gold));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.closed-overlay .msg { font-size: clamp(1rem, 3vh, 2rem); color: var(--muted); max-width: 40ch; }
.closed-overlay .cclock { font-size: clamp(1.4rem, 5vh, 3.4rem); font-weight: 700; color: var(--gold); font-variant-numeric: tabular-nums; }

/* ================= Dikey (portrait) ekran ================= */
[data-orientation="portrait"] .prices { font-size: calc(clamp(1.2rem, 3.2vh, 3.4rem) * var(--fit) * var(--user-scale)); }
[data-orientation="portrait"] .board { padding: clamp(1rem, 2.5vh, 2rem); }

/* Header: müşteri logosu SOLA; AltınPanel header'dan kalkar (footer'a taşınır) */
[data-orientation="portrait"] .brand-left { display: none; }
[data-orientation="portrait"] .brand-center { order: -1; flex: 1 1 auto; justify-content: flex-start; }
[data-orientation="portrait"] .brand-center img { height: calc(clamp(2.8rem, 5vh, 5.5rem) * var(--logo-scale)); }

/* Döviz bandı dikeyde U-Core'suz (marka alt footer'a taşındı) */
[data-orientation="portrait"] .ticker__brand { display: none; }

/* Alt marka footer'ı yalnızca dikeyde: solda AltınPanel, sağda U-Core */
.foot-portrait { display: none; }
[data-orientation="portrait"] .foot-portrait {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: clamp(0.4rem, 1.1vh, 1.4rem) clamp(0.2rem, 0.5vw, 0.6rem) 0 clamp(0.2rem, 0.5vw, 0.6rem);
  border-top: 1px solid var(--gold-dim);
}
.foot-portrait .applogo-foot { height: clamp(1.6rem, 3.2vh, 2.8rem); width: auto; object-fit: contain; }
.foot-portrait .ucore-foot { height: clamp(1.3rem, 2.6vh, 3.6rem); width: auto; object-fit: contain; }

/* Baglanti kesik durumunda hafif soluk */
body.stale .board__main { opacity: 0.55; transition: opacity 0.5s ease; }
