.mssn-pos-wrap{max-width:1100px;margin:0 auto;padding:16px;background:#fff;border:1px solid #e5e7eb;border-radius:14px;box-shadow:0 6px 22px rgba(0,0,0,.06);font-size:20px;line-height:1.35}
/* Desktop ancho: aprovechar toda la pantalla disponible */
@media (min-width: 1200px){
  .mssn-pos-wrap{max-width:none;}
}
.mssn-pos-header{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:12px}
.mssn-pos-header h2{margin:0;font-size:32px}
.mssn-pos-sub{margin-top:6px}
.mssn-chip{display:inline-block;padding:6px 10px;border:1px solid #e5e7eb;border-radius:999px;font-size:18px;background:#f9fafb}
.mssn-chip-warn{background:#fff7ed;border-color:#fed7aa}

.mssn-pos-meta{display:grid;grid-template-columns:1fr 1fr 220px;gap:12px;margin:12px 0 16px}
.mssn-field label{display:block;font-weight:700;margin-bottom:6px;font-size:18px}
.mssn-field input,.mssn-field select{width:100%;padding:14px 16px;border:1px solid #d1d5db;border-radius:14px;font-size:20px}
.mssn-field small{display:block;margin-top:6px;opacity:.75}

.mssn-pos-tablewrap{border:1px solid #e5e7eb;border-radius:12px;overflow:hidden}
.mssn-pos-table{width:100%;border-collapse:collapse}
.mssn-pos-table thead th{background:#f9fafb;border-bottom:1px solid #e5e7eb;padding:12px 14px;text-align:left;font-weight:800;font-size:18px}
.mssn-pos-table td{border-bottom:1px solid #f1f5f9;padding:12px 14px;vertical-align:middle;font-size:18px}
.mssn-pos-table input{width:100%;padding:14px 14px;border:1px solid #d1d5db;border-radius:14px;font-size:20px}
.mssn-line-total{font-weight:700}
/* Botón "tache" para eliminar productos: más visible y en rojo */
.mssn-remove{
  width:48px;
  height:48px;
  border-radius:12px;
  border:2px solid rgba(185,28,28,.35);
  background:#fff;
  color:#b91c1c;
  font-weight:900;
  font-size:28px;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.mssn-remove:hover{
  background: rgba(185,28,28,.08);
  border-color: rgba(185,28,28,.6);
}
.mssn-remove:focus{
  outline: 3px solid rgba(185,28,28,.25);
  outline-offset: 2px;
}

/* Locked product row (selected from memory): prevent editing name/price in frontend */
.mssn-row-locked .mssn-product[readonly],
.mssn-row-locked .mssn-unit[readonly]{
  background: #f3f4f6;
  border-color: #e5e7eb;
  cursor: not-allowed;
}

.mssn-pos-total{display:flex;justify-content:flex-end;gap:14px;align-items:center;padding:12px}
.mssn-total-label{opacity:.7;font-weight:700}
.mssn-total-value{font-size:34px;font-weight:900}
.mssn-pos-iva{display:flex;justify-content:space-between;align-items:center;padding:8px 12px}
.mssn-iva-toggle{display:flex;align-items:center;gap:10px;font-weight:800;opacity:.75}
.mssn-iva-toggle input{width:18px;height:18px}
.mssn-iva-value{display:flex;align-items:baseline;gap:10px}
.mssn-iva-label{opacity:.7;font-weight:700}
.mssn-iva-amount{font-weight:800}

/* Descuento (monto fijo que se resta del total) */
.mssn-pos-discount{display:flex;justify-content:space-between;align-items:center;padding:8px 12px}
.mssn-discount-label{opacity:.7;font-weight:800}
.mssn-discount-value{display:flex;align-items:center;gap:8px}
.mssn-discount-currency{opacity:.7;font-weight:800}
.mssn-discount-input{width:140px;max-width:160px;padding:10px 12px;border:1px solid #e5e7eb;border-radius:12px;font-weight:900;text-align:right}
.mssn-discount-input:focus{outline:none;border-color:#111827;box-shadow:0 0 0 3px rgba(17,24,39,.12)}

.mssn-pos-footer{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:14px}
.mssn-status{font-weight:600;opacity:.9}
.mssn-status.ok{color:#047857}
.mssn-status.err{color:#b91c1c}

.mssn-btn{appearance:none;border:1px solid #e5e7eb;background:#fff;border-radius:14px;padding:14px 18px;font-weight:900;font-size:20px;cursor:pointer}
.mssn-btn:hover{background:#f8fafc}
.mssn-btn:disabled{opacity:.5;cursor:not-allowed}
.mssn-btn-primary{border-color:#111827;background:#111827;color:#fff}

/* CTA grande: al terminar venta, el botón de footer cambia a "Nueva nota" */
.mssn-btn-newnote{
  font-size:22px;
  padding:18px 20px;
  display:block;
  width:90%;
  max-width:520px;
  margin:10px auto 0;
}

.mssn-pos-footer{gap:10px; align-items:flex-start;}

.mssn-btn-primary:hover{background:#0b1220}

.mssn-pos-result{margin-top:16px}
.mssn-card{border:1px solid #e5e7eb;border-radius:14px;padding:14px;background:#f9fafb}
.mssn-card h3{margin:0 0 10px;font-size:22px}
.mssn-result-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.mssn-pre{white-space:pre-wrap;background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:12px;max-height:240px;overflow:auto;font-size:16px}

@media (max-width: 900px){
  .mssn-pos-meta{grid-template-columns:1fr;}
}

/* =====================
   Mobile responsiveness (shortcodes + Nota de Venta)
   ===================== */
@media (max-width: 640px){
  /* General sizing */
  .mssn-pos-wrap{padding:12px;border-radius:12px;font-size:16px}
  .mssn-chip{font-size:14px;padding:6px 10px}

  /* Header + actions */
  .mssn-pos-header{flex-direction:column;align-items:flex-start}
  .mssn-pos-header h2{font-size:24px}
  .mssn-pos-actions{width:100%}
  .mssn-pos-actions .mssn-btn{width:100%}

  /* Meta fields */
  .mssn-field label{font-size:14px;margin-bottom:6px}
  .mssn-field input,.mssn-field select{padding:12px 12px;border-radius:12px;font-size:16px}

  /* Tables: allow horizontal scroll instead of romper el layout */
  .mssn-pos-tablewrap{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}
  /* En móvil prioriza visibilidad del Producto (antes quedaba muy escondido) */
  .mssn-pos-table{min-width:720px}

  /* Rebalanceo de columnas para que "Producto" quede visible desde el inicio */
  .mssn-pos-table thead th:nth-child(1),
  .mssn-pos-table tbody td:nth-child(1){
    width:70px !important;
    min-width:70px !important;
  }
  .mssn-pos-table thead th:nth-child(2),
  .mssn-pos-table tbody td:nth-child(2){
    width:130px !important;
    min-width:130px !important;
  }
  .mssn-pos-table thead th:nth-child(4),
  .mssn-pos-table tbody td:nth-child(4){
    width:120px !important;
    min-width:120px !important;
  }
  .mssn-pos-table thead th:nth-child(5),
  .mssn-pos-table tbody td:nth-child(5){
    width:120px !important;
    min-width:120px !important;
  }
  .mssn-pos-table thead th:nth-child(6),
  .mssn-pos-table tbody td:nth-child(6){
    width:52px !important;
    min-width:52px !important;
  }
  .mssn-pos-table thead th:nth-child(3),
  .mssn-pos-table tbody td:nth-child(3){
    min-width:220px !important;
  }

  /* Producto más claro/visible en móvil */
  .mssn-pos-table tbody td:nth-child(3){
    background: rgba(59,130,246,.05);
  }
  .mssn-pos-table input.mssn-product{
    font-weight: 900;
    border-width: 2px;
    border-color: rgba(17,24,39,.25);
  }

  /* Dark theme (móvil): mismo énfasis pero con contraste correcto */
  .mssn-pos-shortcode[data-mssn-theme="dark"] .mssn-pos-table tbody td:nth-child(3){
    background: rgba(59,130,246,.12);
  }
  .mssn-pos-shortcode[data-mssn-theme="dark"] .mssn-pos-table input.mssn-product{
    border-color: rgba(148,163,184,.35);
  }
  .mssn-pos-table thead th{font-size:14px;padding:10px 10px}
  .mssn-pos-table td{font-size:14px;padding:10px 10px}
  .mssn-pos-table input{padding:12px 12px;border-radius:12px;font-size:16px}

  /* Remove button smaller */
  .mssn-remove{width:40px;height:40px;border-radius:12px;font-size:22px}

  /* Totals + footer */
  .mssn-total-value{font-size:26px}
  .mssn-pos-footer{flex-direction:column;align-items:stretch}
  .mssn-pos-footer .mssn-btn{width:100%}
  .mssn-result-actions .mssn-btn{width:100%}

  /* Note (talonario) */
  .mssn-note-head{flex-direction:column;align-items:stretch}
  .mssn-note-folio{align-self:flex-end}
  .mssn-store-mini-name{font-size:20px}
  .mssn-note-folio-value{font-size:26px}
  .mssn-thanks{font-size:16px}
}

@media (max-width: 420px){
  .mssn-pos-wrap{padding:10px}
  .mssn-btn{font-size:16px;padding:12px 14px;border-radius:12px}
  .mssn-btn-newnote{font-size:18px;padding:14px 16px;width:100%}
}



/* --- v1.0.1 UI polish + store selector step --- */
.mssn-pos-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-start}
.mssn-muted{margin:6px 0 14px;opacity:.75}
.mssn-store-step{margin-top:14px}
.mssn-card-hero{padding:18px}
.mssn-store-grid{display:grid;grid-template-columns:1fr 220px;gap:12px;align-items:end}
.mssn-store-grid .mssn-field{margin:0}
.mssn-pos-form{margin-top:14px}

@media (max-width: 900px){
  .mssn-store-grid{grid-template-columns:1fr;}
  .mssn-pos-actions{width:100%;justify-content:flex-start}
}


/* --- v1.0.2 store info + legal notices --- */
.mssn-store-info-card{margin: 0 0 12px;}
.mssn-store-card{background:#fff;}
.mssn-store-card-title{font-size:16px;font-weight:800;margin-bottom:8px}
.mssn-si{display:grid;gap:6px}
.mssn-si-row{display:flex;gap:10px;align-items:flex-start}
.mssn-si-k{min-width:95px;font-weight:800;opacity:.8}
.mssn-si-v{opacity:.95}
.mssn-legal-card{border:1px dashed #e5e7eb;border-radius:14px;padding:12px;background:#fff;margin:0 0 14px}
.mssn-legal-title{font-weight:900;margin-bottom:6px}
.mssn-legal-list{margin:0 0 0 18px;opacity:.9}
.mssn-mini-meta{margin:6px 0 2px;padding:10px 12px;background:#fff;border:1px solid #e5e7eb;border-radius:12px}
.mssn-mini-meta > div{margin:4px 0}


/* --- v1.0.3 compact note layout (como talonario) --- */
.mssn-note-paper{
  max-width:520px;
  margin:12px auto 0;
  background:#fff;
  border:1px solid #d1d5db;
  border-radius:10px;
  padding:16px 16px 14px;
  box-shadow:none;
  font-size:20px;
}
@media (max-width:640px){
  .mssn-note-paper{ max-width:100%; }
}

/* Desktop: la nota debe ocupar el ancho completo para trabajar cómodo en PC */
@media (min-width: 992px){
  .mssn-note-paper{
    max-width:none;
    width:100%;
    margin:14px 0 0;
    padding:20px 20px 18px;
  }
  .mssn-note-paper .mssn-pos-meta{
    grid-template-columns: 1fr 1fr 260px;
    gap:16px;
  }
  .mssn-note-paper .mssn-field-pay{ grid-column:auto; }
  .mssn-note-paper .mssn-pos-table thead th{ font-size:18px; }
  .mssn-note-paper .mssn-pos-table td{ padding:10px 10px; }
}

.mssn-note-head{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:flex-start;
  border-bottom:1px solid #e5e7eb;
  padding-bottom:12px;
  margin-bottom:14px;
}

.mssn-note-store{ font-size:17px; line-height:1.35; }
.mssn-store-mini-name{ font-size:24px; font-weight:900; line-height:1.1; margin-bottom:2px; }
.mssn-store-mini-desc{ font-size:17px; opacity:.85; margin-bottom:2px; }
.mssn-store-mini-line{ font-size:17px; opacity:.9; }

.mssn-note-folio{
  border:1px solid #b91c1c;
  border-radius:6px;
  padding:6px 10px;
  min-width:96px;
  text-align:center;
}
.mssn-note-folio-label{
  font-size:16px;
  font-weight:900;
  color:#b91c1c;
  letter-spacing:.6px;
}
.mssn-note-folio-value{
  font-size:32px;
  font-weight:900;
  color:#b91c1c;
  letter-spacing:1px;
  line-height:1;
  margin-top:2px;
}

.mssn-note-paper .mssn-pos-meta{
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin:14px 0 14px;
}
@media (max-width:640px){
  .mssn-note-paper .mssn-pos-meta{ grid-template-columns:1fr; }
}

.mssn-note-paper .mssn-field label{ font-size:18px; margin-bottom:8px; }
.mssn-note-paper .mssn-field input,
.mssn-note-paper .mssn-field select{
  padding:14px 14px;
  border-radius:14px;
  font-size:20px;
}
.mssn-note-paper .mssn-field small{ font-size:16px; margin-top:8px; }

.mssn-field-pay{ grid-column:1 / -1; }

/* Mixed payment (2 methods) */
.mssn-pay-mixed{
  margin-top: 10px;
  padding: 10px;
  border: 1px dashed rgba(0,0,0,.15);
  border-radius: 12px;
}

.mssn-pay-row{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 10px;
}

@media (max-width: 600px){
  .mssn-pay-row{
    grid-template-columns: 1fr;
  }
}

.mssn-mixed-warning{
  margin-top: 8px;
  font-size: 16px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(220,38,38,.25);
  background: rgba(220,38,38,.08);
}

.mssn-note-paper .mssn-pos-tablewrap{ border-radius:12px; margin-bottom:14px; }
.mssn-note-paper .mssn-pos-table thead th{ padding:12px 12px; font-size:18px; }
.mssn-note-paper .mssn-pos-table td{ padding:12px 12px; }
.mssn-note-paper .mssn-pos-total{ padding:12px 10px; }

.mssn-thanks{
  margin:14px 2px 10px;
  font-weight:700;
  font-style:italic;
  opacity:.9;
  font-size:18px;
}

.mssn-legal-mini{
  border:none;
  border-top:1px solid #e5e7eb;
  border-radius:0;
  padding:12px 0 0;
  margin:0;
  background:transparent;
}
.mssn-legal-mini .mssn-legal-title{ font-size:17px; margin-bottom:6px; }
.mssn-legal-mini .mssn-legal-list{ font-size:17px; margin:0 0 0 18px; opacity:.95; }


.mssn-addline-row{display:flex;align-items:center;gap:10px;margin-top:12px}
.mssn-btn-plus{width:40px;height:40px;line-height:40px;border-radius:12px;border:1px solid rgba(0,0,0,.15);background:#fff;font-weight:900;font-size:22px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.mssn-btn-plus:hover{transform:translateY(-1px)}
.mssn-addline-text{font-size:18px;color:rgba(0,0,0,.75)}

/* --- v1.0.7 impresión de nota --- */

.mssn-print-only{display:none;}

/* --- v1.0.19: Full-width layout on desktop (break out of theme content width) --- */
@media (min-width: 992px){
  .mssn-pos-wrap{
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-left: 28px;
    padding-right: 28px;
    box-sizing: border-box;
    overflow-x: clip;
  }
  /* Keep the note comfortable on very large screens */
  .mssn-note-paper{
    width: min(1400px, 100%);
    margin-left: auto;
    margin-right: auto;
  }
}

@media print{
  /*
    Ticket térmico: evitar "páginas" largas.
    Nota: algunos drivers pueden ignorar size:auto; por eso el botón de "Imprimir"
    usa un iframe con altura dinámica, pero esto también ayuda si alguien usa Ctrl+P.
  */
  /* Papel térmico: intenta forzar ancho de ticket y eliminar márgenes (menos desperdicio). */
  @page{size:80mm auto; margin:0;}

  html, body{width:80mm !important; height:auto !important; margin:0 !important; padding:0 !important; overflow:hidden !important;}

  /* Quita UI de WP */
  #wpadminbar{display:none !important;}
  body{background:#fff !important;}

  /* Imprimir SOLO la nota */
  body *{visibility:hidden !important;}
  #mssnNotePaper, #mssnNotePaper *{visibility:visible !important;}
  #mssnNotePaper{
    position:absolute !important;
    left:0 !important;
    top:0 !important;
    margin:0 !important;
    max-width:none !important;
    width:100% !important;
    border:none !important;
    border-radius:0 !important;
    box-shadow:none !important;
    padding:0 !important;
  }

  /* Imprime SOLO el ticket compacto */
  #mssnNotePaper > *:not(#mssnPrintTicket){display:none !important;}
  #mssnPrintTicket{display:block !important; margin:0 !important; padding:2mm 2mm 0 2mm !important;}

  /* Estilo compacto tipo ticket */
  #mssnPrintTicket{font-size:16px;line-height:1.35;color:#111;}
  /* Bigger typography for readability */
  #mssnPrintTicket .mssn-pt{width:100%;font-size:16px;line-height:1.35;}
  #mssnPrintTicket .mssn-pt-title{font-size:18px;font-weight:900;text-align:center;margin:0 0 4px;}
  #mssnPrintTicket .mssn-pt-meta{font-size:16px;margin:0 0 2px;}
  #mssnPrintTicket .mssn-pt-sep{border-top:1px dashed #111;margin:6px 0;}
  #mssnPrintTicket .mssn-pt-row{display:flex;justify-content:space-between;gap:10px;}
  #mssnPrintTicket .mssn-pt-row .l{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  #mssnPrintTicket .mssn-pt-row .r{white-space:nowrap;text-align:right;}
  #mssnPrintTicket .mssn-pt-total{font-size:18px;font-weight:900;margin-top:4px;}
  #mssnPrintTicket .mssn-pt-footer{font-size:15px;text-align:center;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  #mssnPrintTicket .mssn-pt-notes{font-size:15px;text-align:center;margin-top:6px;white-space:pre-wrap;word-break:break-word;}
}


/* --- v1.0.20: Full-bleed on desktop (salir del contenedor del tema) --- */
@media (min-width: 992px){
  /* El wrapper del shortcode rompe el max-width del tema */
  .mssn-pos-shortcode{
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-left: 28px !important;
    padding-right: 28px !important;
    box-sizing: border-box !important;
  }
  /* La nota ocupa todo el ancho disponible del wrapper */
  .mssn-pos-shortcode .mssn-pos-wrap{
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto !important;
  }
  .mssn-pos-shortcode .mssn-note-paper{
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}


/* Expense (Gasto) */
.mssn-btn-warn{background:#fff7ed;border-color:#fed7aa}
.mssn-btn-warn:hover{filter:brightness(.99)}
.mssn-topbar{display:flex;justify-content:flex-end;gap:10px;margin:0 0 10px}
/* Multi-notes (tabs) */
.mssn-notesbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}
.mssn-notes-tabs{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.mssn-note-tabwrap{display:flex;align-items:stretch;border:1px solid #e5e7eb;border-radius:14px;overflow:hidden;background:#fff}
.mssn-note-tab{border:0;background:transparent;padding:10px 12px;font-weight:800;font-size:16px;cursor:pointer;white-space:nowrap}
.mssn-note-tab.is-active{background:#111;color:#fff}
.mssn-note-tab.is-done{background:#ecfdf5;color:#065f46}
.mssn-note-tabwrap .mssn-note-tab-close{border:0;border-left:1px solid #e5e7eb;background:transparent;padding:0 10px;font-size:18px;cursor:pointer;opacity:.7}
.mssn-note-tabwrap .mssn-note-tab-close:hover{opacity:1}
.mssn-note-tabwrap .mssn-note-tab-close:disabled{opacity:.25;cursor:not-allowed}

.mssn-note-tab-rename{
  background: transparent;
  border: 0;
  padding: 0 8px;
  cursor: pointer;
  opacity: 0.75;
  font-size: 12px;
  line-height: 1;
}

.mssn-note-tab-rename:hover{
  opacity: 1;
}

.mssn-note-tab-rename:disabled{
  cursor: default;
  opacity: 0.35;
}

.mssn-note-tabwrap.is-saving .mssn-note-tab{
  opacity: 0.85;
}

@media (max-width:700px){
  .mssn-notesbar{flex-direction:column;align-items:stretch}
  .mssn-notesbar #mssnNotesAdd{width:100%}
}
.mssn-expense-panel{width:100%;margin-top:10px;padding:10px;border:1px solid #e5e7eb;border-radius:12px;background:#fff;display:grid;grid-template-columns:1fr 160px 200px;gap:10px;align-items:end}
.mssn-expense-row label{display:block;font-weight:800;margin-bottom:8px;font-size:18px}
.mssn-expense-row input,
.mssn-expense-row select{width:100%;height:52px;border:1px solid #e5e7eb;border-radius:14px;padding:0 14px;font-size:20px;outline:none;background:#fff}
.mssn-expense-actions{grid-column:1 / -1;display:flex;justify-content:flex-end;gap:10px;margin-top:2px}
.mssn-expense-msg{grid-column:1 / -1;margin-top:8px;font-size:16px;opacity:.95}
.mssn-expense-msg.ok{color:#065f46}
.mssn-expense-msg.err{color:#b91c1c}
@media (max-width:700px){
  .mssn-expense-panel{grid-template-columns:1fr}
}



/* =====================
   Team (Equipo) frontend
   ===================== */
.mssn-team-card{padding:16px}
.mssn-team-head{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}
.mssn-team-sub{font-size:14px;opacity:.75}
.mssn-team-grid{display:grid;grid-template-columns:1fr 1.7fr;gap:14px}
.mssn-team-panel{background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:12px}
.mssn-team-form .mssn-field{margin-bottom:10px}
.mssn-team-form label,.mssn-team-edit label{display:block;font-weight:700;margin-bottom:6px}
.mssn-team-form input,.mssn-team-form select,.mssn-team-edit input,.mssn-team-edit select{width:100%;height:44px;border:1px solid #e5e7eb;border-radius:12px;padding:0 12px;font-size:16px;outline:none;background:#fff}
.mssn-team-inline{display:flex;align-items:center;gap:10px}
.mssn-team-inline input[type=checkbox]{width:18px;height:18px;margin:0}
.mssn-team-tablewrap{overflow:auto;border:1px solid #e5e7eb;border-radius:12px}
.mssn-team-table{width:100%;border-collapse:collapse;font-size:14px}
.mssn-team-table th,.mssn-team-table td{padding:10px;border-bottom:1px solid #f3f4f6;vertical-align:top;text-align:left}
.mssn-team-table th{font-weight:800;background:#fafafa}
.mssn-team-edit{margin-top:10px}
.mssn-team-editgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mssn-team-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:10px}
.mssn-team-note{margin-top:12px;font-size:13px;opacity:.8}
.mssn-status.ok{color:#065f46}
.mssn-status.err{color:#b91c1c}
.mssn-badge{display:inline-block;padding:3px 8px;border-radius:999px;font-size:12px;font-weight:700}
.mssn-badge-ok{background:#ecfdf5;color:#065f46;border:1px solid #a7f3d0}
.mssn-badge-off{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca}
@media (max-width:900px){.mssn-team-grid{grid-template-columns:1fr}}
@media (max-width:700px){.mssn-team-editgrid{grid-template-columns:1fr}}


/* ===== UPDATE 2: Draft cache (modal + reset) ===== */
.mssn-btn-ghost{background:transparent;border-color:#e5e7eb;color:#111827}
.mssn-btn-ghost:hover{background:#f3f4f6}
.mssn-modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;padding:16px;z-index:9999}
.mssn-modal{background:#fff;border-radius:16px;max-width:520px;width:100%;padding:18px 18px;border:1px solid #e5e7eb;box-shadow:0 20px 60px rgba(0,0,0,.22)}
.mssn-modal h3{margin:0 0 6px 0;font-size:18px}
.mssn-modal p{margin:0 0 14px 0}
.mssn-modal-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
@media (max-width:480px){.mssn-modal-actions{justify-content:stretch}.mssn-modal-actions .mssn-btn{width:100%}}

/* =========================================================
   UX polish (v1.0.88) — frontend POS + Nota de Venta
   Objetivo: mejor lectura en escritorio y mejor tacto en móvil
   ========================================================= */
.mssn-pos-wrap, .mssn-pos-wrap *{box-sizing:border-box}
.mssn-pos-wrap{padding:18px}
@media (max-width:720px){
  .mssn-pos-wrap{padding:12px}
}

/* Headings scale nicer */
.mssn-pos-header h2{font-size:clamp(22px,3.2vw,34px);line-height:1.15}
.mssn-pos-sub{opacity:.9}

/* Cards + inputs: soften a bit */
.mssn-card, .mssn-card-hero, .mssn-pos-card{border-radius:16px}
.mssn-field input, .mssn-field select{border-radius:14px}
.mssn-field input:focus, .mssn-field select:focus{outline:none;box-shadow:0 0 0 3px rgba(17,24,39,.08)}

/* Buttons: consistent tap area */
.mssn-btn{border-radius:14px}
.mssn-btn:active{transform:translateY(1px)}

/* Tables on desktop: breathe a little */
.mssn-pos-tablewrap{border-radius:14px}
@media (min-width:900px){
  .mssn-pos-table thead th{padding-top:12px;padding-bottom:12px}
  .mssn-pos-table td{vertical-align:middle}
}

/* Sticky footer action (mobile only) */
@media (max-width:720px){
  .mssn-pos-footer{
    position:sticky;
    bottom:0;
    z-index:20;
    background:rgba(255,255,255,.92);
    -webkit-backdrop-filter:blur(8px);
    backdrop-filter:blur(8px);
    border-top:1px solid rgba(229,231,235,.9);
    padding:12px 10px;
    margin-left:-12px;
    margin-right:-12px;
    border-radius:0;
  }
}

/* Notes tabs bar: allow swipe + keep tidy */
.mssn-notesbar{gap:10px}
.mssn-notes-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.mssn-notes-tabs::-webkit-scrollbar{display:none}


/* =====================================================
   v1.0.92 — Neo 3D UI + Modo Claro/Obscuro (frontend POS)
   - Tema por variables (scoped a .mssn-pos-shortcode)
   - Sombra 3D suave + gradientes
   - Toggle Claro/Obscuro con persistencia (localStorage)
   - Oculta tarjeta de info de tienda en pantalla (ya va en el ticket)
   ===================================================== */

.mssn-pos-shortcode{
  --mssn-bg:#f3f6ff;
  --mssn-bg2:#f8f7ff;
  --mssn-surface:#ffffff;
  --mssn-surface2:#f8fafc;
  --mssn-text:#0b1220;
  --mssn-muted:rgba(11,18,32,.68);
  --mssn-border:rgba(15,23,42,.14);
  --mssn-border2:rgba(15,23,42,.08);
  --mssn-accent:#4f46e5; /* indigo */
  --mssn-accent2:#06b6d4; /* cyan */
  --mssn-success:#16a34a;
  --mssn-danger:#dc2626;
  --mssn-warn:#f59e0b;
  --mssn-input-bg:#ffffff;
  --mssn-ring:rgba(79,70,229,.28);

  --mssn-shadow-lg: 0 18px 55px rgba(15,23,42,.12), 0 2px 0 rgba(255,255,255,.85) inset;
  --mssn-shadow-md: 0 12px 34px rgba(15,23,42,.12), 0 1px 0 rgba(255,255,255,.85) inset;
  --mssn-shadow-sm: 0 7px 18px rgba(15,23,42,.10), 0 1px 0 rgba(255,255,255,.70) inset;

  background:
    radial-gradient(1200px 620px at 18% 0%, rgba(79,70,229,.14), transparent 55%),
    radial-gradient(900px 560px at 82% 10%, rgba(6,182,212,.12), transparent 55%),
    linear-gradient(180deg, var(--mssn-bg), var(--mssn-bg2));
  padding: 18px 0;
}

.mssn-pos-shortcode[data-mssn-theme="dark"]{
  --mssn-bg:#070a13;
  --mssn-bg2:#0b1020;
  --mssn-surface:#0f172a;
  --mssn-surface2:#0b1220;
  --mssn-text:#eef2ff;
  --mssn-muted:rgba(238,242,255,.68);
  --mssn-border:rgba(148,163,184,.24);
  --mssn-border2:rgba(148,163,184,.16);
  --mssn-input-bg:#0b1220;
  --mssn-ring:rgba(99,102,241,.35);

  --mssn-shadow-lg: 0 18px 55px rgba(0,0,0,.50), 0 1px 0 rgba(255,255,255,.05) inset;
  --mssn-shadow-md: 0 12px 34px rgba(0,0,0,.45), 0 1px 0 rgba(255,255,255,.04) inset;
  --mssn-shadow-sm: 0 7px 18px rgba(0,0,0,.35), 0 1px 0 rgba(255,255,255,.03) inset;

  background:
    radial-gradient(1200px 620px at 18% 0%, rgba(99,102,241,.16), transparent 55%),
    radial-gradient(900px 560px at 82% 10%, rgba(34,211,238,.12), transparent 55%),
    linear-gradient(180deg, var(--mssn-bg), var(--mssn-bg2));
}

/* Reset base dentro del shortcode */
.mssn-pos-shortcode, .mssn-pos-shortcode *{ box-sizing:border-box; }
.mssn-pos-shortcode{ color: var(--mssn-text); }
.mssn-pos-shortcode a{ color: var(--mssn-accent); }

/* Wrapper principal */
.mssn-pos-shortcode .mssn-pos-wrap{
  background: linear-gradient(180deg, var(--mssn-surface), var(--mssn-surface2));
  border: 1px solid var(--mssn-border);
  border-radius: 22px;
  box-shadow: var(--mssn-shadow-lg);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
}

/* Header + chips */
.mssn-pos-shortcode .mssn-pos-header h2{ letter-spacing:-.02em; }
.mssn-pos-shortcode .mssn-chip{
  background: rgba(255,255,255,.65);
  border: 1px solid var(--mssn-border2);
  box-shadow: var(--mssn-shadow-sm);
}
.mssn-pos-shortcode[data-mssn-theme="dark"] .mssn-chip{
  background: rgba(15,23,42,.75);
}
.mssn-pos-shortcode .mssn-chip-warn{
  background: rgba(245,158,11,.10);
  border-color: rgba(245,158,11,.25);
}

/* Cards */
.mssn-pos-shortcode .mssn-card{
  background: rgba(255,255,255,.65);
  border: 1px solid var(--mssn-border2);
  border-radius: 18px;
  box-shadow: var(--mssn-shadow-md);
}
.mssn-pos-shortcode[data-mssn-theme="dark"] .mssn-card{
  background: rgba(15,23,42,.70);
}

/* Inputs + selects */
.mssn-pos-shortcode .mssn-field label{ color: var(--mssn-text); }
.mssn-pos-shortcode .mssn-field small{ color: var(--mssn-muted); opacity:1; }

.mssn-pos-shortcode .mssn-field input,
.mssn-pos-shortcode .mssn-field select,
.mssn-pos-shortcode .mssn-pos-table input,
.mssn-pos-shortcode .mssn-expense-row input,
.mssn-pos-shortcode .mssn-expense-row select{
  background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(255,255,255,.78));
  border: 1px solid var(--mssn-border);
  color: var(--mssn-text);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65), inset 0 -2px 0 rgba(15,23,42,.05);
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}

.mssn-pos-shortcode[data-mssn-theme="dark"] .mssn-field input,
.mssn-pos-shortcode[data-mssn-theme="dark"] .mssn-field select,
.mssn-pos-shortcode[data-mssn-theme="dark"] .mssn-pos-table input,
.mssn-pos-shortcode[data-mssn-theme="dark"] .mssn-expense-row input,
.mssn-pos-shortcode[data-mssn-theme="dark"] .mssn-expense-row select{
  background: linear-gradient(180deg, rgba(11,18,32,.95), rgba(15,23,42,.85));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), inset 0 -2px 0 rgba(0,0,0,.40);
}

.mssn-pos-shortcode .mssn-field input:focus,
.mssn-pos-shortcode .mssn-field select:focus,
.mssn-pos-shortcode .mssn-pos-table input:focus,
.mssn-pos-shortcode .mssn-expense-row input:focus,
.mssn-pos-shortcode .mssn-expense-row select:focus{
  outline: none;
  border-color: rgba(79,70,229,.55);
  box-shadow: 0 0 0 4px var(--mssn-ring), inset 0 1px 0 rgba(255,255,255,.55);
  transform: translateY(-1px);
}

/* Tabla */
.mssn-pos-shortcode .mssn-pos-tablewrap{
  border: 1px solid var(--mssn-border);
  border-radius: 18px;
  box-shadow: var(--mssn-shadow-md);
}
.mssn-pos-shortcode .mssn-pos-table thead th{
  background:
    radial-gradient(800px 160px at 20% 0%, rgba(79,70,229,.10), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.95), rgba(248,250,252,.85));
  border-bottom: 1px solid var(--mssn-border);
  color: var(--mssn-text);
}
.mssn-pos-shortcode[data-mssn-theme="dark"] .mssn-pos-table thead th{
  background:
    radial-gradient(800px 160px at 20% 0%, rgba(99,102,241,.18), transparent 60%),
    linear-gradient(180deg, rgba(15,23,42,.95), rgba(11,18,32,.85));
}
.mssn-pos-shortcode .mssn-pos-table td{ border-bottom: 1px solid rgba(148,163,184,.18); }

/* Totales */
.mssn-pos-shortcode .mssn-total-value{
  background: linear-gradient(90deg, var(--mssn-accent), var(--mssn-accent2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Botones (3D) */
.mssn-pos-shortcode .mssn-btn,
.mssn-pos-shortcode .mssn-btn-plus{
  border: 1px solid var(--mssn-border);
  box-shadow: var(--mssn-shadow-sm);
  transition: transform .12s ease, box-shadow .12s ease, filter .12s ease, border-color .12s ease;
}
.mssn-pos-shortcode .mssn-btn{
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.75));
  color: var(--mssn-text);
}
.mssn-pos-shortcode[data-mssn-theme="dark"] .mssn-btn{
  background: linear-gradient(180deg, rgba(15,23,42,.95), rgba(11,18,32,.85));
}
.mssn-pos-shortcode .mssn-btn:hover,
.mssn-pos-shortcode .mssn-btn-plus:hover{
  transform: translateY(-1px);
  filter: brightness(1.02);
  box-shadow: var(--mssn-shadow-md);
}
.mssn-pos-shortcode .mssn-btn:active,
.mssn-pos-shortcode .mssn-btn-plus:active{
  transform: translateY(0);
  box-shadow: inset 0 2px 10px rgba(0,0,0,.12);
}

.mssn-pos-shortcode .mssn-btn-primary{
  border-color: rgba(79,70,229,.65);
  color: #fff;
  background: linear-gradient(135deg, var(--mssn-accent), var(--mssn-accent2));
}
.mssn-pos-shortcode .mssn-btn-primary:hover{ filter: brightness(1.03); }

.mssn-pos-shortcode .mssn-btn-warn{
  border-color: rgba(245,158,11,.35);
  background: linear-gradient(135deg, rgba(245,158,11,.18), rgba(245,158,11,.08));
}

.mssn-pos-shortcode .mssn-btn-ghost{
  background: transparent;
  border-color: var(--mssn-border2);
}

/* Remove (tache) mejorado */
.mssn-pos-shortcode .mssn-remove{
  border-color: rgba(220,38,38,.35);
  color: var(--mssn-danger);
  box-shadow: var(--mssn-shadow-sm);
}
.mssn-pos-shortcode .mssn-remove:hover{ background: rgba(220,38,38,.10); border-color: rgba(220,38,38,.55); }
.mssn-pos-shortcode .mssn-remove:focus{ outline: none; box-shadow: 0 0 0 4px rgba(220,38,38,.18), var(--mssn-shadow-sm); }

/* Note paper (talonario) */
.mssn-pos-shortcode .mssn-note-paper{
  border: 1px solid var(--mssn-border);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,250,252,.72));
  box-shadow: var(--mssn-shadow-lg);
}
.mssn-pos-shortcode[data-mssn-theme="dark"] .mssn-note-paper{
  background: linear-gradient(180deg, rgba(15,23,42,.95), rgba(11,18,32,.85));
}

.mssn-pos-shortcode .mssn-note-head{ border-bottom: 1px solid var(--mssn-border2); }
.mssn-pos-shortcode .mssn-note-folio{ border-color: rgba(220,38,38,.55); box-shadow: var(--mssn-shadow-sm); }

/* Topbar layout (izq: acciones, der: tema; panel en ancho completo) */
.mssn-pos-shortcode .mssn-topbar{
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.mssn-pos-shortcode .mssn-topbar-right{ display:flex; align-items:center; gap:10px; }
.mssn-pos-shortcode .mssn-expense-panel{ flex: 1 0 100%; }

/* Theme toggle micro UI */
.mssn-pos-shortcode .mssn-theme-toggle{ display:inline-flex; align-items:center; gap:10px; }
.mssn-pos-shortcode .mssn-theme-ico{ font-size:18px; line-height:1; }
.mssn-pos-shortcode .mssn-theme-txt{ font-weight:900; }

/* Ocultar tarjeta de tienda en pantalla (el usuario la pidió fuera del frontend) */
.mssn-pos-shortcode #mssnStoreInfoCard{ display:none !important; }

/* Status */
.mssn-pos-shortcode .mssn-status.ok{ color: var(--mssn-success); }
.mssn-pos-shortcode .mssn-status.err{ color: var(--mssn-danger); }

/* Responsive: reduce shadows un poco en mobile */
@media (max-width: 640px){
  .mssn-pos-shortcode{ padding: 12px 0; }
  .mssn-pos-shortcode .mssn-pos-wrap{ border-radius: 18px; }
  .mssn-pos-shortcode .mssn-pos-tablewrap{ border-radius: 16px; }
}


/* =========================================================
   Full-width layout helpers (Team / Frontend Backoffice)
   ========================================================= */
.mssn-pos-shortcode.mssn-wide{width:100%}
.mssn-pos-shortcode.mssn-wide .mssn-pos-wrap{max-width:none;width:100%}
.mssn-pos-shortcode.mssn-wide .mssn-card{width:100%}

/* Team responsiveness polish */
.mssn-team-grid{align-items:start}
@media (min-width:901px){
  .mssn-team-grid{grid-template-columns:minmax(320px,520px) 1fr}
}
.mssn-team-panel{min-width:0}
.mssn-team-table{min-width:720px}

/* =========================================================
   v1.0.105 — Team (mssn_team) desktop polish
   - Better use of space on PC
   - Sticky left panel + sticky table header
   ========================================================= */

@media (min-width: 1024px){
  .mssn-team-card{max-width:1800px;margin:0 auto;padding:18px 18px 20px}
  .mssn-team-head{margin-bottom:16px}
  .mssn-team-grid{gap:18px}

  /* Keep the create form visible while scrolling through many vendors */
  .mssn-team-grid > .mssn-team-panel:first-child{
    position: sticky;
    top: 18px;
    align-self: start;
  }

  .mssn-team-tablewrap{
    border-radius:16px;
    box-shadow: 0 12px 32px rgba(0,0,0,.06);
  }

  .mssn-team-table{font-size:14.5px}
  .mssn-team-table th{
    position: sticky;
    top: 0;
    z-index: 2;
  }
  .mssn-team-table tbody tr:hover{background:#f9fafb}

  .mssn-team-table td:last-child{white-space:nowrap}
  .mssn-team-table td .mssn-btn{padding:10px 12px;border-radius:12px}
  .mssn-team-table td .mssn-btn + .mssn-btn{margin-left:8px}
}

/* =========================================================
   v1.0.99 — Team (mssn_team) ultra responsive + nicer mobile
   ========================================================= */
.mssn-team-card{
  background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,255,255,.62));
  border: 1px solid rgba(229,231,235,.95);
  box-shadow: 0 18px 60px rgba(0,0,0,.10);
}

.mssn-team-panel{
  background: linear-gradient(180deg, var(--mssn-surface), var(--mssn-surface2));
  border: 1px solid rgba(229,231,235,.9);
  box-shadow: 0 10px 28px rgba(0,0,0,.06);
}

.mssn-team-head h2{font-size:clamp(22px,3.2vw,34px);line-height:1.15}
.mssn-team-sub{font-size:clamp(13px,1.9vw,15px);opacity:.82}

.mssn-team-form input,
.mssn-team-form select,
.mssn-team-edit input,
.mssn-team-edit select{
  height: 50px;
  border-radius: 14px;
  border-color: rgba(203,213,225,.95);
  background: rgba(255,255,255,.88);
}

.mssn-team-form input:focus,
.mssn-team-form select:focus,
.mssn-team-edit input:focus,
.mssn-team-edit select:focus{
  outline: none;
  box-shadow: 0 0 0 4px rgba(17,24,39,.10);
}

.mssn-team-actions .mssn-btn{border-radius:14px}

/* Mobile: convert table into cards (no deformation, no horizontal scroll) */
@media (max-width: 720px){
  .mssn-team-card{padding:14px}
  .mssn-team-panel{padding:14px;border-radius:18px}
  .mssn-team-grid{gap:12px}

  .mssn-team-tablewrap{
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
  }
  .mssn-team-table{min-width:0 !important;display:block}
  .mssn-team-table thead{display:none}
  .mssn-team-table tbody{display:block}

  .mssn-team-table tr{
    display:block;
    background: linear-gradient(180deg, rgba(255,255,255,.90), rgba(255,255,255,.76));
    border:1px solid rgba(229,231,235,.95);
    border-radius:18px;
    padding:12px 12px 10px;
    margin:0 0 12px;
    box-shadow: 0 12px 34px rgba(0,0,0,.09);
  }

  .mssn-team-table td{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    padding:7px 0;
    border:0;
    border-bottom:1px dashed rgba(226,232,240,.95);
  }
  .mssn-team-table td:last-child{
    border-bottom:0;
    padding-top:10px;
    flex-direction:column;
    align-items:stretch;
    gap:10px;
  }
  .mssn-team-table td::before{
    content: attr(data-label);
    font-weight: 900;
    opacity: .70;
    padding-right: 10px;
    flex: 0 0 42%;
    max-width: 42%;
  }
  .mssn-team-table td:last-child::before{content:'';display:none}

  .mssn-team-table td .mssn-btn{
    width:100%;
    justify-content:center;
  }

  /* Make badges pop */
  .mssn-badge{padding:5px 10px;font-size:12px}
}

/* Very small screens: keep everything readable */
@media (max-width: 420px){
  .mssn-team-form input,
  .mssn-team-form select,
  .mssn-team-edit input,
  .mssn-team-edit select{height:48px}
  .mssn-team-table td::before{flex-basis:40%;max-width:40%}
}

@media (max-width: 720px){
  .mssn-team-table td[colspan]::before{display:none}
  .mssn-team-table td[colspan]{justify-content:flex-start}
}

/* =========================================================
   v1.0.101 — Mobile full-bleed + input containment
   - Full width on mobile even inside narrow theme containers
   - Prevent inputs from overflowing their containers
   ========================================================= */

@media (max-width: 720px){
  /* Full-bleed wrapper for shortcode pages */
  .mssn-pos-shortcode.alignfull{
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-left: 12px;
    padding-right: 12px;
    overflow-x: clip;
  }

  /* Safety: prevent any content from forcing horizontal overflow */
  .mssn-pos-shortcode .mssn-pos-wrap,
  .mssn-pos-shortcode .mssn-card,
  .mssn-team-panel,
  .mssn-team-grid,
  .mssn-team-editgrid{
    min-width: 0;
  }

  /* Hard guardrails for form controls */
  .mssn-pos-shortcode input,
  .mssn-pos-shortcode select,
  .mssn-pos-shortcode textarea,
  .mssn-pos-shortcode button{
    max-width: 100% !important;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }

  /* Checkbox should keep its natural size */
  .mssn-pos-shortcode input[type="checkbox"]{
    width: 18px !important;
    max-width: 18px !important;
  }
}


/* =========================================================
   v1.0.131 — Autocomplete de productos (sin límite de <datalist>)
   - Muestra muchas coincidencias (ej. 10 "bujes") para evitar duplicados
   ========================================================= */
.mssn-ac-box{
  position:absolute;
  z-index:999999;
  max-height: 420px;
  overflow:auto;
  overscroll-behavior: contain;
  background:#ffffff;
  border:1px solid rgba(15,23,42,.18);
  border-radius:14px;
  box-shadow: 0 18px 55px rgba(15,23,42,.18);
  padding:6px;
}
.mssn-ac-box.is-dark{
  background:#0f172a;
  border-color: rgba(148,163,184,.28);
  box-shadow: 0 18px 55px rgba(0,0,0,.55);
}
.mssn-ac-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 10px;
  border-radius:12px;
  cursor:pointer;
  user-select:none;
}
.mssn-ac-item:hover,
.mssn-ac-item.is-active{
  background: rgba(79,70,229,.12);
}
.mssn-ac-box.is-dark .mssn-ac-item:hover,
.mssn-ac-box.is-dark .mssn-ac-item.is-active{
  background: rgba(99,102,241,.18);
}
.mssn-ac-name{
  font-weight:650;
  font-size:14px;
  line-height:1.2;
  color:#0b1220;
}
.mssn-ac-box.is-dark .mssn-ac-name{ color:#eef2ff; }
.mssn-ac-price{
  font-size:13px;
  opacity:.85;
  white-space:nowrap;
  color:#0b1220;
}
.mssn-ac-box.is-dark .mssn-ac-price{ color:#eef2ff; opacity:.8; }
.mssn-ac-more{
  padding:8px 10px;
  font-size:12px;
  opacity:.75;
}
.mssn-ac-box.is-dark .mssn-ac-more{ color:#eef2ff; opacity:.7; }


/* =========================================================
   v1.0.131 — Autocomplete de productos (sin límite de <datalist>)
   - Muestra muchas coincidencias (ej. 10 "bujes") para evitar duplicados
   ========================================================= */
.mssn-ac-box{
  position:absolute;
  z-index:999999;
  max-height: 420px;
  overflow:auto;
  overscroll-behavior: contain;
  background:#ffffff;
  border:1px solid rgba(15,23,42,.18);
  border-radius:14px;
  box-shadow: 0 18px 55px rgba(15,23,42,.18);
  padding:6px;
}
.mssn-ac-box.is-dark{
  background:#0f172a;
  border-color: rgba(148,163,184,.28);
  box-shadow: 0 18px 55px rgba(0,0,0,.55);
}
.mssn-ac-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 10px;
  border-radius:12px;
  cursor:pointer;
  user-select:none;
}
.mssn-ac-item:hover,
.mssn-ac-item.is-active{
  background: rgba(79,70,229,.12);
}
.mssn-ac-box.is-dark .mssn-ac-item:hover,
.mssn-ac-box.is-dark .mssn-ac-item.is-active{
  background: rgba(99,102,241,.18);
}
.mssn-ac-name{
  font-weight:650;
  font-size:14px;
  line-height:1.2;
  color:#0b1220;
}
.mssn-ac-box.is-dark .mssn-ac-name{ color:#eef2ff; }
.mssn-ac-price{
  font-size:13px;
  opacity:.85;
  white-space:nowrap;
  color:#0b1220;
}
.mssn-ac-box.is-dark .mssn-ac-price{ color:#eef2ff; opacity:.8; }
.mssn-ac-more{
  padding:8px 10px;
  font-size:12px;
  opacity:.75;
}
.mssn-ac-box.is-dark .mssn-ac-more{ color:#eef2ff; opacity:.7; }


/* Mobile: show more suggestions without taking the whole screen */
@media (max-width: 640px){
  .mssn-ac-box{
    max-height: 55vh;
  }
}

/* ===== Stock status in product suggestions ===== */
.mssn-ac-item{
  align-items:flex-start;
}
.mssn-ac-meta{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:4px;
}
.mssn-ac-stock{
  display:inline-block;
  padding:2px 8px;
  border-radius:999px;
  font-size:11px;
  font-weight:700;
  line-height:1.2;
  white-space:nowrap;
}

.mssn-ac-item.stock-ok{ background: rgba(34,197,94,.08); }
.mssn-ac-item.stock-low{ background: rgba(250,204,21,.18); }
.mssn-ac-item.stock-critical,
.mssn-ac-item.stock-out{ background: rgba(239,68,68,.16); }

.mssn-ac-stock.stock-ok{ background:#dcfce7; color:#166534; }
.mssn-ac-stock.stock-low{ background:#fef3c7; color:#92400e; }
.mssn-ac-stock.stock-critical,
.mssn-ac-stock.stock-out{ background:#fee2e2; color:#991b1b; }
.mssn-ac-stock.stock-untracked{ background:#eef2ff; color:#3730a3; }

.mssn-ac-box.is-dark .mssn-ac-item.stock-ok{ background: rgba(34,197,94,.16); }
.mssn-ac-box.is-dark .mssn-ac-item.stock-low{ background: rgba(250,204,21,.20); }
.mssn-ac-box.is-dark .mssn-ac-item.stock-critical,
.mssn-ac-box.is-dark .mssn-ac-item.stock-out{ background: rgba(239,68,68,.24); }
.mssn-ac-box.is-dark .mssn-ac-stock.stock-ok{ background: rgba(22,101,52,.45); color:#dcfce7; }
.mssn-ac-box.is-dark .mssn-ac-stock.stock-low{ background: rgba(146,64,14,.45); color:#fef3c7; }
.mssn-ac-box.is-dark .mssn-ac-stock.stock-critical,
.mssn-ac-box.is-dark .mssn-ac-stock.stock-out{ background: rgba(127,29,29,.48); color:#fee2e2; }
.mssn-ac-box.is-dark .mssn-ac-stock.stock-untracked{ background: rgba(55,48,163,.42); color:#eef2ff; }