first part of syncing LCARStrek with Firefox 49/50 windows theme changes
[themes.git] / LCARStrek / browser / browser.css
CommitLineData
9099c61d
RK
1/* This Source Code Form is subject to the terms of the Mozilla Public
2 * License, v. 2.0. If a copy of the MPL was not distributed with this
3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
acb0e9b8 4
5@import url("chrome://global/skin/");
fcaeefc2 6@import url("downloads/indicator.css");
acb0e9b8 7
8@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
319c6529 9@namespace html url("http://www.w3.org/1999/xhtml");
cae267ab 10@namespace svg url("http://www.w3.org/2000/svg");
319c6529
RK
11
12toolbar {
13 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar");
14}
acb0e9b8 15
7d3f7f14 16toolbar[customizable="true"] {
43cc2806
RK
17 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-browsercustom");
18}
19
ee49f520
RK
20@media (-moz-mac-graphite-theme), (-moz-mac-lion-theme), (-moz-mac-yosemite-theme) {
21 /* This is a hackish workaround to cover most of Mac OS until bug 1060941 gets fixed. */
96b206fe
RK
22 toolbar[customizable="true"]:not([nowindowdrag="true"]) {
23 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-drag-browsercustom");
24 }
25}
26
41279e76
RK
27toolbar[type="menubar"][autohide="true"] {
28 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-menubar-autohide");
29}
30
7d3f7f14 31#toolbar-menubar[autohide="true"] {
43cc2806
RK
32 -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-menubar-autohide-browsercustom");
33}
34
acb0e9b8 35menubar {
319c6529 36 -moz-binding: url("chrome://global/skin/globalBindings.xml#menubar");
acb0e9b8 37}
38
e548e22e 39:root {
b1dfcf32
RK
40 /*--backbutton-urlbar-overlap: 5px;*/
41
7327c957
RK
42 /* icon width + border + horizontal padding (includes the overlap from backbutton-urlbar-overlap) */
43 --forwardbutton-width: 27px;
44 /* icon width + border + horizontal padding (without the overlap from backbutton-urlbar-overlap) /
45 --forwardbutton-width: 25px;*/
46
b1dfcf32 47 --identity-box-verified-background-color: #000000;
c9b0a396
RK
48
49 --panel-separator-color: #A09090;
50
c9b0a396 51 --urlbar-separator-color: #9C9CFF;
e548e22e
RK
52}
53
319c6529
RK
54#menubar-items {
55 -moz-box-orient: vertical; /* for flex hack */
acb0e9b8 56}
57
319c6529
RK
58#main-menubar {
59 -moz-box-flex: 1; /* make menu items expand to fill toolbar height */
60}
61
63ada306
RK
62/* ::::: primary toolbar ::::: */
63
64.toolbar-primary > .toolbar-box > .toolbar-holder {
270cbf0c 65 background-color: #A09090;
63ada306
RK
66}
67
68.toolbar-primary > .toolbar-box > .toolbar-startcap,
69.toolbar-primary > .toolbar-box > .toolbar-endcap {
70 background-color: #9C9CFF;
71}
72
e20c83c3
RK
73/* Hides the titlebar-placeholder underneath the window caption buttons when we
74 are not autohiding the menubar. */
75#toolbar-menubar:not([autohide="true"]) + #TabsToolbar > .titlebar-placeholder[type="caption-buttons"] {
76 display: none;
77}
78
43cc2806
RK
79/* We want a 4px gap between the TabsToolbar and the toolbar-menubar when the
80 toolbar-menu is displayed, and a 16px gap when it is not. 1px is taken care
81 of by the (light) outer shadow of the tab, the remaining 3/15 are these margins. */
c0f6797e
RK
82#toolbar-menubar:not([moz-collapsed=true]):not([autohide=true]) ~ #TabsToolbar,
83#toolbar-menubar:not([moz-collapsed=true])[autohide=true]:not([inactive]) ~ #TabsToolbar {
43cc2806
RK
84/* margin-top: 3px;*/
85}
86
43371c9b
RK
87#main-window[tabsintitlebar][sizemode="normal"]:not([inFullscreen])[chromehidden~="menubar"] #toolbar-menubar ~ #TabsToolbar,
88#main-window[tabsintitlebar][sizemode="normal"]:not([inFullscreen]) #toolbar-menubar[autohide="true"][inactive] ~ #TabsToolbar {
19988d2d 89/* margin-top: var(--space-above-tabbar);*/
43cc2806
RK
90}
91
ee49f520
RK
92@media (-moz-mac-graphite-theme), (-moz-mac-lion-theme) {
93 /* This is a hackish workaround to cover most of Mac OS until bug 1060941 gets fixed. */
4711fba5 94 #main-window[tabsintitlebar]:not([inFullscreen="true"]) #TabsToolbar {
54d92f05
RK
95 padding-left: 60px;
96 }
43cc2806
RK
97}
98
018d70fb
RK
99#main-window[tabsintitlebar] #toolbar-menubar .toolbar-endcap {
100 /* the titlebar buttons are shown right over the endcap but we have no power over the buttonbox position just for this case, so hide the endcap */
101 display: none;
43cc2806 102}
63ada306 103
e20c83c3
RK
104#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #toolbar-menubar[customizing-dragovertarget].customization-target::before,
105#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #TabsToolbar[customizing-dragovertarget].customization-target::before,
106#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #toolbar-menubar.customization-target:hover::before,
107#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #TabsToolbar.customization-target:hover::before {
108 outline-color: #A09090;
109}
110
319c6529
RK
111#navigator-toolbox {
112}
113
9abeb12c
RK
114#navigator-toolbox::after {
115 content: "";
116 display: -moz-box;
117 -moz-box-ordinal-group: 101; /* tabs toolbar is 100 */
118 height: 1px;
119}
9abeb12c 120
6f5a7408 121#navigator-toolbox > toolbar {
319c6529
RK
122}
123
3d64e0ce
RK
124#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(:-moz-lwtheme) {
125}
126
9168a62c
RK
127#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(#nav-bar):not(#addon-bar) {
128 overflow: -moz-hidden-unscrollable;
129 max-height: 4em;
130 transition: min-height 170ms ease-out, max-height 170ms ease-out;
131}
132
133#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(#nav-bar):not(#addon-bar)[collapsed=true] {
134 min-height: 0.1px;
135 max-height: 0;
136 transition: min-height 170ms ease-out, max-height 170ms ease-out, visibility 170ms linear;
137}
138
ee49f520
RK
139@media (-moz-mac-graphite-theme: 0) and (-moz-mac-lion-theme: 0) {
140 /* This is a hackish workaround to exclude most of Mac OS until bug 1060941 gets fixed. */
141 /* Indent also due to non-applicable aero rule in original Windows theme. */
c0f6797e
RK
142 #main-window[tabsintitlebar]:not([inFullscreen]) #toolbar-menubar:not(:-moz-lwtheme),
143 #main-window[tabsintitlebar]:not([inFullscreen]) #TabsToolbar:not(:-moz-lwtheme) {
144 /* like menubar */
145 background-color: #6000CF;
146 color: #FF9F00;
319c6529
RK
147 }
148
c0f6797e
RK
149 #main-window[tabsintitlebar]:not([inFullscreen]) #toolbar-menubar:not(:-moz-lwtheme):-moz-window-inactive,
150 #main-window[tabsintitlebar]:not([inFullscreen]) #TabsToolbar:not(:-moz-lwtheme):-moz-window-inactive {
151 background-color: #8050B0;
152 color: #FF9F00;
319c6529
RK
153 }
154
dccbbf95
RK
155 #main-window[tabsintitlebar] #main-menubar > menu:not(:-moz-lwtheme) {
156 /*color: inherit;*/
157 }
158
c0f6797e
RK
159 #main-window[tabsintitlebar] #titlebar:-moz-lwtheme {
160 visibility: hidden;
161 }
319c6529 162
c0f6797e
RK
163 #main-window[tabsintitlebar] #titlebar-content:-moz-lwtheme {
164 -moz-binding: url("chrome://global/content/bindings/general.xml#windowdragbox");
165 visibility: visible;
166 }
8d154261
RK
167}
168
ee49f520
RK
169@media (-moz-mac-graphite-theme), (-moz-mac-lion-theme) {
170 /* This is a hackish workaround to cover most of Mac OS until bug 1060941 gets fixed. */
8d154261
RK
171 #titlebar-buttonbox > .titlebar-button {
172 display: none;
173 }
8d154261 174}
319c6529 175
c0f6797e
RK
176#nav-bar {
177 /* Position the toolbar above the bottom of background tabs */
178 position: relative;
179 z-index: 1;
82b4252f
RK
180}
181
c0f6797e
RK
182#personal-bookmarks {
183/* min-height: 24px; */
319c6529
RK
184}
185
bc685759
RK
186#PersonalToolbar > #home-button {
187 -moz-box-orient: horizontal;
188}
189
190#PersonalToolbar > #home-button > .toolbarbutton-text {
191 display: block;
192}
193
c0f6797e
RK
194#print-preview-toolbar:not(:-moz-lwtheme) {
195 /* -moz-appearance: toolbox; */
82b4252f
RK
196}
197
c0f6797e 198#browser-bottombox:not(:-moz-lwtheme) {
319c6529
RK
199}
200
201/* ::::: titlebar ::::: */
202
5305ef8d
RK
203#titlebar {
204 /* like menubar */
205 background-color: #6000CF;
206 color: #FF9F00;
207}
208#titlebar:-moz-window-inactive {
209 background-color: #8050B0;
210 color: #FF9F00;
211}
212
319c6529 213#main-window[sizemode="normal"] > #titlebar {
5305ef8d
RK
214 margin-top: -3px;
215 margin-bottom: 3px;
319c6529
RK
216}
217
218#main-window[sizemode="maximized"] > #titlebar {
5305ef8d 219 margin-top: 4px;
319c6529
RK
220}
221
ee49f520
RK
222@media (-moz-mac-graphite-theme), (-moz-mac-lion-theme) {
223 /* This is a hackish workaround to cover most of Mac OS until bug 1060941 gets fixed. */
58d9f24a
RK
224 #main-window[sizemode="normal"] > #titlebar,
225 #main-window[sizemode="maximized"] > #titlebar {
4711fba5
RK
226 margin-top: 19px;
227 /* There is a margin-bottom set to -23 by code. */
54d92f05
RK
228 }
229}
230
43cc2806
RK
231/* The button box must appear on top of the navigator-toolbox in order for
232 * click and hover mouse events to work properly for the button in the restored
233 * window state. Otherwise, elements in the navigator-toolbox, like the menubar,
234 * can swallow those events. It will also place the buttons above the fog on
235 * themes with Aero Glass.
236 */
83ac1f44
RK
237#titlebar-buttonbox,
238#main-window[sizemode="maximized"] #titlebar-buttonbox {
b7f3670c
RK
239 -moz-appearance: none;
240 margin-top: 6px;
241 margin-top: 4px;
dae45075 242 margin-inline-end: 3px;
43cc2806 243 z-index: 1;
319c6529
RK
244}
245
319c6529
RK
246.titlebar-placeholder[type="appmenu-button"] {
247 margin-left: 4px;
248}
249
250.titlebar-placeholder[type="caption-buttons"] {
251 margin-left: 10px;
252}
253
254/* titlebar command buttons */
319c6529 255#titlebar-min {
19988d2d 256 list-style-image: url("chrome://browser/skin/caption-buttons.svg#minimize");
5305ef8d
RK
257}
258
259#titlebar-min:hover {
19988d2d 260 list-style-image: url("chrome://browser/skin/caption-buttons.svg#minimize-hover");
319c6529
RK
261}
262
263#titlebar-max {
19988d2d 264 list-style-image: url("chrome://browser/skin/caption-buttons.svg#maximize");
5305ef8d
RK
265}
266
267#titlebar-max:hover {
19988d2d 268 list-style-image: url("chrome://browser/skin/caption-buttons.svg#maximize-hover");
319c6529
RK
269}
270
271#main-window[sizemode="maximized"] #titlebar-max {
19988d2d 272 list-style-image: url("chrome://browser/skin/caption-buttons.svg#restore");
5305ef8d
RK
273}
274
275#main-window[sizemode="maximized"] #titlebar-max:hover {
19988d2d 276 list-style-image: url("chrome://browser/skin/caption-buttons.svg#restore-hover");
319c6529
RK
277}
278
279#titlebar-close {
19988d2d 280 list-style-image: url("chrome://browser/skin/caption-buttons.svg#close");
5305ef8d
RK
281}
282
283#titlebar-close:hover {
19988d2d 284 list-style-image: url("chrome://browser/skin/caption-buttons.svg#close-hover");
acb0e9b8 285}
286
ee49f520
RK
287@media (-moz-mac-graphite-theme), (-moz-mac-lion-theme) {
288 /* This is a hackish workaround to cover most of Mac OS until bug 1060941 gets fixed. */
54d92f05
RK
289 #titlebar-fullscreen-button {
290 -moz-appearance: none;
291 list-style-image: url("chrome://browser/skin/icons/mac-fullscreen-icon.png");
292 -moz-image-region: rect(0px, 16px, 16px, 0px);
293 }
294
295 #titlebar-fullscreen-button:hover {
296 -moz-image-region: rect(0px, 32px, 16px, 16px);
297 }
298
299 @media (min-resolution: 2dppx) {
300 #titlebar-fullscreen-button {
301 list-style-image: url("chrome://browser/skin/icons/mac-fullscreen-icon@2x.png");
302 -moz-image-region: rect(0px, 32px, 32px, 0px);
303 }
304
305 #titlebar-fullscreen-button:hover {
306 -moz-image-region: rect(0px, 64px, 32px, 32px);
307 }
308 }
309}
310
311
acb0e9b8 312/* ::::: bookmark buttons ::::: */
313
c0f6797e
RK
314toolbarbutton.bookmark-item:not(.subviewbutton),
315#personal-bookmarks[cui-areatype="toolbar"]:not([overflowedItem=true]) > #bookmarks-toolbar-placeholder {
316/* margin: 0;
317 padding: 2px 3px;*/
318}
319
320toolbarbutton.bookmark-item:not([disabled="true"]):not(.subviewbutton):hover:active,
321toolbarbutton.bookmark-item[open="true"] {
322/* padding-top: 3px;
323 padding-bottom: 1px;
dae45075
RK
324 padding-inline-start: 4px;
325 padding-inline-end: 2px;*/
c0f6797e
RK
326}
327
26125509
RK
328.bookmark-item > .toolbarbutton-icon,
329#personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-icon {
acb0e9b8 330 width: 16px;
331 height: 16px;
dae45075
RK
332 margin-inline-start: 1px;
333 margin-inline-end: 2px;
bc685759
RK
334 margin-top: 1px;
335 margin-bottom: 1px;
acb0e9b8 336}
337
26125509
RK
338/* Force the display of the label for bookmarks */
339.bookmark-item > .toolbarbutton-text,
340#personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-text {
acb0e9b8 341 display: -moz-box !important;
342}
343
319c6529
RK
344.bookmark-item > .toolbarbutton-menu-dropmarker {
345 display: none;
346}
347
26125509 348#bookmarks-toolbar-placeholder {
8da9da4e 349 list-style-image: url("chrome://communicator/skin/bookmarks/bookmarksToolbar.png") !important;
9e88a441 350 -moz-box-orient: horizontal;
319c6529
RK
351}
352
e20c83c3
RK
353toolbarpaletteitem[place="palette"] > #personal-bookmarks > #bookmarks-toolbar-placeholder,
354#personal-bookmarks[cui-areatype="menu-panel"] > #bookmarks-toolbar-placeholder {
355 list-style-image: url("chrome://browser/skin/places/bookmarksToolbar-menuPanel.png") !important;
356}
357
358/* ----- BOOKMARK STAR ANIMATION ----- */
359
360@keyframes animation-bookmarkAdded {
361 from { transform: rotate(0deg) translateX(-16px) rotate(0deg) scale(1); opacity: 0; }
362 60% { transform: rotate(180deg) translateX(-16px) rotate(-180deg) scale(2.2); opacity: 1; }
363 80% { opacity: 1; }
364 to { transform: rotate(180deg) translateX(-16px) rotate(-180deg) scale(1); opacity: 0; }
365}
366
367@keyframes animation-bookmarkPulse {
368 from { transform: scale(1); }
369 50% { transform: scale(1.3); }
370 to { transform: scale(1); }
371}
372
373#bookmarked-notification-container {
374 min-height: 1px;
375 min-width: 1px;
376 height: 1px;
377 margin-bottom: -1px;
378 z-index: 5;
379 position: relative;
380}
381
382#bookmarked-notification {
383 background-size: 16px;
384 background-position: center;
385 background-repeat: no-repeat;
386 width: 16px;
387 height: 16px;
388 opacity: 0;
389}
390
c0f6797e
RK
391#bookmarked-notification-dropmarker-anchor {
392 z-index: -1;
393 position: relative;
394}
395
396#bookmarked-notification-dropmarker-icon {
397 width: 18px;
398 height: 18px;
399 visibility: hidden;
400}
401
e20c83c3
RK
402#bookmarked-notification-anchor[notification="finish"] > #bookmarked-notification {
403 background-image: url("chrome://browser/skin/places/bookmarks-notification-finish.png");
404 animation: animation-bookmarkAdded 800ms;
405 animation-timing-function: ease, ease, ease;
406}
407
408#bookmarks-menu-button[notification="finish"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
c0f6797e
RK
409 list-style-image: none !important;
410}
411
412#bookmarked-notification-dropmarker-anchor[notification="finish"] > #bookmarked-notification-dropmarker-icon {
413 visibility: visible;
e20c83c3
RK
414 animation: animation-bookmarkPulse 300ms;
415 animation-delay: 600ms;
416 animation-timing-function: ease-out;
417}
418
319c6529
RK
419/* ::::: bookmark menus ::::: */
420
421menu.bookmark-item,
422menuitem.bookmark-item {
423 min-width: 0;
ab799a7a 424 max-width: 32em;
319c6529
RK
425}
426
e20c83c3 427.bookmark-item:not(.subviewbutton) > .menu-iconic-left {
319c6529
RK
428 margin-top: 0;
429 margin-bottom: 0;
430}
431
432.bookmark-item > .menu-iconic-left > .menu-iconic-icon {
dae45075 433 padding-inline-start: 0px;
319c6529
RK
434}
435
436/* ::::: bookmark items ::::: */
437
438.bookmark-item {
dce90fef 439 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
8da9da4e 440 -moz-image-region: auto;
319c6529
RK
441}
442
443.bookmark-item[container] {
444 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.gif");
8da9da4e 445 -moz-image-region: auto;
319c6529
RK
446}
447
448.bookmark-item[container][open] {
449 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
8da9da4e 450 -moz-image-region: auto;
319c6529
RK
451}
452
8da9da4e
RK
453.bookmark-item[container][livemark] {
454 list-style-image: url("chrome://communicator/skin/bookmarks/livemark-folder.png");
319c6529
RK
455 -moz-image-region: auto;
456}
457
458.bookmark-item[container][livemark] .bookmark-item {
8da9da4e 459 list-style-image: url("chrome://communicator/skin/bookmarks/livemark-item.png");
719b06bc 460 -moz-image-region: rect(0px, 16px, 16px, 0px);
319c6529
RK
461}
462
eec397be 463.bookmark-item[container][livemark] .bookmark-item[visited] {
719b06bc 464 -moz-image-region: rect(0px, 32px, 16px, 16px);
eec397be
RK
465}
466
319c6529 467.bookmark-item[container][query] {
8da9da4e 468 list-style-image: url("chrome://communicator/skin/bookmarks/query.png");
319c6529
RK
469 -moz-image-region: auto;
470}
471
472.bookmark-item[query][tagContainer] {
473 list-style-image: url("chrome://mozapps/skin/places/tagContainerIcon.png");
474 -moz-image-region: auto;
475}
476
477.bookmark-item[query][dayContainer] {
8da9da4e 478 list-style-image: url("chrome://communicator/skin/history/calendar.png");
319c6529
RK
479 -moz-image-region: auto;
480}
481
482.bookmark-item[query][hostContainer] {
483 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-closed.gif");
8da9da4e 484 -moz-image-region: auto;
319c6529
RK
485}
486
487.bookmark-item[query][hostContainer][open] {
488 list-style-image: url("chrome://communicator/skin/bookmarks/bookmark-folder-open.gif");
8da9da4e 489 -moz-image-region: auto;
319c6529
RK
490}
491
b1234db8
RK
492.bookmark-item[cutting] > .toolbarbutton-icon,
493.bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-icon {
494 opacity: 0.5;
495}
496
497.bookmark-item[cutting] > .toolbarbutton-text,
498.bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-text {
499 opacity: 0.7;
500}
501
319c6529
RK
502/* ::::: primary toolbar buttons ::::: */
503
43cc2806
RK
504/* === BEGIN toolbarbuttons.inc.css === */
505
506/* Whole section of this included file: */
51994fad
RK
507:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button,
508 #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #tabview-button,
d4d77dc0 509 #social-share-button, #open-file-button, #find-button, #developer-button,
a5cb6e53 510 #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button,
51994fad
RK
511 #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button,
512 #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button,
9ff3770c 513 #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, #containers-panelmenu),
7d3f7f14 514#bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
43cc2806
RK
515 list-style-image: url("chrome://browser/skin/ToolbarFx.png");
516}
517
7d3f7f14 518#back-button {
43cc2806
RK
519 -moz-image-region: rect(0, 36px, 18px, 18px);
520}
521
7d3f7f14 522#back-button:hover:not([disabled="true"]) {
43cc2806
RK
523 -moz-image-region: rect(18px, 36px, 36px, 18px);
524}
525
7d3f7f14 526#back-button[disabled="true"] {
43cc2806
RK
527 -moz-image-region: rect(36px, 36px, 54px, 18px);
528}
529
7d3f7f14 530#forward-button {
43cc2806
RK
531 -moz-image-region: rect(0, 72px, 18px, 54px);
532}
533
7d3f7f14 534#forward-button:hover:not([disabled="true"]) {
43cc2806
RK
535 -moz-image-region: rect(18px, 72px, 36px, 54px);
536}
537
7d3f7f14 538#forward-button[disabled="true"] {
43cc2806
RK
539 -moz-image-region: rect(36px, 72px, 54px, 54px);
540}
541
7d3f7f14
RK
542#back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
543#forward-button:-moz-locale-dir(rtl) {
43cc2806
RK
544 transform: scaleX(-1);
545}
546
7d3f7f14 547#home-button[cui-areatype="toolbar"] {
43cc2806
RK
548 -moz-image-region: rect(0, 126px, 18px, 108px);
549}
550
7d3f7f14 551#home-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
552 -moz-image-region: rect(18px, 126px, 36px, 108px);
553}
554
7d3f7f14 555#bookmarks-menu-button[cui-areatype="toolbar"] {
43cc2806
RK
556 -moz-image-region: rect(0, 144px, 18px, 126px);
557}
558
7d3f7f14
RK
559#bookmarks-menu-button[cui-areatype="toolbar"]:hover,
560#bookmarks-menu-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK
561 -moz-image-region: rect(18px, 144px, 36px, 126px);
562}
563
43ee1307 564/* When "new tab" page shows up, the menubutton-button (star button) is disabled */
7d3f7f14 565#bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-button[disabled="true"] {
43ee1307
RK
566 -moz-image-region: rect(36px, 144px, 54px, 126px) !important;
567 background-color: transparent !important;
568}
569
7d3f7f14 570#bookmarks-menu-button[cui-areatype="toolbar"][starred] {
43cc2806
RK
571 -moz-image-region: rect(0, 162px, 18px, 144px);
572}
573
7d3f7f14 574#bookmarks-menu-button[cui-areatype="toolbar"][starred]:hover,
83e3b5cf
RK
575#bookmarks-menu-button[cui-areatype="toolbar"][starred][open="true"],
576#bookmarks-menu-button[cui-areatype="toolbar"][starred] > .toolbarbutton-menubutton-button[open="true"] {
577 /* When starred and clicked (for edit/delete dialog),
578 * then only the menubutton-button itself is open, but not the whole menubutton. */
43cc2806
RK
579 -moz-image-region: rect(18px, 162px, 36px, 144px);
580}
581
7d3f7f14 582#bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
43cc2806
RK
583 -moz-image-region: rect(0, 630px, 18px, 612px);
584}
585
7d3f7f14 586#bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker {
43cc2806
RK
587 padding: 1px;
588 -moz-box-align: center;
589}
590
7d3f7f14
RK
591#bookmarks-menu-button[cui-areatype="toolbar"]:hover > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon,
592#bookmarks-menu-button[cui-areatype="toolbar"][open="true"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
43cc2806
RK
593 -moz-image-region: rect(18px, 630px, 36px, 612px);
594}
595
7d3f7f14
RK
596#bookmarks-menu-button[cui-areatype="toolbar"]:hover:active > .toolbarbutton-menubutton-dropmarker,
597#bookmarks-menu-button[cui-areatype="toolbar"][open="true"] > .toolbarbutton-menubutton-dropmarker {
43cc2806
RK
598 padding-top: 2px;
599 padding-bottom: 0px;
dae45075
RK
600 padding-inline-start: 2px;
601 padding-inline-end: 0px;
43cc2806
RK
602}
603
7d3f7f14 604#history-panelmenu[cui-areatype="toolbar"] {
43cc2806
RK
605 -moz-image-region: rect(0, 180px, 18px, 162px);
606}
607
7d3f7f14
RK
608#history-panelmenu[cui-areatype="toolbar"]:hover,
609#history-panelmenu[cui-areatype="toolbar"][open="true"] {
43cc2806
RK
610 -moz-image-region: rect(18px, 180px, 36px, 162px);
611}
612
7d3f7f14 613#downloads-button[cui-areatype="toolbar"] {
43cc2806
RK
614 -moz-image-region: rect(0, 198px, 18px, 180px);
615}
616
7d3f7f14
RK
617#downloads-button[cui-areatype="toolbar"]:hover,
618#downloads-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK
619 -moz-image-region: rect(18px, 198px, 36px, 180px);
620}
621
7d3f7f14 622#add-ons-button[cui-areatype="toolbar"] {
43cc2806
RK
623 -moz-image-region: rect(0, 216px, 18px, 198px);
624}
625
7d3f7f14 626#add-ons-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
627 -moz-image-region: rect(18px, 216px, 36px, 198px);
628}
629
7d3f7f14 630#open-file-button[cui-areatype="toolbar"] {
43cc2806
RK
631 -moz-image-region: rect(0, 234px, 18px, 216px);
632}
633
7d3f7f14 634#open-file-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
635 -moz-image-region: rect(18px, 234px, 36px, 216px);
636}
637
7d3f7f14 638#save-page-button[cui-areatype="toolbar"] {
43cc2806
RK
639 -moz-image-region: rect(0, 252px, 18px, 234px);
640}
641
7d3f7f14 642#save-page-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
643 -moz-image-region: rect(18px, 252px, 36px, 234px);
644}
645
7d3f7f14 646#sync-button[cui-areatype="toolbar"] {
8ab9ca8a 647 -moz-image-region: rect(0, 792px, 18px, 774px);
43cc2806
RK
648}
649
7d3f7f14 650#sync-button[cui-areatype="toolbar"]:hover {
8ab9ca8a 651 -moz-image-region: rect(18px, 792px, 36px, 774px);
43cc2806
RK
652}
653
9ff3770c
RK
654#containers-panelmenu[cui-areatype="toolbar"] {
655 -moz-image-region: rect(0, 810px, 18px, 792px);
656}
657
658#containers-panelmenu[cui-areatype="toolbar"]:hover {
659 -moz-image-region: rect(18px, 810px, 36px, 792px);
660}
661
7d3f7f14 662#feed-button[cui-areatype="toolbar"] {
43cc2806
RK
663 -moz-image-region: rect(0, 288px, 18px, 270px);
664}
665
05148fed 666#feed-button[cui-areatype="menu-panel"][panel-multiview-anchor=true],
7d3f7f14 667#feed-button[cui-areatype="toolbar"]:hover:not([disabled="true"]) {
43cc2806
RK
668 -moz-image-region: rect(18px, 288px, 36px, 270px);
669}
670
7d3f7f14 671#feed-button[cui-areatype="toolbar"][disabled="true"] {
cc4b0b0d
RK
672 -moz-image-region: rect(36px, 288px, 54px, 270px);
673}
674
7d3f7f14 675#social-share-button[cui-areatype="toolbar"] {
43cc2806
RK
676 -moz-image-region: rect(0px, 306px, 18px, 288px);
677}
678
22180555
RK
679#social-share-button[cui-areatype="toolbar"]:hover:not([disabled="true"]),
680#social-share-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK
681 -moz-image-region: rect(18px, 306px, 36px, 288px);
682}
683
22180555
RK
684#social-share-button[cui-areatype="toolbar"][disabled="true"] {
685 -moz-image-region: rect(36px, 306px, 54px, 288px);
686}
687
7d3f7f14 688#characterencoding-button[cui-areatype="toolbar"] {
43cc2806
RK
689 -moz-image-region: rect(0, 324px, 18px, 306px);
690}
691
7d3f7f14
RK
692#characterencoding-button[cui-areatype="toolbar"]:hover:not([disabled="true"]),
693#characterencoding-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK
694 -moz-image-region: rect(18px, 324px, 36px, 306px);
695}
696
7d3f7f14 697#characterencoding-button[cui-areatype="toolbar"][disabled="true"] {
cc4b0b0d
RK
698 -moz-image-region: rect(36px, 324px, 54px, 306px);
699}
700
7d3f7f14 701#new-window-button[cui-areatype="toolbar"] {
43cc2806
RK
702 -moz-image-region: rect(0, 342px, 18px, 324px);
703}
704
7d3f7f14 705#new-window-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
706 -moz-image-region: rect(18px, 342px, 36px, 324px);
707}
708
46e71434
RK
709#e10s-button[cui-areatype="toolbar"] {
710 -moz-image-region: rect(0, 342px, 18px, 324px);
711}
712
713#e10s-button[cui-areatype="toolbar"]:hover {
714 -moz-image-region: rect(18px, 342px, 36px, 324px);
715}
716
717#e10s-button > .toolbarbutton-icon {
718 transform: scaleY(-1);
719}
720
7d3f7f14 721#new-tab-button[cui-areatype="toolbar"] {
43cc2806
RK
722 -moz-image-region: rect(0, 360px, 18px, 342px);
723}
724
7d3f7f14 725#new-tab-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
726 -moz-image-region: rect(18px, 360px, 36px, 342px);
727}
728
7d3f7f14 729#privatebrowsing-button[cui-areatype="toolbar"] {
43cc2806
RK
730 -moz-image-region: rect(0, 378px, 18px, 360px);
731}
732
7d3f7f14 733#privatebrowsing-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
734 -moz-image-region: rect(18px, 378px, 36px, 360px);
735}
736
7d3f7f14 737#find-button[cui-areatype="toolbar"] {
43cc2806
RK
738 -moz-image-region: rect(0, 396px, 18px, 378px);
739}
740
7d3f7f14 741#find-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
742 -moz-image-region: rect(18px, 396px, 36px, 378px);
743}
744
7d3f7f14 745#print-button[cui-areatype="toolbar"] {
43cc2806
RK
746 -moz-image-region: rect(0, 414px, 18px, 396px);
747}
748
7d3f7f14 749#print-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
750 -moz-image-region: rect(18px, 414px, 36px, 396px);
751}
752
7d3f7f14 753#fullscreen-button[cui-areatype="toolbar"] {
43cc2806
RK
754 -moz-image-region: rect(0, 432px, 18px, 414px);
755}
756
7d3f7f14 757#fullscreen-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
758 -moz-image-region: rect(18px, 432px, 36px, 414px);
759}
760
7d3f7f14 761#developer-button[cui-areatype="toolbar"] {
43cc2806
RK
762 -moz-image-region: rect(0, 450px, 18px, 432px);
763}
764
7d3f7f14
RK
765#developer-button[cui-areatype="toolbar"]:hover,
766#developer-button[cui-areatype="toolbar"][open="true"] {
43cc2806
RK
767 -moz-image-region: rect(18px, 450px, 36px, 432px);
768}
769
7d3f7f14 770#preferences-button[cui-areatype="toolbar"] {
43cc2806
RK
771 -moz-image-region: rect(0, 468px, 18px, 450px);
772}
773
7d3f7f14 774#preferences-button[cui-areatype="toolbar"]:hover {
43cc2806
RK
775 -moz-image-region: rect(18px, 468px, 36px, 450px);
776}
777
7d3f7f14 778#PanelUI-menu-button {
43cc2806
RK
779 -moz-image-region: rect(0, 486px, 18px, 468px);
780}
781
7d3f7f14
RK
782#PanelUI-menu-button:hover,
783#PanelUI-menu-button[open="true"] {
43cc2806
RK
784 -moz-image-region: rect(18px, 486px, 36px, 468px);
785}
786
51994fad 787#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #cut-button {
43cc2806
RK
788 -moz-image-region: rect(0, 504px, 18px, 486px);
789}
790
51994fad 791#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #cut-button:hover:not([disabled="true"]) {
43cc2806
RK
792 -moz-image-region: rect(18px, 504px, 36px, 486px);
793}
794
51994fad 795#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #cut-button[disabled="true"] {
cc4b0b0d
RK
796 -moz-image-region: rect(36px, 504px, 54px, 486px);
797}
798
51994fad 799#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #copy-button {
43cc2806
RK
800 -moz-image-region: rect(0, 522px, 18px, 504px);
801}
802
51994fad 803#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #copy-button:hover:not([disabled="true"]) {
43cc2806
RK
804 -moz-image-region: rect(18px, 522px, 36px, 504px);
805}
806
51994fad 807#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #copy-button[disabled="true"] {
cc4b0b0d
RK
808 -moz-image-region: rect(36px, 522px, 54px, 504px);
809}
810
51994fad 811#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #paste-button {
43cc2806
RK
812 -moz-image-region: rect(0, 540px, 18px, 522px);
813}
814
51994fad 815#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #paste-button:hover:not([disabled="true"]) {
43cc2806
RK
816 -moz-image-region: rect(18px, 540px, 36px, 522px);
817}
818
51994fad 819#edit-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #paste-button[disabled="true"] {
cc4b0b0d
RK
820 -moz-image-region: rect(36px, 540px, 54px, 522px);
821}
822
51994fad 823#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-out-button {
43cc2806
RK
824 -moz-image-region: rect(0, 558px, 18px, 540px);
825}
826
51994fad 827#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-out-button:hover:not([disabled="true"]) {
43cc2806
RK
828 -moz-image-region: rect(18px, 558px, 36px, 540px);
829}
830
51994fad 831#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-out-button[disabled="true"] {
cc4b0b0d
RK
832 -moz-image-region: rect(36px, 558px, 54px, 540px);
833}
834
51994fad 835#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-in-button {
43cc2806
RK
836 -moz-image-region: rect(0, 576px, 18px, 558px);
837}
838
51994fad 839#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-in-button:hover:not([disabled="true"]) {
43cc2806
RK
840 -moz-image-region: rect(18px, 576px, 36px, 558px);
841}
842
51994fad 843#zoom-controls:not(:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])) > #zoom-in-button[disabled="true"] {
cc4b0b0d
RK
844 -moz-image-region: rect(36px, 576px, 54px, 558px);
845}
846
7d3f7f14 847#nav-bar-overflow-button {
43cc2806
RK
848 -moz-image-region: rect(0, 612px, 18px, 594px);
849}
850
7d3f7f14
RK
851#nav-bar-overflow-button:hover,
852#nav-bar-overflow-button[open="true"] {
43cc2806
RK
853 -moz-image-region: rect(18px, 612px, 36px, 594px);
854}
855
46e71434
RK
856#nav-bar-overflow-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
857 transform: scaleX(-1);
858}
859
c0f6797e
RK
860#tabview-button {
861 -moz-image-region: rect(0, 648px, 18px, 630px);
862}
863
864#tabview-button:hover {
865 -moz-image-region: rect(18px, 648px, 36px, 630px);
866}
867
868#email-link-button[cui-areatype="toolbar"] {
869 -moz-image-region: rect(0, 666px, 18px, 648px);
870}
871
22180555 872#email-button[cui-areatype="toolbar"]:hover:not([disabled="true"]) {
c0f6797e
RK
873 -moz-image-region: rect(18px, 666px, 36px, 648px);
874}
875
22180555
RK
876#email-button[cui-areatype="toolbar"][disabled="true"] {
877 -moz-image-region: rect(36px, 666px, 54px, 648px);
878}
879
c0f6797e
RK
880#sidebar-button[cui-areatype="toolbar"] {
881 -moz-image-region: rect(0, 684px, 18px, 666px);
882}
883
884#sidebar-button[cui-areatype="toolbar"]:hover {
885 -moz-image-region: rect(18px, 684px, 36px, 666px);
886}
887
22180555
RK
888#panic-button[cui-areatype="toolbar"] {
889 -moz-image-region: rect(0, 702px, 18px, 684px);
890}
891
892#panic-button[cui-areatype="toolbar"]:hover,
893#panic-button[cui-areatype="toolbar"][open] {
894 -moz-image-region: rect(18px, 702px, 36px, 684px);
895}
896
897#panic-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
898 transform: scaleX(-1);
899}
900
e548e22e
RK
901#webide-button[cui-areatype="toolbar"] {
902 -moz-image-region: rect(0, 738px, 18px, 720px);
903}
904
905#webide-button[cui-areatype="toolbar"]:hover {
906 -moz-image-region: rect(18px, 738px, 36px, 720px);
907}
908
43cc2806
RK
909/* === END toolbarbuttons.inc.css === */
910
911/* === BEGIN menupanel.inc.css === */
912
913/* Menu panel and palette styles */
914
e548e22e
RK
915:root {
916 /* avoid aero overrides with changed filenames */
917 --menupanel-list-style-image: url(chrome://browser/skin/menuPanelFx.png);
918 --menupanel-small-list-style-image: url(chrome://browser/skin/menuPanelFx-small.png);
919}
920
51994fad 921toolbaritem[sdkstylewidget="true"] > toolbarbutton,
5401f433
RK
922:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button,
923 #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #tabview-button,
1988bb88 924 #social-share-button, #open-file-button, #find-button, #developer-button,
a5cb6e53 925 #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button,
5401f433
RK
926 #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button,
927 #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button,
9ff3770c 928 #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, #containers-panelmenu)[cui-areatype="menu-panel"],
5401f433
RK
929toolbarpaletteitem[place="palette"] > :-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button,
930 #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #tabview-button,
1988bb88 931 #social-share-button, #open-file-button, #find-button, #developer-button,
a5cb6e53 932 #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button,
5401f433
RK
933 #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button,
934 #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button,
9ff3770c 935 #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, #containers-panelmenu) {
e548e22e 936 list-style-image: var(--menupanel-list-style-image);
43cc2806
RK
937}
938
939#home-button[cui-areatype="menu-panel"],
7d3f7f14 940toolbarpaletteitem[place="palette"] > #home-button {
43cc2806
RK
941 -moz-image-region: rect(0px, 128px, 32px, 96px);
942}
943
cc4b0b0d 944#home-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 945toolbarpaletteitem[place="palette"] > #home-button:hover {
cc4b0b0d
RK
946 -moz-image-region: rect(32px, 128px, 64px, 96px);
947}
948
43cc2806 949#bookmarks-menu-button[cui-areatype="menu-panel"],
7d3f7f14 950toolbarpaletteitem[place="palette"] > #bookmarks-menu-button {
46e71434 951 -moz-image-region: rect(0px, 192px, 32px, 160px);
43cc2806
RK
952}
953
cc4b0b0d 954#bookmarks-menu-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 955toolbarpaletteitem[place="palette"] > #bookmarks-menu-button:hover {
46e71434
RK
956 -moz-image-region: rect(32px, 192px, 64px, 160px);
957}
958
959#bookmarks-menu-button[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
960 -moz-image-region: rect(32px, 192px, 64px, 160px);
cc4b0b0d
RK
961}
962
43cc2806 963#history-panelmenu[cui-areatype="menu-panel"],
7d3f7f14 964toolbarpaletteitem[place="palette"] > #history-panelmenu {
43cc2806
RK
965 -moz-image-region: rect(0px, 224px, 32px, 192px);
966}
967
cc4b0b0d 968#history-panelmenu[cui-areatype="menu-panel"]:hover,
7d3f7f14 969toolbarpaletteitem[place="palette"] > #history-panelmenu:hover {
cc4b0b0d
RK
970 -moz-image-region: rect(32px, 224px, 64px, 192px);
971}
972
46e71434
RK
973#history-panelmenu[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
974 -moz-image-region: rect(32px, 224px, 64px, 192px);
975}
976
43cc2806 977#downloads-button[cui-areatype="menu-panel"],
7d3f7f14 978toolbarpaletteitem[place="palette"] > #downloads-button {
43cc2806
RK
979 -moz-image-region: rect(0px, 256px, 32px, 224px);
980}
981
cc4b0b0d 982#downloads-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 983toolbarpaletteitem[place="palette"] > #downloads-button:hover {
cc4b0b0d
RK
984 -moz-image-region: rect(32px, 256px, 64px, 224px);
985}
986
43cc2806 987#add-ons-button[cui-areatype="menu-panel"],
7d3f7f14 988toolbarpaletteitem[place="palette"] > #add-ons-button {
43cc2806
RK
989 -moz-image-region: rect(0px, 288px, 32px, 256px);
990}
991
cc4b0b0d 992#add-ons-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 993toolbarpaletteitem[place="palette"] > #add-ons-button:hover {
cc4b0b0d
RK
994 -moz-image-region: rect(32px, 288px, 64px, 256px);
995}
996
43cc2806 997#open-file-button[cui-areatype="menu-panel"],
7d3f7f14 998toolbarpaletteitem[place="palette"] > #open-file-button {
43cc2806
RK
999 -moz-image-region: rect(0px, 320px, 32px, 288px);
1000}
1001
cc4b0b0d 1002#open-file-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1003toolbarpaletteitem[place="palette"] > #open-file-button:hover {
cc4b0b0d
RK
1004 -moz-image-region: rect(32px, 320px, 64px, 288px);
1005}
1006
43cc2806 1007#save-page-button[cui-areatype="menu-panel"],
7d3f7f14 1008toolbarpaletteitem[place="palette"] > #save-page-button {
43cc2806
RK
1009 -moz-image-region: rect(0px, 352px, 32px, 320px);
1010}
1011
cc4b0b0d 1012#save-page-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1013toolbarpaletteitem[place="palette"] > #save-page-button:hover {
cc4b0b0d
RK
1014 -moz-image-region: rect(32px, 352px, 64px, 320px);
1015}
1016
43cc2806 1017#sync-button[cui-areatype="menu-panel"],
7d3f7f14 1018toolbarpaletteitem[place="palette"] > #sync-button {
7327c957 1019 -moz-image-region: rect(0px, 1024px, 32px, 992px);
43cc2806
RK
1020}
1021
cc4b0b0d 1022#sync-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1023toolbarpaletteitem[place="palette"] > #sync-button:hover {
7327c957 1024 -moz-image-region: rect(32px, 1024px, 64px, 992px);
5401f433
RK
1025}
1026
9ff3770c
RK
1027#containers-panelmenu[cui-areatype="menu-panel"],
1028toolbarpaletteitem[place="palette"] > #containers-panelmenu {
1029 -moz-image-region: rect(0px, 1056px, 32px, 1024px);
1030}
1031
1032#containers-panelmenu[cui-areatype="menu-panel"]:hover,
1033toolbarpaletteitem[place="palette"] > #containers-panelmenu:hover,
1034#containers-panelmenu[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
1035 -moz-image-region: rect(32px, 1056px, 64px, 1024px);
1036}
1037
43cc2806 1038#feed-button[cui-areatype="menu-panel"],
7d3f7f14 1039toolbarpaletteitem[place="palette"] > #feed-button {
43cc2806
RK
1040 -moz-image-region: rect(0px, 416px, 32px, 384px);
1041}
1042
cc4b0b0d 1043#feed-button[cui-areatype="menu-panel"]:hover:not([disabled="true"]),
7d3f7f14 1044toolbarpaletteitem[place="palette"] > #feed-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1045 -moz-image-region: rect(32px, 416px, 64px, 384px);
1046}
1047
1048#feed-button[cui-areatype="menu-panel"][disabled="true"],
7d3f7f14 1049toolbarpaletteitem[place="palette"] > #feed-button[disabled="true"] {
cc4b0b0d
RK
1050 -moz-image-region: rect(64px, 416px, 96px, 384px);
1051}
1052
43cc2806 1053#social-share-button[cui-areatype="menu-panel"],
7d3f7f14 1054toolbarpaletteitem[place="palette"] > #social-share-button {
43cc2806
RK
1055 -moz-image-region: rect(0px, 448px, 32px, 416px);
1056}
1057
22180555
RK
1058#social-share-button[cui-areatype="menu-panel"]:hover:not([disabled="true"]),
1059toolbarpaletteitem[place="palette"] > #social-share-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1060 -moz-image-region: rect(32px, 448px, 64px, 416px);
1061}
1062
22180555
RK
1063#social-share-button[cui-areatype="menu-panel"][disabled="true"],
1064toolbarpaletteitem[place="palette"] > #social-share-button[disabled="true"] {
1065 -moz-image-region: rect(64px, 448px, 96px, 416px);
1066}
1067
43cc2806 1068#characterencoding-button[cui-areatype="menu-panel"],
7d3f7f14 1069toolbarpaletteitem[place="palette"] > #characterencoding-button {
43cc2806
RK
1070 -moz-image-region: rect(0px, 480px, 32px, 448px);
1071}
1072
cc4b0b0d 1073#characterencoding-button[cui-areatype="menu-panel"]:hover:not([disabled="true"]),
7d3f7f14 1074toolbarpaletteitem[place="palette"] > #characterencoding-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1075 -moz-image-region: rect(32px, 480px, 64px, 448px);
1076}
1077
1078#characterencoding-button[cui-areatype="menu-panel"][disabled="true"],
7d3f7f14 1079toolbarpaletteitem[place="palette"] > #characterencoding-button[disabled="true"] {
cc4b0b0d
RK
1080 -moz-image-region: rect(64px, 480px, 96px, 448px);
1081}
1082
46e71434
RK
1083#characterencoding-button[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
1084 -moz-image-region: rect(32px, 480px, 64px, 448px);
1085}
1086
43cc2806 1087#new-window-button[cui-areatype="menu-panel"],
7d3f7f14 1088toolbarpaletteitem[place="palette"] > #new-window-button {
43cc2806
RK
1089 -moz-image-region: rect(0px, 512px, 32px, 480px);
1090}
1091
cc4b0b0d 1092#new-window-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1093toolbarpaletteitem[place="palette"] > #new-window-button:hover {
cc4b0b0d
RK
1094 -moz-image-region: rect(32px, 512px, 64px, 480px);
1095}
1096
5401f433
RK
1097#e10s-button[cui-areatype="menu-panel"],
1098toolbarpaletteitem[place="palette"] > #e10s-button {
1099 -moz-image-region: rect(0px, 512px, 32px, 480px);
1100}
1101
1102#e10s-button[cui-areatype="menu-panel"]:hover,
1103toolbarpaletteitem[place="palette"] > #e10s-button:hover {
1104 -moz-image-region: rect(32px, 512px, 64px, 480px);
1105}
1106
43cc2806 1107#new-tab-button[cui-areatype="menu-panel"],
7d3f7f14 1108toolbarpaletteitem[place="palette"] > #new-tab-button {
43cc2806
RK
1109 -moz-image-region: rect(0px, 544px, 32px, 512px);
1110}
1111
cc4b0b0d 1112#new-tab-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1113toolbarpaletteitem[place="palette"] > #new-tab-button:hover {
cc4b0b0d
RK
1114 -moz-image-region: rect(32px, 544px, 64px, 512px);
1115}
1116
43cc2806 1117#privatebrowsing-button[cui-areatype="menu-panel"],
7d3f7f14 1118toolbarpaletteitem[place="palette"] > #privatebrowsing-button {
43cc2806
RK
1119 -moz-image-region: rect(0px, 576px, 32px, 544px);
1120}
1121
cc4b0b0d 1122#privatebrowsing-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1123toolbarpaletteitem[place="palette"] > #privatebrowsing-button:hover {
cc4b0b0d
RK
1124 -moz-image-region: rect(32px, 576px, 64px, 544px);
1125}
1126
46e71434
RK
1127#tabview-button[cui-areatype="menu-panel"],
1128toolbarpaletteitem[place="palette"] > #tabview-button {
1129 -moz-image-region: rect(0px, 608px, 32px, 576px);
1130}
1131
1132#tabview-button[cui-areatype="menu-panel"]:hover,
1133toolbarpaletteitem[place="palette"] > #tabview-button:hover {
1134 -moz-image-region: rect(32px, 608px, 64px, 576px);
1135}
1136
43cc2806 1137#find-button[cui-areatype="menu-panel"],
7d3f7f14 1138toolbarpaletteitem[place="palette"] > #find-button {
43cc2806
RK
1139 -moz-image-region: rect(0px, 640px, 32px, 608px);
1140}
1141
cc4b0b0d 1142#find-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1143toolbarpaletteitem[place="palette"] > #find-button:hover {
cc4b0b0d
RK
1144 -moz-image-region: rect(32px, 640px, 64px, 608px);
1145}
1146
43cc2806 1147#print-button[cui-areatype="menu-panel"],
7d3f7f14 1148toolbarpaletteitem[place="palette"] > #print-button {
43cc2806
RK
1149 -moz-image-region: rect(0px, 672px, 32px, 640px);
1150}
1151
cc4b0b0d 1152#print-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1153toolbarpaletteitem[place="palette"] > #print-button:hover {
cc4b0b0d
RK
1154 -moz-image-region: rect(32px, 672px, 64px, 640px);
1155}
1156
43cc2806 1157#fullscreen-button[cui-areatype="menu-panel"],
7d3f7f14 1158toolbarpaletteitem[place="palette"] > #fullscreen-button {
43cc2806
RK
1159 -moz-image-region: rect(0px, 704px, 32px, 672px);
1160}
1161
cc4b0b0d 1162#fullscreen-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1163toolbarpaletteitem[place="palette"] > #fullscreen-button:hover {
cc4b0b0d
RK
1164 -moz-image-region: rect(32px, 704px, 64px, 672px);
1165}
1166
43cc2806 1167#developer-button[cui-areatype="menu-panel"],
7d3f7f14 1168toolbarpaletteitem[place="palette"] > #developer-button {
43cc2806
RK
1169 -moz-image-region: rect(0px, 736px, 32px, 704px);
1170}
1171
cc4b0b0d 1172#developer-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1173toolbarpaletteitem[place="palette"] > #developer-button:hover {
cc4b0b0d
RK
1174 -moz-image-region: rect(32px, 736px, 64px, 704px);
1175}
1176
46e71434
RK
1177#developer-button[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
1178 -moz-image-region: rect(32px, 736px, 64px, 704px);
1179}
1180
43cc2806 1181#preferences-button[cui-areatype="menu-panel"],
7d3f7f14 1182toolbarpaletteitem[place="palette"] > #preferences-button {
43cc2806
RK
1183 -moz-image-region: rect(0px, 768px, 32px, 736px);
1184}
1185
cc4b0b0d 1186#preferences-button[cui-areatype="menu-panel"]:hover,
7d3f7f14 1187toolbarpaletteitem[place="palette"] > #preferences-button:hover {
cc4b0b0d
RK
1188 -moz-image-region: rect(32px, 768px, 64px, 736px);
1189}
1190
46e71434
RK
1191#email-link-button[cui-areatype="menu-panel"],
1192toolbarpaletteitem[place="palette"] > #email-link-button {
1193 -moz-image-region: rect(0, 800px, 32px, 768px);
1194}
1195
22180555
RK
1196#email-link-button[cui-areatype="menu-panel"]:hover:not([disabled="true"]),
1197toolbarpaletteitem[place="palette"] > #email-link-button:hover:not([disabled="true"]) {
46e71434
RK
1198 -moz-image-region: rect(32px, 800px, 64px, 768px);
1199}
1200
22180555
RK
1201#email-link-button[cui-areatype="menu-panel"][disabled="true"],
1202toolbarpaletteitem[place="palette"] > #email-link-button[disabled="true"] {
1203 -moz-image-region: rect(64px, 800px, 96px, 768px);
1204}
1205
46e71434
RK
1206#sidebar-button[cui-areatype="menu-panel"],
1207toolbarpaletteitem[place="palette"] > #sidebar-button {
1208 -moz-image-region: rect(0, 864px, 32px, 832px);
1209}
1210
1211#sidebar-button[cui-areatype="menu-panel"]:hover,
22180555
RK
1212toolbarpaletteitem[place="palette"] > #sidebar-button:hover,
1213#sidebar-button[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
46e71434
RK
1214 -moz-image-region: rect(32px, 864px, 64px, 832px);
1215}
1216
22180555
RK
1217#panic-button[cui-areatype="menu-panel"],
1218toolbarpaletteitem[place="palette"] > #panic-button {
1219 -moz-image-region: rect(0, 896px, 32px, 864px);
1220}
1221
1222#panic-button[cui-areatype="menu-panel"]:hover,
1223toolbarpaletteitem[place="palette"] > #panic-button:hover,
1224#panic-button[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
1225 -moz-image-region: rect(32px, 896px, 64px, 864px);
1226}
1227
e548e22e
RK
1228#webide-button[cui-areatype="menu-panel"],
1229toolbarpaletteitem[place="palette"] > #webide-button {
1230 -moz-image-region: rect(0px, 960px, 32px, 928px);
1231}
1232
1233#webide-button[cui-areatype="menu-panel"]:hover,
1234toolbarpaletteitem[place="palette"] > #webide-button:hover {
1235 -moz-image-region: rect(32px, 960px, 64px, 928px);
1236}
1237
46e71434
RK
1238toolbaritem[sdkstylewidget="true"] > toolbarbutton {
1239 -moz-image-region: rect(0, 832px, 32px, 800px);
1240}
1241
43cc2806
RK
1242/* Wide panel control icons */
1243
51994fad
RK
1244#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton,
1245#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton,
7d3f7f14
RK
1246toolbarpaletteitem[place="palette"] > #edit-controls > toolbarbutton,
1247toolbarpaletteitem[place="palette"] > #zoom-controls > toolbarbutton {
e548e22e 1248 list-style-image: var(--menupanel-small-list-style-image);
43cc2806
RK
1249}
1250
51994fad 1251#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #cut-button,
7d3f7f14 1252toolbarpaletteitem[place="palette"] > #edit-controls > #cut-button {
43cc2806
RK
1253 -moz-image-region: rect(0px, 32px, 16px, 16px);
1254}
1255
51994fad 1256#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #cut-button:hover:not([disabled="true"]),
7d3f7f14 1257toolbarpaletteitem[place="palette"] > #edit-controls > #cut-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1258 -moz-image-region: rect(16px, 32px, 32px, 16px);
1259}
1260
51994fad 1261#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #cut-button[disabled="true"],
7d3f7f14 1262toolbarpaletteitem[place="palette"] > #edit-controls > #cut-button[disabled="true"] {
cc4b0b0d
RK
1263 -moz-image-region: rect(32px, 32px, 48px, 16px);
1264}
1265
51994fad 1266#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #copy-button,
7d3f7f14 1267toolbarpaletteitem[place="palette"] > #edit-controls > #copy-button {
43cc2806
RK
1268 -moz-image-region: rect(0px, 48px, 16px, 32px);
1269}
1270
51994fad 1271#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #copy-button:hover:not([disabled="true"]),
7d3f7f14 1272toolbarpaletteitem[place="palette"] > #edit-controls > #copy-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1273 -moz-image-region: rect(16px, 48px, 32px, 32px);
1274}
1275
51994fad 1276#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #copy-button[disabled="true"],
7d3f7f14 1277toolbarpaletteitem[place="palette"] > #edit-controls > #copy-button[disabled="true"] {
cc4b0b0d
RK
1278 -moz-image-region: rect(32px, 48px, 48px, 32px);
1279}
1280
51994fad 1281#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #paste-button,
7d3f7f14 1282toolbarpaletteitem[place="palette"] > #edit-controls > #paste-button {
43cc2806
RK
1283 -moz-image-region: rect(0px, 64px, 16px, 48px);
1284}
1285
51994fad 1286#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #paste-button:hover:not([disabled="true"]),
7d3f7f14 1287toolbarpaletteitem[place="palette"] > #edit-controls > #paste-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1288 -moz-image-region: rect(16px, 64px, 32px, 48px);
1289}
1290
51994fad 1291#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #paste-button[disabled="true"],
7d3f7f14 1292toolbarpaletteitem[place="palette"] > #edit-controls > #paste-button[disabled="true"] {
cc4b0b0d
RK
1293 -moz-image-region: rect(32px, 64px, 48px, 48px);
1294}
1295
51994fad 1296#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-out-button,
7d3f7f14 1297toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-out-button {
43cc2806
RK
1298 -moz-image-region: rect(0px, 80px, 16px, 64px);
1299}
1300
51994fad 1301#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-out-button:hover:not([disabled="true"]),
7d3f7f14 1302toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-out-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1303 -moz-image-region: rect(16px, 80px, 32px, 64px);
1304}
1305
51994fad 1306#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-out-button[disabled="true"],
7d3f7f14 1307toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-out-button[disabled="true"] {
cc4b0b0d
RK
1308 -moz-image-region: rect(32px, 80px, 48px, 64px);
1309}
1310
51994fad 1311#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-in-button,
7d3f7f14 1312toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button {
43cc2806
RK
1313 -moz-image-region: rect(0px, 96px, 16px, 80px);
1314}
1315
51994fad 1316#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-in-button:hover:not([disabled="true"]),
7d3f7f14 1317toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button:hover:not([disabled="true"]) {
cc4b0b0d
RK
1318 -moz-image-region: rect(16px, 96px, 32px, 80px);
1319}
1320
51994fad 1321#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-in-button[disabled="true"],
7d3f7f14 1322toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button[disabled="true"] {
cc4b0b0d
RK
1323 -moz-image-region: rect(32px, 96px, 48px, 80px);
1324}
1325
e548e22e
RK
1326#add-share-provider {
1327 list-style-image: var(--menupanel-small-list-style-image);
1328 -moz-image-region: rect(0px, 96px, 16px, 80px);
1329}
1330
43cc2806
RK
1331/* === END menupanel.inc.css === */
1332
63ada306
RK
1333.toolbarbutton-1:not([type="menu-button"]) {
1334 -moz-box-orient: vertical;
1335}
1336
319c6529
RK
1337.toolbarbutton-1,
1338.toolbarbutton-1 > .toolbarbutton-menubutton-button {
c0f6797e
RK
1339/* min-width: 36px;
1340 min-height: 36px;*/
319c6529
RK
1341}
1342
1343.toolbarbutton-1,
1344.toolbarbutton-1 > .toolbarbutton-menubutton-button,
1345.toolbarbutton-1[disabled="true"]:hover:active,
1346.toolbarbutton-1[disabled="true"]:hover:active > .toolbarbutton-menubutton-button {
1347 padding: 1px 2px;
1348}
1349
1350.toolbarbutton-1:hover:active,
1351.toolbarbutton-1[open="true"],
1352.toolbarbutton-1:hover:active > .toolbarbutton-menubutton-button {
1353 padding-top: 2px;
1354 padding-bottom: 0px;
dae45075
RK
1355 padding-inline-start: 3px;
1356 padding-inline-end: 1px;
319c6529
RK
1357}
1358
c0f6797e
RK
1359#main-window:not([customizing]) .toolbarbutton-1[disabled=true] > .toolbarbutton-icon,
1360#main-window:not([customizing]) .toolbarbutton-1[disabled=true] > .toolbarbutton-menu-dropmarker,
1361#main-window:not([customizing]) .toolbarbutton-1[disabled=true] > .toolbarbutton-menubutton-dropmarker,
1362#main-window:not([customizing]) .toolbarbutton-1[disabled=true] > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
1363#main-window:not([customizing]) .toolbarbutton-1 > .toolbarbutton-menubutton-button[disabled=true] > .toolbarbutton-icon {
e20c83c3
RK
1364}
1365
c0f6797e
RK
1366.toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
1367.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
e20c83c3
RK
1368}
1369
c0f6797e
RK
1370toolbar .toolbarbutton-1 > .toolbarbutton-menu-dropmarker:-moz-lwtheme-brighttext,
1371toolbar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker:-moz-lwtheme-brighttext {
319c6529
RK
1372}
1373
c0f6797e
RK
1374.toolbarbutton-1 > .toolbarbutton-icon,
1375.toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
319c6529
RK
1376}
1377
20752032 1378.findbar-button,
c0f6797e
RK
1379#nav-bar .toolbarbutton-1,
1380#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button {
319c6529
RK
1381}
1382
c0f6797e
RK
1383#nav-bar .toolbarbutton-1:not([type=menu-button]),
1384#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button,
1385#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
319c6529
RK
1386}
1387
c0f6797e 1388#nav-bar #PanelUI-menu-button {
dae45075
RK
1389/* padding-inline-start: 7px;
1390 padding-inline-end: 5px;*/
319c6529
RK
1391}
1392
b1dfcf32 1393#nav-bar .toolbarbutton-1[type=panel],
8c5bee4f 1394#nav-bar .toolbarbutton-1[type=menu]:not(#back-button):not(#forward-button):not(#feed-button):not(#PanelUI-menu-button) {
c0f6797e
RK
1395/* padding-left: 5px;
1396 padding-right: 5px;*/
319c6529
RK
1397}
1398
c0f6797e
RK
1399#nav-bar .toolbarbutton-1 > menupopup {
1400/* margin-top: -3px;*/
319c6529
RK
1401}
1402
c0f6797e 1403#nav-bar .toolbarbutton-1 > menupopup.cui-widget-panel {
c1d2ce3e 1404 margin-top: -4px;
319c6529
RK
1405}
1406
c0f6797e 1407#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button {
dae45075 1408/* padding-inline-end: 0;*/
319c6529
RK
1409}
1410
c0f6797e 1411#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
dae45075 1412/* padding-inline-start: 0;
c0f6797e 1413 -moz-box-align: center;*/
319c6529
RK
1414}
1415
20752032 1416.findbar-button > .toolbarbutton-text,
c0f6797e
RK
1417#nav-bar .toolbarbutton-1 > .toolbarbutton-icon,
1418#nav-bar .toolbarbutton-1 > .toolbarbutton-text,
19988d2d 1419#nav-bar .toolbarbutton-1 > .toolbarbutton-badge-stack,
c0f6797e
RK
1420#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
1421#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon,
2c62526c 1422window:not([chromehidden~="toolbar"]) #urlbar-wrapper > .toolbarbutton-1:-moz-any([disabled=true],:not([open]):not([disabled=true]):not(:active)) > .toolbarbutton-icon {
c0f6797e
RK
1423/* padding: 2px 6px;
1424 border: 1px solid;
1425 border-color: transparent;
1426 transition-property: background-color, border-color;
1427 transition-duration: 150ms;*/
d54f5b23 1428}
c0f6797e
RK
1429/*
1430#nav-bar .toolbarbutton-1:not(:-moz-any(@primaryToolbarButtons@)) > .toolbarbutton-icon,
19988d2d 1431#nav-bar .toolbarbutton-1:not(:-moz-any(@primaryToolbarButtons@)) > .toolbarbutton-badge-stack,
c0f6797e
RK
1432#nav-bar .toolbarbutton-1:not(:-moz-any(@primaryToolbarButtons@)) > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
1433 padding: 3px 7px;
d54f5b23 1434}
c0f6797e 1435*/
d54f5b23 1436
c0f6797e 1437/* Help SDK icons fit: */
a5cb6e53 1438toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-icon,
19988d2d 1439toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-badge-stack > .toolbarbutton-icon {
c0f6797e 1440 width: 16px;
26125509
RK
1441}
1442
a5cb6e53 1443#nav-bar toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-icon {
c0f6797e
RK
1444 /* XXXgijs box models strike again: this is 16px + 2 * 7px padding + 2 * 1px border (from the rules above) */
1445 width: 32px;
26125509 1446}
26125509 1447
b1dfcf32
RK
1448#nav-bar .toolbarbutton-1[type=panel] > .toolbarbutton-icon,
1449#nav-bar .toolbarbutton-1[type=panel] > .toolbarbutton-badge-stack,
1450#nav-bar .toolbarbutton-1[type=menu]:not(#PanelUI-menu-button):not(#back-button):not(#forward-button) > .toolbarbutton-icon,
1451#nav-bar .toolbarbutton-1[type=menu]:not(#PanelUI-menu-button) > .toolbarbutton-badge-stack,
c0f6797e 1452#nav-bar .toolbarbutton-1[type=menu] > .toolbarbutton-text /* hack for add-ons that forcefully display the label */ {
dae45075 1453/* padding-inline-end: 17px;*/
319c6529
RK
1454}
1455
fa703ff4
RK
1456#nav-bar .toolbarbutton-1[type=panel] > .toolbarbutton-icon,
1457#nav-bar .toolbarbutton-1[type=menu]:not(#PanelUI-menu-button):not(#back-button):not(#forward-button) > .toolbarbutton-icon {
1458 /* horizontal padding + border + icon width */
1459/* max-width: 43px;*/
1460}
1461
c0f6797e 1462#nav-bar .toolbarbutton-1 > .toolbarbutton-menu-dropmarker {
319c6529
RK
1463}
1464
c0f6797e 1465#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
319c6529
RK
1466}
1467
c0f6797e 1468#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
38cfeb47
RK
1469}
1470
c0f6797e
RK
1471#nav-bar .toolbaritem-combined-buttons {
1472/* margin-left: 2px;
1473 margin-right: 2px;*/
38cfeb47
RK
1474}
1475
c0f6797e
RK
1476#nav-bar .toolbaritem-combined-buttons > .toolbarbutton-1 {
1477/* padding-left: 0;
1478 padding-right: 0;*/
319c6529
RK
1479}
1480
c0f6797e
RK
1481#nav-bar .toolbarbutton-1:not(:hover):not(:active):not([open]) > .toolbarbutton-menubutton-dropmarker::before,
1482#nav-bar .toolbaritem-combined-buttons > .toolbarbutton-1:-moz-any(:not(:hover):not([open]),[disabled=true]) + .toolbarbutton-1:-moz-any(:not(:hover):not([open]),[disabled=true])::before {
1483/*
1484 content: "";
1485 display: -moz-box;
1486 width: 1px;
1487 height: 16px;
dae45075 1488 margin-inline-end: -1px;
c0f6797e 1489*/
319c6529
RK
1490}
1491
2c62526c 1492window:not([chromehidden~="toolbar"]) #urlbar-wrapper > .toolbarbutton-1:-moz-any([disabled=true],:not([open]):not([disabled=true]):not(:active)) > .toolbarbutton-icon {
319c6529
RK
1493}
1494
20752032 1495.findbar-button:not(:-moz-any([checked="true"],[disabled="true"])):hover > .toolbarbutton-text,
43371c9b 1496#nav-bar .toolbarbutton-1:not([disabled=true]) > .toolbarbutton-menubutton-button[open] + .toolbarbutton-menubutton-dropmarker > .dropmarker-icon,
c0f6797e
RK
1497#nav-bar .toolbarbutton-1:not([disabled=true]):-moz-any(:hover,[open]) > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
1498#nav-bar .toolbarbutton-1:not([disabled=true]):-moz-any(:hover,[open]) > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon,
1499#nav-bar .toolbarbutton-1:not([disabled=true]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-icon,
1500#nav-bar .toolbarbutton-1:not([disabled=true]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-text,
19988d2d 1501#nav-bar .toolbarbutton-1:not([disabled=true]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-badge-stack,
2c62526c 1502window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #forward-button:not([open]):not(:active):not([disabled=true]):hover > .toolbarbutton-icon,
46e71434 1503#nav-bar .toolbarbutton-1:not([buttonover]):not([open]):not(:active):hover > .toolbarbutton-menubutton-dropmarker:not([disabled=true]) > .dropmarker-icon {
319c6529
RK
1504}
1505
20752032 1506.findbar-button:not([disabled=true]):-moz-any([checked="true"],:hover:active) > .toolbarbutton-text,
43371c9b 1507#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled=true]):-moz-any(:hover:active, [open]) > .toolbarbutton-icon,
c0f6797e
RK
1508#nav-bar .toolbarbutton-1[open] > .toolbarbutton-menubutton-dropmarker:not([disabled=true]) > .dropmarker-icon,
1509#nav-bar .toolbarbutton-1:not([disabled=true]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-icon,
1510#nav-bar .toolbarbutton-1:not([disabled=true]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-text,
19988d2d 1511#nav-bar .toolbarbutton-1:not([disabled=true]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-badge-stack {
319c6529
RK
1512}
1513
c0f6797e
RK
1514#TabsToolbar .toolbarbutton-1,
1515#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button,
1516.tabbrowser-arrowscrollbox > .scrollbutton-up,
1517.tabbrowser-arrowscrollbox > .scrollbutton-down {
e8519ae0
RK
1518}
1519
c0f6797e
RK
1520#TabsToolbar .toolbarbutton-1:not([disabled=true]):hover,
1521#TabsToolbar .toolbarbutton-1[open],
1522#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled=true]):hover,
1523.tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled=true]):hover,
1524.tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled=true]):hover {
e8519ae0
RK
1525}
1526
c0f6797e 1527/* unified back/forward button */
319c6529 1528
c0f6797e 1529#forward-button {
589b5528 1530 -moz-box-align: stretch; /* let the button shape grow vertically with the location bar */
71bac478
RK
1531}
1532
c0f6797e
RK
1533#forward-button > menupopup {
1534 margin-top: 1px !important;
319c6529
RK
1535}
1536
c0f6797e
RK
1537#forward-button > .toolbarbutton-icon {
1538 background-clip: padding-box !important;
1539 /*mask: url(keyhole-forward-mask.svg#mask); XXX: this regresses twinopen */
5401f433 1540 /*clip-path: url(chrome://browser/content/browser.xul#keyhole-forward-clip-path) !important;*/
71bac478
RK
1541}
1542
c0f6797e 1543#forward-button {
dae45075 1544 margin-inline-start: -4px !important;
9d1e25fa
RK
1545 padding-left: 5px;
1546 padding-right: 5px;
c0f6797e
RK
1547 margin-top: 3px;
1548 margin-bottom: 3px;
1549 border-radius: 0 10000px 10000px 0;
7327c957 1550/* max-width: calc(var(--forwardbutton-width) + var(--backbutton-urlbar-overlap)) !important; */
319c6529
RK
1551}
1552
c0f6797e
RK
1553#forward-button:-moz-locale-dir(rtl) {
1554 border-radius: 10000px 0 0 10000px;
8ad8bf83
RK
1555}
1556
2c62526c 1557window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not([switchingtabs]) > #forward-button {
aec5dfad 1558 transition: margin-left 150ms ease-out;
2c62526c
RK
1559}
1560
1561window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #forward-button[disabled] {
7327c957 1562 margin-left: calc(0px - var(--forwardbutton-width)/* - var(--backbutton-urlbar-overlap)*/);
2c62526c
RK
1563}
1564
1565window:not([chromehidden~="toolbar"]) #urlbar-wrapper:hover:not([switchingtabs]) > #forward-button[disabled] {
1566 /* delay the hiding of the forward button when hovered to avoid accidental clicks on the url bar */
1567 transition-delay: 100s;
1568}
1569
1570window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not(:hover) > #forward-button[disabled] {
1571 /* when not hovered anymore, trigger a new transition to hide the forward button immediately */
7327c957 1572 margin-left: calc(-0.01px - var(--forwardbutton-width)/* - var(--backbutton-urlbar-overlap)*/);
2c62526c
RK
1573}
1574
c0f6797e
RK
1575#back-button {
1576/* padding-top: 3px !important;
1577 padding-bottom: 3px !important;
dae45075
RK
1578 padding-inline-start: 5px !important;
1579 padding-inline-end: 0 !important;*/
c0f6797e
RK
1580 position: relative;
1581 z-index: 1;
1582 border-radius: 10000px;
1583 width: 30px;
1584 height: 30px;
1585 margin-top: -2px;
1586 margin-bottom: -2px;
143c5409
RK
1587}
1588
c0f6797e 1589#back-button:-moz-locale-dir(rtl) {
319c6529
RK
1590}
1591
c0f6797e
RK
1592#back-button > menupopup {
1593 margin-top: -1px !important;
b36fc72e
RK
1594}
1595
c0f6797e
RK
1596#back-button > .toolbarbutton-icon {
1597 border-radius: 10000px !important;
1598 background-clip: padding-box !important;
1599/* background-color: hsla(210,25%,98%,.08) !important;
1600 padding: 6px !important;
589b5528
RK
1601 border-style: none !important;
1602 box-shadow: 0 1px 0 0 hsla(210,4%,10%,.25),
1603 0 0 0 1px hsla(210,4%,10%,.25);*/
1604 transition-property: background-color, box-shadow !important;
c0f6797e 1605 transition-duration: 250ms !important;
143c5409
RK
1606}
1607
c0f6797e 1608#back-button:not([disabled="true"]):not([open="true"]):not(:active):hover > .toolbarbutton-icon {
589b5528 1609/* background-color: hsla(210,4%,10%,.08) !important;*/
143c5409
RK
1610}
1611
c0f6797e
RK
1612#back-button:not([disabled="true"]):hover:active > .toolbarbutton-icon,
1613#back-button[open="true"] > .toolbarbutton-icon {
1614/* background-color: hsla(210,4%,10%,.12) !important;
589b5528
RK
1615 box-shadow: 0 1px 0 0 hsla(210,4%,10%,.25),
1616 0 0 0 1px hsla(210,4%,10%,.25),
1617 0 1px 0 0 hsla(210,80%,20%,.1) inset !important;*/
143c5409
RK
1618}
1619
2c62526c 1620#back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
c0f6797e 1621 transform: scaleX(-1);
143c5409 1622}
c0f6797e
RK
1623/*
1624.unified-nav-back[_moz-menuactive]:-moz-locale-dir(ltr),
1625.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl) {
1626 list-style-image: url("chrome://browser/skin/menu-back.png") !important;
6adbc9a6
RK
1627}
1628
c0f6797e
RK
1629.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(ltr),
1630.unified-nav-back[_moz-menuactive]:-moz-locale-dir(rtl) {
1631 list-style-image: url("chrome://browser/skin/menu-forward.png") !important;
6adbc9a6
RK
1632}
1633
c0f6797e
RK
1634#home-button.bookmark-item {
1635 list-style-image: url("chrome://browser/skin/Toolbar.png");
6adbc9a6
RK
1636}
1637
c0f6797e
RK
1638#main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) > #bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon:-moz-system-metric(windows-classic):not(:-moz-lwtheme),
1639#main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) > toolbarpaletteitem > #bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon:-moz-system-metric(windows-classic):not(:-moz-lwtheme),
1640#main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) > toolbarpaletteitem > toolbaritem > :-moz-any(@nestedButtons@):-moz-system-metric(windows-classic):not(:-moz-lwtheme),
1641#main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) > toolbaritem > :-moz-any(@nestedButtons@):-moz-system-metric(windows-classic):not(:-moz-lwtheme),
1642#main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) > toolbarpaletteitem > :-moz-any(@primaryToolbarButtons@):-moz-system-metric(windows-classic):not(:-moz-lwtheme),
1643#main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) > :-moz-any(@primaryToolbarButtons@):-moz-system-metric(windows-classic):not(:-moz-lwtheme),
1644#home-button.bookmark-item:-moz-lwtheme-brighttext {
1645 position: relative;
1646 z-index: 1;
1647 list-style-image: url("chrome://browser/skin/Toolbar-inverted.png");
6adbc9a6
RK
1648}
1649
c0f6797e
RK
1650#main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) > #sync-button[status="active"]:-moz-system-metric(windows-classic):not(:-moz-lwtheme),
1651#main-window[tabsintitlebar]:not([inFullscreen]) :-moz-any(#TabsToolbar, #toolbar-menubar) > toolbarpaletteitem > #sync-button[status="active"]:-moz-system-metric(windows-classic):not(:-moz-lwtheme) {
1652 list-style-image: url("chrome://browser/skin/syncProgress-toolbar-inverted.png");
6adbc9a6 1653}
c0f6797e 1654*/
6adbc9a6 1655
c0f6797e
RK
1656#downloads-button > .toolbarbutton-icon {
1657 margin: 0;
6adbc9a6
RK
1658}
1659
9168a62c 1660/* tabview menu item */
c0f6797e 1661
6adbc9a6 1662#menu_tabview {
832af407 1663 list-style-image: url("chrome://browser/skin/tabview/tabviewFx.png");
6adbc9a6
RK
1664 -moz-image-region: rect(1px, 89px, 17px, 73px);
1665}
1666
1667#menu_tabview[groups="0"] {
1668 -moz-image-region: rect(1px, 17px, 17px, 1px);
1669}
1670
1671#menu_tabview[groups="1"] {
1672 -moz-image-region: rect(1px, 35px, 17px, 19px);
1673}
1674
1675#menu_tabview[groups="2"] {
1676 -moz-image-region: rect(1px, 53px, 17px, 37px);
1677}
1678
1679#menu_tabview[groups="3"] {
1680 -moz-image-region: rect(1px, 71px, 17px, 55px);
1681}
1682
9168a62c
RK
1683/* undo close tab menu item */
1684#alltabs_undoCloseTab {
1685 list-style-image: url(chrome://browser/skin/undoCloseTab.png);
1686}
1687
2e389898 1688@media (min-resolution: 1.1dppx) {
9168a62c
RK
1689 #alltabs_undoCloseTab {
1690 list-style-image: url(chrome://browser/skin/undoCloseTab@2x.png);
1691 }
1692 #alltabs_undoCloseTab > .toolbarbutton-icon {
1693 width: 16px;
1694 }
1695}
1696
5401f433
RK
1697/* zoom control text (reset) button special case: */
1698
1699#nav-bar #zoom-reset-button > .toolbarbutton-text {
1700 /* To make this line up with the icons, it needs the same height (18px) +
1701 * padding (2 * 2px) + border (2 * 1px), but as a minimum because otherwise
1702 * increase in text sizes would break things...
1703 */
1704 min-height: 20px;
1705}
1706
319c6529
RK
1707/* ::::: fullscreen window controls ::::: */
1708
8d7ef0d9 1709#window-controls {
dae45075 1710 margin-inline-start: 4px;
ab799a7a
RK
1711}
1712
319c6529
RK
1713#minimize-button,
1714#restore-button,
1715#close-button {
c0f6797e
RK
1716/* list-style-image: url("chrome://global/skin/icons/windowControls.png");
1717 padding: 0; */
319c6529
RK
1718}
1719
1720#minimize-button {
1721 list-style-image: url("chrome://navigator/skin/icons/win-minimize.gif");
1722}
1723
1724#minimize-button:hover {
1725 list-style-image: url("chrome://navigator/skin/icons/win-minimize-hover.gif");
1726}
1727
1728#restore-button {
1729 list-style-image: url("chrome://navigator/skin/icons/win-restore.gif");
1730}
1731
1732#restore-button:hover {
1733 list-style-image: url("chrome://navigator/skin/icons/win-restore-hover.gif");
1734}
1735
1736#close-button {
1737 list-style-image: url("chrome://navigator/skin/icons/win-close.gif");
1738}
1739
1740#close-button:hover {
1741 list-style-image: url("chrome://navigator/skin/icons/win-close-hover.gif");
1742}
1743
1744/* ::::: Location Bar ::::: */
1745
319c6529
RK
1746#urlbar,
1747.searchbar-textbox {
1748 border-radius: 5px;
aec5dfad 1749 margin: 2px 0;
dae45075 1750 margin-inline-start: 3px;
319c6529
RK
1751}
1752
ffce2402 1753#urlbar {
f0071a71
RK
1754 /* make color as light as possible to deal with dark non-domain parts */
1755 color: #FFBFFF;
ffce2402
RK
1756}
1757
319c6529
RK
1758#urlbar:-moz-lwtheme,
1759.searchbar-textbox:-moz-lwtheme {
1760 /* background-color: rgba(255,255,255,.8);
1761 @navbarTextboxCustomBorder@
1762 color: black; */
1763}
1764
c0f6797e
RK
1765#urlbar:-moz-lwtheme:hover:not([focused]):not([readonly]),
1766.searchbar-textbox:-moz-lwtheme:hover:not([focused]) {
1767/* background-color: rgba(255,255,255,.9);*/
1768}
1769
1770#urlbar:-moz-lwtheme[focused]:not([readonly]),
1771.searchbar-textbox:-moz-lwtheme[focused] {
1772/* background-color: white;*/
1773}
1774
2c62526c 1775window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar {
dae45075 1776/* border-inline-start: none;
2299146f 1777 margin-left: 0;*/
2c62526c
RK
1778}
1779
1780window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar:-moz-locale-dir(ltr) {
1781/* border-top-left-radius: 0;
1782 border-bottom-left-radius: 0; */
1783}
1784
1785window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar:-moz-locale-dir(rtl) {
1786/* border-top-right-radius: 0;
1787 border-bottom-right-radius: 0; */
1788}
1789
1790window:not([chromehidden~="toolbar"]) #urlbar-wrapper {
1791/* clip-path: url("chrome://browser/content/browser.xul#urlbar-back-button-clip-path");*/
b1dfcf32 1792/* margin-inline-start: calc(-1 * var(--backbutton-urlbar-overlap)); */
2c62526c
RK
1793}
1794
fff8097b
RK
1795window:not([chromehidden~="toolbar"]) #urlbar-wrapper:-moz-locale-dir(rtl),
1796window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar:-moz-locale-dir(rtl) {
2c62526c 1797 /* let urlbar-back-button-clip-path clip the urlbar's right side for RTL */
71a617ff 1798 transform: scaleX(-1);
8ad8bf83
RK
1799}
1800
2c62526c
RK
1801window:not([chromehidden~="toolbar"]) #urlbar-wrapper:-moz-locale-dir(rtl) {
1802 -moz-box-direction: reverse;
1803}
1804
a7145e95
RK
1805html|*.urlbar-input:-moz-lwtheme::-moz-placeholder,
1806.searchbar-textbox:-moz-lwtheme > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input::-moz-placeholder {
319c6529
RK
1807 color: #E7ADE7;
1808}
1809
319c6529
RK
1810#urlbar-container {
1811 -moz-box-orient: horizontal;
1812 -moz-box-align: stretch;
1813}
1814
9abeb12c
RK
1815.urlbar-textbox-container {
1816 -moz-box-align: stretch;
1817}
1818
a40f6a79 1819.urlbar-input-box {
dae45075 1820 margin-inline-start: 0;
a40f6a79
RK
1821}
1822
319c6529 1823#urlbar-icons {
319c6529
RK
1824 -moz-box-align: center;
1825}
1826
1827.urlbar-icon {
b8384c33 1828 padding: 0 2px;
fa703ff4
RK
1829 /* 16x16 icon with border-box sizing */
1830 width: 20px;
1831 height: 16px;
ffce2402
RK
1832}
1833
ffce2402 1834.search-go-container {
4b686546
RK
1835 padding: 2px;
1836}
1837
1838.search-go-container > .search-go-button {
1839 padding: 0;
319c6529
RK
1840}
1841
1437a48c
RK
1842#urlbar-search-footer {
1843 border-top: 1px solid #A09090;
1844}
1845
1846#urlbar-search-settings {
1847}
1848
1849#urlbar-search-settings:hover {
1850}
1851
1852#urlbar-search-settings:hover:active {
1853}
1854
319c6529
RK
1855#urlbar-search-splitter {
1856 min-width: 6px;
dae45075 1857 margin-inline-start: -3px;
319c6529
RK
1858 border: none;
1859 background: transparent;
1860}
1861
f0071a71 1862#urlbar-search-splitter + #urlbar-container > #urlbar,
319c6529 1863#urlbar-search-splitter + #search-container > #searchbar > .searchbar-textbox {
dae45075 1864 margin-inline-start: 0;
319c6529
RK
1865}
1866
e20c83c3
RK
1867#urlbar-display-box {
1868}
1869
8922acc9 1870.urlbar-display {
dae45075
RK
1871 border-inline-end: 1px solid #9C9CFF;
1872 margin-inline-end: 3px;
ab799a7a
RK
1873 margin-top: 0;
1874 margin-bottom: 0;
dae45075 1875 margin-inline-start: 0;
ab799a7a
RK
1876 color: #8050B0;
1877}
1878
b1dfcf32 1879/* === BEGIN urlbarSearchSuggestionsNotification.inc.css === */
e20c83c3 1880
b1dfcf32
RK
1881#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] {
1882 border-bottom: 1px solid #A09090;
1883 background-color: #000000;
1884 padding: 6px 0;
dae45075
RK
1885 padding-inline-start: 44px;
1886 padding-inline-end: 6px;
b1dfcf32
RK
1887 background-image: url("chrome://browser/skin/info.svg");
1888 background-clip: padding-box;
1889 background-position: 20px center;
1890 background-repeat: no-repeat;
1891 background-size: 16px 16px;
8ad8bf83
RK
1892}
1893
b1dfcf32
RK
1894#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"]:-moz-locale-dir(rtl) {
1895 background-position: right 20px center;
8ad8bf83
RK
1896}
1897
b1dfcf32
RK
1898#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > description {
1899 margin: 0;
1900 padding: 0;
2c62526c
RK
1901}
1902
b1dfcf32 1903#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > description > label.text-link {
dae45075 1904 margin-inline-start: 0;
8ad8bf83
RK
1905}
1906
b1dfcf32
RK
1907#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > button {
1908 -moz-appearance: none;
b1dfcf32
RK
1909 min-width: 80px;
1910 border-radius: 3px;
1911 padding: 4px 16px;
1912 margin: 0;
dae45075 1913 margin-inline-start: 10px;
8ad8bf83
RK
1914}
1915
b1dfcf32 1916#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > button[anonid="search-suggestions-notification-disable"] {
8ad8bf83
RK
1917}
1918
b1dfcf32 1919#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > button[anonid="search-suggestions-notification-disable"]:hover {
8ad8bf83
RK
1920}
1921
b1dfcf32 1922#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > button[anonid="search-suggestions-notification-enable"] {
8ad8bf83
RK
1923}
1924
b1dfcf32 1925#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > button[anonid="search-suggestions-notification-enable"]:hover {
319c6529
RK
1926}
1927
b1dfcf32 1928/* === END urlbarSearchSuggestionsNotification.inc.css === */
319c6529 1929
b1dfcf32
RK
1930#search-container {
1931 min-width: calc(54px + 11ch);
319c6529
RK
1932}
1933
b1dfcf32 1934/* identity box */
1437a48c 1935
19988d2d 1936#identity-box.verifiedIdentity:not(:-moz-lwtheme):not(:hover):not([open=true]) {
f36031bd 1937 background-color: var(--identity-box-verified-background-color);
319c6529
RK
1938}
1939
1940#identity-box:-moz-focusring {
1941 outline: 1px dotted #008484;
f993773d 1942 outline-offset: -1px;
319c6529
RK
1943}
1944
1945#identity-box.verifiedDomain:-moz-focusring,
1946#identity-box.verifiedIdentity:-moz-focusring {
1947 outline-color: #000000;
1948}
1949
319c6529
RK
1950/* Location bar dropmarker */
1951
38cfeb47 1952.urlbar-history-dropmarker:not(:hover):not([open="true"]) {
319c6529 1953 background-color: transparent;
319c6529
RK
1954}
1955
00f971bc 1956#urlbar-container[combined="true"] > #urlbar > .urlbar-history-dropmarker,
c9b0a396
RK
1957#urlbar-wrapper > #urlbar > .urlbar-history-dropmarker,
1958#urlbar-wrapper > #urlbar > .urlbar-textbox-container > .urlbar-history-dropmarker {
38cfeb47
RK
1959 border: none;
1960 border-radius: 0px;
d7b7f7e1
RK
1961 transition: opacity 0.15s ease;
1962}
1963
7327c957
RK
1964#urlbar-wrapper[switchingtabs] > #urlbar > .urlbar-textbox-container > .urlbar-history-dropmarker {
1965 transition: none;
1966}
1967
1968#navigator-toolbox:not(:hover) #urlbar:not([focused]) > .urlbar-textbox-container > .urlbar-history-dropmarker {
d7b7f7e1 1969 opacity: 0;
319c6529
RK
1970}
1971
ffce2402
RK
1972.urlbar-history-dropmarker:hover {
1973}
1974
1975.urlbar-history-dropmarker:hover:active,
1976.urlbar-history-dropmarker[open="true"] {
1977}
1978
319c6529
RK
1979/* page proxy icon */
1980
e7c8bab1
RK
1981/* === BEGIN identity-block.inc.css === */
1982
b1dfcf32 1983#identity-box {
e0f773b9
RK
1984/* --identity-box-hover-background-color: #FFCF00;
1985 --identity-box-selected-background-color: #FF9F00; */
e548e22e 1986 --identity-box-verified-color: #008484;
e7c8bab1 1987 /* Default theme does different color per channel, we can't as they do it build-time. */
e548e22e 1988 --identity-box-chrome-color: #9C9CFF;
b1dfcf32 1989
f36031bd 1990 border-inline-end: 1px solid var(--urlbar-separator-color);
b1dfcf32
RK
1991 font-size: .9em;
1992 border-radius: 2px;
024a65e9
RK
1993 padding: 3px 5px;
1994 margin-inline-end: 4px;
b1dfcf32 1995 overflow: hidden;
024a65e9
RK
1996 /* The latter two properties have a transition to handle the delayed hiding of
1997 the forward button when hovered. */
1998 transition: background-color 150ms ease, padding-left, padding-right;
b1dfcf32
RK
1999}
2000
2001#identity-box:-moz-locale-dir(ltr) {
2002 border-top-right-radius: 0;
2003 border-bottom-right-radius: 0;
2004}
2005
2006#identity-box:-moz-locale-dir(rtl) {
2007 border-top-left-radius: 0;
2008 border-bottom-left-radius: 0;
e548e22e
RK
2009}
2010
2011#urlbar[pageproxystate="valid"] > #identity-box.chromeUI {
2012 color: var(--identity-box-chrome-color);
dae45075 2013 border-inline-end: 1px solid var(--identity-box-chrome-color);
e7c8bab1
RK
2014}
2015
7c1e433b
RK
2016#identity-box:hover > :not(#identity-icon),
2017#identity-box[open=true] > :not(#identity-icon) {
2018/* filter: grayscale(100%);*/
2019}
2020
e7c8bab1 2021#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
e548e22e 2022 color: var(--identity-box-verified-color);
dae45075 2023 border-inline-end: 1px solid var(--identity-box-verified-color);
e7c8bab1
RK
2024}
2025
7c1e433b
RK
2026#identity-icon-labels:-moz-locale-dir(ltr) {
2027 padding-left: 2px;
2028}
2029
2030#identity-icon-labels:-moz-locale-dir(rtl) {
2031 padding-right: 2px;
2032}
2033
b1dfcf32 2034#notification-popup-box:not([hidden]) + #identity-box {
f91d15f9 2035 padding-inline-start: 10px;
b1dfcf32
RK
2036 border-radius: 0;
2037}
2038
2039window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box {
dc9d5d64
RK
2040/* border-radius: 0;
2041 padding-inline-start: 2px; */
2042 padding-inline-end: 2px;
2043 margin-inline-end: 1px;
b1dfcf32
RK
2044}
2045
b1dfcf32
RK
2046window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #forward-button[disabled] + #urlbar >
2047 #notification-popup-box[hidden] + #identity-box {
2048 padding-inline-start: 2px;
2049}
2050
2051window:not([chromehidden~="toolbar"]) #urlbar-wrapper:hover:not([switchingtabs]) > #forward-button[disabled] + #urlbar >
2052 #notification-popup-box[hidden] + #identity-box {
024a65e9
RK
2053 /* Forward button hiding is delayed when hovered, so we should use the same
2054 delay for the identity box. We handle both horizontal paddings (for LTR and
2055 RTL), the latter two delays here are for padding-left and padding-right. */
2056 transition-delay: 0s, 100s, 100s;
b1dfcf32
RK
2057}
2058
2059window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not(:hover) > #forward-button[disabled] + #urlbar >
2060 #notification-popup-box[hidden] + #identity-box {
2061 /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
2062 padding-inline-start: 2.01px;
e7c8bab1
RK
2063}
2064
c9b0a396
RK
2065/* MAIN IDENTITY ICON */
2066
2067#identity-icon {
2068 width: 16px;
2069 height: 16px;
2070 list-style-image: url(chrome://browser/skin/identity-icon.svg#normal);
2071}
2072
2073#identity-box:hover > #identity-icon,
2074#identity-box[open=true] > #identity-icon {
2075 list-style-image: url(chrome://browser/skin/identity-icon.svg#hover);
2076}
2077
2078#urlbar[pageproxystate="valid"] > #identity-box.chromeUI > #identity-icon {
2079 list-style-image: url(chrome://branding/content/identity-icons-brand.svg);
2080}
2081
2082#urlbar[pageproxystate="invalid"] > #identity-box > #identity-icon {
2083 opacity: 0.3;
2084}
2085
2086#urlbar[actiontype="searchengine"] > #identity-box > #identity-icon {
2087 -moz-image-region: inherit;
2088 list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon);
2089 width: 16px;
2090 height: 16px;
2091 opacity: 1;
2092}
2093
2094/* TRACKING PROTECTION ICON */
2095
2096#tracking-protection-icon {
2097 width: 16px;
2098 height: 16px;
2099 margin-inline-start: 2px;
2100 margin-inline-end: 0;
2101 list-style-image: url(chrome://browser/skin/tracking-protection-16.svg);
2102 opacity: 1;
2103}
2104
2105#tracking-protection-icon[state="loaded-tracking-content"] {
2106 list-style-image: url(chrome://browser/skin/tracking-protection-disabled-16.svg);
2107}
2108
2109#tracking-protection-icon[animate] {
2110 transition: margin-left 200ms ease-out, margin-right 200ms ease-out;
2111}
2112
2113#tracking-protection-icon:not([state]) {
2114 margin-inline-end: -18px;
2115 pointer-events: none;
2116 opacity: 0;
2117 /* Only animate the shield in, when it disappears hide it immediately. */
2118 transition: none;
2119}
2120
2121#urlbar[pageproxystate="invalid"] > #identity-box > #tracking-protection-icon {
2122 visibility: collapse;
2123}
2124
2125/* CONNECTION ICON */
2126
2127#connection-icon {
2128 width: 16px;
2129 height: 16px;
2130 margin-inline-start: 2px;
2131 visibility: collapse;
2132}
2133
2134#urlbar[pageproxystate="valid"] > #identity-box.verifiedDomain > #connection-icon,
2135#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity > #connection-icon {
2136 list-style-image: url(chrome://browser/skin/identity-secure.svg);
2137 visibility: visible;
2138}
2139
2140#urlbar[pageproxystate="valid"] > #identity-box.insecureLoginForms > #connection-icon,
2141#urlbar[pageproxystate="valid"] > #identity-box.mixedActiveContent > #connection-icon {
2142 list-style-image: url(chrome://browser/skin/identity-mixed-active-loaded.svg);
2143 visibility: visible;
2144}
2145
2146#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon,
2147#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon,
2148#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon {
2149 list-style-image: url(chrome://browser/skin/identity-mixed-passive-loaded.svg);
2150 visibility: visible;
2151}
2152
2153#urlbar[pageproxystate="valid"] > #identity-box.mixedActiveBlocked > #connection-icon {
2154 list-style-image: url(chrome://browser/skin/identity-mixed-active-blocked.svg);
2155 visibility: visible;
2156}
2157
7327c957
RK
2158#urlbar[pageproxystate="valid"] > #identity-box.certUserOverridden > #connection-icon {
2159 list-style-image: url(chrome://browser/skin/identity-mixed-passive-loaded.svg);
2160 visibility: visible;
2161}
2162
e7c8bab1
RK
2163/* === END identity-block.inc.css === */
2164
2165#page-proxy-favicon {
2166 -moz-image-region: rect(0, 16px, 16px, 0);
2167}
2168
3b1da406 2169window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box > #page-proxy-favicon {
dae45075 2170/* margin-inline-end: 1px;*/
c0f6797e
RK
2171}
2172
2a5b7882 2173#identity-box:hover > #page-proxy-favicon {
a40f6a79
RK
2174 -moz-image-region: rect(0, 32px, 16px, 16px);
2175}
2176
2a5b7882
RK
2177#identity-box:hover:active > #page-proxy-favicon,
2178#identity-box[open=true] > #page-proxy-favicon {
a40f6a79 2179 -moz-image-region: rect(0, 48px, 16px, 32px);
acb0e9b8 2180}
2181
2a5b7882
RK
2182#identity-box:hover {
2183 background-color: #FFCF00;
7092015d 2184 color: #000000;
2a5b7882
RK
2185}
2186
2187#identity-box:hover:active,
2188#identity-box[open=true] {
2189 background-color: #FF9F00;
7092015d 2190 color: #000000;
2a5b7882
RK
2191}
2192
56859d76
RK
2193#urlbar[pageproxystate="valid"] > #identity-box.chromeUI:hover,
2194#urlbar[pageproxystate="valid"] > #identity-box.chromeUI:hover:active,
2195#urlbar[pageproxystate="valid"] > #identity-box.chromeUI[open=true] {
2196 background-color: #9C9CFF;
2197 color: #000000;
2198}
2199
387e6560
RK
2200#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:hover,
2201#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:hover:active,
2202#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity[open=true] {
2a5b7882
RK
2203 background-color: #008484;
2204 color: #000000;
2205}
2206
319c6529
RK
2207/* autocomplete */
2208
319c6529
RK
2209#treecolAutoCompleteImage {
2210 max-width: 36px;
2211}
acb0e9b8 2212
7c1e433b
RK
2213/*
2214.autocomplete-richlistbox {
2215 padding: 4px;
2216}
2217
2218.autocomplete-richlistitem {
2219 height: 30px;
2220 min-height: 30px;
2221 font: message-box;
2222 border-radius: 2px;
2223 border: 1px solid transparent;
2224}
2225
2226.autocomplete-richlistitem[selected=true] {
2227 background-color: hsl(210, 80%, 52%);
2228}
2229*/
2230.ac-title {
2231 font-size: 14px;
2232/* color: hsl(0, 0%, 0%);*/
2233}
2234
2235.ac-tags {
2236 font-size: 12px;
2237}
2238/*
2239html|span.ac-tag {
2240 background-color: hsl(216, 0%, 88%);
2241 color: hsl(0, 0%, 0%);
2242 border-radius: 2px;
2243 border: 1px solid transparent;
2244 padding: 0 1px;
2245}
2246*/
2247
2248.ac-separator,
2249.ac-url,
2250.ac-action {
2251 font-size: 12px;
2252}
2253
2254.ac-separator {
2255/* color: hsl(0, 0%, 50%);*/
2256}
2257
2258.ac-url {
2259 color: #9C9CFF;
2260}
2261
2262.ac-action {
2263 color: #9C9CFF;
2264}
2265
2266.ac-title[selected=true],
2267.ac-separator[selected],
2268.ac-url[selected=true],
2269.ac-action[selected=true] {
2270 color: #000000;
2271}
2272
2273.ac-tags-text[selected] > html|span.ac-tag {
2274 background-color: #A09090;
2275 color: #000000;
2276}
2277
2278html|span.ac-emphasize-text-title,
2279html|span.ac-emphasize-text-tag,
2280html|span.ac-emphasize-text-url {
2281 font-weight: 600;
2282}
2283
2284.ac-type-icon[type=bookmark] {
2285 list-style-image: url("chrome://browser/skin/urlbar-star.svg#star");
2286}
2287
2288.ac-type-icon[type=bookmark][selected][current] {
2289/* list-style-image: url("chrome://browser/skin/urlbar-star.svg#star-inverted");*/
2290}
2291
319c6529
RK
2292.ac-result-type-bookmark,
2293.autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) {
71bac478 2294 list-style-image: url("chrome://browser/skin/places/bookmark.png");
319c6529 2295 -moz-image-region: rect(0px 16px 16px 0px);
c1f7cc84 2296 width: 16px;
319c6529 2297 height: 16px;
acb0e9b8 2298}
2299
c0f6797e
RK
2300richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type-bookmark,
2301.autocomplete-treebody::-moz-tree-image(selected, current, bookmark, treecolAutoCompleteImage) {
2302/* -moz-image-region: rect(0px 48px 16px 32px);*/
2303}
2304
7c1e433b
RK
2305.ac-type-icon[type=keyword],
2306.ac-site-icon[type=searchengine],
2307.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) {
8922acc9 2308 list-style-image: url("chrome://global/skin/icons/autocomplete-search.svg#search-icon");
acb0e9b8 2309}
2310
7c1e433b
RK
2311.ac-type-icon[type=keyword][selected],
2312.ac-site-icon[type=searchengine][selected],
2313.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected) {
2314 list-style-image: url("chrome://global/skin/icons/autocomplete-search.svg#search-icon-inverted");
2315}
8922acc9 2316
319c6529
RK
2317.ac-result-type-tag,
2318.autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) {
8da9da4e 2319 list-style-image: url("chrome://mozapps/skin/places/tagContainerIcon.png");
c1f7cc84 2320 width: 16px;
319c6529
RK
2321 height: 16px;
2322}
acb0e9b8 2323
7c1e433b
RK
2324.ac-type-icon[type=switchtab],
2325.ac-type-icon[type=remotetab] {
2326 list-style-image: url("chrome://browser/skin/urlbar-tab.svg#tab");
85cfb236
RK
2327}
2328
7c1e433b
RK
2329.ac-type-icon[type=switchtab][selected],
2330.ac-type-icon[type=remotetab][selected] {
2331 list-style-image: url("chrome://browser/skin/urlbar-tab.svg#tab-inverted");
acb0e9b8 2332}
2333
c1f7cc84
RK
2334.autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment),
2335.autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment)
319c6529
RK
2336{
2337 color: #8050B0;
2338 font-size: smaller;
acb0e9b8 2339}
319c6529
RK
2340
2341.autocomplete-treebody::-moz-tree-cell(suggesthint) {
2342 border-top: 1px solid #9C9CFF;
acb0e9b8 2343}
2344
319c6529
RK
2345/* combined go/reload/stop button in location bar */
2346
c9b0a396
RK
2347#urlbar-go-button,
2348#urlbar-reload-button,
2349#urlbar-stop-button {
2350 border-style: none;
52d7b436 2351 list-style-image: url("chrome://browser/skin/reload-stop-goFx.png");
c9b0a396 2352/* padding: 0 9px;*/
024a65e9 2353 margin-inline-start: 0px;
c9b0a396
RK
2354 border-inline-start: 1px solid var(--urlbar-separator-color);
2355 border-image: linear-gradient(transparent 15%,
2356 var(--urlbar-separator-color) 15%,
2357 var(--urlbar-separator-color) 85%,
2358 transparent 85%);
2359 border-image-slice: 1;
9abeb12c
RK
2360}
2361
2362#urlbar:-moz-locale-dir(ltr) > toolbarbutton {
38cfeb47
RK
2363 border-top-left-radius: 0px;
2364 border-bottom-left-radius: 0px;
acb0e9b8 2365}
acb0e9b8 2366
9abeb12c 2367#urlbar:-moz-locale-dir(rtl) > toolbarbutton {
38cfeb47
RK
2368 border-top-right-radius: 0px;
2369 border-bottom-right-radius: 0px;
9abeb12c
RK
2370}
2371
46e71434 2372#urlbar > toolbarbutton:not([disabled=true]):active:hover,
dce90fef 2373#urlbar-reload-button:not(:hover) {
dae45075
RK
2374 border-inline-start-style: none;
2375 padding-inline-start: 3px;
dce90fef
RK
2376}
2377
c0f6797e
RK
2378#urlbar-reload-button {
2379 -moz-image-region: rect(0px, 14px, 14px, 0px);
acb0e9b8 2380}
2381
46e71434 2382#urlbar-reload-button[disabled=true] {
c0f6797e 2383 -moz-image-region: rect(28px, 14px, 42px, 0px);
acb0e9b8 2384}
2385
46e71434 2386#urlbar-reload-button:not([disabled=true]):hover {
c0f6797e 2387 -moz-image-region: rect(14px, 14px, 28px, 0px);
ffce2402
RK
2388}
2389
c0f6797e
RK
2390#urlbar-reload-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
2391 transform: scaleX(-1);
acb0e9b8 2392}
2393
c0f6797e
RK
2394#urlbar-go-button {
2395 -moz-image-region: rect(0, 42px, 14px, 28px);
38cfeb47
RK
2396}
2397
fff8097b 2398#urlbar-go-button:hover {
c0f6797e 2399 -moz-image-region: rect(14px, 42px, 28px, 28px);
acb0e9b8 2400}
2401
c0f6797e
RK
2402#urlbar-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
2403 transform: scaleX(-1);
acb0e9b8 2404}
319c6529
RK
2405
2406#urlbar-stop-button {
ffce2402 2407 -moz-image-region: rect(0px, 28px, 14px, 14px);
acb0e9b8 2408}
319c6529
RK
2409
2410#urlbar-stop-button:hover {
ffce2402 2411 -moz-image-region: rect(14px, 28px, 28px, 14px);
acb0e9b8 2412}
2413
2e389898 2414@media (min-resolution: 1.1dppx) {
c9b0a396
RK
2415 #urlbar-go-button,
2416 #urlbar-reload-button,
2417 #urlbar-stop-button {
2e389898
RK
2418 list-style-image: url("chrome://browser/skin/reload-stop-go@2x.png");
2419 }
2420
c9b0a396
RK
2421 #urlbar-go-button > .toolbarbutton-icon,
2422 #urlbar-reload-button > .toolbarbutton-icon,
2423 #urlbar-stop-button > .toolbarbutton-icon {
2424 width: 14px;
2425 }
2426
2e389898
RK
2427 #urlbar-go-button {
2428 -moz-image-region: rect(0, 84px, 28px, 56px);
2429 }
2430
2431 #urlbar-go-button:hover {
2432 -moz-image-region: rect(28px, 84px, 56px, 56px);
2433 }
2434
2435 #urlbar-go-button:hover:active {
2436 -moz-image-region: rect(56px, 84px, 84px, 56px);
2437 }
2438
2439 #urlbar-reload-button {
2440 -moz-image-region: rect(0, 28px, 28px, 0);
2441 }
2442
2443 #urlbar-reload-button:not([disabled]):hover {
2444 -moz-image-region: rect(28px, 28px, 56px, 0);
2445 }
2446
2447 #urlbar-reload-button:not([disabled]):hover:active {
2448 -moz-image-region: rect(56px, 28px, 84px, 0);
2449 }
2450
2451 #urlbar-stop-button {
2452 -moz-image-region: rect(0, 56px, 28px, 28px);
2453 }
2454
2455 #urlbar-stop-button:not([disabled]):hover {
2456 -moz-image-region: rect(28px, 56px, 56px, 28px);
2457 }
2458
2459 #urlbar-stop-button:hover:active {
2460 -moz-image-region: rect(56px, 56px, 84px, 28px);
2461 }
2e389898
RK
2462}
2463
319c6529
RK
2464/* popup blocker button */
2465
2466#page-report-button {
2467 list-style-image: url("chrome://browser/skin/urlbar-popup-blocked.png");
2468 -moz-image-region: rect(0, 16px, 16px, 0);
acb0e9b8 2469}
319c6529 2470
71bac478 2471#page-report-button:hover ,
319c6529
RK
2472#page-report-button:hover:active,
2473#page-report-button[open="true"] {
71bac478 2474 -moz-image-region: rect(0, 32px, 16px, 16px);
acb0e9b8 2475}
2476
bcb9d005
RK
2477/* Reader mode button */
2478
2479#reader-mode-button {
2480 list-style-image: url("chrome://browser/skin/readerMode.svg");
2481 -moz-image-region: rect(0, 16px, 16px, 0);
2482}
2483
2484#reader-mode-button:hover,
2485#reader-mode-button[readeractive]:hover {
2486 -moz-image-region: rect(0, 32px, 16px, 16px);
2487}
2488
2489#reader-mode-button:hover:active,
2490#reader-mode-button[readeractive] {
2491 -moz-image-region: rect(0, 48px, 16px, 32px);
2492}
2493
c4460289
RK
2494/* social share panel */
2495
20752032
RK
2496.social-share-frame {
2497 min-width: 756px;
c4460289
RK
2498 height: 150px;
2499}
2500
20752032
RK
2501#share-container {
2502 min-width: 756px;
2503 background-color: white;
2504 background-repeat: no-repeat;
2505 background-position: center center;
c4460289 2506}
20752032
RK
2507#share-container[loading] {
2508 background-image: url(chrome://browser/skin/tabbrowser/pendingpaint.png);
2509}
2510#share-container > browser {
2511 transition: opacity 150ms ease-in-out;
2512 opacity: 1;
2513}
2514#share-container[loading] > browser {
2515 opacity: 0;
c4460289
RK
2516}
2517
20752032
RK
2518.social-share-toolbar {
2519 border-bottom: 1px solid #9C9CFF;
2520 padding: 2px;
c4460289
RK
2521}
2522
20752032
RK
2523#social-share-provider-buttons {
2524 padding: 0;
2525 margin: 0;
c4460289
RK
2526}
2527
20752032
RK
2528.share-provider-button {
2529 padding: 5px;
2530 margin: 2px;
c4460289
RK
2531}
2532
20752032 2533.share-provider-button > .toolbarbutton-text {
c4460289
RK
2534 display: none;
2535}
20752032 2536.share-provider-button > .toolbarbutton-icon {
c4460289
RK
2537 width: 16px;
2538 min-height: 16px;
2539 max-height: 16px;
2540}
2541
2542/* fixup corners for share panel */
2543.social-panel > .social-panel-frame {
2544 border-radius: inherit;
2545}
2546
2547#social-share-panel {
c4460289 2548 min-height: 100px;
20752032 2549 min-width: 766px;
c4460289
RK
2550}
2551
20752032 2552#share-container,
c4460289 2553.social-share-frame {
e2734cc7 2554 border-top-left-radius: 0;
c4460289 2555 border-bottom-left-radius: inherit;
e2734cc7 2556 border-top-right-radius: 0;
20752032 2557 border-bottom-right-radius: inherit;
c4460289
RK
2558}
2559
20752032 2560#social-share-panel > .social-share-toolbar {
e2734cc7 2561 border-top-left-radius: inherit;
e2734cc7 2562 border-top-right-radius: inherit;
e2734cc7
RK
2563}
2564
20752032 2565#social-share-provider-buttons {
c4460289 2566 border-top-left-radius: inherit;
e2734cc7 2567 border-top-right-radius: inherit;
e2734cc7
RK
2568}
2569
889649fd
RK
2570/* social recommending panel */
2571
a6757852 2572#social-mark-button {
d7cfd768 2573 -moz-image-region: rect(0, 16px, 16px, 0);
889649fd
RK
2574}
2575
c0f6797e 2576/* bookmarks menu-button */
319c6529 2577
c0f6797e
RK
2578#bookmarks-menu-button.bookmark-item {
2579 list-style-image: url("chrome://browser/skin/places/bookmark.png");
2580 -moz-image-region: rect(0px 16px 16px 0px);
acb0e9b8 2581}
319c6529 2582
c0f6797e
RK
2583#bookmarks-menu-button.bookmark-item[starred] {
2584 -moz-image-region: rect(0px 32px 16px 16px);
acb0e9b8 2585}
319c6529 2586
e9fbfc3a 2587#nav-bar #bookmarks-menu-button[cui-areatype="toolbar"]:not([overflowedItem=true]) > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
c0f6797e
RK
2588 padding-top: 2px;
2589 padding-bottom: 2px;
71bac478
RK
2590}
2591
c0f6797e
RK
2592#BMB_bookmarksPopup[side="top"],
2593#BMB_bookmarksPopup[side="bottom"] {
2594 margin-left: -20px;
2595 margin-right: -20px;
71bac478
RK
2596}
2597
c0f6797e
RK
2598#BMB_bookmarksPopup[side="left"],
2599#BMB_bookmarksPopup[side="right"] {
2600 margin-top: -20px;
2601 margin-bottom: -20px;
acb0e9b8 2602}
319c6529
RK
2603
2604/* bookmarking panel */
c0f6797e 2605
319c6529
RK
2606#editBookmarkPanelStarIcon {
2607 list-style-image: url("chrome://browser/skin/places/starred48.png");
2608 width: 48px;
2609 height: 48px;
acb0e9b8 2610}
319c6529
RK
2611
2612#editBookmarkPanelStarIcon[unstarred] {
2613 list-style-image: url("chrome://browser/skin/places/unstarred48.png");
acb0e9b8 2614}
2615
319c6529
RK
2616#editBookmarkPanelTitle {
2617 font-size: 130%;
acb0e9b8 2618}
319c6529
RK
2619
2620#editBookmarkPanelHeader,
2621#editBookmarkPanelContent {
2622 margin-bottom: .5em;
acb0e9b8 2623}
319c6529
RK
2624
2625/* Implements editBookmarkPanel resizing on folderTree un-collapse. */
2626#editBMPanel_folderTree {
2627 min-width: 27em;
acb0e9b8 2628}
2629
f993773d 2630.panel-promo-box {
46e71434
RK
2631 margin: 5px 0 -6px;
2632 padding: 5px 0;
889649fd 2633 border-top: 1px solid #9C9CFF;
f0eab82c
RK
2634 border-bottom-left-radius: 5px;
2635 border-bottom-right-radius: 5px;
f993773d
RK
2636}
2637
2638.panel-promo-icon {
2639 list-style-image: url("chrome://browser/skin/sync-notification-24.png");
dae45075 2640 margin-inline-end: 10px;
f993773d
RK
2641 vertical-align: middle;
2642}
2643
2644.panel-promo-closebutton {
2645 list-style-image: url("chrome://global/skin/icons/close-button.gif");
dae45075 2646 margin-inline-end: -3px;
f0eab82c 2647 margin-top: -3px;
f993773d
RK
2648}
2649
2650.panel-promo-closebutton:hover {
2651 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2652}
2653
2654.panel-promo-closebutton:hover:active {
2655 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2656}
2657
2658.panel-promo-closebutton > .toolbarbutton-text {
2659 padding: 0;
f993773d
RK
2660}
2661
319c6529
RK
2662/* ::::: content area ::::: */
2663
bcb9d005
RK
2664#sidebar-box {
2665 background-color: #9C9CFF;
2666 color: #000000;
2667}
2668
319c6529 2669#sidebar {
bcb9d005
RK
2670 background-color: #000000;
2671}
2672
2673#sidebar-splitter {
dae45075 2674 margin-inline-start: 0;
bcb9d005
RK
2675}
2676
2677#sidebar-header {
2678 color: #000000;
2679 padding: 2px;
acb0e9b8 2680}
319c6529
RK
2681
2682#sidebar-title {
dae45075 2683 padding-inline-start: 0px;
acb0e9b8 2684}
319c6529 2685
589b5528
RK
2686#sidebar-header > .close-icon {
2687/* padding: 4px 2px;
2688 margin: 0;
2689 border: none;*/
2690 list-style-image: url("chrome://global/skin/icons/close-button.gif");
2691}
2692
2693#sidebar-header > .close-icon:hover,
2694#sidebar-header > .close-icon:hover:active {
2695 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2696}
2697
bcb9d005
RK
2698#sidebar-splitter:-moz-locale-dir(ltr),
2699#sidebar:-moz-locale-dir(ltr) {
2700 border-radius: 0 5px 0 0;
2701}
2702
2703#sidebar-splitter:-moz-locale-dir(rtl),
2704#sidebar:-moz-locale-dir(rtl) {
2705 border-radius: 5px 0 0 0;
2706}
2707
fe524e0c
RK
2708.browserContainer > findbar {
2709/*
2710 background-color: -moz-dialog;
2711 color: -moz-DialogText;
2712*/
2713}
2714
319c6529 2715/* Tabstrip */
b36fc72e 2716
c0f6797e 2717#TabsToolbar {
e20c83c3
RK
2718 min-height: 0;
2719 padding: 0;
2720 -moz-binding: url("chrome://browser/content/customizableui/toolbar.xml#toolbar");
2721}
2722
b36fc72e 2723#TabsToolbar .toolbar-holder {
c1f7cc84 2724 background-color: #000000; /* correct effect of being an actual toolbar */
acb0e9b8 2725}
2726
b36fc72e 2727#main-window[disablechrome] #TabsToolbar,
319c6529 2728#TabsToolbar[tabsontop="false"] {
8b5fc82e 2729 border-bottom: 1px solid #008484;
acb0e9b8 2730}
319c6529 2731
6dc70335
RK
2732/* === BEGIN tabs.inc.css === */
2733
368d0b7f
RK
2734:root {
2735 /* --tab-toolbar-navbar-overlap: 1px; */
024a65e9 2736 /* --navbar-tab-toolbar-highlight-overlap: 1px; */
368d0b7f 2737 /* --tab-min-height: 31px; */
024a65e9
RK
2738}
2739#TabsToolbar {
2740 /* --tab-stroke-background-size: auto 100%; */
368d0b7f
RK
2741}
2742
319c6529 2743.tabbrowser-tab,
43ee1307
RK
2744.tabs-newtab-button,
2745#TabsToolbar > #new-tab-button {
319c6529 2746 margin-top: 0px;
acb0e9b8 2747}
319c6529 2748
43ee1307 2749.tabbrowser-tab {
57fc408c
RK
2750 padding: 1px 4px 2px;
2751}
2752
2753.tabbrowser-tab:first-of-type {
dae45075 2754 margin-inline-start: 2px;
57fc408c
RK
2755}
2756
43ee1307 2757.tabs-newtab-button,
e0f773b9
RK
2758#TabsToolbar > #new-tab-button,
2759#TabsToolbar > toolbarpaletteitem > #new-tab-button,
2760#TabsToolbar > toolbarpaletteitem > #new-tab-button[cui-areatype="toolbar"] {
57fc408c 2761 border-radius: 8px 8px 0px 0px;
dae45075 2762 margin-inline-start: 0;
57fc408c
RK
2763}
2764
43ee1307 2765.tabs-newtab-button:not(:hover),
e0f773b9
RK
2766#TabsToolbar > #new-tab-button:not(:hover),
2767#TabsToolbar > toolbarpaletteitem > #new-tab-button,
2768#TabsToolbar > toolbarpaletteitem > #new-tab-button[cui-areatype="toolbar"] {
57fc408c
RK
2769 background-color: #C09070;
2770}
2771
c0f6797e 2772/* The selected tab should appear above adjacent tabs, .tabs-newtab-button and the highlight of #nav-bar */
05148fed 2773.tabbrowser-tab[visuallyselected=true] {
c0f6797e
RK
2774/* position: relative;
2775 z-index: 2;*/
acb0e9b8 2776}
2777
c0f6797e 2778.tab-background-middle {
acb0e9b8 2779}
2780
c0f6797e 2781.tab-content {
acb0e9b8 2782}
319c6529 2783
d533ec21
RK
2784.tab-content[pinned] {
2785}
2786
2787.tab-throbber,
c0f6797e 2788.tab-icon-image,
b1dfcf32 2789.tab-icon-sound,
c0f6797e 2790.tab-close-button {
acb0e9b8 2791}
2792
319c6529
RK
2793.tab-throbber,
2794.tab-icon-image {
319c6529 2795 height: 16px;
c0f6797e 2796 width: 16px;
dae45075 2797 margin-inline-end: 3px;
c0f6797e
RK
2798}
2799
2800.tab-icon-image {
dce90fef 2801 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
613daf44 2802}
2803
d533ec21
RK
2804.tab-icon-overlay {
2805 width: 16px;
2806 height: 16px;
d7b7f7e1 2807 margin-top: -8px;
dae45075 2808 margin-inline-start: -15px;
7327c957 2809 margin-inline-end: -1px;
b1dfcf32 2810 position: relative;
d533ec21
RK
2811}
2812
2813.tab-icon-overlay[crashed] {
d533ec21
RK
2814 list-style-image: url("chrome://browser/skin/tabbrowser/crashed.svg");
2815}
2816
024a65e9
RK
2817.tab-icon-overlay[soundplaying],
2818.tab-icon-overlay[muted]:not([crashed]) {
d7b7f7e1 2819 border-radius: 10px;
b1dfcf32
RK
2820}
2821
024a65e9
RK
2822.tab-icon-overlay[soundplaying]:hover,
2823.tab-icon-overlay[muted]:hover {
b1dfcf32
RK
2824 background-color: #FFCF00;
2825}
2826
024a65e9 2827.tab-icon-overlay[soundplaying] {
b1dfcf32
RK
2828 display: -moz-box;
2829 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio");
2830}
2831
024a65e9 2832.tab-icon-overlay[muted]:not([crashed]) {
b1dfcf32
RK
2833 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-muted");
2834}
2835
024a65e9
RK
2836#TabsToolbar[brighttext] .tab-icon-overlay[soundplaying]:not(:hover) {
2837 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white");
b1dfcf32
RK
2838}
2839
b1dfcf32 2840
024a65e9
RK
2841#TabsToolbar[brighttext] .tab-icon-overlay[muted]:not([crashed]):not(:hover) {
2842 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white-muted");
b1dfcf32
RK
2843}
2844
3d64e0ce 2845.tab-throbber[busy] {
95f333af 2846 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim-connect.png");
613daf44 2847}
319c6529
RK
2848
2849.tab-throbber[progress] {
95f333af 2850 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.png");
613daf44 2851}
319c6529 2852
85b6b932
RK
2853@media (min-resolution: 1.1dppx) {
2854 .tab-throbber[busy] {
2855 list-style-image: url("chrome://communicator/skin/brand/throbber-anim-connect.png");
2856 }
2857
2858 .tab-throbber[progress] {
2859 list-style-image: url("chrome://communicator/skin/brand/throbber-anim.png");
2860 }
2861}
2862
319c6529
RK
2863.tab-throbber[pinned],
2864.tab-icon-image[pinned] {
dae45075
RK
2865 margin-inline-start: 2px;
2866 margin-inline-end: 2px;
613daf44 2867}
319c6529 2868
c0f6797e 2869.tab-label {
aec5dfad
RK
2870 /* this needs to add up to the 16px of the icon image */
2871 height: 12px;
2872 margin-top: 2px !important;
2873 margin-bottom: 2px !important;
c0f6797e
RK
2874}
2875
b1dfcf32 2876.tab-icon-sound {
dae45075 2877 margin-inline-start: 4px;
b1dfcf32
RK
2878 width: 16px;
2879 height: 16px;
2880 padding: 0;
2881}
2882
b1dfcf32
RK
2883.tab-icon-sound[muted] {
2884 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted");
2885}
2886
2887.tab-icon-sound[muted]:hover {
2888 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-hover");
2889}
2890
2891.tab-icon-sound[muted]:hover:active {
2892 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-pressed");
2893}
2894
2895.tab-icon-sound[soundplaying] {
024a65e9 2896 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab");
b1dfcf32
RK
2897}
2898
2899.tab-icon-sound[soundplaying]:hover {
024a65e9 2900 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-hover");
b1dfcf32
RK
2901}
2902
2903.tab-icon-sound[soundplaying]:hover:active {
024a65e9
RK
2904 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-pressed");
2905}
2906
2907.tab-icon-sound[muted] {
2908 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted");
2909}
2910
2911.tab-icon-sound[muted]:hover {
2912 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted-hover");
2913}
2914
2915.tab-icon-sound[muted]:hover:active {
2916 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted-pressed");
2917}
2918
2919.tab-icon-sound[visuallyselected=true][soundplaying] {
2920 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio");
2921}
2922
2923.tab-icon-sound[visuallyselected=true][soundplaying]:hover {
2924 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-hover");
2925}
2926
2927.tab-icon-sound[visuallyselected=true][soundplaying]:hover:active {
b1dfcf32
RK
2928 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-pressed");
2929}
2930
024a65e9
RK
2931.tab-icon-sound[visuallyselected=true][muted] {
2932 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted");
2933}
2934
2935.tab-icon-sound[visuallyselected=true][muted]:hover {
2936 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-hover");
2937}
2938
2939.tab-icon-sound[visuallyselected=true][muted]:hover:active {
2940 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-pressed");
2941}
2942
b1dfcf32 2943#TabsToolbar[brighttext] .tab-icon-sound[soundplaying] {
024a65e9 2944 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white");
b1dfcf32
RK
2945}
2946
2947#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover {
024a65e9 2948 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-hover");
b1dfcf32
RK
2949}
2950
2951#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover:active {
024a65e9 2952 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-pressed");
b1dfcf32
RK
2953}
2954
2955#TabsToolbar[brighttext] .tab-icon-sound[muted] {
024a65e9 2956 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white");
b1dfcf32
RK
2957}
2958
2959#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover {
024a65e9 2960 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-hover");
b1dfcf32
RK
2961}
2962
2963#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover:active {
024a65e9 2964 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-pressed");
b1dfcf32
RK
2965}
2966
c0f6797e
RK
2967.tab-close-button {
2968 margin-top: 1px;
2969 padding: 0;
2970}
2971
2972.tab-background,
2973.tabs-newtab-button {
2974 /* overlap the tab curves */
2975}
2976
2977.tabbrowser-arrowscrollbox > .arrowscrollbox-scrollbox {
2978}
2979
93c91f62
RK
2980/* Tab Overflow */
2981.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-start-indicator:not([collapsed]),
2982.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-end-indicator:not([collapsed]) {
2983}
2984
2985.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-start-indicator:-moz-locale-dir(rtl),
2986.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-end-indicator:-moz-locale-dir(ltr) {
2987}
2988
2989.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-start-indicator:not([collapsed]) {
2990}
2991
2992.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-end-indicator:not([collapsed]) {
2993}
2994
2995.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-start-indicator[collapsed],
2996.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-end-indicator[collapsed] {
2997}
2998
2999.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-start-indicator,
3000.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-end-indicator {
3001}
3002
05148fed
RK
3003.tab-background-start[visuallyselected=true]::after,
3004.tab-background-start[visuallyselected=true]::before,
c0f6797e
RK
3005.tab-background-start,
3006.tab-background-end,
05148fed
RK
3007.tab-background-end[visuallyselected=true]::after,
3008.tab-background-end[visuallyselected=true]::before {
c0f6797e
RK
3009}
3010
05148fed 3011.tabbrowser-tab:not([visuallyselected=true]),
c0f6797e
RK
3012.tabbrowser-tab:-moz-lwtheme {
3013}
3014
319c6529 3015/* tabbrowser-tab focus ring */
c0f6797e 3016.tabbrowser-tab:focus {
319c6529 3017 outline: 1px dotted;
613daf44 3018}
319c6529 3019
c0f6797e
RK
3020/* Selected tab */
3021
05148fed 3022.tabbrowser-tab[visuallyselected="true"] {
c0f6797e
RK
3023}
3024
3025/* End selected tab */
3026
c0f6797e
RK
3027/* Tab pointer-events */
3028/*
3029.tabbrowser-tab {
3030 pointer-events: none;
3031}
3032
3033.tab-background-middle,
3034.tabs-newtab-button,
b1dfcf32
RK
3035.tab-icon-overlay[soundplaying],
3036.tab-icon-overlay[muted]:not([crashed]),
3037.tab-icon-sound,
c0f6797e
RK
3038.tab-close-button {
3039 pointer-events: auto;
3040}
3041*/
3042/* Pinned tabs */
3043
fa703ff4
RK
3044/*
3045.tabbrowser-tab:-moz-any([image], [pinned]) > .tab-stack > .tab-content[attention]:not([visuallyselected="true"]),
3046.tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([visuallyselected="true"]) {
3047*/
3048.tabbrowser-tab:-moz-any([image], [pinned]):-moz-any([attention], [titlechanged]):not([visuallyselected="true"]) {
c0f6797e
RK
3049 background-color: #E7ADE7;
3050}
3051
fa703ff4
RK
3052.tab-label[attention]:not([visuallyselected="true"]) {
3053 font-weight: bold;
3054}
3055
3056.tabbrowser-tab[pinned][titlechanged]:not([visuallyselected="true"]):hover {
c0f6797e
RK
3057 background-color: #3333FF;
3058 color: #000000;
3059}
3060
024a65e9
RK
3061/* Tab separators */
3062/*
3063.tabbrowser-tab::after,
3064.tabbrowser-tab::before {
3065 width: 1px;
dae45075 3066 margin-inline-start: -1px;
024a65e9
RK
3067 background-image: linear-gradient(transparent 5px,
3068 currentColor 5px,
3069 currentColor calc(100% - 4px),
3070 transparent calc(100% - 4px));
3071 opacity: 0.2;
3072}
3073
3074#TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab::before,
3075#TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab::after {
3076 opacity: 0.4;
3077}
3078*/
3079/* Also show separators beside the selected tab when dragging it. */
3080/*
3081#tabbrowser-tabs[movingtab] > .tabbrowser-tab[beforeselected]:not([last-visible-tab])::after,
3082.tabbrowser-tab:not([visuallyselected]):not([afterselected-visible]):not([afterhovered]):not([first-visible-tab]):not(:hover)::before,
3083#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([visuallyselected]):not([beforehovered]):not(:hover)::after {
3084 content: "";
3085 display: -moz-box;
3086}
3087*/
c0f6797e
RK
3088/* New tab button */
3089
3090.tabs-newtab-button {
3091 width: 28px;
d533ec21 3092 /* width: calc(36px + var(--tab-curve-width)); */
c0f6797e
RK
3093}
3094
3095/* === END tabs.inc.css === */
3096
43371c9b
RK
3097/* Background tabs:
3098 *
3099 * Decrease the height of the hoverable region of background tabs whenever the tabs are at the top
3100 * of the window (e.g. no menubar, tabs in titlebar, etc.) to make it easier to drag the window by
3101 * the titlebar. We don't need this in fullscreen since window dragging is not an issue there.
3102 */
05148fed 3103#main-window[tabsintitlebar][sizemode=normal] #toolbar-menubar[autohide="true"][inactive] + #TabsToolbar .tab-background-middle:not([visuallyselected=true]) {
43371c9b
RK
3104/* clip-path: url(chrome://browser/content/browser.xul#tab-hover-clip-path);*/
3105}
3106
8ad8bf83 3107/* Tab DnD indicator */
319c6529
RK
3108.tab-drop-indicator {
3109 list-style-image: url("chrome://browser/skin/tabbrowser/tabDragIndicator.png");
9abeb12c 3110 margin-bottom: -11px;
613daf44 3111}
3112
319c6529
RK
3113/* Tab close button */
3114.tab-close-button {
319c6529
RK
3115 list-style-image: url("chrome://global/skin/icons/close-button.gif");
3116}
acb0e9b8 3117
319c6529
RK
3118.tab-close-button:hover,
3119.tab-close-button:hover[selected="true"] {
3120 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
acb0e9b8 3121}
319c6529
RK
3122
3123.tab-close-button:hover:active,
3124.tab-close-button:hover:active[selected="true"] {
3125 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
acb0e9b8 3126}
319c6529 3127
319c6529
RK
3128/* Tab scrollbox arrow, tabstrip new tab and all-tabs buttons */
3129
319c6529
RK
3130.tabbrowser-arrowscrollbox > .scrollbutton-up,
3131.tabbrowser-arrowscrollbox > .scrollbutton-down {
319c6529
RK
3132 margin: 0;
3133 padding-top: 0;
3134 padding-bottom: 0;
c0f6797e
RK
3135 background-origin: border-box;
3136}
3137
3138#main-window[tabsintitlebar]:not([inFullscreen]) .tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-system-metric(windows-classic):not(:-moz-lwtheme),
3139#main-window[tabsintitlebar]:not([inFullscreen]) .tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-system-metric(windows-classic):not(:-moz-lwtheme),
3140.tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-lwtheme-brighttext,
3141.tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-lwtheme-brighttext {
3142 }
b7f3670c 3143
c0f6797e
RK
3144.tabbrowser-arrowscrollbox > .scrollbutton-up[disabled],
3145.tabbrowser-arrowscrollbox > .scrollbutton-down[disabled] {
3146 }
3147
3148.tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-locale-dir(rtl),
3149.tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-locale-dir(ltr) {
3150/* transform: scaleX(-1);*/
3151}
3152
3153.tabbrowser-arrowscrollbox > .scrollbutton-down {
3154 transition: 1s background-color ease-out;
acb0e9b8 3155}
319c6529 3156
319c6529
RK
3157.tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] {
3158 background-color: #008484;
acb0e9b8 3159}
319c6529 3160
c0f6797e
RK
3161.tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled]),
3162.tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled]) {
3163/* border-width: 0 2px 0 0;
3164 border-style: solid;
3165 border-image: url("chrome://browser/skin/tabbrowser/tab-overflow-border.png") 0 2 0 2 fill;*/
3166}
3167
319c6529
RK
3168.tabs-newtab-button > .toolbarbutton-icon {
3169 margin-top: -1px;
3170 margin-bottom: -1px;
acb0e9b8 3171}
319c6529
RK
3172
3173.tabs-newtab-button,
3174#TabsToolbar > #new-tab-button,
e20c83c3
RK
3175#TabsToolbar > toolbarpaletteitem > #new-tab-button,
3176#TabsToolbar > toolbarpaletteitem > #new-tab-button[cui-areatype="toolbar"] {