/*
Theme Name: Pure Shell (CoolShell Clone)
Author: Sol Li
Description: 酷壳风格极简主题复刻，整合移动端终极响应式优化。
Version: 1.4
*/

/* 1. 基础重置 */
body, html { background: #eceff1; color: #424242; font-size: 16px; line-height: 1.8; font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft Yahei", sans-serif !important; }
a { color: #607D8B; text-decoration: none; transition: 0.2s; }
a:hover { color: #009688; }
blockquote { border-left: 5px solid #009688; background: #f4f8f7; padding: 15px 20px; margin: 30px 0; font-style: normal; }

/* 2. 导航栏特效：找回选中状态 */
.navbar-default { background-color: #ffffff !important; box-shadow: 0px 1px 3px rgba(0,0,0,0.1) !important; border: none; }
.navbar-default .navbar-nav > li > a { color: #444 !important; font-weight: 500 !important; }
.navbar-default .navbar-nav > li > a:hover { color: #009688 !important; }
.navbar-default .navbar-nav > .current-menu-item > a,
.navbar-default .navbar-nav > .current_page_item > a { color: #009688 !important; border-top: 4px solid #009688 !important; background: transparent !important; }

/* 3. Header 区域：极致居中 */
.site-header { background: #1d2b2d; padding: 60px 0; text-align: center; margin-bottom: 3em; }
.site-title { color: #fff; font-size: 3.5em; font-weight: 700; letter-spacing: 8px; margin: 0; }
.site-title::after { content: ""; display: block; width: 100px; height: 2px; background: #009688; margin: 15px auto; }
.site-description { color: #fff; font-size: 1.1em; opacity: 0.8; letter-spacing: 4px; }
.site-extra-info { color: rgba(255,255,255,0.5); font-size: 14px; margin-top: 10px; }

/* 4. 文章与留言容器 */
.post-content, .comments-area { background: #fff; padding: 40px; margin-bottom: 30px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.15); }
.read-more-container { display: block !important; text-align: center !important; margin: 40px 0 10px !important; clear: both; }
.btn-default { display: inline-block !important; background: transparent !important; border: 2px solid #009688 !important; color: #009688 !important; padding: 8px 30px !important; font-weight: bold !important; text-transform: uppercase; transition: 0.3s; }
.btn-default:hover { background: #009688 !important; color: #fff !important; }

/* 5. 侧边栏：彻底扁平化 */
#secondary .widget { background: transparent !important; box-shadow: none !important; border: none !important; padding: 0 !important; margin-bottom: 40px !important; }
#secondary .widget-title { font-size: 16px !important; color: #333 !important; border-bottom: 2px solid #009688 !important; padding-bottom: 8px !important; margin-bottom: 15px !important; font-weight: bold !important; }
#secondary .widget-title::after { display: none !important; }
#secondary .widget ul li { font-size: 14px; padding: 8px 0 !important; border-bottom: 1px dashed #ddd !important; }

/* 6. 页脚：强制锁定深色居中 */
.site-footer { background-color: #222 !important; color: #999 !important; padding: 40px 0 !important; margin-top: 50px !important; border-top: 4px solid #009688 !important; width: 100% !important; clear: both !important; display: block !important; }
.site-footer .site-info { text-align: center !important; font-size: 14px !important; }

/* ==========================================================================
   7. 移动端深度响应式适配 (彻底解决右侧空白与排版错乱)
   ========================================================================== */
@media (max-width: 767px) {
    /* 锁死横向滚动条，防止页面被撑破 */
    body, html { overflow-x: hidden !important; width: 100%; }
    
    /* 手机端 Header 瘦身 */
    .site-header { padding: 30px 15px; margin-bottom: 1.5em; }
    .site-title { font-size: 2.2em; letter-spacing: 2px; }
    .site-title::after { width: 60px; }
    .site-description { font-size: 14px; letter-spacing: 1px; }
    
    /* 手机端内容区瘦身 */
    .post-content, .comments-area { padding: 20px 15px; }
    .entry-title { font-size: 22px; }
    
    /* 强行控制代码块和图片，禁止它们超出屏幕边缘 */
    pre, code { white-space: pre-wrap; word-wrap: break-word; overflow-x: auto; max-width: 100%; font-size: 14px; }
    img { max-width: 100%; height: auto; }

    /* 手机端导航按钮美化 */
    .navbar-default .navbar-toggle { border-color: #009688 !important; }
    .navbar-default .navbar-toggle .icon-bar { background-color: #009688 !important; }
    .navbar-default .navbar-nav > .current-menu-item > a,
    .navbar-default .navbar-nav > .current_page_item > a { border-top: none !important; border-left: 4px solid #009688 !important; }
}