#input-container {
  margin-bottom: 2em;
}

#time-input {
  width: calc(100% - 1.5em);
  margin: 0;
  padding: 0.5em 0.75em;
  font-size: 1rem;
  outline: none;
  transition: border-color 0.15s ease;

  background: transparent;
  border-color: var(--bg-raised-active);
  color: var(--text);

  &:focus {
    border-color: var(--accent);
  }
}

#time-results {
  margin-top: 1.5em;

  strong {
    display: block;
    font-size: 1.5em;
    margin-top: 0.25em 0;
  }
}

.parsed-time {
  margin-bottom: 1.5em;
  padding: 1em;
  background: var(--bg-raised);
  border-radius: 8px;
  text-align: center;

  h3 {
    margin: 0;
    font-size: 1.5rem;
    color: var(--accent);
  }
}

.error {
  font-size: 0.9rem;
}
