@charset "UTF-8";
/*!
 * Bootstrap v4.0.0-beta.3 (https://getbootstrap.com)
 * Copyright 2011-2017 The Bootstrap Authors
 * Copyright 2011-2017 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */
/****************************************   bbs 业务部分  ****************************************/
html,table{font-size:14px;}
body{background:#dee2e6;}
html,body{height:100%;display:flex;flex-direction:column;font-family:"Helvetica Neue",Helvetica,"Microsoft Yahei","Hiragino Sans GB","WenQuanYi Micro Hei","微软雅黑","华文细黑",STHeiti,sans-serif;}
/* 页脚固定在底部 */
#header,#body,#footer{width:100%;}
#header{flex:0 0 auto;}
#body{flex:1 0 auto;}
#footer{flex:0 0 auto;}
#body > .container > .row > .aside{padding-left:0;}
.table th{border-top:none;}
.table > tbody > tr:first-child > td{border-top:none;}
/*
.borde{border:1px solid rgba($black,0.125);border-radius:0.25rem;}
.shadow{box-shadow:2px 2px 3px rgba($gray-600,.25);}
*/
.card{margin-bottom:1rem;background:#f8f9fa;box-shadow:2px 2px 3px rgba(173,181,189,0.25);}
.card > .card-header{color:#454d55;font-size:14px;border-bottom:1px solid #dee2e6;background-image:linear-gradient(0deg,#e9ecef,#f8f9fa);}
.card > .card-block > table > tbody > tr:last-child > td{border-bottom:0px;}
.card-header-tabs > .nav-item > .nav-link:hover:not(.active){border:1px solid #dee2e6;}
.card-header-tabs > .nav-item > .nav-link.active{background-image:linear-gradient(0deg,#f8f9fa,#fff);border-color:#dee2e6;border-bottom-color:#f8f9fa;}
.breadcrumb{background-color:rgba(248,249,250,0.8) !important;border:1px solid #dee2e6;box-shadow:1px 1px 2px rgba(233,236,239,0.25);}
.breadcrumb:hover{background-color:#fff !important;}
.breadcrumb .breadcrumb-item{display:inline-flex;text-overflow:ellipsis;white-space:nowrap;}
.breadcrumb .breadcrumb-item a{max-width:400px;overflow:hidden;text-overflow:ellipsis;}
.card-header-dropdown .dropdown .dropdown-toggle{text-decoration:none;color:#495057;}
.card-header-dropdown .dropdown-menu{min-width:8rem;padding:0.25rem 0;}
.card-header-dropdown .dropdown-menu .dropdown-item{text-decoration:none;padding:0.25rem 0.5rem;}
.card-header-dropdown .dropdown-menu .dropdown-item i{width:12px;}
/* 小屏: only small screen */
@media (max-width:576px){
#body{padding-top:0.5rem;}
#body > .container > .row > div{padding:0.5rem;}
}
/* 小屏 + 中屏: small + middle */
@media (max-width:992px){
#nav{padding-top:1.5rem;padding-left:0.5rem;}
#nav > ul:first-child > li:not(:first-child){padding-left:3rem;}
#nav > ul > li > a.nav-link{border-bottom:1px solid rgba(134,142,150,0.3);}
}
/* 中屏 + 大屏: middle + big */
@media (min-width:576px){
#body{padding-top:1rem;}
}
.addattach:hover{font-weight:800;}
/*@teax 弥补bootstrap beta3的不足，分页如果过多则换行，防止超出屏幕*/
.pagination{flex-wrap:wrap;}
table.nav_tag_list{margin-bottom:0.2rem;}
table.nav_tag_list td{padding:0.1rem;}
table.nav_tag_list td a{margin-right:0.5rem;}
.nav_tag_list .active{font-weight:800;}
@keyframes quote_animation{
from{background-color:#177f2e;}
to{background-color:#f8f9fa;}
}
li.quote{background-color:#e9ecef;animation:quote_animation 1s;-moz-animation:quote_animation 1s;-webkit-animation:quote_animation 1s;-o-animation:quote_animation 1s;background-image:url(../img/quote.png);background-repeat:no-repeat;background-position:top right;}
.blockquote{font-size:0.8rem;background-color:#e9ecef;background-image:url(../img/quote.png);background-repeat:no-repeat;background-position:top right;padding:0.5rem 1rem !important;}
.blockquote .user{margin-right:0.5rem;}
.thread,.post{border-bottom:1px solid #e9ecef;padding:0.7rem 0px;}
.thread:hover{background-color:white;}
.threadlist > .thread:last-child,.postlist > .post:last-child{border-bottom:0px;}
.postlist .media-body{width:1%;}
.message p{margin:0.2rem 0;line-height:1.7;}
.message img{max-width:100%;height:auto !important;border:1px solid #dee2e6;margin-bottom:0.5rem;}
.thread .badge{font-weight:normal;}
.subject{font-size:1.04rem;}
.message{font-size:1.1rem;}
/* 回帖输入框 */
#message{height:2.4rem;transition:height 0.2s;}
/* 导航 */
.navbar h5{font-size:1rem;color:rgba(255,255,255,0.3);margin-top:1.75rem;font-weight:800;}
.navbar nav{padding-bottom:1rem;}
.navbar nav:not(:last-child){border-bottom:1px solid rgba(255,255,255,0.1);}
#mobile_nav .navbar-nav{flex-direction:row;}
#mobile_nav .navbar-nav .nav-link{margin-right:1rem;}
#nav_pc_2{background:#868e96;}
#nav_pc_2 a{color:#e9ecef;}
#nav_pc_2 .active a{color:#fff;font-weight:800;}
@charset "UTF-8";
/*!
 * Bootstrap v4.0.0-beta.3 (https://getbootstrap.com)
 * Copyright 2011-2017 The Bootstrap Authors
 * Copyright 2011-2017 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */

/**************************************** Modern BBS Design ****************************************/

/* Base Typography & Layout */
html, table {
    font-size: 15px;
    font-weight: 400;
}

body {
    background: #fafafa;
    color: #333;
    line-height: 1.6;
}

html, body {
    height: 100%;
    display: flex;
    flex-direction: column;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
}

/* Layout Structure */
#header, #body, #footer {
    width: 100%;
}

#header {
    flex: 0 0 auto;
    background: #fff !important;
    border-bottom: 1px solid #e5e5e5;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

#body {
    flex: 1 0 auto;
    padding: 2rem 0;
}

#footer {
    flex: 0 0 auto;
    background: #f8f9fa !important;
    border-top: 1px solid #e5e5e5;
}

#body > .container > .row > .aside {
    padding-left: 0;
}

/* Card Components */
.card {
    margin-bottom: 1.5rem;
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    transition: box-shadow 0.2s ease;
}

.card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.card > .card-header {
    color: #444;
    font-size: 14px;
    font-weight: 600;
    border-bottom: 1px solid #f0f0f0;
    background: #fff;
    padding: 1rem 1.25rem;
    border-radius: 8px 8px 0 0;
}

.card > .card-body {
    padding: 1.25rem;
}

.card > .card-block > table > tbody > tr:last-child > td {
    border-bottom: 0;
}

/* Navigation Tabs */
.card-header-tabs > .nav-item > .nav-link {
    color: #666;
    border: none;
    padding: 0.5rem 1rem;
    border-radius: 4px;
    transition: all 0.2s ease;
    font-weight: 500;
}

.card-header-tabs > .nav-item > .nav-link:hover:not(.active) {
    background: #f5f5f5;
    color: #333;
}

.card-header-tabs > .nav-item > .nav-link.active {
    background: #333;
    color: #fff;
    border: none;
}

/* Breadcrumb */
.breadcrumb {
    background-color: transparent !important;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
    box-shadow: none;
    padding: 0.75rem 1rem;
    margin-bottom: 1.5rem;
}

.breadcrumb:hover {
    background-color: #fff !important;
    border-color: #ddd;
}

.breadcrumb .breadcrumb-item {
    display: inline-flex;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #666;
}

.breadcrumb .breadcrumb-item a {
    max-width: 400px;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #333;
    text-decoration: none;
}

.breadcrumb .breadcrumb-item a:hover {
    color: #000;
}

.breadcrumb .breadcrumb-item.active {
    color: #999;
}

/* Dropdown Menu */
.card-header-dropdown .dropdown .dropdown-toggle {
    text-decoration: none;
    color: #666;
    font-weight: 500;
}

.card-header-dropdown .dropdown-menu {
    min-width: 8rem;
    padding: 0.5rem 0;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.card-header-dropdown .dropdown-menu .dropdown-item {
    text-decoration: none;
    padding: 0.5rem 1rem;
    color: #666;
    transition: all 0.2s ease;
}

.card-header-dropdown .dropdown-menu .dropdown-item:hover {
    background: #f5f5f5;
    color: #333;
}

.card-header-dropdown .dropdown-menu .dropdown-item i {
    width: 12px;
    margin-right: 0.5rem;
}

/* Table Styling */
.table th {
    border-top: none;
    font-weight: 600;
    color: #444;
    background: #f8f9fa;
}

.table > tbody > tr:first-child > td {
    border-top: none;
}

.table td {
    border-color: #f0f0f0;
}

/* Responsive Design */
@media (max-width: 576px) {
    #body {
        padding-top: 1rem;
    }
    #body > .container > .row > div {
        padding: 0.5rem;
    }
}

@media (max-width: 992px) {
    #nav {
        padding-top: 1.5rem;
        padding-left: 0.5rem;
    }
    #nav > ul:first-child > li:not(:first-child) {
        padding-left: 3rem;
    }
    #nav > ul > li > a.nav-link {
        border-bottom: 1px solid rgba(0,0,0,0.1);
    }
}

@media (min-width: 576px) {
    #body {
        padding-top: 2rem;
    }
}

/* Thread & Post Styling */
.thread, .post {
    border-bottom: 1px solid #f0f0f0;
    padding: 1rem 0;
    transition: background-color 0.2s ease;
}

.thread:hover {
    background-color: #fafafa;
}

.thread:last-child, .post:last-child {
    border-bottom: 0;
}

.threadlist > .thread:last-child, 
.postlist > .post:last-child {
    border-bottom: 0;
}

.postlist .media-body {
    width: 1%;
}

/* Message Content */
.message p {
    margin: 0.5rem 0;
    line-height: 1.7;
    color: #444;
}

.message img {
    max-width: 100%;
    height: auto !important;
    border: 1px solid #e8e8e8;
    border-radius: 4px;
    margin-bottom: 0.5rem;
}

/* Badges & Labels */
.thread .badge {
    font-weight: 500;
    background: #f5f5f5;
    color: #666;
    border-radius: 4px;
}

.subject {
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
    line-height: 1.4;
}

.subject a {
    color: #333;
    text-decoration: none;
}

.subject a:hover {
    color: #000;
}

.message {
    font-size: 1rem;
    line-height: 1.7;
    color: #444;
}

/* Form Elements */
#message {
    height: 2.8rem;
    transition: height 0.3s ease;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
    font-size: 15px;
}

#message:focus {
    border-color: #333;
    box-shadow: 0 0 0 2px rgba(0,0,0,0.1);
}

/* Navigation Header */
.navbar {
    background: #fff !important;
    border-bottom: 1px solid #e5e5e5;
}

.navbar-brand {
    color: #333 !important;
    font-weight: 600;
}

.navbar-nav .nav-link {
    color: #666 !important;
    font-weight: 500;
    transition: color 0.2s ease;
}

.navbar-nav .nav-link:hover {
    color: #333 !important;
}

.navbar-nav .nav-item.active .nav-link {
    color: #000 !important;
    font-weight: 600;
}

.navbar h5 {
    font-size: 1rem;
    color: #999;
    margin-top: 1.75rem;
    font-weight: 600;
}

.navbar nav {
    padding-bottom: 1rem;
}

.navbar nav:not(:last-child) {
    border-bottom: 1px solid #f0f0f0;
}

/* Mobile Navigation */
#mobile_nav .navbar-nav {
    flex-direction: row;
}

#mobile_nav .navbar-nav .nav-link {
    margin-right: 1rem;
}

#nav_pc_2 {
    background: #f8f9fa;
    border-bottom: 1px solid #e5e5e5;
}

#nav_pc_2 a {
    color: #666;
}

#nav_pc_2 .active a {
    color: #333;
    font-weight: 600;
}

/* Buttons */
.btn {
    border-radius: 6px;
    font-weight: 500;
    transition: all 0.2s ease;
}

.btn-primary {
    background: #333;
    border-color: #333;
}

.btn-primary:hover {
    background: #000;
    border-color: #000;
}

.btn-secondary {
    background: #f8f9fa;
    border-color: #e8e8e8;
    color: #666;
}

.btn-secondary:hover {
    background: #e8e8e8;
    border-color: #ddd;
    color: #333;
}

/* Utility Classes */
.addattach:hover {
    font-weight: 600;
}

.pagination {
    flex-wrap: wrap;
}

.pagination .page-link {
    border: 1px solid #e8e8e8;
    color: #666;
    border-radius: 4px;
    margin: 0 2px;
}

.pagination .page-link:hover {
    background: #f5f5f5;
    border-color: #ddd;
    color: #333;
}

.pagination .page-item.active .page-link {
    background: #333;
    border-color: #333;
}

/* Tag Navigation */
table.nav_tag_list {
    margin-bottom: 0.5rem;
}

table.nav_tag_list td {
    padding: 0.25rem;
}

table.nav_tag_list td a {
    margin-right: 0.5rem;
    color: #666;
    text-decoration: none;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    transition: all 0.2s ease;
}

table.nav_tag_list td a:hover {
    background: #f5f5f5;
    color: #333;
}

.nav_tag_list .active {
    font-weight: 600;
    background: #333 !important;
    color: #fff !important;
}

/* Quote Animation */
@keyframes quote_animation {
    from { background-color: #e8f5e8; }
    to { background-color: #fafafa; }
}

li.quote {
    background-color: #f5f5f5;
    animation: quote_animation 1s ease;
    background-image: url(../img/quote.png);
    background-repeat: no-repeat;
    background-position: top right;
    border-left: 3px solid #ddd;
    padding-left: 1rem;
}

.blockquote {
    font-size: 0.9rem;
    background-color: #f8f9fa;
    background-image: url(../img/quote.png);
    background-repeat: no-repeat;
    background-position: top right;
    padding: 1rem !important;
    border-left: 3px solid #ddd;
    border-radius: 0 6px 6px 0;
}

.blockquote .user {
    margin-right: 0.5rem;
    font-weight: 600;
    color: #333;
}

/* Text Utilities */
.text-grey, .text-gray {
    color: #999 !important;
}

.text-muted {
    color: #666 !important;
}

/* Avatar & User Elements */
.username a {
    font-weight: 500;
    color: #333 !important;
    text-decoration: none;
}

.username a:hover {
    color: #000 !important;
}

/* Footer */
#footer {
    color: #666;
}

#footer a {
    color: #333;
    text-decoration: none;
}

#footer a:hover {
    color: #000;
}

/* Focus States */
*:focus {
    outline: 2px solid rgba(0,0,0,0.1);
    outline-offset: 2px;
}

/* Smooth Transitions */
* {
    transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

/* Text Logo Styling */
.text-logo {
    text-decoration: none !important;
    display: inline-block;
    transition: all 0.3s ease;
    margin-right: 2rem;
}

.text-logo:hover {
    text-decoration: none !important;
    transform: translateY(-1px);
}

.text-logo h1 {
    font-size: 1.5rem;
    font-weight: 700;
    color: #222;
    margin: 0;
    letter-spacing: -0.02em;
    line-height: 1.2;
    text-transform: none;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
    transition: all 0.3s ease;
}

.text-logo:hover h1 {
    color: #000;
}

/* Responsive text logo */
@media (max-width: 768px) {
    .text-logo h1 {
        font-size: 1.25rem;
    }
}

@media (max-width: 576px) {
    .text-logo {
        margin-right: 1rem;
    }
    .text-logo h1 {
        font-size: 1.1rem;
    }
}