/*
Theme Name: Robofull
Theme URI: https://www.robofull.com/
Author: Robofull
Description: robofull.com を CMS BlueMonkey から移設するための自社テーマ。既存URLを完全維持する設計。
Version: 0.1.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL v2 or later
Text Domain: robofull
*/

/* 実スタイルは assets/css/ に配置する。ここはテーマ識別用ヘッダのみ。 */

/* =====================================================================
   お問い合わせフォーム（Snow Monkey Forms）の見た目調整

   プラグイン標準は入力欄が狭く、項目間の余白も詰まっているため、
   サイトのトーンに合わせて整える。
   クラス名の変更に強いよう、要素セレクタ主体で書いている。
   ===================================================================== */

.p-page-extra {
	padding-top: 3rem;
	padding-bottom: 5rem;
}

/* 項目どうしの間隔 */
.smf-form .smf-item {
	margin-bottom: 2.25rem;
}

.smf-form .smf-item:last-of-type {
	margin-bottom: 2.75rem;
}

/* ラベル */
.smf-form .smf-item__label {
	display: block;
	margin-bottom: .6rem;
	font-weight: 700;
	line-height: 1.6;
}

/* 入力欄は横幅いっぱいに揃える（テキストエリアと同じ幅に） */
.smf-form input[type="text"],
.smf-form input[type="email"],
.smf-form input[type="tel"],
.smf-form input[type="url"],
.smf-form input[type="number"],
.smf-form input[type="date"],
.smf-form select,
.smf-form textarea {
	width: 100%;
	max-width: 100%;
	padding: .7rem .9rem;
	border: 1px solid #ccc;
	border-radius: 4px;
	background: #fff;
	font-size: 1rem;
	line-height: 1.6;
	box-sizing: border-box;
}

.smf-form textarea {
	min-height: 12rem;
}

/* フォーカス時に分かりやすく */
.smf-form input:focus,
.smf-form select:focus,
.smf-form textarea:focus {
	border-color: #1b5fa8;
	outline: none;
	box-shadow: 0 0 0 3px rgba(27, 95, 168, .15);
}

/* ラジオ・チェックボックスの行間 */
.smf-form .smf-label,
.smf-form .smf-radio-buttons-control__control,
.smf-form .smf-checkboxes-control__control {
	display: block;
	margin-bottom: .5rem;
	line-height: 1.8;
}

.smf-form input[type="radio"],
.smf-form input[type="checkbox"] {
	margin-right: .4rem;
}

/* 説明文 */
.smf-form .smf-item__description {
	margin-top: .4rem;
	font-size: .875rem;
	color: #666;
}

/* 送信・確認ボタン */
.smf-form .smf-action {
	margin-top: 2.5rem;
	text-align: center;
}

.smf-form .smf-action button,
.smf-form button[type="submit"],
.smf-form input[type="submit"] {
	min-width: 16rem;
	padding: .9rem 2.5rem;
	border: none;
	border-radius: 4px;
	background: #1b5fa8;
	color: #fff;
	font-size: 1.05rem;
	font-weight: 700;
	cursor: pointer;
	transition: opacity .2s;
}

.smf-form .smf-action button:hover,
.smf-form button[type="submit"]:hover {
	opacity: .85;
}

/* 「戻る」ボタンは控えめに */
.smf-form .smf-action button[data-action="back"],
.smf-form .smf-action .smf-button--back {
	margin-right: 1rem;
	background: #888;
}

/* エラー表示 */
.smf-form .smf-item__error,
.smf-form .smf-error-messages {
	margin-top: .4rem;
	color: #c00;
	font-size: .9rem;
}

/* スマホ */
@media (max-width: 767px) {
	.p-page-extra {
		padding-top: 2rem;
		padding-bottom: 3rem;
	}
	.smf-form .smf-action button,
	.smf-form button[type="submit"] {
		width: 100%;
		min-width: 0;
	}
}

/* =====================================================================
   ヘッダーのCTAボタン（お問い合わせ／資料請求）の中央寄せ補正

   お知らせ系ページでは blog_layout.min.css の .btn ルールが後から効くため、
   ボタン内テキストの位置がページによってブレる。ヘッダー内に限定して固定する。
   ===================================================================== */

.l-header__btns .nav-btn,
.l-header__btn .nav-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.l-header__btns .nav-btn a,
.l-header__btn .nav-btn a {
	display: block;
	width: 100%;
	text-align: center;
}

/* 電話番号ブロックは中身が2行なので縦積みのまま中央に */
.l-header .header-tel .nav-btn {
	flex-direction: column;
	justify-content: center;
}

/* 移植マークアップを持たないページ（送信完了など）の余白 */
.p-page-body {
	padding-top: 3rem;
	padding-bottom: 5rem;
}

.p-page-body p {
	margin-bottom: 1.4em;
}
