/*general*/

.section.main article a.hio-recommended-card:hover,
.section.main article a.hio-tool-card:hover {
    text-decoration: none !important;
}

/*some hero changes*/
body.states-template-tmp-states-health-insurance .hero-section h1 {
    color: #1C394F;
    text-wrap-style: pretty;
    /* H1 */
    font-family: "Encode Sans Semi Condensed", serif;
    font-size: 38px;
    font-style: normal;
    font-weight: 600;
    line-height: 125%; /* 47.5px */
    letter-spacing: 0.19px;
}

/* Recommended Article Widget */
.hio-recommended-card,
.hio-tool-card {
    width: 100%;
    height: 140px;
    padding-right: 32px;
    background: #ffffff;
    overflow: hidden;
    border-radius: 16px;
    outline: 1px solid #A9AFB8;
    outline-offset: -1px;
    justify-content: flex-start;
    align-items: center;
    gap: 32px;
    display: inline-flex;
    text-decoration: none;
    color: inherit;
    box-sizing: border-box;
}

.hio-recommended-card:hover,
.hio-tool-card:hover {
    text-decoration: none !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06) !important;
}

.hio-recommended-img,
.hio-tool-img {
    width: 140px;
    height: 140px;
    object-fit: cover;
    flex-shrink: 0;
}

.hio-recommended-content,
.hio-tool-content {
    flex: 1 1 0;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 4px;
    display: inline-flex;
}

.hio-recommended-header,
.hio-tool-header {
    align-self: stretch;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 2px;
    display: flex;
}

.hio-recommended-tag,
.hio-tool-subtitle {
    align-self: stretch;
    justify-content: center;
    display: flex;
    flex-direction: column;
    color: #1A73E8;
    font-size: 18px;
    font-family: 'Encode Sans Semi Condensed', sans-serif;
    font-weight: 600;
    line-height: 25.20px;
    letter-spacing: 0.54px;
    word-wrap: break-word;
}

.hio-recommended-title,
.hio-tool-title {
    align-self: stretch;
    max-height: 60px;
    justify-content: center;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.hio-recommended-title-text,
.hio-tool-title-text{
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #1C394F;
    font-style: normal;
    font-size: 24px;
    font-family: 'Encode Sans Semi Condensed', sans-serif;
    font-weight: 600;
    line-height: 30px;
    letter-spacing: 0.48px;
    word-wrap: break-word;
}

.hio-recommended-meta,
.hio-tool-meta {
    align-self: stretch;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    display: inline-flex;
}

.hio-recommended-meta-item,
.hio-tool-meta-item {
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    display: flex;
    color: #4F4F4F;
    font-size: 18px;
    font-family: 'Encode Sans Semi Condensed', sans-serif;
    font-weight: 500;
    line-height: 25.20px;
    letter-spacing: 0.54px;
    font-style: normal;
    overflow: hidden;
}

.hio-recommended-meta-item .hio-icon,
.hio-tool-meta-item .hio-icon {
    margin-top: 3px;
}

@media (max-width: 1023px) {
    .hio-recommended-card,
    .hio-tool-card {
        height: 120px;
        gap: 16px;
        padding-right: 16px;
    }
    .hio-recommended-img,
    .hio-tool-img {
        width: 120px;
        height: 120px;
    }
    .hio-recommended-tag,
    .hio-tool-subtitle {
        font-size: 16px;
        font-weight: 600;
        line-height: 22.4px;
        letter-spacing: 0.48px;
    }

    .hio-recommended-title,
    .hio-tool-title {
        align-self: stretch;
        max-height: 50px;
    }

    .hio-recommended-title-text,
    .hio-tool-title-text{
        font-size: 20px;
        line-height: 25px;
        letter-spacing: 0.4px;
    }

    .hio-recommended-meta,
    .hio-tool-meta {
        gap: 8px;
    }

    .hio-recommended-meta-item,
    .hio-tool-meta-item {
        font-size: clamp(14px, 4vw, 16px);
        line-height: 22.4px;
        letter-spacing: 0.48px;
    }
}

.hio-recommended-divider {
    width: 0;
    height: 18px;
    border-left: 1px solid #A9AFB8;
}

.hio-icon {
    display: flex;
    align-self: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* Tool / Calculator Card Widget */
/*.hio-tool-card {*/
/*    align-self: stretch;*/
/*    width: 100%;*/
/*    padding-right: 16px;*/
/*    background: #ffffff;*/
/*    overflow: hidden;*/
/*    border-radius: 12px;*/
/*    outline: 1px solid #A9AFB8;*/
/*    outline-offset: -1px;*/
/*    justify-content: flex-start;*/
/*    align-items: center;*/
/*    gap: 16px;*/
/*    display: inline-flex;*/
/*    text-decoration: none;*/
/*    color: inherit;*/
/*    box-sizing: border-box;*/
/*    transition: box-shadow 0.2s ease, transform 0.2s ease;*/
/*}*/

/*.hio-tool-card:hover {*/
/*    text-decoration: none;*/
/*    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);*/
/*}*/

/*.hio-tool-img {*/
/*    width: 120px;*/
/*    height: 120px;*/
/*    object-fit: cover;*/
/*    flex-shrink: 0;*/
/*}*/

/*.hio-tool-content {*/
/*    flex: 1 1 0;*/
/*    flex-direction: column;*/
/*    justify-content: flex-start;*/
/*    align-items: flex-start;*/
/*    gap: 4px;*/
/*    display: inline-flex;*/
/*}*/

/*.hio-tool-header {*/
/*    align-self: stretch;*/
/*    flex-direction: column;*/
/*    justify-content: flex-start;*/
/*    align-items: flex-start;*/
/*    gap: 2px;*/
/*    display: flex;*/
/*}*/

/*.hio-tool-subtitle {*/
/*    align-self: stretch;*/
/*    justify-content: center;*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    color: #1A73E8;*/
/*    font-size: 16px;*/
/*    font-family: 'Encode Sans Condensed', sans-serif;*/
/*    font-weight: 600;*/
/*    line-height: 22.40px;*/
/*    letter-spacing: 0.48px;*/
/*    word-wrap: break-word;*/
/*}*/

/*.hio-tool-title {*/
/*    align-self: stretch;*/
/*    max-height: 50px;*/
/*    justify-content: center;*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    color: #1C394F;*/
/*    font-size: 20px;*/
/*    font-family: 'Encode Sans Condensed', sans-serif;*/
/*    font-weight: 600;*/
/*    line-height: 25px;*/
/*    letter-spacing: 0.40px;*/
/*    word-wrap: break-word;*/
/*    overflow: hidden;*/
/*    text-overflow: ellipsis;*/
/*}*/

/*.hio-tool-meta {*/
/*    align-self: stretch;*/
/*    justify-content: flex-start;*/
/*    align-items: center;*/
/*    gap: 12px;*/
/*    display: inline-flex;*/
/*}*/

/*.hio-tool-meta-item {*/
/*    justify-content: flex-start;*/
/*    align-items: center;*/
/*    gap: 8px;*/
/*    display: flex;*/
/*    color: #4F4F4F;*/
/*    font-size: 16px;*/
/*    font-family: 'Encode Sans Condensed', sans-serif;*/
/*    font-weight: 500;*/
/*    line-height: 22.40px;*/
/*    letter-spacing: 0.48px;*/
/*}*/

/*.hio-tool-grid-icon {*/
/*    width: 16px;*/
/*    height: 16px;*/
/*    position: relative;*/
/*    display: inline-block;*/
/*    flex-shrink: 0;*/
/*}*/

/* Asiguram ca span-urile din shortcode se comporta ca block/flex elements */
.hio-tool-card span,
.hio-recommended-card span {
    display: flex;
}

.hio-tool-content,
.hio-recommended-content,
.hio-tool-header,
.hio-recommended-header {
    display: flex !important;
    flex-direction: column;
}

/* Shortcode [hio_tip] */
.hio-tip-box {
    width: 100%;
    height: 100%;
    padding: 20px;
    background: #DEECFF;
    overflow: hidden;
    border-radius: 12px;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    display: flex;
    gap: 8px;
    box-sizing: border-box;
    margin: 16px 0;
}

.hio-tip-header {
    align-self: stretch;
    justify-content: flex-start;
    align-items: center;
    gap: 4px;
    display: inline-flex;
}

.hio-tip-icon-wrapper {
    width: 24px;
    height: 24px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hio-tip-icon-inner {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hio-tip-title {
    color: #1C394F;
    font-size: 18px;
    font-family: 'Encode Sans Condensed', sans-serif;
    font-weight: 700;
    line-height: 22.50px;
    letter-spacing: 0.54px;
    word-wrap: break-word;
}

.hio-tip-content {
    align-self: stretch;
    color: #1C394F;
    font-size: 18px;
    font-family: 'Encode Sans Condensed', sans-serif;
    font-weight: 500;
    line-height: 25.20px;
    letter-spacing: 0.54px;
    word-wrap: break-word;
}


@media (min-width: 768px){
    .hio-tip-box {
        padding: 24px;
        border-radius: 16px;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 24px;
    }

    .hio-tip-header {
        align-self: stretch;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 4px;
        display: inline-flex;
        width: 165px;
    }

    .hio-tip-icon-wrapper {
        width: 24px;
        height: 24px;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .hio-tip-icon-inner {
        width: 20px;
        height: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .hio-tip-title {
        color: #1C394F;
        font-size: 20px;
        font-family: 'Encode Sans Semi Condensed', sans-serif;
        font-style: normal;
        font-weight: 700;
        line-height: 25px;
        letter-spacing: 0.6px;
        word-wrap: break-word;
    }

    .hio-tip-content {
        align-self: stretch;
        color: #1C394F;
        font-size: 20px;
        font-family: 'Encode Sans Semi Condensed', sans-serif;
        font-style: normal;
        font-weight: 500;
        line-height: 28px;
        letter-spacing: 0.6px;
        word-wrap: break-word;
        flex: 1 0 0;
        align-items: flex-start;
    }

}

/* Shortcode [hio_quote] */
.hio-quote-box {
    width: 100%;
    height: 100%;
    padding-left: 40px;
    overflow: hidden;
    border-left: 7px solid #1A73E8;
    justify-content: flex-start;
    align-items: center;
    display: flex;
    box-sizing: border-box;
    margin: 24px 0;
}

.hio-quote-inner {
    width: 100%;
    max-width: 100%;
    padding-top: 20px;
    padding-bottom: 20px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    display: flex;
}

.hio-quote-text {
    flex: 1 1 0;
    color: #1C394F;
    font-size: 24px;
    font-family: 'Encode Sans Semi Condensed', sans-serif;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.72px;
    word-wrap: break-word;
}

/*sidebar*/
body.states-template-tmp-states-health-insurance .sidebar-lead-form-column .sf_lead_gen_entry .content .inner_card {
    padding: 20px 32px !important;
    border-radius: 4px !important;
}

@media (min-width: 1248px) {
    /*.section.main article .hio-theme .desktop\:border-radius-left-none, */
    body.states-template-tmp-states-health-insurance .sidebar-lead-form-column > .sidebar-form-card > .hio-theme > .sf_lead_gen_entry.card.border-small.border-radius-lg.border-gray-light,
    body.states-template-tmp-states-health-insurance .sidebar-lead-form-column .hio-theme .desktop\:border-radius-left-none {
        border-left: 1px solid #a9afb8 !important;
        border-top-left-radius: 16px !important;
        border-bottom-left-radius: 16px !important;
    }
}
body.states-template-tmp-states-health-insurance .sidebar-lead-form-column > .sidebar-form-card > .hio-theme > .sf_lead_gen_entry.card.border-small.border-radius-lg.desktop:border-radius-left-none.border-gray-light,
body.states-template-tmp-states-health-insurance .sidebar-lead-form-column .hio-theme .sf_lead_gen_entry {
    border-left: 1px solid  #a9afb8 !important;
    border-top-left-radius: 16px !important;
    border-bottom-left-radius: 16px !important;

}

/*miscelaneous for new design, retyling some wudgets for two columns*/
body.states-template-tmp-states-health-insurance .main-content-column {
    padding: 15px !important;
    max-width: 680px !important;
}

body.states-template-tmp-states-health-insurance .hero-section .lc,
body.states-template-tmp-states-health-insurance .hero-section .rc {
    padding: 0 !important;
}

body.states-template-tmp-states-health-insurance .hero-section {
    gap: 64px !important;
}

@media (min-width: 769px) {
    body.states-template-tmp-states-health-insurance .template-content-layout-wrapper .main-content-column #hio_quick_facts {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

body.states-template-tmp-states-health-insurance .template-content-layout-wrapper {
    gap: 64px !important;
}
body.states-template-tmp-states-health-insurance .template-content-layout-wrapper .main-content-column {
    padding: 0 !important;
    max-width: 680px !important;
}


body.states-template-tmp-states-health-insurance .main-content-column .copy-section-content h1 {
    text-align: left !important;
}
/*subsidy calc and emtal level calc in one column while sidebar is on*/
body.states-template-tmp-states-health-insurance .main-content-column .subsidy_calc,
body.states-template-tmp-states-health-insurance .main-content-column .subsidy_calc.metal_level_calculator_page,
body.states-template-tmp-states-health-insurance .main-content-column .subsidy_calc .main-wrapper,
body.states-template-tmp-states-health-insurance .main-content-column .subsidy_calc.metal_level_calculator_page .main-wrapper {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    display: flex;
    flex-direction: column !important;
}
body.states-template-tmp-states-health-insurance .main-content-column .subsidy_calc.metal_level_calculator_page {
    padding: 0 !important;
}

/*quick facts new design*/
body.states-template-tmp-states-health-insurance .main-content-column #hio_quick_facts .hio_quick_facts_title {
    text-align: left !important;
}
body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0 !important;
    width: 100% !important;
    border-radius: 16px !important;
    border: 1px solid #A9AFB8 !important;
    overflow: hidden !important;
    -webkit-backface-visibility: hidden !important;
    -webkit-transform: translateZ(0) !important;
    transform: translateZ(0) !important;
}
body.states-template-tmp-states-health-insurance .main-content-column .hio_quick_facts_items .product-card {
    max-width: unset !important;
    border: unset !important;
    border-radius: unset !important;
    box-shadow: unset !important;
}
/* Base Card Reset (Clears default/theme borders) */
body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .product-card {
    border: none !important;
    box-sizing: border-box !important;
}
/* Item 1 spans all 3 columns */
body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(1) {
    grid-column: 1 / -1 !important;
    border-bottom: 1px solid #A9AFB8 !important;
}
/* Items 2, 3, and 4 each take 1 column automatically */
body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(n+2) {
    grid-column: span 1 !important;
}
/* 2. Items 3 & 4 (2nd & 3rd cards in the bottom row) -> Left border only */
body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(3),
body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(4) {
    border-left: 1px solid #A9AFB8 !important;
}
/* 1. Hide unwanted SVG and background icons */
body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .product-card img.svg,
body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .product-card img.background {
    display: none !important;
}

/* 2. Configure Bottom 3 Cards as Flex Columns */
body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(n+2) {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    gap: 16px !important; /* Space between the big number and the text below it */
}

/* 3. Re-order: Move <p> ($89, 16, 49%) to the TOP */
body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(n+2) > p {
    order: 1 !important;
    margin: 0 !important;
    color: var(--Color-Slate-Blue-Deep, #1C394F) !important;
    font-size: 48px !important;
    font-weight: 600 !important;
    line-height: 60px !important;
    letter-spacing: 0.24px !important;
}

/* 4. Re-order: Move <div class="title"> (Label text) BELOW the number */
body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(n+2) .title {
    order: 2 !important;
    margin: 0 !important;
}

/* Fine-tuning label typography & footnotes display */
body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(n+2) .title h3 {
    display: inline !important;
    margin: 0 !important;
    color: var(--Color-Ink, #4F4F4F) !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    line-height: 28px !important;
    letter-spacing: 0.60px !important;
}

body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(n+2) .title p,
body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(n+2) .title span,
body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(n+2) .title sup {
    display: inline !important;
    margin: 0 !important;
}

body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(n+2) .title a {
    color: var(--Color-Blue, #1A73E8) !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    line-height: 28px !important;
    letter-spacing: 0.60px !important;
    text-decoration: none !important;
    vertical-align: super !important;
}

/* ==========================================================================
   MOBILE BREAKPOINT (1 Column per row on screens <= 768px)
   ========================================================================== */
@media (max-width: 768px) {
    body.states-template-tmp-states-health-insurance .hero-section,
    body.states-template-tmp-states-health-insurance .main-content-column .subsidy_calc,
    body.states-template-tmp-states-health-insurance .main-content-column .subsidy_calc .main-wrapper {
        padding: 0 15px !important;
    }
    aside.sidebar-lead-form-column {
        display: none !important;
    }
    body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card {
        padding: 20px !important;
    }
    /* 1. Switch outer grid to single column */
    body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items {
        grid-template-columns: 1fr !important;
    }

    /* 2. Configure bottom cards (2, 3, 4) into horizontal 2-column row flex layouts */
    body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(n+2) {
        flex-direction: row !important;
        align-items: center !important;
        gap: 16px !important;
    }

    /* Left Column (Big Number): 40% Width */
    body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(n+2) > p {
        flex: 0 0 40% !important;
        max-width: 40% !important;
        box-sizing: border-box !important;
    }

    /* Right Column (Label Text): 60% Width */
    body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(n+2) .title {
        flex: 0 0 60% !important;
        max-width: 60% !important;
        box-sizing: border-box !important;
    }

    /* 3. Border Adjustments: Remove left borders, add top border on cards 3 & 4 */
    body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(3),
    body.states-template-tmp-states-health-insurance .main-content-column div#hio_quick_facts .hio_quick_facts_items .product-card:nth-child(4) {
        border-left: none !important;
        border-top: 1px solid var(--Color-Gray-Light, #A9AFB8) !important;
    }
}

@media (max-width: 768px) {
    body.states-template-tmp-states-health-insurance .hero-section {
        box-sizing: border-box !important;
    }
    body.states-template-tmp-states-health-insurance .hero-section a.button {
        margin-bottom: 24px !important;
    }
    body.states-template-tmp-states-health-insurance .hero-section .lc:has(.form-featured.new-lead-form-wrap) + .rc  {
        padding: 0 !important;
    }
    body.states-template-tmp-states-health-insurance .sidebar-lead-form-column .sidebar-form-card .hio-theme p.small-text {
        margin: 8px 0 !important;
    }
}

/*faqs*/
body.states-template-tmp-states-health-insurance .main-content-column h2.faqs_title {
    padding: 0 !important;
    text-align: left !important;
}
body.states-template-tmp-states-health-insurance .main-content-column div.faqs {
    padding: 25px 0 30px !important;
}
body.states-template-tmp-states-health-insurance .main-content-column div.faqs .toggle {
    border: unset !important;
    border-radius: 0 !important;
    margin-bottom: 0 !important;
    overflow: hidden;
    border-bottom: 1px solid #DBDBDB !important;
}

@media (max-width: 768px) {
    body.states-template-tmp-states-health-insurance .main-content-column h2.faqs_title,
    body.states-template-tmp-states-health-insurance .main-content-column div.faqs {
        padding: 0 15px !important;
    }
}

body.states-template-tmp-states-health-insurance .main-content-column div.faqs .toggle,
body.states-template-tmp-states-health-insurance .main-content-column div.faqs .toggle .toggle-title,
body.states-template-tmp-states-health-insurance .main-content-column div.faqs .toggle .toggle-inner {
    background: transparent !important;
}

body.states-template-tmp-states-health-insurance .main-content-column div.faqs .toggle .title-name {
    padding: 24px 40px 24px 0 !important;
}

/*various 2*/
body.states-template-tmp-states-health-insurance .copy-section h1,
body.states-template-tmp-states-health-insurance .copy-section h2,
body.states-template-tmp-states-health-insurance .copy-section h3,
body.states-template-tmp-states-health-insurance .copy-section h4,
body.states-template-tmp-states-health-insurance h2,
.section.main article h2,
.section.main article .show-facts-title,
.section.main article .show-title-section,
.section.main article h2,.section.main article h3 {
    color: #1C394F !important;
}

/* Custom Footnote Tooltip Container */
div.custom-fn-tooltip {
    display: flex !important;
    position: absolute !important;
    padding: 12px 36px 12px 12px !important;
    gap: 4px;
    align-self: stretch;
    border-radius: 4px !important;
    background: #1C394F !important;
    color: #FFF !important;
    text-wrap-style: pretty;
    border: unset !important;
    box-shadow: unset !important;
    z-index: 999999 !important;
    box-sizing: border-box !important;
    max-width: 420px !important;
    max-height: 260px !important;       /* Prevents huge footnotes from expanding offscreen */
    /*overflow-y: auto !important;        !* Adds smooth scrolling if content is long *!*/
    pointer-events: auto !important;    /* Enables links inside to be clicked */
}

@media (max-width:768px) {
    div.custom-fn-tooltip {
        max-width: 320px !important;
    }
}

/* Base Arrow (Default: Tooltip is ABOVE trigger, arrow points DOWN) */
div.custom-fn-tooltip::after {
    content: "" !important;
    position: absolute !important;
    bottom: -8px !important;
    top: auto !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 8px solid transparent !important;
    border-right: 8px solid transparent !important;
    border-top: 8px solid #1C394F !important;
    border-bottom: none !important;
    pointer-events: none !important;
    z-index: 10 !important;
}

/* Flipped Arrow (When Tooltip is BELOW trigger, arrow points UP) */
div.custom-fn-tooltip.tooltip-below::after {
    bottom: auto !important;
    top: -8px !important;
    border-top: none !important;
    border-bottom: 8px solid #1C394F !important;
}

/* Typography & Content Wrapper */
div.custom-fn-tooltip .custom-fn-content {
    font-family: 'Encode Sans Semi Condensed', sans-serif !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 500 !important;
    line-height: 25.2px !important;
    letter-spacing: 0.54px !important;
    color: #FFF !important;
    margin: 0 !important;
    padding: 0 !important;
    word-break: break-word !important;   /* Prevents long URLs from pushing box outside viewport */
}

/* Functional SVG Close Button */
div.custom-fn-tooltip .custom-fn-close {
    position: absolute !important;
    top: 16px !important;
    right: 16px !important;
    width: 12px !important;
    height: 12px !important;
    cursor: pointer !important;
    display: block !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M0.244078 0.244078C0.569515 -0.0813593 1.09715 -0.0813593 1.42259 0.244078L5.83333 4.65482L10.2441 0.244078C10.5695 -0.0813593 11.0972 -0.0813593 11.4226 0.244078C11.748 0.569515 11.748 1.09715 11.4226 1.42259L7.01184 5.83333L11.4226 10.2441C11.748 10.5695 11.748 11.0972 11.4226 11.4226C11.0972 11.748 10.5695 11.748 10.2441 11.4226L5.83333 7.01184L1.42259 11.4226C1.09715 11.748 0.569515 11.748 0.244078 11.4226C-0.0813593 11.0972 -0.0813593 10.5695 0.244078 10.2441L4.65482 5.83333L0.244078 1.42259C-0.0813593 1.09715 -0.0813593 0.569515 0.244078 0.244078Z' fill='%23F3F2F1'/%3E%3C/svg%3E") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    opacity: 0.85;
    transition: opacity 0.2s ease;
}

div.custom-fn-tooltip .custom-fn-close:hover {
    opacity: 1 !important;
}

/* Links inside the Tooltip Content */
div.custom-fn-tooltip .custom-fn-content a {
    color: #FFF !important;          /* Light-blue for high contrast readability against #1C394F */
    font-weight: 600 !important;
    text-decoration: underline !important;
    pointer-events: auto !important;
    cursor: pointer !important;
}

div.custom-fn-tooltip .custom-fn-content a:hover {
    color: #93C5FD !important;
}

/* Suppress remnant native plugin tooltips visually */
div.ui-tooltip:not(.custom-fn-tooltip),
.easy-footnotes-tooltip,
.fme-tooltip {
    display: none !important;
}

div.custom-fn-tooltip .custom-fn-content .footnote-back-link-wrapper {
    display: none !important;
}

div.hio-footnotes-title,
div.hio-footnotes-title.active,
ol.footnotes {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
}

/*fixes key taaways*/
body.post-template-tmp-blog-faq-gloassary:has(.custom-cta-toc-wrapper) .section.main article div.takeaway ul li,
body.post-template-tmp-blog-faq-gloassary:has(.custom-cta-toc-wrapper) .section.main article div.takeaway ul li>a {
    color: #4F4F4F !important;
}

/*fixes for faqs scroll*/
/* Instant Accordion Display (No CSS Transition Lag) */
.toggle .toggle-inner {
    display: none !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Instant reveal when parent or title is active */
.toggle .toggle-title.active + .toggle-inner {
    display: block !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
}
