/*
 * Help Centre layout layer.
 * Presentation deliberately inherits the Gladding Digital child-theme tokens
 * and GenerateBlocks Global Style contracts rather than defining a new brand.
 */

.gd-kb,
.gd-kb-article-shell {
    box-sizing: border-box;
    color: var(--contrast);
    padding-bottom: var(--spacing-xl);
    padding-top: var(--spacing-xl);
}

.gd-kb-template-page .site-content {
    padding: var(--spacing-xl) var(--spacing-md);
}

.gd-kb__hero {
    background: var(--brand-1);
    border-radius: var(--radius-xl);
    color: var(--base);
    margin-bottom: var(--spacing-lg);
    padding: var(--spacing-2xl);
}

.gd-kb__hero .tagline {
    color: var(--accent);
    margin-bottom: var(--spacing-xs);
}

.gd-kb__hero .headline {
    color: var(--base);
    margin: 0 0 var(--spacing-sm);
}

.gd-kb__hero > p:not(.tagline) {
    color: var(--base-2);
    margin-bottom: 0;
}

.gd-kb__search {
    gap: var(--spacing-xs);
    margin-top: var(--spacing-md);
}

.gd-kb__search input {
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    color: var(--contrast);
    min-height: 56px;
    padding: 0 var(--spacing-sm);
}

.gd-kb .gd-kb__search .btn-primary,
.gd-kb .gd-kb__support-button.btn-primary,
.gd-kb-article .gd-kb-article__support.btn-primary {
    align-items: center;
    background-color: var(--accent);
    border: 0;
    border-radius: var(--radius-md);
    color: var(--base);
    display: inline-flex;
    font-weight: 600;
    justify-content: center;
    min-height: 56px;
    padding: var(--spacing-sm) var(--spacing-lg);
    text-decoration: none;
    transition: var(--transition-normal);
}

.gd-kb .gd-kb__search .btn-primary:is(:hover, :focus),
.gd-kb .gd-kb__support-button.btn-primary:is(:hover, :focus),
.gd-kb-article .gd-kb-article__support.btn-primary:is(:hover, :focus) {
    background-color: var(--accent-shade-20);
    color: var(--base);
}

.gd-kb__categories {
    gap: var(--spacing-xs);
    margin-bottom: var(--spacing-lg);
}

.gd-kb__categories a {
    border-color: var(--border-default);
    border-radius: var(--radius-full);
    color: var(--contrast-2);
    padding: var(--spacing-xs) var(--spacing-sm);
    transition: var(--transition-fast);
}

.gd-kb__categories a:hover,
.gd-kb__categories a.is-active {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--base);
}

.gd-kb__results-heading {
    margin-bottom: var(--spacing-sm);
}

.gd-kb__results-heading h2,
.gd-kb__support h2 {
    color: inherit;
}

.gd-kb__results-heading span,
.gd-kb-card__meta,
.gd-kb-card .card-text {
    color: var(--contrast-2);
}

.gd-kb__grid {
    gap: var(--spacing-sm);
}

.gd-kb-card.card--bordered {
    background-color: var(--base);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    box-shadow: none;
    padding: var(--spacing-lg);
    transition: border-color var(--transition-fast);
}

.gd-kb-card.card--bordered:hover {
    border-color: var(--accent-alpha-50);
    box-shadow: none;
    transform: none;
}

.gd-kb-card .card-title {
    color: var(--contrast);
    font-size: 1.25rem;
    font-weight: 600;
    margin: var(--spacing-xs) 0 var(--spacing-sm);
}

.gd-kb-card .card-title a {
    color: inherit;
}

.gd-kb-card__private,
.gd-kb-article__private {
    background: var(--accent-tint-90);
    color: var(--accent-shade-20);
}

.gd-kb-card__read,
.gd-kb-breadcrumb a,
.gd-kb-article__content a {
    color: var(--accent);
}

.gd-kb__empty {
    background: var(--base-2);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.gd-kb__support {
    background: var(--brand-1);
    border-radius: var(--radius-lg);
    color: var(--base);
    gap: var(--spacing-md);
    margin-top: var(--spacing-lg);
    padding: var(--spacing-lg);
}

.gd-kb__support h2,
.gd-kb__support p {
    color: var(--base);
}

.gd-kb-article-shell {
    max-width: var(--gb-container-width, 1100px);
}

.gd-kb-breadcrumb {
    color: var(--contrast-2);
    margin-bottom: var(--spacing-sm);
}

.gd-kb-article {
    background: var(--base);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    box-shadow: none;
}

.gd-kb-article__header {
    background: var(--base-2);
    border-bottom: 1px solid var(--border-default);
    padding: var(--spacing-2xl);
}

.gd-kb-article__header .tagline {
    color: var(--accent);
    margin-bottom: var(--spacing-xs);
}

.gd-kb-article__meta,
.gd-kb-article__lede,
.gd-kb-article__updated {
    color: var(--contrast-2);
}

.gd-kb-article .headline {
    color: var(--contrast);
    margin-bottom: 0;
}

.gd-kb-article__content {
    color: var(--contrast);
    padding: var(--spacing-2xl);
}

.gd-kb-article__footer {
    background: var(--base-3);
    border-top: 1px solid var(--border-default);
    gap: var(--spacing-sm);
    padding: var(--spacing-md) var(--spacing-2xl);
}

.gd-kb-article .gd-kb-article__back.btn-secondary {
    align-items: center;
    background: transparent;
    border: 2px solid var(--accent);
    border-radius: var(--radius-md);
    color: var(--accent);
    display: inline-flex;
    font-weight: 600;
    padding: var(--spacing-sm) var(--spacing-lg);
    text-decoration: none;
    transition: var(--transition-normal);
}

.gd-kb-article .gd-kb-article__back.btn-secondary:is(:hover, :focus) {
    background: var(--accent);
    color: var(--base);
}

@media (max-width: 768px) {
    .gd-kb,
    .gd-kb-article-shell {
        padding-bottom: var(--spacing-lg);
        padding-top: var(--spacing-lg);
    }

    .gd-kb-template-page .site-branding-container {
        display: block;
        max-width: 100%;
        width: 100%;
    }

    .gd-kb-template-page .site-logo,
    .gd-kb-template-page .site-logo a,
    .gd-kb-template-page .site-logo img {
        display: block;
        height: auto;
        max-width: 100%;
        width: 100%;
    }

    .gd-kb-template-page .site-branding {
        margin: var(--spacing-xs) 0 0;
        max-width: 100%;
    }

    .gd-kb__hero,
    .gd-kb-article__header,
    .gd-kb-article__content {
        padding: var(--spacing-lg);
    }

    .gd-kb-article__footer {
        padding: var(--spacing-md) var(--spacing-lg);
    }
}

@media (max-width: 620px) {
    .gd-kb-template-page .site-content {
        padding: var(--spacing-md) var(--spacing-sm);
    }
}
