/* Pedalution Event Pages – the event card used in every Events Manager list */

.pep-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 1.6rem;
	margin: 0;
	text-align: center;
	line-height: 1.3;
}
.pep-card {
	display: flex;
	min-width: 0;
	border: 1px solid #fff;
	border-radius: 4px;
	overflow: hidden;
	background: #ccc;
	box-shadow: 0 4px 8px rgba(0, 0, 0, .2);
	transition: box-shadow .3s, transform .3s;
}
.pep-card:hover { box-shadow: 0 10px 16px rgba(0, 0, 0, .5); transform: translateY(-2px); }
.pep-card__link { display: flex; flex-direction: column; width: 100%; color: #000 !important; text-decoration: none !important; }

.pep-card__image { aspect-ratio: 16 / 10; background: #6b6b6b; overflow: hidden; }
.pep-card__image img { display: block; width: 100%; height: 100%; margin: 0; object-fit: cover; }

/* Organiser badge sitting on the line between the photo and the banner */
.pep-card__logo {
	position: relative;
	z-index: 1;
	width: 44px;
	height: 44px;
	margin: -22px auto -22px;
	padding: 3px;
	box-sizing: border-box;
	border: 2px solid #000;
	border-radius: 50%;
	background: #fff;
}
.pep-card__logo img { display: block; width: 100%; height: 100%; margin: 0; border-radius: 50%; object-fit: contain; }
.pep-card__logo.is-empty { visibility: hidden; }

.pep-card__banner { padding: 2.6rem .6rem .8rem; background: #ed8b00; color: #000; }
.pep-card__title { display: flex; align-items: center; justify-content: center; min-height: 5.2rem; font-size: 1.9rem; font-weight: 700; line-height: 1.25; }
.pep-card__date { margin-top: .3rem; font-size: 1.6rem; }

.pep-card__facts { width: 100%; margin: 0; border: 0; border-collapse: collapse; font-size: 1.4rem; }
.pep-card__facts td { width: 50%; padding: .5rem .3rem; border: 0; vertical-align: top; text-align: center; }

/* EM's own wrappers and page links around the grid */
.em-events-list .pep-cards + .em-pagination, .pep-cards + .em-pagination { margin-top: 2rem; }

/* ---------- Horizontal rows (GWR / ACB / PBP pages, past events) ---------- */

.pep-rows { display: flex; flex-direction: column; gap: 1.6rem; margin: 0; }
.pep-row { border: 5px solid #fff; border-radius: 6px; background: rgba(237, 139, 0, .6); box-shadow: 0 4px 8px rgba(0, 0, 0, .2); transition: box-shadow .3s; }
.pep-row:hover { box-shadow: 0 10px 16px rgba(0, 0, 0, .5); }
.pep-row__link { display: grid; grid-template-columns: 30% minmax(0, 1fr) minmax(14rem, 18%); gap: 2rem; align-items: center; padding: 1.2rem; color: #000 !important; text-decoration: none !important; }
.pep-rows--noimg .pep-row__link { grid-template-columns: minmax(0, 1fr) minmax(14rem, 22%); }
.pep-rows--noimg .pep-row__image { display: none; }
.pep-row__image { height: 22rem; border-radius: 1.6rem; overflow: hidden; background: #6b6b6b; }
.pep-row__image img { display: block; width: 100%; height: 100%; margin: 0; object-fit: cover; }
.pep-row__title { display: flex; align-items: center; gap: .8rem; margin-bottom: .6rem; font-size: 2.4rem; font-weight: 700; line-height: 1.2; }
.pep-row__logo { flex: none; width: 3.6rem; height: 3.6rem; padding: 2px; box-sizing: border-box; border: 2px solid #000; border-radius: 50%; background: #fff; }
.pep-row__logo img { display: block; width: 100%; height: 100%; margin: 0; border-radius: 50%; object-fit: contain; }
.pep-row__date { margin-bottom: .6rem; font-weight: 700; text-transform: uppercase; font-size: 1.6rem; }
.pep-row__excerpt { margin-bottom: .6rem; font-size: 1.5rem; font-style: italic; }
.pep-row__excerpt p { margin: 0; }
.pep-row__where { font-weight: 700; font-size: 1.5rem; }
.pep-row__facts { font-size: 1.4rem; line-height: 1.5; }
@media (max-width: 781px) {
	.pep-row__link, .pep-rows--noimg .pep-row__link { grid-template-columns: 1fr; gap: 1rem; text-align: center; }
	.pep-row__image { height: 18rem; }
	.pep-row__title { justify-content: center; }
}

/* Month headings when grouped */
.pep-events-list h2.pep-month, .pep-events-list .em-events-list-grouped > h2 { margin: 3rem 0 1.2rem; font-size: 2.6rem; text-transform: uppercase; }

/* ---------- Event filters ---------- */

.pep-filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 1.2rem 1.6rem; margin: 0 0 2.4rem; padding: 1.6rem; border: 5px solid #fff; border-radius: 6px; background: #ed8b00; box-shadow: 0 4px 8px rgba(0, 0, 0, .2); font-family: inherit; }
.pep-filter { display: flex; flex-direction: column; gap: .4rem; margin: 0; flex: 1 1 16rem; min-width: 0; }
.pep-filter__label { font-size: 1.3rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: #000; }
.pep-filters select { width: 100%; min-height: 4.2rem; margin: 0; padding: .6rem 1rem; border: 2px solid #000; border-radius: 4px; background-color: #fff; color: #000; font-size: 1.5rem; }
.pep-filters select:focus { outline: 2px solid #fff; outline-offset: 1px; }
.pep-filter--when { flex: 0 0 auto; flex-direction: row; gap: 0; align-self: flex-end; border: 2px solid #000; border-radius: 4px; overflow: hidden; }
.pep-filter__seg { margin: 0; cursor: pointer; }
.pep-filter__seg input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pep-filter__seg span { display: block; padding: .9rem 1.6rem; background: #fff; color: #000; font-size: 1.5rem; font-weight: 700; line-height: 1.3; }
.pep-filter__seg input:checked + span { background: #000; color: #fff; }
.pep-filter__seg input:focus-visible + span { outline: 2px solid #ed8b00; outline-offset: -4px; }
.pep-filters__actions { display: flex; align-items: center; gap: 1rem; flex: 0 0 auto; }
.pep-filters__go { padding: .9rem 1.6rem; border: 0; border-radius: 4px; background: #000; color: #fff; font-size: 1.5rem; font-weight: 700; cursor: pointer; }
.pep-filters__clear { color: #000 !important; font-size: 1.4rem; font-weight: 700; text-decoration: underline; white-space: nowrap; }
@media (max-width: 781px) {
	.pep-filters { padding: 1.2rem; gap: 1rem; }
	.pep-filter, .pep-filter--when { flex: 1 1 100%; }
	.pep-filter__seg { flex: 1; text-align: center; }
}

/* ---------- Ped Share ---------- */

.pep-share { margin: 0; }
.pep-share__row { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 0 auto; }
.pep-share--left .pep-share__row { margin-left: 0; }
.pep-share--right .pep-share__row { margin-right: 0; }
.pep-share__btn { flex: none; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; width: var(--pep-share-cur, var(--pep-share-size, 32px)) !important; height: var(--pep-share-cur, var(--pep-share-size, 32px)) !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: var(--pep-share-radius, 4px); background: var(--pep-share-bg, #ed8b00) !important; color: var(--pep-share-fg, #fff) !important; text-decoration: none !important; cursor: pointer; transition: transform .15s, filter .15s; }
.pep-share__btn svg { width: 62%; height: 62%; fill: currentColor; }
.pep-share__btn:hover, .pep-share__btn:focus-visible { filter: brightness(.9); transform: translateY(-1px); }
.pep-share__btn.is-copied { background: #000 !important; }
.pep-share__btn--link { position: relative; overflow: visible; }
.pep-share__tip { position: absolute; bottom: calc(100% + 8px); left: 50%; z-index: 5; padding: 5px 9px; border-radius: 4px; background: #000; color: #fff; font-size: 13px; font-weight: 700; line-height: 1.2; white-space: nowrap; pointer-events: none; opacity: 0; transform: translate(-50%, 4px); transition: opacity .15s, transform .15s; }
.pep-share__tip::after { content: ""; position: absolute; top: 100%; left: 50%; margin-left: -5px; border: 5px solid transparent; border-top-color: #000; }
.pep-share__btn.is-copied .pep-share__tip { opacity: 1; transform: translate(-50%, 0); }
/* Messenger's share link only works where the app is installed: phones and tablets */
@media (hover: hover) and (pointer: fine) { .pep-share__btn--messenger { display: none; } }

/* ---------- Ped Rider board ---------- */

.pep-board { font-size: 1.6rem; }
.pep-board__title { margin-top: 0; }
.pep-board__intro, .pep-board__small { font-size: 1.4rem; color: inherit; opacity: .85; }
.pep-board__note { padding: .8rem 1rem; border-left: 4px solid #000; background: rgba(255, 255, 255, .6); font-weight: 700; }
.pep-board__list { margin: 1.2rem 0; padding: 0; list-style: none; }
.pep-board__item { margin: 0 0 1rem; padding: 1rem 1.2rem; border: 3px solid #fff; border-radius: 6px; background: rgba(255, 255, 255, .85); color: #000; list-style: none; }
.pep-board__item { border-left: 8px solid #ed8b00; }
.pep-board__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .4rem 1rem; font-size: 1.3rem; }
.pep-board__type { font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
.pep-board__who { opacity: .75; }
.pep-board__text p { margin: .5rem 0 0; }
.pep-board form { margin: .6rem 0 0; }
.pep-board label { display: block; margin: 0 0 .8rem; font-weight: 700; font-size: 1.4rem; }
.pep-board select, .pep-board textarea { display: block; width: 100%; margin-top: .3rem; padding: .6rem .8rem; border: 2px solid #000; border-radius: 4px; background: #fff; color: #000; font-size: 1.5rem; font-weight: 400; box-sizing: border-box; }
.pep-board__btn { display: inline-block; padding: .8rem 1.6rem; border: 0; border-radius: 4px; background: #000; color: #fff !important; font-size: 1.5rem; font-weight: 700; cursor: pointer; text-transform: none; letter-spacing: 0; }
.pep-board summary.pep-board__btn { list-style: none; }
.pep-board summary.pep-board__btn::-webkit-details-marker { display: none; }
/* "Add a post": a full-width bar at the foot of the board, well clear of the posts above */
.pep-board__new { margin-top: 2.4rem; }
.pep-board summary.pep-board__add { display: block; width: 100%; box-sizing: border-box; padding: 1.3rem 2rem; border-radius: 4px; text-align: center; font-size: 1.6rem; }
.pep-board summary.pep-board__add::before { content: "+ "; }
.pep-board summary.pep-board__add:hover,
.pep-board summary.pep-board__add:focus-visible { background: var(--pep-orange, #ed8b00); color: #000 !important; }
.pep-board__new[open] > summary.pep-board__add::before { content: "− "; }
.pep-board__new[open] > summary { margin-bottom: 1rem; }
.pep-board__reply summary { cursor: pointer; font-weight: 700; font-size: 1.4rem; margin-top: .6rem; }
.pep-board__link { padding: 0; border: 0; background: none; color: inherit; font-size: 1.3rem; text-decoration: underline; cursor: pointer; text-transform: none; letter-spacing: 0; }
.pep-board__actions { display: flex; justify-content: flex-end; align-items: center; gap: 1.4rem; margin-top: .6rem; }
.pep-board__actions form.pep-board__del { display: flex; margin: 0 !important; padding: 0; }
.pep-board__actions .pep-board__link { display: block; margin: 0 !important; padding: 0 !important; border: 0; font-family: inherit; font-size: 1.3rem; font-weight: 700; line-height: 1.3 !important; vertical-align: middle; }
.pep-board__editform { margin-top: .8rem !important; }
.pep-board__editform[hidden] { display: none; }
.pep-board__form { margin-top: 1rem; }
.pep-board__replied { margin: .6rem 0 0; font-style: italic; }
.pep-board__types { margin: 0 0 1rem; padding: 0; border: 0; }
.pep-board__types legend { padding: 0; margin-bottom: .4rem; font-weight: 700; font-size: 1.4rem; }
.pep-board .pep-board__types label { display: flex; align-items: center; gap: .6rem; margin: 0 0 .4rem; font-weight: 400; font-size: 1.5rem; }
.pep-board__types input { margin: 0; width: 1.8rem; height: 1.8rem; flex: none; }

/* Lazy event list placeholder (until the list arrives) */
.pep-lazy { min-height: 24rem; display: flex; align-items: center; justify-content: center; }
.pep-lazy__note { margin: 0; color: #6b6b6b; font-style: italic; }