/* html {
    font-size: 26px;
} */

/* @import url(//fonts.googleapis.com/css?family=Noto+Sans+TC/); */

@font-face {
    font-family: "Literata"; 
    font-weight: normal; 
    font-style: normal;
    src: url("../fonts/LiterataTTText-Medium.woff2") format("woff2"), 
         url("../fonts/LiterataTTText-Medium.woff") format("woff");
}

@font-face {
    font-family: "Literata"; 
    font-weight: normal; 
    font-style: italic; 
    src: url("../fonts/LiterataTTText-MediumItalic.woff2") format("woff2"), 
         url("../fonts/LiterataTTText-MediumItalic.woff") format("woff");
}

@font-face {
    font-family: "Literata"; 
    font-weight: bold; 
    font-style: normal;
    src: url("../fonts/LiterataTTText-Bold.woff2") format("woff2"), 
         url("../fonts/LiterataTTText-Bold.woff") format("woff");
}

@font-face {
    font-family: "Literata"; 
    font-weight: bold; 
    font-style: italic;
    src: url("../fonts/LiterataTTText-BoldItalic.woff2") format("woff2"), 
         url("../fonts/LiterataTTText-BoldItalic.woff") format("woff");
}

@font-face {
    font-family: "CN-LE"; 
    font-weight: normal; 
    font-style: normal;
    src: url("../fonts/CN-Le.ttf")
}

@font-face {
    font-family: "Sanskrit"; 
    font-weight: normal; 
    font-style: normal;
    src: url("../fonts/Sanskr.ttf")
} 

:root {
    --md-text-font: "Literata";
    --md-code-font: "Literata";
}


p:empty {display: none;}

::selection {
    background: #ffd78d;
    color: #3d1818;
}

#logo {
    fill: var(--md-default-bg-color);
    stroke: var(--md-default-bg-color);
}

/* footer */
.md-footer__title {
    color: #ADACAC;
}

.md-footer__button {
    /* margin: 0.2rem;
    padding: 0.4rem; */
    color: #ADACAC;
}

.md-ellipsis {
    font-weight: unset !important;
    padding-bottom: 0.04rem;
}


:root,
[data-md-color-scheme="default"] {
    --md-primary-fg-color: #cb4810;  
    --md-default-fg-color--light: #3d1818;
    --md-default-bg-color: #fff9ea;
}

[data-md-color-accent="default"] {
    --md-accent-fg-color:  #cb4810; /* #d74639; */
    --md-primary-bg-color: #fff9e9; /* #3d1818; */
}

[data-md-color-scheme="slate"] {
    --md-primary-fg-color: #FFCE7B; /* #f7b7a5; #cb4810;*/
    --md-default-fg-color--dark: #fff9ea;
    --md-hue: 2;
    --md-default-fg-color--light: hsla(var(--md-hue), 75%, 90%, 0.75);
    /* --md-footer-logo-dark-mode: block;
    --md-footer-logo-light-mode: none; */
}

[data-md-color-accent="slate"] {
    --md-accent-fg-color: #FFCE7B; /* #f7b7a5; #f26d6d; */ /* #ef5552; */
    --md-primary-bg-color: #3d1818;  /* #BE9A98; */
}

aside,
body,
input {
    color: var(--md-default-fg-color--light);
}

.md-content {
    margin: 0rem auto 2rem;
    max-width: 33rem;
}

.md-typeset {
    font-size: 1rem;
    line-height: 1.4;
}

.md-typeset h1 {
    margin: 0 0 0.7em;
    font-weight: 700;
    color: var(--md-default-fg-color--light);
}

.md-typeset h2,
.md-typeset h3 {
    font-weight: 700;
    color: var(--md-default-fg-color--light);
}

.md-tabs__link {
    font-size: 0.9rem;
    margin-top: 0.3rem;
    font-weight: 700;
}

.md-nav__link {
    /* padding: .05rem; */
    /* padding: -0.95rem */
    padding: 0 0 0.06rem 0;
    margin-top: 0.575em;
}

.md-nav__link:focus,
.md-nav__link:hover {
    text-decoration: underline;
}

@media screen and (min-width: 76.25em) {
    .md-nav__icon {
        height: 1.1rem;
        width: 1.1rem;
    }
}

.md-tabs__item {
    height: 2.2rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.md-nav {
    font-size: .9rem;
    line-height: 1.3;
}

.md-header__title {
    font-size: 1rem;
    line-height: 2.4rem;
    font-weight: 600;
}

/* .md-nav__link:focus, .md-nav__link:hover {
    color: #c28068;
} */

.md-search-result .md-typeset {
    font-size: 0.9rem;
    line-height: 1.4;
    padding-right: 3rem;
}

.md-search-result .md-typeset h1 {
    font-size: 0.9rem;
    line-height: 1.4;
}

.md-search-result .md-typeset h2 {
    font-size: 0.9rem;
    line-height: 1.4;
} 

.md-search-result__terms {
    font-size: .8rem;
}

.md-search-result__more > summary > div {
    font-size: .8rem;
}

/* Admonition */
.md-typeset .admonition,
.md-typeset details {
    color: var(--md-default-fg-color--light);
    font-size: 1rem;
}

.md-typeset .admonition,
.md-typeset details {
    margin: 0 0 1rem 0;
    /* padding: 0 .6rem; */
}

/* .md-typeset .admonition.note, .md-typeset details.note {
    border-color: var(--turning-dark-bg);
} */

html .md-typeset .admonition>:not(:first-child):not(:last-child) {
    /* ,html .md-typeset details>:not(:last-child) { */
    padding: 0 1.3rem 0.1rem;
}

html .md-typeset .admonition>:last-child,
html .md-typeset details>:last-child {
    margin-bottom: 0.6rem;
    padding: 0 1.3rem 0.7rem;
}

/* Footnotes */
.md-typeset .footnote {
    color: var(--md-default-fg-color--light);
    font-size: .9rem;
}

/* Table */
.md-typeset__table {
    padding: 0rem;
}

.md-typeset table:not([class]) {
    font-size: 1rem;
}

.md-typeset table:not([class]) th {
    /* font-weight: 700; */
    /* min-width: 5rem; */
    padding: .5em 1.25em;
    /* vertical-align: top; */
}

.md-typeset table:not([class]) td {
    /* border-top: .05rem solid var(--md-typeset-table-color); */
    padding: 0.1rem 0.25rem;
    /* vertical-align: top; */
}

.md-typeset .tabbed-labels > label {
    font-size: 1rem;
  }

@media screen {
    .js .md-typeset .tabbed-labels::before {
        height: 3px;
    }
} 

.md-typeset__scrollwrap {
    margin: 1rem !important;
}

.md-typeset .tabbed-control {
    height: 3rem;
}

.md-typeset kbd {
    border-radius: 0.3rem;
    font-size: 0.85em;
    padding: 0 0.4em;
    vertical-align: text-top;
}

.row-content {
    display: flex;
    flex-direction: row;
    column-gap: 1rem;
    justify-content: center;
}

@media screen and (max-width: 800px) {
    .row-content {
        flex-direction: column;
        margin-bottom: -1rem;
        align-items: center;
    }

    .row-content>* {
        margin-block-start: -3rem;
    }
}

.md-typeset blockquote {
    margin-top: -0.5rem;
}

.row-content>div,
.row-content>blockquote {
    flex-basis: 50%;
}

/* Wrap around items */
.md-typeset__scrollwrap {
    margin: 0rem;
}

/* Back to top button */
.md-top:focus,
.md-top:hover {
    background-color: var(--md-accent-fg-color);
    color: var(--md-primary-bg-color);
}

.md-typeset div.arithmatex {
    overflow: auto;
    scroll-margin-top: 3rem;
    scroll-padding-top: 5rem;
    margin: 1rem 0;
}

.md-typeset a {
    font-weight: 700;
}

mjx-container[jax="CHTML"][display="true"] {
    display: block;
    text-align: center;
    margin: 0.5em auto !important;
}

/* style for svg */
.scaling-svg {
    width: 100%; 
    padding-bottom: 92%; 
    height: 1px; 
    overflow: visible
}

/* Underline link */
.md-tabs__link--active, .md-tabs__link:focus, .md-tabs__link:hover {
    text-decoration: underline;
}

.md-nav__item .md-nav__link--active {
    text-decoration: underline;
}

/* Search text */
[aria-label="Tìm kiếm"] {
    font-size: 0.9rem;
    font-family: "Literata";
    font-weight: 700;
    padding-bottom: 0.18rem
}

/* Site Label */
[dir=ltr] .md-header__title {
    margin-left: 0.3rem;
}

.md-header__title {
    font-size: 1.1rem;
    line-height: 2.4rem;
    /* font-weight: 100; */
}

/* logo adjust */
.md-header__button.md-logo {
    margin: 0rem;
    padding: 0.4rem;
}
    
.md-header__button.md-logo img, .md-header__button.md-logo svg {
    height: 1.8rem;
}

@media screen and (max-width: 76.1875em) {
    .md-nav--primary .md-nav__title .md-logo
    {
      margin: 0rem 0.4rem;
    }
}

/* Table of content padding */
.md-nav__title {
    padding-bottom: .1em;
}

@media screen and (min-width: 76.25em) {
    .md-nav--lifted>.md-nav__list>.md-nav__item--active>.md-nav__link {
        padding: 0 0.6rem 0.1rem 0.6rem;
    }
}

[dir=ltr] .md-typeset > ol, [dir=ltr] .md-typeset > ul {
    margin-left: 0.25em;
    list-style-type: square;
}

/* hr format */
.md-typeset .footnote hr {
    line-height: 1em;
    position: relative;
    outline: 0;
    border: 0;
    text-align: center;
    height: 1.7em;
    opacity: .8;
    margin: 2.5em 0 1.2em;
}

.md-typeset .footnote hr::before {
    content: '';
    background: linear-gradient(to right, transparent, var(--md-default-fg-color), transparent);
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    height: 0.06rem;
}

.md-typeset .footnote hr::after {
    content: "NGUỒN DẪN";
    font-weight: 700;
    position: relative;
    display: inline-block;
    padding: 0 .5em;
    line-height: 1.5em;
    color: var(--md-default-fg-color);
    background-color: var(--md-default-bg-color)
}

@media screen and (max-width: 76.25em) {
    .md-nav--primary .md-nav__title {
        height: 3.6rem;
    }
}

.md-typeset img[align=right] {
    margin: 1em 1em 0.5em 1em;
}

.md-typeset img[align]:only-child {
    margin: 1em;
}

#s7viewer.s7videoviewer {
    width: 640px;
    height: 480px;
}

.doubleUnderline {
    border-bottom: 2px dashed var(--md-default-fg-color--light);
}

video {
    display: block;
    margin: 0 auto;
    border: 10px double var(--md-default-fg-color--light);
    border-radius: 5px;
}


.md-custom__scrollwrap {
    margin: 0rem;
    overflow-x: scroll;
    touch-action: auto;
}

.md-custom__table {
    /* display: inline-block; */
    border-collapse: initial;
    width: 100%;
    margin: 0;
    border: none;
    padding: 0rem;
    /* overflow-x: auto;
    touch-action: auto; */
}

.md-custom__th {
    text-align: center;
    vertical-align: top;
    padding: 0.5em 0.2em;
    min-width: 5rem;
}

.md-custom__td {
    text-align: center;
    padding: 0.3em 0.2em;
    border-top: 1px solid #d6d6d6;
}

.han-dich {
    max-width: 60rem;
    display: block;
    justify-content: center;
}

.han-row-content {
    display: flex;
    flex-direction: row;
    column-gap: 1rem;
    justify-content: center;
}

.han-row-content>div {
    flex-basis: 50%;
}

.han-col-content {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: center;
    /* margin: 1rem auto; */
}

.han-col-content>div {
    flex-basis: 50%;
}

.hanco {
    font-family: "CN-LE", serif, DFKai-SB, Arial;
    font-size: 1.7rem;
    line-height: 1.45rem;
    /* font-weight: 300; */
    /* letter-spacing: 0.1rem; */
}

.sk {
    font-family: "Sanskrit", Arial;
    font-size: 1.6rem;
    line-height: 2rem;
    /* font-weight: 300; */
    /* letter-spacing: 0.1rem; */
}

.hanco > a {
    font-weight: normal !important;
}

.hanco-title{
    font-family: "CN-LE", serif, DFKai-SB, Arial;
    font-weight: bold;
    font-size: 2.2rem;
    line-height: 1.45rem;
    /* margin-bottom: 1rem; */
}

.dich-title{
    font-weight: bold;
    font-size: 1.2rem;
    margin-bottom:0.6rem;
}

.spacer-minus {
    margin-top: -0.5rem;
}

.spacer-sm {
    margin-top: 0.75rem;
}

.spacer-md {
    margin-top: 2rem;
}

.spacer-lg {
    margin-top: 3rem;
}

@media screen and (max-width: 800px) {
    .han-row-content {
        flex-direction: column;
        gap: 1rem;
        align-items: center;
        margin: 1rem auto;
    }
    .han-col-content {
        /* gap: rem; */
        margin: 1rem auto;
    }
    .hanco-title {
        font-family: "CN-LE", serif, DFKai-SB, Literata, Arial;
        font-weight: bold;
        font-size: 1.7rem;
        margin-bottom: 0rem;
        letter-spacing: 0.3rem;
    }
    .dich-title{
        font-weight:700;
        font-size: 1.2rem;
        margin-bottom: 0rem;
    }
    .spacer-lg {
        margin-top: 2rem;
    }
    /* .spacer-md {
        margin-top: 0rem;
    } */
}

.md-typeset abbr {
    border-bottom: .1rem dotted var(--md-default-fg-color--light);
    cursor: help;
    text-decoration: none;
}

.md-tooltip, .md-tooltip--inline, .md-tooltip--active {
    display:none;
}

abbr {
    position: relative;
    /* overflow: hidden; */
}

.md-typeset abbr[title]::selection {
    display: none;
}

.md-typeset abbr:hover {
    overflow-y: scroll;
}

.md-typeset abbr:hover::after { 
    background-color: var(--md-default-fg-color);
    border-radius: .2rem;
    box-shadow: var(--md-shadow-z3);
    color: var(--md-default-bg-color);
    content: attr(data-title);
    position: fixed;
    min-width: 20%;
    font-size: 0.85rem;
    padding: 1rem 1.5rem;
    display: inline;
    max-width: 26rem;
    bottom: auto; 
    top: 15%;
    left: 50%;
    text-align: left;
    transform: translate(-50%);
    white-space: normal;
    z-index: 100;
    overflow-y: scroll;
    max-height: 60%;
}

@media screen and (max-width: 800px) {
    .md-typeset abbr:hover::after {
      /* min-width: 20%; */
      /* max-width: 15rem; */
      top: 10%;
      /* left: 5%; */
      /* transform: translate(5%); */
      overflow-y: scroll;
      z-index: 1000;
      max-height: 60%;
      /* display: inline-block; */
      width: calc(100vw - 4rem);
    }
}

.no-optical-sizing {
    font-optical-sizing: none;
}