/* ==========================================================================
   Paligo custom CSS - Help Center / Salesforce parity
   VERSION 6/25 - consolidated help-center-match v11 callouts-icons-accordion-padding
   ========================================================================== */

:root {
    --paligo-custom-css-version: "VERSION 6/25 - consolidated help-center-match v11 callouts-icons-accordion-padding";
    --hc-font: "Street 3", NotoSans, Arial, sans-serif;
    --hc-black: #0F0F0F;
    --hc-body: #545454;
    --hc-link: #116FBB;
    --hc-blue-gray: #4F6984;
    --hc-page-bg: #f5f5f5;
    --hc-white: #ffffff;
    --hc-panel-border: rgba(223, 223, 223, 0.8);
    --hc-panel-shadow: 0px 0px 30px rgb(223 223 223 / 20%);
}


/* ==========================================================================
   BASE PALIGO PORTAL STYLES
   Kept from the original custom CSS, but avoids broad h1/h2/a rules that
   were affecting the Help Center article page.
   ========================================================================== */

.portal-header::before {
    background-color: #000000;
}

.portal-single-publication .publication-icon,
.publication-contents h4 span {
    background-color: var(--hc-black);
}

.portal-contents {
    margin-top: 2em;
}

.portal-body,
.site-content {
    background-color: #eeeeee;
}

.portal-footer {
    width: 100%;
    margin-top: 0;
    margin-left: 0;
    background-color: #252525;
    color: #ffffff;
}

.portal-footer .inner {
    border-top: none;
}

.col-md-3 {
    width: 75%;
}

.theme1.page-toc main article {
    padding-left: 8%;
    padding-right: 8%;
}

.portal-body main article,
.site-content main article {
    background-color: var(--hc-white);
    border-radius: 8px;
    box-shadow: var(--hc-panel-shadow);
    margin-top: 20px;
    padding-top: 40px;
    padding-bottom: 40px;
}

.site-sidebar {
    background-color: #252525;
}

.portal-body :is(h1, h2, h3, h4, h5, h6),
.site-content :is(h1, h2, h3, h4, h5, h6) {
    color: var(--hc-black);
    line-height: 1.35em;
    font-weight: 700;
    text-transform: none;
}

.portal-body h1,
.site-content h1 {
    font-size: 32px;
}

.portal-body :is(h2, h3, h5, h6),
.site-content :is(h2, h3, h5, h6) {
    font-size: 20px;
}

.portal-body :is(h4, h5, h6),
.site-content :is(h4, h5, h6) {
    margin: 10px 10px 10px 0;
}

.portal-body a,
.site-content a {
    color: #559ce2;
}

.section-toc .topic-link {
    color: var(--hc-body);
}

.theme1 .procedure > li::before {
    background-color: transparent;
    color: var(--hc-black);
    font-size: 18px;
}


/* ==========================================================================
   HELP CENTER BASE NORMALIZATION
   Live site uses Street 3, normal letter spacing, and auto font smoothing.
   ========================================================================== */

html body.Site,
body.Site {
    line-height: 16px !important;
    -webkit-font-smoothing: auto !important;
    text-rendering: auto !important;
    color: rgb(84, 84, 84) !important;
    background-color: transparent !important;
}

#AnswerBody,
#AnswerBody .PaligoHost,
#AnswerBody .PaligoArticle,
#AnswerBody .PaligoArticle * {
    box-sizing: border-box !important;
    font-family: var(--hc-font) !important;
    letter-spacing: normal !important;
    -webkit-font-smoothing: auto !important;
    text-rendering: auto !important;
}

#AnswerBody {
    width: 100% !important;
    max-width: none !important;
}

#AnswerBody .PaligoHost,
#AnswerBody .PaligoArticle {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    color: var(--hc-body) !important;
}


/* ==========================================================================
   HELP CENTER LAYOUT / ARTICLE CARD
   ========================================================================== */

.AnswerBlock .Column1 #AnswerBody,
.AnswerBlock .Column1 #AnswerBody .PaligoHost,
.AnswerBlock .Column1 #AnswerBody .PaligoArticle {
    width: 100% !important;
    max-width: none !important;
}

@media screen and (min-width: 1024px) {
    /* .AnswerFrame > .AnswerBlock,
    .AnswerFrame > .AnswerBlock > .AnswerContainer {
        margin-top: -16px !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    } */

    .AnswerBlock .Column1,
    .AnswerBlock .Column1 #AnswerBody,
    #AnswerBody .PaligoHost,
    #AnswerBody .PaligoArticle {
        background: var(--hc-white) !important;
        box-shadow: none !important;
    }

    .AnswerBlock .Column1 #AnswerBody .PaligoArticle {
        padding: 0 50px 40px 50px !important;
    }
}

@media screen and (max-width: 1023px) {
    .AnswerBlock .Column1,
    .AnswerBlock .Column1 #AnswerBody,
    #AnswerBody .PaligoHost,
    #AnswerBody .PaligoArticle {
        background: transparent !important;
        box-shadow: none !important;
    }

    #AnswerBody,
    #AnswerBody .PaligoHost,
    #AnswerBody .PaligoArticle,
    #AnswerBody .PaligoArticle .condition-tabcontent {
        font-size: 14px !important;
        line-height: 21px !important;
        color: var(--hc-body) !important;
    }
}

/* Live responsive landscape keeps the article content 30px from the card edge.
   Paligo's host already contributes roughly 15px, so 15px here lands at 30px. */
@media screen and (min-width: 800px) and (max-width: 1023px) {
    .AnswerBlock .Column1 #AnswerBody .PaligoArticle {
        padding: 0 15px 34px 15px !important;
    }
}

/* Mobile portrait:
   Live Salesforce uses a 25px gutter on #AnswerBody and no extra nested
   article padding. Paligo has both .PaligoHost and .PaligoArticle wrappers,
   so remove their side padding here to prevent the content from shrinking
   to 310px. This keeps mobile tabs/panels at the live 340px content width. */
@media screen and (max-width: 799px) {
    .AnswerBlock .Column1 #AnswerBody {
        padding-left: 25px !important;
        padding-right: 25px !important;
    }

    .AnswerBlock .Column1 #AnswerBody .PaligoHost,
    .AnswerBlock .Column1 #AnswerBody .PaligoArticle {
        width: 100% !important;
        max-width: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .AnswerBlock .Column1 #AnswerBody .PaligoArticle {
        padding-top: 0 !important;
        padding-bottom: 34px !important;
    }
}


/* ==========================================================================
   BREADCRUMBS
   ========================================================================== */

.CategoryBreadcrumbs,
#CategoryBreadCrumbs,
#BreadCrumbDiv,
#BreadCrumbDiv ol.breadcrumbs {
    margin-bottom: 0 !important;
}

#BreadCrumbDiv .BreadcrumbList,
.BreadcrumbList {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    font-family: "Street 3", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    color: var(--hc-link) !important;
    background: transparent !important;
    box-sizing: border-box !important;
    -webkit-font-smoothing: auto !important;
    text-rendering: auto !important;
}

@media screen and (min-width: 1024px) {
    #BreadCrumbDiv .BreadcrumbList,
    .BreadcrumbList {
        padding: 15px 0 !important;
        line-height: 16.25px !important;
    }
}

@media screen and (max-width: 1023px) {
    #BreadCrumbDiv .BreadcrumbList,
    .BreadcrumbList {
        width: 100% !important;
        padding: 15px 16px !important;
        line-height: 20px !important;
    }
}

main #BreadCrumbDiv ol,
main #BreadCrumbDiv ul {
    padding-left: 0 !important;
}


/* ==========================================================================
   ARTICLE TYPOGRAPHY
   ========================================================================== */

#AnswerBody .PaligoArticle :is(.abstract, .abstract-title, .keywordset, .keywords),
#AnswerBody .PaligoArticle .titlepage :is(.abstract, .abstract-title) {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

#AnswerBody .PaligoArticle :is(h1, h2, h3, h4, h5, h6),
#AnswerBody .PaligoArticle .title {
    color: var(--hc-black) !important;
    font-family: var(--hc-font) !important;
    letter-spacing: normal !important;
    -webkit-font-smoothing: auto !important;
    text-rendering: auto !important;
}

/* Live Salesforce bold labels are medium-weight body color, not black/heavy. */
#AnswerBody .PaligoArticle :is(strong, b),
#AnswerBody .PaligoArticle .bold,
#AnswerBody .PaligoArticle .bold :is(strong, b) {
    color: var(--hc-body) !important;
    font-family: var(--hc-font) !important;
    font-weight: 500 !important;
    letter-spacing: normal !important;
    -webkit-font-smoothing: auto !important;
    text-rendering: auto !important;
}

#AnswerBody .PaligoArticle > h1,
#AnswerBody .PaligoArticle .KBTitle > h1,
#AnswerBody .PaligoArticle .titlepage .title h1,
#AnswerBody .PaligoArticle .titlepage .title h2.title,
#AnswerBody h1 {
    color: var(--hc-black) !important;
    font-family: var(--hc-font) !important;
    font-weight: 500 !important;
    margin-top: 0 !important;
}

@media screen and (min-width: 1024px) {
    #AnswerBody .PaligoArticle > h1,
    #AnswerBody .PaligoArticle .KBTitle > h1,
    #AnswerBody .PaligoArticle .titlepage .title h1,
    #AnswerBody .PaligoArticle .titlepage .title h2.title,
    #AnswerBody h1 {
        font-size: 36px !important;
        line-height: 48.6px !important;
        margin-bottom: 36px !important;
        padding-top: 39px !important;
    }
}

@media screen and (max-width: 1023px) {
    #AnswerBody .PaligoArticle > h1,
    #AnswerBody .PaligoArticle .KBTitle > h1,
    #AnswerBody .PaligoArticle .titlepage .title h1,
    #AnswerBody .PaligoArticle .titlepage .title h2.title,
    #AnswerBody h1 {
        font-size: 32px !important;
        line-height: 43.2px !important;
        margin-bottom: 32px !important;
        padding-top: 25px !important;
    }
}

#AnswerBody .PaligoArticle p,
#AnswerBody .PaligoArticle .para,
#AnswerBody .PaligoArticle li {
    color: var(--hc-body) !important;
    font-family: var(--hc-font) !important;
    font-weight: 400 !important;
}

@media screen and (min-width: 1024px) {
    #AnswerBody .PaligoArticle p,
    #AnswerBody .PaligoArticle .para,
    #AnswerBody .PaligoArticle li {
        font-size: 16px !important;
        line-height: 24px !important;
    }

    #AnswerBody .PaligoArticle p,
    #AnswerBody .PaligoArticle .para {
        margin: 16px 0 !important;
    }
}

@media screen and (max-width: 1023px) {
    #AnswerBody .PaligoArticle p,
    #AnswerBody .PaligoArticle .para,
    #AnswerBody .PaligoArticle li {
        font-size: 14px !important;
        line-height: 21px !important;
    }

    #AnswerBody .PaligoArticle p,
    #AnswerBody .PaligoArticle .para {
        margin: 14px 0 !important;
    }
}

/* Main section heading, e.g. "Choose a device type:" */
#AnswerBody .PaligoArticle section.section > .titlepage,
#AnswerBody .PaligoArticle .section > .titlepage {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

#AnswerBody .PaligoArticle section.section > .titlepage h3.title,
#AnswerBody .PaligoArticle .section > .titlepage h3.title {
    color: var(--hc-black) !important;
    font-family: var(--hc-font) !important;
    font-weight: 500 !important;
    padding-top: 0 !important;
}

@media screen and (min-width: 1024px) {
    #AnswerBody .PaligoArticle section.section > .titlepage h3.title,
    #AnswerBody .PaligoArticle .section > .titlepage h3.title {
        font-size: 24px !important;
        line-height: 32.4px !important;
        margin-top: 36px !important;
        margin-bottom: 12px !important;
    }
}

@media screen and (max-width: 1023px) {
    #AnswerBody .PaligoArticle section.section > .titlepage h3.title,
    #AnswerBody .PaligoArticle .section > .titlepage h3.title {
        font-size: 20px !important;
        line-height: 27px !important;
        margin-top: 30px !important;
        margin-bottom: 10px !important;
    }
}

/* Non-accordion bridgeheads inside tab panels, e.g. "TV device not supported?" */
#AnswerBody .PaligoArticle .condition-tabcontent > :is(.bridgehead, h1.bridgehead, h2.bridgehead, h3.bridgehead, h4.bridgehead, h5.bridgehead, h6.bridgehead) {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    overflow: visible !important;
    color: var(--hc-body) !important;
    font-family: var(--hc-font) !important;
    font-size: 18px !important;
    line-height: 21.6px !important;
    font-weight: 500 !important;
    text-transform: none !important;
    margin: 2em 0 1em 0;
    padding: 0 !important;
}

#AnswerBody .PaligoArticle .condition-tabcontent > :is(.bridgehead, h1.bridgehead, h2.bridgehead, h3.bridgehead, h4.bridgehead, h5.bridgehead, h6.bridgehead) + p {
    margin-top: 0 !important;
}


/* ==========================================================================
   DEVICE TABS
   Paligo JS toggles .active on .tab button.tablinks.
   ========================================================================== */

.condition-tabcontent {
    display: none;
}

#AnswerBody .PaligoArticle .condition-tabcontent > :is(.titlepage, .title, h1:not(.bridgehead), h2:not(.bridgehead), h3:not(.bridgehead), h4:not(.bridgehead), h5:not(.bridgehead), h6:not(.bridgehead)) {
    display: none !important;
}

#AnswerBody .PaligoArticle .tab {
    display: flex !important;
    align-items: flex-end !important;
    width: 100% !important;
    margin: 0 0 27px 0 !important;
    padding: 0 !important;
    border-bottom: 0 !important;
    background: transparent !important;
}

#AnswerBody .PaligoArticle .tab button,
#AnswerBody .PaligoArticle .tab button.tablinks {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    width: auto !important;
    height: 37px !important;
    min-height: 37px !important;
    position: relative !important;
    top: 2px !important;
    z-index: 1 !important;
    margin: 0 !important;
    padding: 5px 3px 7px 3px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--hc-black) !important;
    cursor: pointer !important;
    font-family: var(--hc-font) !important;
    font-weight: 500 !important;
    line-height: 21px !important;
    text-align: center !important;
    text-decoration: none !important;
    transition: none !important;
    -webkit-font-smoothing: auto !important;
}

@media screen and (min-width: 1024px) {
    #AnswerBody .PaligoArticle .tab button,
    #AnswerBody .PaligoArticle .tab button.tablinks {
        font-size: 16px !important;
    }
}

@media screen and (max-width: 1023px) {
    #AnswerBody .PaligoArticle .tab button,
    #AnswerBody .PaligoArticle .tab button.tablinks {
        font-size: 14px !important;
    }
}

/* Inactive tabs carry the underline.
   This prevents a full-width line from showing through under the active tab. */
#AnswerBody .PaligoArticle .tab button:not(.active),
#AnswerBody .PaligoArticle .tab button.tablinks:not(.active) {
    border-bottom: 2px solid var(--hc-blue-gray) !important;
}

/* Do not let hover/focus repaint active tabs */
#AnswerBody .PaligoArticle .tab button:not(.active):hover,
#AnswerBody .PaligoArticle .tab button:not(.active):focus,
#AnswerBody .PaligoArticle .tab button.tablinks:not(.active):hover,
#AnswerBody .PaligoArticle .tab button.tablinks:not(.active):focus {
    background: transparent !important;
    text-decoration: none !important;
    outline: none !important;
}

#AnswerBody .PaligoArticle .tab button.active,
#AnswerBody .PaligoArticle .tab button.tablinks.active {
    color: var(--hc-blue-gray) !important;
    border-top: 2px solid var(--hc-blue-gray) !important;
    border-right: 2px solid var(--hc-blue-gray) !important;
    border-bottom: 0 !important;
    border-left: 2px solid var(--hc-blue-gray) !important;
    border-radius: 8px 8px 0 0 !important;
    z-index: 2 !important;
    overflow: visible !important;
}

@media screen and (min-width: 800px) {
    #AnswerBody .PaligoArticle .tab button.active,
    #AnswerBody .PaligoArticle .tab button.tablinks.active {
        background: var(--hc-white) !important;
        background-color: var(--hc-white) !important;
    }
}

@media screen and (max-width: 799px) {
    #AnswerBody .PaligoArticle .tab button.active,
    #AnswerBody .PaligoArticle .tab button.tablinks.active {
        background: transparent !important;
        background-color: transparent !important;
    }
}

#AnswerBody .PaligoArticle .tab button.phone-or-tablet {
    white-space: nowrap !important;
}

/* Mobile: fixed tab widths so text does not shift when switching tabs */
@media screen and (max-width: 799px) {
    #AnswerBody .PaligoArticle .tab button,
    #AnswerBody .PaligoArticle .tab button.tablinks {
        flex-grow: 0 !important;
        flex-shrink: 0 !important;
        padding-left: 4px !important;
        padding-right: 4px !important;
        white-space: nowrap !important;
        overflow: visible !important;
    }

    #AnswerBody .PaligoArticle .tab button.phone-or-tablet,
    #AnswerBody .PaligoArticle .tab button.tablinks.phone-or-tablet {
        flex-basis: 40% !important;
        width: 40% !important;
    }

    #AnswerBody .PaligoArticle .tab button.computer,
    #AnswerBody .PaligoArticle .tab button.tablinks.computer {
        flex-basis: 32% !important;
        width: 32% !important;
    }

    #AnswerBody .PaligoArticle .tab button.tv-device,
    #AnswerBody .PaligoArticle .tab button.tablinks.tv-device {
        flex-basis: 28% !important;
        width: 28% !important;
    }
}

#AnswerBody .PaligoArticle .condition-tabcontent > p:first-child,
#AnswerBody .PaligoArticle .condition-tabcontent > p:first-of-type {
    margin-top: 0 !important;
}


/* ==========================================================================
   ACCORDIONS / COLLAPSIBLES
   Paligo markup uses Bootstrap-style panels, not .CollapsibleSection.
   ========================================================================== */

#AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel.panel-default {
    margin: 10px 0 !important;
    border: 1px solid var(--hc-panel-border) !important;
    border-radius: 8px !important;
    box-shadow: var(--hc-panel-shadow) !important;
    overflow: hidden !important;
}

#AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-heading {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

#AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-heading a.legacy-accordion-toggle,
#AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-heading a.legacy-accordion-toggle:is(:link, :visited, :hover, :active, :focus) {
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
    margin: 0 2px !important;
    color: var(--hc-black) !important;
    background: transparent !important;
    text-decoration: none !important;
}

#AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-heading a.legacy-accordion-toggle:focus:not(:focus-visible) {
    outline: none !important;
    box-shadow: none !important;
}

#AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-heading a.legacy-accordion-toggle:focus-visible {
    outline: 2px solid var(--hc-blue-gray) !important;
    outline-offset: 2px !important;
}

#AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-heading a.legacy-accordion-toggle::before {
    content: "" !important;
    display: block !important;
    flex: 0 0 8.5px !important;
    width: 8.5px !important;
    height: 8.5px !important;
    margin: 0 13px 0 0 !important;
    border-top: 0 !important;
    border-right: 3px solid #000000 !important;
    border-bottom: 3px solid #000000 !important;
    border-left: 0 !important;
    background: transparent !important;
    transform: rotate(45deg) !important;
    transform-origin: center center !important;
}

#AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-heading a.legacy-accordion-toggle[aria-expanded="true"]::before {
    transform: rotate(-135deg) !important;
}

#AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-heading a.legacy-accordion-toggle .sidebar-title {
    display: block !important;
    padding: 0 !important;
    color: var(--hc-black) !important;
    font-family: var(--hc-font) !important;
    font-weight: 500 !important;
    letter-spacing: normal !important;
    -webkit-font-smoothing: auto !important;
}

#AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-heading a.legacy-accordion-toggle .sidebar-title::before {
    content: none !important;
    display: none !important;
}

@media screen and (min-width: 1024px) {
    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel.panel-default {
        padding: 10px 13px !important;
        background: var(--hc-white) !important;
    }

    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-heading,
    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-collapse > .panel-body,
    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-body {
        background: var(--hc-white) !important;
    }

    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-heading a.legacy-accordion-toggle {
        padding: 0 !important;
    }


    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-heading a.legacy-accordion-toggle .sidebar-title {
        font-size: 18px !important;
        line-height: 22.5px !important;
    }

    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-collapse > .panel-body,
    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-body {
        margin: 0 !important;
        padding: 14px 2px 14px 2px !important;
    }

    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-collapse > .panel-body > .panel-inner,
    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-body > .panel-inner {
        margin: 0 !important;
        padding: 0 !important;
    }
}

@media screen and (max-width: 1023px) {
    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel.panel-default,
    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-heading,
    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-collapse > .panel-body,
    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-body {
        background: transparent !important;
    }

    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel.panel-default {
        margin: 10px 0 0 0 !important;
        padding: 10px 13px !important;
    }

    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-heading a.legacy-accordion-toggle {
        padding: 0 !important;
    }


    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-heading a.legacy-accordion-toggle .sidebar-title {
        font-size: 16px !important;
        line-height: 20px !important;
    }

    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-collapse > .panel-body,
    #AnswerBody .PaligoArticle :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) > .panel > .panel-body {
        margin: 0 !important;
        padding: 10px 0 0 0 !important;
    }
}

#AnswerBody .PaligoArticle .panel-body > :last-child,
#AnswerBody .PaligoArticle .panel-body > p:last-child,
#AnswerBody .PaligoArticle .panel-body > ul:last-child,
#AnswerBody .PaligoArticle .panel-body > ol:last-child,
#AnswerBody .PaligoArticle .panel-body > .itemizedlist:last-child,
#AnswerBody .PaligoArticle .panel-body > .orderedlist:last-child,
#AnswerBody .PaligoArticle .panel-body > .procedure:last-child,
#AnswerBody .PaligoArticle .panel-body p:last-child,
#AnswerBody .PaligoArticle .panel-body ul:last-child,
#AnswerBody .PaligoArticle .panel-body ol:last-child,
#AnswerBody .PaligoArticle .panel-body li:last-child,
#AnswerBody .PaligoArticle .panel-body li:last-child > p:last-child {
    margin-bottom: 0 !important;
}


/* ==========================================================================
   LISTS / PROCEDURES
   ========================================================================== */

#AnswerBody .PaligoArticle :is(.itemizedlist, .orderedlist),
#AnswerBody .PaligoArticle .condition-tabcontent > :is(.itemizedlist, ul.itemizedlist, ul) {
    margin: 1em 0 !important;
    padding: 0 !important;
}

#AnswerBody .PaligoArticle :is(ul, ul.itemizedlist),
#AnswerBody .PaligoArticle .itemizedlist > ul,
#AnswerBody .PaligoArticle .panel-body :is(ul, ul.itemizedlist),
#AnswerBody .PaligoArticle .panel-body .itemizedlist > ul,
#AnswerBody .PaligoArticle .condition-tabcontent > .itemizedlist > ul,
#AnswerBody .PaligoArticle .condition-tabcontent > :is(ul.itemizedlist, ul) {
    list-style: disc outside !important;
    margin: 1em 0 1em 20px !important;
    padding-left: 0 !important;
}

#AnswerBody .PaligoArticle :is(ul, ul.itemizedlist) > li,
#AnswerBody .PaligoArticle .itemizedlist > ul > li,
#AnswerBody .PaligoArticle .condition-tabcontent > .itemizedlist > ul > li,
#AnswerBody .PaligoArticle .condition-tabcontent > :is(ul.itemizedlist, ul) > li {
    margin: 10px 0 0 0 !important;
    padding-left: 0 !important;
}

/* Match live responsive list text sizing below/inside collapsibles. */
@media screen and (max-width: 1023px) {
    #AnswerBody .PaligoArticle :is(ul, ul.itemizedlist),
    #AnswerBody .PaligoArticle .itemizedlist > ul,
    #AnswerBody .PaligoArticle .condition-tabcontent > .itemizedlist > ul,
    #AnswerBody .PaligoArticle .condition-tabcontent > :is(ul.itemizedlist, ul) {
        margin: 14px 0 0 20px !important;
        padding-left: 0 !important;
    }

    #AnswerBody .PaligoArticle :is(ul, ul.itemizedlist) > li,
    #AnswerBody .PaligoArticle .itemizedlist > ul > li,
    #AnswerBody .PaligoArticle .condition-tabcontent > .itemizedlist > ul > li,
    #AnswerBody .PaligoArticle .condition-tabcontent > :is(ul.itemizedlist, ul) > li {
        font-size: 14px !important;
        line-height: 21px !important;
    }
}

#AnswerBody .PaligoArticle :is(ul, ul.itemizedlist) > li > p:first-child,
#AnswerBody .PaligoArticle .itemizedlist > ul > li > p:first-child,
#AnswerBody .PaligoArticle .condition-tabcontent > .itemizedlist > ul > li > p:first-child,
#AnswerBody .PaligoArticle .condition-tabcontent > :is(ul.itemizedlist, ul) > li > p:first-child {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
}

#AnswerBody .PaligoArticle :is(ul, ul.itemizedlist) > li > p + p,
#AnswerBody .PaligoArticle .itemizedlist > ul > li > p + p,
#AnswerBody .PaligoArticle .condition-tabcontent > .itemizedlist > ul > li > p + p,
#AnswerBody .PaligoArticle .condition-tabcontent > :is(ul.itemizedlist, ul) > li > p + p {
    display: block !important;
    margin-top: 1em !important;
}

#AnswerBody ol.procedure {
    list-style-type: decimal !important;
    list-style-position: outside !important;
    margin: 15px 0 14px 0 !important;
    padding-left: 18px !important;
}

#AnswerBody ol.procedure > li.step {
    display: list-item !important;
    list-style-type: decimal !important;
    margin: 0 0 7px 0 !important;
    padding-left: 0 !important;
}

#AnswerBody ol.procedure > li.step::marker {
    color: var(--hc-black) !important;
    font-weight: 700 !important;
}

#AnswerBody ol.procedure > li.step::before {
    content: none !important;
    display: none !important;
}

#AnswerBody ol.procedure > li.step > p {
    margin: 0 !important;
}

#AnswerBody ol.procedure > li.step > p:first-child {
    display: inline !important;
}


/* ==========================================================================
   TABLES INSIDE ACCORDIONS
   ========================================================================== */

#AnswerBody .PaligoArticle :is(.sidebar.accordion-lite .panel-body, .accordion-lite-body) .informaltable.table-responsive {
    display: block !important;
    overflow-x: auto !important;
    max-width: 100% !important;
    margin: 14px 0 18px 0 !important;
}

#AnswerBody .PaligoArticle :is(.sidebar.accordion-lite .panel-body, .accordion-lite-body) table.informaltable {
    max-width: 100% !important;
    border-collapse: collapse !important;
    background: var(--hc-white) !important;
}

#AnswerBody .PaligoArticle :is(.sidebar.accordion-lite .panel-body, .accordion-lite-body) table.informaltable :is(th, td) {
    padding: 12px 16px !important;
    border: 1px solid #d9d9d9 !important;
    vertical-align: top !important;
    text-align: left !important;
}

#AnswerBody .PaligoArticle :is(.sidebar.accordion-lite .panel-body, .accordion-lite-body) table.informaltable th {
    background-color: var(--hc-white) !important;
    font-weight: 700 !important;
}

#AnswerBody .PaligoArticle :is(.sidebar.accordion-lite .panel-body, .accordion-lite-body) table.informaltable p {
    margin: 0 !important;
}


/* ==========================================================================
   IMAGES / INLINE ICONS / STORE BADGES
   ========================================================================== */

#AnswerBody .PaligoArticle .inlinemediaobject img {
    display: inline-block !important;
    width: auto !important;
    max-width: 180px !important;
    height: auto !important;
    margin: 8px 0 0 0 !important;
}

#AnswerBody .PaligoArticle img[alt*="Google Play" i],
#AnswerBody .PaligoArticle img[src*="googleplay" i],
#AnswerBody .PaligoArticle img[src*="Google_Play"],
#AnswerBody .PaligoArticle img[src*="en_badge_web_generic"] {
    display: block !important;
    width: 250px !important;
    max-width: min(250px, 100%) !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    vertical-align: top !important;
}

#AnswerBody .PaligoArticle img[alt*="App Store" i],
#AnswerBody .PaligoArticle img[src*="App_Store"],
#AnswerBody .PaligoArticle img[src*="Apple_App_Store"] {
    display: block !important;
    width: 180px !important;
    max-width: min(180px, 100%) !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    vertical-align: top !important;
}

/* Badge-only paragraphs must grow to the actual image height. */
#AnswerBody .PaligoArticle :is(.panel-body, .CollapsibleSectionBody) > p:has(img[alt*="Google Play" i]),
#AnswerBody .PaligoArticle :is(.panel-body, .CollapsibleSectionBody) > p:has(img[alt*="App Store" i]),
#AnswerBody .PaligoArticle :is(.panel-body, .CollapsibleSectionBody) > p:has(img[src*="en_badge_web_generic"]),
#AnswerBody .PaligoArticle :is(.panel-body, .CollapsibleSectionBody) > p:has(img[src*="App_Store"]),
#AnswerBody .PaligoArticle :is(.panel-body, .CollapsibleSectionBody) > p:has(img[src*="Apple_App_Store"]) {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    margin: 18px 0 0 0 !important;
    padding: 0 0 10px 0 !important;
    line-height: 0 !important;
}

/* Paligo badge wrappers were calculating around 24px. Let them expand. */
#AnswerBody .PaligoArticle :is(.panel-body, .CollapsibleSectionBody) > p:has(img[alt*="Google Play" i]) :is(a, .inlinemediaobject),
#AnswerBody .PaligoArticle :is(.panel-body, .CollapsibleSectionBody) > p:has(img[alt*="App Store" i]) :is(a, .inlinemediaobject),
#AnswerBody .PaligoArticle :is(.panel-body, .CollapsibleSectionBody) > p:has(img[src*="en_badge_web_generic"]) :is(a, .inlinemediaobject),
#AnswerBody .PaligoArticle :is(.panel-body, .CollapsibleSectionBody) > p:has(img[src*="App_Store"]) :is(a, .inlinemediaobject),
#AnswerBody .PaligoArticle :is(.panel-body, .CollapsibleSectionBody) > p:has(img[src*="Apple_App_Store"]) :is(a, .inlinemediaobject) {
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    vertical-align: top !important;
}

#AnswerBody .PaligoArticle :is(.panel-body, .CollapsibleSectionBody):has(img[alt*="Google Play" i]),
#AnswerBody .PaligoArticle :is(.panel-body, .CollapsibleSectionBody):has(img[alt*="App Store" i]),
#AnswerBody .PaligoArticle :is(.panel-body, .CollapsibleSectionBody):has(img[src*="en_badge_web_generic"]),
#AnswerBody .PaligoArticle :is(.panel-body, .CollapsibleSectionBody):has(img[src*="App_Store"]),
#AnswerBody .PaligoArticle :is(.panel-body, .CollapsibleSectionBody):has(img[src*="Apple_App_Store"]) {
    height: auto !important;
    max-height: none !important;
    padding-bottom: 22px !important;
}

/* True small inline SVG icons stay small.
   Paligo can output inline icons as .svg or encoded svg+xml URLs. */
#AnswerBody .PaligoArticle :is(p, li) .inlinemediaobject {
    display: inline-block !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: inherit !important;
    vertical-align: middle !important;
}

#AnswerBody .PaligoArticle :is(p, li) .inlinemediaobject img:is([src*=".svg"], [src*="svg+xml"], [alt*="settings" i], [alt*="cog" i], [alt*="gear" i]) {
    display: inline-block !important;
    width: 20px !important;
    min-width: 20px !important;
    max-width: 20px !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    margin: 0 3px 10px !important;
    padding: 0 !important;
    vertical-align: middle !important;
}

#AnswerBody .PaligoArticle li:has(.inlinemediaobject img:is([src*=".svg"], [src*="svg+xml"], [alt*="settings" i], [alt*="cog" i], [alt*="gear" i])) > p + p {
    margin-top: 0 !important;
}


/* ==========================================================================
   FEEDBACK FORM FIXES
   Paligo CSS can leak into the Help Center feedback widget.
   ========================================================================== */

.AnswerFormSection :is(#FeedbackButtonYes, #FeedbackButtonNo),
.AnswerFormSection :is(#FeedbackButtonYes, #FeedbackButtonNo):is(:hover, :focus, :active) {
    border-radius: 9999px !important;
}

.AnswerFormSection .feedback,
.AnswerFormSection .feedback * {
    font-family: inherit !important;
}

.AnswerFormSection .feedback .fbchoice {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 10px 0 0 0 !important;
    padding-top: 0 !important;
    font-weight: 400 !important;
}

.AnswerFormSection .feedback .fbchoice input[type="radio"] {
    appearance: auto !important;
    -webkit-appearance: radio !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
}

.AnswerFormSection .feedback .fbchoice label {
    margin: 0 !important;
    cursor: pointer !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.3 !important;
}

.AnswerFormSection .feedback #FeedbackNoComment,
.AnswerFormSection .feedback .AFCommentLabel {
    margin-top: 12px !important;
    font-weight: 400 !important;
}

.AnswerFormSection .feedback textarea,
.AnswerFormSection .feedback textarea.details {
    color: inherit !important;
    box-shadow: none !important;
    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
}

.AnswerFormSection .feedback :is(.field-validation-valid, .field-validation-error, .text-danger) {
    font-family: inherit !important;
    font-weight: 400 !important;
}


/* ==========================================================================
   RELATED ARTICLES SIDEBAR
   Normalize country/language-specific related-article list spacing.
   ========================================================================== */

.AnswerContainer .Column2 section.RelatedArticles ul.RA,
.AnswerContainer .Column2 section.RelatedArticles.Bottom ul.RA {
    margin: 0 !important;
    padding-left: 18px !important;
}


/* Remove extra PaligoHost side padding so wrapper matches live Column1 width */
#AnswerBody > article.PaligoHost,
#AnswerBody .PaligoHost {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ==========================================================================
   ADMONITION CALLOUTS
   Salesforce parity for Paligo note/tip/important boxes.
   Paligo renders legacy Salesforce SectionBoxWrapper callouts as:
   - div.note      = legacy note/green callout
   - div.tip       = legacy info/blue callout
   - div.important = legacy important/yellow callout
   ========================================================================== */

#AnswerBody .PaligoArticle :is(div.note, div.tip, div.important) {
    display: inline-block !important;
    position: relative !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 8px 0 !important;
    padding: 18px 20px !important;
    border: 0 !important;
    border-left: 0 !important;
    border-radius: 15px !important;
    box-shadow: 0 0 30px rgba(224, 224, 224, 0.2) !important;
    color: var(--hc-body) !important;
    font-family: var(--hc-font) !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
    overflow: visible !important;
    vertical-align: top !important;
}

#AnswerBody .PaligoArticle div.note {
    background: rgba(111, 207, 151, 0.1) !important;
    background-color: rgba(111, 207, 151, 0.1) !important;
}

#AnswerBody .PaligoArticle div.tip {
    background: rgba(113, 184, 242, 0.1) !important;
    background-color: rgba(113, 184, 242, 0.1) !important;
}

#AnswerBody .PaligoArticle div.important {
    background: rgba(242, 201, 76, 0.1) !important;
    background-color: rgba(242, 201, 76, 0.1) !important;
}

#AnswerBody .PaligoArticle :is(div.note, div.tip, div.important)::before {
    content: "" !important;
    position: absolute !important;
    left: 20px !important;
    top: 18px !important;
    width: 32px !important;
    height: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background-repeat: no-repeat !important;
    background-position: left top !important;
    background-size: 32px 32px !important;
}

#AnswerBody .PaligoArticle div.note::before {
    background-image: url(/images/icons/note-icon-v2.svg) !important;
}

#AnswerBody .PaligoArticle div.tip::before {
    background-image: url(/images/icons/kb_info_icon.svg) !important;
}

#AnswerBody .PaligoArticle div.important::before {
    background-image: url(/images/icons/kb_important_icon.svg) !important;
}

#AnswerBody .PaligoArticle :is(div.note, div.tip, div.important) > :is(h1.title, h2.title, h3.title, h4.title, h5.title, h6.title, .title) {
    display: flex !important;
    align-items: center !important;
    min-height: 36px !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 0 0 50px !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--hc-black) !important;
    font-family: var(--hc-font) !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    line-height: 27px !important;
    letter-spacing: normal !important;
    text-transform: none !important;
}

#AnswerBody .PaligoArticle :is(div.note, div.tip, div.important) > :is(p, .para) {
    display: block !important;
    width: auto !important;
    height: auto !important;
    margin: 10px 0 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--hc-body) !important;
    font-family: var(--hc-font) !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 24px !important;
    letter-spacing: normal !important;
}


/* ==========================================================================
   ACCORDION BRIDGEHEADS
   Prevent Paligo bridgeheads inside accordions from being uppercased and
   match live Salesforce h4-style bridgehead text.
   ========================================================================== */

#AnswerBody .PaligoArticle :is(.panel-body, .panel-inner, .accordion-lite-body) > :is(.bridgehead, h1.bridgehead, h2.bridgehead, h3.bridgehead, h4.bridgehead, h5.bridgehead, h6.bridgehead) {
    display: block !important;
    visibility: visible !important;
    width: auto !important;
    height: auto !important;
    margin: 36px 0 18px 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--hc-body) !important;
    font-family: var(--hc-font) !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    line-height: 24.3px !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    overflow: visible !important;
}

#AnswerBody .PaligoArticle :is(.panel-body, .panel-inner, .accordion-lite-body) > :is(.bridgehead, h1.bridgehead, h2.bridgehead, h3.bridgehead, h4.bridgehead, h5.bridgehead, h6.bridgehead) + :is(.sidebar.accordion, section.accordion, .sidebar.accordion-lite) {
    margin-top: 0 !important;
}


/* Paligo contact-us triggers: <span class="contact-us-trigger reason-..."> */
section.original-topic .contact-us-trigger,
section .contact-us-trigger {
  color: #116fbb;
  text-decoration: none;
  cursor: pointer;
}

section.original-topic .contact-us-trigger:hover,
section.original-topic .contact-us-trigger:focus,
section .contact-us-trigger:hover,
section .contact-us-trigger:focus {
  color: #116fbb;
  text-decoration: underline;
}