.searchPage__form {
margin-bottom: 16px;
}
.searchPage__form > label {
display: inline-block;
font-size: 14px;
font-weight: 400;
line-height: 19px;
margin-bottom: 2px;
color: var(--text-color-light);
}
.searchPage__form-input-wrap {
position: relative;
}
.searchPage__form-input-wrap > input {
padding: 14px 14px;
width: 100%;
border: 1px solid var(--border-main-color);
background-color: inherit;
font-size: 16px;
font-weight: 300;
color: var(--text-color-black);
transition: var(--default-transition);
}
.searchPage__form-input-wrap > input:focus
{
border-color: var(--accent-red-main);
outline: none;
}
.searchPage__form-input-wrap > button {
position: absolute;
display: block;
mask-image: url(//clinicred.ru/wp-content/themes/clinicred/assets/img/svg/search-icon.svg);
mask-position: center;
mask-repeat: no-repeat;
background-color: #000;
width: 20px;
height: 20px;
right: 15px;
top: 15px;
z-index: 2;
transition: var(--default-transition);
}
.searchPage__form-input-wrap > button:hover {
background-color: var(--accent-red-main);
}
.searchPage__results-sub span {
font-size: 16px;
font-weight: 300;
color: var(--text-color-light);
}
.searchPage__results-sub {
margin-bottom: 30px;
}
.searchPage__results-list {
display: flex;
flex-direction: column;
row-gap: 20px;
margin-bottom: 50px;
}
.searchPage__result-item {
display: flex;
flex-direction: column;
padding: 25px 25px;
border: 1px solid var(--border-main-color);
transition: var(--default-transition);
}
.searchPage__result-item:hover {
border-color: var(--accent-red-main);
}
.searchPage__result-item > h3 {
margin-top: 0;
margin-bottom: 8px;
font-size: 22px;
font-weight: 400;
color: var(--text-color-black);
transition: var(--default-transition);
}
.searchPage__result-item:hover > h3 {
color: var(--text-color-red);
}
.searchPage__result-item > p {
margin-top: 0;
margin-bottom: 16px;
font-size: 18px;
line-height: 140%;
font-weight: 300;
color: var(--text-color-main);
}
.searchPage__result-item > span {
display: inline-flex;
align-items: center;
width: fit-content;
font-size: 15px;
font-weight: 500;
color: var(--text-color-black);
transition: var(--default-transition);
}
.searchPage__result-item > span:hover {
color: var(--text-color-red);
}
.searchPage__result-item > span::after {
display: block;
content: "";
background: url('data:image/svg+xml;charset=utf-8,%3Csvg xmlns="http://www.w3.org/2000/svg" width="19" height="19" viewBox="0 0 19 19" fill="none"%3E%3Cpath d="M6.08301 13.25L13.583 5.75" stroke="%23B62D35" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M6.08301 5.75H13.583V13.25" stroke="%23B62D35" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round" /%3E%3C/svg%3E')
no-repeat center center;
width: 18px;
height: 18px ;
}
@media(max-width:992px) {
.searchPage__form{
margin-bottom: 12px;
}
.searchPage__form-input-wrap > input {
font-size: 15px;
padding: 12px 14px;
}
.searchPage__form-input-wrap > button {
top: 11px;
}
.searchPage__results-list {
margin-bottom: 40px;
}
.searchPage__results-sub span {
font-size: 15px;
}
.searchPage__result-item {
padding: 20px 24px;
}
.searchPage__result-item > h3 {
font-size: 19px;
}
.searchPage__result-item > p {
margin-bottom: 12px;
}
}