/* ============================================
	THE EVENTS CALENDAR - DESIGN SYSTEM ALIGNMENT
	============================================ */

/* Design tokens defined in: assets/css/global/design-tokens.css */

/* 1. LAYOUT & BACKGROUND STYLES */

/* Main events container - light gray background */
.tribe-events:not(.tribe-common) {
	background-color: var(--bg-light) !important;
	min-height: 400px !important;
}

.tribe-events .tribe-common-l-container,
.tribe-events .tribe-events-l-container {
	padding: 32px 20px !important;
	max-width: 1280px !important;
	margin: 0 auto !important;
}

/* 2. EVENTS BAR - Search & View Selector */

/* Events bar container */
.tribe-events-header__events-bar,
.tribe-events-c-events-bar {
	background: var(--bg-white) !important;
	padding: 20px !important;
	border-radius: var(--border-radius) !important;
	box-shadow: var(--shadow-card) !important;
	margin-bottom: 20px !important;
	display: flex !important;
	align-items: center !important;
	gap: 20px !important;
	flex-wrap: wrap !important;
}

/* Search button */
.tribe-events-c-events-bar__search-button {
	background: var(--bg-white) !important;
	border: 1px solid var(--border-color) !important;
	border-radius: var(--border-radius-sm) !important;
	padding: 10px 12px !important;
	cursor: pointer !important;
	transition: var(--transition) !important;
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
}

.tribe-events-c-events-bar__search-button:hover {
	background: var(--bg-light) !important;
	border-color: var(--turfnet-blue) !important;
}

/* Search container when opened */
.tribe-events-c-events-bar__search-container {
	flex: 1 !important;
	min-width: 300px !important;
}

/* Search form */
.tribe-events-c-search {
	display: flex !important;
	gap: 12px !important;
	align-items: center !important;
}

/* Search input */
.tribe-events-c-search__input,
.tribe-common-form-control-text__input {
	flex: 1 !important;
	padding: 10px 14px !important;
	border: 1px solid var(--border-color-dark) !important;
	border-radius: var(--border-radius-sm) !important;
	font-size: 16px !important;
	color: var(--text-primary) !important;
	transition: var(--transition) !important;
	background: var(--bg-white) !important;
	width: 100% !important;
}

.tribe-events-c-search__input:focus,
.tribe-common-form-control-text__input:focus {
	outline: none !important;
	border-color: var(--turfnet-blue) !important;
	box-shadow: 0 0 0 3px rgba(0, 84, 166, 0.1) !important;
}

.tribe-events-c-search__input::placeholder,
.tribe-common-form-control-text__input::placeholder {
	color: var(--text-light) !important;
}

/* Search input control wrapper */
.tribe-events-c-search__input-control,
.tribe-common-form-control-text {
	flex: 1 !important;
	min-width: 0 !important;
}

/* Find Events button */
.tribe-events-c-search__button,
.tribe-events .tribe-events-c-search__button {
	background-color: var(--turfnet-red) !important;
	color: var(--bg-white) !important;
	border: none !important;
	padding: 10px 20px !important;
	border-radius: var(--border-radius) !important;
	font-weight: 600 !important;
	font-size: 15px !important;
	cursor: pointer !important;
	transition: var(--transition) !important;
	white-space: nowrap !important;
}

.tribe-events-c-search__button:hover,
.tribe-events .tribe-events-c-search__button:hover {
	background-color: var(--turfnet-red-dark) !important;
}

/* 3. VIEW SELECTOR TABS (List/Month/Day) */

.tribe-events-c-events-bar__views {
	display: flex !important;
	gap: 6px !important;
	background: var(--bg-light) !important;
	padding: 4px !important;
	border-radius: var(--border-radius-sm) !important;
}

.tribe-events-c-view-selector {
	display: flex !important;
	gap: 6px !important;
}

.tribe-events-c-view-selector__list {
	display: flex !important;
	gap: 6px !important;
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

.tribe-events-c-view-selector__list-item {
	margin: 0 !important;
}

.tribe-events-c-view-selector__list-item-link {
	display: flex !important;
	align-items: center !important;
	gap: 6px !important;
	padding: 8px 14px !important;
	text-align: center !important;
	color: var(--text-secondary) !important;
	text-decoration: none !important;
	border-radius: var(--border-radius-sm) !important;
	font-weight: 500 !important;
	font-size: 14px !important;
	transition: var(--transition) !important;
	background: transparent !important;
	border: 1px solid transparent !important;
}

.tribe-events-c-view-selector__list-item-link:hover {
	background-color: var(--bg-white) !important;
	color: var(--text-primary) !important;
	border-color: var(--border-color) !important;
}

/* View selector icons */
.tribe-events-c-view-selector__list-item-icon {
	display: flex !important;
	align-items: center !important;
	width: 16px !important;
	height: 16px !important;
}

.tribe-common--breakpoint-medium.tribe-events .tribe-events-c-view-selector--tabs .tribe-events-c-view-selector__list-item--active .tribe-events-c-view-selector__list-item-link:after {
	display: none !important;
}

.tribe-common--breakpoint-medium.tribe-events .tribe-events-c-search__input-control-icon-svg {
	left: auto;
	right: 16px;
}

.tribe-events-c-view-selector__list-item-icon-svg {
	width: 100% !important;
	height: 100% !important;
	fill: currentColor !important;
}

.tribe-events-c-view-selector__list-item-text {
	font-size: 14px !important;
}

/* 4. EVENT CARDS - Modern Card Design */

/* Event list container */
.tribe-events-calendar-list {
	margin-top: 24px !important;
}

/* Individual event row as card */
.tribe-events-calendar-list__event-row {
	background: var(--bg-white) !important;
	border-radius: var(--border-radius) !important;
	padding: 24px !important;
	margin-bottom: 16px !important;
	box-shadow: var(--shadow-card) !important;
	transition: var(--transition) !important;
	display: flex !important;
	gap: 24px !important;
}

.tribe-events-calendar-list__event-row:hover {
	box-shadow: var(--shadow-md) !important;
	transform: translateY(-2px) !important;
}

/* Event date tag/badge */
.tribe-events-calendar-list__event-date-tag {
	flex-shrink: 0 !important;
	width: 70px !important;
	text-align: center !important;
	background: var(--bg-light) !important;
	border-radius: var(--border-radius-sm) !important;
	padding: 12px 8px !important;
	border-left: 3px solid var(--turfnet-red) !important;
}

.tribe-events-calendar-list__event-date-tag-datetime {
	display: flex !important;
	flex-direction: column !important;
	gap: 4px !important;
}

.tribe-events-calendar-list__month {
	font-size: 14px !important;
	font-weight: 600 !important;
	color: var(--turfnet-red) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
}

.tribe-events-calendar-list__day {
	font-size: 28px !important;
	font-weight: 700 !important;
	color: var(--text-primary) !important;
	line-height: 1 !important;
}

.tribe-events-calendar-list__year {
	font-size: 12px !important;
	color: var(--text-secondary) !important;
}

/* Event content area */
.tribe-events-calendar-list__event-wrapper {
	flex: 1 !important;
	min-width: 0 !important;
}

.tribe-events-calendar-list__event-details {
	margin-bottom: 12px !important;
}

/* 5. TYPOGRAPHY UPDATES */

/* Event title */
.tribe-events-calendar-list__event-title {
	margin: 0 0 8px 0 !important;
}

.tribe-events-calendar-list__event-title-link,
.tribe-common-h3.tribe-events-calendar-list__event-title a {
	color: var(--text-primary) !important;
	font-size: 22px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	text-decoration: none !important;
	transition: var(--transition) !important;
}

.tribe-events-calendar-list__event-title-link:hover,
.tribe-common-h3.tribe-events-calendar-list__event-title a:hover {
	color: var(--turfnet-red) !important;
}

/* Event date/time meta */
.tribe-events-calendar-list__event-datetime {
	font-size: 14px !important;
	color: var(--text-secondary) !important;
	margin-bottom: 4px !important;
}

/* Event venue/location */
.tribe-events-calendar-list__event-venue {
	font-size: 14px !important;
	color: var(--text-secondary) !important;
}

/* Event description */
.tribe-events-calendar-list__event-description {
	color: var(--text-primary) !important;
	font-size: 16px !important;
	line-height: 1.6 !important;
	margin-top: 12px !important;
}

.tribe-events-calendar-list__event-description p {
	margin: 0 !important;
}

/* Event featured image */
.tribe-events-calendar-list__event-featured-image {
	width: 100% !important;
	max-width: 200px !important;
	border-radius: var(--border-radius-sm) !important;
	overflow: hidden !important;
	margin-bottom: 12px !important;
}

.tribe-events-calendar-list__event-featured-image img {
	width: 100% !important;
	height: auto !important;
	display: block !important;
}

/* 6. ALERT/NOTICE BOXES */

.tribe-events-notices {
	background: var(--bg-white) !important;
	border-left: 4px solid var(--turfnet-blue) !important;
	border-radius: var(--border-radius) !important;
	padding: 16px 20px !important;
	margin-bottom: 24px !important;
	box-shadow: var(--shadow-card) !important;
}

.tribe-events-notices__notice {
	color: var(--text-primary) !important;
	font-size: 16px !important;
	margin: 0 !important;
}

/* 7. TOP BAR - Navigation & Date Controls */

/* Top bar container */
.tribe-events-c-top-bar,
.tribe-events-header__top-bar {
	background: var(--bg-white) !important;
	padding: 16px 20px !important;
	border-radius: var(--border-radius) !important;
	margin-bottom: 20px !important;
	display: flex !important;
	justify-content: space-between !important;
	align-items: center !important;
	flex-wrap: wrap !important;
	gap: 16px !important;
	box-shadow: var(--shadow-card) !important;
}

/* Navigation section */
.tribe-events-c-top-bar__nav {
	display: flex !important;
	align-items: center !important;
}

.tribe-events-c-top-bar__nav-list {
	display: flex !important;
	gap: 8px !important;
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

.tribe-events-c-top-bar__nav-list-item {
	margin: 0 !important;
}

/* Navigation links/buttons */
.tribe-events-c-subscribe-dropdown__button,
.tribe-events-c-top-bar__nav-link {
	padding: 8px !important;
	border: 1px solid var(--border-color) !important;
	border-radius: var(--border-radius-sm) !important;
	background: var(--bg-white) !important;
	color: var(--text-primary) !important;
	text-decoration: none !important;
	transition: var(--transition) !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 36px !important;
	min-height: 36px !important;
}

.tribe-events-c-subscribe-dropdown__button:hover,
.tribe-events-c-top-bar__nav-link:hover {
	background: var(--bg-light) !important;
	border-color: var(--turfnet-red) !important;
}

.tribe-events-c-top-bar__nav-link[disabled] {
	opacity: 0.4 !important;
	cursor: not-allowed !important;
}

.tribe-events-c-top-bar__nav-link[disabled]:hover {
	background: var(--bg-white) !important;
	border-color: var(--border-color) !important;
}

/* Today button */
.tribe-events-c-top-bar__today-button {
	padding: 8px 16px !important;
	background: var(--bg-white) !important;
	border: 1px solid var(--border-color) !important;
	border-radius: var(--border-radius-sm) !important;
	color: var(--text-primary) !important;
	font-weight: 500 !important;
	text-decoration: none !important;
	transition: var(--transition) !important;
	font-size: 14px !important;
}

.tribe-events-c-top-bar__today-button:hover {
	background: var(--turfnet-red) !important;
	border-color: var(--turfnet-red) !important;
	color: var(--bg-white) !important;
}

/* Date picker section */
.tribe-events-c-top-bar__datepicker {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
}

.tribe-events-c-top-bar__datepicker-button {
	padding: 8px 14px !important;
	background: var(--bg-white) !important;
	border: 1px solid var(--border-color) !important;
	border-radius: var(--border-radius-sm) !important;
	color: var(--text-primary) !important;
	font-weight: 500 !important;
	font-size: 14px !important;
	cursor: pointer !important;
	transition: var(--transition) !important;
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
}

.tribe-events-c-top-bar__datepicker-button:hover {
	border-color: var(--turfnet-blue) !important;
	background: var(--bg-light) !important;
}

/* Datepicker input */
.tribe-events-c-top-bar__datepicker-input,
input[type="text"].tribe-events-c-top-bar__datepicker-input {
	padding: 8px 12px !important;
	border: 1px solid var(--border-color-dark) !important;
	border-radius: var(--border-radius-sm) !important;
	font-size: 14px !important;
	color: var(--text-primary) !important;
	transition: var(--transition) !important;
	min-width: 120px !important;
}

.tribe-events-c-top-bar__datepicker-input:focus,
input[type="text"].tribe-events-c-top-bar__datepicker-input:focus {
	outline: none !important;
	border-color: var(--turfnet-blue) !important;
	box-shadow: 0 0 0 3px rgba(0, 84, 166, 0.1) !important;
}

/* Section headings */
.tribe-events h2,
.tribe-events .tribe-events-header__title {
	font-size: 32px !important;
	font-weight: 700 !important;
	color: var(--text-primary) !important;
	margin-bottom: 24px !important;
	line-height: 1.2 !important;
}

/* Past Events Section */
.tribe-events-calendar-list__event-row--past {
	opacity: 0.95 !important;
}

/* Latest Past Events Section */
.tribe-events-calendar-latest-past {
	margin-top: 32px !important;
}

.tribe-events-calendar-latest-past__heading {
	font-size: 28px !important;
	font-weight: 700 !important;
	color: var(--text-primary) !important;
	margin-bottom: 24px !important;
}

/* Latest Past Events - Event row (entire card) */
.tribe-events-calendar-latest-past__event-row {
	background: var(--bg-white) !important;
	border-radius: var(--border-radius) !important;
	padding: 24px !important;
	margin-bottom: 20px !important;
	box-shadow: var(--shadow-card) !important;
	transition: var(--transition) !important;
	display: flex !important;
	gap: 24px !important;
	align-items: flex-start !important;
}

.tribe-events-calendar-latest-past__event-row:hover {
	box-shadow: var(--shadow-md) !important;
	transform: translateY(-2px) !important;
}

/* Latest Past Events - Date badge */
.tribe-events-calendar-latest-past__event-date-tag {
	flex-shrink: 0 !important;
	width: 80px !important;
	text-align: center !important;
	background: var(--bg-light) !important;
	border-radius: var(--border-radius-sm) !important;
	padding: 12px 8px !important;
	border-left: 4px solid var(--turfnet-red) !important;
}

.tribe-events-calendar-latest-past__event-date-tag-month {
	font-size: 13px !important;
	font-weight: 600 !important;
	color: var(--turfnet-red) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	display: block !important;
}

.tribe-events-calendar-latest-past__event-date-tag-daynum {
	font-size: 32px !important;
	font-weight: 700 !important;
	color: var(--text-primary) !important;
	line-height: 1 !important;
	display: block !important;
	margin: 6px 0 !important;
}

.tribe-events-calendar-latest-past__event-date-tag-year {
	font-size: 13px !important;
	color: var(--text-secondary) !important;
	display: block !important;
}

/* Latest Past Events - Event wrapper */
.tribe-events-calendar-latest-past__event-wrapper {
	flex: 1 !important;
	min-width: 0 !important;
}

/* Latest Past Events - Event article */
.tribe-events-calendar-latest-past__event {
	background: transparent !important;
	padding: 0 !important;
	margin: 0 !important;
	box-shadow: none !important;
	border: none !important;
	display: flex !important;
	gap: 20px !important;
	flex-wrap: wrap !important;
}

/* Latest Past Events - Featured image wrapper */
.tribe-events-calendar-latest-past__event-featured-image-wrapper {
	flex-shrink: 0 !important;
	width: 200px !important;
}

.tribe-events-calendar-latest-past__event-featured-image-link {
	display: block !important;
	border-radius: var(--border-radius-sm) !important;
	overflow: hidden !important;
}

.tribe-events-calendar-latest-past__event-featured-image-link img {
	width: 100% !important;
	height: auto !important;
	display: block !important;
	transition: var(--transition) !important;
}

.tribe-events-calendar-latest-past__event-featured-image-link:hover img {
	transform: scale(1.05) !important;
}

/* Latest Past Events - Event details wrapper */
.tribe-events-calendar-latest-past__event-details {
	flex: 1 !important;
	min-width: 250px !important;
}

/* Latest Past Events - Event datetime */
.tribe-events-calendar-latest-past__event-datetime {
	margin-bottom: 8px !important;
}

.tribe-events-calendar-latest-past__event-datetime-featured-text {
	color: var(--text-secondary) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
}

/* Latest Past Events - Event title */
.tribe-events-calendar-latest-past__event-title {
	margin: 0 0 12px 0 !important;
}

.tribe-events-calendar-latest-past__event-title a,
.tribe-events-calendar-latest-past__event-title-link {
	color: var(--text-primary) !important;
	font-size: 20px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	text-decoration: none !important;
	transition: var(--transition) !important;
}

.tribe-events-calendar-latest-past__event-title a:hover,
.tribe-events-calendar-latest-past__event-title-link:hover {
	color: var(--turfnet-red) !important;
}

/* Latest Past Events - Event venue */
.tribe-events-calendar-latest-past__event-venue-title {
	color: var(--text-secondary) !important;
	font-size: 14px !important;
	margin-bottom: 12px !important;
}

/* Latest Past Events - Description */
.tribe-events-calendar-latest-past__event-description {
	color: var(--text-primary) !important;
	font-size: 15px !important;
	line-height: 1.6 !important;
	margin-top: 8px !important;
}

.tribe-events-calendar-latest-past__event-description p {
	margin: 0 !important;
}

.tribe-events-event-image img {
	width: 100%;
}

.single-tribe_events .tribe-events-content,
.single-tribe_events .tribe-common,
.single-tribe_events .tribe-events-event-meta {
	padding: 0 32px;
}

.single-tribe_events .tribe-events-event-meta {
	width: 100%;
}

/* Events page */
body.post-type-archive-tribe_events section.tribe-common-l-container.tribe-events-l-container {
	background-color: #fff;
}

body.post-type-archive-tribe_events .tribe-events .tribe-common-l-container, .tribe-events .tribe-events-l-container {
	padding-left: var(--tec-grid-gutter-page) !important;
	padding-right: var(--tec-grid-gutter-page) !important;
	padding-bottom: var(--tec-spacer-14) !important;
	padding-top: var(--tec-spacer-13) !important;
}

/* Responsive styles moved to assets/css/global/responsive/ */