@media not print {
    :root {
        --ita-colors-neutral-900: #e0def4;
        --ita-colors-neutral-800: #b8b5d0;
        --ita-colors-neutral-700: #908caa;
        --ita-colors-neutral-600: #7f7b97;
        --ita-colors-neutral-500: #6e6a86;
        --ita-colors-neutral-400: #312d48;
        --ita-colors-neutral-300: #26233a;
        --ita-colors-neutral-200: #1f1d2e;
        --ita-colors-neutral-100: #191724;
        --ita-colors-primary-900: #f3ecfa;
        --ita-colors-primary-800: #e8dff5;
        --ita-colors-primary-700: #dcccf1;
        --ita-colors-primary-600: #d0baec;
        --ita-colors-primary-500: #c4a7e7;
        --ita-colors-primary-400: #4e3f78;
        --ita-colors-primary-300: #332a58;
        --ita-colors-primary-200: #231e3e;
        --ita-colors-primary-100: #1c1830;
        --ita-colors-success-900: #cde6ea;
        --ita-colors-success-500: #9ccfd8;
        --ita-colors-success-100: #192328;
        --ita-colors-warning-900: #fbe0b9;
        --ita-colors-warning-500: #f6c177;
        --ita-colors-warning-100: #252016;
        --ita-colors-danger-900: #f3b7c6;
        --ita-colors-danger-500: #eb6f92;
        --ita-colors-danger-100: #251a1f;
        --libdoc-image-background-color: var(--libdoc-image-background-color-dark-mode) !important;
        --libdoc-soft-shadow: 0px 0px 10px rgba(0,0,0,0.5);
        --libdoc-long-shadow: 0px 0px 10px 0px var(--ita-colors-neutral-100), 5px 5px 10px 0px var(--ita-colors-primary-100), -5px 5px 10px 0px var(--ita-colors-primary-100), -5px -5px 10px 0px var(--ita-colors-primary-100), 5px -5px 10px 0px var(--ita-colors-primary-100);
        --libdoc-long-shadow-alt: 
            5px 5px 10px 0px var(--ita-colors-primary-100),
            10px 10px 40px 0px var(--ita-colors-primary-500),
            20px 20px 40px 0px var(--ita-colors-primary-300),
            -20px 20px 40px 0px var(--ita-colors-primary-300),
            -20px -20px 40px 0px var(--ita-colors-primary-300),
            20px -20px 40px 0px var(--ita-colors-primary-300),
            5px 5px 10px 0px var(--ita-colors-primary-100),
            -5px 5px 10px 0px var(--ita-colors-primary-100),
            -5px -5px 10px 0px var(--ita-colors-primary-100),
            5px -5px 10px 0px var(--ita-colors-primary-100)
    }
    html {
        background-color: var(--ita-colors-neutral-200);
    }
    body {
        background: 0px 0px / 20px 20px radial-gradient(var(--ita-colors-neutral-500) 0.5px,var(--ita-colors-neutral-200) 1px);
    }
    html,
    .o-auto {
        scrollbar-color: var(--ita-colors-neutral-700) transparent;
    }
    main > :not(pre) code {
    background-color: var(--ita-colors-primary-300);
    }
    /* ALERTS */
    main .alert {
    color: var(--ita-colors-neutral-900);
    background-color: var(--ita-colors-neutral-200);
    }
    main .alert.alert-info {
    background-color: var(--ita-colors-primary-200);
    }
    /* TABLES */
    main table td code {
    color: var(--ita-colors-primary-900);
    }
    /* INLINE HTML */
    main del {
    background-color: var(--ita-colors-danger-500);
    color: var(--ita-colors-danger-900);
    text-decoration-color: var(--ita-colors-danger-100);
    }
    main s,
    main strike {
    text-decoration-color: var(--ita-colors-danger-500);
    color: var(--ita-colors-neutral-700);
    }
    main kbd {
    background-color: var(--ita-colors-primary-300);
    }
    main mark {
    background-color: var(--ita-colors-success-500);
    color: var(--ita-colors-success-100);
    }
    main small {
    color: var(--ita-colors-neutral-900);
    }
    main figure {
        background-color: var(--ita-colors-neutral-200);
    }
    main figure.long-shadow img,
    main picture:has(.long-shadow) img {
        box-shadow: 0em 0em 60px var(--ita-colors-neutral-100), 0em 0em 10px var(--ita-colors-neutral-300), 1em 1em 40px var(--ita-colors-neutral-100);
    }
    main > pre {
        background-color: var(--ita-colors-primary-100);
    }
    main > pre > code {
        box-shadow: none;
    }

    /* FLOATING TOC */
    #floating_toc__list a.__active {
        background-color: var(--ita-colors-primary-300);
    }

    /* NAV_PRIMARY */
    #nav_primary_container,
    #nav_primary_header {
        background-color: var(--ita-colors-neutral-200);
    }
    #nav_primary_container {
        box-shadow: var(--libdoc-long-shadow);
    }

    /* SANDBOX */
    .sandbox .sandbox__code_wrapper,
    .sandbox .sandbox__iframe_wrapper {
        background-color: var(--ita-colors-neutral-300);
        color: var(--ita-colors-neutral-800);
    }
    .sandbox .sandbox__resizer {
        background-color: var(--ita-colors-neutral-300);
        color: var(--ita-colors-neutral-800);
    }
    .sandbox .sandbox__resizer:active,
    .sandbox .sandbox__resizer:hover {
        background-color: var(--ita-colors-neutral-400);
    }
    main .sandbox__iframe_wrapper a,
    .sandbox .sandbox__reload,
    .sandbox .sandbox__copy_url,
    .sandbox .sandbox__copy_code {
        color: var(--ita-colors-neutral-900);
    }
    .sandbox .sandbox__enable_switch ~ label {
        background-color: var(--ita-colors-neutral-100);
        color: var(--ita-colors-neutral-900);
    }
    .sandbox .sandbox__tabs {
        background-color: var(--ita-colors-primary-300);
        box-shadow: inset 0px 0px 5px var(--ita-colors-primary-100);
    }
    .sandbox .sandbox__tab.__active {
        background-color: var(--ita-colors-neutral-100);
        box-shadow: var(--libdoc-soft-shadow);
    }

    /* WIDGETS */
    .widget-iconCard > p {
        background-color: var(--ita-colors-neutral-200);
        box-shadow: var(--libdoc-soft-shadow);
    }

    /* BLOG */
    .blog-post-link {
        background-color: var(--ita-colors-neutral-200);
        box-shadow: var(--libdoc-soft-shadow);
    }

    /* AUTOCOMPLETE */
    .auto-results-wrapper > li {
        background-color: var(--ita-colors-primary-100);
    }
}


/* PRINT */
@media print {
    :root {
        --ita-colors-neutral-100: #faf4ed !important;
        --ita-colors-neutral-200: #fffaf3 !important;
        --ita-colors-neutral-300: #f2e9de !important;
        --ita-colors-neutral-400: #e2dad0 !important;
        --ita-colors-neutral-500: #9893a5 !important;
        --ita-colors-neutral-600: #8b86a0 !important;
        --ita-colors-neutral-700: #797593 !important;
        --ita-colors-neutral-800: #655d82 !important;
        --ita-colors-neutral-900: #575279 !important;
        --ita-colors-primary-100: #f5f0fa !important;
        --ita-colors-primary-200: #ece3f5 !important;
        --ita-colors-primary-300: #ddd0eb !important;
        --ita-colors-primary-400: #bda8d4 !important;
        --ita-colors-primary-500: #907aa9 !important;
        --ita-colors-primary-600: #7a6493 !important;
        --ita-colors-primary-700: #685284 !important;
        --ita-colors-primary-800: #544172 !important;
        --ita-colors-primary-900: #42315e !important;
        --ita-colors-success-100: #ebf4f2 !important;
        --ita-colors-success-500: #56949f !important;
        --ita-colors-success-900: #2b5d66 !important;
        --ita-colors-warning-100: #fcf0e1 !important;
        --ita-colors-warning-500: #ea9d34 !important;
        --ita-colors-warning-900: #8e601d !important;
        --ita-colors-danger-100: #f7e4e8 !important;
        --ita-colors-danger-500: #b4365a !important;
        --ita-colors-danger-900: #751f3b !important;
    }
}