/* AHU Studio — giriş ve yönetim sayfalarının ortak görünümü (uygulamanın paleti) */
:root{
  --bg-0:#111417; --bg-1:#181c21; --bg-2:#1e232a; --bg-3:#252b33; --bg-4:#2e353f; --bg-input:#13161a;
  --line:rgba(255,255,255,.07); --line-2:rgba(255,255,255,.12); --line-3:rgba(255,255,255,.22);
  --t-1:#e6e9ee; --t-2:#a3acb8; --t-3:#6d7683; --t-4:#4a525e;
  --accent:#4d8dff; --accent-2:#7aa9ff; --accent-soft:rgba(77,141,255,.14); --accent-line:rgba(77,141,255,.45);
  --warn:#f0b445; --warn-soft:rgba(240,180,69,.14);
  --danger:#ef6461; --danger-soft:rgba(239,100,97,.14);
  --ok:#3fcf8e; --ok-soft:rgba(63,207,142,.14);
  --r:6px; --font:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{background:var(--bg-0);color:var(--t-1);font-family:var(--font);font-size:14px;-webkit-font-smoothing:antialiased}
a{color:var(--accent-2)}
.marka{display:flex;align-items:center;gap:9px;font-weight:600;font-size:15px}
.marka .isaret{width:22px;height:22px;border-radius:6px;background:var(--accent)}
.marka .alt{color:var(--t-3);font-weight:400;font-size:13px}

/* giriş kartı */
.sahne{min-height:100%;display:flex;align-items:center;justify-content:center;padding:24px 16px}
.kart{width:100%;max-width:380px;background:var(--bg-1);border:1px solid var(--line-2);border-radius:12px;padding:28px 24px}
.kart h1{font-size:18px;font-weight:600;margin:22px 0 4px}
.kart .aciklama{color:var(--t-2);font-size:13px;margin-bottom:18px;line-height:1.5}
.sekmeler{display:flex;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r);padding:3px;margin-bottom:18px}
.sekmeler button{flex:1;background:none;border:0;color:var(--t-2);padding:7px;border-radius:4px;font:inherit;font-size:13px;cursor:pointer}
.sekmeler button.aktif{background:var(--bg-4);color:var(--t-1);font-weight:500}
label{display:block;font-size:12px;color:var(--t-2);margin:12px 0 5px}
input,select,textarea{width:100%;background:var(--bg-input);border:1px solid var(--line-2);color:var(--t-1);border-radius:var(--r);padding:9px 10px;font:inherit;font-size:14px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent-line);box-shadow:0 0 0 3px var(--accent-soft)}
.dugme{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--accent);color:#fff;border:0;border-radius:var(--r);padding:10px 14px;font:inherit;font-weight:600;font-size:14px;cursor:pointer}
.dugme.tam{width:100%;margin-top:18px}
.dugme:disabled{opacity:.55;cursor:default}
.dugme.ikincil{background:var(--bg-3);color:var(--t-1);font-weight:500}
.dugme.kucuk{padding:6px 10px;font-size:12.5px}
.baglanti{background:none;border:0;color:var(--accent-2);font:inherit;font-size:13px;cursor:pointer;padding:0}
.mesaj{margin-top:14px;font-size:13px;line-height:1.5;padding:9px 11px;border-radius:var(--r);display:none}
.mesaj.goster{display:block}
.mesaj.hata{background:var(--danger-soft);color:var(--danger)}
.mesaj.bilgi{background:var(--accent-soft);color:var(--accent-2)}
.mesaj.tamam{background:var(--ok-soft);color:var(--ok)}
.alt-not{margin-top:18px;color:var(--t-3);font-size:12px;text-align:center}
[hidden]{display:none!important}

/* uygulama çerçevesi */
#uygulama{position:fixed;inset:0;width:100%;height:100%;border:0;background:var(--bg-0)}
#serit{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:5;background:var(--warn-soft);
  border:1px solid var(--warn);color:var(--warn);border-radius:var(--r);padding:8px 12px;font-size:13px;backdrop-filter:blur(6px)}

/* yönetim */
.ust{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line);background:var(--bg-0);position:sticky;top:0;z-index:2;flex-wrap:wrap}
.ust .bosluk{flex:1}
.ust .kim{color:var(--t-3);font-size:12.5px}
main{max-width:1200px;margin:0 auto;padding:20px 16px 60px}
.panel{background:var(--bg-1);border:1px solid var(--line);border-radius:10px;padding:16px;margin-bottom:18px}
.panel h2{font-size:14px;font-weight:600;margin-bottom:12px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.panel h2 .say{color:var(--t-3);font-weight:400;font-size:12.5px}
.arac{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.arac input,.arac select{width:auto;min-width:0;flex:1 1 180px;padding:7px 9px;font-size:13px}
.tablo-kap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;color:var(--t-3);font-weight:500;font-size:12px;padding:8px;border-bottom:1px solid var(--line-2);white-space:nowrap}
td{padding:8px;border-bottom:1px solid var(--line);vertical-align:middle}
td input,td select{padding:5px 7px;font-size:13px}
td .eposta{font-weight:500}
td .ufak{color:var(--t-3);font-size:12px}
.rozet{display:inline-block;padding:2px 8px;border-radius:99px;font-size:11.5px;font-weight:500;white-space:nowrap}
.rozet.ok{background:var(--ok-soft);color:var(--ok)}
.rozet.bekliyor{background:var(--warn-soft);color:var(--warn)}
.rozet.bitti{background:var(--danger-soft);color:var(--danger)}
.rozet.yonetici{background:var(--accent-soft);color:var(--accent-2)}
.dosyalar{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.dosya{background:var(--bg-2);border:1px solid var(--line);border-radius:8px;padding:12px}
.dosya b{display:block;margin-bottom:4px}
.dosya .ufak{color:var(--t-3);font-size:12px;margin-bottom:10px;display:block}
.dosya input[type=file]{font-size:12px;padding:6px}
/* tek oturum perdesi — programın üstünü örter */
#oturum_perde{position:fixed;inset:0;z-index:20;background:rgba(10,12,15,.92);backdrop-filter:blur(4px)}

/* yönetim: kullanıcının program izinleri (satırın altı) */
tr.prog-satir td{padding-top:0;border-bottom:1px solid var(--line-2)}
tbody tr:not(.prog-satir) td{border-bottom:0}
button.prog{--pr:var(--accent);background:transparent;border:1px solid var(--line-2);color:var(--t-3);border-radius:99px;
  padding:3px 10px;margin:3px 4px 3px 0;font:inherit;font-size:12px;cursor:pointer}
button.prog:hover{color:var(--t-1);border-color:var(--line-3)}
button.prog.acik{color:var(--pr);border-color:var(--pr);background:color-mix(in srgb,var(--pr) 14%,transparent)}
button.prog.acik::before{content:'✓ '}

/* yöneticinin ana sayfası */
.ana-baslik{font-size:13px;font-weight:600;color:var(--t-2);text-transform:uppercase;letter-spacing:.6px;margin:8px 0 12px}
.kartlar{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin-bottom:28px}
.pkart{display:flex;flex-direction:column;gap:6px;background:var(--bg-1);border:1px solid var(--line-2);border-radius:12px;
  padding:18px;color:var(--t-1);text-decoration:none;transition:border-color .15s,background .15s}
a.pkart:hover,.pkart:hover{border-color:var(--accent-line);background:var(--bg-2)}
.pkart b{font-size:15px}
.pkart .ufak{color:var(--t-3);font-size:12.5px;line-height:1.5}
.pkart{--pr:var(--accent)}
.pkart-ikon{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;margin-bottom:6px;
  color:var(--pr);background:color-mix(in srgb,var(--pr) 16%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--pr) 35%,transparent);transition:transform .25s}
.pkart-ikon svg{width:24px;height:24px}
.pkart-ikon svg circle.n{fill:currentColor;stroke:none}
.pkart:hover .pkart-ikon{transform:scale(1.06) rotate(-3deg)}
.pkart:hover{border-color:color-mix(in srgb,var(--pr) 55%,transparent)}
.pkart-dugmeler .dugme:not(.ikincil){background:var(--pr);color:#0d1014}
.pkart-ikon.yonetim{--pr:var(--t-2)}
.pkart-dugmeler{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.pkart-dugmeler .dugme{text-decoration:none}
@media (max-width:640px){ .kart{padding:22px 16px} }

/* ===== GİRİŞ EKRANI ARKA PLANI (giris-arka-plan.html) — yalnız giriş ekranında görünür ===== */
/* ===================== ARKA PLAN (kopyalanacak blok) ===================== */
#kozmik-bg{
  position:fixed; inset:0; width:100%; height:100%;
  display:block; z-index:0; pointer-events:none;
  background:
    radial-gradient(120% 70% at 50% 115%, rgba(30,52,150,.28) 0%, transparent 60%),
    radial-gradient(55% 45% at 82% 18%, rgba(110,70,230,.12) 0%, transparent 70%),
    #03040c;
}
/* WebGL yoksa: hafif statik yıldız deseni */
#kozmik-bg.kozmik-yedek{
  background:
    radial-gradient(1.5px 1.5px at 12% 18%, #dbe9ff 50%, transparent 51%),
    radial-gradient(1px 1px at 27% 62%, #b9d2ff 50%, transparent 51%),
    radial-gradient(2px 2px at 38% 28%, #8fb4ff 50%, transparent 51%),
    radial-gradient(1px 1px at 46% 84%, #dbe9ff 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 58% 12%, #ffffff 50%, transparent 51%),
    radial-gradient(1px 1px at 66% 47%, #b9d2ff 50%, transparent 51%),
    radial-gradient(2.5px 2.5px at 74% 71%, #6d9bff 50%, transparent 51%),
    radial-gradient(1px 1px at 83% 33%, #dbe9ff 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 91% 88%, #ffffff 50%, transparent 51%),
    radial-gradient(1px 1px at 6% 76%, #b9d2ff 50%, transparent 51%),
    radial-gradient(1px 1px at 19% 41%, #ffffff 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 53% 56%, #9cc0ff 50%, transparent 51%),
    radial-gradient(60px 60px at 70% 70%, rgba(60,110,255,.35), transparent 70%),
    radial-gradient(48% 48% at 50% 50%, rgba(70,110,255,.16), transparent 70%),
    radial-gradient(120% 70% at 50% 115%, rgba(30,52,150,.28) 0%, transparent 60%),
    #03040c;
}
/* Yazı okunurluğu için çok hafif karartma perdesi (istemezseniz silin) */
.kozmik-perde{
  position:fixed; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(to bottom, rgba(3,4,12,.55) 0%, rgba(3,4,12,0) 18%, rgba(3,4,12,0) 80%, rgba(3,4,12,.55) 100%),
    radial-gradient(42% 30% at 50% 50%, rgba(3,4,12,.28) 0%, rgba(3,4,12,0) 100%);
}
/* ===================== /ARKA PLAN ===================== */
#kozmik-bg[hidden],.kozmik-perde[hidden]{display:none}
#giris_sahne{position:relative;z-index:2}
#giris_sahne .kart{background:rgba(12,15,24,.42);border-color:rgba(214,226,255,.14);-webkit-backdrop-filter:blur(8px) saturate(1.2);backdrop-filter:blur(8px) saturate(1.2);box-shadow:0 24px 80px rgba(0,0,0,.35)}
#giris_sahne input{background:rgba(8,10,16,.55)}
/* geniş ekranda kart sola: animasyonların çoğu ekranın ortasında döner */
@media (min-width:900px){#giris_sahne{justify-content:flex-start;padding-left:clamp(32px,7vw,120px)}}
/* marka: ALTINAY — arka plandaki renk halkası işareti */
.marka{letter-spacing:.16em;font-weight:600}
.marka .alt{letter-spacing:0}
.marka .isaret{border-radius:50%;background:radial-gradient(circle at 50% 50%,var(--bg-0) 0 42%,transparent 43%),conic-gradient(from 210deg,#ff4f7a,#8a5cff,#2f6bff,#55d4ff,#2f6bff,#ff4f7a);box-shadow:0 0 14px rgba(70,120,255,.55)}

/* ================= EFEKT KATMANI — AHU Studio'nun aynısı, sitenin bütününde (efekt.js) ================= */
:root{--isik:rgba(255,255,255,.05);--border-hi:var(--line-3);--accent-ring:var(--accent-line);--shadow-pop:0 16px 44px -12px rgba(0,0,0,.6)}
/* üst çubukta dolaşan ışık çizgisi */
.ust{position:sticky}
.ust::after{content:'';position:absolute;bottom:0;left:0;width:34%;height:1px;pointer-events:none;opacity:.85;will-change:transform;
  background:linear-gradient(90deg,transparent,var(--accent),transparent);animation:efektSweep 8s cubic-bezier(.16,1,.3,1) infinite}
@keyframes efektSweep{0%{transform:translateX(-120%)}55%,100%{transform:translateX(194%)}}
/* kartlar: imleci izleyen ışık + üzerine gelince kalkma */
.pkart,.panel,#giris_sahne .kart{position:relative}
.pkart::after,.panel::after,#giris_sahne .kart::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;opacity:0;transition:opacity .3s;
  background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),var(--isik),transparent 62%)}
.pkart:hover::after,.panel:hover::after,#giris_sahne .kart:hover::after{opacity:1}
.pkart>*,.panel>*,#giris_sahne .kart>*{position:relative;z-index:1}
.pkart{transition:border-color .2s,box-shadow .2s,transform .18s cubic-bezier(.16,1,.3,1),background .15s}
.pkart:hover{transform:translateY(-2px);box-shadow:var(--shadow-pop)}
.panel{transition:border-color .2s,box-shadow .2s}
.panel:hover{border-color:var(--border-hi);box-shadow:var(--shadow-pop)}
/* sırayla içeri girme */
@keyframes efektPanelIn{from{opacity:0;transform:translateY(12px) scale(.994)}to{opacity:1;transform:none}}
.efekt-gir{animation:efektPanelIn .46s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--i,0) * 55ms);will-change:transform,opacity}
/* düğmeler */
.dugme{transition:transform .12s ease,filter .15s ease,box-shadow .2s ease,background .15s}
.dugme:not(.ikincil){box-shadow:0 2px 10px -3px var(--accent-ring)}
.dugme:hover{transform:translateY(-1px)}
.dugme:not(.ikincil):hover{box-shadow:0 7px 20px -7px var(--accent-ring)}
.dugme:active{transform:scale(.97)}
.sekmeler button{transition:color .16s,background .16s,transform .12s}
tbody tr,tbody tr td{transition:background .14s}
/* geçiş: ışık süpürmesi */
#efekt-beam{position:fixed;inset:0;z-index:250;pointer-events:none;will-change:transform;
  background:linear-gradient(104deg,transparent 38%,var(--accent-soft) 47%,var(--isik) 50%,var(--accent-soft) 53%,transparent 62%);
  animation:efektBeam 1.15s cubic-bezier(.32,0,.24,1) both}
@keyframes efektBeam{from{transform:translate3d(-115%,0,0)}to{transform:translate3d(115%,0,0)}}
/* açılış: ışık üçgeni perdesi — içerik hazır olana dek kalkmaz (.bitti ile solar) */
#efekt-perde{position:fixed;inset:0;z-index:300;display:grid;place-items:center;pointer-events:none;
  background:radial-gradient(64% 50% at 50% 45%,var(--bg-2) 0%,var(--bg-0) 46%,var(--bg-0) 100%)}
#efekt-perde.bitti{animation:efektPerdeOut .6s cubic-bezier(.16,1,.3,1) both}
#efekt-perde .tri{position:relative;width:0;height:0;--u:50px;--v:43px;--d:26px;color:var(--t-1)}
#efekt-perde.oyna .tri{animation:efektTriIn 1.2s cubic-bezier(.16,1,.3,1) both}
#efekt-perde.bitti .tri{animation:efektTriOut .6s cubic-bezier(.16,1,.3,1) both}
#efekt-perde i{position:absolute;width:var(--d);height:var(--d);border-radius:50%;background:currentColor;
  left:calc(var(--x) * var(--u) - var(--d)/2);top:calc((var(--y) - 1.5) * var(--v) - var(--d)/2);
  opacity:0;transform:scale(.35);will-change:transform,opacity,filter}
#efekt-perde.oyna i{animation:efektDotIn .48s cubic-bezier(.16,1,.3,1) both,efektDotGlow 2.4s ease-in-out infinite,efektEdgeRun .46s ease-out forwards;
  animation-delay:calc(var(--i) * 38ms),calc(460ms + var(--i) * 38ms),calc(880ms + var(--p) * 50ms)}
#efekt-perde i::before,#efekt-perde i::after{content:'';position:absolute;left:50%;top:50%;border-radius:50%;background:currentColor;transform:translate(-50%,-50%);pointer-events:none}
#efekt-perde i::before{width:205%;height:205%;filter:blur(6px);opacity:.30}
#efekt-perde i::after{width:470%;height:470%;filter:blur(21px);opacity:.062}
@keyframes efektDotIn{to{opacity:1;transform:none}}
@keyframes efektDotGlow{0%,100%{opacity:.82}50%{opacity:1}}
@keyframes efektEdgeRun{0%{transform:scale(1);filter:brightness(1)}30%{transform:scale(1.72);filter:brightness(2.6) drop-shadow(0 0 26px var(--accent-ring))}100%{transform:scale(1);filter:brightness(1)}}
@keyframes efektTriIn{from{transform:scale(.88)}to{transform:scale(1)}}
@keyframes efektTriOut{to{transform:scale(1.3);opacity:0;filter:blur(7px)}}
@keyframes efektPerdeOut{to{opacity:0;visibility:hidden}}
@media (prefers-reduced-motion:reduce){#efekt-perde,#efekt-beam{display:none}.efekt-gir,.ust::after{animation:none}}

/* Ana sayfa da kozmik arka planın üstünde: kartlar ve üst çubuk yarı saydam + buzlu cam */
#ana_sayfa{position:relative;z-index:2;min-height:100vh}
#ana_sayfa .ust{background:rgba(9,11,18,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom-color:rgba(214,226,255,.1)}
#ana_sayfa .pkart{background:rgba(14,17,26,.74);border-color:rgba(214,226,255,.13);-webkit-backdrop-filter:blur(10px) saturate(1.2);backdrop-filter:blur(10px) saturate(1.2)}
#ana_sayfa .pkart:hover{background:rgba(20,24,36,.72)}
#ana_sayfa .ana-baslik{color:rgba(214,226,255,.75);text-shadow:0 1px 12px rgba(3,4,12,.8)}

/* İŞLENİYOR GÖSTERGESİ (bekleme.js) — sunucu işi 1 sn'yi geçince ortada çıkar */
#isleniyor{position:fixed;inset:0;z-index:260;display:grid;place-items:center;pointer-events:none;
  background:rgba(6,8,14,.28);animation:islGir .18s ease-out both}
#isleniyor[hidden]{display:none}
#isleniyor .isl-kart{display:flex;align-items:center;gap:14px;min-width:280px;max-width:min(92vw,420px);
  padding:16px 18px;border-radius:14px;background:rgba(16,19,26,.92);border:1px solid var(--line-2);
  box-shadow:0 24px 70px rgba(0,0,0,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
#isleniyor b{display:block;font-size:14px;font-weight:600;color:var(--t-1)}
#isleniyor span{display:block;font-size:12.5px;color:var(--t-3);margin-top:2px}
#isleniyor em{margin-left:auto;font-style:normal;font-size:12px;color:var(--t-3);font-variant-numeric:tabular-nums}
#isleniyor .isl-donen{width:26px;height:26px;flex:none;border-radius:50%;
  background:conic-gradient(from 0deg,transparent 0 25%,var(--accent) 60%,#55d4ff 100%);
  -webkit-mask:radial-gradient(circle,transparent 55%,#000 57%);mask:radial-gradient(circle,transparent 55%,#000 57%);
  animation:islDon .8s linear infinite}
@keyframes islDon{to{transform:rotate(360deg)}}
@keyframes islGir{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){#isleniyor .isl-donen{animation-duration:2.4s}}

/* Robot koruması kutusu (Turnstile) — giriş formunda düğmenin üstünde */
.captcha{margin-top:14px;min-height:0}
.captcha:empty{display:none}

/* Ana sayfa: kartın tamamı tıklanır (Aç düğmesi yok) */
a.pkart-tik{cursor:pointer;color:inherit;text-decoration:none}
a.pkart-tik:focus-visible{outline:2px solid var(--pr);outline-offset:3px}
a.pkart-tik:active{transform:translateY(0) scale(.99)}
.pkart-surum{position:absolute;top:14px;right:14px;z-index:2;font-size:11.5px;color:var(--t-3);padding:3px 9px;border-radius:99px;
  border:1px solid var(--line-2);background:rgba(8,10,16,.4);transition:color .15s,border-color .15s}
.pkart-surum:hover,.pkart-surum:focus-visible{color:var(--t-1);border-color:var(--pr);outline:none}
