body {
  background-color: #000000;
  color: #00ff00;
  font-family: Courier, monospace;
  text-align: center;
  margin: 0;
}

#container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#clock {
  font-size: 180px;
}

#dateWeekday {
  font-size: 70px;
  margin-top: 20px;
}

#temp-block {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
}

#temp-main {
  font-size: 120px;
  margin-right: 20px;
}

#temp-range {
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 46px;
  text-align: left;
  margin-top: 5px;
}

/* Weather info row (rain + wind) - Maximum compatibility */
#weather-info {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
  flex-wrap: nowrap;
}

#rain {
  font-size: 46px;
  margin-right: 40px;
  white-space: nowrap;
}

#wind {
  font-size: 38px;
  white-space: nowrap;
}

#container i {
  margin: 0 0.2em;
  /* Add a bit of space around icons */
  font-size: 0.9em;
  /* Make icon slightly smaller than text for balance */
  vertical-align: middle;
  /* Align icon vertically with text */
}

#wind i {
  margin: 0; /* Reset margin for all wind icons */
}

#wind .fa-leaf {
  margin-right: 0.1em; /* Add a small gap after the leaf icon */
}

#humidity {
  font-size: 38px;
  margin-right: 40px;
  white-space: nowrap;
  color: #66ccff;
  /* Default icy blue color seems appropriate for humidity */
}


/* Temperature colors would go here if you had them */

/* Rain colors */
.rain-yellow {
  color: #ffff66;
}

.rain-blue {
  color: #66ccff;
}

/* Wind colors */
.wind-calm {
  color: #66ffcc;
}

.wind-moderate {
  color: #ff9933;
}

.wind-strong {
  color: #ff3333;
}