/* Smooth scrolling for changing titles */
html {
    scroll-behavior: smooth;
}

/* Theme customization */
:root {
    --base-font-family: Nunito, Arial;
    --heading-font-family: Raleway, Arial;

    --code-block-border-radius: 0;
    --code-block-padding: 1rem;
    --code-block-margin: 0 0 1rem 0;
    --code-inline-background: #ebf5f1;
    --code-inline-color: #33755e;

    --cover-background-color: #cbe4db;
    --cover-background-image: none;
    --cover-heading-color: black;


    /* Slightly larger than default to fit borders */
    --toc-width: 250px;

    --heading-h2-padding: 0;
    --heading-h2-margin: 1.5em 0 0 0;
    --heading-h2-border-width: 0;
    --heading-h2-font-size: 20pt;
    --heading-h2-font-weight: bold;

    --heading-h3-margin: 2em 0 0 0;

    --base-line-height: 1.5;

    --sidebar-nav-link-padding: 1.5px 0 1.5px 7px;

    --docsifytabs-border-radius-px: 0;
    --docsifytabs-tab-color: #555;
    --docsifytabs-tab-color--active: #222;
    --docsifytabs-margin: 1.5em 0;
    --docsifytabs-border-color: #ddd;
    

    --theme-color: #53a688; /* Github icon tabs, icon and some others */

    --table-cell-padding: 8px 24px 8px 0;
    --table-row-odd-background: transparent; /* Remove table stripes */
}


/* Make sidebar <a> consistent with toc links
 * (see toc.css) */
.sidebar-nav a:hover,
.sidebar nav a:hover {
    color: var(--text-color-nav-highlight, #42856d);
    text-decoration: none;
}


/* Remove tab outline and make them appear clickable */
.docsify-tabs__tab {
    cursor: pointer;
    outline: none;
}


/* Sometimes doscify applies <strong>, sometimes not
 * so we enforce font weight here for page header */
.markdown-section h1:first-child {
    font-weight: bold;
}


/* Thicker border on markdown table headers */
.markdown-section table:not(.css-table) thead tr:first-child {
    border-bottom: 2px solid #aaa;
}


/* Style for sidebar section headers */
.sidebar-h2 {
    color: #333;
    font-size: 0.85em;
    font-weight: bold;
    margin-bottom: 6px;
    margin-top: 28px;
    text-transform: uppercase;
}


/* Badge for !important that appears on some pages */
.important-badge {
    background-color: #53a688;
    border-radius: 2px;
    color: white;
    font-size: 12pt;
    padding: 0 10px;
    vertical-align: super;
}


/** CSS table for the CSS properties */
.css-table-summary {
    color: #42928a;
    cursor: pointer;
    font-size: 10pt;
    outline: none;
    text-align: right;
    transition: color 0.2s;
}

.css-table-summary:hover {
    color: #52a59e;
}

.css-table-wrapper {
    border: var(--docsifytabs-border-px) solid var(--docsifytabs-border-color);
    margin-top: 10px;
    max-height: 200px;
    overflow: auto;
    position: relative;
    width: 100%;
}

.css-table {
    display: table !important;
    margin: 0 !important;
    width: 100%;
}

/* Fixed layout to avoid overlap at smaller screen sizes */
@media (min-width: 300px) {
    .css-table {
        table-layout: fixed;
    }
}

.css-table_thead {
    top: 0;
    width: 100%;
}

.css-table_thead tr:first-child th {
    background: var(--base-background-color) !important;
    position: sticky;
    top: 0;
    z-index: 100;
}

.css-table tbody tr:nth-child(odd) {
    background: var(--table-row-even-background) !important;
}

.css-table td,
.css-table th {
    padding: 4px !important;
}

.css-table th {
    font-size: 0.85rem;
    padding-left: 12px !important;
}


/* Undo the default overrides from look-okay */
ul { list-style: circle; }
ol { list-style: numeric; }


/* Code demo container */
.demo {
    background-color: #fdfdfd;
    border: 1px solid #ddd;
    padding: var(--code-block-padding);
    text-align: center;
}


/* Striped backgrounds for some code demos */
.striped-bg {
    background: repeating-linear-gradient(45deg,
        rgba(0, 0, 0, 0),
        rgba(0, 0, 0, 0) 6px,
        rgba(0, 0, 0, 0.05) 6px,
        rgba(0, 0, 0, 0.05) 12px);
}