/* Dead Pedros – Recipes Grid (PILL CARD STYLE) */

.dp-rg {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 18px;
  color: #fff;
}

.dp-rg-title {
  text-align: center;
  font-size: 64px;
  margin: 0 0 22px;
  font-weight: 400;
}

/* Controls bar */
.dp-rg-controls{
  display:grid;
  grid-template-columns: 1fr 1fr auto 2fr;
  gap:12px;
  align-items:center;
  margin-bottom:18px;
}

.dp-rg[data-show-tags="0"] .dp-rg-controls{
  grid-template-columns: 1fr auto 2fr;
}

@media (max-width: 900px){
  .dp-rg-controls{ grid-template-columns: 1fr 1fr; }
  .dp-rg[data-show-tags="0"] .dp-rg-controls{ grid-template-columns: 1fr 1fr; }
}

.dp-rg-select, .dp-rg-search, .dp-rg-reset{
  border-radius:14px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(255,255,255,0.06);
  color:#fff;
  padding:12px 14px;
  font-size:16px;
  outline:none;
}

.dp-rg-select option{ color:#111; }

.dp-rg-reset{
  background:#3b82f6;
  border-color:rgba(255,255,255,0.12);
  cursor:pointer;
  font-weight:600;
}

/* --- PILL GRID --- */
.dp-rg-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)); /* 3 on desktop */
  gap:10px;
}

@media (max-width: 1100px){
  .dp-rg-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)); /* 2 on tablet */
  }
}

@media (max-width: 640px){
  .dp-rg-grid{
    grid-template-columns: 1fr; /* 1 on mobile */
  }
}

/* --- PILL CARD --- */
.dp-rg-card{
  display:flex;
  align-items:stretch;
  text-decoration:none;
  color:inherit;

  border-radius: 26px;
  background: rgba(255,255,255,0.10);
  overflow:hidden;
  box-shadow: 0 10px 22px rgba(0,0,0,0.35);
  transition: transform .12s ease, background .12s ease;

  min-height: 120px; /* desktop pill height */
}

.dp-rg-thumb{
  width: 140px;
  min-width: 140px;
  height: 100%;              /* key: always match card height */
  background-size: cover;
  background-position: center;
  background-color: rgba(255,255,255,0.03);
  border-radius: 26px 0 0 26px;
}

/* Mobile: make the whole pill shallower, image follows */
@media (max-width: 640px){
  .dp-rg-card{
    min-height: 84px;         /* adjust 76–92 */
  }
  .dp-rg-thumb{
    width: 120px;             /* keep width similar */
    min-width: 120px;
  }
  .dp-rg-meta{
    padding: 12px 14px;
  }
  .dp-rg-name{
    font-size: 22px;
  }
}

/* Text block */
.dp-rg-meta{
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding: 18px 20px;
}

.dp-rg-name{
  font-size: 16px;
  line-height: 1.05;
  letter-spacing: 0.2px;
}

.dp-rg-sub{
  display:none; /* your screenshot doesn't show the category line */
}

/* Hide cards when filtered */
.dp-rg-card.is-hidden{ display:none; }

.dp-rg-count{
  margin-top: 12px;
  opacity: .75;
  font-size: 14px;
  text-align:center;
}

.dp-rg-empty{
  padding: 24px 18px;
  color: #fff;
  opacity: .85;
}

.dp-rg-card:link,
.dp-rg-card:visited { color: inherit; }