/* VEKTORX Kontrol Merkezi — ortak tasarım dili v2.0 (belgeler/tasarim_v2: logo renkleri lacivert → mavi → yeşil geçişi) */
:root {
  --lacivert: #002A5B;      /* ana renk: başlık çubukları, ana yazılar, ana düğme */
  --lacivert-koyu: #001A3D;
  --mavi: #1F8DCD;          /* vurgu: bağlantılar, seçili öğe */
  --mavi-acik: #EAF3FB;
  --yesil-logo: #79C142;    /* logodaki yeşil (geçiş, rozet zemini) */
  --yesil: #4E9A2A;         /* uygun / tamam (okunur koyu ton) */
  --yesil-acik: #EAF6E3;
  --amber: #E09B1A;         /* dikkat vurgusu */
  --sari: #8A5A00;          /* bakılacak / uyarı yazısı (açık zemin üstünde okunur) */
  --sari-acik: #FFF4DD;
  --kirmizi: #D64545;       /* uygun değil / hata */
  --kirmizi-acik: #FBE9E9;
  --murekkep: #14213D;
  --gri: #5B6B82;
  --gri-yazi: #5B6B82;
  --cizgi: #DCE4EE;
  --zemin: #F4F7FB;
  --kagit: #F4F7FB;
  --kart: #ffffff;
  --yazi: #14213D;
  --turuncu: #002A5B;       /* v2.0: ana eylem düğmesi lacivert (eski turuncu adı geriye uyumluluk için kaldı) */
  --gecis: linear-gradient(90deg, #002A5B, #1F8DCD 55%, #79C142);

  --yaricap: 14px;
  --dokunma: 48px;          /* en küçük dokunma hedefi (eldivenle bile) */
  --font: Inter, "Inter Display", "Segoe UI", system-ui, -apple-system, "Atkinson Hyperlegible", sans-serif;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { margin: 0; background: var(--zemin); color: var(--yazi); font-family: var(--font); font-size: 17px; line-height: 1.4; }
body { -webkit-tap-highlight-color: transparent; }

.ust-cubuk { background: var(--lacivert); color: #fff; padding: 14px 20px; display: flex; align-items: center; gap: 12px; }
.ust-cubuk img { height: 32px; background: #fff; border-radius: 6px; padding: 2px 6px; }
.ust-cubuk h1 { font-size: 20px; margin: 0; font-weight: 700; }

.icerik { max-width: 1100px; margin: 0 auto; padding: 20px; display: flex; flex-direction: column; gap: 16px; }
.kart { background: var(--kart); border: 1px solid var(--cizgi); border-radius: var(--yaricap); padding: 16px 18px; }

.dugme { font: inherit; font-weight: 600; min-height: var(--dokunma); padding: 0 20px; border-radius: 12px; border: 0; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.dugme.ana { background: var(--lacivert); color: #fff; }
.dugme.ikincil { background: var(--mavi-acik); color: var(--lacivert); }
.dugme.tamam { background: var(--yesil); color: #fff; }
.dugme:focus-visible, input:focus-visible, select:focus-visible, button:focus-visible { outline: 3px solid var(--mavi); outline-offset: 2px; }

.rozet { display: inline-block; font-size: 14px; font-weight: 600; padding: 4px 10px; border-radius: 999px; }
.rozet.uygun { background: var(--yesil-acik); color: var(--yesil); }
.rozet.bakilacak { background: var(--sari-acik); color: var(--sari); }
.rozet.uygunsuz { background: var(--kirmizi-acik); color: var(--kirmizi); }
.rozet.bilgi { background: var(--mavi-acik); color: var(--lacivert); }

.uyari { border-radius: 12px; padding: 14px 16px; font-weight: 600; }
.uyari.hata { background: var(--kirmizi-acik); color: #8E2B2B; }
.uyari.dikkat { background: var(--sari-acik); color: var(--sari); }
.uyari.basari { background: var(--yesil-acik); color: var(--yesil); }

input[type=text], input[type=number], select, textarea { font: inherit; width: 100%; min-height: var(--dokunma); padding: 10px 14px; border: 1px solid var(--cizgi); border-radius: 10px; background: #fff; color: var(--yazi); }

@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }