/*
	Theme Name: Hello Elementor
	Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
	Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
	Author: Elementor Team
	Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
	Version: 3.4.7
	Stable tag: 3.4.7
	Requires at least: 6.0
	Tested up to: 6.8
	Requires PHP: 7.4
	License: GNU General Public License v3 or later.
	License URI: https://www.gnu.org/licenses/gpl-3.0.html
	Text Domain: hello-elementor
	Tags: accessibility-ready, flexible-header, custom-colors, custom-menu, custom-logo, featured-images, rtl-language-support, threaded-comments, translation-ready,
*/

.elementskit-section-subtitle {
    color: #F6CF83;
    letter-spacing: 2px !important;
}

.mf-input-wrapper .mf-input {
	background-color: transparent;
}

/* 1. RESET DEFAULT LIST STYLING */
#customEventsListId ul.ecs-event-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* 2. MAIN CONTAINER GRID */
#customEventsListId .ecs-event {
    display: grid;
    grid-template-columns: 32% 1fr 28%; /* 3 Columns */
    grid-template-rows: auto auto 1fr; /* 3 Rows to handle Title, Excerpt, and Empty space */
    border: 1px solid #333;
    margin-bottom: 30px;
    background-color: #0c0c0c; /* High-end dark gray/black */
    position: relative;
    transition: border-color 0.3s ease;
}

#customEventsListId .ecs-event:hover {
    border-color: #555;
}

/* 3. IMAGE COLUMN (Force it to span full height) */
#customEventsListId .ecs-event > a {
    grid-column: 1;
    grid-row: 1 / 4; /* Spans across all 3 rows */
    display: block;
    height: 100%;
    overflow: hidden;
}

#customEventsListId .ecs-event > a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: brightness(0.7) contrast(1.1); /* Moody effect */
}

/* 4. MIDDLE CONTENT (Title & Excerpt) */
/* Fake the gold Category Tag above the title */
#customEventsListId .ecs-event .entry-title::before {
/*     content: "CLUB EVENT"; /* Edit this text as needed */ */
	content: none !important;
    display: block;
    font-family: "Montserrat", sans-serif;
    font-size: 11px;
    color: #c4a068; /* Gold */
    letter-spacing: 2px;
    margin-bottom: 12px;
    text-transform: uppercase;
}
#customEventsListId .ecs-event .entry-title::before {
    content: none !important;
}

#customEventsListId .ecs-event .entry-title {
    grid-column: 2;
    grid-row: 1;
    padding: 40px 30px 10px 40px;
    margin: 0;
    font-size: 24px;
    font-family: "Playfair Display", serif; /* Elegant Serif */
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-weight: 400;
    line-height: 1.4;
}

#customEventsListId .ecs-event .entry-title a {
    color: #ffffff;
    text-decoration: none;
}

#customEventsListId .ecs-event p.ecs-excerpt {
    grid-column: 2;
    grid-row: 2;
    padding: 0 30px 40px 40px;
    margin: 0;
    color: #888;
    font-size: 14px;
    line-height: 1.6;
}

/* 5. RIGHT COLUMN (Meta Data & Divider Line) */
/* The Vertical Line Separator */
#customEventsListId .ecs-event::before {
    content: "";
    grid-column: 3;
    grid-row: 1 / 4; /* Span full height */
    border-left: 1px solid #222;
    pointer-events: none;
}

/* Time & Date Styling */
#customEventsListId .ecs-event .duration.time {
    grid-column: 3;
    grid-row: 1;
    padding: 40px 30px 15px 40px;
    color: #a0a0a0;
    font-size: 13px;
    font-family: "Montserrat", sans-serif;
    display: flex;
    align-items: center; /* Fixes icon stacking */
    gap: 12px;
}

#customEventsListId .ecs-event .duration.time::before {
    content: "\f017"; /* Clock Icon */
    font-family: "Font Awesome 5 Free";
    font-weight: 400;
    color: #c4a068;
    font-size: 16px;
}

/* Venue/Location Styling */
#customEventsListId .ecs-event .duration.venue {
    grid-column: 3;
    grid-row: 2;
    padding: 0 30px 15px 40px;
    color: #a0a0a0;
    font-size: 13px;
    font-family: "Montserrat", sans-serif;
    display: flex;
    align-items: center; /* Fixes icon stacking */
    gap: 12px;
}

/* Hide the italic "at" text from HTML to match the clean target design */
#customEventsListId .ecs-event .duration.venue em {
    display: none; 
}

#customEventsListId .ecs-event .duration.venue::before {
    content: "\f3c5"; /* Map Marker Icon */
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color: #c4a068;
    font-size: 16px;
    padding-left: 2px;
}

/* Fake "VIEW DETAILS" Button */
#customEventsListId .ecs-event::after {
    content: "VIEW DETAILS";
    grid-column: 3;
    grid-row: 3;
    justify-self: end;
    align-self: end;
    margin: 0 40px 40px 0;
    padding: 10px 20px;
    border: 1px solid #c4a068;
    color: #c4a068;
    font-size: 11px;
    letter-spacing: 2px;
    cursor: pointer;
    transition: all 0.3s ease;
}

#customEventsListId .ecs-event:hover::after {
    background-color: #c4a068;
    color: #000;
}

/* 6. MOBILE RESPONSIVENESS (Stack vertically) */
@media (max-width: 900px) {
    #customEventsListId .ecs-event {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto auto;
    }
    #customEventsListId .ecs-event > a {
        grid-column: 1;
        grid-row: 1;
        height: 250px; /* Fixed height for image on mobile */
    }
    #customEventsListId .ecs-event .entry-title {
        grid-column: 1;
        grid-row: 2;
        padding: 30px 20px 10px 20px;
    }
    #customEventsListId .ecs-event p.ecs-excerpt {
        grid-column: 1;
        grid-row: 3;
        padding: 0 20px 20px 20px;
    }
    #customEventsListId .ecs-event::before {
        display: none; /* Hide vertical line on mobile */
    }
    #customEventsListId .ecs-event .duration.time {
        grid-column: 1;
        grid-row: 4;
        padding: 20px 20px 10px 20px;
        border-top: 1px solid #222; /* Add horizontal line instead */
    }
    #customEventsListId .ecs-event .duration.venue {
        grid-column: 1;
        grid-row: 5;
        padding: 0 20px 20px 20px;
    }
    #customEventsListId .ecs-event::after {
        grid-column: 1;
        grid-row: 6;
        justify-self: center; /* Center the button on mobile */
        margin: 10px 0 30px 0;
    }
}



@media (min-width: 768px) {
    .ekit-off-canvas-position-left .ekit-wid-con .ekit-sidebar-group.ekit_isActive .ekit-sidebar-widget {
        bottom: auto !important;
    }
}
@media (max-width: 1024px) {
    .elementor-84 .elementor-element.elementor-element-46e63ee9 img,      .elementor-84 .elementor-element.elementor-element-1f0cdc42 img {
        width: 70px;
    }
}
