// =================================================================
// Widget Settings
// =================================================================

// Widget Bottom Margin
//
// Controls the spacing between widgets in the sidebar.
//
// Styleguide Widgets.General Styles.Bottom Margin
//
// Access: Public
//
// Since: 1.0.0

$widget-margin-bottom:                      $margin !default;

// Widget Title Font Family
//
// Controls the font family used for the widget title.
//
// Styleguide Widgets.General Styles.Title Font Family
//
// Access: Public
//
// Since: 1.0.0

$font-family-widget-title:                  $font-family-sans-serif !default;

// Widget Title Border
//
// Controls the border style used on the widget title.
//
// Styleguide Widgets.General Styles.Title Border
//
// Access: Public
//
// Since: 1.0.0

$border-widget-title:                       $border !default;

// Widget Title Border Width
//
// Controls the border width used on the widget title.
//
// Styleguide Widgets.General Styles.Title Border Width
//
// Access: Public
//
// Since: 1.0.0

$border-width-widget-title:                 0 0 4px 0 !default;

// Widget Title Color
//
// Controls the color of the widget title.
//
// Styleguide Widgets.General Styles.Title Color
//
// Access: Public
//
// Since: 1.0.0
//
// Accessibility: AA

$color-widget-title:                        $color-grayscale-0 !default;

// Widget Title Link After
//
// Controls the shape which shows after the widget title if it is a link.
// By default, this is set to be an arrow.
//
// Styleguide Widgets.General Styles.Title Link Icon
//
// Access: Public
//
// Status: Deprecated since 5.0.0
//
// Since: 1.0.0

// Widget Title Link Icon
//
// Controls the icon which shows after the widget title if it is a link.
// By default, this is set to be an arrow from FontAwesome.
//
// Styleguide Widgets.General Styles.Title Link Icon
//
// Access: Public
//
// Since: 5.0.0

$widget-title-link-icon:                   "angle-right" !default;

// Widget Title Link Icon Placement
//
// Controls whether the icon shows before or after the title.
//
// Styleguide Widgets.General Styles.Title Link Icon Placement
//
// Access: Public
//
// Since: 5.0.0

$widget-title-link-icon-placement:                   "after" !default;

// Widget Title Link Icon Color
//
// Controls the color of the shape which shows after the widget title
// if it is a link.
//
// Styleguide Widgets.General Styles.Title Link Icon Color
//
// Access: Public
//
// Since: 1.0.0

$color-widget-title-link-icon:             currentColor !default;

// Widget Title Link Icon Color Hover
//
// Controls the color of the shape which shows after the widget title
// when you hover.
//
// Styleguide Widgets.General Styles.Title Link Icon Color Hover
//
// Access: Public
//
// Since: 1.0.0

$color-widget-title-link-icon-hover:       $color-grayscale-0 !default;

// Widget Headings Font Family
//
// Controls the font family used for headings in widget content.
//
// Styleguide Widgets.General Styles.Headings Font Family
//
// Access: Public
//
// Since: 1.0.0

$font-family-widget-heading:                $font-family-sans-serif !default;

// Widget Link Color
//
// Controls the color of links in the widget content.
//
// Styleguide Widgets.General Styles.Link Color
//
// Access: Public
//
// Since: 1.0.0
//
// Accessibility: AA

$color-widget-link:                        $color-link !default;

// Widget Link Color Hover
//
// Controls the color of links when you hover in the widget content.
//
// Styleguide Widgets.General Styles.Link Color Hover
//
// Access: Public
//
// Since: 1.0.0
//
// Accessibility: AA

$color-widget-link-hover:                  $color-link !default;

// Widget List Border
//
// Controls the style of border used between items in widgets which use a
// list format, such as content navigation and the calendar widget.
//
// Styleguide Widgets.General Styles.List Border
//
// Access: Public
//
// Since: 1.0.0

$border-widget-list:                       $border !default;

// =================================================================
// Widget Styles
// =================================================================

// Widget contents:

//	1. Basic Widgets
//	2. BU Posts
//	3. Content Nav
//	4. Calendar

// -----------------------------------------------------------------

// Basic Widgets
// -----------------------------------------------------------------

// Handles global widget styling.
//
// Styleguide Components.Widgets.widget
//
// Access: Public
//
// Since: 1.0.0

.widget {
	@extend %col-full;
	@extend %font-size-secondary;
	margin-bottom: var(--widget-margin-bottom, #{$widget-margin-bottom});

	&:last-child {
		margin-bottom: 0;
	}

	h1,
	h2,
	h3,
	h4,
	h5,
	h6 {
		font-family: var(--widget-heading-font, var(--bu-heading-font, #{$font-family-widget-heading}));
	}

	a {
		color: var(--widget-link-color, var(--bu-link-color, #{$color-widget-link}));

		&:hover,
		&:focus {
			color: var(--widget-link-color--hover, var(--bu-link-color--hover, #{$color-widget-link-hover}));
		}

		&.button,
		&.button:hover,
		&.button:focus {
			color: var(--bu-button-text-color, #{$color-button-text});
		}

		&.button-primary,
		&.button-primary:hover,
		&.button-primary:focus {
			color: var(--bu-button-primary-text-color, #{$color-button-primary-text});
		}
	}

	ul {
		list-style: none;
		list-style-image: none;
	}
}

// Handles title styles for all widgets.
//
// Styleguide Components.Widgets.widget-title
//
// Access: Public
//
// Since: 1.0.0

.widget-title {
	border: var(--widget-title-border, var(--bu-border, #{$border-widget-title}));
	border-width: var(--widget-title-border-width, #{$border-width-widget-title});
	color: var(--widget-title-color, var(--bu-heading-color, #{$color-widget-title}));
	font-family: var(--widget-title-font, var(--bu-heading-font, #{$font-family-widget-title}));
	padding: 0 0 4px;

	a {
		@include icon($widget-title-link-icon, $widget-title-link-icon-placement);
		color: inherit;
		text-decoration: none;

		&::after {
			color: var(--widget-title-icon-color, #{$color-widget-title-link-icon});
		}

		&:hover::after {
			color: var(--widget-title-icon-color--hover, #{$color-widget-title-link-icon-hover});
		}
	}
}

// Styles the blog list in the blogroll widget.
//
// Styleguide Components.Widgets.blogroll
//
// Access: Public
//
// Since: 2.0.0

.blogroll {
	padding: 0;
}

// Content Nav
// -----------------------------------------------------------------

// Handles styling for archive and link widgets.
//
// Styleguide Components.Widgets.widget_links
//
// Access: Public
//
// Since: 2.0.0

// Handles styling for archive and link widgets.
//
// Styleguide Components.Widgets.widget_archive
//
// Access: Public
//
// Since: 2.0.0

.widget_links,
.widget_archive {
	li {
		border-top: var(--widget-list-border, var(--bu-border, #{$border-widget-list}));
		padding: $padding-small 0;

		&:first-child {
			border: 0;
		}
	}
}