/* ==================================================
   SVM Event Manager Frontend
   ================================================== */

/* ==================================================
   Event List
   ================================================== */

.svm-events{
	max-width:1100px;
	margin:40px auto;
	display:flex;
	flex-direction:column;
	gap:30px;
}

/* ==================================================
   Event Card
   ================================================== */

.svm-event-card{
	display:flex;
	gap:25px;
	padding:20px;
	background:#343333;
	border:1px solid #d9d9d9;
	border-radius:12px;
	box-shadow:0 3px 10px rgba(0,0,0,.08);
	transition:.25s ease;
}

.svm-event-card:hover{
	transform:translateY(-3px);
	box-shadow:0 10px 20px rgba(0,0,0,.12);
}

/* ==================================================
   Event Image
   ================================================== */

.svm-event-image{
	position:relative;
	width:300px;
	height:220px;
	flex-shrink:0;
	overflow:hidden;
	border-radius:8px;
	background:#ececec;
}

/* ==================================================
   Coming Soon Badge
   ================================================== */

.svm-event-badge{
	position:absolute;
	top:12px;
	left:12px;
	z-index:2;
	padding:6px 12px;
	background:#e63946;
	color:#fff;
	font-size:13px;
	font-weight:700;
	border-radius:20px;
	box-shadow:0 3px 8px rgba(0,0,0,.2);
	white-space:nowrap;
}

.svm-badge-status{
	background:#2a9d8f;
}

.svm-event-featured{
	position:absolute;
	top:10px;
	right:12px;
	z-index:2;
	font-size:22px;
	filter:drop-shadow(0 2px 4px rgba(0,0,0,.35));
}

.svm-event-image img{
	width:100%;
	height:100%;
	display:block;
	object-fit:cover;
}

/* ==================================================
   Event Content
   ================================================== */

.svm-event-body{
	flex:1;
	display:flex;
	flex-direction:column;
}

/* ==================================================
   Event Title
   ================================================== */

.svm-event-title h2{
	margin:0 0 15px;
	font-size:30px;
	line-height:1.2;
	color:#fff;
}

.svm-event-title a{
	color:inherit;
	text-decoration:none;
}

.svm-event-title a:hover{
	text-decoration:underline;
}

/* ==================================================
   Event Meta text
   ================================================== */

.svm-event-meta p{
	margin:8px 0;
	font-size:16px;
	color:#B0DCF3;
}

/* ==================================================
   Event Excerpt
   ================================================== */

.svm-event-excerpt{
	margin-top:18px;
}

.svm-event-excerpt,
.svm-event-excerpt p{
	color:#444;
}

/* ==================================================
   Event Footer karica
   ================================================== */

.svm-event-footer{
	margin-top:auto;
	display:flex;
	align-items:center;
	justify-content:flex-end;
	gap:10px;
}

.svm-icon-btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:40px;
	height:40px;
	background:#4F5B62;
	border-radius:50%;
	text-decoration:none;
	font-size:18px;
	transition:.2s;
}

.svm-icon-btn:hover{
	background:#93C840;
}

/* ==================================================
   Button
   ================================================== */

.svm-button{
	display:inline-block;
	padding:12px 22px;
	background:#93C840;
	color:#111 !important;
	border-radius:6px;
	text-decoration:none;
	font-weight:600;
	transition:.2s;
	border:none;
	cursor:pointer;
}

.svm-button:hover{
	background:#5E873B;
}

/* ==================================================
   Filters
   ================================================== */

.svm-event-filters{
	max-width:1100px;
	margin:0 auto 20px;
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	justify-content:space-between;
	gap:12px;
}

.svm-type-filters{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
}

.svm-filter-btn{
	padding:8px 16px;
	background:#93C840;
	border:1px solid #d9d9d9;
	color: #111;
	border-radius:20px;
	font-size:14px;
	cursor:pointer;
	transition:.2s;
}

.svm-filter-btn:hover{
	border-color:#fff;
}

.svm-filter-btn.is-active{
	background:#93C840;
	border-color:#fff;
	color:#111;
}

.svm-secondary-filters{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
}

.svm-country-filter,
.svm-event-search{
	padding:8px 14px;
	background:#5E873B !important;
	border:1px solid #fff !important;
	color:#111 !important;
	border-radius:20px;
	font-size:14px;
}

.svm-event-search{
	color:#111 !important;
	min-width:220px;
}

.svm-event-filtered-out{
	color:#111 !important;
	display:none;
}

/* ==================================================
   Countdown
   ================================================== */

.svm-countdown{
	margin:10px 0;
	font-size:16px;
	font-weight:600;
	color:#e63946;
}

/* ==================================================
   Calendar Links
   ================================================== */

.svm-calendar-links{
	display:flex;
	flex-wrap:wrap;
	gap:12px;
	margin:15px 0 25px;
}

.svm-calendar-btn{
	font-size:15px;
	padding:10px 18px;
}

.svm-calendar-btn-secondary{
	background:#93C840;
}

.svm-calendar-btn-secondary:hover{
	background:#5e873b;
}

/* ==================================================
   Show More
   ================================================== */

.svm-event-hidden{
	display:none;
}

.svm-show-more-wrap{
	text-align:center;
	margin-top:10px;
}

button.svm-show-more-btn{
	border:none;
	cursor:pointer;
	font-family:inherit;
	font-size:16px;
}

/* ==================================================
   Single Event
   ================================================== */

.svm-single-event{
	max-width:900px;
	margin:40px auto;
}

/* ==================================================
   Featured Image
   ================================================== */

.svm-featured-image{
	margin-bottom:20px;
}

.svm-featured-image img{
	width:100%;
	height:auto;
	display:block;
	border-radius:10px;
}

/* ==================================================
   Main Title
   ================================================== */

.svm-single-event > h1{
	margin:15px 0 18px;
	font-size:48px;
	line-height:1.15;
}

/* ==================================================
   Event Details
   ================================================== */

.svm-event-details{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:40px;
	margin:30px 0;
	align-items:start;
}

.svm-event-box{
	width:100%;
}

.svm-event-box h2{
	margin:0 0 15px;
	font-size:26px;
	line-height:1.2;
}

.svm-event-box p{
	margin:6px 0;
	font-size:18px;
	line-height:1.45;
}

/* ==================================================
   Content Sections
   ================================================== */

.svm-single-event > h2{
	margin:22px 0 10px;
	font-size:26px;
	line-height:1.2;
}

.svm-single-event p{
	margin:3px 0;
	font-size:18px;
	line-height:1.45;
}

.svm-single-event strong{
	font-weight:600;
}

.svm-single-event a{
	text-decoration:none;
}

.svm-single-event a:hover{
	text-decoration:underline;
}

/* ==================================================
   Gallery
   ================================================== */

.svm-gallery{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
	gap:20px;
	margin-top:20px;
}

.svm-gallery img{
	width:100%;
	height:220px;
	display:block;
	object-fit:cover;
	border-radius:10px;
	transition:.25s ease;
}

.svm-gallery img:hover{
	transform:scale(1.03);
	box-shadow:0 8px 20px rgba(0,0,0,.18);
}

/* ==================================================
   Mobile
   ================================================== */

@media (max-width:768px){

	.svm-event-card{
		flex-direction:column;
	}

	.svm-event-image{
		width:100%;
		height:220px;
	}

	.svm-single-event{
		margin:20px;
	}

	.svm-single-event > h1{
		font-size:36px;
	}

	.svm-single-event > h2{
		font-size:22px;
	}

	.svm-single-event p{
		font-size:16px;
	}

	.svm-event-details{
		grid-template-columns:1fr;
		gap:25px;
	}

	.svm-event-box h2{
		font-size:22px;
	}

	.svm-event-box p{
		font-size:16px;
	}

	.svm-gallery{
		grid-template-columns:1fr;
	}

	.svm-gallery img{
		height:auto;
	}

}
/* ==================================================
   Pinned Club Meeting Card
   ================================================== */

.svm-club-pinned-wrap{
	max-width:1100px;
	margin:0 auto 30px;
}

.svm-club-pinned{
	border-color:#0066cc;
	box-shadow:0 3px 10px rgba(0,102,204,.15);
}

.svm-badge-club{
	background:#4f5b62;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:34px;
	height:34px;
	padding:0;
	border-radius:50%;
	font-size:16px;
}

/* ==================================================
   Postponed State
   ================================================== */

.svm-club-postponed{
	border-color:#e63946;
}

.svm-club-postponed-message{
	color:#e63946;
	font-weight:600;
}
