/*
 * Styles for KinkersHub Classifieds plugin
 * Provides a modern, responsive layout with cards and search bar.
 */

/* -------------------------------------------------------------------------- */
/* Rentals: single listing mini map                                           */
/* -------------------------------------------------------------------------- */
.kh-single-map-card {
  margin: 14px 0 10px;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 4px 18px rgba(0,0,0,0.04);
}

.kh-single-map-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
}

.kh-single-map-title {
  font-weight: 600;
  font-size: 14px;
}

.kh-single-map-open {
  font-size: 13px;
  text-decoration: none;
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(0,0,0,0.05);
}

.kh-single-mini-map {
  height: 220px;
  width: 100%;
}

.kh-single-mini-map .leaflet-container {
  border-radius: 0;
}

.kh-wrapper {
  max-width: 1000px;
  margin: 0 auto;
  padding: 20px;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

/* Logged-out notice cards should breathe below the site header (used by kh_view=new). */
.kh-auth-required--topgap {
  /* Align with other logged-out views (Saved/My Account/Inbox).
     New Listing was sitting slightly lower after the previous spacing fix. */
  margin-top: 12px;
}

/* -------------------------------------------------------------------------- */
/* Rentals: browse index should use the full available width (Zillow-like)    */
/* -------------------------------------------------------------------------- */
/*
 * The global .kh-wrapper card is great for most plugin pages, but the rentals
 * browse experience benefits from using the entire viewport (especially when
 * paired with the new header filters + map toggle).
 */
.kh-wrapper.kh-index-rentals,
.kh-wrapper.kh-index-rentals.kh-rentals-map-view {
  max-width: none;
  width: 100%;
  margin: 0;

  /* Let the page breathe edge-to-edge, then apply spacing inside sections. */
  padding: 0;

  /* Remove the centered “card” framing so it feels like a true app view. */
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;

  /* Full-bleed takeover even when the theme centers page content */
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);

}

/* -------------------------------------------------------------------------- */
/* Rentals Map View: remove wasted top space (theme page title / padding)      */
/* -------------------------------------------------------------------------- */
/*
 * Some themes insert a page title (e.g., “Map view”) and/or extra content padding
 * above the plugin UI. In the rentals map view this creates a large dead zone
 * between the site header and the filter row.
 *
 * We keep this scoped tightly to the rentals map view to avoid affecting other pages.
 */
body.kh-rentals-map-view .entry-header,
body.kh-rentals-map-view .page-header,
body.kh-rentals-map-view .wp-block-post-title,
body.kh-rentals-map-view .wp-block-query-title,
body.kh-rentals-map-view .post-title,
body.kh-rentals-map-view .entry-title,
body.kh-rentals-map-view .page-title,
body.kh-rentals-map-view h1.entry-title,
body.kh-rentals-map-view h1.page-title {
  display: none !important;
}

body.kh-rentals-map-view #content,
body.kh-rentals-map-view .site-content,
body.kh-rentals-map-view .content-area,
body.kh-rentals-map-view main,
body.kh-rentals-map-view .wp-site-blocks {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.kh-rentals-map-view .kh-index-rentals .kh-classifieds-header {
  margin-top: 0 !important;
  padding-top: 12px;
}


/* Re-introduce sane horizontal padding for key sections inside the full-width wrapper */
.kh-index-rentals .kh-classifieds-header,
.kh-index-rentals .kh-rentals-map-shell,
.kh-index-rentals .kh-cards,
.kh-index-rentals .kh-pagination {
  padding-left: 24px;
  padding-right: 24px;
}

@media (max-width: 980px) {
  .kh-index-rentals .kh-classifieds-header,
  .kh-index-rentals .kh-rentals-map-shell,
  .kh-index-rentals .kh-cards,
  .kh-index-rentals .kh-pagination {
    padding-left: 14px;
    padding-right: 14px;
  }
}

/* Rentals map view layout */
.kh-rentals-map-shell {
  --kh-rentals-list-pct: 34%;
  --kh-rentals-splitter-w: 12px;
  display: grid;
  grid-template-columns: 2fr 1fr; /* map left, list right */
  gap: 0.9rem;
  align-items: stretch;
  width: 100%;
  min-height: 0;
}

/* Rentals: map-only mode (three-way toggle)
   When kh_map_layout=map, we keep the same page + JS behavior, but hide the
   listings panel and splitter so the map can take the full width.
*/
.kh-index-rentals.kh-rentals-map-view.kh-rentals-map-layout-map .kh-rentals-map-shell {
  grid-template-columns: 1fr;
  grid-template-areas: "map";
  gap: 0;
}
.kh-index-rentals.kh-rentals-map-view.kh-rentals-map-layout-map #kh-rentals-map-list,
.kh-index-rentals.kh-rentals-map-view.kh-rentals-map-layout-map .kh-rentals-splitter {
  display: none !important;
}

/* Draggable vertical splitter (desktop/tablet only) */
.kh-rentals-splitter {
  display: none;
}

@media (min-width: 769px) {
  .kh-rentals-map-view .kh-index-rentals .kh-rentals-splitter {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: col-resize;
    user-select: none;
    touch-action: none;
    border-radius: 999px;
    background: rgba(0,0,0,0.06);
  }
  .kh-rentals-map-view .kh-index-rentals .kh-rentals-splitter:before {
    content: '';
    width: 4px;
    height: 26px;
    border-radius: 999px;
    background: rgba(0,0,0,0.22);
    box-shadow: 0 -8px 0 rgba(0,0,0,0.22), 0 8px 0 rgba(0,0,0,0.22);
  }
  .kh-rentals-map-view .kh-index-rentals .kh-rentals-splitter.is-dragging {
    background: rgba(37,99,235,0.18);
  }
}


/* Map View: keep the list narrower so the map always feels dominant */
@media (min-width: 769px) and (max-width: 1023px) {
  .kh-rentals-map-view .kh-index-rentals .kh-rentals-map-shell {
    grid-template-columns: clamp(280px, var(--kh-rentals-list-pct, 38%), 520px) var(--kh-rentals-splitter-w, 12px) minmax(0, 1fr);
    grid-template-areas: "list splitter map";
    gap: 18px;
    padding-left: 0;
    padding-right: 0;
  }

  .kh-rentals-map-view .kh-index-rentals #kh-rentals-map { grid-area: map; }
  .kh-rentals-map-view .kh-index-rentals #kh-rentals-map-list { grid-area: list; }
  .kh-rentals-map-view .kh-index-rentals .kh-rentals-splitter { grid-area: splitter; }
}

/* -------------------------------------------------------------------------- */
/* Map View: unbox the map (full-bleed), keep ads inside a boxed panel (desktop) */
/* -------------------------------------------------------------------------- */
@media (min-width: 1024px) {
  /* Stop padding from “boxing” the whole 2-col shell; we’ll pad only the list side */
  .kh-rentals-map-view .kh-index-rentals .kh-rentals-map-shell {
    padding-right: 0;
    padding-left: 0;
    padding-top: 0;
    padding-bottom: 0;
    gap: 24px;
    grid-template-columns: clamp(280px, var(--kh-rentals-list-pct, 34%), 620px) var(--kh-rentals-splitter-w, 12px) minmax(0, 1fr);
    grid-template-areas: "list splitter map";
  }

  /* Re-order without changing markup */
  .kh-rentals-map-view .kh-index-rentals #kh-rentals-map { grid-area: map; }
  .kh-rentals-map-view .kh-index-rentals #kh-rentals-map-list { grid-area: list; }
  .kh-rentals-map-view .kh-index-rentals .kh-rentals-splitter { grid-area: splitter; }

  /* Map should feel like it lives in the browser, not inside a card */
  .kh-rentals-map-view .kh-index-rentals #kh-rentals-map {
    border-radius: 0;
    box-shadow: none;
    background: #eef3f8;
    /* Make sure it can stretch to the far right edge */
    width: 100%;
  }

  /* Listings panel = the “boxed” piece */
  .kh-rentals-map-view .kh-index-rentals #kh-rentals-map-list {
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.10);
    border: 1px solid rgba(15, 23, 42, 0.06);
    overflow: auto;
    padding: 14px 12px 18px;
    margin-left: 24px; /* keep breathing room from the left edge */
  }

  /* If we’re showing 2-up cards, keep their container padding reasonable */
  .kh-index-rentals.kh-rentals-map-view #kh-rentals-map-list{
    padding: 14px 12px 18px;
  }
}

/* Zillow-like behavior: keep the map fixed and only scroll the listings panel
   (desktop/tablet only). On mobile we allow normal document scrolling so the
   bottom nav and sheet-style listing drawer don’t get trapped/hidden by
   overflow locking on some devices/browsers.
*/
@media (min-width: 769px) {
  /* Lock the document scroll so only the listings panel scrolls (Zillow style) */
  html.kh-rentals-map-view,
  .kh-rentals-map-view {
    height: 100%;
    overflow: hidden;
  }

  /* Some themes scroll inner wrappers instead of <body>. Force them to stop. */
  .kh-rentals-map-view #page,
  .kh-rentals-map-view .site,
  .kh-rentals-map-view .site-content,
  .kh-rentals-map-view .content-area,
  .kh-rentals-map-view .site-main,
  .kh-rentals-map-view main,
  .kh-rentals-map-view .wp-site-blocks {
    height: 100%;
    overflow: hidden;
  }

  .kh-wrapper.kh-index-rentals.kh-rentals-map-view {
    /* Turn the wrapper into a viewport-sized app shell */
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100vh;
  }

  /* Account for the WP admin bar height when logged in */
  body.admin-bar .kh-wrapper.kh-index-rentals.kh-rentals-map-view {
    height: calc(100vh - 32px);
  }
  @media (max-width: 782px) {
    body.admin-bar .kh-wrapper.kh-index-rentals.kh-index-rentals.kh-rentals-map-view,
    body.admin-bar .kh-wrapper.kh-index-rentals.kh-rentals-map-view {
      height: calc(100vh - 46px);
    }
  }
}

/* In the Zillow-like map experience (desktop/tablet) we don’t want the
   page-level footer to force the whole document to scroll. */
@media (min-width: 769px) {
  .kh-wrapper.kh-index-rentals.kh-rentals-map-view + .classicore-footer-wrapper {
    display: none;
  }
}

.kh-index-rentals.kh-rentals-map-view .kh-classifieds-header {
  flex: 0 0 auto;
}

.kh-index-rentals.kh-rentals-map-view .kh-rentals-map-shell {
  flex: 1 1 auto;
  align-items: stretch;
  min-height: 0; /* allow children to size within flex container */
  height: 100%;
}


.kh-index-rentals.kh-rentals-map-view .kh-rentals-map {
  height: 100%;
  min-height: 0;
}

.kh-index-rentals.kh-rentals-map-view .kh-rentals-map-list {
  height: 100%;
  max-height: none;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* Mobile stability: avoid nested scrolling + viewport-locked heights on the map view.
   Nested scroll containers + mobile browser chrome resizing can cause a jittery
   "shake" when moving between the map and listings. */
@media (max-width: 768px) {
  .kh-index-rentals.kh-rentals-map-view .kh-rentals-map-shell {
    height: auto !important;
    min-height: 0;
  }

  .kh-index-rentals.kh-rentals-map-view .kh-rentals-map {
    height: auto;
    min-height: 0;
  }

  /* Give the map a stable, non-thrashy height on phones */
  .kh-index-rentals.kh-rentals-map-view #kh-rentals-map,
  .kh-index-rentals.kh-rentals-map-view .kh-rentals-map {
    height: clamp(280px, 42vh, 460px);
  }

  /* Let the listings flow with the document instead of an inner scroller */
  .kh-index-rentals.kh-rentals-map-view .kh-rentals-map-list,
  .kh-index-rentals.kh-rentals-map-view #kh-rentals-map-list {
    height: auto !important;
    overflow: visible;
    -webkit-overflow-scrolling: auto;
  }
}

.kh-rentals-map {
  width: 100%;
  height: 100%;
  min-height: 420px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,0.08);
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}

.kh-rentals-map-list {
  height: 100%;
  min-height: 0;
  overflow: auto;
  padding-right: 2px;
}

.kh-rentals-map-list .kh-card-rental {
  cursor: pointer;
}

.kh-rentals-map-list .kh-card-rental.is-active {
  outline: 2px solid rgba(0,115,170,0.45);
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
}

/* Premium map view: list + cluster styling */
.kh-map-list-loading,
.kh-map-list-empty {
  padding: 12px 10px;
  color: rgba(0,0,0,0.65);
  font-weight: 600;
}

.kh-map-list-hint {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 10px 10px;
  margin-bottom: 10px;
  border-radius: 12px;
  background: rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.06);
  color: rgba(0,0,0,0.7);
  font-weight: 600;
}

/* MapView: Zillow-style results header (For Rent + count) */
.kh-map-list-header{
  isolation: isolate;
  position: sticky;
  top: 0;
  z-index: 50;
  padding: 14px 12px 10px;
  background: #fff;
    box-shadow: 0 6px 18px rgba(0,0,0,0.06);
border-bottom: 1px solid rgba(0,0,0,0.08);
}

.kh-map-list-header-top{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.kh-map-list-pill{
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.12);
  background: rgba(0,0,0,0.03);
  font-weight: 800;
  font-size: 13px;
  color: rgba(0,0,0,0.78);
}

.kh-map-list-header-count{
  margin-top: 8px;
  font-size: 14px;
  font-weight: 700;
  color: rgba(0,0,0,0.70);
}

.kh-rentals-map-list .kh-card-title {
  font-weight: 700;
  margin-top: 4px;
  margin-bottom: 6px;
  color: rgba(0,0,0,0.86);
}

.kh-rentals-map-list .kh-map-card-link {
  display: inline-block;
  margin-top: 8px;
  font-weight: 700;
  text-decoration: none;
  color: #0073aa;
}

.kh-rentals-map-list .kh-map-card-link:hover {
  text-decoration: underline;
}

.kh-map-cluster {
  background: transparent;
}

.kh-map-cluster-bubble {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 13px;
  color: #fff;
  background: rgba(0, 115, 170, 0.95);
  box-shadow: 0 10px 24px rgba(0,0,0,0.25);
  border: 2px solid rgba(255,255,255,0.95);
}

/* Map: price pill markers (no photos; avoids clutter) */
.kh-map-price-icon {
  background: transparent;
  border: 0;
}

.kh-map-price-marker {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding-bottom: 8px; /* room for nub */
}

.kh-map-price-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 10px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 12px;
  line-height: 1;
  color: #0b0f14;
  background: rgba(255,255,255,0.96);
  border: 2px solid rgba(255,255,255,0.98);
  box-shadow: 0 14px 30px rgba(0,0,0,0.24);
  white-space: nowrap;
  max-width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.kh-map-price-nub {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 10px;
  height: 10px;
  transform: translateX(-50%) rotate(45deg);
  background: rgba(255,255,255,0.96);
  border-right: 2px solid rgba(255,255,255,0.98);
  border-bottom: 2px solid rgba(255,255,255,0.98);
  box-shadow: 8px 8px 18px rgba(0,0,0,0.10);
}

/* Make the marker feel interactive */
.leaflet-marker-icon.leaflet-interactive:hover .kh-map-price-pill,
.leaflet-marker-icon.leaflet-interactive:focus .kh-map-price-pill {
  transform: translateY(-1px);
}


.leaflet-marker-icon.leaflet-interactive .kh-map-price-pill{
  transition: transform 140ms ease;
}
.leaflet-marker-icon.kh-pin-hover .kh-map-price-pill{
  transform: translateY(-1px) scale(1.04);
}

.kh-map-popup {
  min-width: 210px;
}

.kh-map-popup-price {
  font-weight: 800;
  margin-bottom: 4px;
}

.kh-map-popup-title {
  font-weight: 700;
  margin-bottom: 4px;
}

/* Map view: City search bar */
.kh-mapview-toolbar {
  padding: 10px 0 0 0;
}

.kh-mapview-search {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.kh-mapview-search-input {
  flex: 1 1 260px;
  min-width: 220px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,0.10);
  outline: none;
  background: #fff;
}

.kh-mapview-search-input:focus {
  border-color: rgba(0,115,170,0.45);
  box-shadow: 0 0 0 3px rgba(0,115,170,0.12);
}

.kh-mapview-search-btn {
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,0.10);
  background: rgba(0,115,170,0.95);
  color: #fff;
  font-weight: 800;
  cursor: pointer;
}

.kh-mapview-search-btn:hover {
  filter: brightness(0.98);
}

.kh-mapview-search-status {
  font-weight: 700;
  color: rgba(0,0,0,0.65);
}

.kh-map-popup-loc {
  color: rgba(0,0,0,0.65);
  margin-bottom: 8px;
}

.kh-map-popup-link {
  font-weight: 800;
  text-decoration: none;
  color: #0073aa;
}

.kh-map-popup-link:hover {
  text-decoration: underline;
}

@media (max-width: 900px) {
  .kh-rentals-map-shell {
    grid-template-columns: 1fr;
  }
  .kh-rentals-map {
    height: 52vh;
    min-height: 320px;
  }
  .kh-rentals-map-list {
    max-height: none;
  }
}

/* Rentals: Pin-drop map picker (Leaflet) */
.kh-map-picker {
  margin: 0.75rem 0 1rem;
  padding: 0.85rem;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 14px;
  background: #ffffff;
}

.kh-map-picker__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.kh-map-picker__title {
  font-weight: 700;
  letter-spacing: 0.2px;
}

.kh-map-picker__actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.kh-map-picker__help {
  margin: 0.45rem 0 0.65rem;
  font-size: 0.9rem;
  opacity: 0.85;
}

.kh-map-picker__map {
  width: 100%;
  height: 260px;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.28);
}

@media (min-width: 960px) {
  .kh-map-picker__map {
    height: 300px;
  }
}

/* ---------------- Rentals enhancements ---------------- */
/* A special card style for rentals grid. Adds a border, subtle shadow and hover lift. */
.kh-card-rental {
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 10px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.kh-card-rental:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

/* Placeholder thumbnail for rentals with no uploaded image */
.kh-card-thumb-placeholder {
  background: #f5f5f5;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 180px;
  color: #999;
  font-size: 2rem;
}

/* Ensure rental card thumbnails are consistent height and cover the area */
.kh-card-thumb img {
  width: 100%;
  height: 180px;
  object-fit: cover;
  display: block;
}

/* Rental card body spacing */
.kh-card-rental .kh-card-body {
  padding: 0.70rem 0.85rem 0.60rem;
  display: flex;
  flex-direction: column;
  gap: 0.32rem;
  /* Don't force extra vertical space under the last meta line (Posted X days ago). */
  flex-grow: 0;
}

/* Rentals card excerpt styling
 * A short description appears below the specs and location in the rentals grid
 * to provide more context without overwhelming the card. Make the font
 * slightly smaller and adjust the color to a muted tone.
 */
.kh-card-rental .kh-card-excerpt {
  font-size: 0.86rem;
  color: #475569;
  margin: 0;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-wrap: pretty;
}

.kh-card-price {
  font-size: 1.1rem;
  font-weight: 700;
  color: #111;
  margin: 0;
}

.kh-card-specs {
  font-size: 0.85rem;
  color: #555;
  margin: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.kh-card-specs .kh-meta-item { white-space: nowrap; }
.kh-card-specs .kh-meta-sep {
  font-weight: 900;
  opacity: 0.70;
  margin: 0 0.35rem;
  line-height: 1;
}

.kh-card-location {
  font-size: 0.8rem;
  color: #777;
  margin: 0;
}


.kh-card-age {
  font-size: 0.75rem;
  color: #8a8a8a;
  margin: 2px 0 0;
}

/* --- Rentals listing card polish (Zillow-style) --- */
.kh-card-rental--polished {
  border-radius: 14px;
}

.kh-card-rental--polished .kh-card-media {
  position: relative;
  /* Keep media consistent even if a theme applies global img rules. */
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #f1f5f9;
}

.kh-card-rental--polished .kh-card-thumb img,
.kh-card-rental--polished .kh-card-carousel-img {
  width: 100%;
  height: 100% !important;
  object-fit: cover;
  display: block;
}

/* Ensure carousel containers inherit the fixed media height */
.kh-card-rental--polished .kh-card-thumb,
.kh-card-rental--polished .kh-card-carousel,
.kh-card-rental--polished .kh-card-carousel-track,
.kh-card-rental--polished .kh-card-carousel-slide {
  height: 100%;
}

@media (max-width: 600px) {
  .kh-card-rental--polished .kh-card-thumb img,
  .kh-card-rental--polished .kh-card-carousel-img {
    height: 100% !important;
  }

  .kh-card-rental--polished .kh-card-media {
    aspect-ratio: 16 / 11;
  }
}

.kh-card-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 3;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  color: #fff;
  background: rgba(17, 24, 39, 0.82);
  backdrop-filter: blur(6px);
  max-width: calc(100% - 20px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.kh-card-heart {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 4;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(0, 0, 0, 0.08);
  cursor: pointer;
}

.kh-card-heart .dashicons {
  font-size: 18px;
  line-height: 1;
  width: 18px;
  height: 18px;
}

.kh-card-heart.kh-saved-active {
  background: rgba(239, 68, 68, 0.92);
  border-color: rgba(239, 68, 68, 0.35);
}

.kh-card-heart.kh-saved-active .dashicons {
  color: #fff;
}

.kh-card-carousel {
  position: relative;
  overflow: hidden;
}

.kh-card-carousel-track {
  display: flex;
  width: 100%;
  transform: translate3d(0, 0, 0);
  transition: transform 220ms ease;
}

.kh-card-carousel-slide {
  min-width: 100%;
}

.kh-card-carousel-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.10);
  background: rgba(255, 255, 255, 0.92);
  display: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.kh-card-carousel:hover .kh-card-carousel-nav {
  display: inline-flex;
}

.kh-card-carousel-prev { left: 10px; }
.kh-card-carousel-next { right: 10px; }

.kh-card-carousel-dots {
  position: absolute;
  left: 50%;
  bottom: 10px;
  transform: translateX(-50%);
  z-index: 3;
  display: flex;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.45);
  backdrop-filter: blur(6px);
}

.kh-card-carousel-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  border: none;
  padding: 0;
  background: rgba(255, 255, 255, 0.55);
  cursor: pointer;
}

.kh-card-carousel-dot.is-active {
  background: rgba(255, 255, 255, 0.95);
}

.kh-card-rental--polished .kh-card-price {
  font-size: 1.25rem;
  font-weight: 800;
}

.kh-card-rental--polished .kh-card-price-suffix,
.kh-card-rental--polished .kh-card-per,
.kh-card-rental--polished .kh-card-price-suffix {
  font-size: 0.9rem;
  font-weight: 700;
  opacity: 0.75;
  margin-left: 4px;
}

/* Rental details list styling in single listing */
.kh-rental-details-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.kh-rental-details-list li {
  margin-bottom: 0.4rem;
  font-size: 0.9rem;
  color: #333;
}

/* Rental meta fields styling */
.kh-rental-meta-fields {
  background: #fdfdfd;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  padding: 0.6rem 0.75rem;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  font-size: 0.9rem;
}
.kh-rental-meta-fields li {
  margin: 0;
  padding: 0;
}

/* Single rental details section styling */
.kh-single-section.kh-single-rental-details {
  background: #fdfdfd;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 10px;
  padding: 1rem;
  margin-top: 1.2rem;
}
.kh-single-section.kh-single-rental-details .kh-rental-details-list li {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #eee;
  padding: 0.4rem 0;
  margin: 0;
}
.kh-single-section.kh-single-rental-details .kh-rental-details-list li:last-child {
  border-bottom: none;
}
.kh-single-section.kh-single-rental-details .kh-rental-details-list li strong {
  color: #555;
  margin-right: 0.5rem;
}

/* Checkbox group styling in rentals toolbar */
.kh-toolbar-checkbox-group {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
@media (min-width: 640px) {
  .kh-toolbar-checkbox-group {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0.5rem 0.5rem;
  }
}
.kh-checkbox-label {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.85rem;
  color: #333;
}

/* Category list */
.kh-index .kh-category-list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0;
  margin: 0 0 1rem 0;
}
.kh-category-list li {
  margin: 0;
}
.kh-category-list a {
  display: inline-block;
  padding: 0.3rem 0.6rem;
  background: #f0f0f0;
  border-radius: 4px;
  text-decoration: none;
  color: #333;
  font-size: 0.9rem;
}
.kh-category-list .current-cat a {
  background: #0073aa;
  color: #ffffff;
}

/* Search bar */
.kh-search-form {
  margin-bottom: 1rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: flex-end;
}
.kh-search-input {
  flex: 1;
  padding: 0.5rem;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 0.9rem;
}
.kh-filter-input,
.kh-filter-select {
  padding: 0.4rem 0.55rem;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 0.85rem;
}
.kh-filter-select {
  background: #fff;
}
.kh-reset {
  margin-left: 0.5rem;
  font-size: 0.8rem;
  color: #0073aa;
  text-decoration: none;
  align-self: center;
}
.kh-reset:hover {
  text-decoration: underline;
}
.kh-search-button {
  padding: 0.5rem 1rem;
  background: #0073aa;
  color: #ffffff;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.9rem;
}
.kh-search-button:hover {
  background: #005f8d;
}

/* Lightbox overlay for viewing full-size images */
.kh-lightbox-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  background: rgba(0, 0, 0, 0.8);
  display: none;
  align-items: center;
  justify-content: center;
}
.kh-lightbox-overlay img {
  max-width: 90%;
  max-height: 90%;
  border-radius: 4px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

/* Listings grid */
.kh-listing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 0.8rem;
}
.kh-card {
  background: #f9f9f9;
  border-radius: 6px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.kh-card-thumb img {
  width: 100%;
  height: auto;
  display: block;
}
.kh-card-body {
  padding: 0.75rem;
  flex: 1;
}
.kh-card-title {
  margin-top: 0;
  margin-bottom: 0.35rem;
  font-size: 1.1rem;
  color: #222;
}
.kh-card-title a {
  color: inherit;
  text-decoration: none;
}
.kh-card-title a:hover {
  text-decoration: underline;
}
.kh-card-meta {
  font-size: 0.8rem;
  color: #777;
  margin-bottom: 0.35rem;
}
.kh-card-excerpt {
  font-size: 0.9rem;
  color: #555;
  margin: 0;
}

/* Pagination */
.kh-pagination {
  margin: 1rem 0;
  text-align: center;
}

/* ===============================
 * Rentals: mobile top bar (mimic reference UI)
 * =============================== */
/* Desktop: keep the rentals header, but embed the location + Filters controls inside it */
@media (min-width: 769px) {
  .kh-classifieds-header-rentals {
    flex-direction: column;
    align-items: stretch;
    gap: 0.75rem;
  }

  .kh-classifieds-header-rentals .kh-classifieds-header-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    width: 100%;
  }

  /* The embedded top bar should feel like part of the header, not a second card */
  .kh-classifieds-header-rentals .kh-rentals-mobile-top {
    margin: 0;
    padding: 0;
    background: transparent;
    width: 100%;
  }

  .kh-classifieds-header-rentals .kh-rentals-mobile-top-label {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(0,0,0,0.55);
    margin: 0 0 0.4rem;
  }

  /* Align the location input + Filters button cleanly on desktop */
  .kh-classifieds-header-rentals .kh-rentals-mobile-top-row {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 0.75rem;
  }

  .kh-classifieds-header-rentals .kh-rentals-mobile-location-form {
    flex: 1 1 auto;
    margin: 0;
  }

  .kh-classifieds-header-rentals .kh-rentals-mobile-location-wrap {
    position: relative;
    width: 100%;
  }

  .kh-classifieds-header-rentals .kh-rentals-mobile-location-input {
    width: 100%;
    height: 46px;
    padding: 0 38px 0 12px;
    border: 1px solid rgba(0,0,0,0.14);
    border-radius: 12px;
    font-size: 0.95rem;
    background: #ffffff;
    box-sizing: border-box;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
  }

  .kh-classifieds-header-rentals .kh-rentals-mobile-location-input:focus {
    outline: none;
    border-color: rgba(0,0,0,0.28);
    box-shadow: 0 1px 0 rgba(0,0,0,0.04);
  }

  .kh-classifieds-header-rentals .kh-rentals-mobile-location-clear {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border: none;
    border-radius: 999px;
    background: rgba(0,0,0,0.04);
    font-size: 18px;
    line-height: 1;
    opacity: 0.7;
    cursor: pointer;
    display: none;
  }

  .kh-classifieds-header-rentals .kh-rentals-mobile-location-clear:hover {
    opacity: 1;
    background: rgba(0,0,0,0.07);
  }

  .kh-classifieds-header-rentals .kh-rentals-mobile-filters-btn {
    height: 46px;
    padding: 0 14px;
    border: 1px solid rgba(0,0,0,0.14);
    border-radius: 12px;
    background: #f7f7f8;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: border-color 0.15s ease, background 0.15s ease;
  }

  .kh-classifieds-header-rentals .kh-rentals-mobile-filters-btn:hover {
    border-color: rgba(0,0,0,0.24);
    background: #fafafa;
  }

  .kh-classifieds-header-rentals .kh-rentals-mobile-filters-btn .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
  }

  /* Quick actions row (Map view | Create alert) is useful on desktop too. */
  .kh-classifieds-header-rentals .kh-rentals-mobile-quick {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.65rem;
    padding-top: 0.15rem;
    border-top: 0;
  }

  .kh-classifieds-header-rentals .kh-rentals-mobile-quick-link {
    font-size: 0.85rem;
    font-weight: 650;
    color: #222;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 0.6rem;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,0.10);
    background: rgba(0,0,0,0.02);
    opacity: 0.95;
  }

  .kh-classifieds-header-rentals .kh-rentals-mobile-quick-link:hover {
    opacity: 1;
    background: rgba(0,0,0,0.04);
  }

  /* The separator is unnecessary once links are pill buttons */
  .kh-classifieds-header-rentals .kh-rentals-mobile-quick-sep {
    display: none;
  }
}

@media (max-width: 980px) {
  /* Hide the generic "Browse rentals" header on mobile and replace it with the rentals top bar */
  .kh-classifieds-header-rentals {
    display: none;
  }

  .kh-rentals-mobile-top {
    max-width: 1000px;
    margin: 0 auto 0.85rem;
    padding: 0.25rem 0.75rem 0.85rem;
    background: #fff;
    box-sizing: border-box;
  }

  .kh-rentals-mobile-top-label {
    font-size: 1.05rem;
    font-weight: 700;
    margin: 0.35rem 0 0.55rem;
    color: #222;
  }

  .kh-rentals-mobile-top-row {
    display: flex;
    align-items: stretch;
    gap: 0.65rem;
    flex-wrap: wrap;
  }

  /* When the bottom mobile menu is active, hide the top quick links (...)
     so mobile matches the classifieds experience (bottom nav only). */
  body.kh-bottom-actions-active .kh-rentals-mobile-quick {
    display: none !important;
  }

  /* On phones, let the results count breathe above the row */
  .kh-results-count {
    width: 100%;
    font-size: 0.9rem;
    color: #666;
    margin: 0 0 0.35rem;
  }

  .kh-rentals-mobile-location-form {
    flex: 1 1 auto;
    margin: 0;
  }

  .kh-rentals-mobile-location-wrap {
    position: relative;
    width: 100%;
  }

  .kh-rentals-mobile-location-input {
    width: 100%;
    height: 48px;
    padding: 0 44px 0 14px;
    border: 2px solid rgba(0,0,0,0.15);
    border-radius: 10px;
    font-size: 1rem;
    background: #fff;
    box-sizing: border-box;
  }

  .kh-rentals-mobile-location-input:focus {
    outline: none;
    border-color: rgba(0,0,0,0.35);
  }

  .kh-rentals-mobile-location-clear {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 999px;
    background: transparent;
    font-size: 22px;
    line-height: 1;
    opacity: 0.65;
    cursor: pointer;
    display: none;
  }

  .kh-rentals-mobile-location-clear:hover {
    opacity: 0.95;
  }

  .kh-rentals-mobile-filters-btn {
    height: 48px;
    padding: 0 14px;
    border: 2px solid rgba(0,0,0,0.15);
    border-radius: 10px;
    background: #fff;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
  }

  .kh-rentals-mobile-filters-btn:hover {
    border-color: rgba(0,0,0,0.3);
  }

  .kh-rentals-mobile-filters-btn .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
  }

  .kh-rentals-mobile-quick {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    margin-top: 0.65rem;
    padding-top: 0.55rem;
    border-top: 1px solid rgba(0,0,0,0.08);
  }

  .kh-rentals-mobile-quick-link {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    text-decoration: none;
    font-weight: 600;
    color: #222;
    padding: 0.35rem 0.1rem;
  }

  .kh-rentals-mobile-quick-link .dashicons {
    opacity: 0.8;
  }

  .kh-rentals-mobile-quick-sep {
    opacity: 0.35;
  }
}

/*
 * Mobile refinements for the rentals vertical
 *
 * The default classifieds layout is optimized for desktop first. On smaller
 * screens (phones and small tablets) the header and card grid need a
 * little help to breathe and feel more like a dedicated rentals app. These
 * rules adjust the grid to a single column, enlarge key typography and
 * restyle the filter actions so they resemble the modern “filter chips”
 * shown in the provided mock‑up. No markup changes are required – these
 * styles simply hook into the existing classes output by the plugin. Feel
 * free to tweak the breakpoints or values as needed.
 */
@media (max-width: 980px) {
  /* Stack grid items into a single column on narrow screens */
  .kh-listing-grid-rentals {
    grid-template-columns: 1fr;
  }
  /* Give rental thumbnails a consistent, taller aspect ratio */
  .kh-card-rental .kh-card-thumb img {
    height: 200px;
    object-fit: cover;
  }
  /* Increase the prominence of the price line */
  .kh-card-rental .kh-card-price {
    font-size: 1.3rem;
    line-height: 1.2;
  }
  /* Slightly bump up meta font sizes for readability */
  .kh-card-rental .kh-card-specs,
  .kh-card-rental .kh-card-location {
    font-size: 0.9rem;
  }
  /* Adjust classifieds header layout */
  .kh-classifieds-header-rentals {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }
  .kh-classifieds-header-rentals .kh-classifieds-title {
    font-size: 1.4rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
  }
  /* Style the filter toggle and clear link like buttons */
  .kh-classifieds-header-right {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    gap: 0.5rem;
    flex-wrap: wrap;
  }
  .kh-classifieds-header-right .kh-filter-toggle,
  .kh-classifieds-header-right .kh-filter-clear {
    padding: 0.5rem 1rem;
    border-radius: 8px;
    border: 1px solid #ddd;
    background: #f8f8f8;
    font-size: 0.9rem;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
  }
  .kh-classifieds-header-right .kh-filter-toggle:hover,
  .kh-classifieds-header-right .kh-filter-clear:hover {
    background: #f0f0f0;
  }
}
.kh-pagination a,
.kh-pagination span {
  display: inline-block;
  margin: 0 0.25rem;
  padding: 0.4rem 0.6rem;
  border: 1px solid #ddd;
  border-radius: 4px;
  text-decoration: none;
  color: #0073aa;
  font-size: 0.9rem;
}
.kh-pagination span.current {
  background: #0073aa;
  color: #fff;
  border-color: #0073aa;
}
.kh-pagination a:hover {
  background: #f0f0f0;
}

/* Action links */
.kh-actions {
  margin-top: 1rem;
}

/* Single listing */
.kh-single-listing .kh-single-thumb img {
  max-width: 100%;
  height: auto;
  margin-bottom: 1rem;
  border-radius: 4px;
}
.kh-meta-fields {
  list-style: none;
  padding: 0;
  margin: 0 0 1rem 0;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  font-size: 0.9rem;
  color: #333;
}
.kh-meta-fields li {
  margin: 0;
}
.kh-body {
  margin: 1rem 0;
  font-size: 1rem;
  line-height: 1.5;
  color: #333;
}

/* Message form */
.kh-message-form {
  background: #f9f9f9;
  padding: 1rem;
  border-radius: 4px;
  margin-top: 1.5rem;
}
.kh-message-form label {
  display: block;
  margin-bottom: 0.3rem;
  font-weight: bold;
}
.kh-message-form input[type="text"],
.kh-message-form textarea {
  width: 100%;
  padding: 0.5rem;
  border: 1px solid #ccc;
  border-radius: 4px;
  margin-bottom: 0.7rem;
}

/* Inbox */
.kh-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 1rem;
  font-size: 0.9rem;
}
.kh-table th,
.kh-table td {
  border: 1px solid #ddd;
  padding: 0.5rem;
}
.kh-message-body-row td {
  background: #fafafa;
}
.kh-message-body {
  white-space: pre-wrap;
  color: #555;
}

/* Notices */
.kh-notice {
  margin-top: 1rem;
  padding: 0.5rem 0.75rem;
  border-left: 4px solid #0073aa;
  background: #eef7fd;
  color: #00446b;
  border-radius: 4px;
}
.kh-success {
  border-color: #0a8a3a;
  background: #e6f4ea;
  color: #0a512b;
}

/* Buttons */
.kh-button {
  display: inline-block;
  background: #0073aa;
  color: #ffffff;
  padding: 0.5rem 1rem;
  border-radius: 4px;
  text-decoration: none;
  border: none;
  cursor: pointer;
  font-size: 0.9rem;
}
.kh-button:hover {
  background: #005f8d;
}
.kh-link {
  text-decoration: underline;
  color: #0073aa;
  font-size: 0.9rem;
}
.kh-link:hover {
  color: #005f8d;
}
/* Toolbar layout */
.kh-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-bottom: 1rem;
  align-items: flex-end;
  border-bottom: 1px solid #eee;
  padding-bottom: 0.75rem;
}
.kh-toolbar-group {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 140px;
}
.kh-toolbar-group--compact .kh-toolbar-range {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
.kh-toolbar-search {
  flex: 1 1 220px;
}
.kh-toolbar-label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #777;
}
.kh-icon {
  font-size: 16px;
  color: #555;
}
.kh-toolbar-group .kh-icon {
  display: inline-flex;
  align-items: center;
}
.kh-toolbar-actions {
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}
.kh-range-sep {
  font-size: 0.85rem;
  color: #999;
}

/* Hide mobile bottom actions bar on desktop */
.kh-bottom-actions-bar {
  display: none;
}

/* Rentals vertical: hidden sidebar markup used as a source for the mobile
 * bottom navigation buttons. Keep it in the DOM for JS, but never show it. */
.kh-mobile-nav-source {
  display: none !important;
}

@media (max-width: 980px) {
  .kh-toolbar {
    flex-direction: column;
    align-items: stretch;
  }
  .kh-toolbar-group,
  .kh-toolbar-actions {
    width: 100%;
  }
}

/* Danger button for delete */
.kh-button--danger {
  background: #c0392b;
}
.kh-button--danger:hover {
  background: #992d22;
}

/* My listings table */
.kh-table-mylistings td,
.kh-table-mylistings th {
  vertical-align: middle;
}

/* === Rentals filter enhancements === */
/* Header on single listings for filter button and clear link */
.kh-single-filters-header {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1rem;
}
.kh-single-filters-header .kh-filter-clear {
  font-size: 0.9rem;
  color: #2563eb;
  text-decoration: none;
}
.kh-single-filters-header .kh-filter-clear:hover {
  text-decoration: underline;
}

/* Adjust the rentals filter modal to look more polished and structured */
/*
 * Adjust the rentals filter modal to use a wider two‑column layout.
 * The previous styling stacked all filter controls vertically which
 * resulted in a very tall modal. We switch to a responsive grid
 * layout so that controls are split across two columns on larger
 * screens, while still stacking on narrow viewports. This helps
 * reduce scrolling and aligns the rentals experience with the
 * personals vertical.
 */
#kh-rentals-filter-modal .kh-modal-dialog {
  /* increase the dialog width to accommodate two columns */
  max-width: 840px;
}
#kh-rentals-filter-modal .kh-modal-body {
  padding: 1rem;
}
#kh-rentals-filter-modal .kh-toolbar {
  /* The rentals toolbar outputs a <form> as its only direct child. */
  border-bottom: none;
  padding-bottom: 0;
}

/* Two clear sides: left (search/location) + right (details) */
#kh-rentals-filter-modal .kh-search-form {
  margin: 0;
}

#kh-rentals-filter-modal .kh-rentals-filter-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
}

#kh-rentals-filter-modal .kh-rentals-filter-col {
  min-width: 0;
}

#kh-rentals-filter-modal .kh-rentals-filter-col--right {
  border-left: 1px solid #e5e7eb;
  padding-left: 1rem;
}
#kh-rentals-filter-modal .kh-toolbar-group,
#kh-rentals-filter-modal .kh-toolbar-actions {
  width: 100%;
}
#kh-rentals-filter-modal .kh-toolbar-group {
  /* remove individual borders and extra spacing between groups */
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}
#kh-rentals-filter-modal .kh-toolbar-group:last-of-type {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}
#kh-rentals-filter-modal .kh-toolbar-range,
#kh-rentals-filter-modal .kh-toolbar-checkbox-group,
#kh-rentals-filter-modal .kh-toolbar-search,
#kh-rentals-filter-modal .kh-toolbar-location {
  width: 100%;
}
#kh-rentals-filter-modal .kh-filter-input,
#kh-rentals-filter-modal .kh-search-input,
#kh-rentals-filter-modal .kh-filter-select,
#kh-rentals-filter-modal .kh-toolbar-location input {
  width: 100%;
}
#kh-rentals-filter-modal .kh-toolbar-location input {
  margin-bottom: 0.5rem;
}
#kh-rentals-filter-modal .kh-toolbar-location input:last-child {
  margin-bottom: 0;
}
#kh-rentals-filter-modal .kh-modal-actions {
  padding: 1rem;
  text-align: right;
}
#kh-rentals-filter-modal .kh-modal-actions .kh-button {
  margin-right: 0.5rem;
}

/* Responsive fallback: on narrow screens collapse the two columns into
 * a single column and remove the fixed max‑width so the modal fills
 * the viewport. This prevents horizontal scrolling on mobile. */
@media (max-width: 980px) {
  #kh-rentals-filter-modal .kh-modal-dialog {
    max-width: 100%;
    margin-left: 1rem;
    margin-right: 1rem;
  }
  #kh-rentals-filter-modal .kh-rentals-filter-split {
    grid-template-columns: 1fr;
  }
  #kh-rentals-filter-modal .kh-rentals-filter-col--right {
    border-left: none;
    padding-left: 0;
  }
}

/* ------------------------------------------------------------------
 * Mobile enhancements for rentals and personals
 *
 * The modifications to the rentals filter modal introduced wider
 * layouts and additional structure which sometimes overlapped the
 * mobile navigation bar and obscured the floating filter toggle on
 * very small screens. The following rules explicitly reserve space
 * for the mobile navigation by adding bottom padding to the main
 * content wrapper and raising the z‑index of the floating toggle
 * group so that it always sits above other elements.
 */
@media (max-width: 900px) {
  /* Add bottom padding to the main classifieds area so the fixed
   * footer/navigation on mobile devices isn’t overlapped by content
   */
  .kh-main {
    padding-bottom: 4rem;
  }
  /* Increase z-index of the floating toggle group (sidebar and
   * filters) so it appears above any other fixed elements, such as
   * mobile nav bars injected by the parent theme.
   */
  .kh-floating-toggle-group {
    z-index: 20002;
  }
}

/* Constrain the height of the rentals filter dialog on small screens
 * to avoid covering the mobile navigation bar. By setting a maximum
 * height relative to the viewport minus a small offset, the modal
 * becomes scrollable if its contents exceed the available space. */
@media (max-width: 980px) {
  #kh-rentals-filter-modal .kh-modal-dialog {
    max-height: calc(100vh - 4rem);
    overflow-y: auto;
  }
}

/* ------------------------------------------------------------------
 * New listing form styling
 *
 * The default WordPress form markup used for creating new listings is
 * very bare‑bones. These styles wrap the form in a card and apply
 * consistent padding, borders and shadows so posting a rental listing
 * feels like a polished experience. Inputs, selects and textareas are
 * unified with a subtle border radius, background and font sizing.
 */
.kh-new-listing {
  background: #ffffff;
  border-radius: 1rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  padding: 1.5rem;
  margin-top: 1rem;
}

/* Ensure headings inside the new listing wrapper stand apart */
.kh-new-listing h2 {
  margin-top: 0;
  margin-bottom: 1rem;
  font-size: 1.5rem;
  color: #0f172a;
}

/* Spacing between field groups */
.kh-new-listing-form p {
  margin-bottom: 1rem;
}

/* Styled inputs, selects and textareas */
.kh-new-listing-form input[type="text"],
.kh-new-listing-form input[type="number"],
.kh-new-listing-form input[type="url"],
.kh-new-listing-form input[type="file"],
.kh-new-listing-form select,
.kh-new-listing-form textarea {
  width: 100%;
  padding: 0.5rem 0.6rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  font-size: 0.95rem;
  color: #1f2937;
  background: #ffffff;
  box-sizing: border-box;
}

/* Inputs focus state for accessibility */
.kh-new-listing-form input[type="text"]:focus,
.kh-new-listing-form input[type="number"]:focus,
.kh-new-listing-form input[type="url"]:focus,
.kh-new-listing-form input[type="file"]:focus,
.kh-new-listing-form select:focus,
.kh-new-listing-form textarea:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.25);
}

/* Labels above inputs */
.kh-new-listing-form label {
  display: block;
  font-weight: 600;
  margin-bottom: 0.4rem;
  color: #374151;
}

/* Helper text for location fields */
.kh-location-help {
  display: block;
  font-size: 0.75rem;
  color: #6b7280;
  margin-bottom: 0.3rem;
}

/* Mobile: My Listings as cards */
@media (max-width: 980px) {
  .kh-table-mylistings,
  .kh-table-mylistings thead,
  .kh-table-mylistings tbody,
  .kh-table-mylistings th,
  .kh-table-mylistings td,
  .kh-table-mylistings tr {
    display: block;
    width: 100%;
  }

  .kh-table-mylistings thead {
    display: none;
  }

  .kh-table-mylistings tbody tr {
    margin-bottom: 0.9rem;
    padding: 0.85rem 1rem;
    background: #ffffff;
    border-radius: 14px;
    border: 1px solid #eeeeee;
    box-shadow: 0 3px 10px rgba(0,0,0,0.04);
  }

  .kh-table-mylistings tbody td {
    display: block;
    border: none !important;
    padding: 0.2rem 0 !important;
    font-size: 0.9rem;
    line-height: 1.35;
    word-break: break-word;
  }

  /* Title row: emphasize */
  .kh-table-mylistings tbody td:nth-child(1) {
    font-weight: 600;
    margin-bottom: 0.15rem;
  }

  /* Label chips for other rows */
  .kh-table-mylistings tbody td:nth-child(2)::before,
  .kh-table-mylistings tbody td:nth-child(3)::before,
  .kh-table-mylistings tbody td:nth-child(4)::before {
    display: inline-block;
    min-width: 4.4rem;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #6b7280;
    margin-right: 0.45rem;
  }

  .kh-table-mylistings tbody td:nth-child(2)::before {
    content: 'Status';
  }
  .kh-table-mylistings tbody td:nth-child(3)::before {
    content: 'Created';
  }
  .kh-table-mylistings tbody td:nth-child(4)::before {
    content: 'Actions';
  }

  /* Actions: keep buttons tidy */
  .kh-table-mylistings tbody td:last-child a,
  .kh-table-mylistings tbody td:last-child button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.4rem 0.6rem;
    border-radius: 8px;
    margin-right: 0.25rem;
    margin-top: 0.15rem;
  }
}


/* Layout with sidebar */
.kh-layout {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 1.1rem;
}

/* Full-width pages without the legacy sidebar column (rentals app view). */
.kh-layout.kh-layout--no-sidebar {
  grid-template-columns: 1fr;
}
.kh-layout.kh-layout--no-sidebar .kh-sidebar-column,
.kh-layout.kh-layout--no-sidebar .kh-sidebar {
  display: none;
}
.kh-sidebar {
  background: #f8f9fb;
  border-radius: 8px;
  padding: 1rem;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.kh-sidebar-title {
  margin-top: 0;
  font-size: 1rem;
  display: flex;
  align-items: center;
  gap: 0.35rem;
}
.kh-sidebar-title .dashicons {
  font-size: 18px;
}
.kh-menu {
  list-style: none;
  padding-left: 0;
  margin: 0.75rem 0 0;
}
.kh-menu li {
  margin-bottom: 0.4rem;
}
.kh-menu a {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  text-decoration: none;
  color: #333;
  font-size: 0.9rem;
  padding: 0.35rem 0.4rem;
  border-radius: 4px;
}
.kh-menu a .dashicons {
  font-size: 16px;
}
.kh-menu a:hover {
  background: #e5f1fb;
  color: #005f8d;
}
.kh-main {
  min-width: 0;
}

/* Stack layout on mobile */
@media (max-width: 980px) {
  .kh-layout {
    grid-template-columns: 1fr;
  }
}

/* Sidebar column containing Quick Actions and filter box */
.kh-sidebar-column {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
/* Filter box styling */
.kh-filter-box {
  background: #f8f9fb;
  border-radius: 8px;
  padding: 1rem;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.kh-filter-heading {
  margin-top: 0;
  margin-bottom: 0.35rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: #333;
}
/* Category pill list */
.kh-category-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-bottom: 0.75rem;
}
.kh-category-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.35rem 0.6rem;
  font-size: 0.8rem;
  border-radius: 999px;
  text-decoration: none;
  background: #eef2f7;
  color: #333;
  border: 1px solid #dce4ef;
  transition: background 0.15s, color 0.15s;
}
.kh-category-pill:hover {
  background: #e5f1fb;
  color: #005f8d;
}
.kh-category-pill.is-active {
  background: #0073aa;
  color: #fff;
  border-color: #0073aa;
}
/* Filter form styles */
.kh-filter-form {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.kh-filter-label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #777;
}
.kh-filter-input,
.kh-filter-select {
  width: 100%;
  padding: 0.45rem;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 0.85rem;
}
.kh-filter-range {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}
.kh-filter-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-top: 0.5rem;
}

/* Search bar at top of listings */
.kh-search-bar {
  margin-bottom: 1rem;
}
.kh-search-bar-inner {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.kh-search-submit {
  padding: 0.45rem 0.65rem;
}

/* Listing list styles */
.kh-listing-list {
  margin-top: 0.5rem;
}
.kh-listing-date-header {
  margin-top: 0.85rem;
  margin-bottom: 0.5rem;
}
.kh-listing-date-header span {
  display: inline-block;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
  padding: 0.25rem 0.75rem;
  background: linear-gradient(90deg, #f8f9fb 0%, #e5f1fb 50%, #ffffff 100%);
  border-radius: 999px;
  color: #374151;
}
.kh-listing-date-divider {
  height: 1px;
  background: #e5e7eb;
  margin: 0.5rem 0;
}
.kh-listing-row {
  border-bottom: 1px solid #e5e7eb;
  padding: 0.45rem 0;
}
.kh-listing-line {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.75rem;
  font-size: 0.9rem;
}
.kh-listing-line-title {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.kh-listing-line-title a {
  color: #0073aa;
  text-decoration: none;
}
.kh-listing-line-title a:hover {
  text-decoration: underline;
}
.kh-listing-line-meta {
  flex-shrink: 0;
  font-size: 0.8rem;
  color: #555;
  white-space: nowrap;
}

/* Layout with sidebar */
.kh-layout {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 1.1rem;
}
.kh-sidebar {
  background: #f8f9fb;
  border-radius: 8px;
  padding: 1rem;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.kh-sidebar-title {
  margin-top: 0;
  font-size: 1rem;
  display: flex;
  align-items: center;
  gap: 0.35rem;
}
.kh-sidebar-title .dashicons {
  font-size: 18px;
}
.kh-menu {
  list-style: none;
  padding-left: 0;
  margin: 0.75rem 0 0;
}
.kh-menu li {
  margin-bottom: 0.4rem;
}
.kh-menu a {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  text-decoration: none;
  color: #333;
  font-size: 0.9rem;
  padding: 0.35rem 0.4rem;
  border-radius: 4px;
}
.kh-menu a .dashicons {
  font-size: 16px;
}
.kh-menu a:hover {
  background: #e5f1fb;
  color: #005f8d;
}
.kh-main {
  min-width: 0;
}

/* Stack layout on mobile */
@media (max-width: 980px) {
  .kh-layout {
    grid-template-columns: 1fr;
  }
}

/* Toast notification */
.kh-toast {
  position: fixed;
  right: 1.25rem;
  bottom: 1.25rem;
  z-index: 9999;
  padding: 0.75rem 1rem;
  border-radius: 6px;
  font-size: 0.9rem;
  box-shadow: 0 8px 20px rgba(0,0,0,0.18);
  color: #064e3b;
  background: #d1fae5;
  border: 1px solid #6ee7b7;
}
.kh-toast--success {
  /* same palette for now; modifier exists for future variants */
}

/* Optional: unread rows could be bolded later */
.kh-table .kh-message-body-row {
  display: none;
}


/* Conversation view in reply screen */
.kh-conversation {
  margin: 1rem 0 1.25rem;
  padding: 0.75rem 0;
  border-top: 1px solid #e5e7eb;
  border-bottom: 1px solid #e5e7eb;
}
.kh-conversation-heading {
  margin: 0 0 0.5rem;
  font-size: 0.9rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #6b7280;
}
.kh-conversation-empty {
  margin: 0.25rem 0 0;
  font-size: 0.9rem;
  color: #6b7280;
}
.kh-msg-bubble {
  max-width: 640px;
  padding: 0.5rem 0.75rem;
  border-radius: 8px;
  margin-bottom: 0.35rem;
  font-size: 0.9rem;
}
.kh-msg-bubble--me {
  margin-left: auto;
  background: #e0f2fe;
}
.kh-msg-bubble--them {
  margin-right: auto;
  background: #f3f4f6;
}
.kh-msg-meta {
  font-size: 0.75rem;
  color: #6b7280;
  margin-bottom: 0.25rem;
}
.kh-msg-body p {
  margin: 0;
}
.kh-msg-body p + p {
  margin-top: 0.35rem;
}


/* Inbox table responsive styles */
.kh-inbox-table {
  width: 100%;
  border-collapse: collapse;
}

.kh-inbox-table th,
.kh-inbox-table td {
  vertical-align: middle;
}

/* Mobile: show inbox rows as cards */
@media (max-width: 980px) {
  .kh-inbox-table,
  .kh-inbox-table thead,
  .kh-inbox-table tbody,
  .kh-inbox-table th,
  .kh-inbox-table td,
  .kh-inbox-table tr {
    display: block;
    width: 100%;
  }

  .kh-inbox-table thead {
    display: none;
  }

  .kh-inbox-row {
    margin-bottom: 0.75rem;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0 2px 6px rgba(0,0,0,0.03);
  }

  .kh-inbox-table td {
    padding: 0.55rem 0.9rem;
    border: none;
    border-bottom: 1px solid #f3f4f6;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.9rem;
    white-space: normal;
  }

  .kh-inbox-table td:last-child {
    border-bottom: none;
  }

  .kh-inbox-table td::before {
    content: attr(data-label);
    font-weight: 600;
    margin-right: 0.75rem;
    flex: 0 0 40%;
    max-width: 45%;
    color: #4b5563;
  }

  .kh-actions-cell.kh-inbox-actions {
    flex-direction: column;
    flex-wrap: wrap;
    gap: 0.35rem;
    justify-content: flex-start;
  }

  .kh-actions-cell.kh-inbox-actions .kh-button--icon,
  .kh-actions-cell.kh-inbox-actions a.kh-button--icon {
    padding: 0.35rem 0.5rem;
    font-size: 0.85rem;
  }
}
/* ClassiCore Classifieds – Simplified Inbox mobile layout */
@media (max-width: 980px) {

  /* Base table */
  .kh-inbox-table {
    width: 100%;
    border-collapse: collapse;
  }

  /* Hide header on mobile */
  .kh-inbox-table thead {
    display: none;
  }

  /* Each row becomes a simple card */
  .kh-inbox-table tbody tr {
    display: block;
    padding: 0.9rem 1rem;
    margin-bottom: 0.9rem;
    background: #ffffff;
    border-radius: 14px;
    border: 1px solid #eeeeee;
    box-shadow: 0 3px 10px rgba(0,0,0,0.04);
  }

  /* Reset cells */
  .kh-inbox-table tbody td {
    display: block;
    border: none !important;
    padding: 0.15rem 0 !important;
    font-size: 0.9rem;
    line-height: 1.35;
    word-break: break-word;
  }

  /* HIDE Date column on mobile (1st column) */
  .kh-inbox-table tbody td:nth-child(1) {
    display: none;
  }

  /* HIDE Listing column on mobile (4th column) */
  .kh-inbox-table tbody td:nth-child(4) {
    display: none;
  }

  /* From */
  .kh-inbox-table tbody td:nth-child(2)::before {
    content: "From: ";
    font-weight: 600;
    color: #777;
    margin-right: 4px;
  }

  /* Subject */
  .kh-inbox-table tbody td:nth-child(3) {
    margin-top: 0.2rem;
  }
  .kh-inbox-table tbody td:nth-child(3)::before {
    content: "Subject: ";
    font-weight: 600;
    color: #777;
    margin-right: 4px;
  }

  /* Actions – buttons aligned to the right */
  .kh-inbox-table tbody td:last-child {
    margin-top: 0.5rem;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
  }

  .kh-inbox-table tbody td:last-child a,
  .kh-inbox-table tbody td:last-child button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.45rem 0.55rem;
    border-radius: 8px;
  }
}


/* ===== ClassiCore classifieds header + footer shell ===== */
.kh-classifieds-header {
  max-width: 1000px;
  margin: 0 auto 1rem;
  padding: 0.75rem 1rem 0.85rem;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  box-sizing: border-box;
}

.kh-classifieds-header-left {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.kh-app-badge {
  display: inline-block;
  padding: 0.1rem 0.5rem;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.1);
  font-size: 0.65rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #555;
}

.kh-classifieds-title {
  margin: 0;
  font-size: 1.25rem;
}

.kh-classifieds-subtitle {
  margin: 0;
  font-size: 0.8rem;
  color: #666;
}

/* Footer branding */
.kh-classifieds-footer {
  max-width: 1000px;
  margin: 1.25rem auto 0;
  padding: 0.75rem 1rem;
  border-top: 1px solid rgba(0,0,0,0.06);
  font-size: 0.78rem;
  text-align: center;
  box-sizing: border-box;
}

.kh-footer-main {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  opacity: 0.85;
}

.kh-footer-logo {
  font-weight: 600;
}

.kh-footer-divider {
  opacity: 0.5;
}

.kh-footer-text strong {
  font-weight: 600;
}

/* ===== Accordion styling for filters ===== */
.kh-filter-box {
  margin-top: 1rem;
}

.kh-accordion-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.5rem 0.65rem;
  margin-bottom: 0.25rem;
  border-radius: 6px;
  border: 1px solid rgba(0,0,0,0.08);
  background: #f7f8fa;
  cursor: pointer;
  font-size: 0.9rem;
  font-weight: 500;
  text-align: left;
  transition: background 0.2s ease, box-shadow 0.2s ease;
}

.kh-accordion-toggle:hover {
  background: #f0f2f6;
  box-shadow: 0 2px 6px rgba(0,0,0,0.04);
}

.kh-accordion-label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.kh-accordion-arrow {
  font-size: 0.8rem;
  transition: transform 0.2s ease;
}

/* Accordion content: default open via .is-open */
.kh-accordion-content {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: max-height 0.25s ease, opacity 0.2s ease;
}

.kh-accordion-content.is-open {
  max-height: 2000px;
  opacity: 1;
  margin-top: 0.35rem;
}

.kh-accordion-toggle.is-open .kh-accordion-arrow {
  transform: rotate(180deg);
}

/* Keep inner spacing tidy */
.kh-accordion-content .kh-filter-form,
.kh-accordion-content .kh-category-pills,
.kh-accordion-content .kh-filter-heading {
  margin-top: 0.25rem;
}

/* Responsive adjustments */
@media (max-width: 980px) {
  .kh-classifieds-header {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 980px){
  .kh-table-mylistings tbody td:nth-child(2){display:none !important;}
}

/* Mobile: My Listings button alignment fix */
@media (max-width: 980px){
  .kh-table-mylistings tbody td:last-child{
    display:flex !important;
    flex-direction:row !important;
    justify-content:space-between;
    gap:0.5rem;
  }
  .kh-table-mylistings tbody td:last-child a,
  .kh-table-mylistings tbody td:last-child button{
    flex:1 1 auto !important;
    text-align:center;
    width:100%;
  }
}

/* Mobile fix v30: My Listings buttons normal size */
@media (max-width: 980px){
  .kh-table-mylistings tbody td:last-child{
    display:flex !important;
    flex-direction:row !important;
    justify-content:flex-start;
    gap:0.5rem;
  }
  .kh-table-mylistings tbody td:last-child a,
  .kh-table-mylistings tbody td:last-child button{
    flex:0 0 auto !important;
    width:auto !important;
    padding:0.45rem 0.75rem !important;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    white-space:nowrap;
  }
}


/* Admin footer + settings link */
.kh-admin-footer {
  margin-top: 1.5rem;
  padding-top: 0.75rem;
  border-top: 1px solid #e5e7eb;
  display: flex;
  justify-content: flex-end;
}
.kh-admin-link {
  font-size: 0.8rem;
  color: #6b7280;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}
.kh-admin-link:hover {
  color: #111827;
  text-decoration: underline;
}
.kh-admin-settings h2 {
  margin-top: 0;
}


/* Submission / moderation banners */
.kh-banner {
  margin-bottom: 1rem;
  padding: 0.75rem 1rem;
  border-radius: 6px;
  font-size: 0.95rem;
}
.kh-banner-info {
  background: #fee2e2;
  color: #b91c1c;
  border: 1px solid #fecaca;
}
.kh-banner-success {
  background: #dcfce7;
  color: #166534;
  border: 1px solid #bbf7d0;
}


/* Highlight pending listings in admin pending table */
.kh-admin-pending-table tbody tr {
  background-color: #fef9c3;
  border-left: 4px solid #facc15;
}


/* Presence indicator on listing lines */
.kh-listing-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.25rem 0.75rem;
}

.kh-listing-line-title,
.kh-listing-line-meta {
  display: inline-block;
}

.kh-listing-line-presence {
  margin-left: auto;
  font-size: 0.8rem;
  font-weight: 600;
}

.kh-listing-line-presence.kh-online {
  color: #16a34a;
}

.kh-listing-line-presence.kh-last-seen {
  color: #6b7280;
}


/* Presence pill on single listing */
.kh-single-presence {
  margin-top: 0.25rem;
  margin-bottom: 0.75rem;
  font-size: 0.9rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}

.kh-meta-author {
  font-weight: 500;
}

.kh-presence-pill {
  display: inline-block;
  padding: 0.15rem 0.4rem;
  border-radius: 999px;
  font-size: 0.78rem;
  border: 1px solid transparent;
}

.kh-online-pill {
  background-color: #dcfce7;
  color: #166534;
  border-color: #bbf7d0;
}

.kh-last-seen-pill {
  background-color: #f3f4f6;
  color: #4b5563;
  border-color: #e5e7eb;
}

/* Verified active badge */
.kh-verified-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: #0f766e;
}

.kh-verified-badge::before {
  content: '★';
  font-size: 0.75rem;
}

/* Inbox presence */
.kh-inbox-presence {
  font-size: 0.8rem;
}

.kh-inbox-online {
  color: #16a34a;
}


/* Conversation header presence */
.kh-conversation-with {
  margin-bottom: 0.35rem;
}

.kh-chat-user {
  font-weight: 500;
}

.kh-chat-user--online {
  color: #16a34a;
}

.kh-online-dot {
  display: inline-block;
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 999px;
  margin-right: 0.35rem;
  background-color: #22c55e;
  box-shadow: 0 0 0 2px rgba(34,197,94,0.35);
  vertical-align: middle;
}

.kh-chat-lastseen {
  font-size: 0.8rem;
  color: #6b7280;
}


/* Inbox table alignment tweaks */
.kh-inbox table {
  width: 100%;
  border-collapse: collapse;
}

.kh-inbox th,
.kh-inbox td {
  vertical-align: middle;
}

.kh-inbox-actions {
  text-align: center;
  white-space: nowrap;
}

.kh-inbox-actions {
  min-width: 164px;
}

.kh-inbox-action-group {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  flex-wrap: nowrap;
}

.kh-inbox-delete-form {
  margin: 0;
}

.kh-inbox-delete-form .kh-inbox-action-btn {
  appearance: none;
}

.kh-inbox-action-btn,
.kh-inbox-action-group .kh-button.kh-inbox-action-btn,
.kh-inbox-action-group .kh-block-user-btn--inbox.kh-inbox-action-btn {
  width: 42px;
  height: 42px;
  min-width: 42px;
  min-height: 42px;
  padding: 0;
  border-radius: 10px;
  border: 1px solid rgba(15, 23, 42, 0.14);
  background: #ffffff;
  color: #0f172a;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
  text-decoration: none;
  transition: background-color 0.14s ease, border-color 0.14s ease, color 0.14s ease, box-shadow 0.14s ease;
}

.kh-inbox-action-btn:hover,
.kh-inbox-action-btn:focus {
  background: #f8fafc;
  color: #0f172a;
  border-color: rgba(15, 23, 42, 0.2);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12);
  outline: none;
}

.kh-inbox-action-btn .dashicons,
.kh-inbox-action-btn .kh-block-user-icon {
  font-size: 18px;
  line-height: 1;
  width: 18px;
  height: 18px;
}

.kh-inbox-action-btn--open {
  background: #0073aa !important;
  border-color: #0073aa !important;
  color: #ffffff !important;
}

.kh-inbox-action-btn--open:hover,
.kh-inbox-action-btn--open:focus {
  background: #005f8d !important;
  border-color: #005f8d !important;
  color: #ffffff !important;
}

.kh-inbox-action-btn--delete {
  color: #b91c1c;
}

.kh-inbox-action-btn--delete:hover,
.kh-inbox-action-btn--delete:focus {
  background: #fef2f2;
  border-color: rgba(220, 38, 38, 0.3);
  color: #991b1b;
}

.kh-block-user-btn--inbox.kh-inbox-action-btn {
  cursor: pointer;
}

.kh-block-user-btn--inbox.kh-inbox-action-btn:hover,
.kh-block-user-btn--inbox.kh-inbox-action-btn:focus {
  background: #f8fafc;
}

.kh-block-user-btn--inbox.kh-inbox-action-btn.kh-blocked-active,
.kh-inbox-action-btn--unblock {
  background: #fee2e2;
  border-color: rgba(220, 38, 38, 0.28);
  color: #b91c1c;
}

.kh-block-user-btn--inbox.kh-inbox-action-btn.kh-blocked-active:hover,
.kh-block-user-btn--inbox.kh-inbox-action-btn.kh-blocked-active:focus,
.kh-inbox-action-btn--unblock:hover,
.kh-inbox-action-btn--unblock:focus {
  background: #fecaca;
  border-color: rgba(220, 38, 38, 0.36);
  color: #991b1b;
}

@media (max-width: 980px) {
  .kh-inbox-actions {
    min-width: 0;
  }

  .kh-inbox-action-group {
    justify-content: flex-end;
  }
}

/* Locked single-listing image placeholder for free-tier viewers */
.kh-single-image-locked {
  position: relative;
  border-radius: 8px;
  overflow: hidden;
  background: #e5e5e5;
  padding: 40px 20px;
  text-align: center;
  margin-bottom: 1.5rem;
}

.kh-single-image-locked::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.5) 0,
    rgba(255, 255, 255, 0.5) 8px,
    rgba(220, 220, 220, 0.5) 8px,
    rgba(220, 220, 220, 0.5) 16px
  );
  filter: blur(3px);
}

.kh-single-image-locked-inner {
  position: relative;
  z-index: 1;
}

.kh-single-image-locked-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 999px;
  margin: 0 auto 10px;
  font-size: 24px;
  background: rgba(0, 0, 0, 0.06);
}

.kh-single-image-locked-inner p {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 500;
}


/* Icon for listings that have attached media (image or video). */
.kh-listing-line-media-icon {
  display: inline-block;
  margin-right: 0.35rem;
  font-size: 0.9em;
  vertical-align: text-bottom;
}



/* === Filters header + modal (DoubleList-style) ======================= */

.kh-classifieds-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.9rem 1.1rem;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
  margin-bottom: 1rem;
}

.kh-classifieds-title {
  font-size: 1.05rem;
  font-weight: 600;
}

.kh-classifieds-subtitle {
  margin-top: 0.15rem;
  font-size: 0.85rem;
  color: #6b7280;
}

.kh-classifieds-header-right {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.kh-filter-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.45rem 0.9rem;
  border-radius: 999px;
  border: none;
  font-size: 0.85rem;
  font-weight: 500;
  background: #2563eb;
  color: #ffffff;
  cursor: pointer;
}

.kh-filter-toggle .dashicons {
  font-size: 16px;
}

.kh-filter-toggle:hover {
  background: #1d4ed8;
}

/* Modal shell */
.kh-filter-modal {
  position: fixed;
  inset: 0;
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding-top: 20vh;
  padding-bottom: 4vh;
  z-index: 9999;
}

.kh-filter-modal.is-open {
  display: flex;
}

.kh-filter-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
}

.kh-filter-modal-panel {
  position: relative;
  z-index: 1;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.32);
  padding: 1rem 1.2rem 0.9rem;
  max-width: 840px;
  width: calc(100% - 2.5rem);
  max-height: 80vh;
  overflow-y: auto;
}

/* Modal header */
.kh-filter-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}

.kh-filter-modal-title {
  margin: 0;
  font-size: 0.95rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #6b7280;
}

.kh-filter-close {
  border: none;
  background: transparent;
  font-size: 1.4rem;
  line-height: 1;
  cursor: pointer;
  color: #9ca3af;
}

.kh-filter-close:hover {
  color: #4b5563;
}

/* Modal body + sections */
.kh-filter-modal-body {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.kh-filter-section {
  width: 100%;
}

.kh-filter-section + .kh-filter-section {
  border-top: 1px solid #e5e7eb;
  padding-top: 0.75rem;
}

.kh-filter-section-title {
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #9ca3af;
  margin-bottom: 0.35rem;
}

/* Grid of fields */

.kh-filter-grid {
  width: 100%;
}

/* New filter layout inspired by DoubleList: two-column card with advanced filters on the left
   and basic filters on the right, separated by a subtle divider. */
.kh-filter-layout-row {
  display: flex;
  align-items: flex-start;
  gap: 1.1rem;
}

.kh-filter-layout-col {
  flex: 1 1 0;
}

.kh-filter-layout-col-advanced {
  max-width: 340px;
}

.kh-filter-layout-col-basic {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem 1rem;
}

.kh-filter-layout-divider {
  width: 1px;
  background-color: #e5e7eb;
  align-self: stretch;
}

/* Label row with optional lock icon */
.kh-filter-label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.kh-filter-lock {
  font-size: 0.9rem;
  color: #9ca3af;
}

/* Make ranges sit neatly on one line */
.kh-filter-field-range .kh-filter-range {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

/* Responsive: stack columns on smaller screens */
@media (max-width: 980px) {
  .kh-filter-layout-row {
    flex-direction: column;
    gap: 1rem;
  }

  .kh-filter-layout-divider {
    display: none;
  }

  .kh-filter-layout-col-basic {
    grid-template-columns: 1fr;
  }

  .kh-filter-layout-col-advanced {
    max-width: 100%;
  }
}
}

.kh-filter-field-range .kh-filter-range {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

/* Actions row */
.kh-filter-actions-inline {
  margin-top: 1rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
}

.kh-button.kh-button-primary {
  background: #2563eb;
  color: #ffffff;
  border: none;
}

.kh-button.kh-button-primary:hover {
  background: #1d4ed8;
}

.kh-link-reset {
  font-size: 0.85rem;
  color: #2563eb;
  text-decoration: none;
}

.kh-link-reset:hover {
  text-decoration: underline;
}

/* Responsive tweaks */
@media (max-width: 900px) {
  .kh-filter-modal-panel {
    max-width: 100%;
    width: calc(100% - 1.5rem);
    padding: 1.25rem 1.1rem 1.1rem;
  }

  .kh-filter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .kh-classifieds-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.65rem;
  }
  .kh-classifieds-header-right {
    align-self: stretch;
    justify-content: flex-start;
  }
  .kh-filter-grid {
    grid-template-columns: 1fr;
  }
}


/* Mobile adjustments for filters modal */
@media (max-width: 980px) {
  .kh-filter-modal {
    align-items: flex-start;
    justify-content: center;
    padding: 0 0.5rem;
    overflow-y: auto;
  }
  .kh-filter-modal-panel {
    width: 100%;
    max-width: 100%;
    border-radius: 1rem 1rem 0 0;
    box-shadow: none;
    min-height: calc(100vh - 3.5rem);
    margin-top: 3.5rem;
    padding: 1.25rem 1rem calc(env(safe-area-inset-bottom) + 5rem);
  }
  .kh-filter-modal-body {
    max-height: none;
  }
  .kh-filter-actions-inline {
    margin-top: 1.25rem;
  }
}


/* Age slider UI inside advanced filters */
.kh-filter-age-slider {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.kh-filter-age-slider-track {
  display: flex;
  gap: 0.5rem;
}

.kh-age-slider {
  flex: 1 1 auto;
}

.kh-filter-age-slider-labels {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.875rem;
  color: #4b5563;
}

.kh-age-label {
  font-weight: 500;
}


/* Location select styling */
.kh-location-select,
.kh-filter-field-location .kh-filter-select,
.kh-location-input,
.kh-filter-field-location .kh-location-input {
  width: 100%;
  margin-bottom: 4px;
}
.kh-location-help {
  font-size: 12px;
  color: #777;
}


/* Mobile + tablet layout tweaks for listing rows: show full title above meta/info */
@media (max-width: 1024px) {
  .kh-listing-line {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
  }

  .kh-listing-line-title {
    white-space: normal;
    overflow: visible;
    text-overflow: initial;
  }

  .kh-listing-line-meta {
    white-space: normal;
  }

  .kh-listing-line-presence {
    margin-left: 0;
  }
}

/* Enhanced visual separation & accents for the classifieds layout */
.kh-layout {
  padding: 1.5rem 1.5rem 2rem;
  border-radius: 12px;
  background: linear-gradient(135deg, #f4f7fb 0%, #f8fafc 40%, #f5f5ff 100%);
  box-shadow: 0 14px 40px rgba(15,23,42,0.12);
}

/* Sidebar card with subtle accent strip */
.kh-sidebar {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  border: 1px solid rgba(15,23,42,0.06);
  background: linear-gradient(145deg, #ffffff 0%, #f7fafc 100%);
  box-shadow: 0 10px 24px rgba(15,23,42,0.12);
}

.kh-sidebar::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: linear-gradient(180deg, #0ea5e9, #6366f1);
  opacity: 0.9;
  pointer-events: none;
}

/* Main content card stronger framing */
.kh-wrapper {
  border-radius: 12px;
  border: 1px solid rgba(15,23,42,0.06);
  background: #ffffff;
  box-shadow: 0 12px 32px rgba(15,23,42,0.14);
}

/* Admin sidebar section */
.kh-sidebar-title-admin {
  margin-top: 2rem;
}
.kh-admin-menu {
  margin-top: 0.5rem;
}

/* On mobile, ease back outer padding so it doesn't feel cramped */
@media (max-width: 980px) {
  .kh-layout {
    padding: 1rem 0 1.5rem;
    box-shadow: none;
    background: transparent;
  }
  .kh-wrapper {
    box-shadow: 0 8px 20px rgba(15,23,42,0.12);
  }
}




/* Media card styling for single listing images and videos */
.kh-single-thumb,
.kh-single-video-wrapper,
.kh-single-video-container {
    max-width: 320px;
    margin: 1rem auto;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.18);
    background: #000;
}

/* Ensure images and videos fill the rounded container nicely */
.kh-single-thumb img,
.kh-single-video-wrapper video,
.kh-single-video-container video,
.kh-single-listing .kh-single-video {
    display: block;
    width: 100%;
    height: auto;
}


/* FORCE media sizing in single listing */
.kh-single-thumb,
.kh-single-video-wrapper,
.kh-single-video-container {
    max-width: 320px !important;
    margin: 1rem auto !important;
    border-radius: 15px !important;
    overflow: hidden !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.18) !important;
    background: #000 !important;
}

.kh-single-thumb img,
.kh-single-video-wrapper video,
.kh-single-video-container video {
    max-width: 320px !important;
    width: 100% !important;
    height: auto !important;
    display: block !important;
}


/* Watermark/overlay on single listing images to discourage saving */
.kh-single-thumb[data-watermark] {
    position: relative;
}

.kh-single-thumb[data-watermark]::after {
    content: attr(data-watermark);
    position: absolute;
    inset: 0;
    /* Keep overlay invisible except for the text so the image isn't greyed out */
    background: transparent;
    color: rgba(255, 255, 255, 0.8);
    font-size: 13px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    display: flex;
    align-items: center;       /* center vertically */
    justify-content: center;    /* center horizontally */
    padding: 8px 10px;
    pointer-events: auto;       /* allow this layer to capture right-clicks instead of the raw image */
    box-sizing: border-box;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.7);
}

/* Slightly dim the underlying image when watermark is present */
.kh-single-thumb[data-watermark] img {
    filter: brightness(0.96);
}

/* Optional: match video container feel without watermark text */
.kh-single-video-container,
.kh-single-video-wrapper {
    position: relative;
}


/* Meta chips for city / region / country on browse listings */
.kh-listing-line-meta .kh-meta-chip {
    display: inline-block;
    padding: 0 6px;
    border-radius: 999px;
    font-size: 11px;
    line-height: 1.6;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
    text-decoration: none;
}

.kh-listing-line-meta .kh-meta-chip:hover {
    background: rgba(255, 255, 255, 0.14);
}


/* Quick clear link in header */
.kh-classifieds-header-right .kh-filter-clear {
    margin-left: 12px;
    font-size: 13px;
    opacity: 0.85;
    text-decoration: none;
}

.kh-classifieds-header-right .kh-filter-clear:hover {
    text-decoration: underline;
    opacity: 1;
}


/* ClassiCore admin settings: cards + modals */
.kh-admin-settings .kh-settings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1rem;
  margin-top: 1rem;
  margin-bottom: 1.5rem;
}

.kh-settings-card {
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 8px;
  padding: 0.9rem 1rem;
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(15,23,42,0.04);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 0.5rem;
}



/* My Account: membership plans grid/cards (mirror admin settings card style) */
.kh-plan-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1rem;
  margin-top: 1rem;
  margin-bottom: 1.5rem;
}


/* In plan selection modal, use horizontal scrolling cards */
.kh-modal-body .kh-plan-grid {
  display: flex;
  flex-wrap: nowrap;
  gap: 1rem;
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
  padding-bottom: 0.5rem;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.kh-modal-body .kh-plan-card {
  flex: 0 0 260px;
}


/* Plan carousel dots */
.kh-plan-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.4rem;
  margin-top: 0.35rem;
}

.kh-plan-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  border: none;
  padding: 0;
  background: rgba(148,163,184,0.6);
  cursor: pointer;
}

.kh-plan-dot.is-active {
  width: 18px;
  background: #111827;
}

/* Mobile tuning for modal carousel */
@media (max-width: 640px) {
  .kh-modal-body .kh-plan-grid {
    padding-bottom: 0.75rem;
  }

  .kh-modal-body .kh-plan-card {
    flex: 0 0 80%;
    max-width: 320px;
  }
}
/* Optional: subtle scrollbar styling */
.kh-modal-body .kh-plan-grid::-webkit-scrollbar {
  height: 6px;
}

.kh-modal-body .kh-plan-grid::-webkit-scrollbar-thumb {
  background: rgba(148,163,184,0.9);
  border-radius: 999px;
}

.kh-modal-body .kh-plan-grid::-webkit-scrollbar-track {
  background: transparent;
}
.kh-plan-card {
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(15,23,42,0.04);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* Plan header band, aligned with primary brand color used in buttons/pagination */
.kh-plan-card h4 {
  margin: 0;
  padding: 0.6rem 0.9rem;
  font-size: 0.98rem;
  font-weight: 600;
  background: #0073aa;
  color: #ffffff;
}

/* Plan body copy */
.kh-plan-card p {
  margin: 0.4rem 0.9rem;
  font-size: 0.9rem;
}

/* Buttons inside the plan card align with content padding */
.kh-plan-card .kh-button,
.kh-plan-card .kh-button-disabled {
  margin: 0.6rem 0.9rem 0.9rem;
}

/* Highlight the user's current plan */
.kh-plan-card.kh-plan-current {
  border-color: #0073aa;
  box-shadow: 0 0 0 1px rgba(0,115,170,0.25);
}

/* My Account summary card */
.kh-account-summary-card {
  border-radius: 10px;
  background: #f9fafb;
  border: 1px solid rgba(0,0,0,0.05);
  padding: 1rem 1.25rem;
  margin-bottom: 1.5rem;
  box-shadow: 0 1px 2px rgba(15,23,42,0.03);
}

.kh-account-summary-header h2 {
  margin: 0;
  font-size: 1.2rem;
}

.kh-account-summary-subtitle {
  margin: 0.2rem 0 0;
  font-size: 0.9rem;
  color: #6b7280;
}
.kh-account-icon {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: #eef2ff;
  color: #111827;
  font-size: 16px;
}

.kh-account-delete-card .kh-account-icon {
  background: #fee2e2;
  color: #b91c1c;
}

.kh-account-plan-card .kh-account-icon {
  background: #fef3c7;
  color: #92400e;
}


.kh-account-summary-body {
  margin-top: 0.75rem;
  font-size: 1rem;
}

.kh-account-summary-body p {
  margin: 0.2rem 0;
}

/* My Account: upgrade heading spacing */
.kh-account-upgrade-heading {
  margin-top: 1.5rem;
  margin-bottom: 0.5rem;
}

/* Plan feature list inside upgrade cards */
.kh-plan-features {
  list-style: disc;
  padding-left: 1.4rem;
  margin: 0.35rem 0.9rem 0.6rem;
  font-size: 0.88rem;
  color: #374151;
}

.kh-plan-features li {
  margin: 0.15rem 0;
}

.kh-settings-card h3 {
  margin: 0;
  font-size: 0.95rem;
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.kh-settings-card .dashicons {
  font-size: 1.1rem;
}

.kh-settings-helper {
  margin: 0;
  font-size: 0.85rem;
  color: #6b7280;
}

.kh-settings-card .kh-button-secondary {
  align-self: flex-start;
  margin-top: 0.25rem;
}


/* My Account dashboard layout */
.kh-wrapper.kh-account {
  max-width: 1040px;
  margin: 0 auto;
  padding: 0;
  background: transparent;
  box-shadow: none;
}

.kh-account-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1rem;
  align-items: flex-start;
}

.kh-account-summary-card {
  border-radius: 12px;
  background: #ffffff;
  border: 1px solid rgba(15,23,42,0.06);
  padding: 0.9rem 1.1rem;
  margin-bottom: 0;
  box-shadow: 0 4px 10px rgba(15,23,42,0.04);
}


.kh-account-summary-header {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  margin-bottom: 0.35rem;
}

.kh-account-summary-text {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.kh-account-summary-header h2,
.kh-account-summary-header h3 {
  font-size: 1.05rem;
  font-weight: 600;
}

.kh-account-summary-subtitle {
  font-size: 0.85rem;
  color: #6b7280;
}

.kh-account-summary-body p {
  font-size: 0.9rem;
}

.kh-account-plan-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.kh-account-export-card .kh-export-textarea {
  width: 100%;
  margin-top: 0.5rem;
  font-family: monospace;
  font-size: 0.8rem;
}

.kh-account-export-card .kh-export-output p {
  margin-bottom: 0.25rem;
}

.kh-account-delete-card {
  border-color: rgba(220, 38, 38, 0.35);
}

.kh-button-danger {
  background: #b91c1c;
  border-color: #b91c1c;
  color: #ffffff;
}

.kh-button-danger:hover,
.kh-button-danger:focus {
  background: #991b1b;
  border-color: #991b1b;
  color: #ffffff;
}

/* On smaller screens, keep cards single-column */
@media (max-width: 640px) {
  .kh-account-grid {
    grid-template-columns: 1fr;
  }
}
/* Modal styling */
.kh-modal {
  position: fixed;
  inset: 0;
  display: none;
  z-index: 100000;
}

.kh-modal.is-open {
  display: block;
}

.kh-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,0.45);
}

.kh-modal-dialog {
  position: relative;
  max-width: 520px;
  margin: 20vh auto 4vh;
  background: #ffffff;
  border-radius: 10px;
  padding: 1.25rem 1.5rem 1rem;
  box-shadow: 0 10px 30px rgba(15,23,42,0.35);
}

.kh-modal-dialog h3 {
  margin-top: 0;
  margin-bottom: 0.35rem;
}

.kh-modal-dialog .description {
  margin-top: 0;
  margin-bottom: 0.75rem;
}

.kh-modal-dialog p {
  margin-bottom: 0.65rem;
}

.kh-modal-actions {
  margin-top: 0.75rem;
  text-align: right;
}

/* Make sure modals play nicely inside WP admin */
body.wp-admin .kh-modal {
  position: fixed;
}


/* v2.10.5 – refreshed single listing layout */
.kh-single-listing--v2 {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.kh-single-header {
  margin-bottom: 0.75rem;
  padding: 0.75rem 1rem;
  background: linear-gradient(90deg, #f8f9fb 0%, #e5f1fb 50%, #ffffff 100%);
  border-radius: 12px;
}

.kh-single-title {
  margin: 0 0 0.25rem;
  font-size: 1.6rem;
}

.kh-single-presence-row {
  font-size: 0.9rem;
  color: #444;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}

.kh-single-author-name {
  font-weight: 600;
}

.kh-single-layout-main {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  align-items: flex-start;
}

.kh-single-media-column {
  flex: 0 0 420px;
  max-width: 420px;
}

.kh-single-body-column {
  flex: 1 1 320px;
  max-width: 360px;
}

@media (max-width: 980px) {
  .kh-single-layout-main {
    flex-direction: column;
  }
  .kh-single-media-column,
  .kh-single-body-column {
  flex: 1 1 320px;
  max-width: 360px;
}
}

/* Gallery styles */
.kh-single-gallery {
  display: flex;
  gap: 0.85rem;
  align-items: stretch;
}

.kh-single-gallery-main {
  order: 2;
  flex: 1 1 auto;
  min-width: 0;
}

.kh-single-gallery-main img,
.kh-single-image-main {
  width: 100%;
  height: auto;
  border-radius: 15px;
  display: block;
  box-shadow: 0 8px 18px rgba(0,0,0,0.12);
}

.kh-single-gallery-thumbs {
  order: 1;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 0.55rem;
  margin-top: 0;
  justify-content: flex-start;
  align-items: stretch;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 6px;
  padding-bottom: 0;
  -webkit-overflow-scrolling: touch;
  max-height: 520px;
}

.kh-single-thumb-link {
  display: block;
  width: 88px;
  height: 66px;
  flex: 0 0 auto;
  overflow: hidden;
  border-radius: 12px;
  margin: 0; /* override theme styles that center anchors */
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 6px 14px rgba(0,0,0,0.08);
}

.kh-single-thumb-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: inherit;
}

@media (max-width: 900px) {
  .kh-single-gallery {
    flex-direction: column;
  }
  .kh-single-gallery-main {
    order: 1;
  }
  .kh-single-gallery-thumbs {
    order: 2;
    flex-direction: row;
    align-items: center;
    overflow-x: auto;
    overflow-y: hidden;
    max-height: none;
    padding-right: 0;
    padding-bottom: 6px;
    margin-top: 0.65rem;
  }
}


/* v2.10.6 – desktop polish for single listing */
@media (min-width: 900px) {
  .kh-single-layout-main {
    align-items: flex-start;
  }
  .kh-single-media-column {
    padding-right: 1rem;
  }
  .kh-single-body-column {
    padding-left: 1.75rem;
    border-left: 1px solid #eeeeee;
  }
}

/* Single listing: about section */
.kh-single-section {
    margin-top: 16px;
}

/* Rentals single: align section cards (About / Units) with Property details */
.kh-single-section.kh-single-about,
.kh-single-section.kh-single-units {
  background: #fdfdfd;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 10px;
  padding: 1rem;
  margin-top: 1.2rem;
}

/* Units table: clean, Zillow-ish styling */
.kh-units-table-wrap {
  width: 100%;
  overflow-x: auto;
}

.kh-units-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.95rem;
}

.kh-units-table thead th {
  text-align: left;
  font-size: 0.85rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #555;
  border-bottom: 1px solid #e9e9e9;
  padding: 0.6rem 0.5rem;
}

.kh-units-table tbody td {
  padding: 0.6rem 0.5rem;
  border-bottom: 1px solid #f0f0f0;
}

.kh-units-table tbody tr:last-child td {
  border-bottom: none;
}

.kh-single-section-title,
.kh-single-body-column .kh-message-form h3 {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 0.75rem;
    padding: 0.5rem 0.75rem;
    background: linear-gradient(90deg, #f8f9fb 0%, #e5f1fb 50%, #ffffff 100%);
    border-radius: 10px;
    text-transform: none;
    color: #111;
}

.kh-single-section-body {
    font-size: 0.95rem;
    line-height: 1.5;
}

/* Contact form card on single listing */
.kh-single-body-column .kh-message-form {
  background: #f8f9fb;
  border-radius: 12px;
  padding: 1rem 1.25rem 1.25rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

/* Full-width media block above the location map */
.kh-single-photos-block {
  margin: 0.9rem 0 1rem;
}

.kh-single-photos-block .kh-single-gallery {
  margin-bottom: 0;
}

.kh-single-photos-block .kh-single-video-container {
  margin-top: 0.85rem;
}

/* Slight separation between media area and about text */
.kh-single-media-column .kh-single-gallery {
  margin-bottom: 0.75rem;
}

/* Mobile/tablet: thumbs below main (horizontal strip) */
@media (max-width: 900px) {
  .kh-single-gallery {
    flex-direction: column;
  }
  .kh-single-gallery-main {
    order: 1;
  }
  .kh-single-gallery-thumbs {
    order: 2;
    flex-direction: row;
    align-items: center;
    overflow-x: auto;
    overflow-y: hidden;
    padding-right: 0;
    padding-bottom: 6px;
    margin-top: 0.65rem;
    max-height: none;
  }
}


/* Inbox: reply form attachment field */
.kh-message-form .kh-field-attachment {
    margin-top: 10px;
}

.kh-message-form .kh-field-attachment label {
    display: block;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 4px;
}

.kh-message-form .kh-field-attachment input[type="file"] {
    display: block;
    font-size: 0.9rem;
}

.kh-message-form .kh-field-hint {
    font-size: 0.8rem;
    color: rgba(0, 0, 0, 0.6);
    margin-top: 2px;
}

.kh-upgrade-hint--attachments {
    font-size: 0.85rem;
    margin-top: 6px;
    color: rgba(0, 0, 0, 0.7);
}

/* Inbox: message attachments in conversation view */
.kh-msg-attachments {
    margin-top: 6px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.kh-msg-attachment-link {
    display: inline-block;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16);
}

.kh-msg-attachment-img {
    display: block;
    width: 96px;
    height: 96px;
    object-fit: cover;
}

/* Inbox: improved attachment picker */
.kh-message-form .kh-field-attachment--rich {
    margin-top: 12px;
}

.kh-attachment-dropzone {
    border: 1px dashed rgba(0, 0, 0, 0.25);
    border-radius: 10px;
    padding: 10px 12px;
    cursor: pointer;
    background: rgba(131, 131, 255, 0.06);
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.kh-attachment-dropzone:hover {
    border-color: rgba(0, 0, 0, 0.4);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
    background: rgba(131, 131, 255, 0.10);
}

.kh-attachment-inner {
    display: flex;
    align-items: center;
    gap: 8px;
}

.kh-attachment-plus {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, 0.3);
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
}

.kh-attachment-text {
    font-size: 0.9rem;
    color: rgba(0, 0, 0, 0.8);
}

.kh-field-selected {
    margin-top: 4px;
    font-size: 0.8rem;
    color: rgba(0, 0, 0, 0.7);
    word-break: break-all;
}

/* My Listings action buttons: icon + label layout */
.kh-action-button {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

/* Small labels */
.kh-action-button .kh-action-label {
  font-size: 0.85rem;
}

/* Renewal note styling */
.kh-renewal-note {
  display: inline-block;
  margin-top: 0.25rem;
  font-size: 0.8rem;
  max-width: 220px;
}

/* Mobile tweaks for My Listings actions */
@media (max-width: 640px) {
  .kh-table-mylistings td:last-child {
    white-space: normal;
  }

  .kh-action-button {
    flex-direction: column;
    justify-content: center;
    padding: 0.35rem 0.5rem;
  }

  .kh-action-button .kh-action-label {
    font-size: 0.7rem;
    line-height: 1.1;
  }

  .kh-renewal-note {
    display: block;
    margin-top: 0.35rem;
    max-width: 160px;
  }
}

/* Renew count indicator under the Renew button */
.kh-renew-count {
  display: inline-block;
  min-width: 1.5em;
  text-align: center;
  font-weight: 600;
}

.kh-renew-count--ok {
  color: #1a7f37; /* green-ish */
}

.kh-renew-count--none {
  color: #c53030; /* red */
}

.kh-action-button--disabled {
  opacity: 0.6;
  cursor: not-allowed;
}


/* Renew button contrast + lighter background */
.kh-action-button--renew {
  background: #e6f2ff !important;
  border-color: #cfe2ff !important;
  color: #0b5ed7 !important;
}
.kh-action-button--renew:hover {
  background: #d0e7ff !important;
  border-color: #b6d4fe !important;
  color: #084298 !important;
}
/* Ensure renew count stays readable inside the renew button */
.kh-action-button--renew .kh-renew-count--ok {
  color: #084298 !important;
}


/* ClassiCore footer branding & license strip */
.classicore-footer-wrapper {
  margin-top: 24px;
  padding: 12px 16px;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  font-size: 12px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.classicore-footer-branding a {
  font-weight: 600;
  text-decoration: none;
}

.classicore-footer-branding a:hover,
.classicore-footer-branding a:focus {
  text-decoration: underline;
}

.classicore-footer-license {
  opacity: 0.7;
}


.classicore-footer-version {
  font-size: 12px !important;
  opacity: 0.8;
}


.classicore-footer-left,
.classicore-footer-right {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.classicore-footer-version {
  font-size: 12px !important;
  opacity: 0.8;
}

/* Viewer Insights Quick Message modal */
#kh-quick-message-modal .kh-modal-dialog--sm {
  max-width: 480px;
}

.kh-quick-message-viewer {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.kh-insights-viewer-avatar-wrap {
  display: inline-flex;
  margin-right: 0.5rem;
}

.kh-insights-viewer-name {
  font-weight: 600;
}

.kh-insights-viewer-date {
  font-size: 0.85rem;
  opacity: 0.75;
  margin-left: 0.35rem;
}

.kh-insights-message-btn {
  float: right;
  margin-left: auto;
  font-size: 0.8rem;
  padding: 2px 10px;
}

.kh-quick-message-status {
  font-size: 0.85rem;
  margin-top: 0.25rem;
}

.kh-quick-message-full {
  margin-top: 0.75rem;
  text-align: right;
}

/* Viewer Insights manager modal */
#kh-viewers-manager-modal .kh-modal-dialog--lg {
  max-width: 900px;
}

.kh-viewers-manager-intro {
  margin-bottom: 0.75rem;
  font-size: 0.9rem;
  opacity: 0.85;
}

.kh-viewers-manager-table {
  border-radius: 0.5rem;
  border: 1px solid rgba(148,163,184,0.4);
  overflow: hidden;
  margin-bottom: 0.75rem;
}

.kh-viewers-manager-head,
.kh-viewers-manager-row {
  display: grid;
  grid-template-columns: minmax(0, 2.2fr) minmax(0, 1.3fr) minmax(0, 0.8fr) minmax(0, 1.1fr) minmax(0, 1.6fr);
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.75rem;
}

.kh-viewers-manager-head {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  background: rgba(15,23,42,0.03);
  border-bottom: 1px solid rgba(148,163,184,0.4);
}

.kh-viewers-manager-row:nth-child(odd) {
  background: rgba(15,23,42,0.01);
}

.kh-viewers-manager-col {
  font-size: 0.9rem;
}

.kh-viewers-col-user {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}

.kh-viewer-listing-hint {
  font-size: 0.8rem;
  opacity: 0.75;
  margin-top: 0.15rem;
}

.kh-viewer-status {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.75rem;
}

.kh-viewer-status--new {
  background: rgba(59,130,246,0.12);
  color: #1d4ed8;
}

.kh-viewer-status--contacted {
  background: rgba(16,185,129,0.14);
  color: #047857;
}

.kh-viewers-manager-col.kh-viewers-col-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  justify-content: flex-end;
}

.kh-viewers-manager-actions {
  margin-top: 0.75rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.kh-viewers-manager-note {
  margin-top: 0.5rem;
  font-size: 0.8rem;
  opacity: 0.7;
}

/* Button variation for destructive viewer clear */
.kh-button.kh-button--danger {
  background: #b91c1c;
  border-color: #b91c1c;
  color: #fff;
}
.kh-button.kh-button--danger:hover {
  background: #991b1b;
  border-color: #991b1b;
}



/* Internal lightbox overlay for single listing images (with watermark support) */
.kh-lightbox-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.84);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s ease-out;
  z-index: 9999;
}

.kh-lightbox-overlay.kh-lightbox-open {
  opacity: 1;
  pointer-events: auto;
}

.kh-lightbox-inner {
  position: relative;
  max-width: 96vw;
  max-height: 96vh;
}

.kh-lightbox-img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  height: auto;
  width: auto;
  border-radius: 4px;
}

/* Watermark text over lightbox image */
.kh-lightbox-overlay::after {
  content: attr(data-watermark);
  position: absolute;
  left: 50%;
  top: 10%;
  transform: translateX(-50%);
  padding: 6px 16px;
  border-radius: 999px;
  font-size: 13px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.75);
  background: linear-gradient(to right, rgba(0,0,0,0.35), rgba(0,0,0,0.7), rgba(0,0,0,0.35));
  pointer-events: none;
}

/* Close button */
.kh-lightbox-close {
  position: absolute;
  top: 8px;
  right: 10px;
  border: none;
  border-radius: 999px;
  padding: 2px 9px 4px;
  background: rgba(0,0,0,0.55);
  color: #fff;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

.kh-lightbox-close:hover {
  background: rgba(0,0,0,0.8);
}



/* Mobile layout for Identified viewers manager */
@media (max-width: 640px) {
  #kh-viewers-manager-modal .kh-modal-dialog--lg {
    max-width: 100%;
    margin: 0 0.75rem;
  }

  .kh-viewers-manager-head {
    display: none;
  }

  .kh-viewers-manager-row {
    grid-template-columns: minmax(0, 1fr);
    align-items: flex-start;
    border-bottom: 1px solid rgba(148,163,184,0.35);
  }

  .kh-viewers-manager-row:last-child {
    border-bottom: none;
  }

  .kh-viewers-manager-col {
    padding: 0.1rem 0;
  }

  .kh-viewers-manager-col.kh-viewers-col-user {
    padding-bottom: 0.15rem;
  }

  .kh-viewers-manager-col.kh-viewers-col-last,
  .kh-viewers-manager-col.kh-viewers-col-count,
  .kh-viewers-manager-col.kh-viewers-col-status {
    display: flex;
    gap: 0.4rem;
    font-size: 0.8rem;
    opacity: 0.95;
  }

  .kh-viewers-manager-col.kh-viewers-col-last::before,
  .kh-viewers-manager-col.kh-viewers-col-count::before,
  .kh-viewers-manager-col.kh-viewers-col-status::before {
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 0.7rem;
    color: #64748b;
    flex-shrink: 0;
  }

  .kh-viewers-manager-col.kh-viewers-col-last::before {
    content: "Last viewed";
  }

  .kh-viewers-manager-col.kh-viewers-col-count::before {
    content: "Views";
  }

  .kh-viewers-manager-col.kh-viewers-col-status::before {
    content: "Status";
  }

  .kh-viewers-manager-col.kh-viewers-col-actions {
    margin-top: 0.4rem;
    justify-content: flex-start;
  }

  .kh-viewers-manager-col.kh-viewers-col-actions .kh-button {
    flex: 1 1 48%;
    font-size: 0.8rem;
    padding-inline: 0.35rem;
    text-align: center;
  }

  .kh-viewers-manager-table {
    margin-left: -0.25rem;
    margin-right: -0.25rem;
    border-radius: 0.75rem;
  }
}


/* Saved listings (bookmark) button */
.kh-save-listing-btn {
  border: none;
  background: transparent;
  padding: 0;
  margin-left: 0.35rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.kh-save-listing-btn .dashicons {
  font-size: 18px;
  width: 18px;
  height: 18px;
}

.kh-save-listing-btn.kh-saved-active .dashicons {
  color: #f59e0b;
}

.kh-save-listing-btn:focus-visible {
  outline: 2px solid #2563eb;
  outline-offset: 2px;
}

/* Layout helper for listing card title + bookmark */
.kh-card-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

/* Single listing header layout when bookmark is present */
.kh-single-header-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

/* Action cluster (Save + add-on icons) on single listing header */
.kh-single-header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
}

/* Prevent add-on icons from being pushed away from the Save button */
.kh-single-header-actions > * {
  margin-left: 0 !important;
}

/* Saved listings table */
.kh-table-savedlistings th,
.kh-table-savedlistings td {
  vertical-align: middle;
}


.kh-save-listing-btn .kh-save-label {
  margin-left: 4px;
  font-size: 12px;
}


/* Force visibility of save/bookmark button */
.kh-save-listing-btn {
  min-width: 32px;
  min-height: 32px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.06);
}

.kh-save-listing-btn .dashicons {
  display: inline-block;
  font-size: 18px;
  line-height: 1;
  color: #4b5563;
}

.kh-save-listing-btn.kh-saved-active .dashicons {
  color: #f59e0b;
}


/* Tooltip for save buttons */
.kh-save-listing-btn[title] {
  position: relative;
}

.kh-save-listing-btn[title]:hover::after {
  content: attr(title);
  position: absolute;
  top: -32px;
  left: 50%;
  transform: translateX(-50%);
  background: #111827;
  color: #fff;
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 12px;
  white-space: nowrap;
  z-index: 9999;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}

.kh-save-listing-btn[title]:hover::before {
  content: "";
  position: absolute;
  top: -8px;
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top-color: #111827;
  z-index: 9998;
}


/* "Report this ad" link on single listing */
.kh-single-report-row {
  margin-top: 0.75rem;
  font-size: 0.85rem;
}

.kh-button.kh-button--ghost.kh-report-listing-btn {
  background: transparent;
  border: none;
  color: #6b7280;
  padding: 0;
  text-decoration: underline;
  cursor: pointer;
}

.kh-button.kh-button--ghost.kh-report-listing-btn:hover {
  color: #374151;
}

.kh-report-status {
  font-size: 0.85rem;
}


/* Image modal for single listing/gallery images */
.kh-image-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
}

.kh-image-modal.kh-image-modal-open {
  display: flex;
  align-items: center;
  justify-content: center;
}

.kh-image-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.8);
}

.kh-image-modal-inner {
  position: relative;
  max-width: 90vw;
  max-height: 90vh;
  z-index: 1;
}

.kh-image-modal-img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  height: auto;
  margin: 0 auto;
}

.kh-image-modal-close {
  position: absolute;
  top: 8px;
  right: 8px;
  border: none;
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 20px;
  line-height: 28px;
  text-align: center;
}


/* Blurred gallery for non-upgraded logged-in viewers */
.kh-single-gallery-blurred {
  position: relative;
}

.kh-single-gallery-main-blurred img.kh-single-image-blurred,
.kh-single-gallery-thumbs-blurred img.kh-single-image-blurred {
  filter: blur(10px);
  transform: scale(1.03);
  transition: filter 0.2s ease-out, transform 0.2s ease-out;
}

.kh-single-gallery-blurred:hover img.kh-single-image-blurred {
  filter: blur(11px);
  transform: scale(1.04);
}

.kh-single-thumb-blurred-wrapper {
  display: inline-block;
  margin-right: 4px;
  margin-bottom: 4px;
  overflow: hidden;
  border-radius: 3px;
}

/* blurred overlay removed: clean blur only, no message box */
  100% {
    transform: translateY(0);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
  }
}


/* Locked video placeholder, mirroring image locked styling. */
.kh-single-video-locked {
  position: relative;
  border-radius: 8px;
  overflow: hidden;
  background: #111827;
  padding: 40px 20px;
  text-align: center;
  margin-bottom: 1.5rem;
}

.kh-single-video-locked::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.16) 0,
    rgba(255, 255, 255, 0.16) 8px,
    rgba(31, 41, 55, 0.2) 8px,
    rgba(31, 41, 55, 0.2) 16px
  );
  filter: blur(3px);
}

.kh-single-video-locked-inner {
  position: relative;
  z-index: 1;
}

.kh-single-video-locked-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 999px;
  margin: 0 auto 10px;
  font-size: 24px;
  background: rgba(15, 23, 42, 0.55);
}

.kh-single-video-locked-inner p {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 500;
  color: #f9fafb;
}

/* Tease-style locked video: show a blurred poster image instead of a solid block. */
.kh-single-video-locked-tease{
  padding: 0;
  background: #000;
}
.kh-single-video-locked-tease::before{display:none}
.kh-single-video-locked-tease img{
  width: 100%;
  display: block;
  max-height: 460px;
  object-fit: cover;
}



/* Mobile off-canvas Quick Actions sidebar with draggable toggle */
@media (max-width: 980px) {

  /* Ensure main layout stacks */
  .kh-layout {
    grid-template-columns: 1fr;
  }

  /* Sidebar becomes an off-canvas drawer */
  .kh-sidebar.kh-sidebar--mobile {
    position: fixed;
    top: 70px; /* adjust if header height changes */
    left: -230px; /* hidden state */
    width: 220px;
    max-height: calc(100vh - 90px);
    overflow-y: auto;
    z-index: 1000;
    transition: left 0.25s ease;
  }

  .kh-sidebar.kh-sidebar--mobile.kh-sidebar--open {
    left: 0.75rem;
  }

  /* Hide section title on mobile to keep it compact */
  .kh-sidebar.kh-sidebar--mobile .kh-sidebar-title {
    display: none;
  }

  /* Floating toggle group (draggable) */
  .kh-floating-toggle-group {
    position: fixed;
    top: 50%;
    left: 0.75rem;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    z-index: 1001;
  }

  .kh-sidebar-toggle,
  .kh-filter-toggle-floating {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    border: none;
    background: #005f8d;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(0,0,0,0.25);
    padding: 0;
    cursor: pointer;
  }

  .kh-filter-toggle-floating {
    background: #2563eb; /* slightly different blue to distinguish Filters */
  }

  .kh-sidebar-toggle--dragging {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
    transform: scale(1.05);
    opacity: 0.95;
    cursor: grabbing;
  }

  .kh-sidebar-toggle .dashicons,
  .kh-filter-toggle-floating .dashicons {
    font-size: 22px;
    line-height: 1;
  }
}

/* ===============================
 * Rentals: Zillow-style header filters (no modal)
 * =============================== */

.kh-rentals-header-toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.85rem;
  width: 100%;
  flex-wrap: wrap;
}

/* Rentals Map View (mobile): when the user scrolls down into cards we collapse
   the large toolbar into a compact sticky bar (Option #2 UX). */
.kh-rentals-mobile-focusbar {
  display: none;
  align-items: center;
  gap: 0.55rem;
  padding: 0.55rem 0.75rem;
  border-bottom: 1px solid rgba(0,0,0,0.08);
  background: #fff;
}

.kh-rentals-mobile-focusbar .kh-rentals-focusbar-btn,
.kh-rentals-mobile-focusbar .kh-rentals-focusbar-link {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.55rem 0.75rem;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.12);
  background: rgba(0,0,0,0.02);
  font-weight: 750;
  text-decoration: none;
  color: inherit;
}

.kh-rentals-mobile-focusbar .kh-rentals-focusbar-btn {
  cursor: pointer;
}

.kh-rentals-mobile-focusbar .dashicons {
  width: 18px;
  height: 18px;
  font-size: 18px;
  opacity: 0.85;
}

body.kh-rentals-toolbar-collapsed .kh-rentals-mobile-focusbar {
  display: flex;
  position: sticky;
  top: var(--sb-topbar-offset, 0px);
  z-index: 9998;
}

body.kh-rentals-toolbar-collapsed .kh-rentals-header-row,
body.kh-rentals-toolbar-collapsed .kh-rentals-header-actions {
  display: none;
}

/*
 * v2.15.48: Prevent the rentals toolbar from collapsing on mobile map/split views
 *
 * The original CSS hides the header row and actions when the toolbar enters a
 * collapsed state (typically triggered when scrolling). This behaviour
 * interferes with the revised layout which consolidates Filters, Clear and
 * Alert actions into the header. To ensure these controls remain visible we
 * override the collapse styles below, forcing the header to stay displayed
 * and hiding the mobile focusbar instead. This keeps the user controls
 * persistent and avoids duplicate UI elements.
 */
body.kh-rentals-toolbar-collapsed .kh-rentals-header-row,
body.kh-rentals-toolbar-collapsed .kh-rentals-header-actions {
  display: flex !important;
}
body.kh-rentals-toolbar-collapsed .kh-rentals-mobile-focusbar {
  display: none !important;
}

.kh-rentals-header-form {
  flex: 1 1 720px;
  min-width: 280px;
}

.kh-rentals-header-row {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: nowrap;
}

/* Keep Apply visible on “in-between” laptop widths where pills overflow.
   We let the filters scroll horizontally rather than wrapping under the button. */
.kh-rentals-header-filters {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 2px;
}
.kh-rentals-header-filters::-webkit-scrollbar { height: 6px; }
.kh-rentals-header-filters::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.18); border-radius: 999px; }
.kh-rentals-header-apply {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
}
.kh-rentals-header-filters .kh-rentals-filter,
.kh-rentals-header-filters .kh-rentals-mobile-filters-btn {
  flex: 0 0 auto;
}

.kh-rentals-filter {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.55rem 0.65rem;
  border: 1px solid rgba(0,0,0,0.12);
  border-radius: 999px;
  background: #ffffff;
  box-shadow: 0 1px 0 rgba(0,0,0,0.03);
}

.kh-rentals-filter .dashicons {
  opacity: 0.75;
}

.kh-rentals-filter-label {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  opacity: 0.65;
  margin-right: 0.25rem;
  white-space: nowrap;
}

.kh-rentals-filter-input,
.kh-rentals-filter-select {
  border: none;
  outline: none;
  background: transparent;
  font-size: 0.95rem;
}

.kh-rentals-filter-input {
  width: 110px;
}

.kh-rentals-filter--location {
  /* Keep the search compact so the toolbar feels more like Zillow.
     (Still grows to full width on mobile via the media query below.) */
  flex: 0 1 300px;
  max-width: 360px;
  min-width: 220px;
  padding-left: 0.75rem;
}

/* Clear Location button: styled like a filter pill, not just text */
.kh-rentals-filter--clear {
  flex: 0 0 auto;
  padding: 0;
}

.kh-rentals-clear-location {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  border: none;
  outline: none;
  background: transparent;
  padding: 0.65rem 0.9rem;
  cursor: pointer;
  font-weight: 750;
  color: inherit;
}

.kh-rentals-clear-location .dashicons {
  font-size: 18px;
  width: 18px;
  height: 18px;
  opacity: 0.7;
}

/* patched: clear wrapper stays, hide only the button */
.kh-rentals-clear-location-btn.is-hidden {
  display: none;
}

.kh-rentals-filter--clear:hover {
  background: rgba(0,0,0,0.03);
}

.kh-rentals-filter--clear:active {
  transform: translateY(0.5px);
}

@media (max-width: 980px) {
  .kh-rentals-filter--location {
    flex: 1 1 100%;
    max-width: none;
  }
}

.kh-rentals-filter--location .kh-rentals-filter-input {
  width: 100%;
  min-width: 180px;
}

.kh-rentals-filter--price .kh-rentals-filter-input {
  width: 88px;
}

.kh-rentals-filter-sep {
  opacity: 0.4;
  font-weight: 700;
}

.kh-rentals-apply {
  border: none;
  border-radius: 999px;
  padding: 0.65rem 1rem;
  font-weight: 750;
  cursor: pointer;
  background: #2563eb;
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.20);
}

.kh-rentals-apply:hover {
  filter: brightness(0.98);
}

.kh-rentals-view-toggle {
  display: inline-flex;
  border: 1px solid rgba(0,0,0,0.12);
  border-radius: 999px;
  overflow: hidden;
  background: #ffffff;
  box-shadow: 0 1px 0 rgba(0,0,0,0.03);
}

.kh-rentals-toggle-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.6rem 0.9rem;
  font-weight: 750;
  text-decoration: none;
  color: #111827;
  min-width: 74px;
}

.kh-rentals-toggle-btn.is-active {
  background: rgba(37, 99, 235, 0.10);
  color: #2563eb;
}

.kh-rentals-header-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

/* Keep the right-side action cluster pinned to the right edge (List/Split/Map). */
.kh-rentals-header-actions-right {
  margin-left: auto;
}

.kh-rentals-action-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.55rem 0.75rem;
  border: 1px solid rgba(0,0,0,0.12);
  border-radius: 999px;
  text-decoration: none;
  color: #111827;
  background: #ffffff;
  font-weight: 700;
}

.kh-rentals-action-link:hover {
  border-color: rgba(0,0,0,0.22);
}

@media (max-width: 820px) {
  .kh-rentals-header-form {
    flex: 1 1 100%;
  }

  /* Let the filter pills scroll horizontally like Zillow on mobile */
  .kh-rentals-header-row {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 0.25rem;
    -webkit-overflow-scrolling: touch;
  }

  .kh-rentals-header-row::-webkit-scrollbar {
    height: 8px;
  }

  .kh-rentals-filter,
  .kh-rentals-apply {
    flex: 0 0 auto;
  }

  .kh-rentals-view-toggle {
    flex: 0 0 auto;
  }
}

/* Hide floating toggle group on desktop */
@media (min-width: 769px) {
  .kh-floating-toggle-group {
    display: none;
  }
}


@media (max-width: 980px) {
  /* Make Filters modal behave more like a side drawer on mobile */
  .kh-filter-modal {
    align-items: flex-start;
    justify-content: flex-start;
    padding-top: 4vh;
    padding-bottom: 4vh;
  }

  .kh-filter-modal-dialog {
    margin-left: 0.75rem;
    margin-right: auto;
    max-width: 260px;
    width: 260px;
    max-height: calc(100vh - 8vh);
  }
}




@media (max-width: 980px) {
  /* Hide the large Filters pill button on mobile,
     but keep the quick Clear link if it exists */
  .kh-classifieds-header-right .kh-filter-toggle {
    display: none;
  }
}


/* New listing form helpers */
.kh-field-group {
  margin-bottom: 1rem;
}

.kh-field-counter {
  font-size: 0.8rem;
  font-weight: 500;
  color: #6b7280;
  float: right;
}

.kh-field-help {
  display: inline-block;
  margin-top: 0.25rem;
  margin-bottom: 0.5rem;
  font-size: 0.85rem;
  color: #6b7280;
}

.kh-guidelines-row {
  margin-top: 1rem;
}

.kh-button.kh-button-ghost {
  background: transparent;
  color: #0f172a;
  border: 1px solid rgba(15,23,42,0.15);
}

.kh-button.kh-button-ghost:hover {
  background: rgba(15,23,42,0.03);
}

.kh-guidelines-list {
  margin: 0 0 0.75rem 1.25rem;
  padding: 0;
  font-size: 0.9rem;
  color: #4b5563;
}

.kh-guidelines-list li {
  margin-bottom: 0.35rem;
}

/* Responsive lightbox image constraints */
.kh-lightbox img,
.kh-modal-image img,
.kh-gallery-lightbox img {
    max-width: 90vw;
    max-height: 90vh;
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 8px;
}

@media (max-width: 980px) {
    .kh-lightbox img,
    .kh-modal-image img,
    .kh-gallery-lightbox img {
        max-width: 95vw;
        max-height: 80vh;
    }
}

/* Explicit sizing for the JS-driven image modal */
.kh-image-modal-img,
.kh-image-modal img {
    max-width: 90vw;
    max-height: 90vh;
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 8px;
}

@media (max-width: 980px) {
    .kh-image-modal-img,
    .kh-image-modal img {
        max-width: 95vw;
        max-height: 80vh;
    }
}

/* Custom autocomplete dropdown for location inputs */
.kh-location-input-wrap {
  position: relative;
  display: inline-block;
  width: 100%;
}

/* Rentals header city search uses the same suggestion dropdown styling */
.kh-rentals-filter--location {
  position: relative;
}

.kh-rentals-filter--location .kh-location-suggest {
  width: 100%;
}

.kh-location-input-wrap .kh-location-input {
  width: 100%;
}

.kh-location-suggest {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 9999;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  max-height: 240px;
  overflow-y: auto;
  box-shadow: 0 8px 16px rgba(15, 23, 42, 0.18);
  margin-top: 2px;
  display: none;
}

.kh-location-suggest-item {
  padding: 6px 10px;
  font-size: 0.85rem;
  cursor: pointer;
  color: #111827;
}

.kh-location-suggest-item:hover {
  background: #eff6ff;
}

/* Upgrade plan card: span full width in account grid */
.kh-account-plan-card.kh-account-plan-card-wide {
  grid-column: 1 / -1;
}

/* Inline plan grid inside account card */
.kh-plan-grid-inline {
  margin-top: 0.75rem;
  margin-bottom: 0.25rem;
}

.kh-plan-card .kh-plan-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.25rem;
}

.kh-plan-label {
  font-weight: 600;
}

.kh-plan-pill {
  padding: 0.1rem 0.55rem;
  border-radius: 999px;
  font-size: 0.75rem;
  background: #e5f3ff;
  color: #0369a1;
}

.kh-plan-copy {
  font-size: 0.85rem;
  margin: 0.1rem 0;
}

/* Highlight Upgrade Your Plan card: premium look */
.kh-account-plan-card-wide {
  background: #fff7e6 !important;
  border: 1px solid #fbbf24 !important;
  box-shadow: 0 6px 16px rgba(251,191,36,0.22) !important;
  position: relative;
}

/* Accent strip */
.kh-account-plan-card-wide::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 5px;
  background: #fbbf24;
  border-radius: 4px 0 0 4px;
}

/* My Account main card: span full width on top row */
.kh-account-main-card {
  grid-column: 1 / -1;
}

/* Subtle hover elevation on cards */
.kh-account-summary-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
  transition: all 0.15s ease;
}

/* Extra breathing room for the main card */
.kh-account-main-card {
  padding-top: 1.35rem !important;
  padding-bottom: 1.35rem !important;
}

@media (max-width: 980px) {
  body.kh-bottom-actions-active {
    padding-bottom: 3.6rem;
  }

  .kh-bottom-actions-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: space-around;
    align-items: stretch;
    padding: 0 env(safe-area-inset-left) env(safe-area-inset-bottom) env(safe-area-inset-right);
    background: #ffffff;
    border-top: 2px solid #2563eb;
    padding-top: 4px;
    padding-bottom: calc(env(safe-area-inset-bottom) + 8px);
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
    /* Keep the mobile nav above Leaflet controls and theme overlays */
    z-index: 20000;
  }

  .kh-bottom-actions-button {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    padding: 0.25rem 0 0.5rem;
    border: none;
    border-radius: 0;
    background: transparent;
    color: #2563eb;
    text-decoration: none;
  }


  .kh-bottom-actions-button.kh-bottom-actions-active {
    background: rgba(37, 99, 235, 0.08);
    border-radius: 999px;
    box-shadow: 0 2px 4px rgba(15, 23, 42, 0.18);
    transform: translateY(-2px);
  }

  .kh-bottom-actions-button.kh-bottom-actions-active .dashicons,
  .kh-bottom-actions-button.kh-bottom-actions-active .kh-bottom-actions-label {
    color: #2563eb;
    font-weight: 600;
  }

  .kh-bottom-actions-button .dashicons {
    font-size: 1.15rem;
    line-height: 1;
  }

  .kh-bottom-actions-label {
    font-size: 0.7rem;
    line-height: 1.1;
    font-weight: 500;
  }

  .kh-filter-toggle-floating {
    position: fixed;
    right: 0.85rem;
    bottom: 4.6rem;
    bottom: calc(env(safe-area-inset-bottom) + 4.6rem);
    width: 42px;
    height: 42px;
    border-radius: 999px;
    border: none;
    background: #2563eb;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
    z-index: 20001;
    padding: 0;
    cursor: pointer;
  }
}



/* -------------------------------------------------------------------------- */
/* Rentals Map View: full-height map + 2-up cards in the list panel (desktop)  */
/* -------------------------------------------------------------------------- */
.kh-index-rentals.kh-rentals-map-view .kh-rentals-map-shell{
  height: 100%;
  min-height: 0;
}

.kh-index-rentals.kh-rentals-map-view #kh-rentals-map{
  height: 100%;
  min-height: 0 !important;
}

/* Right panel: 2 cards per row on desktop */
.kh-index-rentals.kh-rentals-map-view #kh-rentals-map-list{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  /* Don’t “fit” cards into the viewport by shrinking them.
     Let the panel overflow and scroll (Zillow behavior). */
  align-content: start;
  align-items: start;
  grid-auto-rows: max-content;
  padding: 12px 8px 18px;
}

/* MapView: the Zillow-style header is injected inside #kh-rentals-map-list.
   Since the list is a 2-column grid on desktop, the header must span both
   columns so the cards start aligned (no staggered/masonry look). */
.kh-index-rentals.kh-rentals-map-view #kh-rentals-map-list .kh-map-list-header,
.kh-rentals-map-view #kh-rentals-map-list .kh-map-list-header{
  grid-column: 1 / -1;
  justify-self: stretch;
}

/* Map View: keep cards from collapsing when the map is zoomed out.
   (If the list panel is short, we want scrolling—not compressed cards.) */
.kh-index-rentals.kh-rentals-map-view #kh-rentals-map-list .kh-card-rental,
.kh-rentals-map-view #kh-rentals-map-list .kh-card-rental {
  min-height: 320px;
  flex: 0 0 auto;
}

/* Ensure the list panel is the scrolling container */
.kh-index-rentals.kh-rentals-map-view #kh-rentals-map-list,
.kh-rentals-map-view #kh-rentals-map-list {
  overflow-y: auto;
  overflow-x: hidden;
  min-height: 0;
}

/* Ensure loading/empty notices span both columns */
.kh-index-rentals.kh-rentals-map-view #kh-rentals-map-list .kh-map-list-loading,
.kh-index-rentals.kh-rentals-map-view #kh-rentals-map-list .kh-map-list-empty,
.kh-index-rentals.kh-rentals-map-view #kh-rentals-map-list .kh-map-list-hint{
  grid-column: 1 / -1;
}

/* If a card class exists, keep it tidy in grid */
.kh-index-rentals.kh-rentals-map-view #kh-rentals-map-list .kh-map-card{
  margin: 0 !important;
  width: 100%;
}

/* Single column on smaller screens */
@media (max-width: 1100px){
  .kh-index-rentals.kh-rentals-map-view #kh-rentals-map-list{
    grid-template-columns: 1fr;
  }
}

/* Map View: when JS sets .kh-rentals-map-view, treat the rentals wrapper as the app shell */
.kh-rentals-map-view .kh-wrapper.kh-index-rentals {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.kh-rentals-map-view .kh-wrapper.kh-index-rentals .kh-rentals-map-shell{
  flex: 1 1 auto;
  min-height: 0;
}


/* Map marker popup: card-style listing preview */
.leaflet-popup-content .kh-map-popup-card{
  width: 240px;
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 10px 30px rgba(0,0,0,.12);
}
.leaflet-popup-content .kh-map-popup-card .kh-card-media{
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 11;
  overflow: hidden;
  background: #f3f4f6;
}
.leaflet-popup-content .kh-map-popup-card .kh-card-media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display:block;
}
.leaflet-popup-content .kh-map-popup-body{
  padding: 10px 12px 12px;
}
.leaflet-popup-content .kh-map-popup-price{
  font-weight: 900;
  letter-spacing: .2px;
  font-size: 16px;
  line-height: 1.15;
  margin-bottom: 4px;
}
.leaflet-popup-content .kh-map-popup-badges{
  display:flex;
  flex-wrap:wrap;
  gap: 6px;
  margin-bottom: 6px;
}
.leaflet-popup-content .kh-map-popup-pill{
  font-size: 12px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.12);
  background: rgba(0,0,0,.04);
  line-height: 1.2;
}
.leaflet-popup-content .kh-map-popup-specs{
  font-size: 13px;
  opacity: .85;
  margin-bottom: 4px;
}
.leaflet-popup-content .kh-map-popup-loc{
  font-size: 13px;
  opacity: .75;
  margin-bottom: 8px;
}
.leaflet-popup-content .kh-map-popup-actions{
  display:flex;
  justify-content:flex-end;
}
.leaflet-popup-content .kh-map-popup-link{
  font-size: 13px;
  font-weight: 700;
  text-decoration:none;
}
.leaflet-popup-content{
  margin: 10px 12px;
}
.leaflet-popup-tip{
  box-shadow: 0 10px 30px rgba(0,0,0,.12);
}


/* --- Rentals mobile: hide duplicate top nav source (used only for cloning into bottom nav) --- */
.kh-mobile-nav-source{
  display:none !important;
  visibility:hidden !important;
  height:0 !important;
  overflow:hidden !important;
}

/* --- Rentals MapView: compact filters on small screens --- */
/* Some devices / browser emulation report widths >768 while still being effectively mobile.
   Use a slightly larger breakpoint so the Filters pill reliably appears. */
@media (max-width: 900px){
  .kh-classifieds-header-rentals .kh-classifieds-title{
    margin-bottom: 6px;
  }

  /* Hide the bulky inline filters on small screens (use modal instead) */
  .kh-rentals-header-form .kh-rentals-filter--price,
  .kh-rentals-header-form .kh-rentals-filter--beds,
  .kh-rentals-header-form .kh-rentals-filter--type,
  .kh-rentals-header-form .kh-rentals-filter--pets,
  .kh-rentals-header-form .kh-rentals-apply{
    display:none !important;
  }

  /* Make location row tighter */
  .kh-rentals-header-row{
    gap: 10px;
    align-items: center;
  }
  .kh-rentals-filter--location{
    flex: 1 1 auto;
    min-width: 0;
  }
  #kh_rentals_header_city{
    width: 100%;
  }

  .kh-rentals-mobile-filters-btn{
    display:flex !important;
  }
}

/* Mobile filters modal (rentals) */
.kh-rentals-mobile-filters-btn{
  display:none;
  align-items:center;
  justify-content:center;
  gap:8px;
  height: 42px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.10);
  background: rgba(255,255,255,0.96);
  box-shadow: 0 10px 24px rgba(0,0,0,0.12);
  font-weight: 800;
  cursor: pointer;
}

.kh-rentals-mobile-modal{
  position: fixed;
  left:0; right:0; top:0; bottom:0;
  z-index: 999999;
  display:none;
  background: rgba(0,0,0,0.45);
  padding: 18px;
}

.kh-rentals-mobile-modal.is-open{
  display:flex;
  align-items:flex-end;
}

.kh-rentals-mobile-modal-card{
  width:100%;
  max-width: 520px;
  margin: 0 auto;
  background: rgba(255,255,255,0.98);
  border-radius: 18px;
  box-shadow: 0 22px 60px rgba(0,0,0,0.25);
  overflow:hidden;
}

.kh-rentals-mobile-modal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 14px 14px 10px 14px;
  border-bottom: 1px solid rgba(0,0,0,0.08);
}

.kh-rentals-mobile-modal-title{
  font-weight: 900;
  font-size: 14px;
}

.kh-rentals-mobile-modal-close{
  background: transparent;
  border: none;
  font-size: 24px;
  line-height: 1;
  cursor:pointer;
  padding: 0 6px;
}

.kh-rentals-mobile-modal-body{
  padding: 12px 14px 14px 14px;
  display:flex;
  flex-direction:column;
  gap: 12px;
}

/* Ensure the Photos-only option always sits immediately above the Apply button,
   even if a theme or script appends it after the button. */
.kh-rentals-mobile-modal-body .kh-rentals-mobile-modal-row--photos{
  order: 9998;
}
.kh-rentals-mobile-modal-body .kh-rentals-mobile-apply{
  order: 9999;
}

.kh-rentals-mobile-modal-row{
  display:flex;
  gap: 10px;
  align-items:center;
}

.kh-rentals-mobile-modal-row .kh-rentals-filter{
  flex:1 1 0;
  min-width:0;
}

.kh-rentals-mobile-apply{
  margin-top: 6px;
  height: 46px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,0.10);
  background: rgba(0,115,170,0.95);
  color:#fff;
  font-weight: 900;
  cursor:pointer;
}



/* === v2.13.68: Rentals mobile UX polish (hide theme header + compact filters) ===
   Update: allow themes that provide a mobile app-bar (logo + hamburger/drawer) to keep the header.
   If the active theme adds `sb-mobile-drawer-enabled` to the body, we assume it has a mobile nav.
*/
@media (max-width: 980px){
  /* Hide the theme/site top navigation/header on rentals map view to avoid duplicate nav.
     BUT: keep it if the theme is providing its own mobile drawer/app-bar. */
  body.kh-rentals-map-view:not(.sb-mobile-drawer-enabled) header,
  body.kh-rentals-map-view:not(.sb-mobile-drawer-enabled) #masthead,
  body.kh-rentals-map-view:not(.sb-mobile-drawer-enabled) .site-header,
  body.kh-rentals-map-view:not(.sb-mobile-drawer-enabled) .wp-block-template-part,
  body.kh-rentals-map-view:not(.sb-mobile-drawer-enabled) .wp-block-navigation,
  body.kh-rentals-map-view:not(.sb-mobile-drawer-enabled) .wp-block-site-title,
  body.kh-rentals-map-view:not(.sb-mobile-drawer-enabled) .wp-block-site-logo {
    display: none !important;
  }

  /* Keep the header compact: show Location + Filters button only */
  .kh-rentals-map-view .kh-rentals-header-row{
    flex-wrap: wrap !important;
    overflow: visible !important;
  }
  .kh-rentals-map-view .kh-rentals-header-form .kh-rentals-filter--price,
  .kh-rentals-map-view .kh-rentals-header-form .kh-rentals-filter--beds,
  .kh-rentals-map-view .kh-rentals-header-form .kh-rentals-filter--type,
  .kh-rentals-map-view .kh-rentals-header-form .kh-rentals-filter--pets,
  .kh-rentals-map-view .kh-rentals-header-form .kh-rentals-apply{
    display:none !important;
  }

  .kh-rentals-map-view .kh-rentals-filters-btn, .kh-rentals-map-view .kh-rentals-mobile-filters-btn{
    display: inline-flex !important;
    align-items: center;
    gap: 0.4rem;
    padding: 0.55rem 0.85rem;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,0.14);
    background: rgba(255,255,255,0.92);
    font-weight: 750;
  }
  .kh-rentals-map-view .kh-rentals-filters-btn, .kh-rentals-map-view .kh-rentals-mobile-filters-btn .kh-rentals-filter-label{
    margin: 0;
  }
}

/* Rentals: mobile-only Filters pill (keeps header compact) */
.kh-rentals-filter--filtersbtn { display: none; }
@media (max-width: 980px){
  .kh-rentals-filter--filtersbtn { display: block; }
}

/* === v2.15.09: Rentals Map View - use Filters modal on ALL screen sizes ===
   IMPORTANT: the map view class lives on the wrapper div `.kh-rentals-map-view` (not always on <body>).
   So we target BOTH, to avoid the "shows for a millisecond" flash then disappears.
*/
body.kh-rentals-map-view .kh-rentals-header-form .kh-rentals-filter--price,
body.kh-rentals-map-view .kh-rentals-header-form .kh-rentals-filter--beds,
body.kh-rentals-map-view .kh-rentals-header-form .kh-rentals-filter--type,
body.kh-rentals-map-view .kh-rentals-header-form .kh-rentals-filter--pets,
body.kh-rentals-map-view .kh-rentals-header-form .kh-rentals-apply,
.kh-rentals-map-view .kh-rentals-header-form .kh-rentals-filter--price,
.kh-rentals-map-view .kh-rentals-header-form .kh-rentals-filter--beds,
.kh-rentals-map-view .kh-rentals-header-form .kh-rentals-filter--type,
.kh-rentals-map-view .kh-rentals-header-form .kh-rentals-filter--pets,
.kh-rentals-map-view .kh-rentals-header-form .kh-rentals-apply{
  display:none !important;
}

body.kh-rentals-map-view .kh-rentals-mobile-filters-btn,
.kh-rentals-map-view .kh-rentals-mobile-filters-btn{
  display:inline-flex !important;
}

/* v2.15.xx: On mobile, use the in-map Filters control only.
   Hide the header "Filters" pill to avoid duplicate / buggy modal behaviour. */
@media (max-width: 980px){
  .kh-rentals-map-view .kh-rentals-header-actions-right .kh-rentals-mobile-filters-btn,
  body.kh-rentals-map-view .kh-rentals-header-actions-right .kh-rentals-mobile-filters-btn{
    display: none !important;
  }
}

/*
 * v2.15.48+: Override map view mobile filters button visibility
 *
 * We removed the floating action buttons on the map and now rely on the header
 * actions (Filters, Clear, Create alert) across all views. The previous CSS
 * hid the header filters pill in map view on small screens to avoid duplicate
 * controls with the floating FAB. Since the FAB has been removed, we need
 * to re-enable the header filters button on mobile map views. The following
 * rule overrides the earlier `display:none` with `inline-flex` so the button
 * remains visible and aligned with the other actions.
 */
@media (max-width: 980px){
  .kh-rentals-map-view .kh-rentals-header-actions-right .kh-rentals-mobile-filters-btn,
  body.kh-rentals-map-view .kh-rentals-header-actions-right .kh-rentals-mobile-filters-btn {
    display: inline-flex !important;
  }
}



/* === v2.15.12: Rentals Map View - normalize City filter strings ("City, Region") === */
.kh-rentals-map-view .kh-classifieds-header-rentals{
  gap: 0.35rem;
  padding-top: 0;
}
.kh-rentals-map-view .kh-classifieds-header-rentals .kh-rentals-header-toolbar{
  margin-top: 0;
  padding-top: 0;
}
.kh-rentals-map-view .kh-rentals-header-row{
  align-items: center;
  flex-wrap: nowrap;
}
.kh-rentals-map-view .kh-rentals-header-left-controls{
  display:flex;
  align-items:center;
  gap: 0.55rem;
  flex: 1 1 auto;
  min-width: 260px;
}
.kh-rentals-map-view .kh-rentals-header-left-controls .kh-rentals-filter--location{
  flex: 1 1 320px;
  max-width: 520px;
  min-width: 220px;
}
.kh-rentals-map-view .kh-rentals-clear-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 0.55rem 0.85rem;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.14);
  background: rgba(255,255,255,0.92);
  font-weight: 750;
  text-decoration:none;
  color: inherit;
}
.kh-rentals-map-view .kh-rentals-filters-btn{
  display:inline-flex;
  align-items:center;
  gap: 0.4rem;
  padding: 0.55rem 0.85rem;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.14);
  background: rgba(255,255,255,0.92);
  font-weight: 750;
  cursor:pointer;
}
.kh-rentals-map-view .kh-rentals-location-grid{
  display:flex;
  align-items:center;
  gap: 0.5rem;
  flex-wrap: wrap;
  width: 100%;
}
.kh-rentals-map-view .kh-rentals-location-grid input{
  flex: 1 1 160px;
  min-width: 140px;
}

/* Map View: don't wrap the 3 location fields inside one giant pill */
.kh-rentals-map-view .kh-rentals-filter--location{
  border: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
  gap: 0.6rem;
}
.kh-rentals-map-view .kh-rentals-filter--location .dashicons{
  opacity: 0.75;
  margin-left: 0.35rem;
}
.kh-rentals-map-view .kh-rentals-location-grid input{
  border: 1px solid rgba(0,0,0,0.14);
  background: rgba(255,255,255,0.92);
  border-radius: 14px;
  padding: 0.62rem 0.85rem;
  box-shadow: 0 1px 0 rgba(0,0,0,0.03);
}

/* === v2.15.40: Rentals List View - match Map/Split header UI on mobile ===
   The List view wrapper is `.kh-index-rentals` (no `.kh-rentals-map-view` class),
   so we mirror the key map-view header styles to keep List/Split/Map identical.
*/
.kh-index-rentals .kh-rentals-header-row{
  align-items: center;
  flex-wrap: nowrap;
}
.kh-index-rentals .kh-rentals-header-left-controls{
  display:flex;
  align-items:center;
  gap: 0.55rem;
  flex: 1 1 auto;
  min-width: 260px;
}
.kh-index-rentals .kh-rentals-header-left-controls .kh-rentals-filter--location{
  flex: 1 1 320px;
  max-width: 520px;
  min-width: 220px;
}
.kh-index-rentals .kh-rentals-clear-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 0.55rem 0.85rem;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.14);
  background: rgba(255,255,255,0.92);
  font-weight: 750;
  text-decoration:none;
  color: inherit;
}
/* List view: don't wrap Location input inside a giant pill (match Map/Split look) */
.kh-index-rentals .kh-rentals-filter--location{
  border: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
  gap: 0.6rem;
}
.kh-index-rentals .kh-rentals-filter--location .dashicons{
  opacity: 0.75;
  margin-left: 0.35rem;
}
@media (max-width: 600px){
  .kh-index-rentals .kh-rentals-header-row{
    flex-wrap: wrap;
  }
  .kh-index-rentals .kh-rentals-header-left-controls{
    flex-wrap: wrap;
    gap: 0.5rem;
  }
  .kh-index-rentals .kh-rentals-header-left-controls .kh-rentals-filter--location{
    max-width: none;
    flex: 1 1 100%;
  }
}

/* Map View: style the Leaflet base-layer toggle to match the UI */
.kh-rentals-map-view .leaflet-control-layers{
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,0.14);
  box-shadow: 0 1px 0 rgba(0,0,0,0.03);
}
.kh-rentals-map-view .leaflet-control-layers-toggle{
  width: 36px;
  height: 36px;
}
/* On small screens, let the location fields stack nicely */
@media (max-width: 600px){
  .kh-rentals-map-view .kh-rentals-header-row{
    flex-wrap: wrap;
  }
  .kh-rentals-map-view .kh-rentals-header-left-controls{
    flex-wrap: wrap;
    gap: 0.5rem;
  }
  .kh-rentals-map-view .kh-rentals-header-left-controls .kh-rentals-filter--location{
    max-width: none;
    flex: 1 1 100%;
  }
  .kh-rentals-map-view .kh-rentals-location-grid input{
    flex: 1 1 100%;
    min-width: 0;
  }
}

/*
 * v2.15.50+: Prevent Clear pill from wrapping on map/split views at small widths.
 * The default small-screen rule above forces the location input to take up the
 * full width of the row, causing the Clear pill to wrap onto a new line.
 * We override this behaviour by keeping the left controls on a single row
 * and allowing the location input to flex based on available space.
 */
@media (max-width: 600px){
  .kh-rentals-map-view .kh-rentals-header-left-controls{
    flex-wrap: nowrap !important;
    gap: 0.5rem;
  }
  .kh-rentals-map-view .kh-rentals-header-left-controls .kh-rentals-filter--location{
    flex: 1 1 auto !important;
    max-width: none !important;
    min-width: 0 !important;
  }
}

/* Rentals Alerts UI */
.kh-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 14px;border-radius:12px;text-decoration:none;border:1px solid rgba(0,0,0,.12);font-weight:600;line-height:1}
.kh-btn-primary{background:#0b5cff;color:#fff;border-color:rgba(11,92,255,.35)}
.kh-btn-secondary{background:#fff;color:#111}
.kh-btn-danger{background:#fff;color:#b00020;border-color:rgba(176,0,32,.25)}
.kh-btn:hover{filter:brightness(.98)}
.kh-wrapper.kh-rentals-alert{max-width:900px}
.kh-alert-form{margin-top:14px;display:flex;flex-direction:column;gap:10px}
.kh-alert-criteria-card{padding:12px 14px;border:1px solid rgba(0,0,0,.12);border-radius:14px;background:#fff}
.kh-alert-criteria-title{font-weight:850;font-size:15px;margin-bottom:10px}
.kh-alert-criteria-card .kh-rentals-mobile-modal-row{margin:0}
.kh-alert-criteria-card .kh-rentals-filter{background:transparent;border:0;padding:0}
.kh-alert-criteria-card .kh-rentals-filter-label{min-width:86px}

/* Create Alert (mobile): prevent cramped filter rows by stacking fields and letting inputs fill width */
@media (max-width: 520px){
  .kh-alert-criteria-card{padding:12px}
  .kh-alert-criteria-card .kh-rentals-mobile-modal-row{
    flex-wrap:wrap;
    gap:12px;
    align-items:flex-start;
  }
  .kh-alert-criteria-card .kh-rentals-filter{
    flex:1 1 100%;
    min-width:0;
  }
  .kh-alert-criteria-card .kh-rentals-filter-label{
    display:block;
    min-width:0;
    margin:0 0 6px 0;
    white-space:normal;
  }
  .kh-alert-criteria-card .kh-rentals-filter-input,
  .kh-alert-criteria-card .kh-rentals-filter-select{
    width:100%;
    min-width:0;
  }
  .kh-alert-criteria-card .kh-rentals-filter--price{
    display:grid;
    grid-template-columns: 1fr auto 1fr;
    column-gap:10px;
    row-gap:0;
    align-items:center;
  }
  .kh-alert-criteria-card .kh-rentals-filter--price .kh-rentals-filter-label{
    grid-column:1 / -1;
  }
  .kh-alert-criteria-card .kh-alert-location-hint{
    margin-top:8px;
    line-height:1.35;
  }
}
.kh-field-label{font-weight:700;margin-top:6px}
.kh-input,.kh-select{width:100%;max-width:480px;padding:10px 12px;border-radius:12px;border:1px solid rgba(0,0,0,.15)}
.kh-alert-form-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}
.kh-alerts-list{margin-top:14px;display:flex;flex-direction:column;gap:10px}
.kh-alert-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border:1px solid rgba(0,0,0,.12);border-radius:14px;background:#fff}
.kh-alert-name{font-weight:800}
.kh-alert-summary{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.kh-alert-chip{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;border:1px solid rgba(0,0,0,.12);background:rgba(0,0,0,.03);font-size:12px;font-weight:650;line-height:1.2}
.kh-alert-meta{opacity:.8;font-size:14px;margin-top:2px}
.kh-alert-row-actions{display:flex;gap:8px;flex-wrap:wrap}
.kh-alert-success{padding:10px 12px;border-radius:12px;background:rgba(29,189,78,.10);border:1px solid rgba(29,189,78,.25)}
.kh-alert-error{padding:10px 12px;border-radius:12px;background:rgba(176,0,32,.08);border:1px solid rgba(176,0,32,.18)}
.kh-alert-location-hint{margin-top:6px;font-size:12px;opacity:.78;display:block;width:100%}
.kh-alert-location-crumb{display:block;font-weight:650}
.kh-alert-location-sub{display:block;margin-top:2px;opacity:.75}
.kh-alert-inline-error{margin-top:8px;font-size:13px;font-weight:650;color:#b00020}


/* MapView lazy-loaded thumbnails */
.kh-lazy-img {
  opacity: 0;
}
.kh-lazy-loading,
.kh-lazy-loaded {
  opacity: 1;
  transition: opacity .18s ease;
}




/* === Rentals card UI refresh (premium, less flat) === */
.kh-rentals-map-view #kh-rentals-map-list .kh-card-rental,
.kh-index-rentals .kh-cards .kh-card-rental {
  border-radius: 16px;
  border: 1px solid rgba(0,0,0,0.10);
  background: #fff;
  box-shadow: 0 6px 18px rgba(0,0,0,0.08);
  overflow: hidden;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
}

.kh-rentals-map-view #kh-rentals-map-list .kh-card-rental:hover,
.kh-index-rentals .kh-cards .kh-card-rental:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 34px rgba(0,0,0,0.14);
  border-color: rgba(0,0,0,0.14);
}

.kh-rentals-map-view #kh-rentals-map-list .kh-card-rental--polished .kh-card-media,
.kh-index-rentals .kh-cards .kh-card-rental--polished .kh-card-media {
  background: #f1f5f9;
}

.kh-rentals-map-view #kh-rentals-map-list .kh-card-rental--polished .kh-card-body,
.kh-index-rentals .kh-cards .kh-card-rental--polished .kh-card-body {
  padding: 12px 14px 14px;
  gap: 6px;
}

.kh-rentals-map-view #kh-rentals-map-list .kh-card-rental--polished .kh-card-price,
.kh-index-rentals .kh-cards .kh-card-rental--polished .kh-card-price {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.3px;
  line-height: 1.15;
  margin: 2px 0 2px;
}

.kh-rentals-map-view #kh-rentals-map-list .kh-card-rental--polished .kh-card-specs,
.kh-index-rentals .kh-cards .kh-card-rental--polished .kh-card-specs {
  font-size: 13px;
  font-weight: 600;
  color: rgba(0,0,0,0.62);
}

.kh-rentals-map-view #kh-rentals-map-list .kh-card-rental--polished .kh-card-location,
.kh-index-rentals .kh-cards .kh-card-rental--polished .kh-card-location {
  font-size: 12.5px;
  font-weight: 600;
  color: rgba(0,0,0,0.52);
}

.kh-rentals-map-view #kh-rentals-map-list .kh-card-rental--polished .kh-card-age,
.kh-index-rentals .kh-cards .kh-card-rental--polished .kh-card-age {
  font-size: 12px;
  font-weight: 600;
  color: rgba(0,0,0,0.45);
  margin-top: 4px;
}

.kh-rentals-map-view #kh-rentals-map-list .kh-card-badge,
.kh-index-rentals .kh-cards .kh-card-badge {
  box-shadow: 0 10px 22px rgba(0,0,0,0.18);
}

.kh-rentals-map-view #kh-rentals-map-list .kh-card-heart,
.kh-index-rentals .kh-cards .kh-card-heart {
  box-shadow: 0 10px 22px rgba(0,0,0,0.12);
}

.kh-rentals-map-view #kh-rentals-map-list .kh-card-rental--polished .kh-card-thumb img,
.kh-index-rentals .kh-cards .kh-card-rental--polished .kh-card-thumb img,
.kh-rentals-map-view #kh-rentals-map-list .kh-card-rental--polished .kh-card-carousel-img,
.kh-index-rentals .kh-cards .kh-card-rental--polished .kh-card-carousel-img {
  transition: transform 0.22s ease;
}

.kh-rentals-map-view #kh-rentals-map-list .kh-card-rental--polished:hover .kh-card-thumb img,
.kh-index-rentals .kh-cards .kh-card-rental--polished:hover .kh-card-thumb img,
.kh-rentals-map-view #kh-rentals-map-list .kh-card-rental--polished:hover .kh-card-carousel-img,
.kh-index-rentals .kh-cards .kh-card-rental--polished:hover .kh-card-carousel-img {
  transform: scale(1.03);
}

/* === End rentals card UI refresh === */


/* Rentals mode badge (My Account) */
.kh-mode-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:2px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  line-height:1.8;
  margin-left:10px;
  vertical-align:middle;
  border:1px solid rgba(0,0,0,0.10);
  background:rgba(0,0,0,0.04);
}
.kh-mode-badge.kh-mode-renter{
  border-color:rgba(0, 120, 255, 0.25);
  background:rgba(0, 120, 255, 0.08);
}
.kh-mode-badge.kh-mode-landlord{
  border-color:rgba(120, 80, 255, 0.25);
  background:rgba(120, 80, 255, 0.08);
}



/* Rentals toolbar: prevent "squashed" controls on very small screens */
@media (max-width: 520px) {
  .kh-rentals-header-row {
    flex-wrap: wrap !important;
    overflow-x: visible !important;
  }

  .kh-rentals-filter--location {
    flex: 1 1 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .kh-rentals-filter--clear,
  .kh-rentals-filter--filtersbtn {
    flex: 1 1 calc(50% - 10px) !important;
    min-width: 0 !important;
  }

  .kh-rentals-view-toggle,
  .kh-rentals-header-actions {
    width: 100%;
  }

  .kh-rentals-header-actions {
    justify-content: space-between;
    flex-wrap: wrap;
  }

  .kh-rentals-action-link {
    flex: 1 1 auto;
    justify-content: center;
  }
}

/*
 * v2.15.49: Make the Create Alert pill span the full width of the actions
 * row on Split and Map views (mobile). On the list view, the alert pill
 * already wraps beneath the view toggle and fills the available space on
 * narrow screens. To mirror this behaviour on split/map, we scope similar
 * width/justify overrides to the map view wrapper. The selector matches
 * the map view wrapper on both map-only and split layouts.
 */
@media (max-width: 520px) {
  .kh-wrapper.kh-index-rentals.kh-rentals-map-view .kh-rentals-header-row {
    flex-wrap: wrap !important;
    overflow-x: visible !important;
  }
  .kh-wrapper.kh-index-rentals.kh-rentals-map-view .kh-rentals-view-toggle,
  .kh-wrapper.kh-index-rentals.kh-rentals-map-view .kh-rentals-header-actions {
    width: 100%;
  }
  .kh-wrapper.kh-index-rentals.kh-rentals-map-view .kh-rentals-header-actions {
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .kh-wrapper.kh-index-rentals.kh-rentals-map-view .kh-rentals-action-link {
    flex: 1 1 auto;
    justify-content: center;
  }
}


/* -------------------------------------------------------------------------
   Rentals Map: Mobile floating action buttons (Search / Filters / Clear / Alert)
   ------------------------------------------------------------------------- */
@media (max-width: 782px) {
  .kh-index-rentals.kh-rentals-map-view .kh-rentals-mobile-focusbar {
    display: none;
  }
  .kh-index-rentals.kh-rentals-map-view .kh-rentals-map-shell {
    position: relative;
  }
  .kh-index-rentals.kh-rentals-map-view .kh-rentals-map-fab {
    position: absolute;
    right: 12px;
    bottom: 120px;
    z-index: 999;
    display: flex;
    flex-direction: column;
    gap: 10px;
    pointer-events: auto;
  }
  .kh-index-rentals.kh-rentals-map-view .kh-rentals-map-fab-btn {
    width: 44px;
    height: 44px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid rgba(0,0,0,0.12);
    box-shadow: 0 6px 18px rgba(0,0,0,0.12);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: inherit;
  }
  .kh-index-rentals.kh-rentals-map-view .kh-rentals-map-fab-btn:active {
    transform: translateY(1px);
  }
  .kh-index-rentals.kh-rentals-map-view .kh-rentals-map-fab-btn .dashicons {
    font-size: 20px;
    width: 20px;
    height: 20px;
  }

  /* Make the Clear action obvious: turn it into a small pill with text so
     users aren't relying on Dashicons rendering correctly on the frontend. */
  .kh-index-rentals.kh-rentals-map-view .kh-rentals-map-fab-btn.kh-rentals-map-fab-clear {
    width: auto;
    padding: 0 12px;
    border-radius: 999px;
    gap: 6px;
  }
  .kh-index-rentals.kh-rentals-map-view .kh-rentals-map-fab-text {
    font-size: 12px;
    line-height: 1;
    font-weight: 600;
    white-space: nowrap;
  }
}


/* Airbnb-style listing gallery (Rentals) */
.kh-airbnb-gallery{position:relative;margin:0 0 18px 0}
.kh-airbnb-grid{display:grid;grid-template-columns: 1.6fr 1fr;gap:10px;border-radius:14px;overflow:hidden}
.kh-airbnb-hero{display:block;position:relative;min-height:320px}
.kh-airbnb-side{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;gap:10px}
.kh-airbnb-tile{display:block;position:relative;min-height:155px}
.kh-airbnb-img{width:100%;height:100%;object-fit:cover;display:block}
.kh-airbnb-video-tile{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:rgba(0,0,0,.35)}
.kh-airbnb-video-play{width:54px;height:54px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.92);font-size:18px;font-weight:900}
.kh-airbnb-video-label{color:#fff;font-weight:800;font-size:12px;letter-spacing:.02em;text-transform:uppercase;opacity:.95}
.kh-airbnb-showall{position:absolute;right:14px;bottom:14px;border:1px solid rgba(0,0,0,.12);background:#fff;padding:10px 12px;border-radius:10px;font-weight:600;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.12);display:flex;gap:8px;align-items:center}
.kh-airbnb-showall:hover{box-shadow:0 10px 26px rgba(0,0,0,.16)}
.kh-airbnb-showall-ico{font-size:18px;line-height:0}
.kh-airbnb-showall-count{opacity:.7;font-weight:700}
.kh-airbnb-img-blur{filter: blur(24px) brightness(1.05) contrast(.85);transform: scale(1.08)}
.kh-airbnb-gallery-locked{border-radius:14px;overflow:hidden}
.kh-airbnb-lock-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:rgba(255,255,255,.72);backdrop-filter: blur(6px)}
.kh-airbnb-lock-icon{font-size:30px}
.kh-airbnb-lock-text{font-weight:700}

/* Modal (Show all photos) */
#kh-airbnb-modal{position:fixed;inset:0;z-index:999999;display:none}
#kh-airbnb-modal.is-open{display:block}
#kh-airbnb-modal .kh-airbnb-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.7)}
#kh-airbnb-modal .kh-airbnb-modal-card{position:relative;max-width:1100px;margin:40px auto;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.35)}
#kh-airbnb-modal .kh-airbnb-modal-top{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid rgba(0,0,0,.08)}
#kh-airbnb-modal .kh-airbnb-modal-title{font-weight:800}
#kh-airbnb-modal .kh-airbnb-modal-close{border:1px solid rgba(0,0,0,.15);background:#fff;border-radius:10px;padding:8px 10px;cursor:pointer}
#kh-airbnb-modal .kh-airbnb-modal-body{display:grid;grid-template-columns: 1.3fr 1fr;gap:12px;padding:16px}
#kh-airbnb-modal .kh-airbnb-modal-main{border-radius:14px;overflow:hidden;min-height:420px}
#kh-airbnb-modal .kh-airbnb-modal-stage{position:relative;width:100%;height:100%;min-height:420px;background:#000;display:flex;align-items:center;justify-content:center}
#kh-airbnb-modal .kh-airbnb-modal-image{width:100%;height:100%;object-fit:cover;display:block}
#kh-airbnb-modal .kh-airbnb-modal-video{width:100%;height:100%;display:block;object-fit:contain;background:#000}
#kh-airbnb-modal .kh-airbnb-modal-main{position:relative}
#kh-airbnb-modal .kh-airbnb-modal-nav{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:999px;border:1px solid rgba(0,0,0,.15);background:rgba(255,255,255,.9);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:22px;line-height:1;box-shadow:0 10px 26px rgba(0,0,0,.11)}
#kh-airbnb-modal .kh-airbnb-modal-nav.prev{left:12px}
#kh-airbnb-modal .kh-airbnb-modal-nav.next{right:12px}
#kh-airbnb-modal .kh-airbnb-modal-count{position:absolute;right:12px;bottom:12px;background:rgba(0,0,0,.65);color:#fff;padding:6px 8px;border-radius:10px;font-weight:700;font-size:12px}
#kh-airbnb-modal .kh-airbnb-modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-height:420px;overflow:auto;padding-right:6px}
#kh-airbnb-modal .kh-airbnb-modal-thumb{border-radius:12px;overflow:hidden;cursor:pointer;border:2px solid transparent}
#kh-airbnb-modal .kh-airbnb-modal-thumb.is-active{border-color: rgba(0,0,0,.35)}
#kh-airbnb-modal .kh-airbnb-modal-thumb img{width:100%;height:140px;object-fit:cover;display:block}
#kh-airbnb-modal .kh-airbnb-modal-thumb-video{width:100%;height:140px;display:flex;align-items:center;justify-content:center;gap:8px;flex-direction:column;background:rgba(0,0,0,.65);background-size:cover;background-position:center;position:relative}
#kh-airbnb-modal .kh-airbnb-modal-thumb-video::after{content:'';position:absolute;inset:0;background:rgba(0,0,0,.35)}
#kh-airbnb-modal .kh-airbnb-modal-thumb-video .kh-airbnb-play{position:relative;z-index:2;width:42px;height:42px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.92);font-weight:900}
#kh-airbnb-modal .kh-airbnb-modal-thumb-video .kh-airbnb-label{position:relative;z-index:2;color:#fff;font-weight:800;font-size:11px;letter-spacing:.02em;text-transform:uppercase}

@media (max-width: 900px){
  .kh-airbnb-grid{grid-template-columns:1fr}
  .kh-airbnb-side{grid-template-columns:repeat(4,1fr);gap:8px}
  .kh-airbnb-hero{min-height:260px}
  .kh-airbnb-tile{min-height:90px}
  #kh-airbnb-modal .kh-airbnb-modal-card{margin:18px;max-width:none}
  #kh-airbnb-modal .kh-airbnb-modal-body{grid-template-columns:1fr}
  #kh-airbnb-modal .kh-airbnb-modal-grid{grid-template-columns:repeat(3,1fr);max-height:240px}
  #kh-airbnb-modal .kh-airbnb-modal-thumb img{height:90px}
  #kh-airbnb-modal .kh-airbnb-modal-thumb-video{height:90px}
}

/* --- ClassiCore: constrain Airbnb modal media on smaller viewports --- */
#kh-airbnb-modal .kh-airbnb-modal-card{
  max-height: calc(100vh - 48px);
}
#kh-airbnb-modal .kh-airbnb-modal-body{
  max-height: calc(100vh - 120px);
  overflow: auto;
}
#kh-airbnb-modal .kh-airbnb-modal-main{
  min-height: 0 !important;
}
#kh-airbnb-modal .kh-airbnb-modal-stage{
  height: clamp(240px, 60vh, 520px);
  max-height: calc(100vh - 160px);
}
#kh-airbnb-modal .kh-airbnb-modal-image,
#kh-airbnb-modal .kh-airbnb-modal-video{
  max-width: 100%;
  max-height: 100%;
  width: 100%;
  height: 100%;
}
#kh-airbnb-modal .kh-airbnb-modal-image{ object-fit: contain; background:#000; }
#kh-airbnb-modal .kh-airbnb-modal-video{ object-fit: contain; background:#000; }
@media (max-width: 980px){
  #kh-airbnb-modal .kh-airbnb-modal-body{
    grid-template-columns: 1fr;
  }
}


/* Renew action contrast fix */
.kh-action-renew,
.kh-action-renew a,
.kh-renew-button {
    background:#e6f2ff !important;
    color:#0b5ed7 !important;
    border:1px solid #cfe2ff !important;
}
.kh-action-renew:hover,
.kh-action-renew a:hover,
.kh-renew-button:hover {
    background:#d0e7ff !important;
    color:#084298 !important;
}





/* Mobile: Map-only mode stability (safe)
   Keep Leaflet visible on phones without forcing viewport-locked shells.
*/
@media (max-width: 768px) {
  html.kh-rentals-maponly-mobile,
  body.kh-rentals-maponly-mobile {
    overscroll-behavior-y: none;
  }

  .kh-index-rentals.kh-rentals-map-view.kh-rentals-map-layout-map #kh-rentals-map {
    height: clamp(320px, 52vh, 560px) !important;
    min-height: 320px;
    background: #eef3f8;
  }
}


/* === v2.15.41: Rentals List View (mobile) - match Map/Split header alignment === */
.kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) .kh-rentals-header-row{
  align-items: center;
  flex-wrap: nowrap;
  justify-content: space-between;
  width: 100%;
}
.kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) .kh-rentals-header-left-controls{
  display:flex;
  align-items:center;
  gap: 0.55rem;
  flex: 1 1 auto;
  min-width: 260px;
}
.kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) .kh-rentals-header-left-controls .kh-rentals-filter--location{
  flex: 1 1 320px;
  max-width: 520px;
  min-width: 220px;
}
.kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) .kh-rentals-clear-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 0.55rem 0.85rem;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.14);
  background: rgba(255,255,255,0.92);
  font-weight: 750;
  text-decoration:none;
  color: inherit;
}
.kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) .kh-rentals-header-row-right{
  display:flex;
  align-items:center;
  flex: 0 0 auto;
}
.kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) .kh-rentals-filters-btn{
  display:inline-flex;
  align-items:center;
  gap: 0.4rem;
  padding: 0.55rem 0.85rem;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.14);
  background: rgba(255,255,255,0.92);
  font-weight: 750;
  cursor:pointer;
}
/*
 * When viewing rentals in the list-only layout (i.e. not the map view),
 * the header actions (List/Split/Map toggle + alert button) were occupying
 * the full width of the toolbar. This forced them onto a new row and caused
 * the Clear and Filters pills to misalign relative to the view toggle
 * group. To mirror the split and map views, constrain the actions block to
 * its natural size and allow it to align to the right via auto margins.
 */
.kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) .kh-rentals-header-actions {
  /* Let the actions size themselves based on their content rather than
     stretching across the full toolbar. */
  width: auto;
  /* Use the default horizontal gap and rely on the surrounding flex
     container (kh-rentals-header-toolbar) to handle spacing. */
  justify-content: flex-start;
}

/* === v2.15.48: Rentals Map/Split View (mobile) - unify header layout === */
/* Align the header row contents (location + clear + filters/view-toggle/alert) consistently
   across list, split and map views. Without these overrides the map view
   header can wrap unpredictably when new actions are added. */
.kh-wrapper.kh-index-rentals.kh-rentals-map-view .kh-rentals-header-row {
  align-items: center;
  flex-wrap: nowrap;
  justify-content: space-between;
  width: 100%;
}
/* Constrain the actions group to its content width in map view, just like list view. */
.kh-wrapper.kh-index-rentals.kh-rentals-map-view .kh-rentals-header-actions {
  width: auto;
  justify-content: flex-start;
}
.kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) .kh-rentals-header-actions-right {
  /* Push the right-aligned actions group (view toggle + alert) to the far
     edge of the toolbar. */
  margin-left: auto;
  /* Avoid stretching the group across the entire row, which would wrap
     adjacent elements underneath. */
  width: auto;
}


/* --------------------------------------------------------------------------
 * ClassiCore vertical app shell: fill the available browser canvas
 * --------------------------------------------------------------------------
 * On clean/blank WordPress pages the vertical browse screens should behave
 * like full applications instead of narrow content cards. This gives each
 * vertical the full horizontal canvas and enough vertical space to adapt to
 * the current browser height, while leaving detail/forms/account/admin pages
 * in their existing card layouts.
 */
:root {
  --kh-app-safe-vh: 100vh;
}

@supports (height: 100dvh) {
  :root {
    --kh-app-safe-vh: 100dvh;
  }
}

.kh-wrapper.kh-index,
.kh-wrapper.kh-index-rentals,
.kh-wrapper.kh-index-rentals.kh-rentals-map-view {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  box-sizing: border-box;
}

.kh-wrapper.kh-index {
  min-height: var(--kh-app-safe-vh);
  border-radius: 0;
}

body.admin-bar .kh-wrapper.kh-index {
  min-height: calc(var(--kh-app-safe-vh) - 32px);
}

@media (max-width: 782px) {
  body.admin-bar .kh-wrapper.kh-index {
    min-height: calc(var(--kh-app-safe-vh) - 46px);
  }
}

/* Make the core vertical layout stretch naturally inside the full app shell. */
.kh-wrapper.kh-index > .kh-layout,
.kh-wrapper.kh-index .kh-main {
  min-height: 0;
}

.kh-wrapper.kh-index > .kh-layout {
  width: 100%;
}

/* Desktop/tablet map experience: use the dynamic browser viewport when possible. */
@media (min-width: 769px) {
  .kh-wrapper.kh-index-rentals.kh-rentals-map-view {
    height: var(--kh-app-safe-vh);
    min-height: var(--kh-app-safe-vh);
  }

  body.admin-bar .kh-wrapper.kh-index-rentals.kh-rentals-map-view {
    height: calc(var(--kh-app-safe-vh) - 32px);
    min-height: calc(var(--kh-app-safe-vh) - 32px);
  }
}

@media (min-width: 769px) and (max-width: 782px) {
  body.admin-bar .kh-wrapper.kh-index-rentals.kh-rentals-map-view {
    height: calc(var(--kh-app-safe-vh) - 46px);
    min-height: calc(var(--kh-app-safe-vh) - 46px);
  }
}

/* Mobile/tablet safety: prevent full-bleed wrappers from causing side-scroll. */
@media (max-width: 980px) {
  .kh-wrapper.kh-index,
  .kh-wrapper.kh-index-rentals {
    overflow-x: clip;
  }
}

/* -------------------------------------------------------------------------- */
/* ClassiCore Canvas theme integration                                         */
/* -------------------------------------------------------------------------- */
body.classicore-canvas-theme,
body.classicore-canvas-theme.classicore-app-canvas {
  margin: 0;
  min-width: 320px;
  min-height: var(--kh-app-safe-vh);
  overflow-x: hidden;
  background: #f6f8fb;
}

body.classicore-canvas-theme.classicore-app-canvas .classicore-canvas-app,
body.classicore-canvas-theme.classicore-app-canvas .classicore-canvas-content {
  width: 100%;
  min-height: var(--kh-app-safe-vh);
  margin: 0;
  padding: 0;
}

body.admin-bar.classicore-canvas-theme.classicore-app-canvas .classicore-canvas-app,
body.admin-bar.classicore-canvas-theme.classicore-app-canvas .classicore-canvas-content {
  min-height: calc(var(--kh-app-safe-vh) - 32px);
}

@media (max-width: 782px) {
  body.admin-bar.classicore-canvas-theme.classicore-app-canvas .classicore-canvas-app,
  body.admin-bar.classicore-canvas-theme.classicore-app-canvas .classicore-canvas-content {
    min-height: calc(var(--kh-app-safe-vh) - 46px);
  }
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index-rentals,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index-rentals.kh-rentals-map-view {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  min-height: inherit;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index > .kh-layout {
  min-height: inherit;
  border-radius: 0;
}

@media (min-width: 769px) {
  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index-rentals.kh-rentals-map-view {
    height: inherit;
    min-height: inherit;
  }
}


/* -------------------------------------------------------------------------- */
/* ClassiCore Canvas hardening: escape Elementor/theme boxed containers         */
/* -------------------------------------------------------------------------- */
body.classicore-canvas-theme.classicore-app-page,
body.classicore-canvas-theme.classicore-app-canvas {
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden;
}

body.classicore-canvas-theme.classicore-app-page .entry-content,
body.classicore-canvas-theme.classicore-app-page .page-content,
body.classicore-canvas-theme.classicore-app-page .post-content,
body.classicore-canvas-theme.classicore-app-page .wp-block-post-content,
body.classicore-canvas-theme.classicore-app-page .wp-site-blocks,
body.classicore-canvas-theme.classicore-app-page .site,
body.classicore-canvas-theme.classicore-app-page .site-content,
body.classicore-canvas-theme.classicore-app-page .content-area,
body.classicore-canvas-theme.classicore-app-page main,
body.classicore-canvas-theme.classicore-app-page #primary,
body.classicore-canvas-theme.classicore-app-page .classicore-canvas-app,
body.classicore-canvas-theme.classicore-app-page .classicore-canvas-content,
body.classicore-canvas-theme.classicore-app-page .elementor,
body.classicore-canvas-theme.classicore-app-page .elementor-section,
body.classicore-canvas-theme.classicore-app-page .elementor-container,
body.classicore-canvas-theme.classicore-app-page .elementor-column,
body.classicore-canvas-theme.classicore-app-page .elementor-widget-wrap,
body.classicore-canvas-theme.classicore-app-page .elementor-widget,
body.classicore-canvas-theme.classicore-app-page .elementor-widget-container,
body.classicore-canvas-theme.classicore-app-page .e-con,
body.classicore-canvas-theme.classicore-app-page .e-con-inner {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

body.classicore-canvas-theme.classicore-app-page .elementor-section.elementor-section-boxed > .elementor-container,
body.classicore-canvas-theme.classicore-app-page .e-con > .e-con-inner {
  max-width: none !important;
}

@media (min-width: 769px) {
  body.classicore-canvas-theme.classicore-app-page.kh-rentals-map-view,
  body.classicore-canvas-theme.classicore-app-page.kh-rentals-map-view .classicore-canvas-site,
  body.classicore-canvas-theme.classicore-app-page.kh-rentals-map-view .classicore-canvas-app,
  body.classicore-canvas-theme.classicore-app-page.kh-rentals-map-view .classicore-canvas-content,
  body.classicore-canvas-theme.classicore-app-page.kh-rentals-map-view .entry-content,
  body.classicore-canvas-theme.classicore-app-page.kh-rentals-map-view .elementor,
  body.classicore-canvas-theme.classicore-app-page.kh-rentals-map-view .elementor-section,
  body.classicore-canvas-theme.classicore-app-page.kh-rentals-map-view .elementor-container,
  body.classicore-canvas-theme.classicore-app-page.kh-rentals-map-view .elementor-widget-wrap,
  body.classicore-canvas-theme.classicore-app-page.kh-rentals-map-view .elementor-widget-container,
  body.classicore-canvas-theme.classicore-app-page.kh-rentals-map-view .e-con,
  body.classicore-canvas-theme.classicore-app-page.kh-rentals-map-view .e-con-inner {
    min-height: calc(100vh - 32px) !important;
    overflow: hidden !important;
  }

  body.classicore-canvas-theme.classicore-app-page.kh-rentals-map-view:not(.admin-bar),
  body.classicore-canvas-theme.classicore-app-page.kh-rentals-map-view:not(.admin-bar) .classicore-canvas-site,
  body.classicore-canvas-theme.classicore-app-page.kh-rentals-map-view:not(.admin-bar) .classicore-canvas-app,
  body.classicore-canvas-theme.classicore-app-page.kh-rentals-map-view:not(.admin-bar) .classicore-canvas-content {
    min-height: 100vh !important;
  }

  body.classicore-canvas-theme.classicore-app-page .kh-wrapper.kh-index-rentals,
  body.classicore-canvas-theme.classicore-app-page .kh-wrapper.kh-index-rentals.kh-rentals-map-view {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
  }
}

/* -------------------------------------------------------------------------- */
/* ClassiCore Canvas / Rentals Map hard override                               */
/* -------------------------------------------------------------------------- */
/* If a later stylesheet/script or a non-canvas theme tries to re-box the map
   page after first paint, these rules keep the rentals app in a real viewport
   shell. Scoped to the map view so ordinary listing/detail pages keep their
   normal card layout. */
@media (min-width: 769px) {
  html:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view),
  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) {
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
  }

  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) #page,
  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .site,
  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .site-content,
  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .content-area,
  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .site-main,
  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) main,
  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) #primary,
  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .entry-content,
  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .wp-site-blocks,
  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .classicore-canvas-site,
  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .classicore-canvas-app,
  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .classicore-canvas-content,
  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .kh-layout,
  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .kh-main {
    width: 100vw !important;
    max-width: none !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .kh-layout,
  body:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .kh-main {
    display: block !important;
    height: calc(100vh - var(--wp-admin--admin-bar--height, 0px)) !important;
  }

  body.admin-bar:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .kh-layout,
  body.admin-bar:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .kh-main {
    height: calc(100vh - 32px) !important;
  }

  .kh-wrapper.kh-index-rentals.kh-rentals-map-view {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100vw !important;
    max-width: none !important;
    min-width: 0 !important;
    height: calc(100vh - var(--wp-admin--admin-bar--height, 0px)) !important;
    max-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px)) !important;
    margin: 0 !important;
    padding: 0 !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  body.admin-bar .kh-wrapper.kh-index-rentals.kh-rentals-map-view {
    height: calc(100vh - 32px) !important;
    max-height: calc(100vh - 32px) !important;
  }

  .kh-wrapper.kh-index-rentals.kh-rentals-map-view .kh-rentals-map-shell {
    flex: 1 1 auto !important;
    width: 100vw !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  .kh-wrapper.kh-index-rentals.kh-rentals-map-view #kh-rentals-map,
  .kh-wrapper.kh-index-rentals.kh-rentals-map-view .kh-rentals-map {
    min-width: 0 !important;
    max-width: none !important;
    border-radius: 0 !important;
  }
}


/* === ClassiCore Canvas app-shell polish: rentals map/split views === */
body.classicore-canvas-theme.kh-rentals-map-view .classicore-canvas-topbar,
body.kh-rentals-map-view .classicore-canvas-topbar {
  display: flex !important;
}

@media (min-width: 769px) {
  body.classicore-canvas-theme.kh-rentals-map-view,
  body.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) {
    background: #f4f7fb;
  }

  body.classicore-canvas-theme .kh-wrapper.kh-index-rentals.kh-rentals-map-view {
    display: flex !important;
    flex-direction: column !important;
    width: 100vw !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: #f4f7fb !important;
  }

  body.classicore-canvas-theme .kh-index-rentals.kh-rentals-map-view .kh-classifieds-header {
    flex: 0 0 auto !important;
    width: 100vw !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 10px 18px 8px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(15,23,42,0.08) !important;
    border-radius: 0 !important;
    background: rgba(255,255,255,0.96) !important;
    box-shadow: 0 8px 22px rgba(15,23,42,0.06) !important;
    z-index: 80 !important;
  }

  body.classicore-canvas-theme .kh-index-rentals.kh-rentals-map-view .kh-classifieds-title {
    font-size: 13px !important;
    line-height: 1.1 !important;
    margin: 0 0 6px !important;
    letter-spacing: -0.01em !important;
  }

  body.classicore-canvas-theme .kh-index-rentals.kh-rentals-map-view .kh-rentals-header-toolbar,
  body.classicore-canvas-theme .kh-index-rentals.kh-rentals-map-view .kh-rentals-header-form,
  body.classicore-canvas-theme .kh-index-rentals.kh-rentals-map-view .kh-rentals-header-row {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.classicore-canvas-theme .kh-index-rentals.kh-rentals-map-view .kh-rentals-header-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
  }

  body.classicore-canvas-theme .kh-index-rentals.kh-rentals-map-view .kh-rentals-header-left-controls {
    min-width: 320px !important;
    max-width: min(46vw, 680px) !important;
  }

  body.classicore-canvas-theme .kh-index-rentals.kh-rentals-map-view .kh-rentals-header-row-right,
  body.classicore-canvas-theme .kh-index-rentals.kh-rentals-map-view .kh-rentals-header-actions-right {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
    margin: 0 !important;
  }

  body.classicore-canvas-theme .kh-index-rentals.kh-rentals-map-view .kh-rentals-map-shell {
    flex: 1 1 auto !important;
    width: 100vw !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    overflow: hidden !important;
    background: #eef3f8 !important;
  }

  body.classicore-canvas-theme .kh-index-rentals.kh-rentals-map-view #kh-rentals-map-list {
    margin: 0 !important;
    border-radius: 0 !important;
    border-width: 0 1px 0 0 !important;
    box-shadow: none !important;
    background: #fff !important;
    padding: 16px !important;
  }

  body.classicore-canvas-theme .kh-index-rentals.kh-rentals-map-view .kh-rentals-splitter {
    border-radius: 0 !important;
    background: #eef2f7 !important;
  }

  body.classicore-canvas-theme .kh-index-rentals.kh-rentals-map-view #kh-rentals-map {
    border-radius: 0 !important;
    box-shadow: none !important;
    min-width: 0 !important;
  }
}

@media (max-width: 768px) {
  body.classicore-canvas-theme .kh-index-rentals.kh-rentals-map-view .kh-classifieds-header {
    margin-top: 0 !important;
    border-radius: 0 !important;
  }
}

/* === ClassiCore Canvas mobile split scroll fix ============================
   On phones the rentals split/map view is a normal vertical document: toolbar,
   map, then listing cards. The fixed bottom app nav can otherwise cover the
   final card because some earlier app-shell rules were viewport-oriented.
   This keeps mobile document scrolling open and adds safe breathing room below
   the listings. */
@media (max-width: 768px) {
  html.kh-rentals-map-view,
  body.kh-rentals-map-view,
  body.kh-rentals-map-view.classicore-canvas-theme {
    height: auto !important;
    min-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.kh-rentals-map-view .classicore-canvas-site,
  body.kh-rentals-map-view .classicore-canvas-app,
  body.kh-rentals-map-view .classicore-canvas-content,
  body.kh-rentals-map-view .kh-layout,
  body.kh-rentals-map-view .kh-main,
  body.kh-rentals-map-view .kh-wrapper.kh-index-rentals.kh-rentals-map-view {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.kh-rentals-map-view .kh-wrapper.kh-index-rentals.kh-rentals-map-view {
    display: block !important;
    padding-bottom: calc(104px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body.kh-rentals-map-view .kh-index-rentals.kh-rentals-map-view .kh-rentals-map-shell {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.kh-rentals-map-view .kh-index-rentals.kh-rentals-map-view .kh-rentals-map-list,
  body.kh-rentals-map-view .kh-index-rentals.kh-rentals-map-view #kh-rentals-map-list {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    padding-bottom: calc(112px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body.kh-bottom-actions-active {
    padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)) !important;
  }
}


/* ClassiCore floating footer strip
   Keep the branding/license strip pinned to the viewport edge instead of
   allowing it to render inside cards, maps, or listing content. */
body.classicore-canvas-theme .classicore-footer-wrapper,
body.kh-rentals-map-view .classicore-footer-wrapper,
.classicore-footer-wrapper.classicore-footer-floating {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  z-index: 99990 !important;
  margin: 0 !important;
  padding: 5px 20px !important;
  min-height: 24px !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-top: 1px solid rgba(15, 23, 42, 0.10) !important;
  box-shadow: 0 -8px 24px rgba(15, 23, 42, 0.05) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  color: #1f2937 !important;
  pointer-events: auto;
}

body.classicore-canvas-theme .classicore-footer-wrapper *,
body.kh-rentals-map-view .classicore-footer-wrapper * {
  font-size: 11px !important;
  line-height: 1.2 !important;
}

body.classicore-canvas-theme .classicore-canvas-content,
body.classicore-canvas-theme .kh-wrapper,
body.kh-rentals-map-view .kh-wrapper {
  padding-bottom: 30px;
}

/* Previous map-mode rules hid the footer on desktop. The floating footer is
   now intentionally viewport-pinned, so it should stay visible. */
@media (min-width: 769px) {
  .kh-wrapper.kh-index-rentals.kh-rentals-map-view + .classicore-footer-wrapper {
    display: flex !important;
  }
}

@media (max-width: 768px) {
  body.classicore-canvas-theme .classicore-footer-wrapper,
  body.kh-rentals-map-view .classicore-footer-wrapper {
    padding: 4px 14px !important;
    min-height: 22px !important;
  }

  body.classicore-canvas-theme .classicore-footer-wrapper *,
  body.kh-rentals-map-view .classicore-footer-wrapper * {
    font-size: 10.5px !important;
  }

  body.classicore-canvas-theme .classicore-canvas-content,
  body.classicore-canvas-theme .kh-wrapper,
  body.kh-rentals-map-view .kh-wrapper {
    padding-bottom: 34px;
  }

  /* Logged-in mobile already has a dedicated bottom app nav. Do not stack the
     branding strip on top of it. Logged-out mobile keeps the thin top menu and
     the floating footer at the bottom. */
  body.kh-bottom-actions-active .classicore-footer-wrapper {
    display: none !important;
  }
}

/* -------------------------------------------------------------------------- */
/* ClassiCore Classifieds vertical: app-shell marketplace layout               */
/* -------------------------------------------------------------------------- */
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 0 54px;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  min-height: calc(var(--kh-app-safe-vh, 100vh) - 92px);
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-classifieds-header {
  max-width: 1040px;
  width: min(1040px, calc(100vw - 48px));
  margin: 0 auto 18px;
  padding: 14px 18px;
  border-radius: 16px;
  border: 1px solid rgba(15,23,42,.06);
  box-shadow: 0 18px 42px rgba(15,23,42,.08);
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) > .kh-layout {
  width: min(1520px, calc(100vw - 48px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 22px;
  align-items: start;
  min-height: 0;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-sidebar-column {
  position: sticky;
  top: 82px;
  z-index: 4;
  align-self: start;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-sidebar {
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 18px;
  padding: 16px;
  box-shadow: 0 18px 48px rgba(15,23,42,.10);
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-sidebar-title {
  font-size: 14px;
  font-weight: 800;
  color: #111827;
  margin-bottom: 12px;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-menu a {
  border-radius: 12px;
  padding: 10px 10px;
  color: #263142;
  font-weight: 650;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-menu a:hover {
  background: #eef5ff;
  color: #1d4ed8;
  text-decoration: none;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-main {
  min-width: 0;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-main > .kh-wrapper.kh-index {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  min-height: 0;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-search-bar {
  margin: 0 0 16px;
  padding: 0;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-search-bar-inner {
  min-height: 58px;
  padding: 0 12px 0 18px;
  background: #fff;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 18px;
  box-shadow: 0 18px 42px rgba(15,23,42,.07);
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-search-input {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  font-size: 15px;
  min-height: 48px;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-search-submit {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-list {
  margin: 0;
  display: grid;
  gap: 12px;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-date-header {
  margin: 8px 0 2px;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-row {
  padding: 0;
  border: 0;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  min-height: 62px;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid rgba(15,23,42,.075);
  border-radius: 16px;
  box-shadow: 0 10px 26px rgba(15,23,42,.055);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line:hover {
  transform: translateY(-1px);
  border-color: rgba(37,99,235,.24);
  box-shadow: 0 16px 34px rgba(15,23,42,.08);
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-title a {
  color: #0f172a;
  font-weight: 800;
  text-decoration: none;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-title a:hover {
  color: #2563eb;
  text-decoration: none;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-meta {
  color: #64748b;
  font-size: 13px;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-actions,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-admin-footer {
  margin: 16px 0 0;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid rgba(15,23,42,.07);
  border-radius: 16px;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-filter-modal {
  z-index: 9999;
}

@media (max-width: 980px) {
  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) {
    padding-bottom: 96px;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-classifieds-header {
    width: calc(100vw - 28px);
    margin: 12px auto 14px;
    border-radius: 16px;
    align-items: stretch;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) > .kh-layout {
    width: calc(100vw - 28px);
    grid-template-columns: 1fr;
    gap: 14px;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-sidebar-column {
    position: static;
    order: 2;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-main {
    order: 1;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-sidebar {
    display: none;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-meta {
    white-space: normal;
  }
}

/* -------------------------------------------------------------------------- */
/* ClassiCore Classifieds app-shell alignment fix                             */
/* Keeps listing title, meta, and presence grouped cleanly inside card rows.   */
/* -------------------------------------------------------------------------- */
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line {
  grid-template-columns: minmax(220px, 1fr) minmax(220px, auto) !important;
  grid-auto-rows: auto !important;
  align-items: center !important;
  row-gap: 6px !important;
  column-gap: 18px !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-title {
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;
  align-self: center !important;
  min-width: 0 !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-title a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  max-width: 100% !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-meta {
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  align-self: end !important;
  text-align: right !important;
  white-space: nowrap !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-presence,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-verified-badge {
  grid-column: 2 !important;
  justify-self: end !important;
  text-align: right !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-presence {
  grid-row: 2 !important;
  align-self: start !important;
  display: inline-flex !important;
  align-items: center !important;
  width: fit-content !important;
  margin-left: auto !important;
}

@media (max-width: 720px) {
  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line {
    grid-template-columns: 1fr !important;
    row-gap: 8px !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-title,
  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-meta,
  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-presence,
  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-verified-badge {
    grid-column: 1 !important;
    grid-row: auto !important;
    justify-self: start !important;
    text-align: left !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-meta {
    white-space: normal !important;
    overflow: visible !important;
  }
}


/* ------------------------------------------------------------------
 * ClassiCore app-shell listing form polish
 * Modernizes the classifieds post/edit form so it behaves like an app panel
 * instead of a legacy WordPress form.
 */
body.classicore-canvas-theme .kh-layout:has(.kh-new-listing) {
  align-items: start;
}

body.classicore-canvas-theme .kh-main > .kh-wrapper.kh-new-listing {
  max-width: none;
  width: min(1180px, 100%);
  margin: 0 auto;
  padding: clamp(1.25rem, 2vw, 2rem);
  border-radius: 18px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 18px 50px rgba(15, 23, 42, 0.10);
}

body.classicore-canvas-theme .kh-new-listing h2 {
  margin: 0 0 1.25rem;
  font-size: clamp(1.45rem, 2vw, 2rem);
  line-height: 1.15;
  letter-spacing: -0.035em;
}

body.classicore-canvas-theme .kh-new-listing .kh-notice {
  border: 0;
  border-left: 4px solid #0284c7;
  border-radius: 10px;
  padding: 0.85rem 1rem;
  margin: 0 0 1.35rem;
  background: #eff8ff;
  color: #075985;
}

body.classicore-canvas-theme .kh-classifieds-listing-form {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 1.1rem 1.25rem;
  align-items: start;
}

body.classicore-canvas-theme .kh-classifieds-listing-form > p {
  grid-column: span 12;
  margin: 0;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-title-field,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-body-field {
  grid-column: span 12;
}

body.classicore-canvas-theme .kh-classifieds-listing-form label {
  display: block;
  font-size: 0.86rem;
  font-weight: 800;
  color: #0f172a;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-field-help,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-location-help {
  display: block;
  margin: 0.35rem 0 0.55rem;
  color: #64748b;
  font-size: 0.86rem;
  line-height: 1.45;
  font-weight: 500;
}

body.classicore-canvas-theme .kh-classifieds-listing-form input[type="text"],
body.classicore-canvas-theme .kh-classifieds-listing-form input[type="number"],
body.classicore-canvas-theme .kh-classifieds-listing-form input[type="url"],
body.classicore-canvas-theme .kh-classifieds-listing-form input[type="email"],
body.classicore-canvas-theme .kh-classifieds-listing-form input[type="password"],
body.classicore-canvas-theme .kh-classifieds-listing-form select,
body.classicore-canvas-theme .kh-classifieds-listing-form textarea {
  width: 100% !important;
  max-width: none !important;
  min-height: 46px;
  padding: 0.75rem 0.9rem;
  border: 1px solid #dbe3ef;
  border-radius: 12px;
  background: #f8fafc;
  color: #0f172a;
  font: inherit;
  font-size: 0.95rem;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.8);
  transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

body.classicore-canvas-theme .kh-classifieds-listing-form textarea {
  min-height: 160px;
  resize: vertical;
  line-height: 1.55;
}

body.classicore-canvas-theme .kh-classifieds-listing-form input:focus,
body.classicore-canvas-theme .kh-classifieds-listing-form select:focus,
body.classicore-canvas-theme .kh-classifieds-listing-form textarea:focus {
  outline: none;
  border-color: #2563eb;
  background: #ffffff;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.13);
}

body.classicore-canvas-theme .kh-classifieds-listing-form input[type="file"] {
  font-size: 0.9rem;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-field-counter {
  float: right;
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 700;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-location-input {
  margin-bottom: 0.55rem;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-image-slots {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(76px, 1fr));
  gap: 0.85rem !important;
  max-width: 640px;
  margin-top: 0.6rem !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-slot,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-slot {
  width: 76px !important;
  height: 76px !important;
  border-radius: 14px !important;
  border: 1px dashed #cbd5e1 !important;
  background: #f8fafc !important;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-slot:hover,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-slot:hover {
  border-color: #2563eb !important;
  background: #eff6ff !important;
  transform: translateY(-1px);
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-slot img,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-slot-thumb {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 12px !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-slot-remove {
  width: 22px !important;
  height: 22px !important;
  top: -8px !important;
  right: -8px !important;
  border-radius: 999px !important;
  border: 1px solid #dbe3ef !important;
  background: #ffffff !important;
  box-shadow: 0 8px 18px rgba(15,23,42,.16) !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-button,
body.classicore-canvas-theme .kh-classifieds-listing-form button[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.7rem 1.1rem;
  border: 0;
  border-radius: 12px;
  background: #2563eb;
  color: #fff;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 10px 20px rgba(37, 99, 235, 0.18);
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-button-ghost {
  background: #eef2ff;
  color: #1d4ed8;
  box-shadow: none;
}

@media (min-width: 981px) {
  body.classicore-canvas-theme .kh-classifieds-listing-form > p:nth-of-type(3),
  body.classicore-canvas-theme .kh-classifieds-listing-form > p:nth-of-type(5),
  body.classicore-canvas-theme .kh-classifieds-listing-form > p:nth-of-type(8) {
    grid-column: span 4;
  }

  body.classicore-canvas-theme .kh-classifieds-listing-form > p:nth-of-type(4),
  body.classicore-canvas-theme .kh-classifieds-listing-form > p:nth-of-type(6),
  body.classicore-canvas-theme .kh-classifieds-listing-form > p:nth-of-type(9) {
    grid-column: span 8;
  }
}

@media (max-width: 980px) {
  body.classicore-canvas-theme .kh-main > .kh-wrapper.kh-new-listing {
    width: 100%;
    padding: 1rem;
    border-radius: 16px;
  }

  body.classicore-canvas-theme .kh-classifieds-listing-form {
    display: block;
  }

  body.classicore-canvas-theme .kh-classifieds-listing-form > p {
    margin-bottom: 1rem;
  }
}

/* ------------------------------------------------------------------
 * ClassiCore classifieds form symmetry pass
 * Moves the post/edit form away from nth-child guessing and into explicit,
 * stable field regions so media, video, category and actions line up cleanly.
 */
body.classicore-canvas-theme .kh-main > .kh-wrapper.kh-new-listing {
  width: min(1120px, calc(100% - 2rem));
}

body.classicore-canvas-theme .kh-classifieds-listing-form {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 1.35rem;
  row-gap: 1.15rem;
}

body.classicore-canvas-theme .kh-classifieds-listing-form > p,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-field-group {
  grid-column: span 12;
  min-width: 0;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-title-field,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-body-field,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-category-field,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-guidelines-row,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-submit-row {
  grid-column: 1 / -1;
}

@media (min-width: 981px) {
  body.classicore-canvas-theme .kh-classifieds-listing-form .kh-age-field,
  body.classicore-canvas-theme .kh-classifieds-listing-form .kh-price-field {
    grid-column: span 4;
  }

  body.classicore-canvas-theme .kh-classifieds-listing-form .kh-location-field {
    grid-column: span 8;
  }

  body.classicore-canvas-theme .kh-classifieds-listing-form .kh-images-field,
  body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-field {
    grid-column: span 6;
  }
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-image-slots {
  display: grid !important;
  grid-template-columns: repeat(3, 84px) !important;
  gap: 0.85rem !important;
  max-width: none;
  align-items: start;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-slot,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-slot {
  width: 84px !important;
  height: 84px !important;
  margin: 0 !important;
  flex: 0 0 84px !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-field label {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr);
  column-gap: 1rem;
  align-items: start;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-field label > br:first-of-type,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-field label > br:nth-of-type(2) {
  display: none;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-field label::before {
  content: "Video (optional)";
  grid-column: 1 / -1;
  margin-bottom: 0.45rem;
  font-size: 0.86rem;
  font-weight: 800;
  color: #0f172a;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-field label {
  font-size: 0;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-field .kh-video-slot {
  grid-column: 1;
  grid-row: 2;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-field .kh-field-help {
  grid-column: 2;
  grid-row: 2;
  margin: 0;
  max-width: 300px;
  font-size: 0.86rem;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-guidelines-row {
  margin-top: 0.25rem;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-submit-row {
  margin-top: -0.25rem;
}

@media (max-width: 980px) {
  body.classicore-canvas-theme .kh-main > .kh-wrapper.kh-new-listing {
    width: calc(100% - 1rem);
  }

  body.classicore-canvas-theme .kh-classifieds-listing-form .kh-image-slots {
    grid-template-columns: repeat(3, 76px) !important;
  }

  body.classicore-canvas-theme .kh-classifieds-listing-form .kh-slot,
  body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-slot {
    width: 76px !important;
    height: 76px !important;
    flex-basis: 76px !important;
  }

  body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-field label {
    display: block;
    font-size: 0.86rem;
  }

  body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-field label::before {
    display: none;
  }

  body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-field .kh-field-help {
    max-width: none;
    margin-top: 0.55rem;
  }
}

/* ------------------------------------------------------------------
 * ClassiCore classifieds form realignment pass
 * Keep the listing form clean and predictable: a centered single-column
 * form with full-width field groups and media controls arranged in even rows.
 */
body.classicore-canvas-theme .kh-main > .kh-wrapper.kh-new-listing {
  width: min(1040px, calc(100% - 2rem)) !important;
  max-width: 1040px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: clamp(1.4rem, 2.2vw, 2.25rem) !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form {
  display: flex !important;
  flex-direction: column !important;
  gap: 1.15rem !important;
  width: 100% !important;
  max-width: 880px !important;
  margin: 0 auto !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form > p,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-field-group,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-title-field,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-body-field,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-age-field,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-location-field,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-price-field,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-images-field,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-field,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-category-field,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-guidelines-row,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-submit-row {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  grid-column: auto !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form label {
  width: 100% !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form input[type="text"],
body.classicore-canvas-theme .kh-classifieds-listing-form input[type="number"],
body.classicore-canvas-theme .kh-classifieds-listing-form input[type="url"],
body.classicore-canvas-theme .kh-classifieds-listing-form input[type="email"],
body.classicore-canvas-theme .kh-classifieds-listing-form input[type="password"],
body.classicore-canvas-theme .kh-classifieds-listing-form select,
body.classicore-canvas-theme .kh-classifieds-listing-form textarea {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-image-slots {
  display: grid !important;
  grid-template-columns: repeat(6, 92px) !important;
  gap: 0.85rem !important;
  width: 100% !important;
  max-width: 100% !important;
  justify-content: start !important;
  align-items: start !important;
  margin: 0.65rem 0 0 !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-slot,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-slot {
  width: 92px !important;
  height: 92px !important;
  margin: 0 !important;
  flex: 0 0 92px !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-images-field .kh-field-help {
  margin-top: 0.65rem !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-field label {
  display: block !important;
  font-size: 0.86rem !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-field label::before {
  display: none !important;
  content: none !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-slot {
  display: inline-flex !important;
  vertical-align: top !important;
  margin-top: 0.65rem !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-field .kh-field-help {
  display: inline-block !important;
  vertical-align: top !important;
  max-width: 360px !important;
  margin: 0.9rem 0 0 1rem !important;
  line-height: 1.45 !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form .kh-guidelines-row,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-submit-row {
  display: flex !important;
  justify-content: flex-start !important;
}

@media (max-width: 720px) {
  body.classicore-canvas-theme .kh-main > .kh-wrapper.kh-new-listing {
    width: calc(100% - 1rem) !important;
    padding: 1rem !important;
  }

  body.classicore-canvas-theme .kh-classifieds-listing-form {
    max-width: none !important;
  }

  body.classicore-canvas-theme .kh-classifieds-listing-form .kh-image-slots {
    grid-template-columns: repeat(3, 82px) !important;
  }

  body.classicore-canvas-theme .kh-classifieds-listing-form .kh-slot,
  body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-slot {
    width: 82px !important;
    height: 82px !important;
    flex-basis: 82px !important;
  }

  body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-field .kh-field-help {
    display: block !important;
    margin: 0.65rem 0 0 !important;
    max-width: none !important;
  }
}

/* Upload feedback for non-AJAX video/message media uploads */
.kh-upload-status {
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(37, 99, 235, .18);
  border-radius: 14px;
  background: rgba(37, 99, 235, .06);
  color: #22314d;
  font-size: 13px;
  line-height: 1.35;
  display: none;
  max-width: 520px;
}
.kh-upload-status.is-selected,
.kh-upload-status.is-uploading,
.kh-video-slot-has-file + .kh-upload-status {
  display: block;
}
.kh-upload-status-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.kh-upload-status-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.kh-upload-spinner {
  width: 14px;
  height: 14px;
  border-radius: 999px;
  border: 2px solid rgba(37, 99, 235, .22);
  border-top-color: #2563eb;
  flex: 0 0 auto;
  opacity: .35;
}
.kh-upload-status.is-uploading .kh-upload-spinner {
  opacity: 1;
  animation: khUploadSpin .8s linear infinite;
}
.kh-upload-indeterminate {
  height: 4px;
  margin-top: 8px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(37, 99, 235, .12);
  display: none;
}
.kh-upload-status.is-uploading .kh-upload-indeterminate {
  display: block;
}
.kh-upload-indeterminate span {
  display: block;
  height: 100%;
  width: 42%;
  border-radius: inherit;
  background: #2563eb;
  animation: khUploadSlide 1.05s ease-in-out infinite;
}
.kh-video-slot.kh-video-slot-has-file {
  border-color: rgba(37, 99, 235, .45) !important;
  background: rgba(37, 99, 235, .06) !important;
}
.kh-video-slot.kh-video-slot-has-file .kh-slot-placeholder {
  color: #2563eb !important;
  font-weight: 800;
}
.kh-attachment-dropzone + .kh-upload-status {
  max-width: none;
}
@keyframes khUploadSpin { to { transform: rotate(360deg); } }
@keyframes khUploadSlide {
  0% { transform: translateX(-110%); }
  55% { transform: translateX(80%); }
  100% { transform: translateX(260%); }
}

/* ClassiCore: cleaner existing video removal controls. */
.kh-existing-video-card video,
.kh-current-video-item video {
  border-radius: 14px !important;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.10);
}
.kh-remove-video-existing,
.kh-video-remove-existing {
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
  background: #fff !important;
  color: #334155 !important;
  border-radius: 999px !important;
  padding: 8px 12px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}
.kh-remove-video-existing:hover,
.kh-video-remove-existing:hover {
  border-color: rgba(239, 68, 68, 0.55) !important;
  color: #b91c1c !important;
  background: #fff5f5 !important;
}
.kh-video-marked-removed { opacity: 0.45; }


/* ClassiCore: make video remove controls reliably clickable above invisible file inputs. */
.kh-video-slot { position: relative; }
.kh-video-slot input[type="file"],
.kh-video-slot .kh-video-file {
  z-index: 1;
}
.kh-video-slot-remove,
.kh-video-remove-existing,
.kh-remove-video-existing {
  position: relative;
  z-index: 20 !important;
  pointer-events: auto !important;
}
.kh-video-slot .kh-video-slot-remove {
  position: absolute !important;
  top: -6px !important;
  right: -6px !important;
}
.kh-current-video-item .kh-video-remove-existing,
.kh-existing-video-card .kh-remove-video-existing {
  z-index: 25 !important;
}


/* ClassiCore watermark visibility hardening
   The watermark setting is visual-only and should appear anywhere listing images render:
   cards, single-gallery tiles, fallback theme galleries, and the Airbnb-style modal. */
.kh-card-thumb[data-watermark],
.kh-airbnb-hero[data-watermark],
.kh-airbnb-tile[data-watermark],
.kh-single-image-wrap[data-watermark],
.kh-image-grid-item[data-watermark],
.kh-single-photos-block[data-watermark] .kh-airbnb-hero,
.kh-single-photos-block[data-watermark] .kh-airbnb-tile {
  position: relative !important;
  overflow: hidden !important;
}

.kh-card-thumb[data-watermark]::after,
.kh-airbnb-hero[data-watermark]::after,
.kh-airbnb-tile[data-watermark]::after,
.kh-single-image-wrap[data-watermark]::after,
.kh-image-grid-item[data-watermark]::after,
.kh-single-photos-block[data-watermark] .kh-airbnb-hero::after,
.kh-single-photos-block[data-watermark] .kh-airbnb-tile::after {
  content: attr(data-watermark);
  position: absolute;
  left: 50%;
  bottom: 12px;
  transform: translateX(-50%);
  z-index: 8;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: calc(100% - 18px);
  padding: 5px 10px;
  border-radius: 999px;
  color: rgba(255,255,255,.92);
  background: rgba(0,0,0,.38);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .16em;
  line-height: 1.2;
  text-transform: uppercase;
  text-shadow: 0 1px 2px rgba(0,0,0,.65);
  pointer-events: none;
  white-space: nowrap;
}

.kh-single-photos-block[data-watermark] .kh-airbnb-hero::after,
.kh-single-photos-block[data-watermark] .kh-airbnb-tile::after {
  content: attr(data-watermark);
}

/* If the watermark lives on the parent photos block, copy the parent text visually by using a generic fallback. */
.kh-single-photos-block[data-watermark] .kh-airbnb-hero:not([data-watermark])::after,
.kh-single-photos-block[data-watermark] .kh-airbnb-tile:not([data-watermark])::after {
  content: attr(data-watermark);
}

#kh-airbnb-modal .kh-airbnb-modal-stage[data-watermark]::after {
  content: attr(data-watermark);
  position: absolute;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  z-index: 20;
  padding: 7px 14px;
  border-radius: 999px;
  color: rgba(255,255,255,.92);
  background: rgba(0,0,0,.45);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  text-shadow: 0 1px 2px rgba(0,0,0,.7);
  pointer-events: none;
  white-space: nowrap;
}

@media (max-width: 700px) {
  .kh-card-thumb[data-watermark]::after,
  .kh-airbnb-hero[data-watermark]::after,
  .kh-airbnb-tile[data-watermark]::after,
  .kh-single-image-wrap[data-watermark]::after,
  .kh-image-grid-item[data-watermark]::after,
  .kh-single-photos-block[data-watermark] .kh-airbnb-hero::after,
  .kh-single-photos-block[data-watermark] .kh-airbnb-tile::after {
    bottom: 8px;
    padding: 4px 8px;
    font-size: 9px;
    letter-spacing: .12em;
  }
}

/* Aggressive diagonal watermark overlay
   Moves the watermark from a removable corner badge to a faint, full-image diagonal mark. */
.kh-card-thumb[data-watermark]::after,
.kh-airbnb-hero[data-watermark]::after,
.kh-airbnb-tile[data-watermark]::after,
.kh-single-image-wrap[data-watermark]::after,
.kh-image-grid-item[data-watermark]::after,
.kh-single-photos-block[data-watermark] .kh-airbnb-hero::after,
.kh-single-photos-block[data-watermark] .kh-airbnb-tile::after,
#kh-airbnb-modal .kh-airbnb-modal-stage[data-watermark]::after {
  content: attr(data-watermark) !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  bottom: auto !important;
  width: 165% !important;
  max-width: none !important;
  min-height: 0 !important;
  height: auto !important;
  transform: translate(-50%, -50%) rotate(-32deg) !important;
  z-index: 30 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  border-radius: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: rgba(255,255,255,.11) !important;
  font-size: clamp(18px, 5.6vw, 72px) !important;
  font-weight: 900 !important;
  letter-spacing: .28em !important;
  line-height: 1 !important;
  text-align: center !important;
  text-transform: uppercase !important;
  text-shadow:
    0 1px 1px rgba(0,0,0,.11),
    0 0 8px rgba(0,0,0,.09),
    0 0 14px rgba(255,255,255,.08) !important;
  opacity: .29 !important;
  filter: blur(.25px) !important;
  mix-blend-mode: soft-light !important;
  pointer-events: none !important;
  user-select: none !important;
  white-space: nowrap !important;
}

/* Slightly stronger fallback for browsers/images where soft-light blends too quietly. */
.kh-card-thumb[data-watermark]::before,
.kh-airbnb-hero[data-watermark]::before,
.kh-airbnb-tile[data-watermark]::before,
.kh-single-image-wrap[data-watermark]::before,
.kh-image-grid-item[data-watermark]::before,
.kh-single-photos-block[data-watermark] .kh-airbnb-hero::before,
.kh-single-photos-block[data-watermark] .kh-airbnb-tile::before,
#kh-airbnb-modal .kh-airbnb-modal-stage[data-watermark]::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 29 !important;
  pointer-events: none !important;
  background: linear-gradient(135deg, rgba(255,255,255,.02), rgba(0,0,0,.018), rgba(255,255,255,.018)) !important;
}

@media (max-width: 700px) {
  .kh-card-thumb[data-watermark]::after,
  .kh-airbnb-hero[data-watermark]::after,
  .kh-airbnb-tile[data-watermark]::after,
  .kh-single-image-wrap[data-watermark]::after,
  .kh-image-grid-item[data-watermark]::after,
  .kh-single-photos-block[data-watermark] .kh-airbnb-hero::after,
  .kh-single-photos-block[data-watermark] .kh-airbnb-tile::after,
  #kh-airbnb-modal .kh-airbnb-modal-stage[data-watermark]::after {
    font-size: clamp(14px, 7vw, 38px) !important;
    letter-spacing: .2em !important;
    width: 185% !important;
  }
}


/* Actual persistent diagonal watermark layer.
   This uses a real overlay element inserted by JS, not only pseudo-elements, so it appears
   on large galleries, thumbnails, modal images, and templates that bypass older wrappers. */
.kh-watermark-host {
  position: relative !important;
  overflow: hidden !important;
}
.kh-watermark-host > img,
.kh-watermark-host picture,
.kh-watermark-host video {
  position: relative;
  z-index: 1;
}
.kh-watermark-overlay {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 175% !important;
  max-width: none !important;
  transform: translate(-50%, -50%) rotate(-32deg) !important;
  z-index: 999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  pointer-events: none !important;
  user-select: none !important;
  white-space: nowrap !important;
  color: rgba(255,255,255,.15) !important;
  font-size: clamp(22px, 5.8vw, 82px) !important;
  font-weight: 950 !important;
  letter-spacing: .30em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  text-align: center !important;
  text-shadow:
    0 2px 2px rgba(0,0,0,.16),
    0 0 10px rgba(0,0,0,.12),
    0 0 18px rgba(255,255,255,.09) !important;
  opacity: .33 !important;
  filter: blur(.2px) !important;
  mix-blend-mode: normal !important;
}
.kh-watermark-host::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 998 !important;
  pointer-events: none !important;
  background: linear-gradient(135deg, rgba(255,255,255,.018), rgba(0,0,0,.013), rgba(255,255,255,.015)) !important;
}
@media (max-width: 700px) {
  .kh-watermark-overlay {
    font-size: clamp(16px, 8vw, 42px) !important;
    width: 190% !important;
    letter-spacing: .22em !important;
  }
}


/* === v2.15.45: Mobile single listing spacing polish =====================
   The listing detail screen is an app page, not a long boxed document. On phones,
   let the About and Contact cards use the available width and keep them close
   together above the bottom app nav. */
@media (max-width: 700px) {
  body.classicore-canvas-theme .kh-wrapper.kh-single-listing,
  body.classicore-canvas-theme .kh-wrapper.kh-single-listing--v2,
  .kh-wrapper.kh-single-listing,
  .kh-wrapper.kh-single-listing--v2 {
    width: 100% !important;
    max-width: none !important;
    padding: 10px 14px 96px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
    gap: 12px !important;
  }

  .kh-single-layout-main {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    width: 100% !important;
    margin: 0 !important;
    align-items: stretch !important;
  }

  .kh-single-media-column,
  .kh-single-body-column {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border-left: 0 !important;
    box-sizing: border-box !important;
  }

  .kh-single-section {
    margin: 0 0 12px !important;
  }

  .kh-single-section.kh-single-about,
  .kh-single-section.kh-single-units,
  .kh-single-section.kh-single-rental-details,
  .kh-single-body-column .kh-message-form {
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 12px !important;
    padding: 16px !important;
    border-radius: 14px !important;
    box-sizing: border-box !important;
  }

  .kh-single-section-title,
  .kh-single-body-column .kh-message-form h3 {
    margin: 0 0 12px !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    font-size: 16px !important;
  }

  .kh-single-section-body,
  .kh-single-section-body p {
    margin-bottom: 0 !important;
    font-size: 16px !important;
    line-height: 1.55 !important;
  }

  .kh-single-body-column .kh-message-form p {
    margin: 0 0 12px !important;
  }

  .kh-single-body-column .kh-message-form label {
    display: block !important;
    width: 100% !important;
  }

  .kh-single-body-column .kh-message-form input[type="text"],
  .kh-single-body-column .kh-message-form input[type="email"],
  .kh-single-body-column .kh-message-form textarea,
  .kh-single-body-column .kh-message-form select {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
    min-height: 44px !important;
    border-radius: 10px !important;
    padding: 10px 12px !important;
  }

  .kh-single-body-column .kh-message-form textarea {
    min-height: 118px !important;
  }

  .kh-single-body-column .kh-message-form .kh-button,
  .kh-single-body-column .kh-message-form button[type="submit"] {
    width: 100% !important;
    min-height: 46px !important;
    border-radius: 10px !important;
  }

  .kh-single-report-row {
    margin: 4px 0 0 !important;
    padding-bottom: 16px !important;
  }
}

/* === ClassiCore mobile filter sheet redesign ===
   The old modal stacked duplicated sections and created nested scrolling on phones.
   This turns it into a clean bottom sheet with one scroll area, compact controls,
   sticky actions, and enough bottom clearance for the mobile app nav. */
@media (max-width: 700px) {
  body.kh-filter-open,
  body.classicore-filter-open {
    overflow: hidden !important;
  }

  .kh-filter-modal {
    align-items: flex-end !important;
    justify-content: center !important;
    padding: 0 !important;
    overflow: hidden !important;
    z-index: 100000 !important;
  }

  .kh-filter-modal-backdrop {
    background: rgba(15, 23, 42, 0.38) !important;
    backdrop-filter: blur(3px);
  }

  .kh-filter-modal-panel {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    max-height: calc(100dvh - 5.75rem) !important;
    margin: 0 !important;
    border-radius: 22px 22px 0 0 !important;
    padding: 0 !important;
    box-shadow: 0 -18px 45px rgba(15, 23, 42, 0.22) !important;
    overflow: hidden !important;
    background: #ffffff !important;
  }

  .kh-filter-modal-header {
    position: sticky;
    top: 0;
    z-index: 3;
    min-height: 56px;
    margin: 0 !important;
    padding: 0.95rem 1rem 0.75rem !important;
    border-bottom: 1px solid #e5e7eb;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(10px);
  }

  .kh-filter-modal-header::before {
    content: '';
    position: absolute;
    top: 7px;
    left: 50%;
    width: 44px;
    height: 4px;
    border-radius: 999px;
    transform: translateX(-50%);
    background: #d1d5db;
  }

  .kh-filter-modal-title {
    font-size: 0.95rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
    color: #111827 !important;
  }

  .kh-filter-close {
    width: 34px !important;
    height: 34px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 999px !important;
    background: #f3f4f6 !important;
    color: #64748b !important;
    font-size: 1.15rem !important;
  }

  .kh-filter-modal-body {
    display: block !important;
    max-height: calc(100dvh - 11.75rem) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    padding: 0.9rem 1rem calc(env(safe-area-inset-bottom) + 6.25rem) !important;
  }

  .kh-filter-section {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }

  .kh-filter-section + .kh-filter-section {
    margin-top: 0.9rem !important;
    padding-top: 0.9rem !important;
    border-top: 1px solid #eef2f7 !important;
  }

  .kh-filter-section-title {
    margin: 0 0 0.45rem !important;
    font-size: 0.72rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    color: #64748b !important;
  }

  .kh-category-pills {
    display: flex !important;
    gap: 0.45rem !important;
    overflow-x: auto !important;
    padding: 0.1rem 0 0.2rem !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .kh-category-pills::-webkit-scrollbar { display: none; }

  .kh-category-pill {
    flex: 0 0 auto !important;
    padding: 0.45rem 0.7rem !important;
    border-radius: 999px !important;
    font-size: 0.82rem !important;
    background: #f8fafc !important;
    border: 1px solid #dbeafe !important;
    color: #0f172a !important;
    text-decoration: none !important;
  }

  .kh-category-pill.is-active {
    background: #eff6ff !important;
    border-color: #93c5fd !important;
    color: #1d4ed8 !important;
  }

  .kh-filter-form,
  .kh-filter-grid,
  .kh-filter-layout-row,
  .kh-filter-layout-col,
  .kh-filter-layout-col-basic,
  .kh-filter-layout-col-advanced {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
  }

  .kh-filter-layout-divider { display: none !important; }

  .kh-filter-layout-col-advanced,
  .kh-filter-layout-col-basic {
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 16px !important;
    padding: 0.85rem !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04) !important;
  }

  .kh-filter-layout-col-basic { margin-top: 0.75rem !important; }

  .kh-filter-field {
    margin: 0 0 0.75rem !important;
  }

  .kh-filter-field:last-child { margin-bottom: 0 !important; }

  .kh-filter-label,
  .kh-filter-label-row .kh-filter-label {
    display: block !important;
    margin: 0 0 0.35rem !important;
    font-size: 0.78rem !important;
    font-weight: 800 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    color: #334155 !important;
  }

  .kh-filter-input,
  .kh-filter-select,
  .kh-location-input {
    width: 100% !important;
    min-height: 42px !important;
    border-radius: 12px !important;
    border: 1px solid #dbe3ef !important;
    background: #f8fafc !important;
    padding: 0.6rem 0.72rem !important;
    font-size: 0.94rem !important;
    box-shadow: none !important;
  }

  .kh-filter-field-location .kh-location-input + .kh-location-input {
    margin-top: 0.45rem !important;
  }

  .kh-filter-field-range .kh-filter-range {
    display: grid !important;
    grid-template-columns: 1fr auto 1fr !important;
    gap: 0.45rem !important;
    align-items: center !important;
  }

  .kh-filter-age-slider {
    padding: 0.35rem 0 0 !important;
  }

  .kh-filter-age-slider-track {
    height: 28px !important;
  }

  .kh-filter-age-slider-labels {
    margin-top: 0.2rem !important;
    font-size: 0.8rem !important;
  }

  .kh-filter-field-photos .kh-filter-toggle {
    width: 100% !important;
    justify-content: flex-start !important;
    border-radius: 14px !important;
    padding: 0.65rem 0.75rem !important;
    background: #eff6ff !important;
    color: #1d4ed8 !important;
  }

  .kh-filter-field-photos .kh-filter-toggle input {
    width: 18px !important;
    height: 18px !important;
    margin-right: 0.45rem !important;
  }

  .kh-filter-actions-inline,
  .kh-filter-actions.kh-filter-actions-inline {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 4 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0.65rem !important;
    align-items: center !important;
    margin: 1rem -1rem calc((env(safe-area-inset-bottom) * -1) - 6.25rem) !important;
    padding: 0.8rem 1rem calc(env(safe-area-inset-bottom) + 5.45rem) !important;
    border-top: 1px solid #e5e7eb !important;
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(10px);
  }

  .kh-filter-actions-inline .kh-button,
  .kh-filter-actions-inline .kh-link-reset {
    min-height: 44px !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    font-weight: 800 !important;
    text-decoration: none !important;
  }

  .kh-filter-actions-inline .kh-button {
    width: 100% !important;
    background: #2563eb !important;
  }

  .kh-filter-actions-inline .kh-link-reset {
    border: 1px solid #dbe3ef !important;
    color: #334155 !important;
    background: #f8fafc !important;
  }
}

/* === v2.15.45: Mobile filters header actions === */
.kh-filter-modal-heading,
.kh-filter-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
}
.kh-filter-header-reset {
  color: #64748b;
  font-weight: 800;
  font-size: 0.82rem;
  text-decoration: none;
}
.kh-filter-header-save {
  border: 0;
  border-radius: 999px;
  min-height: 34px;
  padding: 0 0.95rem;
  background: #2563eb;
  color: #fff;
  font-weight: 800;
  cursor: pointer;
}
.kh-filter-header-save:hover { filter: brightness(.97); }

@media (max-width: 700px) {
  .kh-filter-modal-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0.75rem !important;
    padding-top: 1.05rem !important;
  }

  .kh-filter-modal-heading {
    min-width: 0 !important;
    flex: 1 1 auto !important;
  }

  .kh-filter-header-actions {
    flex: 0 0 auto !important;
    gap: 0.45rem !important;
  }

  .kh-filter-header-reset {
    font-size: 0.78rem !important;
    color: #64748b !important;
    white-space: nowrap !important;
  }

  .kh-filter-header-save {
    min-height: 34px !important;
    padding: 0 0.9rem !important;
    box-shadow: 0 7px 18px rgba(37,99,235,.22) !important;
  }

  .kh-filter-modal-body {
    max-height: calc(100dvh - 10.1rem) !important;
    padding-bottom: calc(env(safe-area-inset-bottom) + 1.25rem) !important;
  }

  .kh-filter-actions-inline,
  .kh-filter-actions.kh-filter-actions-inline {
    display: none !important;
  }
}


/* === v2.15.46: Mobile listing media strip ===============================
   On phones, expose secondary photos/videos directly under the hero image so
   users can tell when a listing has a gallery or attached video without needing
   to guess from the “show all” button. */
@media (max-width: 700px) {
  .kh-single-photos-block .kh-airbnb-gallery {
    margin-bottom: 14px !important;
  }

  .kh-single-photos-block .kh-airbnb-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    border-radius: 14px !important;
    overflow: visible !important;
  }

  .kh-single-photos-block .kh-airbnb-hero {
    min-height: 0 !important;
    height: auto !important;
    aspect-ratio: 4 / 5 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    background: #eef2f7 !important;
  }

  .kh-single-photos-block .kh-airbnb-side {
    display: flex !important;
    flex-direction: row !important;
    gap: 8px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 2px 2px 4px !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-snap-type: x proximity !important;
  }

  .kh-single-photos-block .kh-airbnb-tile {
    flex: 0 0 72px !important;
    width: 72px !important;
    height: 72px !important;
    min-height: 72px !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    scroll-snap-align: start !important;
    background: #eef2f7 !important;
    box-shadow: 0 1px 0 rgba(15,23,42,.04), inset 0 0 0 1px rgba(148,163,184,.26) !important;
  }

  .kh-single-photos-block .kh-airbnb-video-tile {
    position: absolute !important;
    inset: 0 !important;
    border-radius: inherit !important;
    background: linear-gradient(135deg, rgba(15,23,42,.72), rgba(37,99,235,.55)) !important;
  }

  .kh-single-photos-block .kh-airbnb-tile .kh-airbnb-video-play {
    width: 32px !important;
    height: 32px !important;
    font-size: 13px !important;
  }

  .kh-single-photos-block .kh-airbnb-tile .kh-airbnb-video-label {
    font-size: 9px !important;
  }

  .kh-single-photos-block .kh-airbnb-showall {
    right: 10px !important;
    bottom: 86px !important;
    padding: 7px 9px !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    background: rgba(255,255,255,.94) !important;
    backdrop-filter: blur(8px) !important;
  }

  .kh-single-photos-block .kh-airbnb-side:empty,
  .kh-single-photos-block .kh-airbnb-side .kh-airbnb-side-empty {
    display: none !important;
  }
}

/* --------------------------------------------------------------------------
 * Mobile classifieds listing-card alignment polish
 * Keeps title, metadata, online state, and verified badge in one tidy card flow.
 * -------------------------------------------------------------------------- */
@media (max-width: 720px) {
  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line {
    display: grid !important;
    grid-template-columns: auto auto minmax(0, 1fr) !important;
    grid-auto-rows: auto !important;
    align-items: center !important;
    justify-content: start !important;
    gap: 7px 8px !important;
    min-height: 0 !important;
    padding: 15px 16px !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-title {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
    justify-self: start !important;
    width: 100% !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-title a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    line-height: 1.25 !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-meta {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    justify-self: start !important;
    text-align: left !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.45 !important;
    color: #64748b !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-presence {
    grid-column: 1 !important;
    grid-row: 3 !important;
    justify-self: start !important;
    margin: 2px 0 0 !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    min-height: 24px !important;
    padding: 3px 9px !important;
    border-radius: 999px !important;
    background: #dcfce7 !important;
    color: #15803d !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-align: left !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-presence.kh-last-seen {
    background: #f1f5f9 !important;
    color: #64748b !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-verified-badge {
    grid-column: 2 !important;
    grid-row: 3 !important;
    justify-self: start !important;
    margin: 2px 0 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    min-height: 24px !important;
    padding: 3px 9px !important;
    border-radius: 999px !important;
    background: #ecfdf5 !important;
    border: 1px solid #bbf7d0 !important;
    color: #047857 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-align: left !important;
    white-space: nowrap !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-verified-badge::before {
    content: '✓' !important;
    font-size: 12px !important;
    margin-right: 3px !important;
  }
}

/* -------------------------------------------------------------------------- */
/* ClassiCore profile-card avatars                                            */
/* Replaces tiny media icons with a proper user card image/avatar.             */
/* -------------------------------------------------------------------------- */
.kh-listing-line {
  align-items: center;
}

.kh-listing-line-avatar {
  flex: 0 0 auto;
}

.kh-listing-line-avatar-link {
  display: block;
  text-decoration: none;
}


/* Browse-card avatar verification badges */
.kh-listing-line-avatar {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
}

.kh-listing-line-avatar-badge {
  display: flex;
  justify-content: center;
  width: 100%;
}

.kh-listing-line-avatar-badge .kh-profile-verified-badge,
.kh-profile-verification-owner-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  max-width: 96px;
  border-radius: 999px;
  padding: 0.16rem 0.48rem;
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1.15;
  text-decoration: none;
  white-space: nowrap;
  text-align: center;
}

.kh-profile-verification-owner-badge--cta {
  background: #eff6ff;
  color: #1d4ed8;
  border: 1px solid #bfdbfe;
}

.kh-profile-verification-owner-badge--pending {
  background: #fef3c7;
  color: #92400e;
  border: 1px solid #fde68a;
}

.kh-listing-line-avatar-badge .kh-profile-verified-badge::before {
  content: '✓';
  font-weight: 900;
}

@media (max-width: 720px) {
  .kh-listing-line-avatar-badge .kh-profile-verified-badge,
  .kh-profile-verification-owner-badge {
    font-size: 0.68rem;
    padding: 0.14rem 0.42rem;
    max-width: 90px;
  }
}

.kh-user-card-avatar-media {
  width: 76px;
  height: 76px;
  display: block;
  object-fit: cover;
  border-radius: 16px;
  border: 1px solid rgba(148, 163, 184, 0.25);
  background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
}

.kh-listing-line-main {
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.kh-listing-line-status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.kh-listing-line-status .kh-listing-line-presence,
.kh-listing-line-status .kh-verified-badge {
  margin: 0;
}

.kh-profile-avatar-preview {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 18px;
}

.kh-profile-avatar-preview-media .kh-user-card-avatar-media {
  width: 96px;
  height: 96px;
  border-radius: 20px;
}

.kh-profile-avatar-preview-copy {
  min-width: 0;
}

.kh-profile-avatar-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.kh-profile-avatar-option {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 14px;
  background: #fff;
}

.kh-profile-avatar-option-copy {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.kh-profile-avatar-option-copy small {
  color: #64748b;
}

.kh-profile-avatar-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(88px, 1fr));
  gap: 12px;
}

.kh-profile-avatar-choice {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 16px;
  background: #fff;
  cursor: pointer;
}

.kh-profile-avatar-choice input[type="radio"] {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
}

.kh-profile-avatar-choice-media {
  display: block;
  width: 100%;
}

.kh-profile-avatar-choice-image {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
  border-radius: 14px;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line {
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 18px !important;
  row-gap: 0 !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-avatar {
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: center !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-main {
  grid-column: 2 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-title,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-meta,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-status,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-status .kh-listing-line-presence,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-status .kh-verified-badge {
  grid-column: auto !important;
  grid-row: auto !important;
  justify-self: start !important;
  text-align: left !important;
  white-space: normal !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-meta {
  overflow: visible !important;
  text-overflow: initial !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-status {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

@media (max-width: 720px) {
  .kh-user-card-avatar-media {
    width: 72px;
    height: 72px;
    border-radius: 14px;
  }

  .kh-profile-avatar-preview {
    align-items: flex-start;
    flex-direction: column;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line {
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: start !important;
  }
}

/* -------------------------------------------------------------------------- */
/* ClassiCore avatar consistency: single listings + inbox + conversation views */
/* -------------------------------------------------------------------------- */
.kh-single-presence-row {
  gap: 12px;
  align-items: center;
}

.kh-single-author-avatar-wrap {
  flex: 0 0 auto;
  line-height: 0;
}

.kh-single-author-avatar.kh-user-card-avatar-media {
  width: 72px;
  height: 72px;
  border-radius: 18px;
}

.kh-single-author-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.kh-conversation-with {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.kh-chat-user-card {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}

.kh-chat-user-card-avatar {
  line-height: 0;
}

.kh-chat-header-avatar.kh-user-card-avatar-media {
  width: 64px;
  height: 64px;
  border-radius: 18px;
}

.kh-chat-user-card-meta {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.kh-msg-row {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  margin-bottom: 0.55rem;
}

.kh-msg-row--me {
  justify-content: flex-end;
}

.kh-msg-row--me .kh-msg-avatar-wrap {
  order: 2;
}

.kh-msg-row--me .kh-msg-bubble {
  order: 1;
}

.kh-msg-row--them {
  justify-content: flex-start;
}

.kh-msg-avatar-wrap {
  flex: 0 0 auto;
  line-height: 0;
}

.kh-msg-avatar.kh-user-card-avatar-media {
  width: 46px;
  height: 46px;
  border-radius: 14px;
}

.kh-msg-bubble {
  margin-bottom: 0;
}

.kh-inbox-user-cell {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.kh-inbox-user-avatar {
  line-height: 0;
  flex: 0 0 auto;
}

.kh-inbox-avatar.kh-user-card-avatar-media {
  width: 48px;
  height: 48px;
  border-radius: 14px;
}

.kh-inbox-user-meta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

@media (max-width: 720px) {
  .kh-single-author-avatar.kh-user-card-avatar-media {
    width: 64px;
    height: 64px;
  }

  .kh-chat-header-avatar.kh-user-card-avatar-media {
    width: 56px;
    height: 56px;
  }

  .kh-conversation-with {
    align-items: flex-start;
  }

  .kh-msg-row {
    gap: 8px;
  }

  .kh-msg-avatar.kh-user-card-avatar-media {
    width: 40px;
    height: 40px;
    border-radius: 12px;
  }
}


/* -------------------------------------------------------------------------- */
/* ClassiCore listing avatar/title alignment refinement                        */
/* Keeps the title visually anchored beside the user's card avatar on desktop. */
/* -------------------------------------------------------------------------- */
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line {
  grid-template-columns: auto minmax(0, 1fr) !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-main {
  display: grid !important;
  grid-template-columns: minmax(180px, 1fr) minmax(260px, auto) !important;
  grid-template-areas:
    "title meta"
    "title status" !important;
  align-items: center !important;
  column-gap: 18px !important;
  row-gap: 6px !important;
  width: 100% !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-title {
  grid-area: title !important;
  align-self: center !important;
  justify-self: start !important;
  text-align: left !important;
  width: auto !important;
  max-width: 100% !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-title a {
  justify-content: flex-start !important;
  text-align: left !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-meta {
  grid-area: meta !important;
  justify-self: end !important;
  text-align: right !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-status {
  grid-area: status !important;
  justify-self: end !important;
  justify-content: flex-end !important;
  text-align: right !important;
}

@media (max-width: 720px) {
  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-main {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-title,
  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-meta,
  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-status {
    width: 100% !important;
    justify-self: start !important;
    justify-content: flex-start !important;
    text-align: left !important;
    white-space: normal !important;
    overflow: visible !important;
  }
}

/* -------------------------------------------------------------------------- */
/* ClassiCore login compatibility for Secure Access 2FA                       */
/* -------------------------------------------------------------------------- */
.cc-auth-card .classicore-field-2fa small.classicore-field-help,
.cc-auth-card .classicore-passkey-status {
  display: block;
  margin-top: 6px;
  color: #64748b;
  font-size: 12px;
  line-height: 1.35;
}

.cc-auth-card .classicore-field-passkey {
  margin-top: 12px;
}

.cc-auth-card .classicore-field-passkey .classicore-button {
  width: 100%;
}

.cc-auth-card .classicore-field-trust-device {
  margin-top: -4px;
}

/* -------------------------------------------------------------------------- */
/* ClassiCore personals listing fields                                        */
/* -------------------------------------------------------------------------- */
.kh-personals-profile-fields {
  margin: 18px 0;
  padding: 16px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 16px;
  background: rgba(248, 250, 252, 0.78);
}

.kh-personals-profile-fields h3 {
  margin: 0 0 6px;
}

.kh-personals-profile-fields .kh-settings-helper {
  margin: 0 0 14px;
}

.kh-personals-field select,
.kh-filter-field-personals select {
  width: 100%;
}

/* -------------------------------------------------------------------------- */
/* ClassiCore WooCommerce membership prices                                   */
/* Shows live WooCommerce pricing directly on upgrade plan cards.              */
/* -------------------------------------------------------------------------- */
.kh-plan-price {
  margin: 8px 0 12px;
  font-size: clamp(1.15rem, 2vw, 1.55rem);
  line-height: 1.15;
  font-weight: 850;
  color: #0f172a;
  letter-spacing: -0.035em;
}

.kh-plan-price del {
  opacity: 0.55;
  font-size: 0.82em;
  margin-right: 0.35rem;
}

.kh-plan-price ins {
  text-decoration: none;
}

.kh-plan-price .woocommerce-Price-amount {
  white-space: nowrap;
}

.kh-plan-price-inline {
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(37, 99, 235, 0.07);
  border: 1px solid rgba(37, 99, 235, 0.12);
}

.kh-plan-current .kh-plan-price-inline {
  background: rgba(16, 185, 129, 0.08);
  border-color: rgba(16, 185, 129, 0.16);
}


/* Mobile bottom-nav unread inbox badge */
@media (max-width: 1100px) {
  .kh-bottom-actions-icon-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
  }

  .kh-bottom-actions-badge {
    position: absolute;
    top: -0.45rem;
    right: -0.72rem;
    min-width: 1.05rem;
    height: 1.05rem;
    padding: 0 0.22rem;
    border-radius: 999px;
    background: #ef4444;
    color: #ffffff;
    font-size: 0.62rem;
    font-weight: 700;
    line-height: 1.05rem;
    text-align: center;
    box-shadow: 0 0 0 2px #ffffff;
  }

  .kh-bottom-actions-button.kh-bottom-actions-active .kh-bottom-actions-badge {
    background: #dc2626;
    color: #ffffff;
  }

  .kh-bottom-actions-tap-badge {
    position: absolute;
    top: -0.48rem;
    left: -0.78rem;
    width: 1.08rem;
    height: 1.08rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    color: #f97316;
    font-size: 0.72rem;
    line-height: 1;
    box-shadow: 0 0 0 2px #ffffff, 0 4px 10px rgba(15, 23, 42, 0.16);
  }

  .kh-bottom-actions-button.kh-bottom-actions-active .kh-bottom-actions-tap-badge {
    background: #fff7ed;
    color: #ea580c;
  }
}

/* Message attachment source choices: gallery or camera */
.kh-attachment-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.kh-attachment-choice-grid .kh-attachment-dropzone {
  min-height: 104px;
}

.kh-attachment-choice-grid .kh-attachment-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-align: center;
}

.kh-attachment-choice-grid .kh-attachment-text {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.kh-attachment-choice-grid .kh-attachment-text small {
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 500;
}

.kh-attachment-dropzone--camera {
  border-style: solid;
  background: linear-gradient(180deg, rgba(37,99,235,.06), rgba(255,255,255,.96));
}

.kh-attachment-dropzone--camera .kh-attachment-plus.dashicons {
  width: 34px;
  height: 34px;
  font-size: 30px;
  line-height: 34px;
}

@media (max-width: 560px) {
  .kh-attachment-choice-grid {
    grid-template-columns: 1fr;
  }
}


/* Message attachment mobile overflow fix */
.kh-message-form,
.kh-message-form .kh-field,
.kh-message-form .kh-field-attachment,
.kh-message-form .kh-field-attachment--rich,
.kh-attachment-choice-grid,
.kh-attachment-dropzone,
.kh-field-selected {
  box-sizing: border-box;
  max-width: 100%;
}

.kh-attachment-choice-grid {
  width: 100%;
  min-width: 0;
}

.kh-attachment-choice-grid .kh-attachment-dropzone {
  width: 100%;
  min-width: 0;
  overflow: hidden;
}

.kh-attachment-choice-grid .kh-attachment-inner,
.kh-attachment-choice-grid .kh-attachment-text {
  min-width: 0;
  max-width: 100%;
}

.kh-field-selected,
#kh_reply_attachment_selected,
#kh_reply_camera_attachment_selected {
  width: 100%;
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.35;
}

@media (max-width: 720px) {
  .kh-message-form {
    width: 100%;
    overflow-x: hidden;
  }

  .kh-message-form textarea,
  .kh-message-form input[type="text"],
  .kh-message-form input[type="email"],
  .kh-message-form input[type="url"],
  .kh-message-form input[type="password"] {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  .kh-attachment-choice-grid {
    grid-template-columns: 1fr !important;
    gap: 10px;
  }

  .kh-attachment-choice-grid .kh-attachment-dropzone {
    min-height: 92px;
    padding: 14px 12px;
    border-radius: 14px;
  }

  .kh-attachment-choice-grid .kh-attachment-inner {
    gap: 6px;
  }

  .kh-attachment-choice-grid .kh-attachment-text strong {
    font-size: 0.95rem;
  }

  .kh-attachment-choice-grid .kh-attachment-text small {
    font-size: 0.78rem;
    line-height: 1.25;
  }
}


/* Message attachment compact mobile redesign */
.kh-message-form .kh-field-attachment--rich {
  overflow: hidden;
}

.kh-attachment-choice-grid .kh-attachment-dropzone {
  cursor: pointer;
}

@media (max-width: 720px) {
  .kh-message-form .kh-field-attachment--rich {
    padding: 0;
    margin-top: 14px;
  }

  .kh-message-form .kh-field-attachment--rich > .kh-field-label {
    display: block;
    margin-bottom: 8px;
    font-size: 0.95rem;
    line-height: 1.2;
  }

  .kh-attachment-choice-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .kh-attachment-choice-grid .kh-attachment-dropzone {
    min-height: 0 !important;
    height: auto !important;
    padding: 10px 8px !important;
    border-radius: 12px !important;
    border-width: 1px !important;
    box-shadow: none !important;
    max-width: 100% !important;
  }

  .kh-attachment-choice-grid .kh-attachment-inner {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    text-align: left !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .kh-attachment-choice-grid .kh-attachment-plus,
  .kh-attachment-dropzone--camera .kh-attachment-plus.dashicons {
    flex: 0 0 28px !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    border-radius: 999px !important;
    font-size: 18px !important;
    line-height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .kh-attachment-choice-grid .kh-attachment-text {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .kh-attachment-choice-grid .kh-attachment-text strong {
    display: block !important;
    font-size: 0.84rem !important;
    line-height: 1.12 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .kh-attachment-choice-grid .kh-attachment-text small {
    display: none !important;
  }

  .kh-upload-status.kh-message-upload-status {
    margin: 6px 0 0 !important;
    padding: 8px 10px !important;
    border-radius: 10px !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .kh-upload-status.kh-message-upload-status .kh-upload-status-row {
    min-width: 0 !important;
  }

  .kh-upload-status.kh-message-upload-status .kh-upload-status-text {
    display: block !important;
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-size: 0.84rem !important;
  }

  .kh-message-form .kh-field-hint {
    margin-top: 8px !important;
    font-size: 0.82rem !important;
    line-height: 1.35 !important;
  }
}

@media (max-width: 380px) {
  .kh-attachment-choice-grid {
    grid-template-columns: 1fr !important;
  }
}


/* Admin modal viewport + Message Media Limits layout refinement */
.kh-modal.is-open {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: clamp(14px, 4vh, 36px) 14px;
  overflow-y: auto;
}

.kh-modal-dialog {
  margin: 0 auto;
  max-height: calc(100vh - 48px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

body.admin-bar .kh-modal-dialog {
  max-height: calc(100vh - 80px);
}

.kh-modal-header {
  flex: 0 0 auto;
}

.kh-modal-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding-right: 4px;
}

.kh-modal-dialog--message-media {
  width: min(760px, calc(100vw - 28px));
  max-width: 760px;
  padding: 1.15rem 1.25rem 0.9rem;
}

.kh-message-media-modal-body {
  display: grid;
  gap: 0.9rem;
}

.kh-message-media-section {
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 12px;
  padding: 0.85rem;
  background: #f8fafc;
}

.kh-message-media-section h4 {
  margin: 0 0 0.65rem;
}

.kh-message-media-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
}

.kh-message-media-grid p,
.kh-message-media-section--size p {
  margin: 0;
}

.kh-message-media-grid label,
.kh-message-media-section--size label {
  display: block;
  font-weight: 600;
  color: #0f172a;
}

.kh-message-media-grid input[type="number"],
.kh-message-media-section--size input[type="number"] {
  width: 100%;
  max-width: 100%;
  margin-top: 0.25rem;
}

.kh-modal-dialog--message-media .kh-modal-actions {
  flex: 0 0 auto;
  margin: 0.85rem -1.25rem -0.9rem;
  padding: 0.85rem 1.25rem;
  border-top: 1px solid rgba(148, 163, 184, 0.2);
  background: #ffffff;
  position: sticky;
  bottom: 0;
}

@media (max-width: 720px) {
  .kh-modal.is-open {
    padding: 10px;
  }

  .kh-modal-dialog,
  body.admin-bar .kh-modal-dialog {
    width: calc(100vw - 20px);
    max-height: calc(100vh - 20px);
  }

  .kh-modal-dialog--message-media {
    padding: 1rem 1rem 0.8rem;
  }

  .kh-message-media-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kh-modal-dialog--message-media .kh-modal-actions {
    margin: 0.85rem -1rem -0.8rem;
    padding: 0.75rem 1rem;
  }
}

/* Live selfie profile verification */
.kh-account-verification-card {
  position: relative;
  overflow: hidden;
}

.kh-verification-preview {
  display: grid;
  grid-template-columns: minmax(120px, 180px) 1fr;
  gap: 1rem;
  align-items: center;
  margin-bottom: 1rem;
}

.kh-verification-preview-media {
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  border: 2px solid #e5e7eb;
  background: #f9fafb;
  min-height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.kh-verification-status-pending .kh-verification-preview-media {
  border-color: #f59e0b;
  box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.14);
}

.kh-verification-status-verified .kh-verification-preview-media {
  border-color: #10b981;
  box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.14);
}

.kh-verification-status-rejected .kh-verification-preview-media {
  border-color: #ef4444;
  box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.12);
}

.kh-verification-selfie-image {
  width: 100%;
  height: 100%;
  max-height: 220px;
  object-fit: cover;
  display: block;
}

.kh-verification-stamp {
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 10px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 0.35rem 0.55rem;
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.82);
  color: #fff;
  font-size: 0.78rem;
  font-weight: 800;
  backdrop-filter: blur(6px);
}

.kh-verification-placeholder {
  width: 100%;
  min-height: 145px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  color: #6b7280;
  text-align: center;
  padding: 1rem;
}

.kh-verification-placeholder .dashicons {
  font-size: 34px;
  width: 34px;
  height: 34px;
}

.kh-verification-status-pill,
.kh-profile-verified-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  border-radius: 999px;
  padding: 0.18rem 0.52rem;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
}

.kh-verification-status-pill-none {
  background: #f3f4f6;
  color: #4b5563;
}

.kh-verification-status-pill-pending {
  background: #fef3c7;
  color: #92400e;
}

.kh-verification-status-pill-verified,
.kh-profile-verified-badge {
  background: #d1fae5;
  color: #065f46;
  border: 1px solid #a7f3d0;
}

.kh-verification-status-pill-rejected {
  background: #fee2e2;
  color: #991b1b;
}

.kh-profile-verified-badge::before {
  content: '✓';
  font-weight: 900;
}

.kh-verification-camera-button {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.7rem 1rem;
  border-radius: 999px;
  border: 1px solid #d1d5db;
  background: #fff;
  font-weight: 800;
  cursor: pointer;
  margin-bottom: 0.65rem;
}

.kh-verification-camera-button input[type="file"] {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}


.kh-verification-submit-button.kh-is-uploading,
.kh-verification-form.kh-is-uploading .kh-verification-camera-button {
  opacity: 0.7;
  pointer-events: none;
}

.kh-verification-upload-overlay {
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
  background: rgba(15, 23, 42, 0.58);
  backdrop-filter: blur(5px);
}

.kh-verification-form.kh-is-uploading .kh-verification-upload-overlay,
.kh-verification-upload-overlay.kh-is-visible {
  display: flex;
}

.kh-verification-upload-panel {
  width: min(92vw, 360px);
  border-radius: 22px;
  background: #fff;
  border: 1px solid rgba(255, 255, 255, 0.85);
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.35);
  padding: 1.35rem 1.2rem;
  text-align: center;
  color: #111827;
  display: grid;
  gap: 0.55rem;
  justify-items: center;
}

.kh-verification-upload-panel strong {
  font-size: 1.05rem;
  font-weight: 900;
}

.kh-verification-upload-panel span:not(.kh-verification-upload-spinner) {
  color: #6b7280;
  font-size: 0.9rem;
  line-height: 1.35;
}

.kh-verification-upload-spinner {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 4px solid #e5e7eb;
  border-top-color: #111827;
  animation: khVerificationSpin 0.8s linear infinite;
  display: inline-block;
}

@keyframes khVerificationSpin {
  to { transform: rotate(360deg); }
}

.kh-admin-verification-requests {
  margin-top: 1rem;
}

.kh-verification-admin-list {
  display: grid;
  gap: 1rem;
}

.kh-admin-verification-card {
  display: grid;
  grid-template-columns: minmax(150px, 220px) 1fr;
  gap: 1rem;
  align-items: center;
  border: 1px solid #e5e7eb;
  border-radius: 18px;
  padding: 1rem;
  background: #fff;
}

.kh-admin-verification-media {
  border-radius: 16px;
  overflow: hidden;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
}

.kh-admin-verification-image {
  display: block;
  width: 100%;
  height: 220px;
  object-fit: cover;
}

.kh-admin-verification-copy h4 {
  margin-top: 0;
  margin-bottom: 0.35rem;
}

.kh-admin-verification-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.75rem;
}

@media (max-width: 720px) {
  .kh-verification-preview,
  .kh-admin-verification-card {
    grid-template-columns: 1fr;
  }

  .kh-verification-preview-media {
    max-width: 220px;
  }

  .kh-admin-verification-image {
    height: 260px;
  }
}

.kh-user-card-avatar-verified {
  border: 2px solid #10b981 !important;
  box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.18);
}


.kh-user-card-avatar-frame {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  line-height: 0;
  border-radius: 16px;
}

.kh-user-card-avatar-frame .kh-user-card-avatar-media {
  width: 100% !important;
  height: 100% !important;
}

.kh-user-card-avatar-proof-badge {
  position: absolute;
  right: -5px;
  bottom: -5px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  padding: 0 6px;
  border-radius: 999px;
  border: 2px solid #fff;
  background: #10b981;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.22);
  pointer-events: none;
}

.kh-user-card-avatar-frame--verification-selfie .kh-user-card-avatar-proof-badge {
  background: #0f172a;
}

.kh-user-card-avatar-frame--verified-member.kh-user-card-avatar-frame--verification-selfie .kh-user-card-avatar-proof-badge {
  background: linear-gradient(135deg, #0f172a 0%, #10b981 100%);
}

.kh-user-card-avatar-media--verification-selfie {
  outline: 2px solid rgba(15, 23, 42, 0.7);
  outline-offset: 2px;
}



/* Tappable browse cards */
.kh-listing-row--tappable {
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(37, 99, 235, 0.10);
}

.kh-listing-row--tappable:focus-visible {
  outline: 3px solid rgba(37, 99, 235, 0.35);
  outline-offset: 3px;
}

.kh-listing-row--tappable a,
.kh-listing-row--tappable button {
  position: relative;
  z-index: 2;
}

@media (hover: hover) {
  .kh-listing-row--tappable:hover {
    transform: translateY(-1px);
  }
}

/* -------------------------------------------------------------------------- */
/* Card image chooser + crop modal                                             */
/* -------------------------------------------------------------------------- */
.kh-profile-avatar-preview-media .kh-user-card-avatar-media,
.kh-profile-avatar-custom-preview img,
.kh-profile-avatar-crop-stage img,
.kh-listing-line-avatar .kh-user-card-avatar-media,
.kh-single-author-avatar,
.kh-chat-header-avatar,
.kh-msg-avatar,
.kh-inbox-avatar {
  object-position: var(--kh-profile-image-focus, 50% 50%);
}

.kh-profile-avatar-mode-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 14px 0;
}

.kh-profile-avatar-mode-option {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 13px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  border-radius: 16px;
  background: #fff;
  cursor: pointer;
}

.kh-profile-avatar-mode-option:has(input:checked) {
  border-color: rgba(37, 99, 235, 0.45);
  background: linear-gradient(180deg, rgba(239, 246, 255, 0.95), rgba(255, 255, 255, 0.98));
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.08);
}

.kh-profile-avatar-mode-option input {
  margin-top: 3px;
}

.kh-profile-avatar-mode-option strong,
.kh-profile-avatar-mode-option small {
  display: block;
}

.kh-profile-avatar-mode-option strong {
  color: #0f172a;
  font-weight: 900;
}

.kh-profile-avatar-mode-option small {
  color: #64748b;
  line-height: 1.35;
  margin-top: 2px;
}

.kh-profile-avatar-custom-summary {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid rgba(37, 99, 235, 0.14);
  border-radius: 18px;
  background: rgba(248, 250, 252, 0.9);
  margin-bottom: 12px;
}

.kh-profile-avatar-custom-summary.is-disabled {
  opacity: 0.55;
}

.kh-profile-avatar-custom-preview {
  width: 86px;
  height: 86px;
  border-radius: 22px;
  overflow: hidden;
  border: 2px solid rgba(37, 99, 235, 0.20);
  background: #e2e8f0;
}

.kh-profile-avatar-custom-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.kh-profile-avatar-custom-copy strong {
  display: block;
  font-weight: 900;
  color: #0f172a;
  margin-bottom: 3px;
}

.kh-profile-avatar-crop-modal[hidden] {
  display: none !important;
}

.kh-profile-avatar-crop-modal {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: grid;
  place-items: center;
  padding: 22px;
}

.kh-profile-avatar-crop-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.62);
  backdrop-filter: blur(3px);
}

.kh-profile-avatar-crop-dialog {
  position: relative;
  width: min(920px, calc(100vw - 32px));
  max-height: min(780px, calc(100vh - 32px));
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 24px 80px rgba(15, 23, 42, 0.32);
}

.kh-profile-avatar-crop-header,
.kh-profile-avatar-crop-actions {
  padding: 16px 18px;
  border-bottom: 1px solid rgba(226, 232, 240, 0.95);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.kh-profile-avatar-crop-header h3 {
  margin: 0;
  font-size: 1.14rem;
  color: #0f172a;
}

.kh-profile-avatar-crop-header p {
  margin: 3px 0 0;
  color: #64748b;
}

.kh-profile-avatar-crop-close {
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 999px;
  background: #f1f5f9;
  color: #0f172a;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}

.kh-profile-avatar-crop-body {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) 260px;
  gap: 18px;
  padding: 18px;
  overflow: auto;
}

.kh-profile-avatar-crop-stage {
  position: relative;
  width: min(520px, 100%);
  aspect-ratio: 1 / 1;
  justify-self: center;
  border-radius: 26px;
  overflow: hidden;
  background: #e2e8f0;
  border: 4px solid rgba(37, 99, 235, 0.22);
  cursor: grab;
  touch-action: none;
  user-select: none;
}

.kh-profile-avatar-crop-stage.is-dragging {
  cursor: grabbing;
}

.kh-profile-avatar-crop-stage img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  pointer-events: none;
}

.kh-profile-avatar-crop-grid {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(to right, transparent 33.333%, rgba(255,255,255,.38) 33.333%, rgba(255,255,255,.38) calc(33.333% + 1px), transparent calc(33.333% + 1px), transparent 66.666%, rgba(255,255,255,.38) 66.666%, rgba(255,255,255,.38) calc(66.666% + 1px), transparent calc(66.666% + 1px)),
    linear-gradient(to bottom, transparent 33.333%, rgba(255,255,255,.38) 33.333%, rgba(255,255,255,.38) calc(33.333% + 1px), transparent calc(33.333% + 1px), transparent 66.666%, rgba(255,255,255,.38) 66.666%, rgba(255,255,255,.38) calc(66.666% + 1px), transparent calc(66.666% + 1px));
  box-shadow: inset 0 0 0 9999px rgba(15, 23, 42, 0.02);
}

.kh-profile-avatar-crop-sidebar {
  min-width: 0;
}

.kh-profile-avatar-crop-choices {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.kh-profile-avatar-crop-choice {
  border: 2px solid transparent;
  border-radius: 14px;
  padding: 0;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  background: #e2e8f0;
  cursor: pointer;
}

.kh-profile-avatar-crop-choice img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.kh-profile-avatar-crop-choice.is-selected {
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.16);
}


.kh-profile-avatar-crop-choice {
  position: relative;
}

.kh-profile-avatar-crop-choice--verification {
  border-color: rgba(245, 158, 11, 0.55);
}

.kh-profile-avatar-crop-choice-label {
  position: absolute;
  left: 6px;
  right: 6px;
  bottom: 6px;
  padding: 4px 6px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.82);
  color: #fff;
  font-size: 11px;
  line-height: 1.2;
  text-align: center;
  font-weight: 600;
  pointer-events: none;
}


.kh-profile-avatar-crop-actions {
  border-top: 1px solid rgba(226, 232, 240, 0.95);
  border-bottom: 0;
  justify-content: flex-end;
}

.kh-profile-crop-open {
  overflow: hidden;
}

@media (max-width: 720px) {
  .kh-profile-avatar-mode-row {
    grid-template-columns: 1fr;
  }

  .kh-profile-avatar-custom-summary {
    grid-template-columns: 74px minmax(0, 1fr);
  }

  .kh-profile-avatar-custom-preview {
    width: 70px;
    height: 70px;
    border-radius: 18px;
  }

  .kh-profile-avatar-crop-modal {
    padding: 10px;
  }

  .kh-profile-avatar-crop-dialog {
    width: calc(100vw - 20px);
    max-height: calc(100vh - 20px);
    border-radius: 20px;
  }

  .kh-profile-avatar-crop-header,
  .kh-profile-avatar-crop-actions {
    padding: 13px;
  }

  .kh-profile-avatar-crop-body {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 13px;
  }

  .kh-profile-avatar-crop-stage {
    width: min(82vw, 360px);
    border-radius: 22px;
  }

  .kh-profile-avatar-crop-choices {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    overflow-x: auto;
    display: flex;
    padding-bottom: 4px;
  }

  .kh-profile-avatar-crop-choice {
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
  }
}

/* Blocked users / user blocking controls */
.kh-listing-line-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
  flex: 0 0 auto;
}

.kh-save-listing-btn--row {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.14);
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  line-height: 1;
  padding: 0;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
}

.kh-save-listing-btn--row.kh-saved-active {
  background: #fff7d6;
  border-color: rgba(234, 179, 8, 0.45);
}

.kh-block-user-btn .kh-block-user-label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.kh-block-user-btn--single .kh-block-user-icon,
.kh-block-user-btn--inbox .kh-block-user-icon,
.kh-block-user-btn--conversation .kh-block-user-icon {
  font-size: 18px;
  font-weight: 800;
}

.kh-block-user-btn.kh-blocked-active {
  background: #fee2e2;
  border-color: rgba(220, 38, 38, 0.35);
}

.kh-block-user-btn--single {
  min-height: 36px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.14);
  background: #fff;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 12px;
  cursor: pointer;
}

.kh-block-user-btn--single .kh-block-user-label {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
  white-space: normal;
}

.kh-blocked-users-modal[hidden] {
  display: none !important;
}

.kh-blocked-users-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
}

.kh-blocked-users-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.58);
  backdrop-filter: blur(4px);
}

.kh-blocked-users-dialog {
  position: relative;
  z-index: 1;
  width: min(620px, calc(100vw - 28px));
  max-height: min(720px, calc(100vh - 28px));
  background: #fff;
  border-radius: 24px;
  box-shadow: 0 26px 80px rgba(15, 23, 42, 0.28);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.kh-blocked-users-header {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 20px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.1);
}

.kh-blocked-users-header h3,
.kh-blocked-users-header p {
  margin: 0;
}

.kh-blocked-users-header p {
  color: #64748b;
  font-size: 13px;
  margin-top: 3px;
}

.kh-blocked-users-close {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.14);
  background: #fff;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}

.kh-blocked-users-list {
  padding: 14px;
  overflow: auto;
}

.kh-blocked-users-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 18px;
  margin-bottom: 10px;
  background: #fff;
}

.kh-blocked-users-person {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.kh-blocked-users-person .kh-card-avatar,
.kh-blocked-users-person img.avatar {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  flex: 0 0 48px;
}

.kh-blocked-users-person strong,
.kh-blocked-users-person small {
  display: block;
}

.kh-blocked-users-person small {
  color: #64748b;
  font-size: 12px;
  margin-top: 2px;
}

.kh-blocked-users-empty {
  padding: 20px;
  text-align: center;
  color: #64748b;
  border: 1px dashed rgba(15, 23, 42, 0.18);
  border-radius: 18px;
}

.kh-blocked-users-open {
  overflow: hidden;
}

@media (max-width: 720px) {
  .kh-listing-line {
    align-items: flex-start;
  }

  .kh-listing-line-actions {
    flex-direction: column;
    gap: 6px;
  }

  .kh-save-listing-btn--row,
  .kh-block-user-btn--row {
    width: 31px;
    height: 31px;
  }

  .kh-blocked-users-modal {
    padding: 10px;
  }

  .kh-blocked-users-dialog {
    width: calc(100vw - 20px);
    max-height: calc(100vh - 20px);
    border-radius: 20px;
  }

  .kh-blocked-users-header,
  .kh-blocked-users-list {
    padding: 13px;
  }

  .kh-blocked-users-row {
    align-items: flex-start;
  }
}



/* Mobile My Account section picker */
.kh-account-mobile-tabs {
  display: none;
}

@media (max-width: 1100px) {
  .kh-account-mobile-tabs {
    display: grid;
    gap: 0.45rem;
    margin: 0 0 0.9rem;
    padding: 0.85rem;
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
  }

  .kh-account-mobile-tabs-label {
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #64748b;
  }

  .kh-account-mobile-tabs-select {
    width: 100%;
    min-height: 46px;
    border: 1px solid rgba(148, 163, 184, 0.36);
    border-radius: 14px;
    background: #f8fafc;
    color: #0f172a;
    font-size: 0.98rem;
    font-weight: 850;
    padding: 0.72rem 0.9rem;
  }

  .kh-account-grid.kh-account-tabs-enabled {
    display: block;
  }

  .kh-account-grid.kh-account-tabs-enabled > .kh-account-summary-card {
    display: none;
    width: 100%;
    margin-bottom: 0.9rem;
  }

  .kh-account-grid.kh-account-tabs-enabled > .kh-account-summary-card.kh-account-tab-active {
    display: block;
  }

  .kh-account-grid.kh-account-tabs-enabled > .kh-account-summary-card.kh-account-tab-active:last-child {
    margin-bottom: 0;
  }
}

/* Desktop My Account tabs + modal stacking safety */
.kh-account-tabs {
  display: none;
}

.kh-account-modal-owner-active {
  position: relative;
  z-index: 100002;
}

.kh-profile-avatar-crop-modal {
  z-index: 100003;
}

.kh-profile-crop-open .kh-account-grid,
.kh-blocked-users-open .kh-account-grid {
  isolation: isolate;
}

@media (min-width: 1101px) {
  .kh-account-tabs {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    flex-wrap: wrap;
    margin: 0 0 1rem;
    padding: 0.75rem 1rem;
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.04);
  }

  .kh-account-tab-button {
    appearance: none;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: #334155;
    cursor: pointer;
    font-weight: 800;
    padding: 0.78rem 1rem;
    line-height: 1;
    white-space: nowrap;
  }

  .kh-account-tab-button:hover,
  .kh-account-tab-button:focus {
    background: rgba(226, 232, 240, 0.72);
    color: #0f172a;
    outline: none;
  }

  .kh-account-tab-button.is-active,
  .kh-account-tab-button[aria-selected="true"] {
    background: #111827;
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.16);
  }

  .kh-account-grid.kh-account-tabs-enabled {
    display: block;
  }

  .kh-account-grid.kh-account-tabs-enabled > .kh-account-summary-card {
    display: none;
    width: 100%;
    margin-bottom: 1rem;
  }

  .kh-account-grid.kh-account-tabs-enabled > .kh-account-summary-card.kh-account-tab-active {
    display: block;
  }

  .kh-account-grid.kh-account-tabs-enabled > .kh-account-summary-card.kh-account-tab-active:last-child {
    margin-bottom: 0;
  }

  .kh-account-grid.kh-account-tabs-enabled .kh-account-summary-card {
    padding: 1.15rem 1.25rem;
  }

  .kh-account-grid.kh-account-tabs-enabled .kh-account-avatar-card .kh-profile-avatar-preview {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
  }

  .kh-account-grid.kh-account-tabs-enabled .kh-account-avatar-card .kh-profile-avatar-form--modal {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
  }

  .kh-account-grid.kh-account-tabs-enabled .kh-account-avatar-card .kh-profile-avatar-mode-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(240px, 1fr));
    gap: 1rem;
  }

  .kh-account-grid.kh-account-tabs-enabled .kh-account-avatar-card .kh-profile-avatar-custom-summary {
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
  }

  .kh-account-grid.kh-account-tabs-enabled .kh-account-avatar-card .kh-button[type="submit"] {
    width: 100%;
    justify-content: center;
  }

  .kh-account-grid.kh-account-tabs-enabled .kh-account-verification-card .kh-verification-preview {
    display: grid;
    grid-template-columns: minmax(220px, 290px) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
  }

  .kh-account-grid.kh-account-tabs-enabled .kh-account-email-prefs form {
    max-width: 720px;
  }
}

/* Account page calm mode: remove hover lift/jump and stabilize crop modals. */
html.kh-profile-crop-open,
html.kh-blocked-users-open {
  overflow: hidden !important;
  scrollbar-gutter: stable;
}

.kh-wrapper.kh-account .kh-account-summary-card,
.kh-wrapper.kh-account .kh-account-summary-card:hover,
.kh-wrapper.kh-account .kh-card,
.kh-wrapper.kh-account .kh-card:hover,
.kh-wrapper.kh-account .kh-listing-line,
.kh-wrapper.kh-account .kh-listing-line:hover,
.kh-wrapper.kh-account .kh-slot,
.kh-wrapper.kh-account .kh-slot:hover,
.kh-wrapper.kh-account .kh-video-slot,
.kh-wrapper.kh-account .kh-video-slot:hover,
.kh-wrapper.kh-account .kh-account-tab-button,
.kh-wrapper.kh-account .kh-account-tab-button:hover,
.kh-wrapper.kh-account .kh-button,
.kh-wrapper.kh-account .kh-button:hover {
  transform: none !important;
  transition-property: background-color, border-color, color, box-shadow, opacity !important;
  transition-duration: 0.12s !important;
}

.kh-wrapper.kh-account .kh-account-summary-card:hover {
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06) !important;
}

.kh-profile-crop-open .kh-wrapper.kh-account *,
.kh-blocked-users-open .kh-wrapper.kh-account * {
  transform: none !important;
  animation: none !important;
}

.kh-profile-avatar-crop-modal,
.kh-blocked-users-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483000 !important;
  isolation: isolate !important;
  contain: layout paint style !important;
}

.kh-profile-avatar-crop-backdrop,
.kh-blocked-users-backdrop {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.kh-profile-avatar-crop-dialog,
.kh-blocked-users-dialog {
  transform: none !important;
  animation: none !important;
}

.kh-profile-avatar-crop-stage img {
  transition: none !important;
}

/* Account save confirmations should behave like calm toasts, not layout blocks. */
.kh-wrapper.kh-account .kh-account-toast {
  position: fixed !important;
  top: 86px;
  right: 24px;
  left: auto !important;
  width: min(360px, calc(100vw - 32px));
  max-width: calc(100vw - 32px);
  margin: 0 !important;
  z-index: 2147482000;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.16);
  border-radius: 14px;
  animation: none !important;
  transform: none !important;
  opacity: 1;
  transition: opacity 0.28s ease, transform 0.28s ease;
}

.kh-wrapper.kh-account .kh-account-toast.is-dismissing {
  opacity: 0;
  transform: translateY(-6px) !important;
  pointer-events: none;
}

@media (max-width: 720px) {
  .kh-wrapper.kh-account .kh-account-toast {
    top: 78px;
    right: 12px;
    width: calc(100vw - 24px);
  }
}


/* Conversation view polish */
.kh-reply-view {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.kh-conversation-hero {
  padding: 1rem 1.1rem;
  background: linear-gradient(90deg, #f8f9fb 0%, #e5f1fb 52%, #ffffff 100%);
  border: 1px solid rgba(15, 23, 42, 0.05);
  border-radius: 14px;
}

.kh-conversation-eyebrow {
  display: inline-block;
  margin-bottom: 0.2rem;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
}

.kh-conversation-title {
  margin: 0 0 0.5rem;
  font-size: 1.95rem;
  line-height: 1.1;
  color: #0f172a;
}

.kh-conversation-listing-line,
.kh-conversation-subject-line {
  margin: 0;
  color: #334155;
  font-size: 0.96rem;
}

.kh-conversation-listing-line {
  margin-bottom: 0.9rem;
}

.kh-conversation-participant-card {
  display: flex;
  align-items: center;
  gap: 14px;
}

.kh-conversation-participant-meta {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.kh-conversation-participant-label {
  display: inline-block;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
}

.kh-conversation-participant-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.kh-conversation-name {
  font-size: 1.02rem;
  font-weight: 800;
  color: #0f172a;
}

.kh-reply-view .kh-chat-lastseen,
.kh-reply-view .kh-verified-badge,
.kh-reply-view .kh-profile-verified-badge,
.kh-reply-view .kh-block-user-btn--conversation {
  display: inline-flex;
  align-items: center;
  gap: 0.32rem;
  min-height: 30px;
  border-radius: 999px;
  padding: 0.18rem 0.62rem;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
}

.kh-reply-view .kh-chat-lastseen {
  background: #ecfdf5;
  color: #047857;
  border: 1px solid #bbf7d0;
}

.kh-reply-view .kh-chat-lastseen.kh-conversation-status-pill--lastseen {
  background: #f8fafc;
  color: #475569;
  border-color: #e2e8f0;
}

.kh-reply-view .kh-verified-badge {
  background: #eefbf7;
  color: #0f766e;
  border: 1px solid #bae6d3;
}

.kh-reply-view .kh-verified-badge::before {
  content: '★';
  font-size: 0.72rem;
}

.kh-block-user-btn--conversation {
  border: 1px solid rgba(15, 23, 42, 0.14);
  background: #ffffff;
  color: #0f172a;
  cursor: pointer;
  padding-right: 0.72rem;
}

.kh-block-user-btn--conversation .kh-block-user-label {
  position: static;
  width: auto;
  height: auto;
  padding: 0;
  margin: 0;
  overflow: visible;
  clip: auto;
  white-space: nowrap;
  border: 0;
}

.kh-block-user-btn--conversation .dashicons,
.kh-block-user-btn--conversation .kh-block-user-icon {
  font-size: 16px;
  width: 16px;
  height: 16px;
  line-height: 16px;
}

.kh-block-user-btn--conversation.kh-blocked-active,
.kh-block-user-btn--conversation.kh-conversation-action-btn--unblock {
  background: #fee2e2;
  color: #991b1b;
  border-color: rgba(220, 38, 38, 0.35);
}

.kh-reply-view .kh-chat-user-card-avatar {
  flex: 0 0 auto;
  line-height: 0;
}

.kh-reply-view .kh-chat-header-avatar.kh-user-card-avatar-media {
  width: 70px;
  height: 70px;
  border-radius: 18px;
}

.kh-reply-view .kh-conversation {
  margin-top: 0;
}

.kh-reply-section {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.kh-reply-section-title {
  margin: 0;
}

.kh-message-form--reply-view {
  margin-bottom: 0;
}

.kh-conversation-footer-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.kh-conversation-delete-form {
  margin: 0;
}

.kh-conversation-send-btn,
.kh-conversation-delete-btn {
  min-height: 40px;
  padding: 0.62rem 1rem;
  font-weight: 700;
}

.kh-conversation-delete-btn {
  background: #b91c1c;
  border-color: #b91c1c;
  color: #ffffff;
}

.kh-conversation-delete-btn:hover,
.kh-conversation-delete-btn:focus {
  background: #991b1b;
  border-color: #991b1b;
  color: #ffffff;
}

@media (max-width: 720px) {
  .kh-conversation-hero {
    padding: 0.9rem;
  }

  .kh-conversation-title {
    font-size: 1.55rem;
  }

  .kh-conversation-participant-card {
    align-items: flex-start;
  }

  .kh-reply-view .kh-chat-header-avatar.kh-user-card-avatar-media {
    width: 58px;
    height: 58px;
    border-radius: 16px;
  }

  .kh-conversation-footer-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .kh-conversation-send-btn,
  .kh-conversation-delete-btn,
  .kh-conversation-delete-form {
    width: 100%;
  }
}


/* Mobile conversation header alignment refinement */
@media (max-width: 720px) {
  .kh-conversation-participant-meta {
    align-items: flex-start;
  }

  .kh-conversation-subject-line {
    width: 100%;
    text-align: left;
    align-self: flex-start;
  }
}


/* Mobile message/inbox alignment polish */
@media (max-width: 980px) {
  .kh-inbox .kh-inbox-table tbody tr.kh-inbox-row {
    padding: 1rem;
    border-radius: 16px;
  }

  .kh-inbox .kh-inbox-table tbody td[data-label="From"],
  .kh-inbox .kh-inbox-table tbody td[data-label="Subject"] {
    display: grid !important;
    grid-template-columns: 64px minmax(0, 1fr);
    align-items: center;
    column-gap: 8px;
    padding: 0.2rem 0 !important;
    text-align: left;
  }

  .kh-inbox .kh-inbox-table tbody td[data-label="From"]::before,
  .kh-inbox .kh-inbox-table tbody td[data-label="Subject"]::before {
    grid-column: 1;
    content: attr(data-label) ":" !important;
    margin: 0 !important;
    color: #64748b;
    font-weight: 700;
    max-width: none;
    flex: none;
  }

  .kh-inbox .kh-inbox-user-cell {
    grid-column: 2;
    justify-self: start;
  }

  .kh-inbox .kh-inbox-table tbody td[data-label="Subject"] {
    margin-top: 0.45rem;
  }

  .kh-inbox .kh-inbox-table tbody td.kh-inbox-actions {
    display: flex !important;
    align-items: center;
    justify-content: space-between !important;
    gap: 0.75rem;
    margin-top: 0.85rem;
    padding-top: 0.85rem !important;
    border-top: 1px solid #eef2f7 !important;
    text-align: left;
  }

  .kh-inbox .kh-inbox-table tbody td.kh-inbox-actions::before {
    content: "Actions" !important;
    margin: 0 !important;
    color: #334155;
    font-weight: 700;
    flex: 0 0 auto;
    max-width: none;
  }

  .kh-inbox .kh-inbox-action-group {
    margin-left: auto;
    justify-content: flex-end;
  }
}

@media (max-width: 720px) {
  .kh-conversation-participant-card {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    align-items: start;
    column-gap: 12px;
    row-gap: 0.5rem;
  }

  .kh-conversation-participant-card .kh-chat-user-card-avatar {
    grid-column: 1;
    grid-row: 1 / span 2;
  }

  .kh-conversation-participant-meta {
    display: contents;
  }

  .kh-conversation-participant-label,
  .kh-conversation-participant-row {
    grid-column: 2;
  }

  .kh-conversation-subject-line {
    grid-column: 1 / -1;
    width: 100%;
    text-align: left;
    margin-top: 0.15rem;
  }
}


/* Single listing header polish: unify desktop/mobile profile headers */
.kh-single-header {
  border: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
}

.kh-single-header-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 0.75rem 1rem;
}

.kh-single-title {
  margin: 0;
  line-height: 1.15;
}

.kh-single-header-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
}

.kh-single-header .kh-save-listing-btn,
.kh-single-header .kh-block-user-btn--single {
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
  padding: 0;
  margin: 0;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  background: rgba(255, 255, 255, 0.92);
  color: #334155;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08);
}

.kh-single-header .kh-save-listing-btn:hover,
.kh-single-header .kh-save-listing-btn:focus,
.kh-single-header .kh-block-user-btn--single:hover,
.kh-single-header .kh-block-user-btn--single:focus {
  background: #ffffff;
  border-color: rgba(15, 23, 42, 0.18);
  color: #0f172a;
}

.kh-single-header .kh-save-listing-btn .dashicons,
.kh-single-header .kh-block-user-btn--single .dashicons,
.kh-single-header .kh-block-user-btn--single .kh-block-user-icon {
  width: 18px;
  height: 18px;
  font-size: 18px;
  line-height: 18px;
}

.kh-single-header .kh-save-listing-btn.kh-saved-active {
  background: #fff7d6;
  border-color: rgba(234, 179, 8, 0.42);
}

.kh-single-header .kh-save-listing-btn.kh-saved-active .dashicons {
  color: #d97706;
}

.kh-single-header .kh-block-user-btn--single {
  cursor: pointer;
}

.kh-single-header .kh-block-user-btn--single .kh-block-user-label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.kh-single-header .kh-block-user-btn--single.kh-blocked-active,
.kh-single-header .kh-block-user-btn--single.kh-single-action-btn--unblock {
  background: #fee2e2;
  border-color: rgba(220, 38, 38, 0.32);
  color: #991b1b;
}

.kh-single-presence-row {
  margin-top: 0.9rem;
  align-items: center;
}

.kh-single-author-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem;
  min-width: 0;
}

.kh-single-author-name {
  font-size: 1.02rem;
  font-weight: 800;
  color: #0f172a;
}

.kh-single-presence-row .kh-presence-pill,
.kh-single-presence-row .kh-verified-badge,
.kh-single-presence-row .kh-profile-verified-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  min-height: 30px;
  padding: 0.18rem 0.62rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
}

.kh-single-presence-row .kh-presence-pill {
  border: 1px solid transparent;
}

.kh-single-presence-row .kh-online-pill {
  background: #ecfdf5;
  color: #047857;
  border-color: #bbf7d0;
}

.kh-single-presence-row .kh-last-seen-pill {
  background: #f8fafc;
  color: #475569;
  border-color: #e2e8f0;
}

.kh-single-presence-row .kh-verified-badge {
  background: #eefbf7;
  color: #0f766e;
  border: 1px solid #bae6d3;
}

.kh-single-presence-row .kh-verified-badge::before {
  content: '★';
  font-size: 0.72rem;
}

.kh-single-presence-row .kh-profile-verified-badge {
  background: #d1fae5;
  color: #065f46;
  border: 1px solid #a7f3d0;
}

@media (max-width: 720px) {
  .kh-single-header {
    padding: 0.9rem;
  }

  .kh-single-header-main {
    grid-template-columns: 1fr;
  }

  .kh-single-title {
    width: 100%;
    font-size: 1.45rem;
  }

  .kh-single-header-actions {
    width: 100%;
    justify-content: flex-end;
  }

  .kh-single-presence-row {
    align-items: flex-start;
  }

  .kh-single-author-meta {
    align-items: flex-start;
  }
}


/* Mobile single-header action placement refinement */
@media (max-width: 720px) {
  .kh-single-header {
    position: relative;
    padding: 0.95rem 0.9rem 0.9rem;
  }

  .kh-single-header-main {
    display: block;
    position: static;
  }

  .kh-single-header-actions {
    position: absolute;
    top: 0.95rem;
    right: 0.9rem;
    width: auto;
    justify-content: flex-end;
    gap: 0.45rem;
  }

  .kh-single-title {
    display: block;
    width: 100%;
    max-width: none;
    padding-right: 5.75rem;
    min-height: 2.8em;
    line-height: 1.18;
    word-break: break-word;
  }

  .kh-single-presence-row {
    margin-top: 0.75rem;
    align-items: flex-start;
    gap: 0.8rem;
  }

  .kh-single-author-avatar.kh-user-card-avatar-media {
    width: 66px;
    height: 66px;
    border-radius: 16px;
  }

  .kh-single-author-meta {
    flex: 1 1 auto;
    gap: 0.45rem;
    padding-top: 0.08rem;
  }
}


/* Single listing header: remove redundant author avatar from the header */
.kh-single-header .kh-single-author-avatar-wrap {
  display: none !important;
}

.kh-single-header .kh-single-presence-row {
  margin-top: 0.85rem;
  gap: 0;
}

.kh-single-header .kh-single-author-meta {
  width: 100%;
}

@media (max-width: 720px) {
  .kh-single-header .kh-single-presence-row {
    margin-top: 0.65rem;
  }

  .kh-single-header .kh-single-author-meta {
    padding-top: 0;
  }
}


/* Single header compact status-only row after removing avatar/name */
.kh-single-presence-row {
  margin-top: 0.85rem;
}

.kh-single-presence-row .kh-single-author-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem;
}

@media (max-width: 720px) {
  .kh-single-presence-row {
    margin-top: 0.7rem;
  }
}


/* Message attachment upload overlay */
.kh-message-form--reply-view.kh-is-uploading .kh-attachment-dropzone,
.kh-message-form--reply-view.kh-is-uploading textarea,
.kh-message-form--reply-view.kh-is-uploading input[type="file"] {
  pointer-events: none;
}

.kh-message-upload-overlay {
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
  background: rgba(15, 23, 42, 0.58);
  backdrop-filter: blur(5px);
}

.kh-message-form--reply-view.kh-is-uploading .kh-message-upload-overlay,
.kh-message-upload-overlay.kh-is-visible {
  display: flex;
}

.kh-message-upload-panel {
  width: min(92vw, 370px);
  border-radius: 22px;
  background: #fff;
  border: 1px solid rgba(255, 255, 255, 0.85);
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.35);
  padding: 1.35rem 1.2rem;
  text-align: center;
  color: #111827;
  display: grid;
  gap: 0.55rem;
  justify-items: center;
}

.kh-message-upload-panel strong {
  font-size: 1.05rem;
  font-weight: 900;
}

.kh-message-upload-panel span:not(.kh-message-upload-spinner) {
  color: #6b7280;
  font-size: 0.9rem;
  line-height: 1.35;
}

.kh-message-upload-spinner {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 4px solid #e5e7eb;
  border-top-color: #111827;
  animation: khVerificationSpin 0.8s linear infinite;
  display: inline-block;
}


/* Message media smart limit feedback */
.kh-message-media-limit-status {
  margin: 0.45rem 0 0;
  font-size: 0.82rem;
  font-weight: 700;
  color: #475569;
}

.kh-message-media-limit-status--error {
  color: #991b1b;
}

.kh-attachment-dropzone--disabled {
  opacity: 0.48;
  cursor: not-allowed;
  filter: grayscale(0.25);
}

.kh-attachment-dropzone--disabled:hover {
  border-color: rgba(15, 23, 42, 0.14);
  box-shadow: none;
  background: rgba(15, 23, 42, 0.03);
}


/* Message media counters inside chooser cards */
.kh-field-attachment--rich .kh-attachment-dropzone {
  position: relative;
}

.kh-field-attachment--rich .kh-attachment-counter {
  position: absolute;
  top: 0.55rem;
  right: 0.55rem;
  z-index: 2;
  min-width: 42px;
  padding: 0.18rem 0.45rem;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.82);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.15;
  text-align: center;
  pointer-events: none;
}

.kh-field-attachment--rich .kh-message-upload-status.is-selected {
  display: none !important;
}

.kh-field-attachment--rich .kh-message-media-limit-status {
  margin: 0.5rem 0 0;
  font-size: 0.86rem;
}

.kh-field-attachment--rich .kh-message-media-limit-status:empty {
  display: none !important;
}

.kh-field-attachment--rich .kh-attachment-dropzone--disabled {
  opacity: 0.48;
  cursor: not-allowed;
}


/* Message attachment chooser: short labels + cleaner counters */
.kh-field-attachment--rich .kh-attachment-dropzone {
  overflow: visible;
}

.kh-field-attachment--rich .kh-attachment-counter {
  top: 0.42rem;
  right: 0.42rem;
  min-width: 36px;
  padding: 0.16rem 0.38rem;
  font-size: 0.68rem;
  line-height: 1.05;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.22);
}

.kh-field-attachment--rich .kh-attachment-text strong {
  font-weight: 900;
}

.kh-field-attachment--rich .kh-attachment-text small {
  display: none !important;
}

@media (min-width: 721px) {
  .kh-field-attachment--rich .kh-attachment-choice-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .kh-field-attachment--rich .kh-attachment-choice-grid .kh-attachment-dropzone {
    min-height: 88px;
    padding-top: 1.35rem;
  }
}

@media (max-width: 720px) {
  .kh-field-attachment--rich .kh-attachment-choice-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 7px !important;
  }

  .kh-field-attachment--rich .kh-attachment-choice-grid .kh-attachment-dropzone {
    padding: 18px 6px 8px !important;
    min-height: 70px !important;
  }

  .kh-field-attachment--rich .kh-attachment-choice-grid .kh-attachment-inner {
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 5px !important;
    text-align: center !important;
  }

  .kh-field-attachment--rich .kh-attachment-choice-grid .kh-attachment-plus,
  .kh-field-attachment--rich .kh-attachment-dropzone--camera .kh-attachment-plus.dashicons {
    flex-basis: 26px !important;
    width: 26px !important;
    height: 26px !important;
    min-width: 26px !important;
    font-size: 17px !important;
    line-height: 26px !important;
  }

  .kh-field-attachment--rich .kh-attachment-choice-grid .kh-attachment-text strong {
    font-size: 0.78rem !important;
    line-height: 1.05 !important;
    max-width: 100% !important;
  }

  .kh-field-attachment--rich .kh-attachment-counter {
    top: 5px;
    right: 5px;
    min-width: 31px;
    padding: 0.12rem 0.28rem;
    font-size: 0.62rem;
  }
}

@media (max-width: 380px) {
  .kh-field-attachment--rich .kh-attachment-choice-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}


/* Tablet-as-mobile app shell: use the same bottom navigation and off-canvas Quick Actions
   on tablets that we use on phones, instead of stacking Quick Actions above content. */
@media (max-width: 1100px) {
  .kh-layout {
    grid-template-columns: 1fr;
  }

  .kh-sidebar.kh-sidebar--mobile {
    position: fixed;
    top: 70px;
    left: -230px;
    width: 220px;
    max-height: calc(100vh - 90px);
    overflow-y: auto;
    z-index: 1000;
    transition: left 0.25s ease;
  }

  .kh-sidebar.kh-sidebar--mobile.kh-sidebar--open {
    left: 0.75rem;
  }

  .kh-sidebar.kh-sidebar--mobile .kh-sidebar-title {
    display: none;
  }

  body.kh-bottom-actions-active {
    padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .kh-bottom-actions-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: space-around;
    align-items: stretch;
    padding: 0 env(safe-area-inset-left) env(safe-area-inset-bottom) env(safe-area-inset-right);
    background: #ffffff;
    border-top: 2px solid #2563eb;
    padding-top: 4px;
    padding-bottom: calc(env(safe-area-inset-bottom) + 8px);
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
    z-index: 20000;
  }

  .kh-bottom-actions-button {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    padding: 0.25rem 0 0.5rem;
    border: none;
    border-radius: 0;
    background: transparent;
    color: #2563eb;
    text-decoration: none;
  }

  .kh-bottom-actions-button.kh-bottom-actions-active {
    background: rgba(37, 99, 235, 0.08);
    border-radius: 999px;
    box-shadow: 0 2px 4px rgba(15, 23, 42, 0.18);
    transform: translateY(-2px);
  }

  .kh-bottom-actions-button.kh-bottom-actions-active .dashicons,
  .kh-bottom-actions-button.kh-bottom-actions-active .kh-bottom-actions-label {
    color: #2563eb;
    font-weight: 600;
  }

  .kh-bottom-actions-button .dashicons {
    font-size: 1.15rem;
    line-height: 1;
  }

  .kh-bottom-actions-label {
    max-height: none !important;
    overflow: visible !important;
  }

  body.kh-bottom-actions-active .classicore-footer-wrapper {
    display: none !important;
  }
}


/* WooCommerce My Account polish: match the ClassiCore account tab experience. */
.woocommerce-account .woocommerce,
.woocommerce-account .entry-content > .woocommerce {
  width: min(100%, 1120px);
  margin: 2.25rem auto;
  padding: clamp(1rem, 2.5vw, 1.5rem);
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 26px;
  background: #ffffff;
  box-shadow: 0 18px 55px rgba(15, 23, 42, 0.06);
  box-sizing: border-box;
}

.woocommerce-account .woocommerce::before,
.woocommerce-account .woocommerce::after {
  content: none !important;
  display: none !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 1rem !important;
  padding: 0.75rem 1rem;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.04);
  box-sizing: border-box;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  border: 0;
  border-radius: 12px;
  background: #f8fafc;
  color: #334155;
  font-weight: 850;
  line-height: 1;
  padding: 0.78rem 1rem;
  text-decoration: none !important;
  white-space: nowrap;
  box-sizing: border-box;
}

.woocommerce-account .woocommerce-MyAccount-navigation a:hover,
.woocommerce-account .woocommerce-MyAccount-navigation a:focus {
  background: rgba(226, 232, 240, 0.72);
  color: #0f172a;
  outline: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation .is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link.is-active a {
  background: #111827;
  color: #ffffff;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.16);
}

.woocommerce-account .woocommerce-MyAccount-content {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  clear: both !important;
  margin: 0 !important;
  padding: clamp(1rem, 2vw, 1.35rem);
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 22px;
  background: #ffffff;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
  box-sizing: border-box;
  color: #334155;
}

.woocommerce-account .woocommerce-MyAccount-content > *:first-child {
  margin-top: 0;
}

.woocommerce-account .woocommerce-MyAccount-content > *:last-child {
  margin-bottom: 0;
}

.woocommerce-account .woocommerce-MyAccount-content p,
.woocommerce-account .woocommerce-MyAccount-content form,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-orders-table,
.woocommerce-account .woocommerce-MyAccount-content table {
  max-width: 100%;
}

.woocommerce-account .woocommerce-MyAccount-content a {
  color: #0369a1;
  font-weight: 750;
}

.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3,
.woocommerce-account .woocommerce-MyAccount-content legend {
  color: #0f172a;
  font-weight: 950;
  letter-spacing: -0.03em;
}

.woocommerce-account .woocommerce-MyAccount-content input.input-text,
.woocommerce-account .woocommerce-MyAccount-content input[type="text"],
.woocommerce-account .woocommerce-MyAccount-content input[type="email"],
.woocommerce-account .woocommerce-MyAccount-content input[type="password"],
.woocommerce-account .woocommerce-MyAccount-content select,
.woocommerce-account .woocommerce-MyAccount-content textarea {
  width: 100%;
  min-height: 44px;
  border: 1px solid rgba(148, 163, 184, 0.36);
  border-radius: 14px;
  background: #f8fafc;
  color: #0f172a;
  padding: 0.7rem 0.85rem;
  box-sizing: border-box;
}

.woocommerce-account .woocommerce-MyAccount-content .button,
.woocommerce-account .woocommerce-MyAccount-content button.button,
.woocommerce-account .woocommerce-MyAccount-content input.button {
  border: 0;
  border-radius: 14px;
  background: #0073aa;
  color: #ffffff;
  font-weight: 900;
  padding: 0.78rem 1rem;
  box-shadow: 0 10px 22px rgba(0, 115, 170, 0.18);
}

.kh-woo-account-mobile-tabs {
  display: none;
}

@media (max-width: 1100px) {
  .woocommerce-account .woocommerce,
  .woocommerce-account .entry-content > .woocommerce {
    width: calc(100% - 1rem);
    margin: 1rem auto calc(5.75rem + env(safe-area-inset-bottom));
    padding: 0.85rem;
    border-radius: 22px;
  }

  .woocommerce-account .woocommerce-MyAccount-navigation {
    display: none !important;
  }

  .kh-woo-account-mobile-tabs {
    display: grid;
    gap: 0.45rem;
    margin: 0 0 0.9rem;
    padding: 0.85rem;
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
  }

  .kh-woo-account-mobile-tabs-label {
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #64748b;
  }

  .kh-woo-account-mobile-tabs-select {
    width: 100%;
    min-height: 46px;
    border: 1px solid rgba(148, 163, 184, 0.36);
    border-radius: 14px;
    background: #f8fafc;
    color: #0f172a;
    font-size: 0.98rem;
    font-weight: 850;
    padding: 0.72rem 0.9rem;
    box-sizing: border-box;
  }

  .woocommerce-account .woocommerce-MyAccount-content {
    padding: 1rem;
    border-radius: 18px;
  }
}


/* WooCommerce dashboard explainer: clarify billing/store account vs ClassiCore account. */
.woocommerce-account .woocommerce-MyAccount-content > p:first-child,
.woocommerce-account .woocommerce-MyAccount-content > p:nth-child(2) {
  display: none;
}

.kh-woo-dashboard-explainer {
  display: grid;
  gap: 0.75rem;
  padding: clamp(1rem, 2.2vw, 1.35rem);
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 20px;
  background: linear-gradient(135deg, #ffffff 0%, #f8fbff 100%);
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
}

.kh-woo-dashboard-eyebrow {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(37, 99, 235, 0.1);
  color: #1d4ed8;
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0.02em;
  padding: 0.36rem 0.7rem;
}

.woocommerce-account .woocommerce-MyAccount-content .kh-woo-dashboard-explainer h2 {
  margin: 0;
  max-width: 760px;
  color: #0f172a;
  font-size: clamp(1.25rem, 2.2vw, 1.65rem);
  line-height: 1.12;
}

.woocommerce-account .woocommerce-MyAccount-content .kh-woo-dashboard-explainer p {
  display: block;
  margin: 0;
  max-width: 820px;
  color: #475569;
  font-size: 0.98rem;
  line-height: 1.65;
}

.kh-woo-dashboard-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-top: 0.25rem;
}

.woocommerce-account .woocommerce-MyAccount-content .kh-woo-dashboard-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #0369a1;
  font-size: 0.88rem;
  font-weight: 900;
  padding: 0.55rem 0.85rem;
  text-decoration: none !important;
}

.woocommerce-account .woocommerce-MyAccount-content .kh-woo-dashboard-links a:hover,
.woocommerce-account .woocommerce-MyAccount-content .kh-woo-dashboard-links a:focus {
  background: rgba(3, 105, 161, 0.1);
  color: #075985;
}

@media (max-width: 1100px) {
  .kh-woo-dashboard-links {
    display: grid;
    grid-template-columns: 1fr;
  }

  .woocommerce-account .woocommerce-MyAccount-content .kh-woo-dashboard-links a {
    width: 100%;
  }
}


/* Saved listings polish: thumbnail/avatar beside the saved listing title */
.kh-table-savedlistings .kh-saved-listing-title-cell {
  min-width: 280px;
}

.kh-saved-listing-title-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  color: inherit;
  text-decoration: none;
}

.kh-saved-listing-title-wrap:hover .kh-saved-listing-title-text,
.kh-saved-listing-title-wrap:focus-visible .kh-saved-listing-title-text {
  color: #005f99;
  text-decoration: underline;
}

.kh-saved-listing-avatar-wrap {
  flex: 0 0 auto;
  width: 54px;
  height: 54px;
  border-radius: 14px;
  overflow: hidden;
  background: #eef2f7;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.08);
}

.kh-saved-listing-avatar-wrap img,
.kh-saved-listing-avatar {
  display: block;
  width: 54px;
  height: 54px;
  border-radius: 14px;
  object-fit: cover;
  object-position: var(--kh-profile-image-focus, center center);
}

.kh-saved-listing-title-text {
  font-weight: 700;
  line-height: 1.25;
}

@media (max-width: 720px) {
  .kh-table-savedlistings .kh-saved-listing-title-cell {
    min-width: 220px;
  }

  .kh-saved-listing-title-wrap {
    gap: 0.65rem;
  }

  .kh-saved-listing-avatar-wrap,
  .kh-saved-listing-avatar-wrap img,
  .kh-saved-listing-avatar {
    width: 48px;
    height: 48px;
    border-radius: 13px;
  }
}

/* Report listing modal polish */
.kh-report-listing-modal .kh-report-modal-dialog {
  width: min(94vw, 540px);
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22);
}

.kh-report-modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.25rem 1.35rem 0.8rem;
  border-bottom: 1px solid rgba(148, 163, 184, 0.22);
}

.kh-report-modal-header h3 {
  margin: 0 0 0.35rem;
  font-size: 1.25rem;
  line-height: 1.2;
  color: #0f172a;
}

.kh-report-modal-header p {
  margin: 0;
  color: #64748b;
  font-size: 1rem;
  line-height: 1.45;
}

.kh-report-modal-body {
  padding: 1rem 1.35rem 1.25rem;
}

.kh-report-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.kh-report-field {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.kh-report-field label {
  font-weight: 700;
  color: #0f172a;
  font-size: 1rem;
}

.kh-report-field label span {
  color: #64748b;
  font-weight: 600;
}

.kh-report-field select,
.kh-report-field textarea {
  width: 100%;
  border: 1px solid rgba(148, 163, 184, 0.55);
  border-radius: 14px;
  background: #f8fafc;
  color: #0f172a;
  font: inherit;
  line-height: 1.45;
  padding: 0.8rem 0.9rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
  transition: border-color 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease;
}

.kh-report-field select {
  min-height: 46px;
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, #334155 50%), linear-gradient(135deg, #334155 50%, transparent 50%);
  background-position: calc(100% - 18px) 50%, calc(100% - 12px) 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  padding-right: 2.5rem;
}

.kh-report-field textarea {
  min-height: 132px;
  resize: vertical;
}

.kh-report-field select:focus,
.kh-report-field textarea:focus {
  outline: none;
  border-color: #2563eb;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.12);
}

.kh-report-safety-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 0.9rem;
  border: 1px solid rgba(37, 99, 235, 0.14);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(239, 246, 255, 0.95), rgba(248, 250, 252, 0.98));
}

.kh-report-safety-copy {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}

.kh-report-safety-copy strong {
  color: #0f172a;
  font-size: 1rem;
}

.kh-report-safety-copy span {
  color: #64748b;
  font-size: 0.82rem;
  line-height: 1.35;
}

.kh-block-user-btn.kh-report-block-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  flex: 0 0 auto;
  min-height: 38px;
  border: 1px solid rgba(239, 68, 68, 0.24);
  border-radius: 999px;
  background: #fff;
  color: #b91c1c;
  font-weight: 800;
  font-size: 0.82rem;
  padding: 0.48rem 0.75rem;
  cursor: pointer;
}

.kh-block-user-btn.kh-report-block-btn.kh-blocked-active {
  border-color: rgba(16, 185, 129, 0.28);
  color: #047857;
  background: #ecfdf5;
}

.kh-block-user-btn.kh-report-block-btn .dashicons {
  width: 16px;
  height: 16px;
  font-size: 16px;
  line-height: 16px;
}

.kh-report-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.65rem;
  margin-top: 0.1rem;
}

.kh-report-actions .kh-button {
  min-height: 42px;
  border-radius: 12px;
  font-weight: 800;
  padding: 0.65rem 1rem;
}

.kh-report-cancel {
  background: #f1f5f9;
  color: #334155;
  border: 1px solid rgba(148, 163, 184, 0.35);
}

.kh-report-submit {
  box-shadow: 0 10px 20px rgba(2, 132, 199, 0.18);
}

.kh-report-status {
  margin: 0;
  padding: 0.7rem 0.8rem;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid rgba(148, 163, 184, 0.24);
  color: #334155;
  font-weight: 700;
}

@media (max-width: 720px) {
  .kh-report-listing-modal .kh-report-modal-dialog {
    width: min(94vw, 520px);
    border-radius: 20px;
  }

  .kh-report-modal-header,
  .kh-report-modal-body {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .kh-report-safety-card {
    align-items: stretch;
    flex-direction: column;
  }

  .kh-block-user-btn.kh-report-block-btn,
  .kh-report-actions .kh-button {
    width: 100%;
  }

  .kh-report-actions {
    flex-direction: column-reverse;
  }
}


/* WooCommerce account mobile/tablet flattening: make billing dashboard feel like ClassiCore account. */
.woocommerce-account .woocommerce-MyAccount-content:has(.kh-woo-dashboard-explainer) > p {
  display: none !important;
}

.kh-woo-mobile-nav-source {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
}

@media (max-width: 1100px) {
  .woocommerce-account .woocommerce,
  .woocommerce-account .entry-content > .woocommerce {
    width: 100%;
    margin: 0 auto calc(5.75rem + env(safe-area-inset-bottom));
    padding: 0.85rem;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .woocommerce-account .woocommerce-MyAccount-content {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .woocommerce-account .woocommerce-MyAccount-content > * {
    max-width: 100%;
  }

  .kh-woo-account-mobile-tabs,
  .kh-woo-dashboard-explainer,
  .woocommerce-account .woocommerce-MyAccount-content form,
  .woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses,
  .woocommerce-account .woocommerce-MyAccount-content .woocommerce-orders-table,
  .woocommerce-account .woocommerce-MyAccount-content table.shop_table,
  .woocommerce-account .woocommerce-MyAccount-content .woocommerce-Message,
  .woocommerce-account .woocommerce-MyAccount-content .woocommerce-message,
  .woocommerce-account .woocommerce-MyAccount-content .woocommerce-info {
    border: 1px solid rgba(148, 163, 184, 0.2);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.045);
  }

  .kh-woo-account-mobile-tabs {
    margin: 0 0 0.9rem;
  }

  .kh-woo-dashboard-explainer {
    padding: 1rem;
    background: #ffffff;
  }

  .woocommerce-account .woocommerce-MyAccount-content form,
  .woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses,
  .woocommerce-account .woocommerce-MyAccount-content .woocommerce-orders-table,
  .woocommerce-account .woocommerce-MyAccount-content table.shop_table,
  .woocommerce-account .woocommerce-MyAccount-content .woocommerce-Message,
  .woocommerce-account .woocommerce-MyAccount-content .woocommerce-message,
  .woocommerce-account .woocommerce-MyAccount-content .woocommerce-info {
    padding: 1rem;
    margin: 0 0 0.9rem;
  }

  .woocommerce-account .woocommerce-MyAccount-content .woocommerce-info::before,
  .woocommerce-account .woocommerce-MyAccount-content .woocommerce-message::before {
    display: none;
  }

  .woocommerce-account .woocommerce-MyAccount-content .woocommerce-info,
  .woocommerce-account .woocommerce-MyAccount-content .woocommerce-message {
    color: #334155;
  }
}

/* Listing card tap action */
.kh-listing-line-tap {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
}

.kh-tap-form {
  margin: 0;
  display: inline-flex;
}

.kh-tap-button {
  appearance: none;
  border: 1px solid rgba(251, 146, 60, 0.35);
  background: linear-gradient(180deg, #fff7ed 0%, #ffedd5 100%);
  color: #9a3412;
  border-radius: 999px;
  width: 34px;
  height: 34px;
  min-width: 34px;
  min-height: 34px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(251, 146, 60, 0.14);
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}

.kh-tap-button:hover,
.kh-tap-button:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(249, 115, 22, 0.55);
  background: linear-gradient(180deg, #ffedd5 0%, #fed7aa 100%);
  box-shadow: 0 12px 24px rgba(251, 146, 60, 0.22);
  outline: none;
}

.kh-tap-button-icon {
  font-size: 1rem;
  line-height: 1;
}

.kh-tap-button-label {
  line-height: 1;
}

.kh-tap-button .kh-tap-button-label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 1100px) {
  .kh-listing-line-status {
    width: 100%;
  }

  .kh-listing-line-tap {
    margin-left: auto;
  }

  .kh-tap-button {
    width: 36px;
    height: 36px;
    min-width: 36px;
    min-height: 36px;
    padding: 0;
  }
}

/* Tap rate limit state */
.kh-tap-button--disabled,
.kh-tap-button--disabled:hover,
.kh-tap-button--disabled:focus-visible {
  cursor: not-allowed;
  opacity: 0.48;
  transform: none;
  border-color: rgba(148, 163, 184, 0.35);
  background: linear-gradient(180deg, #f8fafc 0%, #e2e8f0 100%);
  color: #64748b;
  box-shadow: none;
}

.kh-inbox-tap-back-form {
  margin: 0;
}

.kh-inbox-action-btn--tap-back {
  color: #f97316;
}

.kh-inbox-action-btn--tap-back:hover,
.kh-inbox-action-btn--tap-back:focus {
  background: #fff7ed;
  border-color: rgba(249, 115, 22, 0.34);
  color: #ea580c;
}

.kh-inbox-action-btn--tap-back:disabled,
.kh-inbox-action-btn--tap-back[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
  box-shadow: none;
}

.kh-inbox-tap-back-icon {
  font-size: 18px;
  line-height: 1;
}

/* Desktop/sidebar inbox badges: keep message and tap notifications separate */
.kh-sidebar-inbox-link {
  display: flex !important;
  align-items: center;
  gap: 0.55rem;
}

.kh-sidebar-inbox-icon-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  min-width: 1.25rem;
  line-height: 1;
}

.kh-sidebar-message-badge {
  position: absolute;
  top: -0.58rem;
  right: -0.72rem;
  min-width: 1.05rem;
  height: 1.05rem;
  padding: 0 0.22rem;
  border-radius: 999px;
  background: #ef4444;
  color: #ffffff;
  font-size: 0.62rem;
  font-weight: 800;
  line-height: 1.05rem;
  text-align: center;
  box-shadow: 0 0 0 2px #ffffff, 0 4px 10px rgba(15, 23, 42, 0.14);
}

.kh-sidebar-tap-badge {
  position: absolute;
  top: -0.58rem;
  left: -0.72rem;
  width: 1.08rem;
  height: 1.08rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  color: #f97316;
  font-size: 0.72rem;
  line-height: 1;
  box-shadow: 0 0 0 2px #ffffff, 0 4px 10px rgba(15, 23, 42, 0.14);
}

.kh-menu a.active .kh-sidebar-message-badge,
.kh-menu a[aria-current="page"] .kh-sidebar-message-badge {
  background: #dc2626;
}

.kh-menu a.active .kh-sidebar-tap-badge,
.kh-menu a[aria-current="page"] .kh-sidebar-tap-badge {
  background: #fff7ed;
  color: #ea580c;
}

/* Admin tap settings reset block */
.kh-admin-reset-box {
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 14px;
  background: rgba(248, 250, 252, 0.85);
}

.kh-admin-reset-box h4 {
  margin: 0 0 0.4rem;
  font-size: 0.95rem;
}

.kh-admin-reset-box .description {
  margin-bottom: 0.75rem;
}

/* Account contact-filter polish */
.kh-contact-filters-card .kh-contact-filter-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 0.75rem;
  align-items: start;
  margin: 0.75rem 0 0.65rem;
}

.kh-contact-filters-card .kh-contact-filter-field {
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
  min-width: 0;
}

.kh-contact-filters-card .kh-filter-label {
  margin: 0;
  color: #7c2d12;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.kh-contact-filters-card select,
.kh-contact-filters-card input[type="number"] {
  width: 100%;
  min-height: 2.25rem;
  border: 1px solid rgba(15, 23, 42, 0.14);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03);
}

.kh-contact-filters-card select {
  min-height: 9.75rem;
  padding: 0.55rem;
}

.kh-contact-filter-age-field {
  grid-column: 1 / -1;
  max-width: 31rem;
  margin-top: 0.15rem;
}

.kh-contact-filter-age-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 10rem));
  gap: 0.5rem;
}

.kh-contact-filter-age-row input[type="number"] {
  padding: 0.45rem 0.65rem;
}

/* Contact filter checkbox polish */
.kh-contact-checkbox-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-content: flex-start;
  padding: 0.5rem;
  border: 1px solid rgba(15, 23, 42, 0.11);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.82);
}

.kh-contact-checkbox-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  width: auto;
  max-width: 100%;
  min-height: 1.9rem;
  padding: 0.32rem 0.55rem;
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 999px;
  background: #fff;
  color: #0f172a;
  font-size: 0.86rem;
  line-height: 1.15;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.kh-contact-checkbox-pill:hover {
  border-color: rgba(37, 99, 235, 0.35);
  box-shadow: 0 5px 12px rgba(15, 23, 42, 0.07);
  transform: translateY(-1px);
}

.kh-contact-checkbox-pill input[type="checkbox"] {
  width: 0.95rem;
  height: 0.95rem;
  margin: 0;
  accent-color: #2563eb;
  flex: 0 0 auto;
}

.kh-contact-checkbox-pill span {
  display: inline-block;
  min-width: 0;
  white-space: nowrap;
}

.kh-contact-checkbox-pill:has(input[type="checkbox"]:checked) {
  border-color: rgba(37, 99, 235, 0.55);
  background: rgba(37, 99, 235, 0.07);
  color: #1d4ed8;
  font-weight: 700;
}

.kh-contact-filter-actions {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex-wrap: wrap;
}

.kh-button.kh-button-light {
  background: #fff;
  color: #334155;
  border: 1px solid rgba(15, 23, 42, 0.14);
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04);
}

.kh-button.kh-button-light:hover,
.kh-button.kh-button-light:focus {
  color: #0f172a;
  border-color: rgba(15, 23, 42, 0.26);
  background: #f8fafc;
}

@media (max-width: 1100px) {
  .kh-contact-filters-card .kh-contact-filter-grid {
    grid-template-columns: repeat(2, minmax(190px, 1fr));
  }
}

@media (max-width: 720px) {
  .kh-contact-filters-card .kh-contact-filter-grid {
    grid-template-columns: 1fr;
    gap: 0.7rem;
  }

  .kh-contact-filter-age-field {
    max-width: none;
  }

  .kh-contact-filter-age-row {
    grid-template-columns: 1fr 1fr;
  }

  .kh-contact-checkbox-list {
    gap: 0.32rem;
  }
}

@media (max-width: 420px) {
  .kh-contact-filter-age-row {
    grid-template-columns: 1fr;
  }
}

@supports not selector(:has(*)) {
  .kh-contact-checkbox-pill input[type="checkbox"]:checked + span {
    color: #1d4ed8;
    font-weight: 700;
  }
}

/* WooCommerce shop cards: compact product summaries under price */
.woocommerce ul.products li.product .kh-woo-loop-summary,
.woocommerce-page ul.products li.product .kh-woo-loop-summary {
  margin: 0.35rem 0 0.9rem;
  color: #46566f;
  font-size: 0.86rem;
  line-height: 1.35;
}

.woocommerce ul.products li.product .kh-woo-loop-summary p,
.woocommerce-page ul.products li.product .kh-woo-loop-summary p {
  margin: 0;
}

.woocommerce ul.products li.product .kh-woo-loop-summary ul,
.woocommerce-page ul.products li.product .kh-woo-loop-summary ul,
.woocommerce ul.products li.product .kh-woo-loop-summary ol,
.woocommerce-page ul.products li.product .kh-woo-loop-summary ol {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.25rem;
}

.woocommerce ul.products li.product .kh-woo-loop-summary li,
.woocommerce-page ul.products li.product .kh-woo-loop-summary li {
  margin: 0;
  padding: 0 0 0 1.05rem;
  position: relative;
}

.woocommerce ul.products li.product .kh-woo-loop-summary li::before,
.woocommerce-page ul.products li.product .kh-woo-loop-summary li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: #007fab;
  font-weight: 900;
}

.woocommerce ul.products li.product .price + .kh-woo-loop-summary,
.woocommerce-page ul.products li.product .price + .kh-woo-loop-summary {
  margin-top: -0.1rem;
}

@media (max-width: 720px) {
  .woocommerce ul.products li.product .kh-woo-loop-summary,
  .woocommerce-page ul.products li.product .kh-woo-loop-summary {
    font-size: 0.84rem;
    margin-bottom: 0.8rem;
  }
}


/* WooCommerce shop grid mobile/tablet fix: prevent empty desktop columns on narrow screens */
@media (max-width: 1100px) {
  .woocommerce ul.products,
  .woocommerce-page ul.products {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
    gap: 1.1rem !important;
    align-items: stretch !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .woocommerce ul.products::before,
  .woocommerce ul.products::after,
  .woocommerce-page ul.products::before,
  .woocommerce-page ul.products::after {
    display: none !important;
    content: none !important;
  }

  .woocommerce ul.products li.product,
  .woocommerce-page ul.products li.product,
  .woocommerce ul.products[class*="columns-"] li.product,
  .woocommerce-page ul.products[class*="columns-"] li.product {
    float: none !important;
    clear: none !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    align-self: stretch !important;
  }
}

@media (max-width: 640px) {
  .woocommerce ul.products,
  .woocommerce-page ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    justify-items: stretch !important;
    gap: 0.9rem !important;
  }

  .woocommerce ul.products li.product,
  .woocommerce-page ul.products li.product,
  .woocommerce ul.products[class*="columns-"] li.product,
  .woocommerce-page ul.products[class*="columns-"] li.product {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    justify-self: stretch !important;
    padding: 0.85rem !important;
  }

  .woocommerce ul.products li.product a img,
  .woocommerce-page ul.products li.product a img {
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .woocommerce ul.products li.product .woocommerce-loop-product__title,
  .woocommerce-page ul.products li.product .woocommerce-loop-product__title {
    font-size: 0.92rem !important;
    line-height: 1.2 !important;
  }

  .woocommerce ul.products li.product .price,
  .woocommerce-page ul.products li.product .price {
    font-size: 1.35rem !important;
    line-height: 1.1 !important;
  }

  .woocommerce ul.products li.product .kh-woo-loop-summary,
  .woocommerce-page ul.products li.product .kh-woo-loop-summary {
    font-size: 0.78rem;
    line-height: 1.3;
  }

  .woocommerce ul.products li.product .button,
  .woocommerce-page ul.products li.product .button {
    width: 100%;
    min-width: 0;
    padding-left: 0.65rem;
    padding-right: 0.65rem;
  }

  .woocommerce .woocommerce-result-count,
  .woocommerce-page .woocommerce-result-count,
  .woocommerce .woocommerce-ordering,
  .woocommerce-page .woocommerce-ordering {
    float: none !important;
    width: 100% !important;
    margin: 0 0 0.8rem !important;
  }

  .woocommerce .woocommerce-ordering select,
  .woocommerce-page .woocommerce-ordering select {
    width: 100% !important;
    min-height: 2.35rem;
  }
}

@media (max-width: 360px) {
  .woocommerce ul.products,
  .woocommerce-page ul.products {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
  }

  .woocommerce ul.products li.product,
  .woocommerce-page ul.products li.product,
  .woocommerce ul.products[class*="columns-"] li.product,
  .woocommerce-page ul.products[class*="columns-"] li.product {
    width: min(100%, 280px) !important;
    max-width: 280px !important;
    justify-self: center !important;
  }
}


/* WooCommerce mobile shop buttons: compact action pills for two-column cards */
@media (max-width: 640px) {
  .woocommerce ul.products li.product .button,
  .woocommerce-page ul.products li.product .button,
  .woocommerce ul.products li.product a.button,
  .woocommerce-page ul.products li.product a.button,
  .woocommerce ul.products li.product .add_to_cart_button,
  .woocommerce-page ul.products li.product .add_to_cart_button {
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: flex-start !important;
    padding: 0.55rem 0.9rem !important;
    min-height: 2.35rem !important;
    line-height: 1 !important;
    border-radius: 999px !important;
    font-size: 0.82rem !important;
    white-space: nowrap !important;
    box-shadow: 0 8px 18px rgba(0, 127, 171, 0.18) !important;
  }

  .woocommerce ul.products li.product .button:hover,
  .woocommerce-page ul.products li.product .button:hover,
  .woocommerce ul.products li.product .button:focus,
  .woocommerce-page ul.products li.product .button:focus {
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(0, 127, 171, 0.24) !important;
  }
}

@media (max-width: 390px) {
  .woocommerce ul.products li.product .button,
  .woocommerce-page ul.products li.product .button,
  .woocommerce ul.products li.product a.button,
  .woocommerce-page ul.products li.product a.button,
  .woocommerce ul.products li.product .add_to_cart_button,
  .woocommerce-page ul.products li.product .add_to_cart_button {
    font-size: 0.78rem !important;
    padding-left: 0.72rem !important;
    padding-right: 0.72rem !important;
  }
}

/* Account legal links */
.kh-account-legal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}

.kh-account-legal-actions .kh-button {
  text-decoration: none;
}

@media (max-width: 700px) {
  .kh-account-legal-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .kh-account-legal-actions .kh-button {
    width: 100%;
    text-align: center;
  }
}

/* v2.16.45 – keep profile verification requests inside a modal instead of a permanent admin page block */
.kh-admin-count-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.45rem;
  height: 1.45rem;
  padding: 0 0.45rem;
  margin-left: 0.35rem;
  border-radius: 999px;
  background: #0073aa;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
  vertical-align: middle;
}

.kh-modal-dialog--verification {
  max-width: 760px;
  width: min(760px, calc(100vw - 48px));
  margin-top: 8vh;
}

.kh-modal-dialog--verification .kh-modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.25rem;
}

.kh-modal-x {
  border: 0;
  background: transparent;
  color: #64748b;
  cursor: pointer;
  font-size: 1.75rem;
  line-height: 1;
  padding: 0;
}

.kh-modal-x:hover,
.kh-modal-x:focus {
  color: #0f172a;
}

.kh-verification-modal-body {
  max-height: 62vh;
  overflow: auto;
  padding-right: 0.25rem;
}

.kh-admin-verification-modal .kh-verification-admin-list {
  display: grid;
  gap: 1rem;
}

.kh-admin-verification-modal .kh-admin-verification-card {
  margin: 0;
}

@media (max-width: 782px) {
  .kh-modal-dialog--verification {
    width: calc(100vw - 24px);
    margin: 6vh auto 3vh;
  }

  .kh-verification-modal-body {
    max-height: 66vh;
  }
}

/* v2.16.46 – mobile-only verification upload notice */
.kh-verification-desktop-notice {
  margin: 0.75rem 0 1rem;
  padding: 0.85rem 1rem;
  border-radius: 14px;
}


.kh-admin-verification-image-link {
  position: relative;
  display: block;
  color: inherit;
  text-decoration: none;
}

.kh-admin-verification-open-full {
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.86);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  pointer-events: none;
}

.kh-admin-verification-full-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-weight: 700;
  text-decoration: none;
}

.kh-admin-verification-reject-form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  margin-top: 0.5rem;
}

.kh-admin-verification-reject-select {
  min-width: min(100%, 360px);
  max-width: 100%;
}

.kh-verification-rejection-note {
  padding: 0.75rem 0.85rem;
  border-radius: 12px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  color: #9a3412;
}



/* User Plan Manager live search */
.kh-user-plan-search {
  position: relative;
  margin: 16px 0;
}

.kh-user-plan-search-input {
  width: 100%;
  max-width: 420px;
}

.kh-user-plan-results {
  width: min(100%, 520px);
  margin-top: 8px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.14);
  overflow: hidden;
  max-height: 290px;
  overflow-y: auto;
}

.kh-user-plan-result {
  display: block;
  width: 100%;
  padding: 12px 14px;
  border: 0;
  border-bottom: 1px solid rgba(226, 232, 240, 0.95);
  background: #fff;
  color: #0f172a;
  text-align: left;
  cursor: pointer;
}

.kh-user-plan-result:hover,
.kh-user-plan-result:focus {
  background: #f8fafc;
  outline: none;
}

.kh-user-plan-result strong,
.kh-user-plan-result span,
.kh-user-plan-result small {
  display: block;
}

.kh-user-plan-result span {
  margin-top: 2px;
  color: #475569;
  font-size: 12px;
}

.kh-user-plan-result small {
  margin-top: 3px;
  color: #64748b;
  font-size: 11px;
}

.kh-user-plan-empty {
  padding: 12px 14px;
  color: #64748b;
  font-size: 13px;
}

.kh-user-plan-selected {
  width: min(100%, 520px);
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(37, 99, 235, 0.22);
  border-radius: 12px;
  background: rgba(37, 99, 235, 0.06);
  color: #0f172a;
}

.kh-user-plan-selected small {
  color: #475569;
  margin-left: 4px;
}

.kh-user-plan-clear {
  margin-left: 8px;
  border: 0;
  background: transparent;
  color: #2563eb;
  cursor: pointer;
  font-weight: 600;
}


/* ClassiCore Canvas mobile browse search spacing
   Keep the search bar visually attached to the Browse listings header on phones. */
@media (max-width: 980px) {
  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-classifieds-header {
    margin-bottom: 6px !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) > .kh-layout {
    gap: 6px !important;
    margin-top: 0 !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-main,
  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-main > .kh-wrapper.kh-index {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-search-bar {
    margin-top: 0 !important;
    margin-bottom: 12px !important;
  }
}

.kh-verification-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.kh-modal-dialog--verification-revoke .kh-verification-revoke-reason {
  width: 100%;
  max-width: 100%;
}

.kh-modal-dialog--verification-revoke .kh-user-plan-results {
  margin-top: 8px;
}

/* Featured / sticky personals profiles */
.kh-featured-profile-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 8px 0 10px;
}
.kh-featured-profile-header span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(245, 158, 11, 0.14);
  color: #92400e;
  font-weight: 800;
  font-size: 12px;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.kh-listing-line--highlight,
.kh-listing-line--sticky {
  border-color: rgba(245, 158, 11, 0.45) !important;
  box-shadow: 0 12px 36px rgba(245, 158, 11, 0.13);
}
.kh-listing-line--sticky {
  background: linear-gradient(90deg, rgba(255, 251, 235, 0.95), #fff) !important;
}
.kh-listing-line--highlight {
  background: linear-gradient(90deg, rgba(239, 246, 255, 0.94), #fff) !important;
}
.kh-featured-profile-pill {
  display: inline-flex;
  align-items: center;
  margin-left: 8px;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(245, 158, 11, 0.16);
  color: #92400e;
  font-size: 11px;
  font-weight: 800;
  vertical-align: middle;
}
.kh-featured-profile-pill--highlight {
  background: rgba(37, 99, 235, 0.12);
  color: #1d4ed8;
}
.kh-featured-profile-divider {
  opacity: .65;
}
@media (max-width: 760px) {
  .kh-featured-profile-header {
    margin: 4px 0 8px;
  }
  .kh-featured-profile-pill {
    margin-left: 0;
    margin-top: 4px;
  }
}
.kh-listing-list .kh-listing-line.kh-listing-line--sticky {
  background: linear-gradient(90deg, rgba(255, 251, 235, 0.95), #fff) !important;
  border-color: rgba(245, 158, 11, 0.55) !important;
}
.kh-listing-list .kh-listing-line.kh-listing-line--highlight {
  background: linear-gradient(90deg, rgba(239, 246, 255, 0.94), #fff) !important;
  border-color: rgba(37, 99, 235, 0.32) !important;
}


/* Stronger featured/highlight visuals. Placed late so color/theme overrides do not hide it. */
.kh-listing-list .kh-listing-row.kh-listing-row--highlight,
.kh-listing-list .kh-listing-row.kh-listing-row--sticky {
  border-radius: 18px !important;
}

.kh-listing-list .kh-listing-row.kh-listing-row--highlight > .kh-listing-line,
.kh-listing-list .kh-listing-line.kh-listing-line--highlight {
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(37, 99, 235, 0.55) !important;
  background:
    linear-gradient(90deg, rgba(37, 99, 235, 0.105), rgba(255, 255, 255, 0.98) 34%, rgba(255, 255, 255, 1)) !important;
  box-shadow: 0 14px 36px rgba(37, 99, 235, 0.16), inset 0 0 0 1px rgba(37, 99, 235, 0.08) !important;
}

.kh-listing-list .kh-listing-row.kh-listing-row--highlight > .kh-listing-line::before,
.kh-listing-list .kh-listing-line.kh-listing-line--highlight::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 6px;
  background: linear-gradient(180deg, #2563eb, #60a5fa);
  border-radius: 18px 0 0 18px;
  pointer-events: none;
}

.kh-listing-list .kh-listing-row.kh-listing-row--sticky > .kh-listing-line,
.kh-listing-list .kh-listing-line.kh-listing-line--sticky {
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(245, 158, 11, 0.68) !important;
  background:
    linear-gradient(90deg, rgba(245, 158, 11, 0.15), rgba(255, 255, 255, 0.98) 34%, rgba(255, 255, 255, 1)) !important;
  box-shadow: 0 14px 40px rgba(245, 158, 11, 0.20), inset 0 0 0 1px rgba(245, 158, 11, 0.10) !important;
}

.kh-listing-list .kh-listing-row.kh-listing-row--sticky > .kh-listing-line::before,
.kh-listing-list .kh-listing-line.kh-listing-line--sticky::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 6px;
  background: linear-gradient(180deg, #f59e0b, #facc15);
  border-radius: 18px 0 0 18px;
  pointer-events: none;
}

.kh-listing-list .kh-listing-row--highlight .kh-featured-profile-pill--highlight {
  background: rgba(37, 99, 235, 0.14) !important;
  color: #1d4ed8 !important;
  border: 1px solid rgba(37, 99, 235, 0.22);
}

.kh-listing-list .kh-listing-row--sticky .kh-featured-profile-pill {
  background: rgba(245, 158, 11, 0.18) !important;
  color: #92400e !important;
  border: 1px solid rgba(245, 158, 11, 0.26);
}

@media (max-width: 760px) {
  .kh-listing-list .kh-listing-row.kh-listing-row--highlight > .kh-listing-line,
  .kh-listing-list .kh-listing-row.kh-listing-row--sticky > .kh-listing-line {
    box-shadow: 0 10px 28px rgba(37, 99, 235, 0.14) !important;
  }
}


/* Personals private Discovery location helper */
.kh-personals-use-location{margin-top:8px;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.kh-personals-location-status{display:block;margin-top:7px;font-size:12px;color:var(--kh-muted,#6b7280);line-height:1.35}


/* -------------------------------------------------------------------------- */
/* ZoopRent / Canvas rentals map: prevent first-paint header jump              */
/* -------------------------------------------------------------------------- */
/* The map view is a true app screen under the Canvas topbar. Older hard-lock
   rules measured from the viewport instead of from below the Canvas header;
   that made the topbar/logo appear to drop lower on the browse/map page. */
@media (min-width: 769px) {
  body.classicore-canvas-theme.kh-rentals-map-view .classicore-canvas-topbar,
  body.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .classicore-canvas-topbar {
    margin-top: 0 !important;
    transform: none !important;
  }

  body.classicore-canvas-theme.kh-rentals-map-view .classicore-canvas-site,
  body.classicore-canvas-theme.kh-rentals-map-view .classicore-canvas-app,
  body.classicore-canvas-theme.kh-rentals-map-view .classicore-canvas-content,
  body.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .classicore-canvas-site,
  body.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .classicore-canvas-app,
  body.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .classicore-canvas-content {
    min-height: calc(var(--classicore-canvas-vh, 100vh) - var(--classicore-canvas-topbar-h, 56px)) !important;
    height: calc(var(--classicore-canvas-vh, 100vh) - var(--classicore-canvas-topbar-h, 56px)) !important;
    overflow: hidden !important;
  }

  body.admin-bar.classicore-canvas-theme.kh-rentals-map-view .classicore-canvas-site,
  body.admin-bar.classicore-canvas-theme.kh-rentals-map-view .classicore-canvas-app,
  body.admin-bar.classicore-canvas-theme.kh-rentals-map-view .classicore-canvas-content,
  body.admin-bar.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .classicore-canvas-site,
  body.admin-bar.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .classicore-canvas-app,
  body.admin-bar.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .classicore-canvas-content {
    min-height: calc(var(--classicore-canvas-vh, 100vh) - var(--classicore-canvas-topbar-h, 56px) - 32px) !important;
    height: calc(var(--classicore-canvas-vh, 100vh) - var(--classicore-canvas-topbar-h, 56px) - 32px) !important;
  }

  body.classicore-canvas-theme.kh-rentals-map-view .kh-wrapper.kh-index-rentals.kh-rentals-map-view,
  body.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .kh-wrapper.kh-index-rentals.kh-rentals-map-view,
  body.classicore-canvas-theme.kh-rentals-map-view .kh-layout,
  body.classicore-canvas-theme.kh-rentals-map-view .kh-main,
  body.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .kh-layout,
  body.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .kh-main {
    height: calc(var(--classicore-canvas-vh, 100vh) - var(--classicore-canvas-topbar-h, 56px)) !important;
    max-height: calc(var(--classicore-canvas-vh, 100vh) - var(--classicore-canvas-topbar-h, 56px)) !important;
    min-height: 0 !important;
  }

  body.admin-bar.classicore-canvas-theme.kh-rentals-map-view .kh-wrapper.kh-index-rentals.kh-rentals-map-view,
  body.admin-bar.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .kh-wrapper.kh-index-rentals.kh-rentals-map-view,
  body.admin-bar.classicore-canvas-theme.kh-rentals-map-view .kh-layout,
  body.admin-bar.classicore-canvas-theme.kh-rentals-map-view .kh-main,
  body.admin-bar.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .kh-layout,
  body.admin-bar.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .kh-main {
    height: calc(var(--classicore-canvas-vh, 100vh) - var(--classicore-canvas-topbar-h, 56px) - 32px) !important;
    max-height: calc(var(--classicore-canvas-vh, 100vh) - var(--classicore-canvas-topbar-h, 56px) - 32px) !important;
  }
}


/* === v2.16.89: Canvas rentals split/map header-position fix ===============
   Split/map views use the rentals viewport shell, but Canvas owns the logo bar.
   Keep Canvas chrome in the normal document flow and only size the rentals app
   area. This prevents the logo/topbar from dropping lower than it does in list
   or account views. */
@media (min-width: 769px) {
  body.classicore-canvas-theme.kh-rentals-map-view,
  body.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) {
    padding-top: 0 !important;
  }

  body.classicore-canvas-theme.kh-rentals-map-view .classicore-canvas-site,
  body.classicore-canvas-theme.kh-rentals-map-view .classicore-canvas-app,
  body.classicore-canvas-theme.kh-rentals-map-view .classicore-canvas-content,
  body.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .classicore-canvas-site,
  body.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .classicore-canvas-app,
  body.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .classicore-canvas-content {
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
    transform: none !important;
  }

  body.classicore-canvas-theme.kh-rentals-map-view .classicore-canvas-topbar,
  body.classicore-canvas-theme:has(.kh-wrapper.kh-index-rentals.kh-rentals-map-view) .classicore-canvas-topbar {
    position: relative !important;
    top: auto !important;
    margin-top: 0 !important;
    transform: none !important;
    flex: 0 0 auto !important;
  }

  body.classicore-canvas-theme .kh-wrapper.kh-index-rentals.kh-rentals-map-view {
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
  }
}

/* Rentals account orientation switch */
.kh-wrapper.kh-account .kh-rentals-mode-form{margin-top:14px}
.kh-wrapper.kh-account .kh-rentals-mode-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;margin:12px 0}
.kh-wrapper.kh-account .kh-rentals-mode-option{display:flex;gap:10px;align-items:flex-start;border:1px solid #e2e8f0;border-radius:16px;padding:13px;background:#fff;cursor:pointer;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}
.kh-wrapper.kh-account .kh-rentals-mode-option:hover{border-color:#94a3b8;box-shadow:0 12px 28px rgba(15,23,42,.08);transform:translateY(-1px)}
.kh-wrapper.kh-account .kh-rentals-mode-option.is-active{border-color:#2455d8;box-shadow:0 0 0 3px rgba(36,85,216,.12)}
.kh-wrapper.kh-account .kh-rentals-mode-option input{margin-top:3px;flex:0 0 auto}
.kh-wrapper.kh-account .kh-rentals-mode-option span{display:flex;flex-direction:column;gap:4px}
.kh-wrapper.kh-account .kh-rentals-mode-option strong{font-size:14px;color:#0f172a}
.kh-wrapper.kh-account .kh-rentals-mode-option small{font-size:12px;line-height:1.35;color:#64748b}
.kh-wrapper.kh-account .kh-rentals-mode-save{margin-top:2px}

/* === v2.17.00: Rentals List view — match the Split/Map utility bar === */
@media (min-width: 981px) {
  body.classicore-canvas-theme .kh-index-rentals:not(.kh-rentals-map-view) .kh-classifieds-header-rentals {
    width: 100vw !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 10px 18px 8px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(15,23,42,0.08) !important;
    border-radius: 0 !important;
    background: rgba(255,255,255,0.96) !important;
    box-shadow: 0 8px 22px rgba(15,23,42,0.06) !important;
  }

  body.classicore-canvas-theme .kh-index-rentals:not(.kh-rentals-map-view) .kh-classifieds-header-top {
    display: none !important;
  }

  body.classicore-canvas-theme .kh-index-rentals:not(.kh-rentals-map-view) .kh-rentals-header-toolbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.classicore-canvas-theme .kh-index-rentals:not(.kh-rentals-map-view) .kh-rentals-header-form {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  body.classicore-canvas-theme .kh-index-rentals:not(.kh-rentals-map-view) .kh-rentals-header-row {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body.classicore-canvas-theme .kh-index-rentals:not(.kh-rentals-map-view) .kh-rentals-header-left-controls {
    display: flex !important;
    align-items: center !important;
    flex: 1 1 auto !important;
    min-width: 320px !important;
    max-width: min(46vw, 680px) !important;
    gap: 8px !important;
  }

  body.classicore-canvas-theme .kh-index-rentals:not(.kh-rentals-map-view) .kh-rentals-header-row-right,
  body.classicore-canvas-theme .kh-index-rentals:not(.kh-rentals-map-view) .kh-rentals-header-actions-right {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    width: auto !important;
    margin: 0 !important;
  }

  body.classicore-canvas-theme .kh-index-rentals:not(.kh-rentals-map-view) .kh-rentals-header-actions-right {
    flex: 0 0 auto !important;
    margin-left: auto !important;
  }
}

/* === v2.17.05: Rentals List view — keep cards inside the canvas edges === */
@media (min-width: 981px) {
  body.classicore-canvas-theme .kh-index-rentals:not(.kh-rentals-map-view) .kh-listing-grid-rentals {
    width: calc(100% - 16px) !important;
    max-width: calc(100% - 16px) !important;
    margin-left: 8px !important;
    margin-right: 8px !important;
    box-sizing: border-box !important;
  }
}


/* === v2.17.07: Rentals List view — normal page flow, no horizontal bleed ===
   Keep the regular document scroll so empty and populated result states use the
   full Canvas page naturally. Only suppress horizontal overflow caused by the
   full-width app shell and keep the toolbar/results inside the viewport. */
@media (min-width: 981px) {
  body.classicore-canvas-theme:has(.kh-index-rentals:not(.kh-rentals-map-view)) {
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.classicore-canvas-theme .kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    height: auto !important;
    min-height: calc(100vh - var(--classicore-canvas-topbar-h, 56px)) !important;
    max-height: none !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  body.classicore-canvas-theme .kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) .kh-classifieds-header,
  body.classicore-canvas-theme .kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) .kh-listing-grid-rentals {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  body.classicore-canvas-theme .kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) .kh-listing-grid-rentals {
    overflow: visible !important;
  }
}

/* === v2.17.08: Rentals List toolbar — full-bleed header, padded results ===
   Let the utility toolbar span the browser canvas like Split/Map while keeping
   rental cards comfortably inset inside the results area. */
@media (min-width: 981px) {
  body.classicore-canvas-theme .kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) .kh-classifieds-header-rentals {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    box-sizing: border-box !important;
  }

  body.classicore-canvas-theme .kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) .kh-listing-grid-rentals {
    width: calc(100% - 32px) !important;
    max-width: calc(100% - 32px) !important;
    margin-left: 16px !important;
    margin-right: 16px !important;
    box-sizing: border-box !important;
  }
}

/* === v2.17.09: Rentals List toolbar — sticky while results scroll ===
   Keep the full-width List controls visible as users move through a long
   listings grid. The Canvas topbar remains above it, and the WordPress admin
   bar offset is respected while administrators are signed in. */
body.classicore-canvas-theme .kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) .kh-classifieds-header-rentals {
  position: sticky !important;
  top: var(--classicore-canvas-topbar-h, 56px) !important;
  z-index: 120 !important;
  isolation: isolate;
}

body.admin-bar.classicore-canvas-theme .kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) .kh-classifieds-header-rentals {
  top: calc(var(--classicore-canvas-topbar-h, 56px) + 32px) !important;
}

@media screen and (max-width: 782px) {
  body.admin-bar.classicore-canvas-theme .kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) .kh-classifieds-header-rentals {
    top: calc(var(--classicore-canvas-topbar-h, 56px) + 46px) !important;
  }
}

/* === v2.17.11: Rentals canvas — subtle topographic background ===
   Add a quiet, location-inspired texture only behind rental results. Listing
   cards remain solid and the Leaflet map tiles are never covered. */
body.classicore-canvas-theme .kh-wrapper.kh-index-rentals:not(.kh-rentals-map-view) {
  background-color: #f6f8fb !important;
  background-image: url('classicore-rentals-topo-bg.png') !important;
  background-repeat: repeat !important;
  background-size: 1100px auto !important;
  background-position: center top !important;
}

body.classicore-canvas-theme .kh-wrapper.kh-index-rentals.kh-rentals-map-view #kh-rentals-map-list,
body.classicore-canvas-theme .kh-wrapper.kh-index-rentals.kh-rentals-map-view .kh-rentals-map-list {
  background-color: #f7f9fb !important;
  background-image: url('classicore-rentals-topo-bg.png') !important;
  background-repeat: repeat !important;
  background-size: 900px auto !important;
  background-position: center top !important;
}

/* Keep all functional surfaces crisp above the decorative canvas. */
body.classicore-canvas-theme .kh-wrapper.kh-index-rentals .kh-classifieds-header-rentals,
body.classicore-canvas-theme .kh-wrapper.kh-index-rentals .kh-card-rental,
body.classicore-canvas-theme .kh-wrapper.kh-index-rentals .kh-map-list-header {
  position: relative;
  z-index: 1;
}



/* === v2.17.14: Rentals Split results summary card polish ===
   Soften only the compact “For Rent / rentals available” box inside the
   listings pane. The main search toolbar keeps its unified full-width style. */
body.classicore-canvas-theme .kh-wrapper.kh-index-rentals.kh-rentals-map-view .kh-map-list-header {
  margin: 10px 12px 12px !important;
  padding: 13px 14px 12px !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.84) !important;
  border: 1px solid rgba(203,213,225,.68) !important;
  box-shadow: 0 8px 22px rgba(15,23,42,.07) !important;
  -webkit-backdrop-filter: blur(10px) saturate(1.05);
  backdrop-filter: blur(10px) saturate(1.05);
  overflow: hidden;
}
body.classicore-canvas-theme .kh-wrapper.kh-index-rentals.kh-rentals-map-view .kh-map-list-pill {
  background: rgba(255,255,255,.70) !important;
  border-color: rgba(148,163,184,.34) !important;
}

/* v2.17.23 Rentals Create Alert cleanup */
.kh-rentals-alert{max-width:780px;margin:0 auto;padding:28px 30px!important}
.kh-rentals-alert-header{margin-bottom:22px}
.kh-rentals-alert-header h2{margin:0 0 8px;font-size:28px;line-height:1.2}
.kh-rentals-alert-header>p{margin:0;color:#5f6b7a;line-height:1.55}
.kh-alert-form--organized{display:grid;gap:18px}
.kh-alert-step{border:1px solid #dce4ee;border-radius:16px;background:#fff;padding:22px}
.kh-alert-step-heading{display:flex;gap:14px;align-items:flex-start;margin-bottom:18px}
.kh-alert-step-heading h3{margin:0 0 4px;font-size:18px;line-height:1.3}
.kh-alert-step-heading p{margin:0;color:#667085;font-size:14px;line-height:1.45}
.kh-alert-step-number{display:inline-flex;align-items:center;justify-content:center;flex:0 0 32px;width:32px;height:32px;border-radius:999px;background:var(--kh-primary,#2563eb);color:#fff;font-weight:800}
.kh-alert-fields-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.kh-alert-field{min-width:0}
.kh-alert-field--full{grid-column:1/-1}
.kh-alert-field label{display:block;margin:0 0 7px;font-weight:700;color:#182230;font-size:14px}
.kh-alert-field .kh-input,.kh-alert-field .kh-select{width:100%;min-height:44px;border-radius:10px}
.kh-alert-field small{display:block;margin-top:7px;color:#667085;line-height:1.4}
.kh-alert-money-input{display:flex;align-items:center;border:1px solid #cbd5e1;border-radius:10px;background:#fff;overflow:hidden}
.kh-alert-money-input>span{padding:0 0 0 13px;color:#667085;font-weight:700}
.kh-alert-money-input .kh-input{border:0!important;box-shadow:none!important;padding-left:7px!important}
.kh-alert-location-hint{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:7px;color:#667085;font-size:13px}
.kh-alert-location-crumb{font-weight:700;color:#344054}
.kh-alert-step--save{background:#f8fafc}
.kh-alert-form-actions{display:flex;gap:10px;flex-wrap:wrap;margin:0}
.kh-alert-form-actions .kh-btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
@media(max-width:760px){
  .kh-rentals-alert{max-width:none;margin:0;padding:18px 14px!important;border-radius:0!important;box-shadow:none!important}
  .kh-rentals-alert-header h2{font-size:24px}
  .kh-alert-form--organized{gap:14px}
  .kh-alert-step{padding:17px 15px;border-radius:14px}
  .kh-alert-step-heading{gap:11px;margin-bottom:15px}
  .kh-alert-step-number{width:29px;height:29px;flex-basis:29px}
  .kh-alert-fields-grid{grid-template-columns:1fr;gap:14px}
  .kh-alert-field--full{grid-column:auto}
  .kh-alert-form-actions{display:grid;grid-template-columns:1fr}
  .kh-alert-form-actions .kh-btn{width:100%}
}


/* ClassiCore 2.17.28: My Alerts navigation and responsive card polish */
.kh-rentals-alert-header--actions{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.kh-alert-eyebrow{display:inline-block;margin-bottom:6px;color:#1769e8;font-size:12px;font-weight:850;letter-spacing:.06em;text-transform:uppercase}
.kh-alert-page-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.kh-alert-empty{text-align:center;border:1px dashed #c8d3e2;border-radius:18px;background:#f8fbff;padding:38px 24px;margin-top:18px}
.kh-alert-empty .dashicons{width:48px;height:48px;font-size:48px;color:#1769e8;margin-bottom:12px}
.kh-alert-empty h3{margin:0 0 8px;font-size:22px}
.kh-alert-empty p{max-width:560px;margin:0 auto 18px;color:#66758a;line-height:1.6}
.kh-alert-empty .kh-alert-page-actions{justify-content:center}
.kh-alert-row{padding:18px;border-color:#dbe3ef;box-shadow:0 8px 24px rgba(15,23,42,.05)}
.kh-alert-name{font-size:18px;font-weight:850;color:#152033}
.kh-alert-meta{margin-top:10px;color:#66758a;font-size:13px}
@media(max-width:760px){
  .kh-rentals-alert-header--actions{flex-direction:column}
  .kh-rentals-alert-header--actions .kh-alert-page-actions{width:100%;display:grid;grid-template-columns:1fr}
  .kh-rentals-alert-header--actions .kh-btn{width:100%;justify-content:center;text-align:center}
  .kh-alert-row{align-items:stretch;flex-direction:column}
  .kh-alert-row-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .kh-alert-row-actions .kh-btn{width:100%;justify-content:center;text-align:center}
  .kh-alert-empty{padding:30px 18px}
  .kh-alert-empty .kh-alert-page-actions{display:grid;grid-template-columns:1fr;width:100%}
  .kh-alert-empty .kh-btn{width:100%;justify-content:center;text-align:center}
}

/* === CanadaDate: personals mobile floating Filters button polish === */
@media (max-width: 767px) {
  .kh-filter-toggle-floating {
    right: 0.9rem;
    bottom: calc(env(safe-area-inset-bottom) + 5rem);
    width: 48px;
    height: 48px;
    border-radius: 999px;
    border: 2px solid #ffffff;
    background: linear-gradient(180deg, #ef233c 0%, #d90429 100%);
    color: #ffffff;
    box-shadow: 0 10px 22px rgba(217, 4, 41, 0.26), 0 3px 8px rgba(0, 0, 0, 0.18);
  }

  .kh-filter-toggle-floating:hover,
  .kh-filter-toggle-floating:focus,
  .kh-filter-toggle-floating:active {
    background: linear-gradient(180deg, #ff3a53 0%, #e1122f 100%);
    color: #ffffff;
  }

  .kh-filter-toggle-floating .dashicons {
    font-size: 20px;
    line-height: 1;
  }
}

/* === CanadaDate polish: action button text + pale red personals surfaces === */
.kh-actions .kh-button,
.kh-actions .kh-button:visited {
  background: #e11d2f !important;
  border-color: #e11d2f !important;
  color: #ffffff !important;
  text-shadow: none !important;
}

.kh-actions .kh-button:hover,
.kh-actions .kh-button:focus,
.kh-actions .kh-button:active {
  background: #c8102e !important;
  border-color: #c8102e !important;
  color: #ffffff !important;
}

/* Replace lingering pale-blue accents with CanadaDate pale-red tones */
.kh-category-pill {
  border-color: #fecdd3 !important;
  background: #fff5f6 !important;
}

.kh-category-pill.is-active {
  background: #fee2e2 !important;
  border-color: #fda4af !important;
  color: #c81e1e !important;
}

.kh-filter-field-photos .kh-filter-toggle,
.kh-profile-verification-owner-badge--cta,
.kh-user-plan-selected {
  background: #fff1f2 !important;
  border-color: #fecdd3 !important;
  color: #be123c !important;
}

.kh-location-suggest-item:hover,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-slot:hover,
body.classicore-canvas-theme .kh-classifieds-listing-form .kh-video-slot:hover {
  background: #fff1f2 !important;
  border-color: #fda4af !important;
}

.kh-single-filters-header .kh-filter-clear,
.kh-user-plan-clear {
  color: #d90429 !important;
}

/* === CanadaDate desktop browse-card metadata/status cleanup === */
@media (min-width: 721px) {
  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-main {
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "title title"
      "meta status" !important;
    align-items: center !important;
    column-gap: 14px !important;
    row-gap: 8px !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-title {
    grid-area: title !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-meta {
    grid-area: meta !important;
    justify-self: start !important;
    text-align: left !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.45 !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-status {
    grid-area: status !important;
    justify-self: end !important;
    display: inline-flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    width: auto !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-status .kh-listing-line-presence {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 26px !important;
    padding: 4px 9px !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-status .kh-listing-line-presence.kh-online {
    background: #dcfce7 !important;
    color: #15803d !important;
    border: 1px solid #bbf7d0 !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-tap {
    margin-left: 0 !important;
    flex: 0 0 auto !important;
  }

  body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-tap-button {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    min-height: 34px !important;
    box-shadow: 0 4px 10px rgba(217, 4, 41, 0.14) !important;
  }
}

/* === CanadaDate tap button cleanup: remove circle, use maple leaf styling === */
.kh-tap-button,
.kh-tap-button:hover,
.kh-tap-button:focus-visible {
  border: 0 !important;
  background: transparent !important;
  color: #d90429 !important;
  border-radius: 8px !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 2px 4px !important;
  box-shadow: none !important;
  transform: none !important;
}

.kh-tap-button:hover,
.kh-tap-button:focus-visible {
  background: #fff1f2 !important;
  color: #be123c !important;
  outline: none !important;
}

.kh-tap-button-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 1.15rem !important;
  line-height: 1 !important;
}

.kh-tap-button--disabled,
.kh-tap-button--disabled:hover,
.kh-tap-button--disabled:focus-visible {
  background: transparent !important;
  border: 0 !important;
  color: #94a3b8 !important;
  opacity: 0.55 !important;
  box-shadow: none !important;
}

.kh-sidebar-tap-badge,
.kh-bottom-actions-tap-badge,
.kh-inbox-tap-back-icon,
.kh-tap-button-icon {
  font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif !important;
}

/* === CanadaDate status readability + maple tap icon cleanup === */
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-status {
  gap: 10px !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-status .kh-listing-line-presence,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-status .kh-verified-badge {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 26px !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-status .kh-listing-line-presence.kh-online {
  background: #dcfce7 !important;
  border: 1px solid #86efac !important;
  color: #166534 !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-status .kh-listing-line-presence.kh-last-seen {
  background: #e2e8f0 !important;
  border: 1px solid #cbd5e1 !important;
  color: #334155 !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-status .kh-verified-badge {
  background: #ecfdf5 !important;
  border: 1px solid #86efac !important;
  color: #065f46 !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-status .kh-verified-badge::before {
  content: '✓' !important;
  font-size: 12px !important;
  margin-right: 4px !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-tap,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-tap .kh-tap-form {
  display: inline-flex !important;
  align-items: center !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-tap .kh-tap-button,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-tap .kh-tap-button:hover,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-tap .kh-tap-button:focus-visible {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-tap .kh-tap-button-icon {
  font-size: 18px !important;
  line-height: 1 !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-tap .kh-tap-button:hover .kh-tap-button-icon,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-listing-line-tap .kh-tap-button:focus-visible .kh-tap-button-icon {
  filter: brightness(0.95);
}

/* === CanadaDate single profile polish: lighter save favourite + clean report button === */
.kh-single-header .kh-save-listing-btn.kh-saved-active {
  background: #fff1f2 !important;
  border-color: #fecdd3 !important;
  color: #e11d48 !important;
  box-shadow: 0 4px 14px rgba(225, 29, 72, 0.10) !important;
}

.kh-single-header .kh-save-listing-btn.kh-saved-active .dashicons {
  color: #e11d48 !important;
}

.kh-single-header .kh-save-listing-btn:hover,
.kh-single-header .kh-save-listing-btn:focus {
  background: #fff7f8 !important;
  border-color: #fbcfe8 !important;
  color: #be123c !important;
}

.kh-single-report-row {
  margin-top: 0.85rem !important;
}

.kh-single-report-row .kh-report-listing-btn,
.kh-single-report-row .kh-report-listing-btn:visited {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0.5rem 0.8rem !important;
  border-radius: 999px !important;
  border: 1px solid #fecdd3 !important;
  background: #fff5f6 !important;
  color: #be123c !important;
  text-decoration: none !important;
  font-size: 0.85rem !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  box-shadow: none !important;
}

.kh-single-report-row .kh-report-listing-btn:hover,
.kh-single-report-row .kh-report-listing-btn:focus {
  background: #ffe4e6 !important;
  border-color: #fda4af !important;
  color: #9f1239 !important;
}

.kh-single-report-row .kh-report-listing-btn::before {
  content: '⚑';
  margin-right: 0.45rem;
  font-size: 0.9rem;
  line-height: 1;
}

/* === CanadaDate single action buttons: use softer/fainter red === */
.kh-single-header .kh-save-listing-btn,
.kh-single-header .kh-block-user-btn--single {
  background: #fff5f6 !important;
  border-color: #fecdd3 !important;
  color: #e11d48 !important;
  box-shadow: 0 3px 10px rgba(225, 29, 72, 0.08) !important;
}

.kh-single-header .kh-save-listing-btn .dashicons,
.kh-single-header .kh-block-user-btn--single .dashicons,
.kh-single-header .kh-block-user-btn--single .kh-block-user-icon {
  color: #e11d48 !important;
}

.kh-single-header .kh-save-listing-btn:hover,
.kh-single-header .kh-save-listing-btn:focus,
.kh-single-header .kh-block-user-btn--single:hover,
.kh-single-header .kh-block-user-btn--single:focus {
  background: #ffe4e6 !important;
  border-color: #fda4af !important;
  color: #be123c !important;
}

.kh-single-header .kh-save-listing-btn:hover .dashicons,
.kh-single-header .kh-save-listing-btn:focus .dashicons,
.kh-single-header .kh-block-user-btn--single:hover .dashicons,
.kh-single-header .kh-block-user-btn--single:focus .dashicons,
.kh-single-header .kh-block-user-btn--single:hover .kh-block-user-icon,
.kh-single-header .kh-block-user-btn--single:focus .kh-block-user-icon {
  color: #be123c !important;
}

.kh-single-header .kh-save-listing-btn.kh-saved-active {
  background: #ffe4e6 !important;
  border-color: #fda4af !important;
  color: #e11d48 !important;
  box-shadow: 0 3px 10px rgba(225, 29, 72, 0.10) !important;
}

.kh-single-header .kh-save-listing-btn.kh-saved-active .dashicons {
  color: #e11d48 !important;
}

.kh-single-report-row .kh-report-listing-btn,
.kh-single-report-row .kh-report-listing-btn:visited {
  background: #fff5f6 !important;
  border-color: #fecdd3 !important;
  color: #be123c !important;
  box-shadow: 0 2px 8px rgba(225, 29, 72, 0.06) !important;
}

.kh-single-report-row .kh-report-listing-btn:hover,
.kh-single-report-row .kh-report-listing-btn:focus {
  background: #ffe4e6 !important;
  border-color: #fda4af !important;
  color: #9f1239 !important;
}

/* === CanadaDate correction: pale red backgrounds with white icons/text on single actions === */
.kh-single-header .kh-save-listing-btn,
.kh-single-header .kh-block-user-btn--single {
  background: #fb7185 !important;
  border-color: #fda4af !important;
  color: #ffffff !important;
  box-shadow: 0 3px 10px rgba(244, 63, 94, 0.14) !important;
}

.kh-single-header .kh-save-listing-btn .dashicons,
.kh-single-header .kh-block-user-btn--single .dashicons,
.kh-single-header .kh-block-user-btn--single .kh-block-user-icon {
  color: #ffffff !important;
}

.kh-single-header .kh-save-listing-btn:hover,
.kh-single-header .kh-save-listing-btn:focus,
.kh-single-header .kh-block-user-btn--single:hover,
.kh-single-header .kh-block-user-btn--single:focus {
  background: #f43f5e !important;
  border-color: #fb7185 !important;
  color: #ffffff !important;
}

.kh-single-header .kh-save-listing-btn:hover .dashicons,
.kh-single-header .kh-save-listing-btn:focus .dashicons,
.kh-single-header .kh-block-user-btn--single:hover .dashicons,
.kh-single-header .kh-block-user-btn--single:focus .dashicons,
.kh-single-header .kh-block-user-btn--single:hover .kh-block-user-icon,
.kh-single-header .kh-block-user-btn--single:focus .kh-block-user-icon {
  color: #ffffff !important;
}

.kh-single-header .kh-save-listing-btn.kh-saved-active {
  background: #fb7185 !important;
  border-color: #fda4af !important;
  color: #ffffff !important;
  box-shadow: 0 3px 10px rgba(244, 63, 94, 0.16) !important;
}

.kh-single-header .kh-save-listing-btn.kh-saved-active .dashicons {
  color: #ffffff !important;
}

.kh-single-report-row .kh-report-listing-btn,
.kh-single-report-row .kh-report-listing-btn:visited {
  background: #fb7185 !important;
  border-color: #fda4af !important;
  color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(244, 63, 94, 0.12) !important;
}

.kh-single-report-row .kh-report-listing-btn::before {
  color: #ffffff !important;
}

.kh-single-report-row .kh-report-listing-btn:hover,
.kh-single-report-row .kh-report-listing-btn:focus {
  background: #f43f5e !important;
  border-color: #fb7185 !important;
  color: #ffffff !important;
}

/* === CanadaDate fix: ensure Report button text is readable white === */
.kh-single-report-row .kh-report-listing-btn,
.kh-single-report-row .kh-report-listing-btn:visited,
.kh-single-report-row .kh-report-listing-btn:hover,
.kh-single-report-row .kh-report-listing-btn:focus,
.kh-single-report-row .kh-report-listing-btn:active {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-decoration: none !important;
  justify-content: flex-start !important;
  gap: 0.45rem !important;
  padding: 0.5rem 0.95rem !important;
}

.kh-single-report-row .kh-report-listing-btn *,
.kh-single-report-row .kh-report-listing-btn span {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.kh-single-report-row .kh-report-listing-btn::before {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  margin-right: 0 !important;
}

/* === CanadaDate single page: replace pale blue with pale red/blush === */
.kh-single-header {
  background: linear-gradient(90deg, #fff7f8 0%, #ffe4e6 55%, #ffffff 100%) !important;
  border: 1px solid #fecdd3 !important;
  box-shadow: 0 8px 24px rgba(244, 63, 94, 0.05) !important;
}

.kh-single-section-title,
.kh-single-body-column .kh-message-form h3 {
  background: linear-gradient(90deg, #fff7f8 0%, #ffe4e6 55%, #ffffff 100%) !important;
  color: #1f2937 !important;
}

.kh-single-body-column .kh-message-form {
  background: #fff7f8 !important;
  border: 1px solid #fecdd3 !important;
  box-shadow: 0 4px 14px rgba(244, 63, 94, 0.06) !important;
}

/* === CanadaDate sidebar menu: swap blue accents to red === */
.kh-sidebar::before {
  background: linear-gradient(180deg, #fb7185, #e11d48) !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-menu a:hover,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-menu a:focus,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-menu a.active,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-menu a[aria-current="page"] {
  background: #fff1f2 !important;
  color: #be123c !important;
  text-decoration: none !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-menu a:hover .dashicons,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-menu a:focus .dashicons,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-menu a.active .dashicons,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-menu a[aria-current="page"] .dashicons {
  color: #be123c !important;
}

/* === CanadaDate front-end admin cards: readable button labels === */
.kh-admin-settings .kh-settings-card .kh-button,
.kh-admin-settings .kh-settings-card .kh-button-secondary,
.kh-admin-settings .kh-settings-card .kh-open-modal,
.kh-admin-settings .kh-settings-card button,
.kh-admin-settings .kh-settings-card a.kh-button {
  background: #e11d2f !important;
  border-color: #e11d2f !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-decoration: none !important;
  font-weight: 700 !important;
}

.kh-admin-settings .kh-settings-card .kh-button:hover,
.kh-admin-settings .kh-settings-card .kh-button-secondary:hover,
.kh-admin-settings .kh-settings-card .kh-open-modal:hover,
.kh-admin-settings .kh-settings-card button:hover,
.kh-admin-settings .kh-settings-card a.kh-button:hover,
.kh-admin-settings .kh-settings-card .kh-button:focus,
.kh-admin-settings .kh-settings-card .kh-button-secondary:focus,
.kh-admin-settings .kh-settings-card .kh-open-modal:focus,
.kh-admin-settings .kh-settings-card button:focus,
.kh-admin-settings .kh-settings-card a.kh-button:focus {
  background: #be123c !important;
  border-color: #be123c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* === CanadaDate new-profile form: make Review posting guidelines label readable === */
body.classicore-canvas-theme .kh-classifieds-listing-form #kh-guidelines-btn,
body.classicore-canvas-theme .kh-classifieds-listing-form #kh-guidelines-btn:hover,
body.classicore-canvas-theme .kh-classifieds-listing-form #kh-guidelines-btn:focus,
body.classicore-canvas-theme .kh-classifieds-listing-form #kh-guidelines-btn:active {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: #e11d2f !important;
  border-color: #e11d2f !important;
  text-decoration: none !important;
}

body.classicore-canvas-theme .kh-classifieds-listing-form #kh-guidelines-btn:hover,
body.classicore-canvas-theme .kh-classifieds-listing-form #kh-guidelines-btn:focus {
  background: #c8102e !important;
  border-color: #c8102e !important;
}

/* === CanadaDate My Profiles: fix Edit action button readability === */
.kh-table-mylistings .kh-action-button--renew,
.kh-table-mylistings a.kh-action-button--renew,
.kh-table-mylistings a.kh-action-button--renew:visited {
  background: #e11d2f !important;
  border-color: #e11d2f !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-decoration: none !important;
}

.kh-table-mylistings .kh-action-button--renew .dashicons,
.kh-table-mylistings .kh-action-button--renew .kh-action-label,
.kh-table-mylistings .kh-action-button--renew .kh-renew-count {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.kh-table-mylistings .kh-action-button--renew:hover,
.kh-table-mylistings .kh-action-button--renew:focus {
  background: #c8102e !important;
  border-color: #c8102e !important;
  color: #ffffff !important;
}

/* === CanadaDate inbox actions: ensure icons/text render clearly === */
.kh-inbox-action-btn--open,
.kh-inbox-action-btn--open:visited,
.kh-inbox-action-btn--open:hover,
.kh-inbox-action-btn--open:focus,
.kh-inbox-action-btn--open:active {
  background: #e11d2f !important;
  border-color: #e11d2f !important;
  color: #ffffff !important;
}

.kh-inbox-action-btn--open .dashicons,
.kh-inbox-action-btn--open .kh-action-label,
.kh-inbox-action-btn--open span {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.kh-inbox-action-btn--delete .dashicons,
.kh-inbox-action-btn--delete span {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* === CanadaDate verification review buttons: readable white labels === */
.kh-admin-verification-actions .kh-button,
.kh-admin-verification-actions button,
.kh-admin-verification-reject-form .kh-button,
.kh-admin-verification-reject-form button,
.kh-admin-verification-modal .kh-button,
.kh-admin-verification-modal button[type="submit"] {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.kh-admin-verification-actions .kh-button *,
.kh-admin-verification-actions button *,
.kh-admin-verification-reject-form .kh-button *,
.kh-admin-verification-reject-form button *,
.kh-admin-verification-modal .kh-button *,
.kh-admin-verification-modal button[type="submit"] * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* === CanadaDate Card Image buttons: keep red backgrounds with readable white labels === */
.kh-profile-avatar-open-crop,
.kh-profile-avatar-open-crop:visited,
.kh-profile-avatar-open-crop:hover,
.kh-profile-avatar-open-crop:focus,
.kh-profile-avatar-open-crop:active,
.kh-account-avatar-card .kh-button[type="submit"],
.kh-account-avatar-card .kh-button[type="submit"]:hover,
.kh-account-avatar-card .kh-button[type="submit"]:focus,
.kh-account-avatar-card .kh-button[type="submit"]:active {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.kh-profile-avatar-open-crop *,
.kh-account-avatar-card .kh-button[type="submit"] * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* === CanadaDate Safety & Data: readable white labels on blocked/legal buttons === */
.kh-blocked-users-open,
.kh-blocked-users-open:visited,
.kh-blocked-users-open:hover,
.kh-blocked-users-open:focus,
.kh-blocked-users-open:active,
.kh-account-legal-actions .kh-button,
.kh-account-legal-actions .kh-button:visited,
.kh-account-legal-actions .kh-button:hover,
.kh-account-legal-actions .kh-button:focus,
.kh-account-legal-actions .kh-button:active {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-decoration: none !important;
}

.kh-blocked-users-open *,
.kh-account-legal-actions .kh-button * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* === CanadaDate sidebar icons: make menu and section icons red === */
.kh-sidebar-title .dashicons,
.kh-menu a .dashicons,
.kh-sidebar-inbox-icon-wrap .dashicons,
.kh-sidebar-inbox-badge {
  color: #e11d48 !important;
}

body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-menu a:hover .dashicons,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-menu a:focus .dashicons,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-menu a.active .dashicons,
body.classicore-canvas-theme.classicore-app-canvas .kh-wrapper.kh-index:not(.kh-index-rentals) .kh-menu a[aria-current="page"] .dashicons {
  color: #be123c !important;
}

/* === CanadaDate inbox Tap button: white background with simple red border === */
.kh-inbox-action-btn--tap-back,
.kh-inbox-action-btn--tap-back:visited {
  background: #ffffff !important;
  border: 1px solid #e11d48 !important;
  color: #e11d48 !important;
  box-shadow: none !important;
}

.kh-inbox-action-btn--tap-back .kh-inbox-tap-back-icon,
.kh-inbox-action-btn--tap-back span {
  color: #e11d48 !important;
  -webkit-text-fill-color: #e11d48 !important;
}

.kh-inbox-action-btn--tap-back:hover,
.kh-inbox-action-btn--tap-back:focus,
.kh-inbox-action-btn--tap-back:active {
  background: #fff7f8 !important;
  border-color: #be123c !important;
  color: #be123c !important;
  box-shadow: none !important;
}

.kh-inbox-action-btn--tap-back:hover .kh-inbox-tap-back-icon,
.kh-inbox-action-btn--tap-back:focus .kh-inbox-tap-back-icon,
.kh-inbox-action-btn--tap-back:active .kh-inbox-tap-back-icon,
.kh-inbox-action-btn--tap-back:hover span,
.kh-inbox-action-btn--tap-back:focus span,
.kh-inbox-action-btn--tap-back:active span {
  color: #be123c !important;
  -webkit-text-fill-color: #be123c !important;
}

.kh-inbox-action-btn--tap-back:disabled,
.kh-inbox-action-btn--tap-back[disabled] {
  background: #ffffff !important;
  border-color: #fda4af !important;
  color: #fda4af !important;
  opacity: 0.55 !important;
}

/* === CanadaDate inbox Tap button hard override: pale button, red border/icon on desktop + mobile === */
body.classicore-canvas-theme .kh-inbox .kh-inbox-action-btn.kh-inbox-action-btn--tap-back,
body.classicore-canvas-theme .kh-inbox .kh-button.kh-inbox-action-btn.kh-inbox-action-btn--tap-back,
body.classicore-canvas-theme .kh-inbox .kh-inbox-action-group .kh-inbox-action-btn--tap-back,
body.classicore-canvas-theme .kh-inbox .kh-inbox-tap-back-form .kh-inbox-action-btn--tap-back {
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #e11d48 !important;
  border-color: #e11d48 !important;
  color: #e11d48 !important;
  box-shadow: none !important;
}

body.classicore-canvas-theme .kh-inbox .kh-inbox-action-btn.kh-inbox-action-btn--tap-back .kh-inbox-tap-back-icon,
body.classicore-canvas-theme .kh-inbox .kh-inbox-action-btn.kh-inbox-action-btn--tap-back span {
  color: #e11d48 !important;
  -webkit-text-fill-color: #e11d48 !important;
}

body.classicore-canvas-theme .kh-inbox .kh-inbox-action-btn.kh-inbox-action-btn--tap-back:hover,
body.classicore-canvas-theme .kh-inbox .kh-inbox-action-btn.kh-inbox-action-btn--tap-back:focus,
body.classicore-canvas-theme .kh-inbox .kh-inbox-action-btn.kh-inbox-action-btn--tap-back:active {
  background: #fff7f8 !important;
  background-image: none !important;
  border-color: #be123c !important;
  color: #be123c !important;
  box-shadow: none !important;
}

body.classicore-canvas-theme .kh-inbox .kh-inbox-action-btn.kh-inbox-action-btn--tap-back:hover .kh-inbox-tap-back-icon,
body.classicore-canvas-theme .kh-inbox .kh-inbox-action-btn.kh-inbox-action-btn--tap-back:focus .kh-inbox-tap-back-icon,
body.classicore-canvas-theme .kh-inbox .kh-inbox-action-btn.kh-inbox-action-btn--tap-back:active .kh-inbox-tap-back-icon,
body.classicore-canvas-theme .kh-inbox .kh-inbox-action-btn.kh-inbox-action-btn--tap-back:hover span,
body.classicore-canvas-theme .kh-inbox .kh-inbox-action-btn.kh-inbox-action-btn--tap-back:focus span,
body.classicore-canvas-theme .kh-inbox .kh-inbox-action-btn.kh-inbox-action-btn--tap-back:active span {
  color: #be123c !important;
  -webkit-text-fill-color: #be123c !important;
}

/* === CanadaDate mobile filter Save button: red brand colour === */
.kh-filter-header-save,
.kh-filter-header-save:visited {
  background: #e11d2f !important;
  border-color: #e11d2f !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.kh-filter-header-save:hover,
.kh-filter-header-save:focus,
.kh-filter-header-save:active {
  background: #c8102e !important;
  border-color: #c8102e !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

@media (max-width: 700px) {
  .kh-filter-header-save {
    box-shadow: 0 7px 18px rgba(225, 29, 47, 0.22) !important;
  }
}

/* === CanadaDate mobile filters: red Age range sliders === */
.kh-filter-age-slider input[type="range"],
.kh-age-slider {
  accent-color: #e11d48 !important;
}

.kh-filter-age-slider input[type="range"]::-webkit-slider-thumb,
.kh-age-slider::-webkit-slider-thumb {
  background: #e11d48 !important;
  border-color: #e11d48 !important;
}

.kh-filter-age-slider input[type="range"]::-moz-range-thumb,
.kh-age-slider::-moz-range-thumb {
  background: #e11d48 !important;
  border-color: #e11d48 !important;
}

.kh-filter-age-slider input[type="range"]::-webkit-slider-runnable-track,
.kh-age-slider::-webkit-slider-runnable-track {
  border-color: #fecdd3 !important;
}

.kh-filter-age-slider input[type="range"]::-moz-range-progress,
.kh-age-slider::-moz-range-progress {
  background: #e11d48 !important;
}

.kh-filter-age-slider input[type="range"]::-moz-range-track,
.kh-age-slider::-moz-range-track {
  background: #ffe4e6 !important;
}