/**** Various global style overrides *****/
:root {
    font-size: 100%;
}
body {
    color: var(--brand-dark-blue, #022A4D);
    font-family: PoppinsRegular!important;
    font-feature-settings: 'salt' on, 'liga' off;
    font-size: 1em;
    line-height: 1.625rem!important; /* 162.5% */
}

.highlight-primary-teal {
    color: #14B5AB!important;
}

/** misc widgets **/
::-webkit-resizer {
    display: none;
}
.textarea-wrapper {
    width: 100%;
    position: relative;
}
.resizer {
    position: absolute;
    bottom: -4px;
    right: 2px;
    pointer-events: none;
    z-index: 2
}

/** H1 **/

/** H2 | Heading Large **/
.slds-text-heading_large,
.slds-rich-text-editor__textarea h2,
.slds-rich-text-editor__output h2,
h2 {
    font-family: PoppinsBold!important;
}
.slds-text-heading_large,
.slds-rich-text-editor__textarea h2,
.slds-rich-text-editor__output h2,
h2:not(.article-head) {
    font-size: 2.5rem!important;
    line-height: 3.5rem!important; /* 140% */
}
h2.article-head {
    font-size: 1.25rem!important;
    line-height: 1.875rem!important; /* 150% */
}

/** H4 **/
h4 {
    /* Heading/H4 */
    font-family: PoppinsBold!important;
    font-size: 1.75rem!important;
    line-height: 2.5rem!important; /* 142.857% */
}

/** h5 | Heading Small **/
.slds-text-heading_small,
.slds-rich-text-editor__textarea h5,
.slds-rich-text-editor__output h5,
h5 {
    font-family: PoppinsBold!important;
    font-size: 1.5rem!important;
    line-height: 2rem!important; /* 133.333% */
}

/** H6 **/
h6 {
    font-family: PoppinsBold!important;
    font-size: 1.25rem!important;
    line-height: 1.875rem!important; /* 133.333% */
}

/** p | body regular **/
.slds-text-body_regular {
    /* Body/Body 1 */
    font-size: 1rem!important;
    line-height: 1.625rem!important; /* 162.5% */
}

/** p2 | body small **/
span.empty.uiOutputText,
.slds-text-body_small {
    font-size: .875rem!important;
    line-height: 1.5rem!important; /* 171.429% */
}

/* Lightning Inputs */
.slds-input,
.slds-combobox__input,
.slds-textarea {
    /* Layout */
    display: flex!important;
    align-items: flex-start!important;

    /* Style */
    border-radius: 8px!important;
    background: var(--default-white, #FFF)!important;

    /* Input Text */
    color: var(--brand-dark-blue, #022A4D)!important;

    /* Body/Body 1 */
    font-size: 1rem!important;
    line-height: 1.625rem!important; /* 162.5% */
}

/* Hero Search input overrides */
.hero-inner .slds-input {
    padding: .75rem 1.25rem .75rem 3.25rem!important;
    border: 3px solid var(--brand-dark-blue-50, #8095A6)!important;
}
/* Contact Form input overrides */
.contact-form-container .slds-input,
.slds-combobox__input,
.slds-textarea {
    padding: .75rem!important;
    border: 2px solid var(--brand-dark-blue-20, #CCD4DB)!important;
}
.slds-combobox__form-element {
    width: 100%;
}
.slds-required {
    display: none;
}

/* Form Input Label and Dropdown Overrides */
.slds-form-element .slds-form-element__label,
.slds-form-element > .slds-form-element__label,
.slds-dropdown,
.slds-listbox {
    font-size: .875rem!important;
    line-height: 1.5rem!important; /* 171.429% */
}

/* Button Overrides */
button.slds-button:not(.slds-tree__item button.slds-button) {
    /* Layout */
    padding: .375rem .75rem!important;
    gap: .375rem!important;

    /* Style */
    border-radius: 6px!important;

    /* Label */
    font-feature-settings: 'salt' on, 'clig' off, 'liga' off;

    /* Label/Medium Label */
    font-family: PoppinsMedium!important;
    font-size: 1rem;
    line-height: 1.5rem; /* 150% */
}
button.slds-button.slds-button_outline-brand {
    border-width: 2px;
    background-color: transparent;
}
button.slds-button.slds-button_neutral:focus,
button.slds-button.slds-button_neutral:hover,
button.slds-button.slds-button_neutral:active {
    background-color: var(--brand-dark-blue-20, #CCD4DB);
}

/*** custom navigation tree ***/
.custom-navigation .slds-tree_container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
}

.custom-navigation .slds-tree {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .5rem;
}

.custom-navigation .slds-tree_container > .slds-tree__group-header {
    color: var(--brand-dark-blue-50, #8095A6)!important;

    /* Others/Capitalised Bold */
    font-family: PoppinsBold!important;
    font-size: .875rem!important;
    line-height: 1.125rem!important; /* 128.571% */
    letter-spacing: .0625rem!important;
    text-transform: uppercase!important;
}

.custom-navigation .slds-tree [role=treeitem]>.slds-tree__item {
    /*padding: .375rem .75rem;*/
    padding-right: .75rem;
    align-items: center;
    gap: .5rem;
    font-size: 1rem;
    line-height: 1.625rem; /* 162.5% */
}

.custom-navigation .slds-tree [role=treeitem]>.slds-tree__item:hover,
.custom-navigation .slds-tree [role=treeitem][aria-selected=true]>.slds-tree__item {
    border-radius: 8px;
    background: var(--brand-light-grey-bg-2, #F5F7FA);
    box-shadow: none;
}
.custom-navigation .slds-tree [role=treeitem][aria-selected=true]>.slds-tree__item {
    font-family: PoppinsBold;
}

/* make the labels wrap on mobile size */
.mobile-navigation .slds-tree__item-label.slds-truncate {
    white-space: unset!important;
}

/****************************** Page-specific Overrides ******************************/
/*************** Topic Detail ***************/

/** .forceCommunityDynamicCollectionGrid == CMS Collection overrides **/
/** .topicRelatedArticleList == Articles With This Topic overrides **/
.forceCommunityDynamicCollectionGrid>div,
.topicRelatedArticleList .article-list {
    display: flex;
    flex-direction: column;
    gap: 2rem!important;
    margin-top: unset!important;
    margin-bottom: unset!important;
}
.forceCommunityDynamicCollectionGrid .container,
.topicRelatedArticleList .article-list .article-item {
    display: flex;
    padding: 2rem!important;
    gap: .5rem;

    border-radius: 8px!important;
    border: 3px solid var(--brand-dark-blue-10, #F3F5F7)!important;
}
@media screen and (max-width: 1024px) {
    .topicRelatedArticleList .article-list .article-item {
        margin: 0px!important;
    }
}
/* some spacing adjustments between the two components */
.forceCommunityDynamicCollectionGrid>div>div,
.selfServiceBaseArticleList .article-list {
    margin:unset;
}
.forceCommunityDynamicCollectionGrid .container>div {
    padding: unset;
}
.siteforceContentArea .cb-section_column .ui-widget:not(:last-child) {
    margin-bottom: 2rem!important;
}
/* .summary div is within the <li> element and includes the title, summary, and footer */
.topicRelatedArticleList .article-list .article-item .summary {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
}
/* article title-specific overrides */
.topicRelatedArticleList .article-list .article-item h2.article-head {
    font-family: PoppinsBold!important;
    font-size: 1.25rem!important;
    line-height: 1.875rem!important; /* 150% */
}
/* article summary-specific overrides */
.topicRelatedArticleList .article-list .article-item p.article-summary {
    display: inherit;
    align-self: stretch;

    /* Typography */
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: .875rem!important;
    line-height: 1.5rem!important;
}
/* Hide article article type in footer, and 2nd dot */
.article-item .footer .article-type,
.article-item .footer .dot ~ .dot {
    display: none;
}
/* Featured Article pill */
.slds-pill.featured-article {
    /*position: absolute;
    top: 2.25rem;
    right: 2.25rem;*/
    float: right;

    color: var(--brand-teal, #14B5AB);
    background: var(--brand-teal-20, #D0F0EE);
    border-color: var(--brand-teal-20, #D0F0EE);
}

/*************** Article Detail ***************/
/* Border around article related components */
.custom-container {
    padding: 4rem;
    border-radius: 8px;
	border: 3px solid var(--brand-dark-blue-10, #F3F5F7);
}
.custom-container .article-column {
    position: relative;
}
.selfServiceArticleLayout.article-column {
    padding: 0!important;
}
/* Mobile container override */
@media screen and (max-width: 480px) {
    .custom-container {
        border: none!important;
        display: flex!important;
        flex-direction: column!important;
        align-items: flex-start!important;
        padding: 24px 16px 16px!important;
        justify-content: center!important;
        align-items: flex-start!important;
        gap: 32px!important;
    }
}

/* force font settings in Article body */
.section__content * {
	font-feature-settings: 'salt' on, 'liga' off;
    font-family: PoppinsRegular!important;
}
.section__content * a {
	text-decoration: underline;
}
.section__content * strong,
.section__content * strong * {
    font-feature-settings: 'salt' on, 'liga' off;
    font-family: PoppinsBold!important;
}

/* force table style in Article body */
.section__content table {
    display: flex!important;
    flex-direction: column!important;
    align-items: flex-start!important;
    gap: .5rem!important;
    align-self: stretch!important;
    width: unset!important;

    border-width: 0px;
}
.section__content caption {
    align-self: center;
}
.section__content tbody {
    display: flex!important;
    padding: .5rem!important;
    flex-direction: column!important;
    gap: .5rem!important;
    align-self: stretch!important;

    background: #F7F9FC!important;
}
.section__content table tr {
    display: flex!important;
    align-items: flex-start!important;
    gap: 1.5rem!important;
    align-self: stretch!important;
}
.section__content table tr:not(:first-child) {
    border-radius: 5px!important;
    /*background: var(--White, #FFF);*/
}
.section__content table tr:nth-child(even) {
    background: var(--White, #FFF);
}
.section__content table td {
    display: flex!important;
    padding: .625rem!important;
    align-items: center!important;
    gap: .625!important;
    flex: 1 0 0!important;
    border-width: 0px!important;
    width: unset!important;
}

/* Fix the Title display */
.custom-container .article-head {
    text-decoration: none!important;
    margin: none!important;
    /* Heading/H4 */
    font-family: PoppinsBold!important;
    font-size: 1.75rem!important;
    line-height: 2.5rem!important; /* 142.857% */
}

/* Push meta section to bottom and only show update date */
.selfServiceArticleLayout .meta {
    position: absolute;
    bottom: -2.5rem;
}
.selfServiceArticleLayout .meta>.date:before {
    content: 'Last updated ';
}
.selfServiceArticleLayout .meta .date {
    font-size: .875rem;
}
.selfServiceArticleLayout .meta>:not(.date) {
    display: none;
}

/* Push pill to top and override styles */
.custom-container .slds-pill_container--bare {
    display: flex!important;
    position: absolute;
    padding: unset;
    top: 3.5rem!important;
    right: 5rem!important;
}
@media screen and (max-width: 1024px) {
    .custom-container .slds-pill_container--bare {
        display: none!important;
    }
}
.slds-pill.featured-article,
.custom-container .slds-pill {
    display: flex;
    padding: .125rem .75rem!important;
    align-items: flex-start!important;
    gap: .625rem!important;
    border-radius: 20px!important;

    font-family: PoppinsBold!important;
    font-size: .75rem!important;
    line-height: 1.25rem!important; /* 166.667% */
}
.slds-pill:not(.featured-article) {
    color: var(--brand-dark-blue, #022A4D)!important;
}

/* Hide the summary section */
p.article-summary {
    display: none;
}

/* Hide "Article" Label */
.selfServiceArticleLayout article.content .test-id__field-label-container {
    display: none;
}

/* Hide article content footer and bottom border */
.selfServiceArticleLayout article.content .forcePageBlockSectionRow ~ .forcePageBlockSectionRow {
    display: none!important;
}
.selfServiceArticleLayout [data-target-selection-name="sfdc:RecordField.Knowledge__kav.Article__c"] .slds-form-element_readonly {
    border-bottom: none!important;
}

/* force width of "Submit" button in vote component */
.vote-feedback lightning-button > button.slds-button {
    width: 100%
}

/* add spacing before vote component */
c-guest-article-vote {
    margin-top: 4rem;
}

/* style contact-us-box */
.article-contact-us {
    display: flex;
    padding: 2rem;
    flex-direction: column;
    align-items: center;
    gap: .625rem;
    align-self: stretch;

    border-radius: 8px;
    background: var(--brand-blue-10, #EBF6FE);
}
.article-contact-us h6 {
    font-size: 1.125rem;
    line-height: 2rem;
}

/*************** CONTACT SUPPORT ***************/
/* force styles of "Submit Request" button in contact support form */
.contact-form-container .submit-button-container lightning-button > button.slds-button {
    padding: .625rem 1.375rem;
    width: 100%;
}

/* Case Deflection */
/*
    .forceCommunityCaseDeflection = overall component
    .caseDeflectionList suggested content wrapper
    .caseDeflectionListItem = suggested content item
*/
.forceCommunityCaseDeflection {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2rem;
    flex: 1 0 0;
}
.forceCommunityCaseDeflection .header-message {
    text-align: unset!important;
}
.forceCommunityCaseDeflection .header-message h1 {
    font-family: PoppinsBold!important;
    font-size: 1.25rem!important;
    line-height: 1.875rem!important; /* 150% */
}
.forceCommunityCaseDeflection .header-message + * {
    width: 100%;
}
.forceCommunityCaseDeflection .comm-topic-trending-articles ul,
.forceCommunityCaseDeflection .caseDeflectionList ul {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
.forceCommunityCaseDeflection .comm-topic-trending-articles li {
   	align-self: stretch!important;
    align-items: flex-start!important;
    display: flex!important;
    flex-direction: column!important;
	padding: 2rem!important;
    gap: .5rem!important;
}
.forceCommunityCaseDeflection .caseDeflectionListItem {
    padding: 2rem;
}
/* add the border */
.forceCommunityCaseDeflection .comm-topic-trending-articles li,
.forceCommunityCaseDeflection .caseDeflectionListItem {
    background: var(--default-white, #FFF)!important;
    border: 3px solid var(--brand-dark-blue-10, #F3F5F7)!important;
    border-radius: 8px!important;
}
.forceCommunityCaseDeflection a {
    border-bottom-width: 0px!important;
    text-decoration: none!important;
}
.forceCommunityCaseDeflection a>span {
    font-family: PoppinsBold!important;
    font-size: 1rem!important;
    line-height: 1.625rem!important;
}
.forceCommunityCaseDeflection .caseDeflectionList a>span {
    padding: .75rem 0;
}
.forceCommunityCaseDeflection a>span + span,
.forceCommunityCaseDeflection .caseDeflectionListItem ul {
    display: none;
}