/*
*   plaats deze file in /css/darkmode-css.css
*  
*  plaats onderstaande code in functions.php
*
*
/* ============== BEGIN benodigde Files voor de page ============================= */

/* connect naar de css file voor page layout */ 
/*   <<<<<<<<<<<<<  verwijder deze regel voor uncomment <<<<<<<<<<<<<<<<<<<<<<
function mijn_theme_scripts(){
	wp_enqueue_style( 'kleurencss', get_template_directory_uri().'/css/darkmode-css.css');

}
add_action( 'wp_enqueue_scripts', 'mijn_theme_scripts' );

/* ============== EINDE benodigde Files voor de page ============================= */

.darkmode-gekozen {
    box-shadow: inset 4px 8px 15px var(--darkmode-css-box-shadow);
}

img{
    filter: brightness(var(--image-lichtdonker)); /* maak imag donkerder < 1 donkerder */
}

#darkmode-kop {
    visibility: visible;
    height: calc(var(--headerbalk-klein) * 0.6);
    top: 0px;
    left: auto;
    right: 5px;
    position: fixed;
    z-index: 99;
    width: 115px;
    display:flex;
}

#darkmode-button {
	width: 60px;
	height: 35px;
	background-color: var(--darkmode-css-button-bg);
	border-style: solid;
	padding: 2px 5px 2px 5px;
	margin-left: 8px;
	margin-top: 3px;
	border-radius: 10px;
}

#darkmode-imgzonmaan {
	width: 65px;
}

#darkmode-div {
	position: absolute;
	border: 4px solid black;
  	width: 230px;
	top: 40px;
	right: 10px;
	background-color:var(--darkmode-titel-bg);
	display: none;
	border-radius: 10px;
}

#darkmode-div p{
    color: var(--darkmode-pagina-text);
    padding: 5px;
}

#darkmode-div .button {
	background-color: var(--darkmode-knop-bg);
	border: 4px solidblack;
	border-radius: 10px;
	color: #fff;
	padding: 5px;
	text-align: center;
	text-decoration: none;
	font-size: 16px;
	cursor: pointer;
	width: 175px;
	margin:5px auto;
	display: block;
}