@charset "UTF-8";

/**********************
 * Window Decorations *
 *********************/

decoration {
	$shadow: rgba(0, 0, 0, 0.5);

	//border: 1px solid transparent;
	border-radius: $window-border-radius $window-border-radius 0 0;
	border-width: 0px;
	box-shadow: 0px 0px 16px $shadow,
		0px 2px 8px scale-color($shadow, $alpha: -40%);

	/* this is used for the resize cursor area */
	margin: 10px;

	.maximized &,
	.fullscreen &,
	.tiled & {
		border-radius: 0;
	}
	.popup & {
		border-radius: $r;
		box-shadow: 0px 3px 10px -4px rgba(0, 0, 0, 0.27),
					0px 5px 8px -4px rgba(0, 0, 0, 0.17);
	}
	// server-side decorations as used by mutter
	.ssd & {
		box-shadow: 0 2px 6px 1px rgba(0, 0, 0, 0.1);
	}
	.csd & {
		border-radius: $window-border-radius;
		&.popup {
			box-shadow: 0px 3px 10px -4px rgba(0, 0, 0, 0.27),
						0px 5px 8px -4px rgba(0, 0, 0, 0.17);
		}
		&.tooltip {
			box-shadow: none;
		}
		&.message-dialog {
			box-shadow: 0 2px 6px 1px rgba(0, 0, 0, 0.5);
		}
	}
	.solid-csd & {
		border-radius: 0;
		margin: 0;
		padding: 0px;
		border: 5px solid gtk("@theme_titlebar_background");
		background-color: gtk(
			"@theme_titlebar_background_light"
		);
		box-shadow: none;
	}
}

dialog.solid-csd,
window.solid-csd {
	headerbar.titlebar,
	paned.titlebar,
	.titlebar,
	paned.titlebar headerbar {
		border-radius: 0;
	}
}

dialog,
window {
	headerbar.titlebar {
		min-height: 46px;
	}
	headerbar,
	.titlebar {
		&.default-decoration button.titlebutton {
			padding: 1px;
			min-height: 18px;
			min-width: 18px;
			margin: 0;
		}
		$titlebutton-size: 18px 18px;
		button.titlebutton {
			image {
				color: transparent;
			}

			&.close {
				border-image: none;
				box-shadow: none;
				background-position: center;
				background-repeat: no-repeat;
				background-size: $titlebutton-size;
				background-image: -gtk-recolor(
					url("../assets/breeze-close-symbolic.svg"),
					color gtk("@theme_text_color")
				);
				-gtk-icon-source: none;
			}
			&.close:hover {
				border-color: transparent;
				background-color: transparent;
				background-image: -gtk-recolor(
					url("../assets/breeze-close-hover-symbolic.svg")
				);
			}
			&.close:active {
				border-color: transparent;
				background-color: transparent;
				background-image: -gtk-recolor(
					url("../assets/breeze-close-active-symbolic.svg")
				);
			}
			&.close:backdrop {
				border-color: transparent;
				background-color: transparent;
				background-image: -gtk-recolor(
					url("../assets/breeze-close-symbolic.svg")
				);
			}

			&.maximize {
				border-image: none;
				box-shadow: none;
				background-position: center;
				background-repeat: no-repeat;
				background-size: $titlebutton-size;
				background-image: -gtk-recolor(
					url("../assets/breeze-maximize-symbolic.svg")
				);
			}
			&.maximize:hover {
				border-color: transparent;
				background-color: transparent;
				background-image: -gtk-recolor(
					url("../assets/breeze-maximize-hover-symbolic.svg")
				);
			}
			&.maximize:active {
				border-color: transparent;
				background-color: transparent;
				background-image: -gtk-recolor(
					url("../assets/breeze-maximize-active-symbolic.svg")
				);
			}
			&.maximize:backdrop {
				border-color: transparent;
				background-color: transparent;
				background-image: -gtk-recolor(
					url("../assets/breeze-maximize-symbolic.svg")
				);
			}

			&.minimize {
				border-image: none;
				box-shadow: none;
				background-position: center;
				background-repeat: no-repeat;
				background-size: $titlebutton-size;
				background-image: -gtk-recolor(
					url("../assets/breeze-minimize-symbolic.svg")
				);
			}
			&.minimize:hover {
				border-color: transparent;
				background-color: transparent;
				background-image: -gtk-recolor(
					url("../assets/breeze-minimize-hover-symbolic.svg")
				);
			}
			&.minimize:active {
				border-color: transparent;
				background-color: transparent;
				background-image: -gtk-recolor(
					url("../assets/breeze-minimize-active-symbolic.svg")
				);
			}
			&.minimize:backdrop {
				border-color: transparent;
				background-color: transparent;
				background-image: -gtk-recolor(
					url("../assets/breeze-minimize-symbolic.svg")
				);
			}
		}

		.maximized & {
			button.titlebutton {
				&.maximize {
					border-image: none;
					box-shadow: none;
					background-position: center;
					background-size: $titlebutton-size;
					background-repeat: no-repeat;
					background-image: -gtk-recolor(
						url("../assets/breeze-maximized-symbolic.svg")
					);
				}
				&.maximize:hover {
					border-color: transparent;
					background-color: transparent;
					background-image: -gtk-recolor(
						url("../assets/breeze-maximized-hover-symbolic.svg")
					);
				}
				&.maximize:active {
					border-color: transparent;
					background-color: transparent;
					background-image: -gtk-recolor(
						url("../assets/breeze-maximized-active-symbolic.svg")
					);
				}
				&.maximize:backdrop {
					border-color: transparent;
					background-color: transparent;
					background-image: -gtk-recolor(
						url("../assets/breeze-maximized-symbolic.svg")
					);
				}
			}
		}
	}

	headerbar.selection-mode button.titlebutton,
	.titlebar.selection-mode button.titlebutton {
		text-shadow: none;
		&:backdrop {
			-gtk-icon-shadow: none;
		}
	}
}
