/* ============================================================
 * Precursive Success Hub — Community theme CSS
 * Loaded via head-markup <link> in Experience Builder.
 *
 * Text colour hierarchy (4 tiers, used throughout the community):
 *   Primary   #181818  H1, RTE headings, collection name, row titles
 *   Secondary #3a3c4c  section headlines, sub-headings
 *   Body      #4f5e6b  body text, descriptions, summaries, RTE body
 *   Muted     #8f919d  breadcrumb, metadata, article counts
 *
 * Type scale aligns with SLDS utility classes used in the LWCs.
 * ============================================================ */

/* ---------- Layout / structural overrides ---------- */

.whiteBackground {
    /* hides the gantt/kanban header and row of fields and participants */
    display: none;
}

.slds-page-header {
    background-color: white !important;
}

.highlights-icon-container {
    display: none !important;
}

.entityNameTitle {
    display: none !important;
}

taskfeed1-tf_taskfeed {
    display: block;
    width: 1500px;
    margin-left: -20%;
}

.forceListViewManager {
    padding-left: 20px;
    padding-right: 20px;
    border-radius: 5px;
}

/* Community card: ensures cards behave as blocks (custom elements and anchors
   default to inline) and keep a minimum height when content is short. */
.community-card {
    display: block;
    min-height: 100px;
}

/* Article-card description: shared typography + clamp to 2-3 lines */
.paper__preview {
    margin: 8px 0 14px;
    text-decoration: none;
    display: -webkit-box !important;
    max-width: 630px;
    color: #4f5e6b;
    font-size: 0.9rem;
    line-height: 1.6;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 3;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* Article count caption — uniform metadata style */
.articleCount {
    font-size: 0.6875rem;
    color: #8f919d;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 8px;
}

/* Shared card/header meta row: article count on the left, product
   availability on the right with a comfortable gap. */
.card-meta-row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 24px;
    margin-top: 8px;
}

.card-meta-row .articleCount {
    margin-top: 0;
}

/* Inline tag list (For Admins / topics / etc.) using metadata-text style with
   middle-dot separators. Sits inside .card-meta-row. */
.card-meta-tags {
    font-size: 0.6875rem;
    color: #8f919d;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.card-meta-tag {
    color: inherit;
    text-decoration: none;
    cursor: default;
}

a.card-meta-tag {
    cursor: pointer;
}

a.card-meta-tag:hover {
    color: #4f5e6b;
}

.card-meta-tags .card-meta-tag + .card-meta-tag::before {
    content: "·";
    margin: 0 6px;
    color: #c4c6cf;
}

.meta {
    display: none;
}

/* Product support banner injected by articleProductSupportIndicator
   directly under .summary on Knowledge article pages. Inline metadata
   row matching the .card-meta-tags style on collection cards — no card
   chrome, just uppercase muted text with a colored product label and
   an inline Learn more link. */
.precursive-product-support-banner {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 24px;
    margin: 0.5rem 0 1rem;
    font-size: 0.8125rem;
    color: #8f919d;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.precursive-product-support-banner .product-availability {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: baseline;
}

.precursive-product-support-banner .product-availability__label {
    margin-right: 8px;
}

.precursive-product-support-banner .product-availability__item + .product-availability__item::before {
    content: "·";
    margin: 0 6px;
    color: #c4c6cf;
}

.precursive-product-support-banner .product-availability__item_obx { color: #211844; }
.precursive-product-support-banner .product-availability__item_rco { color: #EE6775; }
.precursive-product-support-banner .product-availability__item_psx { color: #4AA6AC; }
.precursive-product-support-banner .product-availability__item_p2  { color: #9014DA; }

.precursive-product-support-banner .product-availability__learn-more {
    color: #3047EC;
    text-decoration: underline;
}

.precursive-product-support-banner .product-availability__learn-more:hover {
    text-decoration: none;
}

.lgc-bg {
    background-color: transparent !important;
}

.slds-border_bottom {
    border-bottom: none;
}

/* ---------- Hero (Builder theme hero) ---------- */

.forceCommunityThemeHeroBase {
    padding-bottom: 30px !important;
}

.forceCommunityThemeHeroBase .contentTitle {
    color: #181818;
    font-weight: 500;
}

.contentTitle {
    color: #181818;
    font-weight: 300;
}

.forceCommunityThemeHeroBase .contentCaption {
    color: #4f5e6b;
    margin-bottom: 15px;
}

/* ---------- Top navigation ---------- */

.forceCommunityThemeNav .mainNavItem .linkBtn {
    text-transform: uppercase;
}

/* ---------- Breadcrumb ---------- */

.forceCommunityBreadcrumbs {
    padding: 10px 20px;
}

/* ---------- Article column / detail layout ---------- */

.article-column,
.article-container--medium,
.article-container--large,
.forceCommunityCaseDeflection .forceCommunityContactSupportForm {
    background-color: white;
    margin-top: 14px;
    border-radius: 4px;
    padding: 30px 120px 30px 120px !important;
    font-weight: 400;
}

/* hide the random fields and field labels on article layout */
.meta.selfServiceArticleHeaderDetail {
    display: none !important;
}
article.content .slds-form-element__label,
.forceCommunityHTMLArticleHeader .slds-form-element__label,
.cuf-content .slds-form-element__label,
div[data-region-name="content"] .slds-form-element__label {
    display: none !important;
}
/* Hide every form-element row except the Body field's rich-text content.
   The Body row contains .slds-rich-text-editor__output; everything else (Title, URL Name, etc.) is metadata noise. */
article.content .forcePageBlockSectionRow:not(:has(.slds-rich-text-editor__output)),
div[data-region-name="content"] article.content .forcePageBlockSectionRow:not(:has(.slds-rich-text-editor__output)) {
    display: none !important;
}
/* Hide the publish-date / classification metadata strip */
.dateAndClassification,
.selfServiceArticleHeaderDetail.publishDate,
.selfServiceArticleHeaderDetail.dateClassification {
    display: none !important;
}

/* ---------- Article body typography ---------- */

/* Article header title */
.article-head,
.selfServiceArticleLayout .article-head,
.forceCommunityHTMLArticleHeader .article-head {
    font-size: 2rem;
    font-weight: 600;
    color: #181818;
    line-height: 1.25;
    letter-spacing: -0.01em;
    margin-bottom: 1rem;
}

/* Body heading scale — applies to whichever container Salesforce renders. */
.article-column h1:not(.article-head):not(.t__h1),
.article-column h2:not(.article-head):not(.t__h1),
.cuf-content h1:not(.article-head):not(.t__h1),
.cuf-content h2:not(.article-head):not(.t__h1),
.slds-rich-text-editor__output h1,
.slds-rich-text-editor__output h2 {
    font-size: 1.375rem;
    line-height: 1.3;
    margin-top: 2.25rem;
    margin-bottom: 0.5rem;
}

.article-column h3,
.cuf-content h3,
.slds-rich-text-editor__output h3 {
    font-size: 1.125rem;
    line-height: 1.35;
    margin-top: 1.75rem;
    margin-bottom: 0.5rem;
}

.article-column h4,
.article-column h5,
.article-column h6,
.cuf-content h4,
.cuf-content h5,
.cuf-content h6,
.slds-rich-text-editor__output h4,
.slds-rich-text-editor__output h5,
.slds-rich-text-editor__output h6 {
    font-size: 1rem;
    margin-top: 1.5rem;
    margin-bottom: 0.5rem;
}

.article-summary,
.article-summary.selfServiceArticleHeaderDetail,
.article-column .article-summary {
    font-size: 1rem;
    line-height: 1.5;
    color: inherit !important;
    font-weight: inherit !important;
}

/* Body reading column — applies to whichever container Salesforce renders */
.article-column .slds-rich-text-editor__output,
.article-column .cuf-content,
.article-column .article-summary,
.article-column .forceCommunityHTMLArticleAttachment,
.cuf-content .slds-rich-text-editor__output {
    font-size: 1rem;
    line-height: 1.7;
    color: inherit !important;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
}

.slds-rich-text-editor__output h1:first-child,
.slds-rich-text-editor__output h2:first-child,
.slds-rich-text-editor__output h3:first-child,
.slds-rich-text-editor__output h4:first-child,
.slds-rich-text-editor__output h5:first-child,
.slds-rich-text-editor__output h6:first-child,
.cuf-content h1:first-child,
.cuf-content h2:first-child,
.cuf-content h3:first-child { margin-top: 0 !important; }

/* RTE links use Precursive blue */
.slds-rich-text-editor__output a {
    color: #3047EC;
    text-decoration: underline;
}

/* RTE block spacing */
.slds-rich-text-editor__output p,
.slds-rich-text-editor__output ul,
.slds-rich-text-editor__output ol,
.slds-rich-text-editor__output dl {
    margin-top: 0;
    margin-bottom: 20px;
}

.slds-rich-text-editor__output ul,
.slds-rich-text-editor__output ol,
.slds-rich-text-editor__output dl {
    margin-top: 1rem;
    padding-left: 1.5rem;
}

.slds-rich-text-editor__output li {
    line-height: 1.7;
    margin-bottom: 10px;
    margin-top: 10px;
}

.slds-rich-text-editor__textarea th,
.slds-rich-text-editor__textarea td,
.slds-rich-text-editor__output th,
.slds-rich-text-editor__output td {
    padding: var(--lwc-spacingXSmall, 0.5rem) !important;
    border: 1px solid #e6e2e2 !important;
}

.slds-rich-text-editor__textarea table,
.slds-rich-text-editor__output table {
    width: 100%;
}

.slds-rich-text-editor__output img {
    display: block;
    margin-top: 10px;
}

/* ---------- Responsive ---------- */

@media only screen and (min-width: 992px) {
    .slds-rich-text-editor__output li {
        margin: 0 0 17px;
    }
}

@media only screen and (max-width: 767px) {
    .article-column,
    .article-container--medium,
    .article-container--large,
    .forceCommunityCaseDeflection .forceCommunityContactSupportForm {
        padding: 10px 40px 10px 40px !important;
        margin-right: 10px;
        margin-left: 10px;
        width: auto !important;
    }

    .slds-card {
        margin-right: 10px;
        margin-left: 10px;
    }

    .slds-breadcrumb {
        display: block;
    }

    .slds-col_padded,
    .slds-col--padded {
        padding-right: 0px;
        padding-left: 0px;
    }
}