/*-------------------
Colors
--------------------*/

@import '@eeacms/volto-design-tokens/src/colors';
@import '@eeacms/volto-design-tokens/src/eea-colors';

// Blue Colors
@darkTeal: #008080;
@marineBlue: #009590;
@brightBlue: #3a56e4;
@darkBrightBlue: #004b87;

@lightGradientBlue: #2da0fa;
@midGradientBlue: #2f7cf4;
@darkGradientBlue: #3158ee;

@lightGradientBlueHover: #3cabff;
@midGradientBlueHover: #3d84f7;
@darkGradientBlueHover: #4063f0;

// Gray Colors
@lightWhite: #f8f8f8;
@mediumLightWhite: #f0f0f0;
@mediumWhite: #efefef;
@mediumDarkWhite: #ebebeb;
@blueWhite: #edf0fd;
@greyWhite: #ddd;
@pinkWhite: #ffe5ea;
@dimmedWhite: rgba(255, 255, 255, 0.5);
@darkDimmedWhite: #ffffff81;

@whiteGray: #dcdcdc;
@darkWhiteGray: #d9d9d9;
@lighterGray: #eee;
@mediumGray: #d3d3d3;
@mediumDarkGray: #cfcfcf;
@mediumDarkerGray: #bdbdbd;
@midDarkGray: #c4c4c4;
@midDarkerGray: #bfbfbf;
@midLighterGray: #888888;

@blueGray: #8b9bad;
@darkBlueGray: #69747d;
@darkGray: #4f4f4f;
@darkerGray: #444;

@dimmedDarkBlueGray: rgba(130, 150, 166, 0.72);
@dimmedGray: rgba(249, 249, 249, 0.4);
@dimmedDarkGray: rgba(59, 69, 79, 0.3);

@s-light-gray: #edf1f2;
@s-medium-gray: #e0e1e2;
@s-medium-gray2: #545454;
@sf-light-gray: #f2f2f2;
@sf-light-gray2: #e0e1e2;
@sf-medium-gray: #cccccc;
@sf-medium-gray2: #808080;
@sf-dark-gray: #303030;

@lighterBlack: #434343;
@dimmedBlueBlack: rgba(59, 69, 79, 0.05);
@dimmedDarkBlueBlack: rgba(34, 36, 38, 0.1);
@dimmedLighterBlack: rgba(0, 0, 0, 0.05);
@dimmedLightBlack: rgba(0, 0, 0, 0.25);
@dimmedBlack: rgba(0, 0, 0, 0.3);
@midDimmedBlack: rgba(0, 0, 0, 0.4);
@s-medium-dimmed-gray: rgba(0, 0, 0, 0.67);
@s-dark-gray: rgba(0, 0, 0, 0.87);
@darkDimmedBlack: #000000ee;

// Yellow Colors
@s-light-orange: #ffdfbb;
@brightYellow: #ffb821;
@s-dark-orange: #9c5a0a;

/* Global focus-visible for accessibility */
@focusVisibleOutline: 0.2rem auto var(--focus-visible, @blue-3);

/*-------------------
Base Sizes
--------------------*/

@search-result-max-width: 1000px;

.elipsisOverflow(@lines) {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: @lines;
  text-overflow: ellipsis;
}