/* =========================================================================
   TMT Calendar — styling
   All colors are CSS custom properties so the site owner can retheme this
   easily (in a child theme / Additional CSS / Elementor custom CSS) without
   touching plugin files. Override any of these on .tmt-cal-wrap or :root.
   ========================================================================= */

.tmt-cal-wrap {
	--tmt-cal-trekking: #2D8659;   /* brand green — matches the existing "Booking #" status color */
	--tmt-cal-trekking-tint: #E6F3EC;
	--tmt-cal-trail: #FF4D00;      /* brand orange — matches the site's primary brand color */
	--tmt-cal-trail-tint: #FFEEE6;
	--tmt-cal-both: linear-gradient(135deg, #2D8659 50%, #FF4D00 50%);
	--tmt-cal-both-tint: #F1EFE9;
	--tmt-cal-other: #9aa0a6;
	--tmt-cal-other-tint: #f1f2f3;
	--tmt-cal-briefing: #5b21b6;   /* deliberately not green/orange/red — a distinct "internal meeting" indigo so a briefing pill can never be mistaken for a trip pill */
	--tmt-cal-briefing-tint: #F1ECFB;
	--tmt-cal-border: #e2e4e7;
	--tmt-cal-bg: #ffffff;
	--tmt-cal-day-bg: #fafbfc;
	--tmt-cal-text: #1d2327;
	--tmt-cal-muted: #6b7280;
	--tmt-cal-radius: 8px;
	--tmt-cal-pill-text: #ffffff;

	font-family: inherit;
	color: var(--tmt-cal-text);
	max-width: 100%;
}

.tmt-cal-legend {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	font-size: 13px;
	color: var(--tmt-cal-muted);
	margin-bottom: 12px;
}
.tmt-cal-legend .tmt-cal-swatch {
	width: 12px;
	height: 12px;
	border-radius: 3px;
	display: inline-block;
	margin-left: 10px;
}
.tmt-cal-legend .tmt-cal-swatch:first-child {
	margin-left: 0;
}
.tmt-cal-swatch.tmt-cal-trekking { background: var(--tmt-cal-trekking); }
.tmt-cal-swatch.tmt-cal-trail    { background: var(--tmt-cal-trail); }
.tmt-cal-swatch.tmt-cal-both     { background: var(--tmt-cal-both); }

.tmt-cal-nav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	margin-bottom: 10px;
}
.tmt-cal-nav button {
	background: var(--tmt-cal-day-bg);
	border: 1px solid var(--tmt-cal-border);
	border-radius: 50%;
	width: 32px;
	height: 32px;
	cursor: pointer;
	font-size: 16px;
	line-height: 1;
	color: var(--tmt-cal-text);
	transition: background 0.15s ease;
}
.tmt-cal-nav button:hover {
	background: var(--tmt-cal-border);
}
.tmt-cal-month-label {
	display: none; /* the title is rendered inside the grid itself */
}

.tmt-cal-grid-container {
	overflow-x: auto;
}

.tmt-cal-month-title {
	text-align: center;
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 10px;
}

.tmt-cal-weekdays {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 4px;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	color: var(--tmt-cal-muted);
	margin-bottom: 4px;
	min-width: 700px;
}
.tmt-cal-weekdays > div {
	text-align: center;
	padding: 4px 0;
}

.tmt-cal-days {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 4px;
	min-width: 700px;
}

.tmt-cal-day {
	background: var(--tmt-cal-day-bg);
	border: 1px solid var(--tmt-cal-border);
	border-radius: var(--tmt-cal-radius);
	min-height: 90px;
	padding: 6px;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.tmt-cal-day-empty {
	background: transparent;
	border: none;
}
.tmt-cal-day-num {
	font-size: 12px;
	font-weight: 600;
	color: var(--tmt-cal-muted);
}

.tmt-cal-pill {
	border-radius: 6px;
	border-left: 3px solid var(--tmt-cal-other);
	background: var(--tmt-cal-other-tint);
	padding: 4px 6px 4px 8px;
	font-size: 11px;
	line-height: 1.3;
	color: var(--tmt-cal-text);
	cursor: default;
	display: block;
	text-decoration: none;
}
a.tmt-cal-pill {
	cursor: pointer;
}
a.tmt-cal-pill:hover {
	filter: brightness(0.97);
}
.tmt-cal-pill-clickable {
	box-shadow: 0 0 0 1px rgba(0,0,0,0.03);
}
.tmt-cal-pill-clickable:hover {
	box-shadow: 0 2px 6px rgba(0,0,0,0.12);
	transform: translateY(-1px);
}
.tmt-cal-pill-cta {
	display: block;
	margin-top: 3px;
	font-size: 10px;
	font-weight: 700;
	color: white;
	background: var(--tmt-cal-trail);
	padding: 2px 6px;
	border-radius: 3px;
	text-align: center;
}
.tmt-cal-pill.tmt-cal-trekking .tmt-cal-pill-cta {
	background: var(--tmt-cal-trekking);
}
.tmt-cal-pill-spots {
	display: block;
	color: var(--tmt-cal-muted);
	font-size: 10px;
}
.tmt-cal-pill-registered-count {
	display: block;
	color: var(--tmt-cal-muted);
	font-size: 9px;
}
.tmt-cal-pill-full-text {
	color: #c0392b;
	font-weight: 700;
}
a.tmt-cal-pill.tmt-cal-pill-full {
	opacity: 0.85;
}
/* Customer-facing "Last Spots" warning — same treatment pattern as Full,
   amber instead of red so it reads as "hurry" rather than "too late." */
a.tmt-cal-pill.tmt-cal-pill-last-spots {
	opacity: 0.95;
}
a.tmt-cal-pill.tmt-cal-pill-last-spots .tmt-cal-pill-spots {
	color: #b7791f;
	font-weight: 700;
}
/* Staff-view inline availability tags, shown next to the spots count
   inside the summary line rather than replacing it (staff still see the
   exact numbers — this is just a quick visual flag). */
.tmt-cal-availability-tag {
	font-weight: 700;
	font-size: 10px;
}
.tmt-cal-availability-last-spots {
	color: #b7791f;
}
.tmt-cal-availability-full {
	color: #c0392b;
}
/* Briefing meeting pill — a genuinely different EVENT TYPE from a trip
   departure, not just a different activity, so it gets a shape/color
   treatment that reads as distinct at a glance rather than "one more
   activity color" (indigo, dashed border, a meeting icon up front — none
   of which any trip pill ever uses, regardless of activity). */
.tmt-cal-pill-briefing {
	border-left-style: dashed;
	border-left-width: 3px;
	border-left-color: var(--tmt-cal-briefing);
	background: var(--tmt-cal-briefing-tint);
}
.tmt-cal-pill-briefing strong {
	color: var(--tmt-cal-briefing);
}
.tmt-cal-briefing-icon {
	margin-right: 3px;
}

.tmt-cal-pill.tmt-cal-trekking {
	border-left-color: var(--tmt-cal-trekking);
	background: var(--tmt-cal-trekking-tint);
}
.tmt-cal-pill.tmt-cal-trekking strong {
	color: var(--tmt-cal-trekking);
}
.tmt-cal-pill.tmt-cal-trail {
	border-left-color: var(--tmt-cal-trail);
	background: var(--tmt-cal-trail-tint);
}
.tmt-cal-pill.tmt-cal-trail strong {
	color: var(--tmt-cal-trail);
}
.tmt-cal-pill.tmt-cal-both {
	border-left-color: #b08a3e;
	background: var(--tmt-cal-both-tint);
}
.tmt-cal-pill.tmt-cal-other {
	border-left-color: var(--tmt-cal-other);
	background: var(--tmt-cal-other-tint);
}

.tmt-cal-pill strong {
	display: block;
	font-size: 11px;
	font-weight: 600;
}
.tmt-cal-pill-meta {
	display: block;
	color: var(--tmt-cal-muted);
	font-size: 10px;
}
.tmt-cal-pill-briefing {
	display: block;
	color: var(--tmt-cal-trekking);
	font-size: 10px;
	font-weight: 600;
	margin-top: 2px;
}

/* Multi-day trip visual: a colored bar runs through every day between
   departure and return (inclusive), same color as that trip's activity —
   adjacent day cells line up to read as one continuous line. When a span
   crosses into the next week row, the bar simply starts again at that
   row's left edge, same as most simple calendar UIs handle multi-week
   spans. The return day additionally gets a small marker instead of a
   full pill, so it's clearly "back today," not a new departure. */
.tmt-cal-transit-bar {
	height: 15px;
	border-radius: 3px;
	margin: 2px 0;
	overflow: hidden;
	display: flex;
	align-items: center;
	padding: 0 4px;
}
.tmt-cal-transit-bar.tmt-cal-trekking { background: var(--tmt-cal-trekking); }
.tmt-cal-transit-bar.tmt-cal-trail    { background: var(--tmt-cal-trail); }
.tmt-cal-transit-bar.tmt-cal-both     { background: var(--tmt-cal-both); }
.tmt-cal-transit-bar.tmt-cal-other    { background: var(--tmt-cal-other); }
.tmt-cal-transit-bar-label {
	color: white;
	font-size: 9px;
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
/* Same height/margin as a real bar, but invisible — reserves this lane's
   vertical space on a day where nothing happens to be running through
   it, so bars in OTHER lanes stay at a consistent position day to day
   instead of shifting up to fill the gap. */
.tmt-cal-transit-bar-spacer {
	height: 15px;
	margin: 2px 0;
}

.tmt-cal-return-marker {
	font-size: 10px;
	font-weight: 600;
	padding: 3px 6px;
	border-radius: 4px;
	margin-top: 2px;
	background: white;
}
.tmt-cal-return-marker.tmt-cal-trekking { border: 1px dashed var(--tmt-cal-trekking); color: var(--tmt-cal-trekking); }
.tmt-cal-return-marker.tmt-cal-trail    { border: 1px dashed var(--tmt-cal-trail); color: var(--tmt-cal-trail); }
.tmt-cal-return-marker.tmt-cal-both     { border: 1px dashed var(--tmt-cal-both); color: var(--tmt-cal-both); }
.tmt-cal-return-marker.tmt-cal-other    { border: 1px dashed var(--tmt-cal-other); color: var(--tmt-cal-other); }

/* Staff detail modal content is styled further down under "Modal" */


.tmt-cal-denied {
	padding: 12px;
	background: #fff3cd;
	border: 1px solid #ffe69c;
	border-radius: 6px;
	color: #664d03;
}

.tmt-cal-widget-heading {
	margin-bottom: 12px;
}

/* --- View toggle (Month / Agenda) --- */
.tmt-cal-view-toggle {
	margin-left: auto;
	display: inline-flex;
	border: 1px solid var(--tmt-cal-border);
	border-radius: 6px;
	overflow: hidden;
}
.tmt-cal-view-btn {
	background: var(--tmt-cal-bg);
	border: none;
	padding: 4px 12px;
	font-size: 12px;
	cursor: pointer;
	color: var(--tmt-cal-muted);
}
.tmt-cal-view-btn + .tmt-cal-view-btn {
	border-left: 1px solid var(--tmt-cal-border);
}
.tmt-cal-view-btn.is-active {
	background: var(--tmt-cal-text);
	color: #fff;
}

/* --- Staff trip expand/collapse (native <details>/<summary>, zero JS) --- */
details.tmt-cal-pill {
	cursor: pointer;
}
details.tmt-cal-pill summary {
	list-style: none;
	transition: filter 0.15s ease;
}
details.tmt-cal-pill summary::-webkit-details-marker {
	display: none;
}
details.tmt-cal-pill summary:hover {
	filter: brightness(0.96);
}
details.tmt-cal-pill[open] {
	background: var(--tmt-cal-bg);
	box-shadow: 0 2px 8px rgba(0,0,0,0.12);
}
.tmt-cal-pill-wide {
	padding: 8px 10px;
}
.tmt-cal-pill-wide strong {
	font-size: 13px;
}
.tmt-cal-pill-wide .tmt-cal-pill-meta {
	font-size: 11px;
}

/* --- Expanded trip detail box (appears inline below the pill when clicked) --- */
.tmt-cal-detail {
	background: var(--tmt-cal-bg);
	color: var(--tmt-cal-text);
	border-radius: 6px;
	padding: 10px;
	margin-top: 8px;
	font-size: 12px;
	box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}
.tmt-cal-detail h3 {
	margin-top: 0;
	font-size: 15px;
}
.tmt-cal-detail-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}
.tmt-cal-detail-header h3 {
	margin-bottom: 8px;
}
.tmt-cal-detail-header .tmt-cal-btn-pen {
	flex-shrink: 0;
}

/* --- Unified edit popup: one pen icon (top-right of the card) opens
   everything editable for this departure in one place, replacing the old
   scattered per-field pens + separate bottom "Edit" panel. Fixed-position
   overlay (not a native <dialog> — this codebase has no existing dialog
   usage, and a plain overlay div behaves predictably across the
   wp-admin/Elementor front-end contexts this calendar can render in). --- */
.tmt-cal-edit-modal {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,0.45);
	z-index: 100000; /* above wp-admin's own admin-bar/menu chrome */
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}
.tmt-cal-edit-modal[hidden] {
	display: none;
}
.tmt-cal-edit-modal-inner {
	background: var(--tmt-cal-bg);
	color: var(--tmt-cal-text);
	border-radius: var(--tmt-cal-radius);
	width: 100%;
	max-width: 480px;
	max-height: 90vh;
	display: flex;
	flex-direction: column;
	box-shadow: 0 10px 40px rgba(0,0,0,0.25);
}
.tmt-cal-edit-modal-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 14px 18px;
	border-bottom: 1px solid var(--tmt-cal-border);
	font-size: 15px;
}
.tmt-cal-btn-modal-close {
	background: none;
	border: none;
	cursor: pointer;
	font-size: 16px;
	color: var(--tmt-cal-muted);
	padding: 2px 6px;
	border-radius: 4px;
}
.tmt-cal-btn-modal-close:hover {
	background: var(--tmt-cal-day-bg);
	color: var(--tmt-cal-text);
}
.tmt-cal-edit-modal-body {
	padding: 16px 18px;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.tmt-cal-edit-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.tmt-cal-edit-field > label {
	font-size: 12px;
	font-weight: 600;
	color: var(--tmt-cal-muted);
	text-transform: uppercase;
	letter-spacing: 0.02em;
}
.tmt-cal-edit-field select,
.tmt-cal-edit-field input[type="date"],
.tmt-cal-edit-field input[type="number"] {
	font-size: 14px;
	padding: 7px 9px;
	border: 1px solid var(--tmt-cal-border);
	border-radius: 5px;
}
.tmt-cal-readonly-note {
	font-size: 14px;
	padding: 7px 0;
}
.tmt-cal-edit-dates-row {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}
.tmt-cal-edit-subfield {
	display: flex;
	flex-direction: column;
	font-size: 11px;
	color: var(--tmt-cal-muted);
	gap: 3px;
}
/* Unified guide list — every guide on a departure (each booking's own,
   plus any manually-added ones) as one plain, consistently-styled list.
   No pill/chip/italic treatment for any entry regardless of source —
   client specifically asked for this after the manually-added guide
   ("Ploy") visually stood out from the booking-derived ones. */
.tmt-cal-guide-row {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 6px;
	padding: 4px 0;
}
.tmt-cal-guide-row .tmt-cal-muted-note {
	min-width: 44px;
}
.tmt-cal-guide-row-radio {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 11px;
	font-weight: 600;
	color: var(--tmt-cal-muted);
	text-transform: uppercase;
	cursor: pointer;
	flex-shrink: 0;
}
.tmt-cal-main-guide-radio {
	cursor: pointer;
}
.tmt-cal-guide-name {
	font-size: 14px;
}
.tmt-cal-add-guide-row {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 8px;
	padding-top: 8px;
	border-top: 1px dashed var(--tmt-cal-border);
	flex-wrap: wrap;
}
.tmt-cal-edit-modal-footer {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 18px;
	border-top: 1px solid var(--tmt-cal-border);
}
.tmt-cal-btn-primary {
	background: var(--tmt-cal-trail);
	border-color: var(--tmt-cal-trail);
	color: #fff;
}
.tmt-cal-btn-primary:hover {
	background: #e64500;
}
.tmt-cal-btn-primary:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}
.tmt-cal-modal-summary {
	font-size: 13px;
	line-height: 1.7;
	margin-bottom: 16px;
}

.tmt-cal-booking-table {
	width: 100%;
	border-collapse: collapse;
	margin-top: 8px;
	font-size: 11px;
}
.tmt-cal-booking-table th,
.tmt-cal-booking-table td {
	border: 1px solid var(--tmt-cal-border);
	padding: 4px 6px;
	text-align: left;
	vertical-align: top;
}
.tmt-cal-booking-table th {
	background: var(--tmt-cal-day-bg);
}
.tmt-cal-muted-note {
	color: var(--tmt-cal-muted);
	font-size: 10px;
}

.tmt-cal-booking-card {
	border: 1px solid var(--tmt-cal-border);
	border-radius: 6px;
	padding: 10px;
	margin-bottom: 12px;
}
.tmt-cal-booking-card-header {
	font-weight: 600;
	margin-bottom: 8px;
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}
.tmt-cal-status-badge {
	background: var(--tmt-cal-day-bg);
	border: 1px solid var(--tmt-cal-border);
	border-radius: 20px;
	padding: 2px 8px;
	font-size: 10px;
	font-weight: 500;
	text-transform: uppercase;
	color: var(--tmt-cal-muted);
}
.tmt-cal-booking-table th {
	width: 160px;
	color: var(--tmt-cal-muted);
	font-weight: 600;
}

/* Simplified per-booking card on the trip pill's expanded detail — just
   enough to identify who's who and jump to the full record (payment,
   luggage/shower, briefing, roster — all moved to the Full Detail Page).
   Deliberately much lighter-weight than .tmt-cal-booking-card's table
   layout above (still used elsewhere, e.g. nowhere now but kept for any
   future need) — a single compact line per booking. */
.tmt-cal-booking-card-simple {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	padding: 8px 10px;
	font-size: 13px;
}
.tmt-cal-booking-card-link {
	margin-left: auto;
	font-size: 12px;
	text-decoration: none;
	white-space: nowrap;
}
.tmt-cal-roster {
	margin-top: 10px;
}
.tmt-cal-roster-title {
	font-weight: 600;
	font-size: 12px;
	margin-bottom: 4px;
}
.tmt-cal-roster-table th {
	width: auto;
}
.tmt-cal-roster-raw {
	font-size: 12px;
	color: var(--tmt-cal-muted);
	white-space: pre-wrap;
}

/* --- Agenda (day-by-day) view --- */
.tmt-cal-agenda {
	max-height: 640px;
	overflow-y: auto;
	border: 1px solid var(--tmt-cal-border);
	border-radius: var(--tmt-cal-radius);
}
.tmt-cal-agenda-day {
	display: flex;
	border-bottom: 1px solid var(--tmt-cal-border);
}
.tmt-cal-agenda-day:last-child {
	border-bottom: none;
}
.tmt-cal-agenda-date {
	flex: 0 0 70px;
	text-align: center;
	padding: 12px 8px;
	background: var(--tmt-cal-day-bg);
	border-right: 1px solid var(--tmt-cal-border);
}
.tmt-cal-agenda-weekday {
	display: block;
	font-size: 11px;
	color: var(--tmt-cal-muted);
	text-transform: uppercase;
}
.tmt-cal-agenda-daynum {
	display: block;
	font-size: 20px;
	font-weight: 700;
}
.tmt-cal-agenda-events {
	flex: 1;
	padding: 10px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.tmt-cal-agenda-empty {
	padding: 24px;
	text-align: center;
	color: var(--tmt-cal-muted);
}

@media (max-width: 782px) {
	.tmt-cal-day {
		min-height: 70px;
	}
}

/* --- Staff editing: cancel state, reschedule, note, guide select --- */
.tmt-cal-pill-cancelled {
	opacity: 0.55;
	background: var(--tmt-cal-other-tint) !important;
	border-left-color: var(--tmt-cal-other) !important;
}
.tmt-cal-pill-cancelled strong {
	text-decoration: line-through;
	color: var(--tmt-cal-muted) !important;
}
.tmt-cal-cancelled-tag {
	display: inline-block;
	background: #c0392b;
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.03em;
	padding: 1px 6px;
	border-radius: 3px;
	margin-right: 6px;
	vertical-align: middle;
}
.tmt-cal-btn {
	font-size: 12px;
	font-weight: 600;
	padding: 5px 10px;
	border-radius: 5px;
	border: 1px solid var(--tmt-cal-border);
	background: var(--tmt-cal-bg);
	color: var(--tmt-cal-text);
	cursor: pointer;
}
.tmt-cal-btn:hover {
	background: var(--tmt-cal-border);
}
.tmt-cal-btn-cancel-toggle {
	border-color: #c0392b;
	color: #c0392b;
}
.tmt-cal-save-status {
	font-size: 12px;
	color: var(--tmt-cal-trekking);
	font-weight: 600;
}
.tmt-cal-note-field {
	width: 100%;
	font-size: 13px;
	padding: 6px 8px;
	border: 1px solid var(--tmt-cal-border);
	border-radius: 5px;
	resize: vertical;
}
.tmt-cal-capacity-field {
	width: 80px;
	font-size: 13px;
	padding: 6px 8px;
	border: 1px solid var(--tmt-cal-border);
	border-radius: 5px;
}
.tmt-cal-capacity-override-tag {
	font-size: 11px;
	font-weight: normal;
	color: #b7791f;
}
.tmt-cal-trip-warning {
	display: block;
	font-size: 12px;
	font-weight: 600;
	color: #92610c;
	background: #fff6e5;
	border: 1px solid #f0c975;
	border-radius: 5px;
	padding: 6px 8px;
}
.tmt-cal-trip-warning[hidden] {
	display: none;
}
.tmt-cal-btn-remove-guide {
	background: none;
	border: none;
	color: #c0392b;
	cursor: pointer;
	font-size: 12px;
	line-height: 1;
	padding: 2px 4px;
	border-radius: 50%;
	opacity: 0.7;
}
.tmt-cal-btn-remove-guide:hover {
	opacity: 1;
	background: rgba(0,0,0,0.08);
}
.tmt-cal-add-guide-field {
	font-size: 13px;
	padding: 6px 8px;
	border: 1px solid var(--tmt-cal-border);
	border-radius: 5px;
}
/* Total Participants — now shows the same X / Y spots value as the pill
   header (consolidated from a separate "Registered:" line). */
.tmt-cal-total-participants-value {
	font-weight: 600;
}

/* Real pen icon (SVG) used for every inline edit affordance in the staff
   modal — client asked for an actual icon, not the ✏️ emoji, in the
   site's brand orange (--tmt-cal-trail). */
.tmt-cal-btn-pen {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: none;
	border: none;
	cursor: pointer;
	color: var(--tmt-cal-trail);
	padding: 2px 4px;
	border-radius: 50%;
	opacity: 0.85;
	vertical-align: middle;
}
.tmt-cal-btn-pen:hover {
	opacity: 1;
	background: var(--tmt-cal-trail-tint);
}
.tmt-cal-btn-pen[hidden] {
	display: none;
}

.tmt-cal-guide-select {
	font-size: 13px;
	padding: 3px 6px;
	border: 1px solid var(--tmt-cal-border);
	border-radius: 4px;
}
/* =========================================================================
   v1.5 — Elementor style-control hooks + click-to-book
   ========================================================================= */
.tmt-cal-nav button {
	background: var(--tmt-cal-nav-bg, var(--tmt-cal-day-bg));
	color: var(--tmt-cal-nav-color, var(--tmt-cal-text));
	border-color: var(--tmt-cal-nav-border, var(--tmt-cal-border));
}
.tmt-cal-nav button:hover {
	background: var(--tmt-cal-nav-hover, var(--tmt-cal-border));
}
.tmt-cal-month-title {
	color: var(--tmt-cal-month-color, inherit);
}
.tmt-cal-head-em {
	font-style: italic;
	color: #C9862B;
}
.tmt-cal-book-hint {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-left: auto;
	font-size: 12px;
	letter-spacing: .06em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--tmt-cal-open, #FF4D00);
}
.tmt-cal-book-hint::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--tmt-cal-open, #FF4D00);
}
/* open (bookable) days — affordance only when booking is enabled */
.tmt-cal-wrap[data-book-on] .tmt-cal-day-open {
	cursor: pointer;
	position: relative;
	transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.tmt-cal-wrap[data-book-on] .tmt-cal-day-open::after {
	content: "+";
	position: absolute;
	right: 8px;
	bottom: 6px;
	font-size: 16px;
	line-height: 1;
	font-weight: 600;
	color: var(--tmt-cal-open, #FF4D00);
	opacity: 0;
	transform: translateY(3px);
	transition: opacity .2s ease, transform .2s ease;
}
.tmt-cal-wrap[data-book-on] .tmt-cal-day-open:hover {
	border-color: var(--tmt-cal-open, #FF4D00);
	box-shadow: 0 6px 18px rgba(255, 77, 0, .14);
	transform: translateY(-2px);
}
.tmt-cal-wrap[data-book-on] .tmt-cal-day-open:hover::after {
	opacity: 1;
	transform: translateY(0);
}