// =================================================================
// Mini Profile Format Settings
// =================================================================

@use "sass:math";

// Controls the color of the border on the mini profile format
// in the profiles shortcode.
//
// Styleguide Profiles.Mini Format.Photo Size
//
// Access: Public
//
// Since: 1.0.0

$color-profile-mini-border:                $color-grayscale-e !default;

// Controls the number of profiles in a row in the mini format.
// Kicks in at the small breakpoint.
//
// Styleguide Profiles.Mini Format.Photo Size
//
// Access: Public
//
// Since: 2.0.0

$profiles-mini-cols-sm:			2 !default;

// A helper variable to determine which grid class to extend
// for mini profile items at the `sm` breakpoint.
//
// Access: Private
//
// Since: 2.0.0

$_profile-mini-cols-sm: math.div( $grid-number-columns, $profiles-mini-cols-sm );

// =================================================================
// Mini Profile Format Styles
// =================================================================

// Container for the mini profile format.
//
// Styleguide Components.Profiles Mini Format.profile-format-mini
//
// Access: Public
//
// Since: 2.0.0

.profile-format-mini {
	@if ( $enable-css-grid ) {
		@extend %grid-xs-parent;
	}
}

// Styles the mini profile format.
//
// Styleguide Components.Profiles Mini Format.profile-item-mini
//
// Access: Public
//
// Since: 2.0.0

.profile-item-mini {
	@extend %clearfix;
	@extend %col-sm-#{$_profile-mini-cols-sm};

	&:nth-child(#{$profiles-mini-cols-sm}n+1) {
		clear: left;
		padding-right: $margin-small;
	}

	@if ( $enable-css-grid ) {
		@extend %grid-parent;
	}
}

// Styles the mini profile photo.
//
// Styleguide Components.Profiles Mini Format.profile-photo-mini
//
// Access: Public
//
// Since: 2.0.0

.profile-photo-mini {
	@extend %col-2;
	height: 0;
	padding-bottom: 16%;

	@if ( $enable-css-grid ) {
		@supports ( display: grid ) {
			padding-bottom: 100%;
		}
	}
}

// Styles the mini profile details.
//
// Styleguide Components.Profiles Mini Format.profile-details-mini
//
// Access: Public
//
// Since: 2.0.0

.profile-details-mini {
	@extend %col-9;
	padding-left: 20px;

	@if ( $enable-css-grid ) {
		@supports ( display: grid ) {
			padding-left: 0;
		}
	}

	p {
		@extend %font-size-minimum;
	}
}

// Styles the mini profile name.
//
// Styleguide Components.Profiles Mini Format.profile-name-mini
//
// Access: Public
//
// Since: 2.0.0

.profile-name-mini {
	color: inherit;
	text-decoration: none;
}

// Styles the mini profile email.
//
// Styleguide Components.Profiles Mini Format.profile-email-mini
//
// Access: Public
//
// Since: 2.0.0

.profile-email-mini {
	margin: 5px 0;
	word-wrap: break-word;
}