/* =========================================================
   FLOOR PLANS — COMPLETE STYLES (SAFE + SCOPED)
   Only affects plugin output inside .fp-wrap
   ========================================================= */

.fp-wrap{
  width:100%;
}

/* ---------------------------
   GRID (auto-fit, no empty gaps)
---------------------------- */
.fp-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap:18px;
  align-items:stretch;
}

/* ---------------------------
   CARD (square image)
---------------------------- */
.fp-card{
  width:100%;
  aspect-ratio: 1 / 1;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  position:relative;
  overflow:hidden;
  cursor:pointer;
}

/* Bottom black label like your screenshot */
.fp-overlay{
  position:absolute;
  left:16px;
  bottom:16px;
  max-width: calc(100% - 32px);
  background: rgba(0,0,0,.78);
  color:#fff;
  border-radius:10px;
  padding: 12px 14px;
}

.fp-name{
  font-size:20px;
  font-weight:800;
  line-height:1.1;
  margin:0;
}

.fp-meta{
  font-size:14px;
  margin-top:6px;
  opacity:.92;
}

/* Small hover (optional, safe) */
.fp-card:hover{
  filter: brightness(.98);
}

/* Empty message */
.fp-empty{
  margin: 10px 0 0;
  color:#666;
}

/* =========================================================
   FILTER — fields in one row + buttons bottom-right
   ========================================================= */
.fp-filter{
  background:#fff;
  border:1px solid #e6e6e6;
  border-radius:16px;
  padding:24px;
  margin: 0 0 22px;
}

.fp-filter__head{
  margin-bottom: 8px;
}

.fp-filter__title{
  font-size:28px;
  font-weight:800;
  color:#111827;
  margin:0;
}

.fp-filter__sub{
  color:#6b7280;
  font-size:14px;
  margin-top:6px;
}

/* 5 inputs in one row */
.fp-filter__grid{
  display:grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap:16px;
  align-items:end;
  margin-top: 14px;
}

.fp-field label{
  display:block;
  font-size:13px;
  font-weight:800;
  letter-spacing:.10em;
  text-transform:uppercase;
  color:#6b7280;
  margin:0 0 8px;
}

.fp-field input{
  width:100% !important;
  height:48px;
  border:1px solid #d1d5db;
  border-radius:10px;
  padding:0 14px;
  font-size:15px;
  color:#111827;
  background:#fff;
  outline:none;
  box-shadow:none;
}

.fp-field input::placeholder{
  color:#9ca3af;
  opacity:1;
}

.fp-field input:focus{
  border-color:#c7ced9;
  box-shadow: 0 0 0 4px rgba(16,185,129,.12);
}

/* Buttons in new row, bottom-right */
.fp-actions{
  grid-column: 1 / -1;
  display:flex;
  justify-content:flex-end;
  gap:12px;
  margin-top:6px;
}

.fp-btn{
  height:46px;
  padding:0 22px;
  border-radius:10px;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
  border:1px solid transparent;
}

.fp-btn--search{
  background:#0aa68b;
  color:#fff;
}

.fp-btn--clear{
  background:#e5e7eb;
  color:#374151;
  border-color:#d1d5db;
}

/* Responsive filter */
@media (max-width: 1024px){
  .fp-filter__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 520px){
  .fp-filter{
    padding:16px;
  }
  .fp-filter__grid{
    grid-template-columns: 1fr;
  }
  .fp-actions{
    justify-content:stretch;
  }
  .fp-btn{
    width:100%;
  }
}

/* =========================================================
   FULLSCREEN LIGHTBOX (Reference style)
   ========================================================= */
.fp-lightbox{
  position: fixed;
  inset: 0;
  display: none;
  z-index: 999999;
}

.fp-lightbox.is-open{
  display:block;
}

.fp-lightbox__backdrop{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.70);
}

.fp-lightbox__bar{
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:56px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 16px;
  background: rgba(0,0,0,.35);
  z-index: 3;
}

.fp-lightbox__count{
  color:#fff;
  font-size:14px;
  font-weight:700;
  opacity:.95;
}

.fp-lightbox__close{
  background: transparent;
  color:#fff;
  border:0;
  width:44px;
  height:44px;
  border-radius:8px;
  cursor:pointer;
  font-size:28px;
  line-height:1;
  opacity:.9;
}

.fp-lightbox__close:hover{
  opacity:1;
}

.fp-lightbox__stage{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 70px 5vw 40px;
  z-index: 2;
}

.fp-lightbox__img{
  max-width: 88vw;
  max-height: 82vh;
  object-fit: contain;
  box-shadow: 0 16px 55px rgba(0,0,0,.55);
}

.fp-lightbox__nav{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  border:0;
  cursor:pointer;
  width:56px;
  height:56px;
  border-radius:50%;
  background: rgba(0,0,0,.35);
  color:#fff;
  font-size:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index: 4;
}

.fp-lightbox__nav:hover{
  background: rgba(0,0,0,.55);
}

.fp-prev{ left:22px; }
.fp-next{ right:22px; }



.fp-lightbox__count{
  color:#fff;
  font-size:14px;
  font-weight:700;
  opacity:.95;
}