/* Inline label (menu paths, button names). Loaded on the front end and in the editor canvas. */
.webtron-label {
  padding: 0.1em 0.5em;
  border-radius: 6px;
  background: #eef2f7;
  color: #475569;
  font-size: 0.86em;
  font-weight: 600;
  line-height: 1.5;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.webtron-label[data-variant="info"] {
  background: #e0ecff;
  color: #1d4ed8;
}
.webtron-label[data-variant="success"] {
  background: #dcfce7;
  color: #15803d;
}
.webtron-label[data-variant="warning"] {
  background: #fef3c7;
  color: #a16207;
}
.webtron-label[data-variant="danger"] {
  background: #fee2e2;
  color: #b91c1c;
}

body.dark-mode .webtron-label {
  background: #2a3342;
  color: #cbd5e1;
}
body.dark-mode .webtron-label[data-variant="info"] {
  background: rgba(59, 130, 246, 0.22);
  color: #93c5fd;
}
body.dark-mode .webtron-label[data-variant="success"] {
  background: rgba(34, 197, 94, 0.2);
  color: #86efac;
}
body.dark-mode .webtron-label[data-variant="warning"] {
  background: rgba(234, 179, 8, 0.2);
  color: #fde047;
}
body.dark-mode .webtron-label[data-variant="danger"] {
  background: rgba(239, 68, 68, 0.22);
  color: #fca5a5;
}