/* Mobile usability layer for Modoboa SPA */
:root { --mobo-mobile-gap: 12px; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { overflow-x: hidden; }
@media (max-width: 760px) {
  html, body, #app { width: 100%; max-width: 100%; min-height: 100%; }
  body { font-size: 16px; background: #f6f8fb; }
  .v-application, .v-application__wrap { max-width: 100vw; overflow-x: hidden; }
  .v-main, main, .v-container, .v-container-fluid { padding-left: 10px !important; padding-right: 10px !important; max-width: 100vw !important; }
  .v-card, .v-sheet, .v-table, .v-data-table, .v-expansion-panels, .v-list { border-radius: 14px !important; max-width: 100% !important; }
  .v-card { margin-bottom: var(--mobo-mobile-gap); }
  .v-row { margin-left: -6px !important; margin-right: -6px !important; }
  .v-col, [class*="v-col-"] { padding-left: 6px !important; padding-right: 6px !important; flex-basis: 100% !important; max-width: 100% !important; }
  .v-btn { min-height: 42px !important; white-space: normal !important; }
  .v-field, .v-input, input, textarea, select { font-size: 16px !important; }
  .v-toolbar, .v-app-bar { min-height: 56px !important; }
  .v-toolbar-title, .v-app-bar-title { font-size: 17px !important; line-height: 1.25 !important; white-space: normal !important; }
  .v-navigation-drawer { max-width: min(88vw, 340px) !important; }
  .v-dialog { margin: 10px !important; max-width: calc(100vw - 20px) !important; }
  .v-overlay__content { max-width: calc(100vw - 20px) !important; max-height: calc(100dvh - 20px) !important; }
  .v-card-title { font-size: 18px !important; line-height: 1.35 !important; white-space: normal !important; }
  .v-card-text { font-size: 15px !important; }
  .v-tabs { max-width: 100%; overflow-x: auto; }
  .v-tab { min-width: auto !important; padding-left: 12px !important; padding-right: 12px !important; }
  table { width: 100%; }
  .v-table__wrapper, .v-data-table__wrapper, .v-data-table-virtual__wrapper, .v-table { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  .v-table__wrapper table, .v-data-table table { min-width: 680px; }
  .v-data-table-footer { flex-wrap: wrap !important; gap: 8px !important; justify-content: center !important; }
  .v-menu > .v-overlay__content, .v-select__content, .v-autocomplete__content { max-width: calc(100vw - 20px) !important; }
  .v-snackbar__wrapper { min-width: 0 !important; max-width: calc(100vw - 20px) !important; margin: 10px !important; }
  .v-form .v-btn, form .v-btn { width: auto; max-width: 100%; }
  .v-form .v-row .v-btn, form .v-row .v-btn { margin-top: 4px; }
}
@media (max-width: 480px) {
  .v-main, main, .v-container, .v-container-fluid { padding-left: 8px !important; padding-right: 8px !important; }
  .v-btn { width: 100%; margin-bottom: 6px; }
  .v-card-actions { flex-direction: column; align-items: stretch !important; gap: 6px; }
  .v-card-actions .v-btn { margin-inline-start: 0 !important; }
  .v-table__wrapper table, .v-data-table table { min-width: 620px; }
}
