.overflow-auto {
  overflow: auto !important;
}
.overflow-hidden {
  overflow: hidden !important;
}
.overflow-scroll {
  overflow: scroll !important;
}
.overflow-x-auto {
  overflow-x: auto !important;
}
.overflow-x-hidden {
  overflow-x: hidden !important;
}
.overflow-x-scroll {
  overflow-x: scroll !important;
}
.overflow-y-auto {
  overflow-y: auto !important;
}
.overflow-y-hidden {
  overflow-y: hidden !important;
}
.overflow-y-scroll {
  overflow-y: scroll !important;
}
.position-relative {
  position: relative !important;
}
.position-absolute {
  position: absolute !important;
}
.position-sticky {
  position: sticky !important;
}
.position-static {
  position: static !important;
}
.text-color {
  color: @textColor !important;
}
.dark-grey-color{
  color: @darkGrey;
}
.text-header-title {
  font-size: 18px !important;
  font-weight: bold !important;
  color: @toolbarLightLinkHoverColor !important;
}
.text-font-size {
  font-size: @fontSizeLarge !important;
}
.text-sub-title {
  color: @greyColorLighten1 !important;
}
.text-light-color {
  color: @textLightColor !important;
}
.light-grey-background {
  background-color: @greyColorOpacity1 !important;
}
.grey-background {
  background-color: @greyColor !important;
}
.grey-text {
  color: @greyColor !important;
}
.border-color {
  border: 1px solid @btnBorder !important;
}
.border-top-color {
  border-top: 1px solid @btnBorder !important;
}
.border-bottom-color {
  border-bottom: 1px solid @btnBorder !important;
}
.border-right-color {
  border-right: 1px solid @btnBorder !important;
}
.border-left-color {
  border-left: 1px solid @btnBorder !important;
}
.no-border {
  border: 0 !important;
}
.no-border-bottom {
  border-bottom: 0 !important;
}
.no-border-top {
  border-top: 0 !important;
}
.no-border-left {
  border-left: 0 !important;
}
.no-border-right {
  border-right: 0 !important;
}
.box-shadow {
  box-shadow: 0px 0px 0px -2px rgba(0, 0, 0, 0.1), 0px 0px 0px 1px rgba(0, 0, 0, 0.1), 0px 0px 0px 0px rgba(0, 0, 0, 0.1) !important;
}
.no-box-shadow {
  box-shadow: none !important;
}
.border-radius {
  border-radius: @inputBorderRadius !important;
}
.no-border-radius {
  border-radius: 0 !important;
}
.border-light-color {
  border-color: @greyColorLighten1Opacity1 !important;
}
.disabled-background {
  background-color: @disableBackground !important;
}
.disabled--text {
  color: @btnDisableColor !important;
}
.primary--text {
  color: @primaryColor !important;
}
.secondary--text {
  color: @secondaryColor !important;
}
.primary {
  background-color: @primaryColor !important;
}
.secondary {
  background-color: @secondaryColor !important;
}
.tertiary-color {
  color: @tertiaryColor!important;
}
.tertiary {
  background-color: @tertiaryColor!important;
  color: @lightWhite;
}
.border-box-sizing {
  box-sizing: border-box !important;
}
.content-box-sizing {
  box-sizing: content-box !important;
}
.height-auto {
  height: auto !important;
  min-height: 0 !important;
}
.width-auto {
  width: auto !important;
  min-width: 0 !important;
}
.width-max-content {
  width: max-content !important;
  max-width: 100% !important;
}
.width-fit-content {
  width: fit-content !important;
  max-width: 100% !important;
}
.width-min-content {
  width: min-content !important;
  max-width: 100% !important;
}
.object-fit-cover {
  object-fit: cover !important;
}
.object-fit-contain {
  object-fit: contain !important;
}
.object-fit-fill {
  object-fit: fill !important;
}
.object-fit-revert {
  object-fit: revert !important;
}
.no-min-width {
  min-width: 0 !important;
}
.no-max-width {
  max-width: none !important;
}
.clickable {
  cursor: pointer;
}
.not-clickable {
  cursor: default !important;
}
.not-allowed {
  cursor: not-allowed !important;
}
.transparent {
  background: transparent;
}
.hover-underline:hover {
  text-decoration: underline !important;
}
.text-capitalize-first-letter {
  text-transform: lowercase;

  &:first-letter {
    text-transform: uppercase;
  }
}
.baseline-vertical-align {
  vertical-align: baseline !important;
}
.text-break-all {
  overflow-wrap: break-all !important;
  word-break: break-all !important;
}
.absolute-vertical-center {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}
.sticky-vertical-center {
  position: sticky !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}
.scrollbar-width-none {
  scrollbar-width: none;
  &::-webkit-scrollbar {
    display: none;
  }
}
.textarea-no-resize {
  resize: none;
}
.ellipsis-reverse {
    display: flex;
    flex-direction: row !important;
    text-overflow: clip !important;
}
.ellipsis-reverse-content {
    flex: 0 12px;
    height: 20px;
    padding-right: 5px;
    margin: auto;
    display: inline-flex;

    &.hidden {
      /* Used to force width = 0 on flex items for IE */
      position: absolute;
      flex: 0 0 0px;
      width: 0;
    }
}
.ellipsis-reverse-apply {
    overflow: hidden;
    position: relative;
    flex: 1 auto;
    height: 20px;
    width: 100%;
    direction:rtl;
    max-width: 100%;
    margin: auto;
}
.text-truncate-2 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.text-truncate-3 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  line-clamp: 3;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.text-truncate-4 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  line-clamp: 4;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}
.text-truncate-5 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  line-clamp: 5;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
}

.reset-style-box {
  div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol,
    ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary,
    time, mark, audio, video {

    margin: revert;
    padding: revert;
    border: revert;
    outline: revert;
    font-size: revert;
    vertical-align: revert;
    background: revert;
    color: revert;
  }

  * {
    line-height:revert;
  }

  article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: revert;
  }

  nav ul {
    list-style: revert;
  }

  a {
    margin: revert;
    padding: revert;
    font-size: revert;
    vertical-align: revert;
    background: revert;
  }

  ins {
    text-decoration: revert;
  }

  mark {
    font-style: revert;
    font-weight: revert;
  }

  del {
    text-decoration: revert;
  }

  abbr[title], dfn[title] {
    border-bottom: revert;
    cursor: revert;
  }

  table {
    border-collapse: revert;
    border-spacing: revert;
  }

  hr {
    display: revert;
    height: revert;
    border: revert;
    margin: revert;
    padding: revert;
  }

  input, select {
    vertical-align: revert;
  }
}
.rich-editor-content {
  ul, ol {
    margin: 0 0 10px 25px ~'; /** orientation=lt */ ';
    margin: 0 25px 10px 0 ~'; /** orientation=rt */ ';
    padding: 0 !important;
    li {
      list-style-position: inside;
    }
  }
  ul li {
    list-style-type: disc;
  }
  blockquote {
    margin: 20px 0 7px 20px ~'; /** orientation=lt */ ';
    margin: 20px 20px 7px 0 ~'; /** orientation=rt */ ';
    background: @baseBackground;
    border-left: 5px solid @primaryColor ~'!important; /** orientation=lt */ ';
    border-right: 5px solid @primaryColor ~'!important; /** orientation=rt */ ';
    padding: 10px 0 10px 10px ~'!important; /** orientation=lt */ ';
    padding: 10px 10px 10px 0 ~'!important; /** orientation=rt */ ';
    p {
      margin-bottom: 0;
      font-size: 14px!important;
      font-weight: 300;
      line-height: 1.25;
      font-style: italic;
      color: @textColor!important;
    }
  }
}