@charset "UTF-8";
/** @prop --background: used for the Read More button background and fade-out gradient */
/** @prop --button-bg-color: used for the Read More button background and gradient (inherits from --background) */
/** @prop --button-gradient-size: the Read More button gradient width (default: 40px) */
/** @prop --button-gradient-stop: the Read More button gradient stop position (default: 30px) */
/** @prop --button-prefix: content displayed before the Read More text (default: "… ") */
ux-text-lines-limit {
  --lines: unset;
  --button-bg-color: var(--background, #ffffff);
  --button-gradient-size: 40px;
  --button-gradient-stop: 30px;
  --button-prefix: "… ";
  display: block;
}
ux-text-lines-limit > *:first-child {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: var(--lines);
}
ux-text-lines-limit[read-more-text] > *:first-child {
  position: relative;
}
ux-text-lines-limit[read-more-text] .ux-text-lines-limit__btn {
  appearance: none;
  border: 0 none transparent;
  background: var(--button-bg-color);
  position: absolute;
  padding: 0;
  bottom: 0;
  right: 0;
  color: var(--ux-color-primary);
  text-decoration: none;
  line-height: inherit;
}
ux-text-lines-limit[read-more-text] .ux-text-lines-limit__btn::before {
  content: var(--button-prefix, "");
}
ux-text-lines-limit[read-more-text] .ux-text-lines-limit__btn::after {
  content: "";
  position: absolute;
  left: calc(-1 * var(--button-gradient-size));
  width: var(--button-gradient-size);
  height: 100%;
  background: linear-gradient(90deg, transparent, var(--button-bg-color) var(--button-gradient-stop));
  z-index: 0;
}
@media only screen and (width < 768px) {
  ux-text-lines-limit {
    --lines: var(--lines-s);
  }
}
@media only screen and (width >= 768px) and (width < 1024px) {
  ux-text-lines-limit {
    --lines: var(--lines-m);
  }
}
@media only screen and (width >= 1024px) and (width < 1440px) {
  ux-text-lines-limit {
    --lines: var(--lines-l);
  }
}
@media only screen and (width >= 1440px) {
  ux-text-lines-limit {
    --lines: var(--lines-xl);
  }
}
ux-text-lines-limit[open] > *:first-child {
  -webkit-line-clamp: unset;
}
ux-text-lines-limit[open][read-more-text] .ux-text-lines-limit__btn {
  display: none;
}
ux-text-lines-limit[uncropped][read-more-text] .ux-text-lines-limit__btn {
  display: none;
}