/* ===================================================================
   SunBlog_Letters 写信回信插件样式
   信纸背景 + 手写体 + 信封卡片 + 密码门
   =================================================================== */

/* ---------- 全局重置 ---------- */
*{margin:0;padding:0;box-sizing:border-box}

body{
    font-family:'KaiTi','楷体','STKaiti','华文楷体',serif;
    background:#f5f0e6;
    color:#3a3a3a;
    line-height:1.9;
    -webkit-font-smoothing:antialiased;
}

a{color:#8b6914;text-decoration:none;transition:color .3s}
a:hover{color:#c9931e}

/* ---------- 顶部导航 ---------- */
.letters-nav{
    max-width:900px;margin:0 auto;padding:16px 20px;
    display:flex;gap:24px;align-items:center;
}
.letters-nav .nav-home,.letters-nav .nav-list{
    font-size:15px;color:#8b6914;
}
.letters-nav .nav-home:before{content:'← '}

/* ===================================================================
   密码门
   =================================================================== */
.lock-screen{
    min-height:100vh;display:flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg,#fdf6e3 0%,#f0e6d2 50%,#e8dcc4 100%);
    padding:20px;
}
.lock-card{
    background:#fffdf8;border:1px solid #d4c5a0;border-radius:4px;
    padding:48px 40px;max-width:400px;width:100%;text-align:center;
    box-shadow:0 8px 40px rgba(139,105,20,.12);
    position:relative;
}
.lock-card:before{
    content:'';position:absolute;top:-1px;left:50%;transform:translateX(-50%);
    width:60px;height:3px;background:#c9931e;border-radius:0 0 3px 3px;
}
.lock-icon{
    font-size:48px;margin-bottom:16px;opacity:.7;
}
.lock-title{
    font-size:28px;color:#5a4612;margin-bottom:8px;font-weight:normal;
    letter-spacing:4px;
}
.lock-desc{
    font-size:14px;color:#999;margin-bottom:28px;
}
.lock-error{
    color:#c0392b;font-size:13px;margin-bottom:16px;
}
.lock-form{display:flex;flex-direction:column;gap:14px}
.lock-input{
    padding:12px 16px;border:1px solid #d4c5a0;border-radius:4px;
    font-family:inherit;font-size:16px;text-align:center;
    background:#fefcf7;color:#3a3a3a;outline:none;
    transition:border-color .3s;
}
.lock-input:focus{border-color:#c9931e}
.lock-btn{
    padding:12px 16px;background:#8b6914;color:#fff;border:none;border-radius:4px;
    font-family:inherit;font-size:15px;cursor:pointer;letter-spacing:2px;
    transition:background .3s;
}
.lock-btn:hover{background:#a07d1a}

/* ===================================================================
   信件列表页
   =================================================================== */
.list-header{text-align:center;padding:40px 20px 32px}
.list-title{
    font-size:32px;color:#5a4612;font-weight:normal;letter-spacing:6px;
    margin-bottom:8px;
}
.list-desc{font-size:14px;color:#999}

.list-grid{
    max-width:900px;margin:0 auto;padding:0 20px 40px;
    display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
    gap:24px;
}

/* 信封卡片 */
.letter-card{
    position:relative;display:block;
    background:#fffdf8;border:1px solid #e0d5b8;border-radius:2px;
    padding:24px 22px;min-height:160px;
    box-shadow:0 2px 12px rgba(139,105,20,.06);
    transition:transform .3s,box-shadow .3s;
    overflow:hidden;
}
.letter-card:hover{
    transform:translateY(-4px);
    box-shadow:0 8px 24px rgba(139,105,20,.15);
}
/* 信封翻盖 */
.card-flap{
    position:absolute;top:0;left:0;right:0;height:0;
    border-style:solid;border-width:0 130px 50px 130px;
    border-color:transparent transparent #e8dcc4 transparent;
    transition:border-width .3s,opacity .3s;
    opacity:.3;
}
.letter-card:hover .card-flap{opacity:.6}

.card-inner{position:relative;z-index:1}
.card-date{
    display:inline-block;font-size:12px;color:#b08d3b;
    margin-bottom:8px;
}
.card-title{
    font-size:18px;color:#5a4612;font-weight:normal;
    margin-bottom:10px;line-height:1.5;
}
.card-excerpt{
    font-size:13px;color:#888;line-height:1.7;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;
    overflow:hidden;
}
.card-recipient{
    display:block;margin-top:12px;font-size:12px;color:#b08d3b;
    border-top:1px dashed #e0d5b8;padding-top:8px;
}

.list-empty{
    text-align:center;padding:80px 20px;color:#aaa;font-size:15px;
}

/* 分页 */
.list-pagination{
    text-align:center;padding:20px 0 48px;
}
.page-link{
    display:inline-block;width:36px;height:36px;line-height:36px;
    margin:0 4px;border:1px solid #d4c5a0;border-radius:4px;
    font-size:14px;color:#8b6914;
}
.page-link:hover{background:#fdf6e3}
.page-link.active{background:#8b6914;color:#fff;border-color:#8b6914}

/* ===================================================================
   信件详情页 — 信纸
   =================================================================== */
.letter-detail{
    max-width:800px;margin:0 auto;padding:20px 16px 60px;
}

.letter-paper{
    background:#fffef9;border-radius:2px;
    padding:48px 48px 40px;min-height:500px;
    box-shadow:0 4px 30px rgba(139,105,20,.08);
    position:relative;
}

/* 信纸样式1：横线 */
.paper-style-1{
    background:
        linear-gradient(to bottom,transparent 0,transparent 38px,#e8dcc4 38px,#e8dcc4 39px,transparent 39px);
    background-size:100% 39px;
    background-color:#fffef9;
}
/* 信纸样式2：方格 */
.paper-style-2{
    background:
        linear-gradient(to right,transparent 0,transparent 39px,#f0e8d0 39px,#f0e8d0 40px,transparent 40px),
        linear-gradient(to bottom,transparent 0,transparent 39px,#f0e8d0 39px,#f0e8d0 40px,transparent 40px);
    background-size:40px 40px;
    background-color:#fffef9;
}
/* 信纸样式3：空白带边框 */
.paper-style-3{
    border:2px solid #e0d5b8;
    background:#fffef9;
}

/* 信头 */
.letter-head{text-align:center;margin-bottom:32px;padding-bottom:20px}
.letter-recipient{
    font-size:16px;color:#8b6914;margin-bottom:12px;
}
.letter-title{
    font-size:24px;color:#5a4612;font-weight:normal;
    letter-spacing:2px;margin-bottom:8px;
}
.letter-date{
    font-size:14px;color:#999;
}

/* 信件正文 */
.letter-body{
    font-size:16px;line-height:2.1;color:#4a4a4a;
    letter-spacing:.5px;
    text-indent:2em;
    word-break:break-word;
}
.letter-body p{margin-bottom:1em;text-indent:2em}
.letter-body p:first-child{text-indent:0}

/* 信尾签名 */
.letter-foot{
    margin-top:40px;text-align:right;padding-top:20px;
}
.letter-sign{
    font-size:15px;color:#8b6914;
}

/* 返回按钮 */
.letter-nav{text-align:center;margin-top:32px}
.btn-back{
    display:inline-block;padding:10px 28px;
    border:1px solid #d4c5a0;border-radius:4px;
    font-size:14px;color:#8b6914;transition:all .3s;
}
.btn-back:hover{background:#8b6914;color:#fff;border-color:#8b6914}

/* ===================================================================
   响应式
   =================================================================== */
@media(max-width:640px){
    .letters-nav{padding:12px 16px;gap:16px}

    .lock-card{padding:36px 24px}
    .lock-title{font-size:24px}

    .list-title{font-size:26px}
    .list-grid{grid-template-columns:1fr;gap:16px;padding:0 16px 32px}

    .letter-paper{padding:32px 24px 28px}
    .letter-title{font-size:20px}
    .letter-body{font-size:15px;line-height:2}

    /* 移动端横线间距缩小 */
    .paper-style-1{
        background:linear-gradient(to bottom,transparent 0,transparent 34px,#e8dcc4 34px,#e8dcc4 35px,transparent 35px);
        background-size:100% 35px;
        background-color:#fffef9;
    }
    .paper-style-2{
        background-size:32px 32px;
        background:
            linear-gradient(to right,transparent 0,transparent 31px,#f0e8d0 31px,#f0e8d0 32px,transparent 32px),
            linear-gradient(to bottom,transparent 0,transparent 31px,#f0e8d0 31px,#f0e8d0 32px,transparent 32px);
        background-size:32px 32px;
        background-color:#fffef9;
    }
}