/* 공용 폼 스타일 — 기준: difingo-agent. 신규 폼은 이 파일을 사용할 것.
   difingo-agent / uirestyler 의 인라인 style 이관은 별도 과제 */

/* 디자인 토큰 — difingo-agent :root 에서 추출 */
:root{
  --k-primary:#256ef4; --k-primary-60:#0b50d0;
  --k-gray-90:#1e2124; --k-gray-70:#464c53; --k-gray-50:#6d7882;
  --k-gray-40:#8a949e; --k-gray-20:#cdd1d5; --k-gray-10:#e6e8ea; --k-gray-5:#f4f5f6;
  --k-r-btn:6px; --k-r-panel:12px;
}

/* 카드 */
.di-form{ background:#fff; border:1px solid var(--k-gray-10); border-radius:var(--k-r-panel);
  padding:30px 30px 32px; box-shadow:0 14px 34px -22px rgba(30,33,36,.25); }
.di-form h3{ margin:0 0 4px; font-size:21px; font-weight:700; color:var(--k-gray-90); }
.di-form .fnote{ margin:0 0 20px; font-size:14px; color:var(--k-gray-50); }

/* 필드 */
.field{ margin-bottom:16px; }
.field label{ display:block; margin-bottom:6px; font-size:14px; font-weight:700; color:var(--k-gray-70); }
.field label .opt-note{ color:var(--k-gray-40); font-weight:400; }
.field input[type="text"],
.field input[type="email"],
.field input[type="tel"],
.field input[type="number"],
.field input[type="url"],
.field select{ width:100%; height:48px; padding:0 14px; box-sizing:border-box;
  border:1px solid var(--k-gray-20); border-radius:var(--k-r-btn); font-size:15px; color:var(--k-gray-90);
  font-family:inherit; background:#fff; transition:border-color .15s; }
.field input[type="text"]:focus,
.field input[type="email"]:focus,
.field input[type="tel"]:focus,
.field input[type="number"]:focus,
.field input[type="url"]:focus,
.field select:focus,
.field textarea:focus{ outline:none; border-color:var(--k-primary); }
.field input[type="text"][readonly],
.field input[type="email"][readonly],
.field input[type="tel"][readonly],
.field input[type="number"][readonly],
.field input[type="url"][readonly]{ background:var(--k-gray-5); color:var(--k-gray-70); }

/* textarea — difingo 원본엔 없어 신규 정의. input 과 동일 톤 + min-height:120px */
.field textarea{ width:100%; box-sizing:border-box; padding:12px 14px; min-height:120px;
  border:1px solid var(--k-gray-20); border-radius:var(--k-r-btn); font-size:15px; color:var(--k-gray-90);
  font-family:inherit; background:#fff; transition:border-color .15s; resize:vertical; }

/* 체크박스 (동의 등) */
.check{ display:flex; align-items:center; gap:8px; margin:4px 0 20px; font-size:14px;
  color:var(--k-gray-70); cursor:pointer; }
.check input{ width:16px; height:16px; accent-color:var(--k-primary); }
.check span{ flex:1 1 auto; min-width:0; }

/* 오류 문구 — difingo 인라인 style 을 클래스로 이관 */
.cerr{ margin:10px 0; color:#f05f42; font-size:14px; line-height:1.5; }

/* 제출 버튼 */
.di-btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; height:52px;
  padding:0 28px; border-radius:var(--k-r-btn); background:var(--k-primary); color:#fff;
  font-size:16px; font-weight:700; text-decoration:none; border:0; cursor:pointer;
  transition:background .18s; font-family:inherit; }
.di-btn:hover{ background:var(--k-primary-60); }
.di-form .di-btn{ width:100%; }

/* 반응형 (<=900) */
@media (max-width:900px){
  .di-form{ padding:24px 20px 26px; }
}

/* contact-form 이 grid(gap:18px) 라 .field margin 과 이중 간격 → block 오버라이드 (pages.css 미수정, gap 은 block 에서 무효) */
.di-form .contact-form{ display:block; }

/* EZFORM-V2:START -- 동의 오류표시(.cerr) + 필수강조(.req) + 폼 폭(.di-form) (patch_contact_form_v2) */
:root{ --k-danger-40:#f05f42; }
.req{ color:var(--k-danger-40); font-weight:700; }
.di-form{ max-width:760px; }
.check a{ color:var(--k-primary); text-decoration:underline; text-underline-offset:2px; }
.check a:hover{ color:var(--k-primary-60); }
/* EZFORM-V2:END */
