#favDialog {
  position: fixed;
  width: 100%;
  height: 100vh;
  z-index: 9999;

  display: none;
  place-items: center;

  background: #000000b0;
  border: none;

  padding: 1rem;
}

.formDialog {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 2rem;

  padding: 3rem 1.5rem;
  background: white;
  border-radius: 8px;

  border: 1px solid #007d5c79;
}

.logoDialog {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.logoDialog h1 {
  font-size: 2.2rem;
  font-family: "coolvetica", sans-serif;
  color: var(--color3);
  text-align: center;
}

.logoDialog h2 {
  font-size: 1.6rem;
  text-transform: uppercase;
  color: var(--text);
  text-align: center;
}

.fieldsDialog {
  display: flex;
  flex-direction: column;

  gap: 2.6rem;
}

.boxInput {
  display: flex;
  flex-direction: column;
}

.inputDialog {
  display: flex;
  width: 100%;
  background-color: rgba(67, 67, 67, 0.1);
  border: 1px solid transparent;
  border-radius: 8px;
  font-size: 1rem;
  padding: 0.6rem 1rem;
  outline: none;
}

.inputDialog::placeholder {
  color: #000000;
  font-weight: 500;
}

.inputDialog:hover {
  border: 1.5px solid var(--color3);
}

.inputDialog:focus {
  border: 1.5px solid var(--color3);
}

.inputDialog[type="number"] {
  -moz-appearance: textfield;
}

.inputDialog[type="number"]::-webkit-outer-spin-button,
.inputDialog[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.error-message {
  color: red;
  display: none;
  font-size: 0.9rem;
  margin-top: 5px;
}

.input-error {
  border: 1.5px solid rgba(255, 78, 78, 0.578);
}

.logoDialog {
  display: flex;
  flex-direction: column;
}

.formFields {
  display: flex;
  flex-direction: column;
}

.p {
  padding-bottom: 1rem;
}

.formFields p {
  font-size: 1.1rem;
  font-weight: 500;
  color: var(--text);
}

.phoneLine {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}

.closeButton {
  position: absolute;
  right: 1.5rem;
  top: 1.5rem;

  padding: 0.1rem;
  display: flex;
  background: none;
  border: none;
  box-shadow: none;
}

.enterButton {
  max-width: 100% !important;
}

.divError {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.phoneBox {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}