/* Basic styling for YoLocator */
.yolocator { font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif; }
.yolocator .yolocator-search { display: flex; gap: 8px; margin: 12px 0; }
#yolocator-city { flex: 1; padding: 8px 10px; border: 1px solid #d0d7de; border-radius: 6px; }
#yolocator-search-btn { padding: 8px 14px; background: #111827; color: #fff; border: 0; border-radius: 6px; cursor: pointer; }
#yolocator-search-btn:hover { background: #0b1220; }

#yolocator-map { border: 1px solid #e5e7eb; border-radius: 8px; overflow: hidden; }

.yolocator-marker { width: 40px; height: 40px; background-color: #2563eb; background-size: cover; background-position: center; border-radius: 50%; box-shadow: 0 2px 8px rgba(0,0,0,0.25); border: 2px solid #fff; }

.mapboxgl-popup-content { border-radius: 10px; max-width: 520px; width: fit-content; }
.yolocator-popup { min-width: 0; }
.yolocator-popup a { color: var(--yolocator-link, #2563eb); text-decoration: none; }
.yolocator-popup a:hover { text-decoration: underline; }
.yolocator-popup .yolocator-name { font-size: 15px; margin-bottom: 4px; }
.yolocator-img-wrap { margin: -8px -8px 8px -8px; overflow: hidden; border-top-left-radius: 10px; border-top-right-radius: 10px; }
.yolocator-img { display: block; width: 100%; height: auto; max-height: 180px; object-fit: cover; }
.yolocator-popup .yolocator-address, .yolocator-popup .yolocator-phone { font-size: 13px; color: #374151; }
.yolocator-popup .yolocator-address { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.yolocator-popup .yolocator-address span { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.yolocator-popup .yolocator-address .yolocator-copy { flex: 0 0 auto; }
.yolocator-popup .yolocator-flavors { font-size: 12px; color: #4b5563; margin-top: 4px; }

/* Copy button: sleek, subtle, delightful */
.yolocator-copy { 
  display: inline-flex; align-items: center; gap: 6px; 
  font-size: 12px; line-height: 1; 
  padding: 6px 10px; margin-left: 8px; 
  border-radius: 999px; border: 1px solid #d1d5db; 
  background: #f9fafb; color: #111827; 
  transition: background .15s ease, box-shadow .15s ease, transform .06s ease; 
}
.yolocator-copy .yolocator-icon { display: inline-block; vertical-align: middle; }
.yolocator-copy:hover { background: #f3f4f6; box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.yolocator-copy:active { transform: translateY(1px); }
.yolocator-copy.is-copied { background: #ecfdf5; border-color: #10b981; color: #065f46; }

/* Responsive cap on small screens */
@media (max-width: 600px) {
  .mapboxgl-popup-content { max-width: 90vw; }
}