/**
  Theme Name: Guideline Central Theme
  Theme URI: https://www.guidelinecentral.com/
  Author: James Pham
  Description: Isolated styling for search.php (results, filter sidebar, etc.)
  Version: 0.1
  Updated: 5/14/2021

  Table of Contents:
    1.0 || VARIABLES (SCSS only)
    2.0 || LANDING SEARCH
    3.0 || SEARCH RESULTS (MAIN CONTENT)
        3.1 - CALCULATOR RESULTS
            3.1.1 - NEW CALCULATOR
    5.0 || SIDE BAR FILTERING
*/
/*******************
 * 1.0 - VARIABLES *
 *******************/
.loading-splash {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 100;
  background-color: rgba(255, 255, 255, 0.75);
  backdrop-filter: blur(4px);
}
.loading-splash > div {
  position: absolute;
  top: 200px;
  left: 50%;
  transform: translateX(-50%);
  color: #175169;
}
.loading-splash .gc-loader {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.loading-splash .gc-loader .container {
  width: 200px;
  height: 200px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.5);
  margin: auto;
  filter: url("#goo");
  animation: rotate-move 1.5s ease-in-out infinite;
}
.loading-splash .gc-loader .container .dot {
  width: 70px;
  height: 70px;
  border-radius: 5%;
  background-color: #000;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.loading-splash .gc-loader .container .dot.dot-4 {
  background-color: #D43045;
  animation: dot-4-move 1.5s ease infinite, index 6s ease infinite;
}
.loading-splash .gc-loader .container .dot.dot-3 {
  background-color: #1D8FBB;
  animation: dot-3-move 1.5s ease infinite, index 6s -6s ease infinite;
}
.loading-splash .gc-loader .container .dot.dot-2 {
  background-color: #6FAF58;
  animation: dot-2-move 1.5s ease infinite, index 6s -4s ease infinite;
}
.loading-splash .gc-loader .container .dot.dot-1 {
  background-color: #5C5C5C;
  animation: dot-1-move 1.5s ease infinite, index 6s -2s ease infinite;
}

@keyframes dot-4-move {
  20% {
    transform: scale(1);
  }
  45% {
    transform: translateY(18px) scale(0.45);
  }
  60% {
    transform: translateY(90px) scale(0.45);
  }
  80% {
    transform: translateY(90px) scale(0.45);
  }
  100% {
    transform: translateY(0px) scale(1);
  }
}
@keyframes dot-3-move {
  20% {
    transform: scale(1);
  }
  45% {
    transform: translateY(-18px) scale(0.45);
  }
  60% {
    transform: translateY(-90px) scale(0.45);
  }
  80% {
    transform: translateY(-90px) scale(0.45);
  }
  100% {
    transform: translateY(0px) scale(1);
  }
}
@keyframes dot-2-move {
  20% {
    transform: scale(1);
  }
  45% {
    transform: translateX(18px) scale(0.45);
  }
  60% {
    transform: translateX(90px) scale(0.45);
  }
  80% {
    transform: translateX(90px) scale(0.45);
  }
  100% {
    transform: translateY(0px) scale(1);
  }
}
@keyframes dot-1-move {
  20% {
    transform: scale(1);
  }
  45% {
    transform: translateX(-18px) scale(0.45);
  }
  60% {
    transform: translateX(-90px) scale(0.45);
  }
  80% {
    transform: translateX(-90px) scale(0.45);
  }
  100% {
    transform: translateY(0px) scale(1);
  }
}
@keyframes rotate-move {
  55% {
    transform: translate(-50%, -50%) scale(0.5) rotate(0deg);
  }
  80% {
    transform: translate(-50%, -50%) scale(0.5) rotate(360deg);
  }
  100% {
    transform: translate(-50%, -50%) scale(0.5) rotate(360deg);
  }
}
@keyframes index {
  0%, 100% {
    z-index: 3;
  }
  33.3% {
    z-index: 2;
  }
  66.6% {
    z-index: 1;
  }
}
.alert-info {
  background-color: rgba(0, 85, 150, 0.125);
  border-color: rgba(0, 85, 150, 0.5);
  padding: 1em;
}
.alert-info p:last-of-type {
  margin-bottom: 0;
}

/*************************
 * 2.0 || LANDING SEARCH *
 *************************/
div.landing-search input#landing-search-box::placeholder {
  color: grey;
  font-style: italic;
}

/***************************************
 * 3.0 - SEARCH RESULTS (MAIN CONTENT) *
 ***************************************/
div#main-content div.guidelines-landing-windows, div#main-content div.calcs-landing-windows, div#main-content div.results {
  /****************************
   * 3.1 - CALCULATOR RESULTS *
   ****************************/
  /**************************
   * 3.1.1 - NEW CALCULATOR *
   **************************/
}
div#main-content div.guidelines-landing-windows h1, div#main-content div.guidelines-landing-windows h2, div#main-content div.guidelines-landing-windows h3, div#main-content div.guidelines-landing-windows h4, div#main-content div.guidelines-landing-windows h5, div#main-content div.guidelines-landing-windows h6, div#main-content div.calcs-landing-windows h1, div#main-content div.calcs-landing-windows h2, div#main-content div.calcs-landing-windows h3, div#main-content div.calcs-landing-windows h4, div#main-content div.calcs-landing-windows h5, div#main-content div.calcs-landing-windows h6, div#main-content div.results h1, div#main-content div.results h2, div#main-content div.results h3, div#main-content div.results h4, div#main-content div.results h5, div#main-content div.results h6 {
  font-family: "Roboto", sans-serif !important;
}
div#main-content div.guidelines-landing-windows span.new-badge, div#main-content div.calcs-landing-windows span.new-badge, div#main-content div.results span.new-badge {
  color: #dbbf6e;
  background: #f2e9c8;
  font-size: 0.9rem;
}
div#main-content div.guidelines-landing-windows a.spec-new-link, div#main-content div.calcs-landing-windows a.spec-new-link, div#main-content div.results a.spec-new-link {
  color: #5E90A9;
}

/***************************************
 * 4.0 - GLOBAL SEARCH BODY *
 ***************************************/
#search-main .search-result span.ct-highlight {
  font-weight: bold;
  color: #1D8FBB;
  font-style: italic;
}
#search-main .search-result span.ct-status {
  color: #E2A856;
  color: var(--status-color);
  border: 1px solid;
  padding: 0.25em;
  font-size: 14px;
  display: inline-block;
  vertical-align: middle;
  border-radius: 0.25em;
  line-height: 1;
  font-weight: bold;
  font-family: "Roboto", sans-serif !important;
  margin: 0;
  white-space: nowrap;
}
#search-main .search-result span.ct-tag {
  color: #888;
  background: #E8E8E8;
  font-family: "Open Sans", sans-serif;
  font-size: 0.9em;
}
#search-main .search-result span.ct-tag.ct-healthy {
  color: #E2A856;
  background: rgba(226, 168, 86, 0.15);
  float: right;
}

/***************************************
 * 5.0 - SIDE BAR FILTERING *
 ***************************************/
#left-column #applied-filters-area .custom-control.custom-input {
  padding: 1em 0 0;
}
#left-column #applied-filters-area .custom-control.custom-input label {
  display: block;
  margin: 0;
}
#left-column #applied-filters-area .custom-control.custom-input input {
  display: block;
  padding: 0.5em;
}
#left-column #applied-filters-area .custom-control.custom-input input::placeholder {
  font-style: italic;
  color: #888888;
}

.modal-dialog {
  min-height: calc(100vh - 100px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: auto;
}
