/* Winix PWA install banner + critical mobile helpers for standalone */

.wx-pwa-install-banner {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10050;
  padding: 0.75rem 1rem calc(0.75rem + env(safe-area-inset-bottom, 0px));
  background: var(--bs-body-bg, #fff);
  color: var(--bs-body-color, #212529);
  box-shadow: 0 -4px 16px var(--bs-shadow-color, rgba(0, 0, 0, 0.18));
  border-top: 1px solid var(--wx-border-color, var(--bs-border-color, #ddd));
}

.wx-pwa-install-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  max-width: 720px;
  margin: 0 auto;
}

.wx-pwa-install-text {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  flex: 1 1 200px;
  min-width: 0;
}

.wx-pwa-install-text strong {
  font-size: 0.95rem;
}

.wx-pwa-install-text span {
  font-size: 0.8rem;
  opacity: 0.85;
}

.wx-pwa-install-actions {
  display: flex;
  gap: 0.5rem;
  flex: 0 0 auto;
}

@media (display-mode: standalone) {
  body {
    padding-top: env(safe-area-inset-top, 0);
  }
}

/* Critical mobile layout (also linked explicitly so prod min CSS is not required) */
@media (max-width: 991.98px) {
  .wx-form-embed {
    min-width: 0;
  }

  .mform .fitem > .col-3,
  .mform .fitem > .col-9,
  .wx-js-form .fitem > .col-3,
  .wx-js-form .fitem > .col-9,
  .wx-form-embed .fitem > .col-3,
  .wx-form-embed .fitem > .col-9 {
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
  }

  .mform .fields-group {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
  }

  .mform .fields-group .fitem {
    display: flex;
    flex-wrap: wrap;
    width: 100% !important;
  }

  .mform .fields-group .felement {
    width: 100% !important;
  }

  .dataTables_wrapper,
  .wxview .dataTables_wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }

  table.dataTable td {
    max-width: 16rem;
  }

  .wx_top_wide_nav {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}