/* Styling to make the div look like a button */
.button {
  display: inline-block;
  width: 7px !important;
  padding: 2px 10px;
  background-color: #f0f0f0; /* Blue color, you can change it to your preferred button color */
  cursor: pointer;
  border-radius: 5px;
  border: 1px solid #000; /* Black border, adjust the width and color as needed */
  text-align: center;
}

.button:hover {
  width: 7px !important;
  background-color: #a9a9a9; /* Lighter shade of blue on hover, adjust as needed */
}

.button:disabled {
  background-color: #ccc; /* Grey background when disabled */
  cursor: not-allowed; /* Cursor style for disabled state */
}

.export-button {
  background-color: DodgerBlue;
  border: none;
  color: white !important;
  padding: 12px 30px;
  cursor: pointer;
  font-size: 20px;
  border-radius: 10px;
}

/* Darker background on mouse-over */
.export-button:hover {
  background-color: RoyalBlue;
}

.export-button:disabled {
  background-color: #ccc; /* Grey background when disabled */
  cursor: not-allowed; /* Cursor style for disabled state */
}

input[type="text"] {
  width: 80px; /* Adjust the value to your desired width */
}

.parent-div {
  display: flex;
  justify-content: center;
  align-items: center;
}