/* =====================================================================
   NET Classified — Frontend Stylesheet
   ===================================================================== */

:root {
  --net-primary:      #17a2b8;
  --net-primary-dk:   #12808f;
  --net-primary-tint: #eaf7f9;
  --net-accent:       #dd9933;
  --net-accent-dk:    #c07f1f;
  --net-dark:         #181b31;
  --net-grey:         #f4f7fa;
  --net-border:       #dfe6ec;
  --net-text:         #333;
  --net-muted:        #6b7280;
  --net-radius:       8px;
  --net-shadow:       0 2px 10px rgba(23,74,84,.08);
  --net-transition:   .2s ease;
  --net-font-heading: 'Nunito', sans-serif;
  --net-font-body:    'Roboto', sans-serif;
}

/* The theme sets a warm cream page background (--cream: #fffaf0) globally.
   This stylesheet only loads on our own app pages (submit-listing, single
   listings, dashboard, browse, login — see Assets::frontend()'s shortcode/
   CPT check), never the marketing homepage, so overriding it here changes
   only those pages. !important because enqueue order against the theme's
   own stylesheet isn't guaranteed. */
body { background: var(--net-grey) !important; }

.net-listings-wrap, .net-search-bar, .net-submit-form-wrap, .net-dashboard-header,
.net-dashboard-nav, .net-plans-wrap, .net-store-profile-header, .net-stores-grid,
.net-messages-wrap, .net-my-membership, .net-notice, .net-pagination {
  font-family: var(--net-font-body);
}
.net-card-title, .net-store-name, .net-plan-name,
.net-dashboard-header h2, .net-submit-form-wrap h2, .net-store-profile-info h1 {
  font-family: var(--net-font-heading);
}

/* ── Layout ─────────────────────────────────────────────────────────── */

.net-listings-wrap {
  display: flex;
  gap: 24px;
  align-items: flex-start;
  max-width: 1200px !important;
  margin: 0 auto;
}

.net-filter-sidebar {
  flex: 0 0 260px;
  background: #fff;
  border: 1px solid var(--net-border);
  border-radius: var(--net-radius);
  padding: 20px;
  position: sticky;
  top: 20px;
}

.net-listings-main {
  flex: 1;
  min-width: 0;
}

/* ── Filter sidebar ─────────────────────────────────────────────────── */

.net-filter-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}
.net-filter-header h3 { margin: 0; font-size: 1.1rem; }

.net-filter-group { margin-bottom: 18px; }
.net-filter-group h4 { margin: 0 0 8px; font-size: .9rem; text-transform: uppercase; letter-spacing: .05em; color: var(--net-muted); }
.net-filter-group select,
.net-filter-group input[type="text"],
.net-filter-group input[type="number"] {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--net-border);
  border-radius: 4px;
  font-size: .9rem;
  box-sizing: border-box;
}

.net-checkbox-label {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
  font-size: .9rem;
  cursor: pointer;
}

.net-price-range {
  display: flex;
  align-items: center;
  gap: 6px;
}
.net-price-range input { width: 80px; }

/* ── Toolbar ────────────────────────────────────────────────────────── */

.net-listings-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
  flex-wrap: wrap;
  gap: 8px;
}
.net-listings-count { font-size: .9rem; color: var(--net-muted); }
.net-toolbar-right  { display: flex; align-items: center; gap: 10px; }

.net-view-toggle { display: flex; gap: 4px; }
.net-view-btn {
  background: none;
  border: 1px solid var(--net-border);
  border-radius: 4px;
  padding: 6px 8px;
  cursor: pointer;
  color: var(--net-muted);
  display: flex;
  align-items: center;
  transition: var(--net-transition);
}
.net-view-btn.active,
.net-view-btn:hover { background: var(--net-primary); border-color: var(--net-primary); color: #fff; }

/* ── Listings grid ──────────────────────────────────────────────────── */

.net-listings-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.net-listings-grid.list-view { grid-template-columns: 1fr; }
.net-listings-grid.list-view .net-listing-card { display: flex; }
.net-listings-grid.list-view .net-card-img-link { flex: 0 0 200px; }
.net-listings-grid.list-view .net-card-img      { height: 140px; }

/* ── Listing card ───────────────────────────────────────────────────── */

.net-listing-card {
  background: #fff;
  border: 1px solid var(--net-primary);
  border-radius: var(--net-radius);
  overflow: hidden;
  box-shadow: var(--net-shadow);
  transition: transform var(--net-transition), box-shadow var(--net-transition);
}
.net-listing-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(23,74,84,.18);
}
.net-card--featured { border-color: var(--net-accent); border-width: 2px; }

.net-card-img-link { display: block; position: relative; overflow: hidden; }
.net-card-img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  display: block;
  transition: transform .3s ease;
}
.net-card-img-link:hover .net-card-img { transform: scale(1.03); }
.net-card-img--placeholder {
  background: var(--net-grey);
  display: flex;
  align-items: center;
  justify-content: center;
}

.net-card-body { padding: 14px; }
.net-card-title { margin: 0 0 6px; font-size: 1rem; line-height: 1.3; }
.net-card-title a { text-decoration: none; color: var(--net-dark); }
.net-card-title a:hover { color: var(--net-primary); }

.net-card-category { font-size: .82rem; color: var(--net-muted); margin: 0 0 6px; }

.net-card-location { font-size: .8rem; color: var(--net-muted); margin: 0 0 8px; display: flex; align-items: center; gap: 4px; }

.net-card-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; }

.net-price { font-weight: 700; font-size: 1.05rem; color: var(--net-accent); }
.net-price-free { color: #2a8a2a; }

.net-card-meta { display: flex; align-items: center; gap: 10px; }
.net-views { font-size: .8rem; color: var(--net-muted); }

/* ── Badges ─────────────────────────────────────────────────────────── */

/* Ribbon-style property-type badge (flag shape, top-left of the card image) */
.net-badge {
  position: absolute;
  top: 14px;
  left: 0;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: 5px 16px 5px 12px;
  color: #fff;
  background: var(--net-accent);
  clip-path: polygon(100% 0%, 82% 50%, 100% 100%, 0 100%, 0 50%, 0 0%);
}

/* ── Favourites button ──────────────────────────────────────────────── */

.net-fav-btn {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--net-border);
  padding: 4px;
  line-height: 1;
  transition: color var(--net-transition);
}
.net-fav-btn:hover,
.net-fav-btn.active { color: var(--net-primary); }

/* ── Buttons ────────────────────────────────────────────────────────── */

.net-btn {
  display: inline-block;
  padding: 10px 20px;
  border-radius: 4px;
  font-size: .9rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  border: 2px solid transparent;
  transition: background var(--net-transition), color var(--net-transition);
  line-height: 1;
}
.net-btn-primary { background: var(--net-primary); color: #fff; }
.net-btn-primary:hover { background: var(--net-primary-dk); color: #fff; }
.net-btn-outline { background: transparent; border-color: var(--net-primary); color: var(--net-primary); }
.net-btn-outline:hover { background: var(--net-primary); color: #fff; }
.net-btn-sm { padding: 5px 12px; font-size: .8rem; }
.net-btn-danger { background: #c62828; color: #fff; border-color: #c62828; }
.net-btn-danger:hover { background: #b71c1c; }

/* ── Search bar (hero 3-field) ──────────────────────────────────────── */

.net-search-bar { padding: 20px 0; }

/* Full-width hero search */
.net-search-bar--hero { padding: 0; max-width: 1200px !important; margin: 0 auto; }
.net-search-form--full {
  display: flex;
  gap: 0;
  flex-wrap: wrap;
  background: #fff;
  border-radius: var(--net-radius);
  overflow: visible;
  box-shadow: var(--net-shadow);
}
.net-search-field {
  flex: 1;
  min-width: 200px;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--net-border);
  padding: 10px 14px 8px;
}
.net-search-field:last-of-type { border-right: none; }
.net-search-label {
  font-size: .72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--net-muted);
  margin-bottom: 3px;
}
.net-search-field .net-search-input,
.net-search-field select {
  border: none;
  outline: none;
  padding: 0;
  font-size: .95rem;
  color: var(--net-text);
  background: transparent;
  width: 100%;
}
.net-search-field--location {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.net-location-wrap { position: relative; }
.net-search-field .net-search-radius {
  font-size: .8rem;
  color: var(--net-muted);
  border: none;
  background: transparent;
  padding: 0;
  margin-top: 2px;
  width: 100%;
}
.net-search-submit {
  border-radius: 0 var(--net-radius) var(--net-radius) 0;
  padding: 0 28px;
  font-size: .95rem;
  align-self: stretch;
  display: flex;
  align-items: center;
  gap: 6px;
}

/* Classic search form (simple inline) */
.net-search-form {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.net-search-form select,
.net-search-input {
  flex: 1;
  min-width: 160px;
  padding: 12px 14px;
  border: 2px solid var(--net-border);
  border-radius: 4px;
  font-size: 1rem;
}
.net-search-form .net-btn { flex: 0 0 auto; padding: 12px 24px; }

/* Google Places autocomplete dropdown override */
.pac-container { z-index: 99999 !important; border-radius: 4px; box-shadow: var(--net-shadow); }
.pac-item { padding: 6px 12px; font-size: .9rem; }
.pac-item:hover { background: var(--net-grey); }

/* ── Listing map embed ──────────────────────────────────────────────── */

.net-listing-map {
  margin-top: 24px;
  border-radius: var(--net-radius);
  overflow: hidden;
  border: 1px solid var(--net-border);
}

/* ── Pagination ─────────────────────────────────────────────────────── */

.net-pagination {
  display: flex;
  gap: 6px;
  justify-content: center;
  margin-top: 30px;
  flex-wrap: wrap;
}
.net-pagination a,
.net-pagination span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1px solid var(--net-border);
  border-radius: 4px;
  text-decoration: none;
  color: var(--net-text);
  font-size: .9rem;
  transition: var(--net-transition);
}
.net-pagination a:hover,
.net-pagination .current {
  background: var(--net-primary);
  border-color: var(--net-primary);
  color: #fff;
}

/* ── Notices ────────────────────────────────────────────────────────── */

.net-notice {
  padding: 12px 16px;
  border-radius: 4px;
  border-left: 4px solid var(--net-primary);
  background: var(--net-primary-tint);
  margin: 16px 0;
}
.net-notice--info  { border-color: #1565c0; background: #e8f0fd; }
.net-notice--error { border-color: #c62828; background: #fdecea; }

.net-no-results { text-align: center; padding: 40px; color: var(--net-muted); }

/* ── Filter reset button ────────────────────────────────────────────── */

.net-filter-reset {
  background: none;
  border: none;
  color: var(--net-primary);
  cursor: pointer;
  font-size: .85rem;
  text-decoration: underline;
  padding: 0;
}

/* ── Submit form ────────────────────────────────────────────────────── */

.net-form { max-width: 700px; }
.net-form-row { margin-bottom: 18px; }
.net-form-row label { display: block; font-weight: 600; margin-bottom: 5px; font-size: .9rem; }
.net-form-row input[type="text"],
.net-form-row input[type="email"],
.net-form-row input[type="url"],
.net-form-row input[type="number"],
.net-form-row textarea,
.net-form-row select {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--net-border);
  border-radius: 4px;
  font-size: .95rem;
  box-sizing: border-box;
}
.net-form-row textarea { resize: vertical; }
.net-form-row--2col { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.net-form-hint { font-size: .8rem; color: var(--net-muted); margin: 4px 0 0; }
.net-form-actions { margin-top: 24px; display: flex; gap: 10px; flex-wrap: wrap; }
.net-form-actions .net-btn { flex: none; }
#net-preview-hint { margin-top: 8px; }

.net-submit-form-wrap h2 { margin-bottom: 24px; }

/* ── Dashboard ──────────────────────────────────────────────────────── */

.net-dashboard-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
  flex-wrap: wrap;
  gap: 12px;
}
.net-dashboard-header h2 { margin: 0; }

.net-dashboard-body {
  display: flex;
  align-items: flex-start;
  gap: 24px;
}

.net-dashboard-sidebar {
  flex: 0 0 220px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: #fff;
  border: 1px solid var(--net-border);
  border-radius: var(--net-radius);
  padding: 10px;
  position: sticky;
  top: 20px;
}
.net-tab-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 6px;
  text-decoration: none;
  color: var(--net-text);
  font-weight: 600;
  font-size: .92rem;
  transition: background var(--net-transition), color var(--net-transition);
}
.net-sidebar-icon { font-size: 1.05rem; line-height: 1; flex: none; }
.net-sidebar-label { display: flex; align-items: center; gap: 6px; }
.net-tab-link:hover { background: var(--net-grey); }
.net-tab-link.active { background: var(--net-primary-tint); color: var(--net-primary-dk); }

.net-dashboard-content { flex: 1; min-width: 0; }

/* ── Dashboard Overview tab ── */

.net-overview-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 24px; }
.net-stat-card {
  background: #fff; border: 1px solid var(--net-border); border-radius: var(--net-radius);
  padding: 16px; text-align: center;
}
.net-stat-card--alert { border-color: var(--net-accent); background: #fff8ec; }
.net-stat-value { display: block; font-family: var(--net-font-heading); font-size: 1.7rem; font-weight: 800; color: var(--net-dark); }
.net-stat-card--alert .net-stat-value { color: var(--net-accent-dk); }
.net-stat-label { display: block; font-size: .78rem; color: var(--net-muted); margin-top: 2px; }

.net-overview-cta {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  background: var(--net-primary-tint); border-radius: var(--net-radius); padding: 20px 22px; margin-bottom: 28px;
}
.net-overview-cta h3 { margin: 0 0 4px; font-size: 1.05rem; }
.net-overview-cta p { margin: 0; color: var(--net-text); font-size: .88rem; max-width: 46ch; }

.net-overview-heading { margin: 0 0 14px; font-size: 1.05rem; }

.net-overview-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 16px; margin-bottom: 28px; }
.net-overview-card {
  background: #fff; border: 1px solid var(--net-border); border-radius: var(--net-radius); padding: 18px;
}
.net-overview-card-icon { font-size: 1.6rem; margin-bottom: 8px; }
.net-overview-card h4 { margin: 0 0 6px; font-size: .95rem; }
.net-overview-card p { margin: 0 0 14px; font-size: .84rem; color: var(--net-muted); }

.net-overview-tips { margin: 0; padding-left: 20px; }
.net-overview-tips li { font-size: .9rem; margin-bottom: 8px; color: var(--net-text); }

/* ── Table ──────────────────────────────────────────────────────────── */

.net-table { width: 100%; border-collapse: collapse; }
.net-table th { background: var(--net-grey); text-align: left; padding: 10px 14px; font-size: .85rem; text-transform: uppercase; letter-spacing: .04em; color: var(--net-muted); }
.net-table td { padding: 12px 14px; border-bottom: 1px solid var(--net-border); font-size: .9rem; }
.net-table tr:last-child td { border-bottom: none; }
.net-table td a { color: var(--net-primary); text-decoration: none; }

.net-status { display: inline-block; padding: 2px 8px; border-radius: 3px; font-size: .75rem; font-weight: 700; text-transform: uppercase; }
.net-status--publish { background: #e8f5e9; color: #2e7d32; }
.net-status--pending { background: #fff3e0; color: #e65100; }
.net-status--draft   { background: #e8eaf6; color: #3949ab; }

/* ── Stores grid ────────────────────────────────────────────────────── */

.net-stores-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 20px;
}
.net-store-card {
  border: 1px solid var(--net-border);
  border-radius: var(--net-radius);
  overflow: hidden;
  background: #fff;
  box-shadow: var(--net-shadow);
  transition: transform var(--net-transition);
}
.net-store-card:hover { transform: translateY(-2px); }
.net-store-card-link { display: block; padding: 20px; text-decoration: none; color: var(--net-dark); text-align: center; }
.net-store-logo { width: 100px; height: 100px; object-fit: contain; border-radius: 50%; border: 2px solid var(--net-border); }
.net-store-logo--placeholder { width: 100px; height: 100px; background: var(--net-grey); border-radius: 50%; display: inline-block; }
.net-store-name { margin: 12px 0 4px; font-size: 1.05rem; }
.net-store-tagline { font-size: .85rem; color: var(--net-muted); margin: 0 0 8px; }
.net-store-listing-count { font-size: .8rem; color: var(--net-primary); font-weight: 600; margin: 0; }

/* ── Membership plans ───────────────────────────────────────────────── */

.net-plans-wrap { padding: 10px 0; }
.net-plans-heading { text-align: center; margin-bottom: 8px; }
.net-plans-subheading { text-align: center; color: var(--net-muted); margin-bottom: 32px; }
.net-plans-heading--addons { margin-top: 48px; }

.net-plans-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 24px;
  align-items: stretch;
}

.net-plan-card {
  background: #fff;
  border: 2px solid var(--net-border);
  border-radius: 12px;
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: box-shadow var(--net-transition);
}
.net-plan-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.12); }
.net-plan-card--popular { border-color: var(--net-primary); }
.net-plan-card--current { background: var(--net-primary-tint); }

.net-plan-badge {
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--net-primary);
  color: #fff;
  font-size: .75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  padding: 4px 14px;
  border-radius: 20px;
  white-space: nowrap;
}

.net-plan-tier-badge {
  display: inline-block;
  background: var(--net-primary);
  color: #fff;
  font-size: .7rem;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 3px;
  margin-bottom: 8px;
}

.net-plan-name { margin: 0 0 12px; font-size: 1.2rem; }

.net-plan-pricing { margin-bottom: 12px; }
.net-plan-price { font-size: 2rem; font-weight: 800; color: var(--net-primary); }
.net-plan-price-free { font-size: 2rem; font-weight: 800; color: #2a8a2a; }
.net-plan-period { font-size: .85rem; color: var(--net-muted); }

.net-plan-description { font-size: .9rem; color: var(--net-muted); margin-bottom: 18px; flex: 1; }

.net-plan-features {
  list-style: none;
  padding: 0;
  margin: 0 0 24px;
}
.net-plan-features li {
  padding: 5px 0 5px 24px;
  font-size: .88rem;
  position: relative;
  color: var(--net-text);
}
.net-plan-features li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: #2a8a2a;
  font-weight: 700;
}
.net-plan-features li.no { color: var(--net-muted); }
.net-plan-features li.no::before { content: '✗'; color: #c62828; }

.net-btn-current { opacity: .6; cursor: default; pointer-events: none; }

/* ── Add-ons ────────────────────────────────────────────────────────── */

.net-addons-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
  margin-top: 16px;
}
.net-addon-card {
  background: var(--net-grey);
  border: 1px solid var(--net-border);
  border-radius: 10px;
  padding: 22px 20px;
}
.net-addon-card h3 { margin: 0 0 8px; font-size: 1rem; }
.net-addon-price { font-size: 1.5rem; font-weight: 800; color: var(--net-primary); margin-bottom: 8px; }
.net-addon-price span { font-size: .85rem; font-weight: 400; color: var(--net-muted); }
.net-addon-card p { font-size: .88rem; color: var(--net-muted); margin-bottom: 14px; }

/* ── My membership widget ───────────────────────────────────────────── */

.net-my-membership {
  background: #fff;
  border: 1px solid var(--net-border);
  border-radius: var(--net-radius);
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.net-membership-tier { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.net-membership-label { font-size: .8rem; color: var(--net-muted); text-transform: uppercase; letter-spacing: .05em; }
.net-membership-name { font-size: 1.1rem; font-weight: 700; }
.net-membership-expires { font-size: .85rem; color: var(--net-muted); margin: 0; }

.net-usage-bar-label { font-size: .85rem; color: var(--net-muted); margin-bottom: 6px; }
.net-usage-bar { height: 8px; background: var(--net-grey); border-radius: 4px; overflow: hidden; }
.net-usage-bar-fill { height: 100%; background: var(--net-primary); border-radius: 4px; transition: width .4s ease; }

/* ── Upgrade CTA ────────────────────────────────────────────────────── */

.net-notice--upgrade {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  background: var(--net-primary-tint);
  border-left-color: var(--net-primary);
}

/* ── Featured badge (inline, dashboard) ─────────────────────────────── */

.net-badge-inline { display: inline-block; padding: 3px 8px; border-radius: 3px; font-size: .75rem; font-weight: 700; }
.net-badge-inline--featured { background: var(--net-primary); color: #fff; }

/* ── Store profile ──────────────────────────────────────────────────── */

.net-store-profile-header {
  display: flex;
  gap: 24px;
  align-items: flex-start;
  flex-wrap: wrap;
  margin-bottom: 32px;
  padding: 24px;
  background: #fff;
  border: 1px solid var(--net-border);
  border-radius: var(--net-radius);
}
.net-store-profile-logo { width: 120px; height: 120px; object-fit: contain; border-radius: 8px; border: 2px solid var(--net-border); }
.net-store-profile-info { flex: 1; }
.net-store-profile-info h1 { margin: 0 0 6px; }
.net-store-address { color: var(--net-muted); font-size: .9rem; margin: 4px 0; }
.net-store-profile-contact { display: flex; flex-direction: column; gap: 8px; }

/* ── Chat — online dot ───────────────────────────────────────────────── */

.net-online-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #ccc;
  border: 2px solid #fff;
  transition: background .3s;
}
.net-online-dot.is-online { background: #22c55e; }

.net-chat-avatar-wrap { position: relative; display: inline-block; }
.net-chat-avatar-wrap .net-online-dot {
  position: absolute;
  bottom: 1px;
  right: 1px;
}

.net-chat-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}
.net-chat-avatar--lg { width: 44px; height: 44px; }

/* ── Chat — seller card on single listing (nested inside .net-rail-card) ── */

.net-seller-card {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}
.net-seller-card strong { display: block; font-size: .95rem; }
.net-seller-status { font-size: .8rem; color: var(--net-muted); }
.net-seller-card .net-btn { margin-left: auto; white-space: nowrap; }

/* ── Chat — inline panel (single listing) ───────────────────────────── */

.net-inline-chat {
  border: 1px solid var(--net-border);
  border-radius: var(--net-radius);
  overflow: hidden;
  margin-top: 4px;
}

/* ── Chat — thread ───────────────────────────────────────────────────── */

.net-chat-thread {
  display: flex;
  flex-direction: column;
  background: #fff;
}

.net-chat-thread-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--net-border);
  background: var(--net-grey);
}
.net-chat-other-name { display: block; font-size: .9rem; }
.net-chat-status-text { font-size: .78rem; color: var(--net-muted); }

.net-chat-messages {
  flex: 1;
  padding: 16px;
  overflow-y: auto;
  max-height: 360px;
  min-height: 120px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  scroll-behavior: smooth;
}
.net-chat-empty { color: var(--net-muted); font-size: .9rem; text-align: center; margin: auto 0; }

/* ── Bubbles ─────────────────────────────────────────────────────────── */

.net-bubble { max-width: 72%; display: flex; flex-direction: column; }
.net-bubble--mine  { align-self: flex-end;  align-items: flex-end; }
.net-bubble--theirs{ align-self: flex-start; align-items: flex-start; }

.net-bubble-text {
  padding: 9px 13px;
  border-radius: 18px;
  font-size: .9rem;
  line-height: 1.45;
  word-break: break-word;
}
.net-bubble--mine   .net-bubble-text { background: var(--net-primary); color: #fff; border-radius: 18px 18px 4px 18px; }
.net-bubble--theirs .net-bubble-text { background: var(--net-grey); color: var(--net-text); border-radius: 18px 18px 18px 4px; }

.net-bubble-meta { font-size: .72rem; color: var(--net-muted); margin-top: 3px; padding: 0 4px; }
.net-read-tick { color: #22c55e; }

/* ── Chat input ──────────────────────────────────────────────────────── */

.net-chat-form {
  display: flex;
  gap: 8px;
  padding: 10px 12px;
  border-top: 1px solid var(--net-border);
  background: #fafafa;
}
.net-chat-input {
  flex: 1;
  resize: none;
  border: 1px solid var(--net-border);
  border-radius: 20px;
  padding: 8px 14px;
  font-size: .9rem;
  line-height: 1.4;
  font-family: inherit;
}
.net-chat-input:focus { outline: none; border-color: var(--net-primary); }
.net-chat-send-btn { align-self: flex-end; border-radius: 20px; padding: 8px 18px; }

/* ── Dashboard — messages layout ─────────────────────────────────────── */

.net-messages-wrap {
  display: flex;
  gap: 0;
  border: 1px solid var(--net-border);
  border-radius: var(--net-radius);
  overflow: hidden;
  min-height: 440px;
}

.net-inbox {
  flex: 0 0 260px;
  border-right: 1px solid var(--net-border);
  overflow-y: auto;
  background: #fafafa;
}
.net-inbox-title {
  font-size: .85rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--net-muted);
  padding: 12px 14px;
  border-bottom: 1px solid var(--net-border);
  margin: 0;
}

.net-inbox-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--net-border);
  text-decoration: none;
  color: var(--net-text);
  transition: background var(--net-transition);
}
.net-inbox-item:hover  { background: #f0f0f0; }
.net-inbox-item.active { background: #fff; border-left: 3px solid var(--net-primary); }
.net-inbox-item.has-unread .net-inbox-name { font-weight: 700; }

.net-inbox-body { flex: 1; min-width: 0; }
.net-inbox-name { font-size: .88rem; font-weight: 500; display: flex; align-items: center; gap: 6px; }
.net-inbox-listing { font-size: .78rem; color: var(--net-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.net-inbox-preview { font-size: .8rem; color: var(--net-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 2px; }

.net-thread-panel {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.net-thread-panel .net-chat-thread { flex: 1; }
.net-thread-panel .net-chat-messages { max-height: none; flex: 1; }

.net-thread-placeholder {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--net-muted);
  gap: 12px;
  padding: 40px;
}

/* ── Unread badge ─────────────────────────────────────────────────────── */

.net-badge-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--net-primary);
  color: #fff;
  font-size: .7rem;
  font-weight: 700;
  min-width: 18px;
  height: 18px;
  border-radius: 9px;
  padding: 0 5px;
  line-height: 1;
}

/* ── Responsive ─────────────────────────────────────────────────────── */

/* ── Description "Generate from rooms" ────────────────────────────────── */

.net-desc-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 5px; }
.net-desc-head label { margin-bottom: 0; }

/* ── Login / Register ──────────────────────────────────────────────────── */

.net-auth-wrap { max-width: 420px; margin: 20px auto; padding: 0 16px; }
.net-auth-card {
  background: #fff; border: 1px solid var(--net-border); border-radius: var(--net-radius);
  box-shadow: var(--net-shadow); padding: 28px 26px;
}
.net-auth-tabs { display: flex; gap: 4px; background: var(--net-grey); border-radius: 999px; padding: 3px; margin-bottom: 22px; }
.net-auth-tab {
  flex: 1; text-align: center; padding: 9px 0; border-radius: 999px; font-size: .88rem; font-weight: 700;
  text-decoration: none; color: var(--net-muted); transition: var(--net-transition);
}
.net-auth-tab.active { background: #fff; color: var(--net-dark); box-shadow: var(--net-shadow); }
.net-auth-tab:hover:not(.active) { color: var(--net-primary-dk); }
.net-auth-form .net-form-row { margin-bottom: 14px; }
.net-auth-form .net-checkbox-label { margin-bottom: 18px; }
.net-auth-submit { width: 100%; box-sizing: border-box; }
.net-auth-form .net-form-hint { text-align: center; margin-top: 14px; }

/* ── Photo progress bar (submit form) ─────────────────────────────────── */

.net-progress-bar-wrap { margin-bottom: 18px; }
.net-progress-card {
  background: #fff; border: 1px solid var(--net-border); border-radius: var(--net-radius);
  box-shadow: var(--net-shadow); padding: 14px 18px; display: flex; align-items: center; gap: 16px;
}
.net-progress-text { flex: none; font-size: .86rem; font-weight: 700; }
.net-progress-text span { font-weight: 400; color: var(--net-muted); }
.net-progress-track { flex: 1; height: 8px; border-radius: 999px; background: var(--net-grey); overflow: hidden; }
.net-progress-fill { height: 100%; background: linear-gradient(90deg, var(--net-accent), var(--net-accent-dk)); border-radius: 999px; transition: width .35s ease; }
.net-progress-hint { flex: none; font-size: .78rem; color: var(--net-muted); display: none; }
@media (min-width: 720px) { .net-progress-hint { display: block; } }

/* ── Feature image / floorplan / room-by-room photo slots (submit form) ── */

.net-photo-slot-grid { display: grid; gap: 14px; margin-top: 8px; }
.net-photo-slot-grid--featured { grid-template-columns: 1fr 1fr; }

.net-photo-slot {
  background: #fff;
  border: 1px solid var(--net-border);
  border-radius: var(--net-radius);
  overflow: hidden;
}
.net-photo-slot-label {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 10px 12px; border-bottom: 1px solid var(--net-border); font-weight: 700; font-size: .88rem;
}
.net-req { color: var(--net-accent-dk); font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.net-req--optional { color: var(--net-muted); font-weight: 400; text-transform: none; letter-spacing: 0; }

.net-photo-slot-preview { aspect-ratio: 4/3; background: var(--net-grey); }
.net-photo-slot-upload {
  position: relative; display: flex; align-items: center; justify-content: center; gap: 8px;
  text-align: center; padding: 10px; margin: 10px; border: 1.5px dashed var(--net-border);
  border-radius: 6px; font-size: .82rem; font-weight: 600; color: var(--net-primary-dk); cursor: pointer;
  transition: var(--net-transition);
}
.net-photo-slot-upload--full { aspect-ratio: 4/3; flex-direction: column; gap: 6px; }
.net-photo-slot-upload svg { flex: none; }
.net-photo-slot-upload:hover { background: var(--net-primary-tint); border-color: var(--net-primary); }
.net-photo-slot-upload input[type="file"] { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }

.net-room-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-top: 10px; }

.net-room-block {
  background: #fff; border: 1px solid var(--net-border); border-radius: var(--net-radius);
  padding: 12px; display: flex; flex-direction: column; gap: 10px;
}
.net-room-head { display: flex; align-items: center; gap: 8px; }
.net-room-label {
  flex: 1; border: none; background: transparent; font-weight: 700; font-size: .9rem; padding: 2px 0;
  color: var(--net-text); font-family: inherit;
}
.net-room-label:read-only { pointer-events: none; }
.net-room-label:not(:read-only) { border-bottom: 1px dashed var(--net-border); }
.net-room-remove {
  border: none; background: var(--net-grey); color: var(--net-muted); width: 22px; height: 22px; border-radius: 50%;
  cursor: pointer; font-size: .9rem; line-height: 1; flex: none;
}
.net-room-remove:hover { background: #fdecea; color: #c62828; }

.net-room-thumbs { display: flex; flex-wrap: wrap; gap: 6px; }
.net-room-thumb { position: relative; width: 56px; height: 56px; border-radius: 6px; overflow: hidden; }
.net-room-thumb-remove {
  position: absolute; top: 2px; right: 2px; width: 16px; height: 16px; border-radius: 50%; border: none;
  background: rgba(0,0,0,.6); color: #fff; font-size: .7rem; line-height: 1; cursor: pointer; padding: 0;
}

.net-room-upload {
  position: relative; display: flex; align-items: center; justify-content: center; gap: 6px;
  text-align: center; padding: 8px; border: 1.5px dashed var(--net-border); border-radius: 6px;
  font-size: .8rem; font-weight: 600; color: var(--net-primary-dk); cursor: pointer; transition: var(--net-transition);
}
.net-room-upload--full { aspect-ratio: 4/3; flex-direction: column; gap: 6px; }
.net-room-upload svg { flex: none; width: 20px; height: 20px; }
.net-room-upload:hover { background: var(--net-primary-tint); border-color: var(--net-primary); }
.net-room-upload input[type="file"] { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }

.net-room-mini-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: end; }
.net-room-mini-row label { display: flex; flex-direction: column; gap: 3px; font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--net-muted); }
.net-room-mini-row input {
  border: 1px solid var(--net-border); border-radius: 6px; padding: 6px 8px; font-size: .82rem; font-family: inherit;
  color: var(--net-text); font-weight: 400; text-transform: none; letter-spacing: 0;
}

.net-room-features label { display: block; font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--net-muted); margin-bottom: 5px; }
.net-chip-list { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.net-chip {
  display: inline-flex; align-items: center; gap: 5px; background: var(--net-primary-tint); color: var(--net-primary-dk);
  font-size: .74rem; font-weight: 600; padding: 3px 5px 3px 9px; border-radius: 999px;
}
.net-chip-remove { border: none; background: none; color: inherit; cursor: pointer; font-size: .82rem; line-height: 1; padding: 2px; opacity: .7; }
.net-chip-remove:hover { opacity: 1; }
.net-room-chip-input {
  width: 100%; border: 1px dashed var(--net-border); border-radius: 6px; padding: 6px 8px; font-size: .8rem; font-family: inherit;
}

/* ── Buyer-facing room gallery (single listing page) ──────────────────── */

/* ── Listing head (address + price) ───────────────────────────────────── */

.net-listing-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: -8px 0 14px; }
.net-listing-addr { color: var(--net-muted); font-size: .95rem; margin: 0; }
.net-listing-price { font-family: var(--net-font-heading); text-align: right; white-space: nowrap; }
.net-listing-price span { display: block; font-size: 1.5rem; font-weight: 800; color: var(--net-accent-dk); }
.net-listing-price small { display: block; font-family: var(--net-font-body); font-size: .68rem; font-weight: 600; color: var(--net-muted); text-transform: uppercase; letter-spacing: .05em; }

/* ── Facts chips row ───────────────────────────────────────────────────── */

.net-facts-row { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 20px; }
.net-fact-chip {
  display: flex; align-items: center; gap: 6px; background: #fff; border: 1px solid var(--net-border);
  border-radius: 999px; padding: 7px 13px; font-size: .82rem; font-weight: 600;
}
.net-fact-chip svg { width: 15px; height: 15px; color: var(--net-primary); flex: none; }

/* ── Listing two-column body ──────────────────────────────────────────── */

.net-listing-body { display: grid; grid-template-columns: 1.6fr 1fr; gap: 28px; align-items: start; margin-top: 24px; }
.net-listing-main { min-width: 0; }
.net-listing-rail { min-width: 0; }

.net-rail-card {
  background: #fff; border: 1px solid var(--net-border); border-radius: var(--net-radius);
  box-shadow: var(--net-shadow); padding: 18px;
}
.net-rail-card + .net-rail-card { margin-top: 14px; }
.net-rail-card h4 { font-size: .95rem; font-weight: 800; margin: 0 0 12px; }
.net-rail-note { font-size: .84rem; color: var(--net-muted); margin: 0 0 14px; line-height: 1.5; }

.net-facts-table { margin-top: 20px; border-top: 1px solid var(--net-border); }
.net-facts-table-row {
  display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--net-border); font-size: .88rem;
}
.net-facts-table-row .k { color: var(--net-muted); }
.net-facts-table-row .v { font-weight: 600; }

@media ( max-width: 820px ) {
  .net-listing-body { grid-template-columns: 1fr; }
}

.net-room-gallery { margin-bottom: 24px; }

.net-gallery-main {
  aspect-ratio: 16/9; border-radius: var(--net-radius); overflow: hidden; position: relative;
  box-shadow: var(--net-shadow); background: var(--net-grey); cursor: pointer;
}
.net-gallery-main img { width: 100%; height: 100%; object-fit: cover; display: block; }
.net-gallery-tag {
  position: absolute; top: 14px; left: 14px; background: rgba(15,17,30,.62); color: #fff;
  font-size: .78rem; font-weight: 700; padding: 6px 12px; border-radius: 7px;
}
.net-gallery-counter {
  position: absolute; bottom: 14px; right: 14px; background: rgba(15,17,30,.62); color: #fff;
  font-size: .76rem; font-weight: 600; padding: 5px 10px; border-radius: 7px;
}
.net-gallery-nav {
  position: absolute; top: 50%; transform: translateY(-50%); border: none; background: rgba(255,255,255,.85);
  width: 34px; height: 34px; border-radius: 50%; font-size: 1.2rem; line-height: 1; cursor: pointer; color: var(--net-dark);
}
.net-gallery-nav.prev { left: 12px; } .net-gallery-nav.next { right: 12px; }

.net-room-facts {
  display: none;
  align-items: center; gap: 14px; flex-wrap: wrap; background: #fff; border: 1px solid var(--net-border);
  border-radius: var(--net-radius); padding: 12px 16px; margin-top: 10px; font-size: .84rem;
}
.net-room-facts.show { display: flex; }
.net-room-facts .dim { font-weight: 700; }
.net-room-facts .sep { color: var(--net-border); }
.net-room-facts .rf-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.net-room-facts .rf-chip { background: var(--net-grey); color: var(--net-muted); font-size: .76rem; font-weight: 600; padding: 3px 10px; border-radius: 999px; }

.net-room-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.net-room-chip {
  border: 1px solid var(--net-border); background: #fff; color: var(--net-text); font-size: .82rem; font-weight: 600;
  padding: 7px 13px; border-radius: 999px; cursor: pointer;
}
.net-room-chip .n { color: var(--net-muted); }
.net-room-chip.active { background: var(--net-dark); color: #fff; border-color: var(--net-dark); }
.net-room-chip.active .n { color: #fff; opacity: .7; }

.net-about-home h2 { font-size: 1.3rem; margin-bottom: 18px; }
.net-about-block { margin-bottom: 22px; }
.net-about-block h3 { font-size: 1rem; font-weight: 800; margin-bottom: 8px; color: var(--net-dark); }
.net-about-block p { margin: 0 0 10px; line-height: 1.6; color: var(--net-text); }
.net-about-block p:last-child { margin-bottom: 0; }

/* ── Consultant (Elf) self-service profile form + service badges ── */

.net-consultant-form-wrap { max-width: 640px; margin: 0 auto; padding: 32px 16px; }
.net-consultant-form-card {
  background: #fff; border: 1px solid var(--net-border); border-radius: var(--net-radius);
  padding: 28px; box-shadow: var(--net-shadow);
}
.net-consultant-form-card h1 { margin: 0 0 8px; font-size: 1.5rem; }
.net-consultant-form-intro { color: var(--net-muted); margin: 0 0 22px; font-size: .92rem; }
.net-consultant-view-link { margin-top: 16px; text-align: center; }

.net-consultant-photo-slot { margin-top: 6px; }
.net-consultant-photo-dropzone {
  display: flex; align-items: flex-end; justify-content: center; width: 120px; height: 120px;
  border-radius: 50%; border: 1.5px dashed var(--net-border); background: var(--net-grey) center/cover no-repeat;
  cursor: pointer; transition: var(--net-transition); overflow: hidden;
}
.net-consultant-photo-dropzone:hover { border-color: var(--net-primary); }
.net-consultant-photo-hint {
  width: 100%; padding: 4px 0; font-size: .68rem; font-weight: 700; text-align: center;
  color: #fff; background: rgba(0,0,0,.55);
}

.net-service-options { display: flex; flex-direction: column; gap: 14px; margin-top: 6px; }
.net-service-option { border: 1px solid var(--net-border); border-radius: 8px; padding: 12px 14px; }
.net-service-check { display: flex; align-items: flex-start; gap: 10px; font-weight: 400; cursor: pointer; }
.net-service-check input { margin-top: 3px; }
.net-service-check span { font-size: .88rem; }
.net-service-fee { margin: 10px 0 0 26px; display: flex; align-items: center; gap: 8px; }
.net-service-fee label { font-size: .8rem; font-weight: 600; margin: 0; color: var(--net-muted); }
.net-service-fee input { width: 100px; padding: 6px 8px; border: 1px solid var(--net-border); border-radius: 5px; }

.net-service-badges { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; justify-content: center; }
.net-store-profile-info .net-service-badges { justify-content: flex-start; }
.net-service-badge {
  display: inline-block; font-size: .74rem; font-weight: 700; padding: 4px 10px;
  border-radius: 999px; background: var(--net-primary-tint); color: var(--net-primary-dk);
}

.net-consultant-cta {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  background: var(--net-primary-tint); border-radius: var(--net-radius); padding: 16px 20px; margin-bottom: 20px;
}
.net-consultant-cta p { margin: 0; font-weight: 600; color: var(--net-primary-dk); }

/* ── Consultant bookings (requests, accept/decline, listing-help proposals) ── */

.net-booking-request-card {
  background: #fff; border: 1px solid var(--net-border); border-radius: var(--net-radius);
  padding: 22px; margin: 24px 0; max-width: 480px;
}
.net-booking-request-card h3 { margin: 0 0 14px; font-size: 1.1rem; }

.net-bookings-wrap h3 { margin: 0 0 12px; font-size: 1.15rem; }
.net-booking-list { display: flex; flex-direction: column; gap: 14px; }
.net-booking-card {
  background: #fff; border: 1px solid var(--net-border); border-radius: var(--net-radius); padding: 16px 18px;
}
.net-booking-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.net-booking-card-head > div { font-size: .92rem; }
.net-booking-message { color: var(--net-text); font-size: .88rem; margin: 8px 0 0; }
.net-booking-meta { color: var(--net-muted); font-size: .82rem; margin: 6px 0 0; }
.net-booking-actions { margin-top: 12px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

.net-booking-status {
  display: inline-block; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em;
  padding: 3px 9px; border-radius: 999px;
}
.net-booking-status--requested { background: #fff4e0; color: #a5690a; }
.net-booking-status--accepted  { background: #e6f7ec; color: #1c7d43; }
.net-booking-status--declined,
.net-booking-status--cancelled { background: #fdecea; color: #c62828; }
.net-booking-status--completed { background: var(--net-primary-tint); color: var(--net-primary-dk); }

.net-proposal-summary {
  background: var(--net-grey); border-radius: 6px; padding: 10px 12px; margin: 10px 0; font-size: .85rem;
}
.net-proposal-summary p { margin: 4px 0; }
.net-proposal-summary img { display: block; margin-top: 6px; }

.net-booking-payment { font-weight: 600; color: var(--net-text); }

/* ── Stripe Connect (consultant payouts) ── */

.net-stripe-connect-card {
  background: #fff; border: 1px solid var(--net-border); border-radius: var(--net-radius);
  padding: 20px 22px; margin: 20px 0; max-width: 480px;
}
.net-stripe-connect-card h3 { margin: 0 0 10px; font-size: 1.05rem; }
.net-stripe-status { font-weight: 600; margin: 0 0 10px; }
.net-stripe-status--ready   { color: #1c7d43; }
.net-stripe-status--pending { color: #a5690a; }

@media ( max-width: 1024px ) {
  .net-listings-grid { grid-template-columns: repeat(2, 1fr); }
}

@media ( max-width: 768px ) {
  .net-listings-wrap { flex-direction: column; padding: 0 16px; box-sizing: border-box; }
  .net-filter-sidebar { flex: none; width: 100%; position: static; }
  .net-listings-grid { grid-template-columns: 1fr; }
  .net-form-row--2col { grid-template-columns: 1fr; }
  .net-store-profile-header { flex-direction: column; }
  .net-messages-wrap { flex-direction: column; }
  .net-inbox { flex: none; border-right: none; border-bottom: 1px solid var(--net-border); max-height: 240px; }
  .net-seller-card { flex-wrap: wrap; }
  .net-seller-card .net-btn { margin-left: 0; width: 100%; }
  .net-search-bar--hero { padding: 0 16px; box-sizing: border-box; }
  .net-search-form--full { flex-direction: column; }
  .net-search-field { border-right: none; border-bottom: 1px solid var(--net-border); width: 100%; }
  .net-search-field:last-of-type { border-bottom: none; }
  .net-photo-slot-grid--featured,
  .net-room-grid { grid-template-columns: 1fr; }
  .net-dashboard-body { flex-direction: column; }
  .net-dashboard-sidebar {
    flex: none; width: 100%; position: static; flex-direction: row; flex-wrap: wrap;
  }
  .net-tab-link { flex: 1 1 auto; justify-content: center; }
  .net-overview-stats { grid-template-columns: repeat(2, 1fr); }
  .net-overview-cta { flex-direction: column; align-items: flex-start; }
}

/* Local-area preview uses the existing Property Elfs blue and gold identity. */
.pe-local-area{margin-top:48px;background:#fff;padding:28px;border-radius:var(--net-radius);color:var(--net-dark)}
.pe-local-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.pe-local-heading h2{margin:0!important;font-size:1.65rem!important}
.pe-local-heading>span{font-size:.85rem;color:#5b6476;font-weight:600}
.pe-local-intro{margin:8px 0 18px!important;color:#4b5563}
.pe-local-notice{padding:14px 16px;background:#fff6db;font-size:.88rem;line-height:1.5}
.pe-local-tabs{display:flex;gap:4px;margin-top:24px;border-bottom:2px solid #e8edf3}
.pe-local-tabs button{flex:1;border:0;border-bottom:3px solid transparent;margin-bottom:-2px;padding:14px 8px;background:transparent;color:#4b5563;font:inherit;font-weight:700;cursor:pointer}
.pe-local-tabs button[aria-selected=true]{color:#2946cc;border-bottom-color:#2946cc}
.pe-local-tabs button:hover{background:#f2f5fb}
.pe-local-tabs button:focus-visible,.pe-local-panel:focus-visible{outline:3px solid #2946cc;outline-offset:3px}
.pe-local-panel[hidden]{display:none!important}
.pe-local-panel>p:first-child{font-size:.9rem;color:#4b5563;margin:20px 0}
.pe-local-columns{display:flex;justify-content:space-between;font-size:.8rem;color:#626b7b;padding-bottom:10px}
.pe-local-panel ul{list-style:none!important;margin:0!important;padding:0!important}
.pe-local-panel li{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;border-top:1px solid #e8edf3}
.pe-local-panel li strong{display:block;font-size:1rem;line-height:1.35}
.pe-local-panel li div>span{display:block;font-size:.86rem;color:#626b7b;margin-top:5px}
.pe-local-distance{flex-shrink:0;font-weight:700;font-variant-numeric:tabular-nums;color:#243a88}
.pe-local-distance small{font-size:.8rem;font-weight:400;color:#626b7b}
.pe-local-footnote{font-size:.8rem!important;color:#626b7b;line-height:1.5;margin-top:18px!important}
@media(max-width:600px){.pe-local-area{padding:20px 16px}.pe-local-tabs button{font-size:.9rem}.pe-local-panel li{gap:12px}}

/* Separate readable sections on property detail pages. */
.net-about-home>.net-about-block,.net-listing-main>.net-facts-table{background:#fff;padding:26px 28px;border-radius:var(--net-radius);margin:0 0 20px;border:0;}
.net-about-block h2,.net-about-block h3,.net-facts-table h3{margin-top:0;font-size:1.1rem;color:var(--net-dark);}
.net-about-home>h2{margin:8px 0 20px;}
.net-facts-table-row{padding:12px 0;}
.net-facts-table-row:last-child{border-bottom:0;}
.net-listing-main>.pe-local-area{margin-top:24px;}
@media(max-width:600px){.net-about-home>.net-about-block,.net-listing-main>.net-facts-table{padding:22px 18px;}}

/* Buyer actions and structured property information. */
.pe-listing-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:18px 0 24px}
.pe-listing-actions .net-btn{font:inherit;font-weight:700;padding:12px 18px;border-radius:6px}
.pe-listing-actions .pe-viewing-link,.pe-viewing-card .net-btn{background:#2946cc;color:#fff}
.pe-listing-actions .pe-save-property{position:static;width:auto;height:auto;display:inline-block;font-size:1rem;background:white;border:1px solid #cdd5e2;color:#24314e;line-height:1.4}
.pe-listing-actions .pe-save-property.active{background:#e9eefc;color:#203ba9;border-color:#2946cc}
.pe-action-feedback{font-size:.88rem;color:#4b5563;flex-basis:100%;min-height:0}
.pe-action-feedback:empty{display:none}
.pe-share-fallback{flex-basis:100%;font-size:.88rem}
.pe-share-fallback input{display:block;width:100%;padding:12px}
.pe-key-features,.pe-documents{background:#fff;padding:26px 28px;border-radius:var(--net-radius);margin:24px 0 20px}
.pe-key-features h2{font-size:1.25rem;margin:0 0 16px}
.pe-key-features ul{display:grid;grid-template-columns:1fr 1fr;gap:12px 32px;padding-left:20px;margin:0}
.pe-key-features li{padding-left:4px;line-height:1.5}
.pe-documents h3{margin-top:0;font-size:1.1rem}
.pe-documents p{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between}
.pe-documents a{color:#2946cc;text-decoration:underline;text-underline-offset:3px}
.pe-document-missing{color:#697386}
.pe-viewing-card{scroll-margin-top:100px}
.pe-viewing-card h3{margin-top:0;font-size:1.15rem}
.pe-viewing-form label{display:block;font-size:.9rem;font-weight:600;margin:14px 0 6px}
.pe-viewing-form input[type=text],.pe-viewing-form textarea{width:100%;padding:12px;border:1px solid #cdd5e2;border-radius:5px;box-sizing:border-box;font:inherit}
.pe-viewing-form .net-btn{width:100%;margin-top:16px;white-space:normal}
.pe-viewing-feedback{font-size:.9rem;line-height:1.5}
.pe-detail-fields{padding:22px;margin:24px 0;border:1px solid #dfe6ec;border-radius:8px}
.pe-detail-fields legend{font-weight:700;padding:0 8px}
.pe-detail-fields label{display:block;font-weight:600;font-size:.9rem;margin:10px 0}
.pe-detail-fields label small{display:block;font-weight:400;margin-top:4px}
.pe-detail-fields input:not([type=checkbox]),.pe-detail-fields textarea{width:100%;box-sizing:border-box;padding:10px;font:inherit}
.pe-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 20px}
.net-facts-table-row{gap:24px;align-items:start}.net-facts-table-row .v{text-align:right}
@media(max-width:600px){.pe-key-features,.pe-documents{padding:22px 18px}.pe-key-features ul,.pe-detail-grid{grid-template-columns:1fr}.pe-listing-actions .net-btn{flex:1;text-align:center;min-width:120px}.pe-listing-actions .pe-viewing-link{flex-basis:100%}}

/* Keep viewing enquiries within the seller contact section. */
#net-message-seller-wrap>.net-btn{margin-top:16px;margin-bottom:18px;display:flex;justify-content:center;align-items:center;gap:8px;white-space:normal;text-align:center}
#net-message-seller-wrap .net-seller-contact{margin:8px 0 24px}
#net-message-seller-wrap .net-seller-contact>.net-btn{margin:8px 0 12px;white-space:normal}
#net-message-seller-wrap .net-contact-details p{margin:10px 0}
#net-message-seller-wrap>.pe-viewing-card{margin-top:26px;padding-top:24px;border-top:1px solid #e2e7ef;}
#net-message-seller-wrap .pe-viewing-card h3{font-size:1rem;margin:0 0 12px}
#net-message-seller-wrap .pe-viewing-card>.net-btn{display:flex;justify-content:center;margin-top:18px;white-space:normal;text-align:center}
.pe-viewing-form .net-btn{margin-top:22px;margin-bottom:12px;padding:13px 16px}
.pe-listing-actions{gap:14px}

.pe-viewing-datetime{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.pe-viewing-datetime input{width:100%;min-width:0;padding:11px 8px;box-sizing:border-box;border:1px solid #cdd5e2;border-radius:5px;font:inherit;background:#fff;color:#24314e}
.pe-viewing-datetime input:disabled{background:#f3f5f8;color:#687386}
.pe-viewing-datetime+.net-rail-note{margin-top:12px}
.pe-viewing-form>a.net-btn{display:flex;justify-content:center;margin:18px 0}
@media(max-width:380px){.pe-viewing-datetime{grid-template-columns:1fr}}

/* Whole-property gallery controls: touch-friendly and keyboard-visible. */
.net-gallery-nav { width: 48px; height: 48px; font-size: 2rem; background: #fff; display: flex; align-items: center; justify-content: center; padding: 0; }
.net-gallery-nav:hover { background: var(--net-dark); color: #fff; }
.net-gallery-nav:focus-visible, .net-gallery-main:focus-visible { outline: 3px solid var(--net-blue, #2946cf); outline-offset: 3px; }
.net-gallery-tag { font-size: .9rem; background: rgba(15,17,30,.85); max-width: calc(100% - 28px); }
.net-gallery-counter { background: rgba(15,17,30,.85); }
@media (max-width: 480px) { .net-gallery-nav { width: 44px; height: 44px; } .net-gallery-nav.prev { left: 8px; } .net-gallery-nav.next { right: 8px; } }
/* Quiet gallery arrows; retain generous touch targets. */
.net-gallery-nav { background: rgba(15,17,30,.28); color: #fff; font-size: 1.65rem; }
.net-gallery-nav:hover { background: rgba(15,17,30,.58); color: #fff; }
.net-gallery-nav:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

/* Photo shortcuts below the property gallery. */
.net-room-chips { display: grid; grid-template-columns: repeat(auto-fill, minmax(125px, 1fr)); gap: 12px; }
.net-room-chip { padding: 0; border: 0; border-radius: 6px; overflow: hidden; text-align: left; background: #fff; }
.net-room-chip > img { display: block; width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.net-room-thumb-label { display: block; padding: 9px 10px; font-size: .8rem; }
.net-room-chip.active { outline: 3px solid var(--net-dark); outline-offset: 2px; }
.net-room-chip:focus-visible { outline: 3px solid #2946cf; outline-offset: 3px; }
@media (max-width: 480px) { .net-room-chips { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; } .net-room-thumb-label { padding: 8px 6px; font-size: .72rem; } }
.net-room-chips > br, .net-room-chip br { display: none; }
.net-room-chip .n::before { content: ' · '; }

/* One-row room thumbnail carousel. */
.net-thumb-carousel { display: flex; align-items: center; gap: 10px; margin-top: 14px; }
.net-thumb-carousel > br { display: none; }
.net-thumb-carousel .net-room-chips { display: flex; flex-wrap: nowrap; gap: 12px; overflow-x: auto; min-width: 0; flex: 1; margin: 0; padding: 5px; position: relative; scroll-snap-type: x proximity; scrollbar-width: thin; }
.net-thumb-carousel .net-room-chip { flex: 0 0 140px; scroll-snap-align: start; }
.net-thumb-nav { flex: 0 0 34px; height: 44px; border: 0; border-radius: 5px; background: rgba(15,17,30,.08); color: var(--net-dark); font-size: 1.8rem; cursor: pointer; padding: 0; }
.net-thumb-nav:hover { background: rgba(15,17,30,.18); }
.net-thumb-nav:focus-visible { outline: 2px solid #2946cf; outline-offset: 2px; }
@media (max-width: 480px) { .net-thumb-carousel { gap: 4px; } .net-thumb-carousel .net-room-chip { flex-basis: 112px; } .net-thumb-nav { flex-basis: 28px; } }
/* Compact, quiet actions above the gallery. */
.pe-listing-actions { gap: 8px; margin: 12px 0 16px; }
.pe-listing-actions .net-btn, .pe-listing-actions .pe-save-property { font-size: .8rem; font-weight: 600; line-height: 1.4; padding: 7px 11px; min-height: 36px; border: 0; background: #e7ecf2; color: #39475a; box-shadow: none; }
.pe-listing-actions .pe-viewing-link { background: #dfe6f3; color: #304c7c; }
.pe-listing-actions .net-btn:hover { background: #d4ddea; color: #24314e; }
.pe-listing-actions .net-btn:focus-visible { outline: 2px solid #2946cc; outline-offset: 3px; }
@media (max-width:600px) { .pe-listing-actions .net-btn, .pe-listing-actions .pe-viewing-link { flex: 0 1 auto; min-width: 0; flex-basis: auto; min-height: 44px; } }
.pe-saved-properties { padding: 22px 0 40px; }
.pe-saved-properties > p { margin: 0 0 18px; line-height: 1.6; }
.pe-saved-properties > p a { color: #2946cc; text-decoration: underline; }

.pe-viewing-item { background:#fff; padding:24px; margin:20px 0; border-radius:8px; }
.pe-viewing-item p { margin:12px 0; }
.pe-viewing-controls { display:flex; flex-wrap:wrap; gap:12px; margin:16px 0; }
.pe-viewing-item button { padding:10px 14px; background:#e7ecf2; color:#24314e; border:0; border-radius:5px; cursor:pointer; min-height:44px; }
.pe-viewing-item label { display:inline-flex; flex-direction:column; gap:8px; margin:16px 16px 16px 0; }
.pe-viewing-item input { padding:10px; border:1px solid #cdd5e2; border-radius:4px; max-width:100%; }
.pe-viewing-item summary { cursor:pointer; padding:12px 0; }
.pe-viewing-reminder { background:#e9f5ef; padding:14px; }
.pe-viewing-item button:focus-visible { outline:2px solid #2946cc; outline-offset:3px; }

.pe-slot-form select,.pe-slot-form input[type=date],.pe-viewing-item select { width:100%; max-width:100%; padding:10px; margin:8px 0 16px; background:#fff; border:1px solid #cdd5e2; border-radius:4px; color:#24314e; }
.pe-viewing-management > p { margin:12px 0; line-height:1.5; }

.pe-booking-sections { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:24px; }
.pe-booking-sections a { padding:12px 16px; border-radius:5px; background:#e7ecf2; color:#24314e; }
.pe-booking-sections a[aria-current=page] { background:#dceff1; color:#126d79; font-weight:700; }

.pe-month-calendar { background:#fff; padding:18px; border-radius:8px; margin:20px 0; max-width:600px; }
.pe-month-bar { display:flex; justify-content:space-between; align-items:center; gap:8px; margin-bottom:16px; }
.pe-month-bar button { background:#edf1f5; border:0; border-radius:5px; width:40px; height:40px; font-size:24px; cursor:pointer; color:#24314e; padding:0; }
.pe-month-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:5px; }
.pe-weekday { text-align:center; padding:8px 0; font-size:12px; font-weight:600; color:#596577; }
.pe-month-grid .pe-month-day { position:relative; min-height:44px; min-width:0; padding:8px 0 14px; border:0; border-radius:5px; background:#f0f3f7; color:#24314e; cursor:pointer; font-size:14px; }
.pe-month-day.has-availability::after { content:'●'; position:absolute; bottom:1px; left:0; right:0; color:#12838e; font-size:9px; }
.pe-month-day.has-booking::before { content:'◆'; position:absolute; top:1px; right:4px; color:#91651c; font-size:9px; }
.pe-month-grid .pe-month-day[aria-pressed=true] { background:#126d79; color:#fff; }
.pe-month-day[aria-pressed=true]::after { color:#fff; }
.pe-month-grid .pe-month-day:disabled { background:transparent; color:#a9afb8; cursor:default; }
.pe-month-day[aria-current=date] { font-weight:800; text-decoration:underline; }
.pe-calendar-key { font-size:12px; color:#596577; margin:14px 0 0; line-height:1.5; }
.pe-month-calendar button:focus-visible,.pe-time-choice:focus-visible { outline:2px solid #2946cc; outline-offset:2px; }
.pe-viewing-card .pe-month-calendar { padding:0; }
.pe-day-times { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0 22px; }
.pe-day-times .pe-time-day { flex-basis:100%; margin:0 0 6px; font-weight:600; }
.pe-time-choice { padding:10px 12px; min-height:44px; border:0; border-radius:5px; background:#e7ecf2; color:#24314e; cursor:pointer; font-size:13px; }
.pe-time-choice[aria-pressed=true] { background:#126d79; color:#fff; }
.pe-calendar-slot-item[hidden] { display:none; }
@media(max-width:480px) { .pe-month-calendar { padding:12px; } .pe-month-grid { gap:3px; } .pe-month-grid .pe-month-day { min-height:40px; } }

.pe-guest-booking-actions { display:flex; flex-direction:column; align-items:flex-start; gap:16px; margin:18px 0; }
.pe-guest-booking-actions .net-btn { font-size:14px; padding:12px 14px; white-space:normal; }
.pe-guest-booking-actions > a:not(.net-btn) { text-decoration:underline; font-size:14px; }
.pe-auth-booking-note { margin:0 0 24px; line-height:1.6; padding:16px; background:#edf5f7; border-radius:6px; }

.net-auth-form input[type=password] { display:block; width:100%; padding:12px 14px; border:1px solid #cdd5e2; border-radius:5px; font:inherit; box-sizing:border-box; }

.pe-referral-card { margin:24px 0; padding:24px; border-radius:8px; background:#fff; }
.pe-referral-card h3 { margin:0 0 12px; }
.pe-referral-card p { margin:12px 0; line-height:1.6; }
.pe-referral-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:18px; }
.pe-referral-actions .net-btn { min-height:44px; font-size:14px; padding:10px 16px; }
.pe-referral-fallback[hidden] { display:none; }
.pe-referral-fallback input { display:block; width:100%; margin-top:8px; padding:10px; border:1px solid #cdd5e2; border-radius:4px; }

.pe-consultant-dashboard > h2 { margin-bottom:18px; }
.pe-consultant-demo { padding:16px; background:#edf5f7; margin:18px 0; border-radius:6px; }
.pe-consultant-profile-summary { background:white; padding:24px; border-radius:8px; margin:24px 0; }
.pe-consultant-profile-summary p { margin:12px 0; line-height:1.6; }
.pe-consultant-dashboard .net-overview-stats { grid-template-columns:repeat(3,minmax(0,1fr)); }
@media(max-width:600px){.pe-consultant-dashboard .net-overview-stats {grid-template-columns:1fr;}}

.pe-consultant-story-fields { border:0; padding:24px 0; margin:16px 0; }
.pe-consultant-story-fields legend { font-size:20px; font-weight:700; }
.pe-consultant-story-fields textarea { width:100%; }
.pe-consultant-story { margin:24px 0; }
.pe-consultant-story section { background:#fff; padding:24px; margin:18px 0; border-radius:8px; }
.pe-consultant-story h2 { font-size:20px; margin:0 0 12px; }
.pe-consultant-story p { line-height:1.6; }
.pe-member-since { color:#46566d; }

.pe-consultant-photo { margin:0; flex:0 0 140px; }
.pe-consultant-photo .net-store-profile-logo { object-fit:cover; }
.pe-consultant-photo figcaption { font-size:11px; line-height:1.4; color:#596577; max-width:140px; margin-top:6px; }

.pe-elf-filters { display:flex; flex-wrap:wrap; align-items:flex-end; gap:16px; background:#fff; padding:22px; border-radius:8px; margin:22px 0; }
.pe-elf-filters label { display:flex; flex:1 1 180px; flex-direction:column; gap:8px; min-width:0; }
.pe-elf-filters input,.pe-elf-filters select { width:100%; padding:10px; border:1px solid #cdd5e2; border-radius:4px; background:#fff; font:inherit; }
.pe-elf-filters button { min-height:44px; }
.pe-elf-result p { margin:12px 0; line-height:1.5; }
.pe-elf-result .net-store-logo { object-fit:cover; }
.pe-elf-directory > p { line-height:1.6; margin:16px 0; }
/* Comfortable spacing for consultant directory results. */
.pe-elf-directory .net-stores-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 24px; margin: 24px 0; align-items: stretch; }
.pe-elf-directory .pe-elf-result { padding: 24px; display: flex; flex-direction: column; min-width: 0; box-sizing: border-box; }
.pe-elf-result > a:first-child { display: block; text-decoration: none; }
.pe-elf-result h3 { margin: 16px 0 6px; line-height: 1.4; overflow-wrap: anywhere; }
.pe-elf-result p { margin: 10px 0; overflow-wrap: anywhere; }
.pe-elf-result .net-service-badges { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 8px; margin: 12px 0; }
.pe-elf-result .net-service-badge { margin: 0; white-space: normal; line-height: 1.5; }
.pe-elf-result > .net-btn { margin-top: auto; align-self: flex-start; padding: 10px 12px; min-height: 44px; white-space: normal; text-align: center; }
@media(max-width:600px) { .pe-elf-directory .pe-elf-result { padding: 20px; } .pe-elf-directory .net-stores-grid { gap: 20px; } }

/* Rounded sale/rental labels replace the photo ribbons. */
.net-card-img-link .net-badge { left:12px; top:12px; clip-path:none; border-radius:999px; padding:7px 12px; text-transform:none; letter-spacing:0; font-size:12px; line-height:1.4; max-width:calc(100% - 24px); box-sizing:border-box; }
.net-badge.net-badge--sale { background:#243b70; color:#fff; }
.net-badge.net-badge--rent { background:#126d68; color:#fff; }

.pe-card-facts { display:flex; align-items:center; flex-wrap:wrap; gap:16px; margin:10px 0 12px; color:#46566d; font-size:13px; }
.pe-card-facts > span { display:inline-flex; align-items:center; gap:6px; }
.pe-card-facts svg { width:20px; height:20px; flex-shrink:0; color:#39475a; }

.pe-listed-date { margin:10px 0 16px; color:#596577; font-size:13px; line-height:1.5; }
.net-card-body .pe-listed-date { margin:10px 0 12px; font-size:12px; }

.pe-floorplan-help { margin-top:16px; padding:16px; background:#edf5f7; border-radius:6px; font-size:13px; line-height:1.6; }
.pe-floorplan-help summary { cursor:pointer; font-weight:700; min-height:24px; }
.pe-floorplan-help p { margin:14px 0 0; }
.pe-floorplan-help a { text-decoration:underline; color:#244881; }

#wp-net_description-wrap { margin-top:10px; border:1px solid #cdd5e2; border-radius:6px; overflow:hidden; }
#wp-net_description-wrap button { box-shadow:none; }

.pe-listing-advertising { display:flex; flex-direction:column; gap:24px; margin-top:24px; }
.pe-listing-ad { background:#fff; padding:16px; border-radius:8px; overflow:hidden; }
.pe-ad-label { color:#6b7280; font-size:11px; margin:0 0 12px; text-align:center; }
.pe-ad-preview { min-height:250px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; background:#edf1f5; color:#46566d; padding:20px; text-align:center; box-sizing:border-box; }
.pe-ad-preview small { font-size:11px; }
.pe-listing-ad img { max-width:100%; height:auto; }

/* Final listing information notice, following the local area section. */
.pe-property-notice{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:24px;margin-top:24px;color:#475569;font-size:14px;line-height:1.7}
.pe-property-notice h2{font-size:20px;color:#142b45;margin:0 0 12px}
.pe-property-notice p{margin:0 0 12px}
.pe-property-notice p:last-child{margin-bottom:0}