/*
 * 입찰 · 비입찰 공통 바탕 (QA-187, 범주 10-16 «입찰/비입찰 스타일 통일»)
 * - 입찰 현장 디자인 하네스(docs/plan-261006-입찰기능/입찰청약시스템/design-harness)를 들이며 bid.css 에 두었던 «모든 화면에 걸리는 꼴»을 옮겼다.
 *   호실 · 입찰가 · 보증금처럼 입찰에만 있는 부품은 bid.css 에 그대로 둔다.
 * - common/fragments.html :: header 가 style.css 뒤 · 현장 style.css 앞에 읽는다(입찰 현장은 bid.css 바로 앞).
 * - 글꼴 파일은 로컬(common/css/fonts.css 의 Pretendard → static/fonts/PretendardVariable.woff2). CDN 을 쓰지 않는다.
 * - 색은 넣지 않는다 — 현장 색은 각 현장 style.css 에 둔다.
 */

/* ── 글꼴: Pretendard 로 통일 — 기존 style.css 의 나눔고딕(*) · 나눔스퀘어(제목 · 단추) 지정을 덮는다 ── */
body, body * { font-family: Pretendard, -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', '맑은 고딕', 'malgun gothic', sans-serif !important; }
/* 자간: 기존 나눔 글꼴에 맞춘 좁은 자간(-0.05 ~ -0.12em)은 Pretendard 에서 글자가 붙어 보여 -0.02em 하나로 맞춘다.
   하단 버튼의 넓은 자간(기존 청약 버튼 모양 "확 인")만 그대로 둔다 */
body, body * { letter-spacing: -0.02em !important; }
/* Material Icons 는 글꼴 이름과 합자(ligature)가 곧 기능이다 — 위 전체 지정(!important)이 덮으면 아이콘이 «help_center» 같은 글자로 보인다.
   자간이 0 이 아니면 합자가 꺼지므로 letter-spacing 도 되돌린다 */
body .material-icons { font-family: 'Material Icons' !important; letter-spacing: normal !important; }
.button-container button { letter-spacing: 0.2em !important; }
/* 한글은 단어 중간에서 줄을 바꾸지 않는다(긴 영문 · 숫자는 칸 안에서 꺾음) */
body { word-break: keep-all; overflow-wrap: break-word; }

/* 개인/법인 전환 문구(span)가 기존 전체 규칙 * { 13px #666 } 에 걸려 제목보다 작고 흐려지지 않도록 */
h1 span.company-show, h1 span.company-hide,
h2 span.company-show, h2 span.company-hide,
dt span.company-show, dt span.company-hide,
dd span.company-show, dd span.company-hide { font-size: inherit !important; color: inherit !important; font-weight: inherit; font-family: inherit; }

/* 본인인증 정보 한 줄: 기존 dt 100px 고정 + dd 여백 50px 이라 폭이 좁으면 줄이 떨어짐 → 이름 칸을 글자 폭만큼 */
.apply .apply-container .privateInfo { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 36px; }
.apply .apply-container .privateInfo dl { float: none; display: flex; align-items: center; height: auto; margin: 0; }
.apply .apply-container .privateInfo dt { width: auto; float: none; margin-right: 12px; white-space: nowrap; }
.apply .apply-container .privateInfo dd { float: none; margin-right: 0; white-space: nowrap; }

/* 환불계좌 — 좁은 화면에서 예금주 줄이 깨지던 문제: 라벨 · 값을 한 줄 flex 로 두고, 예금주 이름 옆 [계좌인증]은 오른쪽 끝에 */
@media only screen and (max-width: 770px) {
  .refundBank dl { display: flex; align-items: center; }
  .refundBank dl dt { float: none; flex: 0 0 90px; width: 90px; }
  .refundBank dl dd { flex: 1 1 auto; min-width: 0; margin-left: 0; }
  .refundBank dl:last-of-type dd { display: flex; align-items: center; gap: 8px; }
  .refundBank dl:last-of-type dd > span { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .refundBank button.bk { flex: none; margin-left: auto !important; }
  .refundBank select, .refundBank input[type=text] { width: 100% !important; max-width: 100%; box-sizing: border-box; }
}

@media only screen and (max-width: 620px) {
  /* 신청할 수 없을 때(예외 화면): 기존 상자에 좌우 여백이 없어 글자가 화면 끝에 붙던 것 */
  .error-container { padding-left: 16px !important; padding-right: 16px !important; box-sizing: border-box; word-break: keep-all; }
  /* 납부 안내: 모바일은 항목이 한 줄(라벨 · 값)이라 값도 왼쪽 정렬 */
  .message-container .guide-point dd { align-items: flex-start; text-align: left; }
}

/* ── 공고 안내 — 입찰 현장에서 만든 꼴을 비입찰도 같이 쓴다(QA-187 2차) ── */
/* 안내 개요 표: 기존 dl(300px 고정)을 상자 폭에 맞게, 줄 사이는 점선 */
.body-container.notice .agreement-container dl { display: flex; width: auto; padding: 8px 0; border-bottom: 1px dotted #e5e5e5; }
.body-container.notice .agreement-container dl dt { flex-shrink: 0; width: 150px; float: none; color: #111; }
.body-container.notice .agreement-container dl dd { flex: 1; width: auto; float: none; color: #333; }
@media only screen and (max-width: 770px) {
  /* 좁은 화면에서는 왼쪽 항목 칸을 줄여 내용 칸을 넓힌다 */
  .body-container.notice .agreement-container dl dt { width: 96px; }
}
/* 유의사항: 굵은 글씨(strong)가 줄 간격을 벌리지 않게, 시안 값(15px · 400 · 들여쓰기 16px)으로 */
.body-container.notice .agreement-container p.li { font-size: 15px; font-weight: 400; letter-spacing: -0.3px; padding-left: 16px; text-indent: -16px; }
.body-container.notice .agreement-container p.li strong { line-height: inherit; font-size: inherit; }

/* 공고 PDF 띠(common/fragments :: noticePdfCard). 색은 현장 변수 — 입찰은 --bid-*, 비입찰은 --company-*, 둘 다 없으면 기본 파랑 */
.notice .noticeLink { margin: 12px 0 0; text-align: left; }
.notice .noticeLink a.notice-pdf-card {
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  padding: 22px 40px; border: 1px solid #e5e5e5; border-left: 3px solid var(--bid-accent, var(--company-accent, #0096de));
  background: var(--bid-accent-bg, var(--company-accent-bg, #eef7fc)); text-decoration: none;
}
.notice .noticeLink a.notice-pdf-card .txt { display: flex; flex-direction: column; gap: 4px; }
.notice .noticeLink a.notice-pdf-card .tit { color: #111; font-size: 17px; font-weight: 800; }
.notice .noticeLink a.notice-pdf-card .desc { color: #666; font-size: 14px; font-weight: 400; }
.notice .noticeLink a.notice-pdf-card .go {
  flex-shrink: 0; display: inline-flex; align-items: center; height: 40px; padding: 0 18px; border-radius: 3px;
  color: #fff; background: var(--bid-brand, var(--company-brand, #102060)); font-size: 14px; font-weight: 700;
}
.notice .noticeLink a.notice-pdf-card:hover .go { background: var(--bid-accent, var(--company-accent, #0096de)); }
@media only screen and (max-width: 620px) {
  .notice .noticeLink a.notice-pdf-card { flex-direction: column; align-items: flex-start; padding: 20px; }
}

/* ── 검수 미리보기 · 테스트 기간 안내는 빨강(예전 비입찰은 노랑) — 놓치면 안 되는 안내라 입찰 · 비입찰 같은 색(QA-187 2차) ── */
.result-body .preview-notice, .preview-notice { border-color: #c9151e; background-color: #fdeeee; color: #c9151e !important; font-weight: 600; }