/*================ IMPORT COLORS ================*/
@import "userColors.css";

/*================== FIREFOX BG COLOR ==================*/
@-moz-document url("about:newtab"), url("about:home"), url("about:blank"), url("about:support"), url("about:config") {
	/*Light*/
	html:not(#ublock0-epicker),
	html:not(#ublock0-epicker) body,
	#newtab-customize-overlay {
		background-color: var(--light_color1) !important;
	}
	html {
		--in-content-page-background: var(--light_color1) !important;
	}
	.wordmark {
		fill: #201841 !important;
	}
	.SnippetBaseContainer {
		background-color: var(--light_color2) !important;
		color: var(--other_color3) !important;
	}
	.ASRouterButton {
		border-radius: 3px !important;
	}
	/*Dark*/
	html:not(#ublock0-epicker)[lwt-newtab-brighttext],
	html:not(#ublock0-epicker) body[lwt-newtab-brighttext],
	#newtab-customize-overlay[lwt-newtab-brighttext] {
		background-color: var(--dark_color1) !important;
	}
	html[lwt-newtab-brighttext] {
		--in-content-page-background: var(--dark_color1) !important;
	}
	[lwt-newtab-brighttext] .wordmark {
		fill: #fefafe !important;
	}
	[lwt-newtab-brighttext] .SnippetBaseContainer {
		background-color: var(--dark_color2) !important;
		color: var(--word_color3) !important;
	}
	[lwt-newtab-brighttext] .ASRouterButton {
		border-radius: 3px !important;
	}
}

/*================== SEARCH BAR ==================*/
/*Light*/
.search-wrapper input {
	transition: all 0.3s ease !important;
	background: var(--light_color2) var(--newtab-search-icon) 12px center
		no-repeat !important;
	background-size: 20px !important;
	border: 1px solid !important;
	border-color: var(--light_color3) !important;
	box-shadow: none !important;
	color: var(--other_color3) !important;
}
/*Dark*/
[lwt-newtab-brighttext] .search-wrapper input {
	transition: all 0.3s ease !important;
	background: var(--dark_color2) var(--newtab-search-icon) 12px center no-repeat !important;
	background-size: 20px !important;
	border: 1px solid !important;
	border-color: var(--dark_color3) !important;
	box-shadow: none !important;
	color: var(--word_color3) !important;
}
/*Light*/
.search-wrapper .search-inner-wrapper:hover input,
.search-wrapper .search-inner-wrapper:active input,
.search-wrapper input:focus {
	border-color: var(--light_color4) !important;
}
/*Dark*/
[lwt-newtab-brighttext] .search-wrapper .search-inner-wrapper:hover input,
[lwt-newtab-brighttext] .search-wrapper .search-inner-wrapper:active input,
[lwt-newtab-brighttext] .search-wrapper input:focus {
	border-color: var(--dark_color4) !important;
}
/*Light*/
.search-wrapper .search-button,
.search-wrapper .search-button {
	transition: all 0.3s ease !important;
	fill: var(--other_color3) !important;
}
/*Dark*/
[lwt-newtab-brighttext] .search-wrapper .search-button,
[lwt-newtab-brighttext] .search-wrapper .search-button {
	transition: all 0.3s ease !important;
	fill: var(--word_color3) !important;
}
/*Light*/
.search-wrapper .search-button:focus,
.search-wrapper .search-button:hover {
	background-color: var(--light_color4) !important;
}
/*Dark*/
[lwt-newtab-brighttext] .search-wrapper .search-button:focus,
[lwt-newtab-brighttext] .search-wrapper .search-button:hover {
	background-color: var(--dark_color4) !important;
}

/*================== READER VIEW ==================*/
@-moz-document url-prefix("about:reader") {
	html {
		background: var(--base_color1);
	}
	toolbar > reader-toolbar {
		border-radius: 3px !important;
	}

	/*Dark*/
	body.loaded.dark {
		--toolbar-bgcolor: var(--dark_color2) !important;
		--toolbar-border: var(--dark_color1) !important;
		--toolbar-hover: var(--dark_color3) !important;
		--popup-bgcolor: var(--dark_color2) !important;
		--popup-border: var(--dark_color3) !important;
		--font-color: var(--word_color3) !important;
		--icon-fill: var(--word_color3) !important;
		background: var(--dark_color1) !important;
		--blue-40: var(--word_color1) !important;
		--blue-40-a30: rgba(144, 89, 255, 0.3) !important;
		--active-color: var(--word_color1) !important;
	}
	/*Light*/
	body.loaded.light {
		--toolbar-bgcolor: var(--light_color2) !important;
		--toolbar-border: var(--light_color1) !important;
		--toolbar-hover: var(--light_color3) !important;
		--popup-bgcolor: var(--light_color2) !important;
		--popup-border: var(--light_color3) !important;
		--font-color: var(--other_color3) !important;
		--icon-fill: var(--other_color3) !important;
		background: var(--light_color1) !important;
		--blue-40: var(--other_color1) !important;
		--blue-40-a30: rgba(51, 46, 86, 0.3) !important;
		--active-color: var(--other_color1) !important;
	}
	/*Sepia*/
	body.loaded.sepia {
		--toolbar-bgcolor: var(--light_color2) !important;
		--toolbar-border: var(--light_color1) !important;
		--toolbar-hover: var(--light_color3) !important;
		--popup-bgcolor: var(--light_color2) !important;
		--popup-border: var(--light_color3) !important;
		--font-color: var(--other_color3) !important;
		--icon-fill: var(--other_color3) !important;
		background: var(--light_color1) !important;
	}
}

  /* Hide scrollbar */

  :root{
    scrollbar-width: none !important;
  }


  @-moz-document url(about:privatebrowsing) {

  :root{
    scrollbar-width: none !important;
  }
  }