/*
 * AMHDB Gigs: layout only. No fonts or colours, so the theme's own apply; borders
 * and focus rings use currentColor. Override the custom properties to restyle:
 *
 *   --amhdb-gig-gap        space between gigs, and between tile and details
 *   --amhdb-gig-tile-size  width of the date tile
 *   --amhdb-gig-border     the tile's border (use "none" for no border)
 *
 * Sizes are in em, so everything scales with the theme's base size (18px on AMH).
 */

.amhdb-gigs-list {
	--amhdb-gig-gap: 1em;
	--amhdb-gig-tile-size: 4.5em;
	--amhdb-gig-border: 1px solid currentColor;
}

.amhdb-gigs {
	list-style: none;
	margin: 0 0 1.5em;
	padding: 0;
}

.amhdb-gig {
	display: grid;
	grid-template-columns: var(--amhdb-gig-tile-size) minmax(0, 1fr);
	gap: var(--amhdb-gig-gap);
	align-items: start;
	margin: 0 0 var(--amhdb-gig-gap);
	padding: 0;
}

/* The date as a tile: each part on its own line. */
.amhdb-gig__date,
.amhdb-gig__end {
	display: flex;
	flex-direction: column;
	align-items: center;
	border: var(--amhdb-gig-border);
	padding: 0.35em 0.25em;
	line-height: 1.2;
	text-align: center;
}

.amhdb-gig__day {
	font-size: 1.5em;
	font-weight: bold;
}

.amhdb-gig__dow,
.amhdb-gig__month,
.amhdb-gig__year,
.amhdb-gig__unknown {
	font-size: 0.85em;
}

.amhdb-gig__dates {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0.25em;
	text-align: center;
}

.amhdb-gig__body > * {
	display: block;
	margin: 0 0 0.25em;
}

.amhdb-gig__note,
.amhdb-gig__source {
	font-size: 0.9em;
}

.amhdb-gigs-list a:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

.amhdb-gigs__menu ul {
	list-style: none;
	margin: 0 0 1em;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.25em 1em;
}

.amhdb-gigs__menu li > ul {
	display: inline-flex;
	margin: 0 0 0 0.5em;
	gap: 0.25em 0.6em;
	font-size: 0.85em;
}