/* Fenton History Center: styling for the WordPress event pages and the Events list.
   Served by the dashboard at /api/public/fhc-events.css. Edit this file and deploy
   the dashboard to restyle the website; the WordPress plugin does not need re-uploading.
   Every selector starts with .fhc-event so nothing else on the site is touched. */

.fhc-event { margin: 1.5em 0; }
.fhc-event-title { margin: 0 0 .5em; }
.fhc-event-image { max-width: 100%; height: auto; display: block; margin: 0 0 1em; }
.fhc-event-days, .fhc-event-tickets { margin: .5em 0 1em; padding-left: 1.2em; }
.fhc-event-session { margin: 0 0 1em; }
.fhc-event-session-title { font-weight: 600; margin: 0 0 .25em; }
.fhc-event-notice { font-weight: 600; }
.fhc-event-passed { font-style: italic; margin: 0 0 1em; }
:where(.fhc-event-button) {
	display: inline-block; padding: .7em 1.4em; text-decoration: none;
	background: var(--wp--preset--color--primary, #7a1f2b);
	color: var(--wp--preset--color--background, #fff);
}

/* The Events list: [fenton_events]. Each card gets its own accent color from the dashboard
   (the event type's "Website color") through --fhc-accent. */
.fhc-event-list { list-style: none; margin: 1.5rem 0; padding: 0; display: grid; gap: 1.5rem; }
.fhc-event-list-item { margin: 0; padding: 0; border: 0; --fhc-accent: #8b1a1a; }
.fhc-event-card {
	display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 1.5rem; align-items: stretch;
	background: #fbf8f3; border-radius: 18px; padding: 14px;
	box-shadow: 0 6px 24px rgba(60, 40, 20, .10), 0 1px 3px rgba(60, 40, 20, .08);
	color: #2b2b2b;
}
.fhc-event-card--noimage { grid-template-columns: auto minmax(0, 1fr); }
/* On the list the picture box keeps one height however much text the card has (no grey stretching down). */
.fhc-event-list .fhc-event-card { align-items: start; }
.fhc-event-list .fhc-event-card-media { height: 240px; min-height: 0; }
.fhc-event-list .fhc-event-card--noimage .fhc-event-card-media { height: auto; }
.fhc-event-list .fhc-event-card-body { padding-bottom: .4rem; }
.fhc-event-list .fhc-event-card-actions { margin-top: .6rem; }
.fhc-event-card-media {
	position: relative; min-height: 240px; border-radius: 12px; overflow: hidden;
	background: rgba(0, 0, 0, .06);
}
.fhc-event-card--noimage .fhc-event-card-media { min-height: 0; width: 6.4rem; background: transparent; overflow: visible; }
.fhc-event-card-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; }
.fhc-event-badge {
	position: absolute; top: 12px; left: 12px; width: 5.6rem; padding: .7rem 0; text-align: center;
	display: flex; flex-direction: column; align-items: center; gap: .12rem;
	color: #fff; background: var(--fhc-accent); border-radius: 6px; line-height: 1;
	font-family: Georgia, "Times New Roman", serif; box-shadow: 0 2px 6px rgba(0, 0, 0, .25);
}
.fhc-event-card--noimage .fhc-event-badge { position: static; }
/* Month and day are bold; the three lines sit an even distance apart. */
.fhc-event-badge-month, .fhc-event-badge-weekday { display: block; font-size: .9rem; letter-spacing: .08em; line-height: 1; margin: 0; }
.fhc-event-badge-month { font-weight: 700; }
.fhc-event-badge-weekday { font-weight: 600; }
/* Georgia's figures are old-style (short), which left a big gap above the date; Times has full-height figures, so the
   gaps month-date and date-weekday match. */
.fhc-event-badge-day {
	display: block; font-family: "Times New Roman", Times, serif; font-variant-numeric: lining-nums;
	font-size: 2.7rem; font-weight: 700; line-height: 1; margin: 0;
}
.fhc-event-card-body { display: flex; flex-direction: column; min-width: 0; padding: .5rem .9rem .4rem 0; }
.fhc-event-category {
	display: flex; align-items: center; gap: .7rem; margin: 0 0 .3rem; color: var(--fhc-accent);
	font-family: Georgia, "Times New Roman", serif; font-size: .85rem; font-weight: 600;
	letter-spacing: .14em; text-transform: uppercase;
}
.fhc-event-category::after { content: ""; width: 2.4rem; height: 2px; background: currentColor; }
.fhc-event-list-title {
	margin: 0 0 .6rem; font-family: Georgia, "Times New Roman", serif; font-size: 2rem; font-weight: 700; line-height: 1.15;
}
.fhc-event-list-title a { color: inherit; text-decoration: none; }
.fhc-event-list-title a:hover { text-decoration: underline; }
.fhc-event-meta { list-style: none; margin: 0 0 .9rem; padding: 0 0 .9rem; border-bottom: 1px solid rgba(0, 0, 0, .14); }
.fhc-event-meta li { display: flex; flex-wrap: wrap; align-items: center; gap: .15rem .6rem; margin: .2rem 0; }
.fhc-event-icon { width: 1.4rem; height: 1.4rem; flex: none; margin: 0; color: var(--fhc-accent); vertical-align: middle; }
.fhc-event-meta-sep { color: rgba(0, 0, 0, .35); }
.fhc-event-meta-address { color: #6b6b6b; font-size: .92rem; }
.fhc-event-list-summary {
	margin: 0 0 .5rem; color: #444; font-family: Georgia, "Times New Roman", serif; line-height: 1.45;
}
.fhc-event-read-more { margin: 0 0 1rem; font-weight: 600; }
.fhc-event-read-more a { color: var(--fhc-accent); text-decoration: none; }
.fhc-event-read-more a:hover { text-decoration: underline; }
.fhc-event-card-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.6rem; margin-top: auto; }
.fhc-event-list .fhc-event-button {
	display: inline-block; padding: .8rem 1.7rem; border-radius: 10px; background: var(--fhc-accent); color: #fff;
	font-weight: 600; text-decoration: none; box-shadow: 0 2px 6px rgba(0, 0, 0, .2);
}
.fhc-event-list .fhc-event-button:hover { filter: brightness(1.1); color: #fff; }
.fhc-event-list-status { display: inline-flex; align-items: center; gap: .55rem; color: #555; }
.fhc-event-list-status .fhc-event-icon { color: #7a7a7a; }
.fhc-event-list-empty { margin: 1.5rem 0; }

@media (max-width: 720px) {
	.fhc-event-card, .fhc-event-card--noimage { grid-template-columns: 1fr; gap: 1rem; }
	.fhc-event-card-media { min-height: 200px; }
	.fhc-event-card--noimage .fhc-event-card-media { width: auto; min-height: 0; }
	.fhc-event-card-body { padding: 0 .4rem .5rem; }
	.fhc-event-list-title { font-size: 1.6rem; }
	.fhc-event-meta-sep { display: none; }
	.fhc-event-meta-address { flex-basis: 100%; padding-left: 2rem; }
	.fhc-event-list .fhc-event-button { display: block; width: 100%; text-align: center; }
}

/* One event's own page: [fenton_event]. The picture + facts card reuses the list card styles above. */
.fhc-event-single { margin: 1.5rem 0; color: #2b2b2b; }
.fhc-event-hero .fhc-event-title {
	margin: 0 0 .6rem; font-family: Georgia, "Times New Roman", serif; font-size: 2.2rem; font-weight: 700; line-height: 1.15;
}
.fhc-event-hero .fhc-event-button {
	display: inline-block; padding: .8rem 1.7rem; border-radius: 10px; background: var(--fhc-accent); color: #fff;
	font-weight: 600; text-decoration: none; box-shadow: 0 2px 6px rgba(0, 0, 0, .2);
}
.fhc-event-hero .fhc-event-button:hover { filter: brightness(1.1); color: #fff; }
.fhc-event-hero .fhc-event-card-actions p { margin: 0; }
.fhc-event-hero .fhc-event-meta-date, .fhc-event-hero .fhc-event-meta-time { font-weight: 700; }
.fhc-event-columns { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 2rem; margin-top: 2rem; align-items: start; }
.fhc-event-section-title {
	display: flex; align-items: center; gap: .8rem; margin: 0 0 .8rem; font-family: Georgia, "Times New Roman", serif;
	font-size: 1.7rem; font-weight: 700;
}
.fhc-event-about .fhc-event-section-title::after { content: ""; width: 2.4rem; height: 2px; background: #2f5233; }
.fhc-event-description { font-family: Georgia, "Times New Roman", serif; font-size: 1.05rem; line-height: 1.6; }
.fhc-event-side { display: grid; gap: 1.2rem; }
.fhc-event-info { background: #f1ece3; border-radius: 12px; padding: 1.1rem 1.4rem; }
.fhc-event-ticket-list { list-style: none; margin: 0; padding: 0; }
.fhc-event-ticket-list li { display: flex; justify-content: space-between; gap: 1rem; margin: 0 0 .4rem; font-family: Georgia, "Times New Roman", serif; font-size: 1.05rem; }
.fhc-event-ticket-list li:last-child { margin-bottom: 0; }
.fhc-event-ticket-price { font-weight: 700; white-space: nowrap; }
.fhc-event-speaker-text { margin-right: .1rem; }
.fhc-event-bio-tag {
	display: inline-block; margin-left: .45rem; padding: .02rem .55rem; border: 1px solid var(--fhc-accent); border-radius: 999px;
	background: transparent; color: var(--fhc-accent); font: inherit; font-size: .72rem; font-weight: 700; letter-spacing: .04em;
	line-height: 1.5; text-transform: lowercase; vertical-align: middle; cursor: pointer;
}
.fhc-event-bio-tag:hover, .fhc-event-bio-tag:focus-visible { background: var(--fhc-accent); color: #fff; }
.fhc-event-speaker {
	padding: 0; border: 0; background: none; color: var(--fhc-accent); font: inherit; font-weight: 700; cursor: pointer;
	text-decoration: underline; text-underline-offset: .2em;
}
.fhc-event-speaker:hover { filter: brightness(1.2); }
.fhc-event-speaker-dialog {
	width: min(36rem, 92vw); max-height: 85vh; padding: 1.6rem 1.8rem; border: 0; border-radius: 14px; color: #2b2b2b;
	background: #fbf8f3; box-shadow: 0 12px 40px rgba(0, 0, 0, .35);
}
.fhc-event-speaker-dialog::backdrop { background: rgba(0, 0, 0, .5); }
.fhc-event-speaker-name { margin: 0 0 .8rem; font-family: Georgia, "Times New Roman", serif; font-size: 1.5rem; }
.fhc-event-speaker-bio { font-family: Georgia, "Times New Roman", serif; line-height: 1.6; overflow-y: auto; max-height: 55vh; }
.fhc-event-speaker-dialog form { margin: 1rem 0 0; text-align: right; }
.fhc-event-speaker-dialog .fhc-event-button {
	display: inline-block; padding: .6rem 1.4rem; border: 0; border-radius: 10px; background: var(--fhc-accent, #8b1a1a); color: #fff; font-weight: 600; cursor: pointer;
}
.fhc-event-calendar {
	display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin-top: 2rem; padding-top: 1.2rem;
	border-top: 1px solid rgba(0, 0, 0, .14);
}
.fhc-event-calendar-link {
	display: inline-block; padding: .45rem 1.1rem; border: 1px solid rgba(0, 0, 0, .25); border-radius: 999px; color: #2b2b2b;
	font-size: .92rem; text-decoration: none;
}
.fhc-event-calendar-link:hover, .fhc-event-calendar-link:focus-visible { background: var(--fhc-accent); border-color: var(--fhc-accent); color: #fff; }
.fhc-event-calendar + .fhc-event-share { margin-top: .8rem; padding-top: 0; border-top: 0; }
.fhc-event-info .fhc-event-section-title { font-size: 1.3rem; }
.fhc-event-info dl { margin: 0; }
.fhc-event-info-row { margin: 0 0 .8rem; }
.fhc-event-info-row:last-child { margin-bottom: 0; }
.fhc-event-info dt { font-size: 1.05rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--fhc-accent); }
.fhc-event-info dd { margin: .1rem 0 0; font-family: Georgia, "Times New Roman", serif; font-size: 1.05rem; }
.fhc-event-organizers { list-style: none; margin: 0; padding: 0; }
.fhc-event-organizers li { margin: 0 0 .2rem; }
.fhc-event-share {
	display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin-top: 2rem; padding-top: 1.2rem;
	border-top: 1px solid rgba(0, 0, 0, .14);
}
.fhc-event-share-label { font-weight: 700; margin-right: .4rem; }
.fhc-event-share-link {
	display: inline-flex; align-items: center; justify-content: center; width: 2.6rem; height: 2.6rem; padding: 0;
	border: 1px solid rgba(0, 0, 0, .25); border-radius: 50%; background: transparent; color: #2b2b2b;
	text-decoration: none; cursor: pointer; line-height: 1;
}
.fhc-event-share-link:hover, .fhc-event-share-link:focus-visible { background: var(--fhc-accent); border-color: var(--fhc-accent); color: #fff; }
.fhc-event-share-icon { width: 1.15rem; height: 1.15rem; display: block; }
.fhc-event-share-note { flex-basis: 100%; min-height: 1.2em; font-size: .9rem; color: #555; }
@media (max-width: 720px) {
	.fhc-event-columns { grid-template-columns: 1fr; gap: 1.5rem; }
	.fhc-event-hero .fhc-event-title { font-size: 1.8rem; }
	.fhc-event-hero .fhc-event-button { display: block; width: 100%; text-align: center; }
}

/* Astra shows a single event as a blog post: a right sidebar and wide padding. Event pages use the whole width, like the list. */
.fhc-event-page #secondary { display: none !important; }
.fhc-event-page #primary, .fhc-event-page.ast-right-sidebar #primary, .fhc-event-page.ast-left-sidebar #primary {
	width: 100% !important; max-width: 100% !important; margin-right: 0 !important; padding-right: 0 !important; border: 0 !important;
}
.fhc-event-page.ast-separate-container .ast-article-single, .fhc-event-page.ast-separate-container .ast-article-post {
	background: transparent !important; padding: 0 !important; box-shadow: none !important;
}
.fhc-event-page .site-content > .ast-container { display: block !important; }
.fhc-event-page .entry-content > .fhc-event, .fhc-event-page .entry-content .fhc-event-single { max-width: none !important; width: 100% !important; }

/* The event's title is in the card, so the theme's own page title is hidden on event pages. */
.fhc-event-page .entry-title, .fhc-event-page .page-title, .fhc-event-page .wp-block-post-title,
.fhc-event-page .elementor-widget-theme-post-title, .fhc-event-page .entry-header .entry-title {
	display: none !important;
}

/* Event pages are plain pages, not blog posts: hide anything blog-like the theme
   adds around them (author, date, "posted in", comments, previous/next links).
   The plugin adds the fhc-event-page class to the page's <body>. */
.fhc-event-page .entry-meta, .fhc-event-page .post-meta, .fhc-event-page .posted-on,
.fhc-event-page .byline, .fhc-event-page .author, .fhc-event-page .cat-links,
.fhc-event-page .tags-links, .fhc-event-page .entry-footer, .fhc-event-page .post-navigation,
.fhc-event-page .nav-links, .fhc-event-page .comments-area, .fhc-event-page #comments,
.fhc-event-page .wp-block-post-author, .fhc-event-page .wp-block-post-date,
.fhc-event-page .wp-block-post-terms, .fhc-event-page .wp-block-comments,
.fhc-event-page .elementor-post-info, .fhc-event-page .elementor-widget-post-info,
.fhc-event-page .elementor-post-navigation, .fhc-event-page .elementor-widget-post-navigation {
	display: none !important;
}

@media (max-width: 600px) {
	.fhc-event-button { display: block; text-align: center; }
}