/* Shared responsive layout for report pages. */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { max-width: 100%; overflow-x: hidden; }
img, svg, canvas, video { max-width: 100%; height: auto; }
input, select, textarea, button { max-width: 100%; font: inherit; }

.voice-widget,
.floating-pdf-widget {
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  gap: 8px !important;
  width: min(100%, 430px) !important;
  min-width: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Instant Report uses a banner class, but it belongs inside the form card. */
.main-card > .floating-pdf-widget {
  position: static !important;
  top: auto !important;
  z-index: auto !important;
  margin-top: 16px !important;
  margin-bottom: 20px !important;
  border: 1px solid rgba(212, 175, 55, 0.35) !important;
  border-radius: 15px !important;
}

.voice-widget .voice-btn,
.floating-pdf-widget .voice-btn-widget,
.voice-widget .pdf-sample-btn,
.floating-pdf-widget .pdf-sample-btn {
  flex: 0 0 44px !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 20px !important;
  line-height: 1 !important;
  border-radius: 10px !important;
}

.voice-widget .voice-lang-select,
.voice-widget select,
.floating-pdf-widget .voice-lang-select,
.floating-pdf-widget select {
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 30px 0 10px !important;
  font-size: 14px !important;
}

.voice-widget .btn-text,
.floating-pdf-widget .widget-label { display: none !important; }

@media (max-width: 600px) {
  body { font-size: clamp(14px, 3.8vw, 16px); }
  h1 { font-size: clamp(1.55rem, 7vw, 2.15rem) !important; line-height: 1.15 !important; }
  h2 { font-size: clamp(1.25rem, 5.5vw, 1.75rem) !important; line-height: 1.2 !important; }
  h3 { font-size: clamp(1.05rem, 4.6vw, 1.35rem) !important; }
  .container, .main-container, .form-container, .report-container, main {
    width: 100% !important;
    max-width: 100% !important;
  }
  input, select, textarea, button { min-height: 44px; }
  table { display: block; max-width: 100%; overflow-x: auto; }
  .voice-widget, .floating-pdf-widget {
    width: 100% !important;
    max-width: 100% !important;
    padding: 8px !important;
  }
}