/* ============== VARIABLES ============== */
:root { --his-idx-sticky-top: 90px; }

/* ============== GRID (LIST PAGES) ============== */
.his-idx-grid{
  display:grid !important;
  grid-template-columns:repeat(3,380px) !important;
  gap:24px !important;
  justify-content:center !important;
  max-width:calc(3 * 380px + 2 * 24px) !important;
  margin:0 auto !important;
}
@media (max-width:1240px){
  .his-idx-grid{
    grid-template-columns:repeat(2,380px) !important;
    max-width:calc(2 * 380px + 24px) !important;
  }
}
@media (max-width:820px){
  .his-idx-grid{
    grid-template-columns:1fr !important;
    max-width:none !important;
    padding:0 12px;
  }
}

/* Cards */
.his-idx-card{
  width:380px !important;
  border:1px solid #e5e7eb;
  border-radius:12px;
  overflow:hidden;
  background:#fff;
  display:flex;
  flex-direction:column;
  transition:box-shadow .2s, transform .2s;
}
.his-idx-card:hover{ box-shadow:0 8px 24px rgba(16,24,40,.12); transform:translateY(-1px); }
@media (max-width:820px){ .his-idx-card{ width:100% !important; } }

.his-idx-thumb{ position:relative; display:block; overflow:hidden; flex:0 0 220px; background:#f3f4f6; }
.his-idx-thumb img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
.his-idx-card:hover .his-idx-thumb img{ transform:scale(1.04); }

.his-idx-badges{ position:absolute; top:8px; left:8px; display:flex; gap:6px; z-index:2; }
.his-idx-badge{ font-size:12px; padding:6px 8px; border-radius:999px; color:#fff; background:#111827; opacity:.95; }
.his-idx-badge.auc{ background:#b45309; }
.his-idx-badge.new{ background:#16a34a; }

.his-idx-body{ flex:1 1 auto; padding:10px 12px; display:flex; flex-direction:column; align-items:center; text-align:center; }
.his-idx-price{ margin:0 0 6px; font-size:22px; font-weight:800; line-height:1.2; }
.his-idx-price a{ text-decoration:none; color:inherit; }
.his-idx-addr-1{ color:#374151; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.his-idx-addr-2{ color:#6b7280; font-size:13px; margin-bottom:8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.his-idx-stats{
  margin-top:auto; width:100%;
  display:grid; grid-template-columns:repeat(3,1fr);
  border-top:1px solid #e5e7eb; border-bottom:1px solid #e5e7eb;
  border-radius:8px; overflow:hidden;
}
.his-idx-stat{ padding:10px 6px; background:#fff; }
.his-idx-stat + .his-idx-stat{ border-left:1px solid #e5e7eb; }
.his-idx-stat-value{ font-weight:700; font-size:15px; line-height:1.1; }
.his-idx-stat-label{ font-size:11px; letter-spacing:.08em; color:#6b7280; }

.his-idx-updated-since{ color:#6b7280; font-size:12px; margin-top:10px; }
.his-idx-btn{ display:inline-block; margin-top:10px; padding:8px 12px; border:1px solid #111827; border-radius:8px; text-decoration:none; }

/* ============== FILTERS (LIST/MAP) ============== */
.his-idx-filters{
  position:sticky !important;
  top:var(--his-idx-sticky-top) !important;
  z-index:30 !important;
  background:#fff !important;
  border:1px solid #e5e7eb !important;
  border-radius:12px !important;
  padding:12px !important;
  margin:18px 0 !important;
}
.admin-bar .his-idx-filters{ top:calc(var(--his-idx-sticky-top) + 32px) !important; }
@media (max-width:782px){
  .admin-bar .his-idx-filters{ top:calc(var(--his-idx-sticky-top) + 46px) !important; }
}

.his-idx-filters .his-idx-row{
  display:grid !important; grid-template-columns:repeat(6, minmax(140px,1fr)) !important;
  column-gap:12px !important; row-gap:10px !important; align-items:end !important;
  background:transparent !important; border:0 !important; padding:0 !important;
}
.his-idx-filters .his-idx-row > div:nth-child(7){ grid-column:1/2 !important; } /* per-page */
.his-idx-actions{ grid-column:2/4 !important; display:flex !important; gap:8px !important; align-items:center !important; }
.his-idx-layout{ grid-column:6/7 !important; justify-self:end !important; display:flex !important; gap:8px !important; }

.his-idx-filters label{ display:block !important; font-size:12px !important; color:#4b5563 !important; margin:0 0 4px !important; }
.his-idx-filters select, .his-idx-filters input[type="number"]{
  width:100% !important; padding:9px 10px !important; border:1px solid #e5e7eb !important; border-radius:10px !important;
  background:#fff !important; font-size:14px !important;
}
.his-idx-actions button{
  padding:9px 14px !important; border:1px solid #111827 !important; border-radius:10px !important;
  background:#111827 !important; color:#fff !important; cursor:pointer !important;
}
.his-idx-actions .his-idx-clear{
  display:inline-block !important; padding:9px 14px !important; border:1px solid #e5e7eb !important;
  border-radius:10px !important; background:#fff !important; text-decoration:none !important;
}
.his-idx-layout a{
  padding:9px 14px !important; border:1px solid #e5e7eb !important; border-radius:10px !important; text-decoration:none !important;
}
.his-idx-layout a.active{ border-color:#111827 !important; background:#111827 !important; color:#fff !important; }

@media (max-width:1100px){
  .his-idx-filters .his-idx-row{ grid-template-columns:repeat(3, minmax(0,1fr)) !important; }
  .his-idx-filters .his-idx-row > div:nth-child(7){ grid-column:1/2 !important; }
  .his-idx-actions{ grid-column:2/3 !important; }
  .his-idx-layout{ grid-column:3/4 !important; justify-self:end !important; }
}
@media (max-width:700px){
  .his-idx-filters .his-idx-row{ grid-template-columns:1fr !important; }
  .his-idx-filters .his-idx-row > div:nth-child(7), .his-idx-actions, .his-idx-layout{
    grid-column:1/-1 !important; justify-self:stretch !important;
  }
  .his-idx-layout{ justify-content:flex-start !important; }
}

/* Map container */
#his-idx-map{ width:100%; height:520px; border-radius:12px; border:1px solid #e5e7eb; }

/* Filters trigger + panel shell (works for list and map) */
.his-filters-panel[hidden]{ display:none !important; }
.his-filters-close{ display:none; }

/* Desktop dropdown (aligned to grid; above map) */
@media (min-width:769px){
  .his-filters-shell{
    position:relative !important; display:flex !important; justify-content:flex-end !important; align-items:center !important;
    max-width:calc(3 * 380px + 2 * 24px) !important; margin:0 auto 12px auto !important; z-index:20000 !important;
  }
  .his-filters-toggle{
    display:inline-flex !important; align-items:center !important; gap:8px !important;
    padding:10px 14px !important; border:1px solid #e5e7eb !important; border-radius:12px !important;
    background:#fff !important; box-shadow:0 2px 8px rgba(0,0,0,.06) !important; cursor:pointer !important;
    color:#111827 !important;
  }
  .his-filters-panel{
    position:absolute !important; left:0 !important; right:0 !important; top:calc(100% + 8px) !important;
    display:none !important; background:transparent !important; z-index:21000 !important;
  }
  .his-filters-panel.his-open{ display:block !important; }
  .his-filters-panel .his-filter-bar{
    width:100% !important; margin:0 auto !important; background:#fff !important;
    border:1px solid #e5e7eb !important; border-radius:16px !important; padding:20px !important;
    box-shadow:0 12px 40px rgba(0,0,0,.18) !important; position:relative;
  }
  .his-filters-close{
    display:block !important; position:absolute !important; top:10px !important; right:14px !important;
    width:36px !important; height:36px !important; border:0 !important; background:transparent !important;
    font-size:28px !important; line-height:32px !important; color:#374151 !important; cursor:pointer !important;
  }
  /* ensure panel is clickable over Leaflet */
  .leaflet-container{ position:relative; z-index:0 !important; }
}

/* Mobile sheet */
@media (max-width:768px){
  .his-filters-toggle{
    display:block; width:100%; text-align:center; font-weight:600; padding:12px 16px;
    border:1px solid #e5e7eb; border-radius:12px; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.06);
    margin:8px 0 12px 0; position:sticky; top:0; z-index:30; color:#111827;
  }
  .his-filters-panel{ position:fixed; inset:0; background:rgba(0,0,0,.4); display:none; z-index:40000; }
  .his-filters-panel.his-open{ display:block; }
  .his-filters-panel .his-filter-bar{
    position:absolute; left:0; right:0; bottom:0; max-height:80vh; overflow:auto; background:#fff;
    border-top-left-radius:16px; border-top-right-radius:16px; padding:16px; box-shadow:0 -6px 24px rgba(0,0,0,.12);
  }
  .his-filters-close{
    display:block; position:absolute; top:6px; right:10px; width:36px; height:36px;
    border:0; background:transparent; font-size:28px; line-height:32px; cursor:pointer; color:#374151;
  }
  body.his-noscroll{ overflow:hidden; touch-action:none; }
}

/* Keep Filters label visible in all states */
.his-filters-toggle, .his-filters-toggle span{
  color:#111827 !important; opacity:1 !important; visibility:visible !important;
}

/* If panel open over map, send clicks to panel (desktop map view) */
@media (min-width:769px){
  .his-filters-panel.his-open ~ #his-idx-map{ pointer-events:none !important; }
}

/* ============== PROPERTY DETAILS v2 ============== */
.his-single--v2{ max-width:1200px; margin:0 auto; padding:8px 12px 40px; }
.his-single__header{ margin:8px 0 10px; }
.his-single__title{ margin:0; font-size:30px; line-height:1.2; font-weight:800; }
.his-single__sub{ color:#6b7280; margin-top:2px; }

/* 1 big + 4 thumbs (mosaic) */
.his-gallery{ margin-top:12px; }
.his-gallery__mosaic{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;        /* big column + two small columns */
  grid-template-rows:repeat(2, 220px);      /* two rows of thumbs */
  gap:8px;
}
.his-mosaic__hero{ grid-column:1 / 2; grid-row:1 / 3; border-radius:12px; overflow:hidden; background:#f3f4f6; }
.his-mosaic__hero img,
.his-mosaic__thumb img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1); transition:transform .25s ease; cursor:pointer;
}
.his-mosaic__hero img:hover,
.his-mosaic__thumb img:hover{ transform:scale(1.03); }
.his-mosaic__thumb{ border-radius:12px; overflow:hidden; background:#f3f4f6; position:relative; }
.his-more-overlay{
  position:absolute; right:8px; bottom:8px;
  background:rgba(0,0,0,.6); color:#fff; font-weight:700; padding:6px 10px; border-radius:999px; font-size:13px;
}

@media (max-width:980px){
  .his-gallery__mosaic{
    grid-template-columns:1fr 1fr; grid-template-rows:200px 200px;
  }
  .his-mosaic__hero{ grid-column:1 / -1; grid-row:1 / 2; }
}

.his-gallery__actions{ display:flex; align-items:center; justify-content:space-between; margin-top:10px; }
.his-price-pill{ font-size:20px; font-weight:800; }

.his-two{ display:grid; grid-template-columns:3fr 1.4fr; gap:24px; margin-top:18px; }
@media (max-width:980px){ .his-two{ grid-template-columns:1fr; } }

.his-facts-row{
  display:grid; grid-template-columns:repeat(6, minmax(0,1fr));
  gap:8px; border:1px solid #e5e7eb; border-radius:12px; padding:10px;
}
.his-fact{ text-align:center; }
.his-fact__v{ font-weight:800; font-size:18px; }
.his-fact__l{ font-size:11px; letter-spacing:.08em; color:#6b7280; }

/* Description */
.his-desc{ margin:14px 0 10px; line-height:1.7; }

/* Specs — single column (Property Info removed) */
.his-spec--grid-1{ display:grid; grid-template-columns:1fr; gap:16px; margin:10px 0 16px; }
.his-spec__col{ border:1px solid #e5e7eb; border-radius:12px; padding:12px; }
.his-spec__col h3{ margin:0 0 10px; font-size:16px; }
.his-spec__row{ display:flex; justify-content:space-between; padding:6px 0; border-top:1px dashed #f1f3f5; }
.his-spec__row:first-of-type{ border-top:0; }
.his-spec__l{ color:#6b7280; }
.his-spec__v{ font-weight:600; }

/* Map (details) */
.his-single-map-wrap{ margin-top:12px; }
#his-single-map{ width:100%; height:360px; border:1px solid #e5e7eb; border-radius:12px; }

/* Sidebar summary + actions */
.his-side{ position:relative; }
@media (min-width:981px){ .his-side{ position:sticky; top:100px; height:fit-content; } }

.his-summary-card{
  border:1px solid #e5e7eb; border-radius:12px; padding:14px;
  display:flex; flex-direction:column; gap:10px;
}
.his-price-lg{ font-size:28px; font-weight:800; }
.his-meta{ list-style:none; margin:0; padding:0; }
.his-meta li{ padding:6px 0; border-top:1px dashed #f1f3f5; }
.his-meta li:first-child{ border-top:0; }
.his-actions-vert{ display:flex; flex-direction:column; gap:8px; }

.his-btn{ display:inline-flex; align-items:center; justify-content:center; height:40px; padding:0 14px; border-radius:10px; font-weight:700; text-decoration:none; border:1px solid #e5e7eb; color:#111827; background:#fff; }
.his-btn--primary{ border-color:#111827; background:#111827; color:#fff; }
.his-btn--ghost{ background:#fff; border-color:#e5e7eb; color:#111827; }

/* Inquiry Modal */
.his-modal[hidden]{ display:none !important; }
.his-modal{ position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:40000; display:flex; align-items:center; justify-content:center; padding:16px; }
.his-modal__dialog{ background:#fff; border-radius:12px; width:min(540px,92vw); padding:16px; position:relative; }
.his-modal__close{ position:absolute; right:10px; top:8px; width:36px; height:36px; border:0; background:transparent; font-size:28px; cursor:pointer; color:#374151; }
.his-form label{ display:block; font-size:14px; margin:8px 0 6px; color:#374151; }
.his-form input, .his-form textarea{ width:100%; padding:10px; border:1px solid #e5e7eb; border-radius:10px; font-size:14px; }
.his-form__note{ margin-top:8px; font-size:13px; color:#374151; }

/* Lightbox for gallery */
.his-lightbox[hidden]{ display:none !important; }
.his-lightbox{ position:fixed; inset:0; background:rgba(0,0,0,.92); z-index:41000; display:flex; align-items:center; justify-content:center; }
.his-lightbox__img{ max-width:92vw; max-height:90vh; border-radius:8px; }
.his-lightbox__close{ position:absolute; top:14px; right:18px; width:42px; height:42px; border:0; background:transparent; color:#fff; font-size:34px; cursor:pointer; }
.his-lightbox__nav{ position:absolute; top:50%; transform:translateY(-50%); width:56px; height:56px; border:0; background:rgba(255,255,255,.18); color:#fff; font-size:34px; border-radius:999px; cursor:pointer; }
.his-lightbox__prev{ left:18px; } .his-lightbox__next{ right:18px; }

/* Video modal (under price box) */
.his-video__dialog{ width:min(920px,96vw); }
.his-video__wrap{ position:relative; padding-bottom:56.25%; height:0; overflow:hidden; border-radius:12px; background:#000; }
.his-video__wrap iframe, .his-video__wrap video{ position:absolute; inset:0; width:100%; height:100%; }
