form > div {
   display: flex;
}

form input:first-of-type {
   padding: 1rem;
   border-radius: var(--env-border-radius) 0 0 var(--env-border-radius);
   border: 1px solid var(--env-element-primary-background-color);
   border-right: none;
   width: 100%;
   max-width: 500px;
}

form input:last-of-type {
   padding: 1rem 2rem;
   background: var(--env-element-primary-background-color);
   border-radius: 0 .var(--env-border-radius) var(--env-border-radius) 0;
   border: 1px solid var(--env-element-primary-background-color);
   color: #fff;
}

form input[type="submit"]:focus,form input[type="submit"]:focus-visible, 
form button[type="submit"]:focus, form button[type="submit"]:focus-visible  { 
  outline-offset: 4px!important;   
   outline-color: blue;
}

@media screen and (max-width: 768px) {
   form input:last-of-type {
      padding: 1rem;
   }
}