/* =============================================================================
   AAB Brocanteur — Dock de contact flottant (Téléphone · WhatsApp · Chatbot)
   -----------------------------------------------------------------------------
   Desktop : colonne verticale en bas à droite (tel, WhatsApp, chat).
   Mobile  : barre collée en bas (Appeler | WhatsApp) + bulle de chat au-dessus.
   Le bouton du chatbot est injecté dans #aab-dock par assets/js/chatbot.js :
   l'espacement est donc géré par le flex du dock, jamais en position absolue,
   ce qui évite tout chevauchement quel que soit l'écran.
   ========================================================================== */

:root {
    --aab-bar-h: 62px;
}

/* L'ancien bouton d'appel seul est remplacé par le dock */
.floating-call-btn { display: none !important; }

/* ---------- Dock (desktop) ------------------------------------------------ */
#aab-dock {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 99990;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 12px;
    pointer-events: none; /* seuls les boutons captent le clic */
}

#aab-dock > * { pointer-events: auto; }

.aab-dock__btn {
    width: 62px;
    height: 62px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff !important;
    font-size: 26px;
    text-decoration: none;
    position: relative;
    transition: transform .25s ease, box-shadow .25s ease;
    border: 0;
    cursor: pointer;
    flex: 0 0 auto;
}

.aab-dock__btn:hover,
.aab-dock__btn:focus {
    color: #fff !important;
    transform: scale(1.08);
}

/* Ombre volontairement discrète : une ombre colorée trop forte forme un halo
   permanent dans lequel le halo pulsé se noie et ne se voit plus bouger. */
.aab-dock__btn--phone { background: #27ae60; box-shadow: 0 6px 18px rgba(14, 21, 43, .28); }
.aab-dock__btn--wa    { background: #25D366; box-shadow: 0 6px 18px rgba(14, 21, 43, .28); }
.aab-dock__btn--chat  { background: #1E40AF; box-shadow: 0 6px 18px rgba(14, 21, 43, .28); }

/* Halo pulsé — reprise à l'identique du bouton flottant de debarras-vip.fr :
   un disque plein de la couleur du bouton, posé DERRIÈRE lui (z-index négatif),
   qui grandit de scale(1) à scale(1.6) en 2 s pendant que son opacité passe de
   .6 à 0. Une seule couche animée, comme sur la référence : le halo plein suffit
   à porter le mouvement, l'ancien anneau blanc en plus donnait un effet double
   qui ne ressemblait pas au site modèle. */
.aab-dock__btn::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    z-index: -1;
    animation: aabPulse 2s infinite;
    will-change: transform, opacity;
    pointer-events: none;
}
.aab-dock__btn--phone::before { background: #27ae60; }
.aab-dock__btn--wa::before    { background: #25D366; animation-delay: .35s; }
.aab-dock__btn--chat::before  { background: #1E40AF; animation-delay: .7s; }

@keyframes aabPulse {
    0%   { transform: scale(1);   opacity: .6; }
    70%  { transform: scale(1.6); opacity: 0; }
    100% { opacity: 0; }
}

/* Libellé au survol (desktop uniquement) */
.aab-dock__label {
    position: absolute;
    right: 72px;
    top: 50%;
    transform: translateY(-50%) translateX(14px);
    background: #0E152B;
    color: #fff;
    padding: 9px 16px;
    border-radius: 50px;
    font-size: 13.5px;
    font-weight: 700;
    white-space: nowrap;
    box-shadow: 0 6px 20px rgba(14, 21, 43, .35);
    opacity: 0;
    pointer-events: none;
    transition: all .25s ease;
}

.aab-dock__btn:hover .aab-dock__label,
.aab-dock__btn:focus .aab-dock__label {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}

/* ---------- Bulle du chatbot (injectée par chatbot.js) -------------------- */
.aab-chat-launcher {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-direction: row;
}

.aab-chat-launcher .aabc-teaser {
    background: #fff;
    color: #0E152B;
    font-weight: 600;
    font-size: 13.5px;
    line-height: 1.35;
    padding: 10px 14px;
    border-radius: 14px;
    box-shadow: 0 8px 26px rgba(14, 21, 43, .20);
    max-width: 200px;
    position: relative;
    cursor: pointer;
    animation: aabcPop .4s ease;
}
.aab-chat-launcher .aabc-teaser b { color: #1E40AF; }
.aab-chat-launcher .aabc-teaser:after {
    content: '';
    position: absolute;
    right: -6px;
    bottom: 16px;
    border: 7px solid transparent;
    border-left-color: #fff;
    border-right: 0;
}
.aab-chat-launcher .aabc-teaser-close {
    position: absolute;
    top: -8px;
    left: -8px;
    width: 20px;
    height: 20px;
    border: 0;
    border-radius: 50%;
    background: #0E152B;
    color: #fff;
    font-size: 13px;
    line-height: 1;
    cursor: pointer;
    padding: 0;
    opacity: .85;
}

.aab-dock__badge {
    position: absolute;
    top: -3px;
    right: -3px;
    background: #E74C3C;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    width: 21px;
    height: 21px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .3);
}

/* ---------- Barre mobile (Appeler | WhatsApp) ----------------------------- */
.aab-bar {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99991;
    background: #fff;
    box-shadow: 0 -4px 18px rgba(14, 21, 43, .18);
    padding: 7px 8px calc(7px + env(safe-area-inset-bottom, 0px));
    gap: 8px;
}

.aab-bar a {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 48px;
    border-radius: 50px;
    color: #fff !important;
    font-weight: 700;
    font-size: 15px;
    text-decoration: none;
    letter-spacing: .2px;
}

.aab-bar a i { font-size: 17px; }
.aab-bar .aab-bar__call { background: #27ae60; box-shadow: 0 4px 14px rgba(39, 174, 96, .35); }
.aab-bar .aab-bar__wa   { background: #25D366; box-shadow: 0 4px 14px rgba(37, 211, 102, .35); }
.aab-bar a span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Même pulsation que les boutons ronds, transposée à la pastille allongée.
   Ici le halo en z-index négatif serait peint DERRIÈRE le fond blanc de .aab-bar
   et resterait invisible : on dessine donc l'onde avec un box-shadow qui s'écarte
   du bouton (0 → 16 px) en s'effaçant, sur le même rythme de 2 s et le même
   décalage de .35 s entre Appeler et WhatsApp. */
.aab-bar a { position: relative; }

.aab-bar .aab-bar__call { animation: aabPulseCall 2s infinite; }
.aab-bar .aab-bar__wa   { animation: aabPulseWa   2s infinite; animation-delay: .35s; }

@keyframes aabPulseCall {
    0%   { box-shadow: 0 4px 14px rgba(39, 174, 96, .35), 0 0 0 0    rgba(39, 174, 96, .6); }
    70%  { box-shadow: 0 4px 14px rgba(39, 174, 96, .35), 0 0 0 16px rgba(39, 174, 96, 0); }
    100% { box-shadow: 0 4px 14px rgba(39, 174, 96, .35), 0 0 0 0    rgba(39, 174, 96, 0); }
}

@keyframes aabPulseWa {
    0%   { box-shadow: 0 4px 14px rgba(37, 211, 102, .35), 0 0 0 0    rgba(37, 211, 102, .6); }
    70%  { box-shadow: 0 4px 14px rgba(37, 211, 102, .35), 0 0 0 16px rgba(37, 211, 102, 0); }
    100% { box-shadow: 0 4px 14px rgba(37, 211, 102, .35), 0 0 0 0    rgba(37, 211, 102, 0); }
}

/* ---------- Adaptations tablette / mobile --------------------------------- */
@media (max-width: 991px) {
    #aab-dock { right: 16px; bottom: 16px; gap: 10px; }
    .aab-dock__btn { width: 56px; height: 56px; font-size: 24px; }
    .aab-dock__label { display: none; }
}

/* Accessibilité : pas d'animation si l'utilisateur la désactive dans son OS */
/* Accessibilité : si l'OS demande « animations réduites », on supprime le
   DÉPLACEMENT (plus de scale qui s'agrandit) mais on garde une pulsation
   d'opacité sur un halo figé à sa taille moyenne. Couper l'effet entièrement
   donnait des boutons parfaitement inertes chez tous les visiteurs ayant ce
   réglage système — c'est-à-dire « l'animation ne marche pas ». */
@media (prefers-reduced-motion: reduce) {
    .aab-dock__btn::before { animation: aabGlow 2.4s ease-in-out infinite; transform: scale(1.34); }

    .aab-bar .aab-bar__call { animation: aabGlowCall 2.4s ease-in-out infinite; }
    .aab-bar .aab-bar__wa   { animation: aabGlowWa   2.4s ease-in-out infinite; }

    /* on conserve le décalage entre les boutons, que le raccourci ci-dessus remet à 0 */
    .aab-dock__btn--wa::before   { animation-delay: .35s; }
    .aab-dock__btn--chat::before { animation-delay: .7s; }
    .aab-bar .aab-bar__wa        { animation-delay: .35s; }
}

/* Halo figé à taille moyenne : seule l'opacité respire. */
@keyframes aabGlowCall {
    0%, 100% { box-shadow: 0 4px 14px rgba(39, 174, 96, .35), 0 0 0 9px rgba(39, 174, 96, .06); }
    50%      { box-shadow: 0 4px 14px rgba(39, 174, 96, .35), 0 0 0 9px rgba(39, 174, 96, .40); }
}

@keyframes aabGlowWa {
    0%, 100% { box-shadow: 0 4px 14px rgba(37, 211, 102, .35), 0 0 0 9px rgba(37, 211, 102, .06); }
    50%      { box-shadow: 0 4px 14px rgba(37, 211, 102, .35), 0 0 0 9px rgba(37, 211, 102, .40); }
}

@keyframes aabGlow {
    0%, 100% { opacity: .12; }
    50%      { opacity: .8; }
}

@media (max-width: 767px) {
    /* Le tel + WhatsApp passent dans la barre du bas : le dock ne garde que le chat */
    #aab-dock .aab-dock__btn--phone,
    #aab-dock .aab-dock__btn--wa { display: none; }

    .aab-bar { display: flex; }

    #aab-dock {
        right: 14px;
        bottom: calc(var(--aab-bar-h) + 12px + env(safe-area-inset-bottom, 0px));
    }

    .aab-chat-launcher .aabc-teaser { max-width: 165px; font-size: 12.5px; padding: 8px 12px; }

    /* La barre fixe ne doit jamais masquer la fin de page */
    body {
        padding-bottom: calc(var(--aab-bar-h) + env(safe-area-inset-bottom, 0px)) !important;
    }

    /* Retour en haut : déplacé à gauche pour ne pas croiser le chat */
    .scroll-to-top {
        right: auto !important;
        left: 14px !important;
        bottom: calc(var(--aab-bar-h) + 14px + env(safe-area-inset-bottom, 0px)) !important;
    }
}

/* Sur grand écran aussi, le « retour en haut » quitte le coin du dock */
@media (min-width: 768px) {
    .scroll-to-top {
        right: auto !important;
        left: 30px !important;
        bottom: 30px !important;
    }
}

/* Écrans très bas (paysage mobile) : on réduit la voilure */
@media (max-height: 480px) {
    #aab-dock { gap: 8px; }
    .aab-dock__btn { width: 48px; height: 48px; font-size: 20px; }
    .aab-chat-launcher .aabc-teaser { display: none; }
}

/* ---------- Cohabitation avec la bannière cookies (fixée en bas) ---------- */
body.aab-cookie-visible .aab-bar { bottom: var(--aab-cookie-h, 0px); }
body.aab-cookie-visible #aab-dock { bottom: calc(20px + var(--aab-cookie-h, 0px)); }

@media (max-width: 767px) {
    body.aab-cookie-visible #aab-dock {
        bottom: calc(var(--aab-bar-h) + 12px + var(--aab-cookie-h, 0px) + env(safe-area-inset-bottom, 0px));
    }
    body.aab-cookie-visible .scroll-to-top {
        bottom: calc(var(--aab-bar-h) + 14px + var(--aab-cookie-h, 0px) + env(safe-area-inset-bottom, 0px)) !important;
    }
}

/* Chat ouvert : on masque tout le reste pour éviter les superpositions */
body.aab-chat-open #aab-dock,
body.aab-chat-open .aab-bar,
body.aab-chat-open .scroll-to-top { display: none !important; }

@media (max-width: 767px) {
    body.aab-chat-open { padding-bottom: 0 !important; }
}

/* Impression : aucun élément flottant */
@media print {
    #aab-dock, .aab-bar, #aab-chat-panel { display: none !important; }
}