/*
 * Style nội dung bài viết (tin tức) và mô tả sản phẩm.
 * Dùng chung cho:
 *  - Trang chi tiết bài viết: resources/views/frontend/post.blade.php (#post-body)
 *  - Trang chi tiết sản phẩm: resources/views/frontend/detail.blade.php (#post-body)
 *  - Khung soạn thảo CKEditor ở admin (body#post-body, cấu hình trong public/vendor/ckeditor/config.js)
 * => Nội dung soạn trong editor hiển thị giống hệt ngoài trang bài viết.
 * Selector dùng id #post-body để thắng các rule chung của theme (ul li {list-style:none}, p {margin-bottom:0}, ...).
 */
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,400i,600,700,700i&subset=vietnamese);

#post-body {
    font-family: "Open Sans", sans-serif, "Times New Roman";
    font-size: 15px;
    line-height: 1.7;
    color: #333;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* Đoạn văn */
#post-body p {
    font-size: inherit;
    line-height: inherit;
    color: inherit;
    margin: 0 0 1em;
}

/* Tiêu đề */
#post-body h1,
#post-body h2,
#post-body h3,
#post-body h4,
#post-body h5,
#post-body h6 {
    color: #222;
    font-family: inherit;
    font-weight: 700;
    line-height: 1.35;
    margin: 1.2em 0 .6em;
    padding: 0;
    text-transform: none;
}

#post-body h1 { font-size: 28px !important; }
#post-body h2 { font-size: 24px !important; }
#post-body h3 { font-size: 20px !important; }
#post-body h4 { font-size: 18px !important; }
#post-body h5 { font-size: 16px !important; }
#post-body h6 { font-size: 15px !important; }

/* Danh sách */
#post-body ul,
#post-body ol {
    margin: 0 0 1em;
    padding: 0 0 0 40px;
}

#post-body ul { list-style: disc; }
#post-body ul ul { list-style: circle; }
#post-body ul ul ul { list-style: square; }
#post-body ol { list-style: decimal; }

#post-body ul ul,
#post-body ol ol,
#post-body ul ol,
#post-body ol ul {
    margin-bottom: 0;
}

#post-body li {
    list-style: inherit;
    margin: 0 0 .4em;
    padding: 0;
}

#post-body li > p:last-child {
    margin-bottom: 0;
}

/* Liên kết, chữ đậm / nghiêng */
#post-body a {
    color: #0b5cad;
    text-decoration: none;
}

#post-body a:hover {
    color: #223d80;
    text-decoration: underline;
}

#post-body strong,
#post-body b {
    font-weight: 700;
}

#post-body em,
#post-body i {
    font-style: italic;
}

/* Trích dẫn */
#post-body blockquote {
    margin: 1em 0;
    padding: 12px 16px;
    border: 0;
    border-left: 4px solid #223d80;
    background-color: #f7f9fc;
    font-style: italic;
}

#post-body blockquote p {
    padding: 0;
}

#post-body blockquote p:last-child {
    margin-bottom: 0;
}

/* Hình ảnh, video */
#post-body img {
    max-width: 100%;
    height: auto !important;
}

#post-body iframe,
#post-body video {
    max-width: 100%;
}

#post-body figure {
    display: inline-block;
    max-width: 100%;
    margin: 10px 20px;
    text-align: center;
}

#post-body figure > figcaption {
    display: block;
    font-size: 13px;
    color: #666;
    text-align: center;
}

/* Bảng */
#post-body table {
    max-width: 100%;
    margin-bottom: 1em;
    border-collapse: collapse;
}

#post-body table td,
#post-body table th {
    padding: 6px 10px;
    vertical-align: top;
}

#post-body table p:last-child {
    margin-bottom: 0;
}

/* Khác */
#post-body hr {
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1.5em 0;
}

#post-body pre {
    white-space: pre-wrap;
    background-color: #f5f5f5;
    padding: 10px;
}
