/* Dashboard de datos reales Eposnow → Shopify */

.store-picker { display:flex; align-items:center; gap:.5rem; font-size:.85rem; color:#aab; }
.store-picker select { padding:.35rem .6rem; border-radius:6px; background:#222634; color:#fff; border:1px solid #39405a; }

.badge-online  { background:#1b5e20; color:#c8f7d0; }
.badge-warn    { background:#7a5b00; color:#ffe9a8; }
.badge-offline { background:#333; color:#bbb; }

/* KPIs */
.kpi-grid {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:1rem; padding:1rem 1.5rem;
}
.kpi {
  background:#222634; border:1px solid #2e3447; border-radius:10px;
  padding:1rem; text-align:center;
}
.kpi span { display:block; font-size:1.9rem; font-weight:700; color:#fff; }
.kpi small { color:#8893ab; text-transform:uppercase; font-size:.7rem; letter-spacing:.05em; }
.kpi.ok span      { color:#4ade80; }
.kpi.pos span     { color:#f0a; }
.kpi.shopify span { color:#7ab8ff; font-size:1.1rem; word-break:break-all; }

/* Sync bar */
.sync-bar {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:.75rem; padding:0 1.5rem 1rem;
}
.sync-item {
  background:#1d212e; border:1px solid #2a3043; border-radius:8px; padding:.6rem .9rem;
  display:flex; flex-direction:column; gap:.2rem;
}
.sync-item strong { color:#aab; font-size:.7rem; text-transform:uppercase; letter-spacing:.04em; }
.sync-item span   { color:#dde; font-size:.85rem; }

/* Tablas de datos */
.table-toolbar { display:flex; align-items:center; gap:1rem; margin-bottom:.75rem; flex-wrap:wrap; }
.table-toolbar input {
  flex:1; min-width:220px; padding:.5rem .8rem; border-radius:8px;
  background:#1a1d27; border:1px solid #39405a; color:#fff;
}
.data-table { width:100%; border-collapse:collapse; font-size:.85rem; }
.data-table th, .data-table td { padding:.55rem .7rem; text-align:left; border-bottom:1px solid #262b3a; }
.data-table th { color:#8893ab; font-weight:600; text-transform:uppercase; font-size:.7rem; position:sticky; top:0; background:#1a1d27; }
.data-table td.num, .data-table th.num { text-align:right; font-variant-numeric:tabular-nums; }
.data-table code { background:#13161f; padding:.1rem .4rem; border-radius:4px; color:#9ad; font-size:.8rem; }
.data-table tbody tr:hover { background:#1f2433; }

.stock-ok   { color:#4ade80; font-weight:600; }
.stock-low  { color:#fbbf24; font-weight:600; }
.stock-zero { color:#f87171; font-weight:600; }

.tag-ok { background:#1b3a2a; color:#7ee2a8; padding:.15rem .5rem; border-radius:5px; font-size:.78rem; }

.muted  { color:#6b7388; }
.center { text-align:center; }
.table-scroll { max-height:65vh; overflow:auto; border:1px solid #262b3a; border-radius:8px; }

.dash-footer { padding:1rem 1.5rem; color:#6b7388; font-size:.78rem; text-align:center; }