/* ===== 全ページ共通の基礎（変数・背景） ===== */

/* CSS変数：ヘッダー/フッターの高さ。各ページの余白計算(calc)で使い回す */
:root {
    --header-h: 0px;        /* ヘッダーはバー無し（☰を地図に浮かせる）ので高さ0 */
    --footer-h: 146px;      /* 固定フッターの高さ。中身の下余白の確保に使う */
    --sheet-h: 180px;       /* ボトムシートの高さ。地図の縮小量(#map.sheet-open)にも使う */
}

/* 全ページ共通の背景（白地＋金雲）。金雲は透過PNGなので白の上に重なる */
.background {
    position: fixed;                 /* スクロールしても背景を画面に固定 */
    top: 0;                          /* 画面上端に合わせる */
    left: 0;                         /* 画面左端に合わせる */
    width: 100%;                     /* 横幅を画面いっぱいに */
    height: 100vh;                   /* 高さを画面の高さいっぱいに */
    z-index: -1;                     /* 全要素より後ろ（コンテンツの背面）に置く */
    background-size: cover;          /* 切れても全面を覆うように画像を拡大 */
    background-position: center;     /* 画像を中央基準で配置 */
    background-image: url('/static/image/background.png');  /* 背景の金雲画像 */
    background-color: #fff;          /* 画像が透過/未読込でも白地を保証 */
}

/* 中央カラム型ページの共通枠（フォーム・詳細で共用。一覧やマップは対象外）
   中央寄せ＋最大幅＋ヘッダー(上)/フッター(下)/左右の余白 */
.content-column {
    max-width: 600px;          /* 読みやすい列幅の上限 */
    margin: 0 auto;            /* 左右中央寄せ */
    padding: 64px 16px calc(var(--footer-h) + 24px);  /* 上：ハンバーガー / 左右16 / 下：フッター */
}

/* ヘッダー/フッターが無い画面（ログイン前）用：上下の逃げを外す */
.content-column.flush {
    padding-top: 24px;         /* 上の余白（お好みで） */
    padding-bottom: 24px;      /* 下の余白（お好みで） */
}