/* Floating Contacts — dealer.international
 *
 * Fixed bottom-right messenger dock, rendered site-wide via wp_footer.
 * Owns ONLY this module. Tokens come from tokens.css.
 * Source of truth: docs/systems/FLOATING-CONTACTS-SYSTEM.md
 *
 * Layering: --z-float-contact (90) sits below the header and every overlay
 * (overlay 150, menu 200, cart 220, search 250), so the dock is covered while
 * a drawer/modal is open instead of floating over the dimmed screen.
 */

.dealer-floating-contacts {
    /* Local geometry — module-only, intentionally not global tokens. */
    --dealer-fc-size: 45px;        /* icon button diameter   */
    --dealer-fc-gap: 14px;         /* vertical gap between icons */
    --dealer-fc-edge: var(--padding-mobile, 16px); /* distance from viewport edges */

    position: fixed;
    right: calc(var(--dealer-fc-edge) + env(safe-area-inset-right, 0px));
    bottom: calc(var(--dealer-fc-edge) + env(safe-area-inset-bottom, 0px));
    z-index: var(--z-float-contact);
    pointer-events: none; /* let the gaps between icons stay click-through */
}

.dealer-floating-contacts__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--dealer-fc-gap);
}

.dealer-floating-contacts__item {
    margin: 0;
    padding: 0;
}

.dealer-floating-contacts__link {
    pointer-events: auto; /* re-enable on the actual targets */
    display: block;
    width: var(--dealer-fc-size);
    height: var(--dealer-fc-size);
    border-radius: 50%;
    /* drop-shadow follows the SVG's opaque shape (circle / rounded square),
       unlike box-shadow which would draw a square halo. */
    filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.20));
    transition:
        transform var(--motion-duration-fast, 0.2s) var(--motion-ease-standard, ease),
        filter var(--motion-duration-fast, 0.2s) var(--motion-ease-standard, ease);
    will-change: transform;
}

.dealer-floating-contacts__link:hover,
.dealer-floating-contacts__link:focus-visible {
    transform: translateY(-2px) scale(1.06);
    filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.28));
}

.dealer-floating-contacts__link:focus-visible {
    outline: var(--focus-outline-width, 2px) solid var(--color-primary, #034C39);
    outline-offset: var(--focus-outline-offset, 2px);
}

.dealer-floating-contacts__link:active {
    transform: translateY(0) scale(0.98);
}

.dealer-floating-contacts__icon {
    display: block;
    width: 100%;
    height: 100%;
}

/* Tablet and up — slightly larger target and more breathing room from edges. */
@media (min-width: 768px) {
    .dealer-floating-contacts {
        --dealer-fc-size: 58px;
        --dealer-fc-edge: 24px;
    }
}

@media (min-width: 1024px) {
    .dealer-floating-contacts {
        --dealer-fc-size: 60px;
        --dealer-fc-edge: 28px;
    }
}

/* Respect users who reduce motion — keep state changes, drop the animation. */
@media (prefers-reduced-motion: reduce) {
    .dealer-floating-contacts__link {
        transition: none;
    }

    .dealer-floating-contacts__link:hover,
    .dealer-floating-contacts__link:focus-visible,
    .dealer-floating-contacts__link:active {
        transform: none;
    }
}