.app-date-time-picker { display: inline-flex; flex-direction: column; gap: .25rem; max-width: 100%; min-width: 16rem; }
.app-date-time-picker-input { box-sizing: border-box; width: 100% !important; max-width: 100%; font: inherit; }
.app-date-time-picker-fields { display: flex; flex-wrap: wrap; gap: .35rem; max-width: 100%; }
.app-date-time-picker-fields > input, .app-date-time-picker-fields > select { box-sizing: border-box; flex: 1 1 8rem; width: auto !important; min-width: 0; max-width: 100%; font: inherit; }
.app-date-time-picker-fields > [hidden] { display: none !important; }
.app-date-time-picker small, .app-date-time-picker-preview { display: block; font-size: .85em; line-height: 1.4; overflow-wrap: anywhere; }
.app-date-time-picker-preview:empty { display: none; }
.app-date-time-picker > [hidden],
[data-app-date-time-removed], select[data-app-date-time-source],
[data-app-date-time-source][hidden] { display: none !important; }
.app-timezone-control { margin: 1rem 0; font-size: .875rem; max-width: 36rem; }
.app-timezone-control select { display: block; max-width: 100%; margin-top: .5rem; }
.admin-org-date-time-preferences form > label { display: block; margin: .75rem 0; }
.admin-org-date-time-preferences select { margin-left: .5rem; max-width: 100%; }
@media (max-width: 480px) {
    .app-date-time-picker { min-width: 0; width: 100%; }
    .pb-mobile-browser tr.app-date-time-picker-row { display: block !important; width: 100%; max-width: calc(100vw - 3rem); }
    .pb-mobile-browser tr.app-date-time-picker-row > th, .pb-mobile-browser tr.app-date-time-picker-row > td { display: block !important; box-sizing: border-box; width: 100% !important; max-width: calc(100vw - 3rem) !important; white-space: normal; }
}