:root {
    /* 背景颜色 */
    --b0: #fff;
    /* 边框颜色*/
    --b1: #eee;
    /* 边框颜色*/
    --b2: #ddd;
    --b3: #999;

    /* 最重 */
    --c0: #444;
    /*主要文本*/
    --c1: #555;
    /* 最轻 */
    --c2: #AAA;

    --x0: #f9683a;

}

/*夜间模式颜色*/
@media (prefers-color-scheme: dark) {
    :root {
        /* 背景颜色 */
        --c0: #fff;
        /* 边框颜色*/
        --c1: #eee;
        /* 边框颜色*/
        --c2: #ddd;

        /* 最重 */
        --b0: #444;
        /*主要文本*/
        --b1: #555;
        /* 最轻 */
        --b2: #AAA;
        --b3: #999;

        --x0: #f9683a;

    }
}

body {
    background-color: var(--b0);
    scrollbar-gutter: stable;
    color: var(--c0);
    font-size: 14px;
}

div {
    box-sizing: border-box;
}

a {
    color: var(--c1);
    text-decoration: none;
}

a:hover, a:hover > h1, a:active {
    color: var(--x0);
}

.container {
    padding: 0 60px;
    max-width: 900px;
    margin: 0 auto;
}

.clearfix {
    clear: both;
}

#header {
    padding-top: 5vh;
}

/*导航栏部分*/
#header #nav-menu {
    display: flex;
    justify-content: flex-end;
    padding-right: 10px;
}

#header #nav-menu a {
    display: inline-block;
    padding: 0 3px 0 20px;
    border-right: 3px solid var(--b2);
    color: var(--c1);
    font-size: 13px;
    transform: translateY(1px);
}

#header #nav-menu a:hover {
    border-right: 3px solid var(--b3);
    font-weight: bold;
}

#header #nav-menu a.current {
    color: var(--x0);
}

#footer {
    padding: 1.8em 0 3.6em;
    line-height: 1.5;
    color: var(--c2);
    text-align: center;
}

/*文章部分*/
.main {
    padding: 15px;
}

/* 文章页面顶部 Home 链接 */
.home-link {
    margin-top: 15px;
    display: flex;
    align-items: center;
}

.home-link > div {
    flex-grow: 1;
    height: 1px;
    background-color: var(--b1);
}

.home-link > a {
    color: var(--c2);
    padding: 0 10px;
}

.home-link > a:hover {
    color: var(--x0);
}

.post {
    padding: 25px 0 15px;
    border-bottom: 1px solid var(--b1);
}

.post .post-title {
    margin: 0;
    color: var(--c0);
    text-align: left;
    font: bold 25px/1.1 "ff-tisa-web-pro", Cambria, "Times New Roman", Georgia, Times, sans-serif;
}

.post .post-title a {
    color: #555;
}

a:hover .post-title {
    color: var(--x0);
}

.post .post-meta {
    padding: 0;
    margin: 15px 0 0;
    color: var(--c2);
    float: left;
    display: inline;
    text-indent: .15em;
}

.post .post-content {
    clear: left;
    font-size: 15px;
    line-height: 1.77;
    color: var(--c1);
    padding-top: 15px;
}

.post .post-content p > img {
    border-radius: 5px;
    margin: 10px 0;
    max-width: 100%;
}

.page-navigator {
    padding: 25px 0 0;
    height: 30px;
    font-size: 16px;
    flex: 0 0 auto;
}

.page-navigator > a {
    padding: 5px 9px;
    margin-right: 10px;
}

.page-navigator .prev {
}

.page-navigator .next {
}


ul.archives > li {
    padding: 5px;
}

.tags {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    color: var(--c1);
}

.tags > a {
    display: block;
    border: solid 1px var(--c1);
    border-radius: 5px;
    padding: 5px;

}

.tags > a:hover {
    border-color: var(--x0);
}

@media screen and (max-width: 950px) {
    .container {
        padding: 0;
    }

    #header #nav-menu a {
        padding: 2px 10px;
    }

    #sidebar {
        display: none;
    }

    .main {
        padding: 10px;
    }

}

@media (prefers-color-scheme: dark) {

    /**
    夜间模式效果修复
     */
    .markdown-body pre {
        background-color: var(--b1);
    }

    .markdown-body blockquote {
        background-color: var(--b1);
    }

    .markdown-body blockquote p {
        color: var(--c2);
    }
}