/* Kurumsal kimlik v1.0 (17.10.2026, docs: Ne_Kazaniyorsun_Kurumsal_Kimlik_Rehberi.pdf) — DENEME KATMANI.
   Yalnızca <html data-brand="nk"> iken etkilidir; bu öznitelik yoksa site bugünkü görünümündedir.
   Önizleme: adrese ?kimlik=yeni eklenir (theme.js, yalnızca o tarayıcıda), ?kimlik=eski ile kapanır.
   Geri dönüş: bu dosyayı ve base.html'deki bağlantısını kaldırmak yeterli; panel.css'e dokunulmadı.
   Renkler: koyu yeşil #12261D, altın sarısı #E0A92B (vurgu), kırık beyaz #F2F4F1, adaçayı #DCE6DD,
   metin grisi #607066. Font: Manrope (logo/başlık 800, ara başlık 600, metin 400).
   Durum renkleri marka renginden ayrıdır: iyi = yeşil, orta = turuncu, düşük = kırmızı (altın yalnız vurgu). */
@font-face { font-family: 'Manrope'; src: url("fonts/Manrope-variable.fd3e0b4466c4.woff") format('woff'); font-weight: 200 800; font-display: swap; }

/* Koyu tema (ve açık temadaki koyu not kartı) */
:root[data-brand="nk"], :root[data-brand="nk"][data-theme="light"] .grade-card {
  --bg: #0B0B0C;
  --surface: #151517;
  --surface-2: #1C1C1F;
  --line: #2A2A2E;
  --line-2: #37373C;
  --ink: #F3F3F1;
  --muted: #9B9BA1;
  --body-muted: #C0C0C5;
  --accent: #E0A92B;
  --accent-ink: #141414;
  --accent-fill: #E0A92B;
  --accent-soft: rgba(224, 169, 43, 0.16);
  --good: #5CCB8F;
  --good-soft: rgba(92, 203, 143, 0.16);
  --red: #FF7B6E;
  --red-soft: rgba(255, 123, 110, 0.14);
  --amber: #F2913D;
  --display: 'Manrope', system-ui, sans-serif;
  --body: 'Manrope', system-ui, sans-serif;
  --glow: #1C1912;
  --tint-1: #1A1813;
  --tint-2: #1E1B14;
  --tint-3: #26221A;
  --tint-line: #3A3324;
  --accent-line: #6B5420;
  --placeholder: #46464C;
  --amber-soft: #2E2312;
  --amber-line: #4A3518;
  --red-line: #5C2A26;
  --glass: rgba(21, 21, 23, .95);
  --danger-ink: #2A0A0A;
  --veil-1: rgba(11, 11, 12, .18);
  --veil-2: rgba(11, 11, 12, .60);
}
/* Açık tema: kırık beyaz zemin, beyaz kart, açık gri ikincil yüzey; altın yalnız dolgu (üstünde koyu yazı).
   Rehber: açık zeminde küçük sarı metin kullanılmaz, bu yüzden metin vurgusu koyudur.
   17.10.2026 kullanıcı isteği: yeşil zemin/yüzey tonları yerine siyah ve gri (logo, altın vurgu, Manrope aynı). */
:root[data-brand="nk"][data-theme="light"] {
  --bg: #F4F4F2;
  --surface: #FFFFFF;
  --surface-2: #EEEEEB;
  --line: #DADAD6;
  --line-2: #C5C5C0;
  --ink: #141414;
  --muted: #66666B;
  --body-muted: #404045;
  --accent: #141414;
  --accent-ink: #141414;
  --accent-fill: #E0A92B;
  --accent-soft: rgba(224, 169, 43, 0.20);
  --good: #1D7A4A;
  --good-soft: rgba(29, 122, 74, 0.12);
  --red: #B9332A;
  --red-soft: rgba(185, 51, 42, 0.10);
  --amber: #B25A12;
  --glow: #ECE8DE;
  --tint-1: #F7F5EF;
  --tint-2: #F2EFE6;
  --tint-3: #EAE5D8;
  --tint-line: #D9D0BA;
  --accent-line: #E0C27A;
  --placeholder: #A0A0A5;
  --amber-soft: #FBEFD9;
  --amber-line: #EBCB8F;
  --red-line: #E8B1AB;
  --glass: rgba(255, 255, 255, .95);
  --danger-ink: #FFFFFF;
  --veil-1: rgba(244, 244, 242, .20);
  --veil-2: rgba(244, 244, 242, .68);
}
:root[data-brand="nk"][data-theme="light"] .grade-card { box-shadow: 0 18px 40px rgba(10, 10, 12, .22); }
:root[data-brand="nk"][data-theme="light"] .card, :root[data-brand="nk"][data-theme="light"] .hero-left { box-shadow: 0 1px 2px rgba(10, 10, 12, .05), 0 8px 24px rgba(10, 10, 12, .06); }

/* Tipografi: tek aile Manrope; başlık 800, metin 400 (panel.css'teki 700 başlıklar 800'e çıkar). */
:root[data-brand="nk"] h1, :root[data-brand="nk"] h2 { font-weight: 800; letter-spacing: -0.035em; }

/* "İyi / arttı" durumları: altın marka vurgusu yerine yeşil. */
:root[data-brand="nk"] .ring-fill.tone-good { stroke: var(--good); }
:root[data-brand="nk"] .rank-region.tone-good { color: var(--good); }
:root[data-brand="nk"] .shared-grade.tone-good { background: var(--good); color: #0B0B0C; }
:root[data-brand="nk"] .shared-grade.tone-mid { color: #0B0B0C; }
:root[data-brand="nk"] .stat-value.up,
:root[data-brand="nk"] .anchor-table .pct.up,
:root[data-brand="nk"] .market-basket-table .pct.up,
:root[data-brand="nk"] .my-anchor-nums b.up,
:root[data-brand="nk"] .account-comparisons td.up,
:root[data-brand="nk"] .items-table .down-price,
:root[data-brand="nk"] .quality-card .down-price,
:root[data-brand="nk"] .account-rows .ok,
:root[data-brand="nk"] .account-who .ok { color: var(--good); }
:root[data-brand="nk"] .quality-card.tier-3 { border-top-color: var(--good); }

/* Logo: yazı yerine Soru-Lira logosu; açık zeminde ana, koyu zeminde ters sürüm. Ad bir daha yazılmaz.
   Başlıkta *-site.svg kullanılır (17.10 kullanıcı isteği): simge çizgileri biraz kalın (14→17, 10→12,5), küçük
   boyutta silik durmasın. 17.10 logo v1.1: simge yazının SONUNDA (sağda). Slogan logodaki yazının başladığı yerden
   (genişliğin % 3,4'ü) başlar ve yazının
   altına oturur (logonun alt boşluğu simgenin noktası içindir, slogan oraya çekilir). */
.brand-logo { display: none; }
:root[data-brand="nk"] .brand { --logo-w: 260px; }
:root[data-brand="nk"] .brand-name { display: none; }
:root[data-brand="nk"] .brand-logo.on-dark { display: block; width: var(--logo-w); height: auto; }
:root[data-brand="nk"][data-theme="light"] .brand-logo.on-dark { display: none; }
:root[data-brand="nk"][data-theme="light"] .brand-logo.on-light { display: block; width: var(--logo-w); height: auto; }
:root[data-brand="nk"] .brand-tagline { margin: calc(var(--logo-w) * -0.075) 0 0 calc(var(--logo-w) * 0.034);
  font-size: max(11px, calc(var(--logo-w) * 0.054)); font-weight: 600; letter-spacing: .005em; line-height: 1.2; color: var(--body-muted); }
/* Telefonda logo + slogan, tema ve giriş düğmeleriyle tek satıra sığsın (390 ve 360 px genişlikte ölçüldü). */
@media (max-width: 420px) {
  :root[data-brand="nk"] .top { column-gap: 12px; padding-left: 16px; padding-right: 16px; }
  :root[data-brand="nk"] .top-right { column-gap: 8px; }
  :root[data-brand="nk"] .brand { --logo-w: 160px; }
  /* Telefonda slogan logo kadar uzun; simgenin altın noktasına değmesin diye noktanın altından başlar. */
  :root[data-brand="nk"] .brand-tagline { font-size: 10.5px; margin-top: calc(var(--logo-w) * -0.012); }
}
@media (max-width: 370px) { :root[data-brand="nk"] .brand-tagline { font-size: 10px; } }

/* Önizleme şeridi: yalnız ?kimlik=yeni ile açılan önizlemede görünür (theme.js). */
.brand-preview { position: fixed; z-index: 60; left: 50%; bottom: 84px; transform: translateX(-50%); display: flex; align-items: center; gap: 10px;
  padding: 8px 10px 8px 16px; border-radius: 999px; background: #151517; color: #F3F3F1; font: 600 13px/1.2 'Manrope', system-ui, sans-serif;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .35); border: 1.5px solid #E0A92B; white-space: nowrap; }
.brand-preview a { color: #141414; background: #E0A92B; border-radius: 999px; padding: 6px 12px; text-decoration: none; font-weight: 800; }
@media (min-width: 900px) { .brand-preview { bottom: 20px; } }

/* Zaman çizelgesi (17.10.2026): kategorik palet dataviz doğrulayıcısından geçti (koyu #151517, açık #FFFFFF);
   açık temada iki rengin kontrastı 3:1 altında → çizgi uçlarında doğrudan etiket + tablo görünümü var. */
:root, :root[data-brand="nk"] { --tl-1: #3987e5; --tl-2: #d95926; --tl-3: #199e70; --tl-4: #c98500; }
:root[data-theme="light"], :root[data-brand="nk"][data-theme="light"] { --tl-1: #2a78d6; --tl-2: #eb6834; --tl-3: #1baf7a; --tl-4: #eda100; }
.timeline-card { padding: 18px 18px 14px; display: flex; flex-direction: column; gap: 10px; }
.tl-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 13px; color: var(--body-muted); font-weight: 600; }
.tl-legend span { display: inline-flex; align-items: center; gap: 6px; }
.tl-sw { display: inline-block; width: 12px; height: 4px; border-radius: 2px; vertical-align: middle; margin-right: 4px; }
.tl-chart { position: relative; width: 100%; }
.tl-chart svg { display: block; width: 100%; height: auto; overflow: visible; }
.tl-grid { stroke: var(--line); stroke-width: 1; }
.tl-grid.tl-base { stroke: var(--line-2); stroke-dasharray: 3 3; }
.tl-axis { fill: var(--muted); font-size: 11px; font-family: var(--body); }
.tl-line { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.tl-dot { stroke: var(--surface); stroke-width: 2; }
.tl-end { fill: var(--ink); font-size: 12px; font-weight: 700; font-family: var(--body); }
.tl-cross { stroke: var(--muted); stroke-width: 1; stroke-dasharray: 2 3; }
.tl-hit { fill: transparent; cursor: crosshair; }
.tl-tip { position: absolute; z-index: 5; pointer-events: none; padding: 10px 12px; border-radius: 12px; background: var(--surface-2);
  border: 1px solid var(--line-2); box-shadow: 0 8px 24px rgba(0,0,0,.25); font-size: 12.5px; line-height: 1.55; color: var(--ink); white-space: nowrap; }
.tl-personal { font-size: 14px; }
.tl-table-details { margin-top: 2px; }

/* Hedefim kaç ayda? (17.10.2026) */
.goal-card { margin-top: 14px; display: flex; flex-direction: column; gap: 10px; }
.goal-title { font-size: 18px; }
.goal-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; }
.goal-result { font-size: 16px; font-weight: 600; color: var(--ink); }

/* Arkadaşınla karşılaştır (17.10.2026) */
.shared-vs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; margin-top: 8px; }
.shared-vs-cell { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--line); }
.shared-vs-grade { font: 800 26px/1.1 var(--display); }
.shared-vs-note { grid-column: 1 / -1; font-size: 13.5px; color: var(--body-muted); }

/* Asgari ücret sayacı (17.10.2026) */
.mw-counter { display: flex; flex-direction: column; gap: 4px; margin-bottom: 14px; }
