:root {
  --white: #ffffff;
  --black: #1e1e1e;
  --black-80: rgba(30, 30, 30, 0.8);
  --black-70: rgba(30, 30, 30, 0.7);
  --black-50: rgba(30, 30, 30, 0.5);
  --black-40: rgba(30, 30, 30, 0.4);
  --black-30: rgba(30, 30, 30, 0.3);
  --grey: #e7e7e7;
  --grey-light: #f5f5f5;
  --grey-dark: #cfcfcf;
  --red-main-color: #e31e24;
  --red-dark: #c1060b;
  --yellow-sale: #efff64;
  --orange: #ff9500;
  --green: #2ab34d;
  --green-light: #c9ffc0;
  --blue: #1c49eb;

  --overdraft: #ac222a;
  --overdue-debt: #ff7c84;
  --non-overdue-debt: #ffeb38;
  --zakazano-debt: #d5eb38;
  --remaining-credit: #68d975;
  --overpayment: #6284ff;

  --container-space: 42px;

  --space-60: 60px;
  --space-40: 40px;
  --space-35: 35px;
  --space-30: 30px;
  --space-25: 25px;
  --space-20: 20px;
  --space-15: 15px;
  --space-12: 12px;
  --space-10: 10px;
  --space-8: 8px;
  --space-5: 5px;
  --space-4: 4px;

  --space-80-m60: 80px;
  --space-60-m30: 60px;
  --space-40-m30: 40px;
  --space-30-m20: 30px;
  --space-8-m4: 8px;

  --fs-h1: 44px;
  --fs-h2: 34px;
  --fs-h3: 26px;
  --fs-h4: 22px;
  --fs-18: 18px;
  --fs-16: 16px;
  --fs-14: 14px;
  --fs-12: 12px;
  --fs-10: 10px;

  --lh-main: 1.6;
  --lh-sm: 1.2;

  --popup-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  --popup-shadow-top: 0 -4px 10px rgba(0, 0, 0, 0.1);

  --header-top-height: 37px;
  --header-main-height: 80px;
  --header-bottom-height: 34px;
  --header-height: 151px;
  --checkout-header-height: 90px;

  --search-height: 50px;
  --fancybox-zIndex: 5000;

  --mobile-bottom-space: 20px;

  --td-light: var(--white);
  --td-widget-background: var(--white);
  --td-font-color: var(--black);
  --td-timepicker-font-size: 14px;
  --td-active-bg: var(--white);
  --td-range-bg: #ffd5d8;
  --td-active-color: var(--black);
  --td-active-border-color: var(--red-main-color);
  --td-border-radius: 5px;
  --td-btn-hover-bg: var(--grey);
  --td-disabled-color: var(--black-50);
  --td-alternate-color: var(--black-50);
  --td-secondary-border-color: transparent;
  --td-secondary-border-color-rgba: transparent;
  --td-primary-border-color: transparent;
  --td-text-shadow: none;
  --td-dow-color: var(--red-main-color);
}

@media (max-width: 1399.98px) {
  :root {
    --space-60-m30: 40px;
  }
}

@media (max-width: 991.98px) {
  :root {
    --container-space: 17px;

    --space-80-m60: 60px;
    --space-60-m30: 30px;
    --space-40-m30: 30px;
    --space-30-m20: 20px;
    --space-8-m4: 4px;

    --fs-h1: 30px;
    --fs-h2: 26px;
    --fs-h3: 22px;
    --fs-h4: 20px;

    --lh-main: 1.4;
  }
}

@media (max-width: 767.98px) {
  :root {
    --container-space: 10px;
    --header-main-height: 55px;
    --header-height: 55px;
    --control-height: 82px;
  }
}