/* 보라 로그인 3종(전도인·관리자 PIN·시스템 계정) 전용. 보드 13/16/M5/M6 값.
   base.html·admin/base.html 의 틀 위에 고정 층(.auth)을 덮어 부모 스타일과 분리한다. */
body.auth-v2{background:#2B1E4E;}
body.auth-v2 .app-header,body.auth-v2 .nav{display:none;}
.auth,.auth *{box-sizing:border-box;}
.auth [hidden]{display:none!important;}
.auth{
  position:fixed;inset:0;z-index:50;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;
  background:#2B1E4E;color:#FFFFFF;
  font-family:"Noto Sans KR","Apple SD Gothic Neo",system-ui,sans-serif;font-size:14px;line-height:1.45;
  -webkit-font-smoothing:antialiased;text-align:left;
  --auth-glow-x:30%;--auth-glow-y:45%;
}
.auth-admin .auth{--auth-glow-x:30%;--auth-glow-y:42%;}
.auth-frame,.auth>.workspace-login{
  position:relative;overflow:hidden;min-height:100%;display:flex;flex-direction:column;
  background:radial-gradient(ellipse 55% 55% at var(--auth-glow-x) var(--auth-glow-y),#3A2A66 0%,rgba(43,30,78,0) 100%);
}
/* 시스템 계정 로그인은 Django admin 의 화면 안에서 그려진다 — 회중 이름이 admin.css 의
   `#content h1`(26px·짙은 글자)에 눌려 작고 검게 나오던 것을 회중 관리자 비번 화면과 같게 되돌린다. */
.auth-system #content h1.auth-name{font-family:Sora,"Noto Sans KR",sans-serif;font-size:clamp(40px,calc(5.556vw - 8px),72px);font-weight:700;letter-spacing:-.035em;line-height:1;color:#FFFFFF;margin:0;}
@media (max-width:719px){.auth-system #content h1.auth-name{font-size:clamp(28px,9.6vw,38px);line-height:1.05;}}
/* 시스템 계정 로그인의 틀(.workspace-login)에 걸린 admin.css 카드 규칙을 지운다. */
.auth>.workspace-login{max-width:none;width:100%;margin:0;border:0;border-radius:0;grid-template-columns:none;}
.auth-hatch{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;}
.auth a{text-decoration:none;}

/* 상단: JWSVC.KR · 언어 */
.auth-top{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:32px 48px 0;font-size:12px;color:#9A8BC4;}
.auth-host{font-family:"JetBrains Mono",Menlo,monospace;letter-spacing:.16em;}
.auth-lang{display:flex;gap:6px;margin:0;}
.auth-lang button{min-height:36px;padding:0 6px;border:0;background:transparent;color:#9A8BC4;font:inherit;font-size:12px;cursor:pointer;white-space:nowrap;border-radius:6px;}
.auth-lang button:hover{color:#FFFFFF;}
.auth-lang button[aria-current]{color:#CBBDEA;font-weight:600;}
.auth-lang button:focus-visible,.auth a:focus-visible,.auth button:focus-visible{outline:2px solid #CBBDEA;outline-offset:2px;}

/* 본문: ≥900px 2열(정체성 · 카드 460) */
.auth-main{
  position:relative;z-index:1;flex:1 0 auto;width:100%;max-width:1440px;margin:0 auto;
  display:grid;grid-template-columns:minmax(0,1fr) 460px;align-items:center;
  column-gap:clamp(40px,calc(7.41vw - 26.7px),80px);
  padding:40px clamp(32px,calc(23.7vw - 181px),160px) 40px clamp(32px,calc(16.3vw - 115px),120px);
}
.auth-id{position:relative;display:flex;flex-direction:column;align-items:flex-start;min-width:0;}
.auth-id::before,.auth-id::after{content:"";position:absolute;left:50%;top:50%;border-radius:50%;border:1px solid rgba(255,255,255,.08);pointer-events:none;transform:translate(-50%,-50%);}
.auth-id::before{width:600px;height:600px;}
.auth-id::after{width:840px;height:840px;border-color:rgba(255,255,255,.05);}
.auth-mark{width:64px;height:64px;border-radius:50%;border:2px solid #FFFFFF;display:inline-flex;align-items:center;justify-content:center;font-family:Sora,"Noto Sans KR",sans-serif;font-size:20px;font-weight:700;letter-spacing:-.04em;margin-bottom:26px;flex-shrink:0;}
.auth-name{margin:0;font-family:Sora,"Noto Sans KR",sans-serif;font-size:clamp(40px,calc(5.556vw - 8px),72px);font-weight:700;letter-spacing:-.035em;line-height:1;white-space:nowrap;color:#FFFFFF;}
.auth-ru{margin:16px 0 0;font-size:22px;font-weight:500;color:#CBBDEA;letter-spacing:.01em;}
.auth-kicker{margin:12px 0 0;font-family:"JetBrains Mono",Menlo,monospace;font-size:11.5px;letter-spacing:.18em;color:#9A8BC4;}

.auth-col{display:flex;flex-direction:column;align-items:center;min-width:0;}
.auth-back{margin-top:22px;font-size:13px;color:#CBBDEA;white-space:nowrap;}
.auth-back:hover{color:#FFFFFF;}
.auth-foot{position:relative;z-index:1;display:flex;justify-content:flex-end;gap:12px;padding:0 48px 28px;font-size:11.5px;color:#9A8BC4;}

/* 흰 카드 */
.auth-card{
  position:relative;z-index:1;width:100%;max-width:460px;background:#FFFFFF;color:#0F172A;border-radius:14px;
  padding:24px 28px 22px;display:flex;flex-direction:column;gap:12px;box-shadow:0 30px 60px rgba(10,5,30,.45);
}
.auth-card-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 12px;}
.auth-card-head h2{margin:0;font-family:Sora,"Noto Sans KR",sans-serif;font-size:16px;font-weight:600;color:#0F172A;letter-spacing:0;}
.auth-admin .auth-card-head h2{font-size:17px;}
.auth-card-head small{font-size:12px;color:#526074;}
.auth-form{display:flex;flex-direction:column;gap:12px;margin:0;}
.auth-label{font-size:12.5px;font-weight:600;color:#526074;margin-bottom:-6px;}
.auth-alert{margin:0;padding:10px 12px;border-radius:8px;background:#FBE1E1;color:#B42323;font-size:13px;font-weight:500;}

/* 입력 */
.auth-search{display:flex;align-items:center;gap:8px;height:44px;padding:0 12px;border:1px solid #DDE3EB;border-radius:8px;background:#FFFFFF;color:#7C8798;}
.auth-search:focus-within,.auth-input:focus{border-color:#4A3283;box-shadow:0 0 0 3px rgba(74,50,131,.15);outline:none;}
.auth-search svg{flex-shrink:0;}
.auth-search input{flex:1 1 auto;min-width:0;height:100%;border:0;background:transparent;font:inherit;font-size:15px;color:#0F172A;outline:none;padding:0;}
.auth-input{width:100%;height:44px;border:1px solid #DDE3EB;border-radius:8px;padding:0 12px;font:inherit;font-size:15px;color:#0F172A;background:#FFFFFF;}
.auth-pin{font-family:"JetBrains Mono",Menlo,monospace;letter-spacing:.3em;font-size:20px;}
.auth-check{display:flex;align-items:center;gap:8px;font-size:12.5px;color:#526074;cursor:pointer;}
.auth-check input{width:18px;height:18px;margin:0;accent-color:#4A3283;flex-shrink:0;}

/* 이 기기에서 최근 */
.auth-recent{display:flex;flex-direction:column;gap:6px;}
.auth-recent small{font-size:11.5px;color:#526074;font-weight:600;}
.auth-recent-list{display:flex;gap:8px;flex-wrap:wrap;}
.auth-chip{display:inline-flex;align-items:center;gap:8px;height:40px;max-width:100%;padding:0 12px 0 6px;border-radius:999px;border:1px solid #DDE3EB;background:#F7F9FC;font:inherit;font-size:13.5px;font-weight:600;color:#0F172A;cursor:pointer;white-space:nowrap;overflow:hidden;}
.auth-chip:hover{border-color:#4A3283;background:#EEEBF6;}
.auth-avatar{width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;background:#E7E3F8;color:#5B4BB5;flex-shrink:0;}

/* 버튼 */
.auth-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;max-width:100%;flex-shrink:0;height:50px;padding:0 18px;
  border-radius:8px;border:1px solid #4A3283;background:#4A3283;color:#FFFFFF;font:inherit;font-size:15px;font-weight:600;
  cursor:pointer;white-space:nowrap;overflow:hidden;
}
.auth-admin .auth-btn{font-size:15.5px;}
.auth-btn:hover{background:#3C2870;border-color:#3C2870;}
.auth-btn.ghost{background:transparent;color:#0F172A;border-color:#DDE3EB;height:44px;font-size:14.5px;}
.auth-btn.ghost:hover{background:#EDF0F4;}
.auth-btn svg{flex-shrink:0;}

/* 세그 */
.auth-seg{display:inline-flex;border:1px solid #DDE3EB;border-radius:8px;padding:2px;gap:2px;background:#FFFFFF;}
.auth-seg a,.auth-seg span{white-space:nowrap;height:30px;padding:0 12px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:600;color:#526074;}
.auth-seg a:hover{background:#EDF0F4;color:#0F172A;}
.auth-seg .on{background:#4A3283;color:#FFFFFF;}

/* 아래 링크 */
.auth-info{margin:0;padding:10px 12px;border-radius:8px;background:#EEEBF6;color:#3C2870;font-size:13px;font-weight:500;}
.auth-hint{margin:0;font-size:12.5px;color:#526074;text-align:center;}
.auth-link{align-self:center;font-size:13px;color:#4A3283;text-decoration:underline;text-underline-offset:3px;}
.auth-link:hover{color:#3C2870;}
.auth-btn:disabled,.auth-btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed;}
.auth-passkey-error{margin:0;font-size:12.5px;color:#B42323;}

/* Django admin 로그인 폼을 카드 모양으로 */
.auth-django,.auth-django #content-main{width:100%;float:none;margin:0;padding:0;}
body.auth-v2 .auth-card .errornote{margin:0 0 12px;padding:10px 12px;border:0;border-radius:8px;background:#FBE1E1;color:#B42323;font-size:13px;}
body.auth-v2 .auth-card ul.errorlist{margin:0 0 6px;padding:0;list-style:none;color:#B42323;font-size:12.5px;background:none;}
body.auth-v2 .auth-card #login-form{display:flex;flex-direction:column;gap:12px;margin:0;}
body.auth-v2 .auth-card #login-form .form-row{display:flex;flex-direction:column;gap:6px;padding:0;margin:0;border:0;overflow:visible;}
body.auth-v2 .auth-card #login-form .form-row label{display:block;float:none;width:auto;padding:0;margin:0;font-size:12.5px;font-weight:600;line-height:1.4;color:#526074;}
body.auth-v2 .auth-card #login-form .form-row input:not([type=hidden]){width:100%;height:44px;padding:0 12px;margin:0;border:1px solid #DDE3EB;border-radius:8px;background:#FFFFFF;color:#0F172A;font:inherit;font-size:15px;box-shadow:none;}
body.auth-v2 .auth-card #login-form .form-row input:not([type=hidden]):focus{border-color:#4A3283;box-shadow:0 0 0 3px rgba(74,50,131,.15);outline:none;}
body.auth-v2 .auth-card #login-form .password-reset-link{margin:0;font-size:12.5px;text-align:right;}
body.auth-v2 .auth-card #login-form .password-reset-link a{color:#526074;}
body.auth-v2 .auth-card #login-form .submit-row{display:block;margin:0;padding:0;border:0;background:none;text-align:left;}
body.auth-v2 .auth-card #login-form .submit-row input{display:block;width:100%;height:50px;margin:0;padding:0 18px;border:1px solid #4A3283;border-radius:8px;background:#4A3283;color:#FFFFFF;font:inherit;font-size:15.5px;font-weight:600;white-space:nowrap;cursor:pointer;text-transform:none;letter-spacing:0;}
body.auth-v2 .auth-card #login-form .submit-row input:hover{background:#3C2870;border-color:#3C2870;}

/* 관리자 로그인(회중 PIN·시스템 계정)은 보드 13: 데스크톱에서도 한 열 중앙 */
.auth-admin .auth-main{grid-template-columns:minmax(0,560px);justify-content:center;align-content:center;row-gap:40px;padding-top:24px;}
.auth-admin .auth-id{align-items:center;text-align:center;}
.auth-admin .auth-col{width:100%;}
.auth-admin .auth-card{max-width:460px;}

/* <900px: 세로 */
@media (max-width:899px){
  .auth{--auth-glow-x:50%;--auth-glow-y:22%;}
  .auth-admin .auth{--auth-glow-x:50%;--auth-glow-y:26%;}
  .auth-top{padding:18px 20px 0;font-size:11.5px;}
  .auth-host{letter-spacing:.14em;}
  .auth-lang{gap:2px;}
  .auth-lang button{font-size:11.5px;padding:0 5px;}
  .auth-main{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:48px 20px 28px;}
  .auth-id{align-items:center;text-align:center;}
  .auth-id::before{width:300px;height:300px;}
  .auth-publisher .auth-id::before{width:260px;height:260px;}
  .auth-id::after{width:430px;height:430px;}
  .auth-publisher .auth-id::after{display:none;}
  .auth-mark{width:52px;height:52px;font-size:16px;margin-bottom:18px;}
  .auth-publisher .auth-mark{width:48px;height:48px;font-size:15px;margin-bottom:14px;}
  .auth-name{font-size:clamp(28px,9.6vw,38px);line-height:1.05;}
  .auth-publisher .auth-name{font-size:clamp(28px,9.2vw,36px);}
  .auth-ru{margin-top:10px;font-size:16px;}
  .auth-publisher .auth-ru{margin-top:8px;font-size:15px;}
  .auth-kicker{margin-top:8px;font-size:9.5px;letter-spacing:.16em;}
  .auth-publisher .auth-kicker{display:none;}
  .auth-card,.auth-col{max-width:480px;}
  .auth-col{width:100%;margin-top:30px;}
  .auth-publisher .auth-card{margin-top:24px;}
  .auth-card{padding:18px 18px 16px;box-shadow:0 24px 50px rgba(10,5,30,.45);}
  .auth-card-head{flex-direction:column;align-items:stretch;}
  .auth-seg{display:flex;}
  .auth-seg a,.auth-seg span{flex:1 1 0;height:auto;min-height:36px;font-size:13px;padding:4px 8px;white-space:normal;text-align:center;line-height:1.15;}
  .auth-back{margin-top:18px;}
  .auth-foot{flex-direction:column;align-items:center;gap:3px;padding:0 20px 18px;font-size:10.5px;text-align:center;}
}
@media (max-width:360px){
  .auth-top{padding-left:16px;padding-right:16px;}
  .auth-main{padding-left:16px;padding-right:16px;}
  .auth-card{padding:16px 14px 14px;}
  .auth-lang button{padding:0 3px;}
}
@media (prefers-reduced-motion:no-preference){
  .auth-btn,.auth-chip,.auth-seg a{transition:background-color .15s ease,border-color .15s ease;}
}
/* 회중 로고(Г·점) — 예전 「김포」 글자 동그라미 자리. */
.auth-logo{display:block;width:64px;height:64px;margin-bottom:26px;flex-shrink:0;}
@media (max-width:899px){ .auth-logo{width:52px;height:52px;margin-bottom:18px;} .auth-publisher .auth-logo{width:48px;height:48px;margin-bottom:14px;} }
