/*!************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/speakers/style.scss ***!
  \************************************************************************************************************************************************************************************************************************************************/
.speaker-module-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 1.6rem;
}

/* SEARCH BAR */
.speaker-search-wrapper {
  width: 100%;
  max-width: 1240px;
  text-align: left;
  margin-top: 20px;
  margin-bottom: 20px;
}

.speaker-search {
  position: relative;
  width: 100%;
}

.speaker-search:before {
  position: absolute;
  content: "";
  left: 10px;
  top: 50%; /* Move to the vertical center */
  transform: translateY(-50%); /* Offset by half the element's height */
  width: 24px;
  height: 24px; /* Match the icon's dimensions */
  background: url("data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"%3E%3Cpath d=\"M19.6 21L13.3 14.7C12.8 15.1 12.225 15.4167 11.575 15.65C10.925 15.8833 10.2333 16 9.5 16C7.68333 16 6.14583 15.3708 4.8875 14.1125C3.62917 12.8542 3 11.3167 3 9.5C3 7.68333 3.62917 6.14583 4.8875 4.8875C6.14583 3.62917 7.68333 3 9.5 3C11.3167 3 12.8542 3.62917 14.1125 4.8875C15.3708 6.14583 16 7.68333 16 9.5C16 10.2333 15.8833 10.925 15.65 11.575C15.4167 12.225 15.1 12.8 14.7 13.3L21 19.6L19.6 21ZM9.5 14C10.75 14 11.8125 13.5625 12.6875 12.6875C13.5625 11.8125 14 10.75 14 9.5C14 8.25 13.5625 7.1875 12.6875 6.3125C11.8125 5.4375 10.75 5 9.5 5C8.25 5 7.1875 5.4375 6.3125 6.3125C5.4375 7.1875 5 8.25 5 9.5C5 10.75 5.4375 11.8125 6.3125 12.6875C7.1875 13.5625 8.25 14 9.5 14Z\" fill=\"%23333333\"%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
}

.speaker-search input {
  flex: 1;
  padding: 15px 10px 16px 40px;
  border: 1px solid #E6E6E6;
  border-radius: var(--global-border-radius);
  font-size: 1rem;
  width: calc(100% - 52px);
  max-height: 48px;
}

.speaker-module-content-wrapper {
  max-width: 1240px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

/* No results wrapper */
.speaker-no-results {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* Speaker Group Wrapper */
.speaker-group {
  width: 100%;
  padding: 1.6rem;
  /* NEW */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}

.speaker-group:not(:first-child) {
  padding-top: 100px; /* Add top padding only to elements after the first */
}

/* Speaker Group Title */
.speaker-group-title {
  text-align: center;
  padding-bottom: 40px;
  font-size: 32px;
  font-weight: 700;
  line-height: 40px;
  max-width: 980px;
}

/* Speaker List Wrapper */
.speaker-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 32px;
  width: 100%;
}

/* Individual Speaker Item */
.speaker-item, .no-results-speaker-item {
  flex: 0 0 calc(25% - 26px);
  border: 1px solid #C0C0C0;
  border-radius: var(--global-border-radius);
  cursor: pointer;
  transition: transform 0.3s ease-in-out;
}

.no-results-speaker-item {
  cursor: default;
}

.speaker-item:hover {
  transform: scale(1.03);
}

/* Speaker Image */
.speaker-image-wrapper {
  position: relative;
  aspect-ratio: 1;
  overflow: hidden;
  background-size: contain;
  background-position: center;
  border-radius: var(--global-border-radius) var(--global-border-radius) 0 0;
}

.speaker-item img, .no-results-speaker-item img {
  width: 100%;
  border-radius: var(--global-border-radius) var(--global-border-radius) 0 0;
  max-width: 284px; /* Ensure the image doesn't exceed the desired width */
  max-height: 284px; /* Set the maximum height */
  aspect-ratio: 1/1; /* Maintain a 1:1 square aspect ratio */
  -o-object-fit: cover;
     object-fit: cover;
  overflow: hidden;
}

.company-logo-overlay {
  position: absolute;
  bottom: 0px;
  right: 0px;
  width: 23%; /* Adjust the size as needed */
  height: 23%;
  border-radius: 0px;
  border-bottom: 1px solid #C0C0C0;
  border-left: 1px solid #C0C0C0;
  border-top: 1px solid #C0C0C0;
  overflow: hidden;
}

.company-logo-overlay img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0px !important;
}

/* Speaker Info Wrapper */
.speaker-info {
  padding: 16px 16px 48px;
  color: #121212;
  display: flex;
  gap: 8px;
  flex-direction: column;
}

/* Speaker Name */
.speaker-info-name {
  font-weight: 700;
  font-size: 22px;
  line-height: 32px;
}

/* Speaker Job Title and Company */
.speaker-info-job {
  font-size: 16px;
  line-height: 24px;
}

.speaker-info-company {
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
}

/* Modal Wrapper */
.speaker-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 199;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.2s ease-in-out;
}

.speaker-modal:not(.hidden) {
  visibility: visible;
  opacity: 1;
}

/* Modal Content */
.speaker-modal-content {
  position: relative;
  background: #fff;
  border-radius: var(--global-border-radius);
  width: 100%;
  max-height: 80vh;
  max-width: 792px;
  z-index: 200;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  margin: 20px;
}

/* Modal Close Button */
.speaker-modal-close {
  position: absolute;
  top: 10px;
  right: 10px;
  background: none;
  border: none;
  font-size: 24px;
  cursor: pointer;
}

/* Top Wrapper */
.speaker-modal-header {
  background-color: #F5F5F5;
  width: 100%;
  border-radius: var(--global-border-radius) var(--global-border-radius) 0 0;
}

.speaker-modal-header-content-wrapper {
  width: 100%;
  box-sizing: border-box;
  padding: 24px 54px 0;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  margin-bottom: -43px;
  gap: 24px;
  z-index: 201;
}

/* Modal Image */
.speaker-modal-image {
  width: 220px;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
  border: 1px solid #E6E6E6;
  z-index: 202;
  background-size: contain;
  background-position: center;
}

.speaker-modal-info-wrapper {
  padding-top: 24px;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: 8;
}

/* Modal Text */
.speaker-modal-name {
  font-size: 24px;
  line-height: 32px;
  font-weight: bold;
}

.speaker-modal-job, .speaker-modal-company, .speaker-modal-description {
  font-size: 16px;
  line-height: 26px;
  text-align: left;
}

.speaker-modal-company {
  font-weight: 700;
}

.speaker-social-email {
  color: #121212;
  font-size: 12px;
}

.speaker-socials-wrapper {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 12px 0 8px;
  gap: 8px;
}

/* Modal Body */
.speaker-modal-body {
  padding: 24px 54px 56px;
  max-height: 450px;
  width: 100%;
  box-sizing: border-box;
  overflow-y: scroll;
  -webkit-mask-image: linear-gradient(rgba(0, 0, 0, 0) 5%, #121212 10%, #121212 85%, rgba(0, 0, 0, 0) 98%);
          mask-image: linear-gradient(rgba(0, 0, 0, 0) 5%, #121212 10%, #121212 85%, rgba(0, 0, 0, 0) 98%);
}

/* Modal Sessions */
.speaker-modal-session-list-header {
  font-weight: bold;
  padding-top: 18px;
  font-size: 20px;
  line-height: 28px;
}

.speaker-modal-sessions-list-wrapper {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  padding-top: 12px;
  gap: 24px;
}

.speaker-modal-session-wrapper {
  border-left: 1px solid #484848;
  padding: 8px 24px;
  width: calc(100% - 34px);
}

.speaker-modal-session-wrapper:last-child {
  border-bottom: none !important;
}

.speaker-modal-session-details-wrapper {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 24px;
  padding-bottom: 16px;
}

.speaker-modal-session-detail-item {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  font-weight: bold;
}

.speaker-modal-session-detail-time {
  text-transform: uppercase;
}

.speaker-modal-session-title {
  font-size: 20px;
  line-height: 28px;
}

.speaker-modal-session-title a {
  color: #121212;
  text-decoration: none;
  font-weight: 700;
  text-decoration: underline;
}

/* MODAL FOOTER */
.speaker-modal-footer {
  z-index: 99999;
  background-color: #FFFFFF;
  padding: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.speaker-modal-footer button {
  background-color: #121212;
  color: #FFFFFF;
  text-transform: uppercase;
  padding: 15px 38px;
  text-align: center;
  border: 1px solid #121212;
  border-radius: var(--global-border-radius);
  font-weight: 700;
}

/* Scroll prompt arrow */
.speaker-scroll-prompt-arrow {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: 24px;
  transition: opacity 0.4s ease;
  opacity: 0.6;
}

.speaker-scroll-prompt-arrow.at-bottom {
  opacity: 0;
}

.speaker-scroll-prompt-arrow svg {
  transform: rotate(90deg);
}

@media only screen and (max-width: 1080px) {
  .speaker-group:not(:first-child) {
    padding-top: 72px; /* Add top padding only to elements after the first */
  }
  /* Speaker Card */
  .speaker-item, .no-results-speaker-item {
    flex: 0 0 calc(30% - 26px);
  }
}
@media only screen and (max-width: 769px) {
  /* Speaker Card */
  .speaker-item, .no-results-speaker-item {
    flex: 0 0 40%;
  }
  .speaker-info {
    padding: 16px 16px 24px;
  }
  .speaker-info-name {
    font-size: 20px;
    line-height: 30px;
  }
  .speaker-modal-session-details-wrapper {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}
@media only screen and (max-width: 580px) {
  /* Block Wrapper */
  .speaker-module-wrapper {
    padding: 0 1.6rem;
  }
  /* Speaker Card */
  .speaker-item, .no-results-speaker-item {
    flex: 100%;
    display: flex;
    flex-direction: row;
    align-items: stretch;
  }
  .speaker-image-wrapper {
    max-width: 175px;
    border-radius: var(--global-border-radius) 0 0 var(--global-border-radius);
    overflow: unset;
  }
  .speaker-item img, .no-results-speaker-item img {
    max-width: 175px;
    border-radius: var(--global-border-radius) 0 0 var(--global-border-radius);
    flex: 1;
    height: 100%;
    max-height: unset;
  }
  .company-logo-overlay {
    border-bottom: 0;
    border-left: 1px solid #C0C0C0;
    border-top: 1px solid #C0C0C0;
    border-right: 1px solid #C0C0C0;
  }
  .speaker-info {
    padding: 10px 8px 8px 10px;
    flex: 2;
  }
  .speaker-info-job {
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    box-sizing: border-box;
    display: -webkit-box;
    -webkit-box-orient: vertical;
  }
  /* Speaker Modal */
  .speaker-modal-close svg {
    width: 24px;
    height: 24px;
  }
  .speaker-modal-header-content-wrapper {
    padding: 24px 24px 10px;
  }
  .speaker-modal-image {
    width: 180px;
  }
  .speaker-modal-info-wrapper {
    padding-top: 8px;
  }
  .speaker-modal-body {
    padding: 24px 24px 56px;
  }
  .speaker-modal-job, .speaker-modal-company, .speaker-modal-description {
    font-size: 14px;
    line-height: 22px;
    text-align: left;
  }
}
@media only screen and (max-width: 500px) {
  /* Modal */
  .speaker-modal-header-content-wrapper {
    padding: 34px 24px 18px;
    margin-bottom: unset;
  }
  .speaker-modal-image {
    width: 120px;
  }
  .speaker-modal-info-wrapper {
    padding-top: 0px;
  }
  .speaker-modal-body {
    padding: 5px 24px 56px;
    -webkit-mask-image: linear-gradient(rgba(0, 0, 0, 0) 2%, #121212 5%, #121212 85%, rgba(0, 0, 0, 0) 98%);
            mask-image: linear-gradient(rgba(0, 0, 0, 0) 2%, #121212 5%, #121212 85%, rgba(0, 0, 0, 0) 98%);
  }
}

/*# sourceMappingURL=style-index.css.map*/