/* Theme Configuration Options */

:root 
{
    /* General */

    --base-font-size: 16px;
    --smalldevice-base-font-size: 14px; /* Base font size for devices < 1024px */
    --sidebar-width: 400px;
}

/* Dark Theme (Default) */
:root,
[data-theme='dark'] {
    /* General */
    --main-bg-color: #1f1f23;
    --footer-bg-color: rgba(0,0,0,.4);
    --separator-color: #42474f;
    --table-strip-bg-color: #151515;
    --table-header-bg-color: black;
    --table-header-color: hsla(0,0%,100%,.8);
    --table-header-border-color: #040405;

    /* Text */
    --appname-color: white;
    --h1-color: white;
    --h2-color: #f2f2f2;
    --h3-color: #e3e3e3;
    --h4-color: #ffffff;
    --h5-color: #e0e0e0;
    --text-color: #e1e1e1;
    --link-color: #35bbee;
    --link-hover-color: #5fd2ff;
    
    /* Mobile Topbar */
    --topbar-bg-color: #18191c;
    
    /* Button */
    --button-color: #747f8d;

    /* Sidebar */
    --sidebar-bg-color: #292B30;
    --search-color: #bdbdbd;
    --search-bg-color: #1b1e21;
    --search-searchicon-color: #e3e3e3;
    --search-border-color: black;
    --sidebar-item-color: white;
    --sidebar-active-item-color: #00b0f4;
    --sidebar-level1-item-bg-color: #222429;
    --sidebar-level1-item-hover-bg-color: #1D1F22;
    --toc-filter-color: #bdbdbd;
    --toc-filter-bg-color: #1b1e21;
    --toc-filter-filtericon-color: #e3e3e3;
    --toc-filter-clearicon-color: #e68585;
    --toc-filter-border-color: black;

    /* Scrollbars */
    --scrollbar-bg-color: transparent;
    --scrollbar-thumb-bg-color: rgba(0,0,0,.4);
    --scrollbar-thumb-border-color: transparent;
 
    /* Alerts and Blocks */
    /* alert-info (used by NOTE) */
    --alert-info-title-color: #7c9dff;
    --alert-info-border-color: #7c9dffc7;
    --alert-info-bg-color: #7c9dff21;
    --alert-info-text-color: #c5cfe6;
    /* TIP overrides (extends alert-info) */
    --alert-info-TIP-title-color-override: #96d89e;
    --alert-info-TIP-border-color-override: #96d89ec7;
    --alert-info-TIP-bg-color-override: #96d89e21;
    --alert-info-TIP-text-color-override: #c0dac3;
    /* alert-danger (used by CAUTION) */
    --alert-danger-title-color: #f0857d;
    --alert-danger-border-color: #f0857dc7;
    --alert-danger-bg-color: #f0857d21;
    --alert-danger-text-color: #e2bab8;
    /* IMPORTANT overrides (extends alert-danger) */
    --alert-danger-IMPORTANT-title-color-override: #faa669;
    --alert-danger-IMPORTANT-border-color-override: #faa669c7;
    --alert-danger-IMPORTANT-bg-color-override: #faa66921;
    --alert-danger-IMPORTANT-text-color-override: #e4bfa4;
    /* alert-warning (used by WARNING) */
    --alert-warning-title-color: #edbf5c;
    --alert-warning-border-color: #edbf5cc7;
    --alert-warning-bg-color: #edbf5c21;
    --alert-warning-text-color: #dccaa5;

    --blockquote-border-color: rgba(255,255,255,.5);
    --blockquote-bg-color: rgba(255,255,255,.06);
    --breadcrumb-bg-color: #2f3136;

    /* Tabs */
    --nav-tabs-border-width: 1px;
    --nav-tabs-border-color: #495057;
    --nav-tabs-border-radius: .375rem;
    --nav-tabs-link-hover-border-color: #303336 #303336 transparent;
    --nav-tabs-link-active-color: white;
    --nav-tabs-link-active-bg: var(--main-bg-color);
    --nav-tabs-link-active-border-color: var(--nav-tabs-border-color) var(--nav-tabs-border-color) var(--main-bg-color);

    /* Inline Code */
    --ref-bg-color: #00000036;
    --ref-color: #f5adac;

    /* Code Blocks */
    --code-bg-color: #151515;
}

/* Light Theme */
[data-theme='light'] {
    /* General */
    --main-bg-color: #ffffff;
    --footer-bg-color: rgba(0,0,0,.05);
    --separator-color: #e0e0e0;
    --table-strip-bg-color: #f5f5f5;
    --table-header-bg-color: #e8e8e8;
    --table-header-color: rgba(0,0,0,.8);
    --table-header-border-color: #d0d0d0;

    /* Text */
    --appname-color: #1a1a1a;
    --h1-color: #1a1a1a;
    --h2-color: #2a2a2a;
    --h3-color: #3a3a3a;
    --h4-color: #1a1a1a;
    --h5-color: #2a2a2a;
    --text-color: #333333;
    --link-color: #0078d4;
    --link-hover-color: #096ec4;
    
    /* Mobile Topbar */
    --topbar-bg-color: #f5f5f5;
    
    /* Button */
    --button-color: #616161;

    /* Sidebar */
    --sidebar-bg-color: #f8f8f8;
    --search-color: #333333;
    --search-bg-color: #ffffff;
    --search-searchicon-color: #616161;
    --search-border-color: #d0d0d0;
    --sidebar-item-color: #333333;
    --sidebar-active-item-color: #0078d4;
    --sidebar-level1-item-bg-color: #eeeeee;
    --sidebar-level1-item-hover-bg-color: #e8e8e8;
    --toc-filter-color: #333333;
    --toc-filter-bg-color: #ffffff;
    --toc-filter-filtericon-color: #616161;
    --toc-filter-clearicon-color: #d32f2f;
    --toc-filter-border-color: #d0d0d0;

    /* Scrollbars */
    --scrollbar-bg-color: transparent;
    --scrollbar-thumb-bg-color: rgba(0,0,0,.2);
    --scrollbar-thumb-border-color: transparent;

    /* Alerts and Blocks */
    /* alert-info (used by NOTE) */
    --alert-info-title-color: #1565c0;
    --alert-info-border-color: #1565c0c7;
    --alert-info-bg-color: #1565c021;
    --alert-info-text-color: #273d55;
    /* TIP overrides (extends alert-info) */
    --alert-info-TIP-title-color-override: #009a2e;
    --alert-info-TIP-border-color-override: #009a2ec7;
    --alert-info-TIP-bg-color-override: #009a2e21;
    --alert-info-TIP-text-color-override: #206233;
    /* alert-danger (used by CAUTION) */
    --alert-danger-title-color: #d74e47;
    --alert-danger-border-color: #d74e47c7;
    --alert-danger-bg-color: #d74e4721;
    --alert-danger-text-color: #5f2f2d;
    /* IMPORTANT overrides (extends alert-danger) */
    --alert-danger-IMPORTANT-title-color-override: #ca8000;
    --alert-danger-IMPORTANT-border-color-override: #ca8000c7;
    --alert-danger-IMPORTANT-bg-color-override: #ca800021;
    --alert-danger-IMPORTANT-text-color-override: #705118;
    /* alert-warning (used by WARNING) */
    --alert-warning-title-color: #ccc500;
    --alert-warning-border-color: #ccc500c7;
    --alert-warning-bg-color: #ccc50021;
    --alert-warning-text-color: #625f00;

    --blockquote-border-color: rgba(0,0,0,.3);
    --blockquote-bg-color: rgba(0,0,0,.03);
    --breadcrumb-bg-color: #f0f0f0;

    /* Tabs */
    --nav-tabs-border-width: 1px;
    --nav-tabs-border-color: #dee2e6;
    --nav-tabs-border-radius: .375rem;
    --nav-tabs-link-hover-border-color: #e9ecef #e9ecef transparent;
    --nav-tabs-link-active-color: #333333;
    --nav-tabs-link-active-bg: var(--main-bg-color);
    --nav-tabs-link-active-border-color: var(--nav-tabs-border-color) var(--nav-tabs-border-color) var(--main-bg-color);

    /* Inline Code */
    --ref-bg-color: #9d9d9d12;
    --ref-color: #c71000;

    /* Code Blocks */
    --code-bg-color: #f8f9fa;
}

/* Code Block Overrides */

pre, legend {
    --scrollbar-thumb-bg-color: #333;
}