/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/icon_only_context_menu_text_controls.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */

/* Makes text-controls in context menus appear horizontally at the top of the menu.
 * You will need iconized_textbox_context_menu.css and iconized_content_context_menu.css
 * to actually show the icons.
*/

.textbox-contextmenu,
#contentAreaContextMenu{
  --uc-scrollbox-display: grid;
  --uc-scrollbox-slot: contents;
}
:where(#contentAreaContextMenu,.textbox-contextmenu) > :is(menu,menuitem,menuseparator,menugroup){
  grid-column: 1/7
}
scrollbox[orient="vertical"][smoothscroll="false"]{
  flex-direction: var(--uc-flex-direction,initial) !important;
  flex-wrap: var(--uc-flex-wrap,nowrap) !important;
  display: var(--uc-scrollbox-display,flex);
  grid-auto-columns: min-content;
  grid-template-columns: 1fr 1fr 1fr min-content 1fr 1fr;
}
scrollbox[orient="vertical"][smoothscroll="false"] > slot{
  display: var(--uc-scrollbox-slot,initial) !important;
}
#context-cut:not([hidden]) + #context-copy,
#context-pdfjs-cut:not([hidden]) + #context-pdfjs-copy,
#context-cut,
#context-pdfjs-cut,
#context-paste,
#context-paste-no-formatting,
#context-pdfjs-paste,
#context-delete,
#context-pdfjs-delete,
#context-delete:not([hidden]) + #context-selectall,
#context-pdfjs-delete:not([hidden]) + #context-pdfjs-selectall,
.textbox-contextmenu > [data-l10n-id="text-action-copy"],
.textbox-contextmenu > [data-l10n-id="text-action-cut"],
.textbox-contextmenu > [data-l10n-id="text-action-paste"],
.textbox-contextmenu > [data-l10n-id="text-action-delete"],
.textbox-contextmenu > [data-l10n-id="text-action-select-all"]{
  order: -2;
  justify-content: center;
  padding-inline: 0 !important;
  &::before{ padding: 0 }
  & .menu-text{ display: none }
  & .menu-accel-container{ display: none }
}
#context-sep-redo,
.textbox-contextmenu > [data-l10n-id="text-action-redo"] + menuseparator{
  order: -1;
}
#context-cut,
#context-pdfjs-cut,
.textbox-contextmenu > [data-l10n-id="text-action-cut"]{
  grid-column: 1/2
}
#context-cut:not([hidden]) + #context-copy,
#context-pdfjs-cut:not([hidden]) + #context-pdfjs-copy,
.textbox-contextmenu > [data-l10n-id="text-action-copy"]{
  grid-column: 2/3;
}
#context-paste,
#context-pdfjs-paste,
.textbox-contextmenu > [data-l10n-id="text-action-paste"]{
  grid-column: 3/4;
}
#context-paste-no-formatting{
  grid-column: 4/5;
  min-width: 32px;
  background-image: url("chrome://global/skin/reader/RM-Serif.svg");
  background-repeat: no-repeat;
  background-position: bottom 10% left 20%;
  background-size: 50%;
  fill: currentColor;
  -moz-context-properties: fill;
  &::before{
    content url("chrome://global/skin/reader/RM-Serif.svg");
    mask-image: radial-gradient(ellipse at bottom left,transparent 30%, black 32%,black);
    mask-repeat: no-repeat;
    mask-size: 180% 110%;
  }
}
#context-delete,
#context-pdfjs-delete,
.textbox-contextmenu > [data-l10n-id="text-action-delete"]{
  grid-column: 5/6;
}
#context-delete:not([hidden]) + #context-selectall,
#context-pdfjs-delete:not([hidden]) + #context-pdfjs-selectall,
.textbox-contextmenu > [data-l10n-id="text-action-select-all"]{
  grid-column: 6/7
}
.textbox-contextmenu > #paste-and-go,
.textbox-contextmenu > [data-l10n-id="text-action-strip-on-share"]{
  order: 2;
}