body {
    background-color: #13344c; /* Light Gray */
    font-family: 'DM Sans', sans-serif;
}

.card {
    max-width: 500px;
    margin: auto;
}

.text-primary {
    color: rgb(19, 52, 76) !important; /* Match SendMode Blue */
}

.btn-primary {
    background-color: #499fa4 !important; /* Match SendMode Teal */
    border: none;
}

    .btn-primary:hover {
        background-color: #007980 !important; /* Darker Teal */
    }

/* Add a click effect */
    .btn-primary:active {
        background-color: #007980 !important;
        box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #3e77b3;
        transform: scale(0.98); /* Slight shrink effect */
    }

.list-group-item {
    border: 1px solid #13344c;
    padding: 10px;
    cursor: pointer;
}

.list-group-item input {
    margin-right: 10px;
}

/* Change selected checkbox & radio button color */
.form-check-input:checked {
    background-color: #228a84 !important;  /* Change to your desired color */
    border-color: #228a84 !important; /* Change border color */
}

/* Ensure checkmark color is visible */
.form-check-input:checked::before {
    color: white !important;
}

.btn-lg {
    border-radius: 0.375rem;
    padding: 1rem 1rem;
    font-size: 0.9rem;
    font-weight: 500;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #3e77b3;
}