/*
 * assets/cc-contactdesk/cc-contactdesk-form.css
 * Version: 20261025_v4（指示書CG CG-7：送った箱の下の「マイページは、このメールアドレスのアカウントです。」.cccd-sb__acct を足しただけ）
 * 【v4 変更点】いちばん下に .cccd-sb__acct の1かたまり。ほかは v3 と1文字も同じ。見た目はモック「プロフィールとログインと送信の箱」④（.em）。
 * (旧)Version: 20261024_v3（司令塔パッチ：本番の style.css の「.wpcf7 label／select／textarea」に負けていた所を、いちばん下の1かたまりで直しただけ）
 * 【v3 変更点】style.css の .wpcf7 label（display:block・太字・下 16px）・.wpcf7 select／textarea（幅 100%・灰色）が、
 *   対象の商品の行（label.cccd-it）・個数と様子のセレクト・ご注文のセレクト・ゲストの欄・写真のボタン（label.cccd-ph-btn）に効いて、モック v6 と違う形になっていた。
 *   → 「.wpcf7 〜」で同じ強さ以上にして、モックの形に戻す。ほかの欄（お名前・メッセージなど）は触らない。
 * (旧)Version: 20261024_v2（司令塔パッチ：カード番号の赤い箱 .cccd-card と、欄の赤い枠 .cccd-card-bad を足しただけ）
 * (旧)Version: 20261024_v1（指示書CB CB-2）
 * CF7 の自作の欄（[cc_target_items]・[cc_photos]）・メールの打ち間違いの手助け・「送信しました」の箱。
 * 見た目はモック「お問い合わせページとログイン v6」の CC🎀（対象の商品の箱・写真の欄）と「マイページのお問い合わせ v2」③（送ったあと）。
 * 外部の読み込みなし（フォントはページのまま）。対象のフォームが出るページでだけ読む。
 */

/* hidden を必ず効かせる（下の display より強く） */
.cccd-tgt [hidden], .cccd-ph [hidden], .cccd-mailfix[hidden], .cccd-sent [hidden], .cccd-card[hidden] { display: none !important; }

/* ── カード番号（★v2・モック「カード番号を書かせない」v1） ── */
.cccd-card { display: block; margin: 8px 0 0; background: #FDECEC; border-radius: 8px; padding: 9px 11px; color: #b02a2a; font-size: 12.5px; font-weight: 700; line-height: 1.7; text-align: left; box-sizing: border-box; }
.cccd-card small { display: block; font-weight: 400; color: #8a3a3a; margin-top: 2px; font-size: 12px; }
.wpcf7 textarea.cccd-card-bad, .wpcf7 input.cccd-card-bad { border-color: #c03030 !important; background-color: #fff7f7 !important; }

/* ── 対象の商品 ── */
.cccd-tgt { display: block; }
.cccd-tgt-ordl { display: block; font-size: 13.5px; font-weight: 800; color: #3A2C31; margin: 0 0 14px; }
.cccd-tgt-order {
	display: block; width: 100%; margin-top: 6px; padding: 10px 36px 10px 12px; border: 1.5px solid #F1C9D6; border-radius: 12px;
	font-size: 16px; color: #3A2C31; font-family: inherit; font-weight: 400; -webkit-appearance: none; appearance: none;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23B85577' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 14px center;
}
.cccd-tgt-box { display: block; border: 1.5px solid #F58BB6; background: #FFF6F9; border-radius: 14px; padding: 12px; margin: 0 0 4px; box-sizing: border-box; }
.cccd-tgt-t { display: block; font-size: 13.5px; font-weight: 800; color: #3A2C31; margin: 0 0 2px; }
.cccd-req { font-style: normal; color: #D0708E; }
.cccd-tgt-h { display: block; font-size: 12px; font-weight: 400; color: #8a7880; margin: 0 0 8px; line-height: 1.6; }
.cccd-tgt-items { display: block; }
.cccd-it { display: flex; align-items: center; gap: 8px; background: #fff; border: 1px solid #F3DCE6; border-radius: 12px; padding: 8px 10px; margin: 0 0 7px; font-size: 13px; font-weight: 400; color: #3A2C31; cursor: pointer; box-sizing: border-box; }
.cccd-it.on { border-color: #F58BB6; }
.cccd-it input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.cccd-cb { width: 20px; height: 20px; border-radius: 6px; border: 1.5px solid #E6A9BD; flex: none; display: flex; align-items: center; justify-content: center; font-size: 13px; line-height: 1; color: #fff; background: #fff; }
.cccd-it.on .cccd-cb { background: #D0708E; border-color: #D0708E; }
.cccd-it input:focus-visible + .cccd-cb { outline: 2px solid #F58BB6; outline-offset: 2px; }
.cccd-nm { flex: 1; min-width: 0; line-height: 1.5; }
.cccd-nm small { display: block; color: #8a7880; font-size: 11.5px; }
.cccd-sub { display: flex; gap: 6px; margin: -2px 0 8px 28px; flex-wrap: wrap; }
.cccd-sub select { border: 1.5px solid #F1C9D6; border-radius: 999px; background: #fff; font-size: 13px; padding: 4px 8px; color: #3A2C31; font-family: inherit; }
.cccd-it.is-off { opacity: .45; }
.cccd-tgt-text {
	display: block; width: 100%; min-height: 74px; margin: 0; padding: 10px 12px; border: 1.5px solid #F1C9D6; border-radius: 12px; background: #fff;
	font-size: 16px; color: #3A2C31; font-family: inherit; box-sizing: border-box; resize: vertical;
}
.cccd-tgt-text::placeholder { color: #b5a3aa; }

/* ── 写真 ── */
.cccd-ph { display: block; margin-top: 6px; }
.cccd-ph-row { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #1a1a1a; font-weight: 400; }
.cccd-ph-btn { display: inline-flex; align-items: center; background: #eee; border-radius: 999px; padding: 3px 12px; font-weight: 700; cursor: pointer; position: relative; overflow: hidden; margin: 0; }
.cccd-ph-btn input { position: absolute; inset: 0; opacity: 0; cursor: pointer; font-size: 0; width: 100%; }
.cccd-ph-thumbs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.cccd-ph-thumbs:empty { display: none; }
.cccd-ph-t { position: relative; width: 56px; height: 56px; border-radius: 10px; overflow: hidden; background: #f3eef0; display: flex; align-items: center; justify-content: center; font-size: 10px; color: #8a7880; text-align: center; word-break: break-all; }
.cccd-ph-t img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cccd-ph-x { position: absolute; top: 2px; right: 2px; width: 20px; height: 20px; border: 0; border-radius: 50%; background: rgba(0,0,0,.55); color: #fff; font-size: 12px; line-height: 20px; padding: 0; cursor: pointer; }
.cccd-ph-msg { display: block; font-size: 12px; color: #c03030; margin-top: 6px; }

/* ── メールの打ち間違い ── */
.cccd-mailfix { display: inline-block; margin-top: 6px; border: 0; background: #FFF4E0; color: #9a6b1f; border-radius: 8px; padding: 4px 10px; font-size: 12.5px; font-family: inherit; cursor: pointer; text-align: left; }

/* ── 送ったあとの箱（§6-4） ── */
.cccd-sent { background: #fff; border: 1px solid #EAD9DF; border-radius: 16px; padding: 18px 16px; text-align: center; color: #3A2C31; box-sizing: border-box; }
.cccd-sent .i { font-size: 30px; margin: 0; line-height: 1.4; }
.cccd-sent h3 { margin: 4px 0 8px; font-size: 17px; font-weight: 800; color: inherit; }
.cccd-sent .q { display: inline-block; background: #FCE4EF; color: #B4577F; border-radius: 10px; padding: 4px 12px; font-weight: 800; margin-bottom: 10px; font-size: 14px; }
.cccd-sent p { margin: 0 0 10px; font-size: 13px; line-height: 1.8; }
.cccd-sent .nb { display: inline-block; }
.cccd-sent a.go { display: block; background: #F58BB6; color: #fff; border-radius: 999px; padding: 11px; font-weight: 800; text-decoration: none; font-size: 14px; margin-top: 6px; }
.cccd-sent--cr { border-color: #e8e8e8; color: #1a1a1a; }
.cccd-sent--cr .q { background: #eef4e8; color: #4f7a32; }
.cccd-sent--cr a.go { background: #83B36A; }

/* ── ★v3 本番の style.css（.wpcf7 label／select／textarea）に負けないように ── */
.wpcf7 label.cccd-it { display: flex; align-items: center; gap: 8px; margin: 0 0 7px; font-size: 13px; font-weight: 400; color: #3A2C31; }
.wpcf7 label.cccd-ph-btn { display: inline-flex; align-items: center; margin: 0; font-size: 13px; font-weight: 700; color: #1a1a1a; }
.wpcf7 .cccd-tgt select.cccd-tgt-order { display: block; width: 100%; margin-top: 6px; padding: 10px 36px 10px 12px; border: 1.5px solid #F1C9D6; border-radius: 12px; font-size: 16px; color: #3A2C31; background-color: #fff; }
.wpcf7 .cccd-sub select { display: inline-block; width: auto; margin: 0; padding: 4px 10px; border: 1.5px solid #F1C9D6; border-radius: 999px; background: #fff; font-size: 13px; color: #3A2C31; }
.wpcf7 .cccd-tgt textarea.cccd-tgt-text { min-height: 74px; margin: 0; padding: 10px 12px; border: 1.5px solid #F1C9D6; border-radius: 12px; background: #fff; font-size: 16px; color: #3A2C31; }
.wpcf7 .cccd-tgt textarea.cccd-tgt-text:focus, .wpcf7 .cccd-tgt select:focus { border-color: #F58BB6; }
.wpcf7 .cccd-tgt .cccd-tgt-ordl { margin: 0 0 14px; }
.wpcf7 .cccd-ph { margin-bottom: 18px; }

/* ── ★v4 送った箱（会員のとき）: どのアカウントに入るか（モック「プロフィールとログインと送信の箱」④） ── */
.cccd-sent p.cccd-sb__acct { margin: 8px 0 0; font-size: 12px; line-height: 1.8; color: #8a7880; text-align: center; overflow-wrap: anywhere; }
.cccd-sent p.cccd-sb__acct b { font-weight: 700; color: inherit; }