/*
 * Entra 로그인 화면 스타일.
 * craver-seed-v4_발표용.html 의 로그인(COM-01-01) 영역 CSS를 발췌했다.
 * 원본의 인라인 style 은 클래스로 옮겼다.
 */
:root{--black:#111;--dark:#1a1a1a;--mid:#555;--gray:#888;--line:#e4e4e4;--bg:#f5f5f3;--white:#fff;--danger:#c0392b;--warn:#d97706;--ok:#16a34a;}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{font-size:14px;}
body{font-family:'Pretendard','Apple SD Gothic Neo','Malgun Gothic','Noto Sans KR',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;font-size:14px;line-height:1.5;background:var(--dark);color:var(--black);min-height:100vh;}

/* ── 브랜드 워드마크 ── 원본은 어두운 글자 PNG에 invert 필터를 걸어 흰 글자로 쓴다 */
.brand-wordmark{display:inline-block;background:url("../img/craver-wordmark.png") left center/contain no-repeat;}
.brand-wordmark.on-dark{filter:invert(1);}

/* ── LOGIN ── 로고 위치는 세로 가운데 대신 위에서 고정 (v4 10/12) */
.login-page{min-height:100vh;background:var(--dark);display:flex;align-items:flex-start;justify-content:center;padding:0 16px;}
.login-wrap{width:100%;max-width:380px;margin-top:max(64px,calc(50vh - 230px));}
.login-logo{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;font-size:44px;font-weight:800;color:var(--white);letter-spacing:-1px;margin-bottom:46px;}
.login-logo-row{display:inline-flex;align-items:center;}
.login-logo .brand-wordmark{width:232px;height:44px;}
.login-logo-seed{color:#4ade80;font-style:italic;font-weight:700;}

/* 🌱 CRAVER·Seed 사이 새싹이 쏙 자라남 */
.login-sprout{display:inline-flex;align-items:flex-end;margin:0 5px;}
.login-sprout .sprout-g{transform-origin:12px 30px;animation:sproutGrow 1.4s cubic-bezier(.2,.85,.3,1) both;}
@keyframes sproutGrow{0%{transform:scaleY(0) rotate(-4deg);opacity:0}55%{transform:scaleY(1.12) rotate(2deg)}75%{transform:scaleY(.95) rotate(-1deg)}100%{transform:scaleY(1) rotate(0);opacity:1}}
@media (prefers-reduced-motion:reduce){.login-sprout .sprout-g{animation:none;}}

.btn-login{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:14px;margin-top:8px;background:var(--white);color:var(--dark);border:none;cursor:pointer;font-size:13px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;font-family:inherit;text-decoration:none;transition:opacity .2s;}
.btn-login:hover{opacity:.85;}
.btn-login:focus-visible{outline:2px solid #4ade80;outline-offset:3px;}

/* 로그인 방법 안내(버튼 바로 아래) / 비밀번호·승인 안내(점선 박스) */
.login-guide{margin-top:12px;font-size:12px;line-height:1.7;color:#94a3b8;text-align:center;word-break:keep-all;}
.login-notice{margin-top:22px;margin-bottom:24px;padding:12px 16px;border:1px dashed rgba(148,163,184,.45);border-radius:8px;font-size:11.5px;line-height:1.75;color:#94a3b8;text-align:center;word-break:keep-all;}
.login-notice-em{color:#cbd5e1;}

/* 로그인 실패 / 로그아웃 안내 */
.login-alert{margin-top:16px;padding:10px 14px;border:1px solid rgba(248,113,113,.5);border-radius:8px;background:rgba(248,113,113,.08);font-size:12px;line-height:1.7;color:#fca5a5;word-break:keep-all;}
.login-alert-detail{margin-top:6px;font-size:11px;color:#fecaca;word-break:break-all;}
.login-alert-detail code{font-family:Consolas,Menlo,monospace;margin-right:6px;}
.login-info{margin-top:16px;font-size:12px;color:#86efac;text-align:center;}

/* ── PROFILE ── */
.profile-page{min-height:100vh;background:var(--bg);padding:40px 16px;}
.profile-wrap{max-width:760px;margin:0 auto;}
.profile-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px;}
.profile-head .brand-wordmark{width:120px;height:23px;}
.profile-card{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:22px 24px;margin-bottom:16px;}
.profile-card h2{font-size:15px;font-weight:800;margin-bottom:14px;}
.profile-fields{display:grid;grid-template-columns:1fr 1.6fr 1fr;gap:16px;}
.profile-field{min-width:0;padding:14px 16px;border:1px solid var(--line);border-radius:8px;background:#fafaf9;}
.profile-field dt{font-size:12px;font-weight:600;color:var(--mid);margin-bottom:6px;}
.profile-field dd{font-size:16px;font-weight:700;color:var(--black);overflow-wrap:anywhere;}
.profile-lookup-notice{margin-top:14px;font-size:12px;color:var(--warn);}
@media (max-width:600px){.profile-fields{grid-template-columns:1fr;gap:10px;}.profile-card{padding:20px;}}
.profile-claims{width:100%;border-collapse:collapse;font-size:12px;}
.profile-claims th,.profile-claims td{text-align:left;padding:7px 8px;border-top:1px solid var(--line);vertical-align:top;word-break:break-all;}
.profile-claims th{width:30%;color:var(--mid);font-weight:600;font-family:Consolas,Menlo,monospace;}
.profile-claims td{font-family:Consolas,Menlo,monospace;color:var(--black);}
.btn-logout{background:var(--dark);color:var(--white);border:none;border-radius:8px;padding:8px 14px;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;}
.btn-logout:hover{opacity:.85;}

/* 좁은 화면: 원본(380px 고정)에는 없던 대응. 로고가 넘치지 않게 줄인다 */
@media (max-width:420px){
  .login-logo{font-size:34px;}
  .login-logo .brand-wordmark{width:176px;height:34px;}
  .btn-login{letter-spacing:.5px;}
}

/* POC 전용: Entra 설정(application-local.yml) 누락 안내. 실제 화면에는 없다. */
.login-dev-alert{margin-top:16px;padding:10px 14px;border:1px solid rgba(251,191,36,.45);border-radius:8px;background:rgba(251,191,36,.08);font-size:11.5px;line-height:1.7;color:#fbbf24;word-break:keep-all;}
.login-dev-alert code{font-family:Consolas,Menlo,monospace;color:#fde68a;}
