/* ship-map.css -- home page "We've shipped all over" map (includes/views/tbolt_ship_map.php), 2026-09-30.
   2026-10-01 (JR): framed like the home page's other sections (Bootstrap panel-primary heading bar + panel-body, which
   also gives the padding); still image + "explore" button until the visitor clicks. */

.shipmap-stats { margin: 0 0 12px; text-align: center; font-size: 14px; font-weight: bold; color: #333; }

.shipmap-frame { position: relative; height: 460px; background: #f3f3f3; overflow: hidden; }
.shipmap-canvas { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }

.shipmap-still { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: block; width: 100%; padding: 0;
  border: 0; background: #f3f3f3; cursor: pointer; }
.shipmap-still img { display: block; width: 100%; height: 100%; object-fit: cover; }
.shipmap-cta { position: absolute; left: 50%; bottom: 22px; transform: translateX(-50%); padding: 10px 18px;
  background: #b73333; color: #fff; font-weight: bold; font-size: 15px; white-space: nowrap;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .25); }
.shipmap-still:hover .shipmap-cta, .shipmap-still:focus .shipmap-cta { background: #8f2525; }
.shipmap-credit { position: absolute; right: 0; bottom: 0; padding: 1px 6px; background: rgba(255, 255, 255, .75);
  color: #555; font-size: 10px; }
.shipmap.is-live .shipmap-still { display: none; }

.shipmap-wait, .shipmap-fail { position: absolute; top: 50%; left: 0; right: 0; margin: 0; transform: translateY(-50%);
  text-align: center; color: #777; pointer-events: none; }
.shipmap-wait { color: #333; font-weight: bold; }
.shipmap-fail { color: #b73333; }
.shipmap.is-ready .shipmap-wait { display: none; }

.shipmap-note { margin: 10px 0 0; font-size: 13px; line-height: 1.45; color: #555; }

@media (max-width: 767px) {
  .shipmap-frame { height: 360px; }
}