/* MW WP Form カスタムスタイル - 既存デザインに合わせて */

/* フォーム全体 */
.mw_wp_form {
    max-width: 100%;
}

/* MW WP Formのデフォルトテーブルレイアウトをリセット */
.mw_wp_form table {
    border: none !important;
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 !important;
    padding: 0 !important;
}

.mw_wp_form table tbody,
.mw_wp_form table tr,
.mw_wp_form table td {
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    vertical-align: top !important;
    background: none !important;
}

.mw_wp_form br {
    display: none !important;
}

/* 既存のcontact_contentスタイルを継承 */
.mw_wp_form .contact_content__field {
    margin-bottom: var(--contact-field-mb, 2.5rem);
}

@media all and (max-width: 679px) {
    .mw_wp_form .contact_content__field {
        margin-bottom: 2rem;
    }
}

/* ラベルスタイル（既存のスタイルを継承） */
.mw_wp_form .contact_content__label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: var(--contact-label-mb, 0.5rem);
    font-weight: 400;
}

.mw_wp_form .contact_content__label_text {
    font-family: "Noto Sans JP", sans-serif, icomoon;
    font-weight: 300;
    font-size: var(--contact-label-fs, 1rem);
    color: #333;
    font-weight: 400;
}

.mw_wp_form .contact_content__label_required {
    font-family: "Noto Sans JP", sans-serif, icomoon;
    font-weight: 300;
    font-size: var(--contact-required-fs, 0.875rem);
    color: #bf3737;
    font-weight: 400;
}

.mw_wp_form .contact_content__label_optional {
    font-family: "Noto Sans JP", sans-serif, icomoon;
    font-weight: 300;
    font-size: var(--contact-optional-fs, 0.875rem);
    color: #999;
    font-weight: 400;
}

/* 入力フィールドスタイル（既存のスタイルを継承） */
.mw_wp_form input[type="text"],
.mw_wp_form input[type="email"],
.mw_wp_form .contact_content__input {
    font-family: "Noto Sans JP", sans-serif, icomoon;
    font-weight: 300;
    width: 100%;
    height: var(--contact-input-h, 3rem);
    box-sizing: border-box;
    padding: var(--contact-input-padding, 0.75rem 1rem);
    font-size: var(--contact-input-fs, 1rem);
    color: #333;
    border: 1px solid #ddd;
    border-radius: 0.25rem;
    background-color: #fff;
}

@media all and (max-width: 679px) {
    .mw_wp_form input[type="text"],
    .mw_wp_form input[type="email"],
    .mw_wp_form .contact_content__input {
        height: 2.75rem;
    }
}

.mw_wp_form input[type="text"]:focus,
.mw_wp_form input[type="email"]:focus,
.mw_wp_form .contact_content__input:focus {
    outline: 0;
    border-color: #bf3737;
}

.mw_wp_form input[type="text"]::placeholder,
.mw_wp_form input[type="email"]::placeholder,
.mw_wp_form .contact_content__input::placeholder {
    color: #999;
}

/* テキストエリアスタイル（既存のスタイルを継承） */
.mw_wp_form textarea,
.mw_wp_form .contact_content__textarea {
    font-family: "Noto Sans JP", sans-serif, icomoon;
    font-weight: 300;
    width: 100%;
    height: var(--contact-textarea-h, 7.5rem);
    box-sizing: border-box;
    padding: var(--contact-input-padding, 0.75rem 1rem);
    font-size: var(--contact-input-fs, 1rem);
    color: #333;
    border: 1px solid #ddd;
    border-radius: 0.25rem;
    background-color: #fff;
    resize: vertical;
}

@media all and (max-width: 679px) {
    .mw_wp_form textarea,
    .mw_wp_form .contact_content__textarea {
        height: 6.25rem;
    }
}

.mw_wp_form textarea:focus,
.mw_wp_form .contact_content__textarea:focus {
    outline: 0;
    border-color: #bf3737;
}

.mw_wp_form textarea::placeholder,
.mw_wp_form .contact_content__textarea::placeholder {
    color: #999;
}

/* チェックボックスグループスタイル（既存のスタイルを継承） */
.mw_wp_form .contact_content__checkbox_group {
    margin-top: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: var(--contact-radio-gap, 0.75rem);
}

@media all and (max-width: 679px) {
    .mw_wp_form .contact_content__checkbox_group {
        gap: 0.75rem;
    }
}

/* チェックボックス項目スタイル（既存のスタイルを継承） */
.mw_wp_form .contact_content__checkbox_group label,
.mwform-checkbox-field label {
    display: flex !important;
    align-items: center !important;
    gap: var(--contact-checkbox-gap, 0.75rem) !important;
    cursor: pointer !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
}

/* チェックボックス本体のスタイル（既存のカスタムチェックボックスを使用） */
.mw_wp_form input[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.mw_wp_form input[type="checkbox"]:focus + .custom-checkbox-icon {
    border-color: var(--checkbox-border-color, #dddddd);
    box-shadow: 0 0 0 2px rgba(var(--checkbox-border-color), 0.2);
}

.mw_wp_form input[type="checkbox"]:checked + .custom-checkbox-icon::after {
    opacity: 1;
}

/* カスタムチェックボックスアイコン（既存のスタイルを使用） */
.mw_wp_form .custom-checkbox-icon {
    position: relative;
    display: inline-block;
    width: var(--checkbox-size, 2rem);
    height: var(--checkbox-size, 2rem);
    border: 1px solid var(--checkbox-border-color, #dddddd);
    border-radius: var(--checkbox-border-radius, 0.25rem);
    background-color: var(--checkbox-bg-color, #ffffff);
    cursor: pointer;
    flex-shrink: 0;
}

.mw_wp_form .custom-checkbox-icon::after {
    content: "\e903";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: icomoon;
    font-size: var(--checkbox-check-font-size, 0.75rem);
    color: var(--checkbox-check-color, #E50138);
    line-height: 1;
    opacity: 0;
    transition: opacity 0.2s ease;
}

/* チェックボックステキスト */
.mw_wp_form .contact_content__checkbox_text,
.mw_wp_form .mwform-checkbox-field-text {
    font-family: "Noto Sans JP", sans-serif, icomoon;
    font-weight: 300;
    font-size: var(--contact-input-fs, 1rem);
    color: #333;
    flex: 1;
    margin: 0 !important;
    padding: 0 !important;
}

/* プライバシーポリシー部分（既存のスタイルを継承） */
.mw_wp_form .contact_content__checkbox_group.--privacy {
    margin-top: var(--contact-privacy-mt, 3.125rem);
    justify-content: center;
    align-items: center;
}

@media all and (max-width: 679px) {
    .mw_wp_form .contact_content__checkbox_group.--privacy {
        margin-top: 2rem;
    }
}

.mw_wp_form .contact_content__checkbox_group.--privacy label {
    justify-content: center !important;
    text-align: center !important;
}

.mw_wp_form .contact_content__privacy_link {
    color: #333;
    text-decoration: underline;
}

.mw_wp_form .contact_content__privacy_link:hover {
    color: #333;
}

/* エラーメッセージスタイル */
.mw_wp_form .mw_wp_form_error {
    color: #e74c3c;
    font-size: 14px;
    margin-top: 5px;
    display: block;
    background: #fdf2f2;
    padding: 8px 12px;
    border-radius: 4px;
    border-left: 3px solid #e74c3c;
}

/* エラー時の入力フィールドスタイル */
.mw_wp_form input.mw_wp_form_error_field,
.mw_wp_form textarea.mw_wp_form_error_field {
    border-color: #e74c3c !important;
    background-color: #fdf2f2 !important;
}

/* ボタンスタイル（既存のbtn_styleを継承） */
.mw_wp_form input[type="submit"],
.mw_wp_form button,
.mw_wp_form .contact_content__btn {
    width: var(--btn-width, 15rem);
    height: var(--btn-height, 3.5rem);
    font-size: var(--btn-font-size, 1rem);
    border-radius: var(--btn-border-radius, 6.25rem);
    background-color: var(--btn-bg-color, #ffffff);
    border: 1px solid var(--btn-border-color, #333333);
    color: var(--btn-text-color, #333333);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    max-width: 100%;
    font-family: Quicksand, sans-serif, icomoon;
    font-weight: 400;
    cursor: pointer;
    transition: opacity var(--common-link-transition-duration, 0.3s) var(--common-link-transition-easing, ease);
}

@media all and (max-width: 679px) {
    .mw_wp_form input[type="submit"],
    .mw_wp_form button,
    .mw_wp_form .contact_content__btn {
        width: 100%;
    }
}

.mw_wp_form input[type="submit"]:hover,
.mw_wp_form button:hover,
.mw_wp_form .contact_content__btn:hover {
    text-decoration: none;
    opacity: var(--common-link-hover-opacity, 0.5);
}

/* MW WP Formの特定クラス対応 */
.mw_wp_form .mwform-checkbox-field {
    display: block !important;
    margin-bottom: 0 !important;
}

/* レスポンシブ対応 */
@media all and (max-width: 679px) {
    .mw_wp_form .contact_content__checkbox_group label {
        font-size: 14px;
    }
}

/* 追加の強制スタイル */
.mw_wp_form * {
    box-sizing: border-box !important;
}

/* チェックボックスの親要素調整 */
.mw_wp_form .contact_content__checkbox_group > * {
    display: block !important;
    width: 100% !important;
}

/* MW WP Formのラベルとカスタムチェックボックスの連携 */
.mw_wp_form label:has(input[type="checkbox"]) {
    display: flex !important;
    align-items: center !important;
    gap: 0.75rem !important;
    cursor: pointer !important;
}

/* カスタムチェックボックスをMW WP Formのラベル内に自動挿入 */
.mw_wp_form input[type="checkbox"] + span:not(.custom-checkbox-icon)::before {
    content: "";
    position: relative;
    display: inline-block;
    width: var(--checkbox-size, 2rem);
    height: var(--checkbox-size, 2rem);
    border: 1px solid var(--checkbox-border-color, #dddddd);
    border-radius: var(--checkbox-border-radius, 0.25rem);
    background-color: var(--checkbox-bg-color, #ffffff);
    margin-right: 0.75rem;
    flex-shrink: 0;
    vertical-align: top;
}