// =================================================================
// Calendar Picker Settings
// =================================================================

@use "sass:math";

// Calendar Picker Font Family
//
// Controls the font used in the calendar picker in the sidebar
// of the calendar listing template.
//
// Styleguide Calendar.Calendar Picker.Font Family
//
// Access: Public
//
// Since: 1.0.0

$font-family-calendar-month-caption:         $font-family-sans-serif !default;

// Calendar Picker Color
//
// Controls the color of the selected month in the calendar picker
// in the sidebar of the calendar listing template.
//
// Styleguide Calendar.Calendar Picker.Color
//
// Access: Public
//
// Since: 1.0.0
//
// Accessibility: AA

$color-calendar-month-caption:              $color-grayscale-6 !default;

// Calendar Picker Day Label Background
//
// Controls the background of day cells in the calendar picker
// in the sidebar of the calendar listing template.
//
// Styleguide Calendar.Calendar Picker.Day Label Background
//
// Access: Public
//
// Since: 1.0.0
//
// Accessibility: AA

$color-calendar-month-th-bg:                $color-grayscale-e !default;

// Calendar Picker Day Label Color
//
// Controls the color of text in the day cells in the calendar picker
// in the sidebar of the calendar listing template.
//
// Styleguide Calendar.Calendar Picker.Day Label Color
//
// Access: Public
//
// Since: 1.0.0
//
// Accessibility: AA

$color-calendar-month-th:                   $color-grayscale-0 !default;

// Calendar Picker Day Label Padding
//
// Controls the spacing of day cells in the calendar picker
// in the sidebar of the calendar listing template.
//
// Styleguide Calendar.Calendar Picker.Day Label Padding
//
// Access: Public
//
// Since: 1.0.0

$padding-calendar-month-cell:               0.25em !default;

// Calendar Picker Day Label Font
//
// Controls the font family of day cells in the calendar picker
// in the sidebar of the calendar listing template.
//
// Styleguide Calendar.Calendar Picker.Day Label Font
//
// Access: Public
//
// Since: 1.0.0

$font-family-calendar-month-cell:            $font-family-sans-serif !default;

// Calendar Picker Link Color
//
// Controls the color of links in the calendar picker
// in the sidebar of the calendar listing template.
//
// Styleguide Calendar.Calendar Picker.Link Color
//
// Access: Public
//
// Since: 1.0.0
//
// Accessibility: AA

$color-calendar-month-link:             $color-grayscale-6 !default;

// Calendar Picker Link Hover Color
//
// Controls the color of links when you hover in the calendar picker
// in the sidebar of the calendar listing template.
//
// Styleguide Calendar.Calendar Picker.Link Hover Color
//
// Access: Public
//
// Since: 1.0.0
//
// Accessibility: AA

$color-calendar-month-link-hover:       $color-link !default;

// Calendar Picker Inactive Month Background Color
//
// Controls the background of links in the calendar picker
// for days that are not in the current month (previous/next month)
// in the sidebar of the calendar listing template.
//
// Styleguide Calendar.Calendar Picker.Inactive Month Background Color
//
// Access: Public
//
// Since: 1.0.0
//
// Accessibility: AA

$color-calendar-month-link-out-bg:       $color-grayscale-f5 !default;

// Calendar Picker Inactive Month Link Color
//
// Controls the color of links in the calendar picker
// for days that are not in the current month (previous/next month)
// in the sidebar of the calendar listing template.
//
// Styleguide Calendar.Calendar Picker.Inactive Month Link Color
//
// Access: Public
//
// Since: 1.0.0
//
// Accessibility: AA

$color-calendar-month-link-out:          $color-grayscale-6 !default;

// Calendar Picker Selected Day Background Color
//
// Controls the background of the current day's link in the calendar picker
// in the sidebar of the calendar listing template.
//
// Styleguide Calendar.Calendar Picker.Selected Day Background Color
//
// Access: Public
//
// Since: 1.0.0
//
// Access: Public
//
// Accessibility: AA

$color-calendar-month-link-today-bg:     $color-grayscale-e !default;

// Calendar Picker Selected Day Link Color
//
// Controls the color of the current day's link in the calendar picker
// in the sidebar of the calendar listing template.
//
// Styleguide Calendar.Calendar Picker.Selected Day Link Color
//
// Access: Public
//
// Since: 1.0.0
//
// Accessibility: AA

$color-calendar-month-link-today:        $color-grayscale-0 !default;

// =================================================================
// Calendar Picker Styles
// =================================================================

// Styles the BU Calendar list page date picker.
//
// Access: Public
//
// Since: 2.0.0

.widget-calendar-picker {
	color: var(--calendar-month-link-color, #{$color-calendar-month-link});
	line-height: 1.6;

	.month {
		width: 100%;
	}

	caption {
		@extend %font-size-5;
		color: var(--calendar-caption-color, var(--bu-text-color, #{$color-calendar-month-caption}));
		font-family: var(--calendar-font, var(--bu-text-font, #{$font-family-sans-serif}));
		font-style: normal;
		font-weight: bold;
	}

	th,
	td {
		font-family: var(--calendar-font, var(--bu-text-font, #{$font-family-calendar-month-cell}));
		padding: var(--calendar-padding, #{$padding-calendar-month-cell});
		text-align: center;
		width: math.div( 100%, 7 ); // To accomodate seven days in a week
	}

	th {
		background: var(--calendar-month-background, #{$color-calendar-month-th-bg});
		color: var(--calendar-month-color, #{$color-calendar-month-th});
	}

	a {
		color: inherit;
		text-decoration: none;

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

	.out {
		background: var(--calendar-out-background, #{$color-calendar-month-link-out-bg});
		color: var(--calendar-out-color, #{$color-calendar-month-link-out});
	}

	.today {
		background: var(--calendar-today-background, #{$color-calendar-month-link-today-bg});
		color: var(--calendar-today-color, #{$color-calendar-month-link-today});
	}
}

// Styles the previous and next links in the
// BU Calendar list page topics widget.
//
// Access: Public
//
// Since: 2.0.0

.prev-month,
.next-month {
	font-weight: normal;
	margin: 0 0.5em;
}

// Styles the BU Calendar list page topics widget.
//
// Access: Public
//
// Since: 2.0.0

.calendar-topics {
	padding: 0;

	ul {
		padding-left: 20px;
	}
}