/* =====================================================================
   MODAL DE DISPONIBILIDAD — piezas propias de esta página
   =====================================================================
   El modal de SweetAlert2 usaba clases de utilidad de Tailwind con
   valores arbitrarios (rounded-[2.5rem], bg-red-50/50, border-primary/20…)
   que jamás estuvieron en output.css: ese archivo es un build fijo y
   nadie corre Tailwind sobre este proyecto para regenerarlo. El
   resultado era un modal sin esquinas, sin color, sin nada de lo que el
   marcado prometía — solo una lista plana con trece botones verdes
   sólidos idénticos.

   Este archivo reemplaza esas clases por componentes reales, con la
   paleta de la marca (azul, rojo, oro) y sin depender de que Tailwind
   compile nada nuevo.
   ===================================================================== */

.swal2-popup.cal-modal{
  border-radius:var(--s-r-xl,24px); padding:0 0 1.75rem; text-align:left;
  font-family:'Outfit',system-ui,sans-serif;
}
.cal-modal-cab{
  padding:1.5rem 1.75rem 1.1rem; border-bottom:1px solid var(--s-linea,#e5e7eb);
  margin-bottom:1.35rem;
}
.cal-modal-cab h3{
  margin:0; font-size:1.3rem; font-weight:800; color:var(--s-azul,#1e2d5c);
  letter-spacing:-.02em; text-transform:none;
}
.cal-modal-fecha{
  display:inline-flex; align-items:center; gap:.5rem; margin-top:.6rem;
  padding:.4rem .85rem; border-radius:99px; background:#f0f4ff;
  color:var(--s-azul,#1e2d5c); font-size:.78rem; font-weight:700;
  text-transform:capitalize;
}
.cal-modal-fecha i{ color:var(--s-oro,#d8a21f); }

.cal-modal-cuerpo{ padding:0 1.75rem; max-height:60vh; overflow-y:auto; }
@media(max-width:640px){ .cal-modal-cuerpo{ padding:0 1.1rem; } }

.cal-modal-cerrado{
  display:flex; align-items:center; gap:1rem; text-align:left;
  background:#fdeeee; border:1px solid #f3c6c6; border-radius:14px;
  padding:1.1rem 1.25rem; margin-bottom:1.25rem;
}
.cal-modal-cerrado i{ font-size:1.5rem; color:var(--s-rojo,#b91c1c); flex:none; }
.cal-modal-cerrado h4{ margin:0 0 .2rem; font-size:.95rem; font-weight:800; color:#8a1f1f; }
.cal-modal-cerrado p{ margin:0; font-size:.83rem; color:#8a1f1f; opacity:.85; }

/* Grupos por categoría: trece cosas en una lista plana no se escanean.
   Con encabezado se lee en segundos. */
.cal-modal-grupo + .cal-modal-grupo{ margin-top:1.35rem; }
.cal-modal-grupo-tit{
  font-size:.7rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  color:var(--s-gris-2,#6f7889); margin:0 0 .6rem;
}
.cal-modal-rej{
  display:grid; gap:.75rem;
  grid-template-columns:repeat(auto-fill, minmax(230px, 1fr));
}

.cal-item{
  display:flex; flex-direction:column; gap:.7rem;
  border:1px solid var(--s-linea,#e5e7eb); border-radius:14px;
  padding:.8rem; background:#fff; transition:border-color .15s, box-shadow .15s;
}
.cal-item:hover{ border-color:#d7ddea; box-shadow:0 6px 18px -10px rgba(17,24,39,.18); }
.cal-item.sin-stock{ opacity:.58; }

.cal-item-fila{ display:flex; align-items:center; gap:.7rem; min-width:0; }
.cal-item-foto{
  width:56px; height:56px; flex:none; border-radius:10px; overflow:hidden;
  background:linear-gradient(160deg,#eef1f7,#dfe5ef);
}
.cal-item-foto img{ width:100%; height:100%; object-fit:cover; display:block; }

.cal-item-txt{ min-width:0; flex:1; }
.cal-item-txt .n{
  font-size:.86rem; font-weight:700; color:var(--s-azul,#1e2d5c); line-height:1.25;
  display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.cal-item-txt .p{ font-size:.74rem; color:var(--s-gris,#6b7280); font-weight:600; margin-top:.1rem; }

/* Estado: dorado si hay de sobra, rojo si quedan pocas, gris si no hay.
   Antes todo era el mismo verde de "disponible", sin distinguir 13
   piezas libres de 1 sola. */
.cal-item-etq{
  display:inline-flex; align-items:center; gap:.3rem; align-self:flex-start;
  padding:.22rem .55rem; border-radius:99px; font-size:.66rem; font-weight:800;
  letter-spacing:.03em; text-transform:uppercase;
}
.cal-item-etq.hay{ background:#fdf6e3; color:#8a6410; }
.cal-item-etq.poca{ background:#fdeeee; color:#991b1b; }
.cal-item-etq.no{ background:#eef0f4; color:var(--s-gris,#6b7280); }

/* Botón en contorno, no relleno sólido: con trece tarjetas en pantalla,
   trece botones verdes sólidos pesan más que toda la marca junta. */
.cal-item-btn{
  display:flex; align-items:center; justify-content:center; gap:.45rem;
  padding:.55rem; border-radius:10px; text-decoration:none;
  border:1.5px solid #25D366; color:#128c4e; background:#fff;
  font-size:.8rem; font-weight:700; transition:background .15s, color .15s;
}
.cal-item-btn:hover{ background:#25D366; color:#fff; }
.cal-item-btn.no{
  border-color:var(--s-linea,#e5e7eb); color:var(--s-gris-2,#6f7889);
  cursor:not-allowed; pointer-events:none;
}

.cal-modal-carga{ display:flex; justify-content:center; padding:3rem 0; }
.cal-modal-carga .aro{
  width:48px; height:48px; border-radius:50%;
  border:4px solid #eef2f9; border-top-color:var(--s-azul,#1e2d5c);
  animation:cal-gira .8s linear infinite;
}
@keyframes cal-gira{ to{ transform:rotate(360deg); } }