/* =========================================================
   ToolZen Hub
   Loans Page
   Main Page Stylesheet
========================================================= */


/* =========================================================
   Feature Styles
========================================================= */

@import url("./loans-hero.css");

@import url("./loans-cards.css");

@import url("./loans-search.css");


/* =========================================================
   Breadcrumb
========================================================= */

.loans-breadcrumb {

    padding: 22px 0 10px;

    background: #f7faf9;
}


.loans-breadcrumb__nav {

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 10px;

    color: #667085;

    font-size: 13px;

    line-height: 1.4;
}


.loans-breadcrumb__home,
.loans-breadcrumb__link {

    display: inline-flex;

    align-items: center;

    gap: 6px;

    color: #667085;

    text-decoration: none;

    transition:
        color 0.2s ease;
}


.loans-breadcrumb__home:hover,
.loans-breadcrumb__link:hover {

    color: #0b9f58;
}


.loans-breadcrumb__home {

    color: #168552;
}


.loans-breadcrumb__separator {

    color: #98a2b3;

    font-size: 18px;
}


.loans-breadcrumb__current {

    color: #475467;

    font-weight: 500;
}


/* =========================================================
   Breadcrumb - Mobile
========================================================= */

@media (max-width: 650px) {

    .loans-breadcrumb {

        padding: 15px 0 5px;
    }


    .loans-breadcrumb__nav {

        gap: 7px;

        font-size: 11px;
    }

}

/* =========================================================
   Breadcrumb - Active Parent
========================================================= */

.loans-breadcrumb__active {

    color: #0b9f58;

    font-weight: 600;
}