@media (max-width: 550px) {
	.fb_single_page {
		pointer-events: none;
	}
	.fb_single_page::before {
		content: none !important;
	}
}
/* The listing shell is FULL-BLEED — it owns no horizontal gutter.
   Each band inside decides its own inset instead; see the BAND GUTTERS block
   further down. Width is capped by .tt-listing-shell at >= 1024px (1050px,
   centred), so no max-width is needed here.
   Previously this had `max-width: 1050px; padding: 0 15px` plus a
   `.tt-event-listing-row-channel` modifier that undid both — the modifier is
   gone now that local-channel.php no longer wraps the shortcode twice. */
.tt-event-listing-row {
    width: 100%;
    background-color: #ffffff;
    box-sizing: border-box;
}
/* Was two separate bare `.event_listing_data { }` blocks split apart in this
   file — same scattered-duplicate pattern as .event_listing_main had. Merged
   into one, and scoped to .tt-listing-shell now that the div carries the new
   class.
   No vertical padding here: this is the outer container that wraps the sticky
   day bar too, so padding-top pushed the day bar down instead of spacing the
   content. The gap under the day bar lives on #tt-event-sections instead
   (BAND GUTTERS block below). */
.tt-listing-shell .tt-listing-feed {
    width: 100%;
    min-width: 100%;
}
a.event_image:hover,
a.event_image:focus {
    all: unset; /* resets all styles */
	cursor: pointer;
}
/* custom-front-css */
.event_location_to_change_event {
    display: flex;
    align-items: center;
	gap: 4px;
}
.event_section {
    margin-top: 10px;
	margin-bottom: 20px;
}
.event_location_to_change_event select {
	background-position: right 0em top 57%;
	padding-left: 5px;
}
.location_wise_event {
	border: none;
    box-shadow: none;
}
.location_wise_event:focus {
	box-shadow: none;
}
/* custom-front-css end */
.event_location select {
	margin: 0;
}
.event_single_location select {
	color: white;
	background: #000;
    padding-right: 0;
}

@media (max-width: 1023px) {
	.dropdown-menu {
		top: 203px !important;
		left: 20px !important;
	}
}

@media (max-width: 650px) {
	.event_single_location select {
		width: 200px;
	}
	.dropdown-menu {
		top: 206px !important;
		left: 20px !important;
	}
}
@media (max-width: 550px) {
	.dropdown-menu {
		top: 193px !important;
	}
}
@media (max-width: 389px) {
	.dropdown-menu {
		top: 200px !important;
	}
}
.single_location_wise_event:focus {
	background: #000;
    color: #fff;
}
.event_location_to_change_event .dashicons-arrow-down-alt2 {
	color: #fff;
}
/* Daily Digest styles live in todo-today-assets/css/sidebar.css (.tt-digest) */
.event_group_title {
    display: flex;
    margin: 15px 0 10px 0;
	position: relative;
}
.event_time_status {
	font-size: 20px;
	color: #212121;
	font-weight: 600;
	margin: 0;
	padding-left: 15px;
}
.event_group_title::before,
.event_group_title::after {
    content: "";
    flex: 1;
    border-bottom: 1px solid #e0e0e0;
}
.event_group .event-container {
	border: 1px solid #e9e9e9;
    border-radius: 15px;
    padding: 13px;
    margin-top: 10px;
    background: #fff;
	position: relative;
	box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}

.wrap_container {
	padding-top: 20px;
}

.fb_single_page {
	color: #000000;
    border-radius: 5px;
}
.fb_single_page:hover {
	color: #55abef;
}
.fb_single_page_icon {
	line-height: 24px;
	font-weight: 500;
}
.fb_links {
	color: #ff593a;
}
.event_data {
    flex-grow: 1;
	display: flex;
	align-items: center;
}
.event-data-box li {
	margin-left: 0 !important;
}
.time_category_list {
	display: flex;
	flex-wrap: wrap;
}
.font_common_class {
	font-size: 14px;
	color: #757575;
	margin-right: 4px;
}
.event_time_list {
	display: flex;
    align-items: center;
	column-gap: 7px;
}
.editor_pick {
	color: #212121;
	background: #9c27b0;
	padding: 3px 10px;
	color: #fff;
	border-radius: 5px;
	font-size: 11px;
	font-weight: 100;
	display: inline-block;
}

.event_category_emoji {
	margin-right: 7px;
	font-size: 14px;
	min-width: 20px;
    display: inline-flex;
    justify-content: center;
    margin-right: 4px;
}
.event_same_single_page {
	display: flex;
    align-items: center;
    column-gap: 10px;
	color: #6B6F76;
}
.event_same_single_page img {
	width: 14px;
}
.lightbox-content {
	border-radius: 10px;
}

/* subscribe popup start */
.subscribe_tabs input[type="radio"] {
	display: none;
}
input[type="radio"] + label.link {
	display: block;
	margin-bottom: 0;
	line-height: 20px;
	text-align: center;
}
input[type="radio"]:checked + label.link {
	border-bottom: 2px solid #ff593a;
}
label.link {
	padding: 12px 6px;
	display: inline-block;
	cursor: pointer;
	position: relative;
	padding: 10px 25px;
}
.subscribe_tabs {
	display: flex;
	width: 100%;
	justify-content: space-between;
	border-bottom: 1px solid #e0e0e0;
	align-items: center;
}
.whatsapp_group {
	padding: 30px 0;
	display: flex;
	justify-content: space-between;
	position: relative;
}
.group_link_header {
	text-align: center;
	width: 100%;
}
.group_qr_code {
	width: 100%;
	text-align: center;
	border-left: 1px solid #e0e0e0;
}
.link_or_scan {
	position: absolute;
	right: 48%;
	top: 44%;
	padding: 5px;
	background: #fff;
}
.whatsapp_group_scaner {
	width: 200px;
	height: 200px;
}
@media(max-width: 612px) {
	label.link {
		padding: 5px 10px;
	}
	.mfp-wrap .mfp-container {
		padding: 15px;
	}
	.whatsapp_group {
		display: block;
	}
	.group_link_header {
		margin-bottom: 50px;
	}
	.group_qr_code {
		padding-top: 30px;
		border-top: 1px solid #e0e0e0;
		border-left: none;
	}
	.link_or_scan {
		top: 47%;
	}
}

/* subscribe popup end */
.back_to_home_page {
	color: #fff;
    padding: 6px 8px;
    transition: all 0.3s ease;
}
.data-entry-content-single-page {
	line-height: 33px;
	max-width: 700px;
	font-size: 14px;
	margin: 0 auto;
	color: #000000;
	border-radius: 10px;
	border: 1px solid #e9e9e9;
	overflow: hidden;
	/* box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 7px 0 rgba(0, 0, 0, 0.1); */
}
.dashicons-arrow-left-back {
	border: 1px solid;
    border-radius: 50%;
    height: 30px;
    width: 30px;
    line-height: 27px;
    font-weight: 600;
    border-width: 2px;
}
.data-entry-content-single-page .event_curren_venue {
	margin-bottom: 0;
}
.event-image-container {
	text-align: center;
	position: relative;
    width: 100%;
    height: 450px;
    display: block;
    overflow: hidden;
}
.event-image-container .lightbox-scope img {
	width: 100%;
	height: 450px;
	object-fit: cover;
}
.lb-data .lb-close {
	position: absolute;
    top: -10px;
    right: 10px;
}
@media (max-width: 850px) {
	.lb-data .lb-close {
		top: -40px !important;
	}
}
.image-overlay{
	position: absolute;
	width: 100%;
	height: 60px;
	background: #000;
	z-index: 1;
	opacity: 0.7;
}
.popup-link img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    min-height: 100%;
    object-fit: cover;
	width: 100%;
}
.single_page_data_container {
	background-color: #ffffff;
	padding: 10px 20px 20px 20px;
	line-height: 28px;
	position: relative;
}
.fb_single_page_link {
	color: #000000;
}
.fb_single_page_link:hover {
    color: #55abef;
}
.fb_icon {
	padding: 8px 0;
	font-size: 18px;
}
.more_info_detail {
	margin-left: 11px;
}
.event-image {
	max-width: 100%;
	height: auto;
	display: block;
	margin: 0 auto; /* Center the image */
}
#loader {
	position: fixed; /* fixed instead of absolute */
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: hsla(0, 3%, 7%, 0.8);
	backdrop-filter: blur(7px);
	z-index: 9999;
}
.loader-spinner {
	width: 40px;
	height: 40px;
	border: 4px solid #f3f3f3;
	border-top: 4px solid #3498db;
	border-radius: 50%;
	animation: loader-spin 1s linear infinite;
}

/* overlay page css start */
.explore-experience {
	color: #ffffff;
}
.overlay_main {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background:#212121;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 1111;
}
.overlay-content {
	padding: 30px;
	border-radius: 5px;
	z-index: 10000;
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.event-location-form {
	text-align: center;
}
.check-in-location {
	height: 55px;
    border-radius: 5px;
    margin: 0;
}
.select_check_in_location {
	display: flex;
    align-items: center;
    margin-top: 30px;
	padding: 10px;
    border-radius: 10px;
    background: #fff;
}
.check-in-button {
	width: 150px;
    text-transform: capitalize;
    height: 55px;
    border-radius: 5px;
    color: #ffffff;
    margin: 0 0 0 10px;
    background: #212121;
}
h1.explore-experience {
	font-size: 40px;
}
.event-content-wrapper {
    position: relative;
	min-height: 134px;
}
@media (max-width: 500px) {
	.event-content-wrapper {
		min-height: 120px !important;
	}
	.event-image-container-home {
		height: 140px !important;
	}
}
.parent_featured {
	position: absolute;
    width: 100%;
}
.featured_tag {
    border-radius: 15px;
    font-size: 12px;
    padding: 10px 15px;
    color: #212121;
    position: absolute;
    background-color: #fff;
    line-height: 1.2;
    margin: 10px;
	right: 0;
    font-weight: bold;
}
.single_featured_tag {
    border-radius: 10px;
    padding: 5px 15px;
    position: absolute;
    background-color: #fff;
	top: 15px;
	right: 15px;
	line-height: 2;
}
.single_featured_tag .featured-text {
	font-size: 14px;
}
.rsvp-tag {
	margin-left: 7px;
    padding: 1px 6px;
    border: 1px solid #00bcd4;
    color: #00bcd4;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
}
.featured_tag img {
	margin-left: 6px;
    margin-bottom: 2px;
}
.home_overlay_logo {
	height: 40px;
    margin-bottom: 40px;
}
.custom-tabs-wrapper {
	display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    max-width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1;
}
/* .custom-tab-none / .custom-tabs-wrapper below: dead markup on the home/
   channel page (removed from new_event_listing.php — no CSS or JS ever bound
   to #custom-tabs-wrapper there). Left in place because single-events.php
   still renders the same bare classes; that page is a separate phase. */
.custom-tab-none {
	display: none;
	position: absolute;
}
.event-categories {
	float: right;
    margin: 14px 10px;
}
.back_to_home_overlay {
	display: block;
    position: absolute;
    z-index: 1;
    float: left;
}
.back_to_home_container {
	height: 32px;
	width: 32px;
	background: #f9f9f9;
	border-radius: 50%;
	border: 1px solid #e9e9e9;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #6b6f76;
	font-size: 16px;
	margin: 15px;
	cursor: pointer;
}
.back_to_home_container:hover,
.back_to_home_container:focus-visible {
	background: #f5f5f5;
	/* border-color: #cfcfcf; */
}
body.lightbox {
    all: unset;
}
.event-category-label {
	color: #333;
    font-weight: 600;
    padding: 0px 10px;
    border-radius: 4px;
    background: #fff;
    margin: 3px;
    padding: 3px 15px;
    z-index: 1;
    position: relative;
}
.event_content_single_page p {
    margin: 0px 0 10px 0px;
	padding: 5px 0 0 0;
    line-height: 1.4;
}
.event_content_single_page {
	word-break: break-word;
}
.single_page_sepreter {
	border-top: 1px dashed #bdbdbd;
    margin: 12px 0;
}
.canceled-event-title {
    color: #aaa;
    text-decoration: line-through;
}
.pasted-event-title {
	color: #aaa;
}

.event-canceled-notice {
	background-color: #e0e0e0;
    padding: 10px;
    margin-top: 10px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    font-size: 16px;
    color: #333;
    font-weight: 600;
}

.event-canceled-notice .dashicons {
    margin-right: 8px;
}
.same_single_page {
	opacity: 0.6;
}
.event-image-container-home {
    width: 150px;
    height: 140px;
}
.event-image-container-home img {
    object-fit: cover;
	width: 100%;
	border-radius: 10px;
	height: 100%;
	border: 1px solid #e9e9e9;
}
.created_by_filter {
	color: #212121;
	font-weight: 700;
	text-transform: capitalize;
}
a.author-link {
    color: #2196f3;
    text-transform: capitalize;
}
.created-by {
	margin-bottom: 5px;
	display: flex;
    align-items: center;
    column-gap: 7px;
}
.ticket_price_related {
	display: flex;
	align-items: center;
}
.event_past_time {
	color: #888;
}
.event_curren_venue_home_page {
	display: flex;
    align-items: center;
}
.no_event {
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	margin-top: 30px;
	margin-bottom: 30px;
}
@media (max-width: 750px) {
	.event-image-container-home img {
		width: 100% !important;
        object-fit: cover;
    }
}
/* Shell layout consolidated into the RESPONSIVE SHELL block below. */
@media (max-width: 900px){
	.overlay-content {
		width: 100%;
	}
}
@media (max-width: 440px){
	.select_check_in_location {
		display: block !important;
	}
	.check-in-button {
		width: 100% !important;
		margin: 10px 0 0 0 !important;
	}
}
/* overlay page css end */

/* contact form 7 */
.wpcf7-form .apply-contact-button {
	background-color: #000;
	border-radius: 5px;
	text-transform: capitalize;
	font-weight: 600;
}
.wpcf7-form .apply-contact-input {
	font-weight: 500;
}

@keyframes loader-spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}
.date-container {
    display: flex;
    align-items: center;
    gap: 10px;
}

.date-box {
    background-color: #f4f4f4;
    border-radius: 8px;
    width: 70px;
    position: absolute;
    z-index: 1;
    bottom: 0;
    margin: 20px;
}
.share_button_container {
	display: flex;
    align-items: center;
    column-gap: 5px;
	flex-wrap: wrap;
}

.date-box .month {
    font-size: 14px;
    font-weight: bold;
    color: #333;
    text-transform: uppercase;
	background-color: #000000;
    width: 100%;
    color: #fff;
    border-radius: 5px;
	border: 1px solid #fff;
}

.date-box .day {
    font-size: 18px;
    font-weight: bold;
    color: #000; /* Black for emphasis */
}
.share-button-container {
    display: inline-block;
}
.share-button {
    display: flex;
    align-items: center;
	cursor: pointer;
	width: fit-content;
	margin: 0 !important;
}
.ticket-link {
	display: flex;
    align-items: center;
    justify-content: center;
    background-color: #212121;
    color: #fff;
    padding: 10px 15px;
    border-radius: 10px;
    height: 42px;
    cursor: pointer;
	margin: 10px 0;
}
.ticket-link:hover {
    background-color: #3a3535;
    color: #fff;
}
.get-ticket {
	margin-left: 5px;
}
.ticket-link .dashicons-tickets-alt {
	font-size: 15px;
	line-height: 18px;
}
.share-arrow {
    display: inline-block;
    font-size: 18px;
    transform: rotate(-45deg); /* Rotate arrow */
    transition: transform 0.3s ease;
}
.share-button:hover .share-arrow {
    transform: rotate(-45deg) translateX(5px); /* Move arrow on hover */
}
.single_page_title {
	display: block;
}
.single_page_related_event .event_section {
	margin-top: 0;
}
.single_page_related_event .event_group .event-container:first-child {
	margin-top: 3px;
}
@media (max-width: 480px) {
	.ticket-link {
		margin: 5px 0;
	}
}
@media (max-width: 400px){
	.editor_pick {
		margin-bottom: 10px;
	}
}
@media (max-width: 840px) {
	.data-entry-content-single-page {
		border-radius: 0 !important;
	}
	.event-image-container {
		height: 350px !important;
	}
	.event-image-container .lightbox-scope img {
		height: 350px !important;
	}
	.data-entry-content-single-page {
		max-width: 100% !important;
	}
	.back_to_home_page {
		max-width: 92% !important;
	}
	.single_page_related_event {
		max-width: 92% !important;
	}
	.single-event-page {
		padding-top: 0 !important;
	}
	.content-area .single-event-page {
		padding-bottom: 0 !important;
	}
}
@media (max-width: 550px) {
	.ticket_price_short {
		white-space: nowrap;
		width: 260px;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.single_page_related_event {
		max-width: 100% !important;
	}
    .data-entry-content-single-page {
        max-width: 100% !important;
		border: none !important;
		box-shadow: none !important;
    }
	.single_page_data_container {
		padding: 10px 15px 15px 15px !important;
	}
	.entry-content {
		padding-top: 0 !important;
		/* border-top: 1px solid #fff; */
		padding-bottom: 0.5em !important;
	}
	.single_page_related_event {
		padding: 0 10px;
	}
	.related_events {
		border-top: 1px solid #e0e0e0;
		padding-top: 12px;
	}
}
@media (max-width: 470px) {
	.ticket_price_short {
		width: 235px;
	}
}
@media (max-width: 450px) {
	.ticket_price_short {
		width: 210px
	}
}
@media (max-width: 425px) {
	.ticket_price_short {
		width: 190px
	}
}
@media (max-width: 400px) {
	.ticket_price_short {
		width: 170px;
	}
}
@media (max-width: 375px) {
	.ticket_price_short {
		width: 150px;
	}
}
@media (max-width: 350px) {
	.ticket_price_short {
		width: 130px;
	}
}

.ticket_price_short {
	color: #6B6F76;
	line-height: 1;
}
/* media end */

.overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 999;
}
.event_content_single_page a {
	color: #2196f3;
}
.event_description_preview {
	margin-top: 10px;
}

.event_content_single_page p img {
    width: 14px;
}
.fa-icon {
	font-size: 20px;
}
.fa-wp {
	color: #25D366;
}
.fa-tl {
	color: #03a9f4;
}
.flex-center {
	margin: 0 !important;
}
.nav-center {
	justify-content: left !important;
}
.featured_class {
	border: 1px solid #bdbdbdbd;
    border-radius: 5px;
}
.ticket_link_page {
	background: #000000;
    color: #fff;
    padding: 9px;
    border-radius: 3px;
	margin-right: 5px;
}
.ticket_link_page:hover {
	color: #fff;
}
.event_common_link {
	color: #212121;
    border: 1px solid #212121;
    border-radius: 3px;
	padding: 8px;
	cursor: pointer;
	background: #fff;
}
.home_page_clock {
	color: #bac7ed;
    font-size: 17px;
	width: 17px;
    display: flex;
    justify-content: center;
	line-height: 20px;
}
.home-page-admin-user {
	color: #1E88E5;
}
.home_page_font_ticket_page {
	margin-top: 3px;
}
.copy-message, .copy-text-message {
	text-align: center;
	display: none;
	margin-top: 10px;
}
.heart {
    font-size: 24px;
    cursor: pointer;
    color: #ddd; /* Blank state color */
    transition: all 0.3s ease;
}

.heart.favorited {
    color: #3f51b5; /* Filled state color */
    border-color: #3f51b5; /* Border color when filled */
}
.dropdown-menu a {
	color: #222;
}
.home-page-event-data {
	width: 100%;
	line-height: 24px;
	min-width: 0;
}
.featured-text {
	font-weight: 600;
	/* font-size: 15px; */
	/* margin-left: 5px; */
}
.share_event {
    position: absolute;
    right: 0;
    width: 24px;
    height: 24px;
    background: #f5f5f5;
    top: 8px;
    left: 8px;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
	cursor: pointer;
	opacity: 0.8;
}
img.share-icon {
    width: 18px;
    height: 18px;
}
.header-bottom .flex-row {
	margin: 0 auto;
    max-width: 1000px;
}
.single_page_location {
    display: block !important;
    margin-left: 54px;
    margin-top: -25px;
}
@media (max-width: 550px) {
    .single_page_location {
		margin-left: 67px !important;
        margin-top: -25px !important;
    }
}
.flex-row .flex-center {
	margin: 0 !important;
}
.event_location_desktop {
	display: none;
}
.custom-dropdown {
    position: relative;
    width: 100%;
    max-width: 300px; /* Adjust width as needed */
}
.dropdown-selected {
	background: #000;
    padding: 8px 40px 0 5px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
	font-size: 14px;
}
.selected-location {
	color: #fff;
}
.dropdown-arrow {
    position: absolute;
    right: 10px;
    color: #fff;
    transition: transform 0.3s ease;
}
.dropdown-options {
	position: absolute;
	width: max-content;
	background: #fff;
	border-top: none;
	border-radius: 10px;
	list-style: none;
	padding: 8px !important;
	margin: 0;
	display: none;
	z-index: 10;
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 7px 0 rgba(0, 0, 0, 0.1);
	line-height: 22px;
}
.dropdown-options li {
    padding: 5px 10px;
    cursor: pointer;
    transition: background 0.3s ease;
}
.dropdown-options li:hover {
	color: #212121;
}
@media (max-width: 450px) {
    .header-button-2, .header-button-1 {
		font-size: 12px !important;
	}
}
ul.dropdown-options li {
    margin: 0;
    padding: 5px 50px 5px 20px;
    color: #757575;
    font-size: 14px;
}
ul.dropdown-options li:last-child {
    border-bottom: none;
}
ul.dropdown-options span {
	display: block;
    margin-top: 3px;
    font-size: 14px;
    font-weight: 600;
    opacity: 1;
    padding: 0 5px;
    color: #757575;
}
ul.dropdown-options span:first-child {
    margin-top: 0;
}
.dashicons-admin-users {
	color: #212121;
}
@media (max-width: 550px) {
	.featured_short_title {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
		text-overflow: ellipsis;
		max-width: 100%;
		line-height: 1.4;
		word-break: keep-all;
	}
}
@media (max-width: 550px) {
	.required-text {
		display: none;
	}
}

.card-time-display {
	display: -webkit-box !important;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	overflow: hidden;
	text-overflow: ellipsis;
	word-break: keep-all;
	line-height: 1;
}
/* Tooltip container */
.tooltip {
    position: relative;
}

/* Show tooltip only if text is truncated */
.tooltip::before {
    content: attr(data-tooltip);
    visibility: hidden;
    color: #fff;
    text-align: center;
    padding: 8px 10px;
    border-radius: 5px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 130%;
    width: max-content;
    max-width: 300px;
    white-space: normal;
    z-index: 100;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
    font-size: 14px;
    font-weight: 500;
}

/* Tooltip arrow */
.tooltip::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-width: 6px;
    border-style: solid;
    border-color: #333 transparent transparent transparent;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

/* Show tooltip only if text is truncated */
.tooltip:hover::before,
.tooltip:hover::after {
	opacity: 1;
}
.home_same_icon {
	display: flex;
	justify-content: center;
	font-size: 13px;
	color: #757575;
	width: 14px;
	margin: 0 8px 0 0;
}
.event_location_icon {
	font-size: 14px;
}
.featured_title {
	font-weight: bold;
}
span.event_time_date{
	font-size: 14px;
	color: #6B6F76;
	display: flex;
	align-items: center;
	margin-bottom: 10px;
}
.single_page_related_event {
	max-width: 700px;
    margin: 0 auto 20px;
}
.related_events {
	color: #212121;
	font-weight: 600;
	font-size: 18px;
	padding-left: 13px;
	margin: 0;
}

/* Hide default select box */
.event_dateSelect {
    display: none;
}
/* Custom button styling */
.dropdown-btn {
	background-color: #212121 !important;
    color: #fff !important;
	background: white;
    border-radius: 8px;
    padding: 0 13px;
    font-size: 16px;
    border: 1px solid #212121;
    cursor: pointer;
	width: max-content;
    gap: 7px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 400;
    text-transform: capitalize;
}
/* Dropdown menu styling */
.dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: white;
    border-radius: 10px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
    list-style: none;
    padding: 10px 0;
    margin: 5px 0 0;
    min-width: 150px;
	z-index: 11;
	width: max-content;
}
/* Dropdown menu items */
.dropdown-menu li {
    cursor: pointer;
    font-size: 14px;
	padding-right: 15px;
	margin-left: 1.3em;
}
.dropdown-menu li:last-child {
	margin-bottom: 0;
}
/* Hover effect */
.dropdown-menu li:hover {
    color: #212121;
}
.dropdown-arrow-filter {
	font-size: 16px;
    margin-top: 6px;
	color: #000;
}
.search-icon {
    position: absolute;
    right: 10px;
    top: 20px;
    transform: translateY(-50%);
    color: #e0e0e0;
    pointer-events: none;
}
input.category-search-input {
    box-shadow: none !important;
    border: 1px solid #e0e0e0 !important;
	border-radius: 5px !important;
}
/* Category checkboxes */
.category-options {
    display: grid;
    grid-template-columns: repeat(2, auto);
    gap: 10px;
}

@media (max-width: 600px) {
	.category-options {
		grid-template-columns: repeat(1, 1fr) !important;
	}
	.single_featured_tag {
		top: auto !important;
		bottom: 15px !important;
		left: 15px !important;
		right: auto !important;
	}
	.ticket-link {
		width: 100%;
	}
}

/* Styling for each label */
.category-options label {
	display: flex;
    align-items: center;
    cursor: pointer;
    font-size: 14px;
    font-weight: 400;
}

/* Styling for checkboxes */
.category-options input[type="checkbox"] {
	margin: 0;
    margin-right: 10px;
}
/* category filter design end */
.logout_link {
	margin-left: 2px;
}

/* venue filter dropdown start */
.venue-custom-dropdown {
	position: relative;
	width: 200px;
}
.dropdown-arrow {
	transition: transform 0.3s ease;
}
.dropdown-body {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    display: none;
    padding: 10px;
}

/* Search input field */
.search-input {
    width: 100%;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 14px;
    margin-bottom: 8px;
    outline: none;
}

/* List of options */
.options-list {
    max-height: 200px;
    overflow-y: auto;
    list-style: none;
    padding: 0;
    margin: 0;
    background: white;
    border-radius: 5px;
}

.options-list li {
    padding: 4px 12px;
    cursor: pointer;
    font-size: 14px;
    transition: background 0.3s;
    text-align: left;
	margin-left: 0 !important;
}

.options-list li:hover {
    background: #f4f4f4;
}
.selected-item {
    background: #007bff;
    color: white;
    padding: 6px 10px;
    border-radius: 4px;
    display: flex;
    align-items: center;
}

.selected-item .remove-item {
    margin-left: 8px;
    cursor: pointer;
    color: #ff6666;
    font-weight: bold;
}

.selected-item .remove-item:hover {
    text-decoration: underline;
}
/* venue filter dropdown end */

.back_to_home_no_image {
	float: none;
	margin: 15px 4px 0;
}
.telegram-link {
	background-color: #31a3d9;
}
.telegram-link:hover {
	background-color: #31a3d9;
}
.whatsapp-link {
	background-color: #28af3e;
}
.whatsapp-link:hover {
	background-color: #28af3e;
}
.facebook-link {
	background-color: #096cff;
}
.facebook-link:hover {
	background-color: #096cff;
}

.ticket-share, .ticket-share:hover {
	background: #fff;
    color: #212121;
    /* border: 1px solid #9e9e9e; */
}
.event_location_list {
	margin-top: 5px;
}
.event_location_list li {
	margin-left: 0 !important;
}
.drop-down-filter-location {
    padding: 0 34px 0 15px;
    background: #ffff;
    border-radius: 15px;
	width: max-content;
}
.drop-down-location {
	color: #000;
}
.drop-down-filter-content {
	display: contents;
}
.google_calender_link {
	border: 1px solid #9e9e9e;
    border-radius: 5px;
}
.gcal_link {
	display: flex;
    align-items: center;
    gap: 5px;
    padding: 3px 10px;
	color: #212121;
}
.gcl_icon {
	font-size: 17px;
}
.gcal_link.disabled {
    background: #ccc;
    color: #666;
    text-decoration: none;
    pointer-events: none;
    cursor: not-allowed;
}
.gcal_home_link {
	display: inline-block;
    padding: 6px 8px 5px 8px;
    /* border: 1px solid #212121; */
    border-radius: 3px;
}
.mobile-menu {
	/* margin-left: 5px; */
	display: none;
	cursor: pointer;
}
.share_event_link_desktop {
	padding: 8px 0;
}
.divider {
	color: #212121;
}
@media (max-width: 500px) {
	.share_event{
		top: 124px;
		right: 8px;
		left: auto;
	}
}
@media (min-width: 501px) and (max-width: 600px) {
	.share_event {
		top: 132px;
		right: 8px;
		left: auto;
	}
}
@media (max-width: 600px) {
	.desktop-only {
		display: none !important;
	}
	.mobile-menu {
		display: inline-block;
		padding: 6px 10px 4px 10px;
	}
	.event-image-container-home {
		width: 130px !important;
	}
	.event-image-container-home img {
		height: 100% !important;
		/* border-radius: 10px 0px 0px 10px !important; */
	}
	.featured_tag {
		width: 100% !important;
	}
	.event-image-container-home.event_data_higlight_img {
		width: 100% !important;
		height: 230px !important;
	}
	.featured_tag {
		width: 100% !important;
		position: absolute;
		top: 0;
		margin: 0;
		border: none !important;
		border-radius: 5px 0 0 0;
		text-align: center;
		padding: 10px 15px !important;
	}
	.featured-text {
		font-size: 12px !important;
	}
	.event_data_higlight_box .featured_tag {
		width: max-content !important;
		margin: 10px;
		border-radius: 15px;
		padding: 7px;
		left: 0 !important;
	}
	.tag_container {
		display: none !important;
	}
	.home-page-tooltip {
		display: none !important;
	}
}
@media (max-width: 500px) {
	.event-image-container-home img {
		height: 100% !important;
		/* border-radius: 10px 0px 0px 10px !important; */
	}
	.event-image-container-home {
		width: 130px !important;
	}
	.featured_tag {
		width: 100% !important;
	}
	.event_time_status {
		padding-left: 0 !important;
		font-size: 18px !important;
	}
}
.calendar-wrapper {
	position: relative;
	display: inline-block;
}
.button_info {
	cursor: pointer;
	color: #1c7ce2;
}
.mobile-dropdown {
	position: absolute;
	width: max-content;
    top: 100%;
    left: 0;
    background: #fff;
    border-radius: 10px;
    padding: 8px;
	margin-top: 5px;
    display: none;
    z-index: 10;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1), 0 3px 7px rgba(0, 0, 0, 0.1);
}
.mobile-dropdown div {
	margin: 0 5px 5px 5px;
	font-size: 13px;
}
.mobile-dropdown div:last-child {
	margin-bottom: 0;
}
.add-calender-desktop {
	display: inline-block;
}

.add-calender-desktop-single {
	/* border: 1px solid #9e9e9e; */
    padding: 3px 10px;
    border-radius: 5px;
	display: flex;
}
.download-link {
	cursor: pointer;
}
.mobile-dropdown-single-page div {
	margin-bottom: 0;
}
.gcal_link_option {
	color: #757575;
}
.event_image {
	color: #757575;
}

.event_tooltip {
    position: relative;
    cursor: pointer;
    display: inline-block;
}
.events_note {
    color: #000;
}
.event_tooltip:hover::before, .event_tooltip:hover::after {
    opacity: 1;
    visibility: visible;
}
.event_tooltip_pre_reg::before {
    max-width: 250px;
}
.event_tooltip::before {
    content: attr(data-tooltip);
    position: absolute;
    left: 100px;
    top: 27px;
    transform: translateX(-50%);
    background-color: #333;
    color: #fff;
    padding: 10px;
    border-radius: 4px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s;
    width: max-content;
    max-width: 380px;
    text-align: left;
    z-index: 1111;
    font-size: 14px;
    line-height: 1.4;
}
.info_icon {
    color: #000;
}
.common_info_icon {
    font-size: 16px !important;
}
.location_tooltip {
	padding-top: 4px;
}
.common_info_single_page {
	margin-top: 7px;
}
.event_tooltip_pre_reg::after {
    left: 40%;
}
.event_tooltip::after {
    content: '';
    position: absolute;
    left: 22%;
    border-width: 6px;
    border-style: solid;
    border-color: transparent transparent #333 transparent;
    z-index: 0;
    top: 15px;
    rotate: unset;
    visibility: hidden;
    opacity: 0;
}
.event_tooltip_rsvp::before {
	left: 50px;
}
.dashicons-testimonial {
	margin-top: 3px;
	font-size: 18px;
}
.testimonial-single-page {
	margin-top: 5px;
}
.home_page_location .drop-down-filter-location {
    background: #000;
    font-size: 14px;
    padding-left: 0;
}
.home_page_location .drop-down-location, .home_page_location .dropdown-arrow-filter {
	color: #fff;
}
.home_page_location .dropdown-arrow-filter {
	font-size: 14px
}
/* ─────────────────────────────────────────────────────────────────────
 * RESPONSIVE SHELL — sidebar + feed
 * Single breakpoint: 1024px (matches the design prototype).
 *
 * Mobile/tablet (< 1024): one column. .event_sidebar uses `display: contents`
 * so its children join this grid directly — the hero moves above the feed and
 * the Daily Digest below it, with no duplicated markup.
 *
 * Desktop (>= 1024): two columns — 300px sidebar + feed capped at 750px,
 * centred inside 1050px.
 * ───────────────────────────────────────────────────────────────────── */
.tt-listing-shell {
	display: grid;
	grid-template-columns: 1fr;
	grid-template-areas:
		"hero"
		"content"
		"digest";
	gap: 15px;
}
.tt-listing-shell > .event_sidebar { display: contents; }
.tt-listing-shell .tt-hero           { grid-area: hero; }
.tt-listing-shell .tt-listing-feed { grid-area: content; min-width: 0; }
.tt-listing-shell .tt-digest { grid-area: digest; }

@media (min-width: 1024px) {
	.tt-listing-shell {
		grid-template-columns: 300px minmax(0, 750px);
		grid-template-areas: none;
		justify-content: center;
		max-width: 1050px;
		margin-inline: auto;
		gap: 0;
	}
	/* Restore the sidebar box so it becomes the left column again, and stick
	   it under the fixed header while the feed scrolls. */
	/* Sticky under the fixed header. `top` is viewport-relative, so it must equal
	   the header's bottom edge: 60px (.tt-desktop-header height, todo-core), or
	   92px when the 32px WP admin bar pushes the header down.
	   NB: this only works while no ancestor creates a scroll container — see the
	   `overflow-x: clip` note on #wrapper in the theme's theme-base.css. */
	.tt-listing-shell > .event_sidebar {
		display: block;
		position: sticky;
		top: 60px;
		align-self: start;
		max-height: calc(100vh - 60px);
		overflow-y: auto;
		scrollbar-width: thin;
	}
	body.admin-bar .tt-listing-shell > .event_sidebar {
		top: 92px;
		max-height: calc(100vh - 92px);
	}
	.tt-listing-shell .tt-hero,
	.tt-listing-shell .tt-digest,
	.tt-listing-shell .tt-listing-feed { grid-area: auto; }
	/* Hero sizing/spacing is owned by sidebar.css (.tt-hero). */

	/* Column divider — full row height, down to the footer.
	   NOT a border on .event_sidebar: that box is only as tall as its own
	   content (align-self: start, above), so its border stopped wherever the
	   sidebar's content ended — well short of the feed on any day with more
	   events than the sidebar is tall.
	   NOT a background-image on the grid container either: tried that first,
	   but .tt-daybar-wrap has an opaque background (position: sticky, so it
	   needs one) and sits flush at this same column boundary — its background
	   painted over the container's background-image for the day bar's height,
	   showing as a broken/gapped line right at the top of the page.
	   A border on .tt-listing-feed's own box is immune to both problems: a
	   border paints at the box's outer edge, outside where children can ever
	   paint, and .tt-listing-feed (day bar + event sections) is reliably the
	   taller of the two columns in practice. */
	.tt-listing-shell .tt-listing-feed {
		border-left: 1px solid var(--tt-border, #e5e5e5);
	}
}

/* ─────────────────────────────────────────────────────────────────────
 * BAND GUTTERS — who owns the horizontal inset
 *
 * The page shell used to own it: .row-main (theme-base.css) puts a gutter on
 * the whole route, so the hero band and the day bar were inset along with the
 * cards. The design wants those two edge-to-edge on mobile.
 *
 * So the outer row goes full-bleed and each band declares its own inset:
 *
 *   .tt-hero            full-bleed  (sticky brand band, needs the screen edge)
 *   .tt-daybar          full-bleed  (self-pads internally, see tt-cards.css)
 *   #tt-event-sections  gutter      ← the events list
 *   #tt-active-chips    gutter
 *   .tt-digest          gutter on mobile only — on desktop it lives inside
 *                       .event_sidebar, which already owns its own padding
 *                       (sidebar.css); adding a second gutter there would
 *                       double up against the sidebar's padding-right.
 *
 * Adding a band later means picking one of those two behaviours — no reaching
 * up the tree to undo a parent's padding.
 *
 * Both padding-left and padding-right are unconditional (all sizes). */
.tt-listing-shell #tt-event-sections,
.tt-listing-shell #tt-active-chips {
	padding-left: var(--tt-gutter, 15px);
	padding-right: var(--tt-gutter, 15px);
}
/* The "gap under the day bar" lives here, not on the outer .tt-listing-feed
   (see the comment there) — matches Lovable's pt-4 wrapping the sections
   specifically, after the day bar/search/filter-chip row. */
.tt-listing-shell #tt-event-sections {
	padding-top: 15px;
}

@media (max-width: 1023px) {
	/* The grid gap would otherwise read as uneven spacing between full-bleed
	   bands and inset ones; bands carry their own vertical rhythm. */
	.tt-listing-shell {
		gap: 0;
	}

	/* Tablet: cap the single column at --tt-single-col-max and center it, so
	   cards keep their phone proportions instead of stretching edge to edge.
	   The sticky bands cap themselves to the same width (hero: sidebar.css,
	   day bar cluster: tt-cards.css). No effect on phones. */
	.tt-listing-shell #tt-event-sections,
	.tt-listing-shell #tt-active-chips {
		width: 100%;
		max-width: var(--tt-single-col-max, 600px);
		margin-inline: auto;
	}

	.tt-listing-shell .tt-digest {
		padding-left: var(--tt-gutter, 15px);
		padding-right: var(--tt-gutter, 15px);
		/* width instead of side margins (the old margin-left/right 15px):
		   same 15px inset on phones, but lets margin-inline:auto center the
		   capped box on tablets. The -30px mirrors that inset. */
		width: calc(100% - 30px);
		max-width: calc(var(--tt-single-col-max, 600px) - 30px);
		margin-inline: auto;
		/* Restore the vertical rhythm the grid gap was providing. */
		margin-top: 15px;
	}
}
.event_dateSelect {
    margin: 0;
    /* border: none; */
    background-color: #fff;
    box-shadow: none;
    border-radius: 10px;
    color: #000;
    font-size: 14px;
}
.event_dateSelect:focus {
	background-color: #fff;
	box-shadow: none;
}
.drop-down-today {
	color: #fff !important;
}

.content-area .single-event-page {
	padding-bottom: 17px;
}
.single-event-page .home_same_icon {
	margin-left: 1px;
}
.single-event-page {
	padding-top: 15px;
}
@media (min-width: 600px) {
	.desktop-button {
		background: #000;
		color: #fff;
		padding: 3px 9px;
		border-radius: 3px;
	}
	.desktop-button:hover {
		color: #fff;
	}
	.share_event_link_desktop {
		border: 1px solid #9e9e9e;
		color: #212121;
		padding: 3px 9px;
		border-radius: 3px;
	}
	.divider_mobile_only {
		display: none;
	}
	.has-ticket {
		margin-bottom: 0;
	}
}
.single_page {
	margin-top: 10px;
}

.hidden-event {
	display: none;
}
.event_content_single_page ul {
	padding-left: 20px;
	margin-bottom: 0;
}
.event_content_single_page li {
	margin-bottom: 0;
}

.btn-label-single-page {
	display: flex;
	padding: 0 8px;
	border-radius: 10px;
	font-size: 13px;
	font-weight: 600;
	margin-right: 8px;
	color: #fff;
	white-space: nowrap;
	margin-top: 5px;
	align-items: center;
}
.home-page-event-data .btn-label-single-page {
	border-radius: 5px;
}
.recurring-span {
	border: 1px solid #bdbdbd;
    border-radius: 5px;
    padding: 0px 8px;
    display: inline-block;
    margin-top: 5px;
	background-color: #ffffff;
}
.common-tag {
	background-color: #3f51b5;
    color: #fff;
    border: 1px solid #3f51b5;
    opacity: 0.8;
}
.walk-in {
    background-color: #edffd7;
    color: #222;
    border: 1px solid #c6f0bb;
}
.default {
    background-color: #aaa;
}
.tag_wrapper {
    position: relative; /* Ensure this wraps .tag_container */
    width: 100%; /* Full width of the parent */
    overflow: hidden; /* Prevent parent scroll interference */
}

.tag_container {
	display: flex;
	gap: 8px;
	position: absolute;
	margin: 8px;
	bottom: 0;
	left: 0;
	right: 0;
	overflow-x: auto;   /* enable horizontal scroll */
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none; /* firefox */
	-ms-overflow-style: none; /* ie */
	cursor: grab;
	white-space: nowrap;
	/* no touch-action set here so mobile native swipe still works */
}
.tag_container,
.tag_container * {
    user-select: none;       /* Standard */
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none;     /* IE/Edge */
}
/* hide webkit scrollbar */
.tag_container::-webkit-scrollbar { display: none; }

/* tag chips */
.tag-item {
  background: #fff;
  border: 1px solid #212121;
  border-radius: 5px;
  padding: 2px 10px;
  font-weight: 600;
  font-size: 12px;
  color: #212121;
  white-space: nowrap;  /* keep single line */
  flex-shrink: 0;       /* don't shrink, force overflow */
  opacity: 0.8;
}
.highlighted_events_group {
  display: flex;              /* make children inline-flex slides */
  gap: 16px;   
  scroll-behavior: smooth;    /* smooth animated scroll */
  align-items: flex-start;
  width: 100%;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
}
.highlighted_events_group > .event_data_higlight_container{
  flex: 0 0 calc(50% - 8px);  /* 2 slides per view (subtract half gap) */
  box-sizing: border-box;
  min-width: calc(50% - 8px);
  padding: 0;
  height: 325px;
}
.event_data_higlight_container {
	padding: 1px 1px 5px 1px;
}
.event_data.event_data_higlight {
    flex-direction: column;
	align-items: normal;
}
.event-image-container-home.event_data_higlight_img{
	width: 100%;
	height: 230px;
}
.home-page-event-data.event_data_higlight_event_data{
	margin: 0;
	padding: 13px;
	background-color: #ffffff;
	margin-top: -20px;
	border-radius: 15px;
	position: relative;
}
.event_data_higlight_box{
	height: 100%;
    border: 1px solid #e9e9e9;
    border-radius: 15px;
    background: #fff;
	box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}
/* Highlights Slider */
.highlights-slider { position: relative; width: 100%;}
.highlights-slider .hs-viewport { overflow: hidden; }
.highlights-slider .hs-track {
  display: flex;
  transition: transform 420ms ease;
  gap: 16px;
  will-change: transform;
}
.hs-track > * {
  flex: 0 0 auto; /* ensure slides keep their intrinsic width */
}

/* keep existing two-per-view behavior for normal state */
.highlights-slider .hs-slide {
  flex: 0 0 calc(50% - 8px);
  box-sizing: border-box;
}
.hs-slide.single_event_highlighted{
  flex: 0 0 calc(100% - 8px);
  max-width: 399.95px;
}

/* on mobile keep 1-per-view */
@media (max-width: 767px) {
  .highlights-slider .hs-slide { flex: 0 0 100%; max-width: none; margin: 0; }
  .highlights-slider.single-event .hs-slide { max-width: 100%; }
}
.highlights-slider .hs-slide > .event-container,
.highlights-slider .hs-slide > .event_data_higlight_container {
  width: 100%;
  height: 100%;
  position: relative;
}

.highlights-slider .hs-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ccc;
  margin: 0 4px;
  cursor: pointer;
  display: none;
}
.highlights-slider .hs-dot.active { background: #333; }

/* Responsive: 1 per view under 768px */
@media (max-width: 767px) {
  .highlights-slider .hs-slide { flex: 0 0 100%; }
}
/* Make sure hidden events don't influence slider widths */
.hidden-event { display: none !important; }
.hs-slide .hidden-event { display: none !important; }

/* If your filter toggles a class on .hs-slide itself, ensure it's hidden too */
.hs-slide.hidden { display: none !important; }
/* cursor feedback for dragging */
.tag_container.dragging { cursor: grabbing; }
/* No margin-top on the hero below 1024px — it's the sticky brand band and must
   sit flush against the top of the viewport (see .tt-hero in sidebar.css). */

@media (max-width: 500px) {
	/* .event_group .event-container{
		padding: 0;
	} */
	.home_same_icon {
		font-size: 13px !important;
		height: 14px !important;
		width: 14px !important;
	}
	/* .event-box .event-box-title-facilitator {
		margin-bottom: 0 !important;
		margin-top: 2px !important;
	} */
	.font_common_class {
		font-size: 12px !important;
	}
	.event_time_date {
		font-size: 12px !important;
	}
	.home_page_font_ticket_page {
		font-size: 12px !important;
	}
	.event-image-container-home {
        width: 130px !important;
    }
	.event-image-container-home.event_data_higlight_img{
		width: 100% !important;
	}
	.event-image-container-home img {
		 height: 100% !important;
        /* border-radius: 10px 0px 0px 10px !important; */
	}
	.btn-label-home-page{
		font-size: 11px;
	}
	.tooltip-text {
		max-width: 110px !important;
	}
	.home-page-event-data {
		line-height: 22px;
		word-break: break-all;
	}
	.home-page-event-data .recurring-icon {
		width: 11px !important;
		height: 11px !important;
	}
	.home-page-event-data .recurring-span {
		font-size: 11px !important;
		padding: 0 5px !important;
	}
	.single-event-page .recurring-icon {
		width: 13px !important;
		height: 13px !important;
	}
	.home-page-event-data .btn-label-single-page {
		margin-right: 5px !important;
		padding: 0 5px !important;
	}
}
@media (max-width: 400px) {
    .event-image-container-home {
        width: 130px !important;
    }
	.event-image-container-home.event_data_higlight_img{
		width: 100% !important;
	}
	.event-image-container-home img {
        height: 100% !important;
        /* border-radius: 10px 0px 0px 10px !important; */
    }
	.featured_tag {
		font-size: 12px !important;
		width: 100% !important;
	}
}
@media (max-width: 365px) {
	.btn-label-home-page {
		margin-right: 5px !important;
		padding: 0 5px !important;
	}
}
@media (max-width: 550px) {
	.event_category_emoji {
		margin-right: 9px !important;
	}
	.event_location_desktop {
		display: none !important;
	}
	.location_wise_event_mobile, .location_wise_event_mobile:focus {
		background: #000;
		color: #fff;
	}
	.header-bottom-nav {
		margin-left: -13px !important;
	}
	.nav-icon a {
		color: #fff !important;
	}

	.back_to_home_container {
		font-size: 14px !important;
	}
}

.event-image-container-home.event_data_higlight_img img{
	border-radius: 15px 15px 0 0 !important;
}
.home-page-event-data .recurring-text {
	margin: 0;
}

.recurring-span {
	position: relative;
	display: inline-block;
	cursor: pointer;
	color: #212121;
	font-size: 12px;
	width: max-content;
}
.tooltip-text {
	visibility: hidden;
	width: max-content;
	max-width: 250px;
	background-color: #000;
	color: #fff;
	text-align: left;
	padding: 10px;
	border-radius: 6px;
	position: absolute;
	z-index: 1000;
	top: 140%;
	left: 50%;
	transform: translateX(-50%);
	opacity: 0;
	transition: opacity 0.3s;
	white-space: normal;
	font-size: 13px;
	line-height: 19px;
}
.tooltip-text::after {
	content: "";
	position: absolute;
	bottom: 100%;
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: transparent transparent #000 transparent;
}
.recurring-span:hover .tooltip-text {
	visibility: visible;
	opacity: 1;
}
.home_page_font {
	color: #616161;
	margin-bottom: 13px;
	display: flex;
    flex-wrap: wrap;
}
.daily_intro {
	color: #212121;
    font-size: 14px;
    margin: 0 15px;
    border-top: 1px solid #e0e0e0;
    padding-top: 10px;
	line-height: 20px;
}
.daily_intro_hr {
	color: #e0e0e0;
	opacity: 1;
	margin: 5px 15px;
}
.recurring-text {
	margin: 0 5px 0 0;
	font-weight: 600;
}
.recurring-single-span {
	border-radius: 10px;
	padding: 0 10px;
}
.recurring-icon {
	width: 14px;
	height: 14px;
}
.share_event_top_picks {
    right: 8px;
    left: auto;
}
.featured_tag_top_picks {
    left: 0px;
    right: auto;
	height: 28px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-size: 13px !important;
}

.ticket_link_section {
	margin-top: 5px;
}


.new_featured_tag {
	padding: 5px;
	text-align: center;
	width: 100%;
	position: absolute;
	border-radius: 10px 10px 0 0;
    top: 0;
}

.new_home_featured_tag {
	display: none;
	padding: 5px 0;
	text-align: center;
	width: 100%;
	position: absolute;
	border-radius: 10px 10px 0 0;
    top: 0;
	font-size: 12px;
}


.single-page-title-margin {
	margin-top: 0px !important;
}

@media (max-width: 550px) {
  .todo-end-time {
    display: none;
  }
}

.todo-divider {
	height: 1px;
    width: auto;
    background: #e9e9e9;
    display: block;
    margin: 0 5px;
}

.single-event-page-main {
	background-color: #f9f9f9 !important;
}

/* Default (Desktop) */
.event-card-desktop-title {
	display: block !important;
}

.event-card-mobile-title {
	display: none !important;
}

/* Mobile View */
@media (max-width: 600px) {
	.event-card-desktop-title {
		display: none !important;
	}

	.event-card-mobile-title {
		display: block !important;
	}
}

/* Default: desktop */
.tt-mobile-only {
	display: none !important;
}

.tt-desktop-only {
	display: inline !important;
}

/* Mobile */
@media (max-width: 600px) {
	.tt-mobile-only {
		display: inline !important;
	}
	.tt-desktop-only {
		display: none !important;
	}

	.featured_tag_top_picks {
		font-size: 12px !important;
	}
}

/* ─────────────────────────────────────────────────────────────────────
 * END-OF-FEED CARD
 * Closes the day's feed with a link to the next day (days 1–6 of the 7-day
 * window) or, on the last day, a pointer at the retreats search.
 * Rendered by todo-today-assets/js/tt-home-app.js renderEndOfFeed().
 *
 * Lives here, not in tt-cards.css (event cards only) and not in tt-ui.css
 * (cross-page primitives): no other page has a "next day", so this is
 * home/channel-only page furniture.
 * ───────────────────────────────────────────────────────────────────── */
.tt-endcard {
	margin: 20px 0;
	padding: 24px;
	border-radius: 24px;
	background: var(--tt-secondary, #f4f4f5);
	text-align: center;
	box-sizing: border-box;
}
.tt-endcard__title {
	margin: 0;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--tt-foreground, #09090b);
}
.tt-endcard__sub {
	margin: 6px 0 0;
	font-size: 14px;
	line-height: 1.4;
	color: var(--tt-muted-foreground, #666666);
}
/* !important because this <button> sits inside #tt-app, where the BUTTON RESET
   in tt-cards.css matches it via `#tt-app button[type="button"]`. An author
   !important declaration outranks any non-important one regardless of
   specificity, so this holds no matter which stylesheet loads first. */
.tt-endcard__btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	margin: 20px 0 0 !important;
	padding: 12px 24px !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: var(--tt-primary, #171717) !important;
	color: var(--tt-primary-foreground, #ffffff) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	text-decoration: none !important;
	cursor: pointer !important;
	transition: background-color .15s ease, transform .15s ease !important;
}
.tt-endcard__btn:hover {
	background: #2d2d2d !important;
	color: var(--tt-primary-foreground, #ffffff) !important;
}
.tt-endcard__btn:active { transform: scale(.96); }
.tt-endcard__btn svg { width: 16px; height: 16px; flex: none; }

/* ─────────────────────────────────────────────────────────────────────
 * CATEGORY CHIP BAR
 * Horizontal single-select category filter under the day bar, rendered by
 * todo-today-assets/js/tt-home-app.js renderCategoryChips() from the API's
 * filters.categories (already scoped to the viewed day). Sits INSIDE
 * .tt-daybar-wrap so it sticks together with the bar — but keeps its own
 * white background even in the bar's pinned dark state (decided design).
 * Home/channel page only, hence this file.
 * ───────────────────────────────────────────────────────────────────── */
.tt-catbar {
	background: var(--tt-background, #ffffff);
	border-bottom: 1px solid var(--tt-border, #e5e5e5);
}
.tt-catbar__track {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px var(--tt-gutter, 15px);
	overflow-x: auto;
	scrollbar-width: none;      /* Firefox */
	-webkit-overflow-scrolling: touch;
}
.tt-catbar__track::-webkit-scrollbar { display: none; }

/* Chips are <button>s inside #tt-app, so the BUTTON RESET in tt-cards.css
   (`#tt-app button[type="button"]`) matches them — !important on the visual
   properties, same defence as every other button component. */
.tt-catbar__chip {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	flex: none !important;
	padding: 8px 14px !important;
	border: 1px solid #f5f5f5 !important;
	border-radius: 999px !important;
	background: var(--tt-secondary, #f4f4f5) !important;
	color: var(--tt-foreground, #09090b) !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	white-space: nowrap !important;
	cursor: pointer !important;
	transition: background-color .15s ease, border-color .15s ease, color .15s ease !important;
}
.tt-catbar__chip:hover {
	background: var(--tt-background, #ffffff) !important;
	border-color: #f5f5f5 !important;
	color: var(--tt-foreground, #09090b) !important;
}
.tt-catbar__chip.is-active {
	background: var(--tt-primary, #171717) !important;
	border-color: var(--tt-primary, #171717) !important;
	color: var(--tt-primary-foreground, #ffffff) !important;
}
.tt-catbar__chip.is-active:hover {
	background: #2d2d2d !important;
}
.tt-catbar__icon,
.tt-catbar__icon svg {
	width: 16px;
	height: 16px;
	display: inline-flex;
	flex: none;
}
.tt-catbar__emoji {
	font-size: 15px;
	line-height: 1;
	flex: none;
}