/*
 * This file contains styles for Inbox view edit mode. They complement styles
 * from views/shared/style/edit-mode.css that are applied as well.
 * View edit mode is activated via Options -> Select threads.
 */


.bb-tablist > li button[data-action="mark-as-read"] {
  background-image: image-set(url("images/icons/ico_in_markasread_30x30.png") 1x, url("images/icons/ico_in_markasread_30x30@1.5x.png") 1.5x, url("images/icons/ico_in_markasread_30x30@2x.png") 2x, url("images/icons/ico_in_markasread_30x30@2.25x.png") 2.25x);
}

.bb-tablist > li button[data-action="mark-as-unread"] {
  background-image: image-set(url("images/icons/ico_in_markasunread_30x30.png") 1x, url("images/icons/ico_in_markasunread_30x30@1.5x.png") 1.5x, url("images/icons/ico_in_markasunread_30x30@2x.png") 2x, url("images/icons/ico_in_markasunread_30x30@2.25x.png") 2.25x);
}

.edit #threads-container[data-type="list"] {
  height: calc(100% - 10rem);
}

html[dir="ltr"] .edit [data-type="list"] li > a > aside.icon-unread {
  transform: translateX(5rem);
}
html[dir="rtl"] .edit [data-type="list"] li > a > aside.icon-unread {
  transform: translateX(-5rem);
}

.edit #threads-container aside.pack-end {
  margin-inline-start: 4rem;
}

html[dir="ltr"] .edit #threads-container[data-type="list"] aside.pack-end span {
  transform: translateX(1.5rem);
}
html[dir="rtl"] .edit #threads-container[data-type="list"] aside.pack-end span {
  transform: translateX(-1.5rem);
}