
/* "will-change: transform;" will fix disappearing tools on Safari*/
.logistrik-leaflet-vertical-tool-button-group,
.logistrik-leaflet-horizontal-tool-button-group,
.leaflet-control-container .leaflet-top,
.leaflet-control-container .leaflet-bottom {
	will-change: transform;
}


/* Map tools */
.logistrik-leaflet-top-left {
	top: 0;
	left: 0;
	position: absolute;
}
.logistrik-leaflet-top-left .logistrik-leaflet-vertical-tool-button-group,
.logistrik-leaflet-top-left .logistrik-leaflet-horizontal-tool-button-group {
	margin-top: 10px;
	margin-left: 10px;
}
.logistrik-leaflet-bottom-left {
	bottom: 18px;
	left: 0;
	position: absolute;
}
.logistrik-leaflet-bottom-left .logistrik-leaflet-vertical-tool-button-group,
.logistrik-leaflet-bottom-left .logistrik-leaflet-horizontal-tool-button-group {
	margin-bottom: 10px;
	margin-left: 10px;
}

.logistrik-leaflet-bottom-middle {
	bottom: 18px;
	position: absolute;
	transform: translate(-50%, 0);
	will-change: transform;
	left: 50%;
	z-index: 1000;
}

.logistrik-leaflet-bottom-middle .logistrik-leaflet-vertical-tool-button-group,
.logistrik-leaflet-bottom-middle .logistrik-leaflet-horizontal-tool-button-group {
	margin-bottom: 10px;
}

.logistrik-leaflet-bottom-right {
	bottom: 18px;
	right: 0;
	position: absolute;
	display: flex;
	flex-direction: row;
}
.logistrik-leaflet-bottom-right .logistrik-leaflet-vertical-tool-button-group,
.logistrik-leaflet-bottom-right .logistrik-leaflet-horizontal-tool-button-group {
	margin-bottom: 10px;
	margin-right: 10px;
}
.logistrik-leaflet-top-right {
	top: 0;
	right: 0;
	position: absolute;
}
.logistrik-leaflet-top-right .logistrik-leaflet-vertical-tool-button-group,
.logistrik-leaflet-top-right .logistrik-leaflet-horizontal-tool-button-group {
	margin-top: 10px;
	margin-right: 10px;
}
.logistrik-leaflet-vertical-tool-button-group,
.logistrik-leaflet-horizontal-tool-button-group {
	border-radius: 16px;
	z-index: 1000;
	position: relative;
	margin: 15px;
}
.logistrik-leaflet-horizontal-tool-button-group {
	display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox; /* TWEENER - IE 10 */
	display: -webkit-flex; /* NEW - Chrome */
	display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
	-ms-flex-direction: row;
	-moz-flex-direction: row;
	-webkit-flex-direction: row;
	flex-direction: row;
}
.logistrik-leaflet-vertical-tool-button-group>*>.logistrik-leaflet-tool-button,
.logistrik-leaflet-horizontal-tool-button-group>*>.logistrik-leaflet-tool-button {
	display: block;
	width: 32px;
	height: 32px;
	line-height: 32px;
	font-size: 24px;
}

.logistrik-leaflet-horizontal-tool-button-group>*>.logistrik-leaflet-tool-button.logistrik-leaflet-tool-text-button,
.logistrik-leaflet-horizontal-tool-button-group>*>.logistrik-leaflet-tool-button.logistrik-leaflet-tool-text-button {
	width: auto;
	font-size: 16px;
	padding: 0 10px;
}

.logistrik-leaflet-vertical-tool-button-group>*>.logistrik-leaflet-tool-button {
	border-bottom: 1px solid #ccc;
	padding-top: 3px;
	padding-bottom: 3px;
}
.logistrik-leaflet-horizontal-tool-button-group>*>.logistrik-leaflet-tool-button {
	border-right: 1px solid #ccc;
	padding-left: 3px;
	padding-right: 3px;
}
.logistrik-leaflet-vertical-tool-button-group>*:first-child>.logistrik-leaflet-tool-button {
	border-top-left-radius: 16px;
	border-top-right-radius: 16px;
	padding-top: 0;
}
.logistrik-leaflet-vertical-tool-button-group>*:last-child>.logistrik-leaflet-tool-button {
	border-bottom-left-radius: 16px;
	border-bottom-right-radius: 16px;
	padding-bottom: 0;
	border-bottom: none;
}
.logistrik-leaflet-horizontal-tool-button-group>*:first-child>.logistrik-leaflet-tool-button {
	border-top-left-radius: 16px;
	border-bottom-left-radius: 16px;
	padding-left: 0;
}

.logistrik-leaflet-horizontal-tool-button-group>*:first-child>.logistrik-leaflet-tool-button.logistrik-leaflet-tool-text-button {
	padding-left: 15px;
}

.logistrik-leaflet-horizontal-tool-button-group>*:last-child>.logistrik-leaflet-tool-button {
	border-top-right-radius: 16px;
	border-bottom-right-radius: 16px;
	padding-right: 0;
	border-right: none;
}

.logistrik-leaflet-horizontal-tool-button-group>*:last-child>.logistrik-leaflet-tool-button.logistrik-leaflet-tool-text-button {
	padding-right: 15px;
}

.logistrik-leaflet-tool-form,
.logistrik-leaflet-tool-form-full-screen {
	z-index: 1000;
	position: absolute;
	top: 50%;
	transform: translate(0, -50%);
	left: 44px;
	background-color: #ffffff;
	border-radius: 6px;
	padding: 6px 2px 6px 1px;
	width: 65vw;
	max-width: 400px;
}
.logistrik-leaflet-tool-form-full-screen {
	height: 90%;
}

.logistrik-delivery-options-tool-delivery-method-filter-div {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 0.5rem 1rem;
	align-items: center;
	bottom: 28px;
	position: absolute;
	transform: translate(-50%, 0);
	will-change: transform;
	left: 50%;
	z-index: 1000;
	transition: bottom 0.5s;
	width: calc(100% - 180px);
	justify-content: center;
}

.logistrik-delivery-options-tool-delivery-method-filter-div.enable-carrier-delivery-button-middle {
	bottom: 50%;
	flex-direction: column;
	row-gap: 2rem;
}

.logistrik-delivery-options-tool-delivery-method-filter-div .logistrik-leaflet-tool-button {
	border-radius: 16px;
	padding: 8px 15px 7.5px /* In Firefox button height was 32.5px */;
	width: auto;
	font-size: 16px;
	text-wrap: nowrap;
	transition: border-radius 0.5s, font-size 0.5s;
	display: block;
}

.logistrik-delivery-options-tool-delivery-method-filter-div.enable-carrier-delivery-button-middle .logistrik-leaflet-tool-button {
	border-radius: 22px;
	font-size: 20px;
}

/* Button and form shadows */
.logistrik-leaflet-shadow,
.logistrik-leaflet-vertical-tool-button-group,
.logistrik-leaflet-horizontal-tool-button-group,
.logistrik-leaflet-tool-form,
.logistrik-leaflet-tool-form-full-screen {
	box-shadow: 0 1px 5px rgba(0,0,0,0.65);
}


/* Disable drag and select */
.logistrik-leaflet-vertical-tool-button-group,
.logistrik-leaflet-horizontal-tool-button-group {
	-webkit-touch-callout: none; /* iOS Safari */
	-webkit-user-select: none; /* Safari */
	-khtml-user-select: none; /* Konqueror HTML */
	-moz-user-select: none; /* Old versions of Firefox */
	-ms-user-select: none; /* Internet Explorer/Edge */
	user-select: none;
}
