/* Base styles for FCA Button block */
.wp-block-fca-pages-button {
    margin-bottom: var(--fcom-block-spacing, 20px); /* Default spacing */
    /* Alignment is handled by block supports */
}

/* Ensure inline display works with margin */
.wp-block-fca-pages-button > div { 
    display: inline-block; /* Or flex if needed based on parent */
} 

/*------------------------------------*
    #BUTTON-STYLES (Frontend)
 *------------------------------------*/
/* Styles adapted from editor-blocks.css using FC variables */

/* Base Button Style - Needed if not globally defined or needs override */
.wp-block-fca-pages-button .el-button { /* Target within the block */
    display: inline-flex;
    justify-content: center;
    align-items: center;
    line-height: 1;
    height: 32px;
    white-space: nowrap;
    cursor: pointer;
    color: var(--fcom-primary-button-text, #FFFFFF);
    background-color: var(--fcom-primary-button, #1877F2);
    border: 1px solid var(--fcom-primary-button, #1877F2);
    text-align: center;
    box-sizing: border-box;
    outline: none;
    margin: 0;
    font-weight: 500;
    user-select: none;
    padding: 8px 15px;
    font-size: 14px;
    border-radius: 4px;
    transition: background-color 0.1s ease, border-color 0.1s ease,
        color 0.1s ease;
    text-decoration: none; /* Ensure links look like buttons */
}

/* Primary Button Style */
.wp-block-fca-pages-button .el-button.fcom_primary_button {
    color: var(--fcom-primary-button-text, #FFFFFF);
    background-color: var(--fcom-primary-button, #1877F2);
    border-color: var(--fcom-primary-button, #1877F2);
}

.wp-block-fca-pages-button .el-button.fcom_primary_button:hover,
.wp-block-fca-pages-button .el-button.fcom_primary_button:focus {
    filter: brightness(90%);
}

/* Secondary Button Style - Corrected for Frontend */
.wp-block-fca-pages-button .el-button.fcom_secondary_button {
    /* Updated styles based on user request */
    color: var(--fcom-menu-text-active, var(--fcom-menu-text, #545861));
    background: var(--fcom-active-bg, #f0f3f5);
    border-color: var(--fcom-secondary-border, #CED0D4); /* Keep existing border or adjust if needed */
}

.wp-block-fca-pages-button .el-button.fcom_secondary_button:hover,
.wp-block-fca-pages-button .el-button.fcom_secondary_button:focus {
    filter: brightness(95%);
}

/* Text Button Style (Frontend) */
.wp-block-fca-pages-button .el-button.el-button--text {
    color: var(--fcom-text-link, #216FDB);
    background-color: transparent;
    border-color: transparent;
    padding-left: 5px;
    padding-right: 5px;
}

.wp-block-fca-pages-button .el-button.el-button--text:hover,
.wp-block-fca-pages-button .el-button.el-button--text:focus {
    background-color: var(--fcom-highlight-bg, #E7F3FF);
    color: var(--fcom-text-link, #216FDB);
    border-color: transparent;
}