﻿.newsitem {
}
    /* 新闻头部信息 */
    .newsitem .news-detail-header {
        padding-top: 20px;
        margin-bottom: 30px;
        padding-bottom: 20px;
        border-bottom: 1px solid #e0e0e0;
    }

    .newsitem .news-detail-title {
        color: #0a2463;
        font-size: 32px;
        line-height: 1.3;
        margin-bottom: 20px;
    }

    .newsitem .news-detail-meta {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        margin-bottom: 20px;
    }

    .newsitem .news-detail-category {
        background-color: rgba(10, 36, 99, 0.1);
        color: #0a2463;
        padding: 5px 15px;
        border-radius: 4px;
        font-size: 14px;
        font-weight: 600;
        margin-right: 20px;
    }

    .newsitem .news-detail-date, .newsitem .news-detail-views, .newsitem .news-detail-author {
        color: #6c757d;
        font-size: 15px;
        margin-right: 20px;
        display: flex;
        align-items: center;
    }

        .newsitem .news-detail-date i, .newsitem .news-detail-views i, .newsitem .news-detail-author i {
            margin-right: 5px;
        }

    /* 新闻内容 */
    .newsitem .news-detail-content {
        font-size: 16px;
        line-height: 1.8;
    }

        .newsitem .news-detail-content h2, .newsitem .news-detail-content h3 {
            color: #0a2463;
            margin: 30px 0 15px;
            font-size: 24px;
        }

        .newsitem .news-detail-content p {
            margin-bottom: 20px;
            text-indent:2em;
        }

        .newsitem .news-detail-content ul, .newsitem .news-detail-content ol {
            margin: 20px 0 20px 30px;
        }

        .newsitem .news-detail-content li {
            margin-bottom: 10px;
        }


        .newsitem .news-detail-content img {
            display: block;
            width: 100%;
            height: auto;
            border-radius: 4px;
            margin: 20px 0;
        }


    /* 新闻标签 */
    .newsitem .news-detail-tags {
        display: flex;
        flex-wrap: wrap;
        margin: 40px 0 30px;
        padding-top: 20px;
        border-top: 1px solid #e0e0e0;
    }

    .newsitem .news-detail-tags-title {
        color: #0a2463;
        font-weight: 600;
        margin-right: 15px;
        line-height: 2;
    }

    .newsitem .news-tag {
        background-color: rgba(10, 36, 99, 0.1);
        color: #0a2463;
        padding: 5px 15px;
        border-radius: 4px;
        font-size: 14px;
        margin-right: 10px;
        margin-bottom: 10px;
        transition: all 0.3s;
    }

        .newsitem .news-tag:hover {
            background-color: #0a2463;
            color: white;
        }
    /* 导航按钮 */
    .newsitem .news-navigation {
        display: flex;
        justify-content: space-between;
        margin-top: 40px;
        padding-top: 20px;
        border-top: 1px solid #e0e0e0;
    }

    .newsitem .news-nav-btn {
        display: flex;
        align-items: center;
        color: #0a2463;
        font-weight: 600;
        transition: all 0.3s;
    }

        .newsitem .news-nav-btn:hover {
            color: #f97316;
        }

        .newsitem .news-nav-btn.prev i {
            margin-right: 10px;
        }

        .newsitem .news-nav-btn.next i {
            margin-left: 10px;
        }

        .newsitem .news-nav-btn.disabled {
            color: #6c757d;
            cursor: not-allowed;
        }

            .newsitem .news-nav-btn.disabled:hover {
                color: #6c757d;
            }

    /* 相关新闻 */
    .newsitem .related-news {
        margin-top: 60px;
    }

    .newsitem .related-news-header {
        margin-bottom: 30px;
        padding-bottom: 15px;
        border-bottom: 2px solid #0a2463;
        position: relative;
    }

        .newsitem .related-news-header h3 {
            color: #0a2463;
            font-size: 28px;
        }

            .newsitem .related-news-header h3:after {
                content: '';
                position: absolute;
                width: 60px;
                height: 2px;
                background-color: #f97316;
                bottom: -2px;
                left: 0;
            }

    .newsitem .related-news-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 30px;
    }

    .newsitem .related-news-item {
        background-color: white;
        border-radius: 8px;
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
        overflow: hidden;
        transition: transform 0.3s;
    }

        .newsitem .related-news-item:hover {
            transform: translateY(-5px);
        }

    .newsitem .related-news-image {
        height: 200px;
        overflow: hidden;
    }

        .newsitem .related-news-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.5s;
        }

    .newsitem .related-news-item:hover .related-news-image img {
        transform: scale(1.05);
    }

    .newsitem .related-news-content {
        padding: 20px;
    }

    .newsitem .related-news-title {
        color: #0a2463;
        font-size: 17px;
        margin-bottom: 10px;
        transition: color 0.3s;
    }

    .newsitem .related-news-item:hover .related-news-title {
        color: #f97316;
    }

    .newsitem .related-news-date {
        color: #6c757d;
        font-size: 14px;
    }
    /* 返回列表按钮 */
    .newsitem .back-to-list {
        text-align: center;
        margin-top: 40px;
    }

    .newsitem .btn {
        display: inline-block;
        background-color: #6c757d;
        color: white;
        padding: 12px 30px;
        border-radius: 4px;
        text-decoration: none;
        font-weight: 600;
        transition: all 0.3s;
        border: none;
        cursor: pointer;
    }

        .newsitem .btn:hover {
            background-color: #f97316;
            transform: translateY(-2px);
            box-shadow: 0 5px 15px rgba(249, 115, 22, 0.3);
        }

    .newsitem .btn-outline {
        background-color: transparent;
        border: 2px solid #f97316;
        color: #f97316;
    }

        .newsitem .btn-outline:hover {
            background-color: #f97316;
            color: white;
        }
