@font-face {
    font-family: "Noto";
    src: url("noto//Noto_Sans/NotoSans-VariableFont_wdth\,wght.ttf") format("truetype") ;
}
@font-face {
    font-family: "Noto fars";
    src: url("noto/Noto_Sans_Arabic/NotoSansArabic-VariableFont_wdth\,wght.ttf") format("truetype") ;
}
*{
    box-sizing: border-box;
    margin: 0px;
    padding: 0px;
    font-family: "Noto" , "Noto fars";
    scrollbar-width: none;
}
body{
    --black:black;
    --gray:#e9e9e9;
    --border:#ccc;
    --box:#ff0000;
    --text:rgb(105, 105, 105);
    --bkg:#ffffff;
   --white:white;
    /* --blue:hsl(209, 90%, 54%); */
    /* --blue:#1496ec; */
    --blue: #0e93e0; 
    --red:hwb(0 28% 0%);
    background-color: var(--bkg); 
}

::-webkit-scrollbar{
    display: none;
}


.s{
    width: 100%;
    max-width: 550px;
    height: 100%;
    position:fixed;
    left:50%;
    transform: translateX(-50%);
    top: 0px;
    /* bottom: 0px; */
    overflow-y: scroll;
    border: 1px solid gray;
   
}
.s a{
    font-size: 15.5px;
    font-weight: 470;
    color: black;
    text-decoration: none;
}

.search-card-container{
    width: 100%;
    padding: 0px;
    overflow: hidden;
    margin-bottom: 20px;
}


.search-input{
    width: 100%;
    display: flex;
    padding: 18px 10px;
    border-bottom: 1px solid rgb(177, 177, 177);
    /* margin-bottom: 0px; */
    background-color: white;
    padding-top: 23px;
}

.search-input svg{
    width: 23px;
    fill: none;
    stroke-width: 2.3;
    stroke:rgb(149, 149, 149);
    margin-left: 4px;
    margin-right:3px;

}
.search-input input{
    width: 100%;
    border: none;
    outline: none;
    background-color: transparent;
    padding-left: 6px;
    position: relative;
    top: -1.5px;
    font-size: 16px;
        -webkit-text-stroke-width: .15px;
}

.search-space{
    width: 100%;
    margin-top: 15px;
    margin-bottom: 15px;
    background-color: white;

}

.suggestions {
    max-width: 550px;
    width: 100%;
    height: 43px;

    border-bottom: 1px solid rgb(177, 177, 177);
    padding: 4px 10px;
    /* padding-bottom: 5px; */
    overflow-y: auto;
    /* position: absolute; */
    background: white;
    margin-top:11px;
    margin-bottom: 1px;
    display: flex;
    gap: 11px;
    overflow-y: auto;
    align-items: center;
}


.suggestions svg{
    width: 24px;
    height: 24px;
    fill: none;
    stroke: rgb(38, 38, 38);
    stroke-width: 2;
    background-color:rgb(230, 230, 230);
    border-radius: 5000px;
    padding: 5px;
    position: relative;
    top: 2.7px;
}
.suggestions p {
    font-size: 15.5px;
    font-weight: 470;
    color: black;
}


.search-result{
    width: 100%;
    height: 100%;
    max-width: 550px;
    position: relative;
    top: -19px;
}

#suggestions-card{
    display: none;
}

.sa{
    margin-top:30px;
}

.search-profile-card{
    width: 100%;
    height: 60px;
   margin-bottom: 8px;
   margin-top:25px;
}
.profile-search{
display: flex;
align-items: center;
gap: 9px;
padding: 13px 11px;
margin-top: 7px;
border-bottom: 1px solid rgb(177, 177, 177);
}
.search-profile-card img{
    width: 50px;
    height: 50px;
    border-radius: 50%;
}
.search-profile-card p{
    font-size: 17.3px;
    font-weight: 650;
    -webkit-text-stroke-width: .07px;
    position: relative;
    top: -5.5px;
    text-transform: capitalize;
}


#preset-box{
    display: flex;
}




.suggestion{
    max-width: 550px;
    width: 100%;
    height: 43px;

    border-bottom: 1px solid rgb(177, 177, 177);
    padding: 4px 10px;
    /* padding-bottom: 5px; */
    overflow-y: auto;
    /* position: absolute; */
    background: white;
    margin-top:11px;
    margin-bottom: 1px;
    display: flex;
    gap: 11px;
    overflow-y: auto;
    /* margin-bottom: 2px; */
    /* padding-bottom: 2px; */
    align-items: center;
    /* z-index: 2000; */
    /* margin-bottom: 500px; */
}

.suggestion svg{
    width: 24px;
    height: 24px;
    fill: none;
    stroke: rgb(38, 38, 38);
    stroke-width: 2;
    background-color:rgb(230, 230, 230);
    border-radius: 5000px;
    padding: 5px;
    position: relative;
    top: 2.7px;
}
.suggestion p {
    font-size: 15.5px;
    font-weight: 470;
    color: black;
}



.space-search-post{
    width: 100%;
    height: 1px;
}