.input-field{border:3px 1px #0000;flex-direction:column;width:100%;display:flex}.input-field .input-error-message{color:#ff6b6b;padding:0 4px;font-family:Montserrat,sans-serif;font-weight:500;line-height:1.2;animation:.3s slideDown}.input-field input{color:#8b6649;background-color:#e8e7e7;border:3px solid #0000;border-radius:8px;width:100%;padding:12px 15px;font-family:Montserrat,sans-serif;font-size:16px;transition:all .3s}.input-field input::placeholder{color:#8b6649}.input-field input:focus{background-color:#fff;border:3px solid #8b6649;outline:none}.input-field input.input-error::placeholder{color:#ff6b6b}.input-with-icon{flex-direction:column;gap:0;width:100%;max-width:580px;display:flex;position:relative}.input-with-icon svg{pointer-events:none;color:#8b6649;z-index:1;width:30px;height:30px;transition:color all .3s ease;position:absolute;top:14px;left:15px}.input-with-icon .input-field{width:100%}.input-with-icon .input-field input{padding:12px 15px 12px 50px}.input-with-icon .input-field input:focus~svg{color:#8b6649}.input-with-icon .input-field input.input-error~svg{color:#ff6b6b}.input-error-message{color:#ff6b6b;opacity:0;min-height:20px;margin-top:4px;font-size:14px;transition:opacity .3s}.input-error-message[style*=visible]{opacity:1}