/*
 * Workshops month calendar.
 *
 * Loaded on: the "Workshops calendar" page template
 * Enqueued by Stylchen\Frontend\Assets.
 */

.events-page { padding-top: 38px; background: #fcfcfc; }
.events-intro { margin-bottom: 42px; text-align: center; }
.events-intro h2 { margin: 0; color: #333; font-family: "Playfair Display", Georgia, serif; font-size: 2.25rem; font-weight: 400; }
.events-intro h2::after { display: block; width: 45px; height: 2px; margin: 15px auto 0; background: #de124b; content: ""; }
.events-intro h2 span { color: #de124b; }
.events-calendar-wrap { overflow-x: auto; padding-bottom: 4px; }
.events-toolbar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-width: 53.125rem; margin-bottom: 15px; }
.events-toolbar h3 { margin: 0; color: #333; font-family: "Open Sans",Arial,sans-serif; font-size: 1.5rem; font-weight: 400; }
.events-toolbar__left, .events-toolbar__views { display: flex; align-items: center; }
.events-toolbar__views { justify-content: flex-end; }
.events-toolbar a, .events-toolbar button { display: inline-grid; min-height: 34px; place-items: center; border: 1px solid #ddd; border-radius: 0; padding: 6px 12px; background: #fff; color: #555; font-size: 0.8125rem; line-height: 1; }
.events-toolbar a:hover, .events-toolbar a:focus, .events-toolbar button:hover, .events-toolbar button:focus, .events-toolbar button.is-active { border-color: #de124b; background: #de124b; color: #fff; }
.events-toolbar button:disabled { cursor: default; opacity: 1; }
.events-arrow { width: 36px; padding: 0 !important; font-size: 1.5625rem !important; }
.events-today { margin-left: 9px; }
.events-calendar { min-width: 53.125rem; border-top: 1px solid #ddd; border-left: 1px solid #ddd; background: #fff; }
.events-calendar__weekdays, .events-calendar__days { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); }
.events-calendar__weekdays strong { border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 9px 5px; color: #555; background: #f7f7f7; font-size: 0.8125rem; font-weight: 600; text-align: center; }
.events-calendar__day { min-height: 8.3125rem; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 7px 7px 5px; background: #fff; }
.events-calendar__day > time { display: block; color: #555; text-align: right; }
.events-calendar__day.is-other-month { background: #fafafa; }
.events-calendar__day.is-other-month > time { color: #bbb; }
.events-calendar__day.is-today { background: #fff8dc; }
.events-calendar__items { margin-top: 6px; }
.events-calendar__event { display: block; overflow: hidden; margin-bottom: 3px; border-radius: 2px; padding: 3px 5px; background: var(--event-color,#de124b); color: #fff; font-size: 0.6875rem; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.events-calendar__event:hover, .events-calendar__event:focus { color: #fff; filter: brightness(.9); }
@media (max-width: 560px) {
  /* style.css sets .section padding at this width; these views carry both
     classes, and the global sheet no longer comes last in the cascade. */
  .events-page { padding: 48px 0; }
}
