/* 
 * DO NOT EDIT THIS FILE.
 * The Airbus Web Experience use PostCSS to compile CSS
 * the same way as in the Drupal core except it use the .pcss extension.
 * Therefore, you are supposed to edit the pcss file of the same name.
 */

.awx-carousel{
  --carousel-item-width:100%;
  --carousel-item-gap:0;
  --carousel-inline-padding:0;

  position:relative;
  width:100%;
  margin:0;
  container-type:inline-size;
  container-name:carousel;
}

.awx-carousel__slides{
  position:relative;
  display:grid;
  overflow-x:auto;
  overflow-y:hidden;
  grid-auto-columns:var(--carousel-item-width);
  grid-auto-flow:column;
  grid-gap:0 var(--carousel-item-gap);
  gap:0 var(--carousel-item-gap);
  margin:0 auto;
  padding:0 var(--carousel-inline-padding);
  list-style:none;
  scroll-behavior:smooth;
  scroll-snap-type:x mandatory;
  scroll-padding:0 var(--carousel-inline-padding);
  scrollbar-width:none;
  scrollbar-gutter:unset;
  transition:all 600ms var(--awx-ease-in-out);
}

.awx-carousel.has-controls-above .awx-carousel__slides{
    margin-bottom:0;
  }

@media (prefers-reduced-motion: reduce){
  .awx-carousel__slides{
    scroll-behavior:auto;
  }
}

.awx-carousel__slides::-webkit-scrollbar{
  display:none;
}

.awx-carousel--2-cols{
  --carousel-item-width:50%;
}

.awx-carousel--3-cols{
  --carousel-item-width:33.33333%;
}

.awx-carousel--4-cols{
  --carousel-item-width:25%;
}

.awx-carousel--5-cols{
  --carousel-item-width:20%;
}

.awx-carousel--6-cols{
  --carousel-item-width:16.66667%;
}

.awx-carousel--7-cols{
  --carousel-item-width:14.28571%;
}

.awx-carousel--8-cols{
  --carousel-item-width:12.5%;
}

.awx-carousel__slide{
  position:relative;
  display:block;
  margin:0;
  padding:0;
  scroll-snap-align:start;
}

.awx-carousel__slide > *{
    height:100%;
    margin-bottom:0 !important;
  }

.awx-carousel__controls{
  padding:var(--awx-sp-v) var(--carousel-inline-padding);
  text-align:right;
}

.awx-carousel__controls .awx-button{
  width:var(--awx-sp-v3);
  padding-right:0;
  padding-left:0;
  text-align:center;
  border-radius:50%;
  font-size:0.875rem;
}

.awx-carousel__controls .awx-button::before{
  border-radius:var(--awx-sp-v1-5);
}

.awx-carousel__controls__prev{
  margin-right:var(--awx-sp-h0-25);
}

.awx-carousel__indicator{
  position:relative;
  width:100%;
  height:2px;
  margin-top:var(--awx-sp-v);
  transition:width 400ms var(--awx-ease-in-out);
  background-color:var(--awx-color-dominant-gray-light);
}

.awx-carousel__indicator__progress{
  position:absolute;
  top:0;
  right:auto;
  bottom:0;
  left:0;
  display:block;
  width:0;
  transition:width 400ms var(--awx-ease-in-out);
  background-color:var(--awx-color-accent);
}

.awx-carousel__indicator__info{
  display:none;
  padding:var(--awx-sp-v2) var(--awx-sp-h7);
  text-align:right;
  color:var(--awx-color-dominant);
}

.awx-carousel__indicators{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:center;
  gap:0 var(--awx-sp-h0-25);
  margin:0;
  padding:0;
  list-style:none;
}

.awx-carousel__indicators-list-item{
  position:relative;
  margin:0;
  padding:0;
}

.awx-carousel__indicators-item{
  position:relative;
  z-index:10;
  flex:1;
  min-width:50px;
  height:var(--awx-sp-v2);
  border:none;
  border-radius:0;
  background-color:transparent;
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
}

.awx-carousel__indicators-item::after{
  position:absolute;
  top:45%;
  right:0;
  left:0;
  height:var(--awx-sp-v0-25);
  content:"";
  transition:background-color 200ms var(--awx-ease-in-out);
  background-color:var(--awx-color-dark-line);
}

.awx-carousel__indicators-item.is-active::after{
  background-color:var(--awx-color-accent);
}

.awx-carousel__indicators-label{
  position:absolute !important;
  overflow:hidden;
  clip-path:rect(1px 1px 1px 1px);
  width:1px;
  height:1px;
  word-wrap:normal;
  overflow-wrap:normal;
}

.awx-carousel__controls--above{
  position:static;
  padding:0;
  text-align:inherit;
  text-align:unset;
  background-color:pink;
}

.awx-carousel__controls--above .awx-button{
    width:auto;
    height:auto;
    padding:0 var(--awx-sp-h);
    border:none;
    border-radius:0;
    background-color:transparent !important;
  }

.awx-carousel__controls--above .awx-button .awx-icon{
      width:var(--awx-sp-v2-5);
      height:var(--awx-sp-v2-5);
      transition:all 200ms var(--awx-ease-in-out);
      color:var(--awx-color-accent) !important;
      border-radius:50%;
      background-color:var(--awx-color-text-light);
    }

.awx-carousel__controls--above .awx-button .awx-icon use{
        transform:scale(50%);
        transform-origin:center;
      }

.awx-carousel__controls--above .awx-button .awx-icon--chevron-left use{
      transform-origin:42% 50%;
    }

.awx-carousel__controls--above .awx-button .awx-icon--chevron-right use{
      transform-origin:58% 50%;
    }

.awx-carousel__controls--above .awx-button:active .awx-icon{
      color:var(--awx-color-accent-active);
      background-color:var(--awx-color-dominant-light-active);
    }

.awx-carousel__controls--above .awx-button:focus-visible .awx-icon{
      color:var(--awx-color-accent-active);
      background-color:var(--awx-color-dominant-light-active);
    }

.awx-carousel__controls--above .awx-button:hover .awx-icon{
      color:var(--awx-color-accent-active);
      background-color:var(--awx-color-dominant-light-active);
    }

.awx-carousel__controls--above .awx-button:disabled .awx-icon{
      color:var(--awx-color-light-faded) !important;
      border-color:var(--awx-color-light-faded) !important;
      background-color:transparent !important;
    }

.awx-carousel__controls--above .awx-button.is-disabled .awx-icon{
      color:var(--awx-color-light-faded) !important;
      border-color:var(--awx-color-light-faded) !important;
      background-color:transparent !important;
    }

.awx-carousel__controls--above .awx-button::before{
    box-shadow:none;
  }

.awx-carousel__controls--above .awx-carousel__controls__prev{
    position:absolute;
    top:0;
    bottom:var(--awx-sp-v2);
    left:0;
    width:auto !important;
    height:auto !important;
  }

.awx-carousel__controls--above .awx-carousel__controls__next{
    position:absolute;
    top:0;
    right:0;
    bottom:var(--awx-sp-v2);
    width:auto !important;
    height:auto !important;
  }

.awx-carousel[data-color-scheme="dark"],
.awx-carousel--dark{
  color:var(--awx-color-text-light);
  background-color:var(--awx-color-dominant);
}

.awx-carousel[data-color-scheme="dark"] .awx-carousel__slide a,.awx-carousel--dark:not(.does-not-exist) .awx-carousel__slide a{
    color:var(--awx-color-link-light);
  }

.awx-carousel[data-color-scheme="dark"] .awx-carousel__slide [target="_blank"]::after{
    filter:grayscale(1);
  }

.awx-carousel--dark:not(.does-not-exist) .awx-carousel__slide [target="_blank"]::after{
    filter:grayscale(1);
  }

.awx-carousel[data-color-scheme="dark"] .awx-carousel__indicator,.awx-carousel--dark:not(.does-not-exist) .awx-carousel__indicator{
    background-color:var(--awx-color-light-line);
  }

.awx-carousel[data-color-scheme="dark"] .awx-carousel__indicator__progress,.awx-carousel--dark:not(.does-not-exist) .awx-carousel__indicator__progress{
    background-color:var(--awx-white);
  }

.awx-carousel[data-color-scheme="dark"] .awx-carousel__indicators-item::after{
    background-color:var(--awx-color-light-line);
  }

.awx-carousel--dark:not(.does-not-exist) .awx-carousel__indicators-item::after{
    background-color:var(--awx-color-light-line);
  }

.awx-carousel[data-color-scheme="dark"] .awx-carousel__indicators-item.is-active::after{
    background-color:var(--awx-white);
  }

.awx-carousel--dark:not(.does-not-exist) .awx-carousel__indicators-item.is-active::after{
    background-color:var(--awx-white);
  }

.awx-carousel[data-color-scheme="dark"] .awx-carousel__indicator__info,.awx-carousel--dark:not(.does-not-exist) .awx-carousel__indicator__info{
    color:var(--awx-color-text-light);
  }

@media (min-width: 48em){
  .awx-carousel__indicators-label{
    position:relative !important;
    top:auto;
    right:auto;
    bottom:auto;
    left:auto;
    display:block;
    clip-path:initial;
    clip-path:unset;
    width:auto;
    height:auto;
    padding:0 var(--awx-sp-h2) var(--awx-sp-v);
    font-size:max(.875rem, min(1.25rem, 1vw));
    font-size:clamp(.875rem, 1.25rem, 1vw);
    font-weight:500;
  }
    .awx-carousel.has-indicators-label .awx-carousel__indicators{
      gap:0;
    }

    .awx-carousel.has-indicators-label .awx-carousel__indicators-item{
      flex:0 1 auto;
      height:auto;
    }

    .awx-carousel.has-indicators-label .awx-carousel__indicators-item::after{
      top:auto;
      bottom:0;
      height:1px;
    }

    .awx-carousel.has-indicators-label .awx-carousel__indicators-item.is-active::after{
      height:var(--awx-sp-v0-25);
    }
}

@media (min-width: 64em){
  .awx-carousel__slides{
    margin-bottom:var(--awx-sp-v2);
  }

  .awx-carousel__controls .awx-button{
    width:var(--awx-sp-v2-5);
    height:var(--awx-sp-v2-5);
    line-height:var(--awx-sp-v2-25);
  }

  .awx-carousel__indicator{
    position:absolute;
    right:calc(var(--awx-sp-h5) + var(--carousel-inline-padding));
    bottom:var(--awx-sp-v2-25);
    left:var(--carousel-inline-padding);
    width:auto;
  }

  .awx-carousel__indicator__info{
    position:absolute;
    top:calc(var(--awx-sp-v0-5)*-1);
    right:calc(var(--awx-sp-h2)*-1);
    padding:0;
  }

  .awx-carousel__controls--above .awx-button{
    padding:0 var(--awx-sp-h2-5);
  }
}


