home/zentheme/userContent.css

/* Catppuccin Mocha Blue userContent.css*/

@media (prefers-color-scheme: dark) {
  @-moz-document url("about:newtab"), url("about:home") {

    :root{
    --newtab-background-color: #1e1e2e !important;
    --newtab-background-color-secondary: #313244 !important;
    --newtab-element-hover-color: #313244 !important;
    --newtab-text-primary-color: #cdd6f4 !important;
    --newtab-wordmark-color: #cdd6f4 !important;
    }

    .icon{
    color: #89b4fa !important;
    }

    body {
    background-color: #1e1e2e !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-mocha.svg") , url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Mocha/Blue/zen-logo-mocha.svg") no-repeat center !important;
      display: inline-block !important;
      height: 82px !important;
      width: 82px !important;
      background-size: 82px !important;
    }

    @media (max-width: 609px) {
      .search-wrapper .logo-and-wordmark .logo {
        background-size: 64px !important;
        height: 64px !important;
        width: 64px !important;
      }
    }

    .card-outer:is(:hover, :focus, .active):not(.placeholder) .card-title{
      color: #89b4fa !important;
    }

    .top-site-outer .search-topsite{
      background-color: #89b4fa !important;
    }

    .compact-cards .card-outer .card-context .card-context-icon.icon-download{
      fill: #a6e3a1 !important;
    }

  }


  @-moz-document url-prefix("about:preferences"){
    :root{
    --zen-colors-tertiary: #181825 !important;
    --in-content-text-color: #cdd6f4 !important;
    --link-color: #89b4fa !important;
    --link-color-hover: rgb(151, 138, 250) !important;
    --color-accent-primary: #89b4fa !important;
    --color-accent-primary-hover: rgb(151, 138, 250) !important;
    }

    groupbox{
    background: #1e1e2e !important;
    }

    groupbox button, groupbox menulist {
    background: #313244 !important;
    color: #cdd6f4 !important;
    }

    .main-content{
    background-color: #11111b !important;
    }
  }

  @-moz-document url-prefix("about:addons") {
    :root{
      --zen-dark-color-mix-base: #181825 !important;
      --in-content-page-color: #cdd6f4 !important;
      --background-color-box: #1e1e2e !important;
      --color-accent-primary: #89b4fa !important;
      --color-accent-primary-hover: rgb(151, 138, 250) !important;
    }
  }
}

/* Catppuccin Latte Blue userContent.css*/

@media (prefers-color-scheme: light) {
  @-moz-document url("about:newtab"), url("about:home") {

    :root{
    --newtab-background-color: #eff1f5 !important;
    --newtab-background-color-secondary: #ccd0da !important;
    --newtab-element-hover-color: #ccd0da !important;
    --newtab-text-primary-color: #4c4f69 !important;
    --newtab-wordmark-color: #4c4f69 !important;
    }

    .icon{
    color: #1e66f5 !important;
    }

    body {
    background-color: #eff1f5 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-latte.svg") , url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Latte/Blue/zen-logo-latte.svg") no-repeat center !important;
      display: inline-block !important;
      height: 82px !important;
      width: 82px !important;
      background-size: 82px !important;
    }

    @media (max-width: 609px) {
      .search-wrapper .logo-and-wordmark .logo {
        background-size: 64px !important;
        height: 64px !important;
        width: 64px !important;
      }
    }

    .card-outer:is(:hover, :focus, .active):not(.placeholder) .card-title{
      color: #1e66f5 !important;
    }

    .top-site-outer .search-topsite{
      background-color: #1e66f5 !important;
    }

    .compact-cards .card-outer .card-context .card-context-icon.icon-download{
      fill: #40a02b !important;
    }

  }


  @-moz-document url-prefix("about:preferences"){
    :root{
    --zen-colors-tertiary: #e6e9ef !important;
    --in-content-text-color: #4c4f69 !important;
    --link-color: #1e66f5 !important;
    --link-color-hover: rgb(67, 31, 245) !important;
    --color-accent-primary: #1e66f5 !important;
    --color-accent-primary-hover: rgb(67, 31, 245) !important;
    }

    groupbox{
    background: #eff1f5 !important;
    }

    groupbox button, groupbox menulist {
    background: #ccd0da !important;
    color: #4c4f69 !important;
    }

    .main-content{
    background-color: #dce0e8 !important;
    }
  }

  @-moz-document url-prefix("about:addons") {
    :root{
      --zen-dark-color-mix-base: #e6e9ef !important;
      --in-content-page-color: #4c4f69 !important;
      --background-color-box: #eff1f5 !important;
      --color-accent-primary: #1e66f5 !important;
      --color-accent-primary-hover: rgb(67, 31, 245) !important;
    }
  }
}