sixth 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;
d7b7f7e1
RK
2074 transition: opacity 0.15s ease;
2075}
2076
2077#navigator-toolbox:not(:hover) .urlbar-history-dropmarker {
2078 opacity: 0;
319c6529
RK
2079}
2080
ffce2402
RK
2081.urlbar-history-dropmarker:hover {
2082}
2083
2084.urlbar-history-dropmarker:hover:active,
2085.urlbar-history-dropmarker[open="true"] {
2086}
2087
319c6529
RK
2088/* page proxy icon */
2089
e7c8bab1
RK
2090/* === BEGIN identity-block.inc.css === */
2091
b1dfcf32 2092#identity-box {
e548e22e 2093 --identity-box-verified-color: #008484;
e7c8bab1 2094 /* Default theme does different color per channel, we can't as they do it build-time. */
e548e22e 2095 --identity-box-chrome-color: #9C9CFF;
b1dfcf32 2096
024a65e9 2097 border-inline-end: 1px solid --urlbar-separator-color);
b1dfcf32
RK
2098 font-size: .9em;
2099 border-radius: 2px;
024a65e9
RK
2100 padding: 3px 5px;
2101 margin-inline-end: 4px;
b1dfcf32 2102 overflow: hidden;
024a65e9
RK
2103 /* The latter two properties have a transition to handle the delayed hiding of
2104 the forward button when hovered. */
2105 transition: background-color 150ms ease, padding-left, padding-right;
b1dfcf32
RK
2106}
2107
2108#identity-box:-moz-locale-dir(ltr) {
2109 border-top-right-radius: 0;
2110 border-bottom-right-radius: 0;
2111}
2112
2113#identity-box:-moz-locale-dir(rtl) {
2114 border-top-left-radius: 0;
2115 border-bottom-left-radius: 0;
e548e22e
RK
2116}
2117
2118#urlbar[pageproxystate="valid"] > #identity-box.chromeUI {
2119 color: var(--identity-box-chrome-color);
2120 -moz-border-end: 1px solid var(--identity-box-chrome-color);
e7c8bab1
RK
2121}
2122
2123#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
e548e22e
RK
2124 color: var(--identity-box-verified-color);
2125 -moz-border-end: 1px solid var(--identity-box-verified-color);
e7c8bab1
RK
2126}
2127
b1dfcf32
RK
2128#notification-popup-box:not([hidden]) + #identity-box {
2129 padding-inline-start: 10px !important;
2130 border-radius: 0;
2131}
2132
2133window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box {
2134/* border-radius: 0; */
2135 -moz-padding-start: 2px;
2136 -moz-padding-end: 2px;
2137 -moz-margin-end: 1px;
2138}
2139
b1dfcf32
RK
2140window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #forward-button[disabled] + #urlbar >
2141 #notification-popup-box[hidden] + #identity-box {
2142 padding-inline-start: 2px;
2143}
2144
2145window:not([chromehidden~="toolbar"]) #urlbar-wrapper:hover:not([switchingtabs]) > #forward-button[disabled] + #urlbar >
2146 #notification-popup-box[hidden] + #identity-box {
024a65e9
RK
2147 /* Forward button hiding is delayed when hovered, so we should use the same
2148 delay for the identity box. We handle both horizontal paddings (for LTR and
2149 RTL), the latter two delays here are for padding-left and padding-right. */
2150 transition-delay: 0s, 100s, 100s;
b1dfcf32
RK
2151}
2152
2153window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not(:hover) > #forward-button[disabled] + #urlbar >
2154 #notification-popup-box[hidden] + #identity-box {
2155 /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
2156 padding-inline-start: 2.01px;
e7c8bab1
RK
2157}
2158
19988d2d
RK
2159/* TRACKING PROTECTION ICON */
2160
2161#tracking-protection-icon {
2162 width: 16px;
2163 height: 16px;
024a65e9 2164 margin-inline-start: 0;
19988d2d 2165 list-style-image: url("chrome://browser/skin/tracking-protection-16.svg");
b1dfcf32 2166 opacity: 1;
19988d2d
RK
2167}
2168
2169#tracking-protection-icon[state="loaded-tracking-content"] {
2170 list-style-image: url("chrome://browser/skin/tracking-protection-disabled-16.svg");
2171}
2172
b1dfcf32 2173#tracking-protection-icon[animate] {
024a65e9 2174 transition: margin-left 200ms ease-out, margin-right 200ms ease-out;
b1dfcf32
RK
2175}
2176
19988d2d 2177#tracking-protection-icon:not([state]) {
024a65e9 2178 margin-inline-start: -18px;
b1dfcf32
RK
2179 pointer-events: none;
2180 opacity: 0;
2181 /* Only animate the shield in, when it disappears hide it immediately. */
2182 transition: none;
2183}
2184
2185#urlbar[pageproxystate="invalid"] > #identity-box > #identity-icons > #tracking-protection-icon {
2186 visibility: collapse;
19988d2d
RK
2187}
2188
2189/* MAIN IDENTITY ICON */
e7c8bab1 2190
4d58ff64 2191#page-proxy-favicon {
319c6529
RK
2192 width: 16px;
2193 height: 16px;
1437a48c 2194 list-style-image: url("chrome://browser/skin/identity-not-secure.svg");
00f971bc 2195 margin: 2px;
e7c8bab1
RK
2196}
2197
b1dfcf32 2198.chromeUI > #identity-icons > #page-proxy-favicon[pageproxystate="valid"] {
1437a48c 2199 list-style-image: url("chrome://branding/content/identity-icons-brand.svg");
a40f6a79
RK
2200}
2201
b1dfcf32
RK
2202.verifiedDomain > #identity-icons > #page-proxy-favicon[pageproxystate="valid"],
2203.verifiedIdentity > #identity-icons > #page-proxy-favicon[pageproxystate="valid"] {
1437a48c 2204 list-style-image: url("chrome://browser/skin/identity-secure.svg");
a40f6a79
RK
2205}
2206
b1dfcf32 2207.mixedActiveContent > #identity-icons > #page-proxy-favicon[pageproxystate="valid"] {
1437a48c 2208 list-style-image: url("chrome://browser/skin/identity-mixed-active-loaded.svg");
56ab361a
RK
2209}
2210
b1dfcf32
RK
2211.weakCipher > #identity-icons > #page-proxy-favicon[pageproxystate="valid"],
2212.mixedDisplayContent > #identity-icons > #page-proxy-favicon[pageproxystate="valid"],
2213.mixedDisplayContentLoadedActiveBlocked > #identity-icons > #page-proxy-favicon[pageproxystate="valid"] {
1437a48c 2214 list-style-image: url("chrome://browser/skin/identity-mixed-passive-loaded.svg");
e7c8bab1
RK
2215}
2216
b1dfcf32 2217.mixedActiveBlocked > #identity-icons > #page-proxy-favicon[pageproxystate="valid"] {
1437a48c 2218 list-style-image: url("chrome://browser/skin/identity-mixed-active-blocked.svg");
e7c8bab1
RK
2219}
2220
2221#page-proxy-favicon[pageproxystate="invalid"] {
2222 opacity: 0.3;
2223}
2224
2225#identity-popup.chromeUI > #identity-popup-container > #identity-popup-icon {
2226 list-style-image: url("chrome://branding/content/icon64.png");
2227}
2228
2229#identity-popup-brandName {
2230 font-weight: bold;
2231 font-size: 1.25em;
2232 margin-top: .5em;
2233 margin-bottom: .5em;
2234}
2235
2236#identity-popup-content-box {
2237 max-width: 50ch;
2238}
2239
b1dfcf32 2240#urlbar[actiontype="searchengine"] > #identity-box > #identity-icons > #page-proxy-favicon {
b336389b
RK
2241 -moz-image-region: inherit;
2242 list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon);
2243 width: 16px;
2244 height: 16px;
2245 opacity: 1;
2246}
2247
c9b0a396
RK
2248/* MAIN IDENTITY ICON */
2249
2250#identity-icon {
2251 width: 16px;
2252 height: 16px;
2253 list-style-image: url(chrome://browser/skin/identity-icon.svg#normal);
2254}
2255
2256#identity-box:hover > #identity-icon,
2257#identity-box[open=true] > #identity-icon {
2258 list-style-image: url(chrome://browser/skin/identity-icon.svg#hover);
2259}
2260
2261#urlbar[pageproxystate="valid"] > #identity-box.chromeUI > #identity-icon {
2262 list-style-image: url(chrome://branding/content/identity-icons-brand.svg);
2263}
2264
2265#urlbar[pageproxystate="invalid"] > #identity-box > #identity-icon {
2266 opacity: 0.3;
2267}
2268
2269#urlbar[actiontype="searchengine"] > #identity-box > #identity-icon {
2270 -moz-image-region: inherit;
2271 list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon);
2272 width: 16px;
2273 height: 16px;
2274 opacity: 1;
2275}
2276
2277/* TRACKING PROTECTION ICON */
2278
2279#tracking-protection-icon {
2280 width: 16px;
2281 height: 16px;
2282 margin-inline-start: 2px;
2283 margin-inline-end: 0;
2284 list-style-image: url(chrome://browser/skin/tracking-protection-16.svg);
2285 opacity: 1;
2286}
2287
2288#tracking-protection-icon[state="loaded-tracking-content"] {
2289 list-style-image: url(chrome://browser/skin/tracking-protection-disabled-16.svg);
2290}
2291
2292#tracking-protection-icon[animate] {
2293 transition: margin-left 200ms ease-out, margin-right 200ms ease-out;
2294}
2295
2296#tracking-protection-icon:not([state]) {
2297 margin-inline-end: -18px;
2298 pointer-events: none;
2299 opacity: 0;
2300 /* Only animate the shield in, when it disappears hide it immediately. */
2301 transition: none;
2302}
2303
2304#urlbar[pageproxystate="invalid"] > #identity-box > #tracking-protection-icon {
2305 visibility: collapse;
2306}
2307
2308/* CONNECTION ICON */
2309
2310#connection-icon {
2311 width: 16px;
2312 height: 16px;
2313 margin-inline-start: 2px;
2314 visibility: collapse;
2315}
2316
2317#urlbar[pageproxystate="valid"] > #identity-box.verifiedDomain > #connection-icon,
2318#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity > #connection-icon {
2319 list-style-image: url(chrome://browser/skin/identity-secure.svg);
2320 visibility: visible;
2321}
2322
2323#urlbar[pageproxystate="valid"] > #identity-box.insecureLoginForms > #connection-icon,
2324#urlbar[pageproxystate="valid"] > #identity-box.mixedActiveContent > #connection-icon {
2325 list-style-image: url(chrome://browser/skin/identity-mixed-active-loaded.svg);
2326 visibility: visible;
2327}
2328
2329#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon,
2330#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon,
2331#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon {
2332 list-style-image: url(chrome://browser/skin/identity-mixed-passive-loaded.svg);
2333 visibility: visible;
2334}
2335
2336#urlbar[pageproxystate="valid"] > #identity-box.mixedActiveBlocked > #connection-icon {
2337 list-style-image: url(chrome://browser/skin/identity-mixed-active-blocked.svg);
2338 visibility: visible;
2339}
2340
e7c8bab1
RK
2341/* === END identity-block.inc.css === */
2342
2343#page-proxy-favicon {
2344 -moz-image-region: rect(0, 16px, 16px, 0);
2345}
2346
3b1da406 2347window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box > #page-proxy-favicon {
c0f6797e
RK
2348/* -moz-margin-end: 1px;*/
2349}
2350
2a5b7882 2351#identity-box:hover > #page-proxy-favicon {
a40f6a79
RK
2352 -moz-image-region: rect(0, 32px, 16px, 16px);
2353}
2354
2a5b7882
RK
2355#identity-box:hover:active > #page-proxy-favicon,
2356#identity-box[open=true] > #page-proxy-favicon {
a40f6a79 2357 -moz-image-region: rect(0, 48px, 16px, 32px);
acb0e9b8 2358}
2359
2a5b7882
RK
2360#identity-box:hover {
2361 background-color: #FFCF00;
7092015d 2362 color: #000000;
2a5b7882
RK
2363}
2364
2365#identity-box:hover:active,
2366#identity-box[open=true] {
2367 background-color: #FF9F00;
7092015d 2368 color: #000000;
2a5b7882
RK
2369}
2370
56859d76
RK
2371#urlbar[pageproxystate="valid"] > #identity-box.chromeUI:hover,
2372#urlbar[pageproxystate="valid"] > #identity-box.chromeUI:hover:active,
2373#urlbar[pageproxystate="valid"] > #identity-box.chromeUI[open=true] {
2374 background-color: #9C9CFF;
2375 color: #000000;
2376}
2377
387e6560
RK
2378#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:hover,
2379#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity:hover:active,
2380#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity[open=true] {
2a5b7882
RK
2381 background-color: #008484;
2382 color: #000000;
2383}
2384
319c6529
RK
2385/* autocomplete */
2386
319c6529
RK
2387#treecolAutoCompleteImage {
2388 max-width: 36px;
2389}
acb0e9b8 2390
319c6529
RK
2391.ac-result-type-bookmark,
2392.autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) {
71bac478 2393 list-style-image: url("chrome://browser/skin/places/bookmark.png");
319c6529 2394 -moz-image-region: rect(0px 16px 16px 0px);
c1f7cc84 2395 width: 16px;
319c6529 2396 height: 16px;
acb0e9b8 2397}
2398
c0f6797e
RK
2399richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type-bookmark,
2400.autocomplete-treebody::-moz-tree-image(selected, current, bookmark, treecolAutoCompleteImage) {
2401/* -moz-image-region: rect(0px 48px 16px 32px);*/
2402}
2403
319c6529 2404.ac-result-type-keyword,
8922acc9
RK
2405.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage),
2406richlistitem[type~="action"][actiontype="searchengine"] > .ac-title-box > .ac-site-icon {
2407 list-style-image: url("chrome://global/skin/icons/autocomplete-search.svg#search-icon");
acb0e9b8 2408 width: 16px;
2409 height: 16px;
2410}
2411
8922acc9
RK
2412 .ac-result-type-keyword[selected="true"],
2413 .autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected),
2414 richlistitem[type~="action"][actiontype="searchengine"][selected="true"] > .ac-title-box > .ac-site-icon {
2415 list-style-image: url("chrome://global/skin/icons/autocomplete-search.svg#search-icon-inverted");
2416 }
2417
319c6529
RK
2418.ac-result-type-tag,
2419.autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) {
8da9da4e 2420 list-style-image: url("chrome://mozapps/skin/places/tagContainerIcon.png");
c1f7cc84 2421 width: 16px;
319c6529
RK
2422 height: 16px;
2423}
acb0e9b8 2424
b1dfcf32
RK
2425.ac-comment,
2426#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > description,
2427#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > button {
2428 font-size: 1.05em;
acb0e9b8 2429}
319c6529 2430
b1dfcf32
RK
2431.ac-extra > .ac-comment,
2432.ac-url-text,
2433.ac-action-text {
c0f6797e 2434 font-size: 1em;
acb0e9b8 2435}
319c6529
RK
2436
2437.ac-url-text,
2438.ac-action-text {
2439 color: #9C9CFF;
acb0e9b8 2440}
319c6529
RK
2441
2442richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
2443 list-style-image: url("chrome://browser/skin/actionicon-tab.png");
85cfb236
RK
2444 -moz-image-region: rect(0, 16px, 16px, 0);
2445 padding: 0 3px;
b1dfcf32
RK
2446 width: 22px;
2447 height: 16px;
2448}
2449
2450@media (min-resolution: 1.1dppx) {
2451 richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
2452 list-style-image: url("chrome://browser/skin/actionicon-tab@2x.png");
2453 -moz-image-region: rect(0, 32px, 32px, 0);
2454 }
85cfb236
RK
2455}
2456
2457richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url-box > .ac-action-icon {
2458 -moz-image-region: rect(16px, 16px, 32px, 0);
acb0e9b8 2459}
2460
319c6529
RK
2461.autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) {
2462 color: #8050B0;
2463}
acb0e9b8 2464
319c6529
RK
2465.ac-comment[selected="true"],
2466.ac-url-text[selected="true"],
2467.ac-action-text[selected="true"] {
2468 color: inherit !important;
acb0e9b8 2469}
2470
c1f7cc84
RK
2471.autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment),
2472.autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment)
319c6529
RK
2473{
2474 color: #8050B0;
2475 font-size: smaller;
acb0e9b8 2476}
319c6529
RK
2477
2478.autocomplete-treebody::-moz-tree-cell(suggesthint) {
2479 border-top: 1px solid #9C9CFF;
acb0e9b8 2480}
2481
319c6529
RK
2482/* combined go/reload/stop button in location bar */
2483
c9b0a396
RK
2484#urlbar-go-button,
2485#urlbar-reload-button,
2486#urlbar-stop-button {
2487 border-style: none;
52d7b436 2488 list-style-image: url("chrome://browser/skin/reload-stop-goFx.png");
c9b0a396 2489/* padding: 0 9px;*/
024a65e9 2490 margin-inline-start: 0px;
c9b0a396
RK
2491 border-inline-start: 1px solid var(--urlbar-separator-color);
2492 border-image: linear-gradient(transparent 15%,
2493 var(--urlbar-separator-color) 15%,
2494 var(--urlbar-separator-color) 85%,
2495 transparent 85%);
2496 border-image-slice: 1;
9abeb12c
RK
2497}
2498
2499#urlbar:-moz-locale-dir(ltr) > toolbarbutton {
38cfeb47
RK
2500 border-top-left-radius: 0px;
2501 border-bottom-left-radius: 0px;
acb0e9b8 2502}
acb0e9b8 2503
9abeb12c 2504#urlbar:-moz-locale-dir(rtl) > toolbarbutton {
38cfeb47
RK
2505 border-top-right-radius: 0px;
2506 border-bottom-right-radius: 0px;
9abeb12c
RK
2507}
2508
46e71434 2509#urlbar > toolbarbutton:not([disabled=true]):active:hover,
dce90fef
RK
2510#urlbar-reload-button:not(:hover) {
2511 -moz-border-start-style: none;
714b11f6 2512 -moz-padding-start: 3px;
dce90fef
RK
2513}
2514
c0f6797e
RK
2515#urlbar-reload-button {
2516 -moz-image-region: rect(0px, 14px, 14px, 0px);
acb0e9b8 2517}
2518
46e71434 2519#urlbar-reload-button[disabled=true] {
c0f6797e 2520 -moz-image-region: rect(28px, 14px, 42px, 0px);
acb0e9b8 2521}
2522
46e71434 2523#urlbar-reload-button:not([disabled=true]):hover {
c0f6797e 2524 -moz-image-region: rect(14px, 14px, 28px, 0px);
ffce2402
RK
2525}
2526
c0f6797e
RK
2527#urlbar-reload-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
2528 transform: scaleX(-1);
acb0e9b8 2529}
2530
c0f6797e
RK
2531#urlbar-go-button {
2532 -moz-image-region: rect(0, 42px, 14px, 28px);
38cfeb47
RK
2533}
2534
fff8097b 2535#urlbar-go-button:hover {
c0f6797e 2536 -moz-image-region: rect(14px, 42px, 28px, 28px);
acb0e9b8 2537}
2538
c0f6797e
RK
2539#urlbar-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
2540 transform: scaleX(-1);
acb0e9b8 2541}
319c6529
RK
2542
2543#urlbar-stop-button {
ffce2402 2544 -moz-image-region: rect(0px, 28px, 14px, 14px);
acb0e9b8 2545}
319c6529
RK
2546
2547#urlbar-stop-button:hover {
ffce2402 2548 -moz-image-region: rect(14px, 28px, 28px, 14px);
acb0e9b8 2549}
2550
2e389898 2551@media (min-resolution: 1.1dppx) {
c9b0a396
RK
2552 #urlbar-go-button,
2553 #urlbar-reload-button,
2554 #urlbar-stop-button {
2e389898
RK
2555 list-style-image: url("chrome://browser/skin/reload-stop-go@2x.png");
2556 }
2557
c9b0a396
RK
2558 #urlbar-go-button > .toolbarbutton-icon,
2559 #urlbar-reload-button > .toolbarbutton-icon,
2560 #urlbar-stop-button > .toolbarbutton-icon {
2561 width: 14px;
2562 }
2563
2e389898
RK
2564 #urlbar-go-button {
2565 -moz-image-region: rect(0, 84px, 28px, 56px);
2566 }
2567
2568 #urlbar-go-button:hover {
2569 -moz-image-region: rect(28px, 84px, 56px, 56px);
2570 }
2571
2572 #urlbar-go-button:hover:active {
2573 -moz-image-region: rect(56px, 84px, 84px, 56px);
2574 }
2575
2576 #urlbar-reload-button {
2577 -moz-image-region: rect(0, 28px, 28px, 0);
2578 }
2579
2580 #urlbar-reload-button:not([disabled]):hover {
2581 -moz-image-region: rect(28px, 28px, 56px, 0);
2582 }
2583
2584 #urlbar-reload-button:not([disabled]):hover:active {
2585 -moz-image-region: rect(56px, 28px, 84px, 0);
2586 }
2587
2588 #urlbar-stop-button {
2589 -moz-image-region: rect(0, 56px, 28px, 28px);
2590 }
2591
2592 #urlbar-stop-button:not([disabled]):hover {
2593 -moz-image-region: rect(28px, 56px, 56px, 28px);
2594 }
2595
2596 #urlbar-stop-button:hover:active {
2597 -moz-image-region: rect(56px, 56px, 84px, 28px);
2598 }
2e389898
RK
2599}
2600
319c6529
RK
2601/* popup blocker button */
2602
2603#page-report-button {
2604 list-style-image: url("chrome://browser/skin/urlbar-popup-blocked.png");
2605 -moz-image-region: rect(0, 16px, 16px, 0);
acb0e9b8 2606}
319c6529 2607
71bac478 2608#page-report-button:hover ,
319c6529
RK
2609#page-report-button:hover:active,
2610#page-report-button[open="true"] {
71bac478 2611 -moz-image-region: rect(0, 32px, 16px, 16px);
acb0e9b8 2612}
2613
bcb9d005
RK
2614/* Reader mode button */
2615
2616#reader-mode-button {
2617 list-style-image: url("chrome://browser/skin/readerMode.svg");
2618 -moz-image-region: rect(0, 16px, 16px, 0);
2619}
2620
2621#reader-mode-button:hover,
2622#reader-mode-button[readeractive]:hover {
2623 -moz-image-region: rect(0, 32px, 16px, 16px);
2624}
2625
2626#reader-mode-button:hover:active,
2627#reader-mode-button[readeractive] {
2628 -moz-image-region: rect(0, 48px, 16px, 32px);
2629}
2630
c4460289
RK
2631/* social share panel */
2632
20752032
RK
2633.social-share-frame {
2634 min-width: 756px;
c4460289
RK
2635 height: 150px;
2636}
2637
20752032
RK
2638#share-container {
2639 min-width: 756px;
2640 background-color: white;
2641 background-repeat: no-repeat;
2642 background-position: center center;
c4460289 2643}
20752032
RK
2644#share-container[loading] {
2645 background-image: url(chrome://browser/skin/tabbrowser/pendingpaint.png);
2646}
2647#share-container > browser {
2648 transition: opacity 150ms ease-in-out;
2649 opacity: 1;
2650}
2651#share-container[loading] > browser {
2652 opacity: 0;
c4460289
RK
2653}
2654
20752032
RK
2655.social-share-toolbar {
2656 border-bottom: 1px solid #9C9CFF;
2657 padding: 2px;
c4460289
RK
2658}
2659
20752032
RK
2660#social-share-provider-buttons {
2661 padding: 0;
2662 margin: 0;
c4460289
RK
2663}
2664
20752032
RK
2665.share-provider-button {
2666 padding: 5px;
2667 margin: 2px;
c4460289
RK
2668}
2669
20752032 2670.share-provider-button > .toolbarbutton-text {
c4460289
RK
2671 display: none;
2672}
20752032 2673.share-provider-button > .toolbarbutton-icon {
c4460289
RK
2674 width: 16px;
2675 min-height: 16px;
2676 max-height: 16px;
2677}
2678
2679/* fixup corners for share panel */
2680.social-panel > .social-panel-frame {
2681 border-radius: inherit;
2682}
2683
2684#social-share-panel {
c4460289 2685 min-height: 100px;
20752032 2686 min-width: 766px;
c4460289
RK
2687}
2688
20752032 2689#share-container,
c4460289 2690.social-share-frame {
e2734cc7 2691 border-top-left-radius: 0;
c4460289 2692 border-bottom-left-radius: inherit;
e2734cc7 2693 border-top-right-radius: 0;
20752032 2694 border-bottom-right-radius: inherit;
c4460289
RK
2695}
2696
20752032 2697#social-share-panel > .social-share-toolbar {
e2734cc7 2698 border-top-left-radius: inherit;
e2734cc7 2699 border-top-right-radius: inherit;
e2734cc7
RK
2700}
2701
20752032 2702#social-share-provider-buttons {
c4460289 2703 border-top-left-radius: inherit;
e2734cc7 2704 border-top-right-radius: inherit;
e2734cc7
RK
2705}
2706
889649fd
RK
2707/* social recommending panel */
2708
a6757852 2709#social-mark-button {
d7cfd768 2710 -moz-image-region: rect(0, 16px, 16px, 0);
889649fd
RK
2711}
2712
c0f6797e 2713/* bookmarks menu-button */
319c6529 2714
c0f6797e
RK
2715#bookmarks-menu-button.bookmark-item {
2716 list-style-image: url("chrome://browser/skin/places/bookmark.png");
2717 -moz-image-region: rect(0px 16px 16px 0px);
acb0e9b8 2718}
319c6529 2719
c0f6797e
RK
2720#bookmarks-menu-button.bookmark-item[starred] {
2721 -moz-image-region: rect(0px 32px 16px 16px);
acb0e9b8 2722}
319c6529 2723
e9fbfc3a 2724#nav-bar #bookmarks-menu-button[cui-areatype="toolbar"]:not([overflowedItem=true]) > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
c0f6797e
RK
2725 padding-top: 2px;
2726 padding-bottom: 2px;
71bac478
RK
2727}
2728
c0f6797e
RK
2729#BMB_bookmarksPopup[side="top"],
2730#BMB_bookmarksPopup[side="bottom"] {
2731 margin-left: -20px;
2732 margin-right: -20px;
71bac478
RK
2733}
2734
c0f6797e
RK
2735#BMB_bookmarksPopup[side="left"],
2736#BMB_bookmarksPopup[side="right"] {
2737 margin-top: -20px;
2738 margin-bottom: -20px;
acb0e9b8 2739}
319c6529
RK
2740
2741/* bookmarking panel */
c0f6797e 2742
319c6529
RK
2743#editBookmarkPanelStarIcon {
2744 list-style-image: url("chrome://browser/skin/places/starred48.png");
2745 width: 48px;
2746 height: 48px;
acb0e9b8 2747}
319c6529
RK
2748
2749#editBookmarkPanelStarIcon[unstarred] {
2750 list-style-image: url("chrome://browser/skin/places/unstarred48.png");
acb0e9b8 2751}
2752
319c6529
RK
2753#editBookmarkPanelTitle {
2754 font-size: 130%;
acb0e9b8 2755}
319c6529
RK
2756
2757#editBookmarkPanelHeader,
2758#editBookmarkPanelContent {
2759 margin-bottom: .5em;
acb0e9b8 2760}
319c6529
RK
2761
2762/* Implements editBookmarkPanel resizing on folderTree un-collapse. */
2763#editBMPanel_folderTree {
2764 min-width: 27em;
acb0e9b8 2765}
2766
f993773d 2767.panel-promo-box {
46e71434
RK
2768 margin: 5px 0 -6px;
2769 padding: 5px 0;
889649fd 2770 border-top: 1px solid #9C9CFF;
f0eab82c
RK
2771 border-bottom-left-radius: 5px;
2772 border-bottom-right-radius: 5px;
f993773d
RK
2773}
2774
2775.panel-promo-icon {
2776 list-style-image: url("chrome://browser/skin/sync-notification-24.png");
2777 -moz-margin-end: 10px;
2778 vertical-align: middle;
2779}
2780
2781.panel-promo-closebutton {
2782 list-style-image: url("chrome://global/skin/icons/close-button.gif");
f0eab82c
RK
2783 -moz-margin-end: -3px;
2784 margin-top: -3px;
f993773d
RK
2785}
2786
2787.panel-promo-closebutton:hover {
2788 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2789}
2790
2791.panel-promo-closebutton:hover:active {
2792 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2793}
2794
2795.panel-promo-closebutton > .toolbarbutton-text {
2796 padding: 0;
f993773d
RK
2797}
2798
319c6529
RK
2799/* ::::: content area ::::: */
2800
bcb9d005
RK
2801#sidebar-box {
2802 background-color: #9C9CFF;
2803 color: #000000;
2804}
2805
319c6529 2806#sidebar {
bcb9d005
RK
2807 background-color: #000000;
2808}
2809
2810#sidebar-splitter {
2811 -moz-margin-start: 0;
2812}
2813
2814#sidebar-header {
2815 color: #000000;
2816 padding: 2px;
acb0e9b8 2817}
319c6529
RK
2818
2819#sidebar-title {
2820 -moz-padding-start: 0px;
acb0e9b8 2821}
319c6529 2822
589b5528
RK
2823#sidebar-header > .close-icon {
2824/* padding: 4px 2px;
2825 margin: 0;
2826 border: none;*/
2827 list-style-image: url("chrome://global/skin/icons/close-button.gif");
2828}
2829
2830#sidebar-header > .close-icon:hover,
2831#sidebar-header > .close-icon:hover:active {
2832 list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
2833}
2834
bcb9d005
RK
2835#sidebar-splitter:-moz-locale-dir(ltr),
2836#sidebar:-moz-locale-dir(ltr) {
2837 border-radius: 0 5px 0 0;
2838}
2839
2840#sidebar-splitter:-moz-locale-dir(rtl),
2841#sidebar:-moz-locale-dir(rtl) {
2842 border-radius: 5px 0 0 0;
2843}
2844
fe524e0c
RK
2845.browserContainer > findbar {
2846/*
2847 background-color: -moz-dialog;
2848 color: -moz-DialogText;
2849*/
2850}
2851
319c6529 2852/* Tabstrip */
b36fc72e 2853
c0f6797e 2854#TabsToolbar {
e20c83c3
RK
2855 min-height: 0;
2856 padding: 0;
2857 -moz-binding: url("chrome://browser/content/customizableui/toolbar.xml#toolbar");
2858}
2859
b36fc72e 2860#TabsToolbar .toolbar-holder {
c1f7cc84 2861 background-color: #000000; /* correct effect of being an actual toolbar */
acb0e9b8 2862}
2863
b36fc72e 2864#main-window[disablechrome] #TabsToolbar,
319c6529 2865#TabsToolbar[tabsontop="false"] {
8b5fc82e 2866 border-bottom: 1px solid #008484;
acb0e9b8 2867}
319c6529 2868
6dc70335
RK
2869/* === BEGIN tabs.inc.css === */
2870
368d0b7f
RK
2871:root {
2872 /* --tab-toolbar-navbar-overlap: 1px; */
024a65e9 2873 /* --navbar-tab-toolbar-highlight-overlap: 1px; */
368d0b7f 2874 /* --tab-min-height: 31px; */
024a65e9
RK
2875}
2876#TabsToolbar {
2877 /* --tab-stroke-background-size: auto 100%; */
368d0b7f
RK
2878}
2879
319c6529 2880.tabbrowser-tab,
43ee1307
RK
2881.tabs-newtab-button,
2882#TabsToolbar > #new-tab-button {
319c6529 2883 margin-top: 0px;
acb0e9b8 2884}
319c6529 2885
43ee1307 2886.tabbrowser-tab {
57fc408c
RK
2887 padding: 1px 4px 2px;
2888}
2889
2890.tabbrowser-tab:first-of-type {
2891 -moz-margin-start: 2px;
2892}
2893
43ee1307
RK
2894.tabs-newtab-button,
2895#TabsToolbar > #new-tab-button {
57fc408c
RK
2896 border-radius: 8px 8px 0px 0px;
2897 -moz-margin-start: 0;
2898}
2899
43ee1307
RK
2900.tabs-newtab-button:not(:hover),
2901#TabsToolbar > #new-tab-button:not(:hover) {
57fc408c
RK
2902 background-color: #C09070;
2903}
2904
c0f6797e 2905/* The selected tab should appear above adjacent tabs, .tabs-newtab-button and the highlight of #nav-bar */
05148fed 2906.tabbrowser-tab[visuallyselected=true] {
c0f6797e
RK
2907/* position: relative;
2908 z-index: 2;*/
acb0e9b8 2909}
2910
c0f6797e 2911.tab-background-middle {
acb0e9b8 2912}
2913
c0f6797e 2914.tab-content {
acb0e9b8 2915}
319c6529 2916
d533ec21
RK
2917.tab-content[pinned] {
2918}
2919
2920.tab-throbber,
c0f6797e 2921.tab-icon-image,
b1dfcf32 2922.tab-icon-sound,
c0f6797e 2923.tab-close-button {
acb0e9b8 2924}
2925
319c6529
RK
2926.tab-throbber,
2927.tab-icon-image {
319c6529 2928 height: 16px;
c0f6797e 2929 width: 16px;
d533ec21 2930 -moz-margin-end: 3px;
c0f6797e
RK
2931}
2932
2933.tab-icon-image {
dce90fef 2934 list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
613daf44 2935}
2936
d533ec21
RK
2937.tab-icon-overlay {
2938 width: 16px;
2939 height: 16px;
d7b7f7e1
RK
2940 margin-top: -8px;
2941 -moz-margin-start: -15px;
b1dfcf32 2942 position: relative;
d533ec21
RK
2943}
2944
2945.tab-icon-overlay[crashed] {
d533ec21
RK
2946 list-style-image: url("chrome://browser/skin/tabbrowser/crashed.svg");
2947}
2948
024a65e9
RK
2949.tab-icon-overlay[soundplaying],
2950.tab-icon-overlay[muted]:not([crashed]) {
d7b7f7e1 2951 border-radius: 10px;
b1dfcf32
RK
2952}
2953
024a65e9
RK
2954.tab-icon-overlay[soundplaying]:hover,
2955.tab-icon-overlay[muted]:hover {
b1dfcf32
RK
2956 background-color: #FFCF00;
2957}
2958
024a65e9 2959.tab-icon-overlay[soundplaying] {
b1dfcf32
RK
2960 display: -moz-box;
2961 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio");
2962}
2963
024a65e9 2964.tab-icon-overlay[muted]:not([crashed]) {
b1dfcf32
RK
2965 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-muted");
2966}
2967
024a65e9
RK
2968#TabsToolbar[brighttext] .tab-icon-overlay[soundplaying]:not(:hover) {
2969 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white");
b1dfcf32
RK
2970}
2971
b1dfcf32 2972
024a65e9
RK
2973#TabsToolbar[brighttext] .tab-icon-overlay[muted]:not([crashed]):not(:hover) {
2974 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white-muted");
b1dfcf32
RK
2975}
2976
3d64e0ce 2977.tab-throbber[busy] {
95f333af 2978 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim-connect.png");
613daf44 2979}
319c6529
RK
2980
2981.tab-throbber[progress] {
95f333af 2982 list-style-image: url("chrome://communicator/skin/brand/throbber16-anim.png");
613daf44 2983}
319c6529 2984
319c6529
RK
2985.tab-throbber[pinned],
2986.tab-icon-image[pinned] {
2987 -moz-margin-start: 2px;
2988 -moz-margin-end: 2px;
613daf44 2989}
319c6529 2990
c0f6797e 2991.tab-label {
aec5dfad
RK
2992 /* this needs to add up to the 16px of the icon image */
2993 height: 12px;
2994 margin-top: 2px !important;
2995 margin-bottom: 2px !important;
c0f6797e
RK
2996}
2997
b1dfcf32
RK
2998.tab-icon-sound {
2999 -moz-margin-start: 4px;
3000 width: 16px;
3001 height: 16px;
3002 padding: 0;
3003}
3004
b1dfcf32
RK
3005.tab-icon-sound[muted] {
3006 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted");
3007}
3008
3009.tab-icon-sound[muted]:hover {
3010 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-hover");
3011}
3012
3013.tab-icon-sound[muted]:hover:active {
3014 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-pressed");
3015}
3016
3017.tab-icon-sound[soundplaying] {
024a65e9 3018 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab");
b1dfcf32
RK
3019}
3020
3021.tab-icon-sound[soundplaying]:hover {
024a65e9 3022 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-hover");
b1dfcf32
RK
3023}
3024
3025.tab-icon-sound[soundplaying]:hover:active {
024a65e9
RK
3026 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-pressed");
3027}
3028
3029.tab-icon-sound[muted] {
3030 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted");
3031}
3032
3033.tab-icon-sound[muted]:hover {
3034 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted-hover");
3035}
3036
3037.tab-icon-sound[muted]:hover:active {
3038 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted-pressed");
3039}
3040
3041.tab-icon-sound[visuallyselected=true][soundplaying] {
3042 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio");
3043}
3044
3045.tab-icon-sound[visuallyselected=true][soundplaying]:hover {
3046 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-hover");
3047}
3048
3049.tab-icon-sound[visuallyselected=true][soundplaying]:hover:active {
b1dfcf32
RK
3050 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-pressed");
3051}
3052
024a65e9
RK
3053.tab-icon-sound[visuallyselected=true][muted] {
3054 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted");
3055}
3056
3057.tab-icon-sound[visuallyselected=true][muted]:hover {
3058 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-hover");
3059}
3060
3061.tab-icon-sound[visuallyselected=true][muted]:hover:active {
3062 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-pressed");
3063}
3064
b1dfcf32 3065#TabsToolbar[brighttext] .tab-icon-sound[soundplaying] {
024a65e9 3066 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white");
b1dfcf32
RK
3067}
3068
3069#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover {
024a65e9 3070 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-hover");
b1dfcf32
RK
3071}
3072
3073#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover:active {
024a65e9 3074 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-pressed");
b1dfcf32
RK
3075}
3076
3077#TabsToolbar[brighttext] .tab-icon-sound[muted] {
024a65e9 3078 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white");
b1dfcf32
RK
3079}
3080
3081#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover {
024a65e9 3082 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-hover");
b1dfcf32
RK
3083}
3084
3085#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover:active {
024a65e9 3086 list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-pressed");
b1dfcf32
RK
3087}
3088
c0f6797e
RK
3089.tab-close-button {
3090 margin-top: 1px;
3091 padding: 0;
3092}
3093
3094.tab-background,
3095.tabs-newtab-button {
3096 /* overlap the tab curves */
3097}
3098
3099.tabbrowser-arrowscrollbox > .arrowscrollbox-scrollbox {
3100}
3101
93c91f62
RK
3102/* Tab Overflow */
3103.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-start-indicator:not([collapsed]),
3104.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-end-indicator:not([collapsed]) {
3105}
3106
3107.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-start-indicator:-moz-locale-dir(rtl),
3108.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-end-indicator:-moz-locale-dir(ltr) {
3109}
3110
3111.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-start-indicator:not([collapsed]) {
3112}
3113
3114.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-end-indicator:not([collapsed]) {
3115}
3116
3117.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-start-indicator[collapsed],
3118.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-end-indicator[collapsed] {
3119}
3120
3121.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-start-indicator,
3122.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-end-indicator {
3123}
3124
05148fed
RK
3125.tab-background-start[visuallyselected=true]::after,
3126.tab-background-start[visuallyselected=true]::before,
c0f6797e
RK
3127.tab-background-start,
3128.tab-background-end,
05148fed
RK
3129.tab-background-end[visuallyselected=true]::after,
3130.tab-background-end[visuallyselected=true]::before {
c0f6797e
RK
3131}
3132
05148fed 3133.tabbrowser-tab:not([visuallyselected=true]),
c0f6797e
RK
3134.tabbrowser-tab:-moz-lwtheme {
3135}
3136
319c6529 3137/* tabbrowser-tab focus ring */
c0f6797e 3138.tabbrowser-tab:focus {
319c6529 3139 outline: 1px dotted;
613daf44 3140}
319c6529 3141
c0f6797e
RK
3142/* Selected tab */
3143
05148fed 3144.tabbrowser-tab[visuallyselected="true"] {
c0f6797e
RK
3145}
3146
3147/* End selected tab */
3148
d7b7f7e1
RK
3149/* User Context UI - change tab decoration depending on userContextId.
3150 Defaults to gray for unknown usercontextids. */
3151.tabbrowser-tab[usercontextid] {
3152 background-image: linear-gradient(to right, transparent 20%, #A09090 30%, #A09090 70%, transparent 80%);
3153 background-size: auto 2px;
3154 background-repeat: no-repeat;
3155}
3156
3157/* Personal User Context */
3158.tabbrowser-tab[usercontextid="1"] {
3159 background-image: linear-gradient(to right, transparent 20%, #9C9CFF 30%, #9C9CFF 70%, transparent 80%);
3160}
3161/* Work User Context */
3162.tabbrowser-tab[usercontextid="2"] {
3163 background-image: linear-gradient(to right, transparent 20%, #FF9F00 30%, #FF9F00 70%, transparent 80%);
3164}
3165/* Banking User Context */
3166.tabbrowser-tab[usercontextid="3"] {
3167 background-image: linear-gradient(to right, transparent 20%, #008484 30%, #008484 70%, transparent 80%);
3168}
3169/* Shopping User Context */
3170.tabbrowser-tab[usercontextid="4"] {
3171 background-image: linear-gradient(to right, transparent 20%, #E7ADE7 30%, #E7ADE7 70%, transparent 80%);
3172}
3173
c0f6797e
RK
3174/* Tab pointer-events */
3175/*
3176.tabbrowser-tab {
3177 pointer-events: none;
3178}
3179
3180.tab-background-middle,
3181.tabs-newtab-button,
b1dfcf32
RK
3182.tab-icon-overlay[soundplaying],
3183.tab-icon-overlay[muted]:not([crashed]),