@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.tm-google-places-signup {
  display: flex;
  gap: 16px;
  width: 100%;
  max-width: 587px;
}

/**
 * Input
 */

.tm-google-places-signup-input {
  flex: 1;
  position: relative;
  z-index: 3;
}
.tm-google-places-signup .tm-google-places-signup-input input[type='text'] {
  display: block;
  width: 100%;
  border: 1px solid #dce0e4;
  padding: 14px 22px 14px 50px;
  box-shadow: 0px 8px 16px rgba(53, 131, 190, 0.24);
  border-radius: 8px;
  font-size: 15px;
  line-height: 26px;
  color: #000000;
  background: #fff;
  box-sizing: border-box;
  height: auto;
}
.tm-google-places-signup.error .tm-google-places-signup-input input[type='text'] {
  box-shadow: 0 0 0 2px tomato;
}
.tm-google-places-signup-input:before {
  content: '';
  position: absolute;
  top: 20px;
  left: 18px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352c79.5 0 144-64.5 144-144s-64.5-144-144-144S64 128.5 64 208s64.5 144 144 144z'/%3E%3C/svg%3E%0A");
  width: 16px;
  height: 16px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  pointer-events: none;
}
.tm-google-places-signup.loading:not(.error) .tm-google-places-signup-input:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cdefs%3E%3Cstyle%3E.fa-secondary%7Bopacity:.4%7D%3C/style%3E%3C/defs%3E%3Cpath class='fa-primary' d='M256 32C256 14.33 270.3 0 288 0C429.4 0 544 114.6 544 256C544 302.6 531.5 346.4 509.7 384C500.9 399.3 481.3 404.6 465.1 395.7C450.7 386.9 445.5 367.3 454.3 351.1C470.6 323.8 480 291 480 255.1C480 149.1 394 63.1 288 63.1C270.3 63.1 256 49.67 256 31.1V32z'/%3E%3Cpath class='fa-secondary' d='M287.1 64C181.1 64 95.1 149.1 95.1 256C95.1 362 181.1 448 287.1 448C358.1 448 419.3 410.5 452.9 354.4L453 354.5C446.1 369.4 451.5 387.3 465.1 395.7C481.3 404.6 500.9 399.3 509.7 384C509.9 383.7 510.1 383.4 510.2 383.1C466.1 460.1 383.1 512 288 512C146.6 512 32 397.4 32 256C32 114.6 146.6 0 288 0C270.3 0 256 14.33 256 32C256 49.67 270.3 64 288 64H287.1z'/%3E%3C/svg%3E");
  animation-name: spin;
  animation-duration: 1000ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

.tm-google-places-signup.error .tm-google-places-signup-input:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='tomato' d='M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7 .2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8 .2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24V296c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224c0-17.7-14.3-32-32-32s-32 14.3-32 32s14.3 32 32 32s32-14.3 32-32z'/%3E%3C/svg%3E");
}

/**
 * Results
 */

.tm-google-places-signup-results {
  position: absolute;
  top: 100%;
  width: 100%;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0px 8px 16px rgba(53, 131, 190, 0.4);
  box-sizing: border-box;
  max-height: 300px;
  overflow: auto;
  display: none;
}

.tm-google-places-signup.results .tm-google-places-signup-results {
  display: block;
}

.tm-google-places-signup-result {
  display: block;
  width: 100%;
  padding: 8px 8px 8px 50px;
  font-size: 14px;
  line-height: 22px;
  color: #212b36;
  position: relative;
  background: none;
  text-align: left;
  border: none;
  cursor: pointer;
}

.tm-google-places-signup-result:hover {
  background: #efefef;
}

.tm-google-places-signup-result.selected {
  background: #f4f4f4;
}

.tm-google-places-signup-result span {
  display: block;
}

.tm-google-places-signup-result:before {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 18px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath fill='%233583be' d='M215.7 499.2C267 435 384 279.4 384 192C384 86 298 0 192 0S0 86 0 192c0 87.4 117 243 168.3 307.2c12.3 15.3 35.1 15.3 47.4 0zM192 256c-35.3 0-64-28.7-64-64s28.7-64 64-64s64 28.7 64 64s-28.7 64-64 64z'/%3E%3C/svg%3E");
  width: 16px;
  height: 16px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  pointer-events: none;
}

.tm-google-places-signup-result .tm-address {
  color: #919eab;
}

/**
 * Button
 */
.tm-google-places-signup-button {
  margin: 0 auto;
}
.tm-google-places-signup .tm-google-places-signup-button a {
  display: block;
  padding: 15px 22px;
  background: linear-gradient(135deg, #ffe599 0%, #ffbf00 100%);
  box-shadow: 0px 8px 16px rgba(53, 131, 190, 0.24);
  border-radius: 8px;
  text-decoration: none;
  font-size: 15px;
  line-height: 26px;
  color: #000000;
  font-weight: 600;
}

.tm-google-places-signup .tm-google-places-signup-button a.is-disabled {
  cursor: default;
  opacity: 0.8;
}

.tm-google-places-signup .tm-google-places-signup-button a:not(.is-disabled):hover {
  background: #ffbf00;
  box-shadow: 0px 4px 8px rgba(53, 131, 190, 0.24);
}

@media screen and (max-width: 500px) {
  .tm-google-places-signup {
    flex-direction: column;
  }
}