/* Giriş sayfası (/login) stilleri */

/* =========================================================
   LOADING — Ana site preloader'ı ile aynı
   ========================================================= */
.loading{
  position:fixed;inset:0;z-index:900;
  background:var(--bg);
  display:grid;place-items:center;
  transition:opacity .7s ease, visibility .7s ease;
}
.loading.off{opacity:0;visibility:hidden;pointer-events:none}
.loading-inner{text-align:center;display:grid;gap:24px;justify-items:center}
.loading-mark{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:120px;color:var(--gold);line-height:1;
  letter-spacing:-.04em;text-shadow:0 0 60px var(--gold-glow);
  animation:preMark 1.6s cubic-bezier(.2,.7,.2,1) both;
}
.loading-bar{width:220px;height:1px;background:var(--ln);position:relative;overflow:hidden;border-radius:2px}
.loading-bar span{position:absolute;left:0;top:0;height:100%;width:0;background:linear-gradient(90deg,transparent,var(--gold),transparent);transition:width .15s linear}
.loading-text{font-size:10.5px;letter-spacing:.5em;text-transform:uppercase;color:var(--mut);font-weight:700}
.login-bg{
  position:absolute;inset:-20%;z-index:0;
  background:
    radial-gradient(circle at 25% 25%, var(--gold-soft), transparent 45%),
    radial-gradient(circle at 75% 70%, rgba(120,90,40,.10), transparent 50%),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.015), transparent 60%);
  animation:bgDrift 30s ease-in-out infinite alternate;
}
.login-orb{position:absolute;border-radius:50%;filter:blur(120px);pointer-events:none;z-index:1}
.login-orb-1{width:520px;height:520px;background:radial-gradient(circle,var(--gold-glow),transparent 70%);top:-140px;right:-140px;animation:orbFloat1 22s ease-in-out infinite alternate;opacity:.5}
.login-orb-2{width:400px;height:400px;background:radial-gradient(circle,rgba(138,111,58,.4),transparent 70%);bottom:-120px;left:-100px;animation:orbFloat2 28s ease-in-out infinite alternate;opacity:.45}
.lbox{
  width:100%;max-width:440px;
  background:linear-gradient(180deg, rgba(20,20,26,.85), rgba(10,10,14,.95));
  border:1px solid rgba(201,169,107,.15);
  backdrop-filter:blur(24px) saturate(140%);
  -webkit-backdrop-filter:blur(24px) saturate(140%);
  padding:52px 44px 44px;
  display:grid;gap:18px;border-radius:24px;
  position:relative;z-index:2;text-align:center;
  box-shadow:0 50px 120px -30px rgba(0,0,0,.95),0 0 0 1px rgba(201,169,107,.06),inset 0 1px 0 rgba(255,255,255,.05);
  animation:loginPop .7s cubic-bezier(.2,.7,.2,1);
  overflow:hidden;
}
.lbox::before{content:"";position:absolute;top:0;left:20%;right:20%;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:.7}
.lbox-shine{position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(201,169,107,.06),transparent);transform:skewX(-20deg);animation:shine 8s ease-in-out infinite;pointer-events:none}
.lbox-icon{
  width:88px;height:88px;margin:0 auto 8px;
  position:relative;display:grid;place-items:center;
  animation:iconEnter 1s cubic-bezier(.2,.7,.2,1) .2s both;
}
.lbox-icon::after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,var(--gold-soft),transparent 65%);z-index:-1;animation:iconPulse 3.2s ease-in-out infinite}
.lbox-icon svg{width:100%;height:100%;filter:drop-shadow(0 0 22px var(--gold-glow));animation:spin 12s linear infinite}
.lbox-brand{font-size:11px;letter-spacing:.55em;color:var(--mut);text-transform:uppercase;font-weight:700;margin-top:4px;animation:slideDown .7s ease .4s both}
.lbox h1{font-family:"Cormorant Garamond",Georgia,"Times New Roman",serif;font-size:36px;font-weight:400;letter-spacing:-.01em;color:var(--tx);margin-top:6px;line-height:1.1;animation:slideDown .7s ease .5s both}
.lbox-sub{font-size:12.5px;color:var(--mut);letter-spacing:.02em;margin-bottom:16px;animation:slideDown .7s ease .6s both}
.lfld{display:grid;gap:8px;text-align:left;animation:slideDown .7s ease .7s both}
.lfld:nth-of-type(2){animation-delay:.8s}
.lfld>span{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--mut);font-weight:600}
.input-wrap{position:relative}
.input-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--mut);pointer-events:none;transition:color .25s}
.input-wrap input{background:rgba(255,255,255,.03);border:1px solid var(--ln);padding:16px 16px 16px 46px;border-radius:12px;font-size:14px}
.input-wrap input:focus{border-color:var(--gold);background:rgba(201,169,107,.04);box-shadow:0 0 0 4px var(--gold-soft)}
.input-wrap input:focus + .input-icon,
.input-wrap:focus-within .input-icon{color:var(--gold)}
.toggle-pw{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:none;border:0;color:var(--mut);cursor:pointer;padding:6px;border-radius:8px;transition:.2s;display:grid;place-items:center}
.toggle-pw svg{width:18px;height:18px}
.toggle-pw:hover{color:var(--gold);background:var(--gold-soft)}
#lbtn{margin-top:8px;animation:slideDown .7s ease .9s both}
#lbtn.busy{pointer-events:none}
#lbtn.busy .btn-text::after{content:"";display:inline-block;width:12px;height:12px;margin-left:10px;vertical-align:middle;border:2px solid rgba(26,20,8,.3);border-top-color:#1a1408;border-radius:50%;animation:spin .8s linear infinite}
.login-foot{position:absolute;bottom:calc(28px + env(safe-area-inset-bottom,0px));left:0;right:0;text-align:center;font-size:10.5px;letter-spacing:.32em;color:var(--mut);opacity:.5;text-transform:uppercase;font-weight:600;z-index:2}
@media(max-width:768px) {
  .lbox{padding:40px 28px 34px;border-radius:20px}
  .lbox-icon{width:72px;height:72px}
  .lbox h1{font-size:28px}
  .login-orb-1{width:340px;height:340px}
  .login-orb-2{width:260px;height:260px}
}
@media(max-width:480px) {
  .lbox{padding:36px 22px 28px}
  .loading-mark{font-size:80px}
  .loading-bar{width:180px}
}