@charset "UTF-8";
html {
  scroll-behavior: smooth;
}

/* Animation rétro à l'ouverture du menu sidenav */
@keyframes slideInRetro {
  0% {
    transform: translateX(-100%) scale(0.9);
    opacity: 0;
    filter: saturate(0%) hue-rotate(180deg);
  }
  50% {
    transform: translateX(10px) scale(1.05);
    filter: saturate(200%) hue-rotate(45deg);
  }
  100% {
    transform: translateX(0) scale(1);
    opacity: 1;
    filter: saturate(100%) hue-rotate(0deg);
  }
}
body {
  /* fin main */
}
body header .sidenav.animated-retro {
  animation: slideInRetro 0.5s ease-out;
}
body header .nav-wrapper {
  background: rgba(10, 10, 14, 0.35) !important;
  -webkit-backdrop-filter: blur(6px) saturate(120%);
          backdrop-filter: blur(6px) saturate(120%);
  border-bottom: 1px solid rgba(0, 255, 102, 0.35);
  box-shadow: inset 0 -8px 24px rgba(0, 255, 102, 0.06);
  position: relative;
}
body header .nav-wrapper::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: linear-gradient(90deg, #9b59b6, #00FF66);
  opacity: 0.6;
  pointer-events: none;
}
body header .nav-wrapper .container .brand-logo {
  color: #eaeaea !important;
  text-shadow: 0 0 6px rgba(0, 255, 102, 0.25);
}
body header .nav-wrapper .container ul.right.hide-on-med-and-down li a {
  color: #dcdcdc !important;
  position: relative;
  transition: color 0.2s ease, text-shadow 0.2s ease;
}
body header .nav-wrapper .container ul.right.hide-on-med-and-down li a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: 6px;
  height: 2px;
  background: linear-gradient(90deg, #9b59b6, #00FF66);
  transition: right 0.25s ease;
  opacity: 0.9;
}
body header .nav-wrapper .container ul.right.hide-on-med-and-down li a:hover {
  color: #ffffff !important;
  text-shadow: 0 0 6px rgba(0, 255, 102, 0.35);
}
body header .nav-wrapper .container ul.right.hide-on-med-and-down li a:hover::after {
  right: 0;
}
body header .nav-wrapper .container ul.right.hide-on-med-and-down li a.active {
  color: #ffffff !important;
  text-shadow: 0 0 8px rgba(0, 255, 102, 0.45);
}
body header .nav-wrapper .container ul.right.hide-on-med-and-down li a.active::after {
  right: 0;
}
body header .nav-wrapper .container .sidenav-trigger .material-icons {
  color: #e6e6e6;
  transition: transform 0.2s ease, text-shadow 0.2s ease;
}
body header .nav-wrapper .container .sidenav-trigger:hover .material-icons {
  transform: scale(1.05);
  text-shadow: 0 0 10px rgba(0, 255, 102, 0.45);
}
body header .sidenav {
  background: rgba(12, 12, 17, 0.96);
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
  border-right: 1px solid rgba(155, 89, 182, 0.35);
}
body header .sidenav li > a {
  color: #e6e6e6;
  transition: background 0.2s ease, color 0.2s ease;
}
body header .sidenav li > a:hover {
  background: rgba(155, 89, 182, 0.12);
  color: #ffffff;
}
body header .sidenav li > a.active {
  background: rgba(0, 255, 102, 0.12);
  color: #ffffff;
}
body header .sidenav .divider {
  background-color: rgba(255, 255, 255, 0.08);
}
body .auth-container {
  max-width: 400px;
  margin: 3rem auto;
  padding: 2rem;
  border-radius: 12px;
  font-family: "Press Start 2P", monospace;
}
body .auth-container h2 {
  text-align: center;
  margin-bottom: 2rem;
  font-size: 1.2rem;
}
body .auth-container form {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
body .auth-container form input[type=text],
body .auth-container form input[type=email],
body .auth-container form input[type=password] {
  align-self: center;
  padding: 0.75rem 1rem;
  font-family: "Press Start 2P", monospace;
  font-size: 0.9rem;
  border-radius: 6px;
  outline-offset: 2px;
  transition: border-color 0.3s ease;
}
body .auth-container form button {
  font-size: 1rem;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
}
body .auth-container form .checkbox-container {
  font-size: 0.8rem;
  color: #00cc88;
  cursor: pointer;
}
body .auth-container form .checkbox-container input[type=checkbox] {
  width: 18px;
  height: 18px;
  cursor: pointer;
  opacity: 1;
  position: relative;
}
body .auth-container form .checkbox-container a {
  text-decoration: underline;
  font-weight: normal;
}
body .auth-container .field-error {
  color: #ff4444;
  font-size: 0.85rem;
  margin-top: 0.25rem;
  font-weight: bold;
}
body .auth-container .error-message {
  /* Purement skin, NEON garde ses propres teintes — OK de garder */
  background: #330000;
  color: #ff4444;
  padding: 1rem;
  border-radius: 8px;
  font-size: 0.9rem;
  margin-bottom: 1.5rem;
  text-align: left;
  box-shadow: 0 0 10px #ff4444;
}
body .auth-container .error-message ul {
  margin: 0;
  padding-left: 1.2rem;
}
body .auth-container .error-message li {
  margin-bottom: 0.3rem;
}
body .auth-container p {
  text-align: center;
  margin-top: 1rem;
  font-size: 0.85rem;
}
body .auth-container p a {
  text-decoration: none;
  font-weight: bold;
  transition: color 0.3s ease;
}
body main {
  /* =========================
  Fiche cocktail – wrapper 
  ========================= */
}
body main h2 {
  text-align: center;
  font-size: 3rem;
  font-family: "Press Start 2P", monospace;
}
body main h4 {
  font-family: "Press Start 2P", monospace;
  margin: 2rem;
}
body main h3 {
  font-family: "Press Start 2P", monospace;
  margin: 2rem;
}
body main h6 {
  font-family: "Press Start 2P", monospace;
  margin: 2rem;
}
body main .cocktail-card {
  position: relative;
}
body main .cocktail-card .fav-btn {
  position: absolute;
  right: 0.5rem;
  top: 0.5rem;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  line-height: 0;
  font-size: 0;
  background: rgba(0, 0, 0, 0.55);
  color: #fff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
  transition: transform 0.15s ease;
  z-index: 2;
}
body main .cocktail-card .fav-btn:hover {
  transform: scale(1.06);
}
body main .cocktail-card .fav-btn i.material-icons {
  width: 100%;
  height: 100%;
  color: #df1c3e;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  line-height: 1;
  margin: 0;
  padding: 0;
}
body main .profile-erase-btn {
  position: fixed;
  top: 90px;
  right: 24px;
  z-index: 1000;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}
body main .profile-erase-btn:hover {
  transform: scale(1.05);
}
body main .hero-barcraft {
  max-width: 900px;
  margin: 2rem auto 1rem;
  text-align: center;
}
body main .hero-barcraft h5 {
  line-height: 1.5;
  margin-bottom: 1.5rem;
  font-size: medium;
}
body main .hero-barcraft a h5 {
  line-height: 1.5;
  margin-bottom: 1.5rem;
  font-size: medium;
}
body main .hero-barcraft a :hover {
  color: #00ff66;
  font-size: xx-large;
}
body main .hero-barcraft .hero-subtitle {
  font-weight: 600;
  font-size: 1rem;
  margin-bottom: 0.5rem;
  opacity: 0.95;
  color: white;
}
body main .hero-barcraft .hero-tagline {
  color: white;
  font-size: 0.95rem;
  opacity: 0.8;
}
body main .cocktailDetail {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  padding: 2rem;
}
body main .cocktailDetail .cocktail-header .cocktail-image {
  width: 60%;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
  overflow: hidden;
}
body main .cocktailDetail .cocktail-info {
  font-family: "Press Start 2P", monospace;
}
body main .cocktailDetail .cocktail-info p {
  font-size: 1.2rem;
  line-height: 2rem;
}
body main .cocktailDetail .cocktail-info span {
  display: flex;
  margin: 0.5rem 0;
  align-items: flex-end;
}
body main .cocktailDetail .cocktail-info span strong {
  display: flex;
  width: 12rem;
  margin-right: 1rem;
  justify-content: flex-start;
}
body main .cocktailDetail .cocktail-info span i {
  margin-right: 0.5rem;
}
body main .cocktail-page .cocktail-panel {
  border-radius: 16px;
  padding: 1.5rem 1rem 2rem;
}
body main .podium {
  margin: 0 auto;
  margin-bottom: 3rem;
  display: flex;
  justify-content: center;
  gap: 24px;
  flex-wrap: wrap;
}
body main .podium .podium-place {
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  font-family: "Press Start 2P", monospace;
  width: 200px;
}
body main .podium .podium-place:hover {
  transform: scale(1.05);
}
body main .podium .podium-place a {
  color: #fff;
  text-decoration: none;
  display: block;
}
body main .podium .podium-place a img {
  width: 100%;
  height: 160px;
  -o-object-fit: cover;
     object-fit: cover;
  border-bottom: 2px solid #555;
  border-radius: 0;
}
body main .podium .podium-place a .info {
  padding: 1rem;
}
body main .podium .podium-place a .info h3 {
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  font-size: 0.9rem;
  margin: 1rem auto;
  color: #000000;
  text-shadow: 1px 0px 11px #000000;
}
body main .podium .podium-place a .info p {
  font-size: 0.75rem;
  color: #000000;
  width: -moz-fit-content;
  width: fit-content;
  margin: 1rem auto;
}
body main .podium .podium-place a .info .progress-bar-container {
  width: 100%;
  background: #eee;
  height: 10px;
  border-radius: 4px;
  overflow: hidden;
  margin-top: 5px;
}
body main .podium .podium-place a .info .progress-bar {
  height: 100%;
  border-radius: 4px;
}
body main .podium .podium-place .medal {
  font-size: 2rem;
  position: absolute;
  top: 10px;
  right: 10px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
body main .podium .podium-place.place-1 {
  background: gold;
  box-shadow: 0 0 15px #000;
}
body main .podium .podium-place.place-1 a {
  background: transparent;
}
body main .podium .podium-place.place-1 .medal-text {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  font-size: 12px;
  padding: 5px;
}
body main .podium .podium-place.place-2 {
  background: silver;
  box-shadow: 0 0 15px #000;
}
body main .podium .podium-place.place-2 a {
  background: transparent;
}
body main .podium .podium-place.place-2 .medal-text {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  font-size: 12px;
  padding: 5px;
}
body main .podium .podium-place.place-3 {
  background: #cd7f32;
  box-shadow: 0 0 15px #000;
}
body main .podium .podium-place.place-3 a {
  background: transparent;
}
body main .podium .podium-place.place-3 .medal-text {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  font-size: 12px;
  padding: 5px;
}
body main .classement-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 50px;
  padding: 2rem;
}
body main .classement-list .cocktail-card {
  margin: 0 auto;
  width: 210px;
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  font-family: "Press Start 2P", monospace;
}
body main .classement-list .cocktail-card:hover {
  transform: scale(1.05);
}
body main .classement-list .cocktail-card img {
  width: 100%;
  height: 140px;
  -o-object-fit: cover;
     object-fit: cover;
  border-bottom: 2px solid #555;
  border-radius: 0;
}
body main .classement-list .cocktail-card .info {
  display: flex;
  padding: 1rem;
  height: 10rem;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
body main .classement-list .cocktail-card .info h3 {
  text-align: center;
  font-size: 0.9rem;
  margin: 0 0 0.5rem 0;
}
body main .classement-list .cocktail-card .info p {
  font-size: 0.75rem;
  margin: 0;
}
body main .classement-list .cocktail-card .info .progress-bar-container {
  width: 100%;
  background: #eee;
  height: 10px;
  border-radius: 4px;
  overflow: hidden;
  margin-top: 5px;
}
body main .classement-list .cocktail-card .info .progress-bar {
  height: 100%;
  border-radius: 4px;
}
body main .see-more-container {
  text-align: right;
  margin-top: 20px;
  padding-right: 10px;
}
body main .see-more-container .see-more-link {
  display: inline-block;
  font-weight: 700;
  color: #e6e6e6;
  font-size: 1.1rem;
  transition: all 0.3s ease;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
body main .see-more-container .see-more-link:hover {
  text-shadow: 0 0 8px #df1c3e;
}
body main .cocktail-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 50px;
  padding: 2rem;
}
body main .cocktail-list .cocktail-card {
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  font-family: "Press Start 2P", monospace;
}
body main .cocktail-list .cocktail-card:hover {
  transform: scale(1.05);
}
body main .cocktail-list .cocktail-card a img {
  width: 100%;
  height: 160px;
  -o-object-fit: cover;
     object-fit: cover;
  border-bottom: 2px solid #555;
}
body main .cocktail-list .cocktail-card a .info {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}
body main .cocktail-list .cocktail-card a .info .difficulty-bar {
  width: 100%;
  height: 10px;
  background: #e0e0e0;
  border-radius: 5px;
  overflow: hidden;
  margin: 6px 0;
}
body main .cocktail-list .cocktail-card a .info .progress-bar {
  height: 100%;
  transition: width 0.3s ease-in-out;
}
body main .cocktail-list .cocktail-card a .info .diff-label {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  font-size: 12px;
}
body main .cocktail-list .cocktail-card a .info h3 {
  width: 235.5px;
  height: 30px;
  font-size: 0.9rem;
  margin: 1rem auto;
  width: -moz-fit-content;
  width: fit-content;
  text-align: center;
}
body main .cocktail-list .cocktail-card a .info p {
  font-size: 0.75rem;
}
body main .cocktail-preparation {
  font-family: "Press Start 2P", monospace;
}
body main .cocktail-preparation .collection {
  display: contents;
}
body main .cocktail-preparation .collection .collection-item {
  display: flex;
  padding: 0.5rem 1rem;
  border: solid 1px;
  border-radius: 8px;
  margin: 1.5rem;
  line-height: 2;
}
body main .cocktail-ingredients {
  font-family: "Press Start 2P", monospace;
}
body main .cocktail-ingredients .collection {
  display: contents;
}
body main .cocktail-ingredients .collection .collection-item {
  display: flex;
  padding: 0.5rem 1rem;
  border: solid 1px;
  border-radius: 8px;
  margin: 1.5rem;
  line-height: 2;
}
body main .cocktail-votes {
  justify-items: center;
  font-family: "Press Start 2P", monospace;
  margin: 2rem;
}
body main .cocktail-votes .vote-form {
  display: flex;
  justify-content: center;
  gap: 1rem;
}
body main .cocktail-votes .vote-form button {
  display: flex;
  align-items: center;
  margin: 0 0.5rem;
  font-family: "Press Start 2P", monospace;
}
body main .cocktail-votes span a {
  background: linear-gradient(90deg, #9b59b6, #00FF66);
  color: #0b0b0b;
  border: 0;
  border-radius: 8px;
  height: -moz-fit-content;
  height: fit-content;
}
body main .cocktail-votes span a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: linear-gradient(90deg, #9b59b6, #00FF66);
  opacity: 0.6;
  pointer-events: none;
}
body main form {
  margin: 0 auto;
}
body main form textarea {
  resize: vertical;
  min-height: 80px;
}
body main form .ingredient {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}
body main form .ingredient select {
  flex: 1 1 60%;
}
body main form .ingredient input[type=text] {
  flex: 1 1 35%;
}
body main form button[type=button],
body main form button[type=submit] {
  align-self: flex-start;
  border: none;
  padding: 0.75rem 1.5rem;
  font-size: 1rem;
  border-radius: 5px;
  cursor: pointer;
  transition: background 0.2s ease;
}
body main .stats {
  font-family: "Press Start 2P", monospace;
}
body main .stats .stats_title {
  width: -moz-fit-content;
  width: fit-content;
  font-size: 12px;
  place-self: flex-end;
  margin: 1rem 0 5rem 0;
}
body main .stats .ingredient-chiffres {
  color: white;
}
body main .stats section .cocktail-list-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 70px;
  padding: 2rem;
}
body main .stats section .cocktail-shaker-stars {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 80px;
  padding: 2rem;
}
body main .stats section .cocktail-card {
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
body main .stats section .cocktail-card a {
  color: #fff;
  text-decoration: none;
  display: block;
}
body main .stats section .cocktail-card a img {
  width: 100%;
  height: 160px;
  -o-object-fit: cover;
     object-fit: cover;
}
body main .stats section .cocktail-card a p {
  width: -moz-fit-content;
  width: fit-content;
  margin: 1rem auto;
}
body main .stats section .cocktail-card a .difficulty-bar {
  width: 100%;
  height: 10px;
  background: #e0e0e0;
  border-radius: 5px;
  overflow: hidden;
  margin: 6px 0;
}
body main .stats section .cocktail-card a .difficulty-bar .progress-bar {
  height: 100%;
  transition: width 0.3s ease-in-out;
}
body main .stats section .cocktail-card a .diff-label {
  font-size: 12px;
  width: -moz-fit-content;
  width: fit-content;
  margin: 1rem auto;
}
body main .modif_cocktail {
  font-family: "Press Start 2P", monospace;
}
body main .modif_cocktail .card-panel {
  padding: 1.5rem;
  margin-bottom: 2rem;
  border-radius: 10px;
}
body main .modif_cocktail .card-panel #description_page_modifier {
  font-family: "Press Start 2P", monospace;
}
body main .modif_cocktail .card-panel input {
  font-family: "Press Start 2P", monospace;
}
body main .modif_cocktail h2 {
  font-size: 3rem;
  font-family: "Press Start 2P", monospace;
}
body main .modif_cocktail .lettre-separatrice {
  font-weight: 700;
  font-size: 1.4rem;
  margin: 1.5rem 0 0.5rem;
  padding: 0.4rem 1rem;
  border-radius: 6px;
}
body main .modif_cocktail .ingredients-modif-list {
  display: flex;
  flex-wrap: wrap;
}
body main .modif_cocktail .ingredients-modif-list p {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 2rem;
  border-radius: 1rem;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
}
body main .modif_cocktail .ingredients-modif-list p .quantite-input {
  font-family: "Press Start 2P", monospace;
}
body #scrollTopBtn {
  position: fixed;
  bottom: 25px;
  right: 25px;
  font-size: 26px;
  padding: 14px 18px;
  border-radius: 6px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.25s ease-in-out;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  z-index: 1100;
  font-family: "Press Start 2P", monospace;
}
body footer {
  text-align: center;
  padding: 1rem;
  font-size: 0.9rem;
  color: #888;
  font-family: "Press Start 2P", monospace;
}

.theme-neon .cocktail-card .difficulty-bar .progress-bar {
  background: linear-gradient(90deg, #9b59b6, #00FF66);
}

.theme-neon {
  background: radial-gradient(1200px 600px at 20% 0%, rgba(155, 89, 182, 0.12), transparent 60%), radial-gradient(800px 400px at 100% 80%, rgba(0, 255, 102, 0.1), transparent 70%), #0a0a0e !important;
  min-height: 100vh;
  position: relative;
  isolation: isolate;
  /* =========================
  Profil — styles scoped (cascade safe)
  ========================= */
  /* Tabs Materialize — teinte néon */
  /* Cartes profil (créations + likes) */
  /* Titre + badge score */
  /* Statut */
  /* Barre de difficulté (dégradé néon) */
  /* Actions liens (cohérence nav) */
  /* Empty states (CTA) */
  /* Petites retouches responsive */
}
.theme-neon::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background: linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
  background-size: 30px 30px, 30px 30px;
}
.theme-neon main h2,
.theme-neon main h3,
.theme-neon main h4,
.theme-neon main h6 {
  color: #00FF66;
  text-shadow: 0 0 16px rgba(155, 89, 182, 0.7);
  font-size: large;
}
.theme-neon main h5 {
  color: #8671AB;
  text-shadow: 0 0 16px rgba(0, 255, 102, 0.35);
}
.theme-neon header .nav-wrapper {
  background: linear-gradient(145deg, #1a1a1a, #111) !important;
}
.theme-neon .card-panel {
  background: rgba(12, 12, 17, 0.7019607843);
  border: 1px solid rgba(0, 255, 102, 0.6);
  box-shadow: 0 0 0 1px rgba(0, 255, 102, 0.15), 0 0 20px rgba(0, 255, 102, 0.25);
  border-radius: 14px;
  -webkit-backdrop-filter: blur(3px);
          backdrop-filter: blur(3px);
  color: #e6e6e6;
}
.theme-neon .auth-container {
  background: rgba(12, 12, 17, 0.7);
  color: #e6e6e6;
  box-shadow: 0 0 20px rgba(0, 255, 102, 0.25);
  border: 1px solid rgba(0, 255, 102, 0.45);
}
.theme-neon .auth-container h2 {
  color: #00FF66;
  text-shadow: 0 0 8px rgba(0, 255, 102, 0.5);
}
.theme-neon .auth-container input[type=text],
.theme-neon .auth-container input[type=email],
.theme-neon .auth-container input[type=password] {
  color: #e6e6e6;
  background: transparent;
  border: none;
  border-bottom: 2px solid rgba(155, 89, 182, 0.7);
}
.theme-neon .auth-container input[type=text]:focus,
.theme-neon .auth-container input[type=email]:focus,
.theme-neon .auth-container input[type=password]:focus {
  border-bottom-color: #00FF66;
  background: transparent;
  box-shadow: 0 2px 0 0 #00FF66;
}
.theme-neon .auth-container input[type=text]::-moz-placeholder, .theme-neon .auth-container input[type=email]::-moz-placeholder, .theme-neon .auth-container input[type=password]::-moz-placeholder {
  color: #8bcfb0;
}
.theme-neon .auth-container input[type=text]::placeholder,
.theme-neon .auth-container input[type=email]::placeholder,
.theme-neon .auth-container input[type=password]::placeholder {
  color: #8bcfb0;
}
.theme-neon .auth-container button {
  background: linear-gradient(90deg, #9b59b6, #00FF66);
  color: #0b0b0b;
  box-shadow: 0 0 16px rgba(0, 255, 102, 0.35);
}
.theme-neon .auth-container button:hover {
  filter: brightness(1.1);
  box-shadow: 0 0 20px rgba(0, 255, 102, 0.45);
}
.theme-neon form input[type=text],
.theme-neon form input[type=file],
.theme-neon form textarea,
.theme-neon form select {
  color: #e6e6e6;
  background: transparent;
  border: none;
  border-bottom: 2px solid rgba(155, 89, 182, 0.7);
}
.theme-neon form input[type=text]:focus,
.theme-neon form input[type=file]:focus,
.theme-neon form textarea:focus,
.theme-neon form select:focus {
  border-bottom-color: #00FF66;
  box-shadow: 0 2px 0 0 #00FF66;
}
.theme-neon form .select-wrapper input.select-dropdown {
  color: #e6e6e6;
  background: transparent;
  border-bottom: 2px solid rgba(155, 89, 182, 0.7);
}
.theme-neon form .select-wrapper input.select-dropdown:focus {
  border-bottom-color: #00FF66;
  box-shadow: 0 2px 0 0 #00FF66;
}
.theme-neon form button[type=button],
.theme-neon form button[type=submit] {
  background: linear-gradient(90deg, #9b59b6, #00FF66);
  color: #0b0b0b;
  border: 0;
  height: -moz-fit-content;
  height: fit-content;
  font-family: "Press Start 2P", monospace;
}
.theme-neon form button[type=button]:hover,
.theme-neon form button[type=submit]:hover {
  filter: brightness(1.1);
  box-shadow: 0 0 16px rgba(0, 255, 102, 0.4);
}
.theme-neon ul.dropdown-content {
  background: #12121a;
  border: 1px solid rgba(155, 89, 182, 0.5);
}
.theme-neon ul.dropdown-content li > a,
.theme-neon ul.dropdown-content li > span {
  color: #e6e6e6;
}
.theme-neon ul.dropdown-content li:hover {
  background: rgba(155, 89, 182, 0.18);
}
.theme-neon ul.dropdown-content li.selected {
  background: rgba(0, 255, 102, 0.2);
}
.theme-neon main .cocktailDetail .cocktail-header .cocktail-image {
  background: linear-gradient(145deg, #1a1a1a, #111);
}
.theme-neon main .cocktailDetail .cocktail-info span i {
  color: #00FF66;
}
.theme-neon main .classement-list .cocktail-card,
.theme-neon main .cocktail-list .cocktail-card,
.theme-neon main .stats section .cocktail-card,
.theme-neon main #resultats .card.resultat-recherche {
  background: linear-gradient(145deg, #1c1c1c, #121212);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
}
.theme-neon main .classement-list .cocktail-card:hover,
.theme-neon main .cocktail-list .cocktail-card:hover,
.theme-neon main .stats section .cocktail-card:hover,
.theme-neon main #resultats .card.resultat-recherche:hover {
  box-shadow: 0 12px 25px rgba(0, 255, 150, 0.35), 0 0 20px rgba(0, 255, 102, 0.25);
}
.theme-neon main .classement-list .cocktail-card a .info .difficulty-bar,
.theme-neon main .cocktail-list .cocktail-card a .info .difficulty-bar,
.theme-neon main .stats section .cocktail-card a .info .difficulty-bar,
.theme-neon main #resultats .card.resultat-recherche a .info .difficulty-bar {
  background: #1f1f1f;
}
.theme-neon main .classement-list .cocktail-card a .info .progress-bar,
.theme-neon main .cocktail-list .cocktail-card a .info .progress-bar,
.theme-neon main .stats section .cocktail-card a .info .progress-bar,
.theme-neon main #resultats .card.resultat-recherche a .info .progress-bar {
  background: linear-gradient(90deg, #00FF66, #9b59b6);
}
.theme-neon main .classement-list .cocktail-card a .info h3,
.theme-neon main .cocktail-list .cocktail-card a .info h3,
.theme-neon main .stats section .cocktail-card a .info h3,
.theme-neon main #resultats .card.resultat-recherche a .info h3 {
  color: #e6e6e6;
  text-shadow: 0 0 6px rgba(0, 255, 102, 0.35);
}
.theme-neon main .classement-list .cocktail-card a .info p,
.theme-neon main .cocktail-list .cocktail-card a .info p,
.theme-neon main .stats section .cocktail-card a .info p,
.theme-neon main #resultats .card.resultat-recherche a .info p {
  color: #cfcfcf;
}
.theme-neon main .classement-list .cocktail-card a .info .diff-label,
.theme-neon main .cocktail-list .cocktail-card a .info .diff-label,
.theme-neon main .stats section .cocktail-card a .info .diff-label,
.theme-neon main #resultats .card.resultat-recherche a .info .diff-label {
  color: #9aa4a6;
}
.theme-neon .cocktail-preparation .collection .collection-item,
.theme-neon .cocktail-ingredients .collection .collection-item {
  background: rgba(105, 105, 105, 0.55);
}
.theme-neon .cocktail-preparation .collection .collection-item:hover,
.theme-neon .cocktail-ingredients .collection .collection-item:hover {
  background: rgba(0, 255, 102, 0.25);
}
.theme-neon body.theme-neon main .cocktail-page .cocktail-preparation .collection .collection-item,
.theme-neon body.theme-neon main .cocktail-page .cocktail-ingredients .collection .collection-item {
  background: rgba(255, 255, 255, 0.06);
}
.theme-neon .modif_cocktail .card-panel {
  background: rgba(12, 12, 17, 0.7);
  border: 1px solid rgba(0, 255, 102, 0.6);
  box-shadow: 0 0 18px rgba(0, 255, 102, 0.2);
  color: #e6e6e6;
}
.theme-neon .modif_cocktail .card-panel #description_page_modifier,
.theme-neon .modif_cocktail .card-panel input {
  color: #e0e0e0;
  background: transparent;
  border: none;
  border-bottom: 2px solid rgba(155, 89, 182, 0.7);
}
.theme-neon .modif_cocktail .card-panel #description_page_modifier:focus,
.theme-neon .modif_cocktail .card-panel input:focus {
  border-bottom-color: #00FF66;
  box-shadow: 0 2px 0 0 #00FF66;
}
.theme-neon .modif_cocktail h2 {
  text-shadow: 0 0 18px rgba(155, 89, 182, 0.4);
}
.theme-neon .modif_cocktail .lettre-separatrice {
  background: #121212;
  border-left: 4px solid #00FF66;
  border-bottom: 2px solid #9b59b6;
  color: #e6e6e6;
}
.theme-neon .modif_cocktail .ingredients-modif-list p {
  background: #121212;
  border: 1px solid rgba(155, 89, 182, 0.5);
  box-shadow: 0 0 14px rgba(155, 89, 182, 0.2);
}
.theme-neon .modif_cocktail .ingredients-modif-list p .quantite-input {
  color: #e0e0e0;
  background: transparent;
  border: none;
  border-bottom: 2px solid rgba(155, 89, 182, 0.7);
}
.theme-neon .modif_cocktail .ingredients-modif-list p .quantite-input:focus {
  border-bottom-color: #00FF66;
  box-shadow: 0 2px 0 0 #00FF66;
}
.theme-neon .profile-page .profile-hero {
  margin: 24px 0 10px;
  padding: 22px;
  border-radius: 16px;
  background: radial-gradient(120% 120% at 0% 0%, rgba(155, 89, 182, 0.18), rgba(0, 0, 0, 0.35) 55%), linear-gradient(135deg, rgba(0, 255, 102, 0.12), rgba(155, 89, 182, 0.08));
  border: 1px solid rgba(0, 255, 102, 0.35);
  box-shadow: 0 0 18px rgba(0, 255, 102, 0.18), inset 0 0 24px rgba(155, 89, 182, 0.12);
  text-align: center;
}
.theme-neon .profile-page .profile-hero h3 {
  font-family: "Press Start 2P", monospace;
  margin: 0 0 12px;
  color: #00FF66;
  text-shadow: 0 0 16px rgba(155, 89, 182, 0.7);
}
.theme-neon .profile-page .stats-pills {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
}
.theme-neon .profile-page .pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  font-weight: 600;
  background: rgba(0, 255, 102, 0.1);
  border: 1px solid rgba(0, 255, 102, 0.35);
  color: #e6e6e6;
}
.theme-neon .profile-page .tabs .tab a {
  color: #00FF66;
  font-weight: bold;
}
.theme-neon .profile-page .tabs .tab a.active {
  color: #ff7ad6;
}
.theme-neon .tabs {
  border-radius: 10px;
  background-color: #9b59b6;
}
.theme-neon .profile-page .tabs .indicator {
  background: linear-gradient(90deg, #9b59b6, #00FF66);
  height: 3px;
}
.theme-neon .profile-page .neo-card.card {
  border-radius: 18px;
  overflow: hidden;
  background: linear-gradient(145deg, #1c1c1c, #121212);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 0 0 1px rgba(0, 255, 102, 0.18), 0 10px 30px rgba(0, 0, 0, 0.5), inset 0 0 30px rgba(155, 89, 182, 0.1);
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}
.theme-neon .profile-page .neo-card.card:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 0 1px rgba(0, 255, 102, 0.32), 0 16px 36px rgba(0, 0, 0, 0.55), 0 0 20px rgba(0, 255, 102, 0.25);
}
.theme-neon .profile-page .neo-card .card-image img {
  aspect-ratio: 16/10;
  -o-object-fit: cover;
     object-fit: cover;
  filter: saturate(1.05) contrast(1.02);
}
.theme-neon .profile-page .neo-card .card-title {
  font-weight: 700;
  color: #e6e6e6;
}
.theme-neon .profile-page .score-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border-radius: 8px;
  font-weight: 700;
  background: rgba(0, 255, 102, 0.1);
  border: 1px solid rgba(0, 255, 102, 0.35);
  color: #e6e6e6;
}
.theme-neon .profile-page .status-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 0.85rem;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.18);
}
.theme-neon .profile-page .status--valide {
  color: #00e676;
  border-color: rgba(0, 230, 118, 0.5);
  background: rgba(0, 230, 118, 0.1);
}
.theme-neon .profile-page .status--en_attente {
  color: #fff176;
  border-color: rgba(255, 241, 118, 0.5);
  background: rgba(255, 241, 118, 0.1);
}
.theme-neon .profile-page .status--refuse {
  color: #ff5252;
  border-color: rgba(255, 82, 82, 0.5);
  background: rgba(255, 82, 82, 0.1);
}
.theme-neon .profile-page .diff-wrap {
  margin-top: 8px;
}
.theme-neon .profile-page .diff-label {
  font-size: 0.85rem;
  opacity: 0.9;
  margin-bottom: 6px;
  color: #cfcfcf;
}
.theme-neon .profile-page .diff-bar {
  width: 100%;
  height: 8px;
  border-radius: 999px;
  overflow: hidden;
  background: #1f1f1f;
  border: 1px solid rgba(255, 255, 255, 0.18);
}
.theme-neon .profile-page .diff-bar > span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #9b59b6, #00FF66);
  width: 0%;
}
.theme-neon .profile-page .neo-card .card-action a {
  color: #00FF66;
  font-weight: 700;
  position: relative;
  padding-left: 0.2rem;
}
.theme-neon .profile-page .neo-card .card-action a:hover {
  color: #ffffff;
  text-shadow: 0 0 6px rgba(0, 255, 102, 0.35);
}
.theme-neon .profile-page .neo-card .card-action a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: -2px;
  height: 2px;
  background: linear-gradient(90deg, #9b59b6, #00FF66);
  transition: right 0.25s ease;
  opacity: 0.9;
}
.theme-neon .profile-page .neo-card .card-action a:hover::after {
  right: 0;
}
.theme-neon .profile-page .empty {
  text-align: center;
  padding: 26px;
  margin: 12px 0;
  border-radius: 16px;
  border: 1px dashed rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.03);
  color: #cfcfcf;
}
.theme-neon .profile-page .empty .btn {
  margin-top: 10px;
  background: linear-gradient(90deg, #9b59b6, #00FF66);
  color: #0b0b0b;
  border: 0;
  font-family: "Press Start 2P", monospace;
  box-shadow: 0 0 16px rgba(0, 255, 102, 0.35);
}
.theme-neon .profile-page .empty .btn:hover {
  filter: brightness(1.1);
  box-shadow: 0 0 20px rgba(0, 255, 102, 0.45);
}
@media (max-width: 600px) {
  .theme-neon .theme-neon .profile-page .neo-card .card-action {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }
  .theme-neon .theme-neon .profile-page .profile-hero {
    padding: 18px;
  }
}
.theme-neon .select-wrapper {
  position: relative;
}
.theme-neon .select-wrapper > ul.dropdown-content.select-dropdown {
  position: absolute;
}
.theme-neon .select-wrapper:focus-within > ul.dropdown-content.select-dropdown {
  position: relative !important;
  left: 0 !important;
  top: 0 !important;
  transform: none !important;
  width: 100%;
  box-shadow: none;
  max-height: none;
  z-index: auto;
}
.theme-neon #image-preview img,
.theme-neon .img-preview {
  border-radius: 12px;
  box-shadow: 0 0 24px rgba(155, 89, 182, 0.3), 0 0 8px rgba(0, 255, 102, 0.3);
}
.theme-neon .ingredient-row.validated {
  background: linear-gradient(180deg, rgba(0, 255, 102, 0.12), transparent);
  border-left: 3px solid #00FF66;
}
.theme-neon .ingredient-row.validated select,
.theme-neon .ingredient-row.validated input {
  pointer-events: none;
  opacity: 0.7;
}
.theme-neon #scrollTopBtn {
  background: linear-gradient(135deg, #0f2a12, #0a3d0a);
  color: #9bffbf;
  border: 2px solid #00FF66;
  box-shadow: 0 0 10px rgba(0, 255, 102, 0.35);
}
.theme-neon #scrollTopBtn:hover {
  color: #0a3d0a;
  background: #00FF66;
  box-shadow: 0 0 18px rgba(0, 255, 102, 0.55);
}
.theme-neon .status-valide {
  background-color: rgba(0, 255, 102, 0.15);
  color: #00e06a;
}
.theme-neon .status-refuse {
  background-color: rgba(255, 68, 68, 0.12);
  color: #ff6b6b;
}
.theme-neon .status-attente {
  background-color: rgba(255, 160, 0, 0.12);
  color: #ffb74d;
}
.theme-neon .diff-facile {
  background-color: rgba(0, 255, 102, 0.12);
  color: #00e06a;
}
.theme-neon .diff-moyen {
  background-color: rgba(255, 193, 7, 0.12);
  color: #ffb74d;
}
.theme-neon .diff-difficile {
  background-color: rgba(255, 82, 82, 0.12);
  color: #ff5252;
}
.theme-neon .retro-form {
  background: rgba(20, 20, 30, 0.8);
  border-radius: 12px;
  padding: 2rem;
  box-shadow: 0 0 10px var(--retro-purple);
}
.theme-neon .retro-form .smiley-scale {
  display: flex;
  justify-content: space-between;
  margin-top: -0.5rem;
  font-size: 1.2rem;
  color: var(--retro-green);
}
.theme-neon .section-title {
  margin: 1.2rem 0 0.6rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  opacity: 0.9;
}
.theme-neon .retro-btn {
  background: linear-gradient(45deg, var(--retro-purple), var(--retro-green));
  border-radius: 10px;
  font-weight: 700;
  box-shadow: 0 0 12px var(--retro-purple);
  transition: transform 0.2s;
}
.theme-neon .retro-btn:hover {
  transform: scale(1.05);
  box-shadow: 0 0 18px var(--retro-green);
}

:root {
  --retro-green: #00FF66;
  --retro-purple: #9b59b6;
}

body.compact .cocktail-card {
  padding: 0.6rem !important;
}

body.compact .cocktail-card .info {
  padding: 0.75rem !important;
}

body.compact .cocktail-card h3,
body.compact .cocktail-card h5 {
  font-size: 1rem !important;
  margin: 0.4rem 0 !important;
}

body.compact .cocktail-card p,
body.compact .cocktail-card .diff-label,
body.compact .cocktail-card .meta {
  font-size: 0.85rem !important;
}

body,
main p,
main span,
main li,
main label,
main input,
main textarea,
main select,
.collection .collection-item,
.cocktail-info p,
.cocktail-preparation li,
.cocktail-ingredients li {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.6;
  letter-spacing: 0.3px;
}

/* On garde Press Start 2P pour les titres / logo */
main h1,
main h2,
main h3,
main h4,
main h5,
main h6,
nav .brand-logo,
.chip,
.btn {
  font-family: "Press Start 2P", monospace !important;
}

/* === GLOBAL : thumbnails cocktails (force cohérence partout) === */
.cocktail-card img {
  width: 100% !important;
  height: 160px !important;
  /* base desktop */
  -o-object-fit: cover !important;
     object-fit: cover !important;
  -o-object-position: center !important;
     object-position: center !important;
  display: block !important;
}

.btn-back {
  position: fixed;
  left: 16px;
  top: 95px;
  z-index: 999;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.55);
  border: 1px solid rgba(0, 255, 150, 0.35);
  color: #fff;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.45), 0 0 14px rgba(0, 255, 150, 0.25);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform 0.12s ease, filter 0.12s ease, box-shadow 0.12s ease;
}

.btn-back:hover {
  transform: translateY(-2px);
  filter: brightness(1.1);
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.55), 0 0 22px rgba(0, 255, 150, 0.45);
}

.btn-back:active {
  transform: translateY(0);
}

/* =========================================
   AJOUT COCKTAIL – REFONTE (scopé)
   ========================================= */
.theme-neon #form-ajout-cocktail {
  /* on “compacte” */
  --panel-pad: 14px;
  --panel-gap: 12px;
  /* inputs plus propres (sans casser Materialize) */
  /* mini rows (ingrédients / étapes) */
  /* ✅ FIX : bouton remove nouvel ingrédient qui dépasse */
  /* zone actions boutons => plus “arcade toolbar” */
  /* boutons icônes (check/close) plus petits */
  /* preview image plus “carte” */
  /* Ligne 1 : input nom pleine largeur */
  /* Ligne 2 : type / quantité / bouton */
}
.theme-neon #form-ajout-cocktail .card-panel {
  padding: var(--panel-pad);
  border-radius: 16px;
  background: rgba(12, 12, 17, 0.72);
  border: 1px solid rgba(0, 255, 102, 0.35);
  box-shadow: 0 0 0 1px rgba(0, 255, 102, 0.12), 0 10px 28px rgba(0, 0, 0, 0.45);
}
.theme-neon #form-ajout-cocktail h5 {
  margin: 0 0 10px 0;
  font-size: 1rem;
  color: #00FF66;
  text-shadow: 0 0 12px rgba(155, 89, 182, 0.45);
}
.theme-neon #form-ajout-cocktail .input-field {
  margin-top: 0.6rem;
  margin-bottom: 0.2rem;
}
.theme-neon #form-ajout-cocktail input[type=text],
.theme-neon #form-ajout-cocktail textarea,
.theme-neon #form-ajout-cocktail .select-wrapper input.select-dropdown {
  border-bottom: 2px solid rgba(155, 89, 182, 0.7) !important;
}
.theme-neon #form-ajout-cocktail .etape-row.card-panel,
.theme-neon #form-ajout-cocktail .ingredient-row.card-panel,
.theme-neon #form-ajout-cocktail .nouvel-ingredient-row.card-panel {
  padding: 10px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: none;
  align-items: center;
}
.theme-neon #form-ajout-cocktail .nouvel-ingredient-row {
  display: flex;
  align-items: flex-end;
}
.theme-neon #form-ajout-cocktail .nouvel-ingredient-row .new-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 !important;
  margin-top: 0 !important;
}
.theme-neon #form-ajout-cocktail .nouvel-ingredient-row .btn-remove-nouvel-ingredient {
  width: 40px;
  height: 40px;
  min-width: 40px;
  padding: 0;
}
.theme-neon #form-ajout-cocktail .nouvel-ingredient-row .btn-remove-nouvel-ingredient i.material-icons {
  line-height: 40px;
}
.theme-neon #form-ajout-cocktail .btn {
  border-radius: 12px;
  font-family: "Press Start 2P", monospace;
  letter-spacing: 0.5px;
}
.theme-neon #form-ajout-cocktail #add-etape.btn,
.theme-neon #form-ajout-cocktail #add-ingredient.btn,
.theme-neon #form-ajout-cocktail #add-nouvel-ingredient.btn {
  margin-top: 10px;
  width: 100%;
}
.theme-neon #form-ajout-cocktail .btn-remove-etape,
.theme-neon #form-ajout-cocktail .btn-remove-ingredient,
.theme-neon #form-ajout-cocktail .btn-validate-ingredient,
.theme-neon #form-ajout-cocktail .btn-remove-nouvel-ingredient {
  padding: 0 10px;
  height: 40px;
  line-height: 40px;
}
.theme-neon #form-ajout-cocktail .btn-remove-etape i.material-icons,
.theme-neon #form-ajout-cocktail .btn-remove-ingredient i.material-icons,
.theme-neon #form-ajout-cocktail .btn-validate-ingredient i.material-icons,
.theme-neon #form-ajout-cocktail .btn-remove-nouvel-ingredient i.material-icons {
  line-height: 40px;
}
.theme-neon #form-ajout-cocktail #image-preview img {
  max-height: 220px;
  border-radius: 16px;
}
.theme-neon #form-ajout-cocktail .nouvel-ingredient-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.theme-neon #form-ajout-cocktail .nouvel-ingredient-row .col.s4:first-child {
  flex: 0 0 100%;
  max-width: 100%;
}
.theme-neon #form-ajout-cocktail .nouvel-ingredient-row .col.s4:nth-child(2) {
  flex: 1 1 40%;
}
.theme-neon #form-ajout-cocktail .nouvel-ingredient-row .col.s3:nth-child(3) {
  flex: 1 1 40%;
}
.theme-neon #form-ajout-cocktail .nouvel-ingredient-row .new-actions {
  flex: 0 0 40px;
  display: flex;
  justify-content: center;
  padding: 0 !important;
}

/* ===== Mobile : tout passe clean en 1 colonne ===== */
@media (max-width: 600px) {
  .theme-neon #form-ajout-cocktail {
    --panel-pad: 12px;
    /* les colonnes d'actions passent en dessous si besoin */
  }
  .theme-neon #form-ajout-cocktail .row {
    margin-bottom: 0;
  }
  .theme-neon #form-ajout-cocktail h5 {
    text-align: center;
    font-size: 0.95rem;
  }
  .theme-neon #form-ajout-cocktail .etape-row .row .col.s2,
  .theme-neon #form-ajout-cocktail .ingredient-row .row .col.s2 {
    width: 100% !important;
    margin-top: 10px;
    display: flex;
    justify-content: center;
    gap: 10px;
  }
  .theme-neon #form-ajout-cocktail .etape-row .row .col.s10,
  .theme-neon #form-ajout-cocktail .ingredient-row .row .col.s6,
  .theme-neon #form-ajout-cocktail .ingredient-row .row .col.s4 {
    width: 100% !important;
  }
}
/* =========================
   MOBILE
   ========================= */
@media (max-width: 600px) {
  .btn-back {
    top: auto !important;
    bottom: 20px !important;
    left: 18px;
  }
  .profile-erase-btn {
    right: 30px !important;
  }
  .cocktail-page .cocktailDetail {
    display: flex;
    flex-direction: column;
  }
  .cocktail-page .cocktailDetail .cocktail-info span {
    width: -moz-max-content;
    width: max-content;
  }
  .cocktail-page .cocktail-ingredients .collection .collection-item {
    text-align: justify;
  }
  .cocktail-page .cocktail-votes .vote-stats .vote-stats-row span {
    width: -moz-max-content;
    width: max-content;
    font-size: small;
  }
  .cocktail-page .cocktail-votes .vote-meta span {
    font-size: smaller;
  }
  .cocktail-page .cocktail-votes .votes .btn-flat {
    width: -moz-max-content;
    width: max-content;
    font-size: small;
  }
  .loot-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.6rem;
    min-height: 340px;
  }
  .loot-grid .ingredient-card {
    height: -moz-fit-content;
    height: fit-content;
  }
  .ingredient-thumb img {
    height: 55px;
  }
  .ingredient-name {
    font-size: 0.85rem;
  }
  .loot-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.8rem;
    margin-top: 0.8rem;
  }
  .loot-pagination #loot-page-info {
    color: #e6e6e6;
    font-size: 0.9rem;
    opacity: 0.9;
  }
  .loot-pagination .btn-flat {
    color: #e6e6e6;
    border-radius: 999px;
    background: rgba(0, 255, 150, 0.1);
  }
  .cocktail-results-grid {
    width: 100% !important;
  }
  .cocktail-results-grid .cocktail-card {
    width: 45% !important;
  }
  .cocktail-results-grid .cocktail-card h6 {
    font-size: 9px !important;
  }
  .stats section .barcraftChamp {
    max-width: 50% !important;
  }
}
@media (min-width: 601px) and (max-width: 768px) {
  .btn-back {
    top: auto !important;
    bottom: 20px !important;
    left: 18px;
  }
  .loot-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.6rem;
    min-height: 340px;
  }
  .loot-grid .ingredient-card {
    height: -moz-fit-content;
    height: fit-content;
  }
  .ingredient-thumb img {
    height: 55px;
  }
  .ingredient-name {
    font-size: 0.85rem;
  }
  .loot-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.8rem;
    margin-top: 0.8rem;
  }
  .loot-pagination #loot-page-info {
    color: #e6e6e6;
    font-size: 0.9rem;
    opacity: 0.9;
  }
  .loot-pagination .btn-flat {
    color: #e6e6e6;
    border-radius: 999px;
    background: rgba(0, 255, 150, 0.1);
  }
  .cocktail-results-grid {
    width: 100% !important;
  }
  .cocktail-results-grid .cocktail-card {
    width: 30% !important;
  }
  .cocktail-results-grid .cocktail-card h6 {
    font-size: smaller !important;
  }
  #form-ajout-cocktail #etapes-container .input-field {
    width: -moz-fit-content;
    width: fit-content;
    padding: 0;
  }
}
@media (min-width: 769px) and (max-width: 992px) {
  .btn-back {
    top: auto !important;
    bottom: 20px !important;
    left: 18px;
  }
  .loot-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.6rem;
    min-height: 340px;
  }
  .loot-grid .ingredient-card {
    height: -moz-fit-content;
    height: fit-content;
  }
  .ingredient-thumb img {
    height: 55px;
  }
  .ingredient-name {
    font-size: 0.85rem;
  }
  .loot-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.8rem;
    margin-top: 0.8rem;
  }
  .loot-pagination #loot-page-info {
    color: #e6e6e6;
    font-size: 0.9rem;
    opacity: 0.9;
  }
  .loot-pagination .btn-flat {
    color: #e6e6e6;
    border-radius: 999px;
    background: rgba(0, 255, 150, 0.1);
  }
}/*# sourceMappingURL=style.css.map */