.bps-calendar {
    --bps-blue: #233f86;
    --bps-border: #d8deea;
    --bps-muted: #667085;
    color: #262b35;
    margin: 0 auto 48px;
    max-width: 1170px;
    padding: 8px 20px 0;
}

.bps-calendar *, .bps-calendar *::before, .bps-calendar *::after { box-sizing: border-box; }
.bps-calendar button, .bps-calendar input, .bps-calendar select { font: inherit; }
.bps-calendar__heading-row, .bps-calendar__toolbar, .bps-calendar__filters, .bps-calendar__legend { display: flex; align-items: center; gap: 12px; }
.bps-calendar__heading-row { justify-content: space-between; margin-bottom: 20px; }
.bps-calendar__heading-row h2 { color: var(--bps-blue); font-size: 30px; margin: 0; }
.bps-calendar__eyebrow { color: var(--bps-muted); font-size: 13px; font-weight: 700; letter-spacing: .08em; margin: 0 0 3px; text-transform: uppercase; }

.bps-calendar button { border: 1px solid var(--bps-blue); border-radius: 3px; background: #fff; color: var(--bps-blue); cursor: pointer; min-height: 40px; padding: 8px 14px; }
.bps-calendar button:hover, .bps-calendar button:focus-visible, .bps-calendar__view-switch .is-active, .bps-calendar__apply { background: var(--bps-blue); color: #fff; }
.bps-calendar__view-switch { display: flex; }
.bps-calendar__view-switch button { border-radius: 0; }
.bps-calendar__view-switch button:first-child { border-radius: 3px 0 0 3px; }
.bps-calendar__view-switch button:last-child { border-radius: 0 3px 3px 0; margin-left: -1px; }

.bps-calendar__filters { align-items: end; background: #f5f7fb; border: 1px solid var(--bps-border); flex-wrap: wrap; margin-bottom: 18px; padding: 14px; }
.bps-calendar__filters label { color: #344054; display: grid; font-size: 13px; font-weight: 700; gap: 5px; }
.bps-calendar__filters input, .bps-calendar__filters select, .bps-calendar__month-picker select { background: #fff; border: 1px solid #aeb8ca; border-radius: 3px; color: #1d2939; min-height: 40px; padding: 7px 9px; }
.bps-calendar__filters .bps-calendar__clear { border-color: #7b8494; color: #4b5565; }
.bps-calendar__error { color: #b42318; flex-basis: 100%; font-weight: 700; margin: 0; }

.bps-calendar__toolbar { flex-wrap: wrap; justify-content: space-between; margin-bottom: 16px; }
.bps-calendar__month-picker { display: flex; align-items: center; gap: 7px; }
.bps-calendar__period { color: var(--bps-blue); font-size: 24px; margin: 0 0 12px; text-align: center; }

.bps-calendar__table { border-collapse: collapse; table-layout: fixed; width: 100%; }
.bps-calendar__table th { background: var(--bps-blue); border: 1px solid var(--bps-blue); color: #fff; font-size: 14px; padding: 10px 6px; text-align: center; }
.bps-calendar__table td { border: 1px solid var(--bps-border); height: 122px; padding: 7px; vertical-align: top; width: 14.285%; }
.bps-calendar__table td.is-outside { background: #f7f8fa; color: #98a2b3; }
.bps-calendar__table td.is-today { box-shadow: inset 0 0 0 2px var(--bps-blue); }
.bps-calendar__day-number { display: block; font-size: 14px; font-weight: 700; margin-bottom: 5px; }
.bps-calendar__event { border: 0 !important; border-left: 5px solid currentColor !important; border-radius: 2px !important; color: #1c2430 !important; display: block; font-size: 12px !important; line-height: 1.25; margin: 0 0 4px; min-height: auto !important; padding: 6px 7px !important; text-align: left; width: 100%; }
.bps-calendar__event.term-date { background: #f1c879 !important; color: #3d2b06 !important; }
.bps-calendar__event.inset-days { background: #b7e795 !important; color: #173c0b !important; }
.bps-calendar__event.school-event { background: #fffbd9 !important; color: #443f08 !important; }

.bps-calendar__list { list-style: none; margin: 0; padding: 0; }
.bps-calendar__list li { border: 1px solid var(--bps-border); border-left: 7px solid; display: grid; grid-template-columns: minmax(150px, 220px) 1fr; margin-bottom: 8px; padding: 14px 16px; }
.bps-calendar__list li.term-date { border-left-color: #dd9933; }
.bps-calendar__list li.inset-days { border-left-color: #6ebe35; }
.bps-calendar__list li.school-event { border-left-color: #e1d74c; }
.bps-calendar__list time { color: var(--bps-muted); font-weight: 700; }
.bps-calendar__list button { border: 0; min-height: auto; padding: 0; text-align: left; }
.bps-calendar__list button:hover, .bps-calendar__list button:focus-visible { background: transparent; color: var(--bps-blue); text-decoration: underline; }
.bps-calendar__empty { background: #f7f8fa; border: 1px solid var(--bps-border); padding: 22px; text-align: center; }

.bps-calendar__legend { flex-wrap: wrap; font-size: 13px; margin-top: 16px; }
.bps-calendar__legend span { display: inline-flex; align-items: center; gap: 6px; }
.bps-calendar__legend i { border: 1px solid #9aa4b2; display: inline-block; height: 14px; width: 24px; }
.bps-calendar__legend i.term-date { background: #dd9933; }
.bps-calendar__legend i.inset-days { background: #81d742; }
.bps-calendar__legend i.school-event { background: #ffffcc; }
.bps-calendar__upcoming { display: grid; gap: 32px; grid-template-columns: 1fr 1fr; margin-top: 34px; }
.bps-calendar__upcoming h3 { color: var(--bps-blue); font-size: 21px; margin: 0 0 12px; }
.bps-calendar__upcoming ul { list-style: none; margin: 0; padding: 0; }
.bps-calendar__upcoming li { border-bottom: 1px solid var(--bps-border); padding: 8px 0; }
.bps-calendar__upcoming time { color: var(--bps-muted); display: block; font-size: 13px; font-weight: 700; }

.bps-calendar__dialog { border: 0; border-radius: 5px; box-shadow: 0 18px 55px rgba(0,0,0,.3); max-width: 520px; padding: 28px; width: calc(100% - 32px); }
.bps-calendar__dialog::backdrop { background: rgba(13, 25, 55, .65); }
.bps-calendar__dialog h3 { color: var(--bps-blue); font-size: 24px; margin: 4px 35px 8px 0; }
.bps-calendar__dialog-close { border: 0 !important; font-size: 28px !important; min-height: auto !important; padding: 0 7px !important; position: absolute; right: 12px; top: 10px; }
.bps-calendar__dialog-category { font-size: 12px; font-weight: 700; letter-spacing: .08em; margin: 0; text-transform: uppercase; }
.bps-calendar__dialog-date { font-weight: 700; }

@media (max-width: 760px) {
    .bps-calendar { padding-left: 12px; padding-right: 12px; }
    .bps-calendar__heading-row { align-items: flex-start; flex-direction: column; }
    .bps-calendar__toolbar { justify-content: center; }
    .bps-calendar__toolbar > button { flex: 1; }
    .bps-calendar__month-picker { order: -1; width: 100%; }
    .bps-calendar__month-picker label { flex: 1; }
    .bps-calendar__month-picker select { width: 100%; }
    .bps-calendar__table thead { display: none; }
    .bps-calendar__table, .bps-calendar__table tbody, .bps-calendar__table tr, .bps-calendar__table td { display: block; width: 100%; }
    .bps-calendar__table td { display: none; height: auto; min-height: 55px; }
    .bps-calendar__table td.has-events, .bps-calendar__table td.is-today { display: block; }
    .bps-calendar__table td.is-outside:not(.has-events) { display: none; }
    .bps-calendar__day-number { font-size: 16px; }
    .bps-calendar__list li { grid-template-columns: 1fr; gap: 5px; }
    .bps-calendar__upcoming { grid-template-columns: 1fr; }
}

