/* ==========================================================================
   Pro HD — Panneau de la barre de recherche : « CONNECTEZ-VOUS » (non connecte)
   Module `prohdrecherche`, depuis la 1.2.0 (24/09/2026). Interrupteur en
   back-office : « Afficher « Connectez-vous » sur les produits pour un
   visiteur non connecté ». Servie UNIQUEMENT a un visiteur non connecte.

   LE BOUTON EST CELUI DES VIGNETTES (`prohdcta`) : memes variables de couleur
   (`--prohdcta-*`, posees par ce module sur `:root`), meme taille de texte,
   memes capitales, meme phrase dessous (#5A6E7C, 12 px, centree). Un reglage
   change dans `prohdcta` s applique donc ici aussi.

   RIEN NE S AFFICHE SANS LE SCRIPT. Chaque regle exige les attributs que pose
   `views/js/connexion.js` (`data-prohdrech-texte`, `data-prohdrech-libelle`).
   C est aussi ce qui la fait passer devant `anonymes.css`, qui masque la zone
   au meme niveau d importance : un selecteur d attribut de plus. Sans script,
   `anonymes.css` gagne et le visiteur retrouve l etat d avant.

   LE TEXTE PASSE PAR `attr()`, qui ne rend que du texte brut : aucun HTML ne
   peut etre injecte par ce chemin.
   ========================================================================== */

html body.-notLogged .dfd-root .dfd-card .dfd-card-row .dfd-cart-add-button[data-prohdrech-texte] {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
}

html body.-notLogged .dfd-root .dfd-card .dfd-card-row {
    display: flex !important;
    flex-wrap: wrap !important;
}

/* Les choix de declinaison n ont pas de sens sans compte : caches. */
html body.-notLogged .dfd-root .dfd-card .dfd-cart-add-button[data-prohdrech-texte] .dfd-cart-select-button,
html body.-notLogged .dfd-root .dfd-card .dfd-cart-add-button[data-prohdrech-texte] .dfd-card-selector {
    display: none !important;
}

html body.-notLogged .dfd-root .dfd-card .dfd-cart-add-button[data-prohdrech-texte] > button[data-prohdrech-libelle] {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 35px !important;
    padding: 8px 12px !important;
    /* Doofinder pose `line-height: 38px` sur ses boutons : le bouton montait a
       58 px au lieu des 35 de `prohdcta` (mesure le 24/09/2026). */
    font-size: 12px !important;
    line-height: 1.25 !important;
    background: var(--prohdcta-fond, #FFFFFF) !important;
    border: var(--prohdcta-epaisseur, 2px) solid var(--prohdcta-bordure, #DF1576) !important;
    border-radius: var(--prohdcta-rayon, 20px) !important;
    box-shadow: none !important;
    cursor: pointer !important;
    transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease;
}

html body.-notLogged .dfd-root .dfd-card .dfd-cart-add-button[data-prohdrech-texte] > button[data-prohdrech-libelle] svg {
    display: none !important;
}

html body.-notLogged .dfd-root .dfd-card .dfd-cart-add-button[data-prohdrech-texte] > button[data-prohdrech-libelle]::after {
    content: attr(data-prohdrech-libelle);
    font-family: inherit;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: 0.02em;
    text-transform: var(--prohdcta-casse, uppercase);
    color: var(--prohdcta-encre, #DF1576);
}

html body.-notLogged .dfd-root .dfd-card .dfd-cart-add-button[data-prohdrech-texte] > button[data-prohdrech-libelle]:hover,
html body.-notLogged .dfd-root .dfd-card .dfd-cart-add-button[data-prohdrech-texte] > button[data-prohdrech-libelle]:focus-visible {
    background: var(--prohdcta-survol-fond, #DF1576) !important;
    border-color: var(--prohdcta-survol-fond, #DF1576) !important;
}

html body.-notLogged .dfd-root .dfd-card .dfd-cart-add-button[data-prohdrech-texte] > button[data-prohdrech-libelle]:hover::after,
html body.-notLogged .dfd-root .dfd-card .dfd-cart-add-button[data-prohdrech-texte] > button[data-prohdrech-libelle]:focus-visible::after {
    color: var(--prohdcta-survol-encre, #FFFFFF);
}

/* La phrase sous le bouton. Vide dans `prohdcta` : rien ne s affiche. */
html body.-notLogged .dfd-root .dfd-card .dfd-cart-add-button[data-prohdrech-texte]:not([data-prohdrech-texte=""])::after {
    content: attr(data-prohdrech-texte);
    display: block;
    margin-top: 6px;
    font-family: inherit;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.3;
    color: #5A6E7C;
    text-align: center;
}