/* Jodit Plugin: Todo-Liste
   Checkbox wird per CSS ::before gefaked – kein <input> im DOM.
   Editor + Detail-Ansicht verwenden das gleiche Basis-Format.
   ========================================================================= */

/* ----- Basis (gilt für Editor + Detail-Ansicht) ----- */

ul.todo-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0.6rem 0 1rem 0;
}

    ul.todo-list > li {
        position: relative;
        padding-left: 1.6rem;
        line-height: 1.55;
        padding-top: 0.22rem;
        padding-bottom: 0.22rem;
        border-radius: 4px;
        cursor: pointer;
    }

        /* Checkbox als ::before Pseudo-Element */
        ul.todo-list > li::before {
            content: '';
            position: absolute;
            left: 0;
            top: 0.4rem;
            width: 15px;
            height: 15px;
            border: 2px solid #94a3b8;
            border-radius: 4px;
            background: #fff;
            cursor: pointer;
            box-sizing: border-box;
            width: 16px;
            height: 16px;
            transition: border-color 0.15s, background 0.15s;
        }

        ul.todo-list > li[data-checked="true"] {
            opacity: 0.55;
            text-decoration: line-through;
            text-decoration-color: #94a3b8;
        }

        /* Checked: blauer Hintergrund + SVG-Haken */
        ul.todo-list > li[data-checked="true"]::before {
            background: #3b82f6;
            border-color: #3b82f6;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2.5-2.5a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z' fill='white'/%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position: center;
            background-size: 14px;
        }

        ul.todo-list > li:hover {
            background: #f8fafc;
        }
        ul.todo-list > li:has(> ul.todo-list > li:hover) {
            background: transparent;
        }

    /* Verschachtelte Todo-Listen (Einrückung via Tab) */
    ul.todo-list ul.todo-list {
        padding: 0 !important;
        margin: 0.1rem 0 0.1rem 0.4rem !important;
    }