/* ====== Fuente global modal ====== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap');
#camionModal .modal-content,
#camionModal .modal-content *{ font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial }

/* ====== Vars ====== */
:root{
  --meli-blue:#007aff;
  --meli-green:#2ecc71;
  --meli-red:#ff3b30;
  --meli-orange:#ff9500;
  --meli-gray-1:#f5f5f7;
  --meli-gray-2:#e5e5ea;
  --meli-text:#1c1c1e;
  --meli-sub:#4f5966;
}

/* ====== Header sticky ====== */
.sticky-top-md-meli{ position:sticky; top:0; z-index:5; background:#fff; padding:5px 10px; border-radius:20px; }

/* ====== Botones macOS ====== */
.btn-macos-md-meli{
  border:1px solid var(--meli-gray-2); background:#fff; color:var(--meli-text);
  padding:.55rem .9rem; border-radius:12px; font-weight:700; transition:all .18s ease;
  box-shadow:0 1px 2px rgba(0,0,0,.04); display:inline-flex; align-items:center; gap:.35rem;
}
.btn-macos-md-meli:hover{ color:#fff; transform:translateY(-1px); }
.btn-macos-md-meli:focus{ outline:none; box-shadow:0 0 0 3px rgba(0,122,255,.25); }
.btn-primary-meli:hover{ background:var(--meli-blue)!important; }
.btn-success-meli:hover{ background:var(--meli-green)!important; }
.btn-warning-meli:hover{ background:var(--meli-orange)!important; }
.btn-danger-meli:hover { background:var(--meli-red)!important; }

.btn-primary-meli{ border-color:#cde0ff; background:#e8f1ff; color:#0a58ca; }
.btn-success-meli{ border-color:#cfead8; background:#ebf8f0; color:#1f9d5f; }
.btn-warning-meli{ border-color:#ffe1bc; background:#fff4e1; color:#b56a00; }
.btn-danger-meli { border-color:#ffd0cf; background:#ffe9e8; color:#b22a22; }
.btn-neutral-meli{ border-color:var(--meli-gray-2); background:#fff; color:var(--meli-blue); }

/* Mini botón editar */
.btn-mini-edit-md-meli{
  padding:.18rem .38rem; font-size:.8rem; border-radius:10px;
  border:1px solid var(--meli-gray-2); background:#fff; color:#4f5966; transition:all .18s ease;
}
.btn-mini-edit-md-meli:hover{ color:#fff; background:#6c7a89; }

/* ====== Barras / notas ====== */
.config-bar-md-meli{ display:flex; gap:.6rem; align-items:center; padding:.6rem .7rem; background:#fff; border:1px solid var(--meli-gray-2); border-radius:16px; }
.config-note-md-meli{ color:var(--meli-sub); font-size:.9rem; margin:.35rem .1rem .2rem; }
.section-gap-md-meli{ margin-top:1rem; }

/* ====== Tarjeta Producto ====== */
.product-card-md-meli{ margin:.85rem 0 .85rem; }
.product-panel-md-meli{
  display:grid; grid-template-columns:160px 1fr; gap:16px; align-items:center;
  padding:14px; border-radius:16px; background:#fff; border:1px solid var(--meli-gray-2); position:relative;
}
/* Reutiliza el verde del glow */
:root{
  --glow-green: #22c55e; 
}

.product-panel-md-meli .last-badge-md-meli{
  position: absolute;
  top: -12px;
  left: -12px;
  background: var(--glow-green, #22c55e);
  color: #fff;
  font-weight: 800;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: .8rem;
  border: 1px solid rgba(22,163,74,.95);   
  box-shadow: 0 2px 8px rgba(34,197,94,.28); 
}

.product-panel-md-meli .last-badge-md-meli.cart{
  background:var(--meli-blue);
  padding:8px 12px;
  font-size:.88rem;
  display:inline-flex; align-items:center; gap:.45rem;
}
.product-panel-md-meli .last-badge-md-meli.cart .sub{
  font-size:.72rem; opacity:.95; font-weight:700; border-left:1px solid rgba(255,255,255,.4); padding-left:.55rem;
}

.product-img-md-meli{
  width:160px; height:160px; border-radius:999px; object-fit:cover;
  border:3px solid #fff; box-shadow:0 3px 12px rgba(0,0,0,.09); position:relative;
}

/* === Badge cantidad (imagen grande) === */
.img-qty-badge-md-meli{
  position:absolute; top:10px; right:15px; min-width:36px; height:36px;
  display:flex; align-items:center; justify-content:center; border-radius:999px;
  font-weight:900; font-size:.9rem; color:#fff; background:linear-gradient(180deg,#4f86f7,#4f86f7);
  box-shadow:0 6px 20px rgba(0,0,0,.12); z-index:2;
}
.img-qty-badge-md-meli.red{ background:linear-gradient(180deg,#ff3b30,#ff3b30); }

/* Resaltado panel */
/* Glow verde suave */
@keyframes greenGlowSoft{
  0%{
    box-shadow:
      0 8px 26px rgba(34,197,94,.18),
      0 0 0 0 rgba(34,197,94,.32);
  }
  50%{
    box-shadow:
      0 12px 36px rgba(34,197,94,.28),
      0 0 0 10px rgba(34,197,94,0);
  }
  100%{
    box-shadow:
      0 8px 26px rgba(34,197,94,.18),
      0 0 0 0 rgba(34,197,94,.32);
  }
}

.product-panel-highlight-md-meli{
  --glow-green: #22c55e; 
  border: 1px solid var(--glow-green) !important;
  box-shadow: 0 8px 26px rgba(34,197,94,.18);
  animation: greenGlowSoft 2.2s ease-in-out infinite;
  border-radius: 14px;
}

/* Respeta preferencias de movimiento */
@media (prefers-reduced-motion: reduce){
  .product-panel-highlight-md-meli{ animation: none; }
}

/* ====== Pills ====== */
.pills-row-md-meli{ display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.4rem; }
.pill-md-meli{ display:inline-flex; align-items:center; gap:.35rem; border:1px solid var(--meli-gray-2); background:#fff; padding:.28rem .6rem; border-radius:999px; font-weight:700; color:#2f3640; font-size:.85rem; }
.pill-op-md-meli{ border-color:#ffd0cf; background:#ffe9e8; color:#b22a22; }
.pill-qty-green-md-meli{ border-color:#cfead8; background:#ebf8f0; color:#1f9d5f; }
.pill-qty-red-md-meli{ border-color:#ffd0cf; background:#ffe9e8; color:#b22a22; }
/* Carrito */
.pill-cart-md-meli{ border-color:#cde0ff; background:#eaf2ff; color:#0a58ca; }
.cart-strip-md-meli{ display:flex; gap:.5rem; margin-top:.5rem; flex-wrap:wrap; }
.cart-thumb-md-meli{
  position:relative; width:48px; height:48px; border-radius:12px; overflow:visible; /* <- permite que el badge sobresalga */
  border:2px solid #e5e5ea; display:inline-flex; align-items:center; justify-content:center;
  box-shadow:0 2px 8px rgba(0,0,0,.06); cursor:pointer; transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
  background:#fff;
}
.cart-thumb-md-meli:hover{ transform:translateY(-1px); box-shadow:0 4px 12px rgba(0,0,0,.10); }
.cart-thumb-md-meli img{ width:100%; height:100%; object-fit:cover; border-radius:10px; }
.cart-thumb-md-meli .idx{
  position:absolute; top:-8px; right:-8px; width:20px; height:20px; border-radius:999px; background:#fff; border:1px solid #e5e5ea;
  display:flex; align-items:center; justify-content:center; font-weight:900; font-size:.7rem; color:#0a58ca; box-shadow:0 2px 6px rgba(0,0,0,.12); z-index:3;
}
.cart-thumb-md-meli.active{ border-color:#0a58ca; box-shadow:0 4px 16px rgba(10,88,202,.18); }
.cart-thumb-md-meli.active .idx{ background:#eaf2ff; color:#0a58ca; border-color:#cde0ff; }

/* Tag para compras individuales (no carrito) */
.thumb-tag-md-meli{
  position:absolute; left:-6px; bottom:-6px; padding:.15rem .45rem; border-radius:999px; font-weight:800; font-size:.7rem;
  border:1px solid #e5e5ea; background:#fff; color:#6b7280; box-shadow:0 2px 6px rgba(0,0,0,.08);
}

/* Bump al bloquear cambio con EAN pendiente */
@keyframes bump { 0%{transform:scale(1)} 50%{transform:scale(1.06)} 100%{transform:scale(1)} }
.cart-thumb-blocked{ animation:bump .28s ease; }

/* Cart pill en filas */
.cart-pill-inline{
  display:inline-flex; align-items:center; gap:.35rem; padding:.15rem .5rem; border-radius:999px; border:1px solid #cde0ff;
  background:#eaf2ff; color:#0a58ca; font-weight:800; font-size:.75rem; margin-top:.2rem;
}

/* ====== Textos producto ====== */
.product-title-md-meli{ font-size:1.02rem; font-weight:800; color:var(--meli-text); line-height:1.25; }
.product-sub-md-meli{ color:var(--meli-sub); font-weight:600; margin-top:2px; }

/* ====== Input scan ====== */
.input-wrap-md-meli{ margin:.95rem 0 1.1rem; }
.scan-input-md-meli{ width:100%; font-size:1.15rem; padding:.75rem 1rem; border-radius:14px; border:1px solid var(--meli-gray-2); outline:none; transition:box-shadow .18s ease,border-color .18s ease; }
.scan-input-md-meli:focus{ border-color:var(--meli-blue); box-shadow:0 0 0 4px rgba(0,122,255,.16); }
.scan-input-error-md-meli{ border-color:var(--meli-red)!important; box-shadow:0 0 0 4px rgba(255,59,48,.18)!important; }
.scan-hint-md-meli{ color:var(--meli-sub); }
.success-glow-md-meli{ box-shadow:0 0 0 4px rgba(46,204,113,.16)!important; }
.ean-mode-md-meli{ background:#fffdf4; }

/* ====== Estado modal: esperando / error EAN ====== */
@keyframes warmPulse{0%{background:linear-gradient(135deg,rgba(255,246,233,.95),rgba(255,255,255,.92));}50%{background:linear-gradient(135deg,rgba(255,240,216,.95),rgba(255,246,233,.92));}100%{background:linear-gradient(135deg,rgba(255,246,233,.95),rgba(255,255,255,.92));}}
.camion-wait-ean-md-meli{ animation:warmPulse 2.2s ease-in-out infinite; }
@keyframes redPulse{0%{background:linear-gradient(135deg,rgba(255,233,232,.95),rgba(255,255,255,.92));}50%{background:linear-gradient(135deg,rgba(255,216,214,.95),rgba(255,233,232,.92));}100%{background:linear-gradient(135deg,rgba(255,233,232,.95),rgba(255,255,255,.92));}}
.camion-error-ean-md-meli{ animation:redPulse 1.5s ease-in-out infinite; }

/* ====== Overlay ====== */
.screen-overlay-md-meli{ position:fixed; inset:0; z-index:1060; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,.18); backdrop-filter:blur(10px); }
.screen-overlay-md-meli::before{ content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(1200px 900px at 20% 10%,rgba(255,255,255,.18),transparent 40%),
             radial-gradient(1000px 700px at 80% 90%,rgba(255,255,255,.14),transparent 40%); }
.screen-warm-md-meli{   background:linear-gradient(135deg,rgba(255,183,107,.35),rgba(255,127,80,.35)),rgba(0,0,0,.18); }
.screen-warn-md-meli{   background:linear-gradient(135deg,rgba(255,184,96,.35),rgba(255,140,0,.35)),rgba(0,0,0,.18); }
.screen-danger-md-meli{ background:linear-gradient(135deg,rgba(255,107,107,.35),rgba(255,59,48,.35)),rgba(0,0,0,.18); }
.screen-prohib-md-meli{ background:linear-gradient(135deg,rgba(255,107,107,.35),rgba(178,42,34,.35)),rgba(0,0,0,.18); }
.screen-card-md-meli{ color:#fff; text-align:center; padding:26px 28px; border-radius:18px; border:1px solid rgba(255,255,255,.25); background:rgba(255,255,255,.12); box-shadow:0 10px 28px rgba(0,0,0,.25); min-width:320px; max-width:640px; }
.screen-title-md-meli{ font-weight:800; font-size:1.2rem; }
.screen-sub-md-meli{ opacity:.95; margin-top:.2rem; }
.screen-actions-md-meli{ display:flex; gap:.6rem; flex-wrap:wrap; justify-content:center; margin-top:1rem; }
@keyframes spinRing{ to{transform:rotate(360deg);} }
.spinner-ring-md-meli{ width:42px; height:42px; border-radius:999px; border:3px solid rgba(255,255,255,.45); border-top-color:#fff; animation:spinRing 1s linear infinite; }

/* ====== Tabs ====== */
.tabs-card-md-meli{ margin-top:1.1rem; border:1px solid var(--meli-gray-2); border-radius:16px; background:#fff; overflow:hidden; }
.tabs-header-md-meli{ display:flex; gap:.4rem; padding:.5rem; background:var(--meli-gray-1); }
.tab-btn-md-meli{ flex:1; text-align:center; padding:.6rem; border-radius:12px; border:1px solid #e5e5ea; background:#fff; font-weight:700; transition:all .2s ease; position:relative; color:#4f5966; }
.tab-btn-md-meli:hover{ color:#fff; background:#6c7a89; }
.tab-btn-md-meli:focus{ outline:none; box-shadow:0 0 0 3px rgba(0,122,255,.25); }
.tab-btn-md-meli.active{ border-color:#cde0ff; background:#eaf2ff; color:#0a58ca; box-shadow:0 6px 16px rgba(10,88,202,.10); }
#tabDenegados-md-meli.active{ border-color:#ffd0cf; background:#ffe9e8; color:#b22a22; box-shadow:0 6px 16px rgba(178,42,34,.08); }

/* Badge pestañas */
.badge-tab-md-meli{ position:absolute; top:-8px; right:-6px; font-size:.9rem; padding:7px 15px; border-radius:999px; font-weight:900; color:#fff; }
#tabAprobados-md-meli .badge-tab-md-meli{ background:var(--meli-green); }
#tabDenegados-md-meli .badge-tab-md-meli{ background:var(--meli-red); }
#histTabAprob .badge-tab-md-meli{ background:var(--meli-green); }
#histTabDeneg .badge-tab-md-meli{ background:var(--meli-red); }

/* ====== Tabla tipo lista ====== */
.search-row-md-meli{ padding:.45rem .6rem .2rem; background:#fff; }
.search-input-list-md-meli{ width:100%; border:1px solid var(--meli-gray-2); border-radius:12px; padding:.5rem .75rem; outline:none; }
.search-input-list-md-meli:focus{ border-color:var(--meli-blue); box-shadow:0 0 0 4px rgba(0,122,255,.12); }

.table-like-md-meli{ padding:.25rem .5rem .7rem; }
.table-head-md-meli{
  display:grid; grid-template-columns:76px 2fr 1.6fr .9fr .9fr 1.2fr 120px;
  gap:.5rem; padding:.45rem; font-size:.85rem; color:#6b7280;
}
.table-head-md-meli > :not(:nth-child(2)),
.table-row-md-meli  > :not(:nth-child(2)){ text-align:center; }

.table-body-md-meli{ max-height:420px; overflow-y:auto; border-top:1px dashed var(--meli-gray-2); }
.table-row-md-meli{
  display:grid; grid-template-columns:76px 2fr 1.6fr .9fr .9fr 1.2fr 120px;
  gap:.5rem; align-items:center; padding:.55rem .45rem;
  border:1px solid var(--meli-gray-2); background:#fff; transition:transform .14s ease, box-shadow .14s ease, background-color .2s ease;
}
.table-row-md-meli:hover{background-color: #dadada !important;cursor: pointer; }

/* Imagen tabla */
.table-img-md-meli{ width:76px; height:76px; border-radius:999px; object-fit:cover; position:relative; box-shadow:0 2px 8px rgba(0,0,0,.08); }
.table-img-wrap{ position:relative; display:inline-block; }

/* Badge fila */
.img-qty-chip-md-meli{
  position:absolute; top:-8px; right:2px; min-width:28px; height:28px; display:flex; align-items:center; justify-content:center;
  border-radius:999px; font-weight:900; font-size:.8rem; color:#fff; background:linear-gradient(180deg,#4f86f7,#4f86f7); box-shadow:0 6px 20px rgba(0,0,0,.12);
}
.img-qty-chip-md-meli.red{ background:linear-gradient(180deg,#ff3b30,#ff3b30); }

.inline-badges-md-meli{ display:inline-flex; align-items:center; gap:.35rem; justify-content:center; }
.badge-pallet-md-meli{ display:inline-block; padding:.25rem .55rem; font-weight:800; border-radius:999px; color:#fff; }
.badge-camion-md-meli{ display:inline-block; padding:.25rem .55rem; font-weight:800; border-radius:999px; color:#fff; background:#596275; }

/* Filas carrito: resaltado sutil del grupo */
.table-row-md-meli.cart-grouped{ box-shadow:0 4px 18px rgba(10,88,202,.06); }
.table-row-md-meli .cart-flag{
  display:inline-flex; align-items:center; gap:.35rem; padding:.18rem .45rem; border-radius:999px; font-weight:800; font-size:.72rem;
  border:1px solid #cde0ff; background:#eaf2ff; color:#0a58ca; margin-top:.25rem;
}

#tableAprob-md-meli{ background:#f6fbf8; border-top:1px solid #dff2e6; }
#tableDeneg-md-meli{ background:#fff7f7; border-top:1px solid #ffdede; }

.table-empty-md-meli{ text-align:center; color:#80848c; padding:1rem .5rem; border:1px dashed var(--meli-gray-2); border-radius:14px; margin:.6rem .4rem; }
.row-actions-md-meli{ display:flex; gap:.4rem; flex-wrap:wrap; justify-content:center; }
.row-actions-md-meli .btn-macos-md-meli{ padding:.35rem .6rem; }

.line-2-ellipsis{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; }

/* Destino más chico */
.destino-text-md-meli{ font-size:.85rem; line-height:1.25; }

/* SKU */
.sku-highlight{ background-color:grey; color:#fff; padding:0 .35rem; border-radius:5px; font-weight:700; }

/* ====== SweetAlert macOS ====== */
.swal-macos-md-meli.swal2-popup{ max-width:96vw!important; }
.swal-macos-md-meli .swal2-actions{ gap:8px!important; flex-wrap:wrap; justify-content:center; margin-top:.6rem!important; }
.swal-macos-md-meli .swal2-close{ box-shadow:none!important; outline:none!important; }
.swal-macos-md-meli .swal2-close:focus{ outline:none!important; box-shadow:0 0 0 3px rgba(0,122,255,.25)!important; }

/* contenedor con scroll vertical y HORIZONTAL para mantener estética en mobile */
.swal-macos-md-meli .swal2-html-container{ max-height:70vh; overflow:auto; overflow-x:auto; }

/* wrapper con scroll lateral para tablas anchas */
.h-scroll-md-meli{ overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:.25rem; }
.h-scroll-md-meli > *{ min-width:760px; }

/* Header & chips historial */
.hist-header-md-meli{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.6rem; margin-bottom:.6rem; font-size:.95rem; }
.hist-header-md-meli .right{ display:flex; flex-wrap:wrap; gap:.4rem; }
.hist-chip-md-meli{ display:inline-flex; align-items:center; gap:.35rem; background:#f1f5f9; color:#334155; padding:.25rem .5rem; border-radius:999px; font-weight:700; font-size:.85rem; border:1px solid #e2e8f0; }
.hist-chip-green{ background:#ebf8f0; color:#166534; border-color:#cfead8; }
.hist-chip-red{ background:#ffe9e8; color:#b22a22; border-color:#ffd0cf; }

/* Emails (Swal) */
.email-list-md-meli{ display:flex; flex-direction:column; gap:.4rem; }
.email-item-md-meli{
  display:flex; align-items:center; justify-content:space-between; gap:.6rem;
  border:1px solid var(--meli-gray-2); border-radius:12px; padding:.45rem .6rem; background:#fff;
}
.email-label{ font-weight:700; font-size:.9rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:60ch; }
.btn-icon-md-meli{ padding:.45rem; border-radius:10px; border:1px solid var(--meli-gray-2); background:#fff; color:#0a58ca; display:inline-flex; align-items:center; justify-content:center; }
.btn-icon-md-meli:hover{ background:#f8fafc; }
.toggle-on{ color:#1f9d5f; border-color:#cfead8; background:#ebf8f0; }
.toggle-off{ color:#b56a00; border-color:#ffe1bc; background:#fff4e1; }

/* Confirm inline dentro del listado de emails (compacto) */
.email-item-confirm{
  display:flex; align-items:center; justify-content:space-between; gap:.6rem;
  border:1px dashed #ffb3ae; background:#fff7f7; color:#b22a22;
  padding:.35rem .5rem; border-radius:12px; font-size:.9rem; flex-wrap:wrap;
}
.email-item-confirm .btn-macos-md-meli{ padding:.25rem .5rem; font-size:.85rem; border-radius:10px; white-space:nowrap; }

/* Fuerza SIN margen inferior en el input de email (override globales) */
#emailInput-md-meli{ margin-bottom:0 !important; }

/* Flatpickr: badge/z-index */
.badge-camiones-historial-tipeo{
  position:absolute; right:-5px; bottom: 25px !important; min-width:20px; height:20px;
  display:flex; align-items:center; justify-content:center; border-radius:999px;
  background:#ca0a0a; color:#fff; font-weight:600; font-size:.75rem; box-shadow:0 2px 6px rgba(0,0,0,.15);
}
.flatpickr-calendar{ z-index:2050!important; }

/* ====== Modal tamaño y scroll lateral en mobile ====== */
#camionModal .modal-dialog{ max-width:1140px; width:auto; margin:1.75rem auto; }
#camionModal .modal-body{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.table-head-md-meli, .table-row-md-meli{ min-width:960px; }

@media (max-width:768px){
  .h-scroll-md-meli > *{ min-width:880px; }
  .table-head-md-meli, .table-row-md-meli{ min-width:880px; }
}
@media (max-width:576px){
  .h-scroll-md-meli > *{ min-width:760px; }
  .table-head-md-meli, .table-row-md-meli{ min-width:760px; }
}

/* Forzar gap=8px en cualquier SweetAlert (fallback robusto) */
div:where(.swal2-container) div:where(.swal2-actions){
  display:flex; z-index:1; gap:8px; box-sizing:border-box; flex-wrap:wrap; align-items:center;
  justify-content: var(--swal2-actions-justify-content); width: var(--swal2-actions-width);
  margin: var(--swal2-actions-margin); padding: var(--swal2-actions-padding);
  border-radius: var(--swal2-actions-border-radius); background: var(--swal2-actions-background);
}

/* === Shipping Badges (Camión / Pallet) === */
.ship-badges-wrap{
  display:inline-flex;
  gap:.35rem;
  margin-left:.45rem;
  vertical-align:middle;
}
/* macOS-style ship badges con sombra paralela */
.ship-badge{
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: 6px 12px;
  border-radius: 999px;
  color: #fff;
  font-weight: 800;
  font-size: .78rem;
  line-height: 1;
  white-space: nowrap;

  /* Brillo/relieve sobre cualquier color de fondo que le apliques */
  background-image: linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.06));
  border: 1px solid rgba(255,255,255,.32);

  /* Relieve interno + base */
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.45),         /* highlight interior superior */
    inset 0 -1px 0 rgba(0,0,0,.10),              /* leve sombreado interior inferior */
    0 1px 0 rgba(0,0,0,.06);                     /* contacto */

  transition: transform .16s ease, filter .16s ease, box-shadow .16s ease;
  will-change: transform, filter;
}

.ship-badge:active{
  transform: translateY(0);
  box-shadow:
    inset 0 1px 3px rgba(0,0,0,.18),
    0 1px 0 rgba(0,0,0,.06);
  filter:
    drop-shadow(0 2px 4px rgba(0,0,0,.12))
    drop-shadow(0 10px 18px rgba(0,0,0,.10));
}

.ship-badge i{
  font-size: .9em;
  line-height: 1;
}

/* Fallbacks de color si no viene nada desde Firebase */
.ship-badge.pallet{ background:#596275; }
.ship-badge.camion{ background:#596275; }

/* ====== Cola bajo input ====== */
.queuebar-md-meli{
  display:flex; align-items:center; gap:.6rem;
  margin-top:.35rem; padding:.45rem .6rem;
  border:1px solid var(--meli-gray-2); border-radius:10px;
  background:#f1f5f9; color:#334155; font-weight:700;
}

/* Spinner inline – reutiliza @keyframes spinRing */
.spinner-inline-md-meli{
  width:18px; height:18px; border-radius:999px;
  border:2px solid #e5e5ea; border-top-color:#0a58ca;
  animation: spinRing 1s linear infinite;
}

/* ====== Detalles colapsables en Product Card ====== */
.btn-details-md-meli{ margin-top:.35rem; }

.collapsible-md-meli{
  overflow:hidden;
  transition: max-height .25s ease, padding-top .2s ease;
  max-height: 0;
  padding-top: 0;
}

.collapsible-md-meli.open{
  /* Ajustá el max-height si tu contenido puede ser más alto */
  max-height: 400px;
  padding-top: .25rem;
}

/* Cuando está colapsado nos aseguramos de ocultar */
.collapsible-md-meli.collapsed{
  max-height: 0;
  padding-top: 0;
}

/* ====== Collapse de Configuración ====== */
.config-toggle-wrap-md-meli{
  display:flex; justify-content:flex-start; margin-bottom:.4rem;
}

.collapse-meli{
  overflow:hidden;
  transition: max-height .28s ease, padding .2s ease, border-color .2s ease;
  max-height: 0;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 16px;
}

.collapse-meli.open{
  max-height: 420px;            
  padding: .6rem .6rem .7rem;   
  background:#fff;
}

.collapse-meli.collapsed{
  max-height: 0;
  padding: 0;
  border-color: transparent;
}

/* ====== Carrusel de camiones (limpio) ====== */
.camion-scroll-wrap-md-meli{ position: relative; padding: .25rem 2.6rem; }
.camion-scroll-md-meli{
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(260px, 320px);
  gap:.9rem; overflow-x:auto; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch;
  padding:.2rem .25rem .6rem;
}
/* Flechas: sólo navegación, nada de overlays raros */
.camion-arrow-md-meli{
  position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:38px; height:38px; border-radius:999px; border:1px solid var(--meli-gray-2);
  background:#fff; color:#0a58ca; display:inline-flex; align-items:center; justify-content:center;
  box-shadow:0 6px 18px rgba(0,0,0,.12); transition:transform .12s ease, box-shadow .12s ease;
}
.camion-arrow-md-meli.left{ left:.25rem; }
.camion-arrow-md-meli.right{ right:.25rem; }
.camion-arrow-md-meli:hover{ transform:translateY(-50%) scale(1.06); box-shadow:0 10px 24px rgba(0,0,0,.16); }

/* ====== Card de camión (SIN glow) ====== */
.camion-card-md-meli{
  position:relative; scroll-snap-align:start;
  border:1px solid var(--meli-gray-2); border-radius:18px;
  padding:.9rem .95rem .8rem; background:#fff;
  box-shadow:0 6px 18px rgba(0,0,0,.06);
  display:grid; grid-template-rows:auto 1fr auto; align-items:center; min-height:168px;
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease, opacity .18s ease;
  --c:#596275;
}
/* Barra superior de color plana */
.camion-card-md-meli::before{
  content:""; display:block; height:6px; width:100%; border-radius:10px; margin-bottom:.5rem;
  background: var(--c);
  opacity:.25;
}
/* Modos de estado visual */
.camion-card-md-meli.selected{ filter:none; opacity:1; }
.camion-card-md-meli.dim{ filter:grayscale(.6) brightness(.95); opacity:.9; }
.camion-card-md-meli.current{ /* el camión ACTUAL (de escaneo) no lleva glow, solo borde/color */
  border-color: color-mix(in srgb, var(--c) 50%, #dfe3ea);
}
/* Header */
.camion-label-md-meli{ display:flex; align-items:center; gap:.5rem; font-weight:900; letter-spacing:.2px; }
.camion-chip-md-meli{
  display:inline-flex; align-items:center; gap:.35rem; padding:.28rem .65rem;
  border-radius:999px; color:#fff; font-weight:800; font-size:.86rem;
  background: var(--c);
}

/* Contador: por defecto sobrio */
.camion-count-md-meli{
  font-weight: 800;
  font-size: 2.6rem;
  line-height: 1;
  margin:.2rem 0 .45rem;
  text-align:center;
  font-variant-numeric: tabular-nums;
  letter-spacing:.5px;
  color:#0f172a;
}

/* ============= Camión actual: contador con círculos MÁS chicos detrás ============= */
.camion-card-md-meli.current .camion-count-md-meli{
  /* ajustables */
  --ring-color: var(--meli-red, #ff2b2b);
  --ring-size: 1.8em;   /* anillo exterior (antes 2.6em) */
  --glow-size: 1.15em;  /* brillo interior (antes 2.0em) */

  position: relative;
  z-index: 0;
  display: inline-block;
  line-height: 1;
  letter-spacing: .5px;

  color: var(--ring-color);
  font-size: clamp(2.8rem, 6vw, 4rem);
  font-weight: 1000;

  -webkit-text-stroke: 1px rgba(0,0,0,.18);
  background: linear-gradient(180deg, #ff6b6b 0%, #ff2b2b 48%, #b30000 100%);
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;

  text-shadow:
    0 1px 0 rgba(0,0,0,.25),
    0 2px 6px rgba(255,43,43,.3),
    0 0 12px rgba(255,43,43,.22);

  animation: camionHeartbeat 1.15s ease-in-out infinite;
  will-change: transform;
}

/* ===== CÍRCULOS DETRÁS (más chicos) ===== */
.camion-card-md-meli.current .camion-count-md-meli::before,
.camion-card-md-meli.current .camion-count-md-meli::after{
  content: "";
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  pointer-events: none;
  z-index: -1; /* detrás del número */
}

/* Brillo interior que “respira” (círculo chico) */
.camion-card-md-meli.current .camion-count-md-meli::before{
  width: var(--glow-size);
  height: var(--glow-size);
  background: radial-gradient(circle at 50% 50%,
              rgba(255,43,43,.26) 0%,
              rgba(255,43,43,.14) 40%,
              rgba(255,43,43,0) 70%);
  filter: blur(.8px);
  animation: camionGlowBreathe 2.2s ease-in-out infinite;
}

/* Anillo de pulso corto (círculo exterior pequeño) */
.camion-card-md-meli.current .camion-count-md-meli::after{
  width: var(--ring-size);
  height: var(--ring-size);
  box-shadow:
    0 0 0 0 rgba(255, 43, 43, .22),
    0 0 0 0 rgba(255, 43, 43, .10);
  background: radial-gradient(circle at 50% 50%,
              rgba(255,43,43,.12) 0%,
              rgba(255,43,43,0) 60%);
  animation: camionPulseRingCircle 1.15s ease-out infinite;
}

/* ================== Keyframes ================== */
@keyframes camionHeartbeat{
  0%, 100% { transform: scale(1); }
  25%      { transform: scale(1.06); }
  50%      { transform: scale(1.12); }
  75%      { transform: scale(1.06); }
}

/* respiración leve del brillo interior */
@keyframes camionGlowBreathe{
  0%, 100% { transform: translate(-50%, -50%) scale(.97); opacity:.5; }
  50%      { transform: translate(-50%, -50%) scale(1.03); opacity:.85; }
}

/* pulso breve del anillo (recorrido más corto) */
@keyframes camionPulseRingCircle{
  0% {
    transform: translate(-50%, -50%) scale(1);
    box-shadow:
      0 0 0 0 rgba(255,43,43,.26),
      0 0 0 0 rgba(255,43,43,.12);
    opacity: .9;
  }
  70% {
    transform: translate(-50%, -50%) scale(1.08);
    box-shadow:
      0 0 0 6px rgba(255,43,43,0),
      0 0 0 12px rgba(255,43,43,0);
    opacity: .35;
  }
  100% {
    transform: translate(-50%, -50%) scale(1);
    box-shadow:
      0 0 0 0 rgba(255,43,43,0),
      0 0 0 0 rgba(255,43,43,0);
    opacity: 0;
  }
}

/* Accesibilidad */
@media (prefers-reduced-motion: reduce){
  .camion-card-md-meli.current .camion-count-md-meli,
  .camion-card-md-meli.current .camion-count-md-meli::before,
  .camion-card-md-meli.current .camion-count-md-meli::after{
    animation: none !important;
  }
}

/* Botonera */
.camion-card-actions-md-meli{ display:flex; justify-content:center; }
.camion-card-actions-md-meli .btn-macos-md-meli{ padding:.38rem .65rem; }

/* ====== SweetAlert: tabla compacta + elipsis de 2 líneas ====== */
.pallet-table-md-meli{ width:100%; border-collapse: collapse; background:#fff; border:1px solid #e5e7eb; border-radius:12px; overflow:hidden; }
.pallet-table-md-meli th, .pallet-table-md-meli td{ padding:.5rem .6rem; border-bottom:1px solid #eef2f7; text-align:left; }
.pallet-table-md-meli thead th{ background:#f8fafc; font-weight:900; color:#0f172a; }
.pallet-table-md-meli.compact th, .pallet-table-md-meli.compact td{ font-size:.82rem; }

/* Subfila expandible estable y con scroll */
.pallet-subrow-md-meli td{ padding:0; background:#f8fafc; }
.pallet-subrow-box{ padding:.55rem .6rem; border-top:1px dashed #e5e7eb; }
.pallet-subrow-inner{ max-height:320px; overflow:auto; background:#fff; border:1px solid #e5e7eb; border-radius:10px; }

/* 2 líneas con elipsis para títulos largos */
.ellipsis-2{
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden; text-overflow:ellipsis; line-height:1.25;
}

/* Monoespaciado sutil para IDs */
.mono-sm{ font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.78rem; color:#334155; }

/* Asegurar clic en cards “dim”: no bloqueamos el puntero */
.camion-card-md-meli, .camion-card-md-meli *{ pointer-events: auto; }

/* Badge bajo el contador (muestra "N etiquetas") */
.camion-count-badge-md-meli{
  margin-top:.15rem;
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.18rem .55rem; border-radius:999px;
  font-weight:900; font-size:.82rem; letter-spacing:.2px;
  background:#eef2ff; border:1px solid #e5e7eb; color:#1e3a8a;
}
.camion-card-md-meli.current .camion-count-badge-md-meli{
  background: color-mix(in srgb, var(--c) 15%, #fff);
  border-color: color-mix(in srgb, var(--c) 35%, #dfe3ea);
  color:#0f172a;
}

/* Meta "Escaneado: dd/mm/aaaa hh:mm:ss" en filas */
.scan-meta-md-meli{
  font-size:.78rem; color:#6b7280; margin-top:2px;
}

/* Flechas: hover azul + texto blanco */
.camion-arrow-md-meli:hover{
  background:#0a58ca; color:#fff; border-color:#0a58ca;
  transform:translateY(-50%) scale(1.06);
  box-shadow:0 10px 24px rgba(0,0,0,.16);
}

.camion-tags-badge-md-meli{
  display:flex; align-items:center; justify-content:center;
  display: none;
  margin-top:.25rem; padding:.16rem .5rem; border-radius:999px;
  color:grey;
  font-weight:800; font-size:.78rem; letter-spacing:.2px;
  margin-bottom: 5px;
}

.camion-scroll-md-meli{
  min-height: 88px;             
  display: flex;                
  align-items: stretch;
}

.camion-scroll-md-meli > .camion-empty-md-meli{
  flex: 1 0 100%;
  min-width: 100%;
}

.camion-empty-md-meli{
  display:flex; align-items:center; justify-content:center; gap:.5rem;
  color:#b22a22; font-weight:800; padding:.6rem .8rem; border-radius:12px;
  border:1px dashed #f5c2c7; background:#fff5f5; min-height:72px; width:100%;
}

/* ===== TABLA RESPONSIVE EN MOBILE ===== */
.table-viewport-tbl-meli{
  overflow-x: auto;         
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}

.table-viewport-tbl-meli > table{
  width: auto !important;      
  min-width: 960px;           
  table-layout: auto;        
  white-space: nowrap;     
}

@media (max-width: 768px){
  .table-viewport-tbl-meli > table{ min-width: 880px; }
}
@media (max-width: 576px){
  .table-viewport-tbl-meli > table{ min-width: 760px; }
}

.table-viewport-tbl-meli td:nth-child(5){
  white-space: normal;
}

.table-responsive.table-viewport-tbl-meli > table.table{
  width: auto !important;
}

.table-viewport-tbl-meli thead th{
  background: #fff; 
}

@media (min-width: 769px){
  .table-responsive.table-viewport-tbl-meli .h-scroll-md-meli > table.table{
    width: 100% !important;
    min-width: 0 !important;        
  }
  .table-responsive.table-viewport-tbl-meli .h-scroll-md-meli > table.table th,
  .table-responsive.table-viewport-tbl-meli .h-scroll-md-meli > table.table td{
    white-space: normal !important;   
  }
}

@media (max-width: 768px){
  .table-responsive.table-viewport-tbl-meli,
  .table-viewport-tbl-meli .h-scroll-md-meli{
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }

  .table-responsive.table-viewport-tbl-meli .h-scroll-md-meli > table.table{
    width: auto !important;      
    min-width: 760px !important;    
  }

  .table-responsive.table-viewport-tbl-meli .h-scroll-md-meli > table.table th,
  .table-responsive.table-viewport-tbl-meli .h-scroll-md-meli > table.table td{
    white-space: nowrap;
  }

  .table-responsive.table-viewport-tbl-meli .h-scroll-md-meli > table.table td.desc-cell-tbl-meli{
    white-space: normal;
  }
}

@media (min-width: 769px){
  .table-macos-tbl-meli th,
  .table-macos-tbl-meli td{
    min-width: auto !important;
  }
}
/* ===== FIN TABLA RESPONSIVE EN MOBILE ===== */

/* Tamaño consistente del círculo de imagen (evita saltos) */
.img-col-tbl-meli .img-wrap-tbl-meli{
  position: relative;
  width: 68px;
  height: 68px;
  border-radius: 9999px;
  overflow: hidden;
}

/* Imagen ajustada al círculo */
.img-col-tbl-meli .img-wrap-tbl-meli img.img-tbl-meli{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Overlay mientras carga (glassmorphism + spinner al centro) */
.img-col-tbl-meli .img-overlay{
  position: absolute;
  inset: 0;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, rgba(255,255,255,0.66), rgba(245,245,255,0.50));
  backdrop-filter: blur(6px) saturate(120%);
  -webkit-backdrop-filter: blur(6px) saturate(120%);
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65);
}

/* Spinner más sutil sobre el glass */
.img-col-tbl-meli .img-overlay .fa-spinner{
  font-size: 1rem;
  opacity: .85;
}

/* LIMITA el ancho visible a 4.5 cards (incluye 4 gaps) */
.camion-scroll-wrap-md-meli{
  --card-w: 260px;
  --gap: .9rem;

  position: relative;
  padding: .25rem 2.6rem;

  /* clave: tope de 4.5 cards visibles */
  width: min(100%, calc((var(--card-w) * 4.5) + (var(--gap) * 4)));
  margin-inline: auto;

  overflow: hidden;
}

.camion-scroll-md-meli{
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: var(--card-w);
  gap: var(--gap);
  overflow-x: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding: .2rem 0 .6rem;
}

.camion-arrow-md-meli[disabled]{
  opacity:.4;
  pointer-events:none;
  box-shadow:none;
}

/* ===== Estado vacío: ocupar 100% del ancho ===== */
.camion-scroll-wrap-md-meli.is-empty{
  width: 100%;
  padding-inline: .25rem;          
}

.camion-scroll-wrap-md-meli.is-empty .camion-arrow-md-meli{
  display: none;                    
}

.camion-scroll-wrap-md-meli.is-empty .camion-scroll-md-meli{
  display: block;                 
  overflow: visible;
  padding: .4rem 0;
}

.camion-empty-md-meli{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  width: 100%;
  min-height: 92px;
  border: 1px dashed #cc6b10;
  border-radius: 12px;
  background: #ffeed2;
  color: #cc6b10;
  font-weight: 800;
  letter-spacing: .2px;
}
.camion-empty-md-meli i{ font-size: 1.1rem; opacity:.9; }

.camion-scroll-wrap-md-meli:has(.camion-empty-md-meli){
  width: 100%;
  padding-inline: .25rem;
}
.camion-scroll-wrap-md-meli:has(.camion-empty-md-meli) .camion-arrow-md-meli{
  display:none;
}
.camion-scroll-wrap-md-meli:has(.camion-empty-md-meli) .camion-scroll-md-meli{
  display:block; overflow:visible; padding:.4rem 0;
}