/**
 * NukeViet Content Management System
 * @version 4.x
 * @author VINADES.,JSC <contact@vinades.vn>
 * @copyright (C) 2009-2021 VINADES.,JSC. All rights reserved
 * @license GNU/GPL version 2 or any later version
 * @see https://github.com/nukeviet The NukeViet CMS GitHub project
 */

/* Các tùy chỉnh CSS của giao diện nên để vào đây */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");

:root {
    --nhk-font-main: "Inter", Arial, Helvetica, sans-serif;
}

html,
body,
input,
button,
select,
textarea,
.wraper,
.container,
.panel,
.panel-body,
.title,
.hometext,
.bodytext,
.tms_hometext,
#tms_bodytext,
#news-bodyhtml,
#page-bodyhtml,
#detail,
#tms_detai,
.nhk-archive-shell,
#nhk-archive-site-header,
#nhk-archive-site-footer {
    font-family: var(--nhk-font-main) !important;
}

.fa,
.fa:before {
    font-family: FontAwesome !important;
}

.glyphicon,
.glyphicon:before {
    font-family: "Glyphicons Halflings" !important;
}

[class^="icon-"],
[class*=" icon-"] {
    font-family: icomoon !important;
}

.title,
.hometext,
.bodytext,
.tms_hometext,
#tms_bodytext,
#news-bodyhtml,
#page-bodyhtml {
    color: #111827;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.68 !important;
    letter-spacing: 0;
}

.title,
#detail h1,
#detail h2,
#detail h3,
#tms_detai h1,
#tms_detai h2,
#tms_detai h3,
#tms_bodytext h1,
#tms_bodytext h2,
#tms_bodytext h3,
#news-bodyhtml h1,
#news-bodyhtml h2,
#news-bodyhtml h3,
#page-bodyhtml h1,
#page-bodyhtml h2,
#page-bodyhtml h3 {
    font-family: var(--nhk-font-main) !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
}

.bodytext p,
#tms_bodytext p,
#news-bodyhtml p,
#page-bodyhtml p {
    margin: 0 0 14px !important;
}

.bodytext img,
.bodytext a > img,
#tms_bodytext img,
#tms_bodytext a > img,
#news-bodyhtml img,
#news-bodyhtml a > img,
#page-bodyhtml img,
#page-bodyhtml a > img,
#detail .bodytext img,
#detail .bodytext a > img,
#tms_detai .bodytext img,
#tms_detai .bodytext a > img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 1px;
    margin: 14px 0 !important;
    object-fit: contain;
}

.bodytext img[width],
#tms_bodytext img[width],
#news-bodyhtml img[width],
#page-bodyhtml img[width] {
    width: 100% !important;
}

.bodytext figure,
#tms_bodytext figure,
#news-bodyhtml figure,
#page-bodyhtml figure,
.bodytext .wp-caption,
#tms_bodytext .wp-caption,
#news-bodyhtml .wp-caption,
#page-bodyhtml .wp-caption {
    width: 100% !important;
    max-width: 100% !important;
    margin: 14px 0 !important;
}

.bodytext figcaption,
#tms_bodytext figcaption,
#news-bodyhtml figcaption,
#page-bodyhtml figcaption,
.bodytext .wp-caption-text,
#tms_bodytext .wp-caption-text,
#news-bodyhtml .wp-caption-text,
#page-bodyhtml .wp-caption-text {
    color: #64748b;
    font-size: 13px;
    line-height: 1.45;
    text-align: center;
}

.bodytext iframe:not(.nvck-iframe-element)[src*="youtube.com"],
.bodytext iframe:not(.nvck-iframe-element)[src*="youtu.be"],
#tms_bodytext iframe:not(.nvck-iframe-element)[src*="youtube.com"],
#tms_bodytext iframe:not(.nvck-iframe-element)[src*="youtu.be"],
#news-bodyhtml iframe:not(.nvck-iframe-element)[src*="youtube.com"],
#news-bodyhtml iframe:not(.nvck-iframe-element)[src*="youtu.be"],
#page-bodyhtml iframe:not(.nvck-iframe-element)[src*="youtube.com"],
#page-bodyhtml iframe:not(.nvck-iframe-element)[src*="youtu.be"] {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    aspect-ratio: 16 / 9;
    height: auto !important;
    margin: 16px 0 !important;
    border: 0 !important;
}

.bodytext .nvck-iframe.nvck-iframe-responsive,
#tms_bodytext .nvck-iframe.nvck-iframe-responsive,
#news-bodyhtml .nvck-iframe.nvck-iframe-responsive,
#page-bodyhtml .nvck-iframe.nvck-iframe-responsive,
.nvck-iframe.nvck-iframe-responsive {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 0 !important;
    padding-bottom: 56.25% !important;
    margin: 14px 0 !important;
    overflow: hidden !important;
}

.bodytext .nvck-iframe.nvck-iframe-responsive .nvck-iframe-inner,
#tms_bodytext .nvck-iframe.nvck-iframe-responsive .nvck-iframe-inner,
#news-bodyhtml .nvck-iframe.nvck-iframe-responsive .nvck-iframe-inner,
#page-bodyhtml .nvck-iframe.nvck-iframe-responsive .nvck-iframe-inner,
.bodytext .nvck-iframe.nvck-iframe-responsive iframe,
#tms_bodytext .nvck-iframe.nvck-iframe-responsive iframe,
#news-bodyhtml .nvck-iframe.nvck-iframe-responsive iframe,
#page-bodyhtml .nvck-iframe.nvck-iframe-responsive iframe,
.nvck-iframe.nvck-iframe-responsive .nvck-iframe-inner,
.nvck-iframe.nvck-iframe-responsive iframe {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    border: 0 !important;
}

@media (min-width: 768px) {
    #nhk-archive-site-header {
        position: relative;
        z-index: 1000;
    }

    .nhk-mainnav {
        position: relative;
        z-index: 1001;
    }

    .nhk-mainnav .nhk-archive-wrap {
        position: relative;
        overflow: visible;
    }

    body.nhk-nav-fixed {
        padding-top: var(--nhk-fixed-nav-height, 32px);
    }

    body.nhk-nav-fixed .nhk-mainnav {
        position: fixed !important;
        top: 0;
        left: 0;
        right: 0;
        z-index: 10010;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.22);
    }

    body.nhk-nav-fixed .nhk-mainnav .nhk-archive-wrap {
        overflow: visible;
    }

    .nhk-nav-cat {
        position: relative;
    }

    .nhk-nav-cat-menu {
        display: none;
        position: absolute;
        top: 32px;
        left: 0;
        width: 230px;
        border: 1px solid #d9d9d9;
        background: #fff;
        box-shadow: 0 8px 18px rgba(15, 23, 42, 0.18);
        z-index: 10020;
    }

    .nhk-nav-cat:hover + .nhk-nav-cat-menu,
    .nhk-nav-cat:focus + .nhk-nav-cat-menu,
    .nhk-nav-cat-menu:hover,
    .nhk-nav-cat-menu:focus-within {
        display: block;
    }

    .nhk-mainnav .nhk-nav-cat-menu a {
        display: block;
        position: relative;
        height: auto;
        min-height: 38px;
        padding: 10px 28px 8px 14px;
        border-bottom: 1px solid #e5e5e5;
        background: #fff;
        color: #005cac;
        font-size: 13px;
        font-weight: 400;
        line-height: 18px;
        text-transform: uppercase;
    }

    .nhk-mainnav .nhk-nav-cat-menu a:after {
        content: "›";
        position: absolute;
        right: 12px;
        color: #777;
    }

    .nhk-mainnav .nhk-nav-cat-menu a:hover,
    .nhk-mainnav .nhk-nav-cat-menu a:focus {
        background: #f3f8fb;
        color: #005cac;
    }

    .nhk-reference-sidebar {
        position: sticky;
        top: 44px;
        align-self: flex-start;
    }
}

.nhk-reference-content-row.nhk-module-shops .nhk-reference-main {
    float: none !important;
    width: 100% !important;
}

.nhk-reference-content-row.nhk-module-shops .nhk-reference-sidebar {
    display: none !important;
}

.nhk-layout-main-right.nhk-module-shops .nhk-layout-main-content {
    float: none !important;
    width: 100% !important;
}

.nhk-layout-main-right.nhk-module-shops .nhk-layout-right-sidebar {
    display: none !important;
}

@media (min-width: 768px) {
    .BodyToc {
        float: right !important;
        width: 300px !important;
        max-width: 300px !important;
        padding-left: 12px !important;
        padding-right: 0 !important;
    }

    .BodyToc .danh-sach {
        padding: 8px !important;
    }

    .BodyToc .head-danh-sach {
        font-size: 14px !important;
        line-height: 18px !important;
    }

    .BodyToc ol.toc-list,
    .BodyToc ol.toc-list a {
        font-size: 14px !important;
        line-height: 20px !important;
    }

    .BodyToc ol.toc-list > li > a,
    .BodyToc ol.toc-list > li > ol.toc-list > li > a {
        font-size: 14px !important;
    }
}

@media (max-width: 767px) {
    .BodyToc {
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}