@charset "UTF-8";

/*****************
 * Notebooks and *
 * Tabs          *
 *****************/
/*************
  * Notebooks *
  *************/
notebook {
	&.frame {
		border: none;
		padding: 0px;
		box-shadow: inset 0px 0px 0px 1px gtk("@borders");
	}

	> header {
		padding: 0px;
		border: none;
		background-color: gtk("@theme_bg_color");
		//box-shadow: inset 0 -1px gtk("@borders");

		&.top {
			box-shadow: inset 0 -1px gtk("@borders"); // border
			&:backdrop {
				box-shadow: inset 0 -1px gtk("@unfocused_borders");
			}
		}
		&.bottom {
			box-shadow: inset 0 1px gtk("@borders");
			&:backdrop {
				box-shadow: inset 0 1px gtk("@unfocused_borders");
			}
		}
		&.right {
			box-shadow: inset 1px 0 gtk("@borders");
			&:backdrop {
				box-shadow: inset 1px 0 gtk("@unfocused_borders");
			}
		}
		&.left {
			box-shadow: inset -1px 0 gtk("@borders");
			&:backdrop {
				box-shadow: inset -1px 0 gtk("@unfocused_borders");
			}
		}
		&:backdrop {
			background-color: gtk("@theme_unfocused_bg_color");
		}

		tabs {
			margin: 0px;
		}

		@each $_tab, $_border,
			$_radius in (top, bottom, 3px 3px 0px 0px),
			(bottom, top, 0px 0px 3px 3px),
			(left, right, 3px 0px 0px 3px),
			(right, left, 0px 3px 3px 0px)
		{
			&.#{$_tab} {
				> tabs {
					> tab {
						padding: 4px 6px;
						border: 1px
							solid
							gtkalpha(gtk("@theme_fg_color"), 0.2);
						background-color: gtkalpha(
							gtk("@theme_fg_color"),
							0.2
						);
						border-radius: #{$_radius};
						border-#{$_border}-color: transparent;
						&:hover,
						&.prelight-page {
							background-color: gtkalpha(
								gtk("@theme_selected_bg_color"),
								0.2
							);
							border-color: gtkalpha(
								gtk("@theme_selected_bg_color"),
								0.2
							);
						}
						&:checked {
							border-color: gtk("@borders");
							border-#{$_border}-color: gtk(
								"@theme_bg_color"
							);
							background-color: gtk("@theme_bg_color");
							&:backdrop {
								border-color: gtk("@unfocused_borders");
								border-#{$_border}-color: gtk(
									"@theme_unfocused_bg_color"
								);
								background-color: gtk(
									"@theme_unfocused_bg_color"
								);
							}
						}
					}
				}
			}
		}

		@each $_tab, $_border,
			$_shadow1 in (top, right, -3px 0px 0px 0px),
			(bottom, right, -3px 0px 0px 0px),
			(left, bottom, 0px -3px 0px 0px),
			(right, bottom, 0px -3px 0px 0px)
		{
			&.#{$_tab} {
				> tabs {
					> tab {
						&.reorderable-page {
							border-width: 3px;
							border-style: solid;
							border-color: transparent;
							background-color: gtk("@theme_bg_color");
							background-clip: padding-box;
							border-#{$_border}-width: 1px;
							border-#{$_border}-color: gtk("@borders");
							box-shadow: inset
								#{$_shadow1}
								gtk("@theme_bg_color");
							&:hover,
							&.prelight-page {
								box-shadow: inset
										0px -3px
										0px
										0px
										gtkalpha(
											gtk("@theme_selected_bg_color"),
											0.2
										),
									inset $_shadow1 gtk("@theme_bg_color");
							}
							&:checked {
								box-shadow: inset
										0px -3px
										0px
										0px
										gtk("@theme_selected_bg_color"),
									inset $_shadow1 gtk("@theme_bg_color");
								&:backdrop {
									background-color: gtk(
										"@theme_unfocused_bg_color"
									);
									border-color: transparent;
									border-#{$_border}-color: gtk(
										"@unfocused_borders"
									);
									box-shadow: none;
								}
							}
							&:backdrop {
								background-color: gtk(
									"@theme_unfocused_bg_color"
								);
								border-#{$_border}-color: gtk(
									"@unfocused_borders"
								);
								box-shadow: none;
							}
						}
					}
				}
			}
		}

		&.top > tabs > arrow {
			@extend %notebook_vert_arrows;

			border-top-style: none;
		}

		&.bottom > tabs > arrow {
			@extend %notebook_vert_arrows;

			border-bottom-style: none;
		}

		@at-root %notebook_vert_arrows {
			margin-left: -5px;
			margin-right: -5px;
			padding-left: 4px;
			padding-right: 4px;

			&.down {
				-gtk-icon-source: -gtk-icontheme($arrow_left);
			}

			&.up {
				-gtk-icon-source: -gtk-icontheme($arrow_right);
			}
		}

		&.left > tabs > arrow {
			@extend %notebook_horz_arrows;

			border-left-style: none;
		}

		&.right > tabs > arrow {
			@extend %notebook_horz_arrows;

			border-right-style: none;
		}

		@at-root %notebook_horz_arrows {
			margin-top: -5px;
			margin-bottom: -5px;
			padding-top: 4px;
			padding-bottom: 4px;

			&.down {
				-gtk-icon-source: -gtk-icontheme($arrow_up);
			}

			&.up {
				-gtk-icon-source: -gtk-icontheme($arrow_down);
			}
		}

		> tabs > arrow {
			@include neobutton(toolbutton);

			min-height: 16px;
			min-width: 16px;
			border-radius: 0;

			&:hover:not(:active):not(:backdrop) {
				background-clip: padding-box;
				background-image: none;
				background-color: transparentize(white, 0.7);
				border-color: transparent;
				box-shadow: none;
			}
		}

		// colors the button like the label, overridden otherwise
		button.flat {
			padding: 0;
			margin: 4px;
			// FIXME: generalize .small-button?
			min-width: 12px;
			min-height: 12px;
			border: 0px solid;
			border-radius: 50%;
			color: gtk("@theme_bg_color");
			background-color: gtk("@borders");
			background-image: none;
			&:hover {
				background-color: $error_color;
			}
			&:active {
				background-color: $error_color;
			}

			&:backdrop {
				background-color: gtk("@unfocused_borders");
				color: gtk("@theme_unfocused_bg_color");
			}
		}
	}

	> stack:not(:only-child) {
		// the :not(:only-child) is for "hidden" notebooks
		background-color: transparent;
		border-style: solid;
		border-color: gtk("@borders");
		border-width: 0px;
	}
}
