/* Starter Code */
body {
  font-family: 'Open Sans', sans-serif;
  font-size: 16px;
  background: #696869eb;
}

.swim-lanes {
  min-height: 60vh;
}

.task-card {
  margin: 0 auto;
}

.task-card:hover {
  cursor: grab;
}

.task-card:active {
  cursor: grabbing;
}


/* Styling Main Title and Description underneath */
#title, #description {
  color: #f8f4f4;
}

#title {
  text-decoration: underline;
  font-size: 3.5rem;
}

#description {
  /* padding-top: 20px; */
  font-size: 1.1rem;
}

/* Styling the Main Add Task Button */
.main-t-button {
  background: #4e0174;
  color: #f1f0f0;
  border-color: white;
  margin-top: -10px;
  padding-left: 20px;
  padding-right: 20px;
}

.main-t-button:hover {
  background: #35014f;
  color: white;
  border-color: white;
}

/* Styling the Add Task Modal */
.add-t-button {
  background: #4e0174;
  color: #f1f0f0;
  border-color: white;
}

.add-t-button:hover {
  background: #35014f;
  border-color: white;
}

/* Styling the three task lanes */
/* LANES NOT CARDS */
.card-title {
  background: #4e0174;
  color: #f1f0f0;
  padding: 10px;
  margin: 0;
}

.card-header {
  background: #4e0174;
}


/* Styling the task cards */
/* Task Card Background Styling */
.card-title-sml {
  font-size: 1.5rem;
  color: white;
}

.card-body {
  background: #bfbebe;
  padding: 10px;
}

.card-text {
  font-size: larger;
}

.card-text-due {
  font-size: medium;
  margin-bottom: 2px;
}

/* Styling the task cards depending on the due date */
.past-due {
  background-color: red;
  padding: 5px;
}

.due-today {
  background-color: rgb(227, 146, 16);
  padding: 5px;
}


.future {
  background-color: #4e0174;
  padding: 5px;

}

/* Customizes the whole scrollbar */
::-webkit-scrollbar {
  width: 12px; /* Adjust the width of the scrollbar */
}

/* Customizes the track of the scrollbar */
::-webkit-scrollbar-track {
  background: #2c2f33; /* Change to match your design */
}

/* Customizes the thumb of the scrollbar */
::-webkit-scrollbar-thumb {
  background-color: #333233; 
  /* border-radius: 6px;  */
  border: 3px solid #2c2f33; /* Same as track color to create a "margin" effect */
}