/* ===== Route Page (shared) ===== */

/* Panels */
.route-page .panel{
  background:#1f1f1f; border:1px solid #2e2e2e; border-radius:12px;
  padding:24px; margin:24px 0; box-shadow:0 6px 18px rgba(0,0,0,.35);
}

/* Headings & strong */
.route-page .section-title{ margin-top:0; font-weight:700; letter-spacing:.2px; }
.route-page strong{ font-weight:700; }

/* Match body size 1.25rem */
.route-page p, .route-page li{ font-size:1.25rem; line-height:1.7; }

/* Details table */
.route-page .route-details-table{ width:100%; border-collapse:collapse; }
.route-page .route-details-table th,
.route-page .route-details-table td{
  padding:12px 14px; border-bottom:1px solid #3f3f3f; text-align:left;
  font-size:1.25rem; line-height:1.7;
}

/* Map controls */
.route-page .button-bar{
  display:flex; justify-content:center; align-items:center; gap:12px; flex-wrap:wrap;
  margin-top:16px; margin-bottom:16px;
}
.route-page .rc-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 16px; border-radius:4px;
  border:1px solid #2d2d2d; background:#e5e7eb; color:#0b0b0b; text-decoration:none !important;
  font-weight:700; font-size:1rem; letter-spacing:.15px; line-height:1;
  transition:transform .15s, box-shadow .15s, background .15s, color .15s, border-color .15s;
}
.route-page .rc-btn:hover{ transform:translateY(-1px); box-shadow:0 8px 24px rgba(0,0,0,.35); }
.route-page .rc-btn.is-active{ background:#16a34a; border-color:#16a34a; color:#fff; }
.route-page .rc-btn--reset{ display:none; }
.route-page .rc-toggle{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border:1px solid #2d2d2d; padding:8px 12px; border-radius:4px;
  background:#f3f4f6; color:#0b0b0b; font-weight:700; text-decoration:none !important; line-height:1;
}
.route-page .rc-toggle input{ transform: translateY(1px); }

/* Mobile map width ~98% */
@media (max-width:600px){
  #rcMap{ width:98% !important; margin:0 auto; }
}

/* Summaries/notes */
.route-page .dir-summary{ text-align:center; margin:6px 0 0; font-size:1.25rem; color:#fff; }
.route-page .dir-summary strong{ color:#fff; font-weight:700; }
.route-page .poi-note{ text-align:center; margin-top:8px; color:#fff; }

/* Lists with FA checks */
.route-page .fa-bullets{ list-style:none; padding-left:0; margin:0; }
.route-page .fa-bullets li{
  position:relative; padding-left:1.8rem; margin:.5rem 0; line-height:1.8; font-size:1.25rem;
}
.route-page .fa-bullets li::before{
  content:"\f00c";
  font-family:"Font Awesome 6 Free"; font-weight:900;
  position:absolute; left:.2rem; top:.15rem; font-size:.95rem; color:#9ca3af;
}

/* Coordinate links: only lat/long are green */
.route-page a.poi-coord{
  color:#22c55e; text-decoration:underline; text-underline-offset:2px; text-decoration-thickness:2px;
}
.route-page a.poi-name,
.route-page a.poi-name:hover,
.route-page a.poi-name:focus-visible{ text-decoration:none !important; }

/* Gallery */
.route-page .gallery-grid{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(240px,1fr)); gap:12px;
}
.route-page .gallery-grid img{ width:100%; height:auto; display:block; border-radius:10px; cursor:zoom-in; }

/* InfoWindow styling (compact dark) */
.gm-style .gm-style-iw-c{
  padding:0 !important; border-radius:12px !important; overflow:hidden !important;
  background:transparent !important; box-shadow:none !important;
}
.gm-style .gm-style-iw-tc, .gm-style .gm-style-iw-t{ display:none !important; }
.rc-iw{
  background:#0f1113; color:#EDEEEF; border:1px solid #2d2d2d; border-radius:12px;
  min-width:230px; max-width:320px; box-shadow:0 10px 30px rgba(0,0,0,.6);
}
.rc-iw__title{
  background:#14161a; border-bottom:1px solid #2d2d2d;
  padding:8px 12px; font-weight:800; font-size:1rem; line-height:1.2;
}
.rc-iw__body{ padding:8px 12px; color:#d5d7db; line-height:1.4; }
.rc-iw__addr{ margin-top:4px; font-size:.95rem; color:#9aa0a6; }

/* Lightbox overlay (unchanged from prior drop-in) */
.lightbox{
  position:fixed; inset:0; background:rgba(0,0,0,.72);
  display:none; align-items:center; justify-content:center;
  z-index:9999; opacity:0; transition:opacity .18s ease-out;
}
.lightbox.is-open{ display:flex; opacity:1; }
.lightbox__inner{
  position:relative; max-width:90vw; max-height:90vh; padding:0;
  display:grid; grid-template-rows:auto auto; align-items:center; justify-items:center;
}
.lightbox__img{
  max-width:90vw; max-height:90vh; border-radius:10px; display:block; margin:0 auto;
  box-shadow:0 20px 60px rgba(0,0,0,.6);
}
.lightbox__caption{ color:#e5e7eb; text-align:center; margin-top:10px; font-size:1rem; }

/* Hide controls until image loaded */
.lightbox .lightbox__btn, .lightbox .lightbox__close{ opacity:0; pointer-events:none; }
.lightbox.controls-ready .lightbox__btn, .lightbox.controls-ready .lightbox__close{ opacity:1; pointer-events:auto; }

/* Overlayed controls */
.lightbox__btn, .lightbox__close{
  position:absolute; background:rgba(0,0,0,.5); color:#fff; border:1px solid rgba(255,255,255,.35);
  width:64px; height:64px; border-radius:6px; display:grid; place-items:center; font-size:34px; cursor:pointer;
  backdrop-filter:blur(4px); transition:transform .15s, background .15s, opacity .18s ease-out;
  z-index:10000; box-shadow:0 10px 30px rgba(0,0,0,.5);
}
.lightbox__btn:hover, .lightbox__close:hover{ background:rgba(0,0,0,.7); transform:scale(1.06); }
.lightbox__prev{ top:50%; left:18px; transform:translateY(-50%); }
.lightbox__next{ top:50%; right:18px; transform:translateY(-50%); }
.lightbox__close{ top:18px; right:18px; width:52px; height:52px; font-size:28px; }
@media (max-width:768px){
  .lightbox__prev{ left:8px; } .lightbox__next{ right:8px; } .lightbox__close{ top:8px; right:8px; }
}
