Merge pull request #59 from ch1r0x/mainHEADmain

Add theme base on Nord colors

5 files changed, 765 insertions, 0 deletions

diff --git a/README.md b/README.md
index db8b5e7..814a16f 100644
--- a/README.md
+++ b/README.md
@@ -102,6 +102,11 @@ Check out some of the available themes you can choose from.
 
 #### [Inbox](themes/inbox)
 ![Screenshot of Inbox theme.](screenshots/inbox.png)
+
+### [Nord](themes/nord)
+![Screenshot of Nord theme.](screenshots/nord.png)
+
+![Screenshot of Nord theme.](screenshots/nord_full.png)
 </details>
 
 ## Quick setup guide
diff --git a/screenshots/nord.png b/screenshots/nord.png
new file mode 100644
index 0000000..4c5cc24
--- /dev/null
+++ b/screenshots/nord.png
diff --git a/screenshots/nord_full.png b/screenshots/nord_full.png
new file mode 100644
index 0000000..9e63ea5
--- /dev/null
+++ b/screenshots/nord_full.png
diff --git a/templates/nord/nord.scss b/templates/nord/nord.scss
new file mode 100644
index 0000000..1a55bfb
--- /dev/null
+++ b/templates/nord/nord.scss
@@ -0,0 +1,25 @@
+@import "../@theme-base/version";
+
+/*! =========================================== *
+ * NORD Theme
+ * Version:  #{$version}
+ * Author:   ch1r0x
+ * Website:  github.com/ch1r0x
+ * Mastodon: @ch1r0x
+ * =========================================== */
+
+$base: #2E3440;
+$search: #3B4252;
+$highlight: #5E81AC;
+$navigation: #E5E9F0;
+
+$text_color: #ECEFF4;
+$extra_color: #88C0D0;
+$danger_color:  #BF616A;
+$warning_color: #D08770;
+$info_color: #A3BE8C;
+
+@import "../@theme-base/styles";
+@import "../@theme-base/dark_mode";
+
+// Please do not remove the imports above, add overrides and other partials below this line.
diff --git a/themes/nord/nord.css b/themes/nord/nord.css
new file mode 100644
index 0000000..fd4db8c
--- /dev/null
+++ b/themes/nord/nord.css
@@ -0,0 +1,735 @@
+/*! =========================================== *
+ * NORD Theme
+ * Version:  v4.0.0-beta.33
+ * Author:   ch1r0x
+ * Website:  github.com/ch1r0x
+ * Mastodon: @ch1r0x
+ * =========================================== */
+:root {
+  --main-bg-color: #2E3440;
+  --secondary-bg-color: #232831;
+  --bgcolor-searchbox-field: #3B4252;
+  --bgcolor-spacebar: rgba(255, 255, 255, 0.1);
+  --bgcolor-aside-link: rgba(0, 0, 0, 0.3);
+  --bgcolor-toolbar: #39404f;
+  --fillcolor-logo: #f6f7fa;
+  --fillcolor-icons: #fff;
+  --color-nav-link: #E5E9F0;
+  --color-nav-active: #5E81AC;
+  --color-standard-text: #fff;
+  --boxshadow-main: none; }
+
+html:not(.editor-squire-iframe) body {
+  background: #2E3440;
+  color: #ECEFF4; }
+
+.pm-button--error, .pm-button--primary, .pm-button--warning, .pm-button-blue {
+  color: #ECEFF4;
+  background-color: #5E81AC;
+  border: 1px solid #5E81AC;
+  transition: color .2s ease-in-out, background-color .2s ease-in-out, border-color .2s ease-in-out; }
+
+.is-hover.pm-button--error, .is-hover.pm-button--primary, .is-hover.pm-button--warning, .pm-button--error:focus, .pm-button--error:focus-within, .pm-button--error:hover, .pm-button--primary:focus, .pm-button--primary:focus-within, .pm-button--primary:hover, .pm-button--warning:focus, .pm-button--warning:focus-within, .pm-button--warning:hover, .pm-button-blue.is-hover, .pm-button-blue:focus, .pm-button-blue:focus-within, .pm-button-blue:hover {
+  color: #E5E9F0;
+  box-shadow: 0 0 0.35714em 0 rgba(0, 0, 0, 0.2);
+  background: #52749f;
+  border: 1px solid #52749f; }
+
+.pm-button--primaryborder-dark, .pm-button-blueborder-dark {
+  background: #2E3440;
+  border-color: #5E81AC;
+  color: #5E81AC; }
+
+.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active {
+  background: #2E3440;
+  border-color: #6f8eb5;
+  color: #6f8eb5; }
+
+.pm-button--primaryborder, .pm-button-blueborder {
+  border-color: #52749f;
+  color: #52749f; }
+
+.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover {
+  border-color: #52749f;
+  color: #52749f; }
+
+.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] {
+  background-color: #e5eaf1;
+  border-color: #6f8eb5;
+  color: #49688e; }
+
+.bg-primary {
+  background-color: #39404f; }
+
+.color-primary {
+  color: #5E81AC; }
+
+.navigation__counterItem {
+  background: #49688e;
+  color: white; }
+
+.item-container-row:hover::before, .item-container:hover::before {
+  border-color: #809bbd; }
+
+.item-checkbox + .item-icon:hover, .item-checkbox:hover + .item-icon {
+  border-color: #b2c3d7; }
+
+.item-checkbox:hover:not(:checked) + .item-icon .item-icon-fakecheck-icon {
+  fill: #49688e; }
+
+.circle-chart__circle {
+  stroke: #5E81AC; }
+
+#dropdown-0 .dropDown-content::after, #dropdown-0 .dropDown-content::before, #dropdown-0.dropDown:not(.dropDown--noCaret)::before,
+#dropdown-0 .dropDown-content {
+  background: #2E3440; }
+
+.dropDown:not(.dropDown--noCaret)::before,
+.dropDown::after,
+.dropDown-logout-initials,
+.dropDown-item-hr {
+  border-color: #39404f !important; }
+
+#global_search.searchbox-field[type="search"] {
+  background-color: #3B4252;
+  color: #ECEFF4; }
+
+.searchbox-advanced-search-button:active,
+.searchbox-advanced-search-button:focus,
+.searchbox-advanced-search-button:hover {
+  background-color: #2E3440; }
+
+.topnav-link, .topnav-link > .topnav-icon {
+  color: #E5E9F0;
+  transition: color .2s ease-in-out; }
+
+.topnav-link:active, .topnav-link:focus,
+.topnav-link:hover, .topnav-link[aria-current="true"] {
+  color: #5E81AC; }
+
+.topnav-link:active > .topnav-icon, .topnav-link:focus > .topnav-icon,
+.topnav-link:hover > .topnav-icon, .topnav-link[aria-current=true] > .topnav-icon {
+  color: #5E81AC; }
+
+.protonmail .text-purple {
+  color: #2E3440 !important; }
+
+.protonmail .text-purple:hover {
+  color: #49688e !important; }
+
+.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover {
+  color: #5E81AC; }
+
+#pm_composer .composer .composerHeader-container,
+.composerInputMeta-overlay .composerHeader-container {
+  background: #39404f; }
+
+#pm_composer .composer .fill {
+  background: #fff; }
+
+.conversation.marked::before {
+  background: #5E81AC; }
+
+.item-container:not(.item-is-selected):not(.item-contact):not(.read):not(.active), .item-container-row:not(.item-is-selected):not(.item-contact):not(.read):not(.active) {
+  background: #fff; }
+
+.item-container.selected, .item-container-row.selected,
+.item-container.active, .item-is-selected {
+  background: rgba(94, 129, 172, 0.1); }
+
+.selectBoxElement-container:hover .item-icon {
+  background-color: transparent;
+  border: 1px solid #52749f; }
+  .selectBoxElement-container:hover .item-icon .item-icon-fakecheck-icon {
+    fill: #52749f; }
+
+.selectBoxElement-container:hover .item-checkbox:checked + .item-icon {
+  background-color: #52749f;
+  border-color: #52749f; }
+
+.item-checkbox:checked + .item-icon {
+  background-color: #5E81AC;
+  border-color: #5E81AC; }
+
+.item-checkbox + .item-icon:hover {
+  background-color: #52749f;
+  border-color: #52749f; }
+
+.item-checkbox + .item-icon:hover .item-icon-fakecheck-icon {
+  fill: #E5E9F0; }
+
+.item-checkbox:checked + .item-icon:hover .item-icon-fakecheck-icon {
+  fill: #E5E9F0; }
+
+.starbutton {
+  fill: #5E81AC !important;
+  opacity: 0.7; }
+
+.starbutton:focus, .starbutton:hover {
+  fill: #5E81AC; }
+
+.autocompleteEmailsItem-icon svg.encryptionIcon {
+  fill: #52749f; }
+
+.encryptionStatus .color-pm-blue svg {
+  color: #52749f;
+  fill: #52749f; }
+
+.encryptionStatus .color-global-grey-dm svg {
+  color: black; }
+
+.color-pm-blue {
+  color: #5E81AC; }
+
+.pm-radio:checked + .pm-radio-fakeradio::before {
+  background: #5E81AC; }
+
+.block-info-standard {
+  border-color: #A3BE8C; }
+
+.block-info-standard-warning {
+  border-color: #D08770; }
+
+.block-info-standard-error {
+  border-color: #BF616A; }
+
+.link, a, .pm-button--link {
+  color: #49688e;
+  transition: color .2s ease-in-out; }
+
+.link:active, .link:focus, .link:hover,
+a:active, a:focus, a:hover,
+.pm-button--link:hover {
+  color: #49688e; }
+
+.pm-button--primary {
+  background-color: #5E81AC;
+  border-color: #5E81AC; }
+
+.pm-button--link, .pm-button.pm-button--link {
+  color: #5E81AC; }
+
+.pm-button--error, .pm-button--error.pm-button--info, .pm-button--error.pm-button--redborder, .pm-button--primary, .pm-button--primary.pm-button--info, .pm-button--primary.pm-button--redborder, .pm-button--warning, .pm-button--warning.pm-button--info, .pm-button--warning.pm-button--redborder, .pm-button-blue, .pm-button-blue.pm-button--info, .pm-button-blue.pm-button--redborder, .pm-button.pm-button--error, .pm-button.pm-button--primary, .pm-button.pm-button--warning, .pm-button.pm-button-blue {
+  background-color: #5E81AC;
+  border-color: #5E81AC; }
+
+.is-hover.pm-button--error, .is-hover.pm-button--error.pm-button--info, .is-hover.pm-button--error.pm-button--redborder, .is-hover.pm-button--primary, .is-hover.pm-button--primary.pm-button--info, .is-hover.pm-button--primary.pm-button--redborder, .is-hover.pm-button--warning, .is-hover.pm-button--warning.pm-button--info, .is-hover.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info:focus, .pm-button--error.pm-button--info:focus-within, .pm-button--error.pm-button--info:hover, .pm-button--error.pm-button--redborder:focus, .pm-button--error.pm-button--redborder:focus-within, .pm-button--error.pm-button--redborder:hover, .pm-button--error:focus, .pm-button--error:focus-within, .pm-button--error:hover, .pm-button--primary.pm-button--info:focus, .pm-button--primary.pm-button--info:focus-within, .pm-button--primary.pm-button--info:hover, .pm-button--primary.pm-button--redborder:focus, .pm-button--primary.pm-button--redborder:focus-within, .pm-button--primary.pm-button--redborder:hover, .pm-button--primary:focus, .pm-button--primary:focus-within, .pm-button--primary:hover, .pm-button--warning.pm-button--info:focus, .pm-button--warning.pm-button--info:focus-within, .pm-button--warning.pm-button--info:hover, .pm-button--warning.pm-button--redborder:focus, .pm-button--warning.pm-button--redborder:focus-within, .pm-button--warning.pm-button--redborder:hover, .pm-button--warning:focus, .pm-button--warning:focus-within, .pm-button--warning:hover, .pm-button-blue.is-hover, .pm-button-blue.is-hover.pm-button--info, .pm-button-blue.is-hover.pm-button--redborder, .pm-button-blue.pm-button--info:focus, .pm-button-blue.pm-button--info:focus-within, .pm-button-blue.pm-button--info:hover, .pm-button-blue.pm-button--redborder:focus, .pm-button-blue.pm-button--redborder:focus-within, .pm-button-blue.pm-button--redborder:hover, .pm-button-blue:focus, .pm-button-blue:focus-within, .pm-button-blue:hover, .pm-button.is-hover.pm-button--error, .pm-button.is-hover.pm-button--primary, .pm-button.is-hover.pm-button--warning, .pm-button.pm-button--error:focus, .pm-button.pm-button--error:focus-within, .pm-button.pm-button--error:hover, .pm-button.pm-button--primary:focus, .pm-button.pm-button--primary:focus-within, .pm-button.pm-button--primary:hover, .pm-button.pm-button--warning:focus, .pm-button.pm-button--warning:focus-within, .pm-button.pm-button--warning:hover, .pm-button.pm-button-blue.is-hover, .pm-button.pm-button-blue:focus, .pm-button.pm-button-blue:focus-within, .pm-button.pm-button-blue:hover {
+  background: #52749f;
+  border: 1px solid #52749f; }
+
+.is-active.pm-button--error, .is-active.pm-button--error.pm-button--info, .is-active.pm-button--error.pm-button--redborder, .is-active.pm-button--primary, .is-active.pm-button--primary.pm-button--info, .is-active.pm-button--primary.pm-button--redborder, .is-active.pm-button--warning, .is-active.pm-button--warning.pm-button--info, .is-active.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info:not(div):active, .pm-button--error.pm-button--redborder:not(div):active, .pm-button--error:not(div):active, .pm-button--primary.pm-button--info:not(div):active, .pm-button--primary.pm-button--redborder:not(div):active, .pm-button--primary:not(div):active, .pm-button--warning.pm-button--info:not(div):active, .pm-button--warning.pm-button--redborder:not(div):active, .pm-button--warning:not(div):active, .pm-button-blue.is-active, .pm-button-blue.is-active.pm-button--info, .pm-button-blue.is-active.pm-button--redborder, .pm-button-blue.pm-button--info:not(div):active, .pm-button-blue.pm-button--redborder:not(div):active, .pm-button-blue:not(div):active, .pm-button.is-active.pm-button--error, .pm-button.is-active.pm-button--primary, .pm-button.is-active.pm-button--warning, .pm-button.pm-button--error:not(div):active, .pm-button.pm-button--primary:not(div):active, .pm-button.pm-button--warning:not(div):active, .pm-button.pm-button-blue.is-active, .pm-button.pm-button-blue:not(div):active {
+  background: #49688e;
+  border-color: #49688e; }
+
+.pm-button-blueborder {
+  box-shadow: none;
+  border-color: #2E3440;
+  color: #2E3440;
+  transition: color .2s ease-in-out, border-color .2s ease-in-out; }
+
+.pm-button-blueborder:hover {
+  box-shadow: none;
+  border-color: #49688e;
+  color: #49688e; }
+
+.is-active.pm-button--primaryborder,
+.pm-button--primaryborder:not(div):active,
+.pm-button-blueborder.is-active,
+.pm-button-blueborder:not(div):active {
+  border-color: #49688e;
+  color: #49688e;
+  background: transparent; }
+
+.pm-group-buttons > .pm-group-button.pm-button--primary {
+  border-color: #49688e; }
+
+.bg-pm-blue-gradient .pm-button--transparent:hover {
+  color: #ECEFF4;
+  border-color: #ECEFF4; }
+
+.pm-toggle-checkbox:checked + .pm-toggle-label:before {
+  background: #5E81AC;
+  border-color: #5E81AC; }
+
+.composer-title-bar {
+  background: #2E3440; }
+
+.color-global-light {
+  color: #ECEFF4; }
+
+.angular-squire-iframe body a {
+  color: #5E81AC; }
+
+.fill-pm-blue,
+.message-attachmentIcon .file-outer-icon.is-embedded {
+  fill: #5E81AC; }
+
+.pm-table--highlight[data-plan-number="1"] tr th:nth-child(2) {
+  border-color: #5E81AC;
+  color: #5E81AC; }
+  .pm-table--highlight[data-plan-number="1"] tr th:nth-child(2)::before {
+    background-color: #5E81AC; }
+
+.pm-table--highlight[data-plan-number="1"] tr td:nth-child(2),
+.pm-table--highlight[data-plan-number="1"] tr th:nth-child(2),
+.pm-table--highlight[data-plan-number="1"] tr:last-child td:nth-child(2) {
+  border-color: #5E81AC; }
+
+.pm-simple-table-row-th .fill-primary {
+  fill: #5E81AC; }
+
+.pm-checkbox-fakecheck, .pm-radio-fakeradio {
+  border-color: #2E3440; }
+  .pm-checkbox-fakecheck [class*="icon-"], .pm-radio-fakeradio [class*="icon-"] {
+    fill: #5E81AC; }
+
+[class*="icon-"].color-primary {
+  color: #2E3440; }
+  [class*="icon-"].color-primary:hover {
+    color: #49688e; }
+
+.pm-field, .editor,
+.editor-toolbar,
+.border-bottom,
+.border-top,
+.message-container.is-opened > .message-header {
+  border-color: #191c22; }
+
+.badgeLabel, .badgeLabel-primary {
+  border-color: #49688e; }
+
+.badgeLabel,
+.badgeLabel-blue,
+.badgeLabel-primary,
+.bg-pm-blue {
+  background-color: #49688e; }
+
+body {
+  scrollbar-color: #434c5e #323946; }
+
+::-webkit-scrollbar {
+  width: 16px; }
+  ::-webkit-scrollbar-track {
+    background: #323946; }
+  ::-webkit-scrollbar-thumb {
+    background: #434c5e;
+    box-shadow: inset 0 0 0 4px #323946;
+    border-radius: 16px; }
+
+.isDarkMode .bordered,
+.isDarkMode .bordered-container:not([class*="composerInputMeta-"]),
+.isDarkMode .breadcrumb-container {
+  border-color: #434c5e; }
+
+.isDarkMode .dropDown-content::after, .isDarkMode .dropDown-content::before,
+.isDarkMode .dropDown:not(.dropDown--noCaret)::before,
+.isDarkMode .dropDown-content {
+  background: #2E3440;
+  border: #2E3440; }
+
+.isDarkMode .dropDown-item-button:focus, .isDarkMode .dropDown-item-button:focus-within,
+.isDarkMode .dropDown-item-button:hover, .isDarkMode .dropDown-item-link:focus,
+.isDarkMode .dropDown-item-link:focus-within, .isDarkMode .dropDown-item-link:hover {
+  background-color: #232831; }
+
+.isDarkMode .dropDown-item-button.is-disabled, .isDarkMode .dropDown-item-button[disabled],
+.isDarkMode .dropDown-item-link.is-disabled, .isDarkMode .dropDown-item-link[disabled] {
+  background-color: #2a2f3a; }
+
+.isDarkMode .squireToolbar-select-list {
+  background: #2E3440;
+  color: #ECEFF4; }
+
+.isDarkMode .squireToolbar-dropdown-divider {
+  background-color: #434c5e; }
+
+.isDarkMode .squireToolbar-select-item:hover {
+  background: #2a2f3a; }
+
+.isDarkMode #pm_composer .composer,
+.isDarkMode .composerInputMeta-overlay {
+  background: #2E3440; }
+
+.isDarkMode #pm_composer .composer .fill {
+  background: #2E3440; }
+
+.isDarkMode .composer-body-container textarea {
+  background: #2E3440; }
+
+.isDarkMode .composer-addresses-item {
+  background: #232831; }
+
+.isDarkMode .composer-addresses-autocomplete ul {
+  background: #232831; }
+
+.isDarkMode .composer-addresses-autocomplete li[aria-selected="true"],
+.isDarkMode .composer-addresses-autocomplete li:hover {
+  background: #2E3440; }
+
+.isDarkMode .autocompleteEmails-item {
+  background-color: #2a2f3a;
+  border-color: #2a2f3a; }
+
+.isDarkMode .autocompleteEmails-label {
+  border-left: 1px solid #434c5e;
+  border-right: 1px solid #434c5e; }
+
+.isDarkMode .composerOptions-container.show {
+  background: #2a2f3a; }
+  .isDarkMode .composerOptions-container.show .shadow-container {
+    background: #2E3440;
+    color: #ECEFF4; }
+
+.isDarkMode .pm-button.pm-button--primary {
+  background: #49688e;
+  color: #ECEFF4;
+  border-color: #49688e; }
+
+.isDarkMode .pm-button.pm-button--primary:hover {
+  background: #5E81AC;
+  color: #ECEFF4; }
+
+.isDarkMode .is-disabled.pm-button--error, .isDarkMode .is-disabled.pm-button--error.pm-button--info, .isDarkMode .is-disabled.pm-button--error.pm-button--redborder, .isDarkMode .is-disabled.pm-button--primary, .isDarkMode .is-disabled.pm-button--primary.pm-button--info, .isDarkMode .is-disabled.pm-button--primary.pm-button--redborder, .isDarkMode .is-disabled.pm-button--warning, .isDarkMode .is-disabled.pm-button--warning.pm-button--info, .isDarkMode .is-disabled.pm-button--warning.pm-button--redborder, .isDarkMode .pm-button--error.pm-button--info[disabled], .isDarkMode .pm-button--error.pm-button--redborder[disabled], .isDarkMode .pm-button--error[disabled], .isDarkMode .pm-button--primary.pm-button--info[disabled], .isDarkMode .pm-button--primary.pm-button--redborder[disabled], .isDarkMode .pm-button--primary[disabled], .isDarkMode .pm-button--warning.pm-button--info[disabled], .isDarkMode .pm-button--warning.pm-button--redborder[disabled], .isDarkMode .pm-button--warning[disabled], .isDarkMode .pm-button-blue.is-disabled, .isDarkMode .pm-button-blue.is-disabled.pm-button--info, .isDarkMode .pm-button-blue.is-disabled.pm-button--redborder, .isDarkMode .pm-button-blue.pm-button--info[disabled], .isDarkMode .pm-button-blue.pm-button--redborder[disabled], .isDarkMode .pm-button-blue[disabled], .isDarkMode .pm-button.is-disabled.pm-button--error, .isDarkMode .pm-button.is-disabled.pm-button--primary, .isDarkMode .pm-button.is-disabled.pm-button--warning, .isDarkMode .pm-button.pm-button--error[disabled], .isDarkMode .pm-button.pm-button--primary[disabled], .isDarkMode .pm-button.pm-button--warning[disabled], .isDarkMode .pm-button.pm-button-blue.is-disabled, .isDarkMode .pm-button.pm-button-blue[disabled] {
+  background-color: #2a2f3a;
+  border-color: #434c5e;
+  color: #ccd4e1; }
+
+.isDarkMode .pm-button:not(.pm-button-blue):not(.pv-button-green):not(.pm-button--primary):not(.pm-button--primaryborderEvenInDarkMode):not(.pm-button--link):not(.pm-button--error):not(.pm-button--warning):not(.pm-button--redborder):not(.pm-button--primaryborder), .isDarkMode .pm-button--info {
+  color: #ECEFF4;
+  background-color: #2E3440;
+  border-color: #434c5e; }
+
+.isDarkMode .pm-group-buttons > .pm-group-button.pm-button--primary {
+  border-color: #434c5e; }
+
+.isDarkMode .pm-button-blueborder {
+  border-color: #5E81AC;
+  color: #5E81AC; }
+
+.isDarkMode .pm-button-blueborder:hover {
+  border-color: #6f8eb5;
+  color: #6f8eb5; }
+
+.isDarkMode [class*="squireToolbar-row"] .squireToolbar-action-mode:active, .isDarkMode [class*="squireToolbar-row"] .squireToolbar-action-mode:hover, .isDarkMode [class*="squireToolbar-row"] [class*="squireToolbar-action-"]:active, .isDarkMode [class*="squireToolbar-row"] [class*="squireToolbar-action-"]:hover {
+  background: #323946 !important; }
+
+.isDarkMode .squireToolbar-separator {
+  background: #39404f; }
+
+.isDarkMode .composerTime-container,
+.isDarkMode [class*="composer-field"] {
+  color: #ECEFF4; }
+
+.isDarkMode .composerInputMeta-overlay-fakefield {
+  border-color: #ECEFF4; }
+
+.isDarkMode .encryptionStatus .color-global-grey-dm:not(.color-pm-blue) svg {
+  color: white; }
+
+.isDarkMode .conversation {
+  border-color: #434c5e; }
+
+.isDarkMode .main-area,
+.isDarkMode .main-area--noHeader,
+.isDarkMode .main-area--withToolbar,
+.isDarkMode .main-area--withToolbar--noHeader,
+.isDarkMode [class*="block-info-"] {
+  color: #ECEFF4; }
+
+.isDarkMode [class*="block-info"] {
+  background-color: #434c5e;
+  color: #ECEFF4; }
+
+.isDarkMode .fill-global-grey {
+  fill: #5E81AC; }
+
+.isDarkMode .starbutton {
+  fill: #88C0D0; }
+
+.isDarkMode .bg-global-light, .isDarkMode kbd {
+  background: #2E3440; }
+
+.isDarkMode .item-container, .isDarkMode .item-container-row, .isDarkMode .contactsummary-container {
+  background: #2E3440; }
+
+.isDarkMode .items-column-list-inner, .isDarkMode .ReactVirtualized__Grid__innerScrollContainer {
+  border-color: #434c5e; }
+  .isDarkMode .items-column-list-inner .item-container, .isDarkMode .items-column-list-inner .item-container-row, .isDarkMode .ReactVirtualized__Grid__innerScrollContainer .item-container, .isDarkMode .ReactVirtualized__Grid__innerScrollContainer .item-container-row {
+    border-color: #434c5e; }
+
+.isDarkMode .item-container:not(.item-is-selected):not(.read):not(.active),
+.isDarkMode .item-container:not(.item-is-selected):not(.item-contact):not(.read):not(.active),
+.isDarkMode .item-container-row:not(.item-is-selected):not(.item-contact):not(.read):not(.active), .isDarkMode .squireToolbar-container {
+  background: #39404f; }
+
+.isDarkMode .item-container.active, .isDarkMode .item-is-selected {
+  background: #2a2f3a; }
+  .isDarkMode .item-container.active .flex-item-fluid, .isDarkMode .item-is-selected .flex-item-fluid {
+    color: #5E81AC; }
+
+.isDarkMode .item-icon {
+  background-color: #2E3440;
+  border: 1px solid #dce1eb; }
+
+.isDarkMode .selectBoxElement-container:hover .item-icon {
+  background-color: #2E3440;
+  border: 1px solid #52749f; }
+  .isDarkMode .selectBoxElement-container:hover .item-icon .item-icon-fakecheck-icon {
+    fill: #52749f; }
+
+.isDarkMode .selectBoxElement-container {
+  color: #ECEFF4; }
+
+.isDarkMode .selectBoxElement-container:hover .item-checkbox:checked + .item-icon {
+  background-color: #52749f;
+  border-color: #52749f; }
+
+.isDarkMode .item-checkbox + .item-icon:hover,
+.isDarkMode .item-checkbox:hover + .item-icon {
+  background-color: #232831; }
+
+.isDarkMode .items-column-list,
+.isDarkMode .elementList-container-row {
+  background-color: #2E3440; }
+
+.isDarkMode .composer-container {
+  background: #39404f; }
+
+.isDarkMode .message-header {
+  background-color: #39404f; }
+
+.isDarkMode .view-column-detail {
+  background-color: #2E3440; }
+
+.isDarkMode details:first-child {
+  border-color: #434c5e; }
+
+.isDarkMode .items-column-list,
+.isDarkMode .message-container,
+.isDarkMode .message-attachments {
+  border-color: #434c5e; }
+
+.isDarkMode .message-container:not(.sent):not(.draft) .message-header.message-summary::before,
+.isDarkMode .message-header.is-inbound::before {
+  border-top: 1px solid #434c5e;
+  border-left: 1px solid #434c5e;
+  background-color: #39404f; }
+
+.isDarkMode .message-infobox {
+  background-color: #2E3440; }
+
+.isDarkMode .message-content.frame.message-frame {
+  background: white;
+  color: black; }
+
+.isDarkMode .block-info-standard, .isDarkMode .bodyDecrypted blockquote {
+  border-color: #5E81AC; }
+
+.isDarkMode .squireDropdown-item-label {
+  color: #ECEFF4; }
+
+.isDarkMode .squireToolbar-action-color {
+  background: transparent; }
+
+.isDarkMode .angular-squire-iframe body {
+  color: #ECEFF4;
+  background: #39404f; }
+  .isDarkMode .angular-squire-iframe body a {
+    color: #5E81AC; }
+
+.isDarkMode .plaintext-editor {
+  color: #ECEFF4; }
+
+.isDarkMode .pm-button, .isDarkMode .pm-button--info, .isDarkMode .pm-button--redborder {
+  background: #2E3440;
+  border-color: #434c5e;
+  color: #ECEFF4; }
+
+.isDarkMode .message-attachmentInfo {
+  border-color: #434c5e; }
+
+.isDarkMode .is-hover.pm-button--info, .isDarkMode .is-hover.pm-button--redborder,
+.isDarkMode .pm-button--info:focus, .isDarkMode .pm-button--info:focus-within,
+.isDarkMode .pm-button--info:hover, .isDarkMode .pm-button--redborder:focus,
+.isDarkMode .pm-button--redborder:focus-within, .isDarkMode .pm-button--redborder:hover,
+.isDarkMode .pm-button.is-hover, .isDarkMode .pm-button:focus-within,
+.isDarkMode .pm-button:hover:not(.pm-button--primary) {
+  color: #5E81AC; }
+
+.isDarkMode .pm-button:focus {
+  color: #ECEFF4; }
+
+.isDarkMode .is-disabled.pm-button--info,
+.isDarkMode .is-disabled.pm-button--redborder,
+.isDarkMode .pm-button--info[disabled],
+.isDarkMode .pm-button--redborder[disabled],
+.isDarkMode .pm-button.is-disabled,
+.isDarkMode .pm-button[disabled] {
+  background: #434c5e; }
+
+.isDarkMode .is-active.pm-button--info,
+.isDarkMode .is-active.pm-button--redborder,
+.isDarkMode .pm-button--info:not(div):active,
+.isDarkMode .pm-button--redborder:not(div):active,
+.isDarkMode .pm-button.is-active, .isDarkMode .pm-button:not(div):active {
+  background: #434c5e;
+  color: #5E81AC; }
+
+.isDarkMode .dropDown-content {
+  background: #2E3440;
+  color: #ECEFF4; }
+  .isDarkMode .dropDown-content button {
+    color: #ECEFF4; }
+  .isDarkMode .dropDown-content .elementsSelector-btn-action,
+  .isDarkMode .dropDown-content .dropDown-item:hover {
+    color: #ECEFF4; }
+  .isDarkMode .dropDown-content .dropDown-item:hover {
+    background: #39404f !important; }
+  .isDarkMode .dropDown-content .dropDown-item + .dropDown-item {
+    border-top: 1px solid #434c5e; }
+  .isDarkMode .dropDown-content .dropDown-item .color-global-grey {
+    color: #ECEFF4; }
+
+.isDarkMode .dropDown .dropDown-content::before, .isDarkMode .dropDown .dropDown-content::after {
+  border-bottom-color: #2E3440; }
+
+.isDarkMode .dropDown--right-bottom::before {
+  border-right-color: #2E3440; }
+
+.isDarkMode .dropDown--right-bottom .dropDown-content::before, .isDarkMode .dropDown--right-bottom .dropDown-content::after {
+  background: #2E3440; }
+
+.isDarkMode .dropDown--bottom-right .dropDown-content::before, .isDarkMode .dropDown--bottom-right .dropDown-content::after {
+  background: #2E3440; }
+
+.isDarkMode .dropDown--bottom-left::before,
+.isDarkMode .dropDown--bottom-right::before,
+.isDarkMode .dropDown--bottom::before {
+  border-bottom-color: #434c5e; }
+
+.isDarkMode .dropDown--bottom-right {
+  border: 1px solid #434c5e; }
+
+.isDarkMode .pm-field-icon-container[type="search"], .isDarkMode .pm-field[type="search"] {
+  background-color: #39404f; }
+
+.isDarkMode .dropDown-contentInner {
+  background-color: #2E3440; }
+  .isDarkMode .dropDown-contentInner::before, .isDarkMode .dropDown-contentInner::after {
+    background-color: #2E3440; }
+  .isDarkMode .dropDown-contentInner .dropDown-item span {
+    color: #ECEFF4 !important; }
+
+.isDarkMode .searchbox-field[type="search"]:not(#global_search) {
+  background: #ECEFF4;
+  color: #2E3440; }
+
+.isDarkMode .link:active, .isDarkMode .link:focus, .isDarkMode .link:hover,
+.isDarkMode a:active, .isDarkMode a:focus, .isDarkMode a:hover,
+.isDarkMode .pm-button--link:hover,
+.isDarkMode .composerInputMeta-label:hover {
+  color: #6f8eb5; }
+
+.isDarkMode .pm-modal, .isDarkMode .pm-modalContentInner {
+  background-color: #2E3440;
+  color: #ECEFF4; }
+  .isDarkMode .pm-modal::before, .isDarkMode .pm-modal::after, .isDarkMode .pm-modalContentInner::before, .isDarkMode .pm-modalContentInner::after {
+    background-color: #2E3440; }
+  .isDarkMode .pm-modal .labelColorSelector-item-mask, .isDarkMode .pm-modalContentInner .labelColorSelector-item-mask {
+    border: 2px solid #4e586d; }
+
+.isDarkMode .pm-button--primaryborder, .isDarkMode .pm-button-blueborder {
+  border-color: #5E81AC;
+  color: #5E81AC;
+  background-color: #39404f;
+  transition: background-color .2s ease-in-out; }
+
+.isDarkMode .is-hover.pm-button--primaryborder, .isDarkMode .pm-button--primaryborder:focus,
+.isDarkMode .pm-button--primaryborder:focus-within, .isDarkMode .pm-button--primaryborder:hover,
+.isDarkMode .pm-button-blueborder.is-hover, .isDarkMode .pm-button-blueborder:focus,
+.isDarkMode .pm-button-blueborder:focus-within, .isDarkMode .pm-button-blueborder:hover {
+  border-color: #5E81AC;
+  color: #5E81AC;
+  background-color: #2c323d; }
+
+.isDarkMode .scrollshadow-static {
+  background: #2E3440; }
+
+.isDarkMode .pm-field, .isDarkMode .pm-field-icon-container,
+.isDarkMode .focus.pm-field-icon-container, .isDarkMode .pm-field-icon-container:focus,
+.isDarkMode .pm-field-icon-container:focus-within, .isDarkMode .pm-field.focus,
+.isDarkMode .pm-field:focus, .isDarkMode .pm-field:focus-within,
+.isDarkMode .composerInputMeta-overlay-fakefield,
+.isDarkMode .composerInputMeta-autocomplete {
+  color: #ECEFF4;
+  background-color: #39404f; }
+  .isDarkMode .pm-field::placeholder, .isDarkMode .pm-field-icon-container::placeholder,
+  .isDarkMode .focus.pm-field-icon-container::placeholder, .isDarkMode .pm-field-icon-container:focus::placeholder,
+  .isDarkMode .pm-field-icon-container:focus-within::placeholder, .isDarkMode .pm-field.focus::placeholder,
+  .isDarkMode .pm-field:focus::placeholder, .isDarkMode .pm-field:focus-within::placeholder,
+  .isDarkMode .composerInputMeta-overlay-fakefield::placeholder,
+  .isDarkMode .composerInputMeta-autocomplete::placeholder {
+    color: #dce1eb; }
+
+.isDarkMode .composerInputMeta-autocomplete input {
+  color: #ECEFF4;
+  background-color: #39404f; }
+  .isDarkMode .composerInputMeta-autocomplete input::placeholder {
+    color: #dce1eb; }
+
+.isDarkMode select.pm-field, .isDarkMode select.pm-field-icon-container {
+  background-color: #39404f;
+  color: #ECEFF4; }
+
+.isDarkMode .storageProgress-content.dropDown-content--rightbottom::before {
+  border-right-color: #2E3440; }
+
+.isDarkMode .sticky-title {
+  background: #323946; }
+
+.isDarkMode .bg-global-highlight {
+  background-color: #2E3440; }
+
+.isDarkMode .bg-white-dm {
+  background-color: #39404f; }
+
+.isDarkMode .main-area, .isDarkMode .main-area--noHeader,
+.isDarkMode .main-area--withToolbar,
+.isDarkMode .main-area--withToolbar--noHeader,
+.isDarkMode [class*="block-info-"] {
+  color: #ECEFF4; }
+
+.isDarkMode .main-area, .isDarkMode .main-area--noHeader,
+.isDarkMode .main-area--withToolbar, .isDarkMode .main-area--withToolbar--noHeader {
+  background: #2E3440; }
+
+.isDarkMode .context-bar {
+  background: #2E3440; }
+
+.isDarkMode .subnav {
+  background: #39404f; }
+  .isDarkMode .subnav .link, .isDarkMode .subnav a {
+    color: #5E81AC; }
+  .isDarkMode .subnav .link:active, .isDarkMode .subnav .link:focus, .isDarkMode .subnav .link:hover, .isDarkMode .subnav a:active, .isDarkMode .subnav a:focus, .isDarkMode .subnav a:hover {
+    color: #6f8eb5; }
+
+.isDarkMode .pm-toggle-label {
+  border-color: #434c5e;
+  background: #39404f; }
+  .isDarkMode .pm-toggle-label::before {
+    background: #2E3440; }
+  .isDarkMode .pm-toggle-label .pm-toggle-label-img {
+    fill: #ECEFF4; }
+
+.isDarkMode .pm-plans-table-row--highlighted {
+  background-color: #2E3440; }
+
+.isDarkMode .pm-checkbox-fakecheck,
+.isDarkMode .pm-radio-fakeradio {
+  background: transparent; }
+
+.isDarkMode [class*="icon-"].color-primary {
+  color: #5E81AC; }
+
+.isDarkMode .color-global-grey-dm {
+  color: #5E81AC; }