/* ───────────────────────────────────────────────────────────────
   [추가 스타일] 시안(join.css, RCL)에는 없던 신규 추가분.
   회원가입(Join01, /Register) 분야 검색 전용 — 회차 콤보 옆 검색 버튼 + 분야 선택 모달.
   원래 Join01.razor 의 <style> 인라인이었던 것을 분리함(2026-06-25).
   join.css(시안) 뒤에 로드되어 회차 콤보(.join-round-group .form-select)만 override.
   시안 폼과 동일 회색 톤, flat(그림자·그라데이션 없음).
   ─────────────────────────────────────────────────────────────── */

/* 회차 콤보 + 분야 검색 버튼 (한 줄 배치) */
.join-round-group { display: inline-flex; align-items: center; max-width: 100%; gap: 8px; }
.join-round-group .form-select { flex: 0 1 420px; min-width: 0; }

/* 분야 검색 버튼 — btn-primary(인증번호 받기와 동일 톤) + 아이콘·라벨. 색은 시안 reset 회피 위해 직접 지정 */
.field-search-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; flex: 0 0 auto; white-space: nowrap; }
.field-search-btn span { font-weight: 600; }
.field-search-btn, .field-search-btn span, .field-search-btn .bi { color: #fff; }
.field-search-btn .bi { font-size: 18px; }

/* 분야 선택 팝업 */
.field-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.4); display: flex; align-items: center; justify-content: center; z-index: 1000; }
.field-modal { background: #fff; width: 92%; max-width: 600px; max-height: 82vh; border: 1px solid #d8d8d8; border-radius: 6px; display: flex; flex-direction: column; overflow: hidden; }
.field-modal-head { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; background: #f4f5f6; color: #333; font-size: 18px; font-weight: 600; border-bottom: 1px solid #e3e3e3; }
.field-modal-close { background: none; border: none; color: #888; font-size: 24px; cursor: pointer; line-height: 1; padding: 0 4px; }
.field-modal-close:hover { color: #333; }
.field-modal-search { padding: 16px 20px; border-bottom: 1px solid #eee; }
.field-modal-rounds { display: flex; align-items: center; justify-content: center; gap: 18px; padding: 12px; background: #fafafa; border-bottom: 1px solid #eee; }
.field-modal-rounds .move-arrow { width: 34px; height: 34px; border: 1px solid #ccc; border-radius: 4px; background: #fff; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0; }
.field-modal-rounds .move-arrow:hover:not(:disabled) { background: #f0f0f0; }
.field-modal-rounds .move-arrow:disabled { opacity: .3; cursor: default; }
.field-modal-rounds .move-arrow img { width: 14px; height: 14px; }
.field-modal-round-label { font-weight: 700; color: #393939; font-size: 17px; min-width: 96px; text-align: center; }
.field-modal-list { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 0; }
.field-grp-head { padding: 10px 20px 7px; font-weight: 600; color: #666; font-size: 14px; background: #f7f7f7; border-bottom: 1px solid #eee; position: sticky; top: 0; }
.field-item { padding: 13px 20px; cursor: pointer; font-size: 16px; color: #333; border-bottom: 1px solid #f0f0f0; line-height: 1.45; }
.field-item:hover { background: #f4f5f6; }
.field-modal-empty { padding: 44px 20px; text-align: center; color: #999; }

/* 단일 입력 필드 — 내국인여부 콤보 1개 폭에 맞춤 (join-double-select 의 flex:1 반 = gap 16px 빼고 절반).
   대상: 비밀번호, 비밀번호 재입력, 성명(한글), 생년월일 */
.join-half .form-control { width: calc((100% - 16px) / 2); flex: none; }

/* 생년월일 — 영문 입력(join-double-input) 한 칸의 반 = 전체의 1/4 */
.join-quarter .form-control { width: calc((100% - 16px) / 4); flex: none; min-width: 180px; }