<?php

add_color_rule( 'bg', '#000000', array(
	array( 'body', 'background-color' ),
	array( '.monster', 'border-color', '-3' ),
) );

add_color_rule( 'fg1', '#999999', array(
	array( '.edit-link a', 'background-color' ),
	array( '.edit-link a:hover', 'background-color', .7 ),
	array( 'a:hover,a:focus,a:active', 'color', '#ffffff' ),
	array( 'h3', 'color', '#ffffff' ),
 	array( 'h6', 'color', '#ffffff' ),
),
__( 'Link Hover', 'monster' ) );

add_color_rule( 'fg2', '#666666', array(
	array( 'h1', 'color', '#ffffff' ),
 	array( 'h4', 'color', '#ffffff' ),
 	array( '.entry-title, .entry-title a', 'color', '#ffffff' ),
 	array( '.tag-links a', 'background-color' ),
 	array( '.tag-links a:hover', 'background-color', .7 ),
 	array( '.comments-title', 'color', '#ffffff' ),
 	array( '.error404 .widgettitle', 'color', '#ffffff' ),
 	array( '.widget-title', 'color', '#ffffff' ),
 	array( 'blockquote::before', 'color', .05 ),
),
__( 'Post Titles', 'monster' ) );

add_color_rule( 'link', '#a5cb55', array(
	array( '#main', 'border-color' ),
	array( '.goop', 'background-color' ),
	array( '.site-title a, .site-title a:visited', 'color', 'bg' ),
	array( '#colophon a, #colophon a:visited', 'color', 'bg' ),
	array( '.main-navigation li.current_page_item a,.main-navigation li.current-menu-item a', 'color', 'bg' ),
	array( '.menu-toggle', 'background-color' ),
	array( '.cat-links a', 'background-color' ),
	array( '.cat-links a:hover', 'background-color', .7 ),
 	array( 'h2', 'color', '#ffffff' ),
 	array( 'h5', 'color', '#ffffff' ),
 	array( 'th', 'color', '#000000' ),
 	array( 'a', 'color', '#ffffff' ),
 	array( 'a:visited', 'color', '#ffffff' ),
 	array( '.page-title', 'color', '#ffffff' ),
 	array( '#flickr_badge_uber_wrapper a:hover,#flickr_badge_uber_wrapper a:link,#flickr_badge_uber_wrapper a:active,#flickr_badge_uber_wrapper a:visited', 'color', '#ffffff' ),
),
__( 'Links & Goop', 'monster' ) );

add_color_rule( 'txt', '#000000', array(

) );

add_color_rule( 'extra', '#ffffff', array(
	array( '#masthead hgroup', 'color', 'bg' ),
 	array( '.menu-toggle', 'color', 'link' ),
	array( '.cat-links a, .cat-links a:hover, .cat-links a:visited', 'color', 'link' ),
	array( '.tag-links a, .tag-links a:hover, .tag-links a:visited', 'color', 'fg2' ),
	array( '.edit-link a, .edit-link a:hover, .edit-link a:visited', 'color', 'fg1' ),
) );

add_color_rule( 'extra', '#999999', array(
	array( '#colophon', 'color', 'bg' ),
	array( '.main-navigation a, .main-navigation a:hover, .main-navigation a:visited', 'color', 'bg' ),
	array( '.site-description', 'color', 'bg' ),
) );

add_color_rule( 'extra', '#666666', array(
	array( '.main-navigation', 'border-color', 'bg' ),
	array( '.main-navigation li:hover > a', 'color', 'bg' ),
	array( '.main-navigation ul ul li:hover > a', 'color', '#ffffff' ),
) );


/* Adding extra CSS to invert the "goop" area so we can add custom colors behind it. */

add_theme_support( 'custom_colors_extra_css', 'themename_extra_css' );
function themename_extra_css() { ?>
	.goop {
		background-color: #a5cb55;
		background-image: url(<?php echo get_template_directory_uri(); ?>/images/goop-inverse.png);
	}
	@media 	only screen and (-moz-min-device-pixel-ratio: 1.5),
		only screen and (-o-min-device-pixel-ratio: 32),
		only screen and (-webkit-min-device-pixel-ratio: 1.5),
		only screen and (min-device-pixel-ratio: 1.5) {

		.goop {
			background-image: url(<?php echo get_template_directory_uri(); ?>/images/goop-inverse-2x.png);
			background-size: auto 117px;
		}
	}
<?php
}