Repository: catppuccin/zen-browser
Branch: main
Commit: c855685442c6
Files: 121
Total size: 456.9 KB

Directory structure:
gitextract_o6c22_ku/

├── .editorconfig
├── .github/
│   └── workflows/
│       └── whiskers-check.yml
├── .gitignore
├── LICENSE
├── README.md
├── renovate.json
├── templates/
│   ├── userChrome.tera
│   ├── userContent.tera
│   └── zen-logo.tera
└── themes/
    ├── Frappe/
    │   ├── Blue/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Flamingo/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Green/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Lavender/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Maroon/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Mauve/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Peach/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Pink/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Red/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Rosewater/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Sapphire/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Sky/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Teal/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   └── Yellow/
    │       ├── userChrome.css
    │       └── userContent.css
    ├── Latte/
    │   ├── Blue/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Flamingo/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Green/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Lavender/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Maroon/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Mauve/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Peach/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Pink/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Red/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Rosewater/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Sapphire/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Sky/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Teal/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   └── Yellow/
    │       ├── userChrome.css
    │       └── userContent.css
    ├── Macchiato/
    │   ├── Blue/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Flamingo/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Green/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Lavender/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Maroon/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Mauve/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Peach/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Pink/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Red/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Rosewater/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Sapphire/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Sky/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   ├── Teal/
    │   │   ├── userChrome.css
    │   │   └── userContent.css
    │   └── Yellow/
    │       ├── userChrome.css
    │       └── userContent.css
    └── Mocha/
        ├── Blue/
        │   ├── userChrome.css
        │   └── userContent.css
        ├── Flamingo/
        │   ├── userChrome.css
        │   └── userContent.css
        ├── Green/
        │   ├── userChrome.css
        │   └── userContent.css
        ├── Lavender/
        │   ├── userChrome.css
        │   └── userContent.css
        ├── Maroon/
        │   ├── userChrome.css
        │   └── userContent.css
        ├── Mauve/
        │   ├── userChrome.css
        │   └── userContent.css
        ├── Peach/
        │   ├── userChrome.css
        │   └── userContent.css
        ├── Pink/
        │   ├── userChrome.css
        │   └── userContent.css
        ├── Red/
        │   ├── userChrome.css
        │   └── userContent.css
        ├── Rosewater/
        │   ├── userChrome.css
        │   └── userContent.css
        ├── Sapphire/
        │   ├── userChrome.css
        │   └── userContent.css
        ├── Sky/
        │   ├── userChrome.css
        │   └── userContent.css
        ├── Teal/
        │   ├── userChrome.css
        │   └── userContent.css
        └── Yellow/
            ├── userChrome.css
            └── userContent.css

================================================
FILE CONTENTS
================================================

================================================
FILE: .editorconfig
================================================
# EditorConfig helps developers define and maintain consistent
# coding styles between different editors and IDEs
# EditorConfig is awesome: https://EditorConfig.org

root = true

[*]
charset = utf-8
indent_size = 2
indent_style = space
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true

# go
[*.go]
indent_style = tab
indent_size = 4

# python
[*.{ini,py,py.tpl,rst}]
indent_size = 4

# rust
[*.rs]
indent_size = 4

# documentation, utils
[*.{md,mdx,diff}]
trim_trailing_whitespace = false

# windows shell scripts
[*.{cmd,bat,ps1}]
end_of_line = crlf

================================================
FILE: .github/workflows/whiskers-check.yml
================================================
name: whiskers

on:
  workflow_dispatch:
  push:
    branches: [main]
  pull_request:
    branches: [main]

jobs:
  run:
    uses: catppuccin/actions/.github/workflows/whiskers-check.yml@v1
    with:
      args: |
        templates/userChrome.tera
        templates/userContent.tera
        templates/zen-logo.tera
    secrets: inherit


================================================
FILE: .gitignore
================================================
.DS_Store
**/.DS_Store

================================================
FILE: LICENSE
================================================
MIT License

Copyright (c) 2021 Catppuccin

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.


================================================
FILE: README.md
================================================
<h3 align="center">
	<img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/logos/exports/1544x1544_circle.png" width="100" alt="Logo"/><br/>
	<img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/misc/transparent.png" height="30" width="0px"/>
	Catppuccin for <a href="https://zen-browser.app/">Zen Browser</a>
	<img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/misc/transparent.png" height="30" width="0px"/>
</h3>

<p align="center">
	<a href="https://github.com/catppuccin/zen-browser/stargazers"><img src="https://img.shields.io/github/stars/catppuccin/zen-browser?colorA=363a4f&colorB=b7bdf8&style=for-the-badge"></a>
	<a href="https://github.com/catppuccin/zen-browser/issues"><img src="https://img.shields.io/github/issues/catppuccin/zen-browser?colorA=363a4f&colorB=f5a97f&style=for-the-badge"></a>
	<a href="https://github.com/catppuccin/zen-browser/contributors"><img src="https://img.shields.io/github/contributors/catppuccin/zen-browser?colorA=363a4f&colorB=a6da95&style=for-the-badge"></a>
</p>

<p align="center">
	<img src="assets/preview.webp"/>
</p>

## Previews

<details>
<summary>🌻 Latte</summary>
<img src="assets/latte.webp"/>
</details>
<details>
<summary>🪴 Frappé</summary>
<img src="assets/frappe.webp"/>
</details>
<details>
<summary>🌺 Macchiato</summary>
<img src="assets/macchiato.webp"/>
</details>
<details>
<summary>🌿 Mocha</summary>
<img src="assets/mocha.webp"/>
</details>

## Usage

1. [Create a `chrome` folder](https://www.userchrome.org/how-create-userchrome-css.html) in your Zen Browser's profile directory and configure it to enable userstyles.
2. Copy the `userChrome.css`, `userContent.css`, and `zen-logo.svg` files of your preferred theme from the [`themes/`](themes/) directory in this repository to your `chrome` folder.
3. Enable `toolkit.legacyUserProfileCustomizations.stylesheets` in [about:config](about:config).

> [!NOTE]
> If you're using the [🌻 Latte](themes/Latte/) theme, set your browser to light mode. For [🪴 Frappé](themes/Frappe/), [🌺 Macchiato](themes/Macchiato/), or [🌿 Mocha](themes/Mocha/), enable dark mode to apply the theme correctly.

## 🙋 FAQ

- **Q:** What if I already have a `userChrome.css` and/or `userContent.css` configuration?
  
  **A:** You can copy and paste the content of our `userChrome.css` and/or `userContent.css` files into your existing ones. This way, you can keep your current configurations while applying the new theme settings.

- **Q:** Can I automatically switch flavors between light and dark mode?
  
  **A:** Yes! You can concatenate the `userChrome.css` and `userContent.css` files for 🌻 Latte (light mode) along with one of the dark mode themes like 🪴 Frappé, 🌺 Macchiato, or 🌿 Mocha. The browser will automatically switch between these themes when toggling between light and dark mode.

## 💝 Thanks to

- [IAmJafeth](https://github.com/IAmJafeth)

&nbsp;

<p align="center">
	<img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/footers/gray0_ctp_on_line.svg?sanitize=true" />
</p>

<p align="center">
	Copyright &copy; 2021-present <a href="https://github.com/catppuccin" target="_blank">Catppuccin Org</a>
</p>

<p align="center">
	<a href="https://github.com/catppuccin/catppuccin/blob/main/LICENSE"><img src="https://img.shields.io/static/v1.svg?style=for-the-badge&label=License&message=MIT&logoColor=d9e0ee&colorA=363a4f&colorB=b7bdf8"/></a>
</p>


================================================
FILE: renovate.json
================================================
{
  "$schema": "https://docs.renovatebot.com/renovate-schema.json",
  "extends": [
    "local>catppuccin/renovate-config"
  ]
}


================================================
FILE: templates/userChrome.tera
================================================
---
whiskers:
  version: ^2.5.1
  matrix:
    - accent
    - flavor
  filename: "themes/{{ flavor.identifier | capitalize}}/{{ accent | capitalize }}/userChrome.css"
---
{%- set palette = flavor.colors -%}

/* Catppuccin {{flavor.identifier | capitalize}} {{accent | capitalize}} userChrome.css*/

@media (prefers-color-scheme: {{ if(cond=flavor.dark, t="dark", f="light") }}) {
  :root {
    --zen-colors-primary: #{{ surface0.hex }} !important;
    --zen-primary-color: #{{ palette[accent].hex }} !important;
    --zen-colors-secondary: #{{ surface0.hex }} !important;
    --zen-colors-tertiary: #{{ mantle.hex }} !important;
    --zen-colors-border: #{{ palette[accent].hex }} !important;
    --toolbarbutton-icon-fill: #{{ palette[accent].hex }} !important;
    --lwt-text-color: #{{ text.hex }} !important;
    --toolbar-field-color: #{{ text.hex }} !important;
    --tab-selected-textcolor: {{ palette[accent] | mix(color=text, amount=0.5) | css_rgb}} !important;
    --toolbar-field-focus-color: #{{ text.hex }} !important;
    --toolbar-color: #{{ text.hex }} !important;
    --newtab-text-primary-color: #{{ text.hex }} !important;
    --arrowpanel-color: #{{ text.hex }} !important;
    --arrowpanel-background: #{{ base.hex }} !important;
    --sidebar-text-color: #{{ text.hex }} !important;
    --lwt-sidebar-text-color: #{{ text.hex }} !important;
    --lwt-sidebar-background-color: #{{ crust.hex }} !important;
    --toolbar-bgcolor: #{{ surface0.hex }} !important;
    --newtab-background-color: #{{ base.hex }} !important;
    --zen-themed-toolbar-bg: #{{ mantle.hex }} !important;
    --zen-main-browser-background: #{{ mantle.hex }} !important;
    --toolbox-bgcolor-inactive: #{{ mantle.hex }} !important;
  }

  #permissions-granted-icon {
    color: #{{ mantle.hex }} !important;
  }

  .sidebar-placesTree {
    background-color: #{{ base.hex }} !important;
  }

  #zen-workspaces-button {
    background-color: #{{ base.hex }} !important;
  }

  #TabsToolbar {
    background-color: #{{ mantle.hex }} !important;
  }

  .urlbar-background {
    background-color: #{{ base.hex }} !important;
  }

  .content-shortcuts {
    background-color: #{{ base.hex }} !important;
    border-color: #{{ palette[accent].hex }} !important;
  }

  .urlbarView-url {
    color: #{{ palette[accent].hex }} !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #{{ crust.hex }} !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #{{ surface0.hex }} !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #{{ crust.hex }};
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #{{ blue.hex }} !important;
    --identity-icon-color: #{{ blue.hex }} !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #{{ teal.hex }} !important;
    --identity-icon-color: #{{ teal.hex }} !important;
  }

  .identity-color-green {
    --identity-tab-color: #{{ green.hex }} !important;
    --identity-icon-color: #{{ green.hex }} !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #{{ yellow.hex }} !important;
    --identity-icon-color: #{{ yellow.hex }} !important;
  }

  .identity-color-orange {
    --identity-tab-color: #{{ peach.hex }} !important;
    --identity-icon-color: #{{ peach.hex }} !important;
  }

  .identity-color-red {
    --identity-tab-color: #{{ red.hex }} !important;
    --identity-icon-color: #{{ red.hex }} !important;
  }

  .identity-color-pink {
    --identity-tab-color: #{{ pink.hex }} !important;
    --identity-icon-color: #{{ pink.hex }} !important;
  }

  .identity-color-purple {
    --identity-tab-color: #{{ mauve.hex }} !important;
    --identity-icon-color: #{{ mauve.hex }} !important;
  }

  hbox#titlebar {
    background-color: #{{ mantle.hex }} !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #{{ mantle.hex }} !important;
  }
}


================================================
FILE: templates/userContent.tera
================================================
---
whiskers:
  version: ^2.5.1
  matrix:
    - accent
    - flavor
  filename: "themes/{{ flavor.identifier | capitalize}}/{{ accent | capitalize }}/userContent.css"
---
{%- set palette = flavor.colors -%}

/* Catppuccin {{flavor.identifier | capitalize}} {{accent | capitalize}} userContent.css*/

@media (prefers-color-scheme: {{ if(cond=flavor.dark, t="dark", f="light") }}) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #{{ text.hex }} !important;
      --color-accent-primary: #{{ palette[accent].hex }} !important;
      --color-accent-primary-hover: {{ palette[accent] | add(lightness=5) | css_rgb }} !important;
      --color-accent-primary-active: {{ palette[accent] | add(hue=15) | css_rgb}} !important;
      background-color: #{{ base.hex }} !important;
      --in-content-page-background: #{{ base.hex }} !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #{{ base.hex }} !important;
      --newtab-background-color-secondary: #{{ surface0.hex }} !important;
      --newtab-element-hover-color: #{{ surface0.hex }} !important;
      --newtab-text-primary-color: #{{ text.hex }} !important;
      --newtab-wordmark-color: #{{ text.hex }} !important;
      --newtab-primary-action-background: #{{palette[accent].hex}} !important;
    }

    .icon {
      color: #{{ palette[accent].hex }} !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-{{ flavor.identifier }}.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/{{ flavor.identifier | capitalize}}/{{ accent | capitalize }}/zen-logo-{{ flavor.identifier }}.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: #{{ palette[accent].hex }} !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #{{ mantle.hex }} !important;
      --in-content-text-color: #{{ text.hex }} !important;
      --link-color: #{{ palette[accent].hex }} !important;
      --link-color-hover: {{ palette[accent] | add(lightness=5) | css_rgb }} !important;
      --zen-colors-primary: #{{ surface0.hex }} !important;
      --in-content-box-background: #{{ surface0.hex }} !important;
      --zen-primary-color: #{{ palette[accent].hex }} !important;
    }

    groupbox , moz-card{
      background: #{{ base.hex }} !important;
    }

    button,
    groupbox menulist {
      background: #{{ surface0.hex }} !important;
      color: #{{ text.hex }} !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #{{ mantle.hex }} !important;
      --background-color-box: #{{ base.hex }} !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #{{ base.hex }} !important;
      --social-color: #{{ mauve.hex }} !important;
      --coockie-color: #{{ sky.hex }} !important;
      --fingerprinter-color: #{{ yellow.hex }} !important;
      --cryptominer-color: #{{ lavender.hex }} !important;
      --tracker-color: #{{ green.hex }} !important;
      --in-content-primary-button-background-hover: {{ surface1 | add(lightness=5) | css_rgb }} !important;
      --in-content-primary-button-text-color-hover: #{{ text.hex }} !important;
      --in-content-primary-button-background: #{{ surface1.hex }} !important;
      --in-content-primary-button-text-color: #{{ text.hex }} !important;
    }


    .card {
      background-color: #{{ surface0.hex }} !important;
    }
  }
}


================================================
FILE: templates/zen-logo.tera
================================================
---
whiskers:
  version: ^2.5.1
  matrix:
    - accent
    - flavor
  filename: "themes/{{ flavor.identifier | capitalize}}/{{ accent | capitalize }}/zen-logo-{{ flavor.identifier }}.svg"
---
{%- set palette = flavor.colors -%}

<svg width="1024" height="1024" viewBox="0 0 1024 1024" fill="none" xmlns="http://www.w3.org/2000/svg">
  <g clip-path="url(#clip0_15_9)">
    <rect width="1024" height="1024" rx="225" fill="#{{crust.hex}}"/>
    <circle cx="512" cy="512" r="340" stroke="#{{text.hex}}" stroke-width="70"/>
    <circle cx="512" cy="512" r="224.915" stroke="#{{text.hex}}" stroke-width="51"/>
    <circle cx="512" cy="512" r="129.018" stroke="#{{text.hex}}" stroke-width="31"/>
  </g>
  <defs>
    <clipPath id="clip0_15_9">
      <rect width="1024" height="1024" fill="white"/>
    </clipPath>
  </defs>
</svg>


================================================
FILE: themes/Frappe/Blue/userChrome.css
================================================
/* Catppuccin Frappe Blue userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #414559 !important;
    --zen-primary-color: #8caaee !important;
    --zen-colors-secondary: #414559 !important;
    --zen-colors-tertiary: #292c3c !important;
    --zen-colors-border: #8caaee !important;
    --toolbarbutton-icon-fill: #8caaee !important;
    --lwt-text-color: #c6d0f5 !important;
    --toolbar-field-color: #c6d0f5 !important;
    --tab-selected-textcolor: rgb(169, 189, 241) !important;
    --toolbar-field-focus-color: #c6d0f5 !important;
    --toolbar-color: #c6d0f5 !important;
    --newtab-text-primary-color: #c6d0f5 !important;
    --arrowpanel-color: #c6d0f5 !important;
    --arrowpanel-background: #303446 !important;
    --sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-background-color: #232634 !important;
    --toolbar-bgcolor: #414559 !important;
    --newtab-background-color: #303446 !important;
    --zen-themed-toolbar-bg: #292c3c !important;
    --zen-main-browser-background: #292c3c !important;
    --toolbox-bgcolor-inactive: #292c3c !important;
  }

  #permissions-granted-icon {
    color: #292c3c !important;
  }

  .sidebar-placesTree {
    background-color: #303446 !important;
  }

  #zen-workspaces-button {
    background-color: #303446 !important;
  }

  #TabsToolbar {
    background-color: #292c3c !important;
  }

  .urlbar-background {
    background-color: #303446 !important;
  }

  .content-shortcuts {
    background-color: #303446 !important;
    border-color: #8caaee !important;
  }

  .urlbarView-url {
    color: #8caaee !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #232634 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #414559 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #232634;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8caaee !important;
    --identity-icon-color: #8caaee !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #81c8be !important;
    --identity-icon-color: #81c8be !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6d189 !important;
    --identity-icon-color: #a6d189 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #e5c890 !important;
    --identity-icon-color: #e5c890 !important;
  }

  .identity-color-orange {
    --identity-tab-color: #ef9f76 !important;
    --identity-icon-color: #ef9f76 !important;
  }

  .identity-color-red {
    --identity-tab-color: #e78284 !important;
    --identity-icon-color: #e78284 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f4b8e4 !important;
    --identity-icon-color: #f4b8e4 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #ca9ee6 !important;
    --identity-icon-color: #ca9ee6 !important;
  }

  hbox#titlebar {
    background-color: #292c3c !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #292c3c !important;
  }
}


================================================
FILE: themes/Frappe/Blue/userContent.css
================================================
/* Catppuccin Frappe Blue userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #c6d0f5 !important;
      --color-accent-primary: #8caaee !important;
      --color-accent-primary-hover: rgb(163, 186, 241) !important;
      --color-accent-primary-active: rgb(140, 145, 238) !important;
      background-color: #303446 !important;
      --in-content-page-background: #303446 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #303446 !important;
      --newtab-background-color-secondary: #414559 !important;
      --newtab-element-hover-color: #414559 !important;
      --newtab-text-primary-color: #c6d0f5 !important;
      --newtab-wordmark-color: #c6d0f5 !important;
      --newtab-primary-action-background: #8caaee !important;
    }

    .icon {
      color: #8caaee !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-frappe.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Frappe/Blue/zen-logo-frappe.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: #8caaee !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #292c3c !important;
      --in-content-text-color: #c6d0f5 !important;
      --link-color: #8caaee !important;
      --link-color-hover: rgb(163, 186, 241) !important;
      --zen-colors-primary: #414559 !important;
      --in-content-box-background: #414559 !important;
      --zen-primary-color: #8caaee !important;
    }

    groupbox , moz-card{
      background: #303446 !important;
    }

    button,
    groupbox menulist {
      background: #414559 !important;
      color: #c6d0f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #292c3c !important;
      --background-color-box: #303446 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #303446 !important;
      --social-color: #ca9ee6 !important;
      --coockie-color: #99d1db !important;
      --fingerprinter-color: #e5c890 !important;
      --cryptominer-color: #babbf1 !important;
      --tracker-color: #a6d189 !important;
      --in-content-primary-button-background-hover: rgb(92, 99, 124) !important;
      --in-content-primary-button-text-color-hover: #c6d0f5 !important;
      --in-content-primary-button-background: #51576d !important;
      --in-content-primary-button-text-color: #c6d0f5 !important;
    }


    .card {
      background-color: #414559 !important;
    }
  }
}


================================================
FILE: themes/Frappe/Flamingo/userChrome.css
================================================
/* Catppuccin Frappe Flamingo userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #414559 !important;
    --zen-primary-color: #eebebe !important;
    --zen-colors-secondary: #414559 !important;
    --zen-colors-tertiary: #292c3c !important;
    --zen-colors-border: #eebebe !important;
    --toolbarbutton-icon-fill: #eebebe !important;
    --lwt-text-color: #c6d0f5 !important;
    --toolbar-field-color: #c6d0f5 !important;
    --tab-selected-textcolor: rgb(218, 199, 217) !important;
    --toolbar-field-focus-color: #c6d0f5 !important;
    --toolbar-color: #c6d0f5 !important;
    --newtab-text-primary-color: #c6d0f5 !important;
    --arrowpanel-color: #c6d0f5 !important;
    --arrowpanel-background: #303446 !important;
    --sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-background-color: #232634 !important;
    --toolbar-bgcolor: #414559 !important;
    --newtab-background-color: #303446 !important;
    --zen-themed-toolbar-bg: #292c3c !important;
    --zen-main-browser-background: #292c3c !important;
    --toolbox-bgcolor-inactive: #292c3c !important;
  }

  #permissions-granted-icon {
    color: #292c3c !important;
  }

  .sidebar-placesTree {
    background-color: #303446 !important;
  }

  #zen-workspaces-button {
    background-color: #303446 !important;
  }

  #TabsToolbar {
    background-color: #292c3c !important;
  }

  .urlbar-background {
    background-color: #303446 !important;
  }

  .content-shortcuts {
    background-color: #303446 !important;
    border-color: #eebebe !important;
  }

  .urlbarView-url {
    color: #eebebe !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #232634 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #414559 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #232634;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8caaee !important;
    --identity-icon-color: #8caaee !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #81c8be !important;
    --identity-icon-color: #81c8be !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6d189 !important;
    --identity-icon-color: #a6d189 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #e5c890 !important;
    --identity-icon-color: #e5c890 !important;
  }

  .identity-color-orange {
    --identity-tab-color: #ef9f76 !important;
    --identity-icon-color: #ef9f76 !important;
  }

  .identity-color-red {
    --identity-tab-color: #e78284 !important;
    --identity-icon-color: #e78284 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f4b8e4 !important;
    --identity-icon-color: #f4b8e4 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #ca9ee6 !important;
    --identity-icon-color: #ca9ee6 !important;
  }

  hbox#titlebar {
    background-color: #292c3c !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #292c3c !important;
  }
}


================================================
FILE: themes/Frappe/Flamingo/userContent.css
================================================
/* Catppuccin Frappe Flamingo userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #c6d0f5 !important;
      --color-accent-primary: #eebebe !important;
      --color-accent-primary-hover: rgb(243, 211, 211) !important;
      --color-accent-primary-active: rgb(238, 202, 190) !important;
      background-color: #303446 !important;
      --in-content-page-background: #303446 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #303446 !important;
      --newtab-background-color-secondary: #414559 !important;
      --newtab-element-hover-color: #414559 !important;
      --newtab-text-primary-color: #c6d0f5 !important;
      --newtab-wordmark-color: #c6d0f5 !important;
      --newtab-primary-action-background: #eebebe !important;
    }

    .icon {
      color: #eebebe !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-frappe.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Frappe/Flamingo/zen-logo-frappe.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: #eebebe !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #292c3c !important;
      --in-content-text-color: #c6d0f5 !important;
      --link-color: #eebebe !important;
      --link-color-hover: rgb(243, 211, 211) !important;
      --zen-colors-primary: #414559 !important;
      --in-content-box-background: #414559 !important;
      --zen-primary-color: #eebebe !important;
    }

    groupbox , moz-card{
      background: #303446 !important;
    }

    button,
    groupbox menulist {
      background: #414559 !important;
      color: #c6d0f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #292c3c !important;
      --background-color-box: #303446 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #303446 !important;
      --social-color: #ca9ee6 !important;
      --coockie-color: #99d1db !important;
      --fingerprinter-color: #e5c890 !important;
      --cryptominer-color: #babbf1 !important;
      --tracker-color: #a6d189 !important;
      --in-content-primary-button-background-hover: rgb(92, 99, 124) !important;
      --in-content-primary-button-text-color-hover: #c6d0f5 !important;
      --in-content-primary-button-background: #51576d !important;
      --in-content-primary-button-text-color: #c6d0f5 !important;
    }


    .card {
      background-color: #414559 !important;
    }
  }
}


================================================
FILE: themes/Frappe/Green/userChrome.css
================================================
/* Catppuccin Frappe Green userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #414559 !important;
    --zen-primary-color: #a6d189 !important;
    --zen-colors-secondary: #414559 !important;
    --zen-colors-tertiary: #292c3c !important;
    --zen-colors-border: #a6d189 !important;
    --toolbarbutton-icon-fill: #a6d189 !important;
    --lwt-text-color: #c6d0f5 !important;
    --toolbar-field-color: #c6d0f5 !important;
    --tab-selected-textcolor: rgb(182, 209, 191) !important;
    --toolbar-field-focus-color: #c6d0f5 !important;
    --toolbar-color: #c6d0f5 !important;
    --newtab-text-primary-color: #c6d0f5 !important;
    --arrowpanel-color: #c6d0f5 !important;
    --arrowpanel-background: #303446 !important;
    --sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-background-color: #232634 !important;
    --toolbar-bgcolor: #414559 !important;
    --newtab-background-color: #303446 !important;
    --zen-themed-toolbar-bg: #292c3c !important;
    --zen-main-browser-background: #292c3c !important;
    --toolbox-bgcolor-inactive: #292c3c !important;
  }

  #permissions-granted-icon {
    color: #292c3c !important;
  }

  .sidebar-placesTree {
    background-color: #303446 !important;
  }

  #zen-workspaces-button {
    background-color: #303446 !important;
  }

  #TabsToolbar {
    background-color: #292c3c !important;
  }

  .urlbar-background {
    background-color: #303446 !important;
  }

  .content-shortcuts {
    background-color: #303446 !important;
    border-color: #a6d189 !important;
  }

  .urlbarView-url {
    color: #a6d189 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #232634 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #414559 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #232634;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8caaee !important;
    --identity-icon-color: #8caaee !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #81c8be !important;
    --identity-icon-color: #81c8be !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6d189 !important;
    --identity-icon-color: #a6d189 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #e5c890 !important;
    --identity-icon-color: #e5c890 !important;
  }

  .identity-color-orange {
    --identity-tab-color: #ef9f76 !important;
    --identity-icon-color: #ef9f76 !important;
  }

  .identity-color-red {
    --identity-tab-color: #e78284 !important;
    --identity-icon-color: #e78284 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f4b8e4 !important;
    --identity-icon-color: #f4b8e4 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #ca9ee6 !important;
    --identity-icon-color: #ca9ee6 !important;
  }

  hbox#titlebar {
    background-color: #292c3c !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #292c3c !important;
  }
}


================================================
FILE: themes/Frappe/Green/userContent.css
================================================
/* Catppuccin Frappe Green userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #c6d0f5 !important;
      --color-accent-primary: #a6d189 !important;
      --color-accent-primary-hover: rgb(180, 216, 156) !important;
      --color-accent-primary-active: rgb(148, 209, 137) !important;
      background-color: #303446 !important;
      --in-content-page-background: #303446 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #303446 !important;
      --newtab-background-color-secondary: #414559 !important;
      --newtab-element-hover-color: #414559 !important;
      --newtab-text-primary-color: #c6d0f5 !important;
      --newtab-wordmark-color: #c6d0f5 !important;
      --newtab-primary-action-background: #a6d189 !important;
    }

    .icon {
      color: #a6d189 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-frappe.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Frappe/Green/zen-logo-frappe.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: #a6d189 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #292c3c !important;
      --in-content-text-color: #c6d0f5 !important;
      --link-color: #a6d189 !important;
      --link-color-hover: rgb(180, 216, 156) !important;
      --zen-colors-primary: #414559 !important;
      --in-content-box-background: #414559 !important;
      --zen-primary-color: #a6d189 !important;
    }

    groupbox , moz-card{
      background: #303446 !important;
    }

    button,
    groupbox menulist {
      background: #414559 !important;
      color: #c6d0f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #292c3c !important;
      --background-color-box: #303446 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #303446 !important;
      --social-color: #ca9ee6 !important;
      --coockie-color: #99d1db !important;
      --fingerprinter-color: #e5c890 !important;
      --cryptominer-color: #babbf1 !important;
      --tracker-color: #a6d189 !important;
      --in-content-primary-button-background-hover: rgb(92, 99, 124) !important;
      --in-content-primary-button-text-color-hover: #c6d0f5 !important;
      --in-content-primary-button-background: #51576d !important;
      --in-content-primary-button-text-color: #c6d0f5 !important;
    }


    .card {
      background-color: #414559 !important;
    }
  }
}


================================================
FILE: themes/Frappe/Lavender/userChrome.css
================================================
/* Catppuccin Frappe Lavender userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #414559 !important;
    --zen-primary-color: #babbf1 !important;
    --zen-colors-secondary: #414559 !important;
    --zen-colors-tertiary: #292c3c !important;
    --zen-colors-border: #babbf1 !important;
    --toolbarbutton-icon-fill: #babbf1 !important;
    --lwt-text-color: #c6d0f5 !important;
    --toolbar-field-color: #c6d0f5 !important;
    --tab-selected-textcolor: rgb(192, 198, 243) !important;
    --toolbar-field-focus-color: #c6d0f5 !important;
    --toolbar-color: #c6d0f5 !important;
    --newtab-text-primary-color: #c6d0f5 !important;
    --arrowpanel-color: #c6d0f5 !important;
    --arrowpanel-background: #303446 !important;
    --sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-background-color: #232634 !important;
    --toolbar-bgcolor: #414559 !important;
    --newtab-background-color: #303446 !important;
    --zen-themed-toolbar-bg: #292c3c !important;
    --zen-main-browser-background: #292c3c !important;
    --toolbox-bgcolor-inactive: #292c3c !important;
  }

  #permissions-granted-icon {
    color: #292c3c !important;
  }

  .sidebar-placesTree {
    background-color: #303446 !important;
  }

  #zen-workspaces-button {
    background-color: #303446 !important;
  }

  #TabsToolbar {
    background-color: #292c3c !important;
  }

  .urlbar-background {
    background-color: #303446 !important;
  }

  .content-shortcuts {
    background-color: #303446 !important;
    border-color: #babbf1 !important;
  }

  .urlbarView-url {
    color: #babbf1 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #232634 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #414559 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #232634;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8caaee !important;
    --identity-icon-color: #8caaee !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #81c8be !important;
    --identity-icon-color: #81c8be !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6d189 !important;
    --identity-icon-color: #a6d189 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #e5c890 !important;
    --identity-icon-color: #e5c890 !important;
  }

  .identity-color-orange {
    --identity-tab-color: #ef9f76 !important;
    --identity-icon-color: #ef9f76 !important;
  }

  .identity-color-red {
    --identity-tab-color: #e78284 !important;
    --identity-icon-color: #e78284 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f4b8e4 !important;
    --identity-icon-color: #f4b8e4 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #ca9ee6 !important;
    --identity-icon-color: #ca9ee6 !important;
  }

  hbox#titlebar {
    background-color: #292c3c !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #292c3c !important;
  }
}


================================================
FILE: themes/Frappe/Lavender/userContent.css
================================================
/* Catppuccin Frappe Lavender userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #c6d0f5 !important;
      --color-accent-primary: #babbf1 !important;
      --color-accent-primary-hover: rgb(208, 209, 246) !important;
      --color-accent-primary-active: rgb(200, 187, 241) !important;
      background-color: #303446 !important;
      --in-content-page-background: #303446 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #303446 !important;
      --newtab-background-color-secondary: #414559 !important;
      --newtab-element-hover-color: #414559 !important;
      --newtab-text-primary-color: #c6d0f5 !important;
      --newtab-wordmark-color: #c6d0f5 !important;
      --newtab-primary-action-background: #babbf1 !important;
    }

    .icon {
      color: #babbf1 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-frappe.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Frappe/Lavender/zen-logo-frappe.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: #babbf1 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #292c3c !important;
      --in-content-text-color: #c6d0f5 !important;
      --link-color: #babbf1 !important;
      --link-color-hover: rgb(208, 209, 246) !important;
      --zen-colors-primary: #414559 !important;
      --in-content-box-background: #414559 !important;
      --zen-primary-color: #babbf1 !important;
    }

    groupbox , moz-card{
      background: #303446 !important;
    }

    button,
    groupbox menulist {
      background: #414559 !important;
      color: #c6d0f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #292c3c !important;
      --background-color-box: #303446 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #303446 !important;
      --social-color: #ca9ee6 !important;
      --coockie-color: #99d1db !important;
      --fingerprinter-color: #e5c890 !important;
      --cryptominer-color: #babbf1 !important;
      --tracker-color: #a6d189 !important;
      --in-content-primary-button-background-hover: rgb(92, 99, 124) !important;
      --in-content-primary-button-text-color-hover: #c6d0f5 !important;
      --in-content-primary-button-background: #51576d !important;
      --in-content-primary-button-text-color: #c6d0f5 !important;
    }


    .card {
      background-color: #414559 !important;
    }
  }
}


================================================
FILE: themes/Frappe/Maroon/userChrome.css
================================================
/* Catppuccin Frappe Maroon userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #414559 !important;
    --zen-primary-color: #ea999c !important;
    --zen-colors-secondary: #414559 !important;
    --zen-colors-tertiary: #292c3c !important;
    --zen-colors-border: #ea999c !important;
    --toolbarbutton-icon-fill: #ea999c !important;
    --lwt-text-color: #c6d0f5 !important;
    --toolbar-field-color: #c6d0f5 !important;
    --tab-selected-textcolor: rgb(216, 181, 200) !important;
    --toolbar-field-focus-color: #c6d0f5 !important;
    --toolbar-color: #c6d0f5 !important;
    --newtab-text-primary-color: #c6d0f5 !important;
    --arrowpanel-color: #c6d0f5 !important;
    --arrowpanel-background: #303446 !important;
    --sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-background-color: #232634 !important;
    --toolbar-bgcolor: #414559 !important;
    --newtab-background-color: #303446 !important;
    --zen-themed-toolbar-bg: #292c3c !important;
    --zen-main-browser-background: #292c3c !important;
    --toolbox-bgcolor-inactive: #292c3c !important;
  }

  #permissions-granted-icon {
    color: #292c3c !important;
  }

  .sidebar-placesTree {
    background-color: #303446 !important;
  }

  #zen-workspaces-button {
    background-color: #303446 !important;
  }

  #TabsToolbar {
    background-color: #292c3c !important;
  }

  .urlbar-background {
    background-color: #303446 !important;
  }

  .content-shortcuts {
    background-color: #303446 !important;
    border-color: #ea999c !important;
  }

  .urlbarView-url {
    color: #ea999c !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #232634 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #414559 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #232634;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8caaee !important;
    --identity-icon-color: #8caaee !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #81c8be !important;
    --identity-icon-color: #81c8be !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6d189 !important;
    --identity-icon-color: #a6d189 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #e5c890 !important;
    --identity-icon-color: #e5c890 !important;
  }

  .identity-color-orange {
    --identity-tab-color: #ef9f76 !important;
    --identity-icon-color: #ef9f76 !important;
  }

  .identity-color-red {
    --identity-tab-color: #e78284 !important;
    --identity-icon-color: #e78284 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f4b8e4 !important;
    --identity-icon-color: #f4b8e4 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #ca9ee6 !important;
    --identity-icon-color: #ca9ee6 !important;
  }

  hbox#titlebar {
    background-color: #292c3c !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #292c3c !important;
  }
}


================================================
FILE: themes/Frappe/Maroon/userContent.css
================================================
/* Catppuccin Frappe Maroon userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #c6d0f5 !important;
      --color-accent-primary: #ea999c !important;
      --color-accent-primary-hover: rgb(239, 175, 177) !important;
      --color-accent-primary-active: rgb(234, 171, 154) !important;
      background-color: #303446 !important;
      --in-content-page-background: #303446 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #303446 !important;
      --newtab-background-color-secondary: #414559 !important;
      --newtab-element-hover-color: #414559 !important;
      --newtab-text-primary-color: #c6d0f5 !important;
      --newtab-wordmark-color: #c6d0f5 !important;
      --newtab-primary-action-background: #ea999c !important;
    }

    .icon {
      color: #ea999c !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-frappe.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Frappe/Maroon/zen-logo-frappe.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: #ea999c !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #292c3c !important;
      --in-content-text-color: #c6d0f5 !important;
      --link-color: #ea999c !important;
      --link-color-hover: rgb(239, 175, 177) !important;
      --zen-colors-primary: #414559 !important;
      --in-content-box-background: #414559 !important;
      --zen-primary-color: #ea999c !important;
    }

    groupbox , moz-card{
      background: #303446 !important;
    }

    button,
    groupbox menulist {
      background: #414559 !important;
      color: #c6d0f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #292c3c !important;
      --background-color-box: #303446 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #303446 !important;
      --social-color: #ca9ee6 !important;
      --coockie-color: #99d1db !important;
      --fingerprinter-color: #e5c890 !important;
      --cryptominer-color: #babbf1 !important;
      --tracker-color: #a6d189 !important;
      --in-content-primary-button-background-hover: rgb(92, 99, 124) !important;
      --in-content-primary-button-text-color-hover: #c6d0f5 !important;
      --in-content-primary-button-background: #51576d !important;
      --in-content-primary-button-text-color: #c6d0f5 !important;
    }


    .card {
      background-color: #414559 !important;
    }
  }
}


================================================
FILE: themes/Frappe/Mauve/userChrome.css
================================================
/* Catppuccin Frappe Mauve userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #414559 !important;
    --zen-primary-color: #ca9ee6 !important;
    --zen-colors-secondary: #414559 !important;
    --zen-colors-tertiary: #292c3c !important;
    --zen-colors-border: #ca9ee6 !important;
    --toolbarbutton-icon-fill: #ca9ee6 !important;
    --lwt-text-color: #c6d0f5 !important;
    --toolbar-field-color: #c6d0f5 !important;
    --tab-selected-textcolor: rgb(200, 183, 237) !important;
    --toolbar-field-focus-color: #c6d0f5 !important;
    --toolbar-color: #c6d0f5 !important;
    --newtab-text-primary-color: #c6d0f5 !important;
    --arrowpanel-color: #c6d0f5 !important;
    --arrowpanel-background: #303446 !important;
    --sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-background-color: #232634 !important;
    --toolbar-bgcolor: #414559 !important;
    --newtab-background-color: #303446 !important;
    --zen-themed-toolbar-bg: #292c3c !important;
    --zen-main-browser-background: #292c3c !important;
    --toolbox-bgcolor-inactive: #292c3c !important;
  }

  #permissions-granted-icon {
    color: #292c3c !important;
  }

  .sidebar-placesTree {
    background-color: #303446 !important;
  }

  #zen-workspaces-button {
    background-color: #303446 !important;
  }

  #TabsToolbar {
    background-color: #292c3c !important;
  }

  .urlbar-background {
    background-color: #303446 !important;
  }

  .content-shortcuts {
    background-color: #303446 !important;
    border-color: #ca9ee6 !important;
  }

  .urlbarView-url {
    color: #ca9ee6 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #232634 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #414559 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #232634;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8caaee !important;
    --identity-icon-color: #8caaee !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #81c8be !important;
    --identity-icon-color: #81c8be !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6d189 !important;
    --identity-icon-color: #a6d189 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #e5c890 !important;
    --identity-icon-color: #e5c890 !important;
  }

  .identity-color-orange {
    --identity-tab-color: #ef9f76 !important;
    --identity-icon-color: #ef9f76 !important;
  }

  .identity-color-red {
    --identity-tab-color: #e78284 !important;
    --identity-icon-color: #e78284 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f4b8e4 !important;
    --identity-icon-color: #f4b8e4 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #ca9ee6 !important;
    --identity-icon-color: #ca9ee6 !important;
  }

  hbox#titlebar {
    background-color: #292c3c !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #292c3c !important;
  }
}


================================================
FILE: themes/Frappe/Mauve/userContent.css
================================================
/* Catppuccin Frappe Mauve userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #c6d0f5 !important;
      --color-accent-primary: #ca9ee6 !important;
      --color-accent-primary-hover: rgb(214, 179, 235) !important;
      --color-accent-primary-active: rgb(220, 158, 230) !important;
      background-color: #303446 !important;
      --in-content-page-background: #303446 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #303446 !important;
      --newtab-background-color-secondary: #414559 !important;
      --newtab-element-hover-color: #414559 !important;
      --newtab-text-primary-color: #c6d0f5 !important;
      --newtab-wordmark-color: #c6d0f5 !important;
      --newtab-primary-action-background: #ca9ee6 !important;
    }

    .icon {
      color: #ca9ee6 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-frappe.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Frappe/Mauve/zen-logo-frappe.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: #ca9ee6 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #292c3c !important;
      --in-content-text-color: #c6d0f5 !important;
      --link-color: #ca9ee6 !important;
      --link-color-hover: rgb(214, 179, 235) !important;
      --zen-colors-primary: #414559 !important;
      --in-content-box-background: #414559 !important;
      --zen-primary-color: #ca9ee6 !important;
    }

    groupbox , moz-card{
      background: #303446 !important;
    }

    button,
    groupbox menulist {
      background: #414559 !important;
      color: #c6d0f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #292c3c !important;
      --background-color-box: #303446 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #303446 !important;
      --social-color: #ca9ee6 !important;
      --coockie-color: #99d1db !important;
      --fingerprinter-color: #e5c890 !important;
      --cryptominer-color: #babbf1 !important;
      --tracker-color: #a6d189 !important;
      --in-content-primary-button-background-hover: rgb(92, 99, 124) !important;
      --in-content-primary-button-text-color-hover: #c6d0f5 !important;
      --in-content-primary-button-background: #51576d !important;
      --in-content-primary-button-text-color: #c6d0f5 !important;
    }


    .card {
      background-color: #414559 !important;
    }
  }
}


================================================
FILE: themes/Frappe/Peach/userChrome.css
================================================
/* Catppuccin Frappe Peach userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #414559 !important;
    --zen-primary-color: #ef9f76 !important;
    --zen-colors-secondary: #414559 !important;
    --zen-colors-tertiary: #292c3c !important;
    --zen-colors-border: #ef9f76 !important;
    --toolbarbutton-icon-fill: #ef9f76 !important;
    --lwt-text-color: #c6d0f5 !important;
    --toolbar-field-color: #c6d0f5 !important;
    --tab-selected-textcolor: rgb(219, 184, 181) !important;
    --toolbar-field-focus-color: #c6d0f5 !important;
    --toolbar-color: #c6d0f5 !important;
    --newtab-text-primary-color: #c6d0f5 !important;
    --arrowpanel-color: #c6d0f5 !important;
    --arrowpanel-background: #303446 !important;
    --sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-background-color: #232634 !important;
    --toolbar-bgcolor: #414559 !important;
    --newtab-background-color: #303446 !important;
    --zen-themed-toolbar-bg: #292c3c !important;
    --zen-main-browser-background: #292c3c !important;
    --toolbox-bgcolor-inactive: #292c3c !important;
  }

  #permissions-granted-icon {
    color: #292c3c !important;
  }

  .sidebar-placesTree {
    background-color: #303446 !important;
  }

  #zen-workspaces-button {
    background-color: #303446 !important;
  }

  #TabsToolbar {
    background-color: #292c3c !important;
  }

  .urlbar-background {
    background-color: #303446 !important;
  }

  .content-shortcuts {
    background-color: #303446 !important;
    border-color: #ef9f76 !important;
  }

  .urlbarView-url {
    color: #ef9f76 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #232634 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #414559 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #232634;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8caaee !important;
    --identity-icon-color: #8caaee !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #81c8be !important;
    --identity-icon-color: #81c8be !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6d189 !important;
    --identity-icon-color: #a6d189 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #e5c890 !important;
    --identity-icon-color: #e5c890 !important;
  }

  .identity-color-orange {
    --identity-tab-color: #ef9f76 !important;
    --identity-icon-color: #ef9f76 !important;
  }

  .identity-color-red {
    --identity-tab-color: #e78284 !important;
    --identity-icon-color: #e78284 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f4b8e4 !important;
    --identity-icon-color: #f4b8e4 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #ca9ee6 !important;
    --identity-icon-color: #ca9ee6 !important;
  }

  hbox#titlebar {
    background-color: #292c3c !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #292c3c !important;
  }
}


================================================
FILE: themes/Frappe/Peach/userContent.css
================================================
/* Catppuccin Frappe Peach userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #c6d0f5 !important;
      --color-accent-primary: #ef9f76 !important;
      --color-accent-primary-hover: rgb(242, 175, 142) !important;
      --color-accent-primary-active: rgb(239, 189, 119) !important;
      background-color: #303446 !important;
      --in-content-page-background: #303446 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #303446 !important;
      --newtab-background-color-secondary: #414559 !important;
      --newtab-element-hover-color: #414559 !important;
      --newtab-text-primary-color: #c6d0f5 !important;
      --newtab-wordmark-color: #c6d0f5 !important;
      --newtab-primary-action-background: #ef9f76 !important;
    }

    .icon {
      color: #ef9f76 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-frappe.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Frappe/Peach/zen-logo-frappe.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: #ef9f76 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #292c3c !important;
      --in-content-text-color: #c6d0f5 !important;
      --link-color: #ef9f76 !important;
      --link-color-hover: rgb(242, 175, 142) !important;
      --zen-colors-primary: #414559 !important;
      --in-content-box-background: #414559 !important;
      --zen-primary-color: #ef9f76 !important;
    }

    groupbox , moz-card{
      background: #303446 !important;
    }

    button,
    groupbox menulist {
      background: #414559 !important;
      color: #c6d0f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #292c3c !important;
      --background-color-box: #303446 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #303446 !important;
      --social-color: #ca9ee6 !important;
      --coockie-color: #99d1db !important;
      --fingerprinter-color: #e5c890 !important;
      --cryptominer-color: #babbf1 !important;
      --tracker-color: #a6d189 !important;
      --in-content-primary-button-background-hover: rgb(92, 99, 124) !important;
      --in-content-primary-button-text-color-hover: #c6d0f5 !important;
      --in-content-primary-button-background: #51576d !important;
      --in-content-primary-button-text-color: #c6d0f5 !important;
    }


    .card {
      background-color: #414559 !important;
    }
  }
}


================================================
FILE: themes/Frappe/Pink/userChrome.css
================================================
/* Catppuccin Frappe Pink userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #414559 !important;
    --zen-primary-color: #f4b8e4 !important;
    --zen-colors-secondary: #414559 !important;
    --zen-colors-tertiary: #292c3c !important;
    --zen-colors-border: #f4b8e4 !important;
    --toolbarbutton-icon-fill: #f4b8e4 !important;
    --lwt-text-color: #c6d0f5 !important;
    --toolbar-field-color: #c6d0f5 !important;
    --tab-selected-textcolor: rgb(221, 196, 236) !important;
    --toolbar-field-focus-color: #c6d0f5 !important;
    --toolbar-color: #c6d0f5 !important;
    --newtab-text-primary-color: #c6d0f5 !important;
    --arrowpanel-color: #c6d0f5 !important;
    --arrowpanel-background: #303446 !important;
    --sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-background-color: #232634 !important;
    --toolbar-bgcolor: #414559 !important;
    --newtab-background-color: #303446 !important;
    --zen-themed-toolbar-bg: #292c3c !important;
    --zen-main-browser-background: #292c3c !important;
    --toolbox-bgcolor-inactive: #292c3c !important;
  }

  #permissions-granted-icon {
    color: #292c3c !important;
  }

  .sidebar-placesTree {
    background-color: #303446 !important;
  }

  #zen-workspaces-button {
    background-color: #303446 !important;
  }

  #TabsToolbar {
    background-color: #292c3c !important;
  }

  .urlbar-background {
    background-color: #303446 !important;
  }

  .content-shortcuts {
    background-color: #303446 !important;
    border-color: #f4b8e4 !important;
  }

  .urlbarView-url {
    color: #f4b8e4 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #232634 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #414559 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #232634;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8caaee !important;
    --identity-icon-color: #8caaee !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #81c8be !important;
    --identity-icon-color: #81c8be !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6d189 !important;
    --identity-icon-color: #a6d189 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #e5c890 !important;
    --identity-icon-color: #e5c890 !important;
  }

  .identity-color-orange {
    --identity-tab-color: #ef9f76 !important;
    --identity-icon-color: #ef9f76 !important;
  }

  .identity-color-red {
    --identity-tab-color: #e78284 !important;
    --identity-icon-color: #e78284 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f4b8e4 !important;
    --identity-icon-color: #f4b8e4 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #ca9ee6 !important;
    --identity-icon-color: #ca9ee6 !important;
  }

  hbox#titlebar {
    background-color: #292c3c !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #292c3c !important;
  }
}


================================================
FILE: themes/Frappe/Pink/userContent.css
================================================
/* Catppuccin Frappe Pink userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #c6d0f5 !important;
      --color-accent-primary: #f4b8e4 !important;
      --color-accent-primary-hover: rgb(248, 206, 237) !important;
      --color-accent-primary-active: rgb(244, 184, 213) !important;
      background-color: #303446 !important;
      --in-content-page-background: #303446 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #303446 !important;
      --newtab-background-color-secondary: #414559 !important;
      --newtab-element-hover-color: #414559 !important;
      --newtab-text-primary-color: #c6d0f5 !important;
      --newtab-wordmark-color: #c6d0f5 !important;
      --newtab-primary-action-background: #f4b8e4 !important;
    }

    .icon {
      color: #f4b8e4 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-frappe.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Frappe/Pink/zen-logo-frappe.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: #f4b8e4 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #292c3c !important;
      --in-content-text-color: #c6d0f5 !important;
      --link-color: #f4b8e4 !important;
      --link-color-hover: rgb(248, 206, 237) !important;
      --zen-colors-primary: #414559 !important;
      --in-content-box-background: #414559 !important;
      --zen-primary-color: #f4b8e4 !important;
    }

    groupbox , moz-card{
      background: #303446 !important;
    }

    button,
    groupbox menulist {
      background: #414559 !important;
      color: #c6d0f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #292c3c !important;
      --background-color-box: #303446 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #303446 !important;
      --social-color: #ca9ee6 !important;
      --coockie-color: #99d1db !important;
      --fingerprinter-color: #e5c890 !important;
      --cryptominer-color: #babbf1 !important;
      --tracker-color: #a6d189 !important;
      --in-content-primary-button-background-hover: rgb(92, 99, 124) !important;
      --in-content-primary-button-text-color-hover: #c6d0f5 !important;
      --in-content-primary-button-background: #51576d !important;
      --in-content-primary-button-text-color: #c6d0f5 !important;
    }


    .card {
      background-color: #414559 !important;
    }
  }
}


================================================
FILE: themes/Frappe/Red/userChrome.css
================================================
/* Catppuccin Frappe Red userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #414559 !important;
    --zen-primary-color: #e78284 !important;
    --zen-colors-secondary: #414559 !important;
    --zen-colors-tertiary: #292c3c !important;
    --zen-colors-border: #e78284 !important;
    --toolbarbutton-icon-fill: #e78284 !important;
    --lwt-text-color: #c6d0f5 !important;
    --toolbar-field-color: #c6d0f5 !important;
    --tab-selected-textcolor: rgb(215, 169, 188) !important;
    --toolbar-field-focus-color: #c6d0f5 !important;
    --toolbar-color: #c6d0f5 !important;
    --newtab-text-primary-color: #c6d0f5 !important;
    --arrowpanel-color: #c6d0f5 !important;
    --arrowpanel-background: #303446 !important;
    --sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-background-color: #232634 !important;
    --toolbar-bgcolor: #414559 !important;
    --newtab-background-color: #303446 !important;
    --zen-themed-toolbar-bg: #292c3c !important;
    --zen-main-browser-background: #292c3c !important;
    --toolbox-bgcolor-inactive: #292c3c !important;
  }

  #permissions-granted-icon {
    color: #292c3c !important;
  }

  .sidebar-placesTree {
    background-color: #303446 !important;
  }

  #zen-workspaces-button {
    background-color: #303446 !important;
  }

  #TabsToolbar {
    background-color: #292c3c !important;
  }

  .urlbar-background {
    background-color: #303446 !important;
  }

  .content-shortcuts {
    background-color: #303446 !important;
    border-color: #e78284 !important;
  }

  .urlbarView-url {
    color: #e78284 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #232634 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #414559 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #232634;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8caaee !important;
    --identity-icon-color: #8caaee !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #81c8be !important;
    --identity-icon-color: #81c8be !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6d189 !important;
    --identity-icon-color: #a6d189 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #e5c890 !important;
    --identity-icon-color: #e5c890 !important;
  }

  .identity-color-orange {
    --identity-tab-color: #ef9f76 !important;
    --identity-icon-color: #ef9f76 !important;
  }

  .identity-color-red {
    --identity-tab-color: #e78284 !important;
    --identity-icon-color: #e78284 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f4b8e4 !important;
    --identity-icon-color: #f4b8e4 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #ca9ee6 !important;
    --identity-icon-color: #ca9ee6 !important;
  }

  hbox#titlebar {
    background-color: #292c3c !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #292c3c !important;
  }
}


================================================
FILE: themes/Frappe/Red/userContent.css
================================================
/* Catppuccin Frappe Red userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #c6d0f5 !important;
      --color-accent-primary: #e78284 !important;
      --color-accent-primary-hover: rgb(235, 153, 154) !important;
      --color-accent-primary-active: rgb(231, 154, 131) !important;
      background-color: #303446 !important;
      --in-content-page-background: #303446 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #303446 !important;
      --newtab-background-color-secondary: #414559 !important;
      --newtab-element-hover-color: #414559 !important;
      --newtab-text-primary-color: #c6d0f5 !important;
      --newtab-wordmark-color: #c6d0f5 !important;
      --newtab-primary-action-background: #e78284 !important;
    }

    .icon {
      color: #e78284 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-frappe.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Frappe/Red/zen-logo-frappe.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: #e78284 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #292c3c !important;
      --in-content-text-color: #c6d0f5 !important;
      --link-color: #e78284 !important;
      --link-color-hover: rgb(235, 153, 154) !important;
      --zen-colors-primary: #414559 !important;
      --in-content-box-background: #414559 !important;
      --zen-primary-color: #e78284 !important;
    }

    groupbox , moz-card{
      background: #303446 !important;
    }

    button,
    groupbox menulist {
      background: #414559 !important;
      color: #c6d0f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #292c3c !important;
      --background-color-box: #303446 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #303446 !important;
      --social-color: #ca9ee6 !important;
      --coockie-color: #99d1db !important;
      --fingerprinter-color: #e5c890 !important;
      --cryptominer-color: #babbf1 !important;
      --tracker-color: #a6d189 !important;
      --in-content-primary-button-background-hover: rgb(92, 99, 124) !important;
      --in-content-primary-button-text-color-hover: #c6d0f5 !important;
      --in-content-primary-button-background: #51576d !important;
      --in-content-primary-button-text-color: #c6d0f5 !important;
    }


    .card {
      background-color: #414559 !important;
    }
  }
}


================================================
FILE: themes/Frappe/Rosewater/userChrome.css
================================================
/* Catppuccin Frappe Rosewater userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #414559 !important;
    --zen-primary-color: #f2d5cf !important;
    --zen-colors-secondary: #414559 !important;
    --zen-colors-tertiary: #292c3c !important;
    --zen-colors-border: #f2d5cf !important;
    --toolbarbutton-icon-fill: #f2d5cf !important;
    --lwt-text-color: #c6d0f5 !important;
    --toolbar-field-color: #c6d0f5 !important;
    --tab-selected-textcolor: rgb(220, 211, 226) !important;
    --toolbar-field-focus-color: #c6d0f5 !important;
    --toolbar-color: #c6d0f5 !important;
    --newtab-text-primary-color: #c6d0f5 !important;
    --arrowpanel-color: #c6d0f5 !important;
    --arrowpanel-background: #303446 !important;
    --sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-background-color: #232634 !important;
    --toolbar-bgcolor: #414559 !important;
    --newtab-background-color: #303446 !important;
    --zen-themed-toolbar-bg: #292c3c !important;
    --zen-main-browser-background: #292c3c !important;
    --toolbox-bgcolor-inactive: #292c3c !important;
  }

  #permissions-granted-icon {
    color: #292c3c !important;
  }

  .sidebar-placesTree {
    background-color: #303446 !important;
  }

  #zen-workspaces-button {
    background-color: #303446 !important;
  }

  #TabsToolbar {
    background-color: #292c3c !important;
  }

  .urlbar-background {
    background-color: #303446 !important;
  }

  .content-shortcuts {
    background-color: #303446 !important;
    border-color: #f2d5cf !important;
  }

  .urlbarView-url {
    color: #f2d5cf !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #232634 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #414559 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #232634;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8caaee !important;
    --identity-icon-color: #8caaee !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #81c8be !important;
    --identity-icon-color: #81c8be !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6d189 !important;
    --identity-icon-color: #a6d189 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #e5c890 !important;
    --identity-icon-color: #e5c890 !important;
  }

  .identity-color-orange {
    --identity-tab-color: #ef9f76 !important;
    --identity-icon-color: #ef9f76 !important;
  }

  .identity-color-red {
    --identity-tab-color: #e78284 !important;
    --identity-icon-color: #e78284 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f4b8e4 !important;
    --identity-icon-color: #f4b8e4 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #ca9ee6 !important;
    --identity-icon-color: #ca9ee6 !important;
  }

  hbox#titlebar {
    background-color: #292c3c !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #292c3c !important;
  }
}


================================================
FILE: themes/Frappe/Rosewater/userContent.css
================================================
/* Catppuccin Frappe Rosewater userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #c6d0f5 !important;
      --color-accent-primary: #f2d5cf !important;
      --color-accent-primary-hover: rgb(248, 232, 228) !important;
      --color-accent-primary-active: rgb(242, 222, 208) !important;
      background-color: #303446 !important;
      --in-content-page-background: #303446 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #303446 !important;
      --newtab-background-color-secondary: #414559 !important;
      --newtab-element-hover-color: #414559 !important;
      --newtab-text-primary-color: #c6d0f5 !important;
      --newtab-wordmark-color: #c6d0f5 !important;
      --newtab-primary-action-background: #f2d5cf !important;
    }

    .icon {
      color: #f2d5cf !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-frappe.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Frappe/Rosewater/zen-logo-frappe.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: #f2d5cf !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #292c3c !important;
      --in-content-text-color: #c6d0f5 !important;
      --link-color: #f2d5cf !important;
      --link-color-hover: rgb(248, 232, 228) !important;
      --zen-colors-primary: #414559 !important;
      --in-content-box-background: #414559 !important;
      --zen-primary-color: #f2d5cf !important;
    }

    groupbox , moz-card{
      background: #303446 !important;
    }

    button,
    groupbox menulist {
      background: #414559 !important;
      color: #c6d0f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #292c3c !important;
      --background-color-box: #303446 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #303446 !important;
      --social-color: #ca9ee6 !important;
      --coockie-color: #99d1db !important;
      --fingerprinter-color: #e5c890 !important;
      --cryptominer-color: #babbf1 !important;
      --tracker-color: #a6d189 !important;
      --in-content-primary-button-background-hover: rgb(92, 99, 124) !important;
      --in-content-primary-button-text-color-hover: #c6d0f5 !important;
      --in-content-primary-button-background: #51576d !important;
      --in-content-primary-button-text-color: #c6d0f5 !important;
    }


    .card {
      background-color: #414559 !important;
    }
  }
}


================================================
FILE: themes/Frappe/Sapphire/userChrome.css
================================================
/* Catppuccin Frappe Sapphire userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #414559 !important;
    --zen-primary-color: #85c1dc !important;
    --zen-colors-secondary: #414559 !important;
    --zen-colors-tertiary: #292c3c !important;
    --zen-colors-border: #85c1dc !important;
    --toolbarbutton-icon-fill: #85c1dc !important;
    --lwt-text-color: #c6d0f5 !important;
    --toolbar-field-color: #c6d0f5 !important;
    --tab-selected-textcolor: rgb(166, 201, 232) !important;
    --toolbar-field-focus-color: #c6d0f5 !important;
    --toolbar-color: #c6d0f5 !important;
    --newtab-text-primary-color: #c6d0f5 !important;
    --arrowpanel-color: #c6d0f5 !important;
    --arrowpanel-background: #303446 !important;
    --sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-background-color: #232634 !important;
    --toolbar-bgcolor: #414559 !important;
    --newtab-background-color: #303446 !important;
    --zen-themed-toolbar-bg: #292c3c !important;
    --zen-main-browser-background: #292c3c !important;
    --toolbox-bgcolor-inactive: #292c3c !important;
  }

  #permissions-granted-icon {
    color: #292c3c !important;
  }

  .sidebar-placesTree {
    background-color: #303446 !important;
  }

  #zen-workspaces-button {
    background-color: #303446 !important;
  }

  #TabsToolbar {
    background-color: #292c3c !important;
  }

  .urlbar-background {
    background-color: #303446 !important;
  }

  .content-shortcuts {
    background-color: #303446 !important;
    border-color: #85c1dc !important;
  }

  .urlbarView-url {
    color: #85c1dc !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #232634 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #414559 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #232634;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8caaee !important;
    --identity-icon-color: #8caaee !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #81c8be !important;
    --identity-icon-color: #81c8be !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6d189 !important;
    --identity-icon-color: #a6d189 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #e5c890 !important;
    --identity-icon-color: #e5c890 !important;
  }

  .identity-color-orange {
    --identity-tab-color: #ef9f76 !important;
    --identity-icon-color: #ef9f76 !important;
  }

  .identity-color-red {
    --identity-tab-color: #e78284 !important;
    --identity-icon-color: #e78284 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f4b8e4 !important;
    --identity-icon-color: #f4b8e4 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #ca9ee6 !important;
    --identity-icon-color: #ca9ee6 !important;
  }

  hbox#titlebar {
    background-color: #292c3c !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #292c3c !important;
  }
}


================================================
FILE: themes/Frappe/Sapphire/userContent.css
================================================
/* Catppuccin Frappe Sapphire userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #c6d0f5 !important;
      --color-accent-primary: #85c1dc !important;
      --color-accent-primary-hover: rgb(154, 203, 226) !important;
      --color-accent-primary-active: rgb(134, 171, 220) !important;
      background-color: #303446 !important;
      --in-content-page-background: #303446 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #303446 !important;
      --newtab-background-color-secondary: #414559 !important;
      --newtab-element-hover-color: #414559 !important;
      --newtab-text-primary-color: #c6d0f5 !important;
      --newtab-wordmark-color: #c6d0f5 !important;
      --newtab-primary-action-background: #85c1dc !important;
    }

    .icon {
      color: #85c1dc !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-frappe.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Frappe/Sapphire/zen-logo-frappe.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: #85c1dc !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #292c3c !important;
      --in-content-text-color: #c6d0f5 !important;
      --link-color: #85c1dc !important;
      --link-color-hover: rgb(154, 203, 226) !important;
      --zen-colors-primary: #414559 !important;
      --in-content-box-background: #414559 !important;
      --zen-primary-color: #85c1dc !important;
    }

    groupbox , moz-card{
      background: #303446 !important;
    }

    button,
    groupbox menulist {
      background: #414559 !important;
      color: #c6d0f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #292c3c !important;
      --background-color-box: #303446 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #303446 !important;
      --social-color: #ca9ee6 !important;
      --coockie-color: #99d1db !important;
      --fingerprinter-color: #e5c890 !important;
      --cryptominer-color: #babbf1 !important;
      --tracker-color: #a6d189 !important;
      --in-content-primary-button-background-hover: rgb(92, 99, 124) !important;
      --in-content-primary-button-text-color-hover: #c6d0f5 !important;
      --in-content-primary-button-background: #51576d !important;
      --in-content-primary-button-text-color: #c6d0f5 !important;
    }


    .card {
      background-color: #414559 !important;
    }
  }
}


================================================
FILE: themes/Frappe/Sky/userChrome.css
================================================
/* Catppuccin Frappe Sky userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #414559 !important;
    --zen-primary-color: #99d1db !important;
    --zen-colors-secondary: #414559 !important;
    --zen-colors-tertiary: #292c3c !important;
    --zen-colors-border: #99d1db !important;
    --toolbarbutton-icon-fill: #99d1db !important;
    --lwt-text-color: #c6d0f5 !important;
    --toolbar-field-color: #c6d0f5 !important;
    --tab-selected-textcolor: rgb(176, 209, 232) !important;
    --toolbar-field-focus-color: #c6d0f5 !important;
    --toolbar-color: #c6d0f5 !important;
    --newtab-text-primary-color: #c6d0f5 !important;
    --arrowpanel-color: #c6d0f5 !important;
    --arrowpanel-background: #303446 !important;
    --sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-background-color: #232634 !important;
    --toolbar-bgcolor: #414559 !important;
    --newtab-background-color: #303446 !important;
    --zen-themed-toolbar-bg: #292c3c !important;
    --zen-main-browser-background: #292c3c !important;
    --toolbox-bgcolor-inactive: #292c3c !important;
  }

  #permissions-granted-icon {
    color: #292c3c !important;
  }

  .sidebar-placesTree {
    background-color: #303446 !important;
  }

  #zen-workspaces-button {
    background-color: #303446 !important;
  }

  #TabsToolbar {
    background-color: #292c3c !important;
  }

  .urlbar-background {
    background-color: #303446 !important;
  }

  .content-shortcuts {
    background-color: #303446 !important;
    border-color: #99d1db !important;
  }

  .urlbarView-url {
    color: #99d1db !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #232634 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #414559 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #232634;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8caaee !important;
    --identity-icon-color: #8caaee !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #81c8be !important;
    --identity-icon-color: #81c8be !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6d189 !important;
    --identity-icon-color: #a6d189 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #e5c890 !important;
    --identity-icon-color: #e5c890 !important;
  }

  .identity-color-orange {
    --identity-tab-color: #ef9f76 !important;
    --identity-icon-color: #ef9f76 !important;
  }

  .identity-color-red {
    --identity-tab-color: #e78284 !important;
    --identity-icon-color: #e78284 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f4b8e4 !important;
    --identity-icon-color: #f4b8e4 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #ca9ee6 !important;
    --identity-icon-color: #ca9ee6 !important;
  }

  hbox#titlebar {
    background-color: #292c3c !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #292c3c !important;
  }
}


================================================
FILE: themes/Frappe/Sky/userContent.css
================================================
/* Catppuccin Frappe Sky userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #c6d0f5 !important;
      --color-accent-primary: #99d1db !important;
      --color-accent-primary-hover: rgb(172, 218, 226) !important;
      --color-accent-primary-active: rgb(153, 193, 219) !important;
      background-color: #303446 !important;
      --in-content-page-background: #303446 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #303446 !important;
      --newtab-background-color-secondary: #414559 !important;
      --newtab-element-hover-color: #414559 !important;
      --newtab-text-primary-color: #c6d0f5 !important;
      --newtab-wordmark-color: #c6d0f5 !important;
      --newtab-primary-action-background: #99d1db !important;
    }

    .icon {
      color: #99d1db !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-frappe.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Frappe/Sky/zen-logo-frappe.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: #99d1db !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #292c3c !important;
      --in-content-text-color: #c6d0f5 !important;
      --link-color: #99d1db !important;
      --link-color-hover: rgb(172, 218, 226) !important;
      --zen-colors-primary: #414559 !important;
      --in-content-box-background: #414559 !important;
      --zen-primary-color: #99d1db !important;
    }

    groupbox , moz-card{
      background: #303446 !important;
    }

    button,
    groupbox menulist {
      background: #414559 !important;
      color: #c6d0f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #292c3c !important;
      --background-color-box: #303446 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #303446 !important;
      --social-color: #ca9ee6 !important;
      --coockie-color: #99d1db !important;
      --fingerprinter-color: #e5c890 !important;
      --cryptominer-color: #babbf1 !important;
      --tracker-color: #a6d189 !important;
      --in-content-primary-button-background-hover: rgb(92, 99, 124) !important;
      --in-content-primary-button-text-color-hover: #c6d0f5 !important;
      --in-content-primary-button-background: #51576d !important;
      --in-content-primary-button-text-color: #c6d0f5 !important;
    }


    .card {
      background-color: #414559 !important;
    }
  }
}


================================================
FILE: themes/Frappe/Teal/userChrome.css
================================================
/* Catppuccin Frappe Teal userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #414559 !important;
    --zen-primary-color: #81c8be !important;
    --zen-colors-secondary: #414559 !important;
    --zen-colors-tertiary: #292c3c !important;
    --zen-colors-border: #81c8be !important;
    --toolbarbutton-icon-fill: #81c8be !important;
    --lwt-text-color: #c6d0f5 !important;
    --toolbar-field-color: #c6d0f5 !important;
    --tab-selected-textcolor: rgb(164, 204, 217) !important;
    --toolbar-field-focus-color: #c6d0f5 !important;
    --toolbar-color: #c6d0f5 !important;
    --newtab-text-primary-color: #c6d0f5 !important;
    --arrowpanel-color: #c6d0f5 !important;
    --arrowpanel-background: #303446 !important;
    --sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-background-color: #232634 !important;
    --toolbar-bgcolor: #414559 !important;
    --newtab-background-color: #303446 !important;
    --zen-themed-toolbar-bg: #292c3c !important;
    --zen-main-browser-background: #292c3c !important;
    --toolbox-bgcolor-inactive: #292c3c !important;
  }

  #permissions-granted-icon {
    color: #292c3c !important;
  }

  .sidebar-placesTree {
    background-color: #303446 !important;
  }

  #zen-workspaces-button {
    background-color: #303446 !important;
  }

  #TabsToolbar {
    background-color: #292c3c !important;
  }

  .urlbar-background {
    background-color: #303446 !important;
  }

  .content-shortcuts {
    background-color: #303446 !important;
    border-color: #81c8be !important;
  }

  .urlbarView-url {
    color: #81c8be !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #232634 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #414559 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #232634;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8caaee !important;
    --identity-icon-color: #8caaee !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #81c8be !important;
    --identity-icon-color: #81c8be !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6d189 !important;
    --identity-icon-color: #a6d189 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #e5c890 !important;
    --identity-icon-color: #e5c890 !important;
  }

  .identity-color-orange {
    --identity-tab-color: #ef9f76 !important;
    --identity-icon-color: #ef9f76 !important;
  }

  .identity-color-red {
    --identity-tab-color: #e78284 !important;
    --identity-icon-color: #e78284 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f4b8e4 !important;
    --identity-icon-color: #f4b8e4 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #ca9ee6 !important;
    --identity-icon-color: #ca9ee6 !important;
  }

  hbox#titlebar {
    background-color: #292c3c !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #292c3c !important;
  }
}


================================================
FILE: themes/Frappe/Teal/userContent.css
================================================
/* Catppuccin Frappe Teal userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #c6d0f5 !important;
      --color-accent-primary: #81c8be !important;
      --color-accent-primary-hover: rgb(148, 208, 200) !important;
      --color-accent-primary-active: rgb(130, 192, 200) !important;
      background-color: #303446 !important;
      --in-content-page-background: #303446 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #303446 !important;
      --newtab-background-color-secondary: #414559 !important;
      --newtab-element-hover-color: #414559 !important;
      --newtab-text-primary-color: #c6d0f5 !important;
      --newtab-wordmark-color: #c6d0f5 !important;
      --newtab-primary-action-background: #81c8be !important;
    }

    .icon {
      color: #81c8be !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-frappe.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Frappe/Teal/zen-logo-frappe.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: #81c8be !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #292c3c !important;
      --in-content-text-color: #c6d0f5 !important;
      --link-color: #81c8be !important;
      --link-color-hover: rgb(148, 208, 200) !important;
      --zen-colors-primary: #414559 !important;
      --in-content-box-background: #414559 !important;
      --zen-primary-color: #81c8be !important;
    }

    groupbox , moz-card{
      background: #303446 !important;
    }

    button,
    groupbox menulist {
      background: #414559 !important;
      color: #c6d0f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #292c3c !important;
      --background-color-box: #303446 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #303446 !important;
      --social-color: #ca9ee6 !important;
      --coockie-color: #99d1db !important;
      --fingerprinter-color: #e5c890 !important;
      --cryptominer-color: #babbf1 !important;
      --tracker-color: #a6d189 !important;
      --in-content-primary-button-background-hover: rgb(92, 99, 124) !important;
      --in-content-primary-button-text-color-hover: #c6d0f5 !important;
      --in-content-primary-button-background: #51576d !important;
      --in-content-primary-button-text-color: #c6d0f5 !important;
    }


    .card {
      background-color: #414559 !important;
    }
  }
}


================================================
FILE: themes/Frappe/Yellow/userChrome.css
================================================
/* Catppuccin Frappe Yellow userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #414559 !important;
    --zen-primary-color: #e5c890 !important;
    --zen-colors-secondary: #414559 !important;
    --zen-colors-tertiary: #292c3c !important;
    --zen-colors-border: #e5c890 !important;
    --toolbarbutton-icon-fill: #e5c890 !important;
    --lwt-text-color: #c6d0f5 !important;
    --toolbar-field-color: #c6d0f5 !important;
    --tab-selected-textcolor: rgb(214, 204, 194) !important;
    --toolbar-field-focus-color: #c6d0f5 !important;
    --toolbar-color: #c6d0f5 !important;
    --newtab-text-primary-color: #c6d0f5 !important;
    --arrowpanel-color: #c6d0f5 !important;
    --arrowpanel-background: #303446 !important;
    --sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-text-color: #c6d0f5 !important;
    --lwt-sidebar-background-color: #232634 !important;
    --toolbar-bgcolor: #414559 !important;
    --newtab-background-color: #303446 !important;
    --zen-themed-toolbar-bg: #292c3c !important;
    --zen-main-browser-background: #292c3c !important;
    --toolbox-bgcolor-inactive: #292c3c !important;
  }

  #permissions-granted-icon {
    color: #292c3c !important;
  }

  .sidebar-placesTree {
    background-color: #303446 !important;
  }

  #zen-workspaces-button {
    background-color: #303446 !important;
  }

  #TabsToolbar {
    background-color: #292c3c !important;
  }

  .urlbar-background {
    background-color: #303446 !important;
  }

  .content-shortcuts {
    background-color: #303446 !important;
    border-color: #e5c890 !important;
  }

  .urlbarView-url {
    color: #e5c890 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #232634 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #414559 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #232634;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8caaee !important;
    --identity-icon-color: #8caaee !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #81c8be !important;
    --identity-icon-color: #81c8be !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6d189 !important;
    --identity-icon-color: #a6d189 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #e5c890 !important;
    --identity-icon-color: #e5c890 !important;
  }

  .identity-color-orange {
    --identity-tab-color: #ef9f76 !important;
    --identity-icon-color: #ef9f76 !important;
  }

  .identity-color-red {
    --identity-tab-color: #e78284 !important;
    --identity-icon-color: #e78284 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f4b8e4 !important;
    --identity-icon-color: #f4b8e4 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #ca9ee6 !important;
    --identity-icon-color: #ca9ee6 !important;
  }

  hbox#titlebar {
    background-color: #292c3c !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #292c3c !important;
  }
}


================================================
FILE: themes/Frappe/Yellow/userContent.css
================================================
/* Catppuccin Frappe Yellow userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #c6d0f5 !important;
      --color-accent-primary: #e5c890 !important;
      --color-accent-primary-hover: rgb(234, 211, 166) !important;
      --color-accent-primary-active: rgb(229, 222, 145) !important;
      background-color: #303446 !important;
      --in-content-page-background: #303446 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #303446 !important;
      --newtab-background-color-secondary: #414559 !important;
      --newtab-element-hover-color: #414559 !important;
      --newtab-text-primary-color: #c6d0f5 !important;
      --newtab-wordmark-color: #c6d0f5 !important;
      --newtab-primary-action-background: #e5c890 !important;
    }

    .icon {
      color: #e5c890 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-frappe.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Frappe/Yellow/zen-logo-frappe.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: #e5c890 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #292c3c !important;
      --in-content-text-color: #c6d0f5 !important;
      --link-color: #e5c890 !important;
      --link-color-hover: rgb(234, 211, 166) !important;
      --zen-colors-primary: #414559 !important;
      --in-content-box-background: #414559 !important;
      --zen-primary-color: #e5c890 !important;
    }

    groupbox , moz-card{
      background: #303446 !important;
    }

    button,
    groupbox menulist {
      background: #414559 !important;
      color: #c6d0f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #292c3c !important;
      --background-color-box: #303446 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #303446 !important;
      --social-color: #ca9ee6 !important;
      --coockie-color: #99d1db !important;
      --fingerprinter-color: #e5c890 !important;
      --cryptominer-color: #babbf1 !important;
      --tracker-color: #a6d189 !important;
      --in-content-primary-button-background-hover: rgb(92, 99, 124) !important;
      --in-content-primary-button-text-color-hover: #c6d0f5 !important;
      --in-content-primary-button-background: #51576d !important;
      --in-content-primary-button-text-color: #c6d0f5 !important;
    }


    .card {
      background-color: #414559 !important;
    }
  }
}


================================================
FILE: themes/Latte/Blue/userChrome.css
================================================
/* Catppuccin Latte Blue userChrome.css*/

@media (prefers-color-scheme: light) {
  :root {
    --zen-colors-primary: #ccd0da !important;
    --zen-primary-color: #1e66f5 !important;
    --zen-colors-secondary: #ccd0da !important;
    --zen-colors-tertiary: #e6e9ef !important;
    --zen-colors-border: #1e66f5 !important;
    --toolbarbutton-icon-fill: #1e66f5 !important;
    --lwt-text-color: #4c4f69 !important;
    --toolbar-field-color: #4c4f69 !important;
    --tab-selected-textcolor: rgb(53, 90, 175) !important;
    --toolbar-field-focus-color: #4c4f69 !important;
    --toolbar-color: #4c4f69 !important;
    --newtab-text-primary-color: #4c4f69 !important;
    --arrowpanel-color: #4c4f69 !important;
    --arrowpanel-background: #eff1f5 !important;
    --sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-background-color: #dce0e8 !important;
    --toolbar-bgcolor: #ccd0da !important;
    --newtab-background-color: #eff1f5 !important;
    --zen-themed-toolbar-bg: #e6e9ef !important;
    --zen-main-browser-background: #e6e9ef !important;
    --toolbox-bgcolor-inactive: #e6e9ef !important;
  }

  #permissions-granted-icon {
    color: #e6e9ef !important;
  }

  .sidebar-placesTree {
    background-color: #eff1f5 !important;
  }

  #zen-workspaces-button {
    background-color: #eff1f5 !important;
  }

  #TabsToolbar {
    background-color: #e6e9ef !important;
  }

  .urlbar-background {
    background-color: #eff1f5 !important;
  }

  .content-shortcuts {
    background-color: #eff1f5 !important;
    border-color: #1e66f5 !important;
  }

  .urlbarView-url {
    color: #1e66f5 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #dce0e8 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #ccd0da !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #dce0e8;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #1e66f5 !important;
    --identity-icon-color: #1e66f5 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #179299 !important;
    --identity-icon-color: #179299 !important;
  }

  .identity-color-green {
    --identity-tab-color: #40a02b !important;
    --identity-icon-color: #40a02b !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #df8e1d !important;
    --identity-icon-color: #df8e1d !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fe640b !important;
    --identity-icon-color: #fe640b !important;
  }

  .identity-color-red {
    --identity-tab-color: #d20f39 !important;
    --identity-icon-color: #d20f39 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #ea76cb !important;
    --identity-icon-color: #ea76cb !important;
  }

  .identity-color-purple {
    --identity-tab-color: #8839ef !important;
    --identity-icon-color: #8839ef !important;
  }

  hbox#titlebar {
    background-color: #e6e9ef !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #e6e9ef !important;
  }
}


================================================
FILE: themes/Latte/Blue/userContent.css
================================================
/* Catppuccin Latte Blue userContent.css*/

@media (prefers-color-scheme: light) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #4c4f69 !important;
      --color-accent-primary: #1e66f5 !important;
      --color-accent-primary-hover: rgb(56, 119, 246) !important;
      --color-accent-primary-active: rgb(31, 49, 245) !important;
      background-color: #eff1f5 !important;
      --in-content-page-background: #eff1f5 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #1e66f5 !important;
    }

    .icon {
      color: #1e66f5 !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;
    }
  }

  /* Variables and styles specific to about:preferences */
  @-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(56, 119, 246) !important;
      --zen-colors-primary: #ccd0da !important;
      --in-content-box-background: #ccd0da !important;
      --zen-primary-color: #1e66f5 !important;
    }

    groupbox , moz-card{
      background: #eff1f5 !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #e6e9ef !important;
      --background-color-box: #eff1f5 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #eff1f5 !important;
      --social-color: #8839ef !important;
      --coockie-color: #04a5e5 !important;
      --fingerprinter-color: #df8e1d !important;
      --cryptominer-color: #7287fd !important;
      --tracker-color: #40a02b !important;
      --in-content-primary-button-background-hover: rgb(203, 206, 215) !important;
      --in-content-primary-button-text-color-hover: #4c4f69 !important;
      --in-content-primary-button-background: #bcc0cc !important;
      --in-content-primary-button-text-color: #4c4f69 !important;
    }


    .card {
      background-color: #ccd0da !important;
    }
  }
}


================================================
FILE: themes/Latte/Flamingo/userChrome.css
================================================
/* Catppuccin Latte Flamingo userChrome.css*/

@media (prefers-color-scheme: light) {
  :root {
    --zen-colors-primary: #ccd0da !important;
    --zen-primary-color: #dd7878 !important;
    --zen-colors-secondary: #ccd0da !important;
    --zen-colors-tertiary: #e6e9ef !important;
    --zen-colors-border: #dd7878 !important;
    --toolbarbutton-icon-fill: #dd7878 !important;
    --lwt-text-color: #4c4f69 !important;
    --toolbar-field-color: #4c4f69 !important;
    --tab-selected-textcolor: rgb(149, 99, 112) !important;
    --toolbar-field-focus-color: #4c4f69 !important;
    --toolbar-color: #4c4f69 !important;
    --newtab-text-primary-color: #4c4f69 !important;
    --arrowpanel-color: #4c4f69 !important;
    --arrowpanel-background: #eff1f5 !important;
    --sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-background-color: #dce0e8 !important;
    --toolbar-bgcolor: #ccd0da !important;
    --newtab-background-color: #eff1f5 !important;
    --zen-themed-toolbar-bg: #e6e9ef !important;
    --zen-main-browser-background: #e6e9ef !important;
    --toolbox-bgcolor-inactive: #e6e9ef !important;
  }

  #permissions-granted-icon {
    color: #e6e9ef !important;
  }

  .sidebar-placesTree {
    background-color: #eff1f5 !important;
  }

  #zen-workspaces-button {
    background-color: #eff1f5 !important;
  }

  #TabsToolbar {
    background-color: #e6e9ef !important;
  }

  .urlbar-background {
    background-color: #eff1f5 !important;
  }

  .content-shortcuts {
    background-color: #eff1f5 !important;
    border-color: #dd7878 !important;
  }

  .urlbarView-url {
    color: #dd7878 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #dce0e8 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #ccd0da !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #dce0e8;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #1e66f5 !important;
    --identity-icon-color: #1e66f5 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #179299 !important;
    --identity-icon-color: #179299 !important;
  }

  .identity-color-green {
    --identity-tab-color: #40a02b !important;
    --identity-icon-color: #40a02b !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #df8e1d !important;
    --identity-icon-color: #df8e1d !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fe640b !important;
    --identity-icon-color: #fe640b !important;
  }

  .identity-color-red {
    --identity-tab-color: #d20f39 !important;
    --identity-icon-color: #d20f39 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #ea76cb !important;
    --identity-icon-color: #ea76cb !important;
  }

  .identity-color-purple {
    --identity-tab-color: #8839ef !important;
    --identity-icon-color: #8839ef !important;
  }

  hbox#titlebar {
    background-color: #e6e9ef !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #e6e9ef !important;
  }
}


================================================
FILE: themes/Latte/Flamingo/userContent.css
================================================
/* Catppuccin Latte Flamingo userContent.css*/

@media (prefers-color-scheme: light) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #4c4f69 !important;
      --color-accent-primary: #dd7878 !important;
      --color-accent-primary-hover: rgb(226, 142, 142) !important;
      --color-accent-primary-active: rgb(221, 146, 121) !important;
      background-color: #eff1f5 !important;
      --in-content-page-background: #eff1f5 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #dd7878 !important;
    }

    .icon {
      color: #dd7878 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-latte.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Latte/Flamingo/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: #dd7878 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #e6e9ef !important;
      --in-content-text-color: #4c4f69 !important;
      --link-color: #dd7878 !important;
      --link-color-hover: rgb(226, 142, 142) !important;
      --zen-colors-primary: #ccd0da !important;
      --in-content-box-background: #ccd0da !important;
      --zen-primary-color: #dd7878 !important;
    }

    groupbox , moz-card{
      background: #eff1f5 !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #e6e9ef !important;
      --background-color-box: #eff1f5 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #eff1f5 !important;
      --social-color: #8839ef !important;
      --coockie-color: #04a5e5 !important;
      --fingerprinter-color: #df8e1d !important;
      --cryptominer-color: #7287fd !important;
      --tracker-color: #40a02b !important;
      --in-content-primary-button-background-hover: rgb(203, 206, 215) !important;
      --in-content-primary-button-text-color-hover: #4c4f69 !important;
      --in-content-primary-button-background: #bcc0cc !important;
      --in-content-primary-button-text-color: #4c4f69 !important;
    }


    .card {
      background-color: #ccd0da !important;
    }
  }
}


================================================
FILE: themes/Latte/Green/userChrome.css
================================================
/* Catppuccin Latte Green userChrome.css*/

@media (prefers-color-scheme: light) {
  :root {
    --zen-colors-primary: #ccd0da !important;
    --zen-primary-color: #40a02b !important;
    --zen-colors-secondary: #ccd0da !important;
    --zen-colors-tertiary: #e6e9ef !important;
    --zen-colors-border: #40a02b !important;
    --toolbarbutton-icon-fill: #40a02b !important;
    --lwt-text-color: #4c4f69 !important;
    --toolbar-field-color: #4c4f69 !important;
    --tab-selected-textcolor: rgb(70, 119, 74) !important;
    --toolbar-field-focus-color: #4c4f69 !important;
    --toolbar-color: #4c4f69 !important;
    --newtab-text-primary-color: #4c4f69 !important;
    --arrowpanel-color: #4c4f69 !important;
    --arrowpanel-background: #eff1f5 !important;
    --sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-background-color: #dce0e8 !important;
    --toolbar-bgcolor: #ccd0da !important;
    --newtab-background-color: #eff1f5 !important;
    --zen-themed-toolbar-bg: #e6e9ef !important;
    --zen-main-browser-background: #e6e9ef !important;
    --toolbox-bgcolor-inactive: #e6e9ef !important;
  }

  #permissions-granted-icon {
    color: #e6e9ef !important;
  }

  .sidebar-placesTree {
    background-color: #eff1f5 !important;
  }

  #zen-workspaces-button {
    background-color: #eff1f5 !important;
  }

  #TabsToolbar {
    background-color: #e6e9ef !important;
  }

  .urlbar-background {
    background-color: #eff1f5 !important;
  }

  .content-shortcuts {
    background-color: #eff1f5 !important;
    border-color: #40a02b !important;
  }

  .urlbarView-url {
    color: #40a02b !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #dce0e8 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #ccd0da !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #dce0e8;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #1e66f5 !important;
    --identity-icon-color: #1e66f5 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #179299 !important;
    --identity-icon-color: #179299 !important;
  }

  .identity-color-green {
    --identity-tab-color: #40a02b !important;
    --identity-icon-color: #40a02b !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #df8e1d !important;
    --identity-icon-color: #df8e1d !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fe640b !important;
    --identity-icon-color: #fe640b !important;
  }

  .identity-color-red {
    --identity-tab-color: #d20f39 !important;
    --identity-icon-color: #d20f39 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #ea76cb !important;
    --identity-icon-color: #ea76cb !important;
  }

  .identity-color-purple {
    --identity-tab-color: #8839ef !important;
    --identity-icon-color: #8839ef !important;
  }

  hbox#titlebar {
    background-color: #e6e9ef !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #e6e9ef !important;
  }
}


================================================
FILE: themes/Latte/Green/userContent.css
================================================
/* Catppuccin Latte Green userContent.css*/

@media (prefers-color-scheme: light) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #4c4f69 !important;
      --color-accent-primary: #40a02b !important;
      --color-accent-primary-hover: rgb(73, 181, 49) !important;
      --color-accent-primary-active: rgb(43, 161, 51) !important;
      background-color: #eff1f5 !important;
      --in-content-page-background: #eff1f5 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #40a02b !important;
    }

    .icon {
      color: #40a02b !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-latte.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Latte/Green/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: #40a02b !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #e6e9ef !important;
      --in-content-text-color: #4c4f69 !important;
      --link-color: #40a02b !important;
      --link-color-hover: rgb(73, 181, 49) !important;
      --zen-colors-primary: #ccd0da !important;
      --in-content-box-background: #ccd0da !important;
      --zen-primary-color: #40a02b !important;
    }

    groupbox , moz-card{
      background: #eff1f5 !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #e6e9ef !important;
      --background-color-box: #eff1f5 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #eff1f5 !important;
      --social-color: #8839ef !important;
      --coockie-color: #04a5e5 !important;
      --fingerprinter-color: #df8e1d !important;
      --cryptominer-color: #7287fd !important;
      --tracker-color: #40a02b !important;
      --in-content-primary-button-background-hover: rgb(203, 206, 215) !important;
      --in-content-primary-button-text-color-hover: #4c4f69 !important;
      --in-content-primary-button-background: #bcc0cc !important;
      --in-content-primary-button-text-color: #4c4f69 !important;
    }


    .card {
      background-color: #ccd0da !important;
    }
  }
}


================================================
FILE: themes/Latte/Lavender/userChrome.css
================================================
/* Catppuccin Latte Lavender userChrome.css*/

@media (prefers-color-scheme: light) {
  :root {
    --zen-colors-primary: #ccd0da !important;
    --zen-primary-color: #7287fd !important;
    --zen-colors-secondary: #ccd0da !important;
    --zen-colors-tertiary: #e6e9ef !important;
    --zen-colors-border: #7287fd !important;
    --toolbarbutton-icon-fill: #7287fd !important;
    --lwt-text-color: #4c4f69 !important;
    --toolbar-field-color: #4c4f69 !important;
    --tab-selected-textcolor: rgb(95, 107, 179) !important;
    --toolbar-field-focus-color: #4c4f69 !important;
    --toolbar-color: #4c4f69 !important;
    --newtab-text-primary-color: #4c4f69 !important;
    --arrowpanel-color: #4c4f69 !important;
    --arrowpanel-background: #eff1f5 !important;
    --sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-background-color: #dce0e8 !important;
    --toolbar-bgcolor: #ccd0da !important;
    --newtab-background-color: #eff1f5 !important;
    --zen-themed-toolbar-bg: #e6e9ef !important;
    --zen-main-browser-background: #e6e9ef !important;
    --toolbox-bgcolor-inactive: #e6e9ef !important;
  }

  #permissions-granted-icon {
    color: #e6e9ef !important;
  }

  .sidebar-placesTree {
    background-color: #eff1f5 !important;
  }

  #zen-workspaces-button {
    background-color: #eff1f5 !important;
  }

  #TabsToolbar {
    background-color: #e6e9ef !important;
  }

  .urlbar-background {
    background-color: #eff1f5 !important;
  }

  .content-shortcuts {
    background-color: #eff1f5 !important;
    border-color: #7287fd !important;
  }

  .urlbarView-url {
    color: #7287fd !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #dce0e8 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #ccd0da !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #dce0e8;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #1e66f5 !important;
    --identity-icon-color: #1e66f5 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #179299 !important;
    --identity-icon-color: #179299 !important;
  }

  .identity-color-green {
    --identity-tab-color: #40a02b !important;
    --identity-icon-color: #40a02b !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #df8e1d !important;
    --identity-icon-color: #df8e1d !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fe640b !important;
    --identity-icon-color: #fe640b !important;
  }

  .identity-color-red {
    --identity-tab-color: #d20f39 !important;
    --identity-icon-color: #d20f39 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #ea76cb !important;
    --identity-icon-color: #ea76cb !important;
  }

  .identity-color-purple {
    --identity-tab-color: #8839ef !important;
    --identity-icon-color: #8839ef !important;
  }

  hbox#titlebar {
    background-color: #e6e9ef !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #e6e9ef !important;
  }
}


================================================
FILE: themes/Latte/Lavender/userContent.css
================================================
/* Catppuccin Latte Lavender userContent.css*/

@media (prefers-color-scheme: light) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #4c4f69 !important;
      --color-accent-primary: #7287fd !important;
      --color-accent-primary-hover: rgb(141, 158, 253) !important;
      --color-accent-primary-active: rgb(129, 115, 253) !important;
      background-color: #eff1f5 !important;
      --in-content-page-background: #eff1f5 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #7287fd !important;
    }

    .icon {
      color: #7287fd !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-latte.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Latte/Lavender/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: #7287fd !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #e6e9ef !important;
      --in-content-text-color: #4c4f69 !important;
      --link-color: #7287fd !important;
      --link-color-hover: rgb(141, 158, 253) !important;
      --zen-colors-primary: #ccd0da !important;
      --in-content-box-background: #ccd0da !important;
      --zen-primary-color: #7287fd !important;
    }

    groupbox , moz-card{
      background: #eff1f5 !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #e6e9ef !important;
      --background-color-box: #eff1f5 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #eff1f5 !important;
      --social-color: #8839ef !important;
      --coockie-color: #04a5e5 !important;
      --fingerprinter-color: #df8e1d !important;
      --cryptominer-color: #7287fd !important;
      --tracker-color: #40a02b !important;
      --in-content-primary-button-background-hover: rgb(203, 206, 215) !important;
      --in-content-primary-button-text-color-hover: #4c4f69 !important;
      --in-content-primary-button-background: #bcc0cc !important;
      --in-content-primary-button-text-color: #4c4f69 !important;
    }


    .card {
      background-color: #ccd0da !important;
    }
  }
}


================================================
FILE: themes/Latte/Maroon/userChrome.css
================================================
/* Catppuccin Latte Maroon userChrome.css*/

@media (prefers-color-scheme: light) {
  :root {
    --zen-colors-primary: #ccd0da !important;
    --zen-primary-color: #e64553 !important;
    --zen-colors-secondary: #ccd0da !important;
    --zen-colors-tertiary: #e6e9ef !important;
    --zen-colors-border: #e64553 !important;
    --toolbarbutton-icon-fill: #e64553 !important;
    --lwt-text-color: #4c4f69 !important;
    --toolbar-field-color: #4c4f69 !important;
    --tab-selected-textcolor: rgb(153, 74, 94) !important;
    --toolbar-field-focus-color: #4c4f69 !important;
    --toolbar-color: #4c4f69 !important;
    --newtab-text-primary-color: #4c4f69 !important;
    --arrowpanel-color: #4c4f69 !important;
    --arrowpanel-background: #eff1f5 !important;
    --sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-background-color: #dce0e8 !important;
    --toolbar-bgcolor: #ccd0da !important;
    --newtab-background-color: #eff1f5 !important;
    --zen-themed-toolbar-bg: #e6e9ef !important;
    --zen-main-browser-background: #e6e9ef !important;
    --toolbox-bgcolor-inactive: #e6e9ef !important;
  }

  #permissions-granted-icon {
    color: #e6e9ef !important;
  }

  .sidebar-placesTree {
    background-color: #eff1f5 !important;
  }

  #zen-workspaces-button {
    background-color: #eff1f5 !important;
  }

  #TabsToolbar {
    background-color: #e6e9ef !important;
  }

  .urlbar-background {
    background-color: #eff1f5 !important;
  }

  .content-shortcuts {
    background-color: #eff1f5 !important;
    border-color: #e64553 !important;
  }

  .urlbarView-url {
    color: #e64553 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #dce0e8 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #ccd0da !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #dce0e8;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #1e66f5 !important;
    --identity-icon-color: #1e66f5 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #179299 !important;
    --identity-icon-color: #179299 !important;
  }

  .identity-color-green {
    --identity-tab-color: #40a02b !important;
    --identity-icon-color: #40a02b !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #df8e1d !important;
    --identity-icon-color: #df8e1d !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fe640b !important;
    --identity-icon-color: #fe640b !important;
  }

  .identity-color-red {
    --identity-tab-color: #d20f39 !important;
    --identity-icon-color: #d20f39 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #ea76cb !important;
    --identity-icon-color: #ea76cb !important;
  }

  .identity-color-purple {
    --identity-tab-color: #8839ef !important;
    --identity-icon-color: #8839ef !important;
  }

  hbox#titlebar {
    background-color: #e6e9ef !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #e6e9ef !important;
  }
}


================================================
FILE: themes/Latte/Maroon/userContent.css
================================================
/* Catppuccin Latte Maroon userContent.css*/

@media (prefers-color-scheme: light) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #4c4f69 !important;
      --color-accent-primary: #e64553 !important;
      --color-accent-primary-hover: rgb(233, 93, 104) !important;
      --color-accent-primary-active: rgb(230, 96, 70) !important;
      background-color: #eff1f5 !important;
      --in-content-page-background: #eff1f5 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #e64553 !important;
    }

    .icon {
      color: #e64553 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-latte.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Latte/Maroon/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: #e64553 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #e6e9ef !important;
      --in-content-text-color: #4c4f69 !important;
      --link-color: #e64553 !important;
      --link-color-hover: rgb(233, 93, 104) !important;
      --zen-colors-primary: #ccd0da !important;
      --in-content-box-background: #ccd0da !important;
      --zen-primary-color: #e64553 !important;
    }

    groupbox , moz-card{
      background: #eff1f5 !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #e6e9ef !important;
      --background-color-box: #eff1f5 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #eff1f5 !important;
      --social-color: #8839ef !important;
      --coockie-color: #04a5e5 !important;
      --fingerprinter-color: #df8e1d !important;
      --cryptominer-color: #7287fd !important;
      --tracker-color: #40a02b !important;
      --in-content-primary-button-background-hover: rgb(203, 206, 215) !important;
      --in-content-primary-button-text-color-hover: #4c4f69 !important;
      --in-content-primary-button-background: #bcc0cc !important;
      --in-content-primary-button-text-color: #4c4f69 !important;
    }


    .card {
      background-color: #ccd0da !important;
    }
  }
}


================================================
FILE: themes/Latte/Mauve/userChrome.css
================================================
/* Catppuccin Latte Mauve userChrome.css*/

@media (prefers-color-scheme: light) {
  :root {
    --zen-colors-primary: #ccd0da !important;
    --zen-primary-color: #8839ef !important;
    --zen-colors-secondary: #ccd0da !important;
    --zen-colors-tertiary: #e6e9ef !important;
    --zen-colors-border: #8839ef !important;
    --toolbarbutton-icon-fill: #8839ef !important;
    --lwt-text-color: #4c4f69 !important;
    --toolbar-field-color: #4c4f69 !important;
    --tab-selected-textcolor: rgb(106, 68, 172) !important;
    --toolbar-field-focus-color: #4c4f69 !important;
    --toolbar-color: #4c4f69 !important;
    --newtab-text-primary-color: #4c4f69 !important;
    --arrowpanel-color: #4c4f69 !important;
    --arrowpanel-background: #eff1f5 !important;
    --sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-background-color: #dce0e8 !important;
    --toolbar-bgcolor: #ccd0da !important;
    --newtab-background-color: #eff1f5 !important;
    --zen-themed-toolbar-bg: #e6e9ef !important;
    --zen-main-browser-background: #e6e9ef !important;
    --toolbox-bgcolor-inactive: #e6e9ef !important;
  }

  #permissions-granted-icon {
    color: #e6e9ef !important;
  }

  .sidebar-placesTree {
    background-color: #eff1f5 !important;
  }

  #zen-workspaces-button {
    background-color: #eff1f5 !important;
  }

  #TabsToolbar {
    background-color: #e6e9ef !important;
  }

  .urlbar-background {
    background-color: #eff1f5 !important;
  }

  .content-shortcuts {
    background-color: #eff1f5 !important;
    border-color: #8839ef !important;
  }

  .urlbarView-url {
    color: #8839ef !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #dce0e8 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #ccd0da !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #dce0e8;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #1e66f5 !important;
    --identity-icon-color: #1e66f5 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #179299 !important;
    --identity-icon-color: #179299 !important;
  }

  .identity-color-green {
    --identity-tab-color: #40a02b !important;
    --identity-icon-color: #40a02b !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #df8e1d !important;
    --identity-icon-color: #df8e1d !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fe640b !important;
    --identity-icon-color: #fe640b !important;
  }

  .identity-color-red {
    --identity-tab-color: #d20f39 !important;
    --identity-icon-color: #d20f39 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #ea76cb !important;
    --identity-icon-color: #ea76cb !important;
  }

  .identity-color-purple {
    --identity-tab-color: #8839ef !important;
    --identity-icon-color: #8839ef !important;
  }

  hbox#titlebar {
    background-color: #e6e9ef !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #e6e9ef !important;
  }
}


================================================
FILE: themes/Latte/Mauve/userContent.css
================================================
/* Catppuccin Latte Mauve userContent.css*/

@media (prefers-color-scheme: light) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #4c4f69 !important;
      --color-accent-primary: #8839ef !important;
      --color-accent-primary-hover: rgb(150, 81, 241) !important;
      --color-accent-primary-active: rgb(181, 57, 239) !important;
      background-color: #eff1f5 !important;
      --in-content-page-background: #eff1f5 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #8839ef !important;
    }

    .icon {
      color: #8839ef !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-latte.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Latte/Mauve/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: #8839ef !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #e6e9ef !important;
      --in-content-text-color: #4c4f69 !important;
      --link-color: #8839ef !important;
      --link-color-hover: rgb(150, 81, 241) !important;
      --zen-colors-primary: #ccd0da !important;
      --in-content-box-background: #ccd0da !important;
      --zen-primary-color: #8839ef !important;
    }

    groupbox , moz-card{
      background: #eff1f5 !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #e6e9ef !important;
      --background-color-box: #eff1f5 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #eff1f5 !important;
      --social-color: #8839ef !important;
      --coockie-color: #04a5e5 !important;
      --fingerprinter-color: #df8e1d !important;
      --cryptominer-color: #7287fd !important;
      --tracker-color: #40a02b !important;
      --in-content-primary-button-background-hover: rgb(203, 206, 215) !important;
      --in-content-primary-button-text-color-hover: #4c4f69 !important;
      --in-content-primary-button-background: #bcc0cc !important;
      --in-content-primary-button-text-color: #4c4f69 !important;
    }


    .card {
      background-color: #ccd0da !important;
    }
  }
}


================================================
FILE: themes/Latte/Peach/userChrome.css
================================================
/* Catppuccin Latte Peach userChrome.css*/

@media (prefers-color-scheme: light) {
  :root {
    --zen-colors-primary: #ccd0da !important;
    --zen-primary-color: #fe640b !important;
    --zen-colors-secondary: #ccd0da !important;
    --zen-colors-tertiary: #e6e9ef !important;
    --zen-colors-border: #fe640b !important;
    --toolbarbutton-icon-fill: #fe640b !important;
    --lwt-text-color: #4c4f69 !important;
    --toolbar-field-color: #4c4f69 !important;
    --tab-selected-textcolor: rgb(165, 89, 58) !important;
    --toolbar-field-focus-color: #4c4f69 !important;
    --toolbar-color: #4c4f69 !important;
    --newtab-text-primary-color: #4c4f69 !important;
    --arrowpanel-color: #4c4f69 !important;
    --arrowpanel-background: #eff1f5 !important;
    --sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-background-color: #dce0e8 !important;
    --toolbar-bgcolor: #ccd0da !important;
    --newtab-background-color: #eff1f5 !important;
    --zen-themed-toolbar-bg: #e6e9ef !important;
    --zen-main-browser-background: #e6e9ef !important;
    --toolbox-bgcolor-inactive: #e6e9ef !important;
  }

  #permissions-granted-icon {
    color: #e6e9ef !important;
  }

  .sidebar-placesTree {
    background-color: #eff1f5 !important;
  }

  #zen-workspaces-button {
    background-color: #eff1f5 !important;
  }

  #TabsToolbar {
    background-color: #e6e9ef !important;
  }

  .urlbar-background {
    background-color: #eff1f5 !important;
  }

  .content-shortcuts {
    background-color: #eff1f5 !important;
    border-color: #fe640b !important;
  }

  .urlbarView-url {
    color: #fe640b !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #dce0e8 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #ccd0da !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #dce0e8;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #1e66f5 !important;
    --identity-icon-color: #1e66f5 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #179299 !important;
    --identity-icon-color: #179299 !important;
  }

  .identity-color-green {
    --identity-tab-color: #40a02b !important;
    --identity-icon-color: #40a02b !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #df8e1d !important;
    --identity-icon-color: #df8e1d !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fe640b !important;
    --identity-icon-color: #fe640b !important;
  }

  .identity-color-red {
    --identity-tab-color: #d20f39 !important;
    --identity-icon-color: #d20f39 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #ea76cb !important;
    --identity-icon-color: #ea76cb !important;
  }

  .identity-color-purple {
    --identity-tab-color: #8839ef !important;
    --identity-icon-color: #8839ef !important;
  }

  hbox#titlebar {
    background-color: #e6e9ef !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #e6e9ef !important;
  }
}


================================================
FILE: themes/Latte/Peach/userContent.css
================================================
/* Catppuccin Latte Peach userContent.css*/

@media (prefers-color-scheme: light) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #4c4f69 !important;
      --color-accent-primary: #fe640b !important;
      --color-accent-primary-hover: rgb(254, 117, 38) !important;
      --color-accent-primary-active: rgb(254, 161, 12) !important;
      background-color: #eff1f5 !important;
      --in-content-page-background: #eff1f5 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #fe640b !important;
    }

    .icon {
      color: #fe640b !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-latte.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Latte/Peach/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: #fe640b !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #e6e9ef !important;
      --in-content-text-color: #4c4f69 !important;
      --link-color: #fe640b !important;
      --link-color-hover: rgb(254, 117, 38) !important;
      --zen-colors-primary: #ccd0da !important;
      --in-content-box-background: #ccd0da !important;
      --zen-primary-color: #fe640b !important;
    }

    groupbox , moz-card{
      background: #eff1f5 !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #e6e9ef !important;
      --background-color-box: #eff1f5 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #eff1f5 !important;
      --social-color: #8839ef !important;
      --coockie-color: #04a5e5 !important;
      --fingerprinter-color: #df8e1d !important;
      --cryptominer-color: #7287fd !important;
      --tracker-color: #40a02b !important;
      --in-content-primary-button-background-hover: rgb(203, 206, 215) !important;
      --in-content-primary-button-text-color-hover: #4c4f69 !important;
      --in-content-primary-button-background: #bcc0cc !important;
      --in-content-primary-button-text-color: #4c4f69 !important;
    }


    .card {
      background-color: #ccd0da !important;
    }
  }
}


================================================
FILE: themes/Latte/Pink/userChrome.css
================================================
/* Catppuccin Latte Pink userChrome.css*/

@media (prefers-color-scheme: light) {
  :root {
    --zen-colors-primary: #ccd0da !important;
    --zen-primary-color: #ea76cb !important;
    --zen-colors-secondary: #ccd0da !important;
    --zen-colors-tertiary: #e6e9ef !important;
    --zen-colors-border: #ea76cb !important;
    --toolbarbutton-icon-fill: #ea76cb !important;
    --lwt-text-color: #4c4f69 !important;
    --toolbar-field-color: #4c4f69 !important;
    --tab-selected-textcolor: rgb(155, 98, 154) !important;
    --toolbar-field-focus-color: #4c4f69 !important;
    --toolbar-color: #4c4f69 !important;
    --newtab-text-primary-color: #4c4f69 !important;
    --arrowpanel-color: #4c4f69 !important;
    --arrowpanel-background: #eff1f5 !important;
    --sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-background-color: #dce0e8 !important;
    --toolbar-bgcolor: #ccd0da !important;
    --newtab-background-color: #eff1f5 !important;
    --zen-themed-toolbar-bg: #e6e9ef !important;
    --zen-main-browser-background: #e6e9ef !important;
    --toolbox-bgcolor-inactive: #e6e9ef !important;
  }

  #permissions-granted-icon {
    color: #e6e9ef !important;
  }

  .sidebar-placesTree {
    background-color: #eff1f5 !important;
  }

  #zen-workspaces-button {
    background-color: #eff1f5 !important;
  }

  #TabsToolbar {
    background-color: #e6e9ef !important;
  }

  .urlbar-background {
    background-color: #eff1f5 !important;
  }

  .content-shortcuts {
    background-color: #eff1f5 !important;
    border-color: #ea76cb !important;
  }

  .urlbarView-url {
    color: #ea76cb !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #dce0e8 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #ccd0da !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #dce0e8;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #1e66f5 !important;
    --identity-icon-color: #1e66f5 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #179299 !important;
    --identity-icon-color: #179299 !important;
  }

  .identity-color-green {
    --identity-tab-color: #40a02b !important;
    --identity-icon-color: #40a02b !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #df8e1d !important;
    --identity-icon-color: #df8e1d !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fe640b !important;
    --identity-icon-color: #fe640b !important;
  }

  .identity-color-red {
    --identity-tab-color: #d20f39 !important;
    --identity-icon-color: #d20f39 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #ea76cb !important;
    --identity-icon-color: #ea76cb !important;
  }

  .identity-color-purple {
    --identity-tab-color: #8839ef !important;
    --identity-icon-color: #8839ef !important;
  }

  hbox#titlebar {
    background-color: #e6e9ef !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #e6e9ef !important;
  }
}


================================================
FILE: themes/Latte/Pink/userContent.css
================================================
/* Catppuccin Latte Pink userContent.css*/

@media (prefers-color-scheme: light) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #4c4f69 !important;
      --color-accent-primary: #ea76cb !important;
      --color-accent-primary-hover: rgb(237, 141, 212) !important;
      --color-accent-primary-active: rgb(234, 118, 174) !important;
      background-color: #eff1f5 !important;
      --in-content-page-background: #eff1f5 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #ea76cb !important;
    }

    .icon {
      color: #ea76cb !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-latte.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Latte/Pink/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: #ea76cb !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #e6e9ef !important;
      --in-content-text-color: #4c4f69 !important;
      --link-color: #ea76cb !important;
      --link-color-hover: rgb(237, 141, 212) !important;
      --zen-colors-primary: #ccd0da !important;
      --in-content-box-background: #ccd0da !important;
      --zen-primary-color: #ea76cb !important;
    }

    groupbox , moz-card{
      background: #eff1f5 !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #e6e9ef !important;
      --background-color-box: #eff1f5 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #eff1f5 !important;
      --social-color: #8839ef !important;
      --coockie-color: #04a5e5 !important;
      --fingerprinter-color: #df8e1d !important;
      --cryptominer-color: #7287fd !important;
      --tracker-color: #40a02b !important;
      --in-content-primary-button-background-hover: rgb(203, 206, 215) !important;
      --in-content-primary-button-text-color-hover: #4c4f69 !important;
      --in-content-primary-button-background: #bcc0cc !important;
      --in-content-primary-button-text-color: #4c4f69 !important;
    }


    .card {
      background-color: #ccd0da !important;
    }
  }
}


================================================
FILE: themes/Latte/Red/userChrome.css
================================================
/* Catppuccin Latte Red userChrome.css*/

@media (prefers-color-scheme: light) {
  :root {
    --zen-colors-primary: #ccd0da !important;
    --zen-primary-color: #d20f39 !important;
    --zen-colors-secondary: #ccd0da !important;
    --zen-colors-tertiary: #e6e9ef !important;
    --zen-colors-border: #d20f39 !important;
    --toolbarbutton-icon-fill: #d20f39 !important;
    --lwt-text-color: #4c4f69 !important;
    --toolbar-field-color: #4c4f69 !important;
    --tab-selected-textcolor: rgb(143, 47, 81) !important;
    --toolbar-field-focus-color: #4c4f69 !important;
    --toolbar-color: #4c4f69 !important;
    --newtab-text-primary-color: #4c4f69 !important;
    --arrowpanel-color: #4c4f69 !important;
    --arrowpanel-background: #eff1f5 !important;
    --sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-background-color: #dce0e8 !important;
    --toolbar-bgcolor: #ccd0da !important;
    --newtab-background-color: #eff1f5 !important;
    --zen-themed-toolbar-bg: #e6e9ef !important;
    --zen-main-browser-background: #e6e9ef !important;
    --toolbox-bgcolor-inactive: #e6e9ef !important;
  }

  #permissions-granted-icon {
    color: #e6e9ef !important;
  }

  .sidebar-placesTree {
    background-color: #eff1f5 !important;
  }

  #zen-workspaces-button {
    background-color: #eff1f5 !important;
  }

  #TabsToolbar {
    background-color: #e6e9ef !important;
  }

  .urlbar-background {
    background-color: #eff1f5 !important;
  }

  .content-shortcuts {
    background-color: #eff1f5 !important;
    border-color: #d20f39 !important;
  }

  .urlbarView-url {
    color: #d20f39 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #dce0e8 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #ccd0da !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #dce0e8;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #1e66f5 !important;
    --identity-icon-color: #1e66f5 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #179299 !important;
    --identity-icon-color: #179299 !important;
  }

  .identity-color-green {
    --identity-tab-color: #40a02b !important;
    --identity-icon-color: #40a02b !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #df8e1d !important;
    --identity-icon-color: #df8e1d !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fe640b !important;
    --identity-icon-color: #fe640b !important;
  }

  .identity-color-red {
    --identity-tab-color: #d20f39 !important;
    --identity-icon-color: #d20f39 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #ea76cb !important;
    --identity-icon-color: #ea76cb !important;
  }

  .identity-color-purple {
    --identity-tab-color: #8839ef !important;
    --identity-icon-color: #8839ef !important;
  }

  hbox#titlebar {
    background-color: #e6e9ef !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #e6e9ef !important;
  }
}


================================================
FILE: themes/Latte/Red/userContent.css
================================================
/* Catppuccin Latte Red userContent.css*/

@media (prefers-color-scheme: light) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #4c4f69 !important;
      --color-accent-primary: #d20f39 !important;
      --color-accent-primary-hover: rgb(235, 17, 64) !important;
      --color-accent-primary-active: rgb(211, 22, 15) !important;
      background-color: #eff1f5 !important;
      --in-content-page-background: #eff1f5 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #d20f39 !important;
    }

    .icon {
      color: #d20f39 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-latte.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Latte/Red/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: #d20f39 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #e6e9ef !important;
      --in-content-text-color: #4c4f69 !important;
      --link-color: #d20f39 !important;
      --link-color-hover: rgb(235, 17, 64) !important;
      --zen-colors-primary: #ccd0da !important;
      --in-content-box-background: #ccd0da !important;
      --zen-primary-color: #d20f39 !important;
    }

    groupbox , moz-card{
      background: #eff1f5 !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #e6e9ef !important;
      --background-color-box: #eff1f5 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #eff1f5 !important;
      --social-color: #8839ef !important;
      --coockie-color: #04a5e5 !important;
      --fingerprinter-color: #df8e1d !important;
      --cryptominer-color: #7287fd !important;
      --tracker-color: #40a02b !important;
      --in-content-primary-button-background-hover: rgb(203, 206, 215) !important;
      --in-content-primary-button-text-color-hover: #4c4f69 !important;
      --in-content-primary-button-background: #bcc0cc !important;
      --in-content-primary-button-text-color: #4c4f69 !important;
    }


    .card {
      background-color: #ccd0da !important;
    }
  }
}


================================================
FILE: themes/Latte/Rosewater/userChrome.css
================================================
/* Catppuccin Latte Rosewater userChrome.css*/

@media (prefers-color-scheme: light) {
  :root {
    --zen-colors-primary: #ccd0da !important;
    --zen-primary-color: #dc8a78 !important;
    --zen-colors-secondary: #ccd0da !important;
    --zen-colors-tertiary: #e6e9ef !important;
    --zen-colors-border: #dc8a78 !important;
    --toolbarbutton-icon-fill: #dc8a78 !important;
    --lwt-text-color: #4c4f69 !important;
    --toolbar-field-color: #4c4f69 !important;
    --tab-selected-textcolor: rgb(148, 108, 112) !important;
    --toolbar-field-focus-color: #4c4f69 !important;
    --toolbar-color: #4c4f69 !important;
    --newtab-text-primary-color: #4c4f69 !important;
    --arrowpanel-color: #4c4f69 !important;
    --arrowpanel-background: #eff1f5 !important;
    --sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-background-color: #dce0e8 !important;
    --toolbar-bgcolor: #ccd0da !important;
    --newtab-background-color: #eff1f5 !important;
    --zen-themed-toolbar-bg: #e6e9ef !important;
    --zen-main-browser-background: #e6e9ef !important;
    --toolbox-bgcolor-inactive: #e6e9ef !important;
  }

  #permissions-granted-icon {
    color: #e6e9ef !important;
  }

  .sidebar-placesTree {
    background-color: #eff1f5 !important;
  }

  #zen-workspaces-button {
    background-color: #eff1f5 !important;
  }

  #TabsToolbar {
    background-color: #e6e9ef !important;
  }

  .urlbar-background {
    background-color: #eff1f5 !important;
  }

  .content-shortcuts {
    background-color: #eff1f5 !important;
    border-color: #dc8a78 !important;
  }

  .urlbarView-url {
    color: #dc8a78 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #dce0e8 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #ccd0da !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #dce0e8;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #1e66f5 !important;
    --identity-icon-color: #1e66f5 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #179299 !important;
    --identity-icon-color: #179299 !important;
  }

  .identity-color-green {
    --identity-tab-color: #40a02b !important;
    --identity-icon-color: #40a02b !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #df8e1d !important;
    --identity-icon-color: #df8e1d !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fe640b !important;
    --identity-icon-color: #fe640b !important;
  }

  .identity-color-red {
    --identity-tab-color: #d20f39 !important;
    --identity-icon-color: #d20f39 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #ea76cb !important;
    --identity-icon-color: #ea76cb !important;
  }

  .identity-color-purple {
    --identity-tab-color: #8839ef !important;
    --identity-icon-color: #8839ef !important;
  }

  hbox#titlebar {
    background-color: #e6e9ef !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #e6e9ef !important;
  }
}


================================================
FILE: themes/Latte/Rosewater/userContent.css
================================================
/* Catppuccin Latte Rosewater userContent.css*/

@media (prefers-color-scheme: light) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #4c4f69 !important;
      --color-accent-primary: #dc8a78 !important;
      --color-accent-primary-hover: rgb(225, 156, 141) !important;
      --color-accent-primary-active: rgb(220, 163, 120) !important;
      background-color: #eff1f5 !important;
      --in-content-page-background: #eff1f5 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #dc8a78 !important;
    }

    .icon {
      color: #dc8a78 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-latte.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Latte/Rosewater/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: #dc8a78 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #e6e9ef !important;
      --in-content-text-color: #4c4f69 !important;
      --link-color: #dc8a78 !important;
      --link-color-hover: rgb(225, 156, 141) !important;
      --zen-colors-primary: #ccd0da !important;
      --in-content-box-background: #ccd0da !important;
      --zen-primary-color: #dc8a78 !important;
    }

    groupbox , moz-card{
      background: #eff1f5 !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #e6e9ef !important;
      --background-color-box: #eff1f5 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #eff1f5 !important;
      --social-color: #8839ef !important;
      --coockie-color: #04a5e5 !important;
      --fingerprinter-color: #df8e1d !important;
      --cryptominer-color: #7287fd !important;
      --tracker-color: #40a02b !important;
      --in-content-primary-button-background-hover: rgb(203, 206, 215) !important;
      --in-content-primary-button-text-color-hover: #4c4f69 !important;
      --in-content-primary-button-background: #bcc0cc !important;
      --in-content-primary-button-text-color: #4c4f69 !important;
    }


    .card {
      background-color: #ccd0da !important;
    }
  }
}


================================================
FILE: themes/Latte/Sapphire/userChrome.css
================================================
/* Catppuccin Latte Sapphire userChrome.css*/

@media (prefers-color-scheme: light) {
  :root {
    --zen-colors-primary: #ccd0da !important;
    --zen-primary-color: #209fb5 !important;
    --zen-colors-secondary: #ccd0da !important;
    --zen-colors-tertiary: #e6e9ef !important;
    --zen-colors-border: #209fb5 !important;
    --toolbarbutton-icon-fill: #209fb5 !important;
    --lwt-text-color: #4c4f69 !important;
    --toolbar-field-color: #4c4f69 !important;
    --tab-selected-textcolor: rgb(54, 119, 143) !important;
    --toolbar-field-focus-color: #4c4f69 !important;
    --toolbar-color: #4c4f69 !important;
    --newtab-text-primary-color: #4c4f69 !important;
    --arrowpanel-color: #4c4f69 !important;
    --arrowpanel-background: #eff1f5 !important;
    --sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-background-color: #dce0e8 !important;
    --toolbar-bgcolor: #ccd0da !important;
    --newtab-background-color: #eff1f5 !important;
    --zen-themed-toolbar-bg: #e6e9ef !important;
    --zen-main-browser-background: #e6e9ef !important;
    --toolbox-bgcolor-inactive: #e6e9ef !important;
  }

  #permissions-granted-icon {
    color: #e6e9ef !important;
  }

  .sidebar-placesTree {
    background-color: #eff1f5 !important;
  }

  #zen-workspaces-button {
    background-color: #eff1f5 !important;
  }

  #TabsToolbar {
    background-color: #e6e9ef !important;
  }

  .urlbar-background {
    background-color: #eff1f5 !important;
  }

  .content-shortcuts {
    background-color: #eff1f5 !important;
    border-color: #209fb5 !important;
  }

  .urlbarView-url {
    color: #209fb5 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #dce0e8 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #ccd0da !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #dce0e8;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #1e66f5 !important;
    --identity-icon-color: #1e66f5 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #179299 !important;
    --identity-icon-color: #179299 !important;
  }

  .identity-color-green {
    --identity-tab-color: #40a02b !important;
    --identity-icon-color: #40a02b !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #df8e1d !important;
    --identity-icon-color: #df8e1d !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fe640b !important;
    --identity-icon-color: #fe640b !important;
  }

  .identity-color-red {
    --identity-tab-color: #d20f39 !important;
    --identity-icon-color: #d20f39 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #ea76cb !important;
    --identity-icon-color: #ea76cb !important;
  }

  .identity-color-purple {
    --identity-tab-color: #8839ef !important;
    --identity-icon-color: #8839ef !important;
  }

  hbox#titlebar {
    background-color: #e6e9ef !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #e6e9ef !important;
  }
}


================================================
FILE: themes/Latte/Sapphire/userContent.css
================================================
/* Catppuccin Latte Sapphire userContent.css*/

@media (prefers-color-scheme: light) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #4c4f69 !important;
      --color-accent-primary: #209fb5 !important;
      --color-accent-primary-hover: rgb(36, 179, 204) !important;
      --color-accent-primary-active: rgb(32, 122, 182) !important;
      background-color: #eff1f5 !important;
      --in-content-page-background: #eff1f5 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #209fb5 !important;
    }

    .icon {
      color: #209fb5 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-latte.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Latte/Sapphire/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: #209fb5 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #e6e9ef !important;
      --in-content-text-color: #4c4f69 !important;
      --link-color: #209fb5 !important;
      --link-color-hover: rgb(36, 179, 204) !important;
      --zen-colors-primary: #ccd0da !important;
      --in-content-box-background: #ccd0da !important;
      --zen-primary-color: #209fb5 !important;
    }

    groupbox , moz-card{
      background: #eff1f5 !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #e6e9ef !important;
      --background-color-box: #eff1f5 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #eff1f5 !important;
      --social-color: #8839ef !important;
      --coockie-color: #04a5e5 !important;
      --fingerprinter-color: #df8e1d !important;
      --cryptominer-color: #7287fd !important;
      --tracker-color: #40a02b !important;
      --in-content-primary-button-background-hover: rgb(203, 206, 215) !important;
      --in-content-primary-button-text-color-hover: #4c4f69 !important;
      --in-content-primary-button-background: #bcc0cc !important;
      --in-content-primary-button-text-color: #4c4f69 !important;
    }


    .card {
      background-color: #ccd0da !important;
    }
  }
}


================================================
FILE: themes/Latte/Sky/userChrome.css
================================================
/* Catppuccin Latte Sky userChrome.css*/

@media (prefers-color-scheme: light) {
  :root {
    --zen-colors-primary: #ccd0da !important;
    --zen-primary-color: #04a5e5 !important;
    --zen-colors-secondary: #ccd0da !important;
    --zen-colors-tertiary: #e6e9ef !important;
    --zen-colors-border: #04a5e5 !important;
    --toolbarbutton-icon-fill: #04a5e5 !important;
    --lwt-text-color: #4c4f69 !important;
    --toolbar-field-color: #4c4f69 !important;
    --tab-selected-textcolor: rgb(40, 122, 167) !important;
    --toolbar-field-focus-color: #4c4f69 !important;
    --toolbar-color: #4c4f69 !important;
    --newtab-text-primary-color: #4c4f69 !important;
    --arrowpanel-color: #4c4f69 !important;
    --arrowpanel-background: #eff1f5 !important;
    --sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-background-color: #dce0e8 !important;
    --toolbar-bgcolor: #ccd0da !important;
    --newtab-background-color: #eff1f5 !important;
    --zen-themed-toolbar-bg: #e6e9ef !important;
    --zen-main-browser-background: #e6e9ef !important;
    --toolbox-bgcolor-inactive: #e6e9ef !important;
  }

  #permissions-granted-icon {
    color: #e6e9ef !important;
  }

  .sidebar-placesTree {
    background-color: #eff1f5 !important;
  }

  #zen-workspaces-button {
    background-color: #eff1f5 !important;
  }

  #TabsToolbar {
    background-color: #e6e9ef !important;
  }

  .urlbar-background {
    background-color: #eff1f5 !important;
  }

  .content-shortcuts {
    background-color: #eff1f5 !important;
    border-color: #04a5e5 !important;
  }

  .urlbarView-url {
    color: #04a5e5 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #dce0e8 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #ccd0da !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #dce0e8;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #1e66f5 !important;
    --identity-icon-color: #1e66f5 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #179299 !important;
    --identity-icon-color: #179299 !important;
  }

  .identity-color-green {
    --identity-tab-color: #40a02b !important;
    --identity-icon-color: #40a02b !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #df8e1d !important;
    --identity-icon-color: #df8e1d !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fe640b !important;
    --identity-icon-color: #fe640b !important;
  }

  .identity-color-red {
    --identity-tab-color: #d20f39 !important;
    --identity-icon-color: #d20f39 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #ea76cb !important;
    --identity-icon-color: #ea76cb !important;
  }

  .identity-color-purple {
    --identity-tab-color: #8839ef !important;
    --identity-icon-color: #8839ef !important;
  }

  hbox#titlebar {
    background-color: #e6e9ef !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #e6e9ef !important;
  }
}


================================================
FILE: themes/Latte/Sky/userContent.css
================================================
/* Catppuccin Latte Sky userContent.css*/

@media (prefers-color-scheme: light) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #4c4f69 !important;
      --color-accent-primary: #04a5e5 !important;
      --color-accent-primary-hover: rgb(9, 182, 251) !important;
      --color-accent-primary-active: rgb(4, 109, 230) !important;
      background-color: #eff1f5 !important;
      --in-content-page-background: #eff1f5 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #04a5e5 !important;
    }

    .icon {
      color: #04a5e5 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-latte.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Latte/Sky/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: #04a5e5 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #e6e9ef !important;
      --in-content-text-color: #4c4f69 !important;
      --link-color: #04a5e5 !important;
      --link-color-hover: rgb(9, 182, 251) !important;
      --zen-colors-primary: #ccd0da !important;
      --in-content-box-background: #ccd0da !important;
      --zen-primary-color: #04a5e5 !important;
    }

    groupbox , moz-card{
      background: #eff1f5 !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #e6e9ef !important;
      --background-color-box: #eff1f5 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #eff1f5 !important;
      --social-color: #8839ef !important;
      --coockie-color: #04a5e5 !important;
      --fingerprinter-color: #df8e1d !important;
      --cryptominer-color: #7287fd !important;
      --tracker-color: #40a02b !important;
      --in-content-primary-button-background-hover: rgb(203, 206, 215) !important;
      --in-content-primary-button-text-color-hover: #4c4f69 !important;
      --in-content-primary-button-background: #bcc0cc !important;
      --in-content-primary-button-text-color: #4c4f69 !important;
    }


    .card {
      background-color: #ccd0da !important;
    }
  }
}


================================================
FILE: themes/Latte/Teal/userChrome.css
================================================
/* Catppuccin Latte Teal userChrome.css*/

@media (prefers-color-scheme: light) {
  :root {
    --zen-colors-primary: #ccd0da !important;
    --zen-primary-color: #179299 !important;
    --zen-colors-secondary: #ccd0da !important;
    --zen-colors-tertiary: #e6e9ef !important;
    --zen-colors-border: #179299 !important;
    --toolbarbutton-icon-fill: #179299 !important;
    --lwt-text-color: #4c4f69 !important;
    --toolbar-field-color: #4c4f69 !important;
    --tab-selected-textcolor: rgb(50, 112, 129) !important;
    --toolbar-field-focus-color: #4c4f69 !important;
    --toolbar-color: #4c4f69 !important;
    --newtab-text-primary-color: #4c4f69 !important;
    --arrowpanel-color: #4c4f69 !important;
    --arrowpanel-background: #eff1f5 !important;
    --sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-background-color: #dce0e8 !important;
    --toolbar-bgcolor: #ccd0da !important;
    --newtab-background-color: #eff1f5 !important;
    --zen-themed-toolbar-bg: #e6e9ef !important;
    --zen-main-browser-background: #e6e9ef !important;
    --toolbox-bgcolor-inactive: #e6e9ef !important;
  }

  #permissions-granted-icon {
    color: #e6e9ef !important;
  }

  .sidebar-placesTree {
    background-color: #eff1f5 !important;
  }

  #zen-workspaces-button {
    background-color: #eff1f5 !important;
  }

  #TabsToolbar {
    background-color: #e6e9ef !important;
  }

  .urlbar-background {
    background-color: #eff1f5 !important;
  }

  .content-shortcuts {
    background-color: #eff1f5 !important;
    border-color: #179299 !important;
  }

  .urlbarView-url {
    color: #179299 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #dce0e8 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #ccd0da !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #dce0e8;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #1e66f5 !important;
    --identity-icon-color: #1e66f5 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #179299 !important;
    --identity-icon-color: #179299 !important;
  }

  .identity-color-green {
    --identity-tab-color: #40a02b !important;
    --identity-icon-color: #40a02b !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #df8e1d !important;
    --identity-icon-color: #df8e1d !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fe640b !important;
    --identity-icon-color: #fe640b !important;
  }

  .identity-color-red {
    --identity-tab-color: #d20f39 !important;
    --identity-icon-color: #d20f39 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #ea76cb !important;
    --identity-icon-color: #ea76cb !important;
  }

  .identity-color-purple {
    --identity-tab-color: #8839ef !important;
    --identity-icon-color: #8839ef !important;
  }

  hbox#titlebar {
    background-color: #e6e9ef !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #e6e9ef !important;
  }
}


================================================
FILE: themes/Latte/Teal/userContent.css
================================================
/* Catppuccin Latte Teal userContent.css*/

@media (prefers-color-scheme: light) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #4c4f69 !important;
      --color-accent-primary: #179299 !important;
      --color-accent-primary-hover: rgb(27, 168, 175) !important;
      --color-accent-primary-active: rgb(23, 114, 153) !important;
      background-color: #eff1f5 !important;
      --in-content-page-background: #eff1f5 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #179299 !important;
    }

    .icon {
      color: #179299 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-latte.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Latte/Teal/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: #179299 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #e6e9ef !important;
      --in-content-text-color: #4c4f69 !important;
      --link-color: #179299 !important;
      --link-color-hover: rgb(27, 168, 175) !important;
      --zen-colors-primary: #ccd0da !important;
      --in-content-box-background: #ccd0da !important;
      --zen-primary-color: #179299 !important;
    }

    groupbox , moz-card{
      background: #eff1f5 !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #e6e9ef !important;
      --background-color-box: #eff1f5 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #eff1f5 !important;
      --social-color: #8839ef !important;
      --coockie-color: #04a5e5 !important;
      --fingerprinter-color: #df8e1d !important;
      --cryptominer-color: #7287fd !important;
      --tracker-color: #40a02b !important;
      --in-content-primary-button-background-hover: rgb(203, 206, 215) !important;
      --in-content-primary-button-text-color-hover: #4c4f69 !important;
      --in-content-primary-button-background: #bcc0cc !important;
      --in-content-primary-button-text-color: #4c4f69 !important;
    }


    .card {
      background-color: #ccd0da !important;
    }
  }
}


================================================
FILE: themes/Latte/Yellow/userChrome.css
================================================
/* Catppuccin Latte Yellow userChrome.css*/

@media (prefers-color-scheme: light) {
  :root {
    --zen-colors-primary: #ccd0da !important;
    --zen-primary-color: #df8e1d !important;
    --zen-colors-secondary: #ccd0da !important;
    --zen-colors-tertiary: #e6e9ef !important;
    --zen-colors-border: #df8e1d !important;
    --toolbarbutton-icon-fill: #df8e1d !important;
    --lwt-text-color: #4c4f69 !important;
    --toolbar-field-color: #4c4f69 !important;
    --tab-selected-textcolor: rgb(150, 110, 67) !important;
    --toolbar-field-focus-color: #4c4f69 !important;
    --toolbar-color: #4c4f69 !important;
    --newtab-text-primary-color: #4c4f69 !important;
    --arrowpanel-color: #4c4f69 !important;
    --arrowpanel-background: #eff1f5 !important;
    --sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-text-color: #4c4f69 !important;
    --lwt-sidebar-background-color: #dce0e8 !important;
    --toolbar-bgcolor: #ccd0da !important;
    --newtab-background-color: #eff1f5 !important;
    --zen-themed-toolbar-bg: #e6e9ef !important;
    --zen-main-browser-background: #e6e9ef !important;
    --toolbox-bgcolor-inactive: #e6e9ef !important;
  }

  #permissions-granted-icon {
    color: #e6e9ef !important;
  }

  .sidebar-placesTree {
    background-color: #eff1f5 !important;
  }

  #zen-workspaces-button {
    background-color: #eff1f5 !important;
  }

  #TabsToolbar {
    background-color: #e6e9ef !important;
  }

  .urlbar-background {
    background-color: #eff1f5 !important;
  }

  .content-shortcuts {
    background-color: #eff1f5 !important;
    border-color: #df8e1d !important;
  }

  .urlbarView-url {
    color: #df8e1d !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #dce0e8 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #ccd0da !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #dce0e8;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #1e66f5 !important;
    --identity-icon-color: #1e66f5 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #179299 !important;
    --identity-icon-color: #179299 !important;
  }

  .identity-color-green {
    --identity-tab-color: #40a02b !important;
    --identity-icon-color: #40a02b !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #df8e1d !important;
    --identity-icon-color: #df8e1d !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fe640b !important;
    --identity-icon-color: #fe640b !important;
  }

  .identity-color-red {
    --identity-tab-color: #d20f39 !important;
    --identity-icon-color: #d20f39 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #ea76cb !important;
    --identity-icon-color: #ea76cb !important;
  }

  .identity-color-purple {
    --identity-tab-color: #8839ef !important;
    --identity-icon-color: #8839ef !important;
  }

  hbox#titlebar {
    background-color: #e6e9ef !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #e6e9ef !important;
  }
}


================================================
FILE: themes/Latte/Yellow/userContent.css
================================================
/* Catppuccin Latte Yellow userContent.css*/

@media (prefers-color-scheme: light) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #4c4f69 !important;
      --color-accent-primary: #df8e1d !important;
      --color-accent-primary-hover: rgb(228, 154, 50) !important;
      --color-accent-primary-active: rgb(223, 191, 29) !important;
      background-color: #eff1f5 !important;
      --in-content-page-background: #eff1f5 !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #df8e1d !important;
    }

    .icon {
      color: #df8e1d !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-latte.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Latte/Yellow/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: #df8e1d !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #e6e9ef !important;
      --in-content-text-color: #4c4f69 !important;
      --link-color: #df8e1d !important;
      --link-color-hover: rgb(228, 154, 50) !important;
      --zen-colors-primary: #ccd0da !important;
      --in-content-box-background: #ccd0da !important;
      --zen-primary-color: #df8e1d !important;
    }

    groupbox , moz-card{
      background: #eff1f5 !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #e6e9ef !important;
      --background-color-box: #eff1f5 !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #eff1f5 !important;
      --social-color: #8839ef !important;
      --coockie-color: #04a5e5 !important;
      --fingerprinter-color: #df8e1d !important;
      --cryptominer-color: #7287fd !important;
      --tracker-color: #40a02b !important;
      --in-content-primary-button-background-hover: rgb(203, 206, 215) !important;
      --in-content-primary-button-text-color-hover: #4c4f69 !important;
      --in-content-primary-button-background: #bcc0cc !important;
      --in-content-primary-button-text-color: #4c4f69 !important;
    }


    .card {
      background-color: #ccd0da !important;
    }
  }
}


================================================
FILE: themes/Macchiato/Blue/userChrome.css
================================================
/* Catppuccin Macchiato Blue userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #363a4f !important;
    --zen-primary-color: #8aadf4 !important;
    --zen-colors-secondary: #363a4f !important;
    --zen-colors-tertiary: #1e2030 !important;
    --zen-colors-border: #8aadf4 !important;
    --toolbarbutton-icon-fill: #8aadf4 !important;
    --lwt-text-color: #cad3f5 !important;
    --toolbar-field-color: #cad3f5 !important;
    --tab-selected-textcolor: rgb(170, 192, 244) !important;
    --toolbar-field-focus-color: #cad3f5 !important;
    --toolbar-color: #cad3f5 !important;
    --newtab-text-primary-color: #cad3f5 !important;
    --arrowpanel-color: #cad3f5 !important;
    --arrowpanel-background: #24273a !important;
    --sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-background-color: #181926 !important;
    --toolbar-bgcolor: #363a4f !important;
    --newtab-background-color: #24273a !important;
    --zen-themed-toolbar-bg: #1e2030 !important;
    --zen-main-browser-background: #1e2030 !important;
    --toolbox-bgcolor-inactive: #1e2030 !important;
  }

  #permissions-granted-icon {
    color: #1e2030 !important;
  }

  .sidebar-placesTree {
    background-color: #24273a !important;
  }

  #zen-workspaces-button {
    background-color: #24273a !important;
  }

  #TabsToolbar {
    background-color: #1e2030 !important;
  }

  .urlbar-background {
    background-color: #24273a !important;
  }

  .content-shortcuts {
    background-color: #24273a !important;
    border-color: #8aadf4 !important;
  }

  .urlbarView-url {
    color: #8aadf4 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #181926 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #363a4f !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #181926;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8aadf4 !important;
    --identity-icon-color: #8aadf4 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #8bd5ca !important;
    --identity-icon-color: #8bd5ca !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6da95 !important;
    --identity-icon-color: #a6da95 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #eed49f !important;
    --identity-icon-color: #eed49f !important;
  }

  .identity-color-orange {
    --identity-tab-color: #f5a97f !important;
    --identity-icon-color: #f5a97f !important;
  }

  .identity-color-red {
    --identity-tab-color: #ed8796 !important;
    --identity-icon-color: #ed8796 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5bde6 !important;
    --identity-icon-color: #f5bde6 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #c6a0f6 !important;
    --identity-icon-color: #c6a0f6 !important;
  }

  hbox#titlebar {
    background-color: #1e2030 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #1e2030 !important;
  }
}


================================================
FILE: themes/Macchiato/Blue/userContent.css
================================================
/* Catppuccin Macchiato Blue userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cad3f5 !important;
      --color-accent-primary: #8aadf4 !important;
      --color-accent-primary-hover: rgb(162, 190, 246) !important;
      --color-accent-primary-active: rgb(138, 147, 244) !important;
      background-color: #24273a !important;
      --in-content-page-background: #24273a !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #24273a !important;
      --newtab-background-color-secondary: #363a4f !important;
      --newtab-element-hover-color: #363a4f !important;
      --newtab-text-primary-color: #cad3f5 !important;
      --newtab-wordmark-color: #cad3f5 !important;
      --newtab-primary-action-background: #8aadf4 !important;
    }

    .icon {
      color: #8aadf4 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-macchiato.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Macchiato/Blue/zen-logo-macchiato.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: #8aadf4 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #1e2030 !important;
      --in-content-text-color: #cad3f5 !important;
      --link-color: #8aadf4 !important;
      --link-color-hover: rgb(162, 190, 246) !important;
      --zen-colors-primary: #363a4f !important;
      --in-content-box-background: #363a4f !important;
      --zen-primary-color: #8aadf4 !important;
    }

    groupbox , moz-card{
      background: #24273a !important;
    }

    button,
    groupbox menulist {
      background: #363a4f !important;
      color: #cad3f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #1e2030 !important;
      --background-color-box: #24273a !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #24273a !important;
      --social-color: #c6a0f6 !important;
      --coockie-color: #91d7e3 !important;
      --fingerprinter-color: #eed49f !important;
      --cryptominer-color: #b7bdf8 !important;
      --tracker-color: #a6da95 !important;
      --in-content-primary-button-background-hover: rgb(84, 89, 116) !important;
      --in-content-primary-button-text-color-hover: #cad3f5 !important;
      --in-content-primary-button-background: #494d64 !important;
      --in-content-primary-button-text-color: #cad3f5 !important;
    }


    .card {
      background-color: #363a4f !important;
    }
  }
}


================================================
FILE: themes/Macchiato/Flamingo/userChrome.css
================================================
/* Catppuccin Macchiato Flamingo userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #363a4f !important;
    --zen-primary-color: #f0c6c6 !important;
    --zen-colors-secondary: #363a4f !important;
    --zen-colors-tertiary: #1e2030 !important;
    --zen-colors-border: #f0c6c6 !important;
    --toolbarbutton-icon-fill: #f0c6c6 !important;
    --lwt-text-color: #cad3f5 !important;
    --toolbar-field-color: #cad3f5 !important;
    --tab-selected-textcolor: rgb(221, 204, 221) !important;
    --toolbar-field-focus-color: #cad3f5 !important;
    --toolbar-color: #cad3f5 !important;
    --newtab-text-primary-color: #cad3f5 !important;
    --arrowpanel-color: #cad3f5 !important;
    --arrowpanel-background: #24273a !important;
    --sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-background-color: #181926 !important;
    --toolbar-bgcolor: #363a4f !important;
    --newtab-background-color: #24273a !important;
    --zen-themed-toolbar-bg: #1e2030 !important;
    --zen-main-browser-background: #1e2030 !important;
    --toolbox-bgcolor-inactive: #1e2030 !important;
  }

  #permissions-granted-icon {
    color: #1e2030 !important;
  }

  .sidebar-placesTree {
    background-color: #24273a !important;
  }

  #zen-workspaces-button {
    background-color: #24273a !important;
  }

  #TabsToolbar {
    background-color: #1e2030 !important;
  }

  .urlbar-background {
    background-color: #24273a !important;
  }

  .content-shortcuts {
    background-color: #24273a !important;
    border-color: #f0c6c6 !important;
  }

  .urlbarView-url {
    color: #f0c6c6 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #181926 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #363a4f !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #181926;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8aadf4 !important;
    --identity-icon-color: #8aadf4 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #8bd5ca !important;
    --identity-icon-color: #8bd5ca !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6da95 !important;
    --identity-icon-color: #a6da95 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #eed49f !important;
    --identity-icon-color: #eed49f !important;
  }

  .identity-color-orange {
    --identity-tab-color: #f5a97f !important;
    --identity-icon-color: #f5a97f !important;
  }

  .identity-color-red {
    --identity-tab-color: #ed8796 !important;
    --identity-icon-color: #ed8796 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5bde6 !important;
    --identity-icon-color: #f5bde6 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #c6a0f6 !important;
    --identity-icon-color: #c6a0f6 !important;
  }

  hbox#titlebar {
    background-color: #1e2030 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #1e2030 !important;
  }
}


================================================
FILE: themes/Macchiato/Flamingo/userContent.css
================================================
/* Catppuccin Macchiato Flamingo userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cad3f5 !important;
      --color-accent-primary: #f0c6c6 !important;
      --color-accent-primary-hover: rgb(245, 219, 219) !important;
      --color-accent-primary-active: rgb(240, 208, 198) !important;
      background-color: #24273a !important;
      --in-content-page-background: #24273a !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #24273a !important;
      --newtab-background-color-secondary: #363a4f !important;
      --newtab-element-hover-color: #363a4f !important;
      --newtab-text-primary-color: #cad3f5 !important;
      --newtab-wordmark-color: #cad3f5 !important;
      --newtab-primary-action-background: #f0c6c6 !important;
    }

    .icon {
      color: #f0c6c6 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-macchiato.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Macchiato/Flamingo/zen-logo-macchiato.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: #f0c6c6 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #1e2030 !important;
      --in-content-text-color: #cad3f5 !important;
      --link-color: #f0c6c6 !important;
      --link-color-hover: rgb(245, 219, 219) !important;
      --zen-colors-primary: #363a4f !important;
      --in-content-box-background: #363a4f !important;
      --zen-primary-color: #f0c6c6 !important;
    }

    groupbox , moz-card{
      background: #24273a !important;
    }

    button,
    groupbox menulist {
      background: #363a4f !important;
      color: #cad3f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #1e2030 !important;
      --background-color-box: #24273a !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #24273a !important;
      --social-color: #c6a0f6 !important;
      --coockie-color: #91d7e3 !important;
      --fingerprinter-color: #eed49f !important;
      --cryptominer-color: #b7bdf8 !important;
      --tracker-color: #a6da95 !important;
      --in-content-primary-button-background-hover: rgb(84, 89, 116) !important;
      --in-content-primary-button-text-color-hover: #cad3f5 !important;
      --in-content-primary-button-background: #494d64 !important;
      --in-content-primary-button-text-color: #cad3f5 !important;
    }


    .card {
      background-color: #363a4f !important;
    }
  }
}


================================================
FILE: themes/Macchiato/Green/userChrome.css
================================================
/* Catppuccin Macchiato Green userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #363a4f !important;
    --zen-primary-color: #a6da95 !important;
    --zen-colors-secondary: #363a4f !important;
    --zen-colors-tertiary: #1e2030 !important;
    --zen-colors-border: #a6da95 !important;
    --toolbarbutton-icon-fill: #a6da95 !important;
    --lwt-text-color: #cad3f5 !important;
    --toolbar-field-color: #cad3f5 !important;
    --tab-selected-textcolor: rgb(184, 214, 197) !important;
    --toolbar-field-focus-color: #cad3f5 !important;
    --toolbar-color: #cad3f5 !important;
    --newtab-text-primary-color: #cad3f5 !important;
    --arrowpanel-color: #cad3f5 !important;
    --arrowpanel-background: #24273a !important;
    --sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-background-color: #181926 !important;
    --toolbar-bgcolor: #363a4f !important;
    --newtab-background-color: #24273a !important;
    --zen-themed-toolbar-bg: #1e2030 !important;
    --zen-main-browser-background: #1e2030 !important;
    --toolbox-bgcolor-inactive: #1e2030 !important;
  }

  #permissions-granted-icon {
    color: #1e2030 !important;
  }

  .sidebar-placesTree {
    background-color: #24273a !important;
  }

  #zen-workspaces-button {
    background-color: #24273a !important;
  }

  #TabsToolbar {
    background-color: #1e2030 !important;
  }

  .urlbar-background {
    background-color: #24273a !important;
  }

  .content-shortcuts {
    background-color: #24273a !important;
    border-color: #a6da95 !important;
  }

  .urlbarView-url {
    color: #a6da95 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #181926 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #363a4f !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #181926;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8aadf4 !important;
    --identity-icon-color: #8aadf4 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #8bd5ca !important;
    --identity-icon-color: #8bd5ca !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6da95 !important;
    --identity-icon-color: #a6da95 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #eed49f !important;
    --identity-icon-color: #eed49f !important;
  }

  .identity-color-orange {
    --identity-tab-color: #f5a97f !important;
    --identity-icon-color: #f5a97f !important;
  }

  .identity-color-red {
    --identity-tab-color: #ed8796 !important;
    --identity-icon-color: #ed8796 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5bde6 !important;
    --identity-icon-color: #f5bde6 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #c6a0f6 !important;
    --identity-icon-color: #c6a0f6 !important;
  }

  hbox#titlebar {
    background-color: #1e2030 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #1e2030 !important;
  }
}


================================================
FILE: themes/Macchiato/Green/userContent.css
================================================
/* Catppuccin Macchiato Green userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cad3f5 !important;
      --color-accent-primary: #a6da95 !important;
      --color-accent-primary-hover: rgb(183, 225, 169) !important;
      --color-accent-primary-active: rgb(150, 218, 150) !important;
      background-color: #24273a !important;
      --in-content-page-background: #24273a !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #24273a !important;
      --newtab-background-color-secondary: #363a4f !important;
      --newtab-element-hover-color: #363a4f !important;
      --newtab-text-primary-color: #cad3f5 !important;
      --newtab-wordmark-color: #cad3f5 !important;
      --newtab-primary-action-background: #a6da95 !important;
    }

    .icon {
      color: #a6da95 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-macchiato.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Macchiato/Green/zen-logo-macchiato.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: #a6da95 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #1e2030 !important;
      --in-content-text-color: #cad3f5 !important;
      --link-color: #a6da95 !important;
      --link-color-hover: rgb(183, 225, 169) !important;
      --zen-colors-primary: #363a4f !important;
      --in-content-box-background: #363a4f !important;
      --zen-primary-color: #a6da95 !important;
    }

    groupbox , moz-card{
      background: #24273a !important;
    }

    button,
    groupbox menulist {
      background: #363a4f !important;
      color: #cad3f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #1e2030 !important;
      --background-color-box: #24273a !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #24273a !important;
      --social-color: #c6a0f6 !important;
      --coockie-color: #91d7e3 !important;
      --fingerprinter-color: #eed49f !important;
      --cryptominer-color: #b7bdf8 !important;
      --tracker-color: #a6da95 !important;
      --in-content-primary-button-background-hover: rgb(84, 89, 116) !important;
      --in-content-primary-button-text-color-hover: #cad3f5 !important;
      --in-content-primary-button-background: #494d64 !important;
      --in-content-primary-button-text-color: #cad3f5 !important;
    }


    .card {
      background-color: #363a4f !important;
    }
  }
}


================================================
FILE: themes/Macchiato/Lavender/userChrome.css
================================================
/* Catppuccin Macchiato Lavender userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #363a4f !important;
    --zen-primary-color: #b7bdf8 !important;
    --zen-colors-secondary: #363a4f !important;
    --zen-colors-tertiary: #1e2030 !important;
    --zen-colors-border: #b7bdf8 !important;
    --toolbarbutton-icon-fill: #b7bdf8 !important;
    --lwt-text-color: #cad3f5 !important;
    --toolbar-field-color: #cad3f5 !important;
    --tab-selected-textcolor: rgb(193, 200, 246) !important;
    --toolbar-field-focus-color: #cad3f5 !important;
    --toolbar-color: #cad3f5 !important;
    --newtab-text-primary-color: #cad3f5 !important;
    --arrowpanel-color: #cad3f5 !important;
    --arrowpanel-background: #24273a !important;
    --sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-background-color: #181926 !important;
    --toolbar-bgcolor: #363a4f !important;
    --newtab-background-color: #24273a !important;
    --zen-themed-toolbar-bg: #1e2030 !important;
    --zen-main-browser-background: #1e2030 !important;
    --toolbox-bgcolor-inactive: #1e2030 !important;
  }

  #permissions-granted-icon {
    color: #1e2030 !important;
  }

  .sidebar-placesTree {
    background-color: #24273a !important;
  }

  #zen-workspaces-button {
    background-color: #24273a !important;
  }

  #TabsToolbar {
    background-color: #1e2030 !important;
  }

  .urlbar-background {
    background-color: #24273a !important;
  }

  .content-shortcuts {
    background-color: #24273a !important;
    border-color: #b7bdf8 !important;
  }

  .urlbarView-url {
    color: #b7bdf8 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #181926 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #363a4f !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #181926;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8aadf4 !important;
    --identity-icon-color: #8aadf4 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #8bd5ca !important;
    --identity-icon-color: #8bd5ca !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6da95 !important;
    --identity-icon-color: #a6da95 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #eed49f !important;
    --identity-icon-color: #eed49f !important;
  }

  .identity-color-orange {
    --identity-tab-color: #f5a97f !important;
    --identity-icon-color: #f5a97f !important;
  }

  .identity-color-red {
    --identity-tab-color: #ed8796 !important;
    --identity-icon-color: #ed8796 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5bde6 !important;
    --identity-icon-color: #f5bde6 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #c6a0f6 !important;
    --identity-icon-color: #c6a0f6 !important;
  }

  hbox#titlebar {
    background-color: #1e2030 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #1e2030 !important;
  }
}


================================================
FILE: themes/Macchiato/Lavender/userContent.css
================================================
/* Catppuccin Macchiato Lavender userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cad3f5 !important;
      --color-accent-primary: #b7bdf8 !important;
      --color-accent-primary-hover: rgb(208, 212, 250) !important;
      --color-accent-primary-active: rgb(194, 184, 248) !important;
      background-color: #24273a !important;
      --in-content-page-background: #24273a !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #24273a !important;
      --newtab-background-color-secondary: #363a4f !important;
      --newtab-element-hover-color: #363a4f !important;
      --newtab-text-primary-color: #cad3f5 !important;
      --newtab-wordmark-color: #cad3f5 !important;
      --newtab-primary-action-background: #b7bdf8 !important;
    }

    .icon {
      color: #b7bdf8 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-macchiato.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Macchiato/Lavender/zen-logo-macchiato.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: #b7bdf8 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #1e2030 !important;
      --in-content-text-color: #cad3f5 !important;
      --link-color: #b7bdf8 !important;
      --link-color-hover: rgb(208, 212, 250) !important;
      --zen-colors-primary: #363a4f !important;
      --in-content-box-background: #363a4f !important;
      --zen-primary-color: #b7bdf8 !important;
    }

    groupbox , moz-card{
      background: #24273a !important;
    }

    button,
    groupbox menulist {
      background: #363a4f !important;
      color: #cad3f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #1e2030 !important;
      --background-color-box: #24273a !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #24273a !important;
      --social-color: #c6a0f6 !important;
      --coockie-color: #91d7e3 !important;
      --fingerprinter-color: #eed49f !important;
      --cryptominer-color: #b7bdf8 !important;
      --tracker-color: #a6da95 !important;
      --in-content-primary-button-background-hover: rgb(84, 89, 116) !important;
      --in-content-primary-button-text-color-hover: #cad3f5 !important;
      --in-content-primary-button-background: #494d64 !important;
      --in-content-primary-button-text-color: #cad3f5 !important;
    }


    .card {
      background-color: #363a4f !important;
    }
  }
}


================================================
FILE: themes/Macchiato/Maroon/userChrome.css
================================================
/* Catppuccin Macchiato Maroon userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #363a4f !important;
    --zen-primary-color: #ee99a0 !important;
    --zen-colors-secondary: #363a4f !important;
    --zen-colors-tertiary: #1e2030 !important;
    --zen-colors-border: #ee99a0 !important;
    --toolbarbutton-icon-fill: #ee99a0 !important;
    --lwt-text-color: #cad3f5 !important;
    --toolbar-field-color: #cad3f5 !important;
    --tab-selected-textcolor: rgb(220, 182, 202) !important;
    --toolbar-field-focus-color: #cad3f5 !important;
    --toolbar-color: #cad3f5 !important;
    --newtab-text-primary-color: #cad3f5 !important;
    --arrowpanel-color: #cad3f5 !important;
    --arrowpanel-background: #24273a !important;
    --sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-background-color: #181926 !important;
    --toolbar-bgcolor: #363a4f !important;
    --newtab-background-color: #24273a !important;
    --zen-themed-toolbar-bg: #1e2030 !important;
    --zen-main-browser-background: #1e2030 !important;
    --toolbox-bgcolor-inactive: #1e2030 !important;
  }

  #permissions-granted-icon {
    color: #1e2030 !important;
  }

  .sidebar-placesTree {
    background-color: #24273a !important;
  }

  #zen-workspaces-button {
    background-color: #24273a !important;
  }

  #TabsToolbar {
    background-color: #1e2030 !important;
  }

  .urlbar-background {
    background-color: #24273a !important;
  }

  .content-shortcuts {
    background-color: #24273a !important;
    border-color: #ee99a0 !important;
  }

  .urlbarView-url {
    color: #ee99a0 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #181926 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #363a4f !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #181926;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8aadf4 !important;
    --identity-icon-color: #8aadf4 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #8bd5ca !important;
    --identity-icon-color: #8bd5ca !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6da95 !important;
    --identity-icon-color: #a6da95 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #eed49f !important;
    --identity-icon-color: #eed49f !important;
  }

  .identity-color-orange {
    --identity-tab-color: #f5a97f !important;
    --identity-icon-color: #f5a97f !important;
  }

  .identity-color-red {
    --identity-tab-color: #ed8796 !important;
    --identity-icon-color: #ed8796 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5bde6 !important;
    --identity-icon-color: #f5bde6 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #c6a0f6 !important;
    --identity-icon-color: #c6a0f6 !important;
  }

  hbox#titlebar {
    background-color: #1e2030 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #1e2030 !important;
  }
}


================================================
FILE: themes/Macchiato/Maroon/userContent.css
================================================
/* Catppuccin Macchiato Maroon userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cad3f5 !important;
      --color-accent-primary: #ee99a0 !important;
      --color-accent-primary-hover: rgb(242, 176, 182) !important;
      --color-accent-primary-active: rgb(238, 168, 154) !important;
      background-color: #24273a !important;
      --in-content-page-background: #24273a !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #24273a !important;
      --newtab-background-color-secondary: #363a4f !important;
      --newtab-element-hover-color: #363a4f !important;
      --newtab-text-primary-color: #cad3f5 !important;
      --newtab-wordmark-color: #cad3f5 !important;
      --newtab-primary-action-background: #ee99a0 !important;
    }

    .icon {
      color: #ee99a0 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-macchiato.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Macchiato/Maroon/zen-logo-macchiato.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: #ee99a0 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #1e2030 !important;
      --in-content-text-color: #cad3f5 !important;
      --link-color: #ee99a0 !important;
      --link-color-hover: rgb(242, 176, 182) !important;
      --zen-colors-primary: #363a4f !important;
      --in-content-box-background: #363a4f !important;
      --zen-primary-color: #ee99a0 !important;
    }

    groupbox , moz-card{
      background: #24273a !important;
    }

    button,
    groupbox menulist {
      background: #363a4f !important;
      color: #cad3f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #1e2030 !important;
      --background-color-box: #24273a !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #24273a !important;
      --social-color: #c6a0f6 !important;
      --coockie-color: #91d7e3 !important;
      --fingerprinter-color: #eed49f !important;
      --cryptominer-color: #b7bdf8 !important;
      --tracker-color: #a6da95 !important;
      --in-content-primary-button-background-hover: rgb(84, 89, 116) !important;
      --in-content-primary-button-text-color-hover: #cad3f5 !important;
      --in-content-primary-button-background: #494d64 !important;
      --in-content-primary-button-text-color: #cad3f5 !important;
    }


    .card {
      background-color: #363a4f !important;
    }
  }
}


================================================
FILE: themes/Macchiato/Mauve/userChrome.css
================================================
/* Catppuccin Macchiato Mauve userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #363a4f !important;
    --zen-primary-color: #c6a0f6 !important;
    --zen-colors-secondary: #363a4f !important;
    --zen-colors-tertiary: #1e2030 !important;
    --zen-colors-border: #c6a0f6 !important;
    --toolbarbutton-icon-fill: #c6a0f6 !important;
    --lwt-text-color: #cad3f5 !important;
    --toolbar-field-color: #cad3f5 !important;
    --tab-selected-textcolor: rgb(200, 185, 245) !important;
    --toolbar-field-focus-color: #cad3f5 !important;
    --toolbar-color: #cad3f5 !important;
    --newtab-text-primary-color: #cad3f5 !important;
    --arrowpanel-color: #cad3f5 !important;
    --arrowpanel-background: #24273a !important;
    --sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-background-color: #181926 !important;
    --toolbar-bgcolor: #363a4f !important;
    --newtab-background-color: #24273a !important;
    --zen-themed-toolbar-bg: #1e2030 !important;
    --zen-main-browser-background: #1e2030 !important;
    --toolbox-bgcolor-inactive: #1e2030 !important;
  }

  #permissions-granted-icon {
    color: #1e2030 !important;
  }

  .sidebar-placesTree {
    background-color: #24273a !important;
  }

  #zen-workspaces-button {
    background-color: #24273a !important;
  }

  #TabsToolbar {
    background-color: #1e2030 !important;
  }

  .urlbar-background {
    background-color: #24273a !important;
  }

  .content-shortcuts {
    background-color: #24273a !important;
    border-color: #c6a0f6 !important;
  }

  .urlbarView-url {
    color: #c6a0f6 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #181926 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #363a4f !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #181926;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8aadf4 !important;
    --identity-icon-color: #8aadf4 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #8bd5ca !important;
    --identity-icon-color: #8bd5ca !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6da95 !important;
    --identity-icon-color: #a6da95 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #eed49f !important;
    --identity-icon-color: #eed49f !important;
  }

  .identity-color-orange {
    --identity-tab-color: #f5a97f !important;
    --identity-icon-color: #f5a97f !important;
  }

  .identity-color-red {
    --identity-tab-color: #ed8796 !important;
    --identity-icon-color: #ed8796 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5bde6 !important;
    --identity-icon-color: #f5bde6 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #c6a0f6 !important;
    --identity-icon-color: #c6a0f6 !important;
  }

  hbox#titlebar {
    background-color: #1e2030 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #1e2030 !important;
  }
}


================================================
FILE: themes/Macchiato/Mauve/userContent.css
================================================
/* Catppuccin Macchiato Mauve userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cad3f5 !important;
      --color-accent-primary: #c6a0f6 !important;
      --color-accent-primary-hover: rgb(213, 184, 248) !important;
      --color-accent-primary-active: rgb(220, 160, 246) !important;
      background-color: #24273a !important;
      --in-content-page-background: #24273a !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #24273a !important;
      --newtab-background-color-secondary: #363a4f !important;
      --newtab-element-hover-color: #363a4f !important;
      --newtab-text-primary-color: #cad3f5 !important;
      --newtab-wordmark-color: #cad3f5 !important;
      --newtab-primary-action-background: #c6a0f6 !important;
    }

    .icon {
      color: #c6a0f6 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-macchiato.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Macchiato/Mauve/zen-logo-macchiato.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: #c6a0f6 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #1e2030 !important;
      --in-content-text-color: #cad3f5 !important;
      --link-color: #c6a0f6 !important;
      --link-color-hover: rgb(213, 184, 248) !important;
      --zen-colors-primary: #363a4f !important;
      --in-content-box-background: #363a4f !important;
      --zen-primary-color: #c6a0f6 !important;
    }

    groupbox , moz-card{
      background: #24273a !important;
    }

    button,
    groupbox menulist {
      background: #363a4f !important;
      color: #cad3f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #1e2030 !important;
      --background-color-box: #24273a !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #24273a !important;
      --social-color: #c6a0f6 !important;
      --coockie-color: #91d7e3 !important;
      --fingerprinter-color: #eed49f !important;
      --cryptominer-color: #b7bdf8 !important;
      --tracker-color: #a6da95 !important;
      --in-content-primary-button-background-hover: rgb(84, 89, 116) !important;
      --in-content-primary-button-text-color-hover: #cad3f5 !important;
      --in-content-primary-button-background: #494d64 !important;
      --in-content-primary-button-text-color: #cad3f5 !important;
    }


    .card {
      background-color: #363a4f !important;
    }
  }
}


================================================
FILE: themes/Macchiato/Peach/userChrome.css
================================================
/* Catppuccin Macchiato Peach userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #363a4f !important;
    --zen-primary-color: #f5a97f !important;
    --zen-colors-secondary: #363a4f !important;
    --zen-colors-tertiary: #1e2030 !important;
    --zen-colors-border: #f5a97f !important;
    --toolbarbutton-icon-fill: #f5a97f !important;
    --lwt-text-color: #cad3f5 !important;
    --toolbar-field-color: #cad3f5 !important;
    --tab-selected-textcolor: rgb(224, 190, 186) !important;
    --toolbar-field-focus-color: #cad3f5 !important;
    --toolbar-color: #cad3f5 !important;
    --newtab-text-primary-color: #cad3f5 !important;
    --arrowpanel-color: #cad3f5 !important;
    --arrowpanel-background: #24273a !important;
    --sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-background-color: #181926 !important;
    --toolbar-bgcolor: #363a4f !important;
    --newtab-background-color: #24273a !important;
    --zen-themed-toolbar-bg: #1e2030 !important;
    --zen-main-browser-background: #1e2030 !important;
    --toolbox-bgcolor-inactive: #1e2030 !important;
  }

  #permissions-granted-icon {
    color: #1e2030 !important;
  }

  .sidebar-placesTree {
    background-color: #24273a !important;
  }

  #zen-workspaces-button {
    background-color: #24273a !important;
  }

  #TabsToolbar {
    background-color: #1e2030 !important;
  }

  .urlbar-background {
    background-color: #24273a !important;
  }

  .content-shortcuts {
    background-color: #24273a !important;
    border-color: #f5a97f !important;
  }

  .urlbarView-url {
    color: #f5a97f !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #181926 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #363a4f !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #181926;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8aadf4 !important;
    --identity-icon-color: #8aadf4 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #8bd5ca !important;
    --identity-icon-color: #8bd5ca !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6da95 !important;
    --identity-icon-color: #a6da95 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #eed49f !important;
    --identity-icon-color: #eed49f !important;
  }

  .identity-color-orange {
    --identity-tab-color: #f5a97f !important;
    --identity-icon-color: #f5a97f !important;
  }

  .identity-color-red {
    --identity-tab-color: #ed8796 !important;
    --identity-icon-color: #ed8796 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5bde6 !important;
    --identity-icon-color: #f5bde6 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #c6a0f6 !important;
    --identity-icon-color: #c6a0f6 !important;
  }

  hbox#titlebar {
    background-color: #1e2030 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #1e2030 !important;
  }
}


================================================
FILE: themes/Macchiato/Peach/userContent.css
================================================
/* Catppuccin Macchiato Peach userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cad3f5 !important;
      --color-accent-primary: #f5a97f !important;
      --color-accent-primary-hover: rgb(247, 185, 151) !important;
      --color-accent-primary-active: rgb(245, 198, 127) !important;
      background-color: #24273a !important;
      --in-content-page-background: #24273a !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #24273a !important;
      --newtab-background-color-secondary: #363a4f !important;
      --newtab-element-hover-color: #363a4f !important;
      --newtab-text-primary-color: #cad3f5 !important;
      --newtab-wordmark-color: #cad3f5 !important;
      --newtab-primary-action-background: #f5a97f !important;
    }

    .icon {
      color: #f5a97f !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-macchiato.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Macchiato/Peach/zen-logo-macchiato.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: #f5a97f !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #1e2030 !important;
      --in-content-text-color: #cad3f5 !important;
      --link-color: #f5a97f !important;
      --link-color-hover: rgb(247, 185, 151) !important;
      --zen-colors-primary: #363a4f !important;
      --in-content-box-background: #363a4f !important;
      --zen-primary-color: #f5a97f !important;
    }

    groupbox , moz-card{
      background: #24273a !important;
    }

    button,
    groupbox menulist {
      background: #363a4f !important;
      color: #cad3f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #1e2030 !important;
      --background-color-box: #24273a !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #24273a !important;
      --social-color: #c6a0f6 !important;
      --coockie-color: #91d7e3 !important;
      --fingerprinter-color: #eed49f !important;
      --cryptominer-color: #b7bdf8 !important;
      --tracker-color: #a6da95 !important;
      --in-content-primary-button-background-hover: rgb(84, 89, 116) !important;
      --in-content-primary-button-text-color-hover: #cad3f5 !important;
      --in-content-primary-button-background: #494d64 !important;
      --in-content-primary-button-text-color: #cad3f5 !important;
    }


    .card {
      background-color: #363a4f !important;
    }
  }
}


================================================
FILE: themes/Macchiato/Pink/userChrome.css
================================================
/* Catppuccin Macchiato Pink userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #363a4f !important;
    --zen-primary-color: #f5bde6 !important;
    --zen-colors-secondary: #363a4f !important;
    --zen-colors-tertiary: #1e2030 !important;
    --zen-colors-border: #f5bde6 !important;
    --toolbarbutton-icon-fill: #f5bde6 !important;
    --lwt-text-color: #cad3f5 !important;
    --toolbar-field-color: #cad3f5 !important;
    --tab-selected-textcolor: rgb(224, 200, 237) !important;
    --toolbar-field-focus-color: #cad3f5 !important;
    --toolbar-color: #cad3f5 !important;
    --newtab-text-primary-color: #cad3f5 !important;
    --arrowpanel-color: #cad3f5 !important;
    --arrowpanel-background: #24273a !important;
    --sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-background-color: #181926 !important;
    --toolbar-bgcolor: #363a4f !important;
    --newtab-background-color: #24273a !important;
    --zen-themed-toolbar-bg: #1e2030 !important;
    --zen-main-browser-background: #1e2030 !important;
    --toolbox-bgcolor-inactive: #1e2030 !important;
  }

  #permissions-granted-icon {
    color: #1e2030 !important;
  }

  .sidebar-placesTree {
    background-color: #24273a !important;
  }

  #zen-workspaces-button {
    background-color: #24273a !important;
  }

  #TabsToolbar {
    background-color: #1e2030 !important;
  }

  .urlbar-background {
    background-color: #24273a !important;
  }

  .content-shortcuts {
    background-color: #24273a !important;
    border-color: #f5bde6 !important;
  }

  .urlbarView-url {
    color: #f5bde6 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #181926 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #363a4f !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #181926;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8aadf4 !important;
    --identity-icon-color: #8aadf4 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #8bd5ca !important;
    --identity-icon-color: #8bd5ca !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6da95 !important;
    --identity-icon-color: #a6da95 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #eed49f !important;
    --identity-icon-color: #eed49f !important;
  }

  .identity-color-orange {
    --identity-tab-color: #f5a97f !important;
    --identity-icon-color: #f5a97f !important;
  }

  .identity-color-red {
    --identity-tab-color: #ed8796 !important;
    --identity-icon-color: #ed8796 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5bde6 !important;
    --identity-icon-color: #f5bde6 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #c6a0f6 !important;
    --identity-icon-color: #c6a0f6 !important;
  }

  hbox#titlebar {
    background-color: #1e2030 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #1e2030 !important;
  }
}


================================================
FILE: themes/Macchiato/Pink/userContent.css
================================================
/* Catppuccin Macchiato Pink userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cad3f5 !important;
      --color-accent-primary: #f5bde6 !important;
      --color-accent-primary-hover: rgb(248, 212, 239) !important;
      --color-accent-primary-active: rgb(245, 189, 216) !important;
      background-color: #24273a !important;
      --in-content-page-background: #24273a !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #24273a !important;
      --newtab-background-color-secondary: #363a4f !important;
      --newtab-element-hover-color: #363a4f !important;
      --newtab-text-primary-color: #cad3f5 !important;
      --newtab-wordmark-color: #cad3f5 !important;
      --newtab-primary-action-background: #f5bde6 !important;
    }

    .icon {
      color: #f5bde6 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-macchiato.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Macchiato/Pink/zen-logo-macchiato.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: #f5bde6 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #1e2030 !important;
      --in-content-text-color: #cad3f5 !important;
      --link-color: #f5bde6 !important;
      --link-color-hover: rgb(248, 212, 239) !important;
      --zen-colors-primary: #363a4f !important;
      --in-content-box-background: #363a4f !important;
      --zen-primary-color: #f5bde6 !important;
    }

    groupbox , moz-card{
      background: #24273a !important;
    }

    button,
    groupbox menulist {
      background: #363a4f !important;
      color: #cad3f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #1e2030 !important;
      --background-color-box: #24273a !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #24273a !important;
      --social-color: #c6a0f6 !important;
      --coockie-color: #91d7e3 !important;
      --fingerprinter-color: #eed49f !important;
      --cryptominer-color: #b7bdf8 !important;
      --tracker-color: #a6da95 !important;
      --in-content-primary-button-background-hover: rgb(84, 89, 116) !important;
      --in-content-primary-button-text-color-hover: #cad3f5 !important;
      --in-content-primary-button-background: #494d64 !important;
      --in-content-primary-button-text-color: #cad3f5 !important;
    }


    .card {
      background-color: #363a4f !important;
    }
  }
}


================================================
FILE: themes/Macchiato/Red/userChrome.css
================================================
/* Catppuccin Macchiato Red userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #363a4f !important;
    --zen-primary-color: #ed8796 !important;
    --zen-colors-secondary: #363a4f !important;
    --zen-colors-tertiary: #1e2030 !important;
    --zen-colors-border: #ed8796 !important;
    --toolbarbutton-icon-fill: #ed8796 !important;
    --lwt-text-color: #cad3f5 !important;
    --toolbar-field-color: #cad3f5 !important;
    --tab-selected-textcolor: rgb(220, 173, 197) !important;
    --toolbar-field-focus-color: #cad3f5 !important;
    --toolbar-color: #cad3f5 !important;
    --newtab-text-primary-color: #cad3f5 !important;
    --arrowpanel-color: #cad3f5 !important;
    --arrowpanel-background: #24273a !important;
    --sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-background-color: #181926 !important;
    --toolbar-bgcolor: #363a4f !important;
    --newtab-background-color: #24273a !important;
    --zen-themed-toolbar-bg: #1e2030 !important;
    --zen-main-browser-background: #1e2030 !important;
    --toolbox-bgcolor-inactive: #1e2030 !important;
  }

  #permissions-granted-icon {
    color: #1e2030 !important;
  }

  .sidebar-placesTree {
    background-color: #24273a !important;
  }

  #zen-workspaces-button {
    background-color: #24273a !important;
  }

  #TabsToolbar {
    background-color: #1e2030 !important;
  }

  .urlbar-background {
    background-color: #24273a !important;
  }

  .content-shortcuts {
    background-color: #24273a !important;
    border-color: #ed8796 !important;
  }

  .urlbarView-url {
    color: #ed8796 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #181926 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #363a4f !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #181926;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8aadf4 !important;
    --identity-icon-color: #8aadf4 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #8bd5ca !important;
    --identity-icon-color: #8bd5ca !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6da95 !important;
    --identity-icon-color: #a6da95 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #eed49f !important;
    --identity-icon-color: #eed49f !important;
  }

  .identity-color-orange {
    --identity-tab-color: #f5a97f !important;
    --identity-icon-color: #f5a97f !important;
  }

  .identity-color-red {
    --identity-tab-color: #ed8796 !important;
    --identity-icon-color: #ed8796 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5bde6 !important;
    --identity-icon-color: #f5bde6 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #c6a0f6 !important;
    --identity-icon-color: #c6a0f6 !important;
  }

  hbox#titlebar {
    background-color: #1e2030 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #1e2030 !important;
  }
}


================================================
FILE: themes/Macchiato/Red/userContent.css
================================================
/* Catppuccin Macchiato Red userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cad3f5 !important;
      --color-accent-primary: #ed8796 !important;
      --color-accent-primary-hover: rgb(240, 158, 170) !important;
      --color-accent-primary-active: rgb(237, 145, 135) !important;
      background-color: #24273a !important;
      --in-content-page-background: #24273a !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #24273a !important;
      --newtab-background-color-secondary: #363a4f !important;
      --newtab-element-hover-color: #363a4f !important;
      --newtab-text-primary-color: #cad3f5 !important;
      --newtab-wordmark-color: #cad3f5 !important;
      --newtab-primary-action-background: #ed8796 !important;
    }

    .icon {
      color: #ed8796 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-macchiato.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Macchiato/Red/zen-logo-macchiato.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: #ed8796 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #1e2030 !important;
      --in-content-text-color: #cad3f5 !important;
      --link-color: #ed8796 !important;
      --link-color-hover: rgb(240, 158, 170) !important;
      --zen-colors-primary: #363a4f !important;
      --in-content-box-background: #363a4f !important;
      --zen-primary-color: #ed8796 !important;
    }

    groupbox , moz-card{
      background: #24273a !important;
    }

    button,
    groupbox menulist {
      background: #363a4f !important;
      color: #cad3f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #1e2030 !important;
      --background-color-box: #24273a !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #24273a !important;
      --social-color: #c6a0f6 !important;
      --coockie-color: #91d7e3 !important;
      --fingerprinter-color: #eed49f !important;
      --cryptominer-color: #b7bdf8 !important;
      --tracker-color: #a6da95 !important;
      --in-content-primary-button-background-hover: rgb(84, 89, 116) !important;
      --in-content-primary-button-text-color-hover: #cad3f5 !important;
      --in-content-primary-button-background: #494d64 !important;
      --in-content-primary-button-text-color: #cad3f5 !important;
    }


    .card {
      background-color: #363a4f !important;
    }
  }
}


================================================
FILE: themes/Macchiato/Rosewater/userChrome.css
================================================
/* Catppuccin Macchiato Rosewater userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #363a4f !important;
    --zen-primary-color: #f4dbd6 !important;
    --zen-colors-secondary: #363a4f !important;
    --zen-colors-tertiary: #1e2030 !important;
    --zen-colors-border: #f4dbd6 !important;
    --toolbarbutton-icon-fill: #f4dbd6 !important;
    --lwt-text-color: #cad3f5 !important;
    --toolbar-field-color: #cad3f5 !important;
    --tab-selected-textcolor: rgb(223, 215, 229) !important;
    --toolbar-field-focus-color: #cad3f5 !important;
    --toolbar-color: #cad3f5 !important;
    --newtab-text-primary-color: #cad3f5 !important;
    --arrowpanel-color: #cad3f5 !important;
    --arrowpanel-background: #24273a !important;
    --sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-background-color: #181926 !important;
    --toolbar-bgcolor: #363a4f !important;
    --newtab-background-color: #24273a !important;
    --zen-themed-toolbar-bg: #1e2030 !important;
    --zen-main-browser-background: #1e2030 !important;
    --toolbox-bgcolor-inactive: #1e2030 !important;
  }

  #permissions-granted-icon {
    color: #1e2030 !important;
  }

  .sidebar-placesTree {
    background-color: #24273a !important;
  }

  #zen-workspaces-button {
    background-color: #24273a !important;
  }

  #TabsToolbar {
    background-color: #1e2030 !important;
  }

  .urlbar-background {
    background-color: #24273a !important;
  }

  .content-shortcuts {
    background-color: #24273a !important;
    border-color: #f4dbd6 !important;
  }

  .urlbarView-url {
    color: #f4dbd6 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #181926 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #363a4f !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #181926;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8aadf4 !important;
    --identity-icon-color: #8aadf4 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #8bd5ca !important;
    --identity-icon-color: #8bd5ca !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6da95 !important;
    --identity-icon-color: #a6da95 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #eed49f !important;
    --identity-icon-color: #eed49f !important;
  }

  .identity-color-orange {
    --identity-tab-color: #f5a97f !important;
    --identity-icon-color: #f5a97f !important;
  }

  .identity-color-red {
    --identity-tab-color: #ed8796 !important;
    --identity-icon-color: #ed8796 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5bde6 !important;
    --identity-icon-color: #f5bde6 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #c6a0f6 !important;
    --identity-icon-color: #c6a0f6 !important;
  }

  hbox#titlebar {
    background-color: #1e2030 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #1e2030 !important;
  }
}


================================================
FILE: themes/Macchiato/Rosewater/userContent.css
================================================
/* Catppuccin Macchiato Rosewater userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cad3f5 !important;
      --color-accent-primary: #f4dbd6 !important;
      --color-accent-primary-hover: rgb(249, 237, 235) !important;
      --color-accent-primary-active: rgb(244, 227, 214) !important;
      background-color: #24273a !important;
      --in-content-page-background: #24273a !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #24273a !important;
      --newtab-background-color-secondary: #363a4f !important;
      --newtab-element-hover-color: #363a4f !important;
      --newtab-text-primary-color: #cad3f5 !important;
      --newtab-wordmark-color: #cad3f5 !important;
      --newtab-primary-action-background: #f4dbd6 !important;
    }

    .icon {
      color: #f4dbd6 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-macchiato.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Macchiato/Rosewater/zen-logo-macchiato.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: #f4dbd6 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #1e2030 !important;
      --in-content-text-color: #cad3f5 !important;
      --link-color: #f4dbd6 !important;
      --link-color-hover: rgb(249, 237, 235) !important;
      --zen-colors-primary: #363a4f !important;
      --in-content-box-background: #363a4f !important;
      --zen-primary-color: #f4dbd6 !important;
    }

    groupbox , moz-card{
      background: #24273a !important;
    }

    button,
    groupbox menulist {
      background: #363a4f !important;
      color: #cad3f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #1e2030 !important;
      --background-color-box: #24273a !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #24273a !important;
      --social-color: #c6a0f6 !important;
      --coockie-color: #91d7e3 !important;
      --fingerprinter-color: #eed49f !important;
      --cryptominer-color: #b7bdf8 !important;
      --tracker-color: #a6da95 !important;
      --in-content-primary-button-background-hover: rgb(84, 89, 116) !important;
      --in-content-primary-button-text-color-hover: #cad3f5 !important;
      --in-content-primary-button-background: #494d64 !important;
      --in-content-primary-button-text-color: #cad3f5 !important;
    }


    .card {
      background-color: #363a4f !important;
    }
  }
}


================================================
FILE: themes/Macchiato/Sapphire/userChrome.css
================================================
/* Catppuccin Macchiato Sapphire userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #363a4f !important;
    --zen-primary-color: #7dc4e4 !important;
    --zen-colors-secondary: #363a4f !important;
    --zen-colors-tertiary: #1e2030 !important;
    --zen-colors-border: #7dc4e4 !important;
    --toolbarbutton-icon-fill: #7dc4e4 !important;
    --lwt-text-color: #cad3f5 !important;
    --toolbar-field-color: #cad3f5 !important;
    --tab-selected-textcolor: rgb(164, 203, 236) !important;
    --toolbar-field-focus-color: #cad3f5 !important;
    --toolbar-color: #cad3f5 !important;
    --newtab-text-primary-color: #cad3f5 !important;
    --arrowpanel-color: #cad3f5 !important;
    --arrowpanel-background: #24273a !important;
    --sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-background-color: #181926 !important;
    --toolbar-bgcolor: #363a4f !important;
    --newtab-background-color: #24273a !important;
    --zen-themed-toolbar-bg: #1e2030 !important;
    --zen-main-browser-background: #1e2030 !important;
    --toolbox-bgcolor-inactive: #1e2030 !important;
  }

  #permissions-granted-icon {
    color: #1e2030 !important;
  }

  .sidebar-placesTree {
    background-color: #24273a !important;
  }

  #zen-workspaces-button {
    background-color: #24273a !important;
  }

  #TabsToolbar {
    background-color: #1e2030 !important;
  }

  .urlbar-background {
    background-color: #24273a !important;
  }

  .content-shortcuts {
    background-color: #24273a !important;
    border-color: #7dc4e4 !important;
  }

  .urlbarView-url {
    color: #7dc4e4 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #181926 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #363a4f !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #181926;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8aadf4 !important;
    --identity-icon-color: #8aadf4 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #8bd5ca !important;
    --identity-icon-color: #8bd5ca !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6da95 !important;
    --identity-icon-color: #a6da95 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #eed49f !important;
    --identity-icon-color: #eed49f !important;
  }

  .identity-color-orange {
    --identity-tab-color: #f5a97f !important;
    --identity-icon-color: #f5a97f !important;
  }

  .identity-color-red {
    --identity-tab-color: #ed8796 !important;
    --identity-icon-color: #ed8796 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5bde6 !important;
    --identity-icon-color: #f5bde6 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #c6a0f6 !important;
    --identity-icon-color: #c6a0f6 !important;
  }

  hbox#titlebar {
    background-color: #1e2030 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #1e2030 !important;
  }
}


================================================
FILE: themes/Macchiato/Sapphire/userContent.css
================================================
/* Catppuccin Macchiato Sapphire userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cad3f5 !important;
      --color-accent-primary: #7dc4e4 !important;
      --color-accent-primary-hover: rgb(147, 206, 233) !important;
      --color-accent-primary-active: rgb(126, 170, 228) !important;
      background-color: #24273a !important;
      --in-content-page-background: #24273a !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #24273a !important;
      --newtab-background-color-secondary: #363a4f !important;
      --newtab-element-hover-color: #363a4f !important;
      --newtab-text-primary-color: #cad3f5 !important;
      --newtab-wordmark-color: #cad3f5 !important;
      --newtab-primary-action-background: #7dc4e4 !important;
    }

    .icon {
      color: #7dc4e4 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-macchiato.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Macchiato/Sapphire/zen-logo-macchiato.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: #7dc4e4 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #1e2030 !important;
      --in-content-text-color: #cad3f5 !important;
      --link-color: #7dc4e4 !important;
      --link-color-hover: rgb(147, 206, 233) !important;
      --zen-colors-primary: #363a4f !important;
      --in-content-box-background: #363a4f !important;
      --zen-primary-color: #7dc4e4 !important;
    }

    groupbox , moz-card{
      background: #24273a !important;
    }

    button,
    groupbox menulist {
      background: #363a4f !important;
      color: #cad3f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #1e2030 !important;
      --background-color-box: #24273a !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #24273a !important;
      --social-color: #c6a0f6 !important;
      --coockie-color: #91d7e3 !important;
      --fingerprinter-color: #eed49f !important;
      --cryptominer-color: #b7bdf8 !important;
      --tracker-color: #a6da95 !important;
      --in-content-primary-button-background-hover: rgb(84, 89, 116) !important;
      --in-content-primary-button-text-color-hover: #cad3f5 !important;
      --in-content-primary-button-background: #494d64 !important;
      --in-content-primary-button-text-color: #cad3f5 !important;
    }


    .card {
      background-color: #363a4f !important;
    }
  }
}


================================================
FILE: themes/Macchiato/Sky/userChrome.css
================================================
/* Catppuccin Macchiato Sky userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #363a4f !important;
    --zen-primary-color: #91d7e3 !important;
    --zen-colors-secondary: #363a4f !important;
    --zen-colors-tertiary: #1e2030 !important;
    --zen-colors-border: #91d7e3 !important;
    --toolbarbutton-icon-fill: #91d7e3 !important;
    --lwt-text-color: #cad3f5 !important;
    --toolbar-field-color: #cad3f5 !important;
    --tab-selected-textcolor: rgb(174, 213, 236) !important;
    --toolbar-field-focus-color: #cad3f5 !important;
    --toolbar-color: #cad3f5 !important;
    --newtab-text-primary-color: #cad3f5 !important;
    --arrowpanel-color: #cad3f5 !important;
    --arrowpanel-background: #24273a !important;
    --sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-background-color: #181926 !important;
    --toolbar-bgcolor: #363a4f !important;
    --newtab-background-color: #24273a !important;
    --zen-themed-toolbar-bg: #1e2030 !important;
    --zen-main-browser-background: #1e2030 !important;
    --toolbox-bgcolor-inactive: #1e2030 !important;
  }

  #permissions-granted-icon {
    color: #1e2030 !important;
  }

  .sidebar-placesTree {
    background-color: #24273a !important;
  }

  #zen-workspaces-button {
    background-color: #24273a !important;
  }

  #TabsToolbar {
    background-color: #1e2030 !important;
  }

  .urlbar-background {
    background-color: #24273a !important;
  }

  .content-shortcuts {
    background-color: #24273a !important;
    border-color: #91d7e3 !important;
  }

  .urlbarView-url {
    color: #91d7e3 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #181926 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #363a4f !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #181926;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8aadf4 !important;
    --identity-icon-color: #8aadf4 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #8bd5ca !important;
    --identity-icon-color: #8bd5ca !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6da95 !important;
    --identity-icon-color: #a6da95 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #eed49f !important;
    --identity-icon-color: #eed49f !important;
  }

  .identity-color-orange {
    --identity-tab-color: #f5a97f !important;
    --identity-icon-color: #f5a97f !important;
  }

  .identity-color-red {
    --identity-tab-color: #ed8796 !important;
    --identity-icon-color: #ed8796 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5bde6 !important;
    --identity-icon-color: #f5bde6 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #c6a0f6 !important;
    --identity-icon-color: #c6a0f6 !important;
  }

  hbox#titlebar {
    background-color: #1e2030 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #1e2030 !important;
  }
}


================================================
FILE: themes/Macchiato/Sky/userContent.css
================================================
/* Catppuccin Macchiato Sky userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cad3f5 !important;
      --color-accent-primary: #91d7e3 !important;
      --color-accent-primary-hover: rgb(166, 222, 232) !important;
      --color-accent-primary-active: rgb(145, 194, 227) !important;
      background-color: #24273a !important;
      --in-content-page-background: #24273a !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #24273a !important;
      --newtab-background-color-secondary: #363a4f !important;
      --newtab-element-hover-color: #363a4f !important;
      --newtab-text-primary-color: #cad3f5 !important;
      --newtab-wordmark-color: #cad3f5 !important;
      --newtab-primary-action-background: #91d7e3 !important;
    }

    .icon {
      color: #91d7e3 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-macchiato.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Macchiato/Sky/zen-logo-macchiato.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: #91d7e3 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #1e2030 !important;
      --in-content-text-color: #cad3f5 !important;
      --link-color: #91d7e3 !important;
      --link-color-hover: rgb(166, 222, 232) !important;
      --zen-colors-primary: #363a4f !important;
      --in-content-box-background: #363a4f !important;
      --zen-primary-color: #91d7e3 !important;
    }

    groupbox , moz-card{
      background: #24273a !important;
    }

    button,
    groupbox menulist {
      background: #363a4f !important;
      color: #cad3f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #1e2030 !important;
      --background-color-box: #24273a !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #24273a !important;
      --social-color: #c6a0f6 !important;
      --coockie-color: #91d7e3 !important;
      --fingerprinter-color: #eed49f !important;
      --cryptominer-color: #b7bdf8 !important;
      --tracker-color: #a6da95 !important;
      --in-content-primary-button-background-hover: rgb(84, 89, 116) !important;
      --in-content-primary-button-text-color-hover: #cad3f5 !important;
      --in-content-primary-button-background: #494d64 !important;
      --in-content-primary-button-text-color: #cad3f5 !important;
    }


    .card {
      background-color: #363a4f !important;
    }
  }
}


================================================
FILE: themes/Macchiato/Teal/userChrome.css
================================================
/* Catppuccin Macchiato Teal userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #363a4f !important;
    --zen-primary-color: #8bd5ca !important;
    --zen-colors-secondary: #363a4f !important;
    --zen-colors-tertiary: #1e2030 !important;
    --zen-colors-border: #8bd5ca !important;
    --toolbarbutton-icon-fill: #8bd5ca !important;
    --lwt-text-color: #cad3f5 !important;
    --toolbar-field-color: #cad3f5 !important;
    --tab-selected-textcolor: rgb(171, 212, 223) !important;
    --toolbar-field-focus-color: #cad3f5 !important;
    --toolbar-color: #cad3f5 !important;
    --newtab-text-primary-color: #cad3f5 !important;
    --arrowpanel-color: #cad3f5 !important;
    --arrowpanel-background: #24273a !important;
    --sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-background-color: #181926 !important;
    --toolbar-bgcolor: #363a4f !important;
    --newtab-background-color: #24273a !important;
    --zen-themed-toolbar-bg: #1e2030 !important;
    --zen-main-browser-background: #1e2030 !important;
    --toolbox-bgcolor-inactive: #1e2030 !important;
  }

  #permissions-granted-icon {
    color: #1e2030 !important;
  }

  .sidebar-placesTree {
    background-color: #24273a !important;
  }

  #zen-workspaces-button {
    background-color: #24273a !important;
  }

  #TabsToolbar {
    background-color: #1e2030 !important;
  }

  .urlbar-background {
    background-color: #24273a !important;
  }

  .content-shortcuts {
    background-color: #24273a !important;
    border-color: #8bd5ca !important;
  }

  .urlbarView-url {
    color: #8bd5ca !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #181926 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #363a4f !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #181926;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8aadf4 !important;
    --identity-icon-color: #8aadf4 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #8bd5ca !important;
    --identity-icon-color: #8bd5ca !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6da95 !important;
    --identity-icon-color: #a6da95 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #eed49f !important;
    --identity-icon-color: #eed49f !important;
  }

  .identity-color-orange {
    --identity-tab-color: #f5a97f !important;
    --identity-icon-color: #f5a97f !important;
  }

  .identity-color-red {
    --identity-tab-color: #ed8796 !important;
    --identity-icon-color: #ed8796 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5bde6 !important;
    --identity-icon-color: #f5bde6 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #c6a0f6 !important;
    --identity-icon-color: #c6a0f6 !important;
  }

  hbox#titlebar {
    background-color: #1e2030 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #1e2030 !important;
  }
}


================================================
FILE: themes/Macchiato/Teal/userContent.css
================================================
/* Catppuccin Macchiato Teal userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cad3f5 !important;
      --color-accent-primary: #8bd5ca !important;
      --color-accent-primary-hover: rgb(158, 220, 211) !important;
      --color-accent-primary-active: rgb(139, 205, 213) !important;
      background-color: #24273a !important;
      --in-content-page-background: #24273a !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #24273a !important;
      --newtab-background-color-secondary: #363a4f !important;
      --newtab-element-hover-color: #363a4f !important;
      --newtab-text-primary-color: #cad3f5 !important;
      --newtab-wordmark-color: #cad3f5 !important;
      --newtab-primary-action-background: #8bd5ca !important;
    }

    .icon {
      color: #8bd5ca !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-macchiato.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Macchiato/Teal/zen-logo-macchiato.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: #8bd5ca !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #1e2030 !important;
      --in-content-text-color: #cad3f5 !important;
      --link-color: #8bd5ca !important;
      --link-color-hover: rgb(158, 220, 211) !important;
      --zen-colors-primary: #363a4f !important;
      --in-content-box-background: #363a4f !important;
      --zen-primary-color: #8bd5ca !important;
    }

    groupbox , moz-card{
      background: #24273a !important;
    }

    button,
    groupbox menulist {
      background: #363a4f !important;
      color: #cad3f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #1e2030 !important;
      --background-color-box: #24273a !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #24273a !important;
      --social-color: #c6a0f6 !important;
      --coockie-color: #91d7e3 !important;
      --fingerprinter-color: #eed49f !important;
      --cryptominer-color: #b7bdf8 !important;
      --tracker-color: #a6da95 !important;
      --in-content-primary-button-background-hover: rgb(84, 89, 116) !important;
      --in-content-primary-button-text-color-hover: #cad3f5 !important;
      --in-content-primary-button-background: #494d64 !important;
      --in-content-primary-button-text-color: #cad3f5 !important;
    }


    .card {
      background-color: #363a4f !important;
    }
  }
}


================================================
FILE: themes/Macchiato/Yellow/userChrome.css
================================================
/* Catppuccin Macchiato Yellow userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #363a4f !important;
    --zen-primary-color: #eed49f !important;
    --zen-colors-secondary: #363a4f !important;
    --zen-colors-tertiary: #1e2030 !important;
    --zen-colors-border: #eed49f !important;
    --toolbarbutton-icon-fill: #eed49f !important;
    --lwt-text-color: #cad3f5 !important;
    --toolbar-field-color: #cad3f5 !important;
    --tab-selected-textcolor: rgb(220, 211, 202) !important;
    --toolbar-field-focus-color: #cad3f5 !important;
    --toolbar-color: #cad3f5 !important;
    --newtab-text-primary-color: #cad3f5 !important;
    --arrowpanel-color: #cad3f5 !important;
    --arrowpanel-background: #24273a !important;
    --sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-text-color: #cad3f5 !important;
    --lwt-sidebar-background-color: #181926 !important;
    --toolbar-bgcolor: #363a4f !important;
    --newtab-background-color: #24273a !important;
    --zen-themed-toolbar-bg: #1e2030 !important;
    --zen-main-browser-background: #1e2030 !important;
    --toolbox-bgcolor-inactive: #1e2030 !important;
  }

  #permissions-granted-icon {
    color: #1e2030 !important;
  }

  .sidebar-placesTree {
    background-color: #24273a !important;
  }

  #zen-workspaces-button {
    background-color: #24273a !important;
  }

  #TabsToolbar {
    background-color: #1e2030 !important;
  }

  .urlbar-background {
    background-color: #24273a !important;
  }

  .content-shortcuts {
    background-color: #24273a !important;
    border-color: #eed49f !important;
  }

  .urlbarView-url {
    color: #eed49f !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #181926 !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #363a4f !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #181926;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #8aadf4 !important;
    --identity-icon-color: #8aadf4 !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #8bd5ca !important;
    --identity-icon-color: #8bd5ca !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6da95 !important;
    --identity-icon-color: #a6da95 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #eed49f !important;
    --identity-icon-color: #eed49f !important;
  }

  .identity-color-orange {
    --identity-tab-color: #f5a97f !important;
    --identity-icon-color: #f5a97f !important;
  }

  .identity-color-red {
    --identity-tab-color: #ed8796 !important;
    --identity-icon-color: #ed8796 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5bde6 !important;
    --identity-icon-color: #f5bde6 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #c6a0f6 !important;
    --identity-icon-color: #c6a0f6 !important;
  }

  hbox#titlebar {
    background-color: #1e2030 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #1e2030 !important;
  }
}


================================================
FILE: themes/Macchiato/Yellow/userContent.css
================================================
/* Catppuccin Macchiato Yellow userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cad3f5 !important;
      --color-accent-primary: #eed49f !important;
      --color-accent-primary-hover: rgb(242, 222, 182) !important;
      --color-accent-primary-active: rgb(238, 232, 160) !important;
      background-color: #24273a !important;
      --in-content-page-background: #24273a !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-moz-document url("about:newtab"), url("about:home") {

    :root {
      --newtab-background-color: #24273a !important;
      --newtab-background-color-secondary: #363a4f !important;
      --newtab-element-hover-color: #363a4f !important;
      --newtab-text-primary-color: #cad3f5 !important;
      --newtab-wordmark-color: #cad3f5 !important;
      --newtab-primary-action-background: #eed49f !important;
    }

    .icon {
      color: #eed49f !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-macchiato.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Macchiato/Yellow/zen-logo-macchiato.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: #eed49f !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #1e2030 !important;
      --in-content-text-color: #cad3f5 !important;
      --link-color: #eed49f !important;
      --link-color-hover: rgb(242, 222, 182) !important;
      --zen-colors-primary: #363a4f !important;
      --in-content-box-background: #363a4f !important;
      --zen-primary-color: #eed49f !important;
    }

    groupbox , moz-card{
      background: #24273a !important;
    }

    button,
    groupbox menulist {
      background: #363a4f !important;
      color: #cad3f5 !important;
    }

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #1e2030 !important;
      --background-color-box: #24273a !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #24273a !important;
      --social-color: #c6a0f6 !important;
      --coockie-color: #91d7e3 !important;
      --fingerprinter-color: #eed49f !important;
      --cryptominer-color: #b7bdf8 !important;
      --tracker-color: #a6da95 !important;
      --in-content-primary-button-background-hover: rgb(84, 89, 116) !important;
      --in-content-primary-button-text-color-hover: #cad3f5 !important;
      --in-content-primary-button-background: #494d64 !important;
      --in-content-primary-button-text-color: #cad3f5 !important;
    }


    .card {
      background-color: #363a4f !important;
    }
  }
}


================================================
FILE: themes/Mocha/Blue/userChrome.css
================================================
/* Catppuccin Mocha Blue userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #313244 !important;
    --zen-primary-color: #89b4fa !important;
    --zen-colors-secondary: #313244 !important;
    --zen-colors-tertiary: #181825 !important;
    --zen-colors-border: #89b4fa !important;
    --toolbarbutton-icon-fill: #89b4fa !important;
    --lwt-text-color: #cdd6f4 !important;
    --toolbar-field-color: #cdd6f4 !important;
    --tab-selected-textcolor: rgb(171, 197, 247) !important;
    --toolbar-field-focus-color: #cdd6f4 !important;
    --toolbar-color: #cdd6f4 !important;
    --newtab-text-primary-color: #cdd6f4 !important;
    --arrowpanel-color: #cdd6f4 !important;
    --arrowpanel-background: #1e1e2e !important;
    --sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-background-color: #11111b !important;
    --toolbar-bgcolor: #313244 !important;
    --newtab-background-color: #1e1e2e !important;
    --zen-themed-toolbar-bg: #181825 !important;
    --zen-main-browser-background: #181825 !important;
    --toolbox-bgcolor-inactive: #181825 !important;
  }

  #permissions-granted-icon {
    color: #181825 !important;
  }

  .sidebar-placesTree {
    background-color: #1e1e2e !important;
  }

  #zen-workspaces-button {
    background-color: #1e1e2e !important;
  }

  #TabsToolbar {
    background-color: #181825 !important;
  }

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

  .content-shortcuts {
    background-color: #1e1e2e !important;
    border-color: #89b4fa !important;
  }

  .urlbarView-url {
    color: #89b4fa !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #11111b !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #313244 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #11111b;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #89b4fa !important;
    --identity-icon-color: #89b4fa !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #94e2d5 !important;
    --identity-icon-color: #94e2d5 !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6e3a1 !important;
    --identity-icon-color: #a6e3a1 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #f9e2af !important;
    --identity-icon-color: #f9e2af !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fab387 !important;
    --identity-icon-color: #fab387 !important;
  }

  .identity-color-red {
    --identity-tab-color: #f38ba8 !important;
    --identity-icon-color: #f38ba8 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5c2e7 !important;
    --identity-icon-color: #f5c2e7 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #cba6f7 !important;
    --identity-icon-color: #cba6f7 !important;
  }

  hbox#titlebar {
    background-color: #181825 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #181825 !important;
  }
}


================================================
FILE: themes/Mocha/Blue/userContent.css
================================================
/* Catppuccin Mocha Blue userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cdd6f4 !important;
      --color-accent-primary: #89b4fa !important;
      --color-accent-primary-hover: rgb(163, 197, 251) !important;
      --color-accent-primary-active: rgb(138, 153, 250) !important;
      background-color: #1e1e2e !important;
      --in-content-page-background: #1e1e2e !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #89b4fa !important;
    }

    .icon {
      color: #89b4fa !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;
    }
  }

  /* Variables and styles specific to about:preferences */
  @-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(163, 197, 251) !important;
      --zen-colors-primary: #313244 !important;
      --in-content-box-background: #313244 !important;
      --zen-primary-color: #89b4fa !important;
    }

    groupbox , moz-card{
      background: #1e1e2e !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #181825 !important;
      --background-color-box: #1e1e2e !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #1e1e2e !important;
      --social-color: #cba6f7 !important;
      --coockie-color: #89dceb !important;
      --fingerprinter-color: #f9e2af !important;
      --cryptominer-color: #b4befe !important;
      --tracker-color: #a6e3a1 !important;
      --in-content-primary-button-background-hover: rgb(81, 83, 105) !important;
      --in-content-primary-button-text-color-hover: #cdd6f4 !important;
      --in-content-primary-button-background: #45475a !important;
      --in-content-primary-button-text-color: #cdd6f4 !important;
    }


    .card {
      background-color: #313244 !important;
    }
  }
}


================================================
FILE: themes/Mocha/Flamingo/userChrome.css
================================================
/* Catppuccin Mocha Flamingo userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #313244 !important;
    --zen-primary-color: #f2cdcd !important;
    --zen-colors-secondary: #313244 !important;
    --zen-colors-tertiary: #181825 !important;
    --zen-colors-border: #f2cdcd !important;
    --toolbarbutton-icon-fill: #f2cdcd !important;
    --lwt-text-color: #cdd6f4 !important;
    --toolbar-field-color: #cdd6f4 !important;
    --tab-selected-textcolor: rgb(223, 210, 225) !important;
    --toolbar-field-focus-color: #cdd6f4 !important;
    --toolbar-color: #cdd6f4 !important;
    --newtab-text-primary-color: #cdd6f4 !important;
    --arrowpanel-color: #cdd6f4 !important;
    --arrowpanel-background: #1e1e2e !important;
    --sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-background-color: #11111b !important;
    --toolbar-bgcolor: #313244 !important;
    --newtab-background-color: #1e1e2e !important;
    --zen-themed-toolbar-bg: #181825 !important;
    --zen-main-browser-background: #181825 !important;
    --toolbox-bgcolor-inactive: #181825 !important;
  }

  #permissions-granted-icon {
    color: #181825 !important;
  }

  .sidebar-placesTree {
    background-color: #1e1e2e !important;
  }

  #zen-workspaces-button {
    background-color: #1e1e2e !important;
  }

  #TabsToolbar {
    background-color: #181825 !important;
  }

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

  .content-shortcuts {
    background-color: #1e1e2e !important;
    border-color: #f2cdcd !important;
  }

  .urlbarView-url {
    color: #f2cdcd !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #11111b !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #313244 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #11111b;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #89b4fa !important;
    --identity-icon-color: #89b4fa !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #94e2d5 !important;
    --identity-icon-color: #94e2d5 !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6e3a1 !important;
    --identity-icon-color: #a6e3a1 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #f9e2af !important;
    --identity-icon-color: #f9e2af !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fab387 !important;
    --identity-icon-color: #fab387 !important;
  }

  .identity-color-red {
    --identity-tab-color: #f38ba8 !important;
    --identity-icon-color: #f38ba8 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5c2e7 !important;
    --identity-icon-color: #f5c2e7 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #cba6f7 !important;
    --identity-icon-color: #cba6f7 !important;
  }

  hbox#titlebar {
    background-color: #181825 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #181825 !important;
  }
}


================================================
FILE: themes/Mocha/Flamingo/userContent.css
================================================
/* Catppuccin Mocha Flamingo userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cdd6f4 !important;
      --color-accent-primary: #f2cdcd !important;
      --color-accent-primary-hover: rgb(248, 226, 226) !important;
      --color-accent-primary-active: rgb(242, 215, 206) !important;
      background-color: #1e1e2e !important;
      --in-content-page-background: #1e1e2e !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #f2cdcd !important;
    }

    .icon {
      color: #f2cdcd !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-mocha.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Mocha/Flamingo/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: #f2cdcd !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #181825 !important;
      --in-content-text-color: #cdd6f4 !important;
      --link-color: #f2cdcd !important;
      --link-color-hover: rgb(248, 226, 226) !important;
      --zen-colors-primary: #313244 !important;
      --in-content-box-background: #313244 !important;
      --zen-primary-color: #f2cdcd !important;
    }

    groupbox , moz-card{
      background: #1e1e2e !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #181825 !important;
      --background-color-box: #1e1e2e !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #1e1e2e !important;
      --social-color: #cba6f7 !important;
      --coockie-color: #89dceb !important;
      --fingerprinter-color: #f9e2af !important;
      --cryptominer-color: #b4befe !important;
      --tracker-color: #a6e3a1 !important;
      --in-content-primary-button-background-hover: rgb(81, 83, 105) !important;
      --in-content-primary-button-text-color-hover: #cdd6f4 !important;
      --in-content-primary-button-background: #45475a !important;
      --in-content-primary-button-text-color: #cdd6f4 !important;
    }


    .card {
      background-color: #313244 !important;
    }
  }
}


================================================
FILE: themes/Mocha/Green/userChrome.css
================================================
/* Catppuccin Mocha Green userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #313244 !important;
    --zen-primary-color: #a6e3a1 !important;
    --zen-colors-secondary: #313244 !important;
    --zen-colors-tertiary: #181825 !important;
    --zen-colors-border: #a6e3a1 !important;
    --toolbarbutton-icon-fill: #a6e3a1 !important;
    --lwt-text-color: #cdd6f4 !important;
    --toolbar-field-color: #cdd6f4 !important;
    --tab-selected-textcolor: rgb(185, 221, 203) !important;
    --toolbar-field-focus-color: #cdd6f4 !important;
    --toolbar-color: #cdd6f4 !important;
    --newtab-text-primary-color: #cdd6f4 !important;
    --arrowpanel-color: #cdd6f4 !important;
    --arrowpanel-background: #1e1e2e !important;
    --sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-background-color: #11111b !important;
    --toolbar-bgcolor: #313244 !important;
    --newtab-background-color: #1e1e2e !important;
    --zen-themed-toolbar-bg: #181825 !important;
    --zen-main-browser-background: #181825 !important;
    --toolbox-bgcolor-inactive: #181825 !important;
  }

  #permissions-granted-icon {
    color: #181825 !important;
  }

  .sidebar-placesTree {
    background-color: #1e1e2e !important;
  }

  #zen-workspaces-button {
    background-color: #1e1e2e !important;
  }

  #TabsToolbar {
    background-color: #181825 !important;
  }

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

  .content-shortcuts {
    background-color: #1e1e2e !important;
    border-color: #a6e3a1 !important;
  }

  .urlbarView-url {
    color: #a6e3a1 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #11111b !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #313244 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #11111b;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #89b4fa !important;
    --identity-icon-color: #89b4fa !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #94e2d5 !important;
    --identity-icon-color: #94e2d5 !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6e3a1 !important;
    --identity-icon-color: #a6e3a1 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #f9e2af !important;
    --identity-icon-color: #f9e2af !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fab387 !important;
    --identity-icon-color: #fab387 !important;
  }

  .identity-color-red {
    --identity-tab-color: #f38ba8 !important;
    --identity-icon-color: #f38ba8 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5c2e7 !important;
    --identity-icon-color: #f5c2e7 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #cba6f7 !important;
    --identity-icon-color: #cba6f7 !important;
  }

  hbox#titlebar {
    background-color: #181825 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #181825 !important;
  }
}


================================================
FILE: themes/Mocha/Green/userContent.css
================================================
/* Catppuccin Mocha Green userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cdd6f4 !important;
      --color-accent-primary: #a6e3a1 !important;
      --color-accent-primary-hover: rgb(185, 233, 181) !important;
      --color-accent-primary-active: rgb(161, 227, 172) !important;
      background-color: #1e1e2e !important;
      --in-content-page-background: #1e1e2e !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #a6e3a1 !important;
    }

    .icon {
      color: #a6e3a1 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-mocha.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Mocha/Green/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: #a6e3a1 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #181825 !important;
      --in-content-text-color: #cdd6f4 !important;
      --link-color: #a6e3a1 !important;
      --link-color-hover: rgb(185, 233, 181) !important;
      --zen-colors-primary: #313244 !important;
      --in-content-box-background: #313244 !important;
      --zen-primary-color: #a6e3a1 !important;
    }

    groupbox , moz-card{
      background: #1e1e2e !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #181825 !important;
      --background-color-box: #1e1e2e !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #1e1e2e !important;
      --social-color: #cba6f7 !important;
      --coockie-color: #89dceb !important;
      --fingerprinter-color: #f9e2af !important;
      --cryptominer-color: #b4befe !important;
      --tracker-color: #a6e3a1 !important;
      --in-content-primary-button-background-hover: rgb(81, 83, 105) !important;
      --in-content-primary-button-text-color-hover: #cdd6f4 !important;
      --in-content-primary-button-background: #45475a !important;
      --in-content-primary-button-text-color: #cdd6f4 !important;
    }


    .card {
      background-color: #313244 !important;
    }
  }
}


================================================
FILE: themes/Mocha/Lavender/userChrome.css
================================================
/* Catppuccin Mocha Lavender userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #313244 !important;
    --zen-primary-color: #b4befe !important;
    --zen-colors-secondary: #313244 !important;
    --zen-colors-tertiary: #181825 !important;
    --zen-colors-border: #b4befe !important;
    --toolbarbutton-icon-fill: #b4befe !important;
    --lwt-text-color: #cdd6f4 !important;
    --toolbar-field-color: #cdd6f4 !important;
    --tab-selected-textcolor: rgb(192, 202, 249) !important;
    --toolbar-field-focus-color: #cdd6f4 !important;
    --toolbar-color: #cdd6f4 !important;
    --newtab-text-primary-color: #cdd6f4 !important;
    --arrowpanel-color: #cdd6f4 !important;
    --arrowpanel-background: #1e1e2e !important;
    --sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-background-color: #11111b !important;
    --toolbar-bgcolor: #313244 !important;
    --newtab-background-color: #1e1e2e !important;
    --zen-themed-toolbar-bg: #181825 !important;
    --zen-main-browser-background: #181825 !important;
    --toolbox-bgcolor-inactive: #181825 !important;
  }

  #permissions-granted-icon {
    color: #181825 !important;
  }

  .sidebar-placesTree {
    background-color: #1e1e2e !important;
  }

  #zen-workspaces-button {
    background-color: #1e1e2e !important;
  }

  #TabsToolbar {
    background-color: #181825 !important;
  }

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

  .content-shortcuts {
    background-color: #1e1e2e !important;
    border-color: #b4befe !important;
  }

  .urlbarView-url {
    color: #b4befe !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #11111b !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #313244 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #11111b;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #89b4fa !important;
    --identity-icon-color: #89b4fa !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #94e2d5 !important;
    --identity-icon-color: #94e2d5 !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6e3a1 !important;
    --identity-icon-color: #a6e3a1 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #f9e2af !important;
    --identity-icon-color: #f9e2af !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fab387 !important;
    --identity-icon-color: #fab387 !important;
  }

  .identity-color-red {
    --identity-tab-color: #f38ba8 !important;
    --identity-icon-color: #f38ba8 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5c2e7 !important;
    --identity-icon-color: #f5c2e7 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #cba6f7 !important;
    --identity-icon-color: #cba6f7 !important;
  }

  hbox#titlebar {
    background-color: #181825 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #181825 !important;
  }
}


================================================
FILE: themes/Mocha/Lavender/userContent.css
================================================
/* Catppuccin Mocha Lavender userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cdd6f4 !important;
      --color-accent-primary: #b4befe !important;
      --color-accent-primary-hover: rgb(206, 212, 254) !important;
      --color-accent-primary-active: rgb(189, 180, 254) !important;
      background-color: #1e1e2e !important;
      --in-content-page-background: #1e1e2e !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #b4befe !important;
    }

    .icon {
      color: #b4befe !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-mocha.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Mocha/Lavender/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: #b4befe !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #181825 !important;
      --in-content-text-color: #cdd6f4 !important;
      --link-color: #b4befe !important;
      --link-color-hover: rgb(206, 212, 254) !important;
      --zen-colors-primary: #313244 !important;
      --in-content-box-background: #313244 !important;
      --zen-primary-color: #b4befe !important;
    }

    groupbox , moz-card{
      background: #1e1e2e !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #181825 !important;
      --background-color-box: #1e1e2e !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #1e1e2e !important;
      --social-color: #cba6f7 !important;
      --coockie-color: #89dceb !important;
      --fingerprinter-color: #f9e2af !important;
      --cryptominer-color: #b4befe !important;
      --tracker-color: #a6e3a1 !important;
      --in-content-primary-button-background-hover: rgb(81, 83, 105) !important;
      --in-content-primary-button-text-color-hover: #cdd6f4 !important;
      --in-content-primary-button-background: #45475a !important;
      --in-content-primary-button-text-color: #cdd6f4 !important;
    }


    .card {
      background-color: #313244 !important;
    }
  }
}


================================================
FILE: themes/Mocha/Maroon/userChrome.css
================================================
/* Catppuccin Mocha Maroon userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #313244 !important;
    --zen-primary-color: #eba0ac !important;
    --zen-colors-secondary: #313244 !important;
    --zen-colors-tertiary: #181825 !important;
    --zen-colors-border: #eba0ac !important;
    --toolbarbutton-icon-fill: #eba0ac !important;
    --lwt-text-color: #cdd6f4 !important;
    --toolbar-field-color: #cdd6f4 !important;
    --tab-selected-textcolor: rgb(220, 187, 208) !important;
    --toolbar-field-focus-color: #cdd6f4 !important;
    --toolbar-color: #cdd6f4 !important;
    --newtab-text-primary-color: #cdd6f4 !important;
    --arrowpanel-color: #cdd6f4 !important;
    --arrowpanel-background: #1e1e2e !important;
    --sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-background-color: #11111b !important;
    --toolbar-bgcolor: #313244 !important;
    --newtab-background-color: #1e1e2e !important;
    --zen-themed-toolbar-bg: #181825 !important;
    --zen-main-browser-background: #181825 !important;
    --toolbox-bgcolor-inactive: #181825 !important;
  }

  #permissions-granted-icon {
    color: #181825 !important;
  }

  .sidebar-placesTree {
    background-color: #1e1e2e !important;
  }

  #zen-workspaces-button {
    background-color: #1e1e2e !important;
  }

  #TabsToolbar {
    background-color: #181825 !important;
  }

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

  .content-shortcuts {
    background-color: #1e1e2e !important;
    border-color: #eba0ac !important;
  }

  .urlbarView-url {
    color: #eba0ac !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #11111b !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #313244 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #11111b;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #89b4fa !important;
    --identity-icon-color: #89b4fa !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #94e2d5 !important;
    --identity-icon-color: #94e2d5 !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6e3a1 !important;
    --identity-icon-color: #a6e3a1 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #f9e2af !important;
    --identity-icon-color: #f9e2af !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fab387 !important;
    --identity-icon-color: #fab387 !important;
  }

  .identity-color-red {
    --identity-tab-color: #f38ba8 !important;
    --identity-icon-color: #f38ba8 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5c2e7 !important;
    --identity-icon-color: #f5c2e7 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #cba6f7 !important;
    --identity-icon-color: #cba6f7 !important;
  }

  hbox#titlebar {
    background-color: #181825 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #181825 !important;
  }
}


================================================
FILE: themes/Mocha/Maroon/userContent.css
================================================
/* Catppuccin Mocha Maroon userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cdd6f4 !important;
      --color-accent-primary: #eba0ac !important;
      --color-accent-primary-hover: rgb(240, 182, 192) !important;
      --color-accent-primary-active: rgb(235, 167, 161) !important;
      background-color: #1e1e2e !important;
      --in-content-page-background: #1e1e2e !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #eba0ac !important;
    }

    .icon {
      color: #eba0ac !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-mocha.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Mocha/Maroon/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: #eba0ac !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #181825 !important;
      --in-content-text-color: #cdd6f4 !important;
      --link-color: #eba0ac !important;
      --link-color-hover: rgb(240, 182, 192) !important;
      --zen-colors-primary: #313244 !important;
      --in-content-box-background: #313244 !important;
      --zen-primary-color: #eba0ac !important;
    }

    groupbox , moz-card{
      background: #1e1e2e !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #181825 !important;
      --background-color-box: #1e1e2e !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #1e1e2e !important;
      --social-color: #cba6f7 !important;
      --coockie-color: #89dceb !important;
      --fingerprinter-color: #f9e2af !important;
      --cryptominer-color: #b4befe !important;
      --tracker-color: #a6e3a1 !important;
      --in-content-primary-button-background-hover: rgb(81, 83, 105) !important;
      --in-content-primary-button-text-color-hover: #cdd6f4 !important;
      --in-content-primary-button-background: #45475a !important;
      --in-content-primary-button-text-color: #cdd6f4 !important;
    }


    .card {
      background-color: #313244 !important;
    }
  }
}


================================================
FILE: themes/Mocha/Mauve/userChrome.css
================================================
/* Catppuccin Mocha Mauve userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #313244 !important;
    --zen-primary-color: #cba6f7 !important;
    --zen-colors-secondary: #313244 !important;
    --zen-colors-tertiary: #181825 !important;
    --zen-colors-border: #cba6f7 !important;
    --toolbarbutton-icon-fill: #cba6f7 !important;
    --lwt-text-color: #cdd6f4 !important;
    --toolbar-field-color: #cdd6f4 !important;
    --tab-selected-textcolor: rgb(204, 190, 246) !important;
    --toolbar-field-focus-color: #cdd6f4 !important;
    --toolbar-color: #cdd6f4 !important;
    --newtab-text-primary-color: #cdd6f4 !important;
    --arrowpanel-color: #cdd6f4 !important;
    --arrowpanel-background: #1e1e2e !important;
    --sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-background-color: #11111b !important;
    --toolbar-bgcolor: #313244 !important;
    --newtab-background-color: #1e1e2e !important;
    --zen-themed-toolbar-bg: #181825 !important;
    --zen-main-browser-background: #181825 !important;
    --toolbox-bgcolor-inactive: #181825 !important;
  }

  #permissions-granted-icon {
    color: #181825 !important;
  }

  .sidebar-placesTree {
    background-color: #1e1e2e !important;
  }

  #zen-workspaces-button {
    background-color: #1e1e2e !important;
  }

  #TabsToolbar {
    background-color: #181825 !important;
  }

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

  .content-shortcuts {
    background-color: #1e1e2e !important;
    border-color: #cba6f7 !important;
  }

  .urlbarView-url {
    color: #cba6f7 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #11111b !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #313244 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #11111b;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #89b4fa !important;
    --identity-icon-color: #89b4fa !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #94e2d5 !important;
    --identity-icon-color: #94e2d5 !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6e3a1 !important;
    --identity-icon-color: #a6e3a1 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #f9e2af !important;
    --identity-icon-color: #f9e2af !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fab387 !important;
    --identity-icon-color: #fab387 !important;
  }

  .identity-color-red {
    --identity-tab-color: #f38ba8 !important;
    --identity-icon-color: #f38ba8 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5c2e7 !important;
    --identity-icon-color: #f5c2e7 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #cba6f7 !important;
    --identity-icon-color: #cba6f7 !important;
  }

  hbox#titlebar {
    background-color: #181825 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #181825 !important;
  }
}


================================================
FILE: themes/Mocha/Mauve/userContent.css
================================================
/* Catppuccin Mocha Mauve userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cdd6f4 !important;
      --color-accent-primary: #cba6f7 !important;
      --color-accent-primary-hover: rgb(217, 191, 249) !important;
      --color-accent-primary-active: rgb(223, 167, 247) !important;
      background-color: #1e1e2e !important;
      --in-content-page-background: #1e1e2e !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #cba6f7 !important;
    }

    .icon {
      color: #cba6f7 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-mocha.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Mocha/Mauve/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: #cba6f7 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #181825 !important;
      --in-content-text-color: #cdd6f4 !important;
      --link-color: #cba6f7 !important;
      --link-color-hover: rgb(217, 191, 249) !important;
      --zen-colors-primary: #313244 !important;
      --in-content-box-background: #313244 !important;
      --zen-primary-color: #cba6f7 !important;
    }

    groupbox , moz-card{
      background: #1e1e2e !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #181825 !important;
      --background-color-box: #1e1e2e !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #1e1e2e !important;
      --social-color: #cba6f7 !important;
      --coockie-color: #89dceb !important;
      --fingerprinter-color: #f9e2af !important;
      --cryptominer-color: #b4befe !important;
      --tracker-color: #a6e3a1 !important;
      --in-content-primary-button-background-hover: rgb(81, 83, 105) !important;
      --in-content-primary-button-text-color-hover: #cdd6f4 !important;
      --in-content-primary-button-background: #45475a !important;
      --in-content-primary-button-text-color: #cdd6f4 !important;
    }


    .card {
      background-color: #313244 !important;
    }
  }
}


================================================
FILE: themes/Mocha/Peach/userChrome.css
================================================
/* Catppuccin Mocha Peach userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #313244 !important;
    --zen-primary-color: #fab387 !important;
    --zen-colors-secondary: #313244 !important;
    --zen-colors-tertiary: #181825 !important;
    --zen-colors-border: #fab387 !important;
    --toolbarbutton-icon-fill: #fab387 !important;
    --lwt-text-color: #cdd6f4 !important;
    --toolbar-field-color: #cdd6f4 !important;
    --tab-selected-textcolor: rgb(227, 197, 190) !important;
    --toolbar-field-focus-color: #cdd6f4 !important;
    --toolbar-color: #cdd6f4 !important;
    --newtab-text-primary-color: #cdd6f4 !important;
    --arrowpanel-color: #cdd6f4 !important;
    --arrowpanel-background: #1e1e2e !important;
    --sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-background-color: #11111b !important;
    --toolbar-bgcolor: #313244 !important;
    --newtab-background-color: #1e1e2e !important;
    --zen-themed-toolbar-bg: #181825 !important;
    --zen-main-browser-background: #181825 !important;
    --toolbox-bgcolor-inactive: #181825 !important;
  }

  #permissions-granted-icon {
    color: #181825 !important;
  }

  .sidebar-placesTree {
    background-color: #1e1e2e !important;
  }

  #zen-workspaces-button {
    background-color: #1e1e2e !important;
  }

  #TabsToolbar {
    background-color: #181825 !important;
  }

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

  .content-shortcuts {
    background-color: #1e1e2e !important;
    border-color: #fab387 !important;
  }

  .urlbarView-url {
    color: #fab387 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #11111b !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #313244 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #11111b;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #89b4fa !important;
    --identity-icon-color: #89b4fa !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #94e2d5 !important;
    --identity-icon-color: #94e2d5 !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6e3a1 !important;
    --identity-icon-color: #a6e3a1 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #f9e2af !important;
    --identity-icon-color: #f9e2af !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fab387 !important;
    --identity-icon-color: #fab387 !important;
  }

  .identity-color-red {
    --identity-tab-color: #f38ba8 !important;
    --identity-icon-color: #f38ba8 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5c2e7 !important;
    --identity-icon-color: #f5c2e7 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #cba6f7 !important;
    --identity-icon-color: #cba6f7 !important;
  }

  hbox#titlebar {
    background-color: #181825 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #181825 !important;
  }
}


================================================
FILE: themes/Mocha/Peach/userContent.css
================================================
/* Catppuccin Mocha Peach userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cdd6f4 !important;
      --color-accent-primary: #fab387 !important;
      --color-accent-primary-hover: rgb(251, 195, 161) !important;
      --color-accent-primary-active: rgb(250, 208, 136) !important;
      background-color: #1e1e2e !important;
      --in-content-page-background: #1e1e2e !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #fab387 !important;
    }

    .icon {
      color: #fab387 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-mocha.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Mocha/Peach/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: #fab387 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #181825 !important;
      --in-content-text-color: #cdd6f4 !important;
      --link-color: #fab387 !important;
      --link-color-hover: rgb(251, 195, 161) !important;
      --zen-colors-primary: #313244 !important;
      --in-content-box-background: #313244 !important;
      --zen-primary-color: #fab387 !important;
    }

    groupbox , moz-card{
      background: #1e1e2e !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #181825 !important;
      --background-color-box: #1e1e2e !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #1e1e2e !important;
      --social-color: #cba6f7 !important;
      --coockie-color: #89dceb !important;
      --fingerprinter-color: #f9e2af !important;
      --cryptominer-color: #b4befe !important;
      --tracker-color: #a6e3a1 !important;
      --in-content-primary-button-background-hover: rgb(81, 83, 105) !important;
      --in-content-primary-button-text-color-hover: #cdd6f4 !important;
      --in-content-primary-button-background: #45475a !important;
      --in-content-primary-button-text-color: #cdd6f4 !important;
    }


    .card {
      background-color: #313244 !important;
    }
  }
}


================================================
FILE: themes/Mocha/Pink/userChrome.css
================================================
/* Catppuccin Mocha Pink userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #313244 !important;
    --zen-primary-color: #f5c2e7 !important;
    --zen-colors-secondary: #313244 !important;
    --zen-colors-tertiary: #181825 !important;
    --zen-colors-border: #f5c2e7 !important;
    --toolbarbutton-icon-fill: #f5c2e7 !important;
    --lwt-text-color: #cdd6f4 !important;
    --toolbar-field-color: #cdd6f4 !important;
    --tab-selected-textcolor: rgb(225, 204, 238) !important;
    --toolbar-field-focus-color: #cdd6f4 !important;
    --toolbar-color: #cdd6f4 !important;
    --newtab-text-primary-color: #cdd6f4 !important;
    --arrowpanel-color: #cdd6f4 !important;
    --arrowpanel-background: #1e1e2e !important;
    --sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-background-color: #11111b !important;
    --toolbar-bgcolor: #313244 !important;
    --newtab-background-color: #1e1e2e !important;
    --zen-themed-toolbar-bg: #181825 !important;
    --zen-main-browser-background: #181825 !important;
    --toolbox-bgcolor-inactive: #181825 !important;
  }

  #permissions-granted-icon {
    color: #181825 !important;
  }

  .sidebar-placesTree {
    background-color: #1e1e2e !important;
  }

  #zen-workspaces-button {
    background-color: #1e1e2e !important;
  }

  #TabsToolbar {
    background-color: #181825 !important;
  }

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

  .content-shortcuts {
    background-color: #1e1e2e !important;
    border-color: #f5c2e7 !important;
  }

  .urlbarView-url {
    color: #f5c2e7 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #11111b !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #313244 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #11111b;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #89b4fa !important;
    --identity-icon-color: #89b4fa !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #94e2d5 !important;
    --identity-icon-color: #94e2d5 !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6e3a1 !important;
    --identity-icon-color: #a6e3a1 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #f9e2af !important;
    --identity-icon-color: #f9e2af !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fab387 !important;
    --identity-icon-color: #fab387 !important;
  }

  .identity-color-red {
    --identity-tab-color: #f38ba8 !important;
    --identity-icon-color: #f38ba8 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5c2e7 !important;
    --identity-icon-color: #f5c2e7 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #cba6f7 !important;
    --identity-icon-color: #cba6f7 !important;
  }

  hbox#titlebar {
    background-color: #181825 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #181825 !important;
  }
}


================================================
FILE: themes/Mocha/Pink/userContent.css
================================================
/* Catppuccin Mocha Pink userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cdd6f4 !important;
      --color-accent-primary: #f5c2e7 !important;
      --color-accent-primary-hover: rgb(249, 217, 240) !important;
      --color-accent-primary-active: rgb(245, 195, 219) !important;
      background-color: #1e1e2e !important;
      --in-content-page-background: #1e1e2e !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #f5c2e7 !important;
    }

    .icon {
      color: #f5c2e7 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-mocha.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Mocha/Pink/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: #f5c2e7 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #181825 !important;
      --in-content-text-color: #cdd6f4 !important;
      --link-color: #f5c2e7 !important;
      --link-color-hover: rgb(249, 217, 240) !important;
      --zen-colors-primary: #313244 !important;
      --in-content-box-background: #313244 !important;
      --zen-primary-color: #f5c2e7 !important;
    }

    groupbox , moz-card{
      background: #1e1e2e !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #181825 !important;
      --background-color-box: #1e1e2e !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #1e1e2e !important;
      --social-color: #cba6f7 !important;
      --coockie-color: #89dceb !important;
      --fingerprinter-color: #f9e2af !important;
      --cryptominer-color: #b4befe !important;
      --tracker-color: #a6e3a1 !important;
      --in-content-primary-button-background-hover: rgb(81, 83, 105) !important;
      --in-content-primary-button-text-color-hover: #cdd6f4 !important;
      --in-content-primary-button-background: #45475a !important;
      --in-content-primary-button-text-color: #cdd6f4 !important;
    }


    .card {
      background-color: #313244 !important;
    }
  }
}


================================================
FILE: themes/Mocha/Red/userChrome.css
================================================
/* Catppuccin Mocha Red userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #313244 !important;
    --zen-primary-color: #f38ba8 !important;
    --zen-colors-secondary: #313244 !important;
    --zen-colors-tertiary: #181825 !important;
    --zen-colors-border: #f38ba8 !important;
    --toolbarbutton-icon-fill: #f38ba8 !important;
    --lwt-text-color: #cdd6f4 !important;
    --toolbar-field-color: #cdd6f4 !important;
    --tab-selected-textcolor: rgb(224, 177, 206) !important;
    --toolbar-field-focus-color: #cdd6f4 !important;
    --toolbar-color: #cdd6f4 !important;
    --newtab-text-primary-color: #cdd6f4 !important;
    --arrowpanel-color: #cdd6f4 !important;
    --arrowpanel-background: #1e1e2e !important;
    --sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-background-color: #11111b !important;
    --toolbar-bgcolor: #313244 !important;
    --newtab-background-color: #1e1e2e !important;
    --zen-themed-toolbar-bg: #181825 !important;
    --zen-main-browser-background: #181825 !important;
    --toolbox-bgcolor-inactive: #181825 !important;
  }

  #permissions-granted-icon {
    color: #181825 !important;
  }

  .sidebar-placesTree {
    background-color: #1e1e2e !important;
  }

  #zen-workspaces-button {
    background-color: #1e1e2e !important;
  }

  #TabsToolbar {
    background-color: #181825 !important;
  }

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

  .content-shortcuts {
    background-color: #1e1e2e !important;
    border-color: #f38ba8 !important;
  }

  .urlbarView-url {
    color: #f38ba8 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #11111b !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #313244 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #11111b;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #89b4fa !important;
    --identity-icon-color: #89b4fa !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #94e2d5 !important;
    --identity-icon-color: #94e2d5 !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6e3a1 !important;
    --identity-icon-color: #a6e3a1 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #f9e2af !important;
    --identity-icon-color: #f9e2af !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fab387 !important;
    --identity-icon-color: #fab387 !important;
  }

  .identity-color-red {
    --identity-tab-color: #f38ba8 !important;
    --identity-icon-color: #f38ba8 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5c2e7 !important;
    --identity-icon-color: #f5c2e7 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #cba6f7 !important;
    --identity-icon-color: #cba6f7 !important;
  }

  hbox#titlebar {
    background-color: #181825 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #181825 !important;
  }
}


================================================
FILE: themes/Mocha/Red/userContent.css
================================================
/* Catppuccin Mocha Red userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cdd6f4 !important;
      --color-accent-primary: #f38ba8 !important;
      --color-accent-primary-hover: rgb(245, 163, 186) !important;
      --color-accent-primary-active: rgb(243, 139, 143) !important;
      background-color: #1e1e2e !important;
      --in-content-page-background: #1e1e2e !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #f38ba8 !important;
    }

    .icon {
      color: #f38ba8 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-mocha.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Mocha/Red/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: #f38ba8 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #181825 !important;
      --in-content-text-color: #cdd6f4 !important;
      --link-color: #f38ba8 !important;
      --link-color-hover: rgb(245, 163, 186) !important;
      --zen-colors-primary: #313244 !important;
      --in-content-box-background: #313244 !important;
      --zen-primary-color: #f38ba8 !important;
    }

    groupbox , moz-card{
      background: #1e1e2e !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #181825 !important;
      --background-color-box: #1e1e2e !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #1e1e2e !important;
      --social-color: #cba6f7 !important;
      --coockie-color: #89dceb !important;
      --fingerprinter-color: #f9e2af !important;
      --cryptominer-color: #b4befe !important;
      --tracker-color: #a6e3a1 !important;
      --in-content-primary-button-background-hover: rgb(81, 83, 105) !important;
      --in-content-primary-button-text-color-hover: #cdd6f4 !important;
      --in-content-primary-button-background: #45475a !important;
      --in-content-primary-button-text-color: #cdd6f4 !important;
    }


    .card {
      background-color: #313244 !important;
    }
  }
}


================================================
FILE: themes/Mocha/Rosewater/userChrome.css
================================================
/* Catppuccin Mocha Rosewater userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #313244 !important;
    --zen-primary-color: #f5e0dc !important;
    --zen-colors-secondary: #313244 !important;
    --zen-colors-tertiary: #181825 !important;
    --zen-colors-border: #f5e0dc !important;
    --toolbarbutton-icon-fill: #f5e0dc !important;
    --lwt-text-color: #cdd6f4 !important;
    --toolbar-field-color: #cdd6f4 !important;
    --tab-selected-textcolor: rgb(225, 219, 232) !important;
    --toolbar-field-focus-color: #cdd6f4 !important;
    --toolbar-color: #cdd6f4 !important;
    --newtab-text-primary-color: #cdd6f4 !important;
    --arrowpanel-color: #cdd6f4 !important;
    --arrowpanel-background: #1e1e2e !important;
    --sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-background-color: #11111b !important;
    --toolbar-bgcolor: #313244 !important;
    --newtab-background-color: #1e1e2e !important;
    --zen-themed-toolbar-bg: #181825 !important;
    --zen-main-browser-background: #181825 !important;
    --toolbox-bgcolor-inactive: #181825 !important;
  }

  #permissions-granted-icon {
    color: #181825 !important;
  }

  .sidebar-placesTree {
    background-color: #1e1e2e !important;
  }

  #zen-workspaces-button {
    background-color: #1e1e2e !important;
  }

  #TabsToolbar {
    background-color: #181825 !important;
  }

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

  .content-shortcuts {
    background-color: #1e1e2e !important;
    border-color: #f5e0dc !important;
  }

  .urlbarView-url {
    color: #f5e0dc !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #11111b !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #313244 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #11111b;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #89b4fa !important;
    --identity-icon-color: #89b4fa !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #94e2d5 !important;
    --identity-icon-color: #94e2d5 !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6e3a1 !important;
    --identity-icon-color: #a6e3a1 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #f9e2af !important;
    --identity-icon-color: #f9e2af !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fab387 !important;
    --identity-icon-color: #fab387 !important;
  }

  .identity-color-red {
    --identity-tab-color: #f38ba8 !important;
    --identity-icon-color: #f38ba8 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5c2e7 !important;
    --identity-icon-color: #f5c2e7 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #cba6f7 !important;
    --identity-icon-color: #cba6f7 !important;
  }

  hbox#titlebar {
    background-color: #181825 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #181825 !important;
  }
}


================================================
FILE: themes/Mocha/Rosewater/userContent.css
================================================
/* Catppuccin Mocha Rosewater userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cdd6f4 !important;
      --color-accent-primary: #f5e0dc !important;
      --color-accent-primary-hover: rgb(251, 243, 241) !important;
      --color-accent-primary-active: rgb(245, 231, 221) !important;
      background-color: #1e1e2e !important;
      --in-content-page-background: #1e1e2e !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #f5e0dc !important;
    }

    .icon {
      color: #f5e0dc !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-mocha.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Mocha/Rosewater/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: #f5e0dc !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #181825 !important;
      --in-content-text-color: #cdd6f4 !important;
      --link-color: #f5e0dc !important;
      --link-color-hover: rgb(251, 243, 241) !important;
      --zen-colors-primary: #313244 !important;
      --in-content-box-background: #313244 !important;
      --zen-primary-color: #f5e0dc !important;
    }

    groupbox , moz-card{
      background: #1e1e2e !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #181825 !important;
      --background-color-box: #1e1e2e !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #1e1e2e !important;
      --social-color: #cba6f7 !important;
      --coockie-color: #89dceb !important;
      --fingerprinter-color: #f9e2af !important;
      --cryptominer-color: #b4befe !important;
      --tracker-color: #a6e3a1 !important;
      --in-content-primary-button-background-hover: rgb(81, 83, 105) !important;
      --in-content-primary-button-text-color-hover: #cdd6f4 !important;
      --in-content-primary-button-background: #45475a !important;
      --in-content-primary-button-text-color: #cdd6f4 !important;
    }


    .card {
      background-color: #313244 !important;
    }
  }
}


================================================
FILE: themes/Mocha/Sapphire/userChrome.css
================================================
/* Catppuccin Mocha Sapphire userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #313244 !important;
    --zen-primary-color: #74c7ec !important;
    --zen-colors-secondary: #313244 !important;
    --zen-colors-tertiary: #181825 !important;
    --zen-colors-border: #74c7ec !important;
    --toolbarbutton-icon-fill: #74c7ec !important;
    --lwt-text-color: #cdd6f4 !important;
    --toolbar-field-color: #cdd6f4 !important;
    --tab-selected-textcolor: rgb(160, 207, 240) !important;
    --toolbar-field-focus-color: #cdd6f4 !important;
    --toolbar-color: #cdd6f4 !important;
    --newtab-text-primary-color: #cdd6f4 !important;
    --arrowpanel-color: #cdd6f4 !important;
    --arrowpanel-background: #1e1e2e !important;
    --sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-background-color: #11111b !important;
    --toolbar-bgcolor: #313244 !important;
    --newtab-background-color: #1e1e2e !important;
    --zen-themed-toolbar-bg: #181825 !important;
    --zen-main-browser-background: #181825 !important;
    --toolbox-bgcolor-inactive: #181825 !important;
  }

  #permissions-granted-icon {
    color: #181825 !important;
  }

  .sidebar-placesTree {
    background-color: #1e1e2e !important;
  }

  #zen-workspaces-button {
    background-color: #1e1e2e !important;
  }

  #TabsToolbar {
    background-color: #181825 !important;
  }

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

  .content-shortcuts {
    background-color: #1e1e2e !important;
    border-color: #74c7ec !important;
  }

  .urlbarView-url {
    color: #74c7ec !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #11111b !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #313244 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #11111b;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #89b4fa !important;
    --identity-icon-color: #89b4fa !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #94e2d5 !important;
    --identity-icon-color: #94e2d5 !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6e3a1 !important;
    --identity-icon-color: #a6e3a1 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #f9e2af !important;
    --identity-icon-color: #f9e2af !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fab387 !important;
    --identity-icon-color: #fab387 !important;
  }

  .identity-color-red {
    --identity-tab-color: #f38ba8 !important;
    --identity-icon-color: #f38ba8 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5c2e7 !important;
    --identity-icon-color: #f5c2e7 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #cba6f7 !important;
    --identity-icon-color: #cba6f7 !important;
  }

  hbox#titlebar {
    background-color: #181825 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #181825 !important;
  }
}


================================================
FILE: themes/Mocha/Sapphire/userContent.css
================================================
/* Catppuccin Mocha Sapphire userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cdd6f4 !important;
      --color-accent-primary: #74c7ec !important;
      --color-accent-primary-hover: rgb(139, 207, 239) !important;
      --color-accent-primary-active: rgb(116, 168, 236) !important;
      background-color: #1e1e2e !important;
      --in-content-page-background: #1e1e2e !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #74c7ec !important;
    }

    .icon {
      color: #74c7ec !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-mocha.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Mocha/Sapphire/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: #74c7ec !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #181825 !important;
      --in-content-text-color: #cdd6f4 !important;
      --link-color: #74c7ec !important;
      --link-color-hover: rgb(139, 207, 239) !important;
      --zen-colors-primary: #313244 !important;
      --in-content-box-background: #313244 !important;
      --zen-primary-color: #74c7ec !important;
    }

    groupbox , moz-card{
      background: #1e1e2e !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #181825 !important;
      --background-color-box: #1e1e2e !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #1e1e2e !important;
      --social-color: #cba6f7 !important;
      --coockie-color: #89dceb !important;
      --fingerprinter-color: #f9e2af !important;
      --cryptominer-color: #b4befe !important;
      --tracker-color: #a6e3a1 !important;
      --in-content-primary-button-background-hover: rgb(81, 83, 105) !important;
      --in-content-primary-button-text-color-hover: #cdd6f4 !important;
      --in-content-primary-button-background: #45475a !important;
      --in-content-primary-button-text-color: #cdd6f4 !important;
    }


    .card {
      background-color: #313244 !important;
    }
  }
}


================================================
FILE: themes/Mocha/Sky/userChrome.css
================================================
/* Catppuccin Mocha Sky userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #313244 !important;
    --zen-primary-color: #89dceb !important;
    --zen-colors-secondary: #313244 !important;
    --zen-colors-tertiary: #181825 !important;
    --zen-colors-border: #89dceb !important;
    --toolbarbutton-icon-fill: #89dceb !important;
    --lwt-text-color: #cdd6f4 !important;
    --toolbar-field-color: #cdd6f4 !important;
    --tab-selected-textcolor: rgb(171, 217, 240) !important;
    --toolbar-field-focus-color: #cdd6f4 !important;
    --toolbar-color: #cdd6f4 !important;
    --newtab-text-primary-color: #cdd6f4 !important;
    --arrowpanel-color: #cdd6f4 !important;
    --arrowpanel-background: #1e1e2e !important;
    --sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-background-color: #11111b !important;
    --toolbar-bgcolor: #313244 !important;
    --newtab-background-color: #1e1e2e !important;
    --zen-themed-toolbar-bg: #181825 !important;
    --zen-main-browser-background: #181825 !important;
    --toolbox-bgcolor-inactive: #181825 !important;
  }

  #permissions-granted-icon {
    color: #181825 !important;
  }

  .sidebar-placesTree {
    background-color: #1e1e2e !important;
  }

  #zen-workspaces-button {
    background-color: #1e1e2e !important;
  }

  #TabsToolbar {
    background-color: #181825 !important;
  }

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

  .content-shortcuts {
    background-color: #1e1e2e !important;
    border-color: #89dceb !important;
  }

  .urlbarView-url {
    color: #89dceb !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #11111b !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #313244 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #11111b;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #89b4fa !important;
    --identity-icon-color: #89b4fa !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #94e2d5 !important;
    --identity-icon-color: #94e2d5 !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6e3a1 !important;
    --identity-icon-color: #a6e3a1 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #f9e2af !important;
    --identity-icon-color: #f9e2af !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fab387 !important;
    --identity-icon-color: #fab387 !important;
  }

  .identity-color-red {
    --identity-tab-color: #f38ba8 !important;
    --identity-icon-color: #f38ba8 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5c2e7 !important;
    --identity-icon-color: #f5c2e7 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #cba6f7 !important;
    --identity-icon-color: #cba6f7 !important;
  }

  hbox#titlebar {
    background-color: #181825 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #181825 !important;
  }
}


================================================
FILE: themes/Mocha/Sky/userContent.css
================================================
/* Catppuccin Mocha Sky userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cdd6f4 !important;
      --color-accent-primary: #89dceb !important;
      --color-accent-primary-hover: rgb(159, 227, 239) !important;
      --color-accent-primary-active: rgb(137, 196, 235) !important;
      background-color: #1e1e2e !important;
      --in-content-page-background: #1e1e2e !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #89dceb !important;
    }

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

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-mocha.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Mocha/Sky/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: #89dceb !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #181825 !important;
      --in-content-text-color: #cdd6f4 !important;
      --link-color: #89dceb !important;
      --link-color-hover: rgb(159, 227, 239) !important;
      --zen-colors-primary: #313244 !important;
      --in-content-box-background: #313244 !important;
      --zen-primary-color: #89dceb !important;
    }

    groupbox , moz-card{
      background: #1e1e2e !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #181825 !important;
      --background-color-box: #1e1e2e !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #1e1e2e !important;
      --social-color: #cba6f7 !important;
      --coockie-color: #89dceb !important;
      --fingerprinter-color: #f9e2af !important;
      --cryptominer-color: #b4befe !important;
      --tracker-color: #a6e3a1 !important;
      --in-content-primary-button-background-hover: rgb(81, 83, 105) !important;
      --in-content-primary-button-text-color-hover: #cdd6f4 !important;
      --in-content-primary-button-background: #45475a !important;
      --in-content-primary-button-text-color: #cdd6f4 !important;
    }


    .card {
      background-color: #313244 !important;
    }
  }
}


================================================
FILE: themes/Mocha/Teal/userChrome.css
================================================
/* Catppuccin Mocha Teal userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #313244 !important;
    --zen-primary-color: #94e2d5 !important;
    --zen-colors-secondary: #313244 !important;
    --zen-colors-tertiary: #181825 !important;
    --zen-colors-border: #94e2d5 !important;
    --toolbarbutton-icon-fill: #94e2d5 !important;
    --lwt-text-color: #cdd6f4 !important;
    --toolbar-field-color: #cdd6f4 !important;
    --tab-selected-textcolor: rgb(176, 220, 229) !important;
    --toolbar-field-focus-color: #cdd6f4 !important;
    --toolbar-color: #cdd6f4 !important;
    --newtab-text-primary-color: #cdd6f4 !important;
    --arrowpanel-color: #cdd6f4 !important;
    --arrowpanel-background: #1e1e2e !important;
    --sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-background-color: #11111b !important;
    --toolbar-bgcolor: #313244 !important;
    --newtab-background-color: #1e1e2e !important;
    --zen-themed-toolbar-bg: #181825 !important;
    --zen-main-browser-background: #181825 !important;
    --toolbox-bgcolor-inactive: #181825 !important;
  }

  #permissions-granted-icon {
    color: #181825 !important;
  }

  .sidebar-placesTree {
    background-color: #1e1e2e !important;
  }

  #zen-workspaces-button {
    background-color: #1e1e2e !important;
  }

  #TabsToolbar {
    background-color: #181825 !important;
  }

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

  .content-shortcuts {
    background-color: #1e1e2e !important;
    border-color: #94e2d5 !important;
  }

  .urlbarView-url {
    color: #94e2d5 !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #11111b !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #313244 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #11111b;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #89b4fa !important;
    --identity-icon-color: #89b4fa !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #94e2d5 !important;
    --identity-icon-color: #94e2d5 !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6e3a1 !important;
    --identity-icon-color: #a6e3a1 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #f9e2af !important;
    --identity-icon-color: #f9e2af !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fab387 !important;
    --identity-icon-color: #fab387 !important;
  }

  .identity-color-red {
    --identity-tab-color: #f38ba8 !important;
    --identity-icon-color: #f38ba8 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5c2e7 !important;
    --identity-icon-color: #f5c2e7 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #cba6f7 !important;
    --identity-icon-color: #cba6f7 !important;
  }

  hbox#titlebar {
    background-color: #181825 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #181825 !important;
  }
}


================================================
FILE: themes/Mocha/Teal/userContent.css
================================================
/* Catppuccin Mocha Teal userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cdd6f4 !important;
      --color-accent-primary: #94e2d5 !important;
      --color-accent-primary-hover: rgb(169, 231, 221) !important;
      --color-accent-primary-active: rgb(148, 219, 226) !important;
      background-color: #1e1e2e !important;
      --in-content-page-background: #1e1e2e !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #94e2d5 !important;
    }

    .icon {
      color: #94e2d5 !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-mocha.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Mocha/Teal/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: #94e2d5 !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #181825 !important;
      --in-content-text-color: #cdd6f4 !important;
      --link-color: #94e2d5 !important;
      --link-color-hover: rgb(169, 231, 221) !important;
      --zen-colors-primary: #313244 !important;
      --in-content-box-background: #313244 !important;
      --zen-primary-color: #94e2d5 !important;
    }

    groupbox , moz-card{
      background: #1e1e2e !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #181825 !important;
      --background-color-box: #1e1e2e !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #1e1e2e !important;
      --social-color: #cba6f7 !important;
      --coockie-color: #89dceb !important;
      --fingerprinter-color: #f9e2af !important;
      --cryptominer-color: #b4befe !important;
      --tracker-color: #a6e3a1 !important;
      --in-content-primary-button-background-hover: rgb(81, 83, 105) !important;
      --in-content-primary-button-text-color-hover: #cdd6f4 !important;
      --in-content-primary-button-background: #45475a !important;
      --in-content-primary-button-text-color: #cdd6f4 !important;
    }


    .card {
      background-color: #313244 !important;
    }
  }
}


================================================
FILE: themes/Mocha/Yellow/userChrome.css
================================================
/* Catppuccin Mocha Yellow userChrome.css*/

@media (prefers-color-scheme: dark) {
  :root {
    --zen-colors-primary: #313244 !important;
    --zen-primary-color: #f9e2af !important;
    --zen-colors-secondary: #313244 !important;
    --zen-colors-tertiary: #181825 !important;
    --zen-colors-border: #f9e2af !important;
    --toolbarbutton-icon-fill: #f9e2af !important;
    --lwt-text-color: #cdd6f4 !important;
    --toolbar-field-color: #cdd6f4 !important;
    --tab-selected-textcolor: rgb(227, 220, 210) !important;
    --toolbar-field-focus-color: #cdd6f4 !important;
    --toolbar-color: #cdd6f4 !important;
    --newtab-text-primary-color: #cdd6f4 !important;
    --arrowpanel-color: #cdd6f4 !important;
    --arrowpanel-background: #1e1e2e !important;
    --sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-text-color: #cdd6f4 !important;
    --lwt-sidebar-background-color: #11111b !important;
    --toolbar-bgcolor: #313244 !important;
    --newtab-background-color: #1e1e2e !important;
    --zen-themed-toolbar-bg: #181825 !important;
    --zen-main-browser-background: #181825 !important;
    --toolbox-bgcolor-inactive: #181825 !important;
  }

  #permissions-granted-icon {
    color: #181825 !important;
  }

  .sidebar-placesTree {
    background-color: #1e1e2e !important;
  }

  #zen-workspaces-button {
    background-color: #1e1e2e !important;
  }

  #TabsToolbar {
    background-color: #181825 !important;
  }

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

  .content-shortcuts {
    background-color: #1e1e2e !important;
    border-color: #f9e2af !important;
  }

  .urlbarView-url {
    color: #f9e2af !important;
  }

  #zenEditBookmarkPanelFaviconContainer {
    background: #11111b !important;
  }

  #zen-media-controls-toolbar {
    & #zen-media-progress-bar {
      &::-moz-range-track {
        background: #313244 !important;
      }
    }
  }

  toolbar .toolbarbutton-1 {
    &:not([disabled]) {
      &:is([open], [checked])
        > :is(
          .toolbarbutton-icon,
          .toolbarbutton-text,
          .toolbarbutton-badge-stack
        ) {
        fill: #11111b;
      }
    }
  }

  .identity-color-blue {
    --identity-tab-color: #89b4fa !important;
    --identity-icon-color: #89b4fa !important;
  }

  .identity-color-turquoise {
    --identity-tab-color: #94e2d5 !important;
    --identity-icon-color: #94e2d5 !important;
  }

  .identity-color-green {
    --identity-tab-color: #a6e3a1 !important;
    --identity-icon-color: #a6e3a1 !important;
  }

  .identity-color-yellow {
    --identity-tab-color: #f9e2af !important;
    --identity-icon-color: #f9e2af !important;
  }

  .identity-color-orange {
    --identity-tab-color: #fab387 !important;
    --identity-icon-color: #fab387 !important;
  }

  .identity-color-red {
    --identity-tab-color: #f38ba8 !important;
    --identity-icon-color: #f38ba8 !important;
  }

  .identity-color-pink {
    --identity-tab-color: #f5c2e7 !important;
    --identity-icon-color: #f5c2e7 !important;
  }

  .identity-color-purple {
    --identity-tab-color: #cba6f7 !important;
    --identity-icon-color: #cba6f7 !important;
  }

  hbox#titlebar {
    background-color: #181825 !important;
  }

  #zen-appcontent-navbar-container {
    background-color: #181825 !important;
  }
}


================================================
FILE: themes/Mocha/Yellow/userContent.css
================================================
/* Catppuccin Mocha Yellow userContent.css*/

@media (prefers-color-scheme: dark) {

  /* Common variables affecting all pages */
  @-moz-document url-prefix("about:") {
    :root {
      --in-content-page-color: #cdd6f4 !important;
      --color-accent-primary: #f9e2af !important;
      --color-accent-primary-hover: rgb(251, 234, 199) !important;
      --color-accent-primary-active: rgb(249, 244, 175) !important;
      background-color: #1e1e2e !important;
      --in-content-page-background: #1e1e2e !important;
    }

  }

  /* Variables and styles specific to about:newtab and about:home */
  @-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;
      --newtab-primary-action-background: #f9e2af !important;
    }

    .icon {
      color: #f9e2af !important;
    }

    .search-wrapper .logo-and-wordmark .logo {
      background: url("zen-logo-mocha.svg"), url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Mocha/Yellow/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: #f9e2af !important;
    }

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

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

  /* Variables and styles specific to about:preferences */
  @-moz-document url-prefix("about:preferences") {
    :root {
      --zen-colors-tertiary: #181825 !important;
      --in-content-text-color: #cdd6f4 !important;
      --link-color: #f9e2af !important;
      --link-color-hover: rgb(251, 234, 199) !important;
      --zen-colors-primary: #313244 !important;
      --in-content-box-background: #313244 !important;
      --zen-primary-color: #f9e2af !important;
    }

    groupbox , moz-card{
      background: #1e1e2e !important;
    }

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

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

    .identity-color-blue {
      --identity-tab-color: #8aadf4 !important;
      --identity-icon-color: #8aadf4 !important;
    }

    .identity-color-turquoise {
      --identity-tab-color: #8bd5ca !important;
      --identity-icon-color: #8bd5ca !important;
    }

    .identity-color-green {
      --identity-tab-color: #a6da95 !important;
      --identity-icon-color: #a6da95 !important;
    }

    .identity-color-yellow {
      --identity-tab-color: #eed49f !important;
      --identity-icon-color: #eed49f !important;
    }

    .identity-color-orange {
      --identity-tab-color: #f5a97f !important;
      --identity-icon-color: #f5a97f !important;
    }

    .identity-color-red {
      --identity-tab-color: #ed8796 !important;
      --identity-icon-color: #ed8796 !important;
    }

    .identity-color-pink {
      --identity-tab-color: #f5bde6 !important;
      --identity-icon-color: #f5bde6 !important;
    }

    .identity-color-purple {
      --identity-tab-color: #c6a0f6 !important;
      --identity-icon-color: #c6a0f6 !important;
    }
  }

  /* Variables and styles specific to about:addons */
  @-moz-document url-prefix("about:addons") {
    :root {
      --zen-dark-color-mix-base: #181825 !important;
      --background-color-box: #1e1e2e !important;
    }
  }

  /* Variables and styles specific to about:protections */
  @-moz-document url-prefix("about:protections") {
    :root {
      --zen-primary-color: #1e1e2e !important;
      --social-color: #cba6f7 !important;
      --coockie-color: #89dceb !important;
      --fingerprinter-color: #f9e2af !important;
      --cryptominer-color: #b4befe !important;
      --tracker-color: #a6e3a1 !important;
      --in-content-primary-button-background-hover: rgb(81, 83, 105) !important;
      --in-content-primary-button-text-color-hover: #cdd6f4 !important;
      --in-content-primary-button-background: #45475a !important;
      --in-content-primary-button-text-color: #cdd6f4 !important;
    }


    .card {
      background-color: #313244 !important;
    }
  }
}