body {
    font-family: Arial, sans-serif;
}

#checklist {
    list-style: none;
    padding: 0;
}

#checklist li {
    display: flex;
    align-items: center;
    margin-bottom: 5px;
}

#checklist .item-name {
    margin: 0 10px;
}

#checklist .completed {
    text-decoration: line-through;
    color: grey;
}

.sortable-ghost {
    opacity: 0.5;  /* Makes the dragged item semi-transparent */
    background-color: #f0f0f0;
}

.card-header {
  padding: 0.75rem 1.25rem;
  margin-bottom: 0;
  background-color: #f8f9fc;
  border-bottom: 1px solid #e3e6f0;
}

.font-weight-bold {
  font-weight: 700 !important;
}

.form-group {
    margin-bottom: 15px;  /* Adds spacing between the dropdowns */
}

.form-control {
    width: 100%;
}

#submitBtn {
    
    background-color: #D7D9DB;
    color: black;
    padding: 6px 6px;
    border: 1px;
    border-radius: 15px;
    cursor: pointer;
    width: 90px;
    height: 30px;
    background-image: radial-gradient(circle, #fafdff, #D7D9DB);
    transition: background 0.3s ease;  /* Smooth transition */
}

#submitBtn:hover {
    background-image: radial-gradient(circle, #D7D9DB, #9e9e9e);  /* Darker on hover */
}


#addActionBtn {
    background-color: #D7D9DB;
    color: black;
    padding: 6px 6px;
    border: 1px;
    border-radius: 15px;
    cursor: pointer;
    width: 90px;
    height: 30px;
    background-image: radial-gradient(circle, #fafdff, #D7D9DB);
    transition: background 0.3s ease;  /* Smooth transition */
}

#addActionBtn:hover {
    background-image: radial-gradient(circle, #D7D9DB, #9e9e9e);  /* Darker on hover */
}