/* --- Task Selection --- */
/* REMOVED: Background color rule for selected tasks. 
   This allows the underlying color (Red/Blink) to be visible. 
   Selection is now handled via box-shadow in 02_task_list.css 
*/
/* --- Red Marked Task (Non-completable tracking) --- */
/* Default Red - applied if no specific toggle color is set */
.task-item.marked-toggled-on>.task-content {
    background-color: rgba(255, 60, 60, 0.42); /* Light Red */
}
/* --- Non-Completable Task --- */
.task-item[data-completable="false"]>.task-content>.task-checkbox {
    width: 16px;
    height: 16px;
    margin-top: 3px;
    border-radius: 4px;
    background-color: var(--color-text-alt);
    cursor: default;
}
.task-item[data-completable="false"]>.task-content>.task-checkbox:hover {
    background-color: var(--color-text-alt);
    border-color: var(--color-text-alt);
}
/* --- Completed Task Styling --- */
.task-item.completed>.task-content>.task-checkbox {
    background-color: var(--color-accent);
    border-color: var(--color-accent);
}
.task-item.completed>.task-content>.task-checkbox:hover {
    background-color: #c53e30;
    border-color: #c53e30;
}
.task-item.completed>.task-content>.task-checkbox::before {
    content: '✔';
    color: white;
    font-size: 12px;
    font-weight: bold;
}
.task-item.completed>.task-content>.task-details>.task-text {
    text-decoration: line-through;
    color: var(--color-text-alt);
}
.task-item.completed>.task-content>.task-details>.task-text a {
    color: var(--color-text-alt);
}
/* --- NEW: Subtask Count Color Indicators --- */
/* --- Circles (Completable) - Just change border color --- */
/* Level 1 (1-2) */
.task-item[data-completable="true"][data-subtask-count="1"] > .task-content > .task-checkbox,
.task-item[data-completable="true"][data-subtask-count="2"] > .task-content > .task-checkbox {
    border-color: var(--color-green-1);
}
/* Level 2 (3-4) */
.task-item[data-completable="true"][data-subtask-count="3"] > .task-content > .task-checkbox,
.task-item[data-completable="true"][data-subtask-count="4"] > .task-content > .task-checkbox {
    border-color: var(--color-green-2);
}
/* Level 3 (5-6) */
.task-item[data-completable="true"][data-subtask-count="5"] > .task-content > .task-checkbox,
.task-item[data-completable="true"][data-subtask-count="6"] > .task-content > .task-checkbox {
    border-color: var(--color-green-3);
}
/* Level 4 (7-8) */
.task-item[data-completable="true"][data-subtask-count="7"] > .task-content > .task-checkbox,
.task-item[data-completable="true"][data-subtask-count="8"] > .task-content > .task-checkbox {
    border-color: var(--color-green-4);
}
/* Level 5 (9-10+) */
.task-item[data-completable="true"][data-subtask-count="9"] > .task-content > .task-checkbox,
.task-item[data-completable="true"][data-subtask-count="10"] > .task-content > .task-checkbox {
    border-color: var(--color-green-5);
}
/* --- Squares (Not Completable) - Change background color --- */
/* Level 1 (1-2) */
.task-item[data-completable="false"][data-subtask-count="1"] > .task-content > .task-checkbox,
.task-item[data-completable="false"][data-subtask-count="2"] > .task-content > .task-checkbox {
    background-color: var(--color-blue-1);
    border-color: var(--color-blue-1);
}
/* Level 2 (3-4) */
.task-item[data-completable="false"][data-subtask-count="3"] > .task-content > .task-checkbox,
.task-item[data-completable="false"][data-subtask-count="4"] > .task-content > .task-checkbox {
    background-color: var(--color-blue-2);
    border-color: var(--color-blue-2);
}
/* Level 3 (5-6) */
.task-item[data-completable="false"][data-subtask-count="5"] > .task-content > .task-checkbox,
.task-item[data-completable="false"][data-subtask-count="6"] > .task-content > .task-checkbox {
    background-color: var(--color-blue-3);
    border-color: var(--color-blue-3);
}
/* Level 4 (7-8) */
.task-item[data-completable="false"][data-subtask-count="7"] > .task-content > .task-checkbox,
.task-item[data-completable="false"][data-subtask-count="8"] > .task-content > .task-checkbox {
    background-color: var(--color-blue-4);
    border-color: var(--color-blue-4);
}
/* Level 5 (9-10+) */
.task-item[data-completable="false"][data-subtask-count="9"] > .task-content > .task-checkbox,
.task-item[data-completable="false"][data-subtask-count="10"] > .task-content > .task-checkbox {
    background-color: var(--color-blue-5);
    border-color: var(--color-blue-5);
}
/* --- NEW: Always Non-Completable (Black Dot) --- */
.task-item[data-always-non-completable="true"] > .task-content > .task-checkbox {
    position: relative;
}
/* The dot */
.task-item[data-always-non-completable="true"] > .task-content > .task-checkbox::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 6px;
    height: 6px;
    background-color: black;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
/* --- NEW: Toggle Colors (Overrides default Red) --- */
/* 1. Background Highlights when Toggled On */
.task-item.marked-toggled-on[data-toggle-color="red"] > .task-content { background-color: rgba(255, 60, 60, 0.42); }
.task-item.marked-toggled-on[data-toggle-color="orange"] > .task-content { background-color: rgba(255, 165, 0, 0.42); }
.task-item.marked-toggled-on[data-toggle-color="yellow"] > .task-content { background-color: rgba(255, 235, 59, 0.5); }
.task-item.marked-toggled-on[data-toggle-color="green"] > .task-content { background-color: rgba(60, 255, 60, 0.42); }
.task-item.marked-toggled-on[data-toggle-color="cyan"] > .task-content { background-color: rgba(0, 255, 255, 0.42); }
.task-item.marked-toggled-on[data-toggle-color="blue"] > .task-content { background-color: rgba(80, 80, 255, 0.42); }
.task-item.marked-toggled-on[data-toggle-color="purple"] > .task-content { background-color: rgba(180, 80, 255, 0.42); }
.task-item.marked-toggled-on[data-toggle-color="magenta"] > .task-content { background-color: rgba(255, 60, 255, 0.42); }
.task-item.marked-toggled-on[data-toggle-color="grey"] > .task-content { background-color: rgba(160, 160, 160, 0.5); }