body {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.navbar-dark .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.badge {
  padding: 10px;
}

#timer-display {
  font-size: 2rem;
  font-weight: bold;
  padding: 10px;
  border-radius: 8px;
  background-color: #222;
  color: #00ffcc;
  transition: all 0.3s ease;
}

#timer-display.warning {
  color: #ffc107;
}

#timer-display.urgent {
  color: #ff4d4d;
}

#timer-bar {
  transition: width 1s linear;
}
.progress {
  height: 2rem;
}

.token-red {background-color:#b94242;border-radius:50%;}
.token-blue {background-color:#4d4ddf;border-radius:50%;}
.token-green {background-color:#339d33;border-radius:50%;}
.token-lightgrey {background-color:#ababab;border-radius:50%;}
.token-darkgrey {background-color:#5e5d5d;border-radius:50%;}