/* ==========================================================================
   PM TECH — Global Dynamic Virtual Keyboard & Input Visibility Adaptation
   Ensures the viewport resizes gracefully and typed values are always visible
   ========================================================================== */

:root {
  --pm-visual-viewport-h: 100vh;
  --pm-keyboard-h: 0px;
}

/* Ensure inputs on mobile never trigger iOS Safari destructive auto-zoom */
@media (max-width: 768px) {
  input[type="text"],
  input[type="number"],
  input[type="tel"],
  input[type="email"],
  input[type="password"],
  input[type="search"],
  select,
  textarea {
    font-size: 16px !important;
    line-height: 1.45 !important;
    color: #0f172a !important;
    -webkit-text-size-adjust: 100% !important;
    box-sizing: border-box !important;
  }
}

/* Active input high contrast visibility, glowing focus ring, and visible caret */
input:focus,
select:focus,
textarea:focus {
  outline: none !important;
  border-color: #076bdc !important;
  box-shadow: 0 0 0 3px rgba(7, 107, 220, 0.22) !important;
  background-color: #ffffff !important;
  color: #0f172a !important;
  caret-color: #076bdc !important;
}

/* When Keyboard is open on the page */
body.pm-keyboard-active:not(.creator-shell):not(:has(#chatApp)) {
  /* Extra bottom padding to ensure user can scroll all content and buttons above the keyboard */
  padding-bottom: calc(var(--pm-keyboard-h, 0px) + 24px) !important;
}

/* Chat container dynamic height adjustment when typing */
body.pm-keyboard-active .chat-mobile-frame,
.chat-mobile-frame.keyboard-open {
  height: var(--pm-visual-viewport-h, 100vh) !important;
  min-height: 0 !important;
}

body.pm-keyboard-active .chat-scroll-area,
.chat-mobile-frame.keyboard-open .chat-scroll-area {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
}

/* Modal dialogs adaptation during active typing */
body.pm-keyboard-active .pm-welcome-gate-modal,
body.pm-keyboard-active .pm-assistant-entry-dialog {
  align-items: flex-start !important;
  padding-top: 12px !important;
  overflow-y: auto !important;
}

body.pm-keyboard-active .pm-welcome-gate-card {
  max-height: calc(var(--pm-visual-viewport-h, 100vh) - 24px) !important;
  overflow-y: auto !important;
  padding: 16px 18px !important;
}

/* Smooth transition for form shells */
.pm-app-shell,
.sd-shell,
.pl-shell,
.dvs-shell,
.quote-container,
.pma-page {
  transition: padding-bottom 0.2s ease;
}
