@charset "UTF-8";

/*
theme colors
... == default
theme-1 == pink
theme-2 == purple
*/

/**************************/
/**************************/
/********** VARS **********/
/**************************/
/**************************/

body {
	/* standard */
	--dark-color: rgb(25,25,5);
	--grey-color: rgb(89,89,84);
	--light-color: rgb(247,247,245);
	--bright-color: rgb(255,255,255);
	--gold-color: rgb(151, 128, 73);
	
	/* pink == default (default) */
	--primary-color:rgb(252, 50, 236);

	/* purple == secondary (magazine) */
	--secondary-color: rgb(130, 48, 255);
	--secondary-txt-color:rgb(83,111,147);
	--secondary-alt-color:rgb(244, 238, 253);
	--secondary-alt-txt-color:rgb(130, 48, 255);

	/* light purple == tertiary (territoire) */
	--tertiary-color: rgb(173, 31, 255);

	/* actions */
	--action-color: rgb(243, 227, 215);
	--action-color-2: rgb(255, 182, 239);
	--action-color-3: rgb(255, 100, 102);
	
	/* magazine */
	--post-color:rgb(130, 48, 255); /* + white txt */
	--post-color-2:rgb(235, 255, 0);
	--post-color-3:rgb(252, 50, 236); /* == --primary-color */
}

/***********************************/
/***********************************/
/********** CURRENT COLOR **********/
/***********************************/
/***********************************/

/*
default		== primary
secondary	== magazine
territoire	== tertiary
*/

body {
	--theme-color: var(--primary-color);
}
body.alt {
	--theme-color: var(--secondary-color);
}
body.territoire {
	--theme-color: var(--tertiary-color);
}

/****************************/
/********** COLORS **********/
/****************************/

/* styles */
h1,
.description,
/* navigations */
/*
#primary a:hover span, 
#primary a.active span,
nav.contextual a:hover,
nav.contextual a.active,
#contextual a:hover,
#contextual a.active,
.link:hover,
*/
/* grids */
.grid.events .event-dates,
.grid.events .event-type,
.grid.events .event-link:hover .event-title,
.grid.list.events .buttons a:hover {
	color:var(--theme-color);
}

/***************************/
/********** FORMS **********/
/***************************/

* {
	-webkit-tap-highlight-color: rgba(255,20,147, .25);
}
body.alt * {
	-webkit-tap-highlight-color: rgba(83,111,147,.25);
}
body.territoire * {
	-webkit-tap-highlight-color: rgba(173, 31, 255,.25);
}

/*****************************/
/********** CONTENT **********/
/*****************************/

/* TODO !!!! */

main > .collapsible h2:not(.event-title),
main > .columns h2:not(.event-title),
section h2:not(.event-title) {
	/*color:var(--primary-color);*/
	color:var(--theme-color);
}
body.alt section h2,
.post h2 {
	color:var(--secondary-color);
}

/**************************/
/********** POST **********/
/**************************/

body.alt.single main {
	color:var(--secondary-txt-color);
}
.post {
	color:var(--secondary-color);
}
.post .thumbnail a:before {
	background:var(--secondary-color);
}

/*********************************/
/********** TEXT COLORS **********/
/*********************************/

.has-bright-color,
section h2.has-bright-color {
	color:var(--bright-color);
}
.has-light-color,
section h2.has-light-color {
	color:var(--light-color);
}
.has-dark-color,
section h2.has-dark-color {
	color:var(--dark-color);
}
.has-primary-color,
section h2.has-primary-color {
	color:var(--primary-color);
}
.has-secondary-color,
section h2.has-secondary-color {
	color:var(--secondary-color);
}
.has-tertiary-color,
section h2.has-tertiary-color {
	color:var(--tertiary-color);
}

.has-theme-color,
section h2.has-theme-color {
	color:var(--theme-color);
}

/***************************************/
/********** BACKGROUND COLORS **********/
/***************************************/

body.alt .has-dark-background-color,
.has-dark-background-color {
	color:var(--bright-color);
	background:var(--dark-color);
}
body.alt .has-light-background-color,
.has-light-background-color {
	background:var(--light-color);
}
body.alt .has-bright-background-color,
.has-bright-background-color {
	background:var(--bright-color);
}
body.alt .has-primary-background-color,
.has-primary-background-color {
	background:var(--primary-color);
}
body.alt .has-secondary-background-color,
.has-secondary-background-color {
	color:var(--bright-color);
	background:var(--secondary-color);
}
body.alt .has-secondary-alt-background-color,
.has-secondary-alt-background-color {
	color:var(--secondary-alt-txt-color);
	background:var(--secondary-alt-color);
}

/***********************************/
/***********************************/
/********** ACCESSIBILITY **********/
/***********************************/
/***********************************/

/********** CONTRASTED **********/

body.contrasted {
	/* pink == default */
	--primary-color:#625932; /*#AD0000;*/ /*var(--dark-color);*/
	--theme-color:#625932;
	
	/* purple == secondary */
	--secondary-color: var(--dark-color);
	--secondary-color: #330080;
	--secondary-txt-color:var(--dark-color);
	--secondary-alt-color:var(--light-color);
	--secondary-alt-txt-color:var(--dark-color);

	/* actions */
	--action-color: var(--light-color);
	--action-color-2:var(--light-color);
	--action-color-3:var(--light-color);

	/* magazine */
	--post-color:var(--dark-color); /* + white txt */
	--post-color-2:var(--light-color);
	--post-color-3:var(--dark-color); /* == --primary-color */
}
body.alt {
	--text-color:rgb(83,111,147);
}

/********** GRID **********/

body.contrasted .grid.events:not(.list) .item.is-colored-3 .thumbnail a:before {
	background: var(--primary-color);
}
body.contrasted .grid.posts:not(.list) .item.is-colored-3 {
	color:var(--bright-color);
}

/********** BANNER **********/

body.contrasted .banner .background:before {
	content:"";
	position:absolute;
	z-index: 10;
	pointer-events: none;
	background:var(--dark-color);
	opacity:.33;
}
body.contrasted .banner .button {
	color:var(--bright-color);
}