/* Template polish for JEM category/events table views. Loaded after component CSS. */

body #jem.jem_category,
body #jem.jem_eventslist {
	color: #202020;
	font-size: 14px;
}

body #jem:is(.jem_category, .jem_eventslist) .buttons {
	margin: 0 0 8px 12px;
}

body #jem:is(.jem_category, .jem_eventslist) h1.componentheading {
	margin-bottom: 12px;
}

body #jem:is(.jem_category, .jem_eventslist) .description {
	margin-bottom: 14px;
	line-height: 1.5em;
}

body #jem:is(.jem_category, .jem_eventslist) #jem_filter {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0 0 14px 0;
	padding: 10px;
	border: 1px solid #d8c36a;
	background: #f8f4df;
}

body #jem:is(.jem_category, .jem_eventslist) #jem_filter .jem_fleft,
body #jem:is(.jem_category, .jem_eventslist) #jem_filter .jem_fright,
body #jem:is(.jem_category, .jem_eventslist) #jem_filter .jem-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
}

body #jem:is(.jem_category, .jem_eventslist) #jem_filter label {
	margin: 0;
	font-weight: bold;
	color: #462103;
}

body #jem:is(.jem_category, .jem_eventslist) #jem_filter select,
body #jem:is(.jem_category, .jem_eventslist) #jem_filter input[type="text"],
body #jem:is(.jem_category, .jem_eventslist) #jem_filter input[type="month"] {
	box-sizing: border-box;
	height: 28px;
	margin: 0;
	border: 1px solid #b9a34b;
	background-color: #ffffff;
	color: #222222;
}

body #jem:is(.jem_category, .jem_eventslist) #jem_filter button {
	min-height: 28px;
	padding: 4px 10px;
}

body #jem:is(.jem_category, .jem_eventslist) .table-responsive {
	overflow-x: auto;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable {
	width: 100% !important;
	margin: 0;
	border-collapse: separate;
	border-spacing: 0 8px;
	background: transparent;
	font-size: 14px;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable colgroup {
	display: none;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable thead tr {
	background: #202020;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable th {
	padding: 8px 10px;
	border: 0;
	border-bottom: 2px solid #a47c0d;
	background: #202020;
	color: #ffffff;
	font-size: 13px;
	font-weight: bold;
	text-align: left;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable th a {
	color: #ffffff;
	text-decoration: none;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable th a:hover {
	color: #f1d65a;
	text-decoration: underline;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable th i {
	color: #d6b43a;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable tbody tr {
	background: #ffffff;
	box-shadow: 0 1px 4px rgba(0,0,0,0.12);
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable tbody tr.featured {
	background: #f7fbff;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable tbody tr:hover {
	background: #fffdf4;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable td {
	padding: 14px 10px;
	border: 0;
	border-top: 1px solid #d8d8d8;
	border-bottom: 1px solid #d8d8d8;
	background: transparent;
	vertical-align: top;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable td:first-child {
	border-left: 4px solid #a47c0d;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable tr.featured td:first-child {
	border-left-color: #00275a;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable td:last-child {
	border-right: 1px solid #d8d8d8;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable td[headers="jem_date"] {
	color: #222222;
	white-space: nowrap;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable td[headers="jem_title"] {
	font-size: 16px;
	font-weight: bold;
	line-height: 1.2em;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable td[headers="jem_title"] a {
	color: #000000;
	text-decoration: none;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable td[headers="jem_title"] a:hover {
	color: #6d4e00;
	text-decoration: underline;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable td[headers="jem_location"],
body #jem:is(.jem_category, .jem_eventslist) table.eventtable td[headers="jem_city"],
body #jem:is(.jem_category, .jem_eventslist) table.eventtable td[headers="jem_category"] {
	color: #333333;
}

body #jem:is(.jem_category, .jem_eventslist) table.eventtable td i {
	color: #8d6d12;
}

body #jem:is(.jem_category, .jem_eventslist) .jem-event-intro {
	margin-top: 8px;
	padding-top: 8px;
	border-top: 1px solid #eeeeee;
	line-height: 1.45em;
	color: #333333;
}

body #jem:is(.jem_category, .jem_eventslist) .pagination {
	margin-top: 12px;
	text-align: center;
}

body #jem.jem_category #iCal {
	margin-top: 10px;
	text-align: right;
}

/* Responsive JEM small-list layout used by category view. Keep selectors simple for old template/browser stacks. */
body #jem .jem-sort,
body #jem .jem-sort-small {
	margin: 0 0 10px 0 !important;
	padding: 8px 10px !important;
	border: 1px solid #333333 !important;
	border-bottom: 2px solid #a47c0d !important;
	background: #202020 !important;
	color: #ffffff !important;
	font-size: 12px !important;
}

body #jem .jem-sort .sectiontableheader,
body #jem .jem-sort-small .sectiontableheader {
	color: #ffffff !important;
}

body #jem .jem-sort a,
body #jem .jem-sort-small a {
	color: #ffffff !important;
	text-decoration: none !important;
}

body #jem .jem-sort a:hover,
body #jem .jem-sort-small a:hover {
	color: #f1d65a !important;
	text-decoration: underline !important;
}

body #jem .jem-sort i,
body #jem .jem-sort-small i {
	color: #d6b43a !important;
}

body #jem ul.eventlist {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

body #jem li.jem-event {
	margin: 0 0 10px 0 !important;
	padding: 12px 14px !important;
	border: 1px solid #d5d5d5 !important;
	border-left: 4px solid #a47c0d !important;
	background: #ffffff !important;
	box-shadow: 0 1px 4px rgba(0,0,0,0.12) !important;
}

body #jem li.jem-event:hover {
	border-color: #c7ad38 !important;
	border-left-color: #d6b43a !important;
	background: #fffdf4 !important;
}

body #jem li.jem-featured {
	border-left-color: #00275a !important;
	background: #f7fbff !important;
}

body #jem .jem-event-title h3,
body #jem .jem-event-title h4,
body #jem li.jem-event h3,
body #jem li.jem-event h4 {
	margin: 0 0 6px 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	color: #202020 !important;
	font-size: 16px !important;
	font-weight: bold !important;
	line-height: 1.25em !important;
}

body #jem .jem-event-title a,
body #jem li.jem-event h3 a,
body #jem li.jem-event h4 a {
	color: #000000 !important;
	text-decoration: none !important;
}

body #jem .jem-event-title a:hover,
body #jem li.jem-event h3 a:hover,
body #jem li.jem-event h4 a:hover {
	color: #6d4e00 !important;
	text-decoration: underline !important;
}

body #jem .jem-event-info,
body #jem .jem-event-info-small {
	color: #333333 !important;
	line-height: 1.35em !important;
}

body #jem .jem-event-info i,
body #jem .jem-event-info-small i {
	color: #8d6d12 !important;
}

body #jem .jem-event-intro {
	margin-top: 8px !important;
	padding-top: 8px !important;
	border-top: 1px solid #eeeeee !important;
	line-height: 1.45em !important;
	color: #333333 !important;
}

@media (max-width: 767px) {
	body #jem:is(.jem_category, .jem_eventslist) #jem_filter,
	body #jem:is(.jem_category, .jem_eventslist) #jem_filter .jem_fleft,
	body #jem:is(.jem_category, .jem_eventslist) #jem_filter .jem_fright,
	body #jem:is(.jem_category, .jem_eventslist) #jem_filter .jem-row {
		display: block !important;
	}

	body #jem:is(.jem_category, .jem_eventslist) #jem_filter select,
	body #jem:is(.jem_category, .jem_eventslist) #jem_filter input[type="text"],
	body #jem:is(.jem_category, .jem_eventslist) #jem_filter input[type="month"],
	body #jem:is(.jem_category, .jem_eventslist) #jem_filter button {
		width: 100%;
		margin-bottom: 6px;
	}

	body #jem:is(.jem_category, .jem_eventslist) table.eventtable,
	body #jem:is(.jem_category, .jem_eventslist) table.eventtable thead,
	body #jem:is(.jem_category, .jem_eventslist) table.eventtable tbody,
	body #jem:is(.jem_category, .jem_eventslist) table.eventtable tr,
	body #jem:is(.jem_category, .jem_eventslist) table.eventtable th,
	body #jem:is(.jem_category, .jem_eventslist) table.eventtable td {
		display: block;
		width: auto !important;
	}

	body #jem:is(.jem_category, .jem_eventslist) table.eventtable {
		border-spacing: 0;
	}

	body #jem:is(.jem_category, .jem_eventslist) table.eventtable thead {
		display: none;
	}

	body #jem:is(.jem_category, .jem_eventslist) table.eventtable tbody tr {
		margin-bottom: 10px;
		border: 1px solid #d8d8d8;
		border-left: 4px solid #a47c0d;
	}

	body #jem:is(.jem_category, .jem_eventslist) table.eventtable tbody tr.featured {
		border-left-color: #00275a;
	}

	body #jem:is(.jem_category, .jem_eventslist) table.eventtable td,
	body #jem:is(.jem_category, .jem_eventslist) table.eventtable td:first-child,
	body #jem:is(.jem_category, .jem_eventslist) table.eventtable td:last-child {
		padding: 7px 10px;
		border: 0;
		border-bottom: 1px solid #eeeeee;
	}

	body #jem:is(.jem_category, .jem_eventslist) table.eventtable td:last-child {
		border-bottom: 0;
	}

	body #jem:is(.jem_category, .jem_eventslist) table.eventtable td[headers="jem_title"] {
		font-size: 15px;
	}
}