/* Farmácias confirmadas - Pos NRF (Figma node 547:134) */

.farmacias-confirmadas {
    padding: var(--space-140) var(--space-24);
    background-color: var(--purple-10);
}

.farmacias-confirmadas__intro {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-32);
    max-width: 1072px;
    margin: 0 auto;
    text-align: center;
}

.farmacias-confirmadas__title {
    display: flex;
    flex-direction: column;
    margin: 0;
    text-transform: uppercase;
}

.farmacias-confirmadas__title-highlight {
    color: var(--pink-20);
}

.farmacias-confirmadas__title-base {
    color: var(--accent-cream);
}

.farmacias-confirmadas__subrow {
    display: flex;
    align-items: center;
    gap: var(--space-24);
    padding: var(--space-12) var(--space-16) var(--space-12) var(--space-24);
    border: 1px solid var(--purple-30);
    border-radius: var(--space-40);
}

.farmacias-confirmadas__subtitle {
    margin: 0;
    color: var(--white);
    font-family: 'Proxima Nova', sans-serif;
    font-size: 18px;
    line-height: 22px;
    text-align: left;
}

.farmacias-confirmadas__cta {
    flex-shrink: 0;
    padding: var(--space-12) var(--space-24);
    border-radius: 32px;
    color: var(--accent-cream);
}

.farmacias-confirmadas__grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-40) var(--space-32);
    max-width: 1900px;
    margin: var(--space-80) auto 0;
}

.farmacias-confirmadas__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-8);
    padding: var(--space-16) var(--space-12);
    border: 1px solid var(--purple-30);
    border-radius: var(--space-8);
}

.farmacias-confirmadas__card-label {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    color: var(--white);
    font-family: 'Bebas Neue', sans-serif;
    font-size: 18px;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
}

.farmacias-confirmadas__card-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 136px;
    height: 89px;
    padding: var(--space-8);
    border-radius: var(--space-8);
}

    .farmacias-confirmadas__card-logo img {
        display: block;
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

/* Sempre ocupa a altura do botão de link, mesmo quando ele não é renderizado,
   para o card não mudar de tamanho entre farmácias com e sem link cadastrado. */
.farmacias-confirmadas__card-action {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
    height: 36px;
}

.farmacias-confirmadas__card-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: var(--purple-30);
    transition: opacity .2s ease;
}

    .farmacias-confirmadas__card-link:hover {
        opacity: .7;
    }

    .farmacias-confirmadas__card-link img {
        width: 20px;
        height: 20px;
    }

@media (max-width: 998px) {
    .farmacias-confirmadas {
        padding: var(--space-80) var(--space-16);
    }

    .farmacias-confirmadas__subrow {
        flex-direction: column;
        border-radius: var(--space-24);
    }

    .farmacias-confirmadas__cta {
        width: 100%;
    }

    .farmacias-confirmadas__grid {
        gap: var(--space-24) var(--space-16);
        margin-top: var(--space-48);
    }
}

@media (max-width: 600px) {
    .farmacias-confirmadas__card {
        flex: 1 1 calc(50% - var(--space-8));
    }

    .farmacias-confirmadas__card-logo {
        min-width: 0;
        width: 100%;
    }
}