dark_bubble_gum.css

/*! =========================================== *
 * DARK BUBBLE GUM THEME
 * Version: v4.0.0-beta15
 * Author: Cristiano Almeida
 * Website: www.csalmeida.com
 * Twitter: @_csalmeida
 * =========================================== */
:root {
  --main-bg-color: #1C1C1C;
  --secondary-bg-color: #0f0f0f;
  --bgcolor-searchbox-field: #000;
  --bgcolor-spacebar: rgba(255, 255, 255, 0.1);
  --bgcolor-aside-link: rgba(0, 0, 0, 0.3);
  --bgcolor-toolbar: #292929;
  --fillcolor-logo: #f6f7fa;
  --fillcolor-icons: #fff;
  --color-nav-link: #fff;
  --color-nav-active: #EF2D56;
  --color-standard-text: #fff;
  --boxshadow-main: none; }

.pm-button--error, .pm-button--primary, .pm-button--warning, .pm-button-blue {
  color: #fff;
  background-color: #EF2D56;
  border: 1px solid #EF2D56;
  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: #fff;
  box-shadow: 0 0 0.35714em 0 rgba(0, 0, 0, 0.2);
  background: #ed1543;
  border: 1px solid #ed1543; }

.aside-link {
  background: #0f0f0f; }

.aside-link:active .aside-linkIcon, .aside-link:focus .aside-linkIcon, .aside-link:hover .aside-linkIcon, .aside-link[aria-current="true"] .aside-linkIcon {
  fill: #0f0f0f;
  background: none; }

.circle-chart__circle {
  stroke: #EF2D56; }

#global_search.searchbox-field[type="search"] {
  background-color: #000;
  color: #e6eaf0; }

.searchbox-advanced-search-button:active,
.searchbox-advanced-search-button:focus,
.searchbox-advanced-search-button:hover {
  background-color: #1C1C1C; }

.topnav-link, .topnav-link > .topnav-icon {
  color: #fff;
  transition: color .2s ease-in-out; }

.topnav-link:active, .topnav-link:focus,
.topnav-link:hover, .topnav-link[aria-current="true"] {
  color: #EF2D56; }

.topnav-link:active > .topnav-icon, .topnav-link:focus > .topnav-icon,
.topnav-link:hover > .topnav-icon, .topnav-link[aria-current=true] > .topnav-icon {
  color: #EF2D56; }

.protonmail .text-purple {
  color: #1C1C1C !important; }

.protonmail .text-purple:hover {
  color: #d9103b !important; }

#pm_composer .composer .composerHeader-container,
.composerInputMeta-overlay .composerHeader-container {
  background: #292929; }

.conversation.marked::before {
  background: #EF2D56; }

.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(239, 45, 86, 0.1); }

.selectBoxElement-container:hover .item-icon {
  background-color: transparent;
  border: 1px solid #ed1543; }
  .selectBoxElement-container:hover .item-icon .item-icon-fakecheck-icon {
    fill: #ed1543; }

.selectBoxElement-container:hover .item-checkbox:checked + .item-icon {
  background-color: #ed1543;
  border-color: #ed1543; }

.item-checkbox:checked + .item-icon {
  background-color: #EF2D56;
  border-color: #EF2D56; }

.item-checkbox + .item-icon:hover {
  background-color: #ed1543;
  border-color: #ed1543; }

.item-checkbox + .item-icon:hover .item-icon-fakecheck-icon {
  fill: #fff; }

.item-checkbox:checked + .item-icon:hover .item-icon-fakecheck-icon {
  fill: #fff; }

.starbutton {
  fill: #EF2D56 !important;
  opacity: 0.7; }

.starbutton:focus, .starbutton:hover {
  fill: #EF2D56; }

.color-pm-blue {
  color: #EF2D56; }

.pm-radio:checked + .pm-radio-fakeradio::before {
  background: #EF2D56; }

.block-info-standard {
  border-color: #1b68c6; }

.block-info-standard-warning {
  border-color: #ffaa00; }

.block-info-standard-error {
  border-color: #d62646; }

.link, a, .pm-button--link {
  color: #1C1C1C;
  transition: color .2s ease-in-out; }

.link:active, .link:focus, .link:hover,
a:active, a:focus, a:hover,
.pm-button--link:hover {
  color: #d9103b; }

.pm-button--primary {
  background-color: #EF2D56;
  border-color: #EF2D56; }

.pm-button--link, .pm-button.pm-button--link {
  color: #EF2D56; }

.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: #EF2D56;
  border-color: #EF2D56; }

.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: #ed1543;
  border: 1px solid #ed1543; }

.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: #d9103b;
  border-color: #d9103b; }

.pm-button-blueborder {
  box-shadow: none;
  border-color: #1C1C1C;
  color: #1C1C1C;
  transition: color .2s ease-in-out, border-color .2s ease-in-out; }

.pm-button-blueborder:hover {
  box-shadow: none;
  border-color: #d9103b;
  color: #d9103b; }

.is-active.pm-button--primaryborder,
.pm-button--primaryborder:not(div):active,
.pm-button-blueborder.is-active,
.pm-button-blueborder:not(div):active {
  border-color: #d9103b;
  color: #d9103b;
  background: transparent; }

.pm-toggle-checkbox:checked + .pm-toggle-label:before {
  background: #EF2D56;
  border-color: #EF2D56; }

.angular-squire-iframe body a {
  color: #EF2D56; }

.fill-pm-blue,
.message-attachmentIcon .file-outer-icon.is-embedded {
  fill: #EF2D56; }

.pm-table--highlight[data-plan-number="1"] tr th:nth-child(2) {
  border-color: #EF2D56;
  color: #EF2D56; }
  .pm-table--highlight[data-plan-number="1"] tr th:nth-child(2)::before {
    background-color: #EF2D56; }

.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: #EF2D56; }

.pm-simple-table-row-th .fill-primary {
  fill: #EF2D56; }

.pm-checkbox-fakecheck, .pm-radio-fakeradio {
  border-color: #1C1C1C; }
  .pm-checkbox-fakecheck [class*="icon-"], .pm-radio-fakeradio [class*="icon-"] {
    fill: #1C1C1C; }

[class*="icon-"].color-primary {
  color: #1C1C1C; }
  [class*="icon-"].color-primary:hover {
    color: #d9103b; }

.badgeLabel, .badgeLabel-primary {
  border-color: #d9103b; }

.badgeLabel,
.badgeLabel-blue,
.badgeLabel-primary,
.bg-pm-blue {
  background-color: #d9103b; }

.progress-contact {
  color: #EF2D56; }
  .progress-contact::-moz-progress-bar {
    background: #EF2D56; }

.calendar-grid-heading[aria-pressed="true"]
.calendar-grid-heading-number,
.minicalendar-day[aria-pressed="true"],
.minicalendar-day[aria-current="date"]::before,
.calendar-monthgrid-day[aria-pressed="true"] .calendar-monthgrid-day-number {
  background: #c10f34; }

.minicalendar-day[aria-current="date"][aria-pressed="true"]::before {
  background: #EF2D56; }