/*
 * Custom code goes here.
 * A template should always ship with an empty custom.css
 */

.block_newsletter .alert:before {
    left: 10px;
    top: 8px;
}
/* 1. Positionner le bloc parent en relatif pour ancrer le menu déroulant */
#leo_search_block_top {
    position: relative;
    display: inline-block;
}

/* 2. Styliser le bouton / titre cliquable (la loupe) */
#leo_search_block_top .title_block {
    cursor: pointer;
    font-size: 18px;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 3. Masquer le formulaire par défaut au repos */
#leo_search_block_top form {
    display: none;
    position: absolute;
    right: 0;
    top: 100%;
    width: 320px;
    background: #ffffff;
    padding: 15px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
    border-radius: 6px;
    z-index: 9999;
}

/* 4. Afficher le formulaire au survol (ou lorsque la classe open est active) */
#leo_search_block_top:hover form,
#leo_search_block_top.open form {
    display: block !important;
}

/* 5. S'assurer que les éléments internes prennent toute la largeur du popup */
#leo_search_block_top .leoproductsearch-result {
    display: block !important;
    width: 100% !important;
}

#leo_search_block_top input.search_query {
    width: 100% !important;
    display: block !important;
}

#leo_search_block_top .ac_results {
    width: 100% !important;
    left: 0 !important;
}