/* ==========================================
   Pretty Keep Fluid Spacing for subbar/chips
   - Keep this file limited to spacing/layout helpers
   - Results-specific card/grid styling lives in pk-results.css
   ========================================== */

/* 1) Subbar container paddings */
.pk-subbar{
  padding-left: clamp(0.75rem, 4vw, 2rem);
  padding-right: clamp(0.75rem, 4vw, 2rem);
}

.pk-subbar[aria-hidden="false"]{
  margin-top: clamp(0.5rem, 1.8vw, 1rem);
  padding-top: clamp(0.5rem, 1.8vw, 1rem);
  padding-bottom: clamp(0.5rem, 1.8vw, 1rem);
  padding-left: clamp(0.5rem, 4vw, 1.25rem);
  padding-right: clamp(0.5rem, 4vw, 1.25rem);
}

/* 2) Mid tabs */
.pk-midtabs{
  gap: clamp(6px, 1.5vw, 10px);
}

.pk-midtabs button{
  padding: clamp(6px, 1.2vw, 8px) clamp(10px, 2.2vw, 14px);
  line-height: 1.2;
}

/* 3) Chips */
.pk-chips{
  gap: clamp(6px, 1.5vw, 10px);
  padding-top: clamp(8px, 2vw, 14px);
}

.pk-chips button,
.pk-chip{
  padding: clamp(5px, 1.2vw, 7px) clamp(10px, 2.2vw, 14px);
  line-height: 1.2;
}

/* 4) Empty state chips */
.empty-state .pk-chip{
  padding: clamp(5px, 1.2vw, 7px) clamp(10px, 2.2vw, 14px);
}

/* Center doctor grid when fewer than 4 items */
.doctor-grid.pk-grid.few{
  grid-template-columns: repeat(auto-fit, minmax(260px, 260px));
  justify-content: center;
}

@media (max-width: 960px){
  .doctor-grid.pk-grid.few{
    grid-template-columns: repeat(auto-fit, minmax(240px, 240px));
  }
}

@media (max-width: 560px){
  .doctor-grid.pk-grid.few{
    grid-template-columns: repeat(1, minmax(0, 1fr));
    justify-content: center;
  }
}