@use 'sass:selector';
@use 'sass:map';

@import url('https://discordstyles.github.io/RadialStatus/RadialStatus.css');

:root {
	--rs-small-spacing: 2px; /* Spacing between profile image and outer ring on small icons (e.g. member list) | Default: 2px */
	--rs-medium-spacing: 4px; /* Spacing between profile image and outer ring on medium icons (e.g. user popout) | Default: 4px */
	--rs-large-spacing: 4px; /* Spacing between profile image and outer ring on medium icons (e.g. user popout fullscreen) | Default: 4px */

	--rs-small-width: 1.5px; /* Ring width (follows same sizing as above) | Default: 1.5px */
	--rs-medium-width: 2px; /* Default: 2px */
	--rs-large-width: 2px; /* Default: 2px */

	--rs-avatar-shape: var(--avatar-roundness, 50%); /* Border-radius for profile image | Default: 50% */

	/* Customizable colors */
	--rs-online-color: #43b581; /* Default: #43b581 */
	--rs-idle-color: #faa61a; /* Default: #faa61a */
	--rs-dnd-color: #f04747; /* Default: #f04747 */
	--rs-offline-color: #636b75; /* Default: #636b75 */
	--rs-streaming-color: #643da7; /* Default: #643da7 */
	--rs-invisible-color: #747f8d; /* Default: #747f8d */
	--rs-phone-color: var(--rs-online-color); /* Color of the phone for mobile users | Default: var(--rs-online-color) */

	--rs-phone-visible: block; /* Visibility of the phone for mobile users | Default: block */
}

// Currently supported by the following languages:
// Danish
// German
// English (US, UK)
// Spanish
// French
// Croatian

$statusMap: (
	'online': (
		'Online',
		'online',
		// German
		'Conectado',
		// Spanish
		'En línea con móvil',
		// Spanish
		'En ligne',
		// French
		'Na mreži',
		// Croatian
	),
	'idle': (
		'Idle',
		'Inaktiv',
		// Danish
		'Abwesend',
		// German
		'Ausente',
		// Spanish
		'Inactif',
		// French
		'U mirovanju',
		// Croatian
	),
	'dnd': (
		'Do Not disturb',
		'Vil ikke forstyrres',
		// Danish
		'Bitte nicht stören',
		// German
		'No molestar',
		// Spanish
		'Ne pas déranger',
		// French
		'Ne uznemiravaj',
		// Croatian
	),
	'streaming': (
		'Streaming',
		'Streamer',
		// Danish
		'Streamt',
		// German
		'Transmitiendo',
		// Spanish
		'En direct',
		// French
	),
	'invisible': (
		'Invisible',
		'Usynlig',
		// Danish
		'Unsichtbar',
		// German
		'Nevidljiv/a',
		// Croatian
	),
	'offline': (
		'Offline',
		'Desconectado',
		// Spanish
		'Hors ligne',
		// French
		'Izvan mreže',
		// Croatian
	)
);

@each $statusType, $statusList in $statusMap {
	$parsedItem: null;
	@each $status in $statusList {
		$parsedItem: $parsedItem + '[aria-label*="' + $status + '" i]';
	}
	#{selector.append('.wrapper__44b0c', selector.simple-selectors($parsedItem))},
	#{selector.append('.avatarWrapper', '[data-status="#{$statusType}"]')} .wrapper__44b0c {
		box-shadow: 0 0 calc(var(--glow-intensity) * 10px) var(--rs-#{$statusType}-color);
	}
}

// StatusEverywhere by Strencher
#app-mount {
	.wrapper__44b0c.StatusEverywhere-avatar-chatAvatar {
		margin: 0;
	}
	.avatarWrapper {
		border-radius: var(--rs-avatar-shape);
		.pointerEvents-9SZWKj {
			stroke: var(--status-color) !important;
			&[width='30'] {
				width: calc(100% - 9px) !important;
			}
		}
	}
}
