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