@global-color: boolean(luma(@main-color) > 50%);
@global-white-color: boolean(luma(@main-color) > 90%);
@main-color-2: darken(@main-color, 20%);
@bg-light: if((@global-white-color),@main-color-2, @main-color);
@text: if((@global-color),#000000, #ffffff);
@black-bg: if((@global-color),#ffffff, #000000);
@white-bg: if((@global-color),#000000, #ffffff);


////////////background-color//////////////
@c-1: if((@global-color),
@bg-light,
@main-color                                                     //121623
);
@c-2: if((@global-color),
darken(saturate(spin(@bg-light, -7.5294), 46.3158), 12.7451),  //1
darken(saturate(spin(@main-color, -7.5294), 46.3158), 12.7451)  // #181c29
);
@c-3: if((@global-color),
lighten(desaturate(spin(@bg-light, 0.0000), 11.5935), 5.8824),  //1
lighten(desaturate(spin(@main-color, 0.0000), 11.5935), 5.8824)  // #212532
);
@c-4: if((@global-color),
lighten(desaturate(spin(@bg-light, -0.8824), 17.2607), 10.7843),  //1
lighten(desaturate(spin(@main-color, -0.8824), 17.2607), 10.7843)  // #2e323e
);
@c-5: if((@global-color),
lighten(desaturate(spin(@bg-light, -3.8824), 18.3768), 18.2353),  //1
lighten(desaturate(spin(@main-color, -3.8824), 18.3768), 18.2353)  // #3f4553
);
@c-6: if((@global-color),
lighten(desaturate(spin(@bg-light, -4.1432), 19.5072), 25.4902),  //1
lighten(desaturate(spin(@main-color, -4.1432), 19.5072), 25.4902)  // #505767
);
@c-7: if((@global-color),
lighten(desaturate(spin(@bg-light, 0.4813), 21.3959), 49.2157),  //1
lighten(desaturate(spin(@main-color, 0.4813), 21.3959), 49.2157)  // #8d92a3
);

@c-1-color: red(@c-1), green(@c-1), blue(@c-1);
@c-2-color: red(@c-2), green(@c-2), blue(@c-2);
@c-3-color: red(@c-3), green(@c-3), blue(@c-3);
@c-4-color: red(@c-4), green(@c-4), blue(@c-4);
@c-5-color: red(@c-5), green(@c-5), blue(@c-5);
@c-6-color: red(@c-6), green(@c-6), blue(@c-6);
@c-7-color: red(@c-7), green(@c-7), blue(@c-7);

//////////text-color/////////
@text-color: red(@text), green(@text), blue(@text);

///////////hero-color/////////////

@hero-bg-color: boolean(luma(@hero-color) > 50%);
@hero-bg-text: if((@hero-bg-color),#000000, #ffffff);

@hero-color-bg: red(@hero-color), green(@hero-color), blue(@hero-color);
@hero-set-color: red(@hero-bg-text), green(@hero-bg-text), blue(@hero-bg-text);


///////////////////static-color///////////
@static-col-green: red(@static-color-green), green(@static-color-green), blue(@static-color-green);
@static-col-red: red(@static-color-red), green(@static-color-red), blue(@static-color-red);
//@static-col-yellow: red(@static-color-yellow), green(@static-color-yellow), blue(@static-color-yellow);


////////////////gfgfgf
@yellow-static-bg: boolean(luma(@static-color-yellow) > 50%);
@hero-bg-text-yellow: if((@yellow-static-bg),#000000, #ffffff);
@static-col-yellow: red(@static-color-yellow), green(@static-color-yellow), blue(@static-color-yellow);
@static-set-color-yellow: red(@hero-bg-text-yellow), green(@hero-bg-text-yellow), blue(@hero-bg-text-yellow);
////////////////gfgfgf


////////////////black, white bg-color
@black-bg-color: red(@black-bg), green(@black-bg), blue(@black-bg);
@white-bg-color: red(@white-bg), green(@white-bg), blue(@white-bg);
@black-bg-revert: contrast(@black-bg, #ffffff, #000000);
@black-bg-revert-rgb: red(@black-bg-revert), green(@black-bg-revert), blue(@black-bg-revert);
@white-bg-revert: contrast(@white-bg, #ffffff, #000000);
@white-bg-revert-rgb: red(@white-bg-revert), green(@white-bg-revert), blue(@white-bg-revert);



@red-reset: contrast(@static-color-red, #ffffff, #000000, 90%);
@red-reset-rgb: red(@red-reset), green(@red-reset), blue(@red-reset);

@green-reset: contrast(@static-color-green, #ffffff, #000000, 90%);
@green-reset-rgb: red(@green-reset), green(@green-reset), blue(@green-reset);

@yellow-reset: contrast(@static-color-yellow, #ffffff, #000000, 90%);
@yellow-reset-rgb: red(@yellow-reset), green(@yellow-reset), blue(@yellow-reset);


@border-radius: 5px;



:root{
  --font-f: 'Roboto', Arial, Helvetica, sans-serif;
  --text-color: @text-color;
  --bg-1: @c-1-color;
  --bg-2: @c-2-color;
  --bg-3: @c-3-color;
  --bg-4: @c-4-color;
  --bg-5: @c-5-color;
  --bg-6: @c-6-color;
  --bg-7: @c-7-color;
  --black-color: @black-bg-color;
  --white-color: @white-bg-color;
  --black-bg-revert: @black-bg-revert-rgb;
  --white-bg-revert: @white-bg-revert-rgb;

  --hero-bg-color: @hero-color-bg;
  --hero-text-color: @hero-set-color;


  --yellow-static-bg: @static-col-yellow;
  --yellow-set-color: @static-set-color-yellow;



  --static-color-green: @static-col-green;
  --static-color-red: @static-col-red;
  --static-color-yellow: @static-col-yellow;



  --br: @border-radius;

  --red-reset: @red-reset-rgb;
  --green-reset: @green-reset-rgb;
  --yellow-reset: @yellow-reset-rgb;

}