Dark ComunidadFeliz by jtcontreras

/* ==UserStyle==
@name           Dark ComunidadFeliz
@namespace      USO Archive
@author         José Tomás Contreras Jiménez
@description    `Dark theme for ComunidadFeliz`
@version        20220908.14.39
@license        CC0-1.0
@preprocessor   uso
==/UserStyle== */
/*
     * Name:    DarkInterface for ComunidadFeliz
     * Author:  JTContreras
     * Version: v0.7
     */
@-moz-document domain("comunidadfeliz.com"),
domain("comunidadfeliz.cl"),
domain("comunidadfeliz.mx") {

  .green-box,
  .plans,
  .like-cf,
  .btn-success {
    background-color: #286A52;
    color: #EEE;
  }
  header .navbar-header,
  header .navbar-header a,
  .navigation-bar {
    background-color: #161616;
    color: #EEE;
    box-shadow: 0px 1px 5px 0px rgb(78 104 131 / 0.3);
  }

  .navigation-menu-icon-button a {
    background-color: #161616;
    color: #EEE;
  }

  .table-content {
    color: #aaa !important;
  }

  .view-more-btn {
    color: #eee !important;
  }

  .navigation-menu-icon-button a:hover,
  .navigation-menu-icon-button a:focus,
  .navigation-menu-icon-button a.active-header {
    background-color: #242424;
  }

  .event_liner_panel .common_expense_title,
  .server-user-group-text,
  header small {
    color: #C5C5C5;
  }

  .MuiTypography-body1 {
    color: #c5c5c5
  }

  .MuiPaper-root {
    background-color: #161616;
    color: #c5c5c5
  }

  .jss25,
  .jss27,
  .jss41,
  .jss42 {
    background-color: #161616;
    border-color: #242424;
  }
  .jss4 {
    background-color: #242424;
  }

  .jss96 {
    color: #c5c5c5
  }

  .modal-header {
    border-bottom: 1px solid #161616;
    background: none no-repeat scroll 0 0 #286A52;
  }

  .landing-demo .home-title,
  .btn-success {
    color: #286A52;
  }
  .jss7 {
    background-color: #242424
  }

  .Mui-selected.jss17,
  .Mui-selected.jss18 {
    border-left-color: rgb(21, 21, 21);
    border-right-color: rgb(21, 21, 21);
    border-bottom-color: rgb(21, 21, 21);
  }

  .MuiTabs-root {
    border-bottom-color: rgb(21, 21, 21);
  }

  .MuiBox-root,
  .MuiGrid-root,
  .MuiPaper-root {
    color: #c5c5c5 !important;
  }
  .MuiButton-root {
    color: #c5c5c5
  }

  .jss53 {
    background-color: rgba(146, 146, 146, 0.55)
  }

  .jss54 {
    background-color: #242424
  }

  div[class*='MuiTableCell-body'],
  div[class*='MuiTableCell-head'],
  div[class*='MuiPaper-root'],
  td[class*='MuiTableCell-root'],
  div[class*='MuiTableRow-root'],
  tr[class*='MuiTableRow-root'],
  th[class*='MuiTableCell-root'],
  .collapsible-box > .header,
  .collapsible-box > .header .box-title {
    background-color: #161616;
    color: #eee
  }
  tr[class*='MuiTableRow-root']:hover {
    background-color: #242424;
  }
  div[class*='MuiPaper-root'][class*='MuiPaper-elevation1'] {
    background-color: #242424;
    color: #c5c5c5;
  }
  span[class*='MuiIconButton-label'] {
    color: #c5c5c5;
  }

  button[class*='MuiButtonBase-root'] {
    background-color: transparent;
  }

  button[class*='MuiButtonBase-root'][class*='MuiTab-root'] {
    background-color: transparent;
  }

  button[class*='MuiButtonBase-root'][class*='MuiButton-fullWidth'] {
    color: #c5c5c5;
    background-color: #286A52;
  }

  li[class*='MuiButtonBase-root'] {
    color: #c5c5c5
  }

  .MuiGrid-grid-xs-9 {
    background-color: #161616
  }

  .MuiGrid-grid-xs-9 div[class*='jss'] {
    background-color: transparent;
  }
  .MuiGrid-grid-xs-9 div[class*='jss'] {
    background-color: transparent;
    border-color: #161616
  }
  .MuiGrid-grid-xs-9 .MuiGrid-spacing-xs-3 > div[class*='jss'].MuiGrid-grid-xs-12 {
    background-color: #702321
  }
  .react-calendar {
    background-color: black;
    box-shadow: 11px -1px 85px -8px #161616;
    color: #eee
  }
  .react-calendar__navigation button,
  .react-calendar__month-view__weekdays,
  .themeCalendarDetail {
    color: #c5c5c5!important;
  }


  .MuiIconButton-root-876 {
    color: rgba(255, 255, 255, 0.54);
  }

  .MuiTablePagination-root-1087 {
    color: rgba(255, 255, 255, 0.87);
  }

  .MuiPaper-rounded-813 {
    background-color: #242424
  }
  .jss1140,
  .jss1140:hover,
  .jss972,
  .jss972:hover {
    background-color: #000
  }

  .MuiButtonBase-root-884.MuiButton-root-896:not(.jss895) {
    background-color: #000
  }

  .jss268 {
    color: #EEE;
    background: #333;
  }
  .common-expense-info .name,
  .common-expense-collapse .amount,
  .collapse-font-weight,
  .summary-container .summary-content > .summary-amount {
    color: #eee
  }
  .jss268:hover {
    color: #EEE;
    background: #111;
  }

  .embedded-wrapper .modal-header h3,
  .btn,
  body > pre,
  body,
  a.love,
  h1 small,
  h1 .small,
  h2 small,
  h2 .small,
  h3 small,
  h3 .small,
  h4 small,
  h4 .small,
  h5 small,
  h5 .small,
  h6 small,
  h6 .small,
  .h1 small,
  .h1 .small,
  .h2 small,
  .h2 .small,
  .h3 small,
  .h3 .small,
  .h4 small,
  .h4 .small,
  .h5 small,
  .h5 .small,
  .h6 small,
  .h6 .small,
  .panel-info .lead,
  body > pre,
  body,
  a.love,
  a.cke_path_item,
  span.cke_path_empty,
  .left-bar-menu ul li a,
  .summary-container .summary-content > .summary-title,
  .tabs-row > .tabs-link a,
  .collapsible-box > .body,
  .profile-form-container,
  .checkbox-label,
  .form-mail h4,
  .black-text {
    color: #EEE;
  }

  body,
  .collapsible-box > .body {
    background-color: #242424;
  }

  .header-line,
  .header-line tr,
  .colored-header,
  .table-index .colored-header {
    background-color: #569cd6 !important;
    color: #EEE
  }

  .contGeneral,
  .event_liner .timeline-centered .timeline-entry .timeline-entry-inner .timeline-label,
  body:not(.pdf),
  #content,
  textarea,
  input[type="text"],
  input[type="password"],
  input[type="datetime"],
  input[type="datetime-local"],
  input[type="date"],
  input[type="month"],
  input[type="time"],
  input[type="week"],
  input[type="number"],
  input[type="email"],
  input[type="url"],
  input[type="search"],
  input[type="tel"],
  input[type="color"],
  .uneditable-input,
  #feedback-suggest .suggest-search .searchField,
  .redactor_box,
  .redactor_box textarea,
  .redactor_toolbar,
  .attach-wrapper,
  .cke_editable,
  #container,
  .form-control,
  .bootstrap-tagsinput,
  .btn-default:hover,
  .btn-default:focus,
  .btn-default:active,
  .btn-default.active,
  .open > .btn-default.dropdown-toggle,
  .multiselect-container,
  .dropdown-menu > li > a,
  F,
  .table-striped > tbody > tr:nth-child(odd) > td,
  .table-striped > tbody > tr:nth-child(odd) > th,
  .timepicker,
  .datepicker,
  .bootstrap-datetimepicker-widget,
  .property-panels .base_color,
  .cf-selector > .dropdown > button,
  .cf-button.default,
  .cf-button.secondary,
  input.cf-button.default,
  input.cf-button.secondary,
  a.cf-button.default,
  a.cf-button.secondary,
  .form-fields .form-field > label,
  .attribute-fields .form-field > label,
  .collapsible-box > .body small {
    background-color: #242424 !important;
    color: #C5C5C5 !important;
  }

  .common-expense-info,
  .common-expense-info .amount,
  .dashboard-summary > .summary-box > turbo-frame > .summary > .summary-header,
  .secondary_text {
    color: #C5C5C5;
  }

  .fa-inverse {
    color: #242424;
  }

  .post-author-name,
  .post-title,
  .post-body,
  .post-published-date,
  .form-mail {
    color: #C5C5C5 !important;
  }

  .post-published-date,
  .post-body,
  .dashboard-summary > .summary-box > turbo-frame > .summary > .summary-current {
    color: #8A8A8A;
  }

  .container-fluid,
  .property-panels .panel-heading,
  .panel-default > .panel-heading,
  .dashboard-summary > .summary-box > turbo-frame,
  .tox:not(.tox-tinymce-inline) .tox-editor-header,
  .tox .tox-toolbar-overlord,
  .tox .tox-toolbar,
  .tox .tox-toolbar__overflow,
  .tox .tox-toolbar__primary,
  .tox :not(svg):not(rect),
  .tox .tox-tbtn--disabled,
  .tox .tox-tbtn--disabled:hover,
  .tox .tox-tbtn:disabled,
  .tox .tox-tbtn:disabled:hover {
    background-color: #161616;
    color: #C5C5C5;
  }

  .tox .tox-tbtn--disabled svg,
  .tox .tox-tbtn--disabled:hover svg,
  .tox .tox-tbtn:disabled svg,
  .tox .tox-tbtn:disabled:hover svg,
  .tox .tox-tbtn--disabled svg,
  .tox .tox-tbtn--disabled:hover svg,
  .tox .tox-tbtn:disabled svg,
  .tox .tox-tbtn:disabled:hover svg,
  .tox .tox-tbtn:active svg {
    fill: rgba(221, 208, 193, .5);
  }

  .tox .tox-tbtn--bespoke {
    background: #242424
  }

  .navigation-menu-icon-button a > img {
    filter: invert(1) hue-rotate(180deg)
  }

  .tox .tox-tbtn svg {
    fill: #C5C5C5;
  }

  .container-fluid h1,
  .title-container,
  .header-box-component {
    background-color: #242424;
    color: #00b49f;
  }

  .content,
  #loginIframeContainer,
  #loginForm,
  .dropdown-menu .divider,
  .green-box .benefits,
  .source .data,
  .cke_top {
    background-color: #161616;
  }

  .modal-body,
  .btn-default,
  input,
  .table-index,
  .table-row,
  html:not(.pdf),
  .panel,
  .ce-pdf-container .details-content,
  .pagination > .disabled > span,
  .pagination > .disabled > span:hover,
  .pagination > .disabled > span:focus,
  .pagination > .disabled > a,
  .pagination > .disabled > a:hover,
  .pagination > .disabled > a:focus,
  .pagination > li > a,
  .pagination > li > span,
  .cf-button.default,
  .cf-button.secondary,
  input.cf-button.default,
  input.cf-button.secondary,
  a.cf-button.default,
  a.cf-button.secondary {
    background-color: #242424;
  }

  .table-root .table-header,
  .table-root .table-row,
  .table-root tr th,
  .table-root {
    background-color: #242424;
    color: #aaa;
  }

  .table-root .table-row:hover,
  .table-root tr:hover {
    background-color: #1a1a1a;
  }

  .table-root a,
  .table-root input,
  .table-root label,
  .table-root.common-expenses-table a,
  .pending-list-text,
  .pending-item {
    color: #cfcfcf;
  }

  .modal-footer,
  #main_dropdown {
    background-color: #242424;
    border-top: 1px solid #1b1b1b
  }

  #main_dropdown a {
    color: #aaa;
  }

  .list-group-item {
    background-color: #242424;
  }

  .products .payment-bo...