/*
 * Build With Me Ghana brand layer.
 * Keeps the platform aligned to the approved collateral without editing vendor CSS.
 */
:root {
    --bwm-green: #3C8449;
    --bwm-brown: #7F7254;
    --bwm-blue: #ACCFE1;
    --bwm-grey: #E6E2E5;
    --bwm-ink: #172033;
    --bwm-muted: #5f6878;
    --bwm-surface: #f7f8f6;
    --bwm-border: #dfe5dc;
    --bwm-green-dark: #2f6d3b;
    --bwm-sidebar-bg: #253025;
    --bwm-sidebar-panel: #1f2a22;
    --bwm-sidebar-hover: rgba(255, 255, 255, 0.07);
    --bwm-sidebar-active: rgba(60, 132, 73, 0.22);
    --bwm-font-main: "Montserrat", "Gilroy", "Poppins", "Open Sans", Arial, sans-serif;
    --vr-color-main: var(--bwm-green);
    --vr-font-main: var(--bwm-font-main);
    --vr-font-dashboard: var(--bwm-font-main);
}

html,
body,
button,
input,
select,
textarea {
    font-family: var(--bwm-font-main) !important;
}

body {
    color: var(--bwm-ink);
}

a,
.link,
.link-forgot-password,
.breadcrumb a,
.nav-footer ul li a:hover {
    color: var(--bwm-green);
}

a:hover,
a:focus {
    color: var(--bwm-green-dark);
}

.btn-custom,
.btn-success,
.btn-primary,
.bg-success,
.swal-button--confirm,
.newsletter-footer .btn-custom,
.form-newsletter-footer .btn-custom,
.top-search-bar .btn-search,
.btn-site-prev {
    background-color: var(--bwm-green) !important;
    border-color: var(--bwm-green) !important;
    color: #fff !important;
}

.btn-custom:hover,
.btn-custom:focus,
.btn-success:hover,
.btn-success:focus,
.btn-primary:hover,
.btn-primary:focus,
.top-search-bar .btn-search:hover,
.top-search-bar .btn-search:focus {
    background-color: var(--bwm-green-dark) !important;
    border-color: var(--bwm-green-dark) !important;
    color: #fff !important;
}

.btn-outline-success,
.btn-outline-primary {
    color: var(--bwm-green) !important;
    border-color: var(--bwm-green) !important;
}

.btn-outline-success:hover,
.btn-outline-primary:hover {
    background-color: var(--bwm-green) !important;
    border-color: var(--bwm-green) !important;
    color: #fff !important;
}

.label,
.badge {
    border-radius: 999px !important;
    box-shadow: none !important;
    font-weight: 700 !important;
    letter-spacing: 0;
}

.label-success,
.badge-success,
.custom-control-input:checked ~ .custom-control-label::before,
.regular-checkbox:checked + label,
.progress-bar-success {
    background-color: var(--bwm-green) !important;
    border-color: var(--bwm-green) !important;
}

.form-control:focus,
.auth-form-input:focus,
.auth-box select.form-control:focus,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default .select2-selection--single:focus {
    border-color: var(--bwm-green) !important;
    box-shadow: 0 0 0 3px rgba(60, 132, 73, 0.14) !important;
}

.logo img,
.mobile-logo img,
.footer-logo img,
.main-header .logo img,
.login-logo img {
    object-fit: contain;
}

.nav-top .logo img {
    max-width: 178px;
    max-height: 64px;
}

.navbar .navbar-nav .nav-item .nav-link:hover,
.navbar .navbar-nav .nav-item .nav-link:focus,
.nav-main .navbar-nav .nav-link:hover,
.nav-main .navbar-nav .nav-link:focus,
.profile-dropdown .dropdown-menu li a:hover,
.profile-dropdown .dropdown-menu li button:hover {
    color: var(--bwm-green) !important;
}

.navbar .navbar-nav .nav-item.active > .nav-link,
.nav-main .navbar-nav .nav-item.active > .nav-link {
    color: var(--bwm-green) !important;
    font-weight: 700;
}

.search-results-ajax ul li a:hover,
.dropdown-item:hover,
.dropdown-item:focus {
    background-color: rgba(60, 132, 73, 0.08) !important;
    color: var(--bwm-green) !important;
}

.main-slider .item .caption .btn,
.main-slider .item .caption .btn-slider {
    background-color: var(--bwm-green) !important;
    border-color: var(--bwm-green) !important;
}

.section .title,
.page-title,
.product-content-details .title,
.profile-details .username {
    color: var(--bwm-ink);
    letter-spacing: 0;
}

.product-item .item-details .item-title a:hover,
.product-item .item-meta a:hover,
.support .ul-support-articles a:hover {
    color: var(--bwm-green) !important;
}

.section-services-quick-links .service-quick-link {
    border-color: rgba(60, 132, 73, 0.12);
}

.section-services-quick-links .service-quick-link-land,
.section-services-quick-links .service-quick-link-plan,
.section-services-quick-links .service-quick-link-house,
.section-services-quick-links .service-quick-link-mortgage {
    --service-accent: var(--bwm-green);
    --service-accent-soft: rgba(60, 132, 73, 0.11);
}

.section-services-quick-links .service-quick-link-material,
.section-services-quick-links .service-quick-link-estimate,
.section-services-quick-links .service-quick-link-home-essentials {
    --service-accent: var(--bwm-brown);
    --service-accent-soft: rgba(127, 114, 84, 0.13);
}

.section-services-quick-links .service-quick-link-labor,
.section-services-quick-links .service-quick-link-contract {
    --service-accent: #236e74;
    --service-accent-soft: rgba(172, 207, 225, 0.36);
}

#footer {
    background: #273528;
}

#footer .footer-title {
    color: #fff;
    letter-spacing: 0;
}

#footer .footer-about,
#footer .nav-footer ul li a,
#footer .title-desc,
#footer .bwm-footer-coverage-note {
    color: rgba(255, 255, 255, 0.78);
}

#footer .footer-payment-icons img {
    background: #fff;
    border-radius: 3px;
    padding: 1px;
}

.box.box-primary,
.content-wrapper .box-primary {
    border-top-color: var(--bwm-green) !important;
}

.main-header .navbar,
.skin-blue .main-header .navbar,
.skin-black-light .main-header .navbar {
    background: #fff !important;
    border-bottom: 1px solid rgba(60, 132, 73, 0.12);
}

.main-sidebar,
.skin-blue .main-sidebar,
.skin-black-light .main-sidebar,
.skin-blue .wrapper,
.skin-black-light .wrapper {
    background-color: var(--bwm-sidebar-bg) !important;
}

.sidebar .logo,
.main-sidebar .logo {
    align-items: center;
    background: var(--bwm-sidebar-bg) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    justify-content: center;
    min-height: 74px;
    padding: 12px 18px;
}

.sidebar .logo img,
.main-sidebar .logo img {
    display: block;
    height: auto;
    max-height: 54px;
    max-width: 170px;
    object-fit: contain;
    width: auto;
}

.sidebar-menu > li.header {
    background: transparent !important;
    color: rgba(255, 255, 255, 0.58) !important;
    letter-spacing: 0.04em;
}

.sidebar-menu > li > a,
.treeview-menu > li > a,
.skin-blue .sidebar a,
.skin-black-light .sidebar a {
    background: transparent !important;
    color: rgba(255, 255, 255, 0.82) !important;
}

.sidebar-menu > li > a > .fa,
.treeview-menu > li > a > .fa,
.skin-black-light .sidebar-menu > li > a > .fa {
    color: rgba(255, 255, 255, 0.58) !important;
}

.sidebar-menu > li:hover > a,
.sidebar-menu > li.active > a,
.sidebar-menu > li.menu-open > a,
.treeview-menu > li.active > a,
.treeview-menu > li > a:hover,
.skin-blue .sidebar-menu > li:hover > a,
.skin-blue .sidebar-menu > li.active > a,
.skin-blue .sidebar-menu > li.menu-open > a,
.skin-blue .sidebar-menu .treeview-menu > li.active > a,
.skin-blue .sidebar-menu .treeview-menu > li > a:hover,
.skin-black-light .sidebar-menu > li:hover > a,
.skin-black-light .sidebar-menu > li.active > a,
.skin-black-light .sidebar-menu > li.menu-open > a,
.skin-black-light .sidebar-menu .treeview-menu > li.active > a,
.skin-black-light .sidebar-menu .treeview-menu > li > a:hover {
    background: var(--bwm-sidebar-hover) !important;
    color: #fff !important;
    border-left-color: var(--bwm-green) !important;
}

.skin-black-light .sidebar-menu > .menu-open,
.skin-black-light .sidebar-menu > li > .treeview-menu,
.sidebar-menu > li > .treeview-menu {
    background: var(--bwm-sidebar-panel) !important;
}

.sidebar-menu > li.active > a,
.skin-blue .sidebar-menu > li.active > a,
.skin-black-light .sidebar-menu > li.active > a {
    background: var(--bwm-sidebar-active) !important;
}

.sidebar-menu > li:hover > a > .fa,
.sidebar-menu > li.active > a > .fa,
.treeview-menu > li.active > a > .fa,
.treeview-menu > li > a:hover > .fa {
    color: var(--bwm-blue) !important;
}

.user-panel {
    background: var(--bwm-sidebar-panel) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.user-panel > .image {
    background: rgba(172, 207, 225, 0.22) !important;
    background-image: none !important;
    border: 2px solid var(--bwm-blue);
    box-shadow: 0 0 0 4px rgba(60, 132, 73, 0.16);
}

.user-panel .username,
.user-panel .username p {
    color: rgba(255, 255, 255, 0.88) !important;
    margin-bottom: 0;
}

.user-panel > .info,
.user-panel > .info > a,
.user-panel > .info > p {
    color: rgba(255, 255, 255, 0.84) !important;
}

.content-header > h1,
.box-title,
.login-box-msg {
    color: var(--bwm-ink);
    letter-spacing: 0;
}

.small-box.bg-aqua,
.admin-small-box.bg-aqua,
.small-box.bg-light-blue,
.admin-small-box.bg-light-blue,
.small-box.bg-blue,
.admin-small-box.bg-blue,
.small-box.bg-yellow,
.admin-small-box.bg-yellow,
.small-box.bg-red,
.admin-small-box.bg-red,
.small-box.bg-green,
.admin-small-box.bg-green,
.small-box.bg-purple,
.admin-small-box.bg-purple,
.small-box.bg-teal,
.admin-small-box.bg-teal,
.small-box.bg-olive,
.admin-small-box.bg-olive,
.small-box.bg-orange,
.admin-small-box.bg-orange,
.small-box.bg-maroon,
.admin-small-box.bg-maroon {
    background: linear-gradient(135deg, var(--bwm-green), var(--bwm-green-dark)) !important;
    background-color: var(--bwm-green) !important;
}

.small-box .icon,
.admin-small-box .icon {
    color: rgba(255, 255, 255, 0.16) !important;
}

.small-box-dashboard {
    border-top: 3px solid rgba(60, 132, 73, 0.18);
}

.label-primary,
.badge-primary {
    background-color: var(--bwm-green) !important;
    color: #fff !important;
}

.label-success,
.badge-success {
    background-color: var(--bwm-green) !important;
    color: #fff !important;
}

.label-info,
.badge-info {
    background-color: var(--bwm-blue) !important;
    color: var(--bwm-ink) !important;
}

.label-warning,
.badge-warning {
    background-color: var(--bwm-brown) !important;
    color: #fff !important;
}

.label-danger,
.badge-danger {
    background-color: #9f4326 !important;
    color: #fff !important;
}

.label-default,
.badge-default,
.badge-secondary {
    background-color: var(--bwm-grey) !important;
    color: var(--bwm-ink) !important;
}

.login-page {
    background:
        radial-gradient(circle at 15% 20%, rgba(172, 207, 225, 0.28), transparent 26rem),
        linear-gradient(135deg, #f6f8f4, #fff);
}

.login-box-body {
    border-top: 4px solid var(--bwm-green);
    box-shadow: 0 18px 40px rgba(23, 32, 51, 0.1);
}

.plan-annotation-pin {
    background: var(--bwm-green) !important;
}

.plan-thumbnail:focus {
    outline-color: var(--bwm-green) !important;
}

.plan-thumbnail.active {
    border-color: var(--bwm-green) !important;
}