/* Importants have to be used to override the inherent swiper properties */

/* Global styles for swiper */

.swiper {
  height: 100%;
}

.swiper-pagination span {
  background: #24854B !important;
  margin: 0 !important;
}

.swiper-pagination {
  z-index: 0 !important;
}

.swiper.helpSwiper .swiper-slide {
  border: 1px solid #8abb2a00;
  transition: .3s ease-in-out all;
  overflow: hidden;
}

.swiper.productHomeSwiper .swiper-slide .product-swiper-items {
  transition: .3s ease-in-out all;
  overflow: hidden;
}

.swiper.productHomeSwiper .swiper-slide .product-swiper-items:hover {
  border: 2px solid #8abb2a;
}

.swiper.helpSwiper .swiper-slide:hover {
  border: 1px solid #8abb2a;
}

.swiper.whyJoinSwiper {
  padding: 1rem;
}

/*.swiper-slide.careerStaffSwiper {*/
/*  position: relative;*/
/*  padding-bottom: 4rem;*/
/*}*/

/*.swiper-slide.careerStaffSwiper::after {*/
/*  content: "";*/
/*  position: absolute;*/
/*  left: 50%;*/
/*  bottom: 35px;*/
/*  height: 60px;*/
/*  width: 100px;*/
/*  background-color: #D2D2D2;*/
/*  transform: translateX(-50%) rotate(135deg);*/
/*  z-index: -1;*/
/*  pointer-events: none;*/
/*}*/

@media screen and (min-width: 1025px){
    .swiper-slide.careerTabSwiper, .swiper-slide.financialTabSwiper, .swiper-slide.paymentRelatedSwiper {
      width: fit-content !important;
    }
    
    .swiper.careerTabSwiper, .swiper.financialTabSwiper, .swiper.paymentRelatedSwiper {
      margin: 0 !important;
    }
}

.swiper-slide.careerTabSwiper {
  width: fit-content !important;
}

/********** 
 KV Swiper 
**********/

.swiper-slide.kvSwiper {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.swiper-pagination.kvSwiper span {
  /*background: #006E2D !important;*/
  margin: 0 !important;
}

.swiper-pagination.kvSwiper {
  text-align: left !important;
  /*bottom: 20% !important;*/
  /*width: 50% !important;*/
  z-index: 1 !important;
}

/*.swiper-pagination.kvSwiper>* {*/
/*    background:#FFF !important;*/
/*  width: 20% !important;*/
/*}*/

.swiper-button-next.kvSwiper, .swiper-button-prev.kvSwiper {
  width: 55px !important;
  height: 55px !important;
  position: initial;
}

.swiper-pagination-bullet, .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #24854B;
}

.swiper-pagination-progressbar {
  background: #F4F4F4 !important;
  position: absolute;
  top: unset !important;
}

.swiper-horizontal > .swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal {
    height: 2px !important;
}

.swiper-pagination.pagination-bullet.kvSwiper.swiper-pagination-bullets .swiper-pagination-bullet {
  height: 100% !important;
  display: flex;
  justify-content: center;
  align-items: center;
}

@media (max-width: 767px){
    .swiper-pagination.pagination-progress.kvSwiper {
  bottom: 8% !important;
  width: 100% !important;
}
}

/************ 
 Help Swiper 
*************/

.swiper-wrapper.helpSwiper {
  height: 90%;
}

.swiper-button-next.helpSwiper, .swiper-button-prev.helpSwiper {
  position: initial;
  width: 55px !important;
  height: 55px !important;
}

/* Product Swiper */

.swiper-wrapper.productHomeSwiper {
  /*height: fit-content;*/
}

.swiper-button-next.productHomeSwiper, .swiper-button-prev.productHomeSwiper {
  position: initial;
  width: 55px !important;
  height: 55px !important;
}

.swiper-pagination.productHomeSwiper {
  text-align: left;
  top: 0 !important;
}

.swiper-pagination.productHomeSwiper>* {
  width: 25% !important;
}

/* News Swiper */

.swiper-wrapper.newsSwiper {
  height: 80%;
}

.swiper-button-next.newsSwiper, .swiper-button-prev.newsSwiper {
  position: initial;
  width: 55px !important;
  height: 55px !important;
}

.swiper-pagination.newsSwiper {
  text-align: left;
  top: 0 !important;
}

/* Announcement Swiper */

.swiper-wrapper.announcementSwiper {
  height: 80%;
}

.swiper-button-next.announcementSwiper, .swiper-button-prev.announcementSwiper {
  position: initial;
  width: 55px !important;
  height: 55px !important;
}

.swiper-pagination.announcementSwiper {
  text-align: left;
  top: 0 !important;
}

/* Blog Swiper */

.swiper-wrapper.blogSwiper {
  height: 80%;
}

.swiper-button-next.blogSwiper, .swiper-button-prev.blogSwiper {
  position: initial;
  width: 55px !important;
  height: 55px !important;
}

.swiper-pagination.blogSwiper {
  text-align: left;
  top: 0 !important;
}

/* Management Swiper */

.swiper-slide.managementSwiper>* {
  /*height: 50vh;*/
  transition: .3s ease-in-out all;
}

.swiper-slide.managementSwiper {
  transition: .3s ease-in-out all;
}

.managementSwiper.swiper-slide-active {
  margin-right: 15rem;
}

/*.managementSwiper.swiper-slide-next {*/
/*  margin-right: 5rem;*/
/*}*/

.managementSwiper.swiper-slide-active > * {
  width: 100%;
  align-content: baseline;
  object-fit: cover;
  /*height: 100%;*/
  min-width: 400px;
  transition: .3s ease-in-out all;
}

.swiper-slide.managementSwiper>* {
  /*max-width: fit-content;*/
 /* padding-right:10px;*/
  width: 250px;
}

.managementSwiperMobile {
  height: 80%;
  width: 100%;
}

.managementSwiperMobileThumb .swiper-slide {
  width: 25%;
  height: 100%;
  opacity: 0.4;
}

/*.managementSwiperMobileThumb .swiper-slide-thumb-active {*/
/*  opacity: 1;*/
/*}*/

.swiper-button-next.managementSwiper, .swiper-button-prev.managementSwiper {
  width: 55px !important;
  height: 55px !important;
  position: initial;
}

.swiper-text-description {
  position: absolute;
  bottom: 2vw;
  left: 0;
  opacity: 0;
}

.swiper-slide.managementSwiper.swiper-slide-active .swiper-text-description, .swiper.managementSwiperMobile .swiper-slide-active .swiper-text-description  {
  opacity: 1;
}

@media (max-width: 767px){
  .managementSwiper.swiper-slide-active > * {
      width: 100%;
      min-width: 100% !important;
      padding-right: 0 !important;
    }
    
    .swiper.managementSwiper .swiper-text-description .text-base {
  font-size: 1.5rem !important;
}

.swiper-text-description {
  position: absolute;
  bottom: 5vw !important;
}
}

/* Testimonial Swiper */

.swiper-wrapper.testimonialSwiper {
  height: 65%;
}

.swiper-button-next.testimonialSwiper, .swiper-button-prev.testimonialSwiper {
  position: initial;
  width: 55px !important;
  height: 55px !important;
}

.swiper-pagination.testimonialSwiper {
  width: 60% !important;
  height: 5%;
  text-align: left;
  top: 0;
}

.swiper-pagination.testimonialSwiper>* {
  width: 25% !important;
}

/* Motor Details Swiper */

.swiper-wrapper.motorDetailsSwiper {
  height: 65%;
}

.swiper-button-next.motorDetailsSwiper, .swiper-button-prev.motorDetailsSwiper {
  position: initial;
    width: 55px !important;
  height: 55px !important;
}

.swiper-pagination.motorDetailsSwiper {
  width: 60% !important;
  height: 5%;
  text-align: left;
  top: 0;
}

.swiper-pagination.motorDetailsSwiper>* {
  width: 25% !important;
}

/* Roadside Assistance Swiper */

.swiper-wrapper.road-assist-swiper{
  height: 80%;
  margin-top:5rem; 
}

.swiper-button-next.road-assist-swiper, .swiper-button-prev.road-assist-swiper{
  position: initial;
    width: 55px !important;
  height: 55px !important;
}

.road-assist-swiper.swiper-slide-active{
  margin-top: -5rem !important;
}

/* Latest CSR Swiper */

.swiper-button-next.csr-swiper, .swiper-button-prev.csr-swiper {
  position: initial;
  width: 55px !important;
  height: 55px !important;
}

/* CSR Swiper */

.swiper-slide.csr2>* {
  height: 20vh;
}

.csr2.swiper-slide-active {
  height: 30vh !important;
  width:500px !important;
}

.csr2.swiper-slide-active>* {
  height: 30vh !important;
}

.swiper-button-next.csr2, .swiper-button-prev.csr2 {
   width: 55px !important;
  height: 55px !important;
  position: initial;
}

.swiper-pagination.csr2 {
  text-align: left !important;
  width: 100% !important;
}

.swiper-pagination.csr2>* {
  width: 20% !important;
}

/* Portal Login Swiper */
.swiper-wrapper.portalLogin{
  height: 100%;
}

/* Latest Highlights Swiper */

.swiper-pagination.latestHighlights {
    position:unset;
  text-align: left !important;
  width: 100% !important;
}

.swiper-pagination.latestHighlights>* {
  width: 20% !important;
}

/* Personal Product Swiper */

.swiper-pagination.personalSwiper {
    position:unset;
  text-align: left !important;
  width: 100% !important;
}

.swiper-pagination.personalSwiper>* {
  width: 20% !important;
}

/* Commercial Product Swiper */

.swiper-pagination.commSwiper {
    position:unset;
  text-align: left !important;
  width: 100% !important;
}

.swiper-pagination.commSwiper>* {
  width: 20% !important;
}


/* Test */

.swiper-pagination-bullet {
  top: 0 !important;
  width: 100px !important;
  height: 2px !important;
  border-radius: 0 !important;
  position: relative;
  overflow: hidden;
}

.swiper-pagination-bullet::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.swiper-pagination-bullet-active {
  background: rgba(#000, 0.4);
}

/*
Max-width media queries
*/

@media only screen and (max-width: 768px) {
  /*.swiper-pagination.newsSwiper>* {*/
  /*  width: 25% !important;*/
  /*}*/
  .swiper-pagination.announcementSwiper>* {
    width: 25% !important;
  }
  .swiper-wrapper.road-assist-swiper {
    margin-top:0rem;
  }
  .road-assist-swiper.swiper-slide-active{
    margin-top: 0rem !important;
  }
  
}
@media only screen and (max-width: 1024px) {
  .swiper-wrapper.road-assist-swiper {
    margin-top:5rem;
  }
  .road-assist-swiper.swiper-slide-active{
    margin-top: 0rem !important;
  }
  
}
@media only screen and (max-width: 1280px) {
  .swiper-wrapper.road-assist-swiper {
    margin-top:5rem;
  }
  .road-assist-swiper.swiper-slide-active{
    margin-top: 0rem !important;
  }
  
}

/*
Min-width media queries
*/

/*@media only screen and (min-width: 1440px) {*/
/*  .managementSwiper.swiper-slide-next {*/
/*    margin-right: 5rem;*/
/*  }*/
  
/*}*/

/* Anniversary Swiper */
.anniversarySwiper.swiper-slide-next, .anniversarySwiper.swiper-slide-prev {
  height: 75%;
  margin-top: 8rem;
  margin-bottom: 2rem;
}


.swiper-pagination.anniversary-pagination {
  top: 73% !important;
}

.anniversary-pagination .swiper-pagination-bullet {
  width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px)) !important;
  height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px)) !important;
  border-radius: var(--swiper-pagination-bullet-border-radius, 50%) !important;
  background: #BFBFBF !important;
  opacity: 1 !important;
}

.anniversary-pagination .swiper-pagination-bullet-active {
  background: #007632 !important;
}

.anniversary-pagination span {
  margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px) !important;
}

.swiper-anniversary-timeline-wrapper {
  position: absolute;
  right: 6.5%;
  bottom: -18%;
}

.swiper-button-prev.anniversaryTimelineSwiper {
  position: unset;
}

.swiper-button-next.anniversaryTimelineSwiper {
  position: unset;
}

@media only screen and (max-width: 768px) {
  .swiper-button-next.anniversaryTimelineSwiper {
    right: 0 !important;
  }
}

.swiper-button-prev.anniversaryTimelineSwiper {
  width: 100px;
  height: 42px;
  background: transparent;
  color: #707070;
  padding: 1rem;
  border-radius: 0.5rem;
  border: 2px solid #e5e7eb;
  font-size: 1.5rem;
  font-weight: 700;
}

.swiper-button-next.anniversaryTimelineSwiper {
  width: 100px;
  height: 42px;
  background: #84BD00;
  color: white;
  padding: 1rem;
  border-radius: 0.5rem;
  font-size: 1.5rem;
  font-weight: 700;
}

.swiper-button-next.anniversaryTimelineSwiper:hover {
  background: #6E9E00;
}

.swiper-button-prev.anniversaryTimelineSwiper:after, .swiper-button-next.anniversaryTimelineSwiper:after {
  content: unset;
}

/* End anniversary swiper */