/* ---------- KOYU TEMA (varsayılan) ---------- */
:root{
  --bg:#0e1115;
  --panel:#171c23;
  --line:#333d4a;
  --text:#ffffff;
  --dim:#9aa6b4;
  --free:#15803d;
  --busy:#b91c1c;
  --plan:#b45309;
  --off:#232a33;
  --off-yazi:#8f9bab;
  --off-kenar:#3c4756;
  --ust:#000000;
  --kutu:#0e1115;
  --pencere:#1c222b;
  --kenar:#56637a;
  --btn:#2b3542;
  --btn-ustu:#3a475a;
  --btn-kenar:#47546a;
  --btn-yazi:#ffffff;
  --etiket:#cbd5e1;
  --ic-cizgi:#262e39;
  --turuncu-yazi:#fdba74;
  --kart-cizgi:rgba(255,255,255,.35);
  --odak:#ffffff;
  /* Kartların ekrana sığması için otomatik ayarlanan ölçek (bkz. olcekle()) */
  --olcek:1;
}

/* ---------- AÇIK TEMA ---------- */
:root.acik{
  --bg:#eef1f5;
  --panel:#ffffff;
  --line:#c2cad6;
  --text:#10141a;
  --dim:#59636f;
  --free:#15803d;
  --busy:#b91c1c;
  --plan:#b45309;
  --off:#e3e7ee;
  --off-yazi:#4d5763;
  --off-kenar:#a9b4c2;
  --ust:#ffffff;
  --kutu:#ffffff;
  --pencere:#ffffff;
  --kenar:#9aa5b4;
  --btn:#e4e8ee;
  --btn-ustu:#d2d9e2;
  --btn-kenar:#a9b4c2;
  --btn-yazi:#10141a;
  --etiket:#3d4855;
  --ic-cizgi:#dde2e9;
  --turuncu-yazi:#8a3a06;
  --kart-cizgi:rgba(255,255,255,.45);
  --odak:#10141a;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  background:var(--bg);
  color:var(--text);
  font-family:"Segoe UI",system-ui,Arial,sans-serif;
  font-size:18px;
}

/* ---------- ÜST ÇUBUK ---------- */
header{
  display:flex;align-items:center;gap:24px;
  padding:10px 20px;background:var(--ust);
  border-bottom:3px solid var(--line);height:78px;
}
#saat{font-size:44px;font-weight:800;letter-spacing:1px;line-height:1}
#tarih{font-size:20px;color:var(--dim);font-weight:600}
.bosluk{flex:1}
.ust-btn{
  font-family:inherit;font-size:19px;font-weight:800;letter-spacing:.5px;
  color:var(--btn-yazi);background:var(--btn);border:2px solid var(--btn-kenar);
  padding:12px 20px;border-radius:6px;cursor:pointer;text-decoration:none;display:inline-block;
}
.ust-btn:hover{background:var(--btn-ustu)}
#baglanti-uyari{
  background:#b91c1c;color:#fff;font-size:20px;font-weight:800;
  padding:10px 20px;text-align:center;
}
.gizli{display:none !important}

/* ---------- TEMA DÜĞMESİ ---------- */
.tema-btn{
  display:flex;align-items:center;gap:10px;
  background:none;border:none;cursor:pointer;padding:0;font-family:inherit;
}
.tema-ikon{font-size:24px;line-height:1}
.tema-yuva{
  width:72px;height:38px;border-radius:19px;position:relative;
  background:var(--btn);border:2px solid var(--btn-kenar);transition:background .15s;
}
.tema-top{
  position:absolute;top:3px;left:3px;width:28px;height:28px;border-radius:50%;
  background:var(--btn-yazi);transition:left .15s;
}
:root.acik .tema-top{left:37px}

/* ---------- KARTLAR ---------- */
.kart{
  border-radius:8px;color:#fff;
  padding:calc(14px * var(--olcek)) calc(18px * var(--olcek));
  cursor:grab;user-select:none;border:3px solid rgba(0,0,0,.35);position:relative;
  overflow:hidden;
}
.kart:active{cursor:grabbing}
.kart.suruklenen{opacity:.35}
.kod{font-size:calc(44px * var(--olcek));font-weight:800;line-height:1.05;letter-spacing:1px}
.ad{font-size:calc(25px * var(--olcek));font-weight:700;line-height:1.2;margin-top:2px}
.aciklama{
  font-size:calc(21px * var(--olcek));font-weight:600;line-height:1.25;
  margin-top:calc(8px * var(--olcek));
  border-top:2px solid var(--kart-cizgi);padding-top:calc(7px * var(--olcek));
}
.kart-sag{
  position:absolute;top:calc(11px * var(--olcek));right:calc(14px * var(--olcek));
  display:flex;align-items:center;gap:calc(8px * var(--olcek));
}
.sure{font-size:calc(19px * var(--olcek));font-weight:800;opacity:.9}
/* Bu vardiyada gönderilen konu sayısı */
.sayac{
  background:rgba(0,0,0,.45);border-radius:6px;
  padding:calc(2px * var(--olcek)) calc(10px * var(--olcek));
  font-size:calc(26px * var(--olcek));font-weight:800;line-height:1.2;
  min-width:calc(38px * var(--olcek));text-align:center;
}
.kart.mesaidisi .sayac{background:rgba(0,0,0,.15);color:var(--off-yazi)}
.kart.bosta{background:var(--free)}
.kart.gorevde{background:var(--busy)}
.kart.planli{background:var(--plan)}
.kart.mesaidisi{
  background:var(--off);color:var(--off-yazi);
  border:3px dashed var(--off-kenar);cursor:default;
}
.kart.mesaidisi .aciklama{border-top-color:var(--off-kenar)}
.kart.yeni{animation:vurgu 1s steps(1) 0s 6}
@keyframes vurgu{0%{border-color:#fff}50%{border-color:rgba(0,0,0,.35)}}

/* ---------- PENCERELER ---------- */
.ortu{position:fixed;inset:0;background:rgba(0,0,0,.7);display:flex;align-items:center;justify-content:center;padding:20px;z-index:10}
.pencere{background:var(--pencere);border:3px solid var(--kenar);border-radius:8px;padding:22px;width:560px;max-width:100%;max-height:92vh;overflow-y:auto}
.pencere.genis{width:940px}
.pencere h2{font-size:26px;font-weight:800;margin-bottom:16px;letter-spacing:.5px}
label{display:block;font-size:20px;font-weight:700;margin-bottom:8px;color:var(--etiket)}
input,select,textarea{
  font-family:inherit;font-size:22px;font-weight:600;width:100%;padding:12px 14px;
  background:var(--kutu);color:var(--text);border:2px solid var(--kenar);border-radius:6px;
}
input:focus,select:focus{outline:3px solid var(--odak)}
.ipucu{color:var(--dim);font-size:17px;font-weight:600;margin-top:8px}
.dugmeler{display:flex;gap:12px;margin-top:22px}
.dugmeler button{font-family:inherit;font-size:21px;font-weight:800;padding:14px 22px;border-radius:6px;border:2px solid transparent;cursor:pointer;flex:1}
.btn-ana{background:#15803d;color:#fff}
.btn-ana:hover{background:#1a9c4b}
.btn-iptal{background:var(--btn);color:var(--btn-yazi);border-color:var(--btn-kenar)}
.btn-iptal:hover{background:var(--btn-ustu)}
.satir-sil{background:#b91c1c;color:#fff;border:none;border-radius:6px;font-size:20px;font-weight:800;padding:8px 14px;cursor:pointer;font-family:inherit}
table{width:100%;border-collapse:collapse}
th,td{padding:6px;text-align:left;font-size:17px}
th{color:var(--dim);font-weight:700;border-bottom:2px solid var(--kenar)}
td input{font-size:19px;padding:8px 10px}
.ayrac{border:none;border-top:2px solid var(--ic-cizgi);margin:22px 0 18px}