.smcta-bar {
    display: none;
}

@media (max-width: 768px) {
    .smcta-bar {
        position: fixed;
        right: var(--smcta-side, 8px);
        bottom: calc(var(--smcta-bottom, 10px) + var(--smcta-safe-area, 0px));
        left: var(--smcta-side, 8px);
        z-index: var(--smcta-z, 99999);
        display: flex;
        gap: var(--smcta-gap, 8px);
        pointer-events: none;
    }

    .smcta-button {
        box-sizing: border-box;
        display: flex;
        flex: 1 1 0;
        align-items: center;
        justify-content: center;
        min-width: 0;
        height: var(--smcta-height, 58px);
        min-height: var(--smcta-height, 58px);
        padding: 0 12px;
        border-radius: var(--smcta-radius, 999px);
        background: var(--smcta-button-bg, #111827);
        color: var(--smcta-button-color, #ffffff);
        box-shadow: var(--smcta-shadow, 0 8px 22px rgba(15, 23, 42, .22));
        font-size: 15px;
        font-weight: 700;
        line-height: 1;
        text-align: center;
        text-decoration: none;
        letter-spacing: .02em;
        pointer-events: auto;
        -webkit-tap-highlight-color: transparent;
    }

    .smcta-button:hover,
    .smcta-button:focus,
    .smcta-button:active {
        color: var(--smcta-button-color, #ffffff);
        text-decoration: none;
        opacity: .92;
    }

    .smcta-button:focus-visible {
        outline: 3px solid rgba(37, 99, 235, .35);
        outline-offset: 2px;
    }

    .smcta-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        width: 1.4em;
        height: 1.4em;
        margin: 0;
        padding: 0;
        font-size: 20px;
        line-height: 1;
        text-align: center;
    }

    .smcta-label {
        display: inline-block;
        overflow: hidden;
        max-width: 100%;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .smcta-type-icon_text .smcta-button {
        flex-direction: column;
        gap: 4px;
        font-size: 12px;
    }

    .smcta-type-icon_text .smcta-icon {
        font-size: 20px;
    }

    .smcta-type-icon .smcta-button {
        padding: 0;
        line-height: 1;
    }

    .smcta-type-icon .smcta-icon {
        width: 28px;
        height: 28px;
        font-size: 24px;
    }
}

@media (max-width: 768px) {
    .smcta-svg-icon {
        display: block;
        flex: 0 0 auto;
        width: 1em;
        height: 1em;
        margin: 0;
        fill: currentColor;
    }

    .smcta-icon i {
        display: block;
        width: 1em;
        height: 1em;
        margin: 0;
        font-size: 1em;
        line-height: 1;
        text-align: center;
    }

    .smcta-icon-text {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 1em;
        height: 1em;
        line-height: 1;
    }
}