/* 会員登録：メールマガジン（コンパクト・必須※） */
.hyakushou-mypage-newmember tr.hyakushou-mailmaga-field th.hyakushou-mailmaga-field__th,
.hyakushou-mypage-newmember tr.hyakushou-mailmaga-field td.hyakushou-mailmaga-field__td {
	padding: 4px 8px;
	vertical-align: middle;
	border: 1px solid #d8d8d8;
}

.hyakushou-mypage-newmember tr.hyakushou-mailmaga-field th.hyakushou-mailmaga-field__th {
	background: #f0f0f0;
	font-weight: 400;
	font-size: 0.875rem;
	line-height: 1.45;
}

.hyakushou-mailmaga-field__required {
	margin-left: 0.15em;
	color: #c62828;
	font-weight: 700;
}

.hyakushou-mailmaga-options {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin: 0;
	padding: 0;
}

.hyakushou-mailmaga-choice {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 0.35em;
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 1px 0;
	box-sizing: border-box;
	font-size: 0.875rem;
	line-height: 1.45;
}

.hyakushou-mypage-newmember .hyakushou-mailmaga-choice input[type="radio"],
#newmember .customer_form tr.hyakushou-mailmaga-field .hyakushou-mailmaga-choice input[type="radio"] {
	width: auto !important;
	max-width: none;
	min-width: 0;
	flex-shrink: 0;
	margin: 0;
	vertical-align: middle;
}

@media (min-width: 981px) {
	.hyakushou-mypage-newmember tr.hyakushou-mailmaga-field th.hyakushou-mailmaga-field__th,
	.hyakushou-mypage-newmember tr.hyakushou-mailmaga-field td.hyakushou-mailmaga-field__td {
		padding: 4px 10px;
	}
}

/* 会員登録：見出し帯下の余白（エラーはセル内表示のため帯下のみ調整） */
.hyakushou-mypage-newmember__section > .hyakushou-mypage-login__band.hyakushou-guide-main-heading {
	margin: 0 0 0.5rem;
}

/* 会員登録：テーブル先頭の未分類エラー行 */
.hyakushou-mypage-newmember .hyakushou-newmember-error-summary td {
	padding: 8px 6px 4px;
	border-bottom: 0;
	color: #c62828;
}

/* 会員登録：各セル内の検証エラー（赤文字・入力欄と同じ td） */
.hyakushou-mypage-newmember .hyakushou-field-errors {
	margin: 0.35rem 0 0.5rem;
	padding: 0;
	color: #c62828;
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.55;
}

.hyakushou-mypage-newmember .customer_form td > .hyakushou-field-errors:first-child {
	margin: 0 0 0.5rem;
}

.hyakushou-mypage-newmember .customer_form td input ~ .hyakushou-field-errors,
.hyakushou-mypage-newmember .customer_form td select ~ .hyakushou-field-errors {
	margin: 0.35rem 0 0;
}

.hyakushou-mypage-newmember .hyakushou-field-errors__line {
	margin: 0 0 0.25rem;
	color: #c62828;
}

.hyakushou-mypage-newmember .hyakushou-field-errors__line:last-child {
	margin-bottom: 0;
}

.hyakushou-mypage-newmember .customer_form td:has(.hyakushou-field-errors) input[type="text"],
.hyakushou-mypage-newmember .customer_form td:has(.hyakushou-field-errors) input[type="email"],
.hyakushou-mypage-newmember .customer_form td:has(.hyakushou-field-errors) input[type="password"],
.hyakushou-mypage-newmember .customer_form td:has(.hyakushou-field-errors) input[type="tel"],
.hyakushou-mypage-newmember .customer_form td:has(.hyakushou-field-errors) select {
	background-color: #fff5f8;
}

.hyakushou-mypage-newmember .customer_form td.name_td:has(.hyakushou-field-errors) input[type="text"],
.hyakushou-mypage-newmember .customer_form td.name_td:has(.hyakushou-field-errors) input[type="email"],
.hyakushou-mypage-newmember .customer_form .hyakushou-jp-split-fields:has(.hyakushou-field-errors) input[type="text"],
.hyakushou-mypage-newmember .customer_form .hyakushou-jp-split-fields:has(.hyakushou-field-errors) input[type="email"] {
	background-color: #fff5f8;
}

/* JP：姓・名／フリガナを 1 セルにまとめたときの横並び（PHP hyakushou_child_merge_jp_addressform_name_furikana_cells） */
body:not(.wp-admin) .customer_form .hyakushou-jp-split-fields {
	vertical-align: middle;
}

@media (min-width: 981px) {
	body:not(.wp-admin) .customer_form .hyakushou-jp-split-fields__item {
		display: inline-flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 0.25rem 0.45rem;
		vertical-align: middle;
	}

	body:not(.wp-admin) .customer_form .hyakushou-jp-split-fields__item + .hyakushou-jp-split-fields__item {
		margin-left: 1rem;
	}
}

@media (max-width: 980px) {
	body:not(.wp-admin) .customer_form .hyakushou-jp-split-fields {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 0.5rem;
	}

	body:not(.wp-admin) .customer_form .hyakushou-jp-split-fields__item + .hyakushou-jp-split-fields__item {
		margin-left: 0 !important;
	}
}

/* JP：郵便番号行 — グリッドは td ではなく .hyakushou-zipcode-layout（td の display:grid は colspan を壊す） */
body:not(.wp-admin) .customer_form #zipcode_row .hyakushou-zipcode-layout {
	display: grid;
	/* 1列目=郵便番号入力、2列目=検索リンク（入力のすぐ右）、3列目=余白（テーブルセル構造はそのまま） */
	grid-template-columns: max-content max-content minmax(0, 1fr);
	column-gap: 10px;
	row-gap: 6px;
	align-items: center;
}

body:not(.wp-admin) .customer_form #zipcode_row .hyakushou-zipcode-layout > input#zipcode {
	grid-column: 1;
	grid-row: 1;
	justify-self: start;
}

body:not(.wp-admin) .customer_form #zipcode_row .hyakushou-zipcode-layout > .hyakushou-zipcode-extra {
	display: contents;
	font-size: 0.875rem;
	line-height: 1.55;
}

/* Welcart「住所検索」ボタンあり：入力の右にボタン、その右にリンク */
body:not(.wp-admin) .customer_form #zipcode_row .hyakushou-zipcode-layout:has(> input#search_zipcode) > input#search_zipcode,
body:not(.wp-admin) .customer_form #zipcode_row .hyakushou-zipcode-layout:has(> input.search-zipcode.button) > input.search-zipcode.button {
	grid-column: 2;
	grid-row: 1;
	justify-self: start;
	width: auto;
	max-width: none;
}

body:not(.wp-admin) .customer_form #zipcode_row .hyakushou-zipcode-layout:has(> input#search_zipcode) .hyakushou-zipcode-search-link,
body:not(.wp-admin) .customer_form #zipcode_row .hyakushou-zipcode-layout:has(> input.search-zipcode.button) .hyakushou-zipcode-search-link {
	grid-column: 3;
	grid-row: 1;
	justify-self: start;
	text-align: left;
	white-space: nowrap;
	text-decoration: underline;
	color: #111;
}

/* 住所検索ボタンなし：リンクを入力のすぐ右（2列目） */
body:not(.wp-admin) .customer_form #zipcode_row .hyakushou-zipcode-layout:not(:has(> input#search_zipcode)):not(:has(> input.search-zipcode.button)) .hyakushou-zipcode-search-link {
	grid-column: 2;
	grid-row: 1;
	justify-self: start;
	text-align: left;
	white-space: nowrap;
	text-decoration: underline;
	color: #111;
}

body:not(.wp-admin) .customer_form #zipcode_row .hyakushou-zipcode-layout .hyakushou-zipcode-search-link:hover {
	color: #3a6b2c;
}

body:not(.wp-admin) .customer_form #zipcode_row .hyakushou-zipcode-layout > .hyakushou-zipcode-example {
	grid-column: 1 / -1;
	grid-row: 2;
	justify-self: start;
	margin: 0;
	font-size: 0.8125rem;
	color: #555;
	line-height: 1.45;
}

body:not(.wp-admin) .customer_form #zipcode_row .hyakushou-zipcode-layout .hyakushou-zipcode-extra__row--btn {
	grid-column: 1 / -1;
	grid-row: 3;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 14px;
	margin: 0;
}

body:not(.wp-admin) .customer_form #zipcode_row .hyakushou-zipcode-layout .hyakushou-zipcode-extra__row--hint {
	grid-column: 1 / -1;
	grid-row: 4;
	margin: 0;
}

body:not(.wp-admin) .customer_form #zipcode_row input.search-zipcode.button,
body:not(.wp-admin) .customer_form #zipcode_row input#search_zipcode,
body:not(.wp-admin) .customer_form #zipcode_row .hyakushou-autofill-zipcode {
	box-sizing: border-box;
	padding: 8px 16px;
	border: none;
	border-radius: 2px;
	background: #c62828;
	color: #fff;
	font-size: 0.875rem;
	font-weight: 700;
	cursor: pointer;
	line-height: 1.4;
}

body:not(.wp-admin) .customer_form #zipcode_row input.search-zipcode.button:hover,
body:not(.wp-admin) .customer_form #zipcode_row input#search_zipcode:hover,
body:not(.wp-admin) .customer_form #zipcode_row .hyakushou-autofill-zipcode:hover {
	filter: brightness(1.06);
}

body:not(.wp-admin) .customer_form #zipcode_row .hyakushou-zipcode-autofill-hint {
	font-size: 0.8125rem;
	color: #c62828;
	line-height: 1.45;
}

.hyakushou-mypage-newmember__table {
	width: 100%;
	max-width: 100%;
}

.hyakushou-mypage-newmember__table th,
.hyakushou-mypage-newmember__table td {
	padding: 8px 6px;
	vertical-align: top;
}

/*
 * デスクトップ：Welcart 3 列（th + データ2列）のバランスを取る。
 * - 名前列の width:1% はデータ列を潰し th が異常に広がり、郵便番号の colspan=2 も狭く見えるため使わない。
 * - table-layout:fixed + th の幅でラベル列を抑え、残りをデータ列（colspan 含む）に渡す。
 */
@media (min-width: 981px) {
	body:not(.wp-admin) #newmember table.customer_form,
	body.hyakushou-usces-member-page #memberinfo table.customer_form,
	article.hyakushou-member-auth-page #memberedit table.customer_form {
		table-layout: fixed;
	}

	body:not(.wp-admin) #newmember table.customer_form > tbody > tr > th,
	body.hyakushou-usces-member-page #memberinfo table.customer_form > tbody > tr > th,
	article.hyakushou-member-auth-page #memberedit table.customer_form > tbody > tr > th {
		width: 168px;
		max-width: 36%;
		min-width: 10.5rem;
		box-sizing: border-box;
	}

	/* 郵便番号は colspan=2。データ域いっぱいに使う */
	body:not(.wp-admin) .customer_form tr#zipcode_row > td[colspan="2"],
	body.hyakushou-usces-member-page #memberinfo .customer_form tr#zipcode_row > td[colspan="2"],
	article.hyakushou-member-auth-page #memberedit .customer_form tr#zipcode_row > td[colspan="2"] {
		width: auto;
		min-width: 0;
	}

	body:not(.wp-admin) .customer_form tr#name_row.inp1 td.name_td,
	body:not(.wp-admin) .customer_form tr#name_row.inp1 td.hyakushou-jp-split-fields,
	body:not(.wp-admin) .customer_form tr#furikana_row.inp1 > td,
	body:not(.wp-admin) .customer_form tr#furikana_row.inp1 td.hyakushou-jp-split-fields {
		width: auto;
		min-width: 0;
		vertical-align: middle;
	}

	body:not(.wp-admin) .customer_form tr#name_row.inp1 td.name_td .hyakushou-field-errors,
	body:not(.wp-admin) .customer_form tr#name_row.inp1 td.hyakushou-jp-split-fields .hyakushou-field-errors,
	body:not(.wp-admin) .customer_form tr#furikana_row.inp1 > td .hyakushou-field-errors,
	body:not(.wp-admin) .customer_form tr#furikana_row.inp1 td.hyakushou-jp-split-fields .hyakushou-field-errors {
		white-space: normal;
	}
}