/* Parche: panel de administración de códigos de regalo, embebido dentro del
   panel de admin (justo después de "Agregar tickets"), no como widget
   flotante. Insertado como hermano de nivel superior dentro de .admin-panel
   (no como hijo de un nodo que React reconcilia por sus propios hijos),
   para no pelear con los re-renders del SPA compilado (no tenemos su
   código fuente). */

.cp-codigos-panel {
  margin-top: 1.4rem;
  padding-top: 1.2rem;
  border-top: 1px solid var(--borde, #dce5dc);
}

.cp-codigos-panel h2 {
  font-family: Fraunces, serif;
  font-size: 1.05rem;
  margin: 0 0 0.3rem;
}

.cp-form-fila {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.6rem;
}
.cp-form-fila input {
  padding: 0.5rem 0.65rem;
  border: 1px solid var(--borde, #dce5dc);
  border-radius: 7px;
  font-size: 0.9rem;
}
.cp-form-fila input#cp-codigo {
  flex: 1 1 220px;
  text-transform: uppercase;
}

.cp-nota-input {
  display: block;
  width: 100%;
  margin-top: 0.5rem;
  padding: 0.5rem 0.65rem;
  border: 1px solid var(--borde, #dce5dc);
  border-radius: 7px;
  font-size: 0.9rem;
}

.cp-msg {
  margin: 0.6rem 0 0;
  font-size: 0.9rem;
}
.cp-msg.ok {
  color: var(--verde-osc, #0d4d39);
}
.cp-msg.error {
  color: #b3261e;
  background: #fce8e6;
  padding: 0.5rem 0.7rem;
  border-radius: 8px;
}

.cp-tabla {
  margin-top: 0.9rem;
}

.cp-estado {
  display: inline-block;
  padding: 0.15rem 0.55rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
}
.cp-estado.activo {
  background: var(--verde-claro, #dbf0dd);
  color: var(--verde-osc, #0d4d39);
}
.cp-estado.inactivo {
  background: #fce8e6;
  color: #b3261e;
}

.cp-fila-canjes td {
  background: var(--fondo, #f8f7f0);
}
.cp-canjes-lista {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 0.85rem;
}
.cp-canjes-lista li {
  padding: 0.3rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
}
.cp-canjes-lista li + li {
  border-top: 1px solid var(--borde, #dce5dc);
}