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

#cookiebanner {
	position: fixed;
	left: 0;
	width: 100%;
	color: @ini_text;
	background-color: @ini_background_alt;
	z-index: 1000;
	padding: 10px;
	box-sizing: border-box;
	box-shadow: 0px 0px 10px #666;
	border-top: @ini_border solid 1px;
}

#cookiebanner.cb_top { top: 0; }

#cookiebanner.cb_bottom { bottom: 0; }

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

#cookiebanner .cb_info {
	margin-bottom:	6pt;
}
#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: @ini_border solid 2pt;
	color:	@ini_text;
	padding: .25em .5em;
	cursor: pointer;
}

/* dark mode overrides */
@media (prefers-color-scheme: dark) {
	body.darkmode #cookiebanner {
		color: @ini_text_dark;
		background-color: @ini_background_dark;
		box-shadow: 0 0 10px @ini_background_site_dark;
		border-top-color: @ini_border_dark;
	}
	body.darkmode #cookiebanner .cb_action button {
		background-color:	rgba(0,0,0,0.25);
		border-color: 		@ini_border_dark;
		color:				@ini_text_dark;
	}
}