.ob-svg-icon {
  --ob-icon-scale: 1.14em;
  display: inline-grid;
  width: 1em;
  height: 1em;
  min-width: 1em;
  place-items: center;
  color: currentColor;
  font-size: inherit;
  font-style: normal;
  line-height: 1;
  vertical-align: -0.125em;
}

.ob-svg-icon::before {
  content: none !important;
}

.ob-svg-icon[hidden] {
  display: none !important;
}

.ob-svg-icon svg {
  display: block;
  width: var(--ob-icon-scale);
  height: var(--ob-icon-scale);
  margin: auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  overflow: visible;
}

button .ob-svg-icon,
[role="button"] .ob-svg-icon {
  flex: 0 0 auto;
  align-self: center;
  justify-self: center;
  margin: auto;
  vertical-align: 0;
}

.ob-svg-icon[data-icon-fill="true"] svg {
  fill: currentColor;
  stroke: none;
}

.ob-svg-icon[data-icon-stroke="false"] svg {
  stroke: none;
}

.ob-svg-icon[data-ob-icon="spinner"],
.ob-svg-icon.fa-spinner,
.ob-svg-icon.fa-spin {
  --ob-icon-scale: 1em;
  display: inline-grid;
  width: 1em;
  height: 1em;
  min-width: 1em;
  place-items: center;
  margin: 0;
  transform-box: border-box;
  transform-origin: 50% 50%;
  will-change: transform;
  animation: ob-spinner-spin 0.8s linear infinite;
}

button .ob-svg-icon[data-ob-icon="spinner"],
button .ob-svg-icon.fa-spinner,
button .ob-svg-icon.fa-spin,
[role="button"] .ob-svg-icon[data-ob-icon="spinner"],
[role="button"] .ob-svg-icon.fa-spinner,
[role="button"] .ob-svg-icon.fa-spin {
  margin: 0;
}

.ob-svg-icon[data-ob-icon="spinner"] svg,
.ob-svg-icon.fa-spinner svg,
.ob-svg-icon.fa-spin svg {
  width: 1em;
  height: 1em;
}

.fa-spinner.fa-spin:not(.ob-svg-icon) {
  display: inline-block;
  width: 1em;
  height: 1em;
  line-height: 1;
  transform-origin: 50% 50%;
  animation: ob-spinner-spin 0.8s linear infinite;
}

@keyframes ob-spinner-spin {
  to {
    transform: rotate(360deg);
  }
}
