/* rihobeer-brewery-route-planner.css — ブルワリー巡回ルート提案 (epic 20260612-010 Phase3)
 * モバイルファースト。geo-foundation / BMD と同形の min() 高さ・focus ring・受賞バッジ。
 */

.rihobeer-brp {
  margin: 1.2em 0;
  font-size: 15px;
  line-height: 1.6;
}

/* visually-hidden (mu-plugin 自己完結・Cocoon/BMD グローバル定義に依存しない・V-gate C-1) */
.rihobeer-brp .screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip: rect(0 0 0 0);
  overflow: hidden;
}

/* ---- コントロール ---- */
.rihobeer-brp-controls {
  display: flex;
  flex-direction: column;
  gap: 0.6em;
  margin-bottom: 0.8em;
}
.rihobeer-brp-origin {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
}
.rihobeer-brp-geo {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0.6em 0.8em;
  background: #2b6cb0;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 15px;
  cursor: pointer;
}
.rihobeer-brp-geo:hover { background: #245691; }
.rihobeer-brp-geo:disabled { opacity: 0.6; cursor: progress; }
.rihobeer-brp-preset {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0.55em 0.6em;
  border: 1px solid #cbd5e0;
  border-radius: 8px;
  font-size: 15px;
  background: #fff;
}
.rihobeer-brp-opts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6em 1em;
  align-items: center;
}
.rihobeer-brp-opt {
  display: inline-flex;
  align-items: center;
  gap: 0.35em;
  font-size: 14px;
  color: #2d3748;
}
.rihobeer-brp-opt select {
  min-width: 0;          /* モバイル横溢保険 (V-gate P3 A-2) */
  max-width: 100%;
  padding: 0.35em 0.5em;
  border: 1px solid #cbd5e0;
  border-radius: 6px;
  font-size: 14px;
  background: #fff;
}
.rihobeer-brp-awards-toggle { cursor: pointer; }
.rihobeer-brp-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3em 0.9em;
  border: none;
  margin: 0;
  padding: 0;
}
.rihobeer-brp-filters label {
  display: inline-flex;
  align-items: center;
  gap: 0.25em;
  font-size: 14px;
  cursor: pointer;
}
.rihobeer-brp-hint {
  margin: 0;
  font-size: 12.5px;
  color: #718096;
}

/* ---- サマリ (ルート概要 + Google Maps リンク) ---- */
.rihobeer-brp-summary { margin: 0 0 0.7em; }
.rihobeer-brp-plan {
  display: flex;
  flex-direction: column;
  gap: 0.25em;
  padding: 0.7em 0.9em;
  background: #ebf4ff;
  border: 1px solid #bee3f8;
  border-radius: 10px;
}
.rihobeer-brp-plan-main { font-size: 15.5px; color: #1a365d; }
.rihobeer-brp-plan-sub { font-size: 13px; color: #2c5282; }
.rihobeer-brp-gmaps {
  display: inline-block;
  margin-top: 0.4em;
  align-self: flex-start;
  padding: 0.5em 0.9em;
  background: #38a169;
  color: #fff !important;
  border-radius: 8px;
  font-size: 14px;
  text-decoration: none;
}
.rihobeer-brp-gmaps:hover { background: #2f855a; }
.rihobeer-brp-note {
  margin: 0;
  padding: 0.7em 0.9em;
  background: #fffaf0;
  border: 1px solid #feebc8;
  border-radius: 10px;
  font-size: 14px;
  color: #744210;
}

/* ---- body: 地図 + リスト ---- */
.rihobeer-brp-body-grid {
  display: flex;
  flex-direction: column;
  gap: 0.8em;
}
.rihobeer-brp-map {
  width: 100%;
  /* モバイル: viewport 高さ上限つき (geo-foundation P1-2 同形) */
  height: min(var(--rihobeer-brp-h, 520px), 70vh);
  border-radius: 10px;
  overflow: hidden;
  z-index: 0;
}

/* ---- ルートリスト ---- */
.rihobeer-brp-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.rihobeer-brp-item {
  display: flex;
  align-items: flex-start;
  gap: 0.6em;
  padding: 0.6em 0.4em;
  border-bottom: 1px solid #edf2f7;
  cursor: pointer;
}
.rihobeer-brp-item:hover { background: #f7fafc; }
.rihobeer-brp-item:focus {
  outline: 2px solid #2b6cb0;
  outline-offset: -2px;
  background: #ebf8ff;
}
.rihobeer-brp-rank {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #2b6cb0;
  color: #fff;
  border-radius: 50%;
  font-size: 14px;
  font-weight: 700;
}
.rihobeer-brp-thumb {
  flex: 0 0 auto;
  width: 56px;
  height: 56px;
  object-fit: cover;
  border-radius: 8px;
}
.rihobeer-brp-itembody {
  display: flex;
  flex-direction: column;
  gap: 0.15em;
  min-width: 0;
}
.rihobeer-brp-name { font-weight: 600; color: #1a202c; }
.rihobeer-brp-meta { font-size: 12.5px; color: #718096; }
.rihobeer-brp-leg { color: #2b6cb0; }
.rihobeer-brp-link { font-size: 13px; }
.rihobeer-brp-empty,
.rihobeer-brp-list .rihobeer-brp-empty {
  list-style: none;
  padding: 0.9em 0.4em;
  color: #718096;
  font-size: 14px;
}

/* ---- 受賞バッジ ---- */
.rihobeer-brp-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.2em;
  font-size: 13px;
  color: #975a16;
}
.rihobeer-brp-badge-yr { font-size: 11px; color: #a0aec0; }

/* ---- 地図 icons ---- */
.rihobeer-brp-origin-icon { font-size: 26px; text-align: center; line-height: 1; }
.rihobeer-brp-stop-icon span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background: #2b6cb0;
  color: #fff;
  border: 2px solid #fff;
  border-radius: 50%;
  font-size: 14px;
  font-weight: 700;
  box-shadow: 0 1px 4px rgba(0,0,0,0.3);
}

/* ---- popup ---- */
.rihobeer-brp-pop-rank {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px; height: 22px;
  background: #2b6cb0; color: #fff;
  border-radius: 50%; font-size: 12px; font-weight: 700;
  margin-bottom: 0.3em;
}
.rihobeer-brp-pop-thumb {
  display: block;
  width: 100%;
  max-width: 200px;
  height: auto;
  border-radius: 6px;
  margin-bottom: 0.3em;
}
.rihobeer-brp-pop-name { display: block; font-size: 14px; }
.rihobeer-brp-pop-sub,
.rihobeer-brp-pop-dist { display: block; font-size: 12px; color: #718096; }
.rihobeer-brp-pop-badge { display: block; margin: 0.2em 0; }
.rihobeer-brp-pop-link { display: inline-block; margin-top: 0.3em; font-size: 13px; }

/* ---- desktop: 2カラム (地図 + スクロールするリスト) ---- */
@media (min-width: 768px) {
  .rihobeer-brp-body-grid {
    display: grid;
    grid-template-columns: 1fr 320px;
    align-items: start;
  }
  .rihobeer-brp-map { height: var(--rihobeer-brp-h, 520px); }
  .rihobeer-brp-list {
    max-height: var(--rihobeer-brp-h, 520px);
    overflow-y: auto;
  }
}

/* ---- 印刷 (旅程の持ち出し・DoD(c) printable) ----
 * 地図 (Leaflet canvas) はタイル非同期取得で印刷時に白紙になる既知制約のため非表示にし、
 * 順序付きリスト (名称/順番/区間距離) を itinerary 本体として印刷する (V-gate A-1)。 */
@media print {
  .rihobeer-brp-controls,
  .rihobeer-brp-gmaps,
  .rihobeer-brp-map { display: none; }
  .rihobeer-brp-summary { display: block; }
  .rihobeer-brp-body-grid { display: block; }
  .rihobeer-brp-list { max-height: none; overflow: visible; }
  .rihobeer-brp-item { break-inside: avoid; }
}