@import "/UI/Styles/Theme.scss";
BodyInfo {
	position: absolute;
	align-items: center;
	justify-content: center;

	.BodyInfoBox {
		margin-top: 128px;
		overflow: hidden;
		flex-direction: column;
		background-color: $widget-color-dark;
		backdrop-filter: $widget-backdrop-filter;
		transition: min-width 0.275s;
		min-width: 100px;
		overflow: hidden;

		.Content {
			flex-direction: column;
		}

		&.Expanded {
			transition: min-width 0.275s;
			min-width: 500px;
		}

		.Name {
			transition: background-color 0.275s;
			align-items: center;
			padding: 8px;
			height: 48px;
			background-color: $widget-color;
			width: 100%;
		}

		.Info {
			overflow: hidden;
			flex-wrap: nowrap;
			white-space: nowrap;
			flex-wrap: nowrap;
			white-space: nowrap;
			text-overflow: clip;
			word-break: break-all;
			transition: all 0.275s;
			padding: 8px;
			max-height: 500px;
			max-width: 500px;

			&:intro {
				max-height: 0px;
				max-width: 0px;
			}

			&:outro {
				max-height: 0px;
				max-width: 0px;
			}
		}
	}
}