/**
 * ZYSS Members frontend styles
 * 회원 가입과 로그인 숏코드 화면의 기본 레이아웃을 담당한다.
 */
.zyss-member-box {
  max-width: 560px;
  margin: 0 auto 80px;
  border: 1px solid var(--border-color, #d0d7de);
  border-radius: 8px;
  padding: 28px;
  background: var(--bg-secondary, #f6f8fa);
  color: var(--text-primary, #24292f);
}

.zyss-member-box h2 {
  margin-top: 0;
}

.zyss-member-form {
  display: grid;
  gap: 16px;
}

.zyss-member-form label {
  display: grid;
  gap: 7px;
  font-weight: 700;
}

.zyss-member-form input,
.zyss-member-box .login-username input,
.zyss-member-box .login-password input {
  width: 100%;
  border: 1px solid var(--border-color, #d0d7de);
  border-radius: 6px;
  padding: 11px 12px;
  background: var(--bg-primary, #ffffff);
  color: var(--text-primary, #24292f);
}

.zyss-member-form button,
.zyss-member-box .login-submit input {
  border: 0;
  border-radius: 6px;
  padding: 12px 16px;
  background: #238636;
  color: #ffffff;
  cursor: pointer;
  font-weight: 700;
}

.zyss-member-success {
  border: 1px solid #2da44e;
  border-radius: 6px;
  padding: 10px 12px;
  background: rgba(46, 160, 67, 0.12);
}

.zyss-member-error {
  border: 1px solid #f85149;
  border-radius: 6px;
  padding: 10px 12px;
  background: rgba(248, 81, 73, 0.12);
}