.leaflet-bar button,
.leaflet-bar button:hover {
  background-color: #fff;
  border: none;
  border-bottom: 1px solid #ccc;
  width: 26px;
  height: 26px;
  line-height: 26px;
  display: block;
  text-align: center;
  text-decoration: none;
  color: black;
}

.leaflet-bar button {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  overflow: hidden;
  display: block;
}

.leaflet-bar button:hover {
  background-color: #f4f4f4;
}

.leaflet-bar button:first-of-type {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.leaflet-bar button:last-of-type {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  border-bottom: none;
}

.leaflet-bar.disabled,
.leaflet-bar button.disabled {
  cursor: default;
  pointer-events: none;
  opacity: .4;
}

.easy-button-button .button-state{
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
}


.leaflet-touch .leaflet-bar button {
  width: 30px;
  height: 30px;
  line-height: 30px;
}

/* required styles */

.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-container,
.leaflet-pane > svg,
.leaflet-pane > canvas,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
	position: absolute;
	left: 0;
	top: 0;
	}
.leaflet-container {
	overflow: hidden;
	}
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow {
	-webkit-user-select: none;
	   -moz-user-select: none;
	        user-select: none;
	  -webkit-user-drag: none;
	}
/* Prevents IE11 from highlighting tiles in blue */
.leaflet-tile::selection {
	background: transparent;
}
/* Safari renders non-retina tile on retina better with this, but Chrome is worse */
.leaflet-safari .leaflet-tile {
	image-rendering: -webkit-optimize-contrast;
	}
/* hack that prevents hw layers "stretching" when loading new tiles */
.leaflet-safari .leaflet-tile-container {
	width: 1600px;
	height: 1600px;
	-webkit-transform-origin: 0 0;
	}
.leaflet-marker-icon,
.leaflet-marker-shadow {
	display: block;
	}
/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
.leaflet-container .leaflet-overlay-pane svg,
.leaflet-container .leaflet-marker-pane img,
.leaflet-container .leaflet-shadow-pane img,
.leaflet-container .leaflet-tile-pane img,
.leaflet-container img.leaflet-image-layer,
.leaflet-container .leaflet-tile {
	max-width: none !important;
	max-height: none !important;
	}

.leaflet-container.leaflet-touch-zoom {
	-ms-touch-action: pan-x pan-y;
	touch-action: pan-x pan-y;
	}
.leaflet-container.leaflet-touch-drag {
	-ms-touch-action: pinch-zoom;
	/* Fallback for FF which doesn't support pinch-zoom */
	touch-action: none;
	touch-action: pinch-zoom;
}
.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
	-ms-touch-action: none;
	touch-action: none;
}
.leaflet-container {
	-webkit-tap-highlight-color: transparent;
}
.leaflet-container a {
	-webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);
}
.leaflet-tile {
	filter: inherit;
	visibility: hidden;
	}
.leaflet-tile-loaded {
	visibility: inherit;
	}
.leaflet-zoom-box {
	width: 0;
	height: 0;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;
	z-index: 800;
	}
/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
.leaflet-overlay-pane svg {
	-moz-user-select: none;
	}

.leaflet-pane         { z-index: 400; }

.leaflet-tile-pane    { z-index: 200; }
.leaflet-overlay-pane { z-index: 400; }
.leaflet-shadow-pane  { z-index: 500; }
.leaflet-marker-pane  { z-index: 600; }
.leaflet-tooltip-pane   { z-index: 650; }
.leaflet-popup-pane   { z-index: 700; }

.leaflet-map-pane canvas { z-index: 100; }
.leaflet-map-pane svg    { z-index: 200; }

.leaflet-vml-shape {
	width: 1px;
	height: 1px;
	}
.lvml {
	behavior: url(../../LeafletComponent/lib/leaflet/#default#VML);
	display: inline-block;
	position: absolute;
	}


/* control positioning */

.leaflet-control {
	position: relative;
	z-index: 800;
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}
.leaflet-top,
.leaflet-bottom {
	position: absolute;
	z-index: 1000;
	pointer-events: none;
	}
.leaflet-top {
	top: 0;
	}
.leaflet-right {
	right: 0;
	}
.leaflet-bottom {
	bottom: 0;
	}
.leaflet-left {
	left: 0;
	}
.leaflet-control {
	float: left;
	clear: both;
	}
.leaflet-right .leaflet-control {
	float: right;
	}
.leaflet-top .leaflet-control {
	margin-top: 10px;
	}
.leaflet-bottom .leaflet-control {
	margin-bottom: 10px;
	}
.leaflet-left .leaflet-control {
	margin-left: 10px;
	}
.leaflet-right .leaflet-control {
	margin-right: 10px;
	}


/* zoom and fade animations */

.leaflet-fade-anim .leaflet-tile {
	will-change: opacity;
	}
.leaflet-fade-anim .leaflet-popup {
	opacity: 0;
	-webkit-transition: opacity 0.2s linear;
	   -moz-transition: opacity 0.2s linear;
	        transition: opacity 0.2s linear;
	}
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
	opacity: 1;
	}
.leaflet-zoom-animated {
	-webkit-transform-origin: 0 0;
	    -ms-transform-origin: 0 0;
	        transform-origin: 0 0;
	}
.leaflet-zoom-anim .leaflet-zoom-animated {
	will-change: transform;
	}
.leaflet-zoom-anim .leaflet-zoom-animated {
	-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
	   -moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);
	        transition:         transform 0.25s cubic-bezier(0,0,0.25,1);
	}
.leaflet-zoom-anim .leaflet-tile,
.leaflet-pan-anim .leaflet-tile {
	-webkit-transition: none;
	   -moz-transition: none;
	        transition: none;
	}

.leaflet-zoom-anim .leaflet-zoom-hide {
	visibility: hidden;
	}


/* cursors */

.leaflet-interactive {
	cursor: pointer;
	}
.leaflet-grab {
	cursor: -webkit-grab;
	cursor:    -moz-grab;
	cursor:         grab;
	}
.leaflet-crosshair,
.leaflet-crosshair .leaflet-interactive {
	cursor: crosshair;
	}
.leaflet-popup-pane,
.leaflet-control {
	cursor: auto;
	}
.leaflet-dragging .leaflet-grab,
.leaflet-dragging .leaflet-grab .leaflet-interactive,
.leaflet-dragging .leaflet-marker-draggable {
	cursor: move;
	cursor: -webkit-grabbing;
	cursor:    -moz-grabbing;
	cursor:         grabbing;
	}

/* marker & overlays interactivity */
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-image-layer,
.leaflet-pane > svg path,
.leaflet-tile-container {
	pointer-events: none;
	}

.leaflet-marker-icon.leaflet-interactive,
.leaflet-image-layer.leaflet-interactive,
.leaflet-pane > svg path.leaflet-interactive,
svg.leaflet-image-layer.leaflet-interactive path {
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}

/* visual tweaks */

.leaflet-container {
	background: #ddd;
	outline: 0;
	}
.leaflet-container a {
	color: #0078A8;
	}
.leaflet-container a.leaflet-active {
	outline: 2px solid orange;
	}
.leaflet-zoom-box {
	border: 2px dotted #38f;
	background: rgba(255,255,255,0.5);
	}


/* general typography */
.leaflet-container {
	font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
	}


/* general toolbar styles */

.leaflet-bar {
	box-shadow: 0 1px 5px rgba(0,0,0,0.65);
	border-radius: 4px;
	}
.leaflet-bar a,
.leaflet-bar a:hover {
	background-color: #fff;
	border-bottom: 1px solid #ccc;
	width: 26px;
	height: 26px;
	line-height: 26px;
	display: block;
	text-align: center;
	text-decoration: none;
	color: black;
	}
.leaflet-bar a,
.leaflet-control-layers-toggle {
	background-position: 50% 50%;
	background-repeat: no-repeat;
	display: block;
	}
.leaflet-bar a:hover {
	background-color: #f4f4f4;
	}
.leaflet-bar a:first-child {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	}
.leaflet-bar a:last-child {
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	border-bottom: none;
	}
.leaflet-bar a.leaflet-disabled {
	cursor: default;
	background-color: #f4f4f4;
	color: #bbb;
	}

.leaflet-touch .leaflet-bar a {
	width: 30px;
	height: 30px;
	line-height: 30px;
	}
.leaflet-touch .leaflet-bar a:first-child {
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
	}
.leaflet-touch .leaflet-bar a:last-child {
	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;
	}

/* zoom control */

.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
	font: bold 18px 'Lucida Console', Monaco, monospace;
	text-indent: 1px;
	}

.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out  {
	font-size: 22px;
	}


/* layers control */

.leaflet-control-layers {
	box-shadow: 0 1px 5px rgba(0,0,0,0.4);
	background: #fff;
	border-radius: 5px;
	}
.leaflet-control-layers-toggle {
	background-image: url(../../LeafletComponent/lib/leaflet/images/layers.png);
	width: 36px;
	height: 36px;
	}
.leaflet-retina .leaflet-control-layers-toggle {
	background-image: url(../../LeafletComponent/lib/leaflet/images/layers-2x.png);
	background-size: 26px 26px;
	}
.leaflet-touch .leaflet-control-layers-toggle {
	width: 44px;
	height: 44px;
	}
.leaflet-control-layers .leaflet-control-layers-list,
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
	display: none;
	}
.leaflet-control-layers-expanded .leaflet-control-layers-list {
	display: block;
	position: relative;
	}
.leaflet-control-layers-expanded {
	padding: 6px 10px 6px 6px;
	color: #333;
	background: #fff;
	}
.leaflet-control-layers-scrollbar {
	overflow-y: scroll;
	overflow-x: hidden;
	padding-right: 5px;
	}
.leaflet-control-layers-selector {
	margin-top: 2px;
	position: relative;
	top: 1px;
	}
.leaflet-control-layers label {
	display: block;
	}
.leaflet-control-layers-separator {
	height: 0;
	border-top: 1px solid #ddd;
	margin: 5px -10px 5px -6px;
	}

/* Default icon URLs */
.leaflet-default-icon-path {
	background-image: url(../../LeafletComponent/lib/leaflet/images/marker-icon.png);
	}


/* attribution and scale controls */

.leaflet-container .leaflet-control-attribution {
	background: #fff;
	background: rgba(255, 255, 255, 0.7);
	margin: 0;
	}
.leaflet-control-attribution,
.leaflet-control-scale-line {
	padding: 0 5px;
	color: #333;
	}
.leaflet-control-attribution a {
	text-decoration: none;
	}
.leaflet-control-attribution a:hover {
	text-decoration: underline;
	}
.leaflet-container .leaflet-control-attribution,
.leaflet-container .leaflet-control-scale {
	font-size: 11px;
	}
.leaflet-left .leaflet-control-scale {
	margin-left: 5px;
	}
.leaflet-bottom .leaflet-control-scale {
	margin-bottom: 5px;
	}
.leaflet-control-scale-line {
	border: 2px solid #777;
	border-top: none;
	line-height: 1.1;
	padding: 2px 5px 1px;
	font-size: 11px;
	white-space: nowrap;
	overflow: hidden;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;

	background: #fff;
	background: rgba(255, 255, 255, 0.5);
	}
.leaflet-control-scale-line:not(:first-child) {
	border-top: 2px solid #777;
	border-bottom: none;
	margin-top: -2px;
	}
.leaflet-control-scale-line:not(:first-child):not(:last-child) {
	border-bottom: 2px solid #777;
	}

.leaflet-touch .leaflet-control-attribution,
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	box-shadow: none;
	}
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	border: 2px solid rgba(0,0,0,0.2);
	background-clip: padding-box;
	}


/* popup */

.leaflet-popup {
	position: absolute;
	text-align: center;
	margin-bottom: 20px;
	}
.leaflet-popup-content-wrapper {
	padding: 1px;
	text-align: left;
	border-radius: 12px;
	}
.leaflet-popup-content {
	margin: 13px 19px;
	line-height: 1.4;
	}
.leaflet-popup-content p {
	margin: 18px 0;
	}
.leaflet-popup-tip-container {
	width: 40px;
	height: 20px;
	position: absolute;
	left: 50%;
	margin-left: -20px;
	overflow: hidden;
	pointer-events: none;
	}
.leaflet-popup-tip {
	width: 17px;
	height: 17px;
	padding: 1px;

	margin: -10px auto 0;

	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	        transform: rotate(45deg);
	}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
	background: white;
	color: #333;
	box-shadow: 0 3px 14px rgba(0,0,0,0.4);
	}
.leaflet-container a.leaflet-popup-close-button {
	position: absolute;
	top: 0;
	right: 0;
	padding: 4px 4px 0 0;
	border: none;
	text-align: center;
	width: 18px;
	height: 14px;
	font: 16px/14px Tahoma, Verdana, sans-serif;
	color: #c3c3c3;
	text-decoration: none;
	font-weight: bold;
	background: transparent;
	}
.leaflet-container a.leaflet-popup-close-button:hover {
	color: #999;
	}
.leaflet-popup-scrolled {
	overflow: auto;
	border-bottom: 1px solid #ddd;
	border-top: 1px solid #ddd;
	}

.leaflet-oldie .leaflet-popup-content-wrapper {
	zoom: 1;
	}
.leaflet-oldie .leaflet-popup-tip {
	width: 24px;
	margin: 0 auto;

	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
	filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
	}
.leaflet-oldie .leaflet-popup-tip-container {
	margin-top: -1px;
	}

.leaflet-oldie .leaflet-control-zoom,
.leaflet-oldie .leaflet-control-layers,
.leaflet-oldie .leaflet-popup-content-wrapper,
.leaflet-oldie .leaflet-popup-tip {
	border: 1px solid #999;
	}


/* div icon */

.leaflet-div-icon {
	background: #fff;
	border: 1px solid #666;
	}


/* Tooltip */
/* Base styles for the element that has a tooltip */
.leaflet-tooltip {
	position: absolute;
	padding: 6px;
	background-color: #fff;
	border: 1px solid #fff;
	border-radius: 3px;
	color: #222;
	white-space: nowrap;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	pointer-events: none;
	box-shadow: 0 1px 3px rgba(0,0,0,0.4);
	}
.leaflet-tooltip.leaflet-clickable {
	cursor: pointer;
	pointer-events: auto;
	}
.leaflet-tooltip-top:before,
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	position: absolute;
	pointer-events: none;
	border: 6px solid transparent;
	background: transparent;
	content: "";
	}

/* Directions */

.leaflet-tooltip-bottom {
	margin-top: 6px;
}
.leaflet-tooltip-top {
	margin-top: -6px;
}
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-top:before {
	left: 50%;
	margin-left: -6px;
	}
.leaflet-tooltip-top:before {
	bottom: 0;
	margin-bottom: -12px;
	border-top-color: #fff;
	}
.leaflet-tooltip-bottom:before {
	top: 0;
	margin-top: -12px;
	margin-left: -6px;
	border-bottom-color: #fff;
	}
.leaflet-tooltip-left {
	margin-left: -6px;
}
.leaflet-tooltip-right {
	margin-left: 6px;
}
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	top: 50%;
	margin-top: -6px;
	}
.leaflet-tooltip-left:before {
	right: 0;
	margin-right: -12px;
	border-left-color: #fff;
	}
.leaflet-tooltip-right:before {
	left: 0;
	margin-left: -12px;
	border-right-color: #fff;
	}

.leaflet-draw-section{position:relative}.leaflet-draw-toolbar{margin-top:12px}.leaflet-draw-toolbar-top{margin-top:0}.leaflet-draw-toolbar-notop a:first-child{border-top-right-radius:0}.leaflet-draw-toolbar-nobottom a:last-child{border-bottom-right-radius:0}.leaflet-draw-toolbar a{background-image:url('../../LeafletComponent/lib/leaflet.draw/images/spritesheet.png');background-image:linear-gradient(transparent,transparent),url('../../LeafletComponent/lib/leaflet.draw/images/spritesheet.svg');background-repeat:no-repeat;background-size:300px 30px;background-clip:padding-box}.leaflet-retina .leaflet-draw-toolbar a{background-image:url('../../LeafletComponent/lib/leaflet.draw/images/spritesheet-2x.png');background-image:linear-gradient(transparent,transparent),url('../../LeafletComponent/lib/leaflet.draw/images/spritesheet.svg')}
.leaflet-draw a{display:block;text-align:center;text-decoration:none}.leaflet-draw a .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.leaflet-draw-actions{display:none;list-style:none;margin:0;padding:0;position:absolute;left:26px;top:0;white-space:nowrap}.leaflet-touch .leaflet-draw-actions{left:32px}.leaflet-right .leaflet-draw-actions{right:26px;left:auto}.leaflet-touch .leaflet-right .leaflet-draw-actions{right:32px;left:auto}.leaflet-draw-actions li{display:inline-block}
.leaflet-draw-actions li:first-child a{border-left:0}.leaflet-draw-actions li:last-child a{-webkit-border-radius:0 4px 4px 0;border-radius:0 4px 4px 0}.leaflet-right .leaflet-draw-actions li:last-child a{-webkit-border-radius:0;border-radius:0}.leaflet-right .leaflet-draw-actions li:first-child a{-webkit-border-radius:4px 0 0 4px;border-radius:4px 0 0 4px}.leaflet-draw-actions a{background-color:#919187;border-left:1px solid #AAA;color:#FFF;font:11px/19px "Helvetica Neue",Arial,Helvetica,sans-serif;line-height:28px;text-decoration:none;padding-left:10px;padding-right:10px;height:28px}
.leaflet-touch .leaflet-draw-actions a{font-size:12px;line-height:30px;height:30px}.leaflet-draw-actions-bottom{margin-top:0}.leaflet-draw-actions-top{margin-top:1px}.leaflet-draw-actions-top a,.leaflet-draw-actions-bottom a{height:27px;line-height:27px}.leaflet-draw-actions a:hover{background-color:#a0a098}.leaflet-draw-actions-top.leaflet-draw-actions-bottom a{height:26px;line-height:26px}.leaflet-draw-toolbar .leaflet-draw-draw-polyline{background-position:-2px -2px}.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-polyline{background-position:0 -1px}
.leaflet-draw-toolbar .leaflet-draw-draw-polygon{background-position:-31px -2px}.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-polygon{background-position:-29px -1px}.leaflet-draw-toolbar .leaflet-draw-draw-rectangle{background-position:-62px -2px}.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-rectangle{background-position:-60px -1px}.leaflet-draw-toolbar .leaflet-draw-draw-circle{background-position:-92px -2px}.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-circle{background-position:-90px -1px}
.leaflet-draw-toolbar .leaflet-draw-draw-marker{background-position:-122px -2px}.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-marker{background-position:-120px -1px}.leaflet-draw-toolbar .leaflet-draw-draw-circlemarker{background-position:-273px -2px}.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-circlemarker{background-position:-271px -1px}.leaflet-draw-toolbar .leaflet-draw-edit-edit{background-position:-152px -2px}.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-edit-edit{background-position:-150px -1px}
.leaflet-draw-toolbar .leaflet-draw-edit-remove{background-position:-182px -2px}.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-edit-remove{background-position:-180px -1px}.leaflet-draw-toolbar .leaflet-draw-edit-edit.leaflet-disabled{background-position:-212px -2px}.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-edit-edit.leaflet-disabled{background-position:-210px -1px}.leaflet-draw-toolbar .leaflet-draw-edit-remove.leaflet-disabled{background-position:-242px -2px}.leaflet-touch .leaflet-draw-toolbar .leaflet-draw-edit-remove.leaflet-disabled{background-position:-240px -2px}
.leaflet-mouse-marker{background-color:#fff;cursor:crosshair}.leaflet-draw-tooltip{background:#363636;background:rgba(0,0,0,0.5);border:1px solid transparent;-webkit-border-radius:4px;border-radius:4px;color:#fff;font:12px/18px "Helvetica Neue",Arial,Helvetica,sans-serif;margin-left:20px;margin-top:-21px;padding:4px 8px;position:absolute;visibility:hidden;white-space:nowrap;z-index:6}.leaflet-draw-tooltip:before{border-right:6px solid black;border-right-color:rgba(0,0,0,0.5);border-top:6px solid transparent;border-bottom:6px solid transparent;content:"";position:absolute;top:7px;left:-7px}
.leaflet-error-draw-tooltip{background-color:#f2dede;border:1px solid #e6b6bd;color:#b94a48}.leaflet-error-draw-tooltip:before{border-right-color:#e6b6bd}.leaflet-draw-tooltip-single{margin-top:-12px}.leaflet-draw-tooltip-subtext{color:#f8d5e4}.leaflet-draw-guide-dash{font-size:1%;opacity:.6;position:absolute;width:5px;height:5px}.leaflet-edit-marker-selected{background-color:rgba(254,87,161,0.1);border:4px dashed rgba(254,87,161,0.6);-webkit-border-radius:4px;border-radius:4px;box-sizing:content-box}
.leaflet-edit-move{cursor:move}.leaflet-edit-resize{cursor:pointer}.leaflet-oldie .leaflet-draw-toolbar{border:1px solid #999}
/*
Author: L. Voogdt
License: MIT
Version: 1.0
*/

/* Marker setup */
.awesome-marker {
  background: url('../../LeafletComponent/lib/Leaflet.awesome.markers/images/markers-soft.png') no-repeat 0 0;
  width: 35px;
  height: 46px;
  position:absolute;
  left:0;
  top:0;
  display: block;
  text-align: center;
}

.awesome-marker-shadow {
  background: url('../../LeafletComponent/lib/Leaflet.awesome.markers/images/markers-shadow.png') no-repeat 0 0;
  width: 36px;
  height: 16px;
}

/* Retina displays */
@media (min--moz-device-pixel-ratio: 1.5),(-o-min-device-pixel-ratio: 3/2),
(-webkit-min-device-pixel-ratio: 1.5),(min-device-pixel-ratio: 1.5),(min-resolution: 1.5dppx) {
 .awesome-marker {
  background-image: url('../../LeafletComponent/lib/Leaflet.awesome.markers/images/markers-soft@2x.png');
  background-size: 720px 46px;
 }
 .awesome-marker-shadow {
  background-image: url('../../LeafletComponent/lib/Leaflet.awesome.markers/images/markers-shadow@2x.png');
  background-size: 35px 16px;
 }
}

.awesome-marker i {
  color: #333;
  margin-top: 10px;
  display: inline-block;
  font-size: 14px;
}

.awesome-marker .icon-white {
  color: #fff;
}

/* Colors */
.awesome-marker-icon-red {
  background-position: 0 0;
}

.awesome-marker-icon-darkred {
  background-position: -180px 0;
}

.awesome-marker-icon-lightred {
  background-position: -360px 0;
}

.awesome-marker-icon-orange {
  background-position: -36px 0;
}

.awesome-marker-icon-beige {
  background-position: -396px 0;
}

.awesome-marker-icon-green {
  background-position: -72px 0;
}

.awesome-marker-icon-darkgreen {
  background-position: -252px 0;
}

.awesome-marker-icon-lightgreen {
  background-position: -432px 0;
}

.awesome-marker-icon-blue {
  background-position: -108px 0;
}

.awesome-marker-icon-darkblue {
  background-position: -216px 0;
}

.awesome-marker-icon-lightblue {
  background-position: -468px 0;
}

.awesome-marker-icon-purple {
  background-position: -144px 0;
}

.awesome-marker-icon-darkpurple {
  background-position: -288px 0;
}

.awesome-marker-icon-pink {
  background-position: -504px 0;
}

.awesome-marker-icon-cadetblue {
  background-position: -324px 0;
}

.awesome-marker-icon-white {
  background-position: -574px 0;
}

.awesome-marker-icon-gray {
  background-position: -648px 0;
}

.awesome-marker-icon-lightgray {
  background-position: -612px 0;
}

.awesome-marker-icon-black {
  background-position: -682px 0;
}

.marker-cluster-small {
	background-color: rgba(181, 226, 140, 0.6);
	}
.marker-cluster-small div {
	background-color: rgba(110, 204, 57, 0.6);
	}

.marker-cluster-medium {
	background-color: rgba(241, 211, 87, 0.6);
	}
.marker-cluster-medium div {
	background-color: rgba(240, 194, 12, 0.6);
	}

.marker-cluster-large {
	background-color: rgba(253, 156, 115, 0.6);
	}
.marker-cluster-large div {
	background-color: rgba(241, 128, 23, 0.6);
	}

	/* IE 6-8 fallback colors */
.leaflet-oldie .marker-cluster-small {
	background-color: rgb(181, 226, 140);
	}
.leaflet-oldie .marker-cluster-small div {
	background-color: rgb(110, 204, 57);
	}

.leaflet-oldie .marker-cluster-medium {
	background-color: rgb(241, 211, 87);
	}
.leaflet-oldie .marker-cluster-medium div {
	background-color: rgb(240, 194, 12);
	}

.leaflet-oldie .marker-cluster-large {
	background-color: rgb(253, 156, 115);
	}
.leaflet-oldie .marker-cluster-large div {
	background-color: rgb(241, 128, 23);
}

.marker-cluster {
	background-clip: padding-box;
	border-radius: 20px;
	}
.marker-cluster div {
	width: 30px;
	height: 30px;
	margin-left: 5px;
	margin-top: 5px;

	text-align: center;
	border-radius: 15px;
	font: 12px "Helvetica Neue", Arial, Helvetica, sans-serif;
	}
.marker-cluster span {
	line-height: 30px;
	}
.leaflet-control-graphicscale {
    /*background-color: rgb(254, 246, 237);
    background-image: url(../../LeafletComponent/custom/css/noise.png);
    padding: 20px 45px 30px 35px;
    box-shadow: 0px 0px 30px rgba(52, 38, 13, .5);
    color: black;
    padding-right: 20px;
    */
    display: block;
    background: #fff;
    padding: 10px;
    margin-bottom: 20px;
    background: white;
    border: 2px solid rgba(0,0,0,0.2);
    color: black;
}


.leaflet-control-graphicscale-inner {
    margin-left: 10px
}

    .leaflet-control-graphicscale-inner .units {
        display: inline-block
    }

    .leaflet-control-graphicscale-inner .subunits {
        display: none
    }

    .leaflet-control-graphicscale-inner .label {
        width: 100px;
        text-align: center;
        margin-bottom: 10px;
        position: absolute;
        bottom: 0;
        opacity: 1;
        -webkit-transition: opacity 0.4s linear;
        -moz-transition: opacity 0.4s linear;
        -ms-transition: opacity 0.4s linear;
        -o-transition: opacity 0.4s linear;
        transition: opacity 0.4s linear
    }

    .leaflet-control-graphicscale-inner .divisionLabel {
        right: 0;
        margin-right: -50px
    }

    .leaflet-control-graphicscale-inner .zeroLabel, .leaflet-control-graphicscale-inner .subunitsLabel {
        left: 0;
        margin-left: -50px
    }

    .leaflet-control-graphicscale-inner .division {
        display: inline-block;
        position: relative;
        width: 40px;
        -webkit-transition: width 0.4s ease-in-out;
        -moz-transition: width 0.4s ease-in-out;
        -ms-transition: width 0.4s ease-in-out;
        -o-transition: width 0.4s ease-in-out;
        transition: width 0.4s ease-in-out
    }

        .leaflet-control-graphicscale-inner .division .line, .leaflet-control-graphicscale-inner .division .line2 {
            border-style: solid;
            position: relative
        }

        .leaflet-control-graphicscale-inner .division .line2 {
            height: 0;
            border-width: 0
        }

        .leaflet-control-graphicscale-inner .division .line {
            height: 6px;
            border-width: 1px 1px 1px 0
        }

    .leaflet-control-graphicscale-inner .units .division:first-child .line {
        border-left-width: 1px
    }

    .leaflet-control-graphicscale-inner .subunits .division .line {
        border-width: 1px 0 1px 1px
    }

    .leaflet-control-graphicscale-inner .fill {
        position: relative
    }

    .leaflet-control-graphicscale-inner.showsubunits .subunits {
        display: inline-block
    }

    .leaflet-control-graphicscale-inner.double .division .line2 {
        height: 6px;
        border-width: 0 1px 1px 0
    }

    .leaflet-control-graphicscale-inner.double .units .division:first-child .line2 {
        border-left-width: 1px
    }

    .leaflet-control-graphicscale-inner.double .subunits .division .line2 {
        border-width: 0 0 1px 1px
    }

    .leaflet-control-graphicscale-inner.double .label {
        margin-bottom: 14px
    }

    .leaflet-control-graphicscale-inner.filled .fill {
        background-color: #000;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0
    }

    .leaflet-control-graphicscale-inner.filled-line .line .fill {
        height: 2px;
        top: 2px
    }

    .leaflet-control-graphicscale-inner.filled-line.double .fill {
        height: 2px;
        top: 2px
    }

    .leaflet-control-graphicscale-inner.filled-hollow .fill {
        position: absolute;
        top: 1px;
        left: 1px;
        right: 1px;
        bottom: 1px
    }

    .leaflet-control-graphicscale-inner .division.hidden {
        width: 0
    }

        .leaflet-control-graphicscale-inner .division.hidden .line, .leaflet-control-graphicscale-inner .division.hidden .line2 {
            height: 0;
            border-width: 0
        }

        .leaflet-control-graphicscale-inner .division.hidden .label:not(.subunitsLabel) {
            opacity: 0
        }


/*Media Query for Hiding graphicscale at Mobile devices*/
@media only screen and (max-width: 600px) {
    .leaflet-control-graphicscale{ display:none !important; }
}




body {
    font: 14px/1.5 Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #777;
    font-weight: 300;
}

h1, h2, h3, h4, h5, h6 {
    color: #222;
    margin: 0 0 20px;
}

p, ul, ol, table, pre, dl {
    margin: 0 0 20px;
}

h1, h2, h3 {
    line-height: 1.1;
}

h1 {
    font-size: 28px;
}

h2 {
    color: #393939;
}

h3, h4, h5, h6 {
    color: #494949;
}

a {
    color: #39c;
    font-weight: 400;
    text-decoration: none;
}

    a small {
        font-size: 11px;
        color: #777;
        margin-top: -0.6em;
        display: block;
    }

.wrapper {
    width: 860px;
    margin: 0 auto;
}

blockquote {
    border-left: 1px solid #e5e5e5;
    margin: 0;
    padding: 0 0 0 20px;
    font-style: italic;
}

code, pre {
    font-family: Monaco, Bitstream Vera Sans Mono, Lucida Console, Terminal;
    color: #333;
    font-size: 12px;
}

pre {
    padding: 8px 15px;
    background: #f8f8f8;
    border-radius: 5px;
    border: 1px solid #e5e5e5;
    overflow-x: auto;
}

table {
    width: 100%;
    border-collapse: collapse;
}

th, td {
    text-align: left;
    padding: 5px 10px;
    border-bottom: 1px solid #e5e5e5;
}

dt {
    color: #444;
    font-weight: 700;
}

th {
    color: #444;
}

img {
    max-width: 100%;
}

header {
    width: 270px;
    float: left;
    position: fixed;
}

    header ul {
        list-style: none;
        height: 40px;
        padding: 0;
        background: #eee;
        background: -moz-linear-gradient(top, #f8f8f8 0%, #dddddd 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8f8f8), color-stop(100%,#dddddd));
        background: -webkit-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
        background: -o-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
        background: -ms-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
        background: linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
        border-radius: 5px;
        border: 1px solid #d2d2d2;
        box-shadow: inset #fff 0 1px 0, inset rgba(0,0,0,0.03) 0 -1px 0;
        width: 270px;
    }

    header li {
        width: 89px;
        float: left;
        border-right: 1px solid #d2d2d2;
        height: 40px;
    }

    header ul a {
        line-height: 1;
        font-size: 11px;
        color: #999;
        display: block;
        text-align: center;
        padding-top: 6px;
        height: 40px;
    }

strong {
    color: #222;
    font-weight: 700;
}

header ul li + li {
    width: 88px;
    border-left: 1px solid #fff;
}

    header ul li + li + li {
        border-right: none;
        width: 89px;
    }

header ul a strong {
    font-size: 14px;
    display: block;
    color: #222;
}

section {
    /*width: 500px;*/
    float: right;
    padding-right: 10px;
    padding-left: 10px;
    padding-bottom: 10px;
}

small {
    font-size: 11px;
}

hr {
    border: 0;
    background: #e5e5e5;
    height: 1px;
    margin: 0 0 20px;
}

footer {
    width: 270px;
    float: left;
    position: fixed;
    bottom: 50px;
}

@media print, screen and (max-width: 960px) {

    div.wrapper {
        width: auto;
        margin: 0;
    }

    header, section, footer {
        float: none;
        position: static;
        width: auto;
    }

    header {
        padding-right: 320px;
    }

    section {
        border: 1px solid #e5e5e5;
        border-width: 1px 0;
        padding: 20px 0;
        margin: 0 0 20px;
    }

    header a small {
        display: inline;
    }

    header ul {
        position: absolute;
        right: 50px;
        top: 52px;
    }
}



/** Slider **/
.leaflet-control-zoomslider-wrap {
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #fff;
    border-bottom: 1px solid #ccc;
}

.leaflet-control-zoomslider-body {
    width: 2px;
    border: solid #fff;
    border-width: 0px 9px 0px 9px;
    background-color: black;
    margin: 0 auto;
}

.leaflet-control-zoomslider-knob {
    position: relative;
    width: 12px;
    height: 4px;
    background-color: #efefef;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    border: 1px solid #000;
    margin-left: -6px;
}

.leaflet-control-zoomslider-body:hover {
    cursor: pointer;
}

.leaflet-control-zoomslider-knob:hover {
    cursor: default;
    cursor: -webkit-grab;
    cursor: -moz-grab;
}

.leaflet-dragging .leaflet-control-zoomslider,
.leaflet-dragging .leaflet-control-zoomslider-wrap,
.leaflet-dragging .leaflet-control-zoomslider-body,
.leaflet-dragging .leaflet-control-zoomslider a,
.leaflet-dragging .leaflet-control-zoomslider a.leaflet-control-zoomslider-disabled,
.leaflet-dragging .leaflet-control-zoomslider-knob:hover {
    cursor: move;
    cursor: -webkit-grabbing;
    cursor: -moz-grabbing;
}

/** Leaflet Zoom Styles **/
.leaflet-container .leaflet-control-zoomslider {
    margin-left: 10px;
    margin-top: 10px;
}

.leaflet-control-zoomslider a {
    width: 26px;
    height: 26px;
    text-align: center;
    text-decoration: none;
    color: black;
    display: block;
}

    .leaflet-control-zoomslider a:hover {
        background-color: #f4f4f4;
    }

.leaflet-control-zoomslider-in {
    font: bold 18px 'Lucida Console', Monaco, monospace;
}

    .leaflet-control-zoomslider-in:after {
        content: "+"
    }

.leaflet-control-zoomslider-out {
    font: bold 22px 'Lucida Console', Monaco, monospace;
}

    .leaflet-control-zoomslider-out:after {
        content: "-"
    }

.leaflet-control-zoomslider a.leaflet-control-zoomslider-disabled {
    cursor: default;
    color: #bbb;
}

/* Touch */
.leaflet-touch .leaflet-control-zoomslider-body {
    background-position: 10px 0px;
}

.leaflet-touch .leaflet-control-zoomslider-knob {
    width: 16px;
    margin-left: -7px;
}

.leaflet-touch .leaflet-control-zoomslider a {
    width: 30px;
    line-height: 30px;
}

    .leaflet-touch .leaflet-control-zoomslider a:hover {
        width: 30px;
        line-height: 30px;
    }

.leaflet-touch .leaflet-control-zoomslider-in {
    font-size: 24px;
    line-height: 29px;
}

.leaflet-touch .leaflet-control-zoomslider-out {
    font-size: 28px;
    line-height: 30px;
}

.leaflet-touch .leaflet-control-zoomslider {
    box-shadow: none;
    /*border: 4px solid rgba(0,0,0,0.3);*/
}

.fullscreen-icon { background-image: url(../../LeafletComponent/lib/leaflet.fullscreen/icon-fullscreen.png); }
.leaflet-retina .fullscreen-icon { background-image: url(../../LeafletComponent/lib/leaflet.fullscreen/icon-fullscreen-2x.png); background-size: 26px 26px; }
/* one selector per rule as explained here : http://www.sitepoint.com/html5-full-screen-api/ */
.leaflet-container:-webkit-full-screen { width: 100% !important; height: 100% !important; z-index: 99999; }
.leaflet-container:-ms-fullscreen { width: 100% !important; height: 100% !important; z-index: 99999; }
.leaflet-container:full-screen { width: 100% !important; height: 100% !important; z-index: 99999; }
.leaflet-container:fullscreen { width: 100% !important; height: 100% !important; z-index: 99999; }
.leaflet-pseudo-fullscreen { position: fixed !important; width: 100% !important; height: 100% !important; top: 0px !important; left: 0px !important; z-index: 99999; }
.leaflet-control-loading:empty {
    /* Spinner via ajaxload.info, base64-encoded */
    background-image: url(data:image/gif;base64,R0lGODlhEAAQAPQAAP///wAAAPDw8IqKiuDg4EZGRnp6egAAAFhYWCQkJKysrL6+vhQUFJycnAQEBDY2NmhoaAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH+GkNyZWF0ZWQgd2l0aCBhamF4bG9hZC5pbmZvACH5BAAKAAAAIf8LTkVUU0NBUEUyLjADAQAAACwAAAAAEAAQAAAFdyAgAgIJIeWoAkRCCMdBkKtIHIngyMKsErPBYbADpkSCwhDmQCBethRB6Vj4kFCkQPG4IlWDgrNRIwnO4UKBXDufzQvDMaoSDBgFb886MiQadgNABAokfCwzBA8LCg0Egl8jAggGAA1kBIA1BAYzlyILczULC2UhACH5BAAKAAEALAAAAAAQABAAAAV2ICACAmlAZTmOREEIyUEQjLKKxPHADhEvqxlgcGgkGI1DYSVAIAWMx+lwSKkICJ0QsHi9RgKBwnVTiRQQgwF4I4UFDQQEwi6/3YSGWRRmjhEETAJfIgMFCnAKM0KDV4EEEAQLiF18TAYNXDaSe3x6mjidN1s3IQAh+QQACgACACwAAAAAEAAQAAAFeCAgAgLZDGU5jgRECEUiCI+yioSDwDJyLKsXoHFQxBSHAoAAFBhqtMJg8DgQBgfrEsJAEAg4YhZIEiwgKtHiMBgtpg3wbUZXGO7kOb1MUKRFMysCChAoggJCIg0GC2aNe4gqQldfL4l/Ag1AXySJgn5LcoE3QXI3IQAh+QQACgADACwAAAAAEAAQAAAFdiAgAgLZNGU5joQhCEjxIssqEo8bC9BRjy9Ag7GILQ4QEoE0gBAEBcOpcBA0DoxSK/e8LRIHn+i1cK0IyKdg0VAoljYIg+GgnRrwVS/8IAkICyosBIQpBAMoKy9dImxPhS+GKkFrkX+TigtLlIyKXUF+NjagNiEAIfkEAAoABAAsAAAAABAAEAAABWwgIAICaRhlOY4EIgjH8R7LKhKHGwsMvb4AAy3WODBIBBKCsYA9TjuhDNDKEVSERezQEL0WrhXucRUQGuik7bFlngzqVW9LMl9XWvLdjFaJtDFqZ1cEZUB0dUgvL3dgP4WJZn4jkomWNpSTIyEAIfkEAAoABQAsAAAAABAAEAAABX4gIAICuSxlOY6CIgiD8RrEKgqGOwxwUrMlAoSwIzAGpJpgoSDAGifDY5kopBYDlEpAQBwevxfBtRIUGi8xwWkDNBCIwmC9Vq0aiQQDQuK+VgQPDXV9hCJjBwcFYU5pLwwHXQcMKSmNLQcIAExlbH8JBwttaX0ABAcNbWVbKyEAIfkEAAoABgAsAAAAABAAEAAABXkgIAICSRBlOY7CIghN8zbEKsKoIjdFzZaEgUBHKChMJtRwcWpAWoWnifm6ESAMhO8lQK0EEAV3rFopIBCEcGwDKAqPh4HUrY4ICHH1dSoTFgcHUiZjBhAJB2AHDykpKAwHAwdzf19KkASIPl9cDgcnDkdtNwiMJCshACH5BAAKAAcALAAAAAAQABAAAAV3ICACAkkQZTmOAiosiyAoxCq+KPxCNVsSMRgBsiClWrLTSWFoIQZHl6pleBh6suxKMIhlvzbAwkBWfFWrBQTxNLq2RG2yhSUkDs2b63AYDAoJXAcFRwADeAkJDX0AQCsEfAQMDAIPBz0rCgcxky0JRWE1AmwpKyEAIfkEAAoACAAsAAAAABAAEAAABXkgIAICKZzkqJ4nQZxLqZKv4NqNLKK2/Q4Ek4lFXChsg5ypJjs1II3gEDUSRInEGYAw6B6zM4JhrDAtEosVkLUtHA7RHaHAGJQEjsODcEg0FBAFVgkQJQ1pAwcDDw8KcFtSInwJAowCCA6RIwqZAgkPNgVpWndjdyohACH5BAAKAAkALAAAAAAQABAAAAV5ICACAimc5KieLEuUKvm2xAKLqDCfC2GaO9eL0LABWTiBYmA06W6kHgvCqEJiAIJiu3gcvgUsscHUERm+kaCxyxa+zRPk0SgJEgfIvbAdIAQLCAYlCj4DBw0IBQsMCjIqBAcPAooCBg9pKgsJLwUFOhCZKyQDA3YqIQAh+QQACgAKACwAAAAAEAAQAAAFdSAgAgIpnOSonmxbqiThCrJKEHFbo8JxDDOZYFFb+A41E4H4OhkOipXwBElYITDAckFEOBgMQ3arkMkUBdxIUGZpEb7kaQBRlASPg0FQQHAbEEMGDSVEAA1QBhAED1E0NgwFAooCDWljaQIQCE5qMHcNhCkjIQAh+QQACgALACwAAAAAEAAQAAAFeSAgAgIpnOSoLgxxvqgKLEcCC65KEAByKK8cSpA4DAiHQ/DkKhGKh4ZCtCyZGo6F6iYYPAqFgYy02xkSaLEMV34tELyRYNEsCQyHlvWkGCzsPgMCEAY7Cg04Uk48LAsDhRA8MVQPEF0GAgqYYwSRlycNcWskCkApIyEAOwAAAAAAAAAAAA==);
    background-repeat: no-repeat;
}

.leaflet-control-loading,
.leaflet-control-zoom a.leaflet-control-loading,
.leaflet-control-zoomslider a.leaflet-control-loading,
.leaflet-control-layer-container {
    display: none;
}

.leaflet-control-loading.is-loading,
.leaflet-control-zoom a.leaflet-control-loading.is-loading,
.leaflet-control-zoomslider a.leaflet-control-loading.is-loading,
.leaflet-control-layer-container.is-loading {
    display: block;
}

/* Necessary for display consistency in Leaflet >= 0.6 */
.leaflet-bar-part-bottom {
    border-bottom: medium none;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.leaflet-ruler {
    height: 30px;
    width: 30px;
    background-image: url('../../LeafletComponent/custom/css/images/icon.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 20px 20px;
    transition: .5s;
}
    .leaflet-ruler:hover {
        
    }
.leaflet-ruler-clicked {
    height: 30px;
    width: 30px;
    background-image: url('../../LeafletComponent/custom/css/images/custom-ruler.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 24px 20px;
    transition: .5s;
}

.leaflet-bar {
    background-color: #FFFFFF;
}
.leaflet-control {
  cursor: pointer;
}
.result-tooltip {
    background-color: black;
    border-width: medium;
    border-color: black;
    font-size: 12px;
    color: white;
}
.moving-tooltip {
    background-color: rgba(0, 0, 0, .9);
    background-clip: padding-box;
    opacity: 0.5;
    border-color: black;
    font-size: 12px;
    color: white;
}
.plus-length{
  padding-left: 45px;
}

#overlay {
    position: absolute;
    z-index: 9999;
    padding: 10px;
    margin: 85px 12px 30px 12px;
    background: rgba(255,255,255, 0.5);
    right: 0;
    bottom: 0;
    box-shadow: 1px 1px 1px grey;

}

.window-btn {
    display: block;
    margin: 3px;
    width: 150px;
    height: 30px;
}

.leaflet-container .leaflet-custom-control-container {
    position: relative;
    z-index: 1000;
    display: none;
    justify-content: center;
    padding: 10px;
}

.leaflet-container.leaflet-custom-ruling-is-active .leaflet-custom-control-container {
    display: flex;
}

.leaflet-container .leaflet-custom-control-container > button {
    transition: all .2s ease-in-out;
    background: #919187;
    border-radius: 4px;
    color: #fff;
    padding: 15px 10px;
    font-size: 12px;
    outline: none;
    border: none;
}

.leaflet-container .leaflet-custom-control-container > button:hover {
    background: #a0a098;
}

/* ==========================================================================
    Import Shape modal (OC-1529 visual uplift)
   namespaced under pc-import-shape-* so host-app styles never collide.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Design tokens — scoped to the two modal roots so they don't leak globally
   -------------------------------------------------------------------------- */
.pc-import-shape-overlay,
.pc-import-shape-discard-overlay {
    --pc-color-primary: #2BBCC0;
    --pc-color-primary-hover: #22999C;
    --pc-color-primary-disabled: rgba(43, 188, 192, 0.45);
    --pc-color-primary-light: rgba(43, 188, 192, 0.08);

    --pc-color-white: #ffffff;
    --pc-color-gray-50: #F9FAFB;
    --pc-color-gray-100: #F3F4F6;
    --pc-color-gray-200: #E5E7EB;
    --pc-color-gray-300: #D1D5DB;
    --pc-color-gray-400: #9CA3AF;
    --pc-color-gray-500: #6B7280;
    --pc-color-gray-700: #374151;
    --pc-color-gray-900: #111827;

    --pc-color-error: #DC2626;
    --pc-color-error-bg: #FEF2F2;

    --pc-color-overlay: rgba(0, 0, 0, 0.35);

    --pc-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --pc-font-mono: 'Fira Code', 'Cascadia Code', 'Consolas', monospace;

    --pc-space-xs: 4px;
    --pc-space-sm: 8px;
    --pc-space-md: 16px;
    --pc-space-lg: 24px;
    --pc-space-xl: 32px;

    --pc-radius-sm: 4px;
    --pc-radius-md: 8px;
    --pc-radius-lg: 12px;

    --pc-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
    --pc-shadow-modal: 0 24px 64px rgba(0, 0, 0, 0.18), 0 4px 16px rgba(0, 0, 0, 0.08);

    --pc-transition-fast: 150ms ease;
    --pc-transition-normal: 250ms ease;
}

/* --------------------------------------------------------------------------
   Overlay
   `inset: 0` is the full-viewport fallback. When a Leaflet map container is
   available the JS sizes the overlay to the map's rect (top/left/width/height)
   so the modal centres on the map view, not the browser window.
   -------------------------------------------------------------------------- */
.pc-import-shape-overlay {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--pc-color-overlay);
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--pc-transition-normal), visibility var(--pc-transition-normal);
    font-family: var(--pc-font-family);
    color: var(--pc-color-gray-900);
}

.pc-import-shape-overlay.pc-is-open {
    opacity: 1;
    visibility: visible;
}

/* --------------------------------------------------------------------------
   Modal card
   -------------------------------------------------------------------------- */
.pc-import-shape-modal {
    position: relative;
    width: 520px;
    max-width: calc(100vw - 40px);
    max-height: calc(100vh - 80px);
    background: var(--pc-color-white);
    border-radius: var(--pc-radius-lg);
    box-shadow: var(--pc-shadow-modal);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translateY(16px) scale(0.97);
    transition: transform var(--pc-transition-normal);
}

.pc-import-shape-overlay.pc-is-open .pc-import-shape-modal {
    transform: translateY(0) scale(1);
}

/* The modal card is given tabindex="-1" so openModal can move focus into it
   (off the host's trigger button). It is a container, not a control, so it must
   not show a focus outline when focused programmatically. */
.pc-import-shape-modal:focus {
    outline: none;
}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */
.pc-import-shape-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--pc-space-lg) var(--pc-space-lg) var(--pc-space-md);
}

.pc-import-shape-title {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
    color: var(--pc-color-gray-900);
    letter-spacing: -0.01em;
}

.pc-import-shape-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    color: var(--pc-color-gray-400);
    border-radius: var(--pc-radius-sm);
    cursor: pointer;
    font-size: 20px;
    line-height: 1;
    transition: background var(--pc-transition-fast), color var(--pc-transition-fast);
}

.pc-import-shape-close:hover {
    background: var(--pc-color-gray-100);
    color: var(--pc-color-gray-700);
}

/* --------------------------------------------------------------------------
   Tabs
   -------------------------------------------------------------------------- */
.pc-import-shape-tabs {
    display: flex;
    border-bottom: 2px solid var(--pc-color-gray-200);
    padding: 0 var(--pc-space-lg);
    gap: 0;
}

.pc-import-shape-tab {
    position: relative;
    padding: var(--pc-space-sm) var(--pc-space-lg) var(--pc-space-md);
    border: none;
    background: none;
    font-family: var(--pc-font-family);
    font-size: 14px;
    font-weight: 500;
    color: var(--pc-color-gray-400);
    cursor: pointer;
    transition: color var(--pc-transition-fast);
    white-space: nowrap;
}

.pc-import-shape-tab::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    height: 2px;
    background: transparent;
    transition: background var(--pc-transition-fast);
}

.pc-import-shape-tab:hover {
    color: var(--pc-color-gray-700);
}

.pc-import-shape-tab.pc-is-active {
    color: var(--pc-color-primary);
    font-weight: 600;
}

.pc-import-shape-tab.pc-is-active::after {
    background: var(--pc-color-primary);
}

/* --------------------------------------------------------------------------
   Tab panels
   -------------------------------------------------------------------------- */
.pc-import-shape-panels {
    flex: 1;
    overflow-y: auto;
    padding: var(--pc-space-lg);
}

.pc-import-shape-panel {
    display: none;
}

.pc-import-shape-panel.pc-is-active {
    display: block;
}

.pc-import-shape-panel-description {
    font-size: 14px;
    color: var(--pc-color-gray-500);
    line-height: 1.55;
    margin: 0 0 var(--pc-space-lg);
}

/* --------------------------------------------------------------------------
   Dropzone (default + hover/drag-over + has-file states)
   -------------------------------------------------------------------------- */
.pc-import-shape-dropzone {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--pc-space-sm);
    padding: var(--pc-space-xl) var(--pc-space-lg);
    border: 2px dashed var(--pc-color-gray-300);
    border-radius: var(--pc-radius-md);
    background: var(--pc-color-gray-50);
    cursor: pointer;
    transition: border-color var(--pc-transition-fast), background var(--pc-transition-fast);
    min-height: 140px;
}

.pc-import-shape-dropzone:hover,
.pc-import-shape-dropzone.pc-is-drag-over {
    border-color: var(--pc-color-primary);
    background: var(--pc-color-primary-light);
}

.pc-import-shape-dropzone-icon {
    width: 36px;
    height: 36px;
    color: var(--pc-color-gray-400);
    transition: color var(--pc-transition-fast);
}

.pc-import-shape-dropzone-icon svg {
    width: 100%;
    height: 100%;
    display: block;
}

.pc-import-shape-dropzone:hover .pc-import-shape-dropzone-icon,
.pc-import-shape-dropzone.pc-is-drag-over .pc-import-shape-dropzone-icon {
    color: var(--pc-color-primary);
}

.pc-import-shape-dropzone-label {
    font-size: 14px;
    font-weight: 500;
    color: var(--pc-color-gray-700);
}

.pc-import-shape-dropzone-hint {
    font-size: 13px;
    color: var(--pc-color-primary);
    cursor: pointer;
}

.pc-import-shape-dropzone-file-input {
    /* Visually hidden but still focusable. Unlike opacity:0 + inset:0
       this does NOT intercept pointer or drag events on the dropzone. */
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
    padding: 0;
}

.pc-import-shape-dropzone.pc-has-file {
    border-style: solid;
    border-color: var(--pc-color-primary);
    background: var(--pc-color-primary-light);
}

/* Error state — overrides the has-file/hover primary colouring so an invalid
   uploaded file shows a red block. */
.pc-import-shape-dropzone.pc-has-error,
.pc-import-shape-dropzone.pc-has-file.pc-has-error,
.pc-import-shape-dropzone.pc-has-error:hover {
    border-style: solid;
    border-color: rgba(220, 38, 38, 0.55);
    background: var(--pc-color-error-bg);
}

.pc-import-shape-dropzone-file-info {
    display: none;
    align-items: center;
    gap: var(--pc-space-sm);
    font-size: 13px;
    color: var(--pc-color-gray-700);
    font-weight: 500;
}

.pc-import-shape-dropzone-file-info svg {
    display: block;
}

.pc-import-shape-dropzone.pc-has-file .pc-import-shape-dropzone-file-info {
    display: flex;
}

.pc-import-shape-dropzone.pc-has-file .pc-import-shape-dropzone-icon,
.pc-import-shape-dropzone.pc-has-file .pc-import-shape-dropzone-label,
.pc-import-shape-dropzone.pc-has-file .pc-import-shape-dropzone-hint {
    display: none;
}

.pc-import-shape-dropzone-remove-file {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border: none;
    background: var(--pc-color-gray-200);
    color: var(--pc-color-gray-500);
    border-radius: 50%;
    cursor: pointer;
    font-size: 12px;
    line-height: 1;
    transition: background var(--pc-transition-fast), color var(--pc-transition-fast);
}

.pc-import-shape-dropzone-remove-file:hover {
    background: var(--pc-color-error);
    color: var(--pc-color-white);
}

/* --------------------------------------------------------------------------
   OR divider
   -------------------------------------------------------------------------- */
.pc-import-shape-divider {
    display: flex;
    align-items: center;
    gap: var(--pc-space-md);
    margin: var(--pc-space-lg) 0;
    color: var(--pc-color-gray-400);
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.pc-import-shape-divider::before,
.pc-import-shape-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--pc-color-gray-200);
}

/* --------------------------------------------------------------------------
   Geometry textarea
   -------------------------------------------------------------------------- */
/* Wrapper holds the line-number gutter + textarea as one bordered box. */
.pc-import-shape-textarea-wrap {
    display: flex;
    align-items: stretch;
    width: 100%;
    border: 2px solid var(--pc-color-gray-300);
    border-radius: var(--pc-radius-md);
    background: var(--pc-color-gray-50);
    transition: border-color var(--pc-transition-fast), box-shadow var(--pc-transition-fast);
    box-sizing: border-box;
    overflow: hidden;
}

.pc-import-shape-textarea-wrap:focus-within {
    border-color: var(--pc-color-primary);
    box-shadow: 0 0 0 3px rgba(43, 188, 192, 0.15);
    background: var(--pc-color-white);
}

/* Error state — set in lock-step with the inline error (showErrorOn/clearErrorOn).
   Overrides the focus-within primary ring so an invalid box stays red while typing. */
.pc-import-shape-textarea-wrap.pc-has-error {
    border-color: rgba(220, 38, 38, 0.55);
    background: var(--pc-color-white);
}

.pc-import-shape-textarea-wrap.pc-has-error:focus-within {
    border-color: rgba(220, 38, 38, 0.55);
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.12);
}

/* Line-number gutter — font metrics MUST match the textarea so numbers
   align row-for-row. Vertical position is driven by scroll-sync in JS. */
.pc-import-shape-gutter {
    flex: 0 0 auto;
    min-width: 2.5em;
    padding: var(--pc-space-md) 8px var(--pc-space-md) var(--pc-space-md);
    border-right: 1px solid var(--pc-color-gray-300);
    background: var(--pc-color-gray-100);
    font-family: var(--pc-font-mono);
    font-size: 13px;
    line-height: 1.6;
    color: var(--pc-color-gray-400);
    text-align: right;
    overflow: hidden;
    box-sizing: border-box;
    user-select: none;
}

.pc-import-shape-gutter-line {
    display: block;
}

.pc-import-shape-textarea {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 200px;
    padding: var(--pc-space-md);
    border: none;
    background: transparent;
    font-family: var(--pc-font-mono);
    font-size: 13px;
    line-height: 1.6;
    color: var(--pc-color-gray-900);
    resize: vertical;
    white-space: pre;
    overflow: auto;
    box-sizing: border-box;
}

.pc-import-shape-textarea:focus {
    outline: none;
}

.pc-import-shape-textarea::placeholder {
    color: var(--pc-color-gray-400);
    font-family: var(--pc-font-mono);
    font-size: 12px;
}

/* --------------------------------------------------------------------------
   Helper text (small italic note below an input)
   -------------------------------------------------------------------------- */
.pc-import-shape-helper-text {
    margin: var(--pc-space-md) 0 0;
    font-size: 13px;
    font-style: italic;
    color: var(--pc-color-gray-400);
    line-height: 1.5;
}

/* --------------------------------------------------------------------------
   Inline error (per tab — sits below the textarea / dropzone)
   -------------------------------------------------------------------------- */
.pc-import-shape-inline-error {
    display: none;
    align-items: flex-start;
    gap: var(--pc-space-sm);
    margin-top: var(--pc-space-md);
    padding: var(--pc-space-sm) var(--pc-space-md);
    background: var(--pc-color-error-bg);
    border: 1px solid rgba(220, 38, 38, 0.15);
    border-radius: var(--pc-radius-sm);
    font-size: 13px;
    line-height: 1.5;
    color: var(--pc-color-error);
}

.pc-import-shape-inline-error.pc-is-visible {
    display: flex;
}

.pc-import-shape-inline-error-icon {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    margin-top: 2px;
}

.pc-import-shape-inline-error-icon svg {
    width: 100%;
    height: 100%;
    display: block;
}

.pc-import-shape-inline-error-message {
    flex: 1;
}

/* --------------------------------------------------------------------------
   KMZ extraction spinner
   -------------------------------------------------------------------------- */
.pc-import-shape-spinner {
    display: none;
    align-items: center;
    justify-content: center;
    gap: var(--pc-space-sm);
    padding: var(--pc-space-md);
    color: var(--pc-color-gray-500);
    font-size: 13px;
}

.pc-import-shape-spinner.pc-is-visible {
    display: flex;
}

.pc-import-shape-spinner-ring {
    width: 20px;
    height: 20px;
    border: 2px solid var(--pc-color-gray-200);
    border-top-color: var(--pc-color-primary);
    border-radius: 50%;
    animation: pc-import-shape-spin 0.7s linear infinite;
}

@keyframes pc-import-shape-spin {
    to { transform: rotate(360deg); }
}

/* --------------------------------------------------------------------------
   Loading overlay (blocking — shown via showLoading()/hideLoading())
   Covers the whole modal card (which is position: relative) so the header
   and close button are obscured while an async operation is in flight.
   -------------------------------------------------------------------------- */
.pc-import-shape-loading {
    position: absolute;
    inset: 0;
    z-index: 5;
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--pc-space-md);
    background: rgba(17, 24, 39, 0.55);
    border-radius: var(--pc-radius-lg);
    color: var(--pc-color-white);
    font-size: 14px;
    font-weight: 500;
}

.pc-import-shape-loading.pc-is-visible {
    display: flex;
}

.pc-import-shape-loading-spinner {
    width: 36px;
    height: 36px;
    border: 3px solid rgba(255, 255, 255, 0.25);
    border-top-color: var(--pc-color-primary);
    border-radius: 50%;
    animation: pc-import-shape-spin 0.7s linear infinite;
}

/* --------------------------------------------------------------------------
   Projection selector (WKT tab)
   -------------------------------------------------------------------------- */
.pc-import-shape-projection-row {
    display: flex;
    align-items: center;
    gap: var(--pc-space-md);
    margin-bottom: var(--pc-space-md);
}

.pc-import-shape-projection-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--pc-color-gray-700);
}

.pc-import-shape-projection-select {
    flex: 1;
    padding: 8px 12px;
    border: 2px solid var(--pc-color-gray-300);
    border-radius: var(--pc-radius-md);
    background: var(--pc-color-gray-50);
    font-family: var(--pc-font-family);
    font-size: 13px;
    color: var(--pc-color-gray-900);
    outline: none;
    cursor: pointer;
    transition: border-color var(--pc-transition-fast), box-shadow var(--pc-transition-fast);
}

.pc-import-shape-projection-select:focus {
    border-color: var(--pc-color-primary);
    box-shadow: 0 0 0 3px rgba(43, 188, 192, 0.15);
    background: var(--pc-color-white);
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.pc-import-shape-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--pc-space-md);
    padding: var(--pc-space-md) var(--pc-space-lg) var(--pc-space-lg);
    border-top: 1px solid var(--pc-color-gray-200);
}

.pc-import-shape-btn {
    display: inline-flex;
    align-items: center;
    gap: var(--pc-space-sm);
    padding: 10px 24px;
    font-family: var(--pc-font-family);
    font-size: 14px;
    font-weight: 600;
    border-radius: var(--pc-radius-md);
    cursor: pointer;
    transition: background var(--pc-transition-fast), border-color var(--pc-transition-fast), color var(--pc-transition-fast), box-shadow var(--pc-transition-fast), transform var(--pc-transition-fast);
    user-select: none;
    border: 2px solid transparent;
    line-height: 1.2;
}

.pc-import-shape-btn:active {
    transform: scale(0.97);
}

.pc-import-shape-btn--secondary {
    background: var(--pc-color-white);
    color: var(--pc-color-gray-700);
    border-color: var(--pc-color-gray-300);
}

.pc-import-shape-btn--secondary:hover {
    background: var(--pc-color-gray-50);
    border-color: var(--pc-color-gray-400);
}

.pc-import-shape-btn--primary {
    background: var(--pc-color-primary);
    color: var(--pc-color-white);
    border-color: var(--pc-color-primary);
}

.pc-import-shape-btn--primary:hover {
    background: var(--pc-color-primary-hover);
    border-color: var(--pc-color-primary-hover);
    box-shadow: 0 4px 12px rgba(43, 188, 192, 0.3);
}

.pc-import-shape-btn--primary:disabled {
    background: var(--pc-color-primary-disabled);
    border-color: transparent;
    cursor: not-allowed;
    box-shadow: none;
    transform: none;
}

/* --------------------------------------------------------------------------
   Discard confirmation dialog (replaces window.confirm)
   -------------------------------------------------------------------------- */
.pc-import-shape-discard-overlay {
    position: fixed;
    inset: 0;
    z-index: 10100;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.25);
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--pc-transition-fast), visibility var(--pc-transition-fast);
    font-family: var(--pc-font-family);
    color: var(--pc-color-gray-900);
}

.pc-import-shape-discard-overlay.pc-is-open {
    opacity: 1;
    visibility: visible;
}

.pc-import-shape-discard-dialog {
    width: 380px;
    max-width: calc(100vw - 40px);
    background: var(--pc-color-white);
    border-radius: var(--pc-radius-md);
    box-shadow: var(--pc-shadow-modal);
    padding: var(--pc-space-lg);
}

.pc-import-shape-discard-title {
    margin: 0 0 var(--pc-space-sm);
    font-size: 16px;
    font-weight: 700;
    color: var(--pc-color-gray-900);
}

.pc-import-shape-discard-message {
    margin: 0 0 var(--pc-space-lg);
    font-size: 14px;
    color: var(--pc-color-gray-500);
    line-height: 1.55;
}

.pc-import-shape-discard-actions {
    display: flex;
    justify-content: flex-end;
    gap: var(--pc-space-sm);
}

/* --------------------------------------------------------------------------
   Toolbar button (icon-above-text — replaces the default 26x26 easy-button).
   Uses Font Awesome 4.7 fa-upload for the icon and an HTML label so the
   caption is translatable.
   -------------------------------------------------------------------------- */
.pc-import-shape-toolbar {
    border-radius: 4px;
}

/* Higher specificity than Leaflet's default `.leaflet-bar a` (26x26) rules.
   Hover mirrors `.leaflet-draw-draw-circle` (and Leaflet's other bar buttons):
   background flips to #f4f4f4, foreground colour stays put.
   Size kept consistent with the 48px tool-button rule introduced by OC-1537. */
.pc-import-shape-toolbar a.pc-import-shape-toolbar-btn,
.leaflet-bar a.pc-import-shape-toolbar-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 48px;
    height: 48px;
    padding: 4px 2px;
    gap: 3px;
    background-color: #fff;
    color: #464646;
    text-decoration: none;
    text-align: center;
    line-height: 1;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 150ms ease, box-shadow 150ms ease;
}

.pc-import-shape-toolbar a.pc-import-shape-toolbar-btn:hover,
.pc-import-shape-toolbar a.pc-import-shape-toolbar-btn:focus {
    background-color: #f4f4f4;
    outline: none;
}

.pc-import-shape-toolbar a.pc-import-shape-toolbar-btn:focus-visible {
    box-shadow: 0 0 0 2px rgba(43, 188, 192, 0.4);
}

.pc-import-shape-toolbar-icon {
    font-size: 16px;
    line-height: 1;
}

.pc-import-shape-toolbar-label {
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    line-height: 1;
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 600px) {
    .pc-import-shape-modal {
        width: 100%;
        max-width: 100vw;
        max-height: 100vh;
        border-radius: 0;
    }

    .pc-import-shape-tabs {
        padding: 0 var(--pc-space-md);
    }

    .pc-import-shape-tab {
        padding: var(--pc-space-sm) var(--pc-space-md) var(--pc-space-md);
        font-size: 13px;
    }

    .pc-import-shape-panels {
        padding: var(--pc-space-md);
    }

    .pc-import-shape-header,
    .pc-import-shape-footer {
        padding-left: var(--pc-space-md);
        padding-right: var(--pc-space-md);
    }
}

@charset "UTF-8";
.leaflet-container.leaflet-touch .leaflet-bar.easy-button-container .easy-button-button > span {
  display: flex;
  justify-content: center;
  align-items: center;
}
.leaflet-container.leaflet-touch .leaflet-bar.easy-button-container #wmsValidator .leaflet-draw-actions li a {
  width: auto !important;
}
.leaflet-container.leaflet-touch .leaflet-control-layers {
  padding: 0;
}
.leaflet-container.leaflet-touch .leaflet-control-layers .leaflet-control-layers-list label {
  cursor: pointer;
}
.leaflet-container.leaflet-touch .leaflet-control-layers .leaflet-control-layers-list label input {
  cursor: pointer;
  margin-left: 0;
}
.leaflet-container.leaflet-touch .leaflet-control-layers .leaflet-control-layers-list label span {
  margin-right: 2px;
}
.leaflet-container.leaflet-touch .leaflet-control-layers .leaflet-control-layers-list .leaflet-control-layers-separator {
  margin: 10px -6px;
  cursor: default;
}
.leaflet-container.leaflet-touch .leaflet-draw-draw-circlemarker {
  background-image: url(../../LeafletComponent/custom/css/Content/cssfiles/images/spritesheet.svg) !important;
  background-size: 25em;
  background-position-x: -270px;
  background-position-y: -2.1px;
}
.leaflet-container.leaflet-mobile.leaflet-touch {
  /* OC-1537: per-tool sprite scaling moved to the unified 48px
   * rule block at the bottom of this file. Mobile no longer
   * needs the up-scaled 47em sprite — buttons render at 48px with
   * native sprite size + label across all breakpoints. */
}
.leaflet-container.leaflet-mobile.leaflet-touch .leaflet-bar a {
  width: 48px; /* OC-1537: 44 -> 48 */
  height: 48px;
}
.leaflet-container.leaflet-mobile.leaflet-touch .leaflet-bar.easy-button-container .easy-button-button {
  height: 48px; /* OC-1537: 44 -> 48 */
  width: 48px;
  font-size: 21px;
  color: #464646;
}
.leaflet-container.leaflet-mobile.leaflet-touch .leaflet-bar.easy-button-container #wmsValidator .search-input {
  padding: 20px 8px !important;
}
.leaflet-container.leaflet-mobile.leaflet-touch .leaflet-bar.easy-button-container #wmsValidator .leaflet-draw-actions li a {
  height: 30px;
}
.leaflet-container.leaflet-mobile.leaflet-touch .leaflet-bar.easy-button-container #wmsValidator .leaflet-draw-actions li a:hover {
  color: #fff;
}
.leaflet-container.leaflet-mobile.leaflet-touch .leaflet-bar.leaflet-ruler {
  /* OC-1537: sizing for ruler is set in the unified block at bottom */
}
.leaflet-container.leaflet-mobile.leaflet-touch .leaflet-control-zoomslider a {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 45px;
  color: #464646;
}
.leaflet-container.leaflet-mobile.leaflet-touch .leaflet-draw-actions a {
  padding: 7px 10px;
}
.leaflet-container.leaflet-mobile.leaflet-touch .leaflet-control-layers .leaflet-control-layers-list {
  padding: 14px 20px;
}
.leaflet-container.leaflet-mobile.leaflet-touch .leaflet-control-layers .leaflet-control-layers-list .leaflet-control-layers-separator {
  margin-top: 10px;
  margin-bottom: 10px;
}
.leaflet-container.leaflet-mobile.leaflet-touch .leaflet-control-layers .leaflet-control-layers-list label {
  padding: 10px 0;
}
.leaflet-container.leaflet-mobile.leaflet-touch .leaflet-right .leaflet-draw-actions {
  right: 50px; /* OC-1537: 46 -> 50 to clear 48px button */
  left: auto !important;
}
.leaflet-container.leaflet-mobile.leaflet-touch .leaflet-right .easy-button-container #wmsValidator .leaflet-draw-actions {
  left: -171px !important;
}
.leaflet-container.leaflet-mobile.leaflet-touch .leaflet-left .leaflet-draw-actions {
  left: 50px; /* OC-1537: 46 -> 50 to clear 48px button */
}
.leaflet-container.leaflet-mobile.leaflet-touch .leaflet-left .easy-button-container #wmsValidator .leaflet-draw-actions {
  left: 170px !important;
}
.leaflet-container.leaflet-mobile.leaflet-touch.leaflet-draw-actions-top-centered .leaflet-draw-actions,
.leaflet-container.leaflet-mobile.leaflet-touch.leaflet-draw-actions-top-centered .leaflet-left .easy-button-container #wmsValidator .leaflet-draw-actions {
  position: fixed !important;
  width: 100% !important;
  text-align: center;
  justify-content: center;
  left: 0 !important;
  top: 10px !important;
}
.leaflet-container.leaflet-mobile.leaflet-touch.leaflet-draw-actions-top-centered .leaflet-draw-actions.pin-tool-sub-actions > li > a,
.leaflet-container.leaflet-mobile.leaflet-touch.leaflet-draw-actions-top-centered .leaflet-left .easy-button-container #wmsValidator .leaflet-draw-actions.pin-tool-sub-actions > li > a {
  height: 30px;
}
.leaflet-container.leaflet-mobile.leaflet-touch.leaflet-draw-actions-top-centered .leaflet-right .easy-button-container #wmsValidator .leaflet-draw-actions {
  position: absolute !important;
  left: -147px !important;
  top: -1px !important;
}
.leaflet-container.leaflet-mobile.leaflet-touch.leaflet-draw-actions-top-centered :not(.leaflet-right) .easy-button-container #wmsValidator .leaflet-draw-actions li:last-child a {
  border-radius: 0 4px 4px 0;
}
.leaflet-container.leaflet-mobile.leaflet-touch.leaflet-draw-actions-top-centered .leaflet-left .leaflet-draw-actions li:first-child a {
  border-radius: 4px 0 0 4px;
}
.leaflet-container.leaflet-mobile.leaflet-touch.leaflet-draw-actions-top-centered .leaflet-right .leaflet-draw-actions li:last-child a {
  border-radius: 0 4px 4px 0;
}
.leaflet-container.leaflet-mobile.leaflet-touch.leaflet-draw-actions-top-centered .leaflet-left .leaflet-draw-actions li:only-child a,
.leaflet-container.leaflet-mobile.leaflet-touch.leaflet-draw-actions-top-centered .leaflet-right .leaflet-draw-actions li:only-child a {
  border-radius: 4px;
}
.leaflet-container:not(.leaflet-mobile).leaflet-touch {
  /* OC-1537: layers toggle sized in the unified 48px block at the
   * bottom of this file — pre-existing 30x30 desktop override removed. */
}
.leaflet-container:not(.leaflet-mobile).leaflet-touch .leaflet-control-layers .leaflet-control-layers-list {
  padding: 10px;
}
.leaflet-container:not(.leaflet-mobile).leaflet-touch .leaflet-bar.easy-button-container #wmsValidator .search-input {
  padding: 13px 6px !important;
}
.leaflet-container:not(.leaflet-mobile).leaflet-touch .leaflet-bar.easy-button-container #wmsValidator .leaflet-draw-actions {
  left: 170px !important;
}
.leaflet-container:not(.leaflet-mobile).leaflet-touch .leaflet-bar.easy-button-container #wmsValidator .leaflet-draw-actions li a:hover {
  color: #fff;
}
.leaflet-container:not(.leaflet-mobile).leaflet-touch .leaflet-right .leaflet-draw-actions {
  left: auto !important;
}
.leaflet-container:not(.leaflet-mobile).leaflet-touch .leaflet-right .easy-button-container #wmsValidator .leaflet-draw-actions {
  left: -126px !important;
}
.leaflet-container:not(.leaflet-mobile).leaflet-touch .leaflet-left .leaflet-draw-actions {
  left: 50px;
}
.leaflet-container > .leaflet-control-container .leaflet-right .leaflet-bar.easy-button-container > ul.pin-tool-sub-actions > li > a {
  border-radius: 0;
}
.leaflet-container > .leaflet-control-container .leaflet-right .leaflet-bar.easy-button-container > ul.pin-tool-sub-actions > li:first-child > a {
  border-radius: 4px 0 0 4px;
}
.leaflet-container > .leaflet-control-container .leaflet-bar.easy-button-container > .easy-button-button .state-state-1 {
  font-size: 18px;
}
.leaflet-container > .leaflet-control-container .leaflet-bar.easy-button-container > .easy-button-button .state-state-1.state-1-active {
  display: flex;
  color: #464646;
}
.leaflet-container > .leaflet-control-container .leaflet-bar.easy-button-container > .easy-button-button .state-state-1.state-2-active {
  display: none;
}
.leaflet-container > .leaflet-control-container .leaflet-bar.easy-button-container > .easy-button-button .state-state-2 {
  font-size: 18px;
}
.leaflet-container > .leaflet-control-container .leaflet-bar.easy-button-container > .easy-button-button .state-state-2.state-1-active {
  display: none;
}
.leaflet-container > .leaflet-control-container .leaflet-bar.easy-button-container > .easy-button-button .state-state-2.state-2-active {
  display: flex;
  color: #0082bd;
}
.leaflet-container > .leaflet-control-container .leaflet-bar.easy-button-container > ul.pin-tool-sub-actions {
  display: block;
  /**/
}
.leaflet-container > .leaflet-control-container .leaflet-bar.easy-button-container > ul.pin-tool-sub-actions > li > a {
  border-radius: 0;
  color: #fff;
  width: fit-content;
}
.leaflet-container > .leaflet-control-container .leaflet-bar.easy-button-container > ul.pin-tool-sub-actions > li > a:last-child {
  color: #fff;
}
.leaflet-container > .leaflet-control-container .leaflet-bar.easy-button-container > ul.pin-tool-sub-actions > li > a.active {
  background-color: #6e6e6e !important;
}
.leaflet-container > .leaflet-control-container .leaflet-bar.easy-button-container > ul.pin-tool-sub-actions > li:last-child {
  margin-left: -4px;
}
.leaflet-container > .leaflet-control-container .leaflet-bar.easy-button-container > ul.pin-tool-sub-actions > li:last-child > a {
  border-radius: 0 4px 4px 0;
}
.leaflet-container .pin-tool--icon {
  font-size: 28px;
}
.leaflet-container .pin-tool--icon > i {
  transform: translate3d(-3px, -28px, 0px);
  font-size: 33px;
}
.leaflet-container .pin-tool--icon > i.icon-highlight {
  text-shadow: 0 0 3px #fff, 0 0 3px #fff, 0 0 12px #fff, 0 0 0px #f6f6f6, 0 0 0px #ffffff;
}
.leaflet-container .custom-marker-cluster,
.leaflet-container .custom-marker-cluster > div {
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.leaflet-container .custom-marker-cluster {
  background: rgba(253, 156, 115, 0.6);
  width: 40px !important;
  height: 40px !important;
  margin-left: -20px !important;
  margin-top: -20px !important;
}
.leaflet-container .custom-marker-cluster > div {
  background: rgba(241, 128, 23, 0.6);
  width: 30px !important;
  height: 30px !important;
}
.leaflet-container .custom-marker-cluster > div > span {
  color: #333;
}

/* OC-1528 line buffer tool — custom icon: a line with end nodes inside a dashed buffer capsule */
.leaflet-draw-toolbar .leaflet-draw-edit-linebuffer {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='7' width='18' height='10' rx='5' ry='5' fill='none' stroke='%23464646' stroke-width='1.4' stroke-dasharray='2 2'/%3E%3Cline x1='7' y1='12' x2='17' y2='12' stroke='%23464646' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='7' cy='12' r='1.7' fill='%23464646'/%3E%3Ccircle cx='17' cy='12' r='1.7' fill='%23464646'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px 20px;
}

.leaflet-draw-toolbar .leaflet-draw-edit-linebuffer.leaflet-disabled {
  opacity: 0.45;
}

.leaflet-line-buffer-active,
.leaflet-line-buffer-active .leaflet-interactive {
  cursor: pointer;
}

.pc-line-buffer-hover {
  filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.95));
}

.pc-line-buffer-slider {
  padding: 3px 8px;
  min-width: 180px;
  background: #fff;
  font: 12px/1.2 "Helvetica Neue", Arial, sans-serif;
  color: #333;
}

/* Sit just to the left of the draw/edit toolbar in the top-right corner. */
.leaflet-top.leaflet-right .pc-line-buffer-slider {
  position: absolute;
  top: 0;
  right: 58px;
  margin-right: 0;
}

.pc-line-buffer-row {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 22px; /* fixed so the container does not resize between view and edit modes */
}

.pc-line-buffer-slider-input {
  flex: 1 1 auto;
  height: 16px;
  margin: 0;
  cursor: pointer;
  accent-color: #6b6b6b;
}

.pc-line-buffer-value {
  width: 64px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  white-space: nowrap;
}

.pc-line-buffer-value-num {
  font-size: 13px;
  font-weight: 600;
  color: #333;
  cursor: text;
  border-bottom: 1px dotted transparent;
}

.pc-line-buffer-value-num:hover {
  border-bottom-color: #b0b0b0;
}

.pc-line-buffer-value-unit {
  margin-left: 3px;
  color: #6b6b6b;
}

.pc-line-buffer-slider-number {
  width: 52px;
  height: 20px;
  box-sizing: border-box;
  font: inherit;
  color: #333;
  padding: 1px 4px;
  border: 1px solid #ccc;
  border-radius: 3px;
  accent-color: #6b6b6b;
}

.pc-line-buffer-slider-number:focus {
  outline: none;
  border-color: #888;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
}

.pc-line-buffer-edit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto !important;
  height: auto !important;
  padding: 1px !important;
  margin-left: 6px;
  border-radius: 3px;
  color: #9aa0a6;
  cursor: pointer;
  line-height: 0;
  align-self: center;
}

.pc-line-buffer-edit svg {
  display: block;
}

.pc-line-buffer-edit:hover {
  color: #464646;
  background: rgba(0, 0, 0, 0.06);
}

/* ============================================================================
 * OC-1537 — Map tool button enhancements
 *
 * All map tool buttons (RULER, PIN, draw shapes incl. LINE/SHAPE/CIRCLE/etc.,
 * EDIT, DELETE, BUFFER, LAYERS, IMPORT) render at 48px with a Font Awesome
 * icon and a visible English label beneath it. Functional behaviour and
 * conditional rendering (e.g. the LINE button only appears when
 * DrawingToolCanDrawPolyLine is on) remain unchanged.
 *
 * Selectors are intentionally specific (.leaflet-container .leaflet-bar ...)
 * so they win against leaflet.css / leaflet.draw.css defaults and the mobile
 * touch overrides earlier in this file without resorting to !important on
 * positioning.
 * ========================================================================== */
/* Font Awesome icon node injected by Toolbar.js / leaflet-ruler.js. */
.leaflet-tool-icon {
  position: absolute;
  top: 9px;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 18px;
  line-height: 1;
  color: #464646;
  pointer-events: none;
}

.leaflet-tool-label {
  position: absolute;
  bottom: 4px;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 8px;
  font-weight: 700;
  font-family: "Helvetica Neue", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1;
  color: #464646;
  pointer-events: none;
  user-select: none;
}

.leaflet-container .leaflet-bar a.leaflet-draw-draw-polyline .leaflet-tool-icon {
  font-size: 14px;
}

/* 48×48 footprint for every draw / edit toolbar button across desktop, tablet,
 * and mobile. The sprite background-image inherited from leaflet.draw.css is
 * suppressed because the icon is now a Font Awesome <i> element. */
.leaflet-container .leaflet-bar a.leaflet-draw-draw-polyline,
.leaflet-container .leaflet-bar a.leaflet-draw-draw-polygon,
.leaflet-container .leaflet-bar a.leaflet-draw-draw-rectangle,
.leaflet-container .leaflet-bar a.leaflet-draw-draw-circle,
.leaflet-container .leaflet-bar a.leaflet-draw-draw-marker,
.leaflet-container .leaflet-bar a.leaflet-draw-draw-circlemarker,
.leaflet-container .leaflet-bar a.leaflet-draw-draw-polygonlasso,
.leaflet-container .leaflet-bar a.leaflet-draw-draw-rectanglemarquee,
.leaflet-container .leaflet-bar a.leaflet-draw-edit-edit,
.leaflet-container .leaflet-bar a.leaflet-draw-edit-remove,
.leaflet-container .leaflet-bar a.leaflet-draw-edit-linebuffer {
  width: 48px;
  height: 48px;
  background-image: none;
  position: relative;
  line-height: 1;
}

/* Line-buffer is the one tool without an FA equivalent — keep its inline-SVG
 * icon defined earlier (OC-1528), and just shift it up to leave room for the
 * label. */
.leaflet-container .leaflet-bar a.leaflet-draw-edit-linebuffer {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='7' width='18' height='10' rx='5' ry='5' fill='none' stroke='%23464646' stroke-width='1.4' stroke-dasharray='2 2'/%3E%3Cline x1='7' y1='12' x2='17' y2='12' stroke='%23464646' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='7' cy='12' r='1.7' fill='%23464646'/%3E%3Ccircle cx='17' cy='12' r='1.7' fill='%23464646'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 22px 22px;
  background-position: center 8px;
}

/* Standalone ruler control — FA icon injected by leaflet-ruler.js, suppress
 * the legacy PNG. */
.leaflet-container .leaflet-bar.leaflet-ruler {
  width: 48px;
  height: 48px;
  background-image: none;
  position: relative;
}

.leaflet-container .leaflet-bar.leaflet-ruler.leaflet-ruler-clicked {
  width: 48px;
  height: 48px;
  background-image: none;
  background-color: #e6f4f5;
}

.leaflet-container .leaflet-bar.leaflet-ruler.leaflet-ruler-clicked .leaflet-tool-icon {
  color: #117a8b;
}

/* Pin tool — easyButton renders the icon inside child <span class="button-state">
 * elements (already FA-driven via setting.GraphicalSettings.PinToolbarIcon).
 * Reposition them to the top so the label fits below. */
.leaflet-container .leaflet-bar.easy-button-container > .easy-button-button#pinIconBtn {
  width: 48px;
  height: 48px;
  position: relative;
  padding-bottom: 14px;
  box-sizing: border-box;
}

.leaflet-container #pinIconBtn > .button-state {
  height: 30px;
  line-height: 1;
}

/* Layers control — the .leaflet-tool-icon and .leaflet-tool-label children are
 * injected by leaflet-main-control.js after the control mounts, matching the
 * RULER / PIN pattern. The built-in layers.png sprite is suppressed.
 * Selector wins against `.leaflet-touch .leaflet-control-layers-toggle` (0,2,0)
 * from lib/leaflet/leaflet.css. */
.leaflet-container .leaflet-control-layers .leaflet-control-layers-toggle {
  width: 48px;
  height: 48px;
  background-image: none;
  position: relative;
}

.leaflet-container .leaflet-control-layers-expanded .leaflet-control-layers-toggle {
  display: none;
}

/* The action buttons (Save / Cancel / Undo / Finish / Clear-All) shown inside
 * .leaflet-draw-actions next to the toolbar carry inline text and must keep
 * their auto width — guard against the rules above bleeding into them. */
.leaflet-container .leaflet-draw-actions a {
  width: auto;
  height: 30px;
  background-image: none;
  line-height: 30px;
}

/* Action menu must clear the wider 48px button. leaflet.draw.css defaults to
 * 26px (32px on touch); push to 50px so the menu sits beside the button. */
.leaflet-container .leaflet-left .leaflet-draw-actions {
  left: 50px;
}

.leaflet-container .leaflet-right .leaflet-draw-actions {
  right: 50px;
  left: auto;
}

/* Disabled (greyed-out) icons for the edit/remove buttons when there's
 * nothing to act on. */
.leaflet-container .leaflet-bar a.leaflet-disabled .leaflet-tool-icon,
.leaflet-container .leaflet-bar a.leaflet-disabled .leaflet-tool-label {
  opacity: 0.45;
}

/* Zoom-slider +/- buttons widened to 48px so the control column matches the
 * draw/edit/ruler/pin tool footprint. Height stays as-is (no label needed). */
.leaflet-container .leaflet-control-zoomslider a,
.leaflet-container .leaflet-control-zoomslider a:hover,
.leaflet-container .leaflet-touch .leaflet-control-zoomslider a,
.leaflet-container .leaflet-touch .leaflet-control-zoomslider a:hover {
  width: 48px;
}

.leaflet-container .leaflet-control-zoomslider-body {
  background-position: center 0;
}
