/* ===== 留言墙 v2.7.0 — 弹幕贴纸墙 ===== */

/* --- 容器：软木板背景 --- */
.zmw-wall-container {
    max-width: 820px;
    margin: 0 auto;
    padding: 32px 16px 48px;
    background: #8b7355;
    background-image:
        url("data:image/svg+xml,%3Csvg width='60' height='60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 5 L33 2 L35 5 L38 3 L39 7 L42 6 L42 10 L45 10 L44 14 L47 15 L44 18 L47 21 L43 22 L43 26 L39 26 L37 30 L33 29 L30 33 L27 29 L23 30 L21 26 L17 26 L17 22 L13 21 L16 18 L13 15 L16 14 L15 10 L18 10 L18 6 L21 7 L22 3 L25 5 L27 2 Z' fill='%23947a5e' opacity='0.15'/%3E%3C/svg%3E");
    border-radius: 6px;
    box-shadow: inset 0 0 0 8px #6b5035, 0 4px 16px rgba(0,0,0,.25);
    position: relative;
}

/* --- 头部 --- */
.zmw-wall-header {
    text-align: center;
    margin-bottom: 28px;
}
.zmw-wall-title {
    font-size: 1.6em;
    font-weight: 700;
    color: #fff;
    margin: 0 0 4px;
    letter-spacing: 2px;
    text-shadow: 0 2px 4px rgba(0,0,0,.35);
    display: inline-block;
    background: rgba(0,0,0,.15);
    padding: 6px 24px;
    border-radius: 4px;
}
.zmw-wall-subtitle {
    font-size: 12px;
    color: rgba(255,255,255,.6);
    letter-spacing: 1px;
    margin-top: 8px;
}

/* --- 发布表单 --- */
.zmw-post-form {
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 4px;
    padding: 20px 18px 16px;
    margin-bottom: 28px;
}
.zmw-form-row {
    margin-bottom: 10px;
}
.zmw-form-row:last-child {
    margin-bottom: 0;
}
.zmw-input,
.zmw-textarea {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid rgba(255,255,255,.20);
    border-radius: 3px;
    background: rgba(0,0,0,.20);
    color: #f0f0f0;
    font-size: 14px;
    box-sizing: border-box;
    transition: border-color .25s;
    outline: none;
    font-family: inherit;
}
.zmw-input::placeholder,
.zmw-textarea::placeholder {
    color: rgba(255,255,255,.35);
}
.zmw-input:focus,
.zmw-textarea:focus {
    border-color: rgba(255,255,255,.50);
}
.zmw-textarea {
    resize: vertical;
    min-height: 80px;
    line-height: 1.6;
}
.zmw-form-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.zmw-char-count {
    color: rgba(255,255,255,.45);
    font-size: 12px;
}

/* --- 按钮 --- */
.zmw-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    color: #fff;
    border: none;
    padding: 8px 22px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1px;
    transition: opacity .2s, transform .15s;
    line-height: 1.4;
    background: #e67e22;
    box-shadow: 0 2px 6px rgba(0,0,0,.2);
}
.zmw-btn:hover {
    opacity: .9;
    transform: translateY(-1px);
}
.zmw-btn:active {
    transform: translateY(0);
}
.zmw-btn:disabled {
    opacity: .45;
    pointer-events: none;
    transform: none;
}
.zmw-btn-loadmore {
    display: block;
    margin: 0 auto;
    background: rgba(255,255,255,.12);
    color: #fff;
    border: 1px solid rgba(255,255,255,.25);
    padding: 10px 32px;
    border-radius: 3px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1px;
}
.zmw-btn-loadmore:hover {
    background: rgba(255,255,255,.20);
    border-color: rgba(255,255,255,.45);
}

/* --- 留言列表：弹性错落排列 --- */
.zmw-messages {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    justify-content: center;
    align-items: flex-start;
}

/* --- 弹幕卡片：便签纸 --- */
.zmw-message-card {
    width: 210px;
    min-height: 100px;
    border-radius: 3px;
    padding: 18px 14px 14px;
    position: relative;
    transition: transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .25s;
    display: flex;
    flex-direction: column;
    box-shadow: 2px 3px 8px rgba(0,0,0,.18), 1px 1px 2px rgba(0,0,0,.12);
    cursor: default;
}
.zmw-message-card:hover {
    transform: scale(1.06) rotate(0deg) !important;
    box-shadow: 4px 6px 16px rgba(0,0,0,.30);
    z-index: 10;
}

/* 胶带装饰 */
.zmw-message-card::after {
    content: '';
    position: absolute;
    top: -5px;
    left: 50%;
    transform: translateX(-50%) rotate(-12deg);
    width: 44px;
    height: 14px;
    background: rgba(255,255,255,.45);
    border-radius: 1px;
    opacity: .7;
}

/* --- 便签 6 色彩 --- */
.zmw-note-0 { background: #FFEB3B; }
.zmw-note-1 { background: #FF80AB; }
.zmw-note-2 { background: #81C784; }
.zmw-note-3 { background: #64B5F6; }
.zmw-note-4 { background: #FFB74D; }
.zmw-note-5 { background: #CE93D8; }

/* 头像：手写圆圈 */
.zmw-msg-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 14px;
    color: #fff;
    user-select: none;
    line-height: 1;
    box-shadow: 0 1px 2px rgba(0,0,0,.15);
    margin-bottom: 8px;
}
.zmw-avatar-0 { background: #F57C00; }
.zmw-avatar-1 { background: #D32F2F; }
.zmw-avatar-2 { background: #1976D2; }
.zmw-avatar-3 { background: #388E3C; }
.zmw-avatar-4 { background: #7B1FA2; }

/* 内容区 */
.zmw-msg-body {
    flex: 1;
    min-width: 0;
}
.zmw-msg-header {
    margin-bottom: 6px;
}
.zmw-msg-nickname {
    font-weight: 700;
    color: rgba(0,0,0,.65);
    font-size: 13px;
    letter-spacing: .5px;
    display: block;
}
.zmw-msg-time {
    display: block;
    color: rgba(0,0,0,.35);
    font-size: 10px;
    margin-top: 2px;
}
.zmw-msg-content {
    color: rgba(0,0,0,.75);
    font-size: 14px;
    line-height: 1.6;
    word-break: break-word;
}

/* --- 加载更多 --- */
.zmw-loadmore-wrap {
    text-align: center;
    margin-top: 32px;
}

/* --- 空状态 --- */
.zmw-empty {
    text-align: center;
    padding: 80px 20px;
    color: rgba(255,255,255,.50);
    font-size: 15px;
    letter-spacing: 2px;
}

/* --- 暗色模式 --- */
body.dark-theme .zmw-wall-container {
    background: #4a3728;
    box-shadow: inset 0 0 0 8px #362518, 0 4px 16px rgba(0,0,0,.4);
}
body.dark-theme .zmw-message-card {
    box-shadow: 2px 3px 8px rgba(0,0,0,.35);
}
body.dark-theme .zmw-note-0 { background: #5d5d00; }
body.dark-theme .zmw-note-1 { background: #5c2233; }
body.dark-theme .zmw-note-2 { background: #1b5e20; }
body.dark-theme .zmw-note-3 { background: #1a3e6b; }
body.dark-theme .zmw-note-4 { background: #6b3a15; }
body.dark-theme .zmw-note-5 { background: #462952; }
body.dark-theme .zmw-msg-nickname,
body.dark-theme .zmw-msg-content { color: rgba(255,255,255,.85); }
body.dark-theme .zmw-msg-time { color: rgba(255,255,255,.45); }

/* --- 响应式 --- */
@media (max-width: 600px) {
    .zmw-wall-container {
        padding: 20px 8px 32px;
        border-radius: 0;
        box-shadow: none;
    }
    .zmw-wall-title {
        font-size: 1.3em;
    }
    .zmw-messages {
        gap: 10px;
    }
    .zmw-message-card {
        width: calc(50% - 8px);
        min-width: 140px;
        padding: 14px 10px 12px;
        min-height: 80px;
    }
    .zmw-post-form {
        padding: 16px 12px 14px;
    }
    .zmw-input,
    .zmw-textarea {
        padding: 8px 10px;
        font-size: 13px;
    }
    .zmw-msg-content {
        font-size: 13px;
    }
    .zmw-msg-nickname {
        font-size: 12px;
    }
}