/* Wipe all theming CSS to start with */

@import url("resource:///com/endlessm/sdk/css/reset.css");

/* Endless window top bar */

.top-bar {
    background-image: -gtk-gradient(linear, center top, center bottom,
        from(#464646), to(#1e1e1e));
}

.top-bar:backdrop {
    background-image: -gtk-gradient(linear, center top, center bottom,
        from(#282828), to(#1e1e1e));
}

.top-bar .button {
    border-radius: 2px;
    color: #8c8c8c;
    icon-shadow: 0px -1px alpha(black, 0.25);
}

.top-bar .button:backdrop {
    color: #646464;
}

.top-bar .button:hover {
    color: #dcdcdc;
    icon-shadow: 0px -1px alpha(black, 0.35);
    background-image: -gtk-gradient(linear, left bottom, left top,
        color-stop(0.98, rgb(131, 131, 131)),
        color-stop(0.95, rgb(108, 108, 108)),
        color-stop(0, rgb(68, 68, 68)));
}

.top-bar .button:active {
    color: #787878;
    icon-shadow: none;
    background-image: -gtk-gradient(linear, left bottom, left top,
        color-stop(0.98, rgb(79, 79, 79)),
        color-stop(0.95, rgb(71, 71, 71)),
        color-stop(0, rgb(67, 67, 67)));
}

/* Endless action button */

EosActionButton {
	background-color: transparent;
	border-style: solid;
	border-image: none;
	margin: 10px;

	border-radius: 40px;
	border-width: 8px;
}

EosActionButton GtkLabel {
	font-family: BentonSans, sans-serif;
	font-weight: normal;
	font-size: 11px;
}

/* Endless action button: sizes */

EosActionButton.primary {
	border-radius: 40px;
	border-width: 8px;
}

EosActionButton.secondary {
	border-radius: 30px;
	border-width: 6px;
}

EosActionButton.tertiary {
	border-radius: 23px;
	border-width: 5px;
}

EosActionButton.quaternary {
	border-radius: 17px;
	border-width: 4px;
}

/* Endless action button: light background */

/* normal */
EosActionButton,
EosActionButton:selected,
EosActionButton:focused {
	border-color: alpha(#323232, 0.5);
	box-shadow: 1px 1px 1px alpha(black, 0.8) inset,
	            0px -1px 1px alpha(white, 0.65);
}

EosActionButton GtkImage,
EosActionButton GtkImage:selected,
EosActionButton GtkImage:focused {
	color: alpha(#323232, 0.5);
}

EosActionButton GtkLabel,
EosActionButton GtkLabel:selected,
EosActionButton GtkLabel:focused {
	color: alpha(#323232, 0.65);
}

/* hover */
EosActionButton:hover {
	border-color: alpha(#323232, 0.8);
	box-shadow: 1px 1px 1px alpha(black, 0.8) inset;
}

EosActionButton GtkImage:hover {
	color: alpha(#282828, 0.8);
}

EosActionButton GtkLabel:hover {
	color: alpha(#1E1E1E, 0.8);
}

/* pressed */
EosActionButton:active {
	border-color: alpha(#323232, 0.65);
	box-shadow: 1px 1px 1px alpha(black, 0.8) inset;
}	

EosActionButton GtkImage:active {
	color: alpha(#282828, 0.65);
}

EosActionButton GtkLabel:active {
	color: alpha(#1E1E1E, 0.8);
}

/* insensitive, just in case */
EosActionButton:insensitive,
EosActionButton:inconsistent {
	border-color: alpha(#888888, 0.50);
	box-shadow: none;
}

/* Endless action button: dark background */

/* normal */
.dark EosActionButton,
.dark EosActionButton:selected,
.dark EosActionButton:focused {
	border-color: alpha(#E6E6E6, 0.5);
	box-shadow: 1px 1px 1px alpha(black, 0.95) inset,
	            0px -1px 1px alpha(white, 0.5) inset;
}

.dark EosActionButton GtkImage,
.dark EosActionButton GtkImage:selected,
.dark EosActionButton GtkImage:selected,
.dark EosActionButton GtkLabel,
.dark EosActionButton GtkLabel:selected,
.dark EosActionButton GtkLabel:focused {
	color: alpha(#E6E6E6, 0.5);
}

/* hover */
.dark EosActionButton:hover {
	border-color: alpha(white, 0.8);
	box-shadow: 1px 1px 1px alpha(black, 0.95) inset,
	            0px -1px 1px alpha(white, 0.85) inset;
}

.dark EosActionButton GtkImage:hover,
.dark EosActionButton GtkLabel:hover {
	color: alpha(white, 0.8);
}

/* pressed */
.dark EosActionButton:active {
	border-color: alpha(white, 0.65);
	box-shadow: 1px 1px 1px alpha(black, 0.95) inset,
	            0px -1px 1px alpha(white, 0.7) inset;
}	

.dark EosActionButton GtkImage:active {
	color: alpha(white, 0.65);
}

.dark EosActionButton GtkLabel:active {
	color: alpha(white, 0.8);
}