/**
 * @license
 * Copyright (c) 2000 - 2026 Vaadin Ltd.
 * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
 */
/* === Margin === */
.-m-xs {
  margin: calc(var(--lumo-space-xs) / -1);
}

.-m-s {
  margin: calc(var(--lumo-space-s) / -1);
}

.-m-m {
  margin: calc(var(--lumo-space-m) / -1);
}

.-m-l {
  margin: calc(var(--lumo-space-l) / -1);
}

.-m-xl {
  margin: calc(var(--lumo-space-xl) / -1);
}

.m-0 {
  margin: 0;
}

.m-xs {
  margin: var(--lumo-space-xs);
}

.m-s {
  margin: var(--lumo-space-s);
}

.m-m {
  margin: var(--lumo-space-m);
}

.m-l {
  margin: var(--lumo-space-l);
}

.m-xl {
  margin: var(--lumo-space-xl);
}

.m-auto {
  margin: auto;
}

/* === Margin (bottom) === */
.-mb-xs {
  margin-bottom: calc(var(--lumo-space-xs) / -1);
}

.-mb-s {
  margin-bottom: calc(var(--lumo-space-s) / -1);
}

.-mb-m {
  margin-bottom: calc(var(--lumo-space-m) / -1);
}

.-mb-l {
  margin-bottom: calc(var(--lumo-space-l) / -1);
}

.-mb-xl {
  margin-bottom: calc(var(--lumo-space-xl) / -1);
}

.mb-0 {
  margin-bottom: 0;
}

.mb-xs {
  margin-bottom: var(--lumo-space-xs);
}

.mb-s {
  margin-bottom: var(--lumo-space-s);
}

.mb-m {
  margin-bottom: var(--lumo-space-m);
}

.mb-l {
  margin-bottom: var(--lumo-space-l);
}

.mb-xl {
  margin-bottom: var(--lumo-space-xl);
}

.mb-auto {
  margin-bottom: auto;
}

/* === Margin (end) === */
.-me-xs {
  margin-inline-end: calc(var(--lumo-space-xs) / -1);
}

.-me-s {
  margin-inline-end: calc(var(--lumo-space-s) / -1);
}

.-me-m {
  margin-inline-end: calc(var(--lumo-space-m) / -1);
}

.-me-l {
  margin-inline-end: calc(var(--lumo-space-l) / -1);
}

.-me-xl {
  margin-inline-end: calc(var(--lumo-space-xl) / -1);
}

.me-0 {
  margin-inline-end: 0;
}

.me-xs {
  margin-inline-end: var(--lumo-space-xs);
}

.me-s {
  margin-inline-end: var(--lumo-space-s);
}

.me-m {
  margin-inline-end: var(--lumo-space-m);
}

.me-l {
  margin-inline-end: var(--lumo-space-l);
}

.me-xl {
  margin-inline-end: var(--lumo-space-xl);
}

.me-auto {
  margin-inline-end: auto;
}

/* === Margin (horizontal) === */
.-mx-xs {
  margin-inline: calc(var(--lumo-space-xs) / -1);
}

.-mx-s {
  margin-inline: calc(var(--lumo-space-s) / -1);
}

.-mx-m {
  margin-inline: calc(var(--lumo-space-m) / -1);
}

.-mx-l {
  margin-inline: calc(var(--lumo-space-l) / -1);
}

.-mx-xl {
  margin-inline: calc(var(--lumo-space-xl) / -1);
}

.mx-0 {
  margin-inline: 0;
}

.mx-xs {
  margin-inline: var(--lumo-space-xs);
}

.mx-s {
  margin-inline: var(--lumo-space-s);
}

.mx-m {
  margin-inline: var(--lumo-space-m);
}

.mx-l {
  margin-inline: var(--lumo-space-l);
}

.mx-xl {
  margin-inline: var(--lumo-space-xl);
}

.mx-auto {
  margin-inline: auto;
}

/* === Margin (left) === */
.-ml-xs {
  margin-left: calc(var(--lumo-space-xs) / -1);
}

.-ml-s {
  margin-left: calc(var(--lumo-space-s) / -1);
}

.-ml-m {
  margin-left: calc(var(--lumo-space-m) / -1);
}

.-ml-l {
  margin-left: calc(var(--lumo-space-l) / -1);
}

.-ml-xl {
  margin-left: calc(var(--lumo-space-xl) / -1);
}

.ml-0 {
  margin-left: 0;
}

.ml-xs {
  margin-left: var(--lumo-space-xs);
}

.ml-s {
  margin-left: var(--lumo-space-s);
}

.ml-m {
  margin-left: var(--lumo-space-m);
}

.ml-l {
  margin-left: var(--lumo-space-l);
}

.ml-xl {
  margin-left: var(--lumo-space-xl);
}

.ml-auto {
  margin-left: auto;
}

/* === Margin (right) === */
.-mr-xs {
  margin-right: calc(var(--lumo-space-xs) / -1);
}

.-mr-s {
  margin-right: calc(var(--lumo-space-s) / -1);
}

.-mr-m {
  margin-right: calc(var(--lumo-space-m) / -1);
}

.-mr-l {
  margin-right: calc(var(--lumo-space-l) / -1);
}

.-mr-xl {
  margin-right: calc(var(--lumo-space-xl) / -1);
}

.mr-0 {
  margin-right: 0;
}

.mr-xs {
  margin-right: var(--lumo-space-xs);
}

.mr-s {
  margin-right: var(--lumo-space-s);
}

.mr-m {
  margin-right: var(--lumo-space-m);
}

.mr-l {
  margin-right: var(--lumo-space-l);
}

.mr-xl {
  margin-right: var(--lumo-space-xl);
}

.mr-auto {
  margin-right: auto;
}

/* === Margin (start) === */
.-ms-xs {
  margin-inline-start: calc(var(--lumo-space-xs) / -1);
}

.-ms-s {
  margin-inline-start: calc(var(--lumo-space-s) / -1);
}

.-ms-m {
  margin-inline-start: calc(var(--lumo-space-m) / -1);
}

.-ms-l {
  margin-inline-start: calc(var(--lumo-space-l) / -1);
}

.-ms-xl {
  margin-inline-start: calc(var(--lumo-space-xl) / -1);
}

.ms-0 {
  margin-inline-start: 0;
}

.ms-xs {
  margin-inline-start: var(--lumo-space-xs);
}

.ms-s {
  margin-inline-start: var(--lumo-space-s);
}

.ms-m {
  margin-inline-start: var(--lumo-space-m);
}

.ms-l {
  margin-inline-start: var(--lumo-space-l);
}

.ms-xl {
  margin-inline-start: var(--lumo-space-xl);
}

.ms-auto {
  margin-inline-start: auto;
}

/* === Margin (top) === */
.-mt-xs {
  margin-top: calc(var(--lumo-space-xs) / -1);
}

.-mt-s {
  margin-top: calc(var(--lumo-space-s) / -1);
}

.-mt-m {
  margin-top: calc(var(--lumo-space-m) / -1);
}

.-mt-l {
  margin-top: calc(var(--lumo-space-l) / -1);
}

.-mt-xl {
  margin-top: calc(var(--lumo-space-xl) / -1);
}

.mt-0 {
  margin-top: 0;
}

.mt-xs {
  margin-top: var(--lumo-space-xs);
}

.mt-s {
  margin-top: var(--lumo-space-s);
}

.mt-m {
  margin-top: var(--lumo-space-m);
}

.mt-l {
  margin-top: var(--lumo-space-l);
}

.mt-xl {
  margin-top: var(--lumo-space-xl);
}

.mt-auto {
  margin-top: auto;
}

/* === Margin (vertical) === */
.-my-xs {
  margin-block: calc(var(--lumo-space-xs) / -1);
}

.-my-s {
  margin-block: calc(var(--lumo-space-s) / -1);
}

.-my-m {
  margin-block: calc(var(--lumo-space-m) / -1);
}

.-my-l {
  margin-block: calc(var(--lumo-space-l) / -1);
}

.-my-xl {
  margin-block: calc(var(--lumo-space-xl) / -1);
}

.my-0 {
  margin-block: 0;
}

.my-xs {
  margin-block: var(--lumo-space-xs);
}

.my-s {
  margin-block: var(--lumo-space-s);
}

.my-m {
  margin-block: var(--lumo-space-m);
}

.my-l {
  margin-block: var(--lumo-space-l);
}

.my-xl {
  margin-block: var(--lumo-space-xl);
}

.my-auto {
  margin-block: auto;
}

/* === Padding === */
.p-0 {
  padding: 0;
}

.p-xs {
  padding: var(--lumo-space-xs);
}

.p-s {
  padding: var(--lumo-space-s);
}

.p-m {
  padding: var(--lumo-space-m);
}

.p-l {
  padding: var(--lumo-space-l);
}

.p-xl {
  padding: var(--lumo-space-xl);
}

/* === Padding (bottom) === */
.pb-0 {
  padding-bottom: 0;
}

.pb-xs {
  padding-bottom: var(--lumo-space-xs);
}

.pb-s {
  padding-bottom: var(--lumo-space-s);
}

.pb-m {
  padding-bottom: var(--lumo-space-m);
}

.pb-l {
  padding-bottom: var(--lumo-space-l);
}

.pb-xl {
  padding-bottom: var(--lumo-space-xl);
}

/* === Padding (end) === */
.pe-0 {
  padding-inline-end: 0;
}

.pe-xs {
  padding-inline-end: var(--lumo-space-xs);
}

.pe-s {
  padding-inline-end: var(--lumo-space-s);
}

.pe-m {
  padding-inline-end: var(--lumo-space-m);
}

.pe-l {
  padding-inline-end: var(--lumo-space-l);
}

.pe-xl {
  padding-inline-end: var(--lumo-space-xl);
}

/* === Padding (horizontal) === */
.px-0 {
  padding-left: 0;
  padding-right: 0;
}

.px-xs {
  padding-left: var(--lumo-space-xs);
  padding-right: var(--lumo-space-xs);
}

.px-s {
  padding-left: var(--lumo-space-s);
  padding-right: var(--lumo-space-s);
}

.px-m {
  padding-left: var(--lumo-space-m);
  padding-right: var(--lumo-space-m);
}

.px-l {
  padding-left: var(--lumo-space-l);
  padding-right: var(--lumo-space-l);
}

.px-xl {
  padding-left: var(--lumo-space-xl);
  padding-right: var(--lumo-space-xl);
}

/* === Padding (left) === */
.pl-0 {
  padding-left: 0;
}

.pl-xs {
  padding-left: var(--lumo-space-xs);
}

.pl-s {
  padding-left: var(--lumo-space-s);
}

.pl-m {
  padding-left: var(--lumo-space-m);
}

.pl-l {
  padding-left: var(--lumo-space-l);
}

.pl-xl {
  padding-left: var(--lumo-space-xl);
}

/* === Padding (right) === */
.pr-0 {
  padding-right: 0;
}

.pr-xs {
  padding-right: var(--lumo-space-xs);
}

.pr-s {
  padding-right: var(--lumo-space-s);
}

.pr-m {
  padding-right: var(--lumo-space-m);
}

.pr-l {
  padding-right: var(--lumo-space-l);
}

.pr-xl {
  padding-right: var(--lumo-space-xl);
}

/* === Padding (start) === */
.ps-0 {
  padding-inline-start: 0;
}

.ps-xs {
  padding-inline-start: var(--lumo-space-xs);
}

.ps-s {
  padding-inline-start: var(--lumo-space-s);
}

.ps-m {
  padding-inline-start: var(--lumo-space-m);
}

.ps-l {
  padding-inline-start: var(--lumo-space-l);
}

.ps-xl {
  padding-inline-start: var(--lumo-space-xl);
}

/* === Padding (top) === */
.pt-0 {
  padding-top: 0;
}

.pt-xs {
  padding-top: var(--lumo-space-xs);
}

.pt-s {
  padding-top: var(--lumo-space-s);
}

.pt-m {
  padding-top: var(--lumo-space-m);
}

.pt-l {
  padding-top: var(--lumo-space-l);
}

.pt-xl {
  padding-top: var(--lumo-space-xl);
}

/* === Padding (vertical) === */
.py-0 {
  padding-bottom: 0;
  padding-top: 0;
}

.py-xs {
  padding-bottom: var(--lumo-space-xs);
  padding-top: var(--lumo-space-xs);
}

.py-s {
  padding-bottom: var(--lumo-space-s);
  padding-top: var(--lumo-space-s);
}

.py-m {
  padding-bottom: var(--lumo-space-m);
  padding-top: var(--lumo-space-m);
}

.py-l {
  padding-bottom: var(--lumo-space-l);
  padding-top: var(--lumo-space-l);
}

.py-xl {
  padding-bottom: var(--lumo-space-xl);
  padding-top: var(--lumo-space-xl);
}