/* ----------------------------------------------------------------
   Site Navigation Bar (tan bar below header, mirrors hhs.nd.gov)
   ---------------------------------------------------------------- */
#site-navbar {
    background-color: rgb(221, 221, 213);
    border-bottom: 1px solid #c4c0b8;
    height: 0.8rem;
}

/* ----------------------------------------------------------------
   Breadcrumb bar (white strip below the nav bar)
   ---------------------------------------------------------------- */
.official-banner-link {
    white-space: nowrap;
}

.breadcrumb-bar {
    background-color: #fff;
    border-bottom: 1px solid #e5e5e5;
    padding: 0.4rem 0;
}

.breadcrumb-bar .breadcrumb {
    background: none;
    padding: 0;
    margin: 0;
    font-size: 0.875rem;
    flex-wrap: wrap;
}

.breadcrumb-bar .breadcrumb-item a {
    color: #037fae;
    text-decoration: none;
}

.breadcrumb-bar .breadcrumb-item a:hover,
.breadcrumb-bar .breadcrumb-item a:focus {
    text-decoration: underline;
}

.breadcrumb-bar .breadcrumb-item.active {
    color: #444;
}

/* Header Specific */
#navbar {
    background-color: #fff;
    border-bottom: 0.071rem solid #e5e5e5; /* Light gray border */
}

/* Suicide Prevention 988 Icon - Rectangular Badge */
#suicide-prevention-icon {
    margin: 0;
    padding: 0;
    border: 0;
    max-height: 2rem; /* ≈28px to match social icons */
    max-width: 3.571rem; /* ≈50px, reduced width for less wide appearance */
    text-align: center;
    line-height: 1;
}

    #suicide-prevention-icon a {
        color: #fff;
        font-size: 1.071rem; /* ≈15px, slightly smaller */
        font-weight: 700;
        line-height: 1;
        text-decoration: none;
        margin: 0;
        padding: 0;
        border: 0;
    }

    #suicide-prevention-icon .sp-icon {
        font-family: "Aleo", serif;
        font-size: 1.3em; /* ≈19.5px, a little shorter than full height */
        line-height: 1;
        margin: 0;
        padding: 0;
        margin-top: 0.143rem; /* ≈2px nudge down to adjust vertical positioning */
    }

.navy {
    background-color: #001a4e;
    color: #fff; /* Corrected to white for visibility */
    border-radius: 0;
    padding: 0; /* No padding to ensure even spacing */
    margin: 0;
    border: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 2rem; /* ≈28px, matching social icons */
    width: auto;
    min-width: 3.571rem; /* ≈50px, reduced for less wide appearance */
    line-height: 1;
}

.sp-icon-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
    border: 0;
    line-height: 1;
}

/* Optional: Hover effect for interactivity */
#suicide-prevention-icon:hover {
    opacity: 0.9;
    transition: opacity 0.2s ease;
}

/* Social Icons */
.social-icons .fa {
    color: #0E406A; /* Dark blue icons */
    font-size: 2rem; /* ≈28px */
    line-height: 2rem;
    text-align: center;
}

.social-icons a:hover .fa {
    color: #D34727; /* Orange hover */
}

/* Ensure social icons match the same blue if not already set */
.ndr-mail, .ndr-facebook, .ndr-twitter, .ndr-linkedin, .ndr-instagram {
    color: #037fae; /* Consistent blue for all icons */
}

/* Remove underlines from all icon links */
.social-inline a {
    text-decoration: none !important;
}

/* Zero out all spacing for social icons and their wrappers */
.social-icons,
.social-icons *,
.social-inline,
.social-inline * {
    margin: 0;
    padding: 0;
    border: 0;
    line-height: 1;
    display: inline-block;
    vertical-align: middle;
}

    .social-icons span,
    .social-icons a span {
        width: 2rem; /* ≈28px */
        height: 2rem; /* ≈28px */
        display: inline-block;
        line-height: 2rem;
        text-align: center;
        overflow: hidden;
    }

    .social-icons .view-content.d-flex {
        gap: 0;
        display: flex;
        flex-wrap: nowrap;
    }

/* Logo Styling to Match Target Page */
.region-logo img,
img[alt="Logo North Dakota Health and Human Services"] {
    max-height: 4.571rem; /* ≈64px */
    width: auto;
}

/* Footer Styles */
.footer {
    background-color: rgb(182, 176, 162); /* As specified by user */
    color: #000; /* Black text */
    padding: 20px 0;
    font-size: 0.875rem; /* Smaller font for footer */
    margin-top: 1.5rem;
}

    .footer p {
        margin-bottom: 0;
        line-height: 1.5;
    }

    .footer a {
        color: #000; /* Black links in footer */
        text-decoration: none;
    }

        .footer a:hover,
        .footer a:focus {
            color: blue; /* Hover blue */
            text-decoration: underline;
        }

    .footer .menu--footer {
        list-style-type: none;
        padding: 0;
        margin: 0;
    }

        .footer .menu--footer li {
            display: block; /* Vertical list */
            margin-bottom: 0.5rem;
        }

    .footer .region-footer-right {
        text-align: center;
    }