/*
 * Filtro V4 — PsicoApp
 * Cabeçalho dentro do card, campos sem rótulos e chips refinados.
 */

.mp-marketplace .mp-filtros-wrapper {
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
    max-width: 1000px;
    margin: 0 auto 34px;
    padding: 34px 40px 40px;
    background: #ffffff;
    border-radius: 24px;
    box-shadow: 0 14px 34px rgba(15, 28, 55, 0.08);
}

.mp-marketplace .mp-filtros-wrapper::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, #00357a 0%, #38b6ff 100%);
    pointer-events: none;
}

.mp-marketplace .mp-filtros-cabecalho {
    width: 100%;
    margin: 0 auto 10px;
    text-align: center;
}

.mp-marketplace .mp-filtros-cabecalho h1 {
    margin: 0 0 10px;
    color: #00357a;
    font-family: "Nunito", sans-serif;
    font-size: clamp(30px, 3vw, 34px);
    font-weight: 800;
    line-height: 1.18;
    letter-spacing: -0.35px;
}

.mp-marketplace .mp-filtros-cabecalho p {
    width: 100%;
    max-width: none;
    margin: 0 auto;
    color: #5b7698;
    font-family: "Nunito", sans-serif;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.6;
    white-space: nowrap;
}

.mp-marketplace .mp-filtros {
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}


.mp-filtros {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    align-items: start;
}

.mp-campo {
    min-width: 0;
}

.mp-campo-publico,
.mp-campo-especialidade {
    position: relative;
}

.mp-campo-nome,
.mp-acoes-filtro {
    grid-column: 1 / -1;
}

.mp-campo label {
    display: block;
    margin: 0 0 8px;
    color: #0f1c37;
    font-family: "Poppins", "Lato", sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
}

/* Caixas dos filtros múltiplos */
.mp-publico-box,
.mp-especialidade-box {
    position: relative;
}

.mp-publico-input,
.mp-especialidade-input {
    box-sizing: border-box;
    width: 100%;
    min-height: 54px;
    padding: 9px 44px 9px 14px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    background: #ffffff;
    border: 1px solid #d9e2ec;
    border-radius: 18px;
    box-shadow: 0 4px 14px rgba(15, 28, 55, 0.04);
    cursor: pointer;
    outline: none;
    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease;
}

.mp-publico-input::after,
.mp-especialidade-input::after {
    content: "";
    position: absolute;
    right: 19px;
    top: 24px;
    width: 8px;
    height: 8px;
    border-right: 2px solid #6f7d91;
    border-bottom: 2px solid #6f7d91;
    transform: rotate(45deg);
    transition: transform 0.2s ease, top 0.2s ease;
    pointer-events: none;
}

.mp-publico-input:hover,
.mp-especialidade-input:hover {
    border-color: #9ecdf0;
}

.mp-publico-input:focus,
.mp-especialidade-input:focus,
.mp-publico-input[aria-expanded="true"],
.mp-especialidade-input[aria-expanded="true"] {
    border-color: #38b6ff;
    box-shadow:
        0 0 0 4px rgba(56, 182, 255, 0.12),
        0 8px 22px rgba(15, 28, 55, 0.07);
}

.mp-publico-input[aria-expanded="true"]::after,
.mp-especialidade-input[aria-expanded="true"]::after {
    top: 28px;
    transform: rotate(225deg);
}

/* Placeholders */
.mp-placeholder {
    color: #7c8799;
    font-family: "Poppins", "Lato", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    user-select: none;
}

/* Chips */
.mp-tag {
    box-sizing: border-box;
    min-height: 29px;
    max-width: 100%;
    padding: 4px 5px 4px 11px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    overflow: hidden;
    background: #edf7ff;
    color: #00357a;
    border: 1px solid #c7e7fb;
    border-radius: 999px;
    font-family: "Poppins", "Lato", sans-serif;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.2;
    animation: mp-chip-entrada 0.18s ease;
}

.mp-tag > span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mp-tag .remover {
    box-sizing: border-box;
    width: 19px;
    height: 19px;
    min-width: 19px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    color: #5b7698;
    border: 0;
    border-radius: 50%;
    font-family: Arial, sans-serif;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    transition:
        background-color 0.18s ease,
        color 0.18s ease,
        transform 0.18s ease;
}

.mp-tag .remover:hover,
.mp-tag .remover:focus-visible {
    background: rgba(0, 53, 122, 0.1);
    color: #00357a;
    transform: scale(1.06);
    outline: none;
}

/* Dropdowns */
.mp-dropdown {
    box-sizing: border-box;
    position: absolute;
    z-index: 100;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    max-height: 270px;
    padding: 7px;
    overflow-y: auto;
    visibility: hidden;
    opacity: 0;
    transform: translateY(-5px);
    pointer-events: none;
    background: #ffffff;
    border: 1px solid #dbe7f0;
    border-radius: 16px;
    box-shadow: 0 16px 38px rgba(15, 28, 55, 0.14);
    transition:
        opacity 0.18s ease,
        transform 0.18s ease,
        visibility 0.18s ease;
}

.mp-dropdown.aberto {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.mp-item-publico,
.mp-item-especialidade {
    padding: 11px 13px;
    color: #0f1c37;
    border-radius: 10px;
    font-family: "Poppins", "Lato", sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    cursor: pointer;
    transition:
        background-color 0.16s ease,
        color 0.16s ease,
        padding-left 0.16s ease;
}

.mp-item-publico:hover,
.mp-item-especialidade:hover,
.mp-item-publico:focus-visible,
.mp-item-especialidade:focus-visible {
    padding-left: 16px;
    background: #edf7ff;
    color: #00357a;
    outline: none;
}

.mp-item-publico[aria-selected="true"],
.mp-item-especialidade[aria-selected="true"],
.mp-item-publico.mp-item-selecionado,
.mp-item-especialidade.mp-item-selecionado {
    display: none;
}

/* Pesquisa por nome em formato de cápsula */
.mp-nome-capsula {
    position: relative;
}

.mp-icone-busca {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 18px;
    width: 19px;
    height: 19px;
    color: #6f7d91;
    transform: translateY(-50%);
    pointer-events: none;
}

.mp-icone-busca svg {
    display: block;
    width: 100%;
    height: 100%;
    fill: currentColor;
}

.mp-nome-capsula input[type="search"] {
    box-sizing: border-box;
    width: 100%;
    min-height: 54px;
    padding: 0 20px 0 48px;
    background: #ffffff;
    color: #0f1c37;
    border: 1px solid #d9e2ec;
    border-radius: 999px;
    box-shadow: 0 4px 14px rgba(15, 28, 55, 0.04);
    font-family: "Poppins", "Lato", sans-serif;
    font-size: 14px;
    font-weight: 400;
    outline: none;
    appearance: none;
    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

.mp-nome-capsula input[type="search"]::placeholder {
    color: #7c8799;
    opacity: 1;
}

.mp-nome-capsula input[type="search"]:hover {
    border-color: #9ecdf0;
}

.mp-nome-capsula input[type="search"]:focus {
    border-color: #38b6ff;
    box-shadow:
        0 0 0 4px rgba(56, 182, 255, 0.12),
        0 8px 22px rgba(15, 28, 55, 0.07);
}

.mp-nome-capsula:focus-within .mp-icone-busca {
    color: #00357a;
}

/* Evita o X padrão exagerado em alguns navegadores */
.mp-nome-capsula input[type="search"]::-webkit-search-cancel-button {
    cursor: pointer;
}

/* Barra de rolagem do dropdown */
.mp-dropdown {
    scrollbar-width: thin;
    scrollbar-color: #c7d9e8 transparent;
}

.mp-dropdown::-webkit-scrollbar {
    width: 7px;
}

.mp-dropdown::-webkit-scrollbar-thumb {
    background: #c7d9e8;
    border-radius: 999px;
}

.mp-dropdown::-webkit-scrollbar-track {
    background: transparent;
}

@keyframes mp-chip-entrada {
    from {
        opacity: 0;
        transform: translateY(-3px) scale(0.97);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@media (max-width: 767px) {
    .mp-filtros {
        grid-template-columns: 1fr;
        gap: 17px;
    }

    .mp-campo-nome,
    .mp-acoes-filtro {
        grid-column: auto;
    }

    .mp-publico-input,
    .mp-especialidade-input,
    .mp-nome-capsula input[type="search"] {
        min-height: 52px;
    }

    .mp-publico-input,
    .mp-especialidade-input {
        padding: 8px 40px 8px 11px;
        border-radius: 15px;
    }

    .mp-publico-input::after,
    .mp-especialidade-input::after {
        right: 17px;
        top: 22px;
    }

    .mp-publico-input[aria-expanded="true"]::after,
    .mp-especialidade-input[aria-expanded="true"]::after {
        top: 26px;
    }

    .mp-nome-capsula input[type="search"] {
        border-radius: 999px;
    }

    .mp-tag {
        min-height: 28px;
        padding: 4px 4px 4px 10px;
        font-size: 12px;
    }

    .mp-tag .remover {
        width: 18px;
        height: 18px;
        min-width: 18px;
    }

    .mp-dropdown {
        max-height: 230px;
    }
}


/* Ajustes finais dos chips e fechamento visual */
.mp-marketplace .mp-publico-input,
.mp-marketplace .mp-especialidade-input {
    gap: 8px !important;
}

.mp-marketplace .mp-publico-input .mp-tag,
.mp-marketplace .mp-especialidade-input .mp-tag {
    min-height: 30px !important;
    padding: 4px 5px 4px 12px !important;
    gap: 8px !important;
    background: #edf7ff !important;
    color: #00357a !important;
    border: 1px solid #c7e7fb !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
}

.mp-marketplace .mp-tag .remover {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    margin-left: 1px !important;
    background: rgba(0, 53, 122, 0.07) !important;
    color: #527096 !important;
    border-radius: 50% !important;
    font-size: 10px !important;
}

.mp-marketplace .mp-tag .remover:hover {
    background: #00357a !important;
    color: #ffffff !important;
}

@media (max-width: 767px) {
    .mp-marketplace .mp-filtros-wrapper {
        margin-left: 14px;
        margin-right: 14px;
        padding: 25px 18px 28px;
        border-radius: 20px;
    }

    .mp-marketplace .mp-filtros-cabecalho {
        margin-bottom: 22px;
    }

    .mp-marketplace .mp-filtros-cabecalho h1 {
        margin-bottom: 8px;
        font-size: 27px;
        line-height: 1.2;
    }

    .mp-marketplace .mp-filtros-cabecalho p {
        max-width: 100%;
        font-size: 14px;
        line-height: 1.55;
        white-space: normal;
    }
}
/* ==========================================
   CABEÇALHO INTERNO DO FILTRO
========================================== */

.mp-filtro-cabecalho {
    width: 100%;
    margin: 0 auto 28px;
    text-align: center;
}

.mp-filtro-cabecalho h2 {
    margin: 0 0 8px;

    color: #00357a;

    font-family: "Poppins", sans-serif;
    font-size: 34px;
    font-weight: 700;
    line-height: 1.2;
}

.mp-filtro-cabecalho p {
    max-width: 680px;
    margin: 0 auto;

    color: #365b87;

    font-family: "Poppins", sans-serif;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.6;
}

/* ==========================================================
   FILTRO RETRÁTIL — PSICOAPP
   Busca por nome sempre visível.
   Públicos e Especialidades aparecem ao abrir "Filtros de busca".
========================================================== */

.mp-marketplace .mp-filtros--retraiveis {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: stretch;
}

.mp-marketplace .mp-filtros--retraiveis .mp-campo-nome {
    order: 2;
    width: 100%;
    grid-column: auto;
}

.mp-marketplace .mp-filtros-avancados {
    order: 1;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    width: 100%;
    max-height: 0;
    margin: 0;
    overflow: hidden;
    visibility: hidden;
    opacity: 0;
    transform: translateY(-8px);
    pointer-events: none;
    transition:
        max-height 0.34s ease,
        opacity 0.22s ease,
        transform 0.28s ease,
        visibility 0.22s ease;
}

.mp-marketplace .mp-filtros--retraiveis.is-open .mp-filtros-avancados {
    max-height: 1000px;
    overflow: visible;
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.mp-marketplace .mp-filtros--retraiveis .mp-acoes-filtro {
    order: 3;
    grid-column: auto;
    width: 100%;
    max-height: 0;
    margin: -22px 0 0;
    overflow: hidden;
    visibility: hidden;
    opacity: 0;
    transform: translateY(-6px);
    pointer-events: none;
    transition:
        max-height 0.28s ease,
        margin 0.28s ease,
        opacity 0.2s ease,
        transform 0.24s ease,
        visibility 0.2s ease;
}

.mp-marketplace .mp-filtros--retraiveis.is-open .mp-acoes-filtro {
    max-height: 120px;
    margin: 0;
    overflow: visible;
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

/* Botão grande no estado recolhido */
.mp-marketplace .mp-filtros-toggle {
    order: 4;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) 22px;
    gap: 12px;
    align-items: center;
    width: 100%;
    min-height: 58px;
    padding: 10px 18px;
    margin: 0;
    background: #fafdff;
    background-image: none;
    color: #00357a;
    border: 1px solid #bfe4ff;
    border-radius: 18px;
    box-shadow: 0 5px 16px rgba(15, 28, 55, 0.04);
    font-family: "Poppins", "Lato", sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
    text-align: left;
    cursor: pointer;
    outline: none;
    transition:
        border-color 0.2s ease,
        background-color 0.2s ease,
        box-shadow 0.2s ease,
        color 0.2s ease;
}

.mp-marketplace .mp-filtros-toggle::before,
.mp-marketplace .mp-filtros-toggle::after {
    content: none !important;
    display: none !important;
}

.mp-marketplace .mp-filtros-toggle:hover,
.mp-marketplace .mp-filtros-toggle:focus-visible {
    background: #f2f9ff;
    border-color: #8fd3ff;
    box-shadow: 0 7px 20px rgba(0, 53, 122, 0.08);
    outline: none;
}

.mp-marketplace .mp-filtros-toggle__icone,
.mp-marketplace .mp-filtros-toggle__seta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.mp-marketplace .mp-filtros-toggle__icone {
    width: 28px;
    height: 28px;
    color: #0757ad;
}

.mp-marketplace .mp-filtros-toggle__icone svg {
    display: block;
    width: 23px;
    height: 23px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.mp-marketplace .mp-filtros-toggle__texto {
    min-width: 0;
}

.mp-marketplace .mp-filtros-toggle__seta {
    width: 22px;
    height: 22px;
    color: #00357a;
    transition: transform 0.24s ease;
}

.mp-marketplace .mp-filtros-toggle__seta svg {
    display: block;
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/*
 * Quando aberto, o mesmo controle fica discreto abaixo do botão
 * "Buscar profissionais", apenas para permitir recolher novamente.
 */
.mp-marketplace .mp-filtros--retraiveis.is-open .mp-filtros-toggle {
    justify-self: center;
    align-self: center;
    width: auto;
    min-height: 32px;
    grid-template-columns: auto auto;
    gap: 6px;
    padding: 5px 10px;
    margin-top: -10px;
    background: transparent;
    border-color: transparent;
    border-radius: 999px;
    box-shadow: none;
    color: #5b7698;
    font-size: 12px;
    font-weight: 600;
}

.mp-marketplace .mp-filtros--retraiveis.is-open .mp-filtros-toggle:hover,
.mp-marketplace .mp-filtros--retraiveis.is-open .mp-filtros-toggle:focus-visible {
    background: #f3f9fe;
    border-color: #d9ecfa;
    box-shadow: none;
    color: #00357a;
}

.mp-marketplace .mp-filtros--retraiveis.is-open .mp-filtros-toggle__icone {
    display: none;
}

.mp-marketplace .mp-filtros--retraiveis.is-open .mp-filtros-toggle__seta {
    width: 16px;
    height: 16px;
    transform: rotate(180deg);
}

.mp-marketplace .mp-filtros--retraiveis.is-open .mp-filtros-toggle__seta svg {
    width: 14px;
    height: 14px;
}

/* Mantém os dois filtros avançados proporcionais */
.mp-marketplace .mp-filtros-avancados > .mp-campo {
    min-width: 0;
}

/* No estado fechado, o card fica mais compacto */
.mp-marketplace .mp-filtros-wrapper:has(.mp-filtros--retraiveis:not(.is-open)) {
    padding-bottom: 34px;
}

/* Mobile */
@media (max-width: 767px) {

    .mp-marketplace .mp-filtros--retraiveis {
        gap: 17px;
    }

    .mp-marketplace .mp-filtros-avancados {
        grid-template-columns: 1fr;
        gap: 17px;
    }

    .mp-marketplace .mp-filtros-toggle {
        min-height: 54px;
        padding: 9px 15px;
        border-radius: 15px;
    }

    .mp-marketplace .mp-filtros--retraiveis .mp-acoes-filtro {
        margin-top: -17px;
    }

    .mp-marketplace .mp-filtros--retraiveis.is-open .mp-acoes-filtro {
        margin-top: 0;
    }

    .mp-marketplace .mp-filtros--retraiveis.is-open .mp-filtros-toggle {
        min-height: 30px;
        margin-top: -7px;
    }
}

/* ==========================================================
   AJUSTE FINAL — FILTRO RETRÁTIL PSICOAPP
   Mantém toda a estrutura e lógica existentes.
========================================================== */

/* Botão "Filtros de busca" fechado — azul claro PsicoApp */
.mp-marketplace .mp-filtros-toggle {
    background: linear-gradient(135deg, #0f73d1 0%, #38b6ff 100%) !important;
    color: #ffffff !important;
    border-color: #259ee9 !important;
    box-shadow: 0 8px 22px rgba(56, 182, 255, 0.20) !important;
}

.mp-marketplace .mp-filtros-toggle__texto {
    color: #ffffff !important;
}

.mp-marketplace .mp-filtros-toggle__icone,
.mp-marketplace .mp-filtros-toggle__seta {
    color: #8fd3ff !important;
}

.mp-marketplace .mp-filtros-toggle:hover,
.mp-marketplace .mp-filtros-toggle:focus-visible {
    background: linear-gradient(135deg, #0d68be 0%, #2aa7f2 100%) !important;
    border-color: #1c91dc !important;
    color: #ffffff !important;
    box-shadow: 0 10px 26px rgba(56, 182, 255, 0.26) !important;
}

/* Quando aberto: "Ocultar filtros" fica leve e discreto */
.mp-marketplace .mp-filtros--retraiveis.is-open .mp-filtros-toggle {
    background: #eef8ff !important;
    color: #0757ad !important;
    border: 1px solid #c7e7fb !important;
    box-shadow: none !important;
}

.mp-marketplace .mp-filtros--retraiveis.is-open .mp-filtros-toggle__texto,
.mp-marketplace .mp-filtros--retraiveis.is-open .mp-filtros-toggle__seta {
    color: #0757ad !important;
}

.mp-marketplace .mp-filtros--retraiveis.is-open .mp-filtros-toggle:hover,
.mp-marketplace .mp-filtros--retraiveis.is-open .mp-filtros-toggle:focus-visible {
    background: #e3f4ff !important;
    color: #00357a !important;
    border-color: #9fd8ff !important;
}

/*
 * CORREÇÃO DO DROPDOWN:
 * dentro do filtro retraído aberto, as listas deixam de flutuar
 * sobre a busca e o botão e passam a ocupar espaço no layout.
 */
.mp-marketplace
.mp-filtros--retraiveis.is-open
.mp-filtros-avancados
.mp-dropdown {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;

    width: 100% !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    visibility: hidden !important;
    opacity: 0 !important;
    transform: none !important;
    pointer-events: none !important;

    background: #ffffff !important;
    border: 0 solid #dbe7f0 !important;
    border-radius: 16px !important;
    box-shadow: none !important;

    transition:
        max-height 0.26s ease,
        margin 0.22s ease,
        padding 0.22s ease,
        opacity 0.18s ease,
        visibility 0.18s ease !important;
}

.mp-marketplace
.mp-filtros--retraiveis.is-open
.mp-filtros-avancados
.mp-dropdown.aberto {
    max-height: 270px !important;
    margin-top: 8px !important;
    padding: 7px !important;

    overflow-y: auto !important;

    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;

    border-width: 1px !important;
    box-shadow: 0 14px 30px rgba(15, 28, 55, 0.11) !important;
}

/* Dá espaço suficiente para o painel crescer com um dropdown aberto */
.mp-marketplace .mp-filtros--retraiveis.is-open .mp-filtros-avancados {
    max-height: 1600px !important;
}

/* Mantém as listas sempre acima do fundo, mas sem sobrepor os campos seguintes */
.mp-marketplace .mp-filtros-avancados .mp-publico-box,
.mp-marketplace .mp-filtros-avancados .mp-especialidade-box {
    position: relative;
    z-index: 1;
}

/* Mobile */
@media (max-width: 767px) {
    .mp-marketplace
    .mp-filtros--retraiveis.is-open
    .mp-filtros-avancados
    .mp-dropdown.aberto {
        max-height: 230px !important;
    }
}

/* "App" em azul claro padrão PsicoApp */
.mp-marketplace .mp-filtros-cabecalho h1 .mp-titulo-app {
    color: #38b6ff;
}

/* ==========================================================
   BOTÃO BUSCAR PROFISSIONAIS — AZUL CLARO PSICOAPP
========================================================== */

.mp-marketplace .mp-acoes-filtro .mp-botao-filtrar {
    background: linear-gradient(
        135deg,
        #0f73d1 0%,
        #38b6ff 100%
    ) !important;

    color: #ffffff !important;
    border-color: #259ee9 !important;

    box-shadow:
        0 10px 24px rgba(56, 182, 255, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
}

.mp-marketplace .mp-acoes-filtro .mp-botao-filtrar:hover,
.mp-marketplace .mp-acoes-filtro .mp-botao-filtrar:focus,
.mp-marketplace .mp-acoes-filtro .mp-botao-filtrar:focus-visible {
    background: linear-gradient(
        135deg,
        #0d68be 0%,
        #2aa7f2 100%
    ) !important;

    color: #ffffff !important;
    border-color: #1c91dc !important;

    box-shadow:
        0 13px 28px rgba(56, 182, 255, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;

    transform: translateY(-2px);
    outline: none;
}

/* ==========================================================
   TEXTOS DO FILTRO — MAIS LEVES E HARMÔNICOS
   Mantém estrutura, tamanhos, botões e funcionamento.
========================================================== */

/* Títulos "Públicos" e "Especialidades" */
.mp-marketplace .mp-publico-input .mp-placeholder strong,
.mp-marketplace .mp-especialidade-input .mp-placeholder strong {
    color: #31577f !important;
    font-weight: 600 !important;
}

/* Textos auxiliares abaixo dos títulos */
.mp-marketplace .mp-publico-input .mp-placeholder small,
.mp-marketplace .mp-especialidade-input .mp-placeholder small {
    color: #8290a3 !important;
    font-weight: 400 !important;
}

/* Caso o placeholder seja recriado apenas como texto */
.mp-marketplace .mp-publico-input > .mp-placeholder:not(:has(strong)),
.mp-marketplace .mp-especialidade-input > .mp-placeholder:not(:has(strong)) {
    color: #52677f !important;
    font-weight: 500 !important;
}

/* Opções abertas dos dropdowns */
.mp-marketplace .mp-item-publico,
.mp-marketplace .mp-item-especialidade {
    color: #52677f !important;
    font-weight: 500 !important;
}

.mp-marketplace .mp-item-publico:hover,
.mp-marketplace .mp-item-especialidade:hover,
.mp-marketplace .mp-item-publico:focus-visible,
.mp-marketplace .mp-item-especialidade:focus-visible {
    color: #168eea !important;
}

/* Chips selecionados */
.mp-marketplace .mp-publico-input .mp-tag,
.mp-marketplace .mp-especialidade-input .mp-tag {
    color: #168eea !important;
    font-weight: 600 !important;
}

/* Busca por nome */
.mp-marketplace .mp-nome-capsula input[type="search"] {
    color: #52677f !important;
    font-weight: 400 !important;
}

.mp-marketplace .mp-nome-capsula input[type="search"]::placeholder {
    color: #8a97a8 !important;
}

/* Botão discreto "Ocultar filtros" */
.mp-marketplace
.mp-filtros--retraiveis.is-open
.mp-filtros-toggle__texto,
.mp-marketplace
.mp-filtros--retraiveis.is-open
.mp-filtros-toggle__seta {
    color: #52779b !important;
}


/* Ordem visual dos atalhos: depois do botão "Filtros de busca" */
.mp-marketplace .mp-filtros--retraiveis .mp-atalhos-especialidades {
    order: 5 !important;
    width: 100%;
}

/* ==========================================================
   PROTEÇÃO DOS ÍCONES PNG DOS ATALHOS
   Mantém as imagens pequenas dentro das cápsulas.
========================================================== */
.mp-marketplace .mp-atalhos-especialidades .mp-atalho-especialidade__icone {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    flex: 0 0 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
}

.mp-marketplace .mp-atalhos-especialidades .mp-atalho-especialidade__icone img {
    display: block !important;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    object-fit: contain !important;
    object-position: center !important;
    margin: 0 !important;
    padding: 0 !important;
}

@media (max-width: 767px) {
    .mp-marketplace .mp-atalhos-especialidades .mp-atalho-especialidade__icone {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        max-width: 24px !important;
        flex-basis: 24px !important;
    }

    .mp-marketplace .mp-atalhos-especialidades .mp-atalho-especialidade__icone img {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        max-width: 24px !important;
        min-height: 24px !important;
        max-height: 24px !important;
    }
}


/* ==========================================================
   ATALHOS RÁPIDOS DE ESPECIALIDADES — PSICOAPP
   Ansiedade | Autoconhecimento | Autoestima
========================================================== */

.mp-marketplace .mp-filtros--retraiveis .mp-atalhos-especialidades {
    order: 5 !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.mp-marketplace .mp-atalhos-especialidades .mp-atalho-especialidade {
    box-sizing: border-box !important;
    min-height: 42px !important;
    padding: 6px 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    background: #eef9ff !important;
    border: 1px solid #cfeaff !important;
    border-radius: 999px !important;
    color: #0b2f6b !important;
    font-family: "Nunito", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transition:
        background-color .2s ease,
        border-color .2s ease,
        transform .2s ease !important;
}

.mp-marketplace .mp-atalhos-especialidades .mp-atalho-especialidade:hover,
.mp-marketplace .mp-atalhos-especialidades .mp-atalho-especialidade:focus,
.mp-marketplace .mp-atalhos-especialidades .mp-atalho-especialidade:focus-visible {
    background: #e2f5ff !important;
    border-color: #9edcff !important;
    color: #0b2f6b !important;
    text-decoration: none !important;
    transform: translateY(-1px);
    outline: none !important;
}

.mp-marketplace .mp-atalhos-especialidades .mp-atalho-especialidade span {
    color: #0b2f6b !important;
}

.mp-marketplace .mp-atalhos-especialidades .mp-atalho-especialidade__icone {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    flex: 0 0 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

.mp-marketplace .mp-atalhos-especialidades .mp-atalho-especialidade__icone img {
    display: block !important;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    object-fit: contain !important;
    object-position: center !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

@media (max-width: 767px) {
    .mp-marketplace .mp-filtros--retraiveis .mp-atalhos-especialidades {
        gap: 8px !important;
    }

    .mp-marketplace .mp-atalhos-especialidades .mp-atalho-especialidade {
        min-height: 38px !important;
        padding: 6px 12px !important;
        gap: 6px !important;
        font-size: 13px !important;
    }

    .mp-marketplace .mp-atalhos-especialidades .mp-atalho-especialidade__icone {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        max-width: 24px !important;
        min-height: 24px !important;
        max-height: 24px !important;
        flex: 0 0 24px !important;
    }

    .mp-marketplace .mp-atalhos-especialidades .mp-atalho-especialidade__icone img {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        max-width: 24px !important;
        min-height: 24px !important;
        max-height: 24px !important;
    }
}


/* ==========================================================
   ORDEM DOS ATALHOS COM O FILTRO ABERTO
   Públicos/Especialidades > Nome > Atalhos > Buscar > Ocultar
========================================================== */

.mp-marketplace
.mp-filtros--retraiveis.is-open
.mp-atalhos-especialidades {
    order: 3 !important;
}

.mp-marketplace
.mp-filtros--retraiveis.is-open
.mp-acoes-filtro {
    order: 4 !important;
}

.mp-marketplace
.mp-filtros--retraiveis.is-open
.mp-filtros-toggle {
    order: 5 !important;
}


/* ==========================================================
   AJUSTE ISOLADO — ARREDONDAMENTO DOS CAMPOS
   Públicos e Especialidades
========================================================== */
.mp-marketplace .mp-publico-input,
.mp-marketplace .mp-especialidade-input {
    border-radius: 999px !important;
}


/* ==========================================================
   AJUSTE ISOLADO — MOBILE
   Menor espaço entre subtítulo e busca por nome
========================================================== */
@media (max-width: 767px) {
    .mp-marketplace .mp-filtros-cabecalho {
        margin-bottom: -6px !important;
    }
}


/* ==========================================================
   AJUSTE ISOLADO — MOBILE / FILTRO ABERTO
   Espaço entre subtítulo e Públicos/Especialidades
========================================================== */
@media (max-width: 767px) {
    .mp-marketplace .mp-filtros--retraiveis.is-open {
        margin-top: 12px !important;
    }
}


/* ==========================================================
   AJUSTE ISOLADO — ESPAÇAMENTO DO FILTRO ABERTO
   Balões → Buscar profissionais = Buscar profissionais → Ocultar
========================================================== */
.mp-marketplace .mp-filtros--retraiveis.is-open .mp-filtros-toggle {
    margin-top: 10px !important;
}