/* MLS - Counter */
.mls-counter { padding: 0.75rem 1.5rem; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; position: relative; }
.mls-counter:after { content: ""; display: block; border-bottom: 0.0625rem hsla(var(--black), 10%) solid; position: absolute; bottom: 0; left: 0; right: 0; }
.mls-counter .icon { color: hsl(var(--siteColor1)); width: 1.5rem; height: 1.5rem; }
.mls-counter-text { margin: 0 0.5rem; }
.mls-counter-group { display: flex; align-items: center; margin-bottom: 0.5rem; }
.mls-counter-exact-toggle { position: relative; }
.mls-counter-exact-toggle.disabled .mls-counter-exact-toggle-checkbox-label,
.mls-counter-exact-toggle.disabled + .mls-counter-exact-text { cursor: default; opacity: 0.5; }
.mls-counter-exact-toggle-checkbox { transform: translateX(-100vw); position: absolute; }
.mls-counter-exact-toggle-checkbox-label { transition: all ease-in-out 0.4s; }
.mls-counter-exact-toggle-checkbox:focus + .mls-counter-exact-toggle-checkbox-label { box-shadow: var(--focusShadow); }
.mls-counter-exact-toggle-checkbox::selection,
.mls-counter-exact-toggle-checkbox:after::selection,
.mls-counter-exact-toggle-checkbox:before::selection,
.mls-counter-exact-toggle-checkbox *::selection,
.mls-counter-exact-toggle-checkbox *:after::selection,
.mls-counter-exact-toggle-checkbox *:before::selection,
.mls-counter-exact-toggle-checkbox + .mls-counter-exact-toggle-checkbox-label::selection { background: none; }
.mls-counter-exact-toggle-checkbox + .mls-counter-exact-toggle-checkbox-label { outline: 0; display: block; width: 2.5rem; height: 1.5rem; position: relative; cursor: pointer; user-select: none; margin: 0; }
.mls-counter-exact-toggle-checkbox + .mls-counter-exact-toggle-checkbox-label:after,
.mls-counter-exact-toggle-checkbox + .mls-counter-exact-toggle-checkbox-label:before { position: relative; display: block; content: ""; width: 50%; height: 100%; }
.mls-counter-exact-toggle-checkbox + .mls-counter-exact-toggle-checkbox-label:after { left: 0; }
.mls-counter-exact-toggle-checkbox + .mls-counter-exact-toggle-checkbox-label:before { display: none; }
.mls-counter-exact-toggle-checkbox:checked + .mls-counter-exact-toggle-checkbox-label:after { left: 50%; }
.mls-counter-exact-toggle-checkbox + .mls-counter-exact-toggle-checkbox-label { background: hsla(var(--siteColor3), 70%); border-radius: var(--borderRadiusCircle); padding: 0.125rem; transition: all ease-in-out 0.4s; }
.mls-counter-exact-toggle-checkbox + .mls-counter-exact-toggle-checkbox-label:after { border-radius: var(--borderRadiusCircle); background: hsl(var(--white)); transition: all 0.2s ease; }
.mls-counter-exact-toggle-checkbox:checked + .mls-counter-exact-toggle-checkbox-label { background: hsl(var(--siteColor1)); }
.mls-counter-exact-text { font-size: 0.75rem; margin: 0 0.75rem 0 0.5rem; }
.mls-counter-count-group { margin: 0 0.25rem; width: 2rem; text-align: center; display: flex; justify-content: center; align-items: center; }
.mls-counter-minus .icon,
.mls-counter-plus .icon { width: 0.75rem; height: 0.75rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); margin: 0; }
.mls-counter-minus,
.mls-counter-plus { padding: 1.25rem; position: relative; border-radius: var(--borderRadiusCircle); background-color: hsl(var(--siteColor2)); border: 0.0625rem hsla(var(--siteColor2), 0.25) solid; }
.mls-counter-minus .icon,
.mls-counter-plus .icon { color: hsl(var(--white)); }
.mls-counter-minus.disabled,
.mls-counter-plus.disabled { pointer-events: none !important; background-color: hls(var(--white)); cursor: default !important; opacity: 0.5; border: 0.0625rem hsla(var(--siteColor1), 0.25) solid; }
.mls-counter-minus.disabled:hover,
.mls-counter-plus.disabled:hover,
.mls-counter-minus.disabled:focus,
.mls-counter-plus.disabled:focus { box-shadow: none; }
.mls-counter-minus.disabled .icon,
.mls-counter-plus.disabled .icon { color: hsl(var(--bodyFontColor)); }
.mls-counter-count,
.mls-counter-and-up,
.mls-counter-any { user-select: none; }
.mls-counter-and-up { position: relative; top: -0.0625rem; left: 0.0625rem; }
@media (min-width: 1025px) {
	.mls-counter { border: none; }
	.mls-counter:after { right: 0; }
	.mls-counter-exact-toggle-checkbox + .mls-counter-exact-toggle-checkbox-label { width: 3.5rem; height: 2rem; }
}