/* ==========================================================================
   /etkinlikler — Carousel card layout + custom filter bar (Yaklaşan / Tümü).

   No color overrides — the theme's own palette stays untouched.
   `!important` is used throughout because Tribe V2's skeleton CSS resets
   flex widths and anchor styling with enough specificity to swallow normal
   overrides.
   ========================================================================== */

:root {
	--etk-radius: 12px;
	--etk-radius-sm: 8px;
	--etk-shadow: 0 1px 3px rgba(17, 24, 39, 0.06), 0 1px 2px rgba(17, 24, 39, 0.04);
	--etk-shadow-hover: 0 10px 24px rgba(17, 24, 39, 0.10);
	--etk-border-color: rgba(17, 24, 39, 0.08);
	--etk-text: #111827;
	--etk-muted: #6b7280;
	--etk-bg: #ffffff;
	--etk-bg-soft: #f8fafc;
}

/* --------------------------------------------------------------------------
 * Hide stock Tribe controls
 * -------------------------------------------------------------------------- */
.tribe-events-c-view-selector,
.tribe-events-c-top-bar__datepicker,
.tribe-events-c-top-bar__datepicker-desktop,
.tribe-events-c-top-bar__datepicker-mobile,
.tribe-events-c-top-bar__datepicker-button {
	display: none !important;
}

/* --------------------------------------------------------------------------
 * Custom filter bar
 * -------------------------------------------------------------------------- */
.tribe-events-c-events-bar .etk-filter-bar,
.etk-filter-bar {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 10px !important;
	margin: 0 0 4px !important;
	padding: 0 !important;
	align-items: center !important;
}

.tribe-events-c-events-bar .etk-filter-bar .etk-filter-btn,
.etk-filter-bar .etk-filter-btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 9px 20px !important;
	border-radius: 999px !important;
	background: #ffffff !important;
	border: 1px solid rgba(17, 24, 39, 0.12) !important;
	color: #111827 !important;
	font-family: inherit !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	line-height: 1.2 !important;
	letter-spacing: 0 !important;
	text-decoration: none !important;
	text-transform: none !important;
	box-shadow: 0 1px 2px rgba(17, 24, 39, 0.04) !important;
	cursor: pointer !important;
	white-space: nowrap !important;
	transition: background .2s ease, border-color .2s ease, color .2s ease,
	            box-shadow .2s ease, transform .15s ease !important;
}

.tribe-events-c-events-bar .etk-filter-bar .etk-filter-btn:hover,
.tribe-events-c-events-bar .etk-filter-bar .etk-filter-btn:focus-visible,
.etk-filter-bar .etk-filter-btn:hover,
.etk-filter-bar .etk-filter-btn:focus-visible {
	background: #f8fafc !important;
	border-color: rgba(17, 24, 39, 0.22) !important;
	color: #111827 !important;
	text-decoration: none !important;
	outline: none !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 4px 10px rgba(17, 24, 39, 0.08) !important;
}

.tribe-events-c-events-bar .etk-filter-bar .etk-filter-btn.is-active,
.etk-filter-bar .etk-filter-btn.is-active {
	background: #111827 !important;
	border-color: #111827 !important;
	color: #ffffff !important;
	box-shadow: 0 3px 8px rgba(17, 24, 39, 0.2) !important;
}

.tribe-events-c-events-bar .etk-filter-bar .etk-filter-btn.is-active:hover,
.etk-filter-bar .etk-filter-btn.is-active:hover {
	background: #000000 !important;
	border-color: #000000 !important;
	color: #ffffff !important;
}

/* --------------------------------------------------------------------------
 * Page breathing room
 * -------------------------------------------------------------------------- */
.tribe-events-view.tribe-events-view--list,
.tribe-events-view.tribe-events-view--month,
.tribe-events-view.tribe-events-view--day {
	padding-top: 16px;
	padding-bottom: 48px;
}

.tribe-events-c-events-bar {
	background: var(--etk-bg-soft);
	border: 1px solid var(--etk-border-color);
	border-radius: var(--etk-radius);
	padding: 14px 16px;
	margin-bottom: 20px;
	gap: 12px;
}

/* Month separators break the horizontal carousel track */
.tribe-events-calendar-list__month-separator {
	display: none !important;
}

/* --------------------------------------------------------------------------
 * Carousel nav — injected BELOW the track by etkinlikler-filters.js.
 * Visible on ALL screen sizes so mobile users know they can swipe.
 * -------------------------------------------------------------------------- */
.etk-carousel-nav {
	display: flex !important;
	justify-content: center !important;   /* centered on mobile */
	gap: 12px !important;
	margin-top: 14px !important;
}

.etk-carousel-btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 44px !important;
	height: 44px !important;
	border-radius: 50% !important;
	border: 1px solid rgba(17, 24, 39, 0.15) !important;
	background: var(--etk-bg) !important;
	color: var(--etk-text) !important;
	cursor: pointer !important;
	box-shadow: var(--etk-shadow) !important;
	padding: 0 !important;
	flex-shrink: 0 !important;
	transition: background .2s ease, color .2s ease, border-color .2s ease,
	            box-shadow .2s ease !important;
}

.etk-carousel-btn:hover,
.etk-carousel-btn:active {
	background: #111827 !important;
	color: #ffffff !important;
	border-color: #111827 !important;
	box-shadow: 0 4px 12px rgba(17, 24, 39, 0.18) !important;
}

/* Desktop: right-align the nav */
@media (min-width: 600px) {
	.etk-carousel-nav {
		justify-content: flex-end !important;
	}
}

/* --------------------------------------------------------------------------
 * Carousel track
 * -------------------------------------------------------------------------- */
.tribe-events-calendar-list {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	overflow-x: auto !important;
	overflow-y: visible !important;
	scroll-snap-type: x mandatory !important;
	overscroll-behavior-x: contain !important;
	-webkit-overflow-scrolling: touch !important;
	gap: 14px !important;
	/* 16px horizontal padding so first card sits 16 px from screen edge */
	padding: 4px 16px 16px !important;
	scroll-padding-left: 16px !important;
	scrollbar-width: none !important;
	-ms-overflow-style: none !important;
	align-items: start !important;     /* cards don't stretch to equal height */
	box-sizing: border-box !important;
}

.tribe-events-calendar-list::-webkit-scrollbar {
	display: none !important;
}

/* Allow the card shadow to be visible outside the track */
.tribe-events-view--list .tribe-events-view__inner,
.tribe-events-view--list .tribe-events-view__list,
.tribe-events-view--list .tribe-events-calendar-list__list-wrapper {
	overflow: visible !important;
}

/* --------------------------------------------------------------------------
 * Card shell
 * -------------------------------------------------------------------------- */
.tribe-events-calendar-list__event-row,
.tribe-events-calendar-list__event-row.tribe-common-g-row {
	flex: 0 0 80vw !important;
	min-width: 0 !important;
	max-width: 320px !important;          /* cap on large mobiles */
	scroll-snap-align: start !important;
	background: var(--etk-bg) !important;
	border: 1px solid var(--etk-border-color) !important;
	border-radius: var(--etk-radius) !important;
	box-shadow: var(--etk-shadow) !important;
	overflow: hidden !important;
	display: flex !important;
	flex-direction: column !important;
	flex-wrap: nowrap !important;
	cursor: pointer !important;
	box-sizing: border-box !important;
	transition: transform .25s ease, box-shadow .25s ease !important;
}

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

/* --------------------------------------------------------------------------
 * Card internals
 * JS moves the image wrapper to be a direct child of the card; the
 * selectors below target it in its new position.
 * -------------------------------------------------------------------------- */

/* Image (direct card child after JS move) */
.tribe-events-calendar-list__event-row
	> .tribe-events-calendar-list__event-featured-image-wrapper {
	width: 100% !important;
	max-width: 100% !important;
	flex-shrink: 0 !important;
	overflow: hidden !important;
	margin: 0 !important;
	padding: 0 !important;
	box-sizing: border-box !important;
}

.tribe-events-calendar-list__event-row
	> .tribe-events-calendar-list__event-featured-image-wrapper a {
	display: block !important;
	width: 100% !important;
}

.tribe-events-calendar-list__event-row
	> .tribe-events-calendar-list__event-featured-image-wrapper img {
	display: block !important;
	width: 100% !important;
	height: 200px !important;
	object-fit: cover !important;
	object-position: center !important;
	transition: transform .5s ease !important;
}

.tribe-events-calendar-list__event-row:hover
	> .tribe-events-calendar-list__event-featured-image-wrapper img {
	transform: scale(1.03) !important;
}

/* Event column */
.tribe-events-calendar-list__event,
.tribe-events-calendar-list__event.tribe-common-g-col {
	width: 100% !important;
	max-width: 100% !important;
	flex: 1 1 auto !important;
	padding: 0 !important;
	min-width: 0 !important;
}

/* Date-tag sidebar hidden */
.tribe-events-calendar-list__event-date-tag,
.tribe-events-calendar-list__event-date-tag.tribe-common-g-col {
	display: none !important;
}

/* Details — explicit padding with higher specificity to beat Tribe */
.tribe-events-view--list
	.tribe-events-calendar-list__event-details {
	padding: 14px 16px !important;
	flex: 0 0 auto !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

/* Title */
.tribe-events-view--list
	.tribe-events-calendar-list__event-title,
.tribe-events-view--list
	.tribe-events-calendar-list__event-title-link {
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1.35 !important;
	letter-spacing: -0.01em !important;
	white-space: normal !important;
	word-break: break-word !important;
	overflow-wrap: break-word !important;
	display: block !important;
}

/* Datetime + venue */
.tribe-events-view--list
	.tribe-events-calendar-list__event-datetime-wrapper,
.tribe-events-view--list
	.tribe-events-calendar-list__event-venue {
	color: var(--etk-muted) !important;
	font-size: 12.5px !important;
	margin-top: 4px !important;
	white-space: normal !important;
	word-break: break-word !important;
}

/* Description — hidden */
.tribe-events-calendar-list__event-description,
.tribe-events-calendar-list__event-description * {
	display: none !important;
}

/* --------------------------------------------------------------------------
 * Responsive card widths
 * -------------------------------------------------------------------------- */

@media (min-width: 600px) {
	.tribe-events-calendar-list__event-row,
	.tribe-events-calendar-list__event-row.tribe-common-g-row {
		flex: 0 0 calc(50% - 23px) !important;
		max-width: none !important;
	}
}

@media (min-width: 1024px) {
	.tribe-events-calendar-list__event-row,
	.tribe-events-calendar-list__event-row.tribe-common-g-row {
		flex: 0 0 calc(25% - 21px) !important;
		max-width: none !important;
	}
}

/* --------------------------------------------------------------------------
 * Ticketbox classic templates (shape only)
 * -------------------------------------------------------------------------- */
.ticketbox-events-list-event-content-wrapper {
	background: var(--etk-bg);
	border: 1px solid var(--etk-border-color);
	border-radius: var(--etk-radius);
	box-shadow: var(--etk-shadow);
	overflow: hidden;
	transition: transform .25s ease, box-shadow .25s ease;
}
.ticketbox-events-list-event-content-wrapper:hover {
	transform: translateY(-2px);
	box-shadow: var(--etk-shadow-hover);
}
.ticketbox_event_featured_image img {
	transition: transform .5s ease;
}
.ticketbox-events-list-event-content-wrapper:hover
	.ticketbox_event_featured_image img {
	transform: scale(1.03);
}
.ticketbox_event_date-start .event-date {
	background: rgba(255, 255, 255, 0.95);
	border-radius: var(--etk-radius-sm);
	box-shadow: 0 2px 6px rgba(0, 0, 0, .12);
	padding: 8px 10px;
}

/* --------------------------------------------------------------------------
 * Pagination + empty state
 * -------------------------------------------------------------------------- */
.tribe-events-c-nav__list-item-link,
.tribe-events-c-nav__prev,
.tribe-events-c-nav__next {
	border-radius: 999px;
	font-weight: 600;
}

.tribe-events-c-messages,
.tribe-events-notices {
	background: var(--etk-bg-soft);
	border: 1px solid var(--etk-border-color);
	border-radius: var(--etk-radius);
}