/*
 * Floating WhatsApp button.
 * Scoped override loaded after landing.css.
 * Do not move these rules back into landing.css.
 */

.awb-floating-whatsapp {
        text-align: center;
}

.awb-floating-whatsapp__text,
.awb-floating-whatsapp__time {
        display: block;
        width: 100%;
        color: #fff;
        font-weight: 600;
        line-height: 1.08;
        letter-spacing: 0;
        text-align: center;
        text-shadow: none;
        white-space: nowrap;
}

@media (max-width: 767px) {
        .awb-floating-whatsapp {
                left: 50%;
                right: auto;
                bottom: 12px;
                top: auto;
                display: inline-flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                gap: 8px;
                width: min(260px, calc(100vw - 28px));
                height: 56px;
                min-height: 56px;
                padding: 0 14px;
                transform: translateX(-50%);
                text-align: center;
        }

        .awb-floating-whatsapp .awb-contact-icon {
                flex: 0 0 auto;
                grid-row: auto;
                grid-column: auto;
                justify-self: auto;
                width: 30px;
                height: 30px;
        }

        .awb-floating-whatsapp__text,
        .awb-floating-whatsapp__time {
                display: inline-block;
                flex: 0 0 auto;
                grid-row: auto;
                grid-column: auto;
                align-self: center;
                justify-self: auto;
                width: auto;
                margin: 0;
                text-align: center;
                line-height: 1;
                white-space: nowrap;
        }

        .awb-floating-whatsapp__text {
                font-size: 14px;
                font-weight: 600;
        }

        .awb-floating-whatsapp__time {
                font-size: 13px;
                font-weight: 600;
        }
}
