/*
* Eres Guard — markalı giriş ekranı (Eres Medya tasarım dili).
* YALNIZ WordPress login sayfasına (body.login.eres-guard-login) scope'lu.
* Login mantığını DEĞİŞTİRMEZ; yalnız görünüm. Harici kütüphane yok.
* Admin ayarları (logo/bg/buton) --egl-* değişkenleriyle ezilebilir.
*/
body.login.eres-guard-login {
--egl-bg1: #f6f8fb; --egl-bg2: #eef2f8;
--egl-card: #ffffff; --egl-border: #e5eaf2; --egl-border-2: #d6dae1;
--egl-text: #1b2942; --egl-muted: #5a6b87; --egl-subtle: #8a97ad;
--egl-primary: #3867e8; --egl-primary-700: #2750c9; --egl-primary-soft: #eef3fe;
--egl-danger: #d23f57; --egl-danger-soft: #fdeef1; --egl-danger-bd: #f3c9d2;
--egl-warn: #c77700; --egl-warn-soft: #fff5e2; --egl-warn-bd: #f3dca6;
--egl-radius: 16px; --egl-radius-sm: 10px;
--egl-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, system-ui, sans-serif;
background: linear-gradient(160deg, var(--egl-bg1) 0%, var(--egl-bg2) 100%) !important;
min-height: 100vh; margin: 0;
/* Dikey (column) yığın: #login kartı + .language-switcher ALT ALTA
ve yatayda ortalı. Eski row düzeni kartı sola, dil seçiciyi
kopuk ortaya itiyordu. */
display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0;
font-family: var(--egl-font);
}
body.login.eres-guard-login::before { content: none; }
/* WP varsayılan kabuğu (logo h1 + dar kutu) gizle/yeniden kur */
body.login.eres-guard-login #login {
width: 100%; max-width: 360px; margin: 0; padding: 34px 44px 30px;
background: var(--egl-card); border: 1px solid var(--egl-border);
border-radius: var(--egl-radius); box-shadow: 0 18px 50px -12px rgba(20,33,61,.16);
}
body.login.eres-guard-login #login h1 { display: none; }
/* Markalı üst alan */
.eres-guard-login__brand { text-align: center; margin: 0 0 22px; }
.eres-guard-login__logo {
width: 58px; height: 58px; margin: 0 auto 14px; border-radius: 16px;
display: flex; align-items: center; justify-content: center;
background: linear-gradient(135deg, var(--egl-primary), #5b85f5); color: #fff;
box-shadow: 0 8px 20px -6px rgba(56,103,232,.5); background-size: cover; background-position: center;
}
.eres-guard-login__logo .dashicons { font-size: 30px; width: 30px; height: 30px; }
.eres-guard-login__logo--img { background-image: var(--egl-logo); }
.eres-guard-login__logo--img .dashicons { display: none; }
.eres-guard-login__title { font-size: 21px; font-weight: 800; color: var(--egl-text); margin: 0 0 3px; letter-spacing: -.01em; }
.eres-guard-login__sub { font-size: 13px; color: var(--egl-muted); margin: 0; }
.eres-guard-login__ver { font-size: 11px; color: var(--egl-subtle); margin: 8px 0 0; }
/* Bilgi / uyarı kartları (recovery, captcha, throttle, hata, mesaj) */
body.login.eres-guard-login #login .message,
body.login.eres-guard-login #login_error,
body.login.eres-guard-login #login .notice,
.eres-guard-login__notice {
border: 1px solid var(--egl-border); background: var(--egl-card);
border-radius: var(--egl-radius-sm); box-shadow: none; padding: 12px 14px;
margin: 0 0 16px; font-size: 13px; color: var(--egl-text);
border-left: 4px solid var(--egl-primary);
}
body.login.eres-guard-login #login_error {
border-left-color: var(--egl-danger); background: var(--egl-danger-soft);
border-color: var(--egl-danger-bd); color: #93203a;
}
.eres-guard-login__notice--warn {
border-left-color: var(--egl-warn) !important; background: var(--egl-warn-soft) !important;
border-color: var(--egl-warn-bd) !important; color: #7a4d05 !important;
}
.eres-guard-login__notice strong { display: block; margin-bottom: 2px; }
.eres-guard-login__notice code { background: rgba(20,33,61,.07); padding: 1px 6px; border-radius: 5px; }
/* Form */
body.login.eres-guard-login #loginform {
border: 0; background: transparent; box-shadow: none; padding: 0; margin: 0;
}
/* WP 6.x: kullanıcı adı , parola
→
ikisine de eşit alt boşluk (aralarında mesafe oluşsun). */
body.login.eres-guard-login #loginform > p,
body.login.eres-guard-login #loginform .user-pass-wrap { margin: 0 0 18px; }
body.login.eres-guard-login #loginform label {
display: block; font-size: 13px; font-weight: 700; color: var(--egl-text);
}
body.login.eres-guard-login #loginform input[type=text],
body.login.eres-guard-login #loginform input[type=password],
body.login.eres-guard-login #loginform input[type=email] {
width: 100%; height: 42px; padding: 8px 13px; font-size: 14px;
border: 1px solid var(--egl-border-2); border-radius: var(--egl-radius-sm);
background: #fff; color: var(--egl-text); box-shadow: none; margin: 0; line-height: 1.3;
}
body.login.eres-guard-login #loginform input:focus {
border-color: var(--egl-primary); box-shadow: 0 0 0 3px var(--egl-primary-soft); outline: none;
}
/* Şifre göster/gizle (WP core .wp-pwd) dikey merkez + rafine sağ padding.
.wp-pwd FLEX: blok line-box'ın inline descender boşluğunu
kaldırır → kutu yüksekliği = input → absolute butonun top:50% merkezi
input'un GERÇEK dikey merkezine oturur (eski display:block'ta birkaç px
aşağı kayıyordu). */
body.login.eres-guard-login .wp-pwd { position: relative; display: flex; align-items: center; }
body.login.eres-guard-login .wp-pwd input { padding-right: 44px; width: 100%; }
body.login.eres-guard-login .wp-pwd .button.wp-hide-pw {
position: absolute; right: 5px; top: 40%; transform: translateY(-50%);
background: transparent; border: 0; box-shadow: none; color: var(--egl-subtle);
height: 32px; width: 32px; padding: 0; min-height: 0; line-height: 1;
display: flex; align-items: center; justify-content: center; margin: 0;
}
body.login.eres-guard-login .wp-pwd .button.wp-hide-pw .dashicons { font-size: 18px; width: 18px; height: 18px; }
body.login.eres-guard-login .wp-pwd .button.wp-hide-pw:hover { color: var(--egl-primary); }
/* Beni hatırla — modern özel checkbox + dikey hizalı metin */
body.login.eres-guard-login .forgetmenot {
display: flex; align-items: center; gap: 10px; font-size: 13px;
color: var(--egl-muted); margin: 0 0 18px;
}
body.login.eres-guard-login .forgetmenot label {
margin: 0; font-weight: 500; color: var(--egl-muted);
line-height: 18px; cursor: pointer;
}
body.login.eres-guard-login .forgetmenot input[type=checkbox] {
appearance: none; -webkit-appearance: none; -moz-appearance: none;
width: 18px; height: 18px; margin: 0; flex: 0 0 auto; position: relative;
border: 1px solid var(--egl-border-2); border-radius: 5px; background: #fff;
cursor: pointer; transition: background .12s ease, border-color .12s ease;
}
body.login.eres-guard-login .forgetmenot input[type=checkbox]:hover { border-color: var(--egl-primary); }
body.login.eres-guard-login .forgetmenot input[type=checkbox]:checked {
background: var(--egl-primary); border-color: var(--egl-primary);
}
body.login.eres-guard-login .forgetmenot input[type=checkbox]:checked::after {
content: ""; position: absolute; left: 5px; top: 1px;
width: 5px; height: 10px; border: solid #fff; border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
body.login.eres-guard-login .forgetmenot input[type=checkbox]:focus-visible {
outline: 2px solid var(--egl-primary); outline-offset: 2px;
}
/* Captcha widget aralığı (FormGuard enjekte eder) */
body.login.eres-guard-login .cf-turnstile,
body.login.eres-guard-login .g-recaptcha { margin: 0 0 16px !important; }
/* CTA buton */
body.login.eres-guard-login #wp-submit,
body.login.eres-guard-login .submit .button-primary {
width: 100%; float: none; height: 46px; font-size: 14.5px; font-weight: 700;
background: var(--egl-primary); border: 0; border-radius: var(--egl-radius-sm);
color: #fff; box-shadow: 0 8px 18px -8px rgba(56,103,232,.6); cursor: pointer;
text-shadow: none; transition: background .15s ease;
}
body.login.eres-guard-login #wp-submit:hover { background: var(--egl-primary-700); }
body.login.eres-guard-login #wp-submit:active { transform: translateY(1px); }
body.login.eres-guard-login .submit { text-align: center; }
/* Alt linkler — dengeli aralık */
body.login.eres-guard-login #nav,
body.login.eres-guard-login #backtoblog {
text-align: center; padding: 0; font-size: 13px; text-shadow: none;
}
body.login.eres-guard-login #nav {
border-top: 1px solid var(--egl-border); margin: 20px 0 0; padding-top: 16px;
}
body.login.eres-guard-login #backtoblog { margin: 10px 0 0; }
body.login.eres-guard-login #nav a,
body.login.eres-guard-login #backtoblog a { color: var(--egl-muted); }
body.login.eres-guard-login #nav a:hover,
body.login.eres-guard-login #backtoblog a:hover { color: var(--egl-primary); }
body.login.eres-guard-login #backtoblog a { color: var(--egl-subtle); }
/* Dil değiştirici: kartın ALTINDA, kart genişliğiyle hizalı, sade
secondary alan (kopuk WP default değil; auth yığınının parçası). */
body.login.eres-guard-login .language-switcher {
width: 100%; max-width: 360px; margin: 10px auto 0; padding: 0;
display: flex; align-items: center; justify-content: center; gap: 8px;
opacity: .9;
}
body.login.eres-guard-login .language-switcher form,
body.login.eres-guard-login #language-switcher {
display: flex; align-items: center; justify-content: center; gap: 8px;
margin: 0; width: 100%;
}
body.login.eres-guard-login .language-switcher label { font-size: 12px; color: var(--egl-subtle); margin: 0; }
body.login.eres-guard-login .language-switcher select {
border: 1px solid var(--egl-border-2); border-radius: var(--egl-radius-sm);
padding: 7px 12px; font-size: 13px; color: var(--egl-text); background: #fff;
max-width: 200px;
}
body.login.eres-guard-login .language-switcher select:focus {
border-color: var(--egl-primary); box-shadow: 0 0 0 3px var(--egl-primary-soft); outline: none;
}
body.login.eres-guard-login .language-switcher .button {
background: transparent; border: 0; box-shadow: none; color: var(--egl-muted);
font-size: 13px; padding: 6px 10px; cursor: pointer; height: auto; min-height: 0;
}
body.login.eres-guard-login .language-switcher .button:hover { color: var(--egl-primary); }
/* Form altı markalı footer (login_footer; kozmetik, kart yığınıyla hizalı) */
body.login.eres-guard-login .eres-guard-login__footer {
width: 100%; max-width: 360px; margin: 14px auto 0; padding: 0;
text-align: center; font-size: 11px; line-height: 1.5;
color: var(--egl-subtle); letter-spacing: .01em;
}
body.login.eres-guard-login .eres-guard-login__footer .sep {
margin: 0 7px; color: var(--egl-border-2);
}
/* Responsive */
@media (max-width: 520px) {
body.login.eres-guard-login { padding: 24px 0; }
body.login.eres-guard-login #login {
max-width: none; width: auto; margin: 0 22px;
padding: 28px 22px 24px; border-radius: 14px;
}
body.login.eres-guard-login .language-switcher {
max-width: none; width: auto; margin: 10px 22px 0; flex-wrap: wrap;
}
body.login.eres-guard-login .eres-guard-login__footer {
max-width: none; width: auto; margin: 14px 22px 0;
}
body.login.eres-guard-login .language-switcher select { max-width: 100%; }
}