/* Brand color */
:root { --brand: #74ABFE; }

/* Base */
body { line-height: 1.75; }
.navbar .nav-link { padding: .5rem .75rem; }

/* Common utility */
.navbar-brand img { height: 40px; width: auto; margin-right: .5rem; }

/* ナビ（背景はHTMLで #74ABFE を指定済み。文字は白で統一） */
.navbar,
.navbar .nav-link,
.navbar .navbar-brand { color: #fff !important; }
.navbar .nav-link:hover,
.navbar .nav-link:focus { color: #e6e6e6 !important; }

/* 見出しアクセント */
.section-title { border-left: .25rem solid var(--brand); padding-left: .5rem; }

/* カードリストの間隔 */
.card-list > article + article { margin-top: 1rem; }

/* ===== Event cards ===== */
.card-event .card-title {
  line-height: 1.4;
}

.card-event .meta {
  font-size: .9rem;
}

/* スマホ～タブレットで表をカード風に（名簿などで便利） */
@media (max-width: 768px) {
  .table[data-card="true"] thead { display: none; }
  .table[data-card="true"] tbody tr { 
    display: block; 
    margin-bottom: .75rem; 
    border: 1px solid #dee2e6; 
    border-radius: .5rem; 
    padding: .5rem; 
  }
  .table[data-card="true"] tbody td { 
    display: grid; 
    grid-template-columns: 8rem 1fr; 
    padding: .25rem .5rem; 
    border: none !important;
  }
  .table[data-card="true"] tbody td::before { 
    content: attr(data-label); 
    font-weight: 600; 
  }
}

/* カード内の埋め込み地図を角丸でフィット */
.map-embed { overflow: hidden; border-radius: .5rem; }
.map-embed iframe { width: 100%; height: 100%; border: 0; }

/* Brand utilities (centralize brand color usage) */
/* NOTE:
 * Uses !important to override Bootstrap defaults.
 * Once brand color usage is unified, consider removing !important
 * and increasing selector specificity instead.
 */
.bg-brand { background-color: var(--brand) !important; }
.border-brand { border-color: var(--brand) !important; }

.btn-brand {
  background-color: var(--brand) !important;
  border-color: var(--brand) !important;
}
.btn-brand:hover,
.btn-brand:focus {
  background-color: var(--brand) !important;
  border-color: var(--brand) !important;
}

.badge-brand {
  background-color: var(--brand) !important;
  color: #fff !important;
}

/* Left accent card (used on top page etc.) */
.card-accent-left {
  border: 1px solid #dee2e6;
  border-left: 10px solid var(--brand);
  background: #fff;
}

