/* ============================================================
   GolfScale 共有シェル
   トップページ(home.html)と同じヘッダー(.gs-topbar)・フッター
   (.gs-foot)・カラーパレットを、クラブ検索／シャフト検索ページと
   共有するためのスタイルシート。
   ============================================================ */

/* ---- カラーパレット ----
   トップページ用の --g / --y / ... に加え、既存の検索 UI が参照する
   --gs-* トークンも緑系へ再マップし、ページ全体を一括で再配色する。 */
body{
  --g:#2F8F5B;
  --g-dark:#26794a;
  --y:#F4C542;
  --y-deep:#E0A521;
  --bg:#EDEAE2;
  --soft:#F2FAF5;
  --ink:#1F2A24;
  --mute:#69756c;
  --card:#FFFFFF;
  --line:#DDE7DF;
  --foot:#1f3a2a;

  --gs-bg:#EDEAE2;
  --gs-card:#FFFFFF;
  --gs-border:#DDE7DF;
  --gs-border-soft:#E7EDE8;
  --gs-ink:#1F2A24;
  --gs-mute:#69756c;
  --gs-soft-mute:#8a948c;
  --gs-accent:#2F8F5B;
  --gs-accent-soft:rgba(47,143,91,.10);
  --gs-watermark:#dfe9e1;

  --bs-link-color:#2F8F5B;
  --bs-link-color-rgb:47,143,91;
  --bs-link-hover-color:#26794a;

  background:var(--bg) !important;
}

@media (min-width:900px){
  body{ padding-bottom:0 !important; }
  .fixed-bottom-bar{ display:none !important; }
}

.gs-wrap{ max-width:1340px; margin:0 auto; padding:0 32px; }

/* ---- top bar ---- */
.gs-topbar{ position:sticky; top:0; z-index:1000; background:#fff; border-bottom:1px solid var(--line); }
.gs-topbar-in{ position:relative; max-width:1340px; margin:0 auto; padding:0 32px; height:74px; display:flex; align-items:center; gap:30px; }
.gs-logo{ display:flex; align-items:center; gap:9px; text-decoration:none; flex-shrink:0; }
.gs-logo-img{ height:52px; width:auto; display:block; }
.gs-logo-mark{ width:38px; height:38px; border-radius:50%; background:var(--soft); border:1.5px solid var(--g);
  display:flex; align-items:center; justify-content:center; }
.gs-logo-mark .icon{ width:19px; height:19px; color:var(--g); }
.gs-logo-text{ font-size:1.45rem; font-weight:800; color:var(--ink); letter-spacing:-.01em; }
.gs-logo-text b{ color:var(--g); font-weight:800; }
.gs-nav{ display:flex; gap:24px; }
.gs-nav a{ font-size:.92rem; font-weight:600; color:var(--ink); text-decoration:none; white-space:nowrap; transition:color .15s; }
.gs-nav a:hover{ color:var(--g); }
.gs-nav a.is-active{ color:var(--g); position:relative; }
.gs-nav a.is-active::after{ content:""; position:absolute; left:0; right:0; bottom:-26px; height:3px;
  background:var(--g); border-radius:3px 3px 0 0; }
.gs-top-actions{ margin-left:auto; display:flex; align-items:center; gap:20px; }
.gs-top-actions a{ display:flex; align-items:center; gap:6px; font-size:.88rem; font-weight:600; color:var(--ink); text-decoration:none; }
.gs-top-actions a:hover{ color:var(--g); }
.gs-top-actions .icon{ width:17px; height:17px; }

/* ---- mobile nav toggle (hamburger) ---- */
.gs-nav-toggle{ display:none; margin-left:auto; width:42px; height:42px; flex-shrink:0;
  flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:0;
  background:var(--soft); border:1px solid var(--line); border-radius:11px; cursor:pointer;
  transition:background .15s ease, border-color .15s ease; }
.gs-nav-toggle:hover{ background:#e6f1ea; border-color:#cdddcf; }
.gs-nav-toggle-bar{ width:19px; height:2px; border-radius:2px; background:var(--ink);
  transition:transform .2s ease, opacity .15s ease; }

@media (max-width:1100px){
  .gs-nav-toggle{ display:flex; }
  .gs-nav{
    position:absolute; top:100%; right:0;
    flex-direction:column; gap:2px; align-items:stretch;
    min-width:236px; padding:10px;
    background:#fff; border:1px solid var(--line); border-top:none;
    border-radius:0 0 16px 16px;
    box-shadow:0 26px 40px -24px rgba(20,40,28,.4);
    display:none;
  }
  .gs-topbar.nav-open .gs-nav{ display:flex; }
  .gs-nav a{ padding:11px 14px; border-radius:10px; font-size:.95rem; }
  .gs-nav a:hover{ background:var(--soft); color:var(--ink); }
  .gs-nav a.is-active{ background:var(--soft); }
  .gs-nav a.is-active::after{ display:none; }
  .gs-topbar.nav-open .gs-nav-toggle-bar:nth-child(1){ transform:translateY(7px) rotate(45deg); }
  .gs-topbar.nav-open .gs-nav-toggle-bar:nth-child(2){ opacity:0; }
  .gs-topbar.nav-open .gs-nav-toggle-bar:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
}

/* ---- footer ---- */
.gs-foot h2,.gs-foot h3,.gs-foot h4{ border-bottom:none; }
.gs-foot{ background:var(--foot); color:#aebcb1; margin-top:64px; }
.gs-foot-in{ max-width:1340px; margin:0 auto; padding:50px 32px 0; }
.gs-foot-grid{ display:grid; grid-template-columns:1.9fr repeat(4,1fr); gap:28px; }
.gs-foot-logo{ display:inline-block; }
.gs-foot-logo img{ width:236px; max-width:100%; height:auto; display:block; }
.gs-foot-about{ font-size:.77rem; line-height:1.85; color:#8fa295; margin:15px 0 0; max-width:26em; }
.gs-foot-sns{ display:flex; gap:9px; margin-top:16px; }
.gs-foot-sns a{ width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.09);
  display:flex; align-items:center; justify-content:center; color:#cdd8cf; transition:background .15s, color .15s; }
.gs-foot-sns a:hover{ background:var(--g); color:#fff; }
.gs-foot-sns .icon{ width:15px; height:15px; }
.gs-foot-col h4{ font-size:.82rem; font-weight:800; color:#fff; margin:0 0 14px; }
.gs-foot-col a{ display:block; font-size:.78rem; color:#8fa295; text-decoration:none; margin-bottom:11px; }
.gs-foot-col a:hover{ color:#fff; }
.gs-foot-bar{ border-top:1px solid rgba(255,255,255,.1); margin-top:38px; padding:18px 0;
  text-align:center; font-size:.74rem; color:#7d9085; }

@media (max-width:992px){
  .gs-wrap{ padding:0 18px; }
  .gs-topbar-in{ padding:0 18px; height:62px; }
  .gs-foot-in{ padding:42px 18px 0; }
  .gs-foot-grid{ grid-template-columns:1fr 1fr; }
}

@media (max-width:600px){
  .gs-foot-grid{ grid-template-columns:1fr; gap:20px; }
}

/* ---- form controls ----
   チェックボックス／ラジオの選択色をトップページの緑へ揃える（全ページ共通）。 */
.form-check-input:checked{ background-color:var(--g); border-color:var(--g); }
.form-check-input:focus{ border-color:var(--g); box-shadow:0 0 0 .2rem rgba(47,143,91,.2); }
