/**
 * @file
 * Paragraph Bundle Image Overlay.
 *
 * Filename:     paragraph-bundle-image-overlay.css
 * Website:      https://www.flashwebcenter.com
 * Developer:    Alaa Haddad https://www.alaahaddad.com.
 */
.paragraph--type--image-overlay-bundle * {
  border-color: var(--pb-br) !important;
  color: var(--pb-tx) !important;
}

.pb__overlay-container div {
  height: 100%;
}

.paragraphs-bundles div:hover a.pb__link {
  cursor: pointer;
}

.pb__image-overlay__inner a,
.pb__image-overlay__inner img,
.pb__image-overlay__inner div,
.pb__image-overlay__inner picture {
  width: 100%;
  display: flex;
}

.paragraph--type--image-overlay-bundle .field--name-pb-media-image .field__item {
  margin: 0;
}

.paragraph--type--image-overlay-bundle .pb__image-overlay__inner {
  position: relative;
  overflow: hidden;
}

.paragraph--type--image-overlay-bundle a.pb__link {
  inset-block-start: 0;
  inset-inline-start: 0;
  width: 100%;
  height: 100%;
  position: absolute;
}

.paragraph--type--image-overlay-bundle .pb__overlay-title {
  position: absolute;
  width: auto;
}

.paragraph--type--image-overlay-bundle .pb__overlay-container {
  position: absolute;
  height: 100%;
  width: 100%;
}

.paragraph--type--image-overlay-bundle:not(.pb__image-overlay-title) .pb__overlay-container {
  background-color: var(--pb-bg);
}

.pb__image-overlay-fade .pb__image-overlay__inner .pb__overlay-container {
  opacity: 0;
  inset-block-start: 0;
  inset-block-end: 0;
  inset-inline-start: 0;
  inset-inline-end: 0;
  transition: .5s ease;
}

.pb__image-overlay-fade .pb__image-overlay__inner .pb__overlay-title {
  inset-block-start: 50%;
  inset-inline-start: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

.pb__image-overlay-fade .pb__image-overlay__inner:hover .pb__overlay-container {
  opacity: 1;
}

.pb__image-overlay-fade .pb__image-overlay__inner:hover .pb__overlay-container a {
  cursor: pointer;
}

.pb__image-overlay-zoom .pb__image-overlay__inner .pb__overlay-container {
  inset-block-start: 0;
  inset-block-end: 0;
  inset-inline-start: 0;
  inset-inline-end: 0;
  transform: scale(0);
  transition: .3s ease;
}

.pb__image-overlay-zoom .pb__image-overlay__inner .pb__overlay-title {
  inset-block-start: 50%;
  inset-inline-start: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.pb__image-overlay-zoom .pb__image-overlay__inner:hover .pb__overlay-container {
  transform: scale(1);
}

.pb__image-overlay-title .pb__image-overlay__inner .pb__overlay-container {
  inset-block-start: 0;
  inset-inline-start: 0;
  background-color: transparent !important;
}

.pb__image-overlay-title .pb__image-overlay__inner .pb__overlay-title {
  justify-content: center;
  margin: 0;
  inset-block-end: 0;
  inset-inline-start: 0;
  opacity: 0;
  background: rgba(0, 0, 0, 0.5);
  text-align: center;
  padding-block: var(--pb-px8) !important;
  padding-inline: var(--pb-px16) !important;
  margin: 0 !important;
  transition: .5s ease;
  width: 100%;
}

.pb__image-overlay-title .pb__image-overlay__inner:hover .pb__overlay-title {
  background: var(--pb-bg) !important;
  opacity: 1;
}

/* slide global  */
.pb__image-overlay-slide_top .pb__image-overlay__inner .pb__overlay-container,
.pb__image-overlay-slide_bottom .pb__image-overlay__inner .pb__overlay-container,
.pb__image-overlay-slide_left .pb__image-overlay__inner .pb__overlay-container,
.pb__image-overlay-slide_right .pb__image-overlay__inner .pb__overlay-container {
  inset-inline-start: 0;
  inset-inline-end: 0;
  overflow: hidden;
  transition: .5s ease;
}

.pb__image-overlay-slide_top .pb__image-overlay__inner .pb__overlay-title,
.pb__image-overlay-slide_bottom .pb__image-overlay__inner .pb__overlay-title,
.pb__image-overlay-slide_left .pb__image-overlay__inner .pb__overlay-title,
.pb__image-overlay-slide_right .pb__image-overlay__inner .pb__overlay-title {
  inset-block-start: 50%;
  inset-inline-start: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

/* slide top */
.pb__image-overlay-slide_top .pb__image-overlay__inner .pb__overlay-container {
  width: 100%;
  height: 100%;
  transform: translateY(-100%);
  transition: .5s ease;
}

.pb__image-overlay-slide_top .pb__image-overlay__inner:hover .pb__overlay-container {
  transform: translateY(0);
}

/* slide bottom */
.pb__image-overlay-slide_bottom .pb__image-overlay__inner .pb__overlay-container {
  width: 100%;
  height: 100%;
  transform: translateY(100%);
  transition: .5s ease;
}

.pb__image-overlay-slide_bottom .pb__image-overlay__inner:hover .pb__overlay-container {
  transform: translateY(0);
}

/* slide left */
.pb__image-overlay-slide_left .pb__image-overlay__inner .pb__overlay-container {
  inset-block-end: 0;
  width: 100%;
  height: 100%;
  transform: translateX(-100%);
  transition: .5s ease;
}

.pb__image-overlay-slide_left .pb__image-overlay__inner:hover .pb__overlay-container {
  transform: translateX(0);
}

/* slide right */
.pb__image-overlay-slide_right .pb__image-overlay__inner .pb__overlay-container {
  inset-block-end: 0;
  width: 100%;
  height: 100%;
  transform: translateX(100%);
  transition: .5s ease;
}

.pb__image-overlay-slide_right .pb__image-overlay__inner:hover .pb__overlay-container {
  transform: translateX(0);
}
