/* ============================================================
   咔游子主题：留言板页面（page-guestbook.php）
   独立文件 + ?ver=1.0.0，避免 CDN 缓存旧样式。
   复用 zibll 原生评论系统，只做顶部 Hero + 卡片微调。
   ============================================================ */

/* —— 顶部 Hero 渐变 banner —— */
.page-guestbook .kauiu-gb-hero {
    background: linear-gradient(135deg, #0ea5e9 0%, #22d3ee 100%);
    border-radius: 0 0 18px 18px;
    padding: 46px 20px 38px;
    margin-bottom: 24px;
    text-align: center;
    color: #fff;
    box-shadow: 0 8px 30px rgba(14, 165, 233, .18);
}

.page-guestbook .kauiu-gb-hero-inner {
    max-width: 680px;
    margin: 0 auto;
}

.page-guestbook .kauiu-gb-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 0 0 10px;
    font-size: 30px;
    font-weight: 800;
    letter-spacing: .5px;
}

.page-guestbook .kauiu-gb-emoji {
    font-size: 34px;
    line-height: 1;
}

.page-guestbook .kauiu-gb-sub {
    margin: 0;
    font-size: 15px;
    line-height: 1.7;
    color: rgba(255, 255, 255, .92);
}

/* —— 评论区：更"留言板"的圆润浅色卡片感 —— */
.page-guestbook #comments {
    margin-top: 0;
}

.page-guestbook #comments .no_webshot.main-bg {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    box-shadow: 0 6px 20px rgba(15, 23, 42, .06);
}

/* 评论输入框聚焦时的高亮（呼应主题色） */
.page-guestbook #comments textarea.form-control:focus,
.page-guestbook #comments .line-form-input:focus {
    border-color: #0ea5e9;
    box-shadow: 0 0 0 3px rgba(14, 165, 233, .12);
}

/* 提交按钮 hover 微动 */
.page-guestbook #comments .but.c-blue {
    transition: background .15s, transform .1s;
}

.page-guestbook #comments .but.c-blue:hover {
    transform: translateY(-1px);
}

/* —— 单条留言卡片微调 —— */
.page-guestbook .commentlist .comment .comment-body {
    border-radius: 12px;
}

/* —— 留言板评论框：移除"代码"插入按钮（工具栏里那一项） —— */
.page-guestbook #commentform .comt-tips-left .code {
    display: none !important;
}

/* ============================================================
   暗夜模式适配（zibll body class = dark-theme）
   Hero 从刺眼亮蓝改为深沉的靛蓝紫渐变，
   评论区卡片从纯白改为与暗夜主题融合的深色调。
   ============================================================ */
.dark-theme .page-guestbook .kauiu-gb-hero {
    background: linear-gradient(135deg, #1e3a5f 0%, #4c1d95 40%, #6d28d9 100%);
    box-shadow: 0 8px 32px rgba(109, 40, 217, .25);
}

/* 页面正文引导语卡片 */
.dark-theme .page-guestbook .page-article.main-bg,
.dark-theme .page-guestbook .page-article.theme-box {
    background: #1e293b;
    border-color: #334155;
    color: #cbd5e1;
}

/* 评论区整体容器 */
.dark-theme .page-guestbook #comments .main-bg,
.dark-theme .page-guestbook #comments .theme-box.box-body {
    background: #1e293b !important;
    border-color: #334155;
}

/* 评论输入框区域 */
.dark-theme .page-guestbook #commentform textarea.form-control {
    background: #0f172a;
    color: #e2e8f0;
    border-color: #334155;
}
.dark-theme .page-guestbook #commentform textarea.form-control::placeholder {
    color: #64748b;
}

/* 昵称/邮箱输入框 */
.dark-theme .page-guestbook #commentform .line-form-input {
    background: #0f172a;
    color: #e2e8f0;
    border-color: #334155;
}
.dark-theme .page-guestbook #commentform .scale-placeholder {
    color: #64748b;
}

/* 单条留言卡片 */
.dark-theme .page-guestbook .commentlist .comment .comment-body {
    background: #1e293b;
    border-color: #334155;
}
.dark-theme .page-guestbook .commentlist .comment .comment-body .comment-content {
    color: #cbd5e1;
}

/* "暂无评论"空状态 */
.dark-theme .page-guestbook .comment-null p {
    color: #94a3b8;
}

/* 评论标题栏（"评论 | 沙发"） */
.dark-theme .page-guestbook #comments .comt-title {
    color: #e2e8f0;
}

/* 暗夜下聚焦高亮改用紫色系呼应 Hero */
.dark-theme .page-guestbook #comments textarea.form-control:focus,
.dark-theme .page-guestbook #comments .line-form-input:focus {
    border-color: #8b5cf6;
    box-shadow: 0 0 0 3px rgba(139, 92, 246, .15);
}

/* —— 移动端：Hero 收窄 —— */
@media (max-width: 768px) {
    .page-guestbook .kauiu-gb-hero {
        padding: 34px 16px 28px;
        border-radius: 0 0 14px 14px;
    }

    .page-guestbook .kauiu-gb-title {
        font-size: 24px;
    }

    .page-guestbook .kauiu-gb-emoji {
        font-size: 28px;
    }

    .page-guestbook .kauiu-gb-sub {
        font-size: 13px;
    }
}