/**
 * ListEO Sticky Contact Bar v1.3 — Stylesheet
 * Clean pill buttons, single icon per button, no duplicates.
 */

:root {
    --lsb-bar-bg:         #f8f8f8;
    --lsb-call-bg:        #F93055;
    --lsb-call-color:     #ffffff;
    --lsb-whatsapp-bg:    #25D366;
    --lsb-whatsapp-color: #ffffff;
    --lsb-transition:     0.16s ease;
}

/* ── Bar ─────────────────────────────────────────────────────────────────── */
.lsb-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: var(--lsb-bar-bg);
    padding: 10px 16px;
    padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid rgba(0,0,0,0.08);
    box-shadow: 0 -3px 16px rgba(0,0,0,0.08);
}

@media (max-width: 768px) {
    .lsb-bar { display: flex; }
}
.lsb-bar.lsb-show-desktop { display: flex; }

/* ── Buttons ─────────────────────────────────────────────────────────────── */
.lsb-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    max-width: 195px;
    height: 50px;
    padding: 0 18px;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.01em;
    text-decoration: none !important;
    white-space: nowrap;
    border: none;
    outline: none;
    cursor: pointer;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    transition: transform var(--lsb-transition), filter var(--lsb-transition), box-shadow var(--lsb-transition);
}

.lsb-btn:active  { transform: scale(0.95); filter: brightness(0.88); }
.lsb-btn:focus-visible { outline: 3px solid rgba(0,0,0,0.2); outline-offset: 3px; }

/* Inner: icon + text side by side */
.lsb-btn-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    pointer-events: none;
}

/* Single SVG icon — no wrapper circle */
.lsb-svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
    flex-shrink: 0;
    display: block;
}

.lsb-label { line-height: 1; }

/* ── Call Now ────────────────────────────────────────────────────────────── */
.lsb-btn--call {
    background: var(--lsb-call-bg);
    color: var(--lsb-call-color) !important;
    box-shadow: 0 3px 12px rgba(249,48,85,0.40);
}
.lsb-btn--call:hover {
    filter: brightness(1.07);
    box-shadow: 0 5px 18px rgba(249,48,85,0.55);
    color: var(--lsb-call-color) !important;
}

/* ── WhatsApp ────────────────────────────────────────────────────────────── */
.lsb-btn--whatsapp {
    background: var(--lsb-whatsapp-bg);
    color: var(--lsb-whatsapp-color) !important;
    box-shadow: 0 3px 12px rgba(37,211,102,0.40);
}
.lsb-btn--whatsapp:hover {
    filter: brightness(1.06);
    box-shadow: 0 5px 18px rgba(37,211,102,0.55);
    color: var(--lsb-whatsapp-color) !important;
}

/* ── Single button (only one showing) ───────────────────────────────────── */
.lsb-bar .lsb-btn:only-child {
    flex: 0 1 280px;
    max-width: 280px;
}

/* ── Slide-up entrance ───────────────────────────────────────────────────── */
@keyframes lsb-slide-up {
    from { transform: translateY(110%); opacity: 0; }
    to   { transform: translateY(0);   opacity: 1; }
}
.lsb-bar { animation: lsb-slide-up 0.4s cubic-bezier(0.22,1,0.36,1) both; }

@media (prefers-reduced-motion: reduce) {
    .lsb-bar { animation: none; }
    .lsb-btn { transition: none; }
}