/* SOS-Panel — Tasarım A: Açık & Ferah */
:root{
  --bg:#F5F7F6; --card:#FFFFFF; --ink:#1C2B2A; --mut:#5F6F6D;
  --acc:#0F6B62; --accsoft:#E1EFEC; --line:#E2E8E6;
  --good:#2E7D4F; --goodsoft:#E4F1E8; --bad:#B4540A; --badsoft:#FBF1E7;
}
*{ box-sizing:border-box; }
body{ margin:0; background:var(--bg); color:var(--ink);
      font-family:"Segoe UI",system-ui,-apple-system,sans-serif; }
a{ color:var(--acc); }

/* ---- Giriş / kurulum ekranı ---- */
.giris-sarma{ min-height:100vh; display:grid; place-items:center; padding:16px; }
.giris{ background:var(--card); border:1px solid var(--line); border-radius:16px;
        padding:34px 30px; width:100%; max-width:360px; }
.giris .logo{ text-align:center; color:var(--acc); font-weight:700; font-size:1.5rem;
              letter-spacing:.4px; }
.giris .altbaslik{ text-align:center; color:var(--mut); font-size:.86rem; margin:4px 0 20px; }
.giris label{ display:block; font-size:.82rem; color:var(--mut); margin:14px 0 5px; }
.giris input{ width:100%; border:1px solid var(--line); border-radius:9px;
              padding:11px 13px; font-size:.95rem; background:var(--bg); color:var(--ink); }
.giris input:focus{ outline:2px solid var(--accsoft); border-color:var(--acc); }
.giris button{ width:100%; margin-top:20px; background:var(--acc); color:#fff; border:none;
               border-radius:9px; padding:12px; font-size:.98rem; font-weight:600; cursor:pointer; }
.giris button:hover{ background:#0C5A52; }
.hata{ background:var(--badsoft); color:var(--bad); border:1px solid #EDD9C2;
       border-radius:9px; padding:10px 13px; font-size:.86rem; margin-top:14px; }
.ipucu{ font-size:.78rem; color:var(--mut); margin-top:8px; line-height:1.5; }

/* ---- Panel iskeleti ---- */
.kabuk{ display:flex; min-height:100vh; }
nav.yan{ width:210px; background:var(--card); border-right:1px solid var(--line);
         padding:18px 12px; flex-shrink:0; }
nav.yan .logo{ font-weight:700; color:var(--acc); font-size:1.15rem; padding:4px 10px 18px;
               letter-spacing:.3px; }
nav.yan a{ display:block; padding:10px 12px; border-radius:9px; color:var(--mut);
           text-decoration:none; font-size:.92rem; margin-bottom:2px; }
nav.yan a.aktif{ background:var(--accsoft); color:var(--acc); font-weight:600; }
nav.yan a:hover{ background:var(--bg); }
nav.yan .cikis{ color:var(--bad); margin-top:14px; }

main.icerik{ flex:1; padding:22px 26px; min-width:0; }
.ust{ display:flex; justify-content:space-between; align-items:center; gap:12px;
      margin-bottom:18px; flex-wrap:wrap; }
.ust h1{ margin:0; font-size:1.3rem; }
.ust .kim{ display:flex; align-items:center; gap:9px; font-size:.86rem; color:var(--mut); }
.ust .avatar{ width:32px; height:32px; border-radius:50%; background:var(--acc); color:#fff;
              display:grid; place-items:center; font-size:.78rem; font-weight:700; }
.guncelleme{ color:var(--mut); font-weight:400; font-size:.82rem; }

.uyari-kutu{ background:var(--badsoft); border:1px solid #EDD9C2; color:#7A4310;
             border-radius:11px; padding:12px 15px; font-size:.88rem; margin-bottom:18px; }
.uyari-kutu b{ display:block; margin-bottom:5px; }
.uyari-kutu ul{ margin:0; padding-left:18px; } .uyari-kutu li{ margin:3px 0; }

.kartlar{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
          gap:13px; margin-bottom:18px; }
.kart{ background:var(--card); border:1px solid var(--line); border-radius:12px; padding:15px 17px; }
.kart .k{ font-size:.74rem; color:var(--mut); text-transform:uppercase; letter-spacing:.6px; }
.kart .v{ font-size:1.5rem; font-weight:650; margin-top:5px; font-variant-numeric:tabular-nums; }
.kart .d{ font-size:.8rem; margin-top:3px; color:var(--mut); }
.up{ color:var(--good) !important; } .down{ color:var(--bad) !important; }

.panel{ background:var(--card); border:1px solid var(--line); border-radius:12px;
        padding:17px; margin-bottom:16px; }
.panel h2{ margin:0 0 13px; font-size:1rem; }
.kaydir{ overflow-x:auto; }
table{ width:100%; border-collapse:collapse; font-size:.88rem; min-width:520px; }
th{ text-align:left; color:var(--mut); font-weight:600; font-size:.74rem; text-transform:uppercase;
    letter-spacing:.5px; padding:7px 11px; border-bottom:1px solid var(--line); }
td{ padding:10px 11px; border-bottom:1px solid var(--line); font-variant-numeric:tabular-nums; }
tr:last-child td{ border-bottom:none; }
.pill{ border-radius:999px; padding:2px 11px; font-size:.76rem; font-weight:600; }
.pill.iyi{ background:var(--goodsoft); color:var(--good); }
.pill.izle{ background:var(--badsoft); color:var(--bad); }
.kaynak{ font-size:.72rem; color:var(--mut); }
.dipnot{ font-size:.78rem; color:var(--mut); margin-top:6px; line-height:1.5; }
.yapim{ color:var(--mut); font-size:.9rem; padding:8px 0; }

@media (max-width:720px){
  .kabuk{ flex-direction:column; }
  nav.yan{ width:auto; display:flex; overflow-x:auto; gap:4px; padding:10px; align-items:center; }
  nav.yan .logo{ padding:0 10px 0 4px; white-space:nowrap; }
  nav.yan a{ white-space:nowrap; }
  nav.yan .cikis{ margin-top:0; }
}