/* 로그인 화면 (mu-plugin dojo-login-page.php): 첫 화면의 "찾아오기"처럼 왼쪽에 門, 오른쪽에 로그인 양식.
   양식은 코스모스팜 회원관리(skin three)의 것을 그대로 두고 색·글꼴·모서리만 첫 화면에 맞춘다.
   코스모스팜 선택자(.cosmosfarm-members-form.signin-form …)보다 강하게 body.dojo-login 을 앞에 붙인다 */

.dl {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: clamp(24px, 6vw, 120px);
  align-items: center;
  max-width: var(--max);
  min-height: calc(100svh - 120px);
  margin: 0 auto;
  padding: 120px var(--gutter) 12vh;
}
.dl__kanji {
  margin: 0;
  justify-self: center;
  font-family: var(--mincho);
  font-size: clamp(9rem, 22vw, 18rem);
  line-height: 1;
  color: var(--kin);
  opacity: .9;
}
.dl__form { justify-self: start; width: 100%; max-width: 440px; min-width: 0; }

body.dojo-login .cosmosfarm-members-form.signin-form {
  max-width: none;
  margin: 0;
  font-family: var(--serif-kr);
  color: var(--kinu);
}
body.dojo-login .cosmosfarm-members-form.signin-form .login-card {
  padding: clamp(28px, 4vw, 44px);
  background: #111722;
  border: 1px solid var(--rule);
  border-radius: 0;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .45);
}
body.dojo-login .cosmosfarm-members-form.signin-form .login-header { text-align: left; margin-bottom: 28px; }
body.dojo-login .cosmosfarm-members-form.signin-form .login-header h2 {
  font-family: var(--serif-kr);
  font-size: clamp(1.4rem, 1vw + 1rem, 1.7rem);
  font-weight: 700;
  letter-spacing: .08em;
  color: var(--kinu);
}
body.dojo-login .cosmosfarm-members-form.signin-form .login-subtitle { font-size: .92rem; color: var(--haze); }

body.dojo-login .cosmosfarm-members-form.signin-form .form-control {
  height: 50px;
  padding: 0 14px;
  border: 1px solid var(--rule);
  border-radius: 0;
  background: rgba(0, 0, 0, .25);
  color: var(--kinu);
  font-family: var(--serif-kr);
  font-size: 1rem;
}
body.dojo-login .cosmosfarm-members-form.signin-form .form-control::placeholder { color: var(--haze); opacity: .8; }
body.dojo-login .cosmosfarm-members-form.signin-form .form-control:focus {
  border-color: var(--kin);
  background: rgba(0, 0, 0, .35);
  box-shadow: none;
  outline: 1px solid var(--kin);
  outline-offset: 0;
}
/* 브라우저 자동완성이 칸을 흰색으로 칠하지 않게 */
body.dojo-login .cosmosfarm-members-form.signin-form .form-control:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #0b0f16 inset;
  -webkit-text-fill-color: var(--kinu);
  caret-color: var(--kinu);
}

body.dojo-login .cosmosfarm-members-form.signin-form .form-actions { font-size: .9rem; }
body.dojo-login .cosmosfarm-members-form.signin-form .remember-me { color: var(--kinu); font-size: .9rem; }
body.dojo-login .cosmosfarm-members-form.signin-form .remember-me input { accent-color: var(--kin); }
body.dojo-login .cosmosfarm-members-form.signin-form .forgot-password { color: var(--haze); font-size: .85rem; }
body.dojo-login .cosmosfarm-members-form.signin-form .forgot-password:hover { color: var(--kin); }

body.dojo-login .cosmosfarm-members-form.signin-form .btn-submit {
  height: 52px;
  border: 1px solid var(--kin);
  border-radius: 0;
  background: var(--kin);
  background-color: var(--kin) !important;   /* 코스모스팜이 파란색을 !important로 박아 두었다 */
  color: var(--ai);
  font-family: var(--serif-kr);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: .3em;
  box-shadow: none;
}
body.dojo-login .cosmosfarm-members-form.signin-form .btn-submit:hover,
body.dojo-login .cosmosfarm-members-form.signin-form .btn-submit:focus {
  background-color: #cdb27a !important;
  color: var(--ai);
  border: 1px solid var(--kin);
  transform: none;
  box-shadow: none;
}
body.dojo-login .cosmosfarm-members-form.signin-form .btn-submit:focus-visible { outline: 2px solid var(--kinu); outline-offset: 3px; }

body.dojo-login .cosmosfarm-members-form.signin-form .social-login-section::before { background: var(--rule); }
body.dojo-login .cosmosfarm-social-login .cosmosfarm-social-login-title {
  color: var(--haze);
  font-family: var(--serif-kr);
  font-size: .85rem;
  letter-spacing: .12em;
}
body.dojo-login .cosmosfarm-members-form.signin-form .cosmosfarm-social-login a { opacity: .8; }
body.dojo-login .cosmosfarm-members-form.signin-form .cosmosfarm-social-login a:hover { opacity: 1; }

/* 회원제로 운영하지 않으므로 "아직 회원이 아니신가요? 회원가입" 줄은 보이지 않게 한다 */
body.dojo-login .cosmosfarm-members-form.signin-form .login-footer { display: none; }

/* 로그인 페이지에서는 맨 아래 링크가 지금 있는 곳 */
.foot__login[aria-current="page"] { color: var(--kinu); text-decoration: none; }

@media (max-width: 820px) {
  .dl { grid-template-columns: minmax(0, 1fr); padding-top: 96px; gap: 24px; }
  .dl__kanji { font-size: 7rem; justify-self: start; opacity: .7; }
  .dl__form { max-width: none; }
}
@media screen and (max-width: 480px) {
  body.dojo-login .cosmosfarm-members-form.signin-form { margin: 0; padding: 0; }
}