:root{
    --mrkdwn-txt-color: #333;
    --mrkdwn-bg-color: #ffffff;
    --mrkdwn-mark-bg-color: #fde157;

    --mrkdwn-link-color: #1a0dab;
    --mrkdwn-header-color: #444;

    --mrkdwn-tabl-head-color: #72a1ff;

    --mrkdwn-code-bg-color: #d2d2d2;
    --mrkdwn-code-text-color: #333;
}

.mrkdwn-sec h1,
.mrkdwn-sec h2,
.mrkdwn-sec h3,
.mrkdwn-sec h4,
.mrkdwn-sec h5,
.mrkdwn-sec h6{
    align-items: center;
    display: flex;
    gap: 10px;
}

.mrkdwn-sec{
    color: var(--mrkdwn-txt-color);
    background-color: var(--mrkdwn-bg-color);
    font-family: Arial, sans-serif;
    line-height: 1.6;
    padding: 10px;
}
.mrkdwn-sec table{
    border-collapse: collapse;
    width: 100%;
}
.mrkdwn-sec th{
    background-color: var(--mrkdwn-tabl-head-color);
    color: white;
    text-align: left; 
}

.mrkdwn-sec th, .mrkdwn-sec td{
    padding: 8px;
    border: 1px solid #ddd;
    font-size: 13px;
}
.mrkdwn-sec th{
    font-weight: bold;
}

.mrkdwn-sec mark{
    background-color: var(--mrkdwn-mark-bg-color);
    box-sizing: border-box;
    padding: 3px;
}
.mrkdwn-sec blockquote{
    font-style: italic;
}

.mrkdwn-inlinecode{
        display: inline-block;
        background-color: var(--mrkdwn-code-bg-color);
        color: var(--mrkdwn-code-text-color);
        padding: 2px 4px;
        border-radius: 3px;
}
.mrkdwn-codeblock{
    display: block;
    background-color: var(--mrkdwn-code-bg-color);
    color: var(--mrkdwn-code-text-color);
    padding: 2px 4px;
    border-radius: 3px;
}

.mrkdwn-infobox{
    display: grid;
    grid-template-columns: 20px auto;
    grid-template-rows: auto;
    gap: 10px;
    width: 100%;
    box-sizing: border-box;
    padding: 6px;
    margin-bottom: 15px;
    overflow: hidden;
    border-radius: 0 4px 4px 0;
}
.infobox-tip{
    background-color: rgba(255, 248, 169, 0.2);
    border: 1px solid rgb(252, 232, 2);
    border-left: 3px solid rgb(252, 232, 2);
}
.infobox-warning{
    background-color: rgba(255, 216, 169, 0.2);
    border: 1px solid rgb(252, 177, 2);
    border-left: 3px solid rgb(252, 177, 2);
}
.infobox-error{
    background-color: rgba(255, 169, 169, 0.2);
    border: 1px solid rgb(252, 2, 2);
    border-left: 3px solid rgb(252, 2, 2);
}
.infobox-info{
    background-color: rgba(169, 178, 255, 0.2);
    border: 1px solid rgb(2, 10, 252);
    border-left: 3px solid rgb(2, 10, 252);
}
.infobox-success{
    background-color: rgba(169, 255, 169, 0.2);
    border: 1px solid rgb(23, 252, 2);
    border-left: 3px solid rgb(23, 252, 2);
}