/* support for the popup calendar */


.calmenu { position: relative; display: inline-block; }
.calmenu-trigger {
	background: none; border: none; padding: 0;
	font: inherit; color: #3399CC; text-decoration: underline; cursor: pointer;
}

.calmenu-pop {
	display: block; text-align: left;
	position: absolute; top: 100%; left: 0; z-index: 1000; margin-top: 4px;
	width: 340px; max-width: calc(100vw - 16px);
	background: #fff; border: 1px solid #ccc; border-radius: 6px;
	box-shadow: 0 6px 18px rgba(0,0,0,.18);
	font: 12px/1.2 system-ui, sans-serif;
}
.calmenu-pop[hidden] { display: none; }

.calmenu-body {
	display: block; position: relative;               /* offsetParent for scrolling math */
	max-height: 320px; overflow-y: auto; padding: 0 8px 8px;
}

.cal-row {
	display: grid; grid-template-columns: 3em repeat(12, 1fr);
	gap: 3px; margin-top: 3px; align-items: center;
}
.cal-head {
	position: sticky; top: 0; z-index: 1;
	background: #fff; padding: 6px 0 4px; margin-top: 0;
	color: #666; text-align: center; font-weight: 600;
}
.cal-year { color: #333; font-variant-numeric: tabular-nums; text-align: left; }
.cal-row.no-events .cal-year { color: #bbb; }

.cal-cell {
	display: flex; gap: 1px; height: 18px;
	background: #eef0f3; border-radius: 3px; overflow: hidden;
}
.cal-cell a { flex: 1; background: #3b6fd8; }
.cal-cell a:hover,
.cal-cell a:focus { background: #1a3f8f; outline: none; }
.cal-cell a:focus-visible { box-shadow: inset 0 0 0 2px #ffbf47; }
.cal-cell a.current { background: #e8710a; }

.calmenu-tip {
	position: fixed; z-index: 1001; pointer-events: none;
	max-width: 280px; padding: 5px 8px; border-radius: 4px;
	background: #222; color: #fff; font: 12px/1.35 system-ui, sans-serif;
	box-shadow: 0 2px 6px rgba(0,0,0,.25);
}
.calmenu-tip[hidden] { display: none; }
.calmenu-tip b { display: block; font-weight: 600; color: #ffd27a; }

/* pop-up calendar menu on a phone moves left to stay onscreen */
@media (max-width: 600px) {
  .calmenu-pop {
    position: fixed;
    left: 8px; right: 8px;
    top: 50%; transform: translateY(-50%);
    width: auto; max-width: none;
    margin: 0;
  }
}