﻿/* Content wrapper */
.board_view .view_cont {
    padding: 8px 16px 20px;
    background: var(--bg);
}

.board_view .bo_v_con_news {
    background: var(--bg);
    color: var(--text);
    max-width: 90%; /* độ rộng đọc tốt */
    margin: 0 auto;
    padding: 16px 8px;
    line-height: 1.7;
    font-size: 1rem;
    word-wrap: break-word;
}

    /* Typography */
    .board_view .bo_v_con_news :where(h1,h2,h3,h4,h5,h6) {
        color: var(--text);
        line-height: 1.25;
        margin: 1.2em 0 0.5em;
        font-weight: 700;
    }

    .board_view .bo_v_con_news :where(h1) {
        font-size: 1.75rem;
        border-bottom: 2px solid var(--border);
        padding-bottom: .4rem;
    }

    .board_view .bo_v_con_news :where(h2) {
        font-size: 1.5rem;
    }

    .board_view .bo_v_con_news :where(h3) {
        font-size: 1.25rem;
    }

    .board_view .bo_v_con_news :where(p) {
        margin: 0.05em 0;
    }

    .board_view .bo_v_con_news :where(a) {
        color: var(--accent);
        text-decoration: none;
        border-bottom: 1px dotted var(--accent);
    }

    .board_view .bo_v_con_news :where(a:hover) {
        text-decoration: underline;
    }

    /* Lists */
    .board_view .bo_v_con_news :where(ul,ol) {
        margin: 0.8em 0 0.8em 1.4em;
        padding: 0;
    }

    .board_view .bo_v_con_news :where(li) {
        margin: .35em 0;
    }

    /* Images & media */
    .board_view .bo_v_con_news :where(img,video) {
        display: block;
        max-width: 100% !important;
        height: auto !important;
        border-radius: 8px;
        margin: 1em auto;
        box-shadow: 0 2px 10px rgba(0,0,0,0.08);
        aspect-ratio: 16/10;
        
    }

    /* Tables */
    .board_view .bo_v_con_news :where(table) {
        width: 100%;
        border-collapse: collapse;
        margin: 1em 0;
        font-size: 0.95rem;
    }

    .board_view .bo_v_con_news :where(th,td) {
        border: 1px solid var(--border);
        padding: 10px 12px;
        vertical-align: top;
    }

    .board_view .bo_v_con_news :where(th) {
        background: var(--card-bg);
        font-weight: 600;
    }

    /* Blockquote */
    .board_view .bo_v_con_news :where(blockquote) {
        margin: 1em 0;
        padding: 0.8em 1em;
        border-left: 4px solid var(--accent);
        background: var(--card-bg);
        color: var(--text);
        border-radius: 6px;
    }

    /* Code & preformatted */
    .board_view .bo_v_con_news :where(code) {
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
        background: rgba(37,99,235,0.08);
        color: var(--text);
        padding: 0.1em 0.35em;
        border-radius: 4px;
    }

    .board_view .bo_v_con_news :where(pre) {
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
        background: var(--code-bg);
        color: var(--code-fg);
        border-radius: 8px;
        padding: 14px 16px;
        overflow: auto;
        margin: 1em 0;
    }

    /* Horizontal rule */
    .board_view .bo_v_con_news :where(hr) {
        border: none;
        height: 1px;
        background: var(--border);
        margin: 1.5em 0;
    }

    /* Small helpers */
    .board_view .bo_v_con_news :where(.text-center) {
        text-align: center;
    }

    .board_view .bo_v_con_news :where(.text-right) {
        text-align: right;
    }

    .board_view .bo_v_con_news :where(.muted) {
        color: var(--muted);
    }

/* ==== Responsive tweaks ==== */
@media (max-width: 640px) {
    .board_view {
        border-radius: 10px;
    }

        .board_view .subject {
            font-size: 1.125rem;
            padding: 14px 16px;
        }

        .board_view .view_info {
            padding: 10px 16px;
            gap: 8px 16px;
        }

        .board_view .bo_v_con_news {
            padding: 12px 4px;
            max-width: 100%;
        }

            .board_view .bo_v_con_news :where(h1) {
                font-size: 1.4rem;
            }

            .board_view .bo_v_con_news :where(h2) {
                font-size: 1.25rem;
            }

            .board_view .bo_v_con_news :where(h3) {
                font-size: 1.125rem;
            }
}
