/*
Theme Name:  Hello Elementor for LUWEL
Theme URI:   https://www.luwel.net/
Description: Hello Elementor 子テーマ。投稿（ブログ）と店舗（store）の詳細ページ用テンプレートとスタイルを提供する。
Author:      LUWEL
Template:    hello-elementor
Version:     1.4.0
Text Domain: luwel-child
*/

/* =========================================================
   グローバル：ナビ（UAE flyout）閉じるボタン調整
   ※ 旧カスタマイザー「追加CSS」から移設。全ページ共通で効かせる
   ========================================================= */
.hfe-flyout-close,
.hfe-flyout-close svg{
	top:12px;
	right:2px;
	margin:0;
}

/* 本文の地のフォントを Noto Sans JP に統一（全ページ）
   Elementor の「グローバルフォント」は定義のみで body に効かないため、
   kit セレクタを直接上書きする。kit ID はサイトの body クラス
   （elementor-kit-◯）に合わせる。LUWEL は elementor-kit-7。 */
.elementor-kit-7{ font-family:"Noto Sans JP", sans-serif; }

/* =========================================================
   共通土台：投稿（single-post）／店舗（single-store）の詳細ページ
   - LP（固定ページ）や他テンプレートには影響しない
   - アクセントカラーはサイトのリンク色 #cc3366
   ========================================================= */

/* ① sticky footer：本文が短くてもフッターを最下部へ
   対象＝テーマが描画する全画面（投稿/店舗/一覧/アーカイブ/検索/404）。
   ※ LP（固定ページ）は Elementor キャンバスなので対象外。 */
body.single-post #page,
body.single-store #page,
body.blog #page,
body.archive #page,
body.search #page,
body.error404 #page{
	display:flex;
	flex-direction:column;
	min-height:100vh;
}
body.single-post #content,
body.single-store #content,
body.blog #content,
body.archive #content,
body.search #content,
body.error404 #content{
	flex:1 0 auto;
	width:100%;
	max-width:760px;
	margin-inline:auto;
	padding:110px 20px 64px; /* 上=オーバーレイヘッダー回避 */
	box-sizing:border-box;
}
body.single-post #page > footer,
body.single-store #page > footer,
body.blog #page > footer,
body.archive #page > footer,
body.search #page > footer,
body.error404 #page > footer{ flex-shrink:0; }

/* =========================================================
   投稿（ブログ）テンプレート  ── body.single-post
   ========================================================= */
.lwl-article__header{
	margin:0 0 28px; padding-bottom:24px; border-bottom:1px solid #eee;
}
.lwl-article__title{
	font-size:clamp(1.6rem,4vw,2.2rem); line-height:1.5; font-weight:700; color:#222; letter-spacing:.02em; margin:0;
}

/* 日付・カテゴリ */
.lwl-meta{
	display:flex; flex-wrap:wrap; align-items:center; gap:.6em 1em;
	margin:.9em 0 0; font-size:.85rem; color:#555; letter-spacing:.03em;
}
.lwl-meta__date{ color:#555; }
/* カテゴリ：角丸ラベル（ピル） */
.lwl-meta__cats{ display:inline-flex; flex-wrap:wrap; gap:.4em; }
/* get_the_category_list() の <ul><li> が来た場合の保険（マーカー・を消す） */
.lwl-meta__cats ul.post-categories{ display:contents; list-style:none; margin:0; padding:0; }
.lwl-meta__cats li{ list-style:none; margin:0; padding:0; display:inline; }
.lwl-meta__cats a{
	display:inline-block; padding:.25em .9em; border-radius:999px;
	background:#fdeef4; color:#a8275f; font-size:.78rem; font-weight:700;
	text-decoration:none; line-height:1.6;
}
.lwl-meta__cats a:hover{ background:#f7d9e3; }

/* アイキャッチ画像 */
.lwl-article__thumb{ margin:0 0 32px; }
.lwl-article__thumb img{ width:100%; height:auto; border-radius:14px; display:block; }

/* 本文 */
.lwl-article__body{ font-size:1.05rem; line-height:2; color:#3a3a3a; }
.lwl-article__body p{ margin:0 0 1.6em; }
.lwl-article__body h2{
	font-size:1.5rem; line-height:1.5; font-weight:700; color:#222;
	margin:2.5em 0 .9em; padding:.4em 0 .4em .8em; border-left:5px solid #cc3366;
}
.lwl-article__body h3{
	font-size:1.25rem; line-height:1.5; font-weight:700; color:#222;
	margin:2em 0 .8em; padding-bottom:.35em; border-bottom:2px solid #f0d4de;
}
.lwl-article__body h4{ font-size:1.1rem; font-weight:700; color:#cc3366; margin:1.8em 0 .6em; }
.lwl-article__body a{ color:#cc3366; text-underline-offset:.18em; text-decoration-thickness:1px; }
.lwl-article__body ul,
.lwl-article__body ol{ margin:0 0 1.6em; padding-left:1.4em; }
.lwl-article__body li{ margin:.4em 0; }
.lwl-article__body ul li::marker{ color:#cc3366; }
.lwl-article__body blockquote{
	margin:2em 0; padding:1em 1.2em; background:#faf3f6;
	border-left:4px solid #cc3366; border-radius:0 8px 8px 0; color:#555;
}
.lwl-article__body blockquote p:last-child{ margin-bottom:0; }
.lwl-article__body img{ max-width:100%; height:auto; border-radius:10px; }
.lwl-article__body figure{ margin:2em 0; }
.lwl-article__body figcaption{ margin-top:.6em; font-size:.85rem; color:#999; text-align:center; }
.lwl-article__body strong{ font-weight:700; background:linear-gradient(transparent 62%,#f7d9e3 62%); }
.lwl-article__body hr{ border:0; border-top:1px dashed #ddd; margin:2.5em 0; }
.lwl-article__body table{ width:100%; border-collapse:collapse; margin:2em 0; font-size:.95rem; }
.lwl-article__body th,
.lwl-article__body td{ border:1px solid #e5e5e5; padding:.7em 1em; text-align:left; }
.lwl-article__body th{ background:#faf3f6; font-weight:700; }
.lwl-article__body code{
	background:#f4f4f4; padding:.15em .45em; border-radius:4px; font-size:.9em; color:#c0386a;
}

/* 前後記事ナビ */
.lwl-nav{ display:flex; gap:16px; margin:56px 0 8px; }
.lwl-nav__link{
	flex:1 1 0; min-width:0; display:flex; flex-direction:column; gap:6px;
	padding:16px 20px; border:1px solid #ececec; border-radius:14px; background:#fff;
	text-decoration:none; color:#333; transition:border-color .2s, box-shadow .2s, transform .2s;
}
.lwl-nav__link:hover{ border-color:#cc3366; box-shadow:0 6px 18px rgba(204,51,102,.12); transform:translateY(-2px); }
.lwl-nav__link--next{ text-align:right; align-items:flex-end; }
.lwl-nav__label{ font-size:.76rem; font-weight:700; color:#cc3366; letter-spacing:.05em; }
.lwl-nav__title{
	font-size:.95rem; line-height:1.45; font-weight:600;
	display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}

/* =========================================================
   店舗（store）テンプレート  ── body.single-store
   - store-map のメタを single-store.php で直接読み、参考(mermaid)の
     Information パネルに忠実なレイアウトで表示
   - 配色は mermaid 準拠：パネル #ffe9f0 / アクセント #ffa6b2 / 数字 #cc3366
   ========================================================= */
body.single-store #content{ max-width:1000px; }

.lwl-store__header{ margin:0 0 24px; }
.lwl-store__title{
	font-size:clamp(1.6rem,4vw,2.2rem); line-height:1.4; font-weight:700; color:#292929; margin:0;
}
.lwl-store__area{
	display:inline-block; margin:.7em 0 0; padding:.3em 1em;
	background:#ffa6b2; color:#fff; font-size:.78rem; font-weight:700; border-radius:999px; letter-spacing:.05em;
}

/* 2カラム（PC：左=写真/キャッチ/説明/立地、右=ピンクパネル） */
.lwl-store__layout{ display:flex; gap:32px; align-items:flex-start; }
.lwl-store__left{ flex:1 1 auto; min-width:0; }
.lwl-store__right{ flex:0 0 400px; background:#ffe9f0; border-radius:20px; padding:24px; box-sizing:border-box; }

/* 写真カルーセル（Swiper：メイン＋サムネ） */
.lwl-store__gallery{ display:block; margin-bottom:18px; }
.lwl-store__gallery-main{ border-radius:16px; overflow:hidden; }
.lwl-store__gallery-main .swiper-slide img{ width:100%; aspect-ratio:16 / 10; object-fit:cover; display:block; }
.lwl-store__gallery-main .swiper-button-prev,
.lwl-store__gallery-main .swiper-button-next{ color:#fff; --swiper-navigation-size:26px; text-shadow:0 1px 4px rgba(0,0,0,.35); }
.lwl-store__thumbs{ display:flex; gap:8px; margin-top:8px; }
.lwl-store__thumb{ flex:1 1 0; min-width:0; padding:0; border:0; background:none; cursor:pointer; border-radius:8px; overflow:hidden; opacity:.5; transition:opacity .2s; }
.lwl-store__thumb.is-active{ opacity:1; outline:2px solid #cc3366; outline-offset:-2px; }
.lwl-store__thumb img{ width:100%; aspect-ratio:1 / 1; object-fit:cover; display:block; }

/* キャッチコピー */
.lwl-store__catch{ font-size:1.3rem; font-weight:700; color:#cc3366; line-height:1.55; margin:0 0 14px; }

/* 説明文（本文） */
.lwl-store__desc{ margin:0 0 22px; font-size:1rem; line-height:1.9; color:#3a3a3a; }
.lwl-store__desc p{ margin:0 0 1.2em; }
.lwl-store__desc p:last-child{ margin-bottom:0; }

/* 時給/月収・立地カード */
.lwl-store__cards{ display:flex; flex-direction:column; gap:14px; margin-bottom:14px; }
.lwl-store__card{
	display:flex; align-items:center; gap:14px;
	background:#fff; border:2px solid #ffa6b2; border-radius:10px; padding:8px 18px 8px 8px;
}
.lwl-store__card-head{
	flex:0 0 auto; min-width:88px; text-align:center;
	background:#ffa6b2; color:#fff; font-weight:700; font-size:.82rem;
	padding:9px 12px; border-radius:6px; line-height:1.5;
}
.lwl-store__card-text{ flex:1; color:#292929; font-weight:500; line-height:1.6; }
.lwl-store__card--stat .lwl-store__card-text{ font-size:1.25rem; font-weight:800; color:#cc3366; }

/* 詳細（罫線区切り） */
.lwl-store__detail{ margin:6px 0 0; }
.lwl-store__drow{ display:flex; gap:16px; padding:15px 2px; border-bottom:1px solid #f3c6d2; }
.lwl-store__drow:last-child{ border-bottom:0; }
.lwl-store__dhead{ flex:0 0 32%; font-weight:700; color:#292929; }
.lwl-store__dtext{ flex:1; color:#292929; line-height:1.7; }

/* 問い合わせ CTA */
.lwl-store__contact{ margin-top:20px; background:#fff; border-radius:16px; padding:22px 18px; text-align:center; }
.lwl-store__contact-head{ font-size:1.05rem; font-weight:700; color:#292929; margin:0 0 14px; }
.lwl-store__line-btn{
	display:inline-flex; align-items:center; justify-content:center; gap:.6em;
	width:100%; padding:13px 18px; background:#06c755; color:#fff;
	font-weight:700; font-size:.95rem; border-radius:999px; text-decoration:none;
}
.lwl-store__line-btn:hover{ filter:brightness(1.05); }
.lwl-store__line-ico{ background:#fff; color:#06c755; font-size:.58rem; font-weight:800; padding:.25em .45em; border-radius:5px; letter-spacing:.03em; }
.lwl-store__contact-lead{ color:#06b048; font-weight:700; font-size:.82rem; margin:12px 0 16px; }
.lwl-store__tel{ display:inline-flex; align-items:center; gap:.25em; font-size:1.5rem; font-weight:800; color:#292929; text-decoration:none; line-height:1.2; }

/* =========================================================
   一覧テンプレート（index.php：投稿ページ／アーカイブ／検索）
   ========================================================= */
.lwl-list__header{ margin:0 0 28px; padding-bottom:20px; border-bottom:1px solid #eee; }
.lwl-list__page-title{ font-size:clamp(1.5rem,3.5vw,2rem); font-weight:700; color:#222; margin:0; line-height:1.4; }
.lwl-list{ display:flex; flex-direction:column; }
.lwl-list__item{ border-bottom:1px solid #eee; }
.lwl-list__item:last-child{ border-bottom:0; }
.lwl-list__link{ display:flex; gap:18px; align-items:flex-start; padding:20px 0; text-decoration:none; color:inherit; }
.lwl-list__thumb{ flex:0 0 200px; }
.lwl-list__thumb img{ width:100%; aspect-ratio:16 / 10; object-fit:cover; border-radius:10px; display:block; }
.lwl-list__body{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:8px; }
.lwl-list__meta{ display:flex; flex-wrap:wrap; align-items:center; gap:.5em 1em; font-size:.8rem; color:#555; }
.lwl-list__cat{ background:#fdeef4; color:#a8275f; font-weight:700; padding:.2em .8em; border-radius:999px; font-size:.72rem; }
.lwl-list__title{ font-size:1.15rem; font-weight:700; color:#222; line-height:1.5; }
.lwl-list__link:hover .lwl-list__title{ color:#cc3366; }
.lwl-list__excerpt{ font-size:.92rem; color:#666; line-height:1.7; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.lwl-list__empty{ color:#666; padding:40px 0; }

/* ページネーション（the_posts_pagination） */
#content .pagination{ margin:36px 0 8px; }
#content .pagination .nav-links{ display:flex; flex-wrap:wrap; justify-content:center; gap:6px; }
#content .pagination .page-numbers{
	display:inline-flex; align-items:center; justify-content:center; min-width:40px; height:40px; padding:0 12px;
	border:1px solid #f0d4de; border-radius:8px; color:#cc3366; font-weight:700; text-decoration:none;
}
#content .pagination .page-numbers.current{ background:#cc3366; color:#fff; border-color:#cc3366; }
#content .pagination .page-numbers:not(.current):hover{ background:#fdeef4; }
#content .pagination .page-numbers.dots{ border-color:transparent; }

/* 404 */
.lwl-404{ text-align:center; padding:40px 0 20px; }
.lwl-404__code{ font-size:5rem; font-weight:800; color:#ffa6b2; line-height:1; margin:0; }
.lwl-404__title{ font-size:1.5rem; font-weight:700; color:#222; margin:.4em 0; }
.lwl-404__text{ color:#666; line-height:1.8; margin:0; }
.lwl-404__home{ margin-top:26px; }
.lwl-404__home a{ display:inline-block; padding:13px 30px; background:#cc3366; color:#fff; border-radius:999px; text-decoration:none; font-weight:700; }
.lwl-404__home a:hover{ filter:brightness(1.05); }

/* =========================================================
   スマホ / タブレット
   ========================================================= */
@media (max-width:920px){
	.lwl-nav{ flex-direction:column; gap:12px; margin-top:40px; }
	.lwl-nav__link--next{ text-align:left; align-items:flex-start; }
	/* 店舗：2カラム → 縦積み */
	.lwl-store__layout{ flex-direction:column; }
	.lwl-store__right{ flex-basis:auto; width:100%; }
}
@media (max-width:768px){
	body.single-post #content,
	body.single-store #content,
	body.blog #content,
	body.archive #content,
	body.search #content,
	body.error404 #content{ padding:90px 16px 48px; }
	.lwl-article__body{ font-size:1rem; line-height:1.95; }
	.lwl-article__header{ margin-bottom:24px; }
}
@media (max-width:480px){
	.lwl-store__right{ padding:16px; }
	.lwl-store__card{ padding:12px; }
	.lwl-store__card-head{ min-width:80px; font-size:.78rem; padding:8px 10px; }
	.lwl-store__drow{ flex-direction:column; gap:4px; }
	.lwl-store__dhead{ flex-basis:auto; }
	.lwl-store__catch{ font-size:1.15rem; }
	.lwl-list__link{ gap:12px; padding:16px 0; }
	.lwl-list__thumb{ flex-basis:108px; }
	.lwl-list__title{ font-size:1rem; }
	.lwl-list__excerpt{ font-size:.85rem; }
}
