* { box-sizing: border-box; }

body {
    margin: 0;
    font-family: "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;
    background: #f4f5f7;
    color: #222;
}

.login-box {
    max-width: 360px;
    margin: 80px auto;
    padding: 32px;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
}

.login-box h1 { font-size: 20px; margin: 0 0 24px; }

label { display: block; margin: 12px 0 4px; font-size: 14px; }

input {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #bbb;
    border-radius: 4px;
    font-size: 14px;
}

button {
    width: 100%;
    margin-top: 20px;
    padding: 10px;
    border: 0;
    border-radius: 4px;
    background: #2f5bea;
    color: #fff;
    font-size: 15px;
    cursor: pointer;
}

.message { font-size: 14px; padding: 8px 10px; border-radius: 4px; background: #eef2ff; }
.message.error { background: #fdecec; color: #a11; }

.page { max-width: 880px; margin: 40px auto; padding: 0 16px; }

.page-header { display: flex; align-items: center; justify-content: space-between; }

.page-header h1 { font-size: 20px; }

.link-button {
    width: auto;
    margin: 0;
    padding: 6px 12px;
    background: #fff;
    border: 1px solid #bbb;
    color: #333;
    font-size: 13px;
}

table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid #ddd; }

th, td { padding: 10px 12px; border-bottom: 1px solid #eee; text-align: left; font-size: 14px; }

.detail th { width: 120px; background: #fafafa; }

.list thead th { background: #fafafa; }

.muted { color: #888; }

/* 폼(내 정보 수정, 직원 생성·신원 수정) */
.page h2 { font-size: 16px; margin: 28px 0 8px; }

.form { background: #fff; border: 1px solid #ddd; padding: 16px; }

.form .field { margin-bottom: 12px; }

.form label { margin-top: 0; }

.form .hint { font-size: 12px; color: #888; margin: 4px 0 0; }

.error { color: #a11; font-size: 13px; margin: 4px 0 0; }

.notice { font-size: 14px; padding: 8px 10px; border-radius: 4px; background: #eef2ff; }

/* 목록·상세의 버튼 줄 */
.actions { display: flex; gap: 8px; align-items: center; margin: 16px 0; }

.actions form { margin: 0; }

.actions .danger { background: #a11; }

/* 재직 상태 배지 */
.badge { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: 12px; background: #e8f0e8; }

.badge.terminated { background: #f3e3e3; color: #a11; }