Toggl Dark by bim0319

/* ==UserStyle==
@name        Toggl Dark
@namespace   tplk
@version     2.1.0
@license     MIT
@author      Dmitry Teplov <tplk@itplk.ru> (https://itplk.ru)
@homepageURL https://github.com/tplk/toggl-dark-theme#readme
@supportURL  https://github.com/tplk/toggl-dark-theme/issues
@updateURL   https://raw.githubusercontent.com/tplk/toggl-dark-theme/master/toggl-dark-theme.user.css
==/UserStyle== */

@-moz-document url("https://www.toggl.com/app/timer"), url("https://toggl.com/app/timer") {
  .TimerContainer__timerContainer {
    background: #323232;
  }

  .TimerContainer__timerContainer > .css-1u4qrnw {
    background: #323232;
  }

  .TimerForm__discardTimeEntry {
    border-left: 1px solid #757575;
  }

  .DayListItem__linkButton:not([disabled]):hover {
    color: #c2aba3;
  }

  body {
    color: #949194;
  }

  body.offline-capable-page {
    background-color: #323232;
  }

  .snowball::-webkit-scrollbar-thumb:vertical,
  .snowball ::-webkit-scrollbar-thumb:vertical {
    box-shadow: inset 3px 0 #323232;
  }

  .Tooltip__body {
    background-color: #4a4a4a;
    color: #fff;
    border: 1px solid #7b7b7b;
  }

  [class*="Header-block-NewTimeEntry-NewTimeEntry-breakpoint"],
  .TimerForm__newTimeEntry,
  .TimeEntryForm__newTimeEntry {
    background: #383838;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.39);
  }

  .MenuPopdown__items {
    background-color: #383838;
    box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.28);
    border: 1px solid rgba(0, 0, 0, 0.47);
  }

  a {
    color: #cecece;
  }

  .MenuPopdown__items a:focus,
  .MenuPopdown__items a:hover {
    color: #e2e2e2;
    background-color: #545454;
  }

  .MenuPopdown__items a.MenuPopdown__selected {
    background-color: #266500;
    color: #f7f7f7;
  }

  .Popdown__popdownContent.Popdown__externalArrow > ::after {
    background-color: #383838;
    border-left: 1px solid rgba(0, 0, 0, 0.47);
    border-top: 1px solid rgba(0, 0, 0, 0.47);
  }

  .DateTimeDurationPopdown__popdown {
    width: 370px;
    border-top: 1px solid #000;
    border-radius: 0 0 3px 3px;
    box-shadow: 0 2px 8px 0 rgb(0, 0, 0);
    background: #383838;
  }

  input[type="date"],
  input[type="datetime"],
  input[type="email"],
  input[type="number"],
  input[type="password"],
  input[type="search"],
  input[type="tel"],
  input[type="tet"],
  input[type="time"],
  input[type="url"],
  select:not(.default),
  textarea {
    background-color: #323232;
    -webkit-box-shadow: 0 1px 3px rgb(99, 99, 99);
    -moz-box-shadow: 0 1px 3px rgb(99, 99, 99);
    box-shadow: 0 1px 3px rgb(99, 99, 99);
    color: #979797;
  }

  .Cal__Header__root {
    background-color: #383838 !important;
  }

  .Cal__Header__date {
    color: #cecece;
  }

  .DateTimeDurationPopdown__time {
    border-bottom: 1px solid #545454 !important;
  }

  .Cal__Container__root {
    color: #979797 !important;
  }

  .Cal__Weekdays__root {
    color: #cecece !important;
    background-color: #383838 !important;
  }

  .Cal__Day__root.Cal__Day__selected .Cal__Day__selection {
    background-color: rgba(75, 200, 0, 0.28) !important;
    color: #5bf300 !important;
  }

  .Cal__Day__root.Cal__Day__enabled.Cal__Day__highlighted::before,
  .Cal__Day__root.Cal__Day__enabled:active::before,
  .Cal__Day__root.Cal__Day__enabled:hover::before {
    background-color: #717171;
    border: 1px solid #000 !important;
  }

  .Cal__Month__row li,
  .Cal__Month__row:first-child li {
    border-bottom: 1px solid #545454;
    background-color: #383838;
  }

  .Toggl .Cal__Month__row li {
    border-bottom: 1px solid #545454;
  }

  .Cal__Month__row.Cal__Month__partial:first-child li:first-child {
    border-left: 1px solid #545454;
  }

  .Cal__Today__root {
    color: #bcbcbc !important;
    background-color: #383838 !important;
    border-bottom: 1px solid #000;
  }

  .Cal__Day__root.Cal__Day__today::before {
    background-color: #5b5b5b;
  }

  .Cal__Day__root.Cal__Day__today > span {
    color: #cbcbcb;
  }

  .ListItem__item:hover,
  [class*="Inner-innerNestedBlock-TimerItem"]:hover {
    background-color: #383838;
  }

  .css-1kwutze,
  .css-1trqy87,
  .css-1hkcm8a,
  .css-r8wp6n,
  .css-1rcwj86,
  .css-14zyegw,
  .css-kn7lze,
  [class*="Controls-DayListControls"],
  [class*="Inner-innerNestedBlock-TimerItem"],
  .ListItem__item,
  .ListItem__item.ListItem__isSubEntry {
    background-color: #323232;
    box-shadow: inset 0 -1px 0 0 rgb(70, 70, 70);
  }

  [class*="ListTitle-title"],
  [class*="TotalTimeCounter-title"],
  [class*="Item-item-TimerItem"]:hover,
  .css-15480s6,
  .css-14nti3f {
    color: #737373;
  }

  .TagsResponsiveDisplay__tag {
    border: 1px solid #616161;
    background-color: #464646;
    color: #b3b3b3;
  }

  .Projects__container.Projects__open .Projects__addProject,
  .Projects__container.Projects__open .Projects__selectedProject,
  .Projects__hoverable:focus .Projects__addProject {
    background-color: #464646;
  }

  .Projects__hoverable:hover {
    color: #d3d8de;
  }

  .ProjectsPopdown__popdown {
    border-top: 1px solid #525252;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.35);
    background: #383838;
  }

  input.ProjectsPopdown__filter {
    border: 1px solid #2b2b2b;
  }

  a,
  a:hover {
    color: #d8d8d8;
  }

  .WorkspaceSelector__container {
    border-bottom: 1px solid #525252;
  }

  .CreateNewProject__newProject {
    border-top: 1px solid #525252;
  }

  .WorkspaceSelector__workspaceList {
    background-color: #383838;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.35);
    border-left: 1px solid #484848;
  }

  .Workspace__container.Workspace__focused,
  .Workspace__container:hover {
    background-color: rgba(255, 255, 255, 0.05);
  }

  .Project__container.Project__focused {
    background-color: rgba(255, 255, 255, 0.05);
    outline: 0;
  }

  .Task__container {
    color: #a39f9f;
    background-color: #383838;
  }

  .Task__container.Task__focused,
  .Task__container:hover {
    color: #c8c8c8;
    background-color: #525252;
  }

  .ProjectsList__cellProjectOpen {
    box-shadow: inset 0 -1px 0 0 #525252;
  }

  .DayListItem__container {
    background-color: #3a3a3a;
    box-shadow: inset 0 -1px 0 0 #4c4c4c;
  }

  .Projects__hoverable:focus .Projects__selectedProject {
    background-color: #434e3b;
  }

  .Tags__container:focus .Tags__tag {
    box-shadow: 0 0 0 6px #434e3b, 9px 0 0 6px #434e3b, 18px 0 0 6px #434e3b,
      27px 0 0 6px #434e3b;
  }

  .Tags__open .Tags__tag {
    box-shadow: 0 0 0 6px #57654e, 9px 0 0 6px #57654e, 18px 0 0 6px #57654e,
      27px 0 0 6px #57654e;
  }

  .TimeEntryProject__createProject.TimeEntryProject__open > span,
  .TimeEntryProject__createProject:focus > span,
  .TimeEntryProject__trigger.TimeEntryProject__open
    .TimeEntryProject__itemSelected,
  .TimeEntryProject__trigger.TimeEntryProject__open
    .TimeEntryProject__noItemSelected,
  .TimeEntryProject__trigger:focus .TimeEntryProject__itemSelected,
  .TimeEntryProject__trigger:focus .TimeEntryProject__noItemSelected {
    background-color: #57654e;
  }

  .TimeEntryAutocompletePopdown__popdown {
    border-top: 1px solid #464646;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.49);
    background: #323232;
  }

  .TimeEntryAutocompletePopdownItem__item.TimeEntryAutocompletePopdownItem__autoSelect
    .TimeEntryAutocompletePopdownItem__container,
  .TimeEntryAutocompletePopdownItem__item:focus
    .TimeEntryAutocompletePopdownItem__container,
  .TimeEntryAutocompletePopdownItem__item:hover
    .TimeEntryAutocompletePopdownItem__container {
    background-color: #464646;
  }

  .TagsPopdown__popdown {
    border-top: 1px solid #b1afaf;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.36);
    background: #323232;
  }

  .TagsPopdown__items a {
    border: 1px solid #676767;
    background-color: rgba(0, 0, 0, 0);
    color: #a3a3a3;
  }

  .TagsPopdown__items a:focus,
  .TagsPopdown__items a:hover {
    border-color: #b9b9b9;
    background-color: #505050;
    color: #bdbdbd;
  }

  .TagsPopdown__items a.TagsPopdown__selected {
    border-color: #a2c78d;
    background-color: #607356;
    color: #d4f7c6;
  }

  .TagsPopdown__items a.TagsPopdown__selected:focus,
  .TagsPopdown__items a.TagsPopdown__selected:hover {
    border-color: #fff;
    background-color: #6b9258;
    color: #d8ffc8;
  }

  .BillableSwitch__billable:focus
    .BillableSwitch__billableIcon:not(.BillableSwitch__disabled) {
    background-color: #57654e;
  }

  .TimeEntryTags__trigger.TimeEntryTags__open .TimeEntryTags__triggerIcon,
  .TimeEntryTags__trigger:focus .TimeEntryTags__triggerIcon {
    background-color: #57654e;
  }

  input.TagsPopdown__filter {
    border: 1px solid #676767;
  }

  .NavigationContainer__outerBox {
    box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.68);
  }

  .GroupedEntryCounter__subCount span {
    border: 1px solid #757575;
  }

  .ProfileMenu__content {
    background-color: #323232;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.45);
    border: 1px solid rgba(0, 0, 0, 0.41);
  }

  .ProfileMenu__items {
    background-color: #323232;
  }

  .ProfileMenu__items a:focus,
  .ProfileMenu__items a:hover {
    background-color: #464646;
  }

  .ProfileMenu__items a:not(.ProfileMenu__selected):focus,
  .ProfileMenu__items a:not(.ProfileMenu__selected):hover {
    color: #d8d8d8;
  }

  .ProfileMenu__items a.ProfileMenu__selected {
    background-color: rgba(75, 200, 0, 0.12);
    color: #d8d8d8;
  }

  .TimerModeSelector__mode {
    border-left: 1px solid #757575;
  }

  .Popdown__popdownDivider {
    background-color: #464646;
  }

  .ChartSelector__trigger {
    background-image: -webkit-gradient(
      linear,
      left top,
      right top,
      from(rgba(250, 251, 252, 0)),
      color-stop(10%, rgba(250, 251, 252, 0)),
      color-stop(85%, rgba(250, 251, 252, 0)),
      to(rgba(250, 251, 252, 0))
    );
    background-image: linear-gradient(
      90deg,
      rgba(250, 251, 252, 0) 0,
      rgba(250, 251, 252, 0) 10%,
      rgba(250, 251, 252, 0) 85%,
      rgba(250, 251, 252, 0)
    );
  }

  .P...