#reminders-overlay-container,
#scheduled_messages_overlay_container {
    .no-overlay-messages {
        display: none;

        &:only-child {
            display: block;
        }
    }
}

#scheduled_message_indicator {
    display: block;
    margin-left: 10px;
    font-style: italic;
    color: hsl(0deg 0% 53%);
}

#reminders-overlay-container .message_content {
    cursor: auto;
}

.schedule-reminder-note {
    resize: none;
    width: 100%;
    min-width: 10em;
    padding: var(--schedule-reminder-note-padding);
    /* Set the minimum height such that we start out with 2 lines of text. */
    min-height: calc(2em * var(--base-line-height-unitless));
    /* Set the maximum height of textarea to be enough for 10 lines of text. */
    max-height: calc(
        (10em * var(--base-line-height-unitless)) +
            (2 * var(--schedule-reminder-note-padding))
    );
    overflow-y: auto;

    background-color: var(--background-color-textarea);

    font-size: 1em;
    line-height: var(--base-line-height-unitless);
    font-family: inherit;
}