/* ================= 日记：便签墙 ================= */
/* 复用 style.css 的 .settings-* / .app-shell，theme-center.css 的 .tc-*
   进场动画/提示文字/按钮，my-themes.css 的 .mt-search / .mt-overlay /
   .mt-modal / .mt-alert / .mt-info-card 这些弹层和卡片组件。这里只补
   .dy-* 这几个日记页面自己特有的东西：便签墙网格、五种心情颜色、详情正文。 */

/* ================= 日记 / 暗恋日记 切换 Tab =================
   跟 memory.css 的 .mem-tabs/.mem-tab 是同一个视觉模式（胶囊按钮、选中态
   实心底色），这里独立复制一份命名为 .dy-tabs/.dy-tab 而不是直接复用
   .mem-* 类名，避免日记页面意外依赖 memory.css 才能显示——两个页面各自
   的 CSS 文件互不引用。只在日记列表视图（非详情页）显示。 */
.dy-tabs{
    display:flex;
    gap:6px;
    margin-bottom:12px;
}

.dy-tab{
    flex:0 0 auto;
    border:none;
    background:var(--bg-2);
    color:var(--text-2);
    font-size:13px;
    font-weight:600;
    padding:7px 14px;
    border-radius:var(--radius-pill);
    cursor:pointer;
    transition:background .15s ease,color .15s ease;
}

.dy-tab.is-active{
    background:var(--accent);
    color:#fff;
}

.dy-wall{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    flex-shrink:0; /* 跟其它几个"中心"是同一个 flexbox 压缩坑 */
}

.dy-wall-empty{
    grid-column:1 / -1;
    padding:36px 16px;
    text-align:center;
}

.dy-note{
    display:block;
    border-radius:var(--radius-md);
    padding:14px;
    box-shadow:var(--shadow-soft);
    text-decoration:none;
    color:inherit;
    position:relative;
    transition:transform .2s var(--spring);
}

.dy-note:active{
    transform:scale(.97);
}

.dy-note-meta{
    display:flex;
    justify-content:space-between;
    font-size:11px;
    color:var(--text-2);
    opacity:.8;
    margin-bottom:8px;
    padding-right:20px; /* 给右上角的删除按钮留空间，避免"时段"文字被压住 */
}

.dy-note-title{
    font-size:14.5px;
    font-weight:700;
    color:var(--text-1);
    line-height:1.4;
    margin-bottom:6px;
}

.dy-note-preview{
    font-size:12px;
    line-height:1.6;
    color:var(--text-1);
    opacity:.75;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.dy-note-delete{
    position:absolute;
    top:10px;
    right:10px;
    width:20px;
    height:20px;
    border:none;
    border-radius:50%;
    background:rgba(0,0,0,.08);
    color:var(--text-1);
    font-size:10px;
    line-height:1;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    opacity:.6;
}

.dy-note-delete:active{
    opacity:1;
}

/* 五种心情颜色——跟 diary_prompt.txt 里让模型输出的"粉/蓝/黄/白/灰"一一对应 */

.dy-note-pink{ background:#fbe4ec; }
.dy-note-blue{ background:#e3f1f7; }
.dy-note-yellow{ background:#fbf3d9; }
.dy-note-white{ background:#ffffff; box-shadow:var(--shadow-soft), inset 0 0 0 1px var(--line); }
.dy-note-gray{ background:#ececea; }

/* "初遇"是固定钉在墙顶部的起点，跟五种心情颜色的便签区分开，横跨两列、
   用暖金色调，不是聊天当天生成的，所以不参与心情配色系统 */

.dy-note-pinned{
    grid-column:1 / -1;
    background:linear-gradient(135deg,#fdf3df,#f8e4bd);
    box-shadow:var(--shadow-soft), inset 0 0 0 1px rgba(180,140,60,.18);
}

/* ---------- 详情页 ---------- */

.dy-detail-card{
    border-radius:var(--radius-lg);
}

.dy-body-card{
    padding:18px 20px;
    flex-shrink:0;
}

.dy-body-text{
    font-size:15px;
    line-height:1.9;
    color:var(--text-1);
    white-space:pre-wrap;
    word-break:break-word;
}
