.skeleton-text {
  color: @skeletonColor !important;
  * {
    color: @skeletonColor !important;
  }
  &::placeholder, *::placeholder {
    background-color: @skeletonColor !important;
    border-radius: 4px;
    color: @skeletonColor !important;
    width: 100%;
  }
}
.skeleton-background {
  background-color: @skeletonColor !important;
  border-color: @skeletonColor !important;

  &::before, &[disabled] {
    background-color: @skeletonColor !important;
    border-color: @skeletonColor !important;
  }
  * {
    border-color: @skeletonColor !important;
  }

  &[type="button"][disabled] {
    &.btn, &.v-btn, &.btn-primary, &.v-btn.primary, &.v-btn.v-btn.primary, &.v-btn.btn, &.v-btn.v-btn.primary.btn.btn-primary {
      &:not(.v-btn--flat):not(.v-btn--text):not(.v-btn--outlined) {
        background-color: @skeletonColor !important;
        border-color: @skeletonColor !important;
      }
    }
  }
}

.skeleton-border {
  border: 1px solid @skeletonColor !important;
}

.skeleton-background, .skeleton-text {
  position: relative !important;
  max-height: 100% !important;
  overflow: hidden !important;
  box-shadow: none !important;
}
.skeleton-border-radius {
  border-radius: 4px !important;
}
.skeleton-border-radius-rounded {
  border-radius: 20px !important;
}
.skeleton-text-width-small {
  min-width: 50px !important;
  width: 50px !important;
}
.skeleton-text-width {
  min-width: 120px !important;
  width: 120px !important;
}
.skeleton-child-hidden * {
  visibility: hidden;
}
.skeleton-text-half-width {
  min-width: 50% !important;
  max-width: 50% !important;
  width: 50% !important;
}
.skeleton-text-full-width {
  min-width: 100% !important;
  max-width: 100% !important;
  width: 100% !important;
}
.skeleton-text-height {
  max-height: 8px !important;
  margin-top: auto !important;
  margin-bottom: auto !important;
}
.skeleton-text-height-thick {
  max-height: 10px !important;
  margin-top: auto !important;
  margin-bottom: auto !important;
}
.skeleton-text-height-fine {
  max-height: 6px !important;
  margin-top: auto !important;
  margin-bottom: auto !important;
}
.skeleton-text-height-block {
  height: 50px !important;
  max-height: 50px !important;
  margin-top: auto !important;
  margin-bottom: auto !important;
}

.skeleton-header {
  width:50%;
  height: 15px;
}

.skeleton-list-item-title {
  width:50%;
  display: inline-flex;
  height: 10px;
}

.skeleton-list-item-subtitle {
  width:40%;
  display: inline-flex;
  height: 8px;
}
