GoogleCalendar-Dark.user.css

/* ==UserStyle==
@name        Google Calendar - Dark Style
@namespace   Devo7v
@version     0.2.10
@homepageURL https://github.com/Devo7v/UserCSS
@updateURL   https://raw.githubusercontent.com/Devo7v/UserCSS/master/GoogleCalendar-Dark.user.css
@license     CC-BY-NC-SA-4.0
@author      Devo7v

@preprocessor stylus

@var color gcal-accent-color "Accent Color" #1A73E8

@var color gcal-primary-background-color "Primary Background Color" #111111
@var color gcal-enhanced-background-color "Light Background Color" #333333
@var color gcal-enhanced2-background-color "Light Background Color 2" #555555
@var color gcal-dark-background-color "Dark Background Color" #000000

@var color gcal-primary-text-color "Primary Text Color" #CCCCCC
@var color gcal-enhanced-text-color "Light Text Color" #FFFFFF
@var color gcal-dull-text-color "Dark Text Color" #999999

@var color gcal-primary-line-color "Primary Line Color" #999999
@var color gcal-enhanced-line-color "Light Line Color" #FFFFFF
@var color gcal-dull-line-color "Dull Line Color" #555555
@var color gcal-dark-line-color "Dark Line Color" #111111

@var checkbox gcal-box-shadow-check "Show Shadow Behind Elements" 1

@var select SystemTheme "Apply Style Under System Theme"[
"Dark" ,
"Light",
"Always"
]
==/UserStyle== */
@-moz-document url-prefix("http://www.google.com/calendar/"), url-prefix("https://www.google.com/calendar/"), url-prefix("http://calendar.google.com/"), url-prefix("https://calendar.google.com/") {
    /*If you want to fully theme the Google Bar at the top, install the Google Bar - Dark Style (https://userstyles.org/styles/120351/google-bar-dark-style)*/

/*Comment out the following line if you want this style to apply regardless of System Dark Mode settings*/
:root {
    if gcal-box-shadow-check == 1 {
            --gcal-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23), 0 -10px 20px rgba(0, 0, 0, 0.19), 0 -6px 6px rgba(0, 0, 0, 0.23);
    }

    else if gcal-box-shadow-check == 0 {
            --gcal-box-shadow: none;
    }
}

/*=======Set the colors based on system theme options=======*/
if SystemTheme == "Dark" {
    @media (prefers-color-scheme: dark)  {
        :root {
            --gcal-accent-color: gcal-accent-color;

            --gcal-primary-background-color: gcal-primary-background-color;
            --gcal-enhanced-background-color: gcal-enhanced-background-color;
            --gcal-enhanced2-background-color: gcal-enhanced2-background-color;
            --gcal-dark-background-color: gcal-dark-background-color;

            --gcal-primary-text-color: gcal-primary-text-color;
            --gcal-enhanced-text-color: gcal-enhanced-text-color;
            --gcal-dull-text-color: gcal-dull-text-color;

            --gcal-primary-line-color: gcal-primary-line-color;
            --gcal-enhanced-line-color: gcal-enhanced-line-color;
            --gcal-dull-line-color: gcal-dull-line-color;
            --gcal-dark-line-color: gcal-dark-line-color;
            
            /*Google Variables*/
            --on-surface: var(--gcal-dull-text-color);
        }
    }
    @media (prefers-color-scheme: light)  {
        :root {
            --gcal-accent-color: gcal-accent-color;

            --gcal-primary-background-color: #FFFFFF;
            --gcal-enhanced-background-color: #EEEEEE;
            --gcal-enhanced2-background-color:  #DDDDDD;
            --gcal-primary-line-color: #dadce0;
        }
    }
}
if SystemTheme == "Light" {
    @media (prefers-color-scheme: light)  {
        :root {
            --gcal-accent-color: gcal-accent-color;

            --gcal-primary-background-color: gcal-primary-background-color;
            --gcal-enhanced-background-color: gcal-enhanced-background-color;
            --gcal-enhanced2-background-color: gcal-enhanced2-background-color;
            --gcal-dark-background-color: gcal-dark-background-color;

            --gcal-primary-text-color: gcal-primary-text-color;
            --gcal-enhanced-text-color: gcal-enhanced-text-color;
            --gcal-dull-text-color: gcal-dull-text-color;

            --gcal-primary-line-color: gcal-primary-line-color;
            --gcal-enhanced-line-color: gcal-enhanced-line-color;
            --gcal-dull-line-color: gcal-dull-line-color;
            --gcal-dark-line-color: gcal-dark-line-color;
            
            /*Google Variables*/
            --on-surface: var(--gcal-dull-text-color);
        }
    }
    @media (prefers-color-scheme: light)  {
        :root {
            --gcal-accent-color: gcal-accent-color;

            --gcal-primary-background-color: #FFFFFF;
            --gcal-enhanced-background-color: #EEEEEE;
            --gcal-enhanced2-background-color:  #DDDDDD;
            --gcal-primary-line-color: #dadce0;
        }
    }
}
if SystemTheme == "Always" {
        :root {
            --gcal-accent-color: gcal-accent-color;

            --gcal-primary-background-color: gcal-primary-background-color;
            --gcal-enhanced-background-color: gcal-enhanced-background-color;
            --gcal-enhanced2-background-color: gcal-enhanced2-background-color;
            --gcal-dark-background-color: gcal-dark-background-color;

            --gcal-primary-text-color: gcal-primary-text-color;
            --gcal-enhanced-text-color: gcal-enhanced-text-color;
            --gcal-dull-text-color: gcal-dull-text-color;

            --gcal-primary-line-color: gcal-primary-line-color;
            --gcal-enhanced-line-color: gcal-enhanced-line-color;
            --gcal-dull-line-color: gcal-dull-line-color;
            --gcal-dark-line-color: gcal-dark-line-color;
            
            /*Google Variables*/
            --on-surface: var(--gcal-dull-text-color);
        }
}

    /*Google Bar Color*/
    #gb {
        background-color: var(--gcal-primary-background-color) !important;
    }

    /*Top border*/
    .tNDBE {
        border-top: 1px solid var(--gcal-primary-line-color) !important;
    }

    /*========================Right-Side Apps Bar=====================*/
    /*App bar background color*/
    .Kk7lMc-DWWcKd-OomVLb-haAclf {
        background-color: var(--gcal-primary-background-color) !important;
    }

    div.gboEAb {
        border-left: 0px solid var(--gcal-primary-line-color) !important;
    }

    /*Background color when hovering over an app icon*/
    .DWWcKd-OomVLb-LgbsSe-ZmdkE .DWWcKd-OomVLb-LgbsSe-Bz112c-AHe6Kc {
        background-color: var(--gcal-enhanced2-background-color) !important;
        border-color: var(--gcal-enhanced2-background-color) !important;
    }

    /*+ symbol*/
    #qJTzr > div:nth-child(3) {
	    background-image: url(https://fonts.gstatic.com/s/i/googlematerialicons/add/v21/white-24dp/1x/gm_add_white_24dp.png) !important;
    }
    
    /*Background of the arrow at the bottom*/
    .Kk7lMc-QWPxkf-LgbsSe .DWWcKd-OomVLb-LgbsSe-Bz112c-haAclf {
        background-color: var(--gcal-enhanced2-background-color) !important;
    }

    /*Arrow at the bottom*/
    .DWWcKd-OomVLb-LgbsSe-Bz112c {
        fill: #CCCCCC !important;
    }

    /*.Kk7lMc-QWPxkf-LgbsSe-Bz112c{
  background-image: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjIwcHgiIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAwIDI0IDI0IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyNCAyNCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgZmlsbD0iI2ZmZiI+CiAgPHBhdGggZD0iTTguNTksMTYuNTlMMTMuMTcsMTJMOC41OSw3LjQxTDEwLDZsNiw2bC02LDZMOC41OSwxNi41OXoiLz4KICA8cGF0aCBmaWxsPSJub25lIiBkPSJNMCwwaDI0djI0SDBWMHoiLz4KPC9zdmc+') !important;
}


/*========================Google Bar========================*/
    /*Background color*/
    /*.gb_9d{
    background-color: var(--gcal-primary-background-color) !important;
  }
  
  /*Slide out Main menu icon*/
    /*.gb_yc svg{
	  color: blue !important;
    fill: blue !important;
	  opacity: .54 !important;
  }
  
  /*Google Calendar Logo and text color*/
    .gb_5d {
        color: var(--gcal-enhanced-text-color) !important;
    }

    /*Today Button*/
    .Rj2Mlf {
        background-color: var(--gcal-enhanced2-background-color) !important;
        border: none !important;
        color: var(--gcal-enhanced-text-color) !important;
    }

    /*Previous/Next Month, Search, Settings icons*/
    .m2yD4b {
        color: var(--gcal-primary-text-color) !important;
        fill: var(--gcal-primary-text-color) !important;
    }

    /*Month Title text color*/
    .UyW9db {
        color: var(--gcal-enhanced-text-color) !important;
    }

    .L4yjSd {
        color: var(--gcal-dull-text-color) !important;
    }

    /*View (Month, Week, Day, etc) button*/
    .HLI7qf {
        background-color: var(--gcal-enhanced2-background-color) !important;
        border: none !important;
    }

    .Cd9hpd .NlWrkb {
        color: var(--gcal-enhanced-text-color) !important;
    }

    .xmVoP {
        color: var(--gcal-enhanced-text-color) !important;
        opacity: 0.7 !important;
    }

    /*Switch between calendar and tasks*/
    .xg1yEb.xg1yEb, .KSkz4b.KSkz4b {
        border-color: var(--gcal-primary-line-color) !important;
    }
    /*.VYBDae-Bz112c-LgbsSe :is(i, svg, img) {
        color: var(--gcal-primary-text-color)
    }
    
    /*Border between Google Bar and Calendar/Left slide out menu*/
    .TOTjfb {
        border-top: 1px solid var(--gcal-primary-line-color) !important;
    }


    /*=======Month popup when clicking the Month Title=======*/
    /*Background color*/
    .q1j8lf, .J4VNSd {
        background-color: var(--gcal-enhanced-background-color) !important;
        height: 95% !important;
    }

    /*Month text color*/
    .MSZkRb, .r4nke {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Days of the week text color*/
    .SoBqBf {
        color: var(--gcal-dull-text-color) !important;
    }

    /*Dates text color*/
    .W0m3G {
        color: var(--gcal-dull-text-color) !important;
    }

    .IOneve .r4nke {
        background: var(--gcal-enhanced-background-color) !important;
    }

    .TUH0Sd .r4nke {
        background: var(--gcal-accent-color) !important;
    }

    .uGtG7d .r4nke {
        color: var(--gcal-dull-text-color) !important;
    }

    /*=======END=======*/
    /*=======Search popup=======*/
    /*input{
    color: #CCCCCC !important;
  }*/
    .gb_Ke.gb_1e {
        background: var(--gcal-enhanced-background-color) !important;
    }

    .gb_Tc {
        color: var(--gcal-dull-text-color) !important;
    }

    /*=======END=======*/
    /*=======View (Month, Week, Day, etc.) popup=======*/
    /*Background color*/
    .JAPqpe {
        background: var(--gcal-enhanced-background-color) !important;
    }

    /*Text color*/
    .z80M1, .mdj4H, .JAPzS, div.DN1TJ {
        color: var(--gcal-dull-text-color) !important;
    }

    /*Dividing line*/
    .kCtYwe {
        border-top: 1px solid var(--gcal-primary-line-color) !important;
        margin: 7px 0 !important;
    }

    /*Check box color*/
    .z80M1.N2RpBe::before {
        border-right: 2px solid var(--gcal-enhanced-line-color) !important;
        border-bottom: 2px solid var(--gcal-enhanced-line-color) !important;
    }

    /*Highlight color when hovering over*/
    .z80M1.FwR7Pc {
        background-color: #555555 !important;
    }

    /*=======END=======*/
    /*========================Left slide out menu========================*/
    /*Background color*/
    .QQYuzf {
        background-color: var(--gcal-primary-background-color) !important;
    }

    .qZvm2d-clz4Ic {
        border-bottom: 1px solid var(--gcal-primary-line-color) !important;
    }

    /*Border above mini calendar*/
    .sBn5T::before, .sBn5T::after {
        display: none !important;
    }
    
    /*Fix for seach for people border*/
    .qXIcZc .ULpymb.rFrNMe {
        border-radius: 0px !important;
        border: none !important;
    }
    
    /*My calendars and Other calendars hover*/
    .kMp0We:hover, .kMp0We:focus {
        background-color: var(--gcal-enhanced-background-color) !important;
    }

    /*Calendars text color*/
    .o8t45d ,.toUqff {
        color: var(--gcal-primary-text-color) !important;
    }
    
    /*Terms - Privacy*/
    .erDb5d {
        color: #555555 !important;
    }


    /*=======Add a friend's calendar=======*/
    /*Text color*/
    .ULpymb .snByac {
        color: #777777 !important;
    }

    /*input text color*/
    .whsOnd {
        color: #CCCCCC !important;
    }

    /*Background color*/
    .IIB0tc .ULpymb {
        background-color: var(--gcal-enhanced-background-color) !important;
        border: 1px solid var(--gcal-dark-line-color) !important;
    }

    /*Popup background*/
    .VOEIyf .jBmls {
        background-color: var(--gcal-enhanced-background-color) !important;
    }

    /*Hover over item*/
    .oKubKe[aria-selected="true"] {
        background-color: var(--gcal-enhanced2-background-color) !important;
    }

    /*=======Calendars text=======*/
    /*Title Text*/
    .uQ1ixe .snByac {
        color: #777777 !important;
    }

    /*Carrot icon*/
    .Dk9A5d {
        color: #777777 !important;
    }

    /*Calendars text*/
    .NI2kfb {
        color: var(--gcal-dull-text-color) !important;
    }

    /*Unsubscribe & 3-dot icons*/
    .rF3YF {
        color: var(--gcal-dull-text-color) !important;
    }

    /*3-dot popup text color*/
    .QA0Szd-xl07Ob .uyYuVb {
        color: var(--gcal-dull-text-color) !important;
    }




    /*========================Main Calendar View========================*/
    /*Hovering over items (events and dates)*/
    .QGRmIf:hover, .KCIIIb:hover, .yzYBvd:hover {
        background-color: var(--gcal-dark-background-color) !important;
    }

    /*Dates text color*/
    .yzYBvd {
        color: var(--gcal-dull-text-color) !important;
    }

    .yzYBvd:hover {
        color: var(--gcal-enhanced-text-color) !important;
    }

    /*All day event background ends*/
    .QGRmIf {
        border-radius: 0px !important;
        /*2px is default, 9px is completely rounded*/
    }
    .KF4T6b{
        margin-left: 0px !important;
    }
    .Po94xd {
        padding-left: 0px !important;
        /*0px is default*/
        padding-right: 1px !important;
        /*3px is default*/
    }

    /*Add Event Button*/
    .XiVK6d, .SaBhMc {
        background-color: /*var(--gcal-accent-color)*/
        var(--gcal-enhanced2-background-color) !important;
    }

    /*+ Symbol*/
    .Gw6Zhc {
        color: var(--gcal-enhanced-text-color) !important;
    }

    /*Location of "+" symbol*/
    /*.Ip8zfc{
    top: 20px !important;
  }
  
  /*Existing Event popup*/
    .I7OXgf {
        background-color: var(--gcal-enhanced-background-color) !important;
    }

    /*========Add Event popup=======*/
    /*Background*/
    .JtukPc {
        background-color: var(--gcal-enhanced-background-color) !important;
    }

    .RDlrG {
        box-shadow: var(--gcal-box-shadow) !important;
    }

    /*Title and Time text*/
    .ndJi5d, .whsOnd.zHQkBf, .YTCBlf {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Event & Reminder text*/
    .XSQHmd {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Dash between start and end date/time*/
    .NtP29 {
        color: var(--gcal-primary-text-color) !important;
    }

    /*All day text*/
    .ETkhPe {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Event & Reminder selected background*/
    .qmv2fc.KKjvXb {
        background-color: var(--gcal-accent-color) !important;
        border: 1px solid var(--gcal-accent-color) !important;
    }

    /*Event & Reminder non-selected background*/
    .qmv2fc.kaAt2 {
        border: 1px solid var(--gcal-accent-color) !important;
    }

    /*Date/Time background*/
    .BvQsje {
        background-color: var(--gcal-enhanced-background-color) !important;
    }

    /*ADD TIME background*/
    .CCRNT {
        background-color: var(--gcal-enhanced2-background-color) !important;
    }

    /*Time text in drop down list*/
    .VKy0Ic {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Icons*/
    .rL6ose, .kap9Ye, .DPvwYc.NhjcAb {
        color: var(--gcal-primary-text-color) !important;
        opacity: 1.00 !important;
    }

    /*Going?*/
    .NAFvr {
        background-color: var(--gcal-enhanced-background-color) !important;
    }

    .ZGVUP .snByac {
        color: var(--gcal-enhanced-text-color) !important;
    }

    .ZGVUP .snByac:hover {
        color: var(--gcal-dull-line-color) !important;
    }


    /*========================Year========================*/
    /*Background*/
    .lYYbjc {
        background-color: var(--gcal-primary-background-color) !important;
    }
    
    /*========================Month========================*/
    /*Background*/
    .RAaXne, .K2fuAf {
        background-color: var(--gcal-primary-background-color) !important;
    }

    /*Background for current day*/
    .ef2wWc, .ecKr0 {
        background-color: var(--gcal-enhanced-background-color) !important;
    }

    /*Days of the Week*/
   .EeuFAf {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Current Day Date*/
    .w48V4c.F262Ye {
        color: white !important;
        background-color: var(--gcal-accent-color) !important;
        border-radius: 0% !important;
    }

    /*Current Month Dates*/
    .YK7obe, .o5s4T .w48V4c {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Previous and Next Month Dates*/
    /*.yzYBvd{
    color: blue !important;
    opacity: 0.38 !important;
    }
    
    /*Current and Future Events text color*/
    .jKgTF {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Old Event text color*/
    .UflSff .nHqeVd {
        color: rgb(125,125,125) !important;
    }
    
    /*Borders*/
    .FLFkR {
        border-bottom: 1px solid var(--gcal-primary-line-color) !important;
    }

    .w6FdBf, .MGaLHf {
        border-right: 1px solid var(--gcal-primary-line-color) !important;
    }
    .RAaXne:not(.Wyo4Qe) {
        border-left: 1px solid var(--gcal-primary-line-color) !important;
    }

    /*========================Day========================*/
    /*Background*/
    .OCQPo, .Gk2izd, .GENA3c {
        background-color: var(--gcal-primary-background-color) !important;
    }

    /*Current Day/Date*/
    .MmhHI.F262Ye {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Calendar names*/
    .cuBluc {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Left side text*/
    .pCoqfc, .MANBAf {
        color: var(--gcal-dull-text-color) !important;
    }
    
    /*Left side background*/
    .R6TFwe, .sS0sZd {
        background-color: var(--gcal-primary-background-color) !important;
    }

    /*Borders*/
    /*.H7IzGb,*/
    .C5Jlgc {
        border-left: 1px solid var(--gcal-dull-line-color) !important;
    }

    .SU7tYb, .YvjgZe, .EdAri {
        border-right: 1px solid var(--gcal-dull-line-color) !important;
    }

    .G5v83e {
        border-top: 1px solid var(--gcal-dull-line-color) !important;
    }

    .mmsF1c::after/*, .Gk2izd*/
    {
        border-bottom: 1px solid var(--gcal-dull-line-color) !important;
    }

    .J2aUD.T8M5bd .sx5BGe::before, .SGFqbe.T8M5bd .sx5BGe::before, .J2aUD.T8M5bd .qmFsL::after, .SGFqbe.T8M5bd .qmFsL::after {
        background-image: none !important;
    }

    body[data-viewfamily="EVENT"] .SGWAac/*, body[data-viewfamily="SCHEDULE"] .SGWAac, body[data-viewfamily="SEARCH"] .SGWAac */
    {
        border-top: #dadce0 0px solid;
    }


    /*Current Time line*/
    .WtFGnf-uDEFge, .H3tRZe {
        border-top: 2px solid var(--gcal-accent-color) !important;
    }

    .h11RHc {
        background: var(--gcal-accent-color) !important;
    }

    /*========================Week========================*/
    /*Background*/
    .pbeTDb, .gZ8fdb {
        background-color: var(--gcal-primary-background-color) !important;
    }
    
    /*Top border when scrolling down*/
    .oXZ1yb.T8M5bd .lqYlwe::before, .oXZ1yb.T8M5bd .uEzZIb::after {
        background-image: none !important;
        box-shadow: inset 0 1px 1px 0 rgba(0,0,0,.14),inset 0 2px 1px -1px rgba(0,0,0,.12) !important;
    }
    
    /*Previous Days*/
    .pCcXPe {
        color: var(--gcal-dull-text-color) !important;
        opacity: 0.7 !important;
    }

    /*Future Days*/
    .N4XV7d {
        color: var(--gcal-enhanced-text-color) !important;
        opacity: 0.7 !important;
    }

    /*Borders*/
    .EDDeke, .BiKU4b {
        border-right: 1px solid var(--gcal-primary-line-color) !important;
    }
     .sJ9Raf::after {
        border-bottom: 1px solid var(--gcal-primary-line-color) !important;
    }


    /*========================Schedule========================*/
    /*Current Day/Date*/
    .OmwDud.F262Ye {
        color: var(--gcal-accent-color) !important;
    }

    /*Day/Date Text*/
    .OmwDud {
        color: var(--gcal-dull-text-color) !important;
    }

    /*Times text*/
    .LLxvl.vXnnM, .snByac {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Event text*/
    .i06k6b.NlL62b {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Location Text*/
    .Z7IIl.JDkLTe {
        color: var(--gcal-dull-text-color) !important;
    }


    /*========================New Event Popup========================*/
    /*Background*/
    .p9lUpf {
        background: var(--gcal-primary-background-color) !important;
    }

    /*Save Button*/
    .Y5sE8d {
        background: var(--gcal-accent-color) !important;
        color: var(--gcal-enhanced-text-color) !important;
    }

    /*Title and Date/Time Boxes*/
    .Kb2sf, .TgcD5e {
        background-color: var(--gcal-enhanced-background-color) !important;
        border: 0px solid var(--gcal-dark-line-color) !important;
    }

    /*Add Title text color*/
    .bojM1c, #xTiIn {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Line below title*/
    .WnqCuf {
        background-color: var(--gcal-dull-line-color) !important;
    }

    /*Date/Time text*/
    #xStDaIn, #xStTiIn, #xEnTiIn, #xEnDaIn, .pQdjpb.shor6 .nXeosb{
        color: var(--gcal-primary-text-color) !important;
        background: var(--gcal-enhanced2-background-color) !important;
    }

    /*"To" and "TIME ZONE" text*/
    /*.YKfFKe, .RveJvd.snByac{
    color: blue !important;
    }

    /*All day check box*/
    .uHMk6b.fsHoPb {
        border: 7px solid var(--gcal-enhanced-background-color) !important;
    }

    /*[aria-checked="true"] > .rq8Mwb, [aria-checked="mixed"] > .rq8Mwb {
        background-color: var(--gcal-enhanced-background-color) !important;
    }

    /*Event Details, Find a Time, and Guest text*/
    .DvZJme.KKjvXb .VZhFab {
        color: var(--gcal-accent-color) !important;
    }

    /*Other drop down boxes*/
    .jgvuAb, .Dc8KZd, .As4fnb {
        background-color: var(--gcal-enhanced-background-color) !important;
        border: 1px solid var(--gcal-dark-line-color) !important;
    }

    /*Other drop down boxes text*/
    .MocG8c {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Carrot icons on drop down boxes*/
    .e2CuFe.eU809d {
        border-width: 4px 4px 0 4px !important;
        border-color: var(--gcal-primary-text-color) transparent !important;
    }

    /*Drop down list*/
    .ncFHed {
        background: var(--gcal-enhanced2-background-color) !important;
    }

    /*Background when hovering over an option*/
    .ncFHed .MocG8c.KKjvXb {
        background-color: var(--gcal-enhanced-background-color) !important;
    }

    /*Add conferencing button*/
    /*.HLI7qf .c7fp5b, .nCP5yc .VfPpkd-Jh9lGc {
        color: var(--gcal-primary-text-color) !important;
        background: var(--gcal-enhanced-background-color) !important;
        border: 1px solid var(--gcal-dark-line-color) !important;
    }

    /*Add conferencing */
    .DPvwYc svg {
        fill: var(--gcal-primary-text-color) !important;
    }

    /*Calendar text*/
    .jT5e9 {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Event color box*/
    .nHFrm.nHFrm {
        background-color: var(--gcal-enhanced-background-color) !important;
    }

    /*Carrot color*/
    .cpB3me {
        color: var(--gcal-primary-text-color)
    }

    /*Selected tab*/
    .ThdJC.KKjvXb {
        color: var(--gcal-accent-color) !important;
    }

    .w7qIhd, .WwvKTc {
        background-color: var(--gcal-accent-color) !important;
    }

    /*Non-selected tab*/
    .ThdJC {
        color: var(--gcal-dull-text-color) !important;
    }

    /*Dividing lines*/
    .mrslJ {
        border-bottom: 1px solid var(--gcal-dull-line-color) !important;
    }

    .Zlotdb + .FYEgid .XQINac {
        border-right: 1px solid var(--gcal-dull-line-color) !important;
    }

    .uJ4w1 {
        border-top: 1px solid var(--gcal-dull-line-color) !important;
        border-left: 1px solid var(--gcal-dull-line-color) !important;
    }

    /*Add guests input box*/
    .ULpymb {
        background-color: var(--gcal-enhanced2-background-color) !important;
    }

    /*Guest permisions text*/
    .hGcgEd, .GEhdLd {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Question mark popup box*/
    .EmURbc {
        background: var(--gcal-enhanced-background-color) !important;
    }

    /*Description Box*/
    .DyOaYd {
        background-color: var(--gcal-enhanced-background-color) !important;
        border: 1px solid var(--gcal-dark-line-color) !important;
    }

    /*Description Box icons*/
    .uOjlA, .qmMNRc {
        color: var(--gcal-primary-text-color) !important;
        opacity: 0.54 !important;
    }

    /*Description box dividing lines*/
    .PqAscf {
        border-left: 1px solid var(--gcal-dull-line-color) !important;
    }

    /*Description box "Add description" text*/
    .lR3h6d .snByac, .j3nyw {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Icons*/
    .tzcF6, .NMm5M {
        color: var(--gcal-primary-text-color) !important;
    }

    .aStPEd {
        color: var(--gcal-primary-text-color) !important;
        opacity: 0.54 !important;
    }

    /*Day and Date text on the Find A Time tab*/
    .oPF3Ce {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Calendar cannot be shown text*/
    .P1LEuc.srd2n {
        color: var(--gcal-dull-text-color) !important;
    }

    /*=======Reschedule Event=======*/
    /*Background color*/
    .McOO2b {
        background-color: var(--gcal-enhanced2-background-color) !important
    }

    /*Dividing line*/
    .YWILgc {
        border-top: solid 1px var(--gcal-primary-line-color) !important;
    }

    /*Text Color*/
    .qwM8de, div.YWILgc:nth-child(1) > div:nth-child(2) > div:nth-child(1) > span:nth-child(3) > span:nth-child(1) {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Button text colors*/
    .Uu2hsf.auswjd {
        color: var(--gcal-accent-color)
    }

    /*=======Time Drop Down List=======*/
    .VKy0Ic {
        background-color: var(--gcal-enhanced-background-color) !important;
    }

    .VKy0Ic[aria-selected="true"] {
        background-color: var(--gcal-enhanced2-background-color) !important;
    }

    /*=======Custom recurrence popup=======*/
    /*Background*/
    .g3VIld {
        background: var(--gcal-enhanced-background-color) !important;
    }

    /*Title text*/
    .tOrNgd, .O9Lx9e {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Other text*/
    .PbnGhe, .SDtMeb {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Entry text*/
    .WpDZC.zHQkBf {
        color: var(--gcal-primary-text-color) !important;
    }

    /*occurrences background*/
    .GY2CZb {
        background-color: var(--gcal-enhanced2-background-color) !important;
    }

    /*Cancel text*/
    .O0WRkf {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Done text*/
    .HQ8yf {
        color: var(--gcal-accent-color) !important;
    }

    /*Radio buttons*/
    .BHE4Yb .Id5V1, .BHE4Yb .nQOrEb {
        border-color: var(--gcal-accent-color) !important;
    }





    /*========================Settings Page========================*/
    /*Left side background*/
    .xWId8e {
        background-color: var(--gcal-primary-background-color) !important;
    }

    /*Right side background color*/
    .a0xMze {
        background: var(--gcal-primary-background-color) !important;
    }

    /*Setting group boxes background*/
    .MDfQ7 {
        background-color: var(--gcal-enhanced-background-color) !important;
        box-shadow: var(--gcal-box-shadow) !important;
        -moz-box-shadow: var(--gcal-box-shadow) !important;
    }

    /*Setting group boxes title text*/
    .O1gyfd {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Check boxes*/
    .uVccjd.wimXt {
        border-color: var(--gcal-accent-color) !important;
    }

    /*Check boxes text*/
    .VYaxId {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Other text*/
    .oj6B2e {
        color: var(--gcal-dull-text-color) !important;
    }

    /*Time zones link*/
    .oj6B2e a {
        color: var(--gcal-accent-color) !important;
    }

    /*Add Time Zone text*/
    .uFmiXb.RDPZE .snByac {
        color: var(--gcal-dull-text-color) !important;
    }

    .uFmiXb .snByac {
        color: var(--gcal-primary-text-color) !important;
    }

    /*=======Add New Calendar description box=======*/
    /*Background*/
    .Qfwgwb {
        background-color: var(--gcal-enhanced2-background-color) !important;
    }

    /*Text*/
    .rkOI {
        color: var(--gcal-primary-text-color) !important;
    }

    .LV4Pme.tL9Q4c {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Bottom Border*/
    .FaGtTe {
        background-color: var(--gcal-accent-color) !important;
    }

    /*=======Browse Calendars=======*/
    /*Calendars text*/
    .Ccr7Rb {
        color: var(--gcal-primary-text-color) !important;
    }

    /*=======Import/Export=======*/
    /*Import from computer box*/
    .Trypk {
        background-color: var(--gcal-enhanced2-background-color) !important;
    }

    /*Import from computer box icon and text*/
    .IZXV0b {
        color: var(--gcal-dull-text-color) !important;
    }

    /*Export calendars text*/
    .Z7IIl {
        color: var(--gcal-primary-text-color) !important;
    }

    /*=======Individual calendars settings=======*/
    /*Make available to public text*/
    .tMFP2b {
        color: var(--gcal-primary-text-color) !important;
    }

    /*before at text*/
    .zmOC3c {
        color: var(--gcal-primary-text-color) !important;
    }

    /*New events text*/
    .G9FGjf {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Calendar ID text*/
    .fey5Hf {
        color: var(--gcal-dull-text-color)
    }

    .JunSsb {
        color: var(--gcal-primary-text-color) !important;
    }

    /*Integrate calendar description text*/
    .bsCOTd {
        color: var(--gcal-dull-text-color) !important;
    }

    /*Fix for drop down boxes*/
    /*.HLI7qf {
        background-color: var(--gcal-enhanced-background-color) !important;
    }

    /*=====================*/
    /*========================Fixes for the Calendar widget in Gmail========================*/
    /*Fix more backgrounds*/
    .dKHeGf {
        background-color: var(--gcal-enhanced-background-color) !important;
    }

    /*All day checkbox*/
    /*#xAlDaCbx {
        border: 9px solid var(--gcal-accent-color) !important;
        opacity: 0.54 !important;
    }

    /*All day text*/
    .VfPpkd-I9GLp-yrriRe > label {
        color: var(--gcal-dull-text-color) !important;
        opacity: 0.54 !important;
    }

    /*Event notes*/
    .AKhndf {
        background-color: var(--gcal-enhanced2-background-color) !important;
    }

    #hInySc0 {
        color: var(--gcal-primary-text-color) !important;
    }
}

@-moz-document url-prefix("http://www.google.com/mail/"), url-prefix("https://www.google.com/mail/"), url-prefix("http://mail.google.com/"), url-prefix("https://mail.google.com/") {

    /*=============Formatting for the Calendar widget in Gmail=============*/
    /*Loading Screen Background*/
    .brC-brG, .brC-brG-Jz-bBA {
        background-color: var(--gcal-primary-background-color) !important;
    }

    /*Header Background*/
    .brC-brG-avC {
        background-color: var(--gcal-primary-background-color) !important;
    }

    /*Day and Date Text*/
    .brC-brG-a1P-bAa-a5b {
        color: var(--gcal-accent-color) !important;
    }

    /*Fix icons*/
    .brC-brG-avC-bta-atM .brC-brG-avC-bBo-JX {
        fill: var(--gcal-primary-text-color) !important;
    }
}