:root{
    --black:#161515;
    --white:#F5F5F5;
    --red:#632024;
    --light-grey:rgb(223, 223, 223);
    --dark-grey:rgb(129, 129, 129);
    --blauw:#5d6e95;
  

    --box-shadow-light:rgba(17, 12, 46, 0.15);
    --box-shadow-dark:rgba(255, 255, 255, 0.15);

    --color-main: light-dark(var(--black),var(--white));
    --color-secondary: light-dark(var(--white), var(--black));
    --light-dark-red:light-dark(var(--red),#924549);
    --box-shadow:light-dark(var(--box-shadow-light),var(--box-shadow-dark));
    --border:light-dark(white,rgb(48, 48, 48));


    --disabled:light-dark(var(--light-grey),var(--dark-grey));
  }



@media (prefers-color-scheme: dark) {
    :root {
      color-scheme: dark;
      
      .ervaring{
        box-shadow: inset 0px 0px 11px var(--box-shadow);
      }
    }
  }
  
  @media (prefers-color-scheme: light) {
    :root {
      color-scheme: light;
      .ervaring{
        box-shadow: 0px 0px 11px var(--box-shadow);
      }
    }
   
  }