/* Sticky mobile CTA bar — Call · Zalo · Messenger · Quote.
   Mobile-only; hidden on >= 850px (Flatsome desktop breakpoint). */

:root {
    /* single source of truth for bar height — body padding + cookie-banner
       offset are derived from this so the three values never drift (CLS). */
    --tmtphcm-cta-h: 54px;
}

.tmtphcm-sticky-cta {
    display: none;
}

@media (max-width: 849px) {
    .tmtphcm-sticky-cta {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 999;
        display: flex;
        background: #ffffff;
        box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.12);
        /* reserve iOS home-indicator safe area so footer content isn't covered */
        padding-bottom: env(safe-area-inset-bottom, 0);
    }

    .tmtphcm-cta-btn {
        flex: 1 1 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        padding: 8px 2px;
        min-height: var(--tmtphcm-cta-h);
        text-decoration: none;
        color: #333333;
        font-size: 11px;
        line-height: 1.1;
        border-right: 1px solid rgba(0, 0, 0, 0.06);
        transition: background-color 0.15s ease;
    }

    .tmtphcm-cta-btn:last-child {
        border-right: 0;
    }

    .tmtphcm-cta-btn:active {
        background: rgba(0, 0, 0, 0.05);
    }

    .tmtphcm-cta-btn i {
        font-size: 18px;
        line-height: 1;
    }

    .tmtphcm-cta-label {
        white-space: nowrap;
    }

    /* brand accents */
    .tmtphcm-cta-call i      { color: #16a34a; }
    .tmtphcm-cta-zalo i      { color: #0068ff; }
    .tmtphcm-cta-messenger i { color: #0084ff; }
    .tmtphcm-cta-quote       { background: #ff6600; color: #ffffff; }
    .tmtphcm-cta-quote i     { color: #ffffff; }

    /* push page content up so the fixed bar never hides the footer.
       :has() scopes this to when the bar is actually in the DOM, so an
       empty-contacts config leaves no phantom gap. */
    body:has(.tmtphcm-sticky-cta) {
        padding-bottom: calc(var(--tmtphcm-cta-h) + env(safe-area-inset-bottom, 0));
    }

    /* hide the theme's floating contact widget on mobile — it duplicates this
       bar (Call/Zalo/Messenger). Desktop keeps it since there's no bar there. */
    .sticky-icon-links {
        display: none !important;
    }
}
