/* Mobile ergonomics for the Android WebView wrapper. Kept intentionally small —
   this app's pages don't share a layout, so a handful of global rules here
   beats hand-editing every page individually. */

/* Prevent any stray fixed-width element from forcing the whole page to scroll sideways. */
html, body {
    max-width: 100%;
    overflow-x: hidden;
}

/* Removes the grey/blue flash-on-tap box so the app feels native inside a WebView
   instead of like a browser tab. */
* {
    -webkit-tap-highlight-color: transparent;
}

/* Make every modal internally scrollable (Bootstrap's own modal-dialog-scrollable
   behavior, applied globally) so a long form on a short device — e.g. with the
   on-screen keyboard open — never clips its Save button off-screen. Uses
   max-height rather than height so short confirmation modals are unaffected. */
.modal-dialog {
    max-height: calc(100% - 1rem);
}
.modal-content {
    max-height: 100%;
    overflow: hidden;
}
.modal-body {
    overflow-y: auto;
}

/* This app is dense with icon-only btn-sm actions in admin tables. Bootstrap's
   btn-sm (~31px tall) is below the ~40-44px minimum that's reliable for touch,
   so widen the tap target on small viewports only — the desktop admin console
   density is left untouched. */
@media (max-width: 767.98px) {
    .btn-sm {
        min-height: 40px;
        min-width: 40px;
    }
    .form-select-sm,
    .form-control-sm {
        min-height: 38px;
    }
}