/* CalDone front end styles. Fonts are inherited from the Astra theme (Poppins on vgnboulevard.com). */
:root {
	--vgn-green: var(--ast-global-color-1, #175e56);
	--vgn-green-dark: #185e56;
	--vgn-green-light: #2aa496;
	--vgn-btn-bg: #1b4332;
	--vgn-btn-text: #fff;
	--vgn-radius: 12px;
	--vgn-gap: 24px;
}

/* Page wrapper: keeps Astra header, footer and width, adds safe side margins on phones. */
.vgn-page { width: 100%; }
.vgn-page .site-main { padding: 24px 0 48px; }
@media (max-width: 921px) {
	.vgn-page .site-main { padding-left: 16px; padding-right: 16px; }
}
.vgn-page-header { margin-bottom: 8px; }
.vgn-page-title { text-transform: uppercase; margin: 0 0 4px; }
.vgn-page-intro { margin: 0 0 8px; }
.vgn-page-footer, .vgn-back { margin-top: var(--vgn-gap); }

/* Grid: one column on phones, two on tablets, three on desktop. Month headings span the row. */
.vgn-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px var(--vgn-gap);
	align-items: stretch;
}
@media (min-width: 768px) { .vgn-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .vgn-page .vgn-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.vgn-month-heading {
	grid-column: 1 / -1;
	text-transform: uppercase;
	margin: 16px 0 0;
	line-height: 1.2;
}
.vgn-next .vgn-grid, .vgn-trailer .vgn-card { margin: 0; }

/* Card: green gradient like the homepage "Coming up" strip. */
.vgn-card {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	padding: 22px 20px;
	border-radius: var(--vgn-radius);
	background: linear-gradient(180deg, var(--vgn-green-dark) 0%, var(--vgn-green-light) 100%);
	color: #fff;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
	min-width: 0;
}
.vgn-card a { color: #fff; }
.vgn-card-body { flex: 1; min-width: 0; }
.vgn-date {
	flex: 0 0 auto;
	min-width: 48px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	color: #fff;
	text-transform: uppercase;
	line-height: 1.1;
}
.vgn-date-day, .vgn-date-month { font-size: 0.95em; letter-spacing: 0.02em; }
.vgn-date-num { font-size: 2.6em; font-weight: 700; line-height: 1; margin: 2px 0; }
.vgn-card .vgn-card-title {
	margin: 0 0 10px;
	color: #fff;
	text-transform: uppercase;
	font-weight: 800;
	font-size: 1.6em;
	line-height: 1.15;
	overflow-wrap: anywhere;
}
.vgn-card .vgn-card-title a { color: #fff; text-decoration: none; }
.vgn-card .vgn-card-title a:hover, .vgn-card .vgn-card-title a:focus { text-decoration: underline; }
@media (min-width: 922px) { .vgn-card .vgn-card-title { font-size: 1.4em; } }

.vgn-meta { list-style: none; margin: 0 0 12px; padding: 0; }
.vgn-meta li { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 6px; }
.vgn-icon { flex: 0 0 auto; width: 1.1em; height: 1.1em; margin-top: 0.2em; }

.vgn-badge {
	display: inline-block;
	margin: 0 0 8px;
	padding: 3px 10px;
	border-radius: 6px;
	font-weight: 700;
	font-size: 0.85em;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	background: #fff;
}
.vgn-badge-sold_out { color: #a01818; }
.vgn-badge-cancelled { color: #3d3d3d; }
.vgn-badge-postponed { color: #7a4300; }
.vgn-status-cancelled .vgn-card-title a { text-decoration: line-through; }

.vgn-card .vgn-menu { margin: 0 0 12px; }
.vgn-card .vgn-menu-title { font-weight: 700; margin: 0 0 4px; }
.vgn-card .vgn-menu ul { margin: 0 0 4px 1.2em; padding: 0; }
.vgn-more summary { cursor: pointer; font-weight: 700; margin-bottom: 8px; }

/* Buttons: match the site buttons (weight 700, white on #1b4332, 6px corners). */
.vgn-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; }
.vgn-btn,
.vgn-addcal > summary {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 44px;
	padding: 12px 24px;
	border: 0;
	border-radius: 6px;
	background: var(--vgn-btn-bg);
	color: var(--vgn-btn-text) !important;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none !important;
	cursor: pointer;
	box-sizing: border-box;
}
.vgn-btn:hover, .vgn-btn:focus, .vgn-addcal > summary:hover { background: #12301f; color: #fff; }
.vgn-btn .vgn-icon { margin-top: 0; }
.vgn-btn-light { background: #fff; color: var(--vgn-btn-bg) !important; }
.vgn-btn-light:hover, .vgn-btn-light:focus { background: #eef6f4; color: var(--vgn-btn-bg) !important; }
.vgn-btn-outline { background: transparent; color: var(--vgn-btn-bg) !important; box-shadow: inset 0 0 0 2px var(--vgn-btn-bg); }
.vgn-btn-outline:hover, .vgn-btn-outline:focus { background: var(--vgn-btn-bg); color: #fff !important; }
.vgn-btn:focus-visible, .vgn-addcal > summary:focus-visible, .vgn-card a:focus-visible, .vgn-share a:focus-visible, .vgn-copy-link:focus-visible {
	outline: 3px solid #fff;
	outline-offset: 2px;
	box-shadow: 0 0 0 6px var(--vgn-btn-bg);
}

/* Add to calendar choice. */
.vgn-addcal { position: relative; }
.vgn-addcal > summary { list-style: none; }
.vgn-addcal > summary::-webkit-details-marker { display: none; }
.vgn-addcal-menu {
	position: absolute;
	z-index: 20;
	top: calc(100% + 6px);
	left: 0;
	min-width: 240px;
	background: #fff;
	border-radius: 6px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
	padding: 6px;
}
.vgn-addcal-menu a {
	display: block;
	padding: 12px;
	color: var(--vgn-btn-bg) !important;
	font-weight: 700;
	text-decoration: none;
	border-radius: 4px;
}
.vgn-addcal-menu a:hover, .vgn-addcal-menu a:focus { background: #eef6f4; }

/* Single event page. */
.vgn-hero { border-radius: var(--vgn-radius); }
.vgn-single .vgn-hero {
	display: flex;
	gap: 20px;
	align-items: flex-start;
	padding: 28px 24px;
	background: linear-gradient(180deg, var(--vgn-green-dark) 0%, var(--vgn-green-light) 100%);
	color: #fff;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}
.vgn-single .vgn-hero a { color: #fff; }
.vgn-single .vgn-hero .vgn-date-num { font-size: 3.2em; }
.vgn-hero-body { flex: 1; min-width: 0; }
.vgn-single .vgn-hero-title { color: #fff; text-transform: uppercase; font-weight: 800; margin: 0 0 12px; line-height: 1.1; overflow-wrap: anywhere; }
.vgn-single-image { margin: var(--vgn-gap) 0 0; }
.vgn-single-image img { width: 100%; height: auto; border-radius: var(--vgn-radius); display: block; }
.vgn-single-content { max-width: 760px; margin-top: var(--vgn-gap); }
.vgn-single-content h2 { text-transform: uppercase; margin: 32px 0 12px; }
.vgn-single .vgn-menu {
	margin-top: var(--vgn-gap);
	padding: 20px 24px;
	border-radius: var(--vgn-radius);
	background: #fff;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}
.vgn-single .vgn-menu .vgn-menu-title { margin-top: 0; }
.vgn-single .vgn-menu ul { margin: 0 0 12px 1.2em; }
.vgn-menu-link { font-weight: 700; }
@media (max-width: 600px) {
	.vgn-single .vgn-hero { padding: 22px 18px; gap: 14px; }
	.vgn-single .vgn-hero .vgn-date-num { font-size: 2.6em; }
}

/* Share. */
.vgn-share { display: flex; gap: 8px; align-items: center; }
.vgn-share a, .vgn-copy-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-width: 44px;
	min-height: 44px;
	padding: 0 10px;
	border: 0;
	border-radius: 6px;
	background: var(--vgn-btn-bg);
	color: #fff !important;
	cursor: pointer;
	font: inherit;
	font-weight: 700;
}
.vgn-copied { font-size: 0.9em; }

/* Reminder form. */
.vgn-remind-form input[type="email"] { width: 100%; max-width: 420px; min-height: 44px; display: block; margin-top: 6px; }
.vgn-remind-form .vgn-consent label { display: flex; gap: 8px; align-items: flex-start; }
.vgn-remind-form .vgn-consent input { width: 20px; height: 20px; flex: 0 0 auto; margin-top: 2px; }
.vgn-remind-notice { padding: 12px 16px; border-radius: 6px; background: #eef6f4; font-weight: 700; }
.vgn-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* Trailer next block. */
.vgn-trailer-heading { text-transform: uppercase; margin: 0 0 12px; }
.vgn-countdown { display: inline-block; margin: 0 0 12px; padding: 6px 12px; border-radius: 6px; background: var(--vgn-btn-bg); color: #fff; font-weight: 700; }
.vgn-countdown[hidden] { display: none; }

/* Past events gallery. */
.vgn-gallery-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
	margin-top: 16px;
}
@media (min-width: 768px) { .vgn-gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--vgn-gap); } }
@media (min-width: 1100px) { .vgn-gallery-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.vgn-past {
	display: flex;
	flex-direction: column;
	border-radius: var(--vgn-radius);
	overflow: hidden;
	background: #fff;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
	text-decoration: none !important;
	color: inherit;
}
.vgn-past-img { display: block; aspect-ratio: 4 / 3; background: linear-gradient(180deg, var(--vgn-green-dark), var(--vgn-green-light)); }
.vgn-past-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.vgn-past-text { display: flex; flex-direction: column; gap: 2px; padding: 12px 14px 14px; }
.vgn-past-title { font-weight: 800; text-transform: uppercase; color: var(--vgn-green); line-height: 1.2; }
.vgn-past-date { font-size: 0.9em; }
.vgn-photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; }
.vgn-photo-grid img { width: 100%; height: auto; border-radius: 8px; }
.vgn-pagination { margin-top: var(--vgn-gap); }
.vgn-pagination .page-numbers { display: inline-block; min-width: 44px; min-height: 44px; line-height: 44px; text-align: center; }

.vgn-empty { padding: 16px 20px; border-radius: var(--vgn-radius); background: #f3f6f6; }

/* Availability calendar. */
.vgn-availability-public { max-width: 760px; }
.vgn-availability-table { width: 100%; border-collapse: collapse; margin: 12px 0; table-layout: fixed; }
.vgn-availability-table th, .vgn-availability-table td { border: 1px solid #dfe5e4; padding: 6px 4px; text-align: center; vertical-align: top; }
.vgn-day { height: 64px; }
.vgn-day-num { display: block; font-weight: 700; }
.vgn-day-status { display: block; font-size: 0.8em; }
.vgn-day.available { background: #e6f4ea; }
.vgn-day.booked { background: #f1f1f1; color: #555; }
.vgn-day.booked .vgn-day-status { text-decoration: none; }
.vgn-enquire { display: block; margin-top: 4px; font-size: 0.8em; font-weight: 700; color: var(--vgn-btn-bg); }
.vgn-prev-month, .vgn-next-month { min-height: 44px; padding: 10px 20px; border-radius: 6px; border: 0; background: var(--vgn-btn-bg); color: #fff; font-weight: 700; cursor: pointer; }
.vgn-key span { display: inline-block; padding: 4px 10px; border-radius: 6px; margin-right: 8px; }
.vgn-key .available { background: #e6f4ea; }
.vgn-key .booked { background: #f1f1f1; }
@media (max-width: 600px) {
	.vgn-day { height: auto; }
	.vgn-enquire { font-size: 0.75em; }
	.vgn-availability-table th, .vgn-availability-table td { padding: 4px 2px; }
}

/* Card and hero buttons sit side by side */
.vgn-card .vgn-actions, .vgn-hero .vgn-actions { flex-wrap: nowrap; gap: 6px; }
.vgn-card .vgn-btn, .vgn-card .vgn-addcal > summary { padding: 10px 12px; white-space: nowrap; }
.vgn-hero .vgn-actions { flex-wrap: wrap; }
@media (max-width: 400px) {
	.vgn-card .vgn-btn, .vgn-card .vgn-addcal > summary { padding: 10px 9px; font-size: 11.5px; }
	.vgn-card .vgn-btn .vgn-icon, .vgn-card .vgn-addcal > summary .vgn-icon { display: none; }
}
.vgn-single-image img { width: 100%; max-height: 440px; object-fit: cover; }
/* Stop theme content list styles indenting card lines inside pages */
.entry-content .vgn-card ul.vgn-meta, .vgn-card ul.vgn-meta, .entry-content .vgn-hero ul.vgn-meta { margin-left: 0; margin-right: 0; padding-left: 0; list-style: none; }
.entry-content .vgn-card .vgn-meta li { margin-left: 0; }

/* Colours: brand green by default, overridden by Settings or a per event colour (CSS variables). */
.vgn-card, .vgn-single .vgn-hero {
	background: linear-gradient(180deg, var(--vgn-card-start, var(--vgn-green-dark)) 0%, var(--vgn-card-end, var(--vgn-green-light)) 100%);
	color: var(--vgn-card-text, #fff);
}
.vgn-card a, .vgn-card .vgn-card-title, .vgn-card .vgn-card-title a, .vgn-card .vgn-date, .vgn-card .vgn-date *,
.vgn-card .vgn-meta li, .vgn-card .vgn-menu, .vgn-card .vgn-menu-title,
.vgn-single .vgn-hero, .vgn-single .vgn-hero a, .vgn-single .vgn-hero-title, .vgn-single .vgn-hero .vgn-date, .vgn-single .vgn-hero .vgn-date *, .vgn-single .vgn-hero .vgn-meta li {
	color: var(--vgn-card-text, #fff);
}
.vgn-card .vgn-btn, .vgn-card .vgn-addcal > summary, .vgn-hero .vgn-btn:not(.vgn-btn-light), .vgn-hero .vgn-addcal > summary { color: var(--vgn-btn-text, #fff) !important; }
.vgn-addcal-menu a { color: #1a1a1a !important; }

/* Fonts: "Use theme font" leaves these as inherit. */
.vgn-card-title, .vgn-hero-title, .vgn-page-title, .vgn-month-heading, .vgn-single h2, .vgn-year-title, .vgn-ym-name { font-family: var(--vgn-title-font, inherit); }
.vgn-card, .vgn-single, .vgn-page-intro, .vgn-year { font-family: var(--vgn-body-font, inherit); }
.vgn-card .vgn-card-title { font-family: var(--vgn-title-font, inherit); }

/* Front end year view: 12 small months with coloured dots. Private bookings are never included. */
.vgn-year-nav { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 16px; }
.vgn-year-nav a { font-weight: 700; }
.vgn-year-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 20px; }
.vgn-ym { background: #fff; border-radius: var(--vgn-radius); box-shadow: 0 2px 10px rgba(0,0,0,.08); padding: 12px; }
.vgn-ym-name { margin: 0 0 8px; font-size: 1em; font-weight: 800; text-transform: uppercase; }
.vgn-ym table { width: 100%; border-collapse: collapse; margin: 0; border: 0; table-layout: fixed; }
.vgn-ym th, .vgn-ym td { border: 0; padding: 2px 0; text-align: center; font-size: 12px; }
.vgn-ym th { font-weight: 700; color: #555; }
.vgn-ym td.vgn-yd-today .vgn-yd-num { outline: 2px solid var(--vgn-btn-bg); border-radius: 50%; }
.vgn-yd-num { display: inline-block; width: 24px; line-height: 24px; }
.vgn-yd-dots { display: flex; justify-content: center; gap: 2px; min-height: 6px; }
.vgn-yd-dot { width: 6px; height: 6px; border-radius: 50%; display: inline-block; }
.vgn-ym td a { display: block; text-decoration: none; color: inherit; border-radius: 6px; }
.vgn-ym td a:hover, .vgn-ym td a:focus { background: #eef6f4; }
.vgn-year-list { margin-top: 24px; }
@media (max-width: 921px) { .vgn-year-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; } .vgn-ym th, .vgn-ym td { font-size: 11px; } .vgn-yd-num { width: 20px; line-height: 20px; } }
/* Never let buttons spill out of a narrow card: they sit side by side when they fit, else stack. */
.vgn-card .vgn-actions { flex-wrap: wrap; }