.search-form {
    padding: 30px 0;
    background-color: var(--color-turquoise-t500);
}

.search-form__wrapper {
    max-width: 1648px;
    margin: 0 4.44%;
    display: grid;
    grid-template-columns: 1fr max-content;
    align-items: center;
    gap: 10px;
}

@media (min-width: 1600px) {
    .search-form__wrapper {
        margin-left: 6.66%;
        margin-right: 6.66%;
    }
}

@media (min-width: 1921px) {
    .search-form__wrapper {
        margin-left: auto;
        margin-right: auto;
    }
}

.search-form__form {
    display: grid;
    grid-template-columns: 1fr max-content;
    border-radius: 10px;
    overflow: hidden;
}

.search-form__form input {
    font-size: 18px;
    color: var(--color-neutral-n500);
}

.search-form__input {
    padding: 17px 20px;
    display: block;
    border: none;
}

.search-form__input:focus,
.search-form__input:focus-visible {
    border: none;
    outline: none;
}

.search-form__submit {
    display: block;
    padding: 17px 20px;
    border: none;
    background-color: yellow;
}

.search-form__close-btn {
    display: block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 2px solid yellow;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M19.207 6.207a1 1 0 0 0-1.414-1.414L12 10.586 6.207 4.793a1 1 0 0 0-1.414 1.414L10.586 12l-5.793 5.793a1 1 0 1 0 1.414 1.414L12 13.414l5.793 5.793a1 1 0 0 0 1.414-1.414L13.414 12l5.793-5.793z' fill='%23ffff00'/%3E%3C/svg%3E");
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
/* Content may be protected by copyright. */
/*
playback timings (ms):
  capture_cache.get: 0.416
  load_resource: 102.565
  PetaboxLoader3.resolve: 38.98
  PetaboxLoader3.datanode: 62.76
*/