.ida-room-grid{
  --gap: 12px;
  display:flex;
  flex-wrap:wrap;
  gap: var(--gap);
  justify-content:center;   
  align-content:flex-start;
}

.ida-room-grid.cols-1  > .ida-room-card{ flex:0 1 calc((100% - 0*var(--gap))/1); }
.ida-room-grid.cols-2  > .ida-room-card{ flex:0 1 calc((100% - 1*var(--gap))/2); }
.ida-room-grid.cols-3  > .ida-room-card{ flex:0 1 calc((100% - 2*var(--gap))/3); }
.ida-room-grid.cols-4  > .ida-room-card{ flex:0 1 calc((100% - 3*var(--gap))/4); }
.ida-room-grid.cols-5  > .ida-room-card{ flex:0 1 calc((100% - 4*var(--gap))/5); }
.ida-room-grid.cols-6  > .ida-room-card{ flex:0 1 calc((100% - 5*var(--gap))/6); }
.ida-room-grid.cols-7  > .ida-room-card{ flex:0 1 calc((100% - 6*var(--gap))/7); }
.ida-room-grid.cols-8  > .ida-room-card{ flex:0 1 calc((100% - 7*var(--gap))/8); }

.ida-room-card{ display:block; cursor:pointer; text-decoration:none; color:inherit; position:relative; }
.ida-room-card input[type=radio]{ position:absolute; opacity:0; pointer-events:none; }

.ida-card-inner{
  border:2px solid #e0e0e0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-height:180px;
  transition:all .15s ease;
}

.ida-card-img{
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #f7f7f7;
  padding-top: 67%; 
  width: 100%;
}

.ida-card-label{
  padding:10px;
  font-weight:600;
  position:relative;
  line-height:1.25;
  padding-right:34px;   
  text-align:right;
}


.ida-room-card input[type="radio"]:checked + .ida-card-inner{
  border-color:#2271b1;
  box-shadow:0 0 0 2px rgba(34,113,177,.15);
}


.ida-card-label::before{
  content:"";
  position:absolute; top:50%; right:12px;
  width:18px; height:18px; border:2px solid #9aa0a6; border-radius:50%;
  background:#fff; transform:translateY(-50%); box-sizing:border-box;
}
.ida-card-label::after{
  content:"";
  position:absolute; top:50%; right:16px;
  width:10px; height:10px; border-radius:50%;
  background:#2271b1; transform:translateY(-50%) scale(0);
  transition:transform .15s ease;
}
.ida-room-card input[type="radio"]:checked + .ida-card-inner .ida-card-label::before{ border-color:#2271b1; }
.ida-room-card input[type="radio"]:checked + .ida-card-inner .ida-card-label::after{ transform:translateY(-50%) scale(1); }


html[dir="ltr"] .ida-card-label{ padding-right:10px; padding-left:34px; text-align:left; }
html[dir="ltr"] .ida-card-label::before{ right:auto; left:12px; }
html[dir="ltr"] .ida-card-label::after { right:auto; left:16px; }

@media (max-width:640px){
  .ida-room-grid{ gap: var(--gap) !important; }
  .ida-room-grid > .ida-room-card{ flex:0 1 100% !important; }
}

/* ===== Elementor scope (Lite) ===== */
.rib-field{
  margin:0 auto;
  --rib-img-h: 240px;      
  --rib-img-w: 100%;       
  --rib-img-fit: contain;   
  --rib-card-max-w: 280px;   
  --rib-grid-gap: 12px;      
}


.rib-field .ida-room-grid{
  --gap: var(--rib-grid-gap, 12px);
  display:flex;
  flex-wrap:wrap;
  gap: var(--gap);
  justify-content:center;
  align-content:flex-start;
  width:100%;
  margin:0 auto;
}


.rib-field .ida-room-grid.cols-1 > .ida-room-card{ flex:0 1 calc((100% - 0*var(--gap))/1); }
.rib-field .ida-room-grid.cols-2 > .ida-room-card{ flex:0 1 calc((100% - 1*var(--gap))/2); }
.rib-field .ida-room-grid.cols-3 > .ida-room-card{ flex:0 1 calc((100% - 2*var(--gap))/3); }
.rib-field .ida-room-grid.cols-4 > .ida-room-card{ flex:0 1 calc((100% - 3*var(--gap))/4); }
.rib-field .ida-room-grid.cols-5 > .ida-room-card{ flex:0 1 calc((100% - 4*var(--gap))/5); }
.rib-field .ida-room-grid.cols-6 > .ida-room-card{ flex:0 1 calc((100% - 5*var(--gap))/6); }
.rib-field .ida-room-grid.cols-7 > .ida-room-card{ flex:0 1 calc((100% - 6*var(--gap))/7); }
.rib-field .ida-room-grid.cols-8 > .ida-room-card{ flex:0 1 calc((100% - 7*var(--gap))/8); }

.rib-field label.ida-room-card{ display:block; }

.rib-field .ida-room-card .ida-card-inner{
  width:350px;                       
  outline-offset:2px;
}

.rib-field .ida-card-img{
  height: var(--rib-img-h, 160px);
  width:  var(--rib-img-w, 100%);
  padding-top: 0 !important;               
  background-size: var(--rib-img-fit, contain);
  background-position:center;
  background-repeat:no-repeat;
  background-color:#f7f7f7;
  margin-left:auto;
  margin-right:auto;
}


@media (max-width:640px){
  .rib-field .ida-room-grid{ gap: var(--gap) !important; }
  .rib-field .ida-room-grid > .ida-room-card{ flex:0 1 100% !important; }
}