:root {
    --ingredify--primary: #3A86FF;
    --ingredify--primary--lighter: #85B5FF;
    --ingredify--primary--darker: #ffffff;
    --ingredify--secondary: #06D6A0;
    --ingredify--secondary--lighter: #7AF4D6;
    --ingredify--secondary--darker: #ffffff;
    --ingredify--tertiary: #E69A44;
    --ingredify--tertiary--lighter: #F0C18E;
    --ingredify--tertiary--darker: #ffffff;


    --var--red: #C3384E;
    --var--red--dark: #AC2A3E;
    --var--grape: #D85866;
    --var--grape--dark: #C64855;
    --var--orange: #E4744E;
    --var--orange--dark: #D35E39;
    --var--yellow: #F1D72D;
    --var--yellow--dark: #E6C404;
    --var--straw: #DCD714;
    --var--straw--dark: #D5CB00;
    --var--grass: #A6DB4B;
    --var--grass--dark: #93C72D;
    --var--green: #62D15B;
    --var--green--dark: #5AC053;
    --var--mint: #74D2AB;
    --var--mint--dark: #65BD98;
    --var--teal: #ACCECD;
    --var--teal--dark: #8AB0B1;
    --var--sky: #7CBAED;
    --var--sky--dark: #6CA7DE;
    --var--blue: #7B90F4;
    --var--blue--dark: #6B7BE5;
    --var--lavender: #AF84F6;
    --var--lavender--dark: #996AE6;
    --var--purple: #825AC0;
    --var--purple--dark: #6D40AE;
    --var--pink: #DD81C6;
    --var--pink--dark: #C96AB3;
    --var--background: #F3F3F4;
    --var--background--dark: #E7E9EE;
    --var--light: #CFCFDC;
    --var--light--dark: #ADB1BF;
    --var--grey: #696C7A;
    --var--grey--dark: #464A55;
    --var--dark: #3D3C3F;
    --var--dark--dark: #323135;
    --var--app--bar--height: 52px;
    --var--Blue1: #000075;
    --var--Blue2: #0000A3;
    --var--Blue3: #0000D1;
    --var--Blue4: #0000FF;
    --var--Blue5: #2E2EFF;
    --var--Blue6: #5C5CFF;
    --var--Blue7: #8A8AFF;
    --var--DartBlue1: #00008B;
    --var--DartBlue2: #0000B9;
    --var--DartBlue3: #0000E7;
    --var--DartBlue4: #1616FF;
    --var--DartBlue5: #4444FF;
    --var--DartBlue6: #7272FF;
    --var--DartBlue7: #9F9FFF;
    --var--White1: #757575;
    --var--White2: #8C8C8C;
    --var--White3: #A3A3A3;
    --var--White4: #BABABA;
    --var--White5: #BABABA;
    --var--White6: #E8E8E8;
    --var--White7: #FFFFFF;
    --var--Orange1: #B76900;
    --var--Orange2: #E58300;
    --var--Orange3: #FF9A14;
    --var--Orange4: #FFAE42;
    --var--Orange5: #FFC270;
    --var--Orange6: #FFD59E;
    --var--Orange7: #FFE9CC;
    --var--gradient--blue: linear-gradient(140deg,rgba(0, 0, 117, 1) 0%, rgba(0, 0, 209, 1) 68%, rgba(92, 92, 255, 1) 100%);

    --var--navbar--height: 56px;
}
.bg-red {
    background-color: var(--var--red);
}

.txt-red {
    color: var(--var--red);
}

.bg-grape {
    background-color: var(--var--grape);
}

.txt-grape {
    color: var(--var--grape);
}

.bg-orange {
    background-color: var(--var--orange);
}

.txt-orange {
    color: var(--var--orange);
}

.bg-yellow {
    background-color: var(--var--yellow);
}

.txt-yellow {
    color: var(--var--yellow);
}

.bg-straw {
    background-color: var(--var--straw);
}

.txt-straw {
    color: var(--var--straw);
}

.bg-grass {
    background-color: var(--var--grass);
}

.txt-grass {
    color: var(--var--grass);
}

.bg-green {
    background-color: var(--var--green);
}

.txt-green {
    color: var(--var--green);
}

.bg-mint {
    background-color: var(--var--mint);
}

.txt-mint {
    color: var(--var--mint);
}

.bg-teal {
    background-color: var(--var--teal);
}

.txt-teal {
    color: var(--var--teal);
}

.bg-sky {
    background-color: var(--var--sky);
}

.txt-sky {
    color: var(--var--sky);
}

.bg-blue {
    background-color: var(--var--blue);
}

.txt-blue {
    color: var(--var--blue);
}

.bg-lavender {
    background-color: var(--var--lavender);
}

.txt-lavender {
    color: var(--var--lavender);
}

.bg-purple {
    background-color: var(--var--purple);
}

.txt-purple {
    color: var(--var--purple);
}

.bg-pink {
    background-color: var(--var--pink);
}

.txt-pink {
    color: var(--var--pink);
}

.bg-background {
    background-color: var(--var--background);
}

.txt-background {
    color: var(--var--background);
}

.bg-light {
    background-color: var(--var--light);
}

.txt-light {
    color: var(--var--light);
}

.bg-grey {
    background-color: var(--var--grey);
}

.txt-grey {
    color: var(--var--grey);
}

.bg-dark {
    background-color: var(--var--dark);
}

.txt-dark {
    color: var(--var--dark);
}

.txt-white {
    color: #ffffff;
}

.bg-brand-blue{
    background: linear-gradient(90deg, #4b6cb7 0%, #182848 100%);
}

.scroll-y{
    overflow-y: auto;
}
.full-height{
    height: 100%;
}
.vh-100{
    height: 100vh;
}
.vh-100-min{
    min-height: 100vh;
}

.vp-100{
    height: calc(100vh - var(--var--app--bar--height));
}
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: #334155; /* Zacht donkergrijs in plaats van puur zwart */
}

/* De 'soft' badge stijl van moderne API sites */
.bg-primary-soft {
    background-color: #e0e7ff;
    padding: 0.5rem 1rem;
    border-radius: 50px;
}

/* Voor de code preview */
pre {
    font-family: 'Fira Code', 'Courier New', Courier, monospace;
    font-size: 0.9rem;
}

/* De schaduw die OpendataAPI vaak gebruikt */
.shadow-sm {
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24) !important;
}

/* Zorg dat de secties mooi wit/lichtgrijs afwisselen */
.bg-light {
    background-color: #f8fafc !important;
}

.bg-sitemap{
    background: linear-gradient(353deg,rgba(240, 193, 142, 1) 0%, rgba(230, 154, 68, 1) 67%, rgba(199, 106, 0, 1) 100%);
}

.btn-primary{
    background-color: var(--ingredify--primary) !important;
    color: #fff;
}

.txt-primary{
    color: var(--ingredify--primary) !important;
}

.bg-primary-gradient{
    background: linear-gradient(180deg,rgba(58, 134, 255, 1) 0%, rgba(133, 181, 255, 1) 100%);
}

.bg-section-slope{
    background: linear-gradient(237deg,rgba(58, 134, 255, 1) 0%, rgba(133, 181, 255, 1) 45%, rgba(255, 255, 255, 1) 45%);
}

.bg-landing{
    background-image: url(../res/stock/landing_gen_1.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-clip: border-box;
}

button.navbar-toggler{
    border-width:0;
}