/* Bootstrap RTL sets right: 0 on every dropdown. Datepicker positions itself
   with left or right inline, so clear the opposite edge to avoid stretching or
   moving the popup away from its input. */
html[dir="rtl"] body .datepicker-dropdown:not(.datepicker-rtl) {
    right: auto;
}
html[dir="rtl"] body .datepicker-dropdown.datepicker-rtl {
    left: auto;
}

/* Shared popup theme for the dashboard and academy setup wizard. */
html body .datepicker.datepicker-dropdown {
    width: 300px;
    max-width: calc(100vw - 24px);
    padding: 14px;
    border: 1px solid #e5e1f5;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 16px 40px rgba(42, 35, 86, .16);
    color: #29263f;
    font-family: inherit;
}
html body .datepicker.datepicker-dropdown table {
    width: 100%;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 2px;
}
html body .datepicker.datepicker-dropdown table th,
html body .datepicker.datepicker-dropdown table td {
    width: auto;
    height: 34px;
    border-radius: 9px;
    font-size: .82rem;
    text-align: center;
}
html body .datepicker.datepicker-dropdown table th.datepicker-switch {
    color: #29263f;
    font-size: .9rem;
    font-weight: 700;
}
html body .datepicker.datepicker-dropdown table th.dow {
    color: #8c879e;
    font-size: .72rem;
    font-weight: 600;
}
html body .datepicker.datepicker-dropdown table :is(th.prev, th.next, th.datepicker-switch, td.day, td span):hover {
    background: #f0edff;
    color: #5b4bce;
}
html body .datepicker.datepicker-dropdown table td.today:not(.active) {
    background: #f0edff !important;
    background-image: none !important;
    color: #5b4bce !important;
    font-weight: 700;
}
html body .datepicker.datepicker-dropdown table :is(td.active, td.active:hover, td span.active, td span.active:hover) {
    background: #7367f0 !important;
    background-image: none !important;
    color: #fff !important;
    text-shadow: none;
    box-shadow: 0 4px 10px rgba(115, 103, 240, .22);
}
html body .datepicker.datepicker-dropdown table :is(td.old, td.new, td.disabled, td span.disabled) {
    color: #b5b1c1;
}
html body .datepicker.datepicker-dropdown table :is(td.disabled, td.disabled:hover, td span.disabled, td span.disabled:hover) {
    background: transparent !important;
    color: #c3bfcb !important;
    cursor: default;
    box-shadow: none;
}
html body .datepicker.datepicker-dropdown table td span {
    height: 38px;
    line-height: 38px;
    border-radius: 9px;
}

/* Override the legacy dashboard calendar's blue/green pseudo-elements and
   oversized, offset table. These selectors cover wizard and dashboard fields. */
html body .datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.day::before {
    content: none !important;
}
html body .datepicker.datepicker-dropdown :is(.datepicker-days, .datepicker-months, .datepicker-years, .datepicker-decades, .datepicker-centuries) {
    padding: 0;
}
html body .datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody {
    top: 0;
}
html body .datepicker.datepicker-dropdown .datepicker-days table.table-condensed thead tr th {
    padding: .45rem 0;
    text-align: center;
    font-family: inherit;
}
html body .datepicker.datepicker-dropdown .datepicker-days table.table-condensed thead tr :is(th.prev, th.next) {
    color: #6655db;
    background: transparent;
    font-size: 1.1rem;
    border-radius: 9px;
}
html body .datepicker.datepicker-dropdown .datepicker-days table.table-condensed thead tr th.datepicker-switch {
    color: #29263f;
    font-size: .95rem;
    font-weight: 700;
}
html body .datepicker.datepicker-dropdown .datepicker-days table.table-condensed thead tr th.dow {
    padding-top: .8rem;
    color: #928da5;
    font-size: .72rem;
    font-weight: 600;
}
html body .datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.day {
    padding: 0;
    color: #413c55;
    font-size: .82rem;
}
html body .datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.day:hover {
    background: #f0edff;
    color: #5b4bce;
}
html body .datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.day.today:not(.active) {
    background: #f0edff !important;
    color: #5b4bce !important;
}
html body .datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.day.active {
    background: #7367f0 !important;
    color: #fff !important;
}
html body .datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.day:is(.old, .new, .disabled) {
    color: #bbb6c8 !important;
}
