/*
|--------------------------------------------------------------------------
| Search form
|--------------------------------------------------------------------------
*/

.mf-search-form{
    width:100%;
}

.mf-search-form__inner{
    display:flex;

    gap:.75rem;
}

.mf-search-form__field{
    flex:1;

    min-width:0;

    padding:.85rem 1rem;

    border:1px solid rgba(0,0,0,.15);
    border-radius:var(--mf-radius);

    background:var(--mf-light);

    color:var(--mf-dark);

    font:inherit;

    outline:none;

    transition:
        border-color .25s ease,
        box-shadow .25s ease;
}

.mf-search-form__field:focus{
    border-color:var(--mf-primary);

    box-shadow:
        0 0 0 3px rgba(37,99,235,.15);
}

.mf-search-form__button{
    padding:.85rem 1.25rem;

    border:0;
    border-radius:var(--mf-radius);

    background:var(--mf-primary);

    color:var(--mf-light);

    font:inherit;
    font-weight:600;

    cursor:pointer;

    transition:
        transform .2s ease,
        opacity .2s ease;
}

.mf-search-form__button:hover{
    opacity:.9;
}

.mf-search-form__button:focus-visible,
.mf-search-form__field:focus-visible{
    outline:2px solid var(--mf-primary);
    outline-offset:2px;
}

.mf-search-panel .mf-search-form__field{
    border-color:rgba(255,255,255,.25);
}

.mf-search-panel .mf-search-form__field:focus{
    border-color:var(--mf-light);

    box-shadow:
        0 0 0 3px rgba(255,255,255,.12);
}

@media (max-width:767px){

    .mf-search-form__inner{
        flex-direction:column;
    }

    .mf-search-form__button{
        width:100%;
    }

}