Luncher/client/src/components/EaterBadge.scss

// Kulatý portrét postavy vedle jména strávníka s více jídly (styl Umamusume)
.eater-badge {
  width: 30px;
  height: 30px;
  object-fit: cover;
  flex: none;
  margin-right: 6px;
  vertical-align: middle;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: 0 0 0 2px #ff6fa3;
  cursor: help;
  transition: transform 0.2s ease;

  &:hover {
    transform: scale(2);
    position: relative;
    z-index: 5;
  }
}

// Styl My Little Pony: cutie mark s emoji v kulatém odznaku
.eater-badge-mlp {
  display: inline-grid;
  place-items: center;
  font-size: 17px;
  line-height: 1;
  background: radial-gradient(circle at 35% 30%, #fff, #f6ecff);
  box-shadow: 0 0 0 2px #8e4fd1;
}

// Styl Hell Girl: emoji v černém odznaku s rudým lemem (rudá nit)
.eater-badge-hellgirl {
  display: inline-grid;
  place-items: center;
  font-size: 16px;
  line-height: 1;
  border-color: #1c1012;
  background: radial-gradient(circle at 50% 60%, #3a0d16, #12070a);
  box-shadow: 0 0 0 2px #c8102e, 0 0 6px rgb(200 16 46 / 0.5);
}

// Styl K-ON!: emoji na krémovém „trsátku" s lemem v barvě kytary Gitah (cherry sunburst)
.eater-badge-kon {
  display: inline-grid;
  place-items: center;
  font-size: 16px;
  line-height: 1;
  border-radius: 50% 50% 50% 50% / 42% 42% 58% 58%;
  background: radial-gradient(circle at 40% 35%, #fffaf0, #fbe6c8);
  box-shadow: 0 0 0 2px #d43f62, 0 2px 0 3px #27315f;
}

// Styl Bocchi the Rock!: emoji na žluté samolepce s černou linkou a růžovým stínem
.eater-badge-bocchi {
  display: inline-grid;
  place-items: center;
  font-size: 15px;
  line-height: 1;
  border-radius: 6px;
  border-color: #1d1a22;
  background: #ffe066;
  box-shadow: 2px 2px 0 #e0457b;
  transform: rotate(-4deg);

  &:hover {
    transform: rotate(0deg) scale(2);
  }
}

// Styl Evangelion: emoji v oranžovém šestiúhelníku jako AT pole
.eater-badge-evangelion {
  display: inline-grid;
  place-items: center;
  font-size: 15px;
  line-height: 1;
  border: none;
  border-radius: 0;
  clip-path: polygon(25% 3%, 75% 3%, 100% 50%, 75% 97%, 25% 97%, 0 50%);
  background: radial-gradient(circle, #ffe3c4 0 45%, #f26b00 46% 100%);
  box-shadow: none;
}

// Styl Yuru Camp△: emoji na kulaté nášivce z kempu s prošitým okrajem
.eater-badge-yurucamp {
  display: inline-grid;
  place-items: center;
  font-size: 15px;
  line-height: 1;
  border-color: #fffdf8;
  background: radial-gradient(circle at 40% 35%, #fffdf8, #f3e3c3);
  box-shadow: 0 0 0 2px #3f6b4a;
  outline: 1px dashed #3f6b4a;
  outline-offset: -5px;
}

// Styl Spy × Family: emoji na zlaté medaili Eden Academy s petrolejovým lemem
.eater-badge-spyfamily {
  display: inline-grid;
  place-items: center;
  font-size: 15px;
  line-height: 1;
  border-color: #e8cc82;
  background: radial-gradient(circle at 40% 35%, #fffcf5, #f2e2b9);
  box-shadow: 0 0 0 2px #1e6f6c;
}

// Styl Apothecary Diaries: emoji na nefritovém disku se zlatým lemem
.eater-badge-apothecary {
  display: inline-grid;
  place-items: center;
  font-size: 15px;
  line-height: 1;
  border-color: #d9b65e;
  background: radial-gradient(circle at 40% 35%, #cfe9dc, #6fae92);
  box-shadow: 0 0 0 2px #a8322a;
}

// Styl Frieren: emoji ve stříbrném kruhu se zlatým lemem a levandulovou září
.eater-badge-frieren {
  display: inline-grid;
  place-items: center;
  font-size: 15px;
  line-height: 1;
  border-color: #e9c86a;
  background: radial-gradient(circle at 40% 35%, #ffffff, #e4def6);
  box-shadow: 0 0 0 2px #8e7cc3, 0 0 8px rgb(179 163 234 / 0.7);
}

// Styl My Little Pony G5: emoji v bílém kruhu s duhovým lemem Mane 5
.eater-badge-mlpg5 {
  display: inline-grid;
  place-items: center;
  font-size: 15px;
  line-height: 1;
  border-color: transparent;
  background:
    radial-gradient(circle at 40% 35%, #fff, #ffeef6) padding-box,
    linear-gradient(135deg, #f08a3c, #ee5fa8, #9b6fe0, #2fa89c) border-box;
  box-shadow: 0 2px 6px rgb(238 95 168 / 0.45);
}

// Styl Aggretsuko: emoji v kruhovém razítku hanko
.eater-badge-aggretsuko {
  display: inline-grid;
  place-items: center;
  font-size: 15px;
  line-height: 1;
  border-color: #c8102e;
  background: radial-gradient(circle at 40% 35%, #fff, #fff4e8);
  box-shadow: 0 0 0 1px #fff, 0 0 0 3px #c8102e;
}

// Styl Sumikko Gurashi: emoji na krémovém kolečku s hnědou čárkovanou linkou
.eater-badge-sumikko {
  display: inline-grid;
  place-items: center;
  font-size: 15px;
  line-height: 1;
  border-color: #fffdf8;
  background: radial-gradient(circle at 40% 35%, #fffdf8, #f5e7d4);
  box-shadow: 0 0 0 2px #8b5e3c;
  outline: 1px dashed rgb(139 94 60 / 0.5);
  outline-offset: -5px;
}

// Styl Gudetama: emoji na bílku se žloutkovým lemem
.eater-badge-gudetama {
  display: inline-grid;
  place-items: center;
  font-size: 15px;
  line-height: 1;
  border-color: #fffdf5;
  background: radial-gradient(circle at 40% 35%, #fffdf5, #fff3c4);
  box-shadow: 0 0 0 2px #f5b301;
}

// Odznak a jméno drží na jednom řádku (úzký sloupec „Člen" na stránce objednávek)
.user-info:has(.eater-badge) {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}