/**
 * SFTR gold button standard.
 * Cream-to-orange gloss from the live Our Weather CTAs.
 */
:root {
    --sftr-btn-hi: #f9e3ad;
    --sftr-btn-lo: #d87c04;
    --sftr-btn-hover-core: #d87c04;
    --sftr-btn-hover-rim: #f1cd9e;
    --sftr-btn-active: #c46e03;
    --sftr-accent: #d87c04;
    --sftr-accent-hover: #c46e03;
}

.sftr-btn,
.about-btn,
.about-imported .sppb-btn,
.article-body .sppb-btn,
.btn-submit,
.btn-hero-learn,
.article-search button,
.forum-btn--primary:not(.forum-btn--search) {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 12px 24px;
    border: 0;
    border-radius: 100px;
    background-color: var(--sftr-btn-lo);
    background-image: linear-gradient(var(--sftr-btn-hi) 0%, var(--sftr-btn-lo) 40%);
    color: #ffffff;
    text-decoration: none;
    font-family: Roboto, "Noto Sans", "Segoe UI", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.4;
    text-align: center;
    box-shadow: none;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
}

.sftr-btn:hover,
.sftr-btn:focus-visible,
.about-btn:hover,
.about-btn:focus-visible,
.about-imported .sppb-btn:hover,
.article-body .sppb-btn:hover,
.article-body .sppb-btn:focus-visible,
.btn-submit:hover,
.btn-submit:focus-visible,
.btn-hero-learn:hover,
.btn-hero-learn:focus-visible,
.article-search button:hover,
.forum-btn--primary:not(.forum-btn--search):hover {
    color: #ffffff;
    text-decoration: none;
    background-color: var(--sftr-btn-lo);
    background-image: radial-gradient(var(--sftr-btn-hover-core) 50%, var(--sftr-btn-hover-rim) 100%);
}

.sftr-btn:active,
.about-btn:active,
.about-imported .sppb-btn:active,
.article-body .sppb-btn:active,
.btn-submit:active,
.btn-hero-learn:active,
.article-search button:active,
.forum-btn--primary:not(.forum-btn--search):active {
    background-image: linear-gradient(var(--sftr-btn-lo) 0%, var(--sftr-btn-active) 100%);
}

.sftr-btn:disabled,
.btn-submit:disabled,
.article-search button:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.sftr-btn--block {
    display: flex;
    width: 100%;
}

.about-btn,
.about-imported .sppb-btn,
.article-body .sppb-btn {
    display: flex;
    width: 100%;
    padding: 20px 28px;
    font-size: 18px;
    line-height: 1.6;
}

.about-btn--inline {
    display: inline-flex;
    width: auto;
    padding: 12px 24px;
}

.article-body .sppb-btn i,
.about-btn__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.forum-btn--search,
.forum-search .forum-btn--primary {
    background-image: none;
    background-color: #2563eb;
    border: 1px solid #2563eb;
    border-radius: 6px;
}

.forum-btn--search:hover,
.forum-search .forum-btn--primary:hover {
    background-image: none;
    background-color: #1d4ed8;
    border-color: #1d4ed8;
}