/*
    - Name: "highlighted-simple.scss"
    - Description: "Add custom styles to Highlighted Simple view mode, common content type"
*/
.slick-dots {
  --color-dots: var(--white);
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.slick-dots li {
  display: flex;
  align-items: center;
  width: auto;
  height: auto;
  margin: 0 var(--spacing-2xs);
}

.slick-dots li button {
  position: relative;
  width: 8px;
  height: 8px;
  padding: 0;
  font-size: 0;
}

.slick-dots li button::before {
  content: "";
  width: 8px;
  height: 8px;
  opacity: 1;
  background-image: url("data:image/svg+xml,%3Csvg width='8' height='8' viewBox='0 0 19 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='9' cy='9' r='7' fill='transparent' stroke='white' stroke-width='3'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
}

.slick-dots li button:hover::before {
  background-image: url("data:image/svg+xml,%3Csvg width='8' height='8' viewBox='0 0 19 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='9' cy='9' r='7' fill='white' stroke='white' stroke-width='2'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
}

.slick-dots li button:focus-visible {
  outline-offset: 2px;
  outline: 2px solid var(--color-dots-focus, var(--black));
}

.slick-dots li::after {
  content: "";
  width: 0;
  height: 1px;
  background-color: var(--color-dots);
  transition: 0.5s ease-in-out;
}

.slick-dots li:last-child {
  display: flex;
  flex-direction: row-reverse;
}

.slick-dots li.slick-active button {
  width: 16px !important;
  height: 16px !important;
  font-size: 0;
}

.slick-dots li.slick-active button::before {
  opacity: 1;
  width: 16px !important;
  height: 16px !important;
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 19 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='9' cy='9' r='8' fill='white' stroke='white' stroke-width='2'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
}

.slick-dots li.slick-active::after {
  width: 44px;
  margin-left: var(--spacing-sm);
}

.slick-dots li.slick-active:last-child::after {
  margin-right: var(--spacing-sm);
  margin-left: 0;
}

.bg-primary-color .slick-dots, .bg-secondary-color-blue .slick-dots {
  --color: var(--white);
}

.bg-primary-color .slick-dots li button:hover::before, .bg-secondary-color-blue .slick-dots li button:hover::before {
  background-image: url("data:image/svg+xml,%3Csvg width='8' height='8' viewBox='0 0 19 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='9' cy='9' r='8' fill='white' stroke='white' stroke-width='2'/%3E%3C/svg%3E");
}

.bg-primary-color .slick-dots li.slick-active button::before, .bg-secondary-color-blue .slick-dots li.slick-active button::before {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 19 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='9' cy='9' r='8' fill='white' stroke='white' stroke-width='2'/%3E%3C/svg%3E");
}

.node--view-mode-highlighted-simple {
  display: flex;
  align-items: center;
  height: 100%;
  padding: 24px;
  border: 1px solid var(--white);
}

.node--view-mode-highlighted-simple h3 {
  font-size: 1.375rem;
  line-height: 1.6875rem;
}

@media (min-width: 992px) {
  .node--view-mode-highlighted-simple h3 {
    font-size: 1.5rem;
  }
}
.node--view-mode-highlighted-simple .c-button.btn-simple {
  --primary-color: var(--white);
  --secondary-color: var(--white);
  justify-content: flex-end;
}

.node--view-mode-highlighted-simple.c-highlighted .c-highlighted__content {
  padding: var(--spacing-md) !important;
}

.node--view-mode-highlighted-simple.c-highlighted .c-text__title {
  margin-top: 0;
  padding-bottom: var(--spacing-xs);
}

.node--view-mode-highlighted-simple.c-highlighted .c-text__extra {
  margin-top: var(--spacing-xs);
}

.node--view-mode-highlighted-simple.c-highlighted .c-text__extra a::after {
  content: "" !important;
}

.view-highlights.view-display-id-highlighted .slick {
  margin: 0 auto;
}

@media (max-width: 575.98px) {
  .view-highlights.view-display-id-highlighted .slick {
    padding: 0;
  }
}
.view-highlights.view-display-id-highlighted .slick--less .slick-track {
  text-align: left;
}

.view-highlights.view-display-id-highlighted .slick--less .slick__arrow {
  display: none;
}

.view-highlights.view-display-id-highlighted .slick-track {
  display: flex;
}

.view-highlights.view-display-id-highlighted .slick-slide {
  height: inherit !important;
}

@media (max-width: 479.98px) {
  .view-highlights.view-display-id-highlighted .slick-slide {
    padding-right: 1px;
  }
}
.view-highlights .node--view-mode-highlighted {
  margin-top: var(--spacing-md);
  border: 1px solid var(--black);
}

@media (min-width: 768px) {
  .view-highlights .node--view-mode-highlighted {
    padding: 0;
  }
}
@media (min-width: 992px) {
  .view-highlights .node--view-mode-highlighted {
    margin: 0;
  }
}
.view-highlights .node--view-mode-highlighted.c-highlighted .c-highlighted__content {
  position: absolute;
  padding: 24px;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  padding: 48px !important;
}

.view-highlights .node--view-mode-highlighted.c-highlighted .c-text__title {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-top: 0;
  padding-bottom: var(--spacing-xs);
  color: var(--white) !important;
}

.view-highlights .node--view-mode-highlighted.c-highlighted .c-text__title::after {
  color: var(--white) !important;
}

.view-highlights .node--view-mode-highlighted.c-highlighted .c-text__extra .c-button.btn-simple {
  --primary-color: var(--white);
  --secondary-color: var(--white);
}

.view-highlights .node--view-mode-highlighted.c-highlighted .c-text__extra .c-button.btn-simple::after {
  content: "" !important;
}

.view-highlights .node--view-mode-highlighted .field--name-field-visual-resources {
  overflow: hidden;
  height: 100%;
}

.view-highlights .node--view-mode-highlighted .media {
  background-color: var(--gray-400);
  aspect-ratio: 4/3;
  opacity: 0;
  transition: 0.5s ease-in-out;
}

@media (min-width: 1200px) {
  .view-highlights .node--view-mode-highlighted .media {
    aspect-ratio: 16/9;
  }
}
@media (min-width: 1400px) {
  .view-highlights .node--view-mode-highlighted .media {
    aspect-ratio: 319/156;
  }
}
.view-highlights .node--view-mode-highlighted .media img {
  aspect-ratio: 4/3;
  -o-object-fit: cover;
     object-fit: cover;
}

@media (min-width: 1200px) {
  .view-highlights .node--view-mode-highlighted .media img {
    aspect-ratio: 16/9;
  }
}
@media (min-width: 1400px) {
  .view-highlights .node--view-mode-highlighted .media img {
    aspect-ratio: 319/156;
  }
}
.view-highlights .node--view-mode-highlighted .media.is-b-loaded {
  opacity: 1;
}

.view-highlights .node--view-mode-highlighted .c-highlighted__wrapper {
  margin: 0;
}

@media (min-width: 768px) {
  .view-highlights .node--view-mode-highlighted .c-highlighted__image {
    padding: 0;
  }
}
.view-highlights .node--view-mode-highlighted .c-highlighted__image img {
  transition: 0.5s ease-in-out;
}

.view-highlights .node--view-mode-highlighted .c-highlighted__image::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: var(--gradient-500-opacity);
  background-blend-mode: multiply;
}

.view-highlights .node--view-mode-highlighted .component-button.btn-simple {
  justify-content: flex-end;
  color: var(--white) !important;
}

.view-highlights .node--view-mode-highlighted .component-button.btn-simple::before {
  color: var(--white) !important;
}

.view-highlights .node--view-mode-highlighted:hover .c-highlighted__image {
  overflow: hidden;
}

.view-highlights .node--view-mode-highlighted:hover .c-highlighted__image img {
  filter: brightness(125%);
  transform: scale(1.05);
}

.view-highlights .node--view-mode-highlighted .c-text__grid,
.view-highlights .node--view-mode-highlighted-simple .c-text__grid {
  --_spacing-desktop: var(--spacing-sm);
  --_spacing-responsive: var(--spacing-xs);
}

.view-highlights .node--view-mode-highlighted .c-text__extra,
.view-highlights .node--view-mode-highlighted-simple .c-text__extra {
  margin-top: 0;
}

.view-highlights.view-display-id-highlighted .slick__arrow {
  justify-content: flex-end;
}

@media (min-width: 768px) {
  .view-highlights.view-display-id-block_highlight .view-content > .views-row {
    padding-left: 0;
  }
}
.vlsuite-layout-bg-wrapper[class*=bg-] .view-highlights .c-highlighted .c-text__title::after {
  background-color: var(--white);
}

.vlsuite-layout-bg-wrapper[class*=bg-] .view-highlights .c-highlighted:hover .c-text__title {
  color: var(--white);
}

.vlsuite-layout-bg-wrapper[class*=bg-] .view-highlights .node--view-mode-highlighted-simple {
  border: 1px solid var(--white);
}

.vlsuite-layout-bg-wrapper[class*=bg-] .view-highlights .node--view-mode-highlighted-simple .component-button.btn-simple {
  color: var(--white);
}

.vlsuite-layout-bg-wrapper[class*=bg-] .view-highlights .node--view-mode-highlighted-simple .component-button.btn-simple::before {
  color: var(--white);
}

.vlsuite-layout-bg-wrapper.bg-primary-color-100 .view-highlights .c-highlighted .c-text__title::after, .vlsuite-layout-bg-wrapper.bg-third-color-light .view-highlights .c-highlighted .c-text__title::after, .vlsuite-layout-bg-wrapper.bg-third-color-extralight .view-highlights .c-highlighted .c-text__title::after {
  background-color: var(--secondary-color);
}

.vlsuite-layout-bg-wrapper.bg-primary-color-100 .view-highlights .c-highlighted:hover .c-text__title, .vlsuite-layout-bg-wrapper.bg-third-color-light .view-highlights .c-highlighted:hover .c-text__title, .vlsuite-layout-bg-wrapper.bg-third-color-extralight .view-highlights .c-highlighted:hover .c-text__title {
  color: var(--secondary-color);
}

.vlsuite-layout-bg-wrapper.bg-primary-color-100 .view-highlights .node--view-mode-highlighted-simple, .vlsuite-layout-bg-wrapper.bg-third-color-light .view-highlights .node--view-mode-highlighted-simple, .vlsuite-layout-bg-wrapper.bg-third-color-extralight .view-highlights .node--view-mode-highlighted-simple {
  border: 1px solid var(--secondary-color);
}

.vlsuite-layout-bg-wrapper.bg-primary-color-100 .view-highlights .node--view-mode-highlighted-simple .component-button.btn-simple, .vlsuite-layout-bg-wrapper.bg-third-color-light .view-highlights .node--view-mode-highlighted-simple .component-button.btn-simple, .vlsuite-layout-bg-wrapper.bg-third-color-extralight .view-highlights .node--view-mode-highlighted-simple .component-button.btn-simple {
  color: var(--secondary-color);
}

.vlsuite-layout-bg-wrapper.bg-primary-color-100 .view-highlights .node--view-mode-highlighted-simple .component-button.btn-simple::before, .vlsuite-layout-bg-wrapper.bg-third-color-light .view-highlights .node--view-mode-highlighted-simple .component-button.btn-simple::before, .vlsuite-layout-bg-wrapper.bg-third-color-extralight .view-highlights .node--view-mode-highlighted-simple .component-button.btn-simple::before {
  color: var(--secondary-color);
}
/*# sourceMappingURL=highlighted-simple.css.map */