/* ==========================================================
   forms.css — 非住宅フォーム共通（Contact Form 7 の出力に当てる土台＋確認画面）
   P4-4（2026-10-16）。contact／inquiry／consultation だけで読み込む（inc/forms.php）。
   入力欄・ラベル・必須表示・日程候補などの基本は biz-base.css／biz-c1-dark.css の .field__* をそのまま使う。
   ここは CF7 が出す余計なマークアップの整形、選択肢（.choice 相当）、確認画面、CF7 既定色の打ち消しだけ。
   色はすべて既存の変数経由。
   ========================================================== */

.idw-sr{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;
  overflow:hidden;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);white-space:nowrap;
}

/* ---- CF7 ラッパーの整形 ---- */
.wpcf7{margin:0;}
.wpcf7 form{position:relative;}
.wpcf7 .wpcf7-form-control-wrap{display:block;position:relative;}
.wpcf7 form .idw-step[hidden],
.wpcf7 form .idw-confirm[hidden],
.wpcf7 form .idw-done[hidden]{display:none;}
.wpcf7 .wpcf7-list-item{display:block;margin:0;}
.wpcf7 .wpcf7-list-item-label::before,
.wpcf7 .wpcf7-list-item-label::after{content:none;}
/* 日程候補の入力欄は .field__inline の子（flex）として並ぶ。CF7 のラッパーも 1 項目として数える */
.field__inline > .wpcf7-form-control-wrap{flex:1 1 min(180px,100%);min-width:0;}

/* ---- 選択肢（ラジオ）＝ design の .choice と同じ見た目を list-item の label に当てる ---- */
.field__choices .wpcf7-list-item label{
  display:inline-flex;align-items:center;gap:10px;
  min-height:45px;padding:10px 22px;
  border:1px solid var(--c-line-dark);border-radius:var(--radius);
  background:transparent;color:var(--c-text);
  letter-spacing:.06em;line-height:1.5;cursor:pointer;
  transition:border-color .3s ease,background-color .3s ease;
}
.field__choices .wpcf7-list-item label:hover{border-color:var(--c-text);}
.field__choices .wpcf7-list-item label:focus-within{outline:2px solid var(--c-text);outline-offset:1px;}
.field__choices .wpcf7-list-item input[type=radio]{accent-color:var(--c-primary);width:15px;height:15px;margin:0;flex:none;}
.field__choices .wpcf7-list-item label:has(input:checked){background:var(--c-bg-sub2);border-color:var(--c-text);}
@media(max-width:767px){
  .field__choices .wpcf7-list-item,
  .field__choices .wpcf7-list-item label{width:100%;}
}

/* ---- 同意チェック ---- */
.field__check .wpcf7-list-item label{display:flex;align-items:flex-start;gap:10px;cursor:pointer;}
.field__check .wpcf7-list-item input{margin-top:5px;flex:none;}
.field__check .wpcf7-form-control-wrap{width:100%;}

/* ---- フォーカス ---- */
.wpcf7 form button:focus-visible{outline:2px solid var(--c-text);outline-offset:2px;}

/* ---- 必須バッジ（20261027g）＝サイトのアクセント赤（--c1-accent＝面／罫線用の #c0392b・白文字 5.9:1）。
   biz-c1-dark.css の .field__req（白い面）より詳細度を上げて上書き。 */
.wpcf7 .field__req{background:var(--c1-accent,#c0392b);color:#fff;}

/* ---- 入力エラー（20261027g）：項目ブロック全体を赤枠＋その下に「※この項目は必須です」。
   CF7 の標準表示（.wpcf7-not-valid-tip）は form-confirm.js が項目ごと1つのこの見た目に付け替える。
   ダーク地のため、枠・面＝--c1-accent（#c0392b・3.2:1）／文字＝--c1-accent-ink（#e05a4a・4.75:1）の2値（biz-c1-dark.css の取り決めどおり）。
   動き＝枠がふわっと赤くなる（.55s）→ 最初の1項目だけ横に1回揺れる（.55s）。 */
.wpcf7 form .idw-row--invalid{position:relative;isolation:isolate;}
.wpcf7 form .idw-row--invalid::before{
  content:"";position:absolute;inset:-6px -12px;z-index:-1;pointer-events:none;
  border:1px solid var(--c1-accent-ink,#e05a4a);
  background:color-mix(in srgb,var(--c1-accent,#c0392b) 10%,transparent);
  animation:idw-err-frame .55s cubic-bezier(.16,1,.3,1) both;
}
@media(max-width:767px){.wpcf7 form .idw-row--invalid::before{inset:-6px -8px;}}
.wpcf7 form .idw-row--shake{animation:idw-err-shake .55s cubic-bezier(.215,.61,.355,1) 1;}
.wpcf7-not-valid-tip{
  display:block;margin-top:8px;font-size:var(--bz-fs-l4);line-height:1.7;color:var(--c1-accent-ink,#e05a4a);font-weight:500;
  animation:idw-err-tip .45s cubic-bezier(.16,1,.3,1) .1s both;
}
.wpcf7-not-valid-tip::before{content:"※";}
.wpcf7 .wpcf7-not-valid{border-color:var(--c1-accent-ink,#e05a4a);outline:none;}
@keyframes idw-err-frame{from{opacity:0;transform:scale(.985);}to{opacity:1;transform:none;}}
@keyframes idw-err-tip{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}}
@keyframes idw-err-shake{
  0%,100%{transform:translateX(0);}
  18%{transform:translateX(-7px);}
  42%{transform:translateX(6px);}
  66%{transform:translateX(-3px);}
  86%{transform:translateX(1.5px);}
}
.wpcf7 form .wpcf7-response-output{
  margin:var(--sp-4) 0 0;padding:14px 18px;border:1px solid var(--c-line-dark);background:var(--c-bg-sub);
  font-size:var(--bz-fs-l4);line-height:1.8;text-align:center;color:var(--c-text);
}
.wpcf7 form.sent .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output,
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output{border-color:var(--c-line-dark);}
.wpcf7 form[data-idw-step="done"] .wpcf7-response-output{display:none;}

/* ---- 面の切り替え（20261027g）：入力面がふわっと消える → 確認面がフェードイン（戻るときは上から）。JS＝form-confirm.js の swap() ---- */
.wpcf7 form .idw-pane--out{opacity:0;transition:opacity .35s cubic-bezier(.215,.61,.355,1);}
.wpcf7 form .idw-pane--pre{opacity:0;}
.wpcf7 form .idw-pane--pre.idw-pane--down{transform:translateY(16px);}
.wpcf7 form .idw-pane--pre.idw-pane--up{transform:translateY(-16px);}
.wpcf7 form .idw-pane--in{transition:opacity .7s cubic-bezier(.215,.61,.355,1),transform .8s cubic-bezier(.16,1,.3,1);}

/* ---- 送信完了のサンクス枠（20261027g）：画面中央にふわっと。背景クリック・Esc・閉じるで閉じる ---- */
html.idw-modal-open{overflow:hidden;}
.idw-modal{
  position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(0,0,0,.6);
  opacity:0;visibility:hidden;
  transition:opacity .45s cubic-bezier(.215,.61,.355,1),visibility 0s linear .45s;
}
.idw-modal.is-open{opacity:1;visibility:visible;transition:opacity .45s cubic-bezier(.215,.61,.355,1),visibility 0s;}
.idw-modal__panel{
  width:100%;max-width:520px;max-height:calc(100vh - 40px);overflow:auto;
  padding:48px 28px 40px;background:var(--c-bg-sub);border:1px solid var(--c-line);text-align:center;color:var(--c-text);
  transform:translateY(18px) scale(.985);
  transition:transform .7s cubic-bezier(.16,1,.3,1);
}
.idw-modal.is-open .idw-modal__panel{transform:none;}
.idw-modal__panel:focus{outline:none;}
.idw-modal__title{font-size:var(--bz-fs-l2);line-height:1.6;margin:0 0 14px;color:var(--c-text);}
.idw-modal__text{font-size:var(--bz-fs-l4);color:var(--c-text-sub);line-height:1.9;margin:0;}
.idw-modal__close{width:100%;max-width:280px;margin:32px auto 0;cursor:pointer;font-family:inherit;}
@media(min-width:768px){.idw-modal__panel{padding:56px 48px 48px;}}

@media(prefers-reduced-motion:reduce){
  .wpcf7 form .idw-row--invalid::before,
  .wpcf7 form .idw-row--shake,
  .wpcf7-not-valid-tip,
  .wpcf7 form .idw-pane--out,
  .wpcf7 form .idw-pane--in,
  .idw-modal,
  .idw-modal.is-open,
  .idw-modal__panel{animation:none!important;transition:none!important;}
}

/* ---- 送信中のスピナー ---- */
.idw-confirm__actions .wpcf7-spinner{display:block;margin:14px auto 0;background-color:var(--c-text);}
.idw-confirm__actions .wpcf7-spinner::before{background-color:var(--c-bg);}

/* ==========================================================
   確認画面（入力 → 確認 → 完了）。JS＝assets/js/form-confirm.js
   ========================================================== */
.idw-confirm__title{font-size:var(--bz-fs-l2);font-weight:500;line-height:1.6;margin:0 0 12px;text-align:left;}
.idw-confirm__title:focus{outline:none;}
.idw-confirm__lead{font-size:var(--bz-fs-l4);color:var(--c-text-sub);margin:0 0 var(--sp-4);line-height:1.9;text-align:left;}
.idw-confirm__list{margin:0;border-top:1px solid var(--c-line);}
.idw-confirm__item{display:grid;grid-template-columns:1fr;gap:6px;padding:16px 0;border-bottom:1px solid var(--c-line);}
.idw-confirm__item dt{font-size:var(--bz-fs-l4);color:var(--c-text-sub);line-height:1.7;}
.idw-confirm__item dd{margin:0;font-size:var(--bz-fs-l3);line-height:1.9;color:var(--c-text);white-space:pre-wrap;word-break:break-word;}
.idw-confirm__line{display:block;}
.idw-confirm__empty{color:var(--c-text-note);}
@media(min-width:768px){
  .idw-confirm__item{grid-template-columns:200px 1fr;gap:24px;}
}
.idw-confirm__actions{margin-top:var(--sp-4);text-align:center;}
.idw-confirm__actions .btn{font-family:inherit;cursor:pointer;}
.idw-back{
  display:block;margin:20px auto 0;padding:8px 4px;border:0;background:none;
  font:inherit;font-size:var(--bz-fs-l4);color:var(--c-text);text-decoration:underline;text-underline-offset:4px;cursor:pointer;
}
.idw-done{padding:var(--sp-4) var(--sp-3);border:1px solid var(--c-line);text-align:center;}
.idw-done:focus{outline:none;}
.idw-done__title{font-size:var(--bz-fs-l2);line-height:1.6;margin:0 0 12px;color:var(--c-text);}
.idw-done__text{font-size:var(--bz-fs-l4);color:var(--c-text-sub);line-height:1.9;margin:0;}

/* 入力面の検証エラーの要約（form-confirm.js が role=alert で出す） */
.idw-error-summary{
  margin:0 0 var(--sp-3);padding:12px 16px;border:1px solid var(--c1-accent-ink,#e05a4a);background:var(--c-bg-sub);
  font-size:var(--bz-fs-l4);line-height:1.8;text-align:center;color:var(--c-text);
}
.idw-error-summary[hidden]{display:none;}

/* 2026-10-16 CF7 の応答欄（.wpcf7-response-output）が空のときに枠だけ残るのを隠す（確認画面の下に空枠が出ていた） */
.wpcf7 form .wpcf7-response-output:empty { display: none; }

/* [20261027n] ディレクター指示（全フォーム統一）：
   ① 同意チェックはチェックボックスと文を同じ行に。CF7 は class: を input 自身に付けるため、旧指定（.field__check .wpcf7-list-item label）が効いていなかった＝.wpcf7-acceptance を起点に書き直す
   ② 送信完了の表示にお礼と返信の目安（フォーム定義の .idw-done__lead。サンクス枠には form-confirm.js が .idw-modal__lead として複製） */
.wpcf7-acceptance .wpcf7-list-item label{display:inline-flex;align-items:center;gap:10px;cursor:pointer;text-align:left;}
.wpcf7-acceptance .wpcf7-list-item input[type="checkbox"]{flex:none;width:16px;height:16px;margin:0;accent-color:var(--c-primary);}
.idw-done__lead,.idw-modal__lead{font-size:var(--bz-fs-l3, var(--bz-fs-l4));line-height:1.9;margin:0 0 8px;color:var(--c-text);}
.idw-modal__lead{margin:0 0 4px;}

/* 2026-11-05 tag 20261105h：ディレクター指示「下の面は見出しだけ」＝送信後は中央のお知らせ枠（form-confirm.js が .idw-done__lead を複製して出す）と、
   フォームの位置に残る完了の面で同じ文が2回出ていた。残る面は見出しだけにする（お礼・返信の目安・【確認用】の注記は中央の枠にだけ出る）。 */
.idw-done .idw-done__lead,.idw-done .idw-done__text{display:none;}
.idw-done .idw-done__title{margin-bottom:0;}

/* 2026-11-05 tag 20261105j→k：完了の表示。j で「枠をなくし文字だけ」→ 同日ディレクター「やっぱり文字だけだとおかしいので、枠を付けて」。
   完了の面にだけ1本の枠（非住宅は .form に枠が無いので2重にならない）。入力前の案内文は消す（イベントの記事） */
.wpcf7 form[data-idw-step="done"] .idw-done{border:1px solid var(--c-line);padding:var(--sp-4) var(--sp-3);}
.ev-reserve__body:has(form[data-idw-step="done"]) > .section__lead,
.ev-reserve__body:has(form[data-idw-step="done"]) > .ev-reserve__lead{display:none;}