/*
 * Global Hand Mailmag - Frontend form styles.
 * テーマのCSS変数を利用し、未定義の場合はフォールバック値を使用する.
 */

.ghmm-form {
	max-width: 560px;
	background-color: var(--color-white, #FFFFFF);
	border: 1px solid var(--color-brass, #B08A45);
	padding: 32px 28px;
	margin: 2em 0;
}

.ghmm-form__notice {
	font-size: 0.875rem;
	padding: 0.9em 1.2em;
	margin: 0 0 1.5em;
}

.ghmm-form__notice--success {
	background-color: rgba(176, 138, 69, 0.1);
	border-left: 2px solid var(--color-brass, #B08A45);
	color: var(--color-sumi, #1F1C18);
}

.ghmm-form__notice--error {
	background-color: rgba(154, 63, 45, 0.08);
	border-left: 2px solid var(--color-tokoname-red, #9A3F2D);
	color: var(--color-tokoname-red, #9A3F2D);
}

.ghmm-form__field label {
	display: block;
	font-size: 0.875rem;
	margin-bottom: 6px;
	color: var(--color-sumi, #1F1C18);
}

.ghmm-form__field input[type='email'] {
	width: 100%;
	padding: 0.8em 1em;
	border: 1px solid rgba(109, 106, 98, 0.3);
	background-color: var(--color-washi, #F6F1E8);
	font-size: 1rem;
	transition: border-color 0.25s ease;
}

.ghmm-form__field input[type='email']:focus {
	outline: none;
	border-color: var(--color-brass, #B08A45);
	background-color: var(--color-white, #FFFFFF);
}

.ghmm-form__privacy {
	margin: 1.2em 0;
}

.ghmm-form__privacy label {
	display: flex;
	align-items: baseline;
	gap: 8px;
	font-size: 0.8125rem;
	color: var(--color-kiln-gray, #6D6A62);
}

.ghmm-form__privacy input {
	accent-color: var(--color-tokoname-red, #9A3F2D);
}

.ghmm-form__privacy a {
	color: var(--color-tokoname-red, #9A3F2D);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.ghmm-form__submit {
	margin: 1.4em 0 0;
}

.ghmm-form__submit input[type='submit'] {
	width: 100%;
	padding: 1em;
	background-color: var(--color-tokoname-red, #9A3F2D);
	border: 1px solid var(--color-tokoname-red, #9A3F2D);
	color: var(--color-washi, #F6F1E8);
	font-size: 0.9375rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	cursor: pointer;
	transition: background-color 0.25s ease;
}

.ghmm-form__submit input[type='submit']:hover,
.ghmm-form__submit input[type='submit']:focus {
	background-color: #7E3222;
}

.ghmm-form__note {
	font-size: 0.75rem;
	color: var(--color-kiln-gray, #6D6A62);
	margin: 1.2em 0 0;
}