/* ==========================================================================
   Pro HD — Panneau de la barre de recherche : BOUTON « COPIER LA RÉFÉRENCE »
   Module `prohdrecherche`, depuis la 1.5.0 (29/10/2026). Interrupteur en
   back-office : « Bouton copier la référence ».

   LE BOUTON VIENT DU MODELE DE CARTE DOOFINDER (onglets Ordinateur et Mobile),
   dans la ligne « Réf. : … » : `button.prohdrech-copier`, la référence dans
   `data-prohdrech-ref`. Sans la ligne du modèle, cette feuille ne vise rien.
   Le script `copier.js` fait la copie et pose `prohdrech-copie` 1,6 s.

   `!important` partout : `.dfd-root button` pose fond, bord, hauteur et
   interligne de 38 px sur tout bouton du panneau.

   Marge droite négative (1.5.1) : sans elle, le bouton passait SEUL à la
   ligne quand la référence tenait juste sur la ligne (BOBDL-20-K-B sur
   tablette). Le bouton ne compte plus dans la largeur de la ligne et déborde
   dans la marge intérieure de la carte (24 px, 9 px au téléphone) ; le
   pictogramme reste toujours dans la carte. La coupure de la référence est
   celle d'avant le bouton.
   ========================================================================== */

html body .dfd-root .dfd-card .prohdrech-copier {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    min-width: 24px !important;
    height: 24px !important;
    margin: -2px -28px -2px 4px !important;
    padding: 0 !important;
    vertical-align: middle !important;
    line-height: 1 !important;
    border: 0 !important;
    border-radius: 6px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--prohdrech-lien, #0C5DA2) !important;
    cursor: pointer !important;
    transition: background-color 150ms ease;
}

html body .dfd-root .dfd-card .prohdrech-copier::before {
    content: "" !important;
    display: block !important;
    width: 14px !important;
    height: 14px !important;
    background: currentColor !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='12' height='12' rx='2'/%3E%3Cpath d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='12' height='12' rx='2'/%3E%3Cpath d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/%3E%3C/svg%3E") center / contain no-repeat;
}

@media (hover: hover) {
    html body .dfd-root .dfd-card .prohdrech-copier:hover {
        background: #E6F0F9 !important;
    }
}

html body .dfd-root .dfd-card .prohdrech-copier:focus-visible {
    outline: 2px solid var(--prohdrech-lien, #0C5DA2) !important;
    outline-offset: 1px !important;
}

/* Après la copie : coche verte et bulle « Copié », 1,6 s. */
html body .dfd-root .dfd-card .prohdrech-copier.prohdrech-copie {
    color: #1E7B4F !important;
}

html body .dfd-root .dfd-card .prohdrech-copier.prohdrech-copie::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
}

html body .dfd-root .dfd-card .prohdrech-copier.prohdrech-copie::after {
    content: "Copié" !important;
    position: absolute !important;
    bottom: calc(100% + 4px) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    padding: 3px 7px !important;
    border-radius: 4px !important;
    background: #22303F !important;
    color: #FFFFFF !important;
    font-family: inherit !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
    pointer-events: none !important;
    z-index: 2 !important;
}

/* Téléphone : cible tactile plus grande, sans changer la hauteur de ligne.
   Marge intérieure de 9 px seulement : le bouton compte pour 12 px dans la
   ligne, et le pictogramme (7 px de vide de chaque côté) reste dans la carte. */
html body .dfd-root.dfd-mobile .dfd-card .prohdrech-copier {
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
    margin: -5px -16px -5px 0 !important;
}