:root {
  --width-main-container: 117rem;
  --width-block-chat: 80rem;
  --pad-lr-window: 1.5rem;
  --padding-input-chat: 2.5rem;
  --font-size-def: 1.5rem;
  --font-size-small: 1.25rem;
  --font-size-btn-language: 1.5rem;
  --height-input-chat: 8.7rem;
  --height-input: 3.2rem;
  --height-btn-pagination: 3.4rem;
  --height-btn: 3.4rem;
  --height-btn-round: 3.6rem;
  --height-header-bar: 7rem;
  --height-nav-bar: 5.2rem;
  --additive-btn-message: 0.5rem;
  --border-radius-xs: 0.2rem;
  --border-radius-s: 0.4rem;
  --border-radius-m: 1rem;
  --border-radius-l: 1.4rem;
  --border-radius-xl: 2.8rem;
  --placeholder-text: "Запитати щось...";
  --menu-datalist-li: 3.3rem;
  
  /* цвета базовые */
  --color-white: white;
  
  --color-transparent: rgba(0, 0, 0, 0);
    
  --color-black-200: #646464;
  --color-black-250: #595959;
  --color-black-300: #545454;
  --color-black-350: #494949;
  --color-black-400: #444444;
  --color-black-450: #393939;
  --color-black-500: #343434;
  --color-black-550: #292929;
  --color-black-600: #242424;
  --color-black-650: #191919;
  --color-black-700: #141414;
  --color-black-725: #101010;
  --color-black-750: #040404;
  --color-black-800: black;
  
  --color-gray-100: #fafafa;
  --color-gray-200: #f5f5f5;
  --color-gray-250: #F3F3F3;
  --color-gray-300: #f0f0f0;
  --color-gray-350: #EBEBEB;
  --color-gray-400: #e5e5e5;
  --color-gray-500: #ddd;
  --color-gray-600: #cccccc;
  --color-gray-700: #afafaf;
  --color-gray-800: #828282;
  
  --color-blue-200: #e5f3ff;
  --color-blue-300: #cee7ff;
  --color-blue-350: #a7cff6;
  --color-blue-400: #4285F4;
  --color-blue-500: #3174e3;
  
  --color-gray-blue-300: #879ba5;
  --color-gray-blue-400: #7998a7;
  --color-gray-blue-500: #55798b;
  --color-gray-blue-600: #304e61;
  --color-gray-blue-700: #213645;
  
  --color-green-200: #e8f6e7;
  --color-green-300: #d4f4d2;
  --color-green-350: #80db80;
  --color-green-400: #5cb85c;
  --color-green-500: #47a047;
  
  --color-yellow-200: #fff3b0; 
  --color-yellow-300: #ffe780;
  --color-yellow-350: #ffdf56;
  --color-yellow-400: #ffd73c;
  --color-yellow-500: #ffc90a;
  
  --color-brown-300: #e2dedb;
    
  --color-red-50: #f2eaea;
  --color-red-100: #f5e1e1;
  --color-red-300: #ff6f6f;
  --color-red-350: #ee4f3c;
  --color-red-400: #E84430;
  --color-red-500: #e10600; 
  --color-red-600: #cc0000;

  --color-slate-200: #ebeef6; 
  --color-slate-300: #a4b5d1; 
  --color-slate-400: #a4b5d1; 
  
  /* элементы*/
  --text-color: var(--color-black-400);
  --body-color: var(--color-gray-200);
    
  --abstract-max-shape-1-color: linear-gradient(to bottom, var(--color-gray-350), var(--color-gray-200));
  --abstract-max-shape-2-color: linear-gradient(to left, var(--color-gray-350), var(--color-gray-250));
  --abstract-mini-shape-1-color: var(--color-red-400); 
  --abstract-mini-shape-2-color: var(--color-gray-700);

  --content-bg-color: var(--color-white);
  --scrollbar-bg-color: var(--color-gray-600);
    
  --btn-text-white-color: var(--color-white);
  --btn-text-black-color: var(--color-black-400);
  
  --btn-default-text-color: var(--color-black-400);
  --btn-default-bg-color: var(--color-gray-300);
  --btn-default-hov-bg-color: var(--color-gray-400);
  
  --btn-success-text-color: var(--color-gray-100);
  --btn-success-bg-color: var(--color-black-500);
  --btn-success-hov-bg-color: var(--color-black-800);
  --btn-success-hov-text-color: var(--color-gray-500);
  --btn-success-act-bg-color: var(--color-black-300);
  
  --btn-warning-text-color: var(--color-white);
  --btn-warning-bg-color: var(--color-red-500);
  --btn-warning-hov-bg-color: var(--color-red-600);
  --btn-warning-act-bg-color: var(--color-red-600);
  
  --btn-primary-text-color: var(--color-white);
   
  --btn-chat-default-color: var(--text-color);
  
  --btn-hov-bg-color: var(--color-gray-300);
  --btn-input-hov-bg-color: var(--color-gray-400);
  
  --btn-scroll-bg-color: var(--content-bg-color);
  --btn-scroll-hov-color: var(--btn-hov-bg-color);
  --btn-scroll-color: var(--btn-default-text-color);
  
  --btn-note-color: var(--color-gray-600);
  --btn-note-hov-color: var(--color-red-500);
  
  --input-bg-color: var(--color-gray-200);
  --input-bg-foc-color: var(--color-gray-300);
  --input-border-color: var(--color-gray-600);
  --input-disabled-bg-color: var(--color-gray-300);
  
  --radio-line-color: var(--color-gray-400);
  --radio-line-sel-color: var(--color-red-500); /* --color-black-500 */
  
  --hr-color: var(--color-gray-400);  /* разделитель в заголовке страницы */
  --h-color: var(--text-color); /* текст заголовков h1... */
  
  --modal-bg-color: var(--content-bg-color);
  --bg-modal-color: black; /* подложка модальных окон */
  --modal-opacity: 0.2; /* подложка модальных окон */
  --modal-shadow-color: rgba(120, 120, 120, 0.3); /* тень модальных окон */
  
  --mini-alert-bg-color: var(--color-black-500);
  --mini-alert-text-color: var(--color-gray-100);
  --mini-alert-icon-color: var(--color-red-400);
  
  --menu-datalist-shadow-color: rgba(140, 140, 140, 0.3); /* rgba(140, 140, 140, 0.3) rgba(225, 6, 0, 0.15)  */
  --menu-datalist-hov-bg-color: var(--color-gray-200); 
  --menu-datalist-bg-color: var(--content-bg-color);
  --menu-datalist-sel-bg-color: var(--btn-warning-bg-color); /* --color-black-500 */
  --menu-datalist-sel-text-color: var(--btn-warning-text-color); /* --color-gray-100 */
  --menu-datalist-sel-light-bg-color: var(--color-blue-200);
  --menu-datalist-sel-light-text-color: var(--color-black-400);
  --menu-datalist-icon-color: var(--color-red-500);
 
  --table-border-color: var(--color-gray-400);
  --table-header-bg-color: var(--color-gray-200);
  --table-tr-dark-bg-color: var(--color-gray-100);
  --table-tr-hov-bg-color: var(--color-blue-200);
  
  --checkbox-table-border-color: var(--color-gray-400);
  --checkbox-table-sel-bg-color: var(--color-black-400);
  --checkbox-table-sel-color: var(--color-white);
  --checkbox-oval-bg-color: var(--color-gray-400);
  --checkbox-oval-sel-bg-color: var(--color-black-500);
  --checkbox-oval-round-color: var(--color-white); 
  
  --message-user-bg-color: var(--color-black-500);
  --message-user-text-color: var(--color-gray-100);
  --message-user-edit-bg-color: var(--color-black-400);
  --message-user-edit-text-color: white;
  --message-mark-strict-color: var(--color-yellow-350);
  --message-mark-flexible-color: var(--color-yellow-350);
  --message-process-indic-bg: linear-gradient(-60deg,
    var(--color-black-500) 0%, var(--color-black-500) calc(50% - 7rem),
    var(--color-black-300) 50%,
    var(--color-black-500) calc(50% + 7rem), var(--color-black-500) 100%);   
   
  --voice-bar-color: var(--color-black-300);
  
  --service-text-color: var(--color-gray-700);
  
  --img-infographic-bg-color: transparent;
  --img-border-color: var(--content-bg-color);
  
  --icon-header-color: var(--color-red-500);

  --seam-cool-color: var(--color-black-500);
  --seam-bg-color: var(--color-gray-200);
}