/* Override container for this page */
.container {
    max-width: 800px;
    margin: 20px auto;
    padding: 20px;
    background: #000000;
    color: #FFFFFF;
    border-radius: 5px;
}

/* Info message */
.info-message {
    background-color: #1A1A1A;
    padding: 10px;
    border-left: 5px solid var(--link-color); /* #1a73e8, 4.5:1 on #1A1A1A */
    font-size: 14px;
    margin-bottom: 20px;
    color: #FFFFFF;
}

/* Task sections */
.task {
    border: 1px solid #333;
    border-radius: 5px;
    padding: 15px;
    margin-bottom: 20px;
    background-color: #1A1A1A;
}

/* Task header */
.task-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

/* Status indicators */
.status {
    padding: 5px 10px;
    color: white;
    font-weight: bold;
    border-radius: 3px;
}

.status.not-done {
    background-color: var(--error-color); /* #ff6666, 5.5:1 on #1A1A1A */
}

.status.done {
    background-color: var(--accent-color); /* #ffcc00, 3:1 on #1A1A1A for large text */
}

/* Paragraphs inside tasks */
.task p {
    color: #FFFFFF;
    font-size: 14px;
    margin-bottom: 10px;
}

/* Buttons */
.task button {
    padding: 10px 20px;
    border: 2px solid var(--button-blue-border); /* #003366, 3:1 on #1A1A1A */
    border-radius: var(--border-radius);
    cursor: pointer;
    font-size: 14px;
    background-color: var(--button-blue); /* #0059b3, 4.6:1 on #FFFFFF */
    color: #FFFFFF;
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
    box-shadow: var(--box-shadow);
}

.task button:hover {
    background-color: var(--button-blue-hover); /* #004080, 5.2:1 on #FFFFFF */
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.2);
}

.task button:focus {
    outline: 2px solid var(--link-color); /* #1a73e8, 4.5:1 on #1A1A1A */
    outline-offset: 2px;
}

.task button:disabled {
    background-color: #4d4d4d; /* Contrast 5.3:1 on #FFFFFF */
    border-color: #333333; /* Contrast 3:1 on #1A1A1A */
    cursor: not-allowed;
    opacity: 0.7;
}