.window-frame {
	border-style: none;
	border-radius: 2px 2px 0 0;
	box-shadow: 0 3px 7px 1px alpha(black, 0.7),
				0 0 0 1px mix(shade($titlebar_bg_color, 0.7), $titlebar_fg_color, 0.21);

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

	&:backdrop {
		box-shadow: 0 3px 5px 1px alpha(black, 0.5),
					0 0 0 1px mix(shade($titlebar_bg_color, 0.7), $titlebar_fg_color, 0.12);
	}

	&.tiled { border-radius: 0; }

	&.csd {
		&.popup {
			border-radius: 0;
			box-shadow: 0 1px 2px alpha(black, 0.8),
						0 0 0 1px mix(shade($titlebar_bg_color, 0.7), $titlebar_fg_color, 0.21);
		}

		&.tooltip {
			border-radius: 2px;
			box-shadow: none;
		}

		&.message-dialog {
			border-radius: 2px;
			box-shadow: 0 1px 2px alpha(black, 0.8),
						0 0 0 1px mix(shade($titlebar_bg_color, 0.7), $titlebar_fg_color, 0.21);
		}
	}
}