/* Scoped calendar geometry measured from the legacy datepicker, without Bootstrap. */
@font-face {
    font-family: 'Staff Legacy Open Sans';
    font-style: normal;
    font-weight: 300 400;
    font-display: swap;
    src: url('/assets/fonts/staff-legacy-open-sans-dda1847350dd.woff2') format('woff2');
}
.fi-fo-date-time-picker-panel.staff-legacy-calendar-panel {
    width: 222px;
    min-width: 222px;
    max-width: calc(100vw - 16px);
    padding: 5px;
    border: 1px solid #efefef;
    border-radius: 0;
    background: #fff;
    color: #333;
    box-shadow: 5px 5px rgba(102, 102, 102, .1);
}
.staff-legacy-calendar-panel > [data-staff-calendar-original] { display: none !important; }
.staff-legacy-calendar {
    font-family: 'Staff Legacy Open Sans', Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    width: 210px;
    margin: 0 !important;
}
.staff-legacy-calendar button {
    appearance: none;
    margin: 0;
    border: 0;
    border-radius: 0;
    padding: 5px;
    min-width: 0;
    min-height: 0;
    height: 30px;
    color: inherit;
    background: transparent;
    font: inherit;
    cursor: pointer;
    text-align: center;
    box-shadow: none;
}
.staff-legacy-calendar button:hover { background: #eee; }
.staff-legacy-calendar button:focus-visible { outline: 2px solid #2678fc; outline-offset: -2px; }
.staff-legacy-calendar button:disabled { color: #bbb; cursor: default; background: transparent; }
.staff-legacy-calendar-nav { display: grid; grid-template-columns: 30px 150px 30px; }
.staff-legacy-calendar-nav button { font-weight: 400; }
.staff-legacy-calendar-nav svg { width: 14px; height: 14px; margin: 3px auto; }
.staff-legacy-calendar-days { display: grid; grid-template-columns: repeat(7, 30px); }
.staff-legacy-calendar-days > span { padding: 5px; text-align: center; height: 30px; }
.staff-legacy-calendar-days > button { width: 30px; font-weight: 300; color: #000; }
.staff-legacy-calendar .staff-calendar-outside { color: #999; }
.staff-legacy-calendar .staff-calendar-selected { background: #4b8df8; color: #fff; }
.staff-legacy-calendar .staff-calendar-selected:hover { background: #2678fc; color: #fff; }
.staff-legacy-calendar-periods { display: grid; grid-template-columns: repeat(4, 1fr); padding: 5px; }
.staff-legacy-calendar-periods > button { height: 54px; margin: 2px; padding: 0; }
.staff-legacy-calendar-panel .fi-fo-date-time-picker-time-inputs { margin-top: 5px; padding: 5px 0 0; }
.dark .fi-fo-date-time-picker-panel.staff-legacy-calendar-panel { background: #18181b; color: #e4e4e7; border-color: #3f3f46; box-shadow: 5px 5px rgb(0 0 0 / .2); }
.dark .staff-legacy-calendar button:hover { background: #3f3f46; }
.dark .staff-legacy-calendar-days > button { color: #e4e4e7; }
.dark .staff-legacy-calendar .staff-calendar-outside { color: #a1a1aa; }
.dark .staff-legacy-calendar button:disabled { color: #71717a; }
.dark .staff-legacy-calendar .staff-calendar-selected { background: #4b8df8; color: #fff; }