/* Versioned J&A icon treatment. Roundcube commands, labels, focus and
   disabled state stay on their original controls. SVG shapes follow the portal
   navigation's 24px, 1.8px, round-cap outline language. */
html:root body[class] #taskmenu a.compose::before { --ja-icon: url("/static.php/skins/jaautomation/icons/compose.svg"); }
html:root body[class] #taskmenu a.mail::before { --ja-icon: url("/static.php/skins/jaautomation/icons/mail.svg"); }
html:root body[class] #taskmenu a.contacts::before { --ja-icon: url("/static.php/skins/jaautomation/icons/contacts.svg"); }
html:root body[class] #taskmenu a.settings::before { --ja-icon: url("/static.php/skins/jaautomation/icons/settings.svg"); }
html:root body[class] #taskmenu a.about::before { --ja-icon: url("/static.php/skins/jaautomation/icons/help.svg"); }
html:root body[class] #taskmenu a.logout::before { --ja-icon: url("/static.php/skins/jaautomation/icons/logout.svg"); }
html:root body[class] #taskmenu a.theme.dark::before { --ja-icon: url("/static.php/skins/jaautomation/icons/moon.svg"); }
html:root body[class] #taskmenu a.theme.light::before { --ja-icon: url("/static.php/skins/jaautomation/icons/sun.svg"); }
html:root body[class] #taskmenu a:is(.compose,.mail,.contacts,.settings,.theme,.about,.logout)::before {
  content: "" !important; display: inline-block !important; float: none !important;
  box-sizing: border-box; width: 22px !important; height: 22px !important;
  margin: 0 auto 3px !important; padding: 0 !important;
  color: inherit !important; background: currentColor !important;
  -webkit-mask-image: var(--ja-icon); mask-image: var(--ja-icon);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-size: contain; mask-size: contain;
  -webkit-mask-position: center; mask-position: center;
  font-size: 0 !important; line-height: 1 !important;
}
html:root body[class] .toolbar.menu a.select::before { --ja-icon: url("/static.php/skins/jaautomation/icons/select.svg"); }
html:root body[class] .toolbar.menu a.threads::before { --ja-icon: url("/static.php/skins/jaautomation/icons/threads.svg"); }
html:root body[class] .toolbar.menu a.options::before { --ja-icon: url("/static.php/skins/jaautomation/icons/options.svg"); }
html:root body[class] .toolbar.menu a.refresh::before { --ja-icon: url("/static.php/skins/jaautomation/icons/refresh.svg"); }
html:root body[class] .toolbar.menu a.reply::before { --ja-icon: url("/static.php/skins/jaautomation/icons/reply.svg"); }
html:root body[class] .toolbar.menu a.reply-all::before { --ja-icon: url("/static.php/skins/jaautomation/icons/reply-all.svg"); }
html:root body[class] .toolbar.menu a.forward::before { --ja-icon: url("/static.php/skins/jaautomation/icons/forward.svg"); }
html:root body[class] .toolbar.menu a.delete::before { --ja-icon: url("/static.php/skins/jaautomation/icons/trash.svg"); }
html:root body[class] .toolbar.menu a.archive::before { --ja-icon: url("/static.php/skins/jaautomation/icons/archive.svg"); }
html:root body[class] .toolbar.menu a.markmessage::before { --ja-icon: url("/static.php/skins/jaautomation/icons/tag.svg"); }
html:root body[class] .toolbar.menu a.more::before { --ja-icon: url("/static.php/skins/jaautomation/icons/more.svg"); }
html:root body[class] .toolbar.menu a.save::before { --ja-icon: url("/static.php/skins/jaautomation/icons/save.svg"); }
html:root body[class] .toolbar.menu a.attach::before { --ja-icon: url("/static.php/skins/jaautomation/icons/attach.svg"); }
html:root body[class] .toolbar.menu a.send::before { --ja-icon: url("/static.php/skins/jaautomation/icons/send.svg"); }
html:root body[class] .toolbar.menu a.create::before { --ja-icon: url("/static.php/skins/jaautomation/icons/plus.svg"); }
html:root body[class] .toolbar.menu a.print::before { --ja-icon: url("/static.php/skins/jaautomation/icons/print.svg"); }
html:root body[class] .toolbar.menu a.import::before { --ja-icon: url("/static.php/skins/jaautomation/icons/upload.svg"); }
html:root body[class] .toolbar.menu a.export::before { --ja-icon: url("/static.php/skins/jaautomation/icons/download.svg"); }
html:root body[class] .toolbar.menu a.search::before { --ja-icon: url("/static.php/skins/jaautomation/icons/search.svg"); }
html:root body[class] .toolbar.menu a.signature::before { --ja-icon: url("/static.php/skins/jaautomation/icons/edit.svg"); }
html:root body[class] .toolbar.menu a.responses::before { --ja-icon: url("/static.php/skins/jaautomation/icons/threads.svg"); }
html:root body[class] .header a.button.refresh::before { --ja-icon: url("/static.php/skins/jaautomation/icons/refresh.svg"); }
html:root body[class] .header a.button.task-menu-button::before { --ja-icon: url("/static.php/skins/jaautomation/icons/menu.svg"); }
html:root body[class] .header a.button.toolbar-menu-button::before { --ja-icon: url("/static.php/skins/jaautomation/icons/more.svg"); }
html:root body[class] .header a.button.sidebar-menu::before { --ja-icon: url("/static.php/skins/jaautomation/icons/more.svg"); }
html:root body[class] .header a.button.back-sidebar-button::before { --ja-icon: url("/static.php/skins/jaautomation/icons/back.svg"); }
html:root body[class] .header a.button.back-list-button::before { --ja-icon: url("/static.php/skins/jaautomation/icons/back.svg"); }
html:root body[class] .header a.button.back-content-button::before { --ja-icon: url("/static.php/skins/jaautomation/icons/back.svg"); }
html:root body[class] button.btn.send::before { --ja-icon: url("/static.php/skins/jaautomation/icons/send.svg"); }
html:root body[class] button.btn.attach::before { --ja-icon: url("/static.php/skins/jaautomation/icons/attach.svg"); }
html:root body[class] button.btn.save::before { --ja-icon: url("/static.php/skins/jaautomation/icons/save.svg"); }
html:root body[class] button.btn.submit::before { --ja-icon: url("/static.php/skins/jaautomation/icons/check.svg"); }
html:root body[class] button.btn.search::before { --ja-icon: url("/static.php/skins/jaautomation/icons/search.svg"); }
html:root body[class] button.btn.delete::before { --ja-icon: url("/static.php/skins/jaautomation/icons/trash.svg"); }
html:root body[class] button.btn.create::before { --ja-icon: url("/static.php/skins/jaautomation/icons/plus.svg"); }
html:root body[class] .floating-action-buttons a.button.compose::before { --ja-icon: url("/static.php/skins/jaautomation/icons/compose.svg"); }
html:root body[class] .floating-action-buttons a.button.create::before { --ja-icon: url("/static.php/skins/jaautomation/icons/plus.svg"); }
html:root body[class] :is(.toolbar.menu a:is(.select,.threads,.options,.refresh,.reply,.reply-all,.forward,.delete,.archive,.markmessage,.more,.save,.attach,.send,.create,.print,.import,.export,.search,.signature,.responses),.header a.button:is(.refresh,.task-menu-button,.toolbar-menu-button,.sidebar-menu,.back-sidebar-button,.back-list-button,.back-content-button),button.btn:is(.send,.attach,.save,.submit,.search,.delete,.create),.floating-action-buttons a.button:is(.compose,.create))::before {
  content: "" !important; display: inline-block !important; box-sizing: border-box;
  width: 20px !important; min-width: 20px !important; height: 20px !important;
  margin: 0 .35rem 0 0 !important; padding: 0 !important; float: none !important;
  vertical-align: -4px !important; color: inherit !important; background: currentColor !important;
  -webkit-mask-image: var(--ja-icon); mask-image: var(--ja-icon);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-size: contain; mask-size: contain;
  -webkit-mask-position: center; mask-position: center;
  font-size: 0 !important; line-height: 1 !important;
}
html:root body[class] .toolbar.menu a::before,
html:root body[class] .header a.button.icon::before { vertical-align: middle; }
@media (max-width: 600px) {
  html:root body[class] #taskmenu a:is(.compose,.mail,.contacts,.settings,.theme,.about,.logout)::before {
    margin: 0 .7rem 0 0 !important; width: 20px !important; height: 20px !important;
  }
  html:root body[class] .floating-action-buttons a.button:is(.compose,.create)::before {
    margin-right: .55rem !important;
  }
}

html:root body[class] #mailboxlist li.inbox > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/mail.svg"); }
html:root body[class] #mailboxlist li.drafts > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/draft.svg"); }
html:root body[class] #mailboxlist li.sent > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/send.svg"); }
html:root body[class] #mailboxlist li.junk > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/warning.svg"); }
html:root body[class] #mailboxlist li.trash > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/trash.svg"); }
html:root body[class] #mailboxlist li.archive > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/archive.svg"); }
html:root body[class] #mailboxlist li > a::before {
  --ja-icon: url("/static.php/skins/jaautomation/icons/folder.svg");
  content: "" !important; display: inline-block !important;
  width: 18px !important; height: 18px !important; float: left !important;
  margin: 0 .65rem 0 0 !important; color: inherit !important; background: currentColor !important;
  -webkit-mask-image: var(--ja-icon); mask-image: var(--ja-icon);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-size: contain; mask-size: contain;
  -webkit-mask-position: center; mask-position: center;
  font-size: 0 !important; line-height: 1 !important;
}
html:root body[class] #mailboxlist li.inbox > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/mail.svg"); }
html:root body[class] #mailboxlist li.drafts > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/draft.svg"); }
html:root body[class] #mailboxlist li.sent > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/send.svg"); }
html:root body[class] #mailboxlist li.junk > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/warning.svg"); }
html:root body[class] #mailboxlist li.trash > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/trash.svg"); }
html:root body[class] #mailboxlist li.archive > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/archive.svg"); }
/* Preserve Elastic's icon-above-label rhythm in the narrow desktop rail and
   its primary toolbars; the icon change must not consume label width. */
@media (min-width: 601px) {
  html:root body[class] #taskmenu a:is(.compose,.mail,.contacts,.settings,.theme,.about,.logout)::before {
    display: block !important; width: 22px !important; height: 22px !important;
    margin: 0 auto 4px !important;
  }
}
html:root body[class] .toolbar.menu a:is(.select,.threads,.options,.refresh,.reply,.reply-all,.forward,.delete,.archive,.markmessage,.more,.save,.attach,.print,.import,.export,.search,.signature,.responses)::before {
  display: block !important; height: 1.75rem !important; width: 20px !important;
  margin: 0 auto !important;
}
/* The original mobile compose rule assigned width:auto to the plus glyph;
   give the SVG a definite box so it remains visible in the drawer and FAB. */
@media (max-width: 600px) {
  html:root body[class].task-mail #taskmenu .action-buttons a.compose::before,
  html:root body[class].task-mail .floating-action-buttons a.button.compose::before,
  html:root body[class].task-addressbook .floating-action-buttons a.button.create::before {
    content: "" !important; display: inline-block !important;
    width: 20px !important; min-width: 20px !important; height: 20px !important;
    flex: 0 0 20px !important; margin: 0 .55rem 0 0 !important;
  }
}
html:root body[class] .header a.button.icon.refresh::before {
  display: block !important; width: 20px !important; height: 1.75rem !important;
  margin: 0 auto !important;
}
html:root body[class] .searchbar form::before {
  content: "" !important; display: inline-block !important;
  width: 20px !important; height: 20px !important;
  margin: 0 .45rem 0 0 !important; color: inherit !important; background: currentColor !important;
  -webkit-mask: url("/static.php/skins/jaautomation/icons/search.svg") center / contain no-repeat;
  mask: url("/static.php/skins/jaautomation/icons/search.svg") center / contain no-repeat;
  font-size: 0 !important;
}
html:root body[class].task-login .input-group-text.icon.user::before {
  --ja-icon: url("/static.php/skins/jaautomation/icons/user.svg");
}
html:root body[class].task-login .input-group-text.icon.pass::before {
  --ja-icon: url("/static.php/skins/jaautomation/icons/lock.svg");
}
html:root body[class].task-login .input-group-text.icon:is(.user,.pass)::before {
  content: "" !important; display: inline-block !important;
  width: 18px !important; height: 18px !important; margin: 0 !important;
  color: inherit !important; background: currentColor !important;
  -webkit-mask: var(--ja-icon) center / contain no-repeat;
  mask: var(--ja-icon) center / contain no-repeat;
  font-size: 0 !important;
}
html:root body[class] #settings-menu li > a::before {
  --ja-icon: url("/static.php/skins/jaautomation/icons/settings.svg");
  content: "" !important; display: inline-block !important;
  width: 18px !important; height: 18px !important; margin-right: .65rem !important;
  color: inherit !important; background: currentColor !important;
  -webkit-mask: var(--ja-icon) center / contain no-repeat;
  mask: var(--ja-icon) center / contain no-repeat;
  font-size: 0 !important;
}
html:root body[class] #settings-menu li.preferences > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/options.svg"); }
html:root body[class] #settings-menu li.folders > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/folder.svg"); }
html:root body[class] #settings-menu li.identities > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/user.svg"); }
html:root body[class] #settings-menu li.responses > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/threads.svg"); }
html:root body[class] #settings-menu li.stalwart-account > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/lock.svg"); }
html:root body[class] #settings-menu li.filter > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/filter.svg"); }
html:root body[class] #settings-menu li.vacation > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/clock.svg"); }
html:root body[class] #settings-menu li.forward > a::before { --ja-icon: url("/static.php/skins/jaautomation/icons/forward.svg"); }
html:root body[class] #directorylist li > a::before {
  content: "" !important; display: inline-block !important;
  width: 18px !important; height: 18px !important; margin-right: .65rem !important;
  color: inherit !important; background: currentColor !important;
  -webkit-mask: url("/static.php/skins/jaautomation/icons/contacts.svg") center / contain no-repeat;
  mask: url("/static.php/skins/jaautomation/icons/contacts.svg") center / contain no-repeat;
  font-size: 0 !important;
}
html:root body[class] #sections-table tr td.section::before {
  --ja-icon: url("/static.php/skins/jaautomation/icons/options.svg");
  content: "" !important; display: inline-block !important;
  width: 18px !important; height: 18px !important; margin-right: .65rem !important;
  color: inherit !important; background: currentColor !important;
  -webkit-mask: var(--ja-icon) center / contain no-repeat;
  mask: var(--ja-icon) center / contain no-repeat;
  font-size: 0 !important;
}
html:root body[class] #sections-table tr.mailbox td.section::before,
html:root body[class] #sections-table tr.mailview td.section::before { --ja-icon: url("/static.php/skins/jaautomation/icons/mail.svg"); }
html:root body[class] #sections-table tr.compose td.section::before { --ja-icon: url("/static.php/skins/jaautomation/icons/compose.svg"); }
html:root body[class] #sections-table tr.addressbook td.section::before { --ja-icon: url("/static.php/skins/jaautomation/icons/contacts.svg"); }
html:root body[class] #sections-table tr.folders td.section::before { --ja-icon: url("/static.php/skins/jaautomation/icons/folder.svg"); }
html:root body[class] #sections-table tr.server td.section::before { --ja-icon: url("/static.php/skins/jaautomation/icons/settings.svg"); }
html:root body[class] #sections-table tr.encryption td.section::before { --ja-icon: url("/static.php/skins/jaautomation/icons/lock.svg"); }
/* Distinguish a contact card from an ordinary file attachment. */
html:root body[class] button.btn.attach.vcard::before {
  --ja-icon: url("/static.php/skins/jaautomation/icons/user.svg");
}
/* Phone navigation uses the same round-stroke treatment on its close control. */
html:root body[class] #layout-menu .popover-header a.cancel::before {
  content: "" !important; display: inline-block !important;
  width: 20px !important; height: 20px !important; margin: 0 !important;
  color: inherit !important; background: currentColor !important;
  -webkit-mask: url("/static.php/skins/jaautomation/icons/close.svg") center / contain no-repeat;
  mask: url("/static.php/skins/jaautomation/icons/close.svg") center / contain no-repeat;
  font-size: 0 !important;
}
