/* ==========================================================================
   Badminton Gut Antenna - Base Styles
   デザインコンセプト: Notion風ミニマルUI(白背景・薄いグレー罫線・角丸・落ち着いたタイポグラフィ)
   ========================================================================== */

:root {
	--bga-text: #37352F;         /* Notionの標準テキストカラー */
	--bga-text-muted: #9B9A97;
	--bga-bg: #FFFFFF;
	--bga-bg-soft: #F7F6F5;      /* Notionのページ背景に近いオフホワイト */
	--bga-border: #E9E9E7;
	--bga-accent: #0E9F8E;       /* バドミントンコートを思わせるティールグリーン */
	--bga-accent-soft: #E3F6F3;
	--bga-warn: #D9730D;         /* オレンジ系タグ(即日対応などに使用) */
	--bga-warn-soft: #FAEBDD;
	--bga-pr: #0F7B6C;           /* PR/スポンサー用のグリーン系タグ */
	--bga-pr-soft: #DDEDEA;
	--bga-radius: 6px;
	--bga-radius-lg: 10px;
	--bga-shadow: 0 1px 2px rgba(0,0,0,0.06), 0 1px 1px rgba(0,0,0,0.04);
	--bga-shadow-hover: 0 4px 12px rgba(0,0,0,0.08);
	--bga-font: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Yu Gothic", "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }

body {
	margin: 0;
	font-family: var(--bga-font);
	background: var(--bga-bg);
	color: var(--bga-text);
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }

.bga-container { max-width: 1100px; margin: 0 auto; padding: 24px 20px; }

/* ---------- Header ---------- */
.bga-header { background: var(--bga-bg); border-bottom: 1px solid var(--bga-border); position: sticky; top: 0; z-index: 100; }
.bga-header__inner { max-width: 1100px; margin: 0 auto; padding: 14px 20px; display: flex; align-items: center; gap: 24px; }
.bga-logo { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 16px; color: var(--bga-text); white-space: nowrap; }
.bga-logo__mark { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; background: var(--bga-accent-soft); border: 1px solid var(--bga-border); border-radius: var(--bga-radius); font-size: 14px; }
.bga-header-search { flex: 1; display: flex; max-width: 440px; }
.bga-header-search input { flex: 1; padding: 8px 12px; border: 1px solid var(--bga-border); border-radius: var(--bga-radius) 0 0 var(--bga-radius); font-size: 13px; background: var(--bga-bg-soft); }
.bga-header-search input:focus { outline: none; background: var(--bga-bg); border-color: var(--bga-accent); }
.bga-header-search button { padding: 8px 16px; background: var(--bga-text); color: #fff; border: none; border-radius: 0 var(--bga-radius) var(--bga-radius) 0; cursor: pointer; font-size: 13px; }
.bga-header-search button:hover { background: #000; }
.bga-header-nav ul { display: flex; gap: 16px; list-style: none; margin: 0; padding: 0; font-size: 13px; color: var(--bga-text-muted); }

/* ---------- Hero (front page): Notion風のシンプルなページヘッダー ---------- */
/* ---------- Hero (front page): Notion風+バドミントン要素 ---------- */
.bga-hero {
	background: var(--bga-bg);
	background-image: repeating-linear-gradient(45deg, var(--bga-accent-soft) 0, var(--bga-accent-soft) 1px, transparent 1px, transparent 44px);
	padding: 56px 20px 40px;
	text-align: center;
	border-bottom: 1px solid var(--bga-border);
}
.bga-hero__bgtext { display: none; }
.bga-hero__icon { font-size: 56px; line-height: 1; margin-bottom: 12px; display: inline-block; }
.bga-hero__inner { position: relative; max-width: 640px; margin: 0 auto; }
.bga-hero__title { font-size: clamp(24px, 4vw, 32px); font-weight: 700; letter-spacing: -0.01em; margin: 0 0 10px; line-height: 1.5; color: var(--bga-text); }
.bga-hero__lead { font-size: 14px; color: var(--bga-text-muted); margin: 0 0 28px; }
.bga-hero-search__row { display: flex; background: var(--bga-bg); border: 1px solid var(--bga-border); border-radius: var(--bga-radius-lg); overflow: hidden; box-shadow: var(--bga-shadow); }
.bga-hero-search__input { flex: 1; border: none; padding: 14px 16px; font-size: 14px; background: transparent; }
.bga-hero-search__input:focus { outline: none; }
.bga-hero-search__btn { border: none; background: var(--bga-text); color: #fff; padding: 0 24px; font-weight: 600; cursor: pointer; font-size: 13px; }
.bga-hero-search__btn:hover { background: #000; }
.bga-hero-search__quicklinks { margin-top: 14px; font-size: 12px; color: var(--bga-text-muted); }
.bga-hero-search__quicklinks a { margin-left: 8px; color: var(--bga-accent); }
.bga-hero-search__quicklinks a:hover { text-decoration: underline; }

.bga-section-title { font-size: 16px; font-weight: 700; margin: 0 0 16px; color: var(--bga-text); }

/* ---------- PR注目のお店 ---------- */
.bga-pr-section { max-width: 1100px; margin: 0 auto; padding: 40px 20px 8px; }
.bga-list--pr { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.bga-list--pr .bga-shop-card__link { flex-direction: column; }
.bga-list--pr .bga-shop-card__thumb { width: 100%; height: 150px; }

/* ---------- エリアから探す(地方グルーピング) ---------- */
.bga-pref-list { max-width: 1100px; margin: 0 auto; padding: 40px 20px; }
.bga-region-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px; }
.bga-region-block { background: var(--bga-bg); border: 1px solid var(--bga-border); border-radius: var(--bga-radius-lg); padding: 14px 16px; }
.bga-region-block__title { font-size: 13px; font-weight: 700; margin: 0 0 10px; color: var(--bga-text); }
.bga-region-block__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 10px; }
.bga-region-block__list a { font-size: 12px; color: var(--bga-text-muted); }
.bga-region-block__list a:hover { color: var(--bga-accent); text-decoration: underline; }
.bga-pref-count { color: var(--bga-text-muted); font-size: 11px; }

/* ---------- /pref/ 都道府県一覧ページ ---------- */
.bga-search__heading { padding: 8px 0 20px; }
.bga-search__heading h1 { font-size: 20px; font-weight: 700; margin: 0 0 6px; }
.bga-search__lead { font-size: 13px; color: var(--bga-text-muted); margin: 0; }

/* ---------- ブログ(最新記事)セクション ---------- */
.bga-blog-section { max-width: 1100px; margin: 0 auto; padding: 16px 20px 56px; }
.bga-blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 14px; }
.bga-blog-card { background: var(--bga-bg); border: 1px solid var(--bga-border); border-radius: var(--bga-radius-lg); overflow: hidden; transition: box-shadow .15s ease, transform .15s ease; }
.bga-blog-card:hover { box-shadow: var(--bga-shadow-hover); transform: translateY(-2px); }
.bga-blog-card__link { display: block; }
.bga-blog-card__thumb { height: 150px; background: var(--bga-bg-soft); }
.bga-blog-card__thumb img { width: 100%; height: 100%; object-fit: cover; }
.bga-blog-card__body { padding: 14px; }
.bga-blog-card__date { font-size: 11px; color: var(--bga-text-muted); }
.bga-blog-card__title { font-size: 14px; font-weight: 700; margin: 6px 0; }
.bga-blog-card__excerpt { font-size: 12px; color: var(--bga-text-muted); margin: 0; line-height: 1.6; }
.bga-blog-more { text-align: center; margin-top: 24px; }
.bga-blog-more__link { font-weight: 600; color: var(--bga-accent); font-size: 13px; }

/* ---------- Search / Archive page ---------- */
.bga-search { max-width: 1100px; margin: 0 auto; padding: 20px; }
.bga-search__toolbar { display: flex; justify-content: space-between; align-items: center; padding: 8px 0 16px; font-size: 12px; color: var(--bga-text-muted); }
.bga-search__body { display: grid; grid-template-columns: 220px 1fr; gap: 20px; align-items: start; }

.bga-filters { background: var(--bga-bg); border: 1px solid var(--bga-border); border-radius: var(--bga-radius-lg); padding: 16px; position: sticky; top: 76px; }
.bga-filters__title { font-size: 13px; font-weight: 700; margin: 0 0 14px; }
.bga-filter-group { margin-bottom: 20px; }
.bga-filter-group h3 { font-size: 11px; font-weight: 700; color: var(--bga-text-muted); margin: 0 0 8px; text-transform: uppercase; letter-spacing: 0.03em; }
.bga-filter-select { width: 100%; padding: 8px; border: 1px solid var(--bga-border); border-radius: var(--bga-radius); font-size: 13px; background: var(--bga-bg-soft); }
.bga-filter-checklist { list-style: none; margin: 0; padding: 0; font-size: 13px; }
.bga-filter-checklist li { margin-bottom: 8px; }
.bga-filter-apply { width: 100%; padding: 10px; background: var(--bga-text); color: #fff; border: none; border-radius: var(--bga-radius); font-weight: 600; cursor: pointer; font-size: 13px; }
.bga-filter-apply:hover { background: #000; }

.bga-list { display: flex; flex-direction: column; gap: 10px; }

/* ---------- Shop Card ---------- */
.bga-shop-card { background: var(--bga-bg); border: 1px solid var(--bga-border); border-radius: var(--bga-radius-lg); overflow: hidden; transition: box-shadow .15s ease, transform .15s ease; }
.bga-shop-card:hover { box-shadow: var(--bga-shadow-hover); transform: translateY(-2px); }
.bga-shop-card--sponsored { border-color: var(--bga-pr); }
.bga-shop-card__link { display: flex; }
.bga-shop-card__thumb { position: relative; width: 150px; min-width: 150px; height: 110px; background: var(--bga-bg-soft); }
.bga-shop-card__thumb img { width: 100%; height: 100%; object-fit: cover; }
.bga-shop-card__noimage { display: flex; align-items: center; justify-content: center; height: 100%; font-size: 28px; opacity: 0.3; background: var(--bga-bg-soft); }
.bga-shop-card__badge { position: absolute; top: 8px; left: 8px; background: var(--bga-warn-soft); color: var(--bga-warn); font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 12px; }
.bga-shop-card__badge--pr { background: var(--bga-pr-soft); color: var(--bga-pr); left: auto; right: 8px; }
.bga-shop-card__body { padding: 12px 14px; flex: 1; }
.bga-shop-card__title { font-size: 14px; font-weight: 700; margin: 0 0 4px; }
.bga-shop-card__access { font-size: 12px; color: var(--bga-text-muted); margin: 0 0 8px; }
.bga-badges { list-style: none; display: flex; gap: 6px; flex-wrap: wrap; margin: 0 0 8px; padding: 0; }
.bga-badge { font-size: 11px; background: var(--bga-accent-soft); color: var(--bga-accent); padding: 2px 9px; border-radius: 12px; font-weight: 600; }
.bga-shop-card__footer { display: flex; justify-content: flex-end; }
.bga-shop-card__price { font-weight: 700; color: var(--bga-warn); font-size: 13px; }
.bga-shop-card__price--muted { color: var(--bga-text-muted); font-weight: 400; font-size: 11px; }

.bga-empty-note { color: var(--bga-text-muted); padding: 24px; text-align: center; font-size: 13px; }

/* ---------- パンくずリスト ---------- */
.bga-breadcrumbs { max-width: 1100px; margin: 0 auto; padding: 14px 20px 0; }
.bga-breadcrumbs__list { list-style: none; display: flex; flex-wrap: wrap; gap: 4px; margin: 0; padding: 0; font-size: 12px; color: var(--bga-text-muted); }
.bga-breadcrumbs__item { display: flex; align-items: center; gap: 4px; }
.bga-breadcrumbs__item:not(:last-child)::after { content: "/"; margin-left: 4px; color: var(--bga-border); }
.bga-breadcrumbs__item a { color: var(--bga-text-muted); }
.bga-breadcrumbs__item a:hover { color: var(--bga-accent); text-decoration: underline; }

/* ---------- フッター ---------- */
.bga-footer { background: var(--bga-bg-soft); border-top: 1px solid var(--bga-border); margin-top: 48px; }
.bga-footer__inner { max-width: 1100px; margin: 0 auto; padding: 40px 20px; display: grid; grid-template-columns: 2fr 1fr; gap: 32px; }
.bga-logo--footer { color: var(--bga-text); }
.bga-footer__lead { font-size: 13px; color: var(--bga-text-muted); margin-top: 10px; line-height: 1.8; max-width: 320px; }
.bga-footer__heading { font-size: 12px; font-weight: 700; margin: 0 0 14px; color: var(--bga-text-muted); text-transform: uppercase; letter-spacing: 0.03em; }
.bga-footer__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; font-size: 13px; }
.bga-footer__list a { color: var(--bga-text); }
.bga-footer__list a:hover { color: var(--bga-accent); }
@media (max-width: 700px) {
	.bga-footer__inner { grid-template-columns: 1fr; }
}

/* ---------- Googleマップ埋め込み ---------- */
.bga-map-embed { border-radius: var(--bga-radius-lg); overflow: hidden; border: 1px solid var(--bga-border); margin-bottom: 12px; }
.bga-map-embed iframe { display: block; }

/* ---------- 店舗ページURL表示ボックス ---------- */
.bga-shop-url-box { background: var(--bga-bg); border: 1px solid var(--bga-border); border-radius: var(--bga-radius-lg); padding: 14px; }
.bga-shop-url-box__label { font-size: 11px; font-weight: 700; margin: 0 0 8px; color: var(--bga-text-muted); }
.bga-shop-url-box__row { display: flex; gap: 6px; }
.bga-shop-url-box__input { flex: 1; min-width: 0; font-size: 11px; padding: 8px; border: 1px solid var(--bga-border); border-radius: var(--bga-radius); color: var(--bga-text-muted); background: var(--bga-bg-soft); }
.bga-shop-url-box__copy { font-size: 12px; font-weight: 600; padding: 0 12px; background: var(--bga-text); color: #fff; border: none; border-radius: var(--bga-radius); cursor: pointer; white-space: nowrap; }
.bga-shop-url-box__copy:hover { background: #000; }
.bga-shop-url-box__link { display: block; margin-top: 10px; font-size: 12px; font-weight: 600; color: var(--bga-accent); }

/* ---------- Shop detail ---------- */
.bga-shop-detail__hero img { width: 100%; max-height: 340px; object-fit: cover; }
.bga-shop-detail__body { max-width: 1100px; margin: 0 auto; padding: 24px 20px; display: grid; grid-template-columns: 1fr 300px; gap: 24px; }
.bga-shop-detail__header h1 { font-size: 20px; font-weight: 700; margin: 0 0 10px; }
.bga-shop-detail__section { margin-bottom: 32px; }
.bga-shop-detail__section h2 { font-size: 14px; font-weight: 700; color: var(--bga-text-muted); text-transform: uppercase; letter-spacing: 0.03em; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--bga-border); }
.bga-info-table, .bga-price-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.bga-info-table th, .bga-price-table th, .bga-price-table td { border-bottom: 1px solid var(--bga-border); padding: 10px 4px; text-align: left; }
.bga-info-table th { width: 110px; color: var(--bga-text-muted); font-weight: 500; vertical-align: top; }
.bga-maps-link { margin-left: 8px; font-size: 12px; color: var(--bga-accent); }
.bga-maps-cta { margin-top: 0; }
.bga-maps-cta__btn { display: block; text-align: center; padding: 12px; background: var(--bga-text); color: #fff; border-radius: var(--bga-radius); font-weight: 600; font-size: 13px; }
.bga-maps-cta__btn:hover { background: #000; }
.bga-sns-list { list-style: none; padding: 0; }
.bga-sns-list a { display: inline-block; margin-bottom: 8px; padding: 8px 16px; background: var(--bga-bg-soft); border: 1px solid var(--bga-border); color: var(--bga-text); border-radius: var(--bga-radius); font-size: 13px; }

/* ---------- 管理画面: 店舗一覧のスポンサーバッジ・並び替え ---------- */
.bga-admin-badge { display: inline-block; font-size: 11px; color: #999; }
.bga-admin-badge--sponsor { background: var(--bga-pr); color: #fff; padding: 2px 8px; border-radius: 10px; font-weight: 700; }

/* ---------- ブログ記事ページ ---------- */
.bga-post-page { max-width: 1100px; margin: 0 auto; padding: 0 20px 56px; }
.bga-post__category { display: inline-block; background: var(--bga-accent-soft); color: var(--bga-accent); font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 12px; margin-bottom: 10px; }
.bga-post__title { font-size: clamp(20px, 3.4vw, 28px); font-weight: 700; line-height: 1.5; margin: 0 0 12px; }
.bga-post__meta { display: flex; gap: 16px; font-size: 12px; color: var(--bga-text-muted); margin-bottom: 20px; }
.bga-post__eyecatch { border-radius: var(--bga-radius-lg); overflow: hidden; margin-bottom: 24px; border: 1px solid var(--bga-border); }
.bga-post__eyecatch img { width: 100%; max-height: 400px; object-fit: cover; }
.bga-post__main { max-width: 720px; margin: 0 auto; }

.bga-toc { background: var(--bga-bg-soft); border: 1px solid var(--bga-border); border-radius: var(--bga-radius-lg); padding: 18px 20px; margin-bottom: 32px; }
.bga-toc__title { font-weight: 700; margin: 0 0 10px; font-size: 13px; }
.bga-toc__list { margin: 0; padding-left: 20px; font-size: 13px; line-height: 2; }
.bga-toc__item--sub { list-style: none; margin-left: 12px; }
.bga-toc a { color: var(--bga-accent); }

.bga-post__content { font-size: 15px; line-height: 1.9; color: var(--bga-text); }
.bga-post__content h2 { font-size: 20px; font-weight: 700; margin: 40px 0 16px; padding-bottom: 8px; border-bottom: 1px solid var(--bga-border); }
.bga-post__content h3 { font-size: 16px; font-weight: 700; margin: 28px 0 12px; padding-left: 10px; border-left: 3px solid var(--bga-accent); }
.bga-post__content p { margin: 0 0 20px; }
.bga-post__content img { max-width: 100%; height: auto; border-radius: var(--bga-radius); margin: 16px 0; border: 1px solid var(--bga-border); }
.bga-post__content ul, .bga-post__content ol { margin: 0 0 20px; padding-left: 24px; line-height: 1.9; }
.bga-post__content blockquote { border-left: 3px solid var(--bga-border); background: var(--bga-bg-soft); padding: 12px 18px; margin: 20px 0; color: var(--bga-text-muted); border-radius: 0 var(--bga-radius) var(--bga-radius) 0; }
.bga-post__content a { color: var(--bga-accent); text-decoration: underline; }
.bga-post__content table { width: 100%; border-collapse: collapse; margin: 20px 0; font-size: 13px; }
.bga-post__content th, .bga-post__content td { border: 1px solid var(--bga-border); padding: 8px 12px; }

.bga-post__tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 32px 0; }
.bga-post__tag { font-size: 11px; background: var(--bga-accent-soft); color: var(--bga-accent); padding: 4px 10px; border-radius: 12px; }

.bga-post__share { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 20px 0; border-top: 1px solid var(--bga-border); border-bottom: 1px solid var(--bga-border); margin-bottom: 40px; }
.bga-post__share-label { font-size: 12px; font-weight: 600; color: var(--bga-text-muted); }
.bga-post__share-btn { font-size: 12px; font-weight: 600; padding: 6px 14px; border: 1px solid var(--bga-border); border-radius: 20px; color: var(--bga-text); }
.bga-post__share-btn:hover { background: var(--bga-bg-soft); }

.bga-related-posts { margin-top: 40px; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
	.bga-search__body { grid-template-columns: 1fr; }
	.bga-filters { position: relative; top: 0; }
	.bga-shop-detail__body { grid-template-columns: 1fr; }
	.bga-header-search { display: none; }
}

/* ---------- 現在地から探す ---------- */
.bga-geo-btn { width: 100%; padding: 10px; background: var(--bga-accent); color: #fff; border: none; border-radius: var(--bga-radius); font-weight: 600; cursor: pointer; font-size: 13px; }
.bga-geo-btn:hover { background: #1a6dc4; }
.bga-geo-btn:disabled { opacity: 0.6; cursor: default; }
.bga-geo-status { font-size: 11px; color: var(--bga-text-muted); margin: 8px 0 0; min-height: 14px; }
.bga-distance-badge { color: var(--bga-accent); font-weight: 600; }