/* Style for the help-text block in the Draftail editor */
.Draftail-block--level-text-1 {
    color: gray; /* Set the text color to gray */
    font-style: italic; /* Make the text italic */
    border: 1px dashed #ccc; /* Add a dashed border with light gray color */
    padding: 10px 10px 10px 30px; /* Add padding inside the block, with extra padding on the left to make space for the number */
    margin: 10px 0; /* Add margin above and below the block */
    background-color: #f9f9f9; /* Set a light gray background color */
    border-radius: 5px; /* Add rounded corners to the block */
    position: relative; /* Position relative to enable absolute positioning for ::before pseudo-element */
}

/* Add a number "1" before the help-text block */
.Draftail-block--level-text-1:before {
    content: "1"; /* Content to be displayed before the block */
    position: absolute; /* Position absolutely within the relative container */
    top: 50%; /* Center vertically within the block */
    left: 10px; /* Position from the left of the block */
    transform: translateY(-50%); /* Adjust for vertical centering */
    font-weight: bold; /* Make the number bold */
    color: red; /* Set the color of the number to red */
}

/* Style for the help-text block in the Draftail editor */
.Draftail-block--level-text-2 {
    color: gray; /* Set the text color to gray */
    font-style: italic; /* Make the text italic */
    border: 1px dashed #ccc; /* Add a dashed border with light gray color */
    padding: 10px 10px 10px 30px; /* Add padding inside the block, with extra padding on the left to make space for the number */
    margin: 10px 0; /* Add margin above and below the block */
    background-color: #f9f9f9; /* Set a light gray background color */
    border-radius: 5px; /* Add rounded corners to the block */
    position: relative; /* Position relative to enable absolute positioning for ::before pseudo-element */
}

/* Add a number "1" before the help-text block */
.Draftail-block--level-text-2:before {
    content: "2"; /* Content to be displayed before the block */
    position: absolute; /* Position absolutely within the relative container */
    top: 50%; /* Center vertically within the block */
    left: 10px; /* Position from the left of the block */
    transform: translateY(-50%); /* Adjust for vertical centering */
    font-weight: bold; /* Make the number bold */
    color: red; /* Set the color of the number to red */
}

/* Style for the help-text block in the Draftail editor */
.Draftail-block--level-text-3 {
    color: gray; /* Set the text color to gray */
    font-style: italic; /* Make the text italic */
    border: 1px dashed #ccc; /* Add a dashed border with light gray color */
    padding: 10px 10px 10px 30px; /* Add padding inside the block, with extra padding on the left to make space for the number */
    margin: 10px 0; /* Add margin above and below the block */
    background-color: #f9f9f9; /* Set a light gray background color */
    border-radius: 5px; /* Add rounded corners to the block */
    position: relative; /* Position relative to enable absolute positioning for ::before pseudo-element */
}

/* Add a number "1" before the help-text block */
.Draftail-block--level-text-3:before {
    content: "3"; /* Content to be displayed before the block */
    position: absolute; /* Position absolutely within the relative container */
    top: 50%; /* Center vertically within the block */
    left: 10px; /* Position from the left of the block */
    transform: translateY(-50%); /* Adjust for vertical centering */
    font-weight: bold; /* Make the number bold */
    color: red; /* Set the color of the number to red */
}

/* Style for the help-text block in the Draftail editor */
.Draftail-block--level-text-4 {
    color: gray; /* Set the text color to gray */
    font-style: italic; /* Make the text italic */
    border: 1px dashed #ccc; /* Add a dashed border with light gray color */
    padding: 10px 10px 10px 30px; /* Add padding inside the block, with extra padding on the left to make space for the number */
    margin: 10px 0; /* Add margin above and below the block */
    background-color: #f9f9f9; /* Set a light gray background color */
    border-radius: 5px; /* Add rounded corners to the block */
    position: relative; /* Position relative to enable absolute positioning for ::before pseudo-element */
}

/* Add a number "1" before the help-text block */
.Draftail-block--level-text-4:before {
    content: "4"; /* Content to be displayed before the block */
    position: absolute; /* Position absolutely within the relative container */
    top: 50%; /* Center vertically within the block */
    left: 10px; /* Position from the left of the block */
    transform: translateY(-50%); /* Adjust for vertical centering */
    font-weight: bold; /* Make the number bold */
    color: red; /* Set the color of the number to red */
}