/* /css/egovframework/login/login-style.css (or login-style-naver.css) - Updated Colors */
@charset "UTF-8";

/* 기본 스타일 및 중앙 정렬 */
body {
    display: flex;
    justify-content: center;
    align-items: flext-start;
    min-height: 100vh;
    background-color: #f0f4f8; /* 약간 더 밝은 하늘색 배경 */
    font-family: 'Malgun Gothic', 'Dotum', 'Apple SD Gothic Neo', sans-serif;
    margin: 0;
    color: #495057; /* 기본 글자색을 약간 부드러운 검정으로 */
    line-height: 1.5;
    padding-top: 18vh;
    box-sizing: border-box;
    
}

/* 로그인 폼 전체 래퍼 */
.login-wrapper-naver {
    width: 100%;
    max-width: 460px;
    text-align: center;
    padding-bottom : 20px;
    box-sizing: border-box;
}

/* 로고 영역 */
.logo-area {
    margin-bottom: 30px;
/*     padding-bottom: 10px; */
    border-bottom: 2px solid #5b9bd5; /* 파란색 밑줄 */
    display: inline-block;
}

.logo-area h2 a {
    color: #337ab7; /* 진한 파란색 로고 */
    text-decoration: none;
    font-size: 2em; /* h1 스타일 여기로 이동 */
    letter-spacing: -1px;
}

/* 로그인 컨테이너 */
.login-container-naver {
    background-color: transparent;
    padding: 0;
}

/* 비밀번호 안내 문구 */
.password-info {
    font-size: 12px;
    color: #5a6a7e; /* 약간 진한 회색/파란색 톤 */
    margin-bottom: 25px;
    text-align: left;
}


/* 로그인 폼 */
.login-form-naver {
    margin-bottom: 20px;
}

/* 입력 그룹 */
.input-group-naver {
    margin-bottom: 10px;
}

.input-group-naver input[type="text"],
.input-group-naver input[type="password"] {
    width: 100%;
    padding: 15px 17px;
    border: 1px solid #c9d7e7;
    border-radius: 6px;
    font-size: 15px;
    box-sizing: border-box;
    background-color: #fff;
    color: #333; /* 입력 텍스트는 검정색 유지 */
}

.input-group-naver input::placeholder {
    color: #8898aa; /* 플레이스홀더 색상 */
}

/* 입력창 포커스 */
.input-group-naver input:focus {
    outline: none;
    border-color: #5b9bd5;
    box-shadow: 0 0 0 1px #8eb9e6;
}

/* 로그인 버튼 */
.login-button-naver {
    width: 100%;
    padding: 18px 0;
    background-color: #5b9bd5; /* 파란색 버튼 */
    border: 1px solid #5b9bd5;
    color: white;
    font-size: 18px;
    font-weight: bold;
    border-radius: 6px;
    cursor: pointer;
    margin-top: 20px;
    transition: background-color 0.2s;
}

.login-button-naver:hover {
    background-color: #4a8ac2;
    border-color: #4a8ac2;
}

/* 하단 링크 */
.extra-links-naver {
    margin-top: 20px;
    font-size: 16px;
}

.extra-links-naver a {
    color: #4a75a3; /* 링크 글자색을 파란색 톤으로 */
    text-decoration: none;
    padding: 0 8px;
}

.extra-links-naver a:hover {
    text-decoration: underline;
    color: #337ab7;
}

.extra-links-naver .separator {
    color: #ccc;
}

/* 에러 메시지 */
.error-message-naver {
    color: #dc3545;
    font-size: 12px;
    margin-top: 15px;
    text-align: center;
}

/* 푸터 */
.footer-naver {
    margin-top: 40px;
    font-size: 11px;
    color: #8898aa; /* 푸터 글자색도 약간 파란톤 회색으로 */
}