/* =====================================================================
   Contact Form 7 上書きスタイル（お問い合わせページ専用）
   静的HTML版のフォームデザイン（.cform / .radio-opt 等）を
   CF7 が生成するマークアップ上で再現する。
   ===================================================================== */

/* CF7 のラッパー要素をレイアウトに影響させない */
.cform .wpcf7-form-control-wrap{display:block;min-width:0;}
/* 注意：この一括指定はテーマ側の <p>（.cform-note / .field-extra-label 等）にも当たるため、
   余白が必要なものは page-contact.css 側で `.cform .xxx` と詳細度を上げて指定している。 */
.cform p{margin:0;}

/* --- ラジオ（お問い合わせ種別）：ラジオカードの再現 --- */
.radio-row .wpcf7-form-control-wrap,
.radio-row .wpcf7-radio{display:contents;}
.cform .wpcf7-radio .wpcf7-list-item{
  margin:0;
  flex:1 1 clamp(190px,13.3vw,253px);
  display:block;
}
.cform .wpcf7-radio .wpcf7-list-item label{
  position:relative;
  display:flex;align-items:center;gap:clamp(8px,.55vw,11px);cursor:pointer;
  background:#fff;border:2px solid #EFE9E4;
  border-radius:clamp(6px,.49vw,9px);
  padding:clamp(11px,1vw,19px) clamp(12px,1.07vw,20px);
  color:var(--body);font-weight:700;line-height:1.5;
  font-size:clamp(14px,calc(var(--fvw,1vw)*.83),16px);
  transition:border-color .2s,background-color .2s,color .2s;
}
.cform .wpcf7-radio input[type="radio"]{
  position:absolute;width:1px;height:1px;opacity:0;margin:0;padding:0;border:none;
}
/* ラジオドット */
.cform .wpcf7-radio .wpcf7-list-item label::before{
  content:"";flex:none;box-sizing:border-box;
  width:clamp(17px,.97vw,19px);height:clamp(17px,.97vw,19px);
  border:2px solid #DED7CE;border-radius:50%;background:#fff;
  transition:border-color .2s,background .18s ease;
}
.cform .wpcf7-radio .wpcf7-list-item label:hover{border-color:#F5C79A;}
.cform .wpcf7-radio .wpcf7-list-item label:has(input:checked){
  border-color:var(--orange);background:#FFF6EE;color:var(--ink);
}
.cform .wpcf7-radio .wpcf7-list-item label:has(input:checked)::before{
  border-color:var(--orange);
  background:radial-gradient(closest-side,var(--orange) 52%,#fff 56%);
}
.cform .wpcf7-radio .wpcf7-list-item label:has(input:focus-visible){
  outline:2px solid var(--orange);outline-offset:3px;
}
.cform .wpcf7-list-item-label{min-width:0;}

/* --- バリデーションエラー表示（.field-error と同じトーン） --- */
.cform .wpcf7-not-valid-tip{
  display:block;color:#D6482A;font-weight:700;line-height:1.6;
  font-size:clamp(11px,calc(var(--fvw,1vw)*.69),13px);
  margin-top:clamp(6px,.55vw,11px);
}
.cform input.wpcf7-not-valid,
.cform textarea.wpcf7-not-valid{border-color:#D6482A;}

/* --- 送信スピナー --- */
.cform .wpcf7-spinner{margin:0 0 0 12px;vertical-align:middle;}

/* --- 応答メッセージ --- */
.cform .wpcf7-response-output{
  margin:clamp(18px,1.6vw,28px) 0 0;border:none;padding:clamp(14px,1.2vw,20px) clamp(16px,1.4vw,24px);
  border-radius:clamp(8px,.7vw,12px);font-weight:700;line-height:1.8;
  font-size:clamp(13px,calc(var(--fvw,1vw)*.83),15px);
}
.wpcf7 form.sent .wpcf7-response-output{
  background:#F2F8EA;border:2px solid var(--green);color:var(--green-dark);
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output{
  background:#FFF3EF;border:2px solid #D6482A;color:#D6482A;
}
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output{
  background:#FFF3EF;border:2px solid #D6482A;color:#D6482A;
}
