/* = The Events Calendar List Widget
   @ Template: pro/widgets/list-widget.php
=============================================*/
@import "../skeleton/_list.pcss";

:root {
	--featured-event-bg: #0ea0d7;
}

@define-mixin featured-list-styles {
	.tribe-event-featured {
		color: rgba(255, 255, 255, .7);

		.tribe-event-title,
		.tribe-events-title,
		.tribe-events-list-event-title {
			a {
				color: #fff;
			}
		}

		.tribe-events-duration,
		.tribe-events-event-meta {
			color: rgba(255, 255, 255, .7);
			font-weight: normal;
		}

		.tribe-events-content {
			color: rgba(255, 255, 255, .9);
		}

		a {
			color: rgba(255, 255, 255, .7);

			&:active,
			&:hover {
				color: rgba(255, 255, 255, .9);
			}
		}
	}
}

.tribe-mini-calendar-event {
	border-bottom: 1px dotted #2f2f2f;
	margin-bottom: 5px;
	overflow: hidden;
	padding-bottom: 5px;
	width: 100%;

	&.first {
		margin-top: 10px;
	}

	.list-date {
		background: #666;
		box-sizing: border-box;
		display: inline;
		float: left;
		font-weight: bold;
		margin: 10px 5% 10px 0;
		overflow: hidden;
		padding: 3px;
		text-align: center;
		width: 15%;
	}

	.list-info {
		display: inline;
		float: left;
		margin: 10px 0;
		width: 80%;
	}

	.list-date .list-dayname {
		background: #fff;
		color: #666;
		display: block;
		font-size: 11px;
		letter-spacing: .5px;
		padding: 3px;
		text-align: center;
		text-transform: uppercase;
	}

	.list-date .list-daynumber {
		color: white;
		display: block;
		font-size: 15px;
		line-height: 1.6;
		text-align: center;
		width: 100%;
	}

	.list-date .list-daymonth {
		background: white;
		color: #666;
		display: block;
		font-size: 12px;
		line-height: 1.6;
		text-align: center;
		text-transform: uppercase;
		width: 100%;
	}

	.list-info {
		font-size: 13px;
		line-height: 1.6;

		h2 {
			font-size: 14px;
			font-weight: bold;
			line-height: 18px;
			margin-bottom: 10px;
			margin-top: 0;
		}

		p {
			display: none;
			margin: 5px 0;
		}
	}

	&.first .list-info p {
		display: block;
	}

	.tribe-events-divider {
		display: inline;
		font-weight: normal;
	}

	.tribe-events-event-schedule-details {
		display: inline-block;
	}
}

.tribe-mini-calendar-event-cost {
	font-weight: bold;
}

.tribe-mini-calendar-right .tribe-mini-calendar-event:last-child {
	border: 0;
}

.tribe-mini-calendar-event .tribe-events-event-schedule-details,
.tribe-mini-calendar-event-venue {
	margin: 5px 0 0;
}

.tribe-mini-calendar-list-wrapper .type-tribe_events {
	margin: 0;
	padding: 0;
}

.tribe-mini-calendar-list-wrapper,
.tribe-events-adv-list-widget {
	@mixin featured-list-styles;

	ol li {
		list-style: none;
		margin-bottom: 30px;
	}

	.tribe-venue {
		display: block;
		margin-top: 10px;
	}

	.tribe-events-organizer,
	.tribe-events-location {
		&:empty {
			display: none;
		}
	}

	.list-info {
		margin-bottom: .25rem;
	}

	.tribe-organizer {
		display: block;
	}

	.tribe-events-event-cost {
		display: inline;
	}

	.duration {
		display: inline;
	}

	.event-is-recurring .tribe-events-divider {
		display: none;
	}

	.event-is-recurring {
		color: inherit;
	}

	.type-tribe_events {
		margin: 0 0 .25rem 0;
		padding: 0;
	}

	.tribe-event-title {
		margin-top: .75rem;
	}

	.tribe-event-featured {
		border-bottom: 1px dotted #2f2f2f;
		margin-top: .75rem;
		padding-bottom: .75rem;

		&:first-of-type {
			margin-top: 0;
		}

		&:last-of-type {
			border-bottom: 0;
		}

		.list-date {
			display: none;
		}

		.list-info {
			display: block;
			padding: 0 1.5rem;
			width: 100%;
		}

		.tribe-mini-calendar-event {
			background: var(--featured-event-bg);
			border: 0;
			margin-bottom: 0;
			padding-bottom: 16px;

			.tribe-event-image {
				line-height: 0;
				overflow: hidden;
			}

			.list-info {
				margin-bottom: 0;
			}

			.tribe-events-title a {
				color: white;

				&:hover {
					color: rgba(255, 255, 255, .9);
				}
			}
		}
	}
}

/* Twenty Seventeen Compat
========================================================================== */
.tribe-mini-calendar-list-wrapper,
.tribe-events-adv-list-widget {
	.tribe-event-featured .tribe-mini-calendar-event a {
		box-shadow: none;
	}
}

/* Twenty Fifteen Compat
=============================================*/
.tribe-theme-twentyfifteen {
	.tribe-events-adv-list-widget {
		word-wrap: normal;
		.type-tribe_events.hentry {
			box-shadow: none;
			margin-left: 0;
			margin-right: 0;
		}

		.tribe-mini-calendar-event {
			border-bottom: 0;
		}
	}
}