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

.option {
  display: flex;
}

@media screen and (max-width: 1366px) {
  .input {
    display: grid;
    gap: var(--Spacing-x2);
  }

  .rooms,
  .vouchers,
  .when,
  .where {
    background-color: var(--Base-Background-Primary-Normal);
    border-radius: var(--Corner-radius-Medium);
  }

  .rooms,
  .vouchers,
  .when {
    padding: var(--Spacing-x1) var(--Spacing-x-one-and-half);
  }

  .options {
    gap: var(--Spacing-x2);
    margin-top: var(--Spacing-x2);
  }

  .option {
    gap: var(--Spacing-x2);
  }
}

@media screen and (min-width: 1367px) {
  .input {
    display: flex;
    gap: var(--Spacing-x2);
  }

  .rooms,
  .vouchers,
  .when,
  .where {
    border-right: 1px solid var(--Base-Surface-Subtle-Normal);
    width: 100%;
  }

  .input input[type="text"] {
    border: none;
    height: 24px;
  }

  .rooms,
  .when {
    max-width: 240px;
    padding: var(--Spacing-x1) var(--Spacing-x-one-and-half);
  }

  .vouchers {
    max-width: 200px;
    padding: var(--Spacing-x1) 0;
  }

  .where {
    max-width: 280px;
    position: relative;
  }

  .options {
    max-width: 158px;
  }
}