/* =====================================================
   Heil Trailer Asia Branch Map — frontend styles (light only)
   ===================================================== */

.habm-region {
	width: 100%;
	border-radius: 12px;
	overflow: hidden;
	box-sizing: border-box;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
	background: #f5f6f8;
	border: 1px solid #e2e4e8;
}

.habm-map { width: 100%; background: #f8f9fa; }

/* ----- Pin (single red dot) ----- */
.habm-pin { background: transparent; border: none; }

.habm-pin-dot {
	width: 16px; height: 16px;
	border-radius: 50%;
	border: 2px solid #fff;
	background: #cc1a1a;
	box-shadow: 0 0 0 5px rgba(204, 26, 26, .35),
	            0 0 0 10px rgba(204, 26, 26, .12),
	            0 1px 4px rgba(0, 0, 0, .4);
	cursor: pointer;
	transition: transform .15s ease;
}

.habm-pin-dot:hover { transform: scale(1.4); }

/* ----- Popups ----- */
.leaflet-popup-content-wrapper { border-radius: 8px; }
.leaflet-popup-content { margin: 12px 16px; font-family: inherit; }

.habm-popup h4 { margin: 0 0 6px; font-size: 15px; color: #111; font-weight: 700; }
.habm-popup-region {
	display: inline-block;
	margin: 0 0 8px;
	font-size: 11px;
	font-weight: 600;
	color: #cc1a1a;
	background: #fff5f5;
	border: 1px solid #f4d0d0;
	padding: 2px 8px;
	border-radius: 10px;
}
.habm-popup p  { margin: 0 0 10px; font-size: 13px; color: #555; line-height: 1.5; }
.habm-popup a {
	display: inline-block;
	background: #cc1a1a; color: #fff !important;
	text-decoration: none;
	padding: 6px 14px; border-radius: 4px;
	font-size: 12px; font-weight: 600;
}
.habm-popup a:hover { background: #aa1010; }

/* ----- FontAwesome zoom controls ----- */
.leaflet-control-zoom {
	border: none !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
}

.leaflet-control-zoom a {
	width: 34px !important;
	height: 34px !important;
	line-height: 34px !important;
	background: #fff !important;
	color: #333 !important;
	border: 1px solid #e0e3e8 !important;
	font-size: 0 !important;
	transition: background 0.15s, color 0.15s;
}

.leaflet-control-zoom a:hover {
	background: #cc1a1a !important;
	color: #fff !important;
}

.leaflet-control-zoom-in::before,
.leaflet-control-zoom-out::before {
	font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome", sans-serif;
	font-weight: 900;
	font-size: 14px;
	display: inline-block;
	line-height: 34px;
}

.leaflet-control-zoom-in::before  { content: "\f067"; }
.leaflet-control-zoom-out::before { content: "\f068"; }

.leaflet-control-attribution {
	font-size: 10px;
	background: rgba(255, 255, 255, 0.7) !important;
}