/**
 * Gutenberg Button & Buttons blocks — Beyond Borders theme
 * Matches header Subscribe CTA (navy / gold, dark theme).
 */

.wp-block-buttons {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75em;
    justify-content: flex-start;
    margin-top: 1.35em;
    margin-bottom: 1.35em;
}

.wp-block-buttons.is-vertical {
    flex-direction: column;
    align-items: stretch;
}

.wp-block-buttons.is-vertical.is-content-justification-center {
    align-items: center;
}

.wp-block-buttons.is-content-justification-center {
    justify-content: center;
}

.wp-block-buttons.is-content-justification-right {
    justify-content: flex-end;
}

.wp-block-buttons.aligncenter {
    justify-content: center;
    text-align: center;
}

/* Single “Button” block (no Buttons row) — block alignment → center */
.wp-block-button.aligncenter {
    display: flex;
    justify-content: center;
    width: 100%;
    text-align: center;
}

/* Filled (default) — overrides core + inline colors for brand look */
.wp-block-button .wp-block-button__link,
.wp-block-button .wp-element-button {
    font-family: var(--font-ui, 'Inter', -apple-system, sans-serif);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1.35;
    padding: 14px 32px !important;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border-radius: 4px !important;
    border: 2px solid var(--navy-primary, #003265) !important;
    background-color: var(--navy-primary, #003265) !important;
    color: var(--white, #fff) !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

.wp-block-button .wp-block-button__link:hover,
.wp-block-button .wp-element-button:hover {
    background-color: var(--white, #fff) !important;
    color: var(--navy-primary, #003265) !important;
    border-color: var(--navy-primary, #003265) !important;
}

.wp-block-button .wp-block-button__link:focus-visible,
.wp-block-button .wp-element-button:focus-visible {
    outline: 2px solid var(--gold-champagne, #d4af37);
    outline-offset: 3px;
}

/* Dark theme — same as .btn-subscribe */
[data-theme="dark"] .wp-block-button:not(.is-style-outline) .wp-block-button__link,
[data-theme="dark"] .wp-block-button:not(.is-style-outline) .wp-element-button {
    background-color: var(--gold-champagne, #d4af37) !important;
    border-color: var(--gold-champagne, #d4af37) !important;
    color: var(--navy-deep, #0a1628) !important;
}

[data-theme="dark"] .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
[data-theme="dark"] .wp-block-button:not(.is-style-outline) .wp-element-button:hover {
    background-color: var(--navy-deep, #0a1628) !important;
    color: var(--gold-champagne, #d4af37) !important;
    border-color: var(--gold-champagne, #d4af37) !important;
}

/* Outline style */
.wp-block-button.is-style-outline > .wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-button.is-style-outline > .wp-element-button,
.wp-block-button.is-style-outline .wp-element-button {
    background-color: transparent !important;
    color: var(--navy-primary, #003265) !important;
    border: 2px solid var(--navy-primary, #003265) !important;
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline > .wp-element-button:hover,
.wp-block-button.is-style-outline .wp-element-button:hover {
    background-color: var(--navy-primary, #003265) !important;
    color: var(--white, #fff) !important;
    border-color: var(--navy-primary, #003265) !important;
}

[data-theme="dark"] .wp-block-button.is-style-outline > .wp-block-button__link,
[data-theme="dark"] .wp-block-button.is-style-outline .wp-block-button__link,
[data-theme="dark"] .wp-block-button.is-style-outline > .wp-element-button,
[data-theme="dark"] .wp-block-button.is-style-outline .wp-element-button {
    background-color: transparent !important;
    color: var(--gold-champagne, #d4af37) !important;
    border-color: var(--gold-champagne, #d4af37) !important;
}

[data-theme="dark"] .wp-block-button.is-style-outline > .wp-block-button__link:hover,
[data-theme="dark"] .wp-block-button.is-style-outline .wp-block-button__link:hover,
[data-theme="dark"] .wp-block-button.is-style-outline > .wp-element-button:hover,
[data-theme="dark"] .wp-block-button.is-style-outline .wp-element-button:hover {
    background-color: var(--gold-champagne, #d4af37) !important;
    color: var(--navy-deep, #0a1628) !important;
    border-color: var(--gold-champagne, #d4af37) !important;
}

/* Article body: don’t treat button like body copy links */
.article-content .wp-block-button .wp-block-button__link,
.article-content .wp-block-button .wp-element-button {
    text-decoration: none !important;
    text-underline-offset: unset;
}

/* Full-width button block */
.wp-block-button.is-style-fill .wp-block-button__link:where(.has-custom-width),
.wp-block-button .wp-block-button__link.has-width-100 {
    width: 100%;
    text-align: center;
}

@media (max-width: 600px) {
    .wp-block-buttons.is-layout-flex:not(.is-content-justification-center):not(.aligncenter) {
        flex-direction: column;
        align-items: stretch;
    }

    .wp-block-buttons.is-content-justification-center,
    .wp-block-buttons.aligncenter {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
    }

    .wp-block-buttons:not(.is-content-justification-center):not(.aligncenter) .wp-block-button .wp-block-button__link,
    .wp-block-buttons:not(.is-content-justification-center):not(.aligncenter) .wp-block-button .wp-element-button {
        width: 100%;
    }

    .wp-block-button.aligncenter .wp-block-button__link,
    .wp-block-button.aligncenter .wp-element-button {
        width: auto;
        max-width: 100%;
    }
}