.jm-cake { font-family: 'Lato', sans-serif; margin: 1.2rem 0; max-width: 540px; }
.jm-cake-field { margin-bottom: 1rem; }
.jm-cake-label {
  display: block;
  font-family: 'Fredoka', sans-serif;
  font-weight: 600;
  font-size: 0.95rem;
  color: #3A2A2F;
  margin-bottom: 0.4rem;
}
.jm-cake-label small { color: #A38995; font-weight: 400; }
.jm-cake-label .jm-req { color: #C77B92; }

/* Botones de raciones */
.jm-cake-raciones { display: flex; gap: 0.6rem; flex-wrap: wrap; }
.jm-cake-racion {
  flex: 1; min-width: 90px;
  background: #FFFAFC;
  border: 1.5px solid #F8D4DD;
  border-radius: 14px;
  padding: 0.6rem 0.5rem;
  cursor: pointer;
  display: flex; flex-direction: column; align-items: center; gap: 0.2rem;
  transition: all 0.2s;
}
.jm-cake-racion:hover { border-color: #E89BAF; }
.jm-cake-racion.active {
  border-color: #C77B92; border-width: 2px;
  background: #FDF1F4;
  box-shadow: 0 4px 14px rgba(199,123,146,0.18);
}
.jm-cake-racion-label { font-family: 'Fredoka', sans-serif; font-weight: 600; color: #3A2A2F; font-size: 0.9rem; }
.jm-cake-racion-price { font-family: 'Fredoka', sans-serif; font-weight: 700; color: #C77B92; font-size: 1.05rem; }

/* Selects */
.jm-cake-select, .jm-cake-notes {
  width: 100%;
  border: 1.5px solid #F8D4DD;
  border-radius: 12px;
  padding: 0.7rem 0.9rem;
  font-family: 'Lato', sans-serif;
  font-size: 0.95rem;
  color: #3A2A2F;
  background: #FFFFFF;
  transition: border-color 0.2s;
}
.jm-cake-select:focus, .jm-cake-notes:focus { outline: none; border-color: #C77B92; }
.jm-cake-notes { resize: vertical; }

/* Estado */
.jm-cake-status {
  background: #FDF1F4;
  border: 1px solid #F8D4DD;
  border-radius: 12px;
  padding: 0.7rem 1rem;
  margin: 1rem 0;
  font-size: 0.9rem;
  color: #6B4E58;
}
.jm-cake-status-ok { color: #2E8C45; font-weight: 600; }
.jm-cake-status-ok .jm-cake-total { color: #2E8C45; }
.jm-cake-status strong { color: #C77B92; }

/* Mensaje grande error */
.jm-cake-bigmsg {
  display: flex; align-items: center; gap: 0.8rem;
  background: linear-gradient(135deg, #FFE4E4, #FFD0D0);
  border: 2px solid #E89B9B; border-radius: 14px;
  padding: 0.9rem 1.1rem; margin-bottom: 1rem; color: #8B2828;
}
.jm-cake-bigmsg[hidden] { display: none; }
.jm-cake-bigmsg span { font-size: 1.6rem; }
.jm-cake-bigmsg p { margin: 0; font-size: 0.9rem; }
.jm-cake-bigmsg strong { color: #8B2828; }
@keyframes jmCakeShake { 0%,100%{transform:translateX(0);} 20%{transform:translateX(-8px);} 40%{transform:translateX(8px);} 60%{transform:translateX(-4px);} 80%{transform:translateX(4px);} }
.jm-cake-shake { animation: jmCakeShake 0.5s ease; }

/* CTA */
.jm-cake-cta {
  width: 100%;
  background: linear-gradient(135deg, #C77B92, #E89BAF);
  color: #fff; border: none; border-radius: 50px;
  padding: 1rem 1.5rem;
  font-family: 'Lato', sans-serif; font-weight: 700; font-size: 1rem; letter-spacing: 0.04em;
  cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 0.5rem;
  box-shadow: 0 8px 24px rgba(199,123,146,0.32);
  transition: transform 0.2s, box-shadow 0.2s, opacity 0.2s;
}
.jm-cake-cta:not(:disabled):hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(199,123,146,0.42); }
.jm-cake-cta:disabled { background: #D9C5CC; cursor: not-allowed; box-shadow: none; opacity: 0.85; }

.jm-cake-note {
  margin: 0.9rem 0 0; font-size: 0.82rem; color: #6B4E58; text-align: center;
  background: #FFFAFC; padding: 0.6rem; border-radius: 10px; border: 1px dashed #F8D4DD;
}

@media (max-width: 600px) {
  .jm-cake-raciones { flex-direction: column; }
}

/* ===== Foto de ejemplo ===== */
.jm-cake-foto-btn {
  background: #FFF0F5;
  color: #C77B92;
  border: 1.5px dashed #E89BAF;
  border-radius: 14px;
  padding: 0.75rem 1.1rem;
  font-family: 'Lato', sans-serif; font-weight: 700; font-size: 0.9rem;
  cursor: pointer; width: 100%;
  transition: background 0.2s, border-color 0.2s;
}
.jm-cake-foto-btn:hover { background: #FCE9F0; border-color: #C77B92; }
.jm-cake-foto-preview {
  position: relative; display: inline-block; margin-top: 0.7rem;
}
.jm-cake-foto-img {
  max-width: 160px; max-height: 160px; height: auto;
  border-radius: 12px; border: 1px solid #F8D4DD; display: block;
  box-shadow: 0 6px 18px rgba(199,123,146,0.22);
}
.jm-cake-foto-remove {
  position: absolute; top: -10px; right: -10px;
  width: 28px; height: 28px; border-radius: 50%;
  background: #C77B92; color: #fff; border: 2px solid #fff;
  font-size: 1.1rem; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}
.jm-cake-foto-remove:hover { background: #B05E78; }
.jm-cake-foto-hint { display: block; margin-top: 0.4rem; font-size: 0.78rem; color: #A38995; }
