// =================================================================
// Profile Single Settings
// =================================================================

// Single Profile Information Label Color
//
// Controls the color used for labels in the single profile
// listing template sidebar.
//
// Styleguide Profiles.Single Profile.Information Label Color
//
// Access: Public
//
// Since: 1.0.0
//
// Accessibility: AA

$color-profile-info-label:					$color-grayscale-6 !default;

// Single Profile Information Item Color
//
// Controls the color used for information items in the single profile
// listing template sidebar.
//
// Styleguide Profiles.Single Profile.Information Item Color
//
// Access: Public
//
// Since: 1.0.0
//
// Accessibility: AA

$color-profile-info-item:					$color-grayscale-5 !default;

// =================================================================
// Profile Single Styles
// =================================================================

// Styles the single profile name - typically the title of the page.
//
// Styleguide Components.Profile Item.profile-single-name
//
// Access: Public
//
// Since: 2.0.0

:where(.single-profile) .page-title,
.profile-single-name {
	margin-bottom: 0;
	text-align: center;
}

// Styles the single profile title - typically the subtitle of the page.
//
// Styleguide Components.Profile Item.profile-single-title
//
// Access: Public
//
// Since: 2.0.0

.profile-single-title {
	text-align: center;
}

// Styles the single profile photo.
//
// Styleguide Components.Profile Item.profile-single-photo
//
// Access: Public
//
// Since: 2.0.0

.profile-single-photo {
	height: 300px;
	margin: 0 auto var(--margin, #{$margin});
	width: 300px;
}

// Styles the single profile details sidebar.
//
// Styleguide Components.Profile Item.profile-single-details
//
// Access: Public
//
// Since: 2.0.0

.profile-single-details {
	@extend %card-styles;
	margin: 0 0 $margin;

	@include breakpoint( $sm ) {
		float: right;
		margin: 0 0 20px 20px;
		width: 33.33333333333333%;
	}
}

// General styles for labels.
//
// Styleguide Components.Profile Item.label
//
// Access: Public
//
// Since: 1.0.0

.label {
	@extend %font-size-minimum;
	display: block;
	font-family: var(--bu-label-font, #{$font-family-sans-serif});
	font-weight: 700;
	text-transform: uppercase;
}

// Styles the single profile details labels.
//
// Styleguide Components.Profile Item.profile-details-label
//
// Access: Public
//
// Since: 2.0.0

.profile-details-label {
	color: var(--profile-label-color, var(--bu-label-color, #{$color-profile-info-label}));
}

// Styles the single profile details list.
//
// Styleguide Components.Profile Item.profile-details-list
//
// Access: Public
//
// Since: 2.0.0

.profile-details-list {
	margin: 0;
	padding: 0;
}

// Styles the single profile details items.
//
// Styleguide Components.Profile Item.profile-details-item
//
// Access: Public
//
// Since: 2.0.0

.profile-details-item {
	color: var(--profile-details-color, var(--bu-text-color, #{$color-profile-info-item}));
	list-style: none;
	margin: 0 0 var(--margin, var(--bu-spacing, #{$margin}));
	word-wrap: break-word;
}