/* ============================================================================
   volunteer.bluehub.jp 共通CSS（Bootstrap 5.3 ベース・カスタムは最小限）
   ブランドカラーは BlueHub 共通（--bh-*）を Bootstrap の primary に適用
   ============================================================================ */
:root {
  --bh-ink: #102b3f;
  --bh-blue: #0b72b9;
  --bh-cyan: #18aeca;
  --bh-sea: #78d9b3;
  --bh-paper: #f5fbfd;
  /* Bootstrap primary を BlueHub ブルーに差し替え */
  --bs-primary: #0b72b9;
  --bs-primary-rgb: 11, 114, 185;
  --bs-link-color: #0b72b9;
  --bs-link-color-rgb: 11, 114, 185;
}
body { background: var(--bh-paper); }
.btn-primary { --bs-btn-bg: var(--bh-blue); --bs-btn-border-color: var(--bh-blue); --bs-btn-hover-bg: #095e99; --bs-btn-hover-border-color: #095e99; }
.bg-primary { background-color: var(--bh-blue) !important; }
.text-primary { color: var(--bh-blue) !important; }

/* ヒーロー（トップページ） */
.hero {
  background: linear-gradient(135deg, #0b72b9 0%, #18aeca 60%, #78d9b3 100%);
  color: #fff;
}

/* セクション見出し */
.sec-title { border-left: 6px solid var(--bh-cyan); padding-left: 12px; }

/* 地図 */
.vol-map { width: 100%; height: 440px; border-radius: 12px; z-index: 0; }
@media (max-width: 575.98px) { .vol-map { height: 330px; } }

/* 回収待ちバッジ（Bootstrap標準色に無い橙） */
.badge-awaiting { background-color: #e07b2a; color: #fff; }

/* 報告写真 */
.photo-grid img { width: 140px; height: 140px; object-fit: cover; border-radius: 10px; }

/* LINEログインボタン */
.btn-line { background-color: #06c755; border-color: #06c755; color: #fff; }
.btn-line:hover { background-color: #05b34c; border-color: #05b34c; color: #fff; }

/* フッター */
.site-footer { background: var(--bh-ink); color: #cfe3ef; }

/* 証明書（印刷対応） */
.cert {
  background: #fff; border: 10px double var(--bh-blue); border-radius: 6px;
  max-width: 720px; margin: 30px auto; padding: 48px 40px; text-align: center;
}
.cert h1 { font-size: 1.8rem; letter-spacing: .3em; }
.cert .cert-name { font-size: 1.5rem; font-weight: 800; border-bottom: 2px solid var(--bh-ink); display: inline-block; padding: 0 30px 4px; }
.cert .cert-body { text-align: left; max-width: 520px; margin: 0 auto; }
@media print {
  .navbar, .site-footer, .no-print, .alert { display: none !important; }
  body { background: #fff; }
  .cert { border-color: #333; margin: 0 auto; }
}