Template:Calendar/styles.css

.template-calendar { width: 300px; background: var( --color-surface-2 ); border-radius: var( --border-radius--medium ); font-size: 0.875rem; }

.template-calendar__grid { display: grid; grid-template-columns: repeat(7, 1fr); text-align: center; }

.template-calendar__day > a { padding-top: 0.5rem; padding-bottom: 0.5rem; display: flex; color: var( --color-base--emphasized ); border-radius: var( --border-radius--small ); font-weight: 500; /* aspect-ratio: 1; */ justify-content: center; align-items: center; }

.template-calendar__day--nextmonth > a { color: var( --color-base--subtle ); }

.template-calendar__day > a:hover { background-color: var( --background-color-quiet--hover ); }

.template-calendar__day > a:active { background-color: var( --background-color-quiet--active ); }