Custom Color Twitter by hskazes

/* ==UserStyle==
@name         Custom Color Twitter
@description  Can customize color of Twitter on the web
@namespace    twitter.com
@version      0.0.1
@author       nukumori.org
@homepageURL  http://nukumori.org/
@license      CC BY-NC-SA - Creative Commons Attribution-NonCommercial-ShareAlike
@preprocessor uso
@var          color    customcolor "Custom Color"    #a21a1a
==/UserStyle== */

@-moz-document domain("twitter.com") {
/* ==================== */
/* common */
/* ==================== */
/* twitter logo on initial loading */
.r-13gxpu9, .r-1n1174f,
[role="heading"] .r-1cvl2hr {
  color: var(--custom-default-light);
}

/* analytics popup */
.ep-Cta .ep-CtaQPv1 {
  border-color: var(--custom-default-normal);
  background-color: var(--custom-default-normal);
}
.ep-Cta .ep-CtaQPv1:hover {
  border-color: var(--custom-default-dark);
  background-color: var(--custom-default-dark);
}

/* ==================== */
/* Blue(Default) */
/* ==================== */
:root {
  --custom-default-dark: /*[[customcolor]]*/ff;
  --custom-default-light: /*[[customcolor]]*/88;
  --custom-default-transparent: /*[[customcolor]]*/44;
  --custom-default-transparent-dark: /*[[customcolor]]*/66;
  --custom-default-transparent-light: /*[[customcolor]]*/11;/* added for customize */
  --custom-default-normal: /*[[customcolor]]*/cc;
}
/* for dim/dark */
body:not([style*="background-color: rgb(255, 255, 255"]):not([style*="background-color: #FFFFFF"]) {
  --custom-default-transparent: rgba(255, 255, 255, .05);
}
/* text, icon */
.r-1cvl2hr, /* icon: authorized user, tweet area */
.r-1n1174f /* text: link */ {
  color: var(--custom-default-normal);
}
/* tab border */
.r-1pbtemp {
  border-right-color: var(--custom-default-normal);
}
/* left sidebar button/top tab/radio button outside effect background hover */
/* *** also used as common color *** */
[data-testid^="AppTabBar_"]:hover > .r-zv2cs0,/* dev */
[data-testid^="AppTabBar_"] + a:hover > .r-zv2cs0,/* Profile *//* dev */
.r-1peqgm7 {
  background-color: var(--custom-default-transparent);
}
[data-testid^="AppTabBar_"]:active > .r-zv2cs0,/* dev */
[data-testid^="AppTabBar_"] + a:active > .r-zv2cs0,/* Profile *//* dev */
.r-r18ze4 {
  background-color: var(--custom-default-transparent-dark);
}
/* button background */
.r-l5o3uw {
  background-color: var(--custom-default-normal);
}
/* button hover - dark; tweet button on left, done on color setting */
.r-1vtznih {
  background-color: var(--custom-default-dark);
}
/* button active (top tweet area tweet button) */
.r-yuvema {
  background-color: var(--custom-default-normal);
}
/* input - poll */
.r-vhj8yc,
/* outlined button outline */
.r-p1n3y5,
[style="border-color: rgb(29, 155, 240);"] {
  border-color: var(--custom-default-normal) !important;
}
/* input selected - poll */ 
.r-9cip40 {
  box-shadow: var(--custom-default-normal) 0 0 0 1px;
}
/* settings bar (class is universal just style is different)*/
.css-1dbjc4n.r-1awozwy.r-18u37iz.r-16y2uox.r-hdaws3[style="background-color: rgb(142, 205, 248);"],
.css-1dbjc4n.r-1awozwy.r-18u37iz.r-16y2uox.r-4v7adb[style="background-color: rgb(142, 205, 248);"] {
  background-color: var(--custom-default-light) !important;
}
/* settings bar thumb (class is universal just style is different) */
.css-1dbjc4n.r-sdzlij.r-7dny9e.r-tbmifm.r-16eto9q[style="background-color: rgb(142, 205, 248);"],/* added20210813 for Settings >... Display*/
[role="dialog"] .css-1dbjc4n[style="background-color: rgb(142, 205, 248);"],/* dim */
[role="dialog"] .css-1dbjc4n[style="background-color: rgb(142, 205, 248);"],/* dark */
[role="dialog"] .css-1dbjc4n[style="background-color: rgb(142, 205, 248);"] {
  background-color: var(--custom-default-light) !important;
}
[role="radiogroup"] [title="Blue heart"]:before {
  content: "Altanative";
  background-color: var(--custom-default-normal);
  color: var(--custom-default-normal);
}
/* wheel */
svg > circle[style*="stroke: rgb(29, 155, 240)"] {
  stroke: var(--custom-default-normal) !important;
}

/* =================== */
/* =================== */
/* added for customize */
/* =================== */
/* =================== */
/* nav hover */
.r-1ydqjzz {
  background-color: var(--custom-default-transparent);
}
/* tweet hover */
.r-1panhkp {
  background-color: var(--custom-default-transparent-light);
}
/* right side */
.r-x572qd {
  background-color: var(--custom-default-transparent-light);
}
.r-1d6w8o1 {
  border-color: var(--custom-default-transparent-light);
}
/* dialog */  
[role="dialog"] label+div>svg.r-l5o3uw{
  background-color: transparent;
}
  
}