@charset "utf-8";
/* ═══════════════════════════════════════════════════════════════
   2026 KAID 추계학술대회 — 치과 스탭 등록
   디자인 토큰: .impeccable.md 준수
   ═══════════════════════════════════════════════════════════════ */

:root{
  --kaid-primary:#495FA1;
  --kaid-navy:#1A264B;
  --kaid-navy-2:#364F6B;
  --kaid-grad:linear-gradient(277deg,#495FA1 0%,#1A264B 100%);
  --kaid-text:#505050;
  --kaid-text-strong:#111;
  --kaid-muted:#999;
  --kaid-line:#E5E5EC;
  --kaid-line-2:#E9E9E9;
  --kaid-bg:#F8F8FA;
  --kaid-bg-2:#F1F1F5;
  --kaid-accent:#3A8AFD;
  --kaid-error:#E30000;
  --kaid-ok:#1A7F37;
}

*{box-sizing:border-box}

html{font-size:62.5%}

body.kstaff{
  margin:0;
  padding:0;
  background:var(--kaid-bg);
  color:var(--kaid-text);
  font-family:'Pretendard','Pretendard Variable',-apple-system,BlinkMacSystemFont,'Malgun Gothic','맑은 고딕',sans-serif;
  font-size:1.6rem;
  line-height:1.65;
  -webkit-text-size-adjust:100%;
}

.kstaff a{color:var(--kaid-accent);text-decoration:none}
.kstaff a:hover{text-decoration:underline}

/* ── 레이아웃 ──────────────────────────────────────────────── */
.ks-wrap{max-width:820px;margin:0 auto;padding:0 16px 80px}

.ks-header{
  background:var(--kaid-grad);
  color:#fff;
  padding:40px 16px 36px;
  margin-bottom:32px;
  text-align:center;
}
.ks-header .ks-h-inner{max-width:820px;margin:0 auto}
.ks-header h1{
  margin:0 0 10px;
  font-size:2.4rem;
  font-weight:700;
  line-height:1.4;
  letter-spacing:-0.02em;
}
.ks-header .ks-sub{
  margin:0;
  font-size:1.6rem;
  opacity:.92;
  font-weight:400;
}
.ks-header .ks-badge{
  display:inline-block;
  margin-bottom:14px;
  padding:6px 14px;
  border:1px solid rgba(255,255,255,.5);
  border-radius:100px;
  font-size:1.3rem;
  letter-spacing:.02em;
}

/* ── 카드 ─────────────────────────────────────────────────── */
.ks-card{
  background:#fff;
  border:1px solid var(--kaid-line);
  border-radius:8px;
  padding:28px;
  margin-bottom:20px;
}
.ks-card.is-disabled{opacity:.45;pointer-events:none}

.ks-step-head{
  display:flex;
  align-items:center;
  gap:12px;
  margin:0 0 6px;
}
.ks-step-no{
  flex:0 0 auto;
  width:30px;height:30px;
  border-radius:50%;
  background:var(--kaid-primary);
  color:#fff;
  font-size:1.5rem;
  font-weight:700;
  display:flex;align-items:center;justify-content:center;
}
.ks-card.is-disabled .ks-step-no{background:var(--kaid-muted)}
.ks-step-head h2{
  margin:0;
  font-size:1.9rem;
  font-weight:700;
  color:var(--kaid-text-strong);
  letter-spacing:-0.02em;
}
.ks-step-desc{
  margin:0 0 20px 42px;
  font-size:1.45rem;
  color:var(--kaid-muted);
}

/* ── 폼 ───────────────────────────────────────────────────── */
.ks-field{margin-bottom:16px}
.ks-field:last-child{margin-bottom:0}
.ks-label{
  display:block;
  margin-bottom:7px;
  font-size:1.5rem;
  font-weight:600;
  color:var(--kaid-text-strong);
}
.ks-req{color:var(--kaid-error);margin-left:2px}

.ks-input,
.ks-select{
  width:100%;
  min-height:48px;
  padding:11px 14px;
  border:1px solid var(--kaid-line);
  border-radius:6px;
  background:#fff;
  color:var(--kaid-text-strong);
  font-size:1.6rem;
  font-family:inherit;
  transition:border-color .15s, box-shadow .15s;
}
.ks-input:focus,
.ks-select:focus{
  outline:none;
  border-color:var(--kaid-primary);
  box-shadow:0 0 0 3px rgba(73,95,161,.15);
}
.ks-input::placeholder{color:#BBB}
.ks-input.is-error{border-color:var(--kaid-error)}
.ks-input:disabled,.ks-select:disabled{background:var(--kaid-bg-2);color:var(--kaid-muted)}

.ks-err-msg{
  display:none;
  margin-top:6px;
  font-size:1.35rem;
  color:var(--kaid-error);
  font-weight:600;
}
.ks-err-msg.show{display:block}

.ks-row{display:flex;gap:10px;align-items:flex-start}
.ks-row .ks-input{flex:1}

/* ── 버튼 ─────────────────────────────────────────────────── */
.ks-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:12px 24px;
  border:1px solid transparent;
  border-radius:6px;
  font-size:1.6rem;
  font-family:inherit;
  font-weight:600;
  cursor:pointer;
  transition:background .15s, border-color .15s;
}
.ks-btn:focus-visible{outline:3px solid rgba(58,138,253,.5);outline-offset:2px}

.ks-btn-primary{background:var(--kaid-primary);color:#fff}
.ks-btn-primary:hover{background:#3C4F88}
.ks-btn-primary:disabled{background:#C6CBD9;cursor:not-allowed}

.ks-btn-line{background:#fff;border-color:var(--kaid-line);color:var(--kaid-text)}
.ks-btn-line:hover{border-color:var(--kaid-primary);color:var(--kaid-primary)}

.ks-btn-lg{width:100%;min-height:58px;font-size:1.8rem}

.ks-btn-sm{min-height:38px;padding:6px 14px;font-size:1.4rem}

/* ── 원장 검색 결과 ────────────────────────────────────────── */
.ks-doctor-list{margin-top:18px;display:grid;gap:10px}

.ks-doctor{
  display:block;
  border:1.5px solid var(--kaid-line);
  border-radius:8px;
  padding:16px 18px;
  cursor:pointer;
  background:#fff;
  transition:border-color .15s, background .15s;
}
.ks-doctor:hover{border-color:var(--kaid-primary);background:#FAFBFF}
.ks-doctor input{position:absolute;opacity:0;width:0;height:0}
.ks-doctor.is-on{border-color:var(--kaid-primary);background:#F3F6FF}

.ks-doctor .ks-d-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ks-doctor .ks-d-name{font-size:1.7rem;font-weight:700;color:var(--kaid-text-strong)}
.ks-doctor .ks-d-tag{
  font-size:1.25rem;padding:3px 9px;border-radius:100px;
  background:var(--kaid-bg-2);color:var(--kaid-navy-2);font-weight:600;
}
.ks-doctor .ks-d-hosp{margin-top:5px;font-size:1.5rem;color:var(--kaid-text)}
.ks-doctor .ks-d-phone{margin-top:2px;font-size:1.35rem;color:var(--kaid-muted)}
.ks-doctor.is-on .ks-d-check::after{content:'선택됨';color:var(--kaid-primary);font-weight:700;font-size:1.35rem}

.ks-empty{
  margin-top:18px;padding:22px;text-align:center;
  background:var(--kaid-bg-2);border-radius:8px;
  font-size:1.5rem;color:var(--kaid-text);
}
.ks-empty strong{display:block;margin-bottom:6px;color:var(--kaid-text-strong);font-size:1.6rem}

/* ── 선택 확정 표시 ────────────────────────────────────────── */
.ks-picked{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  border:1.5px solid var(--kaid-primary);
  background:#F3F6FF;
  border-radius:8px;
  padding:16px 18px;
}
.ks-picked .ks-p-name{font-size:1.7rem;font-weight:700;color:var(--kaid-navy)}
.ks-picked .ks-p-hosp{font-size:1.5rem;color:var(--kaid-text);margin-top:3px}

/* ── 인원 선택 ────────────────────────────────────────────── */
.ks-count-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:8px;
  margin-bottom:22px;
}
.ks-count{
  position:relative;
  display:flex;align-items:center;justify-content:center;
  min-height:52px;
  border:1.5px solid var(--kaid-line);
  border-radius:6px;
  background:#fff;
  font-size:1.6rem;
  font-weight:600;
  color:var(--kaid-text);
  cursor:pointer;
  transition:all .15s;
}
.ks-count input{position:absolute;opacity:0;width:0;height:0}
.ks-count:hover{border-color:var(--kaid-primary);color:var(--kaid-primary)}
.ks-count.is-on{background:var(--kaid-primary);border-color:var(--kaid-primary);color:#fff}

/* ── 금액 박스 ────────────────────────────────────────────── */
.ks-price{
  border:1px solid var(--kaid-line);
  border-radius:8px;
  overflow:hidden;
}
.ks-price-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:13px 18px;
  font-size:1.5rem;
  border-bottom:1px solid var(--kaid-line-2);
}
.ks-price-row .ks-pr-label{color:var(--kaid-text)}
.ks-price-row .ks-pr-val{font-weight:600;color:var(--kaid-text-strong)}
.ks-price-row.is-free .ks-pr-val{color:var(--kaid-ok)}
.ks-price-total{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px;
  background:var(--kaid-navy);
  color:#fff;
  border-bottom:0;
}
.ks-price-total .ks-pr-label{font-size:1.6rem;font-weight:600}
.ks-price-total .ks-pr-val{font-size:2.4rem;font-weight:800;letter-spacing:-0.02em}

.ks-notice{
  margin-top:14px;
  padding:14px 16px;
  background:#FFF9E8;
  border:1px solid #F0DFA8;
  border-radius:6px;
  font-size:1.45rem;
  color:#7A5C00;
}
.ks-notice strong{color:#5C4500}

.ks-info{
  margin-top:14px;
  padding:14px 16px;
  background:var(--kaid-bg-2);
  border-radius:6px;
  font-size:1.4rem;
  color:var(--kaid-text);
}
.ks-info ul{margin:6px 0 0;padding-left:18px}
.ks-info li{margin-bottom:4px}

/* ── 스탭 입력 블록 ────────────────────────────────────────── */
.ks-staff-block{
  border:1px solid var(--kaid-line);
  border-radius:8px;
  padding:20px;
  margin-bottom:14px;
  background:#fff;
}
.ks-staff-block.is-free{border-color:#9FD3AC;background:#F5FCF7}

.ks-sb-head{
  display:flex;align-items:center;gap:9px;
  margin-bottom:16px;
  padding-bottom:12px;
  border-bottom:1px solid var(--kaid-line-2);
}
.ks-sb-head h3{margin:0;font-size:1.6rem;font-weight:700;color:var(--kaid-text-strong)}
.ks-free-tag{
  padding:3px 10px;border-radius:100px;
  background:var(--kaid-ok);color:#fff;
  font-size:1.25rem;font-weight:700;
}

.ks-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}

/* ── 약관 ─────────────────────────────────────────────────── */
.ks-terms{border:1px solid var(--kaid-line);border-radius:8px;overflow:hidden}

.ks-term-item{border-bottom:1px solid var(--kaid-line-2)}
.ks-term-item:last-child{border-bottom:0}

.ks-term-head{
  display:flex;align-items:center;gap:10px;
  padding:15px 18px;
  background:#fff;
}
.ks-term-head label{
  flex:1;
  display:flex;align-items:center;gap:9px;
  cursor:pointer;
  font-size:1.5rem;
  font-weight:600;
  color:var(--kaid-text-strong);
  min-height:28px;
}
.ks-term-head .ks-tag-req{
  color:var(--kaid-error);
  font-size:1.35rem;
  font-weight:700;
}
.ks-term-toggle{
  background:none;border:0;
  color:var(--kaid-accent);
  font-size:1.35rem;
  font-family:inherit;
  cursor:pointer;
  padding:6px 8px;
  text-decoration:underline;
  min-height:38px;
}
.ks-term-body{
  display:none;
  max-height:260px;
  overflow-y:auto;
  padding:16px 18px;
  background:var(--kaid-bg-2);
  border-top:1px solid var(--kaid-line-2);
  font-size:1.35rem;
  line-height:1.7;
  white-space:pre-wrap;
  color:var(--kaid-text);
}
.ks-term-body.show{display:block}

.ks-term-all{
  display:flex;align-items:center;gap:9px;
  padding:16px 18px;
  background:#F3F6FF;
  border-top:2px solid var(--kaid-primary);
  cursor:pointer;
  font-size:1.55rem;
  font-weight:700;
  color:var(--kaid-navy);
  min-height:56px;
}

input[type=checkbox].ks-cb{
  width:22px;height:22px;
  flex:0 0 auto;
  accent-color:var(--kaid-primary);
  cursor:pointer;
  margin:0;
}

/* ── 결제수단 ─────────────────────────────────────────────── */
.ks-pay-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ks-pay{
  position:relative;
  display:flex;align-items:center;justify-content:center;
  min-height:54px;
  border:1.5px solid var(--kaid-line);
  border-radius:6px;
  background:#fff;
  font-size:1.6rem;font-weight:600;color:var(--kaid-text);
  cursor:pointer;transition:all .15s;
}
.ks-pay input{position:absolute;opacity:0;width:0;height:0}
.ks-pay:hover{border-color:var(--kaid-primary)}
.ks-pay.is-on{background:var(--kaid-primary);border-color:var(--kaid-primary);color:#fff}

/* ── 결과 페이지 ──────────────────────────────────────────── */
.ks-result{text-align:center;padding:40px 28px}
.ks-result .ks-r-icon{
  width:72px;height:72px;margin:0 auto 20px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:3.6rem;color:#fff;
}
.ks-result .ks-r-icon.ok{background:var(--kaid-ok)}
.ks-result .ks-r-icon.ng{background:var(--kaid-error)}
.ks-result h2{margin:0 0 10px;font-size:2.2rem;color:var(--kaid-text-strong);font-weight:700}
.ks-result p{margin:0 0 6px;font-size:1.55rem}

.ks-table{width:100%;border-collapse:collapse;margin-top:24px;text-align:left}
.ks-table th,.ks-table td{
  border-bottom:1px solid var(--kaid-line);
  padding:13px 14px;
  font-size:1.5rem;
  vertical-align:middle;
}
.ks-table th{
  background:var(--kaid-bg-2);
  color:var(--kaid-text-strong);
  font-weight:600;
  white-space:nowrap;
}
.ks-table thead th{border-bottom:2px solid var(--kaid-line)}
.ks-table td.num{text-align:right;font-variant-numeric:tabular-nums}

.ks-chip{display:inline-block;padding:3px 10px;border-radius:100px;font-size:1.3rem;font-weight:700}
.ks-chip.ok{background:#E8F6EC;color:var(--kaid-ok)}
.ks-chip.wait{background:#FFF4E5;color:#B26B00}
.ks-chip.ng{background:#FDECEC;color:var(--kaid-error)}
.ks-chip.free{background:#E8F6EC;color:var(--kaid-ok)}

/* ── 로딩 오버레이 ────────────────────────────────────────── */
.ks-loading{
  display:none;
  position:fixed;inset:0;
  background:rgba(255,255,255,.82);
  z-index:9999;
  align-items:center;justify-content:center;
  flex-direction:column;gap:16px;
}
.ks-loading.show{display:flex}
.ks-spinner{
  width:44px;height:44px;
  border:4px solid var(--kaid-line);
  border-top-color:var(--kaid-primary);
  border-radius:50%;
  animation:ks-spin .8s linear infinite;
}
@keyframes ks-spin{to{transform:rotate(360deg)}}
.ks-loading p{font-size:1.5rem;font-weight:600;color:var(--kaid-navy);margin:0}

.ks-foot{
  margin-top:28px;text-align:center;
  font-size:1.4rem;color:var(--kaid-muted);
  line-height:1.8;
}
.ks-foot strong{color:var(--kaid-text)}

/* ── 마감 안내 ────────────────────────────────────────────── */
.ks-closed{
  text-align:center;padding:56px 28px;
}
.ks-closed h2{margin:0 0 12px;font-size:2.2rem;color:var(--kaid-text-strong)}
.ks-closed p{font-size:1.6rem;margin:0}

/* ── 모바일 ───────────────────────────────────────────────── */
@media (max-width:640px){
  .ks-header{padding:30px 16px 26px}
  .ks-header h1{font-size:1.95rem}
  .ks-header .ks-sub{font-size:1.4rem}
  .ks-wrap{padding:0 12px 60px}
  .ks-card{padding:20px 16px}
  .ks-step-head h2{font-size:1.7rem}
  .ks-step-desc{margin-left:0;font-size:1.4rem}
  .ks-count-grid{grid-template-columns:repeat(5,1fr);gap:6px}
  .ks-count{min-height:48px;font-size:1.5rem}
  .ks-grid-2{grid-template-columns:1fr;gap:14px}
  .ks-price-total .ks-pr-val{font-size:2rem}
  .ks-picked{flex-direction:column;align-items:flex-start}
  .ks-table th,.ks-table td{padding:10px 8px;font-size:1.4rem}
}