:root {
    --scalar-custom-header-height: 50px;
    font-family: 'Inter', sans-serif !important;
    --scalar-font: 'Inter', sans-serif !important;

}
.custom-header,
.custom-header nav {
    display: flex;
    align-items: center;
    gap: 18px;
}

.custom-header {
    display: flex;
    align-items: center;
    gap: 12px;

    padding: 0 20px;
    height: 60px;
    background-color: #FEFFB1;
    border-bottom: 1px solid #FDFF84;
}

.custom-header b {
    color: #31524D;
    font-family: 'Inter', sans-serif;
    font-size: 18px;
    font-weight: 600;
}



:root, .light-mode, .dark-mode {

    --scalar-color-2: #1C2F2C !important;      /* Secondary Action Color */
    --scalar-color-3: #42605B !important;      /* Tertiary */
    --scalar-color-accent: #121E1C !important; /* Accents */

    /* BACKGROUNDS */
    --scalar-background-1: #FFFFFF !important; /* Main Page Background */
    --scalar-background-2: #E9ECEB !important; /* Sidebar Background */
    --scalar-background-3: #E9ECEB !important; /* Code Block Background */

    --scalar-border-color: #FAFBFB !important; /* Border Color */

    --scalar-color-blue: #858502 !important; /* overwrite with our colors for code */
    --scalar-color-orange: #FF9A02 !important; /* overwrite with our colors for code */
    --scalar-color-purple: #42605B !important; /* overwrite with our colors for code */
}