Zendesk Dark Mode by blinkshark

/* ==UserStyle==
@name         Zendesk Dark Mode
@namespace    blnkshrk
@author       blinkshark
@description  A Dark Mode theme for Zendesk that's a bit of a work in progress. This is an updated "ImthatDESKhere - Zendesk Dark Mode" by Imthatguyhere to fit my needs. Currently it only applies to the /agent/filters (or "ticket views") page and the /agent/tickets (the individual ticket) page.
@version      1.0.15
@license      NONE
@preprocessor uso
==/UserStyle== */

@-moz-document regexp(".*zendesk\\.com\\/agent\\/filters.*"), regexp(".*zendesk\\.com\\/agent\\/tickets.*") {
    body, select, input, textarea { /*Default Text Colour*/
        color: #cdd3d9;
    }
    
    font, span { /*Global Font Color Override*/
        color: #cdd3d9 !important;
    }
    
    a {
        color: #b79aff;
    }

    a:hover {
        color: #d0bdfd;
    }
    
    * {
        scrollbar-color: dark;
        color-scheme: dark;
    }
    
    #main_navigation {
        background-color: #01486a;
    }
    
    .gpwwwm { /*Get Started/Breadcrumbs*/
          background-color: #3c3c3c;
    }
    
    .cWfxTc { /*Get Started/Breadcrumbs Text - Active*/
        color: #97d0ff;
    }
    
    .lmBAXU { /*Get Started/Breadcrumbs Text*/
        color: #c6dbec;
    }
    
    .indicators {
        background-color: #303636;
        color: #c6dbec;
    }
    
    .indicators h4 > span {
        color: #b9b9b9;
    }
    
    .indicators ul {
        background-color: #242424;
        border: 1px solid #40646c;
    }
    
    .indicators .cell-value {
        color: #94bedf;
    }
    
    .indicators .cell-title {
        color: #a4a9ad;
    }
    
    .odfkf, .iqxEio { /*Ticket Tab Background selected*/
        background: #3b3f42;
        border-right: 1px solid rgb(0 0 0);
        border-bottom: #3b3f42;
    }
    .Fvqvj, .cTcfKy { /*Ticket Tab Background not selected*/
        background: rgb(22 22 22);
        border-right: 1px solid rgb(0 0 0);
        border-bottom: rgb(22 22 22);
}

    .LRe { /*Ticket Tab Border*/
        border-bottom: 1px solid rgb(0 0 0);
    }
    .LRx { /*Ticket Add Button*/
        background-color: #1a2026;
        color: #97d3ef !important;
    }

    
    /*
    .LRex { 
        background-color: #15719d;
    }

    .LRex:hover { 
        background-color: #183847;
    }
    */
    
    .bvNpkX > * { /*Submit As Menu*/
        background-color: #33373a;
        border-color: #38586d;
    }
    
    .main_panes > header, .workspace > header { /*Ticket Top Bar (Info)*/
        background-color: #33373a;
        border-bottom: 1px #1f2020 solid;
    }
    
    .kWHJfL { /*Top bar Box Text Color*/
        color: #bdc5cb;
    }
    
    .grHctT:disabled, .grHctT[aria-disabled="true"] { /*Ticket Title Disabled*/
        border-color: #1a1a1a;
        background-color: #232e2e;
        color: #4d7691;
    }
    
    .kWHJfL:hover {
        color: #92bddd;
    }
    
    .fxWzfx > svg, .fxWzfx .sc-uJMKN { /*Top Bar Ticket Icon*/
        color: #aec1cf;
    }
    
    .LRau { /*Inactive Ticket Background*/
        background-color: #313131;
    }
    .LRau:hover {
        background-color: #344351;
    }
    .LRat { /*Inactive Ticket Border*/
        border-right: 1px solid #2b2c2c;
    }
    .LRas { /*Inactive Ticket Border*/
        border-bottom: 1px solid #292a2a;
    }
    
    .crEjqd { /*Empty Ticket View Text*/
        color: #bde0ff;
    }
    
    .crEjqd:hover { 
        color: #fafdff;
    }
    
    .hNmglM { /*Ticket View Text*/
        color: #ebebeb;
    }
    
    .hNmglM:hover {
        color: #fdf8f8;
    }
    
    .VxCKy { /*Ticket View Text Selected*/
        color: #ebebeb;
        background-color: #3a4d5c;
    }
    
    .VxCKy:hover {
        color: #fdf8f8;
        background-color: #3a4d5c;
    }

    .iSiqOr { /*Suspended Tickets View Text*/
        color: #ffc41d;
    }
    
    .iSiqOr:hover {
        color: #fbd979;
    }

    .fwJsWA { /*Suspended Tickets View Text Selected*/
        background-color: #3a4d5c;
        color: #ffc41d;
    }

    .fwJsWA:hover {
        background-color: #3a4d5c;
        color: #fbd979;
    }

    .hjUPxu { /*Tickets View Manage Views Icon*/
        color: #bde1ff;
    }
    
    .hjUPxu:hover {
        color: #c9e2f7;
    }
    
    .cBuFak { /*Tickets View Manage Views Text*/
        color: #a7d1f3;
    }
    
    .cBuFak:hover {
        color: #d8e8f5;
    }

    .LRdx { /*Ticket View Left Border*/
        border-left: 1px solid #1d1f20;
    }
    
    .pane.right.views { /*Right Pane*/
        background: #212325;
    }

    .jydokf { /*Ticket Pane Ticket Title*/
        color: #9eb1c1;
    }

    .jydokf:hover {
        color: #9cd4ff;
    }

    .csyHXp { /*Ticket Pane Text*/
        color: #c5c5c5;
    }
    
    .fiNJsl th { /*Ticket Pane Table Header*/
        background-color: #2e2e2e;
    }

    .fNgTOj { /*Ticket Pane Table Header Separator*/
        border-bottom: 1px solid #1d1e1e;
        background-color: #2e3133;
    }
    
    .eaItv { /*Ticket Pane Table Ticket Separator*/
        border-bottom: 1px solid #595c5e;
    }
    
    .cqCcXs > * { /*Drop-down Add Background*/
        background-color: #242424;
        border-color: #3a5562 !important;
    }
    
    .fuogUH { /*Drop Down Add Title*/
        color: #bdd5e9;
    }

    .kFsGWG { /*Drop Down Add Text*/
        color: #b7c1c9;
    }
    
    .fsZyAV { /*Drop Down Add Separator*/
        border-bottom: 1px solid #6e6e6e;
    }
    
    .kqHPFE { /*Top Search Box*/
        background-color: #373f44;
        color: #96a2ab;
    }
    
    .bLWiol { /*Top Search Box Hover*/
        background-color: #505a5e;
        color: #79858f;
    }

    .hKneHq > div:not(:focus-within) > svg { /*Top Search Box Magnifying Glass*/
        color: #d9e1e9;
    }
    
    #branding_header {
        background: #202020;
    }
    
    .c-product-tray__icon-RrAhc { /*Product Tray Icon*/
        color: #93a3b3;
    }
    
    .c-product-tray__icon-RrAhc:hover { /*Product Tray Icon*/
        color: #b2c6d9;
    }
    
    .pane.left.section { /*Left Pane*/
        background: #1c1b1b;
        border-color: #6f6a6a;
    }

    .split_pane.collapsible .pane.left { /*Left Pane Border*/
        border-right: 1px solid #696b6c;
    }

    section.filters .left header h1, section.user_filters .left header h1, section.incidents .left header h1 { /*Left Pane Dropdown Title*/
        color: #b6d0e5;
    }

    .caret { /*Dropdown Caret*/
        border-top: 4px solid #9fc4e1;
        opacity: 0.5;
    }
    
    .action_button { /*Dropdown Action Button*/
        color: #aec8dd;
    }
    
    
    .filters > .pane.left ul.filters li.selected, .user_filters > .pane.left ul.filters li.selected, .user > .pane.left ul.filters li.selected { /*Customers Page Selected Option*/
        background-color: #3b4854;
        color: #b0bcc7;
    }
    
    .filters > .pane.left ul.filters li a, .user_filters > .pane.left ul.filters li a, .user > .pane.left ul.filters li a { /*Customers Page Option*/
        color: #d3d3d3;
    }
    
    .fdCpKu th { /*Customer Table Header*/
        background-color: #222222;
    }
    
    .LRcy { /*Dashboard Text*/
        color: #b5bdc3;
    }
    
    .hJuXZo, .czaCOI { /*Views Side Text*/
        color: #8b8f93;
    }

    .hJuXZo:hover, .czaCOI:hover { /*Views Side Text*/
        color: #9ea3a7;
        background-color: rgb(31 115 183 / 25%);
    }
    .gvPNOF:hover {
    background-color: rgb(31 115 183 / 25%);
    }
    .egpMJW:hover {
    background-color: rgb(31 115 183 / 25%);
    }

    .feeXEe { /*Views Side Background*/
        background-color: #212325;
    }
    
    h4.list-heading { /*Tickets Requiring Attention Background*/
        background-color: #2b3138;
        border-bottom: 1px solid #5c5c5c;
    }
    
    .link {
        color: #a1c3df;
    }
    
    .LRbx { /*Ticket "Add" button*/
        background-color: #2a3a4e;
    }
    
    .activities .item { /*Dashboard Activity Log Background*/
        background-color: #04101a;
        border: 1px solid #344046;
    }
    
    .activities .item:hover {
        background-color: #061929;
        border-color: #418eb3;
    }
    
    .activities .description { /*Dashboard Activity Log Description*/
        color: #a2ceed;
    }
    
    .activities .description strong {
        color: #eceff1;
    }
    
    .activities .comment_value { /*Dashboard Activity Log Comment*/
        color: #a9b0b7;
    }
    
    .LRay { /*Dashboard Text*/
        color: #bfc2c5;
    }
    
    .LRcf { /*Dashboard Table Borders*/
        border-color: #545454;
        border-left: none;
        border-right: none;
    }

    .btn {
        background-color: #2a2a2a;
        border-color: #5e5e5e;
        color: #cad1d7;
        box-shadow: inset 0 1px 0 #838383;
    }
    
    .btn:hover {
        background-color: #181818;
        border-color: #6f6f6f;
        color: #c3d7e8;
        box-shadow: inset 0 1px 0 #8d8c8c;
    }
    
    .LRcn { /*Dashboard Ticket Text*/
        color: #a7aaad;
    }
    
    .LRdv { /*Dashboard Ticket Border*/
        border-color: #3d3e3e;
    }
    
    .LRdb { /*Dashboard Ticket Priority Background*/
        background-color: #060607;
    }

    .LRep { /*Active Ticket Tab Border*/
        border-right: 1px solid #515454;
    }


    .LReo { /*Active Ticket Tab Border*/
        border-bottom: 1px solid #515454;
    }
    
    .LRea, .LReb, .LRec, .LRed, .LRee, .LRef, .LReg, .LReh, .LRei, .LRej, .LRek, .LRel, .LRem, .LRen, .LReo, .LRep, .LReq, .LRer, .LRes, .LRet, .LReu, .LRev, .LRew, .LRex, .LRey, .LRez, .LRcp, .LRfb, .LRfc, .LRs, .LRam, .LRo, .gTNfLi, .cgkfJX  { /*I have no idea why so many of these appear on the dashboard but this is the best I can do. Ticket Inactive Tab*/
        border-color: #363636 !important;
        background-color: #212325 !important;
    }
    
    .LRea:hover, .LReb:hover, .LRec:hover, .LRed:hover, .LRee:hover, .LRef:hover, .LReg:hover, .LReh:hover, .LRei:hover, .LR...