/**
 * 喜木 · 情境笔记（选择列表 + 编辑浮层；各模块页内入口打开，无 FAB）
 */

.ximu-ctx-notes-overlay {
    position: fixed;
    inset: 0;
    z-index: 10060;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 0;
}

/* 编辑浮层：满屏（与六爻 notes-edit-box 一致，不留顶部空隙） */
#ximu-ctx-notes-editor.notes-edit-overlay {
    z-index: 10060;
    align-items: stretch;
    justify-content: stretch;
    padding: 0;
}

#ximu-ctx-notes-editor .notes-edit-box {
    width: 100vw;
    max-width: 100vw;
    height: 100vh;
    max-height: 100vh;
    margin: 0;
    border-radius: 0;
    box-shadow: none;
    overflow-y: auto;
    padding-top: max(20px, env(safe-area-inset-top, 0px) + 12px);
    padding-left: max(20px, env(safe-area-inset-left, 0px) + 12px);
    padding-right: max(20px, env(safe-area-inset-right, 0px) + 12px);
    padding-bottom: max(88px, env(safe-area-inset-bottom, 0px) + 12px);
}

@supports (height: 100svh) {
    #ximu-ctx-notes-editor .notes-edit-box {
        width: 100svw;
        max-width: 100svw;
        height: 100svh;
        max-height: 100svh;
    }
}

#ximu-ctx-notes-editor .notes-edit-record-context .ximu-ctx-notes-meta-inner .ximu-ctx-sizhu-jin,
#ximu-ctx-notes-editor .notes-edit-record-meta-line .ximu-ctx-sizhu-jin,
.notes-edit-box--inline-dock .notes-edit-record-meta-line .ximu-ctx-sizhu-jin,
.notes-edit-box--inline-dock .ximu-ctx-notes-record-meta-line .ximu-ctx-sizhu-jin {
    color: #c9a227;
    font-weight: 700;
}
#ximu-ctx-notes-editor .notes-edit-record-context .ximu-ctx-notes-meta-inner .ximu-ctx-sizhu-mu,
#ximu-ctx-notes-editor .notes-edit-record-meta-line .ximu-ctx-sizhu-mu,
.notes-edit-box--inline-dock .notes-edit-record-meta-line .ximu-ctx-sizhu-mu,
.notes-edit-box--inline-dock .ximu-ctx-notes-record-meta-line .ximu-ctx-sizhu-mu {
    color: #2e7d32;
    font-weight: 700;
}
#ximu-ctx-notes-editor .notes-edit-record-context .ximu-ctx-notes-meta-inner .ximu-ctx-sizhu-shui,
#ximu-ctx-notes-editor .notes-edit-record-meta-line .ximu-ctx-sizhu-shui,
.notes-edit-box--inline-dock .notes-edit-record-meta-line .ximu-ctx-sizhu-shui,
.notes-edit-box--inline-dock .ximu-ctx-notes-record-meta-line .ximu-ctx-sizhu-shui {
    color: #1565c0;
    font-weight: 700;
}
#ximu-ctx-notes-editor .notes-edit-record-context .ximu-ctx-notes-meta-inner .ximu-ctx-sizhu-huo,
#ximu-ctx-notes-editor .notes-edit-record-meta-line .ximu-ctx-sizhu-huo,
.notes-edit-box--inline-dock .notes-edit-record-meta-line .ximu-ctx-sizhu-huo,
.notes-edit-box--inline-dock .ximu-ctx-notes-record-meta-line .ximu-ctx-sizhu-huo {
    color: #c62828;
    font-weight: 700;
}
#ximu-ctx-notes-editor .notes-edit-record-context .ximu-ctx-notes-meta-inner .ximu-ctx-sizhu-tu,
#ximu-ctx-notes-editor .notes-edit-record-meta-line .ximu-ctx-sizhu-tu,
.notes-edit-box--inline-dock .notes-edit-record-meta-line .ximu-ctx-sizhu-tu,
.notes-edit-box--inline-dock .ximu-ctx-notes-record-meta-line .ximu-ctx-sizhu-tu {
    color: #8d6e63;
    font-weight: 700;
}

.ximu-ctx-notes-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
}

.ximu-ctx-notes-box {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 520px;
    max-height: min(88vh, 720px);
    margin: 0 auto;
    padding: 16px 14px 20px;
    padding-bottom: max(20px, env(safe-area-inset-bottom, 0px) + 12px);
    background: #fff;
    border-radius: 16px 16px 0 0;
    box-shadow: 0 -8px 32px rgba(15, 23, 42, 0.18);
    overflow: auto;
    box-sizing: border-box;
}

@media (min-width: 600px) {
    #ximu-ctx-notes-picker.ximu-ctx-notes-overlay {
        align-items: center;
        padding: 24px 16px;
    }
    #ximu-ctx-notes-picker .ximu-ctx-notes-box {
        border-radius: 14px;
        max-height: 85vh;
    }
}

.ximu-ctx-notes-close {
    position: absolute;
    top: 10px;
    right: 12px;
    z-index: 2;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 8px;
    background: transparent;
    font-size: 24px;
    line-height: 1;
    color: #64748b;
    cursor: pointer;
}

.ximu-ctx-notes-heading {
    margin: 0 36px 12px 0;
    font-size: 17px;
    color: #1e293b;
}

.ximu-ctx-notes-picker-sub {
    margin: 0 0 12px;
    font-size: 13px;
    color: #64748b;
}

.ximu-ctx-notes-picker-actions {
    margin-bottom: 12px;
}

.ximu-ctx-notes-picker-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ximu-ctx-notes-picker-item {
    margin: 0 0 8px;
}

.ximu-ctx-notes-picker-item-btn {
    width: 100%;
    text-align: left;
    padding: 12px 14px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #f8fafc;
    cursor: pointer;
    font-family: inherit;
}

.ximu-ctx-notes-picker-item-btn:hover {
    border-color: #86efac;
    background: #f0fdf4;
}

.ximu-ctx-notes-picker-item-title {
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: #1e293b;
    margin-bottom: 4px;
}

.ximu-ctx-notes-picker-item-preview {
    display: block;
    font-size: 13px;
    color: #64748b;
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ximu-ctx-notes-picker-empty {
    padding: 20px 8px;
    text-align: center;
    color: #94a3b8;
    font-size: 14px;
}

.ximu-ctx-notes-record-context {
    margin: 0 0 14px;
    padding: 10px 12px;
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    line-height: 1.55;
}

.ximu-ctx-notes-record-matter-line,
.ximu-ctx-notes-record-meta-line {
    margin: 0;
    font-size: 14px;
    color: #334155;
    word-break: break-word;
}

.ximu-ctx-notes-record-matter-line + .ximu-ctx-notes-record-meta-line {
    margin-top: 6px;
}

.notes-edit-record-meta-line .ximu-ctx-notes-meta-inner,
#ximu-ctx-notes-editor .notes-edit-record-meta-line .ximu-ctx-notes-meta-inner {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    column-gap: 0.5em;
}

.ximu-ctx-notes-record-meta-line .ximu-ctx-notes-sizhu-gap,
.notes-edit-record-meta-line .ximu-ctx-notes-sizhu-gap {
    display: inline-block;
    width: 0.5em;
    min-width: 0.5em;
}

.ximu-ctx-notes-record-meta-line .ximu-ctx-sizhu-jin { color: #c9a227; font-weight: 700; }
.ximu-ctx-notes-record-meta-line .ximu-ctx-sizhu-mu { color: #2e7d32; font-weight: 700; }
.ximu-ctx-notes-record-meta-line .ximu-ctx-sizhu-shui { color: #1565c0; font-weight: 700; }
.ximu-ctx-notes-record-meta-line .ximu-ctx-sizhu-huo { color: #c62828; font-weight: 700; }
.ximu-ctx-notes-record-meta-line .ximu-ctx-sizhu-tu { color: #8d6e63; font-weight: 700; }

.ximu-ctx-notes-label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #555;
    margin-bottom: 6px;
}

.ximu-ctx-notes-input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 15px;
    margin-bottom: 12px;
    box-sizing: border-box;
}

.ximu-ctx-notes-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
}

.ximu-ctx-notes-tb-btn {
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #fff;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    font-family: inherit;
}

.ximu-ctx-notes-tb-btn:hover {
    background: #f1f5f9;
}

.ximu-ctx-notes-rich {
    min-height: 200px;
    max-height: 40vh;
    overflow: auto;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 15px;
    line-height: 1.65;
    outline: none;
    margin-bottom: 14px;
    word-break: break-word;
}

.ximu-ctx-notes-rich:focus {
    border-color: #2e7d32;
    box-shadow: 0 0 0 2px rgba(46, 125, 50, 0.2);
}

.ximu-ctx-notes-btns {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    align-items: center;
}

.ximu-ctx-notes-del-btn {
    margin-right: auto;
    padding: 8px 14px;
    border: 1px solid #fecaca;
    border-radius: 8px;
    background: #fff;
    color: #b91c1c;
    font-size: 14px;
    cursor: pointer;
    font-family: inherit;
}

.ximu-ctx-notes-del-btn:hover {
    background: #fef2f2;
}