/* Refleks Portal — ortak tasarım sistemi.
   Kurumsal kimlik reflekskursmerkezi.com ile aynı: Sora (başlık) + Manrope (metin),
   siyah #141414 · sarı #FBB900 · zemin #F5F5F3. */

:root{
  --siyah:#141414; --sari:#FBB900; --sari-acik:#FFD45C; --sari-soluk:#FFF3CC;
  --zemin:#F5F5F3; --metin:#1C1C1C; --soluk:#5C5C5C; --cizgi:#E6E6E2;
  --kart:#fff; --kart-golge:0 1px 2px rgba(20,20,20,.05), 0 8px 24px rgba(20,20,20,.05);
  --iyi:#2E9E5B; --uyari:#E8A317; --kotu:#D93B3B; --bilgi:#2E6FD9;
  --serif:"Sora","Segoe UI",system-ui,sans-serif;
  --sans:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r:16px; --r-k:10px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--zemin);color:var(--metin);font:16px/1.55 var(--sans);
  -webkit-font-smoothing:antialiased}
h1,h2,h3,h4,.marka{font-family:var(--serif);letter-spacing:-.01em}
a{color:inherit}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--sari);outline-offset:2px;border-radius:6px}

/* ---------- düğmeler ---------- */
.buton{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;border-radius:999px;
  padding:13px 26px;font:700 15px var(--serif);cursor:pointer;text-decoration:none;
  transition:transform .15s,filter .15s,background .15s;white-space:nowrap}
.buton:hover:not(:disabled){filter:brightness(1.06);transform:translateY(-1px)}
.buton:disabled{opacity:.5;cursor:not-allowed;transform:none}
.buton-sari{background:var(--sari);color:var(--siyah)}
.buton-siyah{background:var(--siyah);color:#fff}
.buton-hayalet{background:#fff;color:var(--metin);border:1.5px solid var(--cizgi)}
.buton-hayalet:hover:not(:disabled){border-color:var(--siyah)}
.buton-tehlike{background:#fff;color:var(--kotu);border:1.5px solid #f0c8c8}
.buton-kucuk{padding:8px 16px;font-size:13px}
.buton-sira{display:flex;flex-wrap:wrap;gap:8px}

/* ---------- giriş ekranı ---------- */
.giris-sayfa{min-height:100dvh;display:grid;place-items:center;padding:24px;
  background:radial-gradient(1200px 600px at 50% -10%,#242424 0%,var(--siyah) 55%)}
.giris-kart{width:100%;max-width:430px;background:#1a1a1a;border:1px solid #2c2c2c;border-radius:24px;
  padding:38px 32px;color:#fff;box-shadow:0 30px 60px rgba(0,0,0,.35)}
.giris-kart .logo{display:block;margin:0 auto 22px;height:46px}
.giris-kart h1{font-size:23px;margin:0 0 6px;text-align:center}
.giris-kart p.alt{color:#9a9a9a;text-align:center;margin:0 0 26px;font-size:14px}
.alan{margin-bottom:16px}
.alan label{display:block;font:700 13px var(--serif);margin-bottom:6px;color:#d8d8d8}
.alan input{width:100%;padding:13px 14px;border-radius:12px;border:1.5px solid #333;background:#141414;color:#fff;font:15px var(--sans)}
.alan input:focus{outline:none;border-color:var(--sari)}
.hata{background:#3a1c1c;border:1px solid #6b2b2b;color:#ffb4b4;padding:10px 14px;border-radius:10px;font-size:14px;margin-bottom:16px;display:none}
.hata.gorunur{display:block}
.bilgi{background:#1c2f22;border:1px solid #2b6b42;color:#a8e6bd;padding:10px 14px;border-radius:10px;font-size:14px;margin-bottom:16px;display:none}
.bilgi.gorunur{display:block}
.sekmeler{display:flex;gap:6px;background:#141414;border-radius:999px;padding:4px;margin-bottom:22px}
.sekme{flex:1;border:none;background:transparent;color:#9a9a9a;border-radius:999px;padding:10px 8px;font:700 13px var(--serif);cursor:pointer}
.sekme.aktif{background:var(--sari);color:var(--siyah)}
.giris-kart .buton{width:100%;margin-top:6px}
.link-buton{display:block;margin:14px auto 0;background:none;border:none;color:#9a9a9a;text-decoration:underline;font:600 13px var(--sans);cursor:pointer}
.link-buton:hover{color:var(--sari)}
.yukleniyor{display:none;text-align:center;color:#9a9a9a;font-size:13px;margin-top:14px}
.yukleniyor.gorunur{display:block}

/* ---------- panel kabuğu ---------- */
.panel-ust{position:sticky;top:0;z-index:40;background:var(--siyah);color:#fff;
  padding:0 22px;display:flex;align-items:center;gap:16px;min-height:62px;
  box-shadow:0 1px 0 rgba(255,255,255,.06)}
.panel-ust .logo{height:30px;flex:none}
.panel-ust .marka{font:800 16px var(--serif);color:#fff;text-decoration:none;letter-spacing:-.02em}
.panel-ust .marka span{color:var(--sari)}
.panel-ust .bosluk{flex:1}
.panel-ust .kim{font-size:13px;color:#b8b8b8;text-align:right;line-height:1.3}
.panel-ust .kim b{display:block;color:#fff;font:700 14px var(--serif)}
.panel-ust .cikis{background:transparent;border:1.5px solid #3a3a3a;color:#ddd;border-radius:999px;
  padding:8px 16px;font:700 13px var(--serif);cursor:pointer;flex:none}
.panel-ust .cikis:hover{border-color:var(--sari);color:var(--sari)}

/* yatay gezinme şeridi */
.menu{position:sticky;top:62px;z-index:35;background:#fff;border-bottom:1px solid var(--cizgi);
  padding:0 22px;display:flex;gap:2px;overflow-x:auto;scrollbar-width:thin}
.menu a{display:inline-flex;align-items:center;gap:7px;padding:14px 14px 12px;font:700 14px var(--serif);
  color:var(--soluk);text-decoration:none;border-bottom:3px solid transparent;white-space:nowrap}
.menu a:hover{color:var(--metin)}
.menu a.aktif{color:var(--metin);border-bottom-color:var(--sari)}
.menu a svg{width:17px;height:17px;flex:none}

.panel-govde{max-width:1180px;margin:0 auto;padding:24px 22px 72px}
.panel-govde.genis{max-width:1420px}
.sayfa-baslik{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:4px 0 20px}
.sayfa-baslik h1{margin:0;font-size:clamp(22px,3vw,30px)}
.sayfa-baslik p{margin:6px 0 0;color:var(--soluk);font-size:14px}

/* ---------- kartlar ---------- */
.kart{background:var(--kart);border:1px solid var(--cizgi);border-radius:var(--r);padding:20px;
  margin-bottom:16px;box-shadow:var(--kart-golge)}
.kart>h2,.kart>h3{margin:0 0 4px;font-size:17px}
.kart-ust{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.kart-ust h2,.kart-ust h3{margin:0;font-size:17px}
.aciklama{color:var(--soluk);font-size:13.5px;margin:2px 0 14px}
.kart .aciklama:last-child{margin-bottom:0}
.izgara{display:grid;gap:16px}
@media(min-width:900px){
  .izgara-2{grid-template-columns:1fr 1fr}
  .izgara-3{grid-template-columns:repeat(3,1fr)}
  .izgara-21{grid-template-columns:2fr 1fr}
  .izgara-12{grid-template-columns:1fr 2fr}
}

/* ---------- özet (KPI) kutuları ---------- */
.ozet{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin-bottom:16px}
.ozet-kutu{background:var(--kart);border:1px solid var(--cizgi);border-radius:var(--r);padding:16px 18px;
  box-shadow:var(--kart-golge);position:relative;overflow:hidden}
.ozet-kutu::after{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--sari)}
.ozet-kutu.mavi::after{background:var(--bilgi)}
.ozet-kutu.yesil::after{background:var(--iyi)}
.ozet-kutu.kirmizi::after{background:var(--kotu)}
.ozet-kutu.siyah::after{background:var(--siyah)}
.ozet-kutu .etiket{font-size:12px;color:var(--soluk);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.ozet-kutu .deger{font:800 27px/1.15 var(--serif);margin-top:5px;display:flex;align-items:baseline;gap:6px}
.ozet-kutu .deger small{font:600 13px var(--sans);color:var(--soluk)}
.ozet-kutu .alt{font-size:12.5px;color:var(--soluk);margin-top:3px}
.degisim{font:700 12.5px var(--sans);display:inline-flex;align-items:center;gap:3px}
.degisim.arti{color:var(--iyi)}
.degisim.eksi{color:var(--kotu)}
.degisim.notr{color:var(--soluk)}

/* ---------- rozet / etiket ---------- */
.rozet{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:999px;
  font:700 12px var(--serif);white-space:nowrap}
.rozet.ok{background:#e6f6ec;color:#1d6e3f}
.rozet.hata{background:#fdecec;color:#a52020}
.rozet.uyari{background:#fdf3dc;color:#8a6209}
.rozet.gri{background:#eeeeeb;color:#555}
.rozet.mavi{background:#e8f0fd;color:#1c4e9e}
.rozet.sari{background:var(--sari-soluk);color:#7a5a00}
.etiket-net{background:var(--sari-soluk);color:#7a5a00;font:800 14px var(--serif);padding:5px 13px;border-radius:999px;white-space:nowrap}

/* ---------- tablo ---------- */
.tablo-sar{overflow-x:auto;margin:0 -20px;padding:0 20px}
table.tablo{width:100%;border-collapse:collapse;font-size:14px;min-width:520px}
table.tablo th{text-align:left;font:700 12px var(--serif);color:var(--soluk);text-transform:uppercase;
  letter-spacing:.04em;padding:10px 12px;border-bottom:2px solid var(--cizgi);white-space:nowrap;
  position:sticky;top:0;background:var(--kart)}
table.tablo td{padding:11px 12px;border-bottom:1px solid var(--cizgi);vertical-align:middle}
table.tablo tbody tr:hover{background:#faf9f6}
table.tablo tr.tiklanir{cursor:pointer}
table.tablo td.sag,table.tablo th.sag{text-align:right}
table.tablo td.ad{font-weight:600}
table.tablo .kucuk{font-size:12.5px;color:var(--soluk)}
.tablo-bos{text-align:center;color:var(--soluk);padding:34px 10px}

/* ---------- form öğeleri ---------- */
input[type=text],input[type=email],input[type=password],input[type=date],input[type=search],
input[type=number],select,textarea{
  padding:10px 12px;border:1.5px solid var(--cizgi);border-radius:var(--r-k);background:#fff;
  font:15px var(--sans);color:var(--metin);max-width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--sari)}
textarea{width:100%;resize:vertical;font-family:var(--sans)}
label.kutu{display:inline-flex;align-items:center;gap:7px;font-size:14px;cursor:pointer}
.araclar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:14px}
.araclar .buyu{flex:1;min-width:190px}
.modul-liste{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:6px 14px;margin:10px 0}
.modul-liste label{display:flex;align-items:center;gap:8px;font-size:14px}

/* ---------- sınav satırı (öğrenci listesi) ---------- */
.sinav-satir{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 0;border-bottom:1px solid var(--cizgi)}
.sinav-satir:last-child{border-bottom:none}
.sinav-adi{font:700 15px var(--serif)}
.sinav-tarih{color:var(--soluk);font-size:13px}
.sira{font-size:13px;color:var(--soluk)}
.bos-durum{text-align:center;color:var(--soluk);padding:40px 10px}

/* liste-kart: tıklanabilir deneme kartı */
.deneme-liste{display:grid;gap:10px}
.deneme-kart{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;
  background:#fff;border:1px solid var(--cizgi);border-radius:var(--r-k);padding:13px 16px;
  cursor:pointer;text-align:left;font:inherit;color:inherit;width:100%;transition:border-color .15s,transform .15s}
.deneme-kart:hover{border-color:var(--sari);transform:translateX(2px)}
.deneme-kart.secili{border-color:var(--sari);background:#fffdf5;box-shadow:inset 3px 0 0 var(--sari)}
.deneme-kart .ad{font:700 14.5px var(--serif);line-height:1.3}
.deneme-kart .meta{font-size:12.5px;color:var(--soluk);margin-top:3px}
.deneme-kart .sag{text-align:right}
.deneme-kart .net{font:800 19px var(--serif)}
.deneme-kart .puan{font-size:12.5px;color:var(--soluk)}

/* ---------- ders kartları ---------- */
.ders-izgara{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(215px,1fr))}
.ders-kart{border:1px solid var(--cizgi);border-radius:var(--r-k);padding:14px 16px;background:#fff;
  border-left:4px solid var(--sari)}
.ders-kart .ad{font:700 14px var(--serif);margin-bottom:8px}
.ders-kart .net{font:800 25px/1 var(--serif)}
.ders-kart .net small{font:600 12px var(--sans);color:var(--soluk)}
.ders-kart .dky{display:flex;gap:12px;font-size:12.5px;color:var(--soluk);margin-top:8px}
.ders-kart .dky b{font-weight:700}
.ders-kart .dky .d{color:var(--iyi)}
.ders-kart .dky .y{color:var(--kotu)}
.serit{height:6px;border-radius:99px;background:var(--zemin);overflow:hidden;margin-top:9px}
.serit i{display:block;height:100%;border-radius:99px;background:var(--sari)}
.serit.ince{height:5px}

/* ---------- grafikler ---------- */
.grafik{width:100%;min-height:40px}
.grafik-bos{display:grid;place-items:center;min-height:130px;color:var(--soluk);font-size:13.5px;
  background:var(--zemin);border-radius:var(--r-k)}
.grafik-aciklama{display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:center;margin-top:10px;
  font-size:12.5px;color:var(--soluk)}
.grafik-aciklama span{display:inline-flex;align-items:center;gap:6px}
.grafik-aciklama i{width:11px;height:11px;border-radius:3px;display:inline-block;flex:none}
.grafik-aciklama i.kesik{height:0;border-top:2.5px dashed currentColor;border-radius:0;background:none!important}
.grafik-ipucu{position:fixed;top:0;left:0;z-index:90;pointer-events:none;opacity:0;transition:opacity .12s;
  background:rgba(20,20,20,.95);color:#fff;border-radius:10px;padding:9px 12px;font:13px var(--sans);
  max-width:260px;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.grafik-ipucu.gorunur{opacity:1}
.grafik-ipucu .baslik{font:700 13px var(--serif);margin-bottom:4px}
.grafik-ipucu div{display:flex;align-items:center;gap:7px;line-height:1.5}
.grafik-ipucu i{width:9px;height:9px;border-radius:2px;flex:none}

/* ---------- filtre çipleri ---------- */
.cipler{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:14px}
.cip{border:1.5px solid var(--cizgi);background:#fff;border-radius:999px;padding:6px 14px;
  font:700 13px var(--serif);cursor:pointer;color:var(--soluk)}
.cip:hover{border-color:var(--siyah);color:var(--metin)}
.cip.aktif{background:var(--siyah);border-color:var(--siyah);color:#fff}

/* ---------- bilgi satırı ---------- */
.satir-bilgi{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px dashed var(--cizgi);font-size:14px}
.satir-bilgi:last-child{border-bottom:none}
.satir-bilgi>span:first-child{color:var(--soluk)}
.satir-bilgi>span:last-child{text-align:right;font-weight:600}

/* ---------- uyarı kutusu ---------- */
.uyari-kutu{background:var(--sari-soluk);border:1px solid #f0dca0;color:#6b4e00;padding:12px 16px;
  border-radius:var(--r-k);font-size:14px;margin-bottom:14px}
.uyari-kutu.kirmizi{background:#fdecec;border-color:#f3c9c9;color:#8f2020}
.uyari-kutu.yesil{background:#e9f7ee;border-color:#bfe6cd;color:#1d6e3f}
.uyari-kutu.mavi{background:#eaf1fd;border-color:#c6d8f7;color:#1c4e9e}
.uyari-kutu b{font-family:var(--serif)}

/* ---------- toast ---------- */
#toast{position:fixed;right:18px;bottom:18px;z-index:80;display:flex;flex-direction:column;gap:9px;max-width:min(400px,calc(100vw - 36px))}
.toast{background:var(--siyah);color:#fff;padding:13px 17px;border-radius:12px;font-size:14px;
  box-shadow:0 12px 30px rgba(0,0,0,.25);animation:toast-gir .22s ease-out}
.toast.hata{background:#8f2020}
@keyframes toast-gir{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ---------- yükleniyor iskeleti ---------- */
.iskelet{background:linear-gradient(90deg,#eceae4 25%,#f5f4f0 50%,#eceae4 75%);background-size:200% 100%;
  animation:iskelet 1.3s linear infinite;border-radius:var(--r-k);min-height:16px}
@keyframes iskelet{to{background-position:-200% 0}}

/* ---------- modal ---------- */
.modal{position:fixed;inset:0;z-index:70;background:rgba(20,20,20,.55);display:grid;place-items:center;padding:18px}
.modal-govde{background:#fff;border-radius:var(--r);max-width:960px;width:100%;max-height:88vh;overflow:auto;
  padding:24px;box-shadow:0 30px 70px rgba(0,0,0,.3)}
.modal-ust{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px}
.modal-ust h2{margin:0;font-size:20px}
.kapat{background:none;border:none;font-size:26px;line-height:1;cursor:pointer;color:var(--soluk);padding:0 4px}
.kapat:hover{color:var(--metin)}

/* ---------- cevap dökümü kılavuzu ---------- */
.cevap-izgara{display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:6px}
.cevap-kutu{border-radius:8px;padding:6px 2px;text-align:center;font:700 12px var(--serif);
  border:1.5px solid transparent;cursor:default}
.cevap-kutu small{display:block;font:600 10.5px var(--sans);opacity:.85}
.cevap-kutu.d{background:#e6f6ec;border-color:#bfe6cd;color:#1d6e3f}
.cevap-kutu.y{background:#fdecec;border-color:#f3c9c9;color:#a52020}
.cevap-kutu.b{background:#f1f1ee;border-color:#e0e0da;color:#666}
.cevap-kutu.i{background:#eaf1fd;border-color:#c6d8f7;color:#1c4e9e}

/* ---------- kullanıcı kartı (yönetim) ---------- */
.kullanici-kart{border:1px solid var(--cizgi);border-radius:var(--r-k);padding:16px;margin-top:12px;background:#fff}
.kullanici-kart.pasif{opacity:.62;background:#faf9f6}
.kullanici-ust{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.kullanici-ust b{font:700 15px var(--serif)}
.kullanici-ust small{color:var(--soluk);font-size:12.5px}
.sifre-alani{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;padding-top:12px;border-top:1px dashed var(--cizgi)}
.istatistik{background:var(--zemin);border-radius:var(--r-k);padding:14px 16px}
.istatistik b{display:block;font:800 24px var(--serif)}
.istatistik span{font-size:12.5px;color:var(--soluk)}

/* ---------- modül kartları (personel ana sayfası) ---------- */
.modul-kartlar{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.modul-kart{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid var(--cizgi);
  border-radius:var(--r);padding:20px;text-decoration:none;color:inherit;box-shadow:var(--kart-golge);
  border-left:4px solid var(--sari);transition:transform .15s,border-color .15s}
a.modul-kart:hover{transform:translateY(-2px);border-color:var(--sari)}
.modul-kart b{font:700 16px var(--serif)}
.modul-kart span{font-size:13.5px;color:var(--soluk)}
.modul-kart.yakinda{opacity:.6;border-left-color:var(--cizgi)}

/* ---------- yazdırma ---------- */
@media print{
  .panel-ust,.menu,.buton,.cipler,#toast{display:none!important}
  body{background:#fff}
  .kart{box-shadow:none;break-inside:avoid}
  .panel-govde{padding:0;max-width:none}
}

/* ---------- dar ekran ---------- */
@media(max-width:640px){
  .panel-ust{padding:0 14px;gap:10px;min-height:56px}
  .panel-ust .kim{display:none}
  .menu{top:56px;padding:0 10px}
  .menu a{padding:12px 10px;font-size:13px}
  .panel-govde{padding:18px 14px 64px}
  .kart{padding:16px;border-radius:14px}
  .tablo-sar{margin:0 -16px;padding:0 16px}
  .ozet{grid-template-columns:1fr 1fr;gap:10px}
  .ozet-kutu{padding:13px 14px}
  .ozet-kutu .deger{font-size:22px}
  .modal-govde{padding:18px;max-height:92vh}
}