:root {
  --color-white: #fefefe;
  
  --color-black: #090909;
  --color-black-light: #141414;
  --color-black-grey: #444;
  --color-dark-lines: #262626;

  --color-grey-mid: #d2d2db;
  --color-grey-light: #f9f9fb;
  --color-grey-bar: #f3f3f6;
  --color-grey: #717180;

  --color-blue: #0080FF;
  --color-blue-light: #5badff;

  --color-green-dark: #116e00;
  --color-green-lite: #cef2cd;

  --color-orange-dark: #ec9100;
  --color-orange-lite: #fdf4e2;

  --color-blue-dark: #0089c9;
  --color-blue-lite: #e0f3fe;

  --color-purple-dark: #7960cb;
  --color-purple-lite: #e5e6fa;

  --color-brown: #9D4923;

  --color-bordered: #e5e5eb;
  --color-bg-picto: #F6F6F6;

  --body-wrapper-width: 636px;
  --email-wrapper-padding: 50px 20px;
  --inner-p: 40px;
  --inner-block-p: 24px;
  --inner-block-p-s: 16px;

  --logo-width: 100px;
  --logo-width-sm: 80px;

  --border-radius-xl: 40px;
  --border-radius-l: 16px;
  --border-radius-m: 12px;
  --border-radius-s: 8px;
  --border-radius-xs: 7px;

  --separator-line-height: 30px;
  --separator-sm-line-height: 20px;
  --separator-line-height-mob: 10px;

  --fl-pb: 20px;
  --fl-pb-xl: 30px;

  --cta-p: 8px 16px;
  --cta-fs: 16px;
  --cta-line-height: 24px;

  --font-family: Helvetica, Arial, sans-serif;
  --font-line-height: 22px;
  --font-line-height-sm: 20px;
  --fs-text: 16px;
  --fs-text-sm: 14px;
  --fs-text-xs: 12px;

  --fs-h1: 50px;
  --fs-h1-line-height: 46px;
  --fs-h1-mob: 34px;
  --fs-h1-line-height-mob: 34px;
  --fs-h2: 24px;
  --fs-h2-line-height: 32px;
  --fs-h3: 20px;
  --fs-h4: 16px;

  --width-center-l: 420px;
  --width-center-m: 320px;
}

*:not(.cta *){
  transition: all .4s ease;
}

.dark-theme body,
.dark-theme .body-wrapper,
.dark-theme .email-wrapper,
.dark-theme .inner-block {
  background-color: var(--color-black-light) !important;
}
.dark-theme .text:not(.txt-keep-color),
.dark-theme .text-sm,
.dark-theme .text div {
  color: var(--color-grey-mid) !important;
}
.dark-theme .text.txt-black,
.dark-theme .txt-wh,
.dark-theme .text.title,
.dark-theme .text.title div {
  color: var(--color-grey-light) !important;
}
.dark-theme .hide-dm {
  display: none !important;
}
.dark-theme .show-dm {
  display: block !important;
  height: auto !important;
  width: auto !important;
  overflow: visible !important;
}
.dark-theme .inner {
  background-color: var(--color-black) !important;
}
.dark-theme .dark-bg-none {
  background: none !important;
}
.dark-theme .dark-bg {
  background: var(--color-black-light) !important;
}
.dark-theme .dark-bg-med {
  background: var(--color-dark-lines) !important;
}
.dark-theme .dark-bg-black {
  background: var(--color-black) !important;
}
.dark-theme .dark-border {
  border-color: var(--color-dark-lines) !important;
}
.dark-theme .bordered {
  border: 1px solid var(--color-dark-lines) !important;
}
.dark-theme .separator:not(.keep-color) tr:first-child td {
  border-bottom: 1px solid var(--color-dark-lines) !important;
}
.dark-theme .cta td {
  background-color: var(--color-white) !important;
}
.dark-theme .cta td.blue {
  background-color: var(--color-blue-light) !important;
}
.dark-theme .cta td a {
  color: var(--color-black) !important;
}