/* 내차 팔기 접수 폼의 '연락받을 정보' 칸과 알림 창 (js/sell-request.js 가 넣는다).
   다섯 화면이 같은 칸을 쓰므로 모양도 이 파일 한 곳에 둔다(2026-09-15). */

.cc-sell-contact {
  margin: 2rem 0 1.4rem;
  padding: 1.4rem 1.5rem;
  border: 1px solid var(--gray-200);
  border-left: 4px solid var(--green-600);
  border-radius: var(--radius-md);
  background: #f6faf8;
  word-break: keep-all;
}
.cc-sell-contact-title { font-weight: 700; font-size: 1.1rem; color: var(--green-900); }
.cc-sell-contact-title span { font-weight: 500; font-size: 0.85rem; color: #b3253a; margin-left: 0.2rem; }
.cc-sell-contact-desc { margin: 0.25rem 0 1rem; font-size: 0.9rem; color: var(--gray-500); }
.cc-sell-contact-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.9rem 1rem; }
.cc-sell-field label { display: block; font-size: 0.88rem; font-weight: 600; color: var(--green-900); margin-bottom: 0.35rem; }
.cc-sell-field .form-control { margin-bottom: 0; }
.cc-sell-agree { display: flex; align-items: flex-start; gap: 0.5rem; margin: 1rem 0 0; font-size: 0.9rem; color: var(--green-900); cursor: pointer; }
.cc-sell-agree input { width: 1.05rem; height: 1.05rem; margin-top: 0.2rem; flex: none; accent-color: var(--green-600); }
.cc-sell-agree span { color: #b3253a; }

/* 잘못 적은 칸 — 색만으로 알리지 않고 두께도 바꾼다 */
form[data-cc-sell] [aria-invalid="true"] { border-color: #b3253a !important; box-shadow: 0 0 0 2px rgba(179, 37, 58, 0.18) !important; }
form[data-cc-sell] input[type="checkbox"][aria-invalid="true"] { outline: 2px solid #b3253a; outline-offset: 2px; }

form[data-cc-sell] [type="submit"][aria-busy="true"] { opacity: 0.7; cursor: progress; }

@media (max-width: 575.98px) {
  .cc-sell-contact { padding: 1.1rem 1rem; }
  .cc-sell-contact-row { grid-template-columns: 1fr; }
}

.cc-sell-modal { border: none; border-radius: 1.1rem; text-align: center; padding: 2rem 1.5rem; }
.cc-sell-modal-icon { font-size: 2.4rem; color: var(--green-600); margin-bottom: 0.7rem; }
.cc-sell-modal-icon.is-error { color: #e0334d; }
.cc-sell-modal-title { font-weight: 700; font-size: 1.05rem; color: #1c231f; margin: 0 0 0.8rem; }
.cc-sell-modal-list { text-align: left; font-size: 0.88rem; color: var(--gray-500); padding-left: 1.2rem; margin: 0 0 1.2rem; }
.cc-sell-modal-desc { font-size: 0.88rem; color: var(--gray-500); margin: 0 0 1.2rem; word-break: keep-all; }
.cc-sell-modal-btn { background: var(--green-600); color: #fff; border: none; border-radius: 50px; padding: 0.6rem 2.2rem; font-weight: 600; }
.cc-sell-modal-btn:hover { background: var(--green-900); }

/* 개인 직거래 — 차량 소유 확인(허위 매물 방지). 서류를 받는 자리라 연락처 칸과 같은 모양의 판으로 가른다. */
.cc-sell-verify {
  margin: 0 0 1.8rem;
  padding: 1.3rem 1.4rem;
  border: 1px solid var(--gray-200);
  border-left: 4px solid var(--green-600);
  border-radius: var(--radius-md);
  background: #f6faf8;
  word-break: keep-all;
}
.cc-sell-verify-title { display: flex; align-items: center; gap: 0.45rem; font-size: 1.1rem; font-weight: 700; color: var(--green-900); margin: 0; }
.cc-sell-verify-title i { color: var(--green-600); }
.cc-sell-verify-title span { font-weight: 500; font-size: 0.85rem; color: #b3253a; }
.cc-sell-verify-desc { margin: 0.35rem 0 1rem; font-size: 0.9rem; color: var(--gray-500); }
.cc-sell-verify-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.9rem 1rem; margin-bottom: 0.9rem; }
.cc-sell-field label small { font-weight: 400; color: var(--gray-500); }
.cc-sell-verify-hint { margin: 0; font-size: 0.84rem; color: var(--gray-500); }
@media (max-width: 575.98px) {
  .cc-sell-verify { padding: 1.1rem 1rem; }
  .cc-sell-verify-row { grid-template-columns: 1fr; }
}

/* 개인 직거래 — 사진 파일은 이 접수로 받지 않는다는 안내 */
.cc-sell-photo-note { margin: -0.4rem 0 1rem; font-size: 0.88rem; color: var(--gray-500); word-break: keep-all; }