/* Trenchport live recipe database additions */

.trenchport-site .recipe-card-body{
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:18px;
}

.trenchport-site .recipe-card-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}

.trenchport-site .recipe-output{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:12px 14px;
}

.trenchport-site .recipe-effect,
.trenchport-site .recipe-addiction{
  padding:12px 14px;
}

.trenchport-site .recipe-effect-heading{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:6px;
}

.trenchport-site .recipe-effect p,
.trenchport-site .recipe-addiction p{
  margin:0;
}

.trenchport-site .effect-unpack{
  border-left:3px solid #7b6fa6;
}

.trenchport-site .recipe-addiction{
  border:1px solid rgba(202,154,72,.28);
  border-left:3px solid #ca9a48;
  border-radius:5px;
  background:rgba(202,154,72,.07);
  color:#c8bda8;
}

.trenchport-site .recipe-addiction .recipe-effect-heading span{
  color:#a9a39b;
}

.trenchport-site .recipe-addiction .recipe-effect-heading strong{
  color:#e8c98f;
}

.trenchport-site .recipe-ingredients ul{
  display:grid;
  gap:7px;
  margin:0;
  padding:0;
  list-style:none;
}

.trenchport-site .recipe-ingredients li{
  padding:8px 10px;
}

.trenchport-site .recipe-tags{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}

.trenchport-site .recipe-tag{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:4px 9px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  font-size:.78rem;
  line-height:1.2;
}

.trenchport-site .station-banner-collage[hidden],
.trenchport-site .station-banner-single[hidden]{
  display:none !important;
}

@media (max-width:620px){
  .trenchport-site .recipe-card-body{
    padding:15px;
  }

  .trenchport-site .recipe-effect-heading{
    align-items:flex-start;
    flex-direction:column;
  }
}


/* Ingredient-driven recipe rarity */
.trenchport-site .recipe-card-meta-badges{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:7px;
}

.trenchport-site .rarity-badge,
.trenchport-site .ingredient-rarity{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  font-weight:900;
  letter-spacing:.055em;
  line-height:1;
  text-transform:uppercase;
}

.trenchport-site .rarity-badge{
  min-height:28px;
  padding:5px 10px;
  font-size:.72rem;
}

.trenchport-site .recipe-ingredients li{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.trenchport-site .recipe-ingredient-main{
  min-width:0;
}

.trenchport-site .ingredient-rarity{
  flex:0 0 auto;
  min-height:23px;
  padding:4px 7px;
  font-size:.62rem;
}

.trenchport-site .rarity-common{
  border-color:rgba(180,186,205,.28);
  background:rgba(180,186,205,.08);
  color:#c8ccda;
}

.trenchport-site .rarity-uncommon{
  border-color:rgba(94,208,139,.36);
  background:rgba(58,175,107,.10);
  color:#a6e8be;
}

.trenchport-site .rarity-rare{
  border-color:rgba(79,151,255,.42);
  background:rgba(49,111,224,.12);
  color:#afd0ff;
}

.trenchport-site .rarity-legendary{
  border-color:rgba(244,176,69,.52);
  background:rgba(218,132,30,.13);
  color:#ffd48b;
  box-shadow:0 0 13px rgba(218,132,30,.08);
}

@media (max-width:620px){
  .trenchport-site .recipe-card-meta{
    align-items:flex-start;
  }

  .trenchport-site .recipe-ingredients li{
    align-items:flex-start;
  }
}