@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Inter'), url(./Inter.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: local('Inter'), url(./Inter.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: local('Inter'), url(./Inter.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}
[data-theme='light'],
:root {
  --zapier-brand: #3d4592;
  --zapier-brand-120: #2c3266;
  --zapier-text: #000;
  --zapier-text-80: #222;
  --zapier-text-60: rgb(0 0 0 / 56%);
  --zapier-bg-5: rgb(255 255 255 / 30%);
  --zapier-bg-5b: rgb(0 0 0 / 3%);
  --zapier-bg-0: rgb(255 255 255 / 60%);
  --zapier-icon-bg: #fff;
  --zapier-icon-color: rgb(0 0 0 / 40%);
  --zapier-icon-border-color: rgb(0 0 0 / 10%);
  --zapier-service-icon-border-color: rgb(0 0 0 / 10%);
  --zapier-input-border-color: rgb(0 0 0 / 50%);
  --zapier-border-color: rgb(0 0 0 / 30%);
  --zapier-badge-background: #3d4592;
  --zapier-badge-text: #fff;
  --zapier-modal-background-color: #fff;
  --zapier-modal-border-color: rgb(0 0 0 / 60%);
  --zapier-zap-state-off-bg: #403f3e;
  --zapier-zap-state-off-text: #fff;
  --zapier-zap-state-on-bg: #0f884e;
  --zapier-zap-state-on-text: #fff;
  --zapier-avatar-bg: #1a4a4c;
  --zapier-avatar-text: #fff;
  --zapier-button-text: #fff;
  --zapier-button-bg: #222;
  --zapier-button-bg-hover: #333;
  --zapier-logo-underline: #ff4f00;
  --zapier-logo-text: #201515;
  --zapier-guesser-gradient: linear-gradient(
    140deg,
    #ffbf6e 3.67%,
    #fea048 27.76%,
    #ff7f24 39.81%,
    #ff4f00 50%,
    #ff5789 60.19%,
    #f589dc 72.24%,
    #c1b7ff 96.33%
  );
  --zapier-elevation-5: 0 5px 10px 0 rgb(0 0 0 / 10%);
  --zapier-elevation-6: 0 5px 10px 0 rgb(0 0 0 / 20%);
  --zapier-elevation-30: 0 10px 20px 0 rgb(0 0 0 / 30%);
  --zapier-elevation-zap: 0 8px 8px -8px rgb(0 0 0 / 20%);
  --zapier-grid-unit: 10px;
  --zapier-button-input-border-radius: 3px;
  --zapier-font-family: 'Inter', system-ui, sans-serif;
  --zapier-font-size-26px: 26px;
  --zapier-font-size-20px: 20px;
  --zapier-font-size-18px: 18px;
  --zapier-font-size-16px: 16px;
  --zapier-font-size-14px: 14px;
  --zapier-font-size-12px: 12px;
}

[data-theme='dark'] {
  --zapier-brand: #90a1ed;
  --zapier-brand-120: #f0f1fa;
  --zapier-text: #fff;
  --zapier-text-80: rgb(255 255 255 / 80%);
  --zapier-text-60: rgb(255 255 255 / 50%);
  --zapier-bg-5: rgb(255 255 255 / 10%);
  --zapier-bg-5b: rgb(255 255 255 / 3%);
  --zapier-bg-0: rgb(255 255 255 / 10%);
  --zapier-icon-color: rgb(255 255 255 / 70%);
  --zapier-icon-border-color: rgb(0 0 0 / 20%);
  --zapier-border-color: rgb(255 255 255 / 40%);
  --zapier-input-border-color: rgb(255 255 255 / 40%);
  --zapier-service-icon-border-color: rgb(0 0 0 / 20%);
  --zapier-button-text: #000;
  --zapier-button-bg: #fff;
  --zapier-button-bg-hover: #eee;
  --zapier-badge-background: #90a1ed;
  --zapier-badge-text: #000;
  --zapier-modal-background-color: #222;
  --zapier-modal-border-color: rgb(0 0 0 / 60%);
  --zapier-logo-text: #fffdf9;
  --zapier-elevation-5: 0 5px 10px 0 rgb(0 0 0 / 60%);
  --zapier-elevation-30: 0 10px 10px -10px rgb(0 0 0 / 80%);
}