/* 侧边栏备注区渐显动画 */
.Sv-memo #protyle-sidebar{
    animation: SvMemoFadeIn 0.5s cubic-bezier(0.4,0,0.2,1) 1;
    animation-delay: 0.5s; /* 新增：延迟1秒后再播放动画 */
    opacity: 0; /* 初始隐藏 */
    animation-fill-mode: forwards; /* 动画结束后保持最终状态 */
}
@keyframes SvMemoFadeIn {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: none; }
}

@keyframes memoHighlightFade {
  0% { background-color: var(--b3-theme-primary-lightest); }
  80% { background-color: var(--b3-theme-primary-lightest); }
  100% { background-color: transparent; }
}
.memo-highlight {
  animation: memoHighlightFade 1.2s cubic-bezier(0.4,0,0.2,1);
}

body:not(.body--mobile){
    .Sv-memo[data-fullwidth="true"]{
        .protyle-wysiwyg {
            width: calc(100% - 230px) !important;
            min-width: unset !important
        }
            #protyle-sidebar {
            right: 0px !important
        }
    }

    /* 编辑状态样式 */

    .memo-item, .memo-edit-input {
        min-height: 32px;
        box-sizing: border-box;
    }

    .memo-title-with-dot {
        display: -webkit-box;
        color: var(--b3-theme-on-surface);
        word-wrap: break-word;
        word-break: break-word;
        overflow-wrap: break-word;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
        line-height: 1.2em;
        max-height: 2.4em;
    }

    .memo-title-dot {
        display: inline-block;
        width: 4px;
        border-radius: 3px;
        background: var(--b3-theme-primary);
        margin-right: 6px;
        flex-shrink: 0;
        align-self: stretch; /* 让竖条高度和父 flex 容器一样高 */
    }

    .memo-item {
        background-color: var(--Sv-protyle-toolbar-bg);
        & button{
            height: 20px;
            width: 20px;
            opacity: 0;
            line-height: 0px;
            background-color: var(--Sv-list-background);
            &:hover{
                background: var(--Sv-dock-item--activefocus-background);
                .b3-menu__icon{
                color: var(--Sv-dock-item--activefocus-color);
                }
            }
        }
        & button .b3-menu__icon{
            width: 12px;
            height: 12px;
            color: var(--b3-theme-on-surface);
            margin: 3px;
        }
        &:hover{
            transform: translateX(-8px);
            & .memo-title-dot {
                background: var(--Sv-dock-item--activefocus-background);
            }
            & button{
                opacity: 1;
            }
        }
    }
}

.memo-content-view{
    word-wrap: break-word;
    white-space: break-spaces;
    max-height: 282px;
    overflow-y: auto;
    & b{color:var(--b3-font-color13);}
}
.memo-edit-input b{color:var(--b3-font-color13);}
[data-memo-type="block"]{
    .memo-title-dot{
        display: none!important;
    }
    svg{
        color: var(--b3-theme-primary);
    }
    &:hover{
            svg{
            color: var(--Sv-dock-item--activefocus-background);
        }
    }
}