/* ═══════════════════════════════════════════════════════════
   Phase 6: Mobile Responsive Polish — MOBILE FIRST
   Touch targets, typography, forms, GD map, vertical rhythm
   ═══════════════════════════════════════════════════════════ */

/* ─── SITEWIDE VERTICAL RHYTHM ───────────────────────────── */
/* Consistent section spacing for mobile */
@media (max-width: 768px) {
  /* Tighten section gaps on mobile */
  .sew-section + .sew-section,
  .wp-block-group + .wp-block-group {
    margin-top: 0 !important;
  }
  /* Consistent card gaps */
  .sew-card + .sew-card,
  .sew-feature-card + .sew-feature-card {
    margin-top: 1rem;
  }
  /* Content sections */
  #item-body > * + * {
    margin-top: 0.75rem;
  }
  /* BB widget spacing */
  .bp-widget + .bp-widget {
    margin-top: 1rem;
  }
}

/* ─── SITEWIDE: 8px viewport inset on mobile ────────────── */
/* RULE: Background containers bleed edge-to-edge.           */
/*       Only leaf-level CONTENT (text, cards, forms, tables)*/
/*       gets the 8px inset from viewport edges.             */
@media (max-width: 768px) {
  /* Content-level elements that should never touch the viewport edge */
  /* Cards, grids, text blocks, forms, tables */
  .sew-forums-grid,
  .sew-topics-grid,
  .sew-members-grid,
  .sew-card,
  .sew-forum-card,
  .sew-member-card,
  .sew-podcast-body,
  /* BuddyBoss content areas (NOT #item-body — handled by member-profile.css padding) */
  .bp-widget,
  .activity-list,
  .members-list,
  /* bbPress content */
  #bbpress-forums > fieldset,
  #bbpress-forums > .bbp-topic-form,
  #bbpress-forums > .bbp-reply-form,
  .bbp-lead-topic,
  .bbp-replies,
  .bbp-pagination,
  .bbp-search-form,
  #bbpress-forums > p,
  #bbpress-forums > div:not(.bbp-search-form):not(.sew-forums-grid):not(.sew-topics-grid),
  /* bbPress page titles */
  #bbpress-forums > h1,
  #bbpress-forums > h2,
  #bbpress-forums > h3,
  /* WP block content */
  .entry-content > *:not(.alignfull):not(.wp-block-cover):not(.sew-hero),
  .is-layout-constrained > *:not(.alignfull):not(.wp-block-cover) {
    margin-left: 8px;
    margin-right: 8px;
    box-sizing: border-box;
  }
}

/* ─── 6.5 Touch Targets — 48px minimum ──────────────────── */
/* Scoped to sew-* only — MUST NOT affect plugin elements (.sewn-*, .bp-*, etc.) */
.sew-btn,
.sew-btn-primary,
.sew-btn-ghost,
.sew-feature-card__link,
.sew-coral-bar__btn {
  min-height: 48px;
  min-width: 48px;
}

.sew-section input[type="submit"],
.sew-section button[type="submit"],
.sew-section .gform_button,
.sew-archive__pagination button {
  min-height: 48px;
}

.sew-header__nav-item {
  min-height: 44px;
}

/* Mobile nav links */
.sew-header__mobile-nav a {
  min-height: 48px;
  display: flex;
  align-items: center;
}

/* Pagination touch targets */
.sew-archive__pagination .page-numbers a,
.sew-archive__pagination .page-numbers span {
  min-width: 44px;
  min-height: 44px;
}

/* ─── 6.6 Typography — clamp() responsive headings ──────── */
.sew-hero__title {
  font-size: clamp(1.75rem, 5vw + 0.5rem, 3.25rem);
}

.sew-section__title {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
}

.sew-feature-card__title {
  font-size: clamp(1rem, 1.5vw + 0.5rem, 1.25rem);
}

.sew-card__title {
  font-size: clamp(1rem, 1.5vw + 0.5rem, 1.25rem);
}

.sew-archive__title {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
}

/* ─── 6.7 Forms — full-width, large inputs ──────────────── */
.sew-section input[type="text"],
.sew-section input[type="email"],
.sew-section input[type="password"],
.sew-section input[type="tel"],
.sew-section input[type="url"],
.sew-section input[type="search"],
.sew-section input[type="number"],
.sew-section textarea,
.sew-section select {
  width: 100%;
  box-sizing: border-box;
  padding: 0.75rem 1rem;
  font-size: 1rem; /* prevent zoom on iOS */
  border: 1px solid #d0d5dd;
  border-radius: 6px;
  font-family: 'Inter', sans-serif;
  transition: border-color 0.15s;
  -webkit-appearance: none;
}

.sew-section input:focus,
.sew-section textarea:focus,
.sew-section select:focus {
  outline: none;
  border-color: var(--sew-primary-500);
  box-shadow: 0 0 0 3px rgba(50,162,193,0.12);
}

.sew-section input[type="submit"],
.sew-section button[type="submit"],
.sew-section .gform_button {
  width: 100%;
  padding: 0.875rem 1.5rem;
  font-size: 1rem;
  font-weight: 600;
  border-radius: 6px;
  cursor: pointer;
}

/* MemberPress form styling */
.mepr-login-form input[type="text"],
.mepr-login-form input[type="email"],
.mepr-login-form input[type="password"] {
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 0.75rem 1rem !important;
  font-size: 1rem !important;
  border: 1px solid #d0d5dd !important;
  border-radius: 6px !important;
}

.mepr-login-form input[type="submit"] {
  width: 100% !important;
  padding: 0.875rem !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  background: var(--sew-primary-500) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  min-height: 48px !important;
}

.mepr-login-form input[type="submit"]:hover {
  background: var(--sew-primary-700) !important;
}

/* GravityForms styling — only inside our sections/footer */
.sew-section .gform_wrapper input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
.sew-section .gform_wrapper textarea,
.sew-section .gform_wrapper select,
.sew-footer .gform_wrapper input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
.sew-footer .gform_wrapper textarea,
.sew-footer .gform_wrapper select {
  width: 100% !important;
  box-sizing: border-box !important;
  font-size: 1rem !important;
}

/* ─── Exclude plugin elements from our styles ────────────── */
/* SEWN Connect, BuddyBoss, and other plugins manage their own UI */
#sewn-overlay-root *,
.sewn-fab,
.sewn-panel *,
[id^="sewn-"] {
  /* Reset any inherited sew-* styles */
  min-height: unset;
  min-width: unset;
}

/* ─── 6.4 GD Map — full-width, proper height ────────────── */
.geodir-map-wrap,
.geodir_map_container,
#geodir_map_container,
.geodir-map-container-wrap {
  width: 100% !important;
  max-width: 100% !important;
}

.geodir-map-wrap iframe,
.geodir-map-wrap .gm-style {
  width: 100% !important;
}

/* GD search bar mobile */
.geodir-search-container {
  width: 100% !important;
}

.geodir-search-container .geodir-loc-bar {
  flex-direction: column !important;
  gap: 0.5rem;
}

.geodir-search-container input,
.geodir-search-container select {
  width: 100% !important;
  min-height: 48px !important;
}

/* ─── Global overflow prevention ─────────────────────────── */
body {
  overflow-x: hidden;
}

img {
  max-width: 100%;
  height: auto;
}

/* Prevent Bricks content from overflowing */
.brxe-container,
.bricks-layout-wrapper {
  max-width: 100%;
  overflow-x: hidden;
}

/* ─── Tablet+ enhancements ───────────────────────────────── */
@media (min-width: 768px) {
  .sew-section input[type="submit"],
  .sew-section button[type="submit"],
  .sew-section .gform_button {
    width: auto;
    min-width: 180px;
  }

  .mepr-login-form input[type="submit"] {
    width: auto !important;
    min-width: 180px !important;
  }
}