View difference between Paste ID: R0XsFnXR and jqKHic5X

 /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/urlbar_full_width.css made available under Mozilla Public License v. 2.0
 See the above repository for updates as well as full license text. */
 /* This is just one place I pulled code from. I putt it it all together. Funtime60*/
 
 /* Make urlbar popup appear full size like it did before urlbar re-design */
 #urlbar-container, #urlbar{
 	position: static !important;
 	display: -moz-box !important;
 }
 #urlbar{
 	height: auto !important;
 	width: auto !important;
 	box-shadow: inset 0 0 0 1px var(--lwt-toolbar-field-border-color, hsla(240,5%,5%,.25));
 	background-color: hsla(0,0%,100%,1.0);
 	border-radius: var(--toolbarbutton-border-radius);
 }
 #urlbar[focused] {
 	box-shadow: inset 0 0 0 1px var(--lwt-toolbar-field-border-focus, highlight);
 }
 .urlbarView {
 	position: absolute !important;
 	margin: 0 !important;
 	left: 0 !important;
 	width: 100vw !important;
 	border-width: 1px 0;
 	top: var(--urlbar-toolbar-height);
 	background-color: var(--lwt-toolbar-field-focus, inherit);
 	z-index: 4;
 	box-shadow: 0 10px 10px rgba(0,0,0,.1)
 }
 #urlbar > #urlbar-input-container{ padding: 0px !important; width: auto !important; height: auto !important; }
 #urlbar > #urlbar-background{ display: none !important; }
 /* This may seem pretty weird, but it gets around an issue where the height of urlbar may suddenly change when one starts typing into it */
 /* If you are otherwise modifying the urlbar height then you might need to modify the height of this too */
 #urlbar > #urlbar-input-container::before{ content: ""; display: -moz-box; height: 24px; }
 
 /* Make seachbar the correct colors */
 #searchbar {
 	background-color: var(--lwt-toolbar-field-background-color, hsla(0,0%,100%,1.0)) !important;
 	--lwt-toolbar-field-background-color: white !important;
 	border: 1px solid var(--lwt-toolbar-field-border-color) !important;
 }
 #searchbar:focus-within {
 	box-shadow: 0 0 0 0px transparent !important;
 	border-color: var(--lwt-toolbar-field-border-focus, highlight) !important;
 }
 
 /* Make context menu normal */
 /* TODO make shorter items */
 /* TODO fix colors of selected */
 /* TODO fix colors of disabled */
 menupopup {
 	border-radius: 0px !important;
 }
 .menupopup-arrowscrollbox {
 	border-radius: 0px !important;
 }
 menu[_moz-menuactive="true"], menuitem[_moz-menuactive="true"] {
 	/* for when about:config fails */
 	/* background-color: var(--cus-menuhover) !important; */
 	/* color: -moz-menuhovertext !important; */
 }
 menupopup > menu, menupopup > menuitem {
 	padding-block: 2px !important;
 }
 
 /* Fix new tab & back button */
 #TabsToolbar {
 	--toolbarbutton-inner-padding: 6px !important;
 }
 toolbar .toolbarbutton-1 {
 	padding: var(--toolbarbutton-outer-padding) !important;
 }
 :root #back-button {
 	padding-inline: 3px 0 !important;
 }
 :root #back-button > .toolbarbutton-icon {
 	background-color: var(--backbutton-background);
 	background-origin: padding-box;
 	background-clip: padding-box;
 	border: 1px solid var(--backbutton-border-color) !important;
 	border-radius: 100% !important;
 	width: 34px !important;
 	height: 34px !important;
 	padding: 8px !important;
 	transition-property: box-shadow;
 	transition-duration: var(--toolbarbutton-hover-transition-duration);
 }
 
 /* MISC */
 :host, :root {
 
 }
 :root {
 	--cus-menuhover: rgba(0, 120, 215, 0.4);
 
 	--lwt-toolbar-field-border-color: hsla(240,5%,5%,.25);
 	--lwt-toolbar-field-background-color: hsla(0,0%,100%,.8);
 	--backbutton-border-color: hsla(240,5%,5%,.3);
 
 	--proton-tab-block-margin: 0px !important;
 	--tab-border-radius: 0px !important;
 	--inline-tab-padding: 7px !important; /* Original: 8px */
 	--tab-min-height: 33px !important;
 
 	--toolbarbutton-border-radius: 2px !important;
 }
 
 /* Tab fixes: Custom */
 :root:not(:-moz-lwtheme) {
 	--tab-selected-bgcolor: var(--toolbar-non-lwt-bgcolor) !important;
 	--toolbar-non-lwt-bgcolor: #f9f9fa !important;
 }
 .tabbrowser-tab {
 	margin-inline: -2px !important; /* Hack since the source made the padding !important so I couldn't override it to 0.
 									 Overrode the padding by canceling the padding with negative margins */
 }
 
 /* Fix Group 0 */
 /* Adds the line between the toolbar and the tabs, applies over sides of selected tab too */
 #navigator-toolbox {
 	--tabs-border-color: rgba(0,0,0,.3) !important;
 }
 /* Removes line between toolbar and selected tab */
 .tab-background {
 	margin-bottom: 0px !important;
 }
 /* Fixes tab background of inactive tabs. They're transparent, the next thing with color is THE ROOT!!! */
 #main-window {
 	background-color: rgb(199, 199, 199) !important;
 }
 /* Fixes tab height */
 #TabsToolbar * {
 	max-height: 33px !important;
 }
 /* End Group 0 */
 /* Fix Group 1 */
 .identity-box-button:hover:not([open="true"]) {
 	background-color: rgba(179, 179, 179, 0.2) !important;
 }
 .identity-box-button:not(:hover) {
 	background-color: rgba(0, 0, 0, 0);
 }
 /* End Group 1 */
 
 /* Tab fixes: site 2 */
 .tab-close-button{
 	margin-inline-start: 4px !important;
 	width: 20px !important;
 	height: 20px !important;
 	padding: 5px !important;
 	margin-right: 0px !important;
 }
 
 /* Tab fixes: site 1 */
 /* Unknown Tab Fixes: site 1 */
 /* Enable to max tabs expand when hovered over, TODO fix so only expands overflow, right now expands not full and doesn't expand full enough.
 .tabbrowser-tab[fadein]:not([pinned]):not([style*="max-width"]):hover {
 	max-width: none !important;
 }*/
 .tabbrowser-tab[fadein]:not([pinned]):not([style*="max-width"]) {
 	max-width: 225px !important;
 }
 
 /* Unknown Tab Fixes: site 1 */
 #TabsToolbar, #TabsToolbar-customization-target {
 	height: 34px !important;
 }
 :root[uidensity=compact] #TabsToolbar * {
  max-height: 30px !important;
 }
 :root[uidensity=touch] #TabsToolbar * {
 	max-height: 42px !important;
 }
 .tab-background, .tab-content {
 	margin-top: 0 !important;
 }
 root:not([uidensity=rootuidensitytouch]) #tabs-newtab-button > .toolbarbutton-icon	{
 	padding-top: 8px !important;
 	padding-bottom: 8px !important;
 }
 :root #tabbrowser-arrowscrollbox {
 	--scrollbtn-vertical-padding: 3px !important;
 }
 
 /* Unknown Tab Fixes: site 1 */
 .tab-context-line {
 	display: -moz-inline-box !important;
 	height: 2px !important;
 	border-radius: var(--tab-border-radius, 4px) var(--tab-border-radius, 4px) 0 0 !important;
 }
 .tabbrowser-tab:is([selected], [multiselected]) .tab-context-line {
 	background-color: rgb(10, 132, 255) !important; /* Photon like color
 													Default: var(--tab-line-color, rgb(10, 132, 255))
 													Automatic: color-mix(in srgb, var(--button-primary-bgcolor) 80%, transparent) */
 }
 .tabbrowser-tab:hover:not([selected="true"], [multiselected]) > .tab-stack > .tab-background > .tab-context-line {
 	background-color: rgba(0,0,0,.2) !important;
 	opacity: 1 !important;
 	transform: none !important;
 }
 #TabsToolbar[brighttext] .tabbrowser-tab:hover:not([selected="true"], [multiselected]) > .tab-stack > .tab-background > .tab-context-line {
 	background-color: rgba(255,255,255,.2) !important;
 }
 .tabbrowser-tab:not([selected="true"], [multiselected]) .tab-context-line {
 	opacity: 0 !important;
 	transform: scaleX(0) !important;
 }
 .tabbrowser-tab:not([selected="true"], [multiselected]) .tab-context-line {
 	transition: transform 250ms var(--animation-easing-function), opacity 250ms var(--animation-easing-function) !important; /* --animation-easing-function: cubic-bezier(.07, .95, 0, 1); */
 }
 
 /* Unknown Tab Fixes: site 1 */
 .tabbrowser-tab::after, #tabbrowser-tabs[movingtab] > #tabbrowser-arrowscrollbox > .tabbrowser-tab[visuallyselected]::before {
 	content: "";
 	display: block;
 }
 .tabbrowser-tab::after, .tabbrowser-tab::before {
 	border-left: 1px solid var(--lwt-background-tab-separator-color, currentColor) !important;
 	margin-block: 5px 4px !important;
 	opacity: 0.3 !important;
 }
 .tabbrowser-tab::before {
 	margin-inline-start: -1px !important;
 }
 
 /* Unknown Tab Fixes: site 1 */
 :root[tabsintitlebar]:not([extradragspace]) #toolbar-menubar[autohide="true"] + #TabsToolbar .tabbrowser-tab::after, .tabbrowser-tab:hover::after, #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab[beforehovered]::after, .tabbrowser-tab[multiselected]::after, #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab[before-multiselected]::after {
 	margin-top: var(--tabs-top-border-width) !important;
 	margin-bottom: 0 !important;
 }
 /* Selected - Hide */
 #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab[beforeselected-visible]::after, #tabbrowser-tabs[movingtab] > #tabbrowser-arrowscrollbox > .tabbrowser-tab[visuallyselected]::before, .tabbrowser-tab[visuallyselected]::after {
 	border-color: var(--tabs-border-color) !important;
 	margin-top: 0 !important;
 	margin-bottom: var(--tabs-navbar-shadow-size) !important;
 	opacity: 1 !important;
 }