@charset "utf-8";
/*
 * 농산물가공센터 관리자 로그인 페이지
 * 2026.04.29 이서 - 시안 디자인 적용
 */

:root {
	--brand-green: #4a7c3f;
	--brand-green-dark: #3b6311;
	--brand-green-light: #eaf3de;
	--brand-danger: #a32d2d;
	--brand-danger-bg: #fcebeb;
	--text-primary: #1a1a1a;
	--text-secondary: #5f5e5a;
	--text-tertiary: #888780;
	--bg-page: #f5f4ef;
	--bg-card: #ffffff;
	--bg-secondary: #f1efe8;
	--border-light: rgba(0, 0, 0, 0.08);
	--border-mid: rgba(0, 0, 0, 0.16);
	--radius-md: 8px;
	--radius-lg: 12px;
}

* { box-sizing: border-box; }

html, body { height: 100%; }

.login-body {
	margin: 0;
	padding: 40px 20px;
	min-height: 100vh;
	background: var(--bg-page);
	font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont,
	             system-ui, 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
	color: var(--text-primary);
	-webkit-font-smoothing: antialiased;
	display: flex;
	align-items: center;
	justify-content: center;
}

.login-container {
	width: 100%;
	max-width: 400px;
	margin: 0 auto;
}

.visually-hidden {
	position: absolute; width: 1px; height: 1px;
	padding: 0; margin: -1px; overflow: hidden;
	clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* 브랜드 */
.brand { text-align: center; margin-bottom: 24px; }
.brand-logo {
	width: 54px; height: 54px;
	background: var(--brand-green); color: #fff;
	border-radius: 14px;
	display: inline-flex; align-items: center; justify-content: center;
	font-weight: 600; font-size: 22px;
	margin-bottom: 12px;
}
.brand-title {
	font-size: 17px; font-weight: 600; margin: 0 0 3px;
	color: var(--text-primary);
}
.brand-sub {
	font-size: 11px; color: var(--text-tertiary); margin: 0;
	letter-spacing: 0.2px;
}
.brand-secure {
	display: inline-flex; align-items: center; gap: 4px;
	font-size: 11px; color: var(--brand-green);
	margin-top: 10px; padding: 3px 10px;
	background: var(--brand-green-light);
	border-radius: 12px;
}

/* 로그인 카드 */
.login-card {
	background: var(--bg-card);
	border: 1px solid var(--border-light);
	border-radius: var(--radius-lg);
	padding: 26px 28px 24px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}
.login-card-title {
	font-size: 14px; font-weight: 600;
	margin: 0 0 18px;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--brand-green);
	color: var(--text-primary);
}
.login-card fieldset {
	border: none; padding: 0; margin: 0;
}

/* 알림 */
.login-alert {
	padding: 10px 14px;
	border-radius: var(--radius-md);
	font-size: 12.5px;
	margin-bottom: 14px;
	line-height: 1.5;
}
.login-alert.error   { background: var(--brand-danger-bg); color: var(--brand-danger); }
.login-alert.success { background: var(--brand-green-light); color: var(--brand-green); }

/* 폼 필드 */
.form-field { margin-bottom: 12px; }
.form-label {
	font-size: 12px; color: var(--text-secondary);
	display: block; margin-bottom: 4px;
}
.form-control {
	width: 100%; height: 40px;
	padding: 0 12px;
	border: 1px solid var(--border-mid);
	border-radius: var(--radius-md);
	font-size: 14px;
	color: var(--text-primary);
	background: #fff;
	transition: border-color .15s, box-shadow .15s;
	-webkit-appearance: none;
	   -moz-appearance: none;
	        appearance: none;
	font-family: inherit;
}
.form-control:focus {
	outline: none;
	border-color: var(--brand-green);
	box-shadow: 0 0 0 3px var(--brand-green-light);
}
.form-control::placeholder { color: #b4b2a9; }

.form-row {
	display: flex; align-items: center; justify-content: space-between;
	margin: 16px 0;
	font-size: 12px;
}
.form-check {
	display: inline-flex; align-items: center; gap: 6px;
	color: var(--text-secondary);
	cursor: pointer;
	-webkit-user-select: none;
	   -moz-user-select: none;
	        user-select: none;
}
.form-check-input {
	width: 14px; height: 14px;
	accent-color: var(--brand-green);
	margin: 0;
	cursor: pointer;
}
.form-link { color: var(--text-secondary); text-decoration: none; }
.form-link:hover { color: var(--brand-green); text-decoration: underline; }

/* 로그인 버튼 */
.btn-login {
	display: block; width: 100%; height: 44px;
	background: var(--brand-green); color: #fff;
	border: none; border-radius: var(--radius-md);
	font-size: 14px; font-weight: 600;
	cursor: pointer;
	font-family: inherit;
	transition: background .15s, transform .05s;
}
.btn-login:hover  { background: var(--brand-green-dark); }
.btn-login:active { transform: translateY(1px); }
.btn-login:focus-visible {
	outline: 2px solid var(--brand-green);
	outline-offset: 2px;
}

/* IP 확인 바 */
.ip-bar {
	margin-top: 12px;
	padding: 10px 14px;
	background: var(--brand-green-light);
	border: 1px solid rgba(74, 124, 63, 0.2);
	border-radius: var(--radius-md);
	display: flex; align-items: center; justify-content: space-between;
	font-size: 11.5px; color: var(--brand-green);
}
.ip-bar-label { display: inline-flex; align-items: center; gap: 6px; }
.ip-bar-value {
	font-family: 'D2Coding', Consolas, 'Courier New', monospace;
	font-weight: 600;
}

/* 보안 안내 */
.login-notice {
	margin-top: 10px;
	padding: 12px 14px;
	background: var(--bg-secondary);
	border-radius: var(--radius-md);
	font-size: 11.5px; color: var(--text-secondary);
	line-height: 1.7;
}
.login-notice strong {
	display: block; margin-bottom: 4px;
	color: var(--text-primary);
	font-size: 12px; font-weight: 600;
}
.login-notice ul { margin: 0; padding-left: 16px; }
.login-notice li { margin-bottom: 1px; }

/* 푸터 */
.login-foot {
	margin-top: 14px;
	text-align: center;
	font-size: 10.5px;
	color: var(--text-tertiary);
	line-height: 1.7;
}

@media (max-width: 480px) {
	.login-body { padding: 20px 16px; }
	.login-card { padding: 22px 20px 20px; }
}