/* Resources Index page: */

/* Filters */

/* All of this was using .resource-library.main-container. Now .toolbar. */
.toolbar .resource_search_filter {
    display: flex;
    align-items: center;
    /*gap: 10px;*/
    width: 100%;
    justify-content: space-between;
    flex-wrap: wrap;
    row-gap: .75rem;
}

    .toolbar .resource_search_filter input:focus-visible,
    .toolbar .resource_search_filter .typeCheckbox:focus-visible,
    .toolbar .resource_search_filter .topicCheckbox:focus-visible,
    .toolbar .resource_search_filter .audienceCheckbox:focus-visible {
        outline: 2px solid #2f97da;
        outline-offset: 2px;
    }

    /* Search: */
    .toolbar .resource_search_filter .usa-nav__secondary.resource_page {
        position: static;
        min-width: auto;
        margin-top: .5rem;
    }

        .toolbar .resource_search_filter .usa-nav__secondary.resource_page .usa-search {
            width: auto !important;
            height: 28px;
            margin-top: 0;
        }

    .toolbar .resource_search_filter .usa-nav__secondary .usa-search {
        border-radius: 100px !important;
        padding: 2px 5px !important;
        background: #ebebeb; 
        border: 1px solid #e2e2e2 !important;
        overflow: hidden;
    }

        .toolbar .resource_search_filter .usa-nav__secondary .usa-search #search-field {
            height: 1rem !important;
            margin-top: 4px;
            border: none !important;
            background: transparent !important;
            font-style: italic;
            font-size: 0.9rem;
        }

    .toolbar .resource_search_filter .usa-search .usa-button {
        border-radius: 100px !important;
        max-height: 1.0rem !important;
        background-color: #A7DFFE !important;
        padding: 0 !important;
        margin-top: -5px;
        margin-left: 10px;
    }

    .toolbar .resource_search_filter .usa-search--small .usa-search__submit-icon {
        height: 1.8rem;
        width: 2.4rem;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        margin: auto !important;
    }

    .toolbar .resource_search_filter .resource-search-form {
        position: relative;
        width: 100%;
        max-width: 100%;
    }

    .toolbar .resource_search_filter .resource-search-form .resource-search-input {
        width: 100% !important;
        border-radius: 8px !important;
        padding-right: 3.5rem !important;
    }

    .toolbar .resource_search_filter .resource-search-form .search-submit-button {
        position: absolute;
        right: .25rem;
        top: 50%;
        transform: translateY(-50%);
        height: 2rem;
        width: 2.8rem;
        border-radius: 8px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background-color: #2f97da !important;
        border: 0 !important;
        min-width: 0;
        z-index: 2;
    }

    .toolbar .resource_search_filter .resource-search-form .search-submit-button .usa-search__submit-icon {
        height: 1.25rem;
        width: 1.25rem;
        margin: 0 !important;
    }

    /* Dropdown filter menus (Types and Topics) using uswds elements: */

    .toolbar .resource_search_filter .usa-nav {
        width: 100%;
        height: auto;
        background-color: #ffffff;
    }

    .toolbar .resource_search_filter .usa-nav__primary {
        /* justify-content: right; */
        padding-top: 0 !important;
        padding-left: 0 !important;
        width: 100%;
    }

        .toolbar .resource_search_filter .usa-nav__primary button {
            border-radius: 8px !important;
            border: 1px solid #00000059 !important;
            color: #112f4e !important;
            font-weight: 600 !important;
            margin-top: 0 !important;
            padding: .5rem 1rem;
            min-width: 115px;
        }

            .toolbar .resource_search_filter .usa-nav__primary button:hover {
                background-color: #f0f6fb !important;
                border-color: #2f97da !important;
            }

            .toolbar .resource_search_filter .usa-nav__primary button:focus-visible {
                outline: 2px solid #2f97da;
                outline-offset: 2px;
            }

            .toolbar .resource_search_filter .usa-nav__primary button span::after {
                display: inline-block;
                width: 0;
                height: 0;
                border-top: 6px dashed;
                border-top: 4px solid \9;
                border-right: 4px solid transparent;
                border-left: 4px solid transparent;
            }

            .toolbar .resource_search_filter .usa-nav__primary button[aria-expanded=true] {
                justify-content: left;
                background-color: #ffffff;
                color: #162e51;
            }

    .toolbar .resource_search_filter .sortSelectWrapper {
        width: 100%;
    }

    .toolbar .resource_search_filter #sort-order {
        width: 75% !important;
        min-width: 0;
        border-radius: 8px;
    }

    .toolbar .resource_search_filter ul.usa-nav__submenu {
        padding: 5px;
        margin-top: 5px;
        color: #212529;
        background-color: #ffffff;
        position: absolute;
        z-index: 1000;
        min-width: 21rem;
        font-size: 1rem;
        text-align: left;
        list-style: none;
        background-color: #fff;
        border: 1px solid rgba(0, 0, 0, .15);
        border-radius: .25rem;
    }

        .toolbar .resource_search_filter ul.usa-nav__submenu li {
            padding: 6px 8px;
            border-radius: 4px;
        }

        .toolbar .resource_search_filter ul.usa-nav__submenu li:hover,
        .toolbar .resource_search_filter ul.usa-nav__submenu li:focus-within {
            background-color: #f0f6fb;
        }

        .toolbar .resource_search_filter ul.usa-nav__submenu li input[type="checkbox"] {
            accent-color: #112f4e;
        }

/* Breadcrumb: */
.main-container.resource-library .breadcrumb {
    background: none;
    margin-bottom: 0;
    padding: 0;
}

.main-container.resource-library ul.bread {
    padding: 0;
    list-style: none;
    margin: 0;
}

    .main-container.resource-library ul.bread li {
        display: inline;
    }

        .main-container.resource-library ul.bread li .breadcrumbremove {
            cursor: pointer;
            color: #a94442;
            white-space: nowrap;
        }

.main-container.resource-library span.topicBreadcrumbParent {
    cursor: pointer;
    color: #046a92;
}

/* Resources: */

.main-container.resource-library .display-none {
    display: none;
}

.main-container.resource-library .resource_main {
    margin-top:15px;
}

.main-container.resource-library .resource_main #noSearchResults {
    text-align: center;
    margin-top: 50px;
}

.main-container.resource-library .resource_main .grid-row.grid-gap > * {
    padding-left: .5rem;
    padding-right: .5rem;
}

.main-container.resource-library .resource_main .tablet\:grid-col-4 {
    margin-bottom: 20px;
}

.main-container.resource-library .resource_main .displayNone {
    display: none;
}

.main-container.resource-library .resource_main .resource_box {
    background-color: #fcfcfc;
    border: 1px solid #ececec;
    padding: 15px 15px;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    gap: 1px;
    height: 100%;
    min-height: 200px;
}

    .main-container.resource-library .resource_main .resource_box.featured {
        /*background-color: #E4E4E4;*/
    }

    .main-container.resource-library .resource_main .resource_box .resource-type-date {
        font-style: italic;
        color: #0D2553;
        font-size: 0.82547em;
        font-weight: 500;
        display: flex;
        justify-content: space-between;
        gap: 0 10px;
        flex-wrap: wrap;
    }

    .main-container.resource-library .resource_main .resource_box .resource-type {
        font-style: italic;
        color: #0D2553;
        font-size: 0.82547em;
        font-weight: 500;
        display: flex;
        justify-content: space-between;
        gap: 0 10px;
        flex-wrap: wrap;
    }

    .main-container.resource-library .resource_main .resource_box .resource-type img {
        width: 12%;
        margin-bottom: 1rem;
        height: 2rem;
    }

    .main-container.resource-library .resource_main .resource_box .resource-title {
        font-size: 1.25rem;
        font-weight: 700;
        color: #0D2553;
        margin-bottom: .5rem;
    }

    .main-container.resource-library .resource_main .resource_box .resoure-date {
        font-style: normal;
        color: #0D2553;
        font-size: 0.82547em;
        font-weight: 600;
        display: flex;
        justify-content: space-between;
        gap: 0 10px;
        flex-wrap: wrap;
        flex-grow: 1;
    }

    .main-container.resource-library .resource_main .resource_box .detail-page-link.usa-button {
        display: inline-block;
        width: 100%
    }

h2.usa-card__heading {
    font-family: "outfit", sans-serif;
    font-size: 1.5em;
}

.toolbar button.usa-accordion__button {
    margin: 0;
    padding: 0;
    max-width: none;
}

.usa-card img {
    float: left;
    padding-right: 10px;
    max-height: 25px;
}

h2.usa-card__heading {
    color: #00425B;
}

button svg {
    width: 30px;
}

button.usa-button {
    margin-left: 0;
}

button.usa-button--unstyled {
    margin: 8px 0;
}

.usa-accordion__content button {
    background: none;
    border: none;
}

.usa-accordion__content .usa-button:hover {
    -webkit-animation-name: grow;
    -webkit-animation-duration: 1s;
    transform: scale(1.1);
    color: #fff;
    background: none;
    border: none;
}

.hidden-ul {
    display: none;
}

.usa-card__container {
    border: none;
}

.usa-accordion__content > :first-child {
    margin-top: 8px;
}

.usa-accordion__content > :last-child {
    margin-bottom: 8px;
}

.usa-card__footer .usa-button:only-of-type {
    margin-right: 0;
    margin-bottom: 5px;
}

a.clipboard {
    margin-left: 8px;
    -webkit-animation-name: shrink;
    -webkit-animation-duration: 1s;
    transform: scale(1);
}

    a.clipboard svg:hover {
        -webkit-animation-name: grow;
        -webkit-animation-duration: 1s;
        transform: scale(1.1);
    }

button.usa-accordion__button svg {
    padding-left: 5px;
}

.usa-accordion__content button {
    margin-left: 5px;
}

.usa-card__footer .usa-button:only-of-type {
    display: block;
}

a.url {
    text-decoration: none;
}

.hidethis {
    display: none;
}

.clipboard svg {
    margin-top: 10px;
}

.social-sharingaccordion {
    top: calc(100% - 75px);
    right: 35px;
    left: auto;
    width: auto;
    text-align: center;
    width: 45px;
}

.usa-accordion__content {
    overflow: hidden;
    z-index: 9;
    padding: 0;
    position: relative;
    margin-top: 10px;
}

.toolbar .usa-accordion__button[aria-expanded=false], .toolbar .usa-accordion__button[aria-expanded=true] {
    background-image: none;
    background-color: #fff;
}

    .usa-accordion__button[aria-expanded=false], .usa-accordion__button[aria-expanded=false]:hover {
        background-image: none;
    }

@media (max-width: 1024px) {
    .toolbar .resource_search_filter {
        justify-content: center;
    }

    .toolbar .resource_search_filter > [class*="col-"] {
        display: flex;
        justify-content: center;
    }

    .toolbar .resource_search_filter .usa-nav__primary button {
        width: 100%;
        min-width: 0;
    }

    .toolbar .resource_search_filter .sortSelectWrapper {
        justify-content: center;
    }

    .toolbar .resource_search_filter .resource-search-form .search-submit-button {
        width: 24px !important;
    }
}

@media (min-width: 576px) and (max-width: 1024px) {
    .toolbar .resource_search_filter .resource-search-form,
    .toolbar .resource_search_filter .sortSelectWrapper {
        max-width: 14rem;
    }

    .sortSelectWrapper .nowrap-label {
        margin-bottom: 1rem;
    }

    .toolbar .resource_search_filter .topicSelectWrapper,
    .toolbar .resource_search_filter .typeSelectWrapper,
    .toolbar .resource_search_filter .audienceSelectWrapper {
        max-width: 18rem;
        width: 100%;
    }
}

@media (max-width: 576px) {
    .toolbar .resource_search_filter {
        row-gap: .5rem;
    }

    .toolbar .resource_search_filter > [class*="col-"] {
        width: 100%;
        justify-content: center;
    }

    .toolbar .resource_search_filter .usa-nav,
    .toolbar .resource_search_filter .resource-search-form,
    .toolbar .resource_search_filter .sortSelectWrapper {
        width: 100%;
        max-width: 24rem;
    }

    .toolbar .resource_search_filter .topicSelectWrapper,
    .toolbar .resource_search_filter .typeSelectWrapper,
    .toolbar .resource_search_filter .audienceSelectWrapper {
        width: 100%;
        max-width: 24rem;
    }
}

.usa-pagination__list {
    flex-wrap: wrap;
    row-gap: .5rem;
}