.SearchBar { .group { display: flex; align-items: center; position: relative; max-width: 190px; } .input { width: 100%; height: 40px; padding: 0 1rem; padding-left: 2.5rem; border-radius: 8px; outline: none; font-weight: 500; background: var(--primary); color: var(--bg); border: none; box-shadow: 2px 2px 7px 0 var(--primary); } .input::placeholder { color: var(--bg); } .icon { position: absolute; left: 1rem; fill: var(--bg); width: 1rem; height: 1rem; } } .InputAutoComplete{ width: 78%; height: 48px; margin-top: 0px;margin-bottom: 38px; .ant-select-arrow{ font-size: 32px; color: var(--DarkGray) !important; svg{ font-size: 20px; } } .ant-select-selector{ border-radius: 10px !important; border: 1.4px solid var(--DarkGray) !important; padding-left: 18px !important; span{ color: var(--DarkGray) !important; font-size: 14px; } } } .Drawer_search_Body{ width: 90%; margin-inline: auto; .recent_search_text{ display: flex; justify-content: space-between;align-items: center; .recent_search_text_container{ margin-block: 8px; width: 100%; display: flex; justify-content: space-between; div{ display: flex; p{ text-transform: capitalize; font-size: 20px; } svg{ opacity: .6; font-size: 20px; margin-right: 10px; } } } svg{ font-size: 10px; opacity: .6; } } } .search_first_section{ width: 91%; margin-inline: auto; display: flex;justify-content: space-between;align-items: center; .delete_icon{ height: 75px; cursor: pointer; svg{ font-size: 30px; } } } .ViewSearch{ .ant-drawer .ant-drawer-content { height: 50% !important ;width: 100% ; min-height: 50% !important; display: flex; flex-direction: column; border-radius: 5px 0 0 5px; } } .search_comp{ display: flex; flex-direction: column; }