/* Base containers */
#mcont-height, #cont-map-canvas { width: 100%; }
#map-canvas { width: 100%; height: 560px; position: relative; border-radius: 30px; overflow: hidden; }

/* Loader */
#map-loader{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; z-index:2; }
#map-loader .loader-bg{ position:absolute; inset:0; background:linear-gradient(180deg,#0f1114, #1a1e23); opacity:.9;}
#map-loader .loader-icon{ position:relative; width:44px; height:44px; border-radius:50%;
  border:3px solid rgba(255,255,255,.2); border-top-color:#fff; animation:spin 1s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg);} }

/* ---------- Advanced Marker content (anchored at dot) ---------- */
/* Marker wrapper */
.svc-pin{
  position: relative;
  width: 0; height: 0;
  pointer-events: none;
  font-family: 'Montserrat', system-ui, sans-serif;
}

/* Dot at coordinate */
.svc-pin-dot{
  position: absolute;
  left: -7px; top: -7px;
  width: 14px; height: 14px;
  border-radius: 50%;
  background: #e03b53;
  box-shadow: 0 0 0 4px rgba(224,59,83,0.25);
  pointer-events: auto;
}

/* Label bubble */
.svc-pin-label{
  position: absolute;
  background: #15274F;
  color: #fff;
  padding: 7px 12px;
  border-radius: 8px;
  line-height: 1.25;
  font-size: 14px;
  white-space: nowrap;
  box-shadow: 0 8px 24px rgba(0,0,0,.35);
  pointer-events: auto;
}
.svc-pin-label .l1{ font-weight:700; }
.svc-pin-label .l2{ opacity:.85; font-size:11px; display: none; }

/* --- Position Variants --- */
.svc-pin.top-right   .svc-pin-label{ top:-38px; left:8px; text-align:left; border-bottom-left-radius: 3px; }
.svc-pin.top-left    .svc-pin-label{ top:-38px; right:8px; text-align:right; border-bottom-right-radius: 3px; }
.svc-pin.bottom-right .svc-pin-label{ top:4px; left:8px; text-align:left; border-top-left-radius: 3px; }
.svc-pin.bottom-left .svc-pin-label{ top:4px; right:8px; text-align:right; border-top-right-radius: 3px; }

/* ---------- InfoWindow (white card, rounded corners) ---------- */
.svc-iw{
  max-width:300px;
  font-family: 'Montserrat', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
.svc-iw .title{ font-weight:700; font-size:18px; margin:0 0 .25rem; color:#15274F; }
.svc-iw .addr{ font-size:14px; opacity:.9; margin-bottom:.7rem; color:#222; font-weight: 400; }
.svc-iw .meta{ font-size:13px; margin:.15rem 0; color:#222; font-weight: 400; }
.svc-iw .meta a{ text-decoration:none; color:#e03b53; transition: all 0.5s; }
.svc-iw .meta a:hover{ text-decoration:none; color:#15274F; }

/* Buttons: bright red with subtle hover */
.svc-iw .actions{ display:flex; flex-wrap:wrap; gap:8px; margin-top:.8rem; }
.svc-btn{
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; padding:6px 10px; border-radius:4px;
  background:#e03b53; color:#fff;
  font-weight: 600; transition: all 0.5s;
}
.svc-btn:hover{ background:#15274F; color:#fff; }

/* Google InfoWindow tweaks (keep white background, rounded corners) */
.gm-style .gm-style-iw-c{
  border-radius:12px; padding:10px;
  box-shadow:0 18px 40px rgba(0,0,0,.35);
  min-width: 310px !important;
}
.gm-style .gm-style-iw-tc::after{ display:none; }

.gm-style-iw-ch {
    padding-top: 44px;
}

button.gm-ui-hover-effect {
    position: absolute !important;
    right: 0px;
}

.svc-iw .title {
    top: 14px;
    position: absolute;
}

/* Hours block inside InfoWindow */
.svc-iw .hours {
  font-size: 12px;
  line-height: 1.35;
  color: #444;
  margin: .35rem 0 .6rem;
  font-weight: 400;
}
.svc-iw .hours .h-title {
  font-weight: 600;
  color: #15274F;
  margin-bottom: 2px;
}

/* Mobile adjustment */
@media (max-width: 768px) {
  #map-canvas {
    border-radius: 20px;
  }
}