/*
 * SBN Developer Notes.
 * Scope: shared button, text-link, and CTA states.
 * Used by: header, hero, cards, membership, events, sponsorship, footer.
 * Edit risk: medium; class names are reused across hard-coded templates and shortcode HTML.
 * QA: hover/focus states, mobile wrapping, disabled-looking links, and CTA contrast.
 */

/* ==========================================================================
   CANONICAL BUTTON CONTRACT
   Keeps all button variants aligned with the SBN component library.
   ========================================================================== */

.sbn-btn-primary,
.sbn-btn-secondary,
.sbn-btn-tertiary,
.sbn-btn-text,
.btn-primary,
.btn-secondary,
.btn-tertiary,
.btn-ghost,
.btn-cta-primary,
.btn-cta-ghost,
.btn-rsvp-status,
.sb-cta-btn,
.sbn-button,
.wp-block-buttons .wp-block-button.sbn-nav-cta .wp-block-button__link,
.btn-footer-cta .wp-block-button__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: var(--sbn-button-min-height);
    padding: var(--sbn-button-padding) !important;
    border-radius: var(--sbn-radius-btn) !important;
    font-family: var(--sbn-sans) !important;
    font-size: var(--sbn-button-font-size) !important;
    font-weight: var(--sbn-button-font-weight) !important;
    line-height: 1.2;
    letter-spacing: 0;
    text-align: center;
    text-decoration: none !important;
    text-transform: none;
    white-space: nowrap;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    transition:
        background var(--sbn-transition-fast),
        border-color var(--sbn-transition-fast),
        color var(--sbn-transition-fast),
        transform var(--sbn-transition-fast),
        box-shadow var(--sbn-transition-fast);
}

.sbn-button-full,
.sbn-button--full {
    width: 100%;
}

.sbn-btn-primary,
.btn-primary,
.btn-rsvp-active,
.wp-block-buttons .wp-block-button.sbn-nav-cta .wp-block-button__link,
.btn-footer-cta .wp-block-button__link {
    border: 1px solid var(--sbn-gold) !important;
    background: var(--sbn-gold) !important;
    color: var(--sbn-navy) !important;
}

.sbn-btn-primary:hover,
.sbn-btn-primary:focus-visible,
.btn-primary:hover,
.btn-primary:focus-visible,
.btn-rsvp-active:hover,
.btn-rsvp-active:focus-visible,
.wp-block-buttons .wp-block-button.sbn-nav-cta .wp-block-button__link:hover,
.wp-block-buttons .wp-block-button.sbn-nav-cta .wp-block-button__link:focus-visible,
.btn-footer-cta .wp-block-button__link:hover,
.btn-footer-cta .wp-block-button__link:focus-visible {
    border-color: var(--sbn-gold-hover) !important;
    background: var(--sbn-gold-hover) !important;
    color: var(--sbn-navy) !important;
    text-decoration: none !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(201, 163, 90, 0.24);
}

.sbn-btn-secondary,
.btn-secondary,
.btn-cta-primary,
.sb-cta-btn {
    border: 1px solid var(--sbn-navy) !important;
    background: var(--sbn-navy) !important;
    color: var(--sbn-cream) !important;
}

.sbn-btn-secondary:hover,
.sbn-btn-secondary:focus-visible,
.btn-secondary:hover,
.btn-secondary:focus-visible,
.btn-cta-primary:hover,
.btn-cta-primary:focus-visible,
.sb-cta-btn:hover,
.sb-cta-btn:focus-visible {
    border-color: var(--sbn-navy-hover) !important;
    background: var(--sbn-navy-hover) !important;
    color: var(--sbn-cream) !important;
    text-decoration: none !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(15, 30, 61, 0.14);
}

.sbn-btn-tertiary,
.btn-tertiary,
.btn-ghost,
.btn-cta-ghost {
    border: 1.5px solid var(--sbn-navy) !important;
    background: transparent !important;
    color: var(--sbn-navy) !important;
}

.sbn-btn-tertiary:hover,
.sbn-btn-tertiary:focus-visible,
.btn-tertiary:hover,
.btn-tertiary:focus-visible,
.btn-ghost:hover,
.btn-ghost:focus-visible,
.btn-cta-ghost:hover,
.btn-cta-ghost:focus-visible {
    border-color: var(--sbn-gold) !important;
    background: rgba(201, 163, 90, 0.08) !important;
    color: var(--sbn-navy) !important;
    text-decoration: none !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(15, 30, 61, 0.08);
}

.sbn-hero .sbn-btn-tertiary,
.sbn-hero .btn-ghost,
.sbn-section--navy .sbn-btn-tertiary,
.sbn-section--navy .btn-ghost,
.sbn-section--navy .btn-cta-ghost {
    border-color: rgba(245, 239, 227, 0.46) !important;
    color: var(--sbn-cream) !important;
}

.sbn-hero .sbn-btn-tertiary:hover,
.sbn-hero .sbn-btn-tertiary:focus-visible,
.sbn-hero .btn-ghost:hover,
.sbn-hero .btn-ghost:focus-visible,
.sbn-section--navy .sbn-btn-tertiary:hover,
.sbn-section--navy .sbn-btn-tertiary:focus-visible,
.sbn-section--navy .btn-ghost:hover,
.sbn-section--navy .btn-ghost:focus-visible,
.sbn-section--navy .btn-cta-ghost:hover,
.sbn-section--navy .btn-cta-ghost:focus-visible {
    border-color: var(--sbn-gold) !important;
    background: rgba(245, 239, 227, 0.1) !important;
    color: var(--sbn-cream) !important;
}

.btn-primary:active,
.btn-secondary:active,
.sbn-btn-tertiary:active,
.btn-tertiary:active,
.btn-ghost:active,
.btn-cta-primary:active,
.btn-cta-ghost:active,
.btn-rsvp-status:active,
.sb-cta-btn:active,
.sbn-button:active,
.wp-block-buttons .wp-block-button.sbn-nav-cta .wp-block-button__link:active,
.btn-footer-cta .wp-block-button__link:active {
    transform: translateY(0);
    box-shadow: none !important;
}

.btn-primary:focus-visible,
.btn-secondary:focus-visible,
.sbn-btn-tertiary:focus-visible,
.btn-tertiary:focus-visible,
.btn-ghost:focus-visible,
.btn-cta-primary:focus-visible,
.btn-cta-ghost:focus-visible,
.btn-rsvp-status:focus-visible,
.sb-cta-btn:focus-visible,
.sbn-button:focus-visible,
.wp-block-buttons .wp-block-button.sbn-nav-cta .wp-block-button__link:focus-visible,
.btn-footer-cta .wp-block-button__link:focus-visible {
    outline: 2px solid var(--sbn-gold) !important;
    outline-offset: 3px;
}

.sbn-btn-text,
.btn-text-link,
a.btn-text-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 0;
    padding: 0 !important;
    border: 0;
    background: transparent !important;
    color: var(--sbn-gold) !important;
    font-family: var(--sbn-sans) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.3;
    text-decoration: none !important;
    cursor: pointer;
    transition: gap 0.15s ease, color var(--sbn-transition-fast);
}

.sbn-btn-text:hover,
.sbn-btn-text:focus-visible,
.btn-text-link:hover,
a.btn-text-link:hover,
.btn-text-link:focus-visible,
a.btn-text-link:focus-visible {
    gap: 10px;
    color: var(--sbn-gold-hover) !important;
    text-decoration: none !important;
}

.btn-text-link:focus-visible,
a.btn-text-link:focus-visible {
    outline: 2px solid var(--sbn-gold) !important;
    outline-offset: 4px;
    border-radius: 2px;
}

button:disabled,
.btn-primary:disabled,
.btn-secondary:disabled,
.sbn-btn-tertiary:disabled,
.btn-tertiary:disabled,
.btn-ghost:disabled,
.btn-cta-primary:disabled,
.btn-cta-ghost:disabled,
.sbn-button:disabled,
[aria-disabled="true"].btn-primary,
[aria-disabled="true"].btn-secondary,
[aria-disabled="true"].sbn-btn-tertiary,
[aria-disabled="true"].btn-tertiary {
    opacity: 0.62;
    cursor: not-allowed;
    pointer-events: none;
    transform: none !important;
    box-shadow: none !important;
}

@media (max-width: 768px) {
    .sbn-btn-primary,
    .sbn-btn-secondary,
    .sbn-btn-tertiary,
    .btn-primary,
    .btn-secondary,
    .btn-tertiary,
    .btn-ghost,
    .btn-cta-primary,
    .btn-cta-ghost,
    .btn-rsvp-status,
    .sb-cta-btn,
    .sbn-button,
    .wp-block-buttons .wp-block-button.sbn-nav-cta .wp-block-button__link,
    .btn-footer-cta .wp-block-button__link {
        min-height: 44px;
        white-space: normal;
    }

    .sbn-hero-actions,
    .sbn-cta-actions,
    .sbn-nl-bar-form,
    .sbn-application-submit-row,
    .share-row {
        width: 100%;
    }

    .sbn-hero-actions a,
    .sbn-cta-actions a,
    .sbn-nl-bar-form a,
    .sbn-tier-btn,
    .sbn-profile-cta,
    .sbn-application-submit-row .sbn-btn-primary,
    .share-btn {
        width: 100%;
    }
}
