@import '../tools/functions/core';
@import 'colors';
@import 'core';
@import 'node_modules/@collabui/icons/scss/variables';

$avatar__class: '#{$prefix}-avatar';

$avatar--inactive__opacity: 0.55;

$avatar__font-size: rem-calc(14);
$avatar__size: rem-calc(40);
$avatar__font-factor: 0.35;
$avatar__line-height-factor: 0.5;

$avatar-sizes: (xsmall, $icon-dnd_8, $icon-pto_8, 18),
  (small, $icon-dnd_14, $icon-pto_14, 28),
  (medium, $icon-dnd_20, $icon-pto_20, 40),
  (large, $icon-dnd_28, $icon-pto_28, 52),
  (xlarge, $icon-dnd_40, $icon-pto_32, 84),
  (18, $icon-dnd_8, $icon-pto_8),
  (24, $icon-dnd_12, $icon-pto_12),
  (28, $icon-dnd_14, $icon-pto_14),
  (36, $icon-dnd_18, $icon-pto_18),
  (40, $icon-dnd_20, $icon-pto_20),
  (44, $icon-dnd_24, $icon-pto_24),
  (52, $icon-dnd_28, $icon-pto_28),
  (56, $icon-dnd_28, $icon-pto_28),
  (72, $icon-dnd_36, $icon-pto_32),
  (80, $icon-dnd_40, $icon-pto_32),
  (84, $icon-dnd_40, $icon-pto_32);

$avatar--active__shadow: inset 0 0 0 rem-calc(1) $green-base,
  inset 0 0 0 rem-calc(2) $white-24;
$avatar--active__shadow--dark: inset 0 0 0 rem-calc(1) $green-base,
  inset 0 0 0 rem-calc(2) $black-24;

$avatar-letter__color: $black-80;
$avatar-letter__background: $gray-5-88;

$avatar-icon__color: $black-80;
$avatar-icon__background: $gray-5-88;

$avatar-self__color: $blue-base;
$avatar-self__background: $white;
$avatar-self__border: 1px solid $black-08;

$avatar-img__background: $gray-5-88;

$avatar-badge__spacing: .125em;

$avatar-failure-badge__size: 1.25em;
$avatar-failure-badge__font-size: 0.571em;
$avatar-failure-badge__color: $red-base;
$avatar-failure-badge__background: $red-pastel;
$avatar-failure-badge__border: 0.125em solid $red-base;

$avatar-notification-badge__size: .66em;
$avatar-notification-badge__color: $blue-base;

$avatar-bot__border-radius: 0.571em;
$avatar-bot__font-size: 0.571em;
$avatar-bot__line-height: 1.25em;
$avatar-bot__padding: 0.25em 0.75em;
$avatar-bot__background: $gray-2;
$avatar-bot__color: $white;