/* =================================================================
   Admin Login Page Style (login.css)
   - Modern White-Tone Theme
   ================================================================= */

/* 1. 변수 및 기본 설정 (Variables & Root)
------------------------------------------------------------------- */
:root {
  /* common.css 변수가 없을 경우 사용될 기본값 */
  --default-primary-color: #0d6efd;
  --default-danger-color: #dc3545;
  --default-text-dark: #212529;
  --default-text-secondary: #6c757d;
  --default-bg-body: #f8f9fa;
  --default-bg-white: #ffffff;
  --default-border-color: #dee2e6;
}

/* 2. 전체 레이아웃 (Body & Layout)
------------------------------------------------------------------- */
body {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  margin: 0;
  background-color: var(--default-bg-body);
  font-family: 'Noto Sans KR', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--text, var(--default-text-dark));
}

/* 3. 로그인 박스 (Login Wrapper)
------------------------------------------------------------------- */
.login-wrap {
  width: 100%;
  max-width: 450px;
  padding: 2.5rem;
  background: var(--card-bg, var(--default-bg-white));
  border-radius: 12px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
  border: 1px solid var(--border, var(--default-border-color));
}

.login-wrap h1 {
  font-size: 1.75rem;
  font-weight: 700;
  text-align: center;
  margin: 0 0 2rem 0;
  color: var(--primary, var(--default-text-dark));
}

/* 4. 폼 요소 (Form Elements)
------------------------------------------------------------------- */
.form-inform-msg{
  font-size:15px;
  color:#777;
  margin-bottom: 12px;
  text-align : center;
}
.form-group {
  margin-bottom: 1.25rem;
}

.form-group label {
  display: block;
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--default-text-secondary);
}

.form-group input {
  width: 100%;
  padding: 0.8rem 1rem;
  font-size: 1rem;
  border: 1px solid var(--border, var(--default-border-color));
  border-radius: 8px;
  box-sizing: border-box; /* padding이 너비에 영향을 주지 않도록 설정 */
  transition: border-color 0.2s, box-shadow 0.2s;
}

.form-group input::placeholder {
  color: #adb5bd;
}

.form-group input:focus {
  outline: none;
  border-color: var(--accent, var(--default-primary-color));
  box-shadow: 0 0 0 4px rgba(13, 110, 253, 0.15); /* 포커스 시 은은한 그림자 효과 */
}

/* 5. 버튼 및 메시지 (Button & Message)
------------------------------------------------------------------- */
.btn-login {
  width: 100%;
  padding: 0.9rem;
  font-size: 1.05rem;
  font-weight: 600;
  color: #fff;
  background-color: var(--accent, var(--default-primary-color));
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: background-color 0.2s;
  margin-top: 1rem;
}

.btn-login:hover {
  background-color: var(--accent-hover, #0b5ed7);
}

.btn-recover {
  width: 100%;
  padding: 0.9rem;
  font-size: 1.05rem;
  font-weight: 600;
  color: #222;
  background-color: #eeeeff;
  border: 1px solid #ddddee;
  border-radius: 4px;
  cursor: pointer;
  transition: background-color 0.2s;
  margin-top: 1rem;
}

.btn-recover:hover {
  background-color: #ddddee;
}

.errorMessage {
  margin-top: 1rem;
  text-align: center;
  font-size: 0.9rem;
  color: var(--default-danger-color);
  min-height: 1.2em; /* 메시지가 없을 때도 공간을 차지하여 레이아웃이 흔들리지 않도록 함 */
}

/* 💡 [수정/추가] input의 공통 스타일 */
input[type=text],input[type="password"] {
  width: 100%;
  padding: 10px 10px 10px 40px; /* 아이콘 공간 확보를 위해 왼쪽 패딩(padding-left)을 40px로 설정 */
  border: 1px solid #ddd;
  border-radius: 6px;
  box-sizing: border-box;
  background-repeat: no-repeat; /* 배경 이미지가 반복되지 않도록 설정 */
  background-position: 12px center; /* 배경 이미지 위치: 왼쪽에서 10px, 세로 중앙 */
  background-size: 15px 15px; /* 배경 이미지 크기 */
}


/* 아이디 입력 필드에 아이콘 적용 */
#loginId {
  background-image: url('/imgs/login/login-img-userid.png');
}

/* 비밀번호 입력 필드에 아이콘 적용 */
#password, #passwordConfirm {
  background-image: url('/imgs/login/login-img-pw.png');
}

.company-admin-logo {
  display: flex;
  justify-content: center; /* 가로 중앙 */
  align-items: center;
  margin-bottom : 40px;
}
.company-admin-logo img{
  width:200px;
}