/* テーマ独自の追加 CSS。app.css (原本) は変更せず、WordPress 化で増えた部品だけをここに置く。 */

/* 事例が 0 件のときの表示 */
.fl-empty{grid-column:1/-1;text-align:center;padding:2.5rem 0;font-size:.875rem;line-height:2;color:oklch(var(--foreground-600))}
@media (min-width:768px){.fl-empty{font-size:1rem}}

/* ボタン (事例一覧へ戻る など)。原本の「お問い合わせ」ボタンと同じ配色 */
.fl-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:.375rem;background-color:oklch(var(--accent-500));color:oklch(var(--background-50));font-weight:700;font-size:.875rem;padding:.875rem 2rem;cursor:pointer;transition:background-color .2s;white-space:nowrap;text-decoration:none}
.fl-btn:hover{background-color:oklch(var(--accent-600))}
@media (min-width:768px){.fl-btn{font-size:1rem;padding:1rem 2.5rem}}

/* 事例一覧のページ送り */
.fl-pager{display:flex;justify-content:center;gap:.5rem;margin-top:2rem}
.fl-pager__item{display:inline-flex;align-items:center;justify-content:center;min-width:2.25rem;height:2.25rem;padding:0 .5rem;border-radius:.375rem;border:1px solid oklch(var(--background-300));font-size:.875rem;color:oklch(var(--foreground-700));text-decoration:none;background:oklch(var(--background-50))}
.fl-pager__item:hover{border-color:oklch(var(--primary-500));color:oklch(var(--primary-600))}
.fl-pager__item.is-current{background:oklch(var(--primary-500));border-color:oklch(var(--primary-500));color:oklch(var(--background-50))}

/* お問い合わせフォームの結果表示 */
#contact-form .fl-notice{border-radius:.5rem;padding:1rem 1.25rem;margin-bottom:1rem;font-size:.875rem;line-height:1.8}
#contact-form .fl-notice p{margin:0}
#contact-form .fl-notice__title{font-weight:700;margin-bottom:.25rem}
#contact-form .fl-notice ul{margin:.25rem 0 0;padding-left:1.25rem;list-style:disc}
#contact-form .fl-notice--ok{background:#ecfdf3;border:1px solid #a6f4c5;color:#054f31}
#contact-form .fl-notice--error{background:#fef3f2;border:1px solid #fecdca;color:#912018}

/* 事例の本文 (ブロックエディタの出力)。原本の CSS は見出し・リストなどを初期化しているので、読みやすい書式を戻す */
.fl-prose{color:oklch(var(--foreground-700));font-size:.9375rem;line-height:2}
@media (min-width:768px){.fl-prose{font-size:1rem}}
.fl-prose{margin-top:1.5rem}@media (min-width:768px){.fl-prose{margin-top:2rem}}
.fl-prose>*+*{margin-top:1.25rem}
.fl-prose h2{font-family:var(--font-heading);font-weight:600;font-size:1.25rem;line-height:1.5;color:oklch(var(--foreground-950));margin-top:2.25rem;padding-bottom:.5rem;border-bottom:2px solid oklch(var(--primary-500))}
.fl-prose h3{font-family:var(--font-heading);font-weight:600;font-size:1.0625rem;line-height:1.5;color:oklch(var(--foreground-950));margin-top:1.75rem}
@media (min-width:768px){.fl-prose h2{font-size:1.5rem}.fl-prose h3{font-size:1.25rem}}
.fl-prose p{margin-top:1rem}
.fl-prose a{color:oklch(var(--primary-600));text-decoration:underline;text-underline-offset:3px}
.fl-prose ul{list-style:disc;padding-left:1.5rem}
.fl-prose ol{list-style:decimal;padding-left:1.5rem}
.fl-prose li+li{margin-top:.25rem}
.fl-prose img{max-width:100%;height:auto;border-radius:.5rem}
.fl-prose figure{margin-left:0;margin-right:0}
.fl-prose figcaption{margin-top:.5rem;font-size:.75rem;color:oklch(var(--foreground-500));text-align:center}
.fl-prose blockquote{border-left:4px solid oklch(var(--background-300));padding-left:1rem;color:oklch(var(--foreground-600))}
.fl-prose table{width:100%;border-collapse:collapse;font-size:.875rem}
.fl-prose th,.fl-prose td{border:1px solid oklch(var(--background-300));padding:.5rem .75rem;text-align:left}
.fl-prose th{background:oklch(var(--background-200))}
.fl-prose .wp-block-image img{display:block}
.fl-prose .aligncenter,.fl-prose .has-text-align-center{text-align:center}

/* PCヘッダー(lg以上): メニューの文字を大きく・項目の間隔を広げ、メニューを右寄せして「Contact」までの余白を詰める (先方依頼 2026-10-23) */
@media (min-width:1024px){
 header>div>nav{margin-left:auto;margin-right:1.5rem;gap:.125rem}
 header>div>nav a,header>div>nav .group>a{padding-left:.875rem;padding-right:.875rem}
 header>div>nav a>span:first-child{font-size:12.5px}
 header>div>nav a>span:nth-child(2){font-size:14px}
 header>div>nav a:after{left:.875rem;right:.875rem}
}
@media (min-width:1280px){
 header>div>nav{gap:.5rem;margin-right:1.75rem}
 header>div>nav a,header>div>nav .group>a{padding-left:1.125rem;padding-right:1.125rem}
 header>div>nav a:after{left:1.125rem;right:1.125rem}
}
/* ドロップダウン内のリンクは対象外 */
header>div>nav .group>div a{padding-left:.75rem;padding-right:.75rem}
header>div>nav .group>div a>span:first-child{font-size:inherit}
header>div>nav .group>div a>span:nth-child(2){font-size:13px}

/* 送信完了の表示が固定ヘッダーの裏に隠れないようにする (先方依頼 2026-10-27) */
#contact-form{scroll-margin-top:7rem}
#contact-form .fl-notice{scroll-margin-top:8rem}

/* スマホメニューの「集客・販促支援」を開いたときの下位メニュー (先方依頼 2026-10-27) */
[data-menu-panel] .fl-submenu{display:flex;flex-direction:column;gap:.25rem;padding:0 .75rem .75rem}
[data-menu-panel] .fl-submenu a{display:block;padding:.75rem 1rem;border-radius:.5rem;background:oklch(var(--background-50));font-size:.875rem;font-weight:500;color:oklch(var(--foreground-800));text-decoration:none}
[data-menu-panel] .fl-submenu a:hover{background:oklch(var(--primary-50));color:oklch(var(--primary-600))}

/* 2026-10-28: 幅380px以下で「全国17,000店舗…」の1行が横にはみ出すのを防ぐ */
@media (max-width: 380px) {
  p.whitespace-nowrap { white-space: normal; }
}
