window.background.chromium {
    background-color: gtk("@theme_base_color");
    border-color: gtk("@borders");
    menubar, .menubar {
        color: gtk("@theme_fg_color");
        background-color: gtk("@theme_bg_color");
        &:backdrop {
            background-color: gtk("@theme_unfocused_bg_color");    
            color: gtk("@theme_unfocused_fg_color");
        }
    }
    entry {
        background-color: gtk("@theme_base_color");
    }
    &.csd {
        menubar, .menubar {
            color: gtk("@theme_titlebar_foreground");
            background-color: gtk("@theme_titlebar_background");
            &:backdrop {
                background-color: gtk("@theme_titlebar_background_backdrop"); 
                color: gtk("@theme_titlebar_foreground_backdrop");
            }
        }
    }
    
    headerbar,
    .titlebar {
      button.titlebutton {    
        &.close {
          color: transparent;
          background-image: -gtk-scaled(url('../assets/titlebutton-close.png'),url('../assets/titlebutton-close@2.png'));
          &:hover {
            background-image: -gtk-scaled(url('../assets/titlebutton-close-hover.png'),url('../assets/titlebutton-close-hover@2.png'));
          }
          &:active {
            background-image: -gtk-scaled(url('../assets/titlebutton-close-active.png'),url('../assets/titlebutton-close-active@2.png'));
          }
          &:backdrop {
            background-image: -gtk-scaled(url('../assets/titlebutton-close-backdrop.png'),url('../assets/titlebutton-close-backdrop@2.png'));
          }
        }
    
        &.maximize {
          color: transparent;
          background-image: -gtk-scaled(url('../assets/titlebutton-maximize.png'),url('../assets/titlebutton-maximize@2.png'));
          &:hover {
            background-image: -gtk-scaled(url('../assets/titlebutton-maximize-hover.png'),url('../assets/titlebutton-maximize-hover@2.png'));
          }
          &:active {
            background-image: -gtk-scaled(url('../assets/titlebutton-maximize-active.png'),url('../assets/titlebutton-maximize-active@2.png'));
          }
          &:backdrop {
            background-image: -gtk-scaled(url('../assets/titlebutton-maximize-backdrop.png'),url('../assets/titlebutton-maximize-backdrop@2.png'));
          }
        }    
        &.minimize {
          color: transparent;
          background-image: -gtk-scaled(url('../assets/titlebutton-minimize.png'),url('../assets/titlebutton-minimize@2.png'));
          &:hover {
            background-image: -gtk-scaled(url('../assets/titlebutton-minimize-hover.png'),url('../assets/titlebutton-minimize-hover@2.png'));
          }
          &:active {
            background-image: -gtk-scaled(url('../assets/titlebutton-minimize-active.png'),url('../assets/titlebutton-minimize-active@2.png'));
          }
          &:backdrop {
            background-image: -gtk-scaled(url('../assets/titlebutton-minimize-backdrop.png'),url('../assets/titlebutton-minimize-backdrop@2.png'));
          }
        }
      }
    
      @at-root window.background.chromium.maximized headerbar, .maximized .titlebar {
        button.titlebutton {
          &.maximize {
            color: transparent;
            background-image: -gtk-scaled(url('../assets/titlebutton-maximize-maximized.png'),url('../assets/titlebutton-maximize-maximized@2.png'));
            &:hover {
              background-image: -gtk-scaled(url('../assets/titlebutton-maximize-maximized-hover.png'),url('../assets/titlebutton-maximize-maximized-hover@2.png'));
            }
            &:active {
              background-image: -gtk-scaled(url('../assets/titlebutton-maximize-maximized-active.png'),url('../assets/titlebutton-maximize-maximized-active@2.png'));
            }
            &:backdrop {
              background-image: -gtk-scaled(url('../assets/titlebutton-maximize-maximized-backdrop.png'),url('../assets/titlebutton-maximize-maximized-backdrop@2.png'));
            }
          }
        }
      }
    }
}
