
.defunciones-recientes__header {
    min-height: 270px;
    background: var(--color-primary-01);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 32px;

    h1,
    h2 {
        color: var(--color-secondary-09);
        font-size: 40px;
        font-weight: 500;
        font-family: 'neosanspro', sans-serif;
        font-style: normal;
        margin: 0;
    }
}

.section__results {
    background-color: var(--color-white);
    padding-top: 32px;
}

.defunciones-recientes__breadcrumb {
    background-color: var(--color-white);

    .breadcrumbs {
        padding: 32px 0;
    }

    nav.breadcrumb {
        display: flex;
        gap: 3px;

        .actual-page {
            font-weight: 500;
        }
    }

    nav.breadcrumb,
    nav.breadcrumb a {
        font-family: 'neosanspro', sans-serif;
        font-weight: 300;
        font-size: 14px;
        line-height: 16px;
        margin-bottom: 0;
        color: var(--color-secondary-09);
    }

}

.path-defunciones-recientes .views-element-container .view-filters form .form-actions button {
    background-color: var(--color-primary-09) !important;
    border-color: var(--color-primary-09) !important;
    border-radius: 100px;
    width: fit-content;
    text-transform: capitalize;
    padding: 6px 46px 6px 24px;
    position: relative;

    &::before {
        content: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.2851 15.1474L9.05113 9.91345C8.63447 10.2575 8.1553 10.5267 7.61363 10.7211C7.07197 10.9156 6.51161 11.0128 5.93255 11.0128C4.50825 11.0128 3.30281 10.5197 2.31626 9.53335C1.3297 8.54704 0.836426 7.34193 0.836426 5.91799C0.836426 4.49405 1.32958 3.28849 2.31588 2.30131C3.30219 1.31414 4.50731 0.820557 5.93126 0.820557C7.35519 0.820557 8.56075 1.31384 9.54793 2.30039C10.5351 3.28695 11.0287 4.49238 11.0287 5.91668C11.0287 6.51177 10.9288 7.08014 10.729 7.62181C10.5292 8.16347 10.2627 8.63463 9.92932 9.03526L15.1633 14.2692L14.2851 15.1474ZM5.93255 9.76285C7.00627 9.76285 7.91573 9.39025 8.66093 8.64506C9.40612 7.89986 9.77872 6.9904 9.77872 5.91668C9.77872 4.84296 9.40612 3.9335 8.66093 3.18831C7.91573 2.44311 7.00627 2.07051 5.93255 2.07051C4.85883 2.07051 3.94937 2.44311 3.20418 3.18831C2.459 3.9335 2.08641 4.84296 2.08641 5.91668C2.08641 6.9904 2.459 7.89986 3.20418 8.64506C3.94937 9.39025 4.85883 9.76285 5.93255 9.76285Z' fill='white'/%3E%3C/svg%3E%0A");
        right: 20px;
        position: absolute;
        top: 10px;
    }
}

@media (max-width: 768px) {
    .defunciones-recientes__header {
        width: 100%;
        margin: 0 auto;
        align-items: flex-start;
        padding: 0 3%;
        background: var(--color-white);
        padding-top: 20px;

        h2 {
            text-align: justify;
        }
    }

    .path-defunciones-recientes {
        .views-element-container .view-filters {
            width: 100%;

            #views-exposed-form-difuntos-recientes-page-1>.form-row {
                display: flex;
                flex-direction: column;
            }

            form .form-actions button {
                margin: 0;
                line-height: 20px;
                height: auto;
                padding: 6px 46px 6px 24px;
                width: auto;
                font-size: 14px;
            }
        }

        #views-exposed-form-difuntos-recientes-page-1 {
            .form-item-nombre-apellidos.mb-3 {
                width: 100%;
            }

            input#edit-nombre-apellidos {
                font-size: 1rem;
                height: 38px !important;
            }

            div#edit-actions {
                display: flex;
                justify-content: center;
            }
        }
    }
}

@media (max-width: 575px) {

    .path-defunciones-recientes #views-exposed-form-difuntos-recientes-page-1 input#edit-nombre-apellidos {
        font-size: 1rem !important;
    }
}

.breadcrumb-difuntos {
    nav {
        color: var(--color-secondary-09);
        font-size: 14px;
        font-weight: 500;
        text-align: left;
        margin-bottom: 32px;
        margin-top: 31px;

        .breadcrumb {
            align-items: center;
        }

        li {
            &.breadcrumb-item {
                &.active {
                    color: var(--color-secondary-09);
                    font-family: 'neosanspro', sans-serif;
                    font-size: 14px;
                    line-height: 16.4px;
                    font-weight: 500;
                    padding-left: 4px;

                    &::before {
                        color: var(--color-secondary-09);
                        content: '/' !important;
                        padding-right: 4px;
                    }
                }
            }
        }

        a {
            border-bottom: none;
            font-family: 'neosanspro', sans-serif;
            font-size: 14px;
            line-height: 16.4px;
            font-weight: 300;
            color: var(--color-secondary-09);

            &:hover {
                color: var(--color-secondary-09);
            }
        }
    }
}