/* =============================
   Parent Area Properties Widget
   ============================= */

/* Wrapper */
.rs-lap {
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
  overflow: hidden;
  width: 100%;
}

/* Header */
.rs-lap__header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 16px;
  border-bottom: 1px solid #eef0f4;
  font-weight: 600;
  color: #111;
  font-size: 18px;
}
.rs-lap__header i { color: #244489; }

/* =============================
   Tabs (Scrollable with arrows)
   ============================= */
.rs-lap__tabswrap {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 8px 0;
}
.rs-lap__arrow {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid #e4e8f1;
  background: #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,.06);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  line-height: 1;
  color: #333;
}
.rs-lap__arrow:hover { background: #f7f9fc; }

.rs-lap__tabs {
  flex: 1 1 auto;
  overflow-x: auto;
  white-space: nowrap;
  scroll-behavior: smooth;
  padding: 6px 4px 10px;
}
.rs-lap__tabs::-webkit-scrollbar { display: none; }

.rs-lap__tab {
  display: inline-flex;
  align-items: center;
  margin-right: 10px;
  padding: 8px 14px;
  border: 1px solid #dfe3ea;
  background: white;
  border-radius: 10px;
  font-weight: 400;
  cursor: pointer;
  white-space: nowrap;
}
.rs-lap__tab.is-active {
  background: #b0c8ff85;
  border-color: #cdd9ff;
  color: #244489;
}

/* =============================
   Panels
   ============================= */
.rs-lap__panels { padding: 10px 10px 10px 10px; }
.rs-lap__panel { display: none; }

/* =============================
   Property List + Card
   ============================= */
.rs-lap__list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  /*max-height: 560px;*/
  max-height: none !important;
  overflow-y: visible !important;
  overflow: auto;
  overscroll-behavior: auto;
  padding: 10px;
  background-color: #f7f7f7;
  border-radius: 10px;
}

.rs-card {
  --thumb-w: 180px;
  --thumb-h: 140px;
  display: grid;
  grid-template-columns: var(--thumb-w) 1fr;
  gap: 16px;
  align-items: stretch;
  min-height: var(--thumb-h);
  border: 1px solid #eef0f4;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 3px 10px rgba(0,0,0,.04);
  padding: 10px;
}
.rs-card.is-hidden { display: none; }

.rs-card__thumb {
  width: var(--thumb-w);
  height: var(--thumb-h);
  
  border-radius: 10px;
  overflow: hidden;
  display: block;
}
.rs-card__thumb img {
  width:80%;
  height: auto;
  object-fit: cover;
  display: block;
}

.rs-card__body {
    width: 100%;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: var(--thumb-h);
}
.rs-card__title {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.3;
  margin: 0;
}
.rs-card__title a {
  text-decoration: none;
  color: #424242;
  font-weight: 400;
}
.rs-card__title a:hover { color: #244489; }

.rs-card__desc {
  font-size: 11px!important;
  line-height: 1.55;
  color: #4a4f59;
  margin: 0;
  
}

/* =============================
   Actions (See More / View All)
   ============================= */
.rs-lap__actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  /*padding: 10px 6px 12px;*/
}
.rs-lap__more {
  border: 1px solid #d6dff5;
  background: #f2f6ff;
  padding: 4px 12px;
  border-radius: 10px;
  font-weight: 600;
  cursor: pointer;
}
.rs-lap__viewall {
  margin-left: auto;
  font-weight: 700;
  color: #244489;
  text-decoration: none;
}
.rs-lap__empty { padding: 12px; color: #777; }

/* Utility hidden class */
.is-hidden-el { display: none !important; }

/* --- Make card & image corners perfectly align --- */
.rs-card{ --thumb-w: 180px; --thumb-h: 140px; border-radius:12px; }
.rs-card__thumb{ width:var(--thumb-w); height:var(--thumb-h); border-radius:12px; overflow:hidden; }
.rs-card__thumb img{ width:100%; height:100%; object-fit:cover; display:block; border-radius:inherit; }

/* --- Lock body to image height so card never gets taller than image --- */
.rs-card__body{
  min-height:var(--thumb-h);
  max-height:var(--thumb-h);   /* keeps card equal to image height */
  overflow:hidden;
  display:flex;
  flex-direction:column;
  gap:6px;
}

/* --- Title: 1 line, ellipsis --- */
.rs-card__title{
  font-size:18px; font-weight:600; line-height:1.3; margin:0;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* --- Description: 2-line clamp --- */
.rs-card__desc {
  font-size: 14px;
  line-height: 1.55;
  color: #7c7c7c;
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3; /* default = 3 lines on desktop */
}

/* Mobile: clamp to 2 lines only */
@media (max-width: 600px) {
  .rs-card__desc {
    -webkit-line-clamp: 2;
    font-size: 13px;
  }
}



/* =============================
   Responsive
   ============================= */
@media (max-width: 768px) {
  .rs-card { --thumb-w: 150px; --thumb-h: 73px; }
  .rs-card__title { font-size: 16px; }
  .rs-card__thumb{ border-radius:10px; }
  .rs-card__thumb img { width:100%; height: 100%!important;
}
@media (max-width: 480px) {
  .rs-card { --thumb-w: 120px; --thumb-h: 73px; }
  .rs-card__title { font-size: 15px; }
   .rs-card__thumb{ border-radius:10px; }
   .rs-card__thumb img { width:100%; height: 100%!important;
}

.rs-card.is-hidden { display: none; }