/**
 * This file provides styles for the cookies popup
 */

#cookiebanner {
	position: fixed;
	left: 0;
	width: 100%;
	color: #333;
	background-color: #EEE;
	z-index: 1000;
	padding: 10px;
	box-sizing: border-box;
	box-shadow: 0px 0px 10px #666;
}

#cookiebanner.cb_top { top: 0; }

#cookiebanner.cb_bottom { bottom: 0; }

#cookiebanner p {
	margin:		0 auto;
	max-width:	910pt;
}

#cookiebanner .cb_info {
	margin-bottom:	1em;
}
#cookiebanner .cb_icon {
	float: left;
	width: 64px;
	height: 64px;
	background: transparent url('images/cookie.svg') no-repeat center;
	background-size: 64px;
	margin: 8px 16px 8px 2px;
}

#cookiebanner .cb_action {
	margin-top:	6pt;
	display:	grid;
	grid-template-columns: 1fr 1fr;
	grid-column-gap: 8pt;
	column-gap: 8pt;
	justify-items: center;
}
#cookiebanner .cb_action > * {
	font-size:		12pt;
}

#cookiebanner .cb_action button {
	background-color:	rgba(0,0,0,0.1);
	background-image:	none;
	border: #666 solid 2pt;
	color:	#333;
	padding: .25em .5em;
	cursor: pointer;
}

/* dark mode overrides */
@media (prefers-color-scheme: dark) {
	body.darkmode #cookiebanner {
		color: #CCC;
		background-color: #39393D;
		box-shadow: transparent none 0;
	}
	body.darkmode #cookiebanner .cb_action button {
		background-color:	rgba(0,0,0,0.25);
		border-color: 		#CCC;
		color:				#CCC;
	}
}