
/* krs-rfq-only/krs-search/krs-search.css */


.header-search{
    position:relative;
    flex:0 0 auto;
} 

.SearchTrigger{
    display:flex;
    align-items:center;
    justify-content:center;
    background:none;
    border:none;
    padding:0;
    margin:0;
    cursor:pointer;
}

.SearchInner{
    width:min(600px,90vw);
    position:relative;
}

button.SearchClose{
    position:absolute;
    top:-10px;
    right:-50px;

    background:none!important;
    border:none!important;

    color:white;

    font-size:2rem;
    line-height:1;

    cursor:pointer;
}

.SearchTrigger svg{
    display:block;
}
    
.SearchPanel{
    position:fixed;
    top:0;
    left:0;

    width:100vw;
    height:15vh;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#006938;

    opacity:0;
    visibility:hidden;
    pointer-events:none;

    transition:.3s ease;

    z-index:999999;
}

.SearchPanel.active{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
}

.group-search-row{
    width:100%;
    display:flex;
    align-items:center;
    gap:.75rem;
    padding:.5rem;
    box-sizing:border-box;
}




#grouped-search-input::-webkit-input-placeholder {
    color:#808080 !important;
    opacity: 1!important;
}

#grouped-search-input::-moz-placeholder {
    color:#808080 !important;
    opacity: 1!important;
}

#grouped-search-input:-ms-input-placeholder {
    color: black !important;
}

#grouped-search-input::placeholder {
    color:#808080 !important;
    opacity: 1!important;
}

.SearchIcon{
	display: flex;
	align-items: center;
	justify-content: center;                                                    
    flex:0 0 80px;
    margin:0;
    padding: 0; 
    border: none;
    text-align: right;    
    font-size: 1rem;
    line-height: 1.5em;
}

.SearchIcon svg {
	display: block;
}

#grouped-search-input {
    flex:1;
    border: none;
    border-radius: 5px;
    font-size: 1rem!important;
    line-height: 1em!important;
    margin: 0;
    padding: .5em;
    color: black;
    background: white;
}


.grouped-search-results-dropdown{
    position:absolute;
    top:calc(100% + 8px);
    left:0;
    width:100%;
    max-height: 70vh;
    overflow-y: auto;
    background:white;
    border:1px solid #ccc;
    z-index:999999;
    display:none;
    padding:1vh;
    box-shadow:0 20px 60px rgba(0,0,0,.35);
}

.grouped-search-results-dropdown {
    scrollbar-width: thin;
    scrollbar-color: #006938 transparent;
}

/* Chrome, Edge, Safari */
.grouped-search-results-dropdown::-webkit-scrollbar {
    width: 4px;
}

.grouped-search-results-dropdown::-webkit-scrollbar-track {
    background: transparent;
}

.grouped-search-results-dropdown::-webkit-scrollbar-thumb {
    background: #006938;
    border-radius: 999px;
}

.grouped-search-results-dropdown::-webkit-scrollbar-thumb:hover {
    background: #007f43;
}

.search-group h3{
    width: 100%;
    font-size: 1.1rem;
    font-weight: 600;
    line-height: 1.1em;
    margin:0;
    padding:.5vh 0 .5vh 1vh;
    border-top: 2px solid rgba(7, 59, 76, 1);
}

.grouped-search-results-dropdown ul {
  list-style: none!important;
  margin: 0;
  padding: 0;
}


.grouped-search-results-dropdown li{
    width:100%;
    margin:0;
    padding:0;
}

.grouped-search-results-dropdown li a{
    display: block;
    width:90%;
    font-size: .9rem;
    font-weight: 400;
    color: black!important;     
    line-height: 1.1em;
    margin:0 auto;
    padding:.5em 0 .5em .5em;
    border-top: 1px solid silver;
    transition: .3s;    
}

.search-group.no-results p{
    display: block;
    width:90%;
    font-size: .9rem;
    font-weight: 400;
    color: black!important;     
    line-height: 1.1em;
    margin:0 auto;
    padding:.5em 0 .5em .5em;
    border-top: 1px solid silver;
    transition: .3s;      
}

.grouped-search-results-dropdown li a:hover {
     background-color: #e6fff3;
    border-top: 1px solid #006938;     
}   