/* ===========================================================
   pages/company.css — 会社概要 / お問い合わせ
   =========================================================== */

.p-contact-form {
  padding: var(--sp-xl);
  background-color: var(--c-bg);
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
}

@media (min-width: 768px) {
  .p-contact-form {
    padding: var(--sp-2xl);
  }
}

/* select にも input と同じ見た目を与えつつ、ネイティブの矢印を残す */
.p-contact-form select.c-field__input {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23656e7d' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3.5 6 4.5 4.5L12.5 6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1em center;
  background-size: 16px;
  padding-right: 2.75em;
  cursor: pointer;
}

/* 送信先未設定であることの注記（本番接続時に削除する） */
.p-contact-form__notice {
  padding: var(--sp-sm) var(--sp-md);
  background-color: var(--c-bg-alt);
  border-left: 2px solid var(--c-accent-art);
  border-radius: var(--r-sm);
}

/* ===========================================================
   Contact Form 7 の出力を既存のフォームデザインに合わせる。
   CF7 は各入力を <span class="wpcf7-form-control-wrap"> で包み、
   エラー文言や送信結果を独自クラスで出力するため、そこだけを整える。
   =========================================================== */

.p-contact-form .wpcf7-form-control-wrap {
  display: block;
}

/* 入力エラーの枠線 */
.p-contact-form .wpcf7-not-valid {
  border-color: var(--c-accent-art);
}

/* 各項目の下に出るエラー文言 */
.p-contact-form .wpcf7-not-valid-tip {
  margin-top: var(--sp-xs);
  color: var(--c-accent-art);
  font-size: var(--fs-sm);
  line-height: 1.6;
}

/* 送信結果（成功・失敗）のメッセージ */
.p-contact-form .wpcf7-response-output {
  margin: var(--sp-lg) 0 0;
  padding: var(--sp-sm) var(--sp-md);
  border: 1px solid var(--c-line);
  border-left-width: 2px;
  border-radius: var(--r-sm);
  font-size: var(--fs-sm);
  line-height: 1.7;
}

.p-contact-form .wpcf7-form.sent .wpcf7-response-output {
  border-left-color: var(--c-accent);
  background-color: var(--c-accent-soft);
}

.p-contact-form .wpcf7-form.invalid .wpcf7-response-output,
.p-contact-form .wpcf7-form.failed .wpcf7-response-output {
  border-left-color: var(--c-accent-art);
  background-color: var(--c-bg-alt);
}

/* 送信中インジケーター */
.p-contact-form .wpcf7-spinner {
  margin-left: var(--sp-sm);
}
