.search-drawer{height:100%;left:0;opacity:0;position:fixed;top:0;transition:opacity .3s ease,visibility .3s ease;visibility:hidden;width:100%;z-index:1000}.search-drawer--visible{opacity:1;visibility:visible}.search-drawer__overlay{display:none}.search-drawer__content{background-color:#fff;border-radius:5px;box-shadow:-1px 2px 8px 0 rgba(0,0,0,.15);max-height:300px;padding:15px 0 0 15px;position:absolute;right:0;top:70px;transform:translateY(-100%);transition:transform .3s ease;width:100%}.search-drawer__form{display:flex;justify-content:space-evenly}.search-drawer__form form{width:90%}.search-drawer--visible .search-drawer__content{transform:translateY(0)}.search-input-wrapper{align-items:center;background-color:#f8f9fa;border:2px solid #e0e0e0;border-radius:8px;display:flex;height:55px;padding:0 15px;position:relative;transition:border-color .2s ease}.search-input-wrapper:focus-within{border-color:#007bff}.search-drawer__input{background:none;border:none;border-radius:0!important;color:#333;flex:1;font-size:16px;margin-bottom:5px!important;outline:none;padding:0!important}.search-drawer__input::placeholder{color:#999}.search-drawer__submit{background:none;border:none;color:#007bff;cursor:pointer;margin-right:8px;padding:8px;transition:color .2s ease}.search-drawer__submit:hover{color:#0056b3}.search-drawer__submit svg{height:16px;width:16px}.search-drawer__close{background:none;border:none;color:#666;cursor:pointer;padding:8px;transition:color .2s ease}.search-drawer__close:hover{color:#333}.search-drawer__close svg{height:25px;width:25px}.search-drawer__suggestions{list-style:none;margin:15px 0 0;max-height:200px;overflow-y:auto;padding:0}.search-drawer__suggestions li{border-bottom:1px solid #f0f0f0;padding:10px 0}.search-drawer__suggestions li:last-child{border-bottom:none}.search-drawer__suggestions a{color:#333;display:block;text-decoration:none;transition:color .2s ease}.search-drawer__suggestions a:hover{color:#007bff}@media (max-width:768px){.search-drawer__input{font-size:14px;padding:12px 0}}@media (min-width:830px){.search-drawer__content{box-shadow:0 6px 8px 0 rgba(0,0,0,.15);top:80px;width:35%}}@media (min-width:1200px){.search-drawer__content{top:125px}}