/*
Theme Name: CTBUH Regional Theme
Theme URI: https://wordpress.org/themes/twentytwentyfour/
Author: the WordPress team
Author URI: https://wordpress.org
Description: Twenty Twenty-Four is designed to be flexible, versatile and applicable to any website. Its collection of templates and patterns tailor to different needs, such as presenting a business, blogging and writing or showcasing work. A multitude of possibilities open up with just a few adjustments to color and typography. Twenty Twenty-Four comes with style variations and full page designs to help speed up the site building process, is fully compatible with the site editor, and takes advantage of new design tools introduced in WordPress 6.4.
Requires at least: 6.4
Tested up to: 6.6
Requires PHP: 7.0
Version: 1.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfour
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

.heading-shadow {
  text-shadow: 5px 5px 5px rgb(15, 15, 15);
}

a:focus {
  outline: none;
}

.sponsors-container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  padding-bottom: 30px;
}

/* ***************************** */
/* SESSIONS PROGRAM TEMPLATE CSS */
/* ***************************** */

.program-content a {
  color: #005cb9 !important;
  text-decoration: none;
}

.program-content a:active {
  color: #005cb9 !important;
}

.program-content > a:focus {
  text-decoration: none !important;
}

.blockWidth {
  max-width: 1080px;
  margin-left: auto !important;
  margin-right: auto !important;
}

.menuPanel {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.5em;
  margin-bottom: 1.5em;
  justify-content: space-between;
}

#searchbox {
  flex-grow: 2;
}

#loading-indicator {
  display: flex;
  justify-content: center;
}

.pulse-container {
  display: flex;
  align-items: center;
  height: 50vh;
  justify-content: center;
}

.pulse {
  display: inline-block;
  position: relative;
  width: 100px;
  height: 100px;
}

.pulse svg {
  animation: rotate 2s linear infinite;
  transform-origin: center;
}

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.pulse-container svg {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}

.input:focus-visible {
  outline: none;
}

.resetIcon {
  margin-left: -40px;
}

.header-menu {
  /* position: sticky;
    top: .01rem; */
  background-color: white;
  padding: 10px 0 0 0;
}

#day-select:has(> div[hidden]),
#track-select:has(> div[hidden]),
#city-select:has(> div[hidden]) {
  display: none;
}

#day-select,
#track-select,
#city-select {
  flex: 1;
}

.legend {
  display: flex;
  flex-direction: row;
  /*flex-wrap: wrap;*/
  column-gap: 20px;
  text-align: center;
  margin: 1.5em 0;
  font-size: 16px;
}

#colorLegend > div {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  column-gap: 20px;
  row-gap: 10px;
  text-align: center;
  margin: 1.5em 0;
  font-size: 16px;
}

.legend > div {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.legend > ul {
  display: inline-block;
}

.legend > ul > li {
  list-style-type: none;
  position: relative;
}

.legend > ul > li::before {
  content: "●" !important;
  position: absolute !important;
  left: -0.8em !important;
  /* Adjust this value so that it appears where you want. */
  font-size: 1.1em !important;
  /* Adjust this value so that it appears what size you want. */
}

.legend-hr {
  height: 2px;
  border: none;
  background-color: #969696;
}

.categoryCircle {
  height: 15px;
  width: 15px;
  border-radius: 50%;
  display: inline-block;
}

#coreConference,
#socialEvent,
#workshop,
#offsite,
#break {
  height: 25px;
  width: 25px;
  border-radius: 50%;
  display: inline-block;
}

#coreConference {
  background-color: #da121a;
}

#socialEvent {
  background-color: #21468b;
}

#workshop {
  background-color: #62c1a8;
  display: none;
}

#offsite {
  background-color: #86a53f;
}

#break {
  background-color: #971885;
}

#hits a {
  color: #da121a !important;
  text-decoration: none;
}

#hits a:active {
  color: #da121a !important;
}

#hits > a:focus {
  text-decoration: none !important;
}

.item {
  /* border: 1px solid #000;
  border-radius: 5px;
  margin-top: 10px; */
  margin-bottom: 0.6rem;
  /* padding: 10px; */
}

.session-card {
  display: flex;
  /*grid-template-columns: 110px 1fr;*/
  background-color: #f4f4f4;
  align-items: center;
}

.workshop-fund {
  height: 50px;
  width: 150px;
  object-fit: contain;
}

.section-header {
  color: #343434;
  text-transform: uppercase;
  font-size: 16px;
  margin-bottom: 0;
}

.presentationCard {
  width: 100%;
  padding-bottom: 20px;
  /* padding-top: 10px; */
  border-bottom: 3px solid #f4f4f4;
}

.section-header:has(+ .presentationCard) {
  margin-bottom: 0;
}

.person-card {
  display: flex;
  gap: 10px;
}

.person-card:not(:last-child) {
  margin-bottom: 10px;
}

.person-card p {
  margin-top: 0;
  line-height: normal;
}

.person-card .person-name {
  font-weight: bold;
}

.person-title {
  color: #343434;
  font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.227), 1rem);
}

.person-card .person-title {
  color: #343434;
  font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.227), 1rem);
}

.person-card img {
  object-fit: cover;
  height: 90px;
  width: 90px;
}

.chair .person-card {
  margin-top: 20px;
}

.presentation-name {
  font-size: 18px;
  font-weight: bold;
  line-height: 1.4;
  margin: 10px 0 10px;
}

.dayHeader {
  font-size: clamp(18.75px, 1.172rem + ((1vw - 7.68px) * 0.751), 25px);
  font-weight: 600;
}

.accordion {
  cursor: pointer;
  transition: 0.4s;
}

.active-panel,
.accordion:hover {
  background-color: #ccc;
}

.accordion.active-panel {
  background-color: #ccc;
}

.accordion-body {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.2s ease-out;
}

.accordion-controls {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.accordion-controls {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.favoriteIcon {
  display: flex;
  align-items: center;
}

.favorite-false .favoriteIcon {
  display: none;
}

.down-arrow {
  display: none;
  transition: 0.4s;
}

.right-arrow {
  display: flex;
}

.session-color {
  color: white;
  /* padding: 5px 5px; */
  text-align: center;
  /* font-size: clamp(0.9rem, 4vw, 1.1rem); */
  width: 15px;
  font-weight: bold;
  align-self: stretch;
  display: flex;
  justify-content: center;
  align-items: center;
}

.session-name {
  padding: 0 10px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.session-name .session-heading,
.session-name .session-time {
  font-weight: bold;
}

.session-title {
  line-height: normal;
}

.session-time {
  color: #4e4e4e;
}

.session-body {
  border-right: 3px solid #ccc;
  border-left: 3px solid #ccc;
  border-bottom: 3px solid #ccc;
  /* display: none; */
  padding: 10px;
}

.session-body button {
  align-items: center;
}

.session-head {
  display: flex;
  gap: 15px;
}

.hit-image-container {
  flex: 30%;
}

.hit-image-container > img {
  width: 100%;
}

.session-about {
  flex: 70%;
}

.session-time-location p {
  margin-top: 0;
  font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.227), 1rem);
  color: #343434;
}

.heroicons-flex {
  display: flex;
  align-items: center;
  gap: 10px;
}

.sponsor {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.sponsor p {
  font-size: 12px;
}

.sponsor-flex {
  display: flex;
  align-items: center;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px;
}

.right-flex,
.sponsor-flex {
  flex: 1;
}

.chair {
  padding-bottom: 20px;
}

.chair .person-card {
  margin-top: 20px;
}

.presentations-container {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

select {
  appearance: none;
}

.custom-select {
  color: #101010;
  border: 1px solid #9f9f9f;
  background-color: #ffffff;
  border-radius: 0;
  width: 100%;
  padding: 10px 2.5rem 10px 1rem;
  background-image: url("https://s3.us-east-1.amazonaws.com/cloud.ctbuh.org/conference/down-arrow.png");
  background-repeat: no-repeat;
  background-size: 12px 7px;
  background-position: 92% 50%;
}

.custom-option {
  /*background-color: #0c5460;*/
  margin: 10px;
  border: 1px solid #9f9f9f;
  border-radius: 0;
  font-family: ProximaNova-Regular, "Helvetica Neue", Helvetica, Arial,
    sans-serif;
}

.clearRefinementBtn {
  border: 1px solid #9f9f9f !important;
  padding: 10px 2rem !important;
  background-color: #e6f8ff !important;
  font-size: 13.3333px !important;
}

.disabledRefinementBtn {
  background-color: #ffffff !important;
}

.ais-SearchBox {
  position: relative;
}

.ais-SearchBox-form {
  display: flex;
  align-items: center;
}

.ais-SearchBox-input {
  padding-left: 36px; /* Adjust this value based on your icon size */
  padding-top: 10px;
  padding-bottom: 10px;
  width: 100%;
  border: 1px solid #9f9f9f;
}

.ais-SearchBox-submit {
  position: absolute;
  left: 10px; /* Adjust for desired spacing from the left edge */
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
}

.ais-SearchBox-submitIcon {
  width: 15px; /* Adjust size as needed */
  height: 15px;
  fill: #777; /* Adjust color as needed */
}

.ais-HitsPerPage-select {
  padding: 10px 2rem 10px 0.3rem;
  border: 1px solid #9f9f9f;
  background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27%3E%3Cpath d=%27M0 7.3l2.8-2.8 9.2 9.3 9.2-9.3 2.8 2.8-12 12.2z%27 fill%3D%22%233A4570%22 /%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 10px 10px;
  background-position: 92% 50%;
}

/* ***************************** */
/* SPEAKERS PROGRAM TEMPLATE CSS */
/* ***************************** */

ol.ais-Hits-list {
  list-style-type: none;
  padding-left: 0;
}

.ais-Hits-list {
  /* background-color: #0e57a5; */
  display: grid;
  grid-template-columns: repeat(auto-fill, 180px);
  /* flex-wrap: wrap; */
  justify-content: space-between;
  column-gap: 1em;
  row-gap: 1em;
}

.speaker-panel {
  margin-top: 1em;
  margin-bottom: 1em;
}

.speaker {
  display: flex;
  flex-direction: column;
  text-align: center;
  /* border: 1px solid salmon; */
}

.itemImg {
  width: 100%;
  object-fit: cover;
  height: 180px;
  display: block;
}

.speaker-text {
  margin-top: 6px;
  margin-bottom: 17.6px;
}

.speaker-text > p {
  margin: 12px 0 12px;
}

.speaker-text span:first-child {
  font-weight: bold;
}

a.speakerLink {
  color: #da121a !important;
  text-decoration: none;
  font-weight: bold;
}

a.speakerLink:active {
  color: #101010;
}

a.speakerLink:focus {
  text-decoration: none;
}

.abstract-title {
  font-size: 0.8em;
}

.abstract-title > a {
  color: #3697b9;
  text-decoration: none;
}

/* MOBILE */
@media screen and (max-width: 540px) {
  .blockWidth {
    padding-right: var(--wp--style--root--padding-right);
    padding-left: var(--wp--style--root--padding-left);
  }

  .menuPanel {
    gap: 0.5em;
    margin-bottom: 0;
  }

  #searchbox {
    flex-basis: 100%;
  }

  .header-menu {
    top: 0.01rem;
    padding: 0.3em 0 0 0;
  }

  #day-select:has(> div[hidden]),
  #track-select:has(> div[hidden]),
  #city-select:has(> div[hidden]) {
    display: none;
  }

  #day-select,
  #track-select,
  #city-select {
    flex: 0 0 100%;
  }

  .legend {
    font-size: 12px;
  }

  .legend > div {
    align-items: flex-start;
  }

  .presentations-container {
    grid-template-columns: 1fr;
  }

  .session-head {
    display: flex;
    flex-wrap: wrap;
  }

  .sponsor-text {
    font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.227), 1rem);
    color: #4e4e4e;
    font-weight: normal;
  }

  .track-tag {
    border: 1px solid #4e4e4e;
    border-radius: 5px;
    padding: 0 0.5rem;
    font-size: clamp(0.75rem, 0.75rem + ((1vw - 0.2rem) * 0.133), 0.875rem);
    color: #4e4e4e;
  }

  .custom-select {
    width: 100%;
  }

  .ais-Hits-list {
    justify-content: center;
  }
}