/*
 * CRAFOVA LP - Contact Form 7 デザイン統合 CSS
 *
 * 目的:
 *   Contact Form 7 のデフォルト出力 HTML を v28 LP のフォームスタイルに合わせる。
 *
 * 背景:
 *   v28 では <input type="text"> 等を直接スタイル指定していたが、
 *   CF7 は <input class="wpcf7-form-control wpcf7-text"> のように独自クラスを付与する。
 *   元の .contact-form input[type="text"] セレクタは .contact-form-card 内であれば
 *   そのまま効くため、ここでは CF7 特有の追加調整のみ記述する。
 *
 * 適用範囲: .contact-form-card 内
 */

/* CF7 ラッパーの margin / padding 調整 */
.contact-form-card .wpcf7 {
    margin: 0;
    padding: 0;
}

/* CF7 メッセージ表示エリア(送信完了・エラーメッセージ) */
.contact-form-card .wpcf7-response-output {
    margin: 20px 0 0;
    padding: 14px 18px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.6;
}

/* 送信成功時のメッセージ */
.contact-form-card .wpcf7 form.sent .wpcf7-response-output {
    border-color: #16A34A;
    background: #DCFCE7;
    color: #14532D;
}

/* 送信エラー時のメッセージ */
.contact-form-card .wpcf7 form.invalid .wpcf7-response-output,
.contact-form-card .wpcf7 form.unaccepted .wpcf7-response-output {
    border-color: #DC2626;
    background: #FEE2E2;
    color: #7F1D1D;
}

/* バリデーションエラー時の個別フィールド表示 */
.contact-form-card .wpcf7-not-valid-tip {
    color: #DC2626;
    font-size: 13px;
    margin-top: 6px;
    display: block;
}

/* CF7 が出力する submit ボタンを v28 の .contact-form-submit と同じ見た目に */
.contact-form-card input[type="submit"].wpcf7-submit {
    width: 100%;
    padding: 16px 24px;
    margin-top: 8px;
    background: linear-gradient(135deg, #F97316 0%, #EA580C 100%);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.02em;
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
    box-shadow: 0 4px 14px rgba(249, 115, 22, 0.25);
}

.contact-form-card input[type="submit"].wpcf7-submit:hover {
    background: linear-gradient(135deg, #EA580C 0%, #C2410C 100%);
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(249, 115, 22, 0.35);
}

.contact-form-card input[type="submit"].wpcf7-submit:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(249, 115, 22, 0.25);
}

/* CF7 送信中のスピナー位置調整 */
.contact-form-card .wpcf7-spinner {
    display: block;
    margin: 14px auto 0;
}

/* Cloudflare Turnstile / reCAPTCHA バッジの位置調整 */
.contact-form-card .cf-turnstile,
.contact-form-card .grecaptcha-badge {
    margin: 18px 0;
    display: flex;
    justify-content: center;
}

/* CF7 の確認チェックボックス(同意項目)を v28 の .form-consent 風に */
.contact-form-card .wpcf7-acceptance .wpcf7-list-item {
    margin: 0;
}

.contact-form-card .wpcf7-acceptance .wpcf7-list-item-label {
    font-size: 13px;
    line-height: 1.6;
    color: #475569;
}

/* レスポンシブ調整 (スマホ <= 768px) */
@media (max-width: 768px) {
    .contact-form-card input[type="submit"].wpcf7-submit {
        font-size: 15px;
        padding: 14px 20px;
    }
}
