/**
 * Events: Additive Styles
 *
 * Base grid/card CSS lives in style.css (.grid-container, .grid-inner, etc.).
 * This file adds event-specific overrides and enhancements only.
 *
 * @package Canvas
 * @since 1.0.0
 */

/* ── Custom Properties ──────────────────────────────────────────── */

:root {
	--cnvs-event-meta-color: #666;
	--cnvs-event-meta-icon-color: #999;
	--cnvs-event-badge-bg: #333;
	--cnvs-event-badge-color: #fff;
	--cnvs-event-card-radius: 0.5rem;
	--cnvs-event-separator: rgba(0, 0, 0, 0.07);
}

/* ── Event Meta Info ────────────────────────────────────────────── */

.event-meta-info {
	font-size: 0.875rem;
	color: var(--cnvs-event-meta-color);
}

.event-meta-info i {
	color: var(--cnvs-event-meta-icon-color);
}

/* ── Event Type Badge ───────────────────────────────────────────── */

.event-type-badge {
	font-size: 0.75rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

/* ── Event List Item ────────────────────────────────────────────── */

.event-list-item {
	border-bottom: 1px solid var(--cnvs-event-separator);
	padding-bottom: 1.5rem;
}

.event-list-item:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.event-list-item .event-image img {
	border-radius: var(--cnvs-event-card-radius);
	width: 100%;
	height: auto;
}

/* ── Event Grid Item ────────────────────────────────────────────── */

.event-item .grid-inner {
	border-radius: var(--cnvs-event-card-radius);
	overflow: hidden;
}

.event-item .event-image img {
	width: 100%;
	height: auto;
	display: block;
}

.event-item .event-desc {
	padding: 1rem 0;
}

.events.grid-container .event-item .event-desc {
	padding: 1rem;
}

.event-item .entry-title {
	font-size: 1.125rem;
	line-height: 1.4;
}

.event-item .entry-title a {
	color: inherit;
	text-decoration: none;
}

.event-item .entry-title a:hover {
	color: var(--bs-primary, #0d6efd);
}

/* ── Event Single Meta Widget ───────────────────────────────────── */

.event-meta-widget {
	background: #f8f9fa;
	border-radius: var(--cnvs-event-card-radius);
	padding: 1.5rem;
}

.event-meta-list li + li {
	padding-top: 0.75rem;
	border-top: 1px solid var(--cnvs-event-separator);
}

/* ── Full Width Single Variant ──────────────────────────────────── */

.event-single-image-full img {
	width: 100%;
	height: auto;
	display: block;
}

/* ── Event Navigation ───────────────────────────────────────────── */

.event-navigation {
	border-top: 1px solid var(--cnvs-event-separator);
	padding-top: 1.5rem;
}

.event-navigation a {
	color: inherit;
}

.event-navigation a:hover {
	color: var(--bs-primary, #0d6efd);
}

/* ── Related Events ─────────────────────────────────────────────── */

.related-events {
	border-top: 1px solid var(--cnvs-event-separator);
	padding-top: 2rem;
}

/* ── Excerpt ────────────────────────────────────────────────────── */

.event-excerpt p {
	margin-bottom: 0;
	color: var(--cnvs-event-meta-color);
}

/* ── Categories ─────────────────────────────────────────────────── */

.event-categories {
	font-size: 0.8125rem;
	color: var(--cnvs-event-meta-color);
}

.event-categories a {
	color: inherit;
	text-decoration: none;
}

.event-categories a:hover {
	color: var(--bs-primary, #0d6efd);
}

/* ── Load More ──────────────────────────────────────────────────── */

.events + .canvas-pagination-load-more {
	text-align: center;
	margin-top: 2rem;
}

.events + .canvas-pagination-load-more .canvas-load-more-btn {
	display: inline-block;
	padding: 0.75rem 2rem;
	font-size: 0.875rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	cursor: pointer;
}

/* ── Carousel ───────────────────────────────────────────────────── */

.events-carousel .event-item .grid-inner {
	margin: 0;
}
