/* Global mobile fixes: hamburger visible, no horizontal scroll, drawer Sign In/Logout button */
@media (max-width: 1024px) {
  html,
  body { overflow-x: hidden; max-width: 100vw; }
  header { width: 100%; max-width: 100vw; left: 0; right: 0; box-sizing: border-box; }
  header nav { min-width: 0; padding-right: 12px; }
  header nav > a:first-child { min-width: 0; flex: 1 1 auto; overflow: hidden; }
  #mobile-nav-toggle { flex-shrink: 0; margin-left: 8px; }
  .mobile-nav-drawer #auth-button-mobile a {
    display: inline-block !important;
    width: auto !important;
    padding: 0.5rem 1rem !important;
    font-size: 0.8125rem !important;
    color: #fff !important;
  }

  /* Reduce all buttons size on mobile only */
  button,
  [type="button"],
  [type="submit"],
  input[type="submit"],
  input[type="button"],
  a.rounded-lg[class*="bg-"],
  a.rounded[class*="bg-"],
  a[class*="px-8"][class*="py-3"],
  a[class*="px-6"][class*="py-"],
  .btn-primary-hero,
  .btn-secondary-hero,
  .tab-btn,
  .period-tab,
  .light-tab,
  .btn-refresh-dark,
  .btn-refresh-light,
  .btn-retry,
  .btn-apply,
  .btn-pay,
  .feedback-button {
    padding: 0.4rem 0.75rem !important;
    font-size: 0.75rem !important;
    min-height: 2.25rem;
  }
  /* Hero CTA links (Start Building Now, View Examples, etc.) */
  section a.flex.rounded-lg,
  section a.inline-flex.rounded-lg,
  section a[class*="rounded-lg"][class*="flex"] {
    padding: 0.4rem 0.75rem !important;
    font-size: 0.75rem !important;
    gap: 0.35rem !important;
  }
  section a.flex.rounded-lg i,
  section a.inline-flex.rounded-lg i,
  section a[class*="rounded-lg"] i {
    font-size: 1rem !important;
  }
  /* login.html: Sign In / form submit buttons – smaller size + white text (mobile) */
  body.login-page #login-form button[type="submit"],
  body.login-page #signup-form button[type="submit"],
  body.login-page #otp-form button[type="submit"] {
    padding: 0.4rem 0.75rem !important;
    font-size: 0.75rem !important;
    color: #fff !important;
  }
  body.login-page #login-form button[type="submit"]:hover,
  body.login-page #login-form button[type="submit"]:active,
  body.login-page #signup-form button[type="submit"]:hover,
  body.login-page #signup-form button[type="submit"]:active,
  body.login-page #otp-form button[type="submit"]:hover,
  body.login-page #otp-form button[type="submit"]:active {
    color: #fff !important;
  }
  /* "Ready to Start?" style badge – smaller on mobile */
  .rounded-full.inline-flex[class*="px-4"] {
    padding: 0.25rem 0.5rem !important;
    font-size: 0.65rem !important;
  }
  /* Icon-only / compact buttons (hamburger, close) */
  #mobile-nav-toggle,
  #mobile-nav-close,
  button.p-2,
  button.p-2\.5 {
    padding: 0.4rem !important;
    min-height: 2.25rem;
    min-width: 2.25rem;
  }
  /* Floating action button (feedback) – smaller on mobile */
  .feedback-button {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
  }
  .feedback-button i {
    font-size: 1.25rem !important;
  }
}