/* ===================================
   053 시험상담 — 페이지 전용 CSS
   개인정보 수집·이용 약관 영역(.terms__*) 스타일.
   검증 컴포넌트(00_common 회원가입 STEP01 약관동의 / components_login_v2.css #15)의
   .terms__* 규칙을 이 페이지 한정으로 이식한다.
   - login 전용 CSS(components_login*.css) 전체 로드 회피 → 타 페이지 영향 0
   - 값은 원 컴포넌트와 동일하게 유지(회원가입 약관 영역과 시각 일치)
   =================================== */

.terms__section {
    margin-bottom: var(--gap-form-divider);
}

.terms__section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space-4);
}

.terms__section-header .form-check__label {
    font-size: var(--fs-body);
}

.terms__section-title {
    font-size: var(--fs-title-sm); /* 28px — content-body__title(h3) 기준 */
    font-weight: var(--fw-bold);
    color: var(--color-gray-900);
}

.terms__required {
    color: var(--color-error);
}

.terms__content {
    height: 240px; /* 원 컴포넌트와 동일 — 스크롤 영역 고정 높이 */
    overflow-y: auto;
    padding: var(--space-6);
    background-color: var(--color-gray-100);
    border: 1px solid var(--color-gray-300);
    border-radius: var(--radius-md);
    font-size: var(--fs-small);
    line-height: var(--lh-body);
    color: var(--color-gray-700);
}

.terms__content p + p {
    margin-top: var(--space-3);
}

.terms__agree {
    margin-top: var(--space-3);
}

/* ===================================
   '기타' 선택 시 활성화되는 인라인 직접입력
   - 라디오/체크박스 '기타' 우측에 컴팩트 입력창
   - 기본 비활성(disabled), 053_consult.js가 토글
   =================================== */
.consult-etc {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
}

.consult-etc__input {
    width: 180px;   /* 구조 수치 — 전폭 대신 컴팩트 고정폭 */
    flex: 0 0 auto;
}

.consult-etc__input:disabled {
    background-color: var(--color-gray-100);
    color: var(--color-gray-500);
    cursor: not-allowed;
}

/* ===================================
   스텝 위저드 간격 토큰
   =================================== */

/* step-indicator → 첫 스텝 콘텐츠 (탭 nav → 콘텐츠 표준과 동일) */
.step-indicator + .consult-step {
    margin-top: var(--gap-layout-tab-content); /* var(--space-6) */
}

/* 스텝 내 복수 h2 섹션 사이 (Step 4: 아코디언 div → 다음 h2) */
.consult-step > * + .content-block__title {
    margin-top: var(--gap-layout-section-compact); /* var(--space-16) */
}

/* 스텝 하단 이전/다음 버튼 그룹 위 간격 */
.consult-step > .btn-group {
    margin-top: var(--gap-layout-h3-top); /* var(--space-10) */
}

/* member-form 내 verify-box → form-group 경계선 */
.member-form > .verify-box {
    margin-bottom: var(--gap-form-divider); /* var(--space-8) */
}

/* 파일 첨부 버튼 + 파일 목록 가로 배치 */
.file-upload-row {
    display: flex;
    align-items: center;
    gap: var(--space-4); /* var(--space-4) */
    flex-wrap: wrap;
}

.file-upload-row .file-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2); /* var(--space-2) */
    list-style: none;
    padding: 0;
    margin: 0;
}

/* file-item margin-top 초기화 (file-upload-row 인라인 배치 시 밀림 방지) */
.file-upload-row .file-item {
    margin-top: 0;
    align-self: center;
}

/* file-item 내 파일명·용량 좌우 배치 */
.file-upload-row .file-item__info {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    gap: var(--space-3); /* var(--space-3) */
}

/* ===================================
   휴대폰 본인인증 모달 — NICE 본인확인 표준창 자리표시
   실제 운영 시 이 영역이 NICE 표준창(iframe/팝업)으로 대체됨.
   =================================== */
.nice-verify {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--space-3);
    padding: var(--space-8) var(--space-6);
    background-color: var(--color-gray-100);
    border: 1px dashed var(--color-gray-300);
    border-radius: var(--radius-md);
}

.nice-verify__icon {
    color: var(--color-primary-700);
}

.nice-verify__title {
    font-size: var(--fs-title-sm);
    font-weight: var(--fw-bold);
    color: var(--color-gray-900);
}

.nice-verify__desc {
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    color: var(--color-gray-700);
}

.nice-verify__note {
    font-size: var(--fs-small);
    color: var(--color-gray-500);
}

/* ===================================
   온라인 상담확인 — 조회 결과(게시판) 영역
   목록(board-list) ↔ 상세(board-view) 토글, dear-consult-verify.js가 제어.
   =================================== */
#lookupResult {
    margin-top: var(--gap-layout-tab-content); /* 본인확인 섹션 → 조회결과 */
}

/* 게시판 상세 하단 '목록' 버튼 간격 */
#lookupResult .board-view .btn-group {
    margin-top: var(--gap-layout-h3-top);
}

/* 상담확인 상세 헤더 — 제목의 기본 하단 여백이 배지 정렬을 밀지 않도록 보정 */
#lookupResult .consult-detail__heading {
    gap: var(--space-2);
    flex-wrap: wrap;
    margin-bottom: var(--space-2);
}

#lookupResult .consult-detail__title {
    margin-bottom: 0;
}

#lookupResult .consult-detail__heading .tag {
    flex: 0 0 auto;
    margin-top: 2px;
}

#lookupResult .consult-detail__summary {
    margin-bottom: var(--space-5);
}

/* 상세 정보 표(table--label) — fixed layout에서는 th min-width가 무시되어 상세 영역만 auto로 전환 */
#lookupResult .consult-detail__table {
    table-layout: auto;
}

#lookupResult .consult-detail__table tbody th {
    width: 160px;
    min-width: 160px;
    white-space: nowrap;
}

#lookupResult .consult-detail__table tbody td {
    white-space: normal;
    overflow-wrap: anywhere;
}

#lookupResult .consult-detail__table .form-check-group {
    gap: var(--space-3) var(--space-5);
}

#lookupResult .consult-detail__table .consult-etc__input {
    width: 220px;
}

/* 의뢰시험 항목 상세 — 항목별 세부값을 행 안에서 라벨/값 단위로 정돈 */
#lookupResult .consult-detail-item {
    display: grid;
    gap: var(--space-3);
}

#lookupResult .consult-detail-item .form-group {
    display: grid;
    grid-template-columns: minmax(96px, max-content) minmax(180px, 260px);
    align-items: center;
    gap: var(--space-2) var(--space-4);
    margin: 0;
}

#lookupResult .consult-detail-item .form-label {
    margin: 0;
    color: var(--color-gray-700);
    font-weight: var(--fw-semibold);
    white-space: nowrap;
}

#lookupResult .consult-detail-item .form-check-group {
    padding: var(--space-1) 0;
}

@media (max-width: 767px) {
  #lookupResult .consult-detail__table {
    min-width: 560px;
  }

  #lookupResult .consult-detail__table tbody th {
    width: 120px;
    min-width: 120px;
  }

  #lookupResult .consult-detail-item .form-group {
    grid-template-columns: 1fr;
  }

  #lookupResult .consult-detail__table .consult-etc__input {
    width: 100%;
  }
}

/* 조회 목록 컬럼 너비 — 탭 패널 폭에 맞춰 가로 스크롤 방지 (구분/처리상태 가운데, 등록일 축약) */
#lookupList .td-writer { width: 92px; text-align: center; }
#lookupList .td-status { width: 96px; text-align: center; }
#lookupList .td-date-sm { width: 104px; color: var(--color-gray-600); }

@media (max-width: 767px) {
  /* 동의서 스크롤 박스: 좁은 화면에서 높이 축소 */
  .terms__content {
    height: 160px;
  }
  /* 기타 직접입력 인풋: 고정폭 해제 → 전폭 */
  .consult-etc__input {
    width: 100%;
    flex: 1 1 auto;
  }
  /* 파일 업로드 행: 모바일에서 세로 스택 */
  .file-upload-row {
    flex-direction: column;
    align-items: flex-start;
  }
}