/* =========================================================================
   Fujiya Ryokan – 独自上書きCSS（必ず最後に読み込む）
   目的:
   1) 新着情報カードが opacity:0 のまま消える不具合の解消
   2) ヘッダー/フッターの色を全ページで統一（Divi既定色に落ちるページの是正）
   3) 各固定ページ上部のメインビジュアル（ヒーローバナー）装飾
   4) 当館のご案内(about/about-en)の猫背景の除去
   ========================================================================= */

/* -------------------------------------------------------------------------
   1) 新着情報（ブログモジュール）を常に表示
      vb-theme.css が .et_animated / .et_pb_post などに opacity:0 を与え、
      Diviのアニメ用JSが完走しないため透明のまま消えていた。強制表示する。
   ---------------------------------------------------------------------- */
.et_pb_blog_grid .et_pb_salvattore_content[data-columns] .et_pb_post,
.et_pb_blog_grid_wrapper.et_animated,
.et_pb_blog_grid .et-waypoint,
.et_pb_blog_grid .et_animated {
	opacity: 1 !important;
	-webkit-animation: none !important;
	animation: none !important;
}

/* salvattore(JS)が列を組まないので、CSS Grid で確実に段組みする。
   PC=3列、タブレット=2列、スマホ=1列。 */
.et_pb_blog_grid .et_pb_salvattore_content[data-columns] {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
	align-items: start;
}
.et_pb_blog_grid .et_pb_salvattore_content[data-columns] > .et_pb_post {
	width: auto !important;
	max-width: none;
	margin: 0 !important;
	box-sizing: border-box;
	float: none !important;
}
@media (max-width: 980px) {
	.et_pb_blog_grid .et_pb_salvattore_content[data-columns] {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 600px) {
	.et_pb_blog_grid .et_pb_salvattore_content[data-columns] {
		grid-template-columns: 1fr;
	}
}

/* -------------------------------------------------------------------------
   2) ヘッダー/フッターの色を全ページ共通化
      （5ページ分の et-core-unified にしか色定義が無く、他11ページは
       Divi既定色＝白ヘッダー/青リンクに落ちていた。ここで固定する。）
   ---------------------------------------------------------------------- */
/* ヘッダー：黒背景・白文字 */
#main-header,
#main-header .nav li ul,
.et-search-form,
#main-header .et_mobile_menu {
	background-color: #000000;
}
.et_header_style_left #top-menu > li > a,
#top-menu a,
.et_mobile_menu li a,
#et_search_icon:before,
.et_search_form_container input,
span.et_close_search_field:after,
#et-top-navigation .et-cart-info {
	color: #ffffff;
}
/* スクロール追従時の半透明ヘッダー */
.et-fixed-header#main-header,
.et-fixed-header#main-header .nav li ul,
.et-fixed-header .et-search-form {
	background-color: rgba(0, 0, 0, 0.63);
}
.et-fixed-header #top-menu a,
.et-fixed-header #et_search_icon:before,
.et-fixed-header .et_search_form_container input,
.et-fixed-header #et-top-navigation .et-cart-info {
	color: #ffffff !important;
}

/* フッター：こげ茶背景・白文字・金色リンク */
#main-footer {
	background-color: #1c100a;
}
.footer-widget {
	color: #ffffff;
}
#main-footer .footer-widget h4 {
	color: #ffffff;
}
#footer-widgets .footer-widget a,
#footer-widgets .footer-widget li a,
#footer-widgets .footer-widget li a:hover {
	color: #f1d5a9;
}
.footer-widget li:before {
	border-color: #441c10;
}
#et-footer-nav {
	background-color: #441c10;
}
#et-footer-nav .bottom-nav li a,
#et-footer-nav .bottom-nav li.current-menu-item a {
	color: #ffffff;
}
#footer-bottom {
	background-color: #e5e9e9;
}
#footer-info,
#footer-info a,
#footer-bottom .et-social-icon a {
	color: #333333;
}

/* -------------------------------------------------------------------------
   3) 各固定ページ上部のメインビジュアル（ヒーローバナー）
      header.php が非トップページで .fujiya-page-hero を出力する。
   ---------------------------------------------------------------------- */
.fujiya-page-hero {
	position: relative;
	min-height: 300px;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
.fujiya-page-hero::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.38);
}
.fujiya-page-hero-title {
	position: relative;
	z-index: 1;
	margin: 0;
	padding: 0 20px;
	color: #ffffff;
	font-size: 34px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-align: center;
	text-shadow: 0 2px 14px rgba(0, 0, 0, 0.55);
}
@media (max-width: 767px) {
	.fujiya-page-hero {
		min-height: 190px;
	}
	.fujiya-page-hero-title {
		font-size: 23px;
	}
}

/* -------------------------------------------------------------------------
   4) 当館のご案内(about / about-en)：猫背景の「information」バナーを非表示
      このセクションは白文字(color:#fff)＋padding10%の飾り帯で、猫背景を消すと
      白地に白文字の空白帯になる。上部にヒーローバナーを追加済みのため重複。丸ごと隠す。
   ---------------------------------------------------------------------- */
body.page-id-219738 .et_pb_section.et_pb_section_0,
body.page-id-226485 .et_pb_section.et_pb_section_0 {
	display: none !important;
}

/* -------------------------------------------------------------------------
   5) フローティングメニュー（#footerFloatingMenu）
      装飾CSS(footer-fix.css)が未読込で、フッター下に素のテキストが出ていた。
      PC(640px以上)は非表示・スマホは画面下部固定バー、という本来の挙動に統一。
   ---------------------------------------------------------------------- */
#footerFloatingMenu {
	display: none;
}
@media screen and (max-width: 639px) {
	#footerFloatingMenu {
		display: block;
		width: 100%;
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 9999;
		text-align: center;
		background-color: #441c10;
		height: 57px;
	}
	#footerFloatingMenu .menu {
		height: 57px;
		line-height: 57px;
	}
	#footerFloatingMenu a {
		vertical-align: middle;
		font-size: 18px;
		color: #ffffff;
		padding: 0 18px;
	}
	#footerFloatingMenu a i {
		font-size: 22px;
	}
	#footerFloatingMenu a img {
		vertical-align: middle;
	}
}

/* -------------------------------------------------------------------------
   6) お問い合わせ／ご宿泊予約フォーム（Contact Form 7）の整形
      素のままだと項目が左寄せでバラバラに見えるため、読みやすく整える。
   ---------------------------------------------------------------------- */
.fujiya-contact-form,
.fujiya-resv-form {
	max-width: 600px;
	margin: 0 auto;
	padding: 0 16px 40px;
	text-align: left;
}
.fujiya-contact-form .wpcf7-form p,
.fujiya-resv-form .wpcf7-form p {
	margin: 0 0 16px;
}
.fujiya-contact-form label,
.fujiya-resv-form label {
	display: block;
	font-weight: 600;
	color: #3a2a20;
	line-height: 1.9;
}
.fujiya-contact-form input[type="text"],
.fujiya-contact-form input[type="tel"],
.fujiya-contact-form input[type="email"],
.fujiya-contact-form textarea,
.fujiya-resv-form input[type="text"],
.fujiya-resv-form input[type="tel"],
.fujiya-resv-form input[type="email"],
.fujiya-resv-form textarea {
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin-top: 4px;
	padding: 10px 12px;
	border: 1px solid #cfc4bb;
	border-radius: 4px;
	font-size: 16px;
	background: #fff;
}
.fujiya-contact-form textarea,
.fujiya-resv-form textarea {
	min-height: 130px;
	resize: vertical;
}
.fujiya-resv-form input[type="date"] {
	margin-top: 4px;
	padding: 9px 10px;
	border: 1px solid #cfc4bb;
	border-radius: 4px;
	font-size: 16px;
	background: #fff;
}
.fujiya-resv-form input[type="number"] {
	width: 90px;
	margin: 0 6px;
	padding: 9px 10px;
	border: 1px solid #cfc4bb;
	border-radius: 4px;
	font-size: 16px;
	background: #fff;
	text-align: center;
}
.fujiya-resv-form select {
	margin-top: 4px;
	padding: 9px 10px;
	border: 1px solid #cfc4bb;
	border-radius: 4px;
	font-size: 16px;
	background: #fff;
	min-width: 150px;
}
.fujiya-contact-form .wpcf7-submit,
.fujiya-resv-form .wpcf7-submit {
	display: inline-block;
	margin-top: 10px;
	background-color: #441c10;
	color: #ffffff;
	border: none;
	padding: 14px 46px;
	font-size: 17px;
	border-radius: 4px;
	letter-spacing: 0.08em;
	cursor: pointer;
	transition: background-color 0.2s;
}
.fujiya-contact-form .wpcf7-submit:hover,
.fujiya-resv-form .wpcf7-submit:hover {
	background-color: #5c2c18;
}

/* -------------------------------------------------------------------------
   7) ご宿泊予約ページの全体レイアウト（作り直したクリーンな構成用）
   ---------------------------------------------------------------------- */
.fujiya-resv-page {
	max-width: 760px;
	margin: 0 auto;
	padding: 48px 20px 64px;
	color: #3a2a20;
}
.fujiya-resv-lead {
	text-align: center;
	line-height: 2;
	margin: 0 0 36px;
}
.fujiya-resv-contact {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	justify-content: center;
	margin-bottom: 40px;
}
.fujiya-resv-contact-item {
	flex: 1 1 260px;
	max-width: 340px;
	border: 1px solid #e2d8cc;
	border-radius: 6px;
	padding: 22px 16px;
	text-align: center;
	background: #fbf8f4;
}
.fujiya-resv-contact-item i {
	display: block;
	font-size: 26px;
	color: #441c10;
	margin-bottom: 8px;
}
.fujiya-resv-contact-item .ttl {
	display: block;
	font-weight: 600;
	margin-bottom: 6px;
}
.fujiya-resv-contact-item a,
.fujiya-resv-contact-item .num {
	font-size: 22px;
	font-weight: 700;
	color: #441c10;
	letter-spacing: 0.02em;
}
.fujiya-resv-h2 {
	text-align: center;
	font-size: 22px;
	color: #441c10;
	margin: 40px 0 20px;
	padding-bottom: 12px;
	border-bottom: 1px solid #e2d8cc;
}
.fujiya-cancel-table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 auto 12px;
}
.fujiya-cancel-table th,
.fujiya-cancel-table td {
	border: 1px solid #e2d8cc;
	padding: 12px 16px;
	text-align: left;
}
.fujiya-cancel-table th {
	width: 40%;
	background: #f4ede4;
	font-weight: 600;
}
.fujiya-resv-note {
	font-size: 13px;
	color: #777;
	line-height: 1.8;
}
@media (max-width: 600px) {
	.fujiya-resv-page {
		padding: 32px 16px 56px;
	}
	.fujiya-resv-contact-item a,
	.fujiya-resv-contact-item .num {
		font-size: 20px;
	}
}

/* -------------------------------------------------------------------------
   8) 新着情報の個別記事ページ（single.php）
   ---------------------------------------------------------------------- */
.fujiya-single {
	max-width: 760px;
	margin: 0 auto;
	padding: 56px 20px 72px;
	color: #333333;
}
.fujiya-single-eyebrow {
	text-align: center;
	color: #b08d57;
	letter-spacing: 0.2em;
	font-size: 13px;
	margin: 0 0 10px;
}
.fujiya-single-title {
	text-align: center;
	font-size: 28px;
	line-height: 1.5;
	color: #2a2a2a;
	margin: 0 0 12px;
}
.fujiya-single-date {
	text-align: center;
	color: #999999;
	font-size: 14px;
	margin: 0 0 32px;
}
.fujiya-single-thumb {
	margin: 0 0 32px;
	text-align: center;
}
.fujiya-single-thumb img {
	max-width: 100%;
	height: auto;
	border-radius: 4px;
}
.fujiya-single-content {
	line-height: 2;
	font-size: 16px;
}
.fujiya-single-content p {
	margin: 0 0 1.4em;
}
.fujiya-single-back {
	margin-top: 48px;
	text-align: center;
}
.fujiya-single-back a {
	display: inline-block;
	padding: 12px 30px;
	border: 1px solid #441c10;
	color: #441c10;
	border-radius: 4px;
	text-decoration: none;
	transition: all 0.2s;
}
.fujiya-single-back a:hover {
	background: #441c10;
	color: #ffffff;
}
@media (max-width: 600px) {
	.fujiya-single {
		padding: 36px 16px 56px;
	}
	.fujiya-single-title {
		font-size: 22px;
	}
}
