/* =========================================
   GRENSZAAK ASSISTENT
   Alleen de bestaande assistent-component
   Raakt header, hero, overlay en hero-content NIET
   ========================================= */

.search-box{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;

    width:700px !important;
    max-width:95% !important;

    margin:0 auto !important;
    padding:22px 28px 18px !important;

    background:rgba(255,255,255,.25) !important;
    backdrop-filter:blur(8px) !important;
    -webkit-backdrop-filter:blur(8px) !important;

    border:1px solid rgba(255,255,255,.25) !important;
    border-radius:24px !important;

    overflow:visible !important;
}

.search-box .assistant-title{
    display:block !important;
    width:100% !important;
    margin:0 0 12px 0 !important;
    padding:0 !important;
    color:#ffffff !important;
    font-family:"Open Sans", Arial, sans-serif !important;
    font-size:22px !important;
    font-weight:700 !important;
    line-height:1.25 !important;
    text-align:center !important;
}

.search-box #grenszaakVraag{
    display:block !important;
    width:100% !important;
    height:50px !important;
    flex:none !important;
    margin:0 !important;
    padding:0 16px !important;
    box-sizing:border-box !important;
    background:#ffffff !important;
    color:#222222 !important;
    border:none !important;
    border-radius:8px !important;
    outline:none !important;
    font-family:"Open Sans", Arial, sans-serif !important;
    font-size:16px !important;
    line-height:normal !important;
}

.search-box #grenszaakVraag::placeholder{
    color:#777777 !important;
    opacity:1 !important;
}

.search-box .grenszaak-vraag-btn{
    display:block !important;
    width:100% !important;
    height:46px !important;
    flex:none !important;
    margin:10px 0 0 0 !important;
    padding:0 !important;
    background:#FF7300 !important;
    color:#ffffff !important;
    border:none !important;
    border-radius:8px !important;
    font-family:"Open Sans", Arial, sans-serif !important;
    font-size:17px !important;
    font-weight:700 !important;
    line-height:46px !important;
    text-align:center !important;
    cursor:pointer !important;
}

.search-box .grenszaak-vraag-btn:hover{
    background:#e96500 !important;
}

.search-box .whatsapp-box{
    display:flex !important;
    width:100% !important;
    margin:14px 0 0 0 !important;
    padding:0 !important;
    justify-content:center !important;
    align-items:center !important;
    text-align:center !important;
}

.search-box .whatsapp-box .whatsapp-btn{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    width:auto !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:none !important;
    border-radius:0 !important;
    box-shadow:none !important;
    color:#ffffff !important;
    text-decoration:none !important;
}

.search-box .whatsapp-box .whatsapp-btn img{
    display:block !important;
    width:100px !important;
    height:100px !important;
    min-width:100px !important;
    max-width:100px !important;
    min-height:100px !important;
    max-height:100px !important;
    margin:0 !important;
    padding:0 !important;
    object-fit:contain !important;
    border:none !important;
}

.search-box .whatsapp-box .whatsapp-btn span{
    display:block !important;
    width:auto !important;
    margin:1px 0 0 0 !important;
    padding:0 !important;
    color:#ffffff !important;
    font-family:"Open Sans", Arial, sans-serif !important;
    font-size:10px !important;
    font-weight:400 !important;
    line-height:1.1 !important;
    text-align:center !important;
    white-space:nowrap !important;
    text-decoration:none !important;
}

.search-box .whatsapp-box .whatsapp-btn:hover,
.search-box .whatsapp-box .whatsapp-btn:focus,
.search-box .whatsapp-box .whatsapp-btn:active{
    background:transparent !important;
    color:#ffffff !important;
    text-decoration:none !important;
    box-shadow:none !important;
}

@media(max-width:768px){
    .search-box{
        width:90% !important;
        max-width:360px !important;
        margin:0 auto !important;
        padding:18px 16px 15px !important;
        border-radius:20px !important;
    }
    .search-box .assistant-title{
        font-size:19px !important;
        line-height:1.25 !important;
        margin-bottom:11px !important;
    }
    .search-box #grenszaakVraag{
        width:100% !important;
        height:48px !important;
        padding:0 14px !important;
        font-size:16px !important;
    }
    .search-box .grenszaak-vraag-btn{
        width:100% !important;
        height:46px !important;
        font-size:16px !important;
        line-height:46px !important;
    }
    .search-box .whatsapp-box{
        margin-top:12px !important;
    }
    .search-box .whatsapp-box .whatsapp-btn img{
        width:90px !important;
        height:90px !important;
        min-width:90px !important;
        max-width:90px !important;
        min-height:90px !important;
        max-height:90px !important;
    }
    .search-box .whatsapp-box .whatsapp-btn span{
        font-size:9px !important;
    }
}