/* SNR-POS Dark Mode UI */
:root{--snr-p1:#592b73;--snr-p2:#9c338a;--snr-a1:#73c4c7;--snr-a2:#6394cc;--snr-alert:#deb533;
  /* LIGHT default */
  --snr-bg:#f6f7fb;--snr-text:#111827;--snr-surface:#ffffff;--snr-surface2:#ffffff;--snr-border:rgba(17,24,39,.12);--snr-shadow:0 12px 26px rgba(0,0,0,.18);--snr-radius:16px;--snr-muted:rgba(17,24,39,.70);--snr-muted2:rgba(17,24,39,.55)}
html[data-snr-theme="dark"], :root[data-snr-theme="dark"]{--snr-bg:#000;--snr-text:#fff;--snr-surface:#0a0a0a;--snr-surface2:#0f0f10;--snr-border:rgba(255,255,255,.10);--snr-shadow:0 12px 26px rgba(0,0,0,.65);--snr-muted:rgba(255,255,255,.72);--snr-muted2:rgba(255,255,255,.55)}
.snr-pos,.snr-dashboard{box-sizing:border-box}.snr-pos *,.snr-dashboard *{box-sizing:border-box}
.snr-row{display:flex;gap:12px;align-items:center}.snr-col{display:flex;flex-direction:column;gap:12px}.snr-grow{flex:1}.snr-gap8{gap:8px}.snr-right{margin-left:auto}
.snr-alert{padding:12px 14px;border:1px solid var(--snr-border);border-left:4px solid var(--snr-alert);background:rgba(222,181,51,.10);color:var(--snr-text);border-radius:14px}
.snr-input,.snr-select,.snr-textarea{width:100%;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));color:var(--snr-text);border:1px solid var(--snr-border);border-radius:14px;padding:10px 12px;outline:none}
.snr-btn{border:1px solid rgba(255,255,255,.14);background:linear-gradient(135deg,var(--snr-p1),var(--snr-p2));color:var(--snr-text);padding:10px 12px;border-radius:14px;cursor:pointer;font-weight:800;box-shadow:0 8px 18px rgba(0,0,0,.35)}
.snr-btn--accent{background:linear-gradient(135deg,var(--snr-a1),var(--snr-a2));color:#001013}.snr-btn--ghost{background:transparent;box-shadow:none;border-color:rgba(115,196,199,.35)}.snr-btn--danger{background:linear-gradient(135deg,rgba(222,181,51,.45),rgba(156,51,138,.45))}
.snr-pos{background:radial-gradient(1200px 600px at 10% 0%,rgba(156,51,138,.18),transparent 60%),radial-gradient(800px 500px at 80% 10%,rgba(115,196,199,.12),transparent 55%),var(--snr-bg);color:var(--snr-text);border:1px solid var(--snr-border);border-radius:var(--snr-radius);overflow:hidden;box-shadow:var(--snr-shadow)}
.snr-pos__top{padding:14px;display:flex;gap:12px;align-items:center;border-bottom:1px solid var(--snr-border);background:linear-gradient(135deg,rgba(89,43,115,.28),rgba(156,51,138,.18))}
.snr-pos__body{display:grid;grid-template-columns:1fr 380px;min-height:640px}@media (max-width:1100px){.snr-pos__body{grid-template-columns:1fr}}
.snr-products{padding:14px;border-right:1px solid var(--snr-border)}@media (max-width:1100px){.snr-products{border-right:none;border-bottom:1px solid var(--snr-border)}}
.snr-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}@media (max-width:1100px){.snr-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.snr-card{background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border:1px solid var(--snr-border);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;min-height:250px}
.snr-card__img{height:150px;background:linear-gradient(135deg,rgba(99,148,204,.10),rgba(115,196,199,.06));display:flex;align-items:center;justify-content:center}
.snr-card__img img{width:100%;height:100%;object-fit:cover}
.snr-card__body{padding:12px;display:flex;flex-direction:column;gap:8px}.snr-card__title{font-weight:900;line-height:1.2}.snr-card__meta{display:flex;justify-content:space-between;align-items:center;color:var(--snr-muted);font-size:12px}
.snr-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;border:1px solid rgba(99,148,204,.40);background:rgba(99,148,204,.08);color:var(--snr-muted)}
.snr-cart{padding:14px;background:linear-gradient(180deg,rgba(89,43,115,.18),rgba(0,0,0,0))}
.snr-cart__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.snr-cart__title{font-size:16px;font-weight:1000}
.snr-cart__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;max-height:360px;overflow:auto}
.snr-cart__item{border:1px solid var(--snr-border);background:var(--snr-surface2);border-radius:16px;padding:10px}
.snr-cart__totals{margin-top:12px;padding-top:12px;border-top:1px solid var(--snr-border);display:flex;flex-direction:column;gap:10px}
.snr-totalRow{display:flex;justify-content:space-between;color:var(--snr-muted)}.snr-totalRow strong{color:var(--snr-text)}
.snr-divider{height:1px;background:var(--snr-border);margin:6px 0}
.snr-table{width:100%;border-collapse:separate;border-spacing:0;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));border:1px solid var(--snr-border);border-radius:18px;overflow:hidden}
.snr-table th,.snr-table td{padding:10px 12px;border-bottom:1px solid var(--snr-border);text-align:left;color:var(--snr-text);font-size:13px;vertical-align:middle}
.snr-table th{background:rgba(99,148,204,.12);font-weight:1000}
.snr-table tr:last-child td{border-bottom:none}
.snr-modalBack{position:fixed;inset:0;background:rgba(0,0,0,.65);display:none;align-items:center;justify-content:center;z-index:99999}
.snr-modal{width:min(920px,92vw);background:var(--snr-surface2);border:1px solid var(--snr-border);border-radius:18px;box-shadow:var(--snr-shadow);overflow:hidden}
.snr-modal__head{padding:12px 14px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--snr-border);background:linear-gradient(135deg,rgba(89,43,115,.25),rgba(156,51,138,.18))}
.snr-modal__title{font-weight:1000}.snr-modal__body{padding:14px}.snr-modal__foot{padding:12px 14px;border-top:1px solid var(--snr-border);display:flex;gap:10px;justify-content:flex-end}


.snr-themeToggle{display:inline-flex;align-items:center;justify-content:center;min-width:44px;padding:8px 10px;border-radius:999px;border:1px solid var(--snr-border);background:var(--snr-surface2);color:var(--snr-text);cursor:pointer;font-weight:900;}

.snr-label{display:block;font-size:12px;font-weight:900;color:var(--snr-muted);margin:2px 0 6px;}

/* Override inline muted whites to theme muted */
.snr-pos [style*='color:rgba(255,255,255'],
.snr-dashboard [style*='color:rgba(255,255,255']{color:var(--snr-muted) !important;}


.snr-themeToggle--float{position:fixed;right:18px;bottom:18px;z-index:999999;padding:10px 12px;border-radius:999px;border:1px solid var(--snr-border);background:var(--snr-surface2);color:var(--snr-text);box-shadow:var(--snr-shadow);cursor:pointer;font-weight:900;}


/* =========================
   Compras / Gastos (UI)
   ========================= */
#snr-compras .snr-compras__header{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:12px;}
#snr-compras .snr-compras__title{font-weight:1000;font-size:18px;line-height:1.2;}
#snr-compras .snr-compras__subtitle{color:rgba(255,255,255,.70);font-size:12px;}
#snr-compras .snr-compras__grid{display:grid;grid-template-columns:1fr;gap:12px;}

#snr-compras .snr-card{border:1px solid var(--snr-border);border-radius:16px;background:rgba(255,255,255,.03);padding:14px;}
#snr-compras .snr-card__head{margin-bottom:10px;}
#snr-compras .snr-card__head--row{display:flex;justify-content:space-between;align-items:flex-end;gap:10px;flex-wrap:wrap;}
#snr-compras .snr-card__title{font-weight:1000;}
#snr-compras .snr-card__hint{color:rgba(255,255,255,.70);font-size:12px;}

#snr-compras .snr-form__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;}
#snr-compras .snr-field{display:flex;flex-direction:column;gap:6px;}
#snr-compras .snr-field--span2{grid-column:span 2;}
#snr-compras .snr-field--span3{grid-column:span 3;}
#snr-compras .snr-label{font-size:12px;color:rgba(255,255,255,.75);}

#snr-compras .snr-attach{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap;}
#snr-compras .snr-attach__meta{display:flex;flex-direction:column;gap:6px;min-width:220px;}
#snr-compras .snr-attach__name{font-size:12px;color:rgba(255,255,255,.75);}
#snr-compras .snr-attach__preview img{width:48px;height:48px;object-fit:cover;border-radius:12px;border:1px solid rgba(255,255,255,.18);}
#snr-compras .snr-attach__preview a{display:inline-flex;align-items:center;gap:6px;font-size:12px;}

#snr-compras .snr-form__actions{display:flex;gap:10px;justify-content:flex-start;margin-top:10px;flex-wrap:wrap;}

#snr-compras .snr-compras__filters{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
#snr-compras .snr-compras__filters .snr-select{max-width:200px;}
#snr-compras .snr-compras__filters .snr-input{max-width:320px;}

#snr-compras .snr-tableWrap{overflow:auto;border:1px solid var(--snr-border);border-radius:16px;}
#snr-compras .snr-table--compact th,#snr-compras .snr-table--compact td{padding:10px 12px;}
#snr-compras .snr-compras__pager{display:flex;justify-content:space-between;align-items:center;margin-top:10px;flex-wrap:wrap;gap:10px;}

@media (max-width: 980px){
  #snr-compras .snr-form__grid{grid-template-columns:1fr;}
  #snr-compras .snr-field--span2, #snr-compras .snr-field--span3{grid-column:span 1;}
  #snr-compras .snr-compras__filters .snr-input{max-width:100%;}
}



/* Inventario tabla scroll (Opción 1 - Mejorado) */
#snr-inventory .snr-tableWrap{
  overflow-x: scroll;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  touch-action: pan-x;
  scroll-behavior: smooth;
}

/* Permitir el gesto incluso tocando la tabla/celdas (mobile) */
#snr-inventory .snr-table,
#snr-inventory .snr-table *{
  touch-action: pan-x;
}

/* Evitar que la tabla se comprima demasiado */
#snr-inventory .snr-table{
  min-width: 980px;
}

/* Sticky primera columna SOLO en pantallas grandes */
@media (min-width: 641px){
  #snr-inventory .snr-table th:first-child,
  #snr-inventory .snr-table td:first-child{
    position: sticky;
    left: 0;
    background: var(--snr-surface2);
    z-index: 2;
    box-shadow: 8px 0 14px rgba(0,0,0,.18);
  }
  #snr-inventory .snr-table th:first-child{ z-index: 3; }
}

/* En móvil, desactivar sticky para que el scroll nunca se “trabe” */
@media (max-width: 640px){
  #snr-inventory .snr-table th:first-child,
  #snr-inventory .snr-table td:first-child{
    position: static;
    box-shadow: none;
  }
}

/* Evitar que la tabla se comprima demasiado */
#snr-inventory .snr-table{
  min-width: 900px;
}

/* Fijar primera columna (Img) al hacer scroll horizontal */
#snr-inventory .snr-table th:first-child,
#snr-inventory .snr-table td:first-child{
  position: sticky;
  left: 0;
  background: var(--snr-surface2);
  z-index: 2;
}
#snr-inventory .snr-table th:first-child{
  z-index: 3;
}


/* Dark mode containers tune */
html[data-snr-theme="dark"] #snr-inventory,
html[data-snr-theme="dark"] #snr-dashboard{
  background: radial-gradient(1200px 600px at 10% 0%, rgba(156,51,138,.10), transparent 62%),
              radial-gradient(800px 500px at 80% 10%, rgba(115,196,199,.08), transparent 58%),
              var(--snr-bg);
}

html[data-snr-theme="dark"] #snr-inventory .snr-table th:first-child,
html[data-snr-theme="dark"] #snr-inventory .snr-table td:first-child{
  box-shadow: 8px 0 14px rgba(0,0,0,.55);
}


/* Hint para tabla en móvil */
#snr-inventory .snr-inv-swipe{ margin:6px 0 10px; color:var(--snr-muted); font-size:12px; }