/* ==========================================================================
   Indifi blog header — mirrors the indifi.com main-site header
   Source of truth: indifi-website/public/partials/header.ejs
                    indifi-website/src/sass/layout/_header.scss
   Self-contained: no Bootstrap required. All selectors are prefixed "ih-".
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700&display=swap');

:root {
    --ih-green: #05AF6E;        /* $color-base */
    --ih-green-dark: #03a064;   /* button hover */
    --ih-grey: #6B6B6B;         /* $color-heading */
    --ih-white: #fff;
    --ih-border: #d3d3d3;
    --ih-font: 'Montserrat', sans-serif;
    --ih-height: 65px;
}

/* Hide the Newsup theme's own header so only the Indifi header shows */
header.mg-headwidget { display: none !important; }

/* ---------- Shell ---------- */
.ih-header {
    position: sticky;
    top: 0;
    z-index: 1030;
    background: var(--ih-white);
    border-bottom: 1px solid var(--ih-border);
    font-family: var(--ih-font);
    box-sizing: border-box;
    transition: box-shadow .3s ease;
}
.ih-header *, .ih-header *::before, .ih-header *::after { box-sizing: inherit; }
.ih-header.ih-scrolled { box-shadow: 0 0 20px rgba(0, 0, 0, .2); border-bottom-color: #f0f0f0; }

/* Keep sticky header below the WP admin bar when logged in */
.admin-bar .ih-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .ih-header { top: 46px; } }

.ih-container {
/*     max-width: 1170px;
    margin: 0 auto;
    padding: 0 15px; */
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: var(--ih-height);
}

.ih-skip {
    position: absolute; left: -9999px; top: 0;
    background: var(--ih-green); color: #fff; padding: 8px 12px; z-index: 2000;
}
.ih-skip:focus { left: 8px; top: 8px; }

/* ---------- Logo ---------- */
.ih-logo { display: inline-flex; align-items: center; padding: 15px 0; line-height: 0; }
.ih-logo img { width: 91px; height: 29px; display: block; }
.ih-logo:focus-visible, .ih-link:focus-visible {
    outline: 3px solid var(--ih-green); outline-offset: 2px;
}

/* ---------- Hamburger (mobile) ---------- */
.ih-toggle {
    display: none;
    width: 25px; height: 25px;
    border: 0; padding: 0; margin: 0; background: transparent; cursor: pointer;
    position: relative;
	box-shadow: none;
}
.ih-toggle:hover, .ih-toggle:focus {
	background: none;
	border-color: transparent;
}

.ih-toggle-icon,
.ih-toggle-icon::before,
.ih-toggle-icon::after {
    display: block; height: 1px; background: var(--ih-grey);
    transition: all .3s ease; content: "";
    position: absolute; left: 2px;
}
.ih-toggle-icon { width: 21px; top: 12px; }
.ih-toggle-icon::before { width: 10px; top: 6px; left: 0; }
.ih-toggle-icon::after { width: 16px; top: -6px; left: 0; }
.ih-toggle:hover .ih-toggle-icon,
.ih-toggle:hover .ih-toggle-icon::before,
.ih-toggle:hover .ih-toggle-icon::after { background: var(--ih-green); width: 21px; }
.ih-toggle[aria-expanded="true"] .ih-toggle-icon { background: transparent; }
.ih-toggle[aria-expanded="true"] .ih-toggle-icon::before { transform: rotate(45deg); top: 0; width: 21px; }
.ih-toggle[aria-expanded="true"] .ih-toggle-icon::after  { transform: rotate(-45deg); top: 0; width: 21px; }

/* ---------- Nav ---------- */
.ih-nav { display: flex; align-items: center; }
.ih-menu { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; }
.ih-item { position: relative; }
.ih-menu > .ih-item:last-child > .ih-link { padding-right: 0; }

.ih-link {
    display: block;
    font: 600 13px/55px var(--ih-font);
    color: var(--ih-grey);
    text-transform: uppercase;
    text-decoration: none;
    padding: 5px 20px;
    white-space: nowrap;
    background: transparent; border: 0; cursor: pointer;
    transition: color .3s ease;
	box-shadow: none;
}
.ih-link:hover, .ih-link:focus { 
	color: var(--ih-green); 
	text-decoration: none; 
	background: none;
    border: none;
    box-shadow: none;
    outline-color: var(--ih-green); 
}
.ih-caret {
    display: inline-block; width: 0; height: 0; margin-left: 4px; vertical-align: middle;
    border-top: 4px solid; border-right: 4px solid transparent; border-left: 4px solid transparent;
}

/* Phone (shown only on wide desktops, as the main site does on scroll) */
.ih-phone { display: none; }
.ih-phone .ih-link { text-transform: none; font-weight: 400; }
.ih-phone a { color: var(--ih-green); font-weight: 600; font-size: 18px; margin-left: 5px; text-decoration: none; }
@media (min-width: 1300px) { .ih-phone { display: block; } }


/* ---------- Solutions mega-menu (custom-dropdown custom-width) ---------- */
.ih-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: -250px;
    width: 630px;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    border: 1px solid rgba(0, 0, 0, .15);
    overflow: hidden;
    z-index: 1040;
}
.ih-item.ih-open > .ih-dropdown { display: flex; }

.ih-dd-col { padding: 20px 30px; }
.ih-dd-col ul { list-style: none; margin: 0; padding: 0; }
.ih-dd-col li { line-height: 44px; font-size: 14px; display: flex; align-items: center; }
.ih-dd-col a { text-decoration: none; }
.ih-dd-col a:hover, .ih-dd-col a:focus { text-decoration: underline; }

.ih-dd-products {
    flex: 0 0 41.66%;
    background: var(--ih-green);
    color: #fff;
    border-radius: 20px 0 0 20px;
}
.ih-dd-products p { color: #fff; font-weight: 600; margin: 0 0 6px; font-size: 14px; }
.ih-dd-products a { color: #fff; }
.ih-dd-products a:focus-visible { outline-color: #fff; }

.ih-dd-custom { flex: 1 1 auto; display: flex; flex-wrap: wrap; align-content: flex-start; }
.ih-dd-custom p { flex: 0 0 100%; color: var(--ih-grey); margin: 0 0 6px; font-size: 14px; }
.ih-dd-custom ul { flex: 0 0 50%; }
.ih-dd-custom a { color: #333; }

/* Inline SVG icons extracted from the main site's icomoon font */
.ih-ico { width: 20px; height: 20px; margin-right: 8px; fill: currentColor; flex: 0 0 auto; }
.ih-dd-custom .ih-ico { width: 18px; height: 18px; color: var(--ih-green); }

/* ---------- Mobile / tablet (≤ 991px) ---------- */
@media (max-width: 991px) {
    .ih-toggle { display: block; order: -1; margin-right: 15px; }
    .ih-container { flex-wrap: wrap; justify-content: flex-start; }
    .ih-logo { margin-right: auto; }

    .ih-nav { display: none; flex: 0 0 100%; order: 10; padding-bottom: 10px; }
    .ih-nav.ih-nav-open { display: block; }

    .ih-menu { display: block; }
    .ih-link { line-height: 1.4; padding: 12px 12px 12px 15px; white-space: normal; width: 100%; text-align: left; }
    .ih-phone { display: block; }

    /* Mega-menu reflows into the stacked list */
    .ih-dropdown {
        position: static; width: 100%; left: 0; border-radius: 0; box-shadow: none; border: 0;
        flex-direction: column;
    }
    .ih-dd-products { border-radius: 0; flex-basis: auto; display: none; }
    .ih-dd-products p, .ih-dd-custom p { display: none; }
    .ih-dd-custom ul { flex: 0 0 100%; }
    .ih-dd-col { padding: 10px 15px 10px 30px; }
}