/* Metchosin Hall Booking System — Public Styles v0.8.0
   Colours:
     Primary green:       #395144
     Dark forest green:   #014932
     Light green:         #92b092
     White:               #ffffff
     Body text:           #000000
     Button red:          #cf2e2e
   Fonts:
     Headings: Playfair Display, Georgia, serif
     Body/UI:  Heebo, sans-serif
*/

/* ── Base ─────────────────────────────────────────────────────────────────── */

.mhbs-public-calendar-wrap,
.mhbs-form-wrap {
	font-family: 'Heebo', sans-serif;
	font-size: 16px;
	color: #1d1d1d;
	max-width: 960px;
	margin: 0 auto;
	line-height: 1.55;
}

/* ── Public Calendar ──────────────────────────────────────────────────────── */

.mhbs-public-calendar-wrap {
	padding: 16px 0;
}

.mhbs-cal-legend {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-bottom: 16px;
}

.mhbs-legend-item {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: #1d1d1d;
	font-weight: 500;
	letter-spacing: 0.01em;
}

.mhbs-legend-item::before {
	content: '';
	display: inline-block;
	width: 12px;
	height: 12px;
	border-radius: 3px;
	flex-shrink: 0;
}

.mhbs-legend-public::before  { background: #395144; }
.mhbs-legend-pending::before { background: #d4a017; }
.mhbs-legend-private::before { background: #888888; }
.mhbs-legend-block::before   { background: #8b4040; }

/* FullCalendar container */
#mhbs-public-calendar {
	min-height: 400px;
	background: #ffffff;
}

/* FullCalendar overrides — brand colours */
#mhbs-public-calendar .fc-toolbar-title {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 1.2rem;
	color: #014932;
}

#mhbs-public-calendar .fc-button {
	background-color: #395144 !important;
	border-color: #395144 !important;
	font-family: 'Heebo', sans-serif;
	font-size: 13px;
	padding: 5px 12px;
}

#mhbs-public-calendar .fc-button:hover,
#mhbs-public-calendar .fc-button:focus {
	background-color: #014932 !important;
	border-color: #014932 !important;
}

#mhbs-public-calendar .fc-button-active,
#mhbs-public-calendar .fc-button:disabled {
	background-color: #014932 !important;
	border-color: #014932 !important;
	opacity: 1;
}

/* Force white background on all calendar cells */
#mhbs-public-calendar .fc-scrollgrid,
#mhbs-public-calendar table,
#mhbs-public-calendar .fc-daygrid-day,
#mhbs-public-calendar .fc-timegrid-slot,
#mhbs-public-calendar .fc-col-header-cell {
	background: #ffffff;
}

#mhbs-public-calendar .fc-day-today {
	background-color: rgba(57, 81, 68, 0.07) !important;
}

#mhbs-public-calendar .fc-daygrid-event {
	border-radius: 3px;
	font-size: 12px;
	cursor: pointer;
}

#mhbs-public-calendar .fc-list-event:hover td {
	background-color: rgba(57, 81, 68, 0.06);
}

/* Event type classes */
/* Dark green text throughout calendar — date numbers, headers, off-month days */
#mhbs-public-calendar .fc-daygrid-day-number,
#mhbs-public-calendar .fc-col-header-cell-cushion {
	color: #014932 !important;
	font-weight: 600;
}

#mhbs-public-calendar .fc-day-other .fc-daygrid-day-number {
	color: #7a9e8a !important;
	font-weight: 400;
}

#mhbs-public-calendar .fc-daygrid-event .fc-event-time,
#mhbs-public-calendar .fc-daygrid-event .fc-event-title {
	font-weight: 600;
	color: #ffffff !important;
}

/* Private, setup, and cleanup holds use white text for contrast on grey backgrounds. */
#mhbs-public-calendar .mhbs-pub-private .fc-event-time,
#mhbs-public-calendar .mhbs-pub-private .fc-event-title,
#mhbs-public-calendar .mhbs-pub-private .fc-list-event-time,
#mhbs-public-calendar .mhbs-pub-private .fc-list-event-title {
	color: #ffffff !important;
}

#mhbs-public-calendar .fc-list-event-time,
#mhbs-public-calendar .fc-list-event-title {
	color: #014932 !important;
}

/*
 * Enforce event colours via classNames — overrides any WordPress theme reset
 * that might clear FullCalendar's inline background-color/color styles.
 * These classes are set in PHP on every event object.
 */
#mhbs-public-calendar .fc-event.mhbs-pub-public {
	background-color: #395144 !important;
	border-color:     #014932 !important;
	color:            #ffffff !important;
}
#mhbs-public-calendar .fc-event.mhbs-pub-private {
	background-color: #888888 !important;
	border-color:     #666666 !important;
	color:            #ffffff !important;
}
#mhbs-public-calendar .fc-event.mhbs-pub-block {
	background-color: #8b4040 !important;
	border-color:     #6b2020 !important;
	color:            #ffffff !important;
}

/* Pending Hold — golden yellow */
#mhbs-public-calendar .fc-event.mhbs-pub-pending {
	background-color: #d4a017 !important;
	border-color:     #b8880e !important;
	color:            #1a0a00 !important;
}

/* List view: dot colour and row text */
#mhbs-public-calendar .fc-list-event.mhbs-pub-public .fc-list-event-dot {
	border-color: #395144 !important;
}
#mhbs-public-calendar .fc-list-event.mhbs-pub-pending .fc-list-event-dot {
	border-color: #d4a017 !important;
}
#mhbs-public-calendar .fc-list-event.mhbs-pub-private .fc-list-event-dot {
	border-color: #6b8f6b !important;
}
#mhbs-public-calendar .fc-list-event.mhbs-pub-block .fc-list-event-dot {
	border-color: #6b2020 !important;
}

/* ── Popup ────────────────────────────────────────────────────────────────── */

.mhbs-cal-popup {
	position: fixed;
	z-index: 9999;
	background: #fff;
	border: 2px solid #395144;
	border-radius: 6px;
	padding: 16px 18px;
	max-width: 300px;
	box-shadow: 0 4px 18px rgba(0,0,0,0.15);
	font-family: 'Heebo', sans-serif;
	font-size: 14px;
}

.mhbs-cal-popup[hidden] {
	display: none;
}

.mhbs-cal-popup-close {
	position: absolute;
	top: 6px;
	right: 10px;
	background: none;
	border: none;
	font-size: 20px;
	cursor: pointer;
	color: #395144;
	line-height: 1;
	padding: 0;
}

.mhbs-cal-popup-title {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 16px;
	font-weight: 700;
	color: #014932;
	margin: 0 0 6px;
}

.mhbs-cal-popup-space,
.mhbs-cal-popup-time,
.mhbs-cal-popup-desc {
	margin: 0 0 4px;
	color: #333;
}

.mhbs-cal-popup-space { font-weight: 600; color: #395144; }
.mhbs-cal-popup-time  { font-size: 14px; color: #1d1d1d; }
.mhbs-cal-popup-desc  { font-size: 14px; color: #1d1d1d; font-style: italic; line-height: 1.55; }

/* ── Booking Request Form ─────────────────────────────────────────────────── */

.mhbs-form-wrap {
	padding: 0;
}

.mhbs-form-header {
	margin-bottom: 28px;
}

.mhbs-form-title {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 1.8rem;
	color: #ffffff;
	margin: 0 0 10px;
}

.mhbs-form-notice {
	background: #f0f5f2;
	border-left: 4px solid #395144;
	padding: 12px 16px;
	margin: 0;
	font-size: 15px;
	border-radius: 0 4px 4px 0;
}

/* ── Messages ────────────────────────────────────────────────────────────── */

.mhbs-form-messages {
	margin-bottom: 20px;
	padding: 14px 18px;
	border-radius: 5px;
	font-size: 15px;
	line-height: 1.5;
}

.mhbs-form-messages[hidden] { display: none; }

.mhbs-form-messages.mhbs-msg-success {
	background: #e6f4ec;
	border: 1px solid #4caf50;
	color: #1b5e20;
}

.mhbs-form-messages.mhbs-msg-error {
	background: #fef0f0;
	border: 1px solid #ef5350;
	color: #b71c1c;
}

.mhbs-form-messages.mhbs-msg-warning {
	background: #fff8e1;
	border: 1px solid #f9a825;
	color: #4e3b00;
}

/* ── Fieldsets ────────────────────────────────────────────────────────────── */

.mhbs-fieldset {
	border: 1px solid #cdd9d3;
	border-radius: 6px;
	padding: 0 22px 20px;
	margin-bottom: 24px;
	background: #fafcfb;
}


.mhbs-fieldset[hidden] { display: none; }

/* Section heading — rendered as <h3> block, no float needed. */
.mhbs-legend {
	display: block;
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 1.0rem;
	font-weight: 700;
	color: #014932;
	padding: 14px 0 10px;
	margin: 0 0 16px;
	border-bottom: 2px solid #cdd9d3;
}

.mhbs-fieldset-acknowledgements {
	background: #f5faf7;
	border-color: #395144;
}

.mhbs-fieldset-acknowledgements .mhbs-legend {
	border-bottom-color: #395144;
}

/* ── Field layout ─────────────────────────────────────────────────────────── */

.mhbs-field {
	display: flex;
	flex-direction: column;
	margin-bottom: 16px;
}

.mhbs-field-row {
	display: grid;
	gap: 16px;
}

.mhbs-field-row-2 { grid-template-columns: 1fr 1fr; }
.mhbs-field-row-3 { grid-template-columns: 2fr 1fr 1fr; }
.mhbs-field-row-4 { grid-template-columns: 2fr 1fr 1fr 2fr; }

@media (max-width: 640px) {
	.mhbs-field-row-2,
	.mhbs-field-row-3,
	.mhbs-field-row-4 {
		grid-template-columns: 1fr;
	}
}

/* ── Inputs ───────────────────────────────────────────────────────────────── */

.mhbs-label {
	font-weight: 600;
	font-size: 14px;
	color: #1d1d1d;
	margin-bottom: 5px;
}

.mhbs-label-sm { font-size: 13px; }

.mhbs-optional {
	font-weight: 400;
	font-size: 12px;
	color: #666;
}

.mhbs-required {
	color: #cf2e2e;
	margin-left: 2px;
}

.mhbs-input,
.mhbs-select,
.mhbs-textarea {
	font-family: 'Heebo', sans-serif;
	font-size: 15px;
	border: 1px solid #b0bfb8;
	border-radius: 4px;
	padding: 9px 12px;
	background: #fff;
	color: #1d1d1d;
	transition: border-color 0.15s;
	width: 100%;
	box-sizing: border-box;
}

.mhbs-input:focus,
.mhbs-select:focus,
.mhbs-textarea:focus {
	outline: none;
	border-color: #395144;
	box-shadow: 0 0 0 3px rgba(57,81,68,0.12);
}

.mhbs-input.mhbs-has-error,
.mhbs-select.mhbs-has-error,
.mhbs-textarea.mhbs-has-error {
	border-color: #cf2e2e;
	background: #fff8f8;
}

.mhbs-textarea {
	resize: vertical;
	min-height: 80px;
}

/* ── Radio / Checkbox ─────────────────────────────────────────────────────── */

.mhbs-radio-group {
	display: flex;
	gap: 20px;
	padding-top: 4px;
}

.mhbs-radio-label,
.mhbs-checkbox-label {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	cursor: pointer;
	font-size: 15px;
	line-height: 1.4;
}

.mhbs-checkbox-required {
	font-weight: 500;
}

.mhbs-radio-label input[type="radio"],
.mhbs-checkbox-label input[type="checkbox"] {
	margin-top: 3px;
	flex-shrink: 0;
	accent-color: #395144;
	width: 16px;
	height: 16px;
}

/* ── Field hints, errors ─────────────────────────────────────────────────── */

.mhbs-field-hint {
	font-size: 13px;
	color: #555;
	margin: 4px 0 0;
	line-height: 1.4;
}

.mhbs-field-error {
	display: none;
	font-size: 13px;
	color: #cf2e2e;
	margin-top: 4px;
}

.mhbs-field-error.mhbs-visible { display: block; }

/* ── Capacity info ────────────────────────────────────────────────────────── */

.mhbs-capacity-info {
	margin-top: 6px;
	padding: 8px 12px;
	background: #f0f5f2;
	border-radius: 4px;
	font-size: 13px;
	color: #395144;
	line-height: 1.5;
}

.mhbs-capacity-info[hidden] { display: none; }

.mhbs-capacity-warning {
	display: none;
	margin-top: 5px;
	padding: 6px 10px;
	background: #fff8e1;
	border: 1px solid #f9a825;
	border-radius: 4px;
	font-size: 13px;
	color: #4e3b00;
}

.mhbs-capacity-warning.mhbs-visible { display: block; }
.mhbs-capacity-warning[hidden]       { display: none !important; }

/* ── Setup / cleanup info ─────────────────────────────────────────────────── */

.mhbs-extra-time-info {
	margin-top: 8px;
	padding: 8px 12px;
	background: #eef3f0;
	border-radius: 4px;
	font-size: 14px;
	color: #395144;
}

.mhbs-extra-time-info[hidden] { display: none; }

/* ── Notices ──────────────────────────────────────────────────────────────── */

.mhbs-notice {
	padding: 12px 16px;
	border-radius: 5px;
	margin-bottom: 16px;
	font-size: 14px;
	line-height: 1.5;
}

.mhbs-notice-info {
	background: #e8f4fd;
	border: 1px solid #90caf9;
	color: #0d3c61;
}

/* ── Public hours rows ────────────────────────────────────────────────────── */

.mhbs-public-hour-row {
	background: #fff;
	border: 1px solid #cdd9d3;
	border-radius: 5px;
	padding: 14px 16px;
	margin-bottom: 12px;
	position: relative;
}

.mhbs-btn-remove-ph {
	background: none;
	border: none;
	color: #cf2e2e;
	font-size: 13px;
	cursor: pointer;
	padding: 4px 0;
	text-decoration: underline;
	margin-top: 6px;
}

.mhbs-btn-remove-ph:hover { color: #9b0000; }

/* ── Buttons ──────────────────────────────────────────────────────────────── */

.mhbs-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	font-family: 'Heebo', sans-serif;
	font-weight: 600;
	font-size: 15px;
	padding: 11px 24px;
	transition: background-color 0.15s, opacity 0.15s;
	text-decoration: none;
}

.mhbs-btn-primary {
	background-color: #cf2e2e;
	color: #fff;
}

.mhbs-btn-primary:hover,
.mhbs-btn-primary:focus {
	background-color: #a82424;
	color: #fff;
}

.mhbs-btn-primary:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

.mhbs-btn-secondary {
	background-color: #395144;
	color: #fff;
	font-size: 14px;
}

.mhbs-btn-secondary:hover,
.mhbs-btn-secondary:focus {
	background-color: #014932;
	color: #fff;
}

.mhbs-btn-sm {
	padding: 7px 16px;
	font-size: 13px;
}

/* ── Submit spinner ───────────────────────────────────────────────────────── */

.mhbs-btn-spinner {
	display: inline-block;
	width: 16px;
	height: 16px;
	border: 2px solid rgba(255,255,255,0.4);
	border-top-color: #fff;
	border-radius: 50%;
	animation: mhbs-spin 0.7s linear infinite;
	flex-shrink: 0;
}

.mhbs-btn-spinner[hidden] { display: none; }

@keyframes mhbs-spin {
	to { transform: rotate(360deg); }
}

/* ── Form footer ──────────────────────────────────────────────────────────── */

.mhbs-form-footer {
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
	margin-top: 8px;
}

.mhbs-required-note {
	font-size: 13px;
	color: #666;
	margin: 0;
}

/* ── Checkbox field layout ────────────────────────────────────────────────── */

.mhbs-checkbox-field {
	margin-bottom: 14px;
}

/* ── Responsive ───────────────────────────────────────────────────────────── */

@media (max-width: 480px) {
	.mhbs-form-title {
		font-size: 1.4rem;
	}
	.mhbs-fieldset {
		padding: 14px 14px;
	}
	.mhbs-form-footer {
		flex-direction: column;
		align-items: flex-start;
	}
}