/* ============================================================
   PYM360 · COMPONENT — Table
   Capa 2 — primitivo del DS. Tabla densa estilo Linear/Vercel.

   Markup:
     <div class="pym-table-wrap">
       <table class="pym-table">
         <thead>
           <tr><th>Col</th><th class="right">$</th></tr>
         </thead>
         <tbody>
           <tr>
             <td><div class="pym-td-primary">Texto</div><div class="pym-td-sub">Sub</div></td>
             <td class="right pym-td-mono">$1.234</td>
           </tr>
         </tbody>
       </table>
     </div>

   Variants:
     .pym-table--bordered  bordes en cada celda (formularios)
     .pym-table--zebra     filas alternadas con tinte (lecturas largas)
     .pym-table--compact   menos padding (tablas con muchas filas)
   ============================================================ */

.pym-table-wrap{
  background:var(--pym-color-surface);
  border:1px solid var(--pym-color-border);
  border-radius:var(--pym-radius-xl);
  overflow:hidden;
  overflow-x:auto;
}

.pym-table{
  width:100%;
  border-collapse:collapse;
  font-size:12.5px;
  font-family:var(--pym-font-sans);
}
.pym-table thead{
  background:var(--pym-color-bg);
}
.pym-table thead th{
  font-size:10.5px;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--pym-color-text-muted);
  font-weight:var(--pym-fw-semibold);
  text-align:left;
  padding:10px 12px;
  border-bottom:1px solid var(--pym-color-border);
  white-space:nowrap;
}
.pym-table thead th.right{text-align:right}
.pym-table thead th.center{text-align:center}

.pym-table tbody tr{
  border-bottom:1px solid var(--pym-color-border);
  transition:background var(--pym-trans-fast);
}
.pym-table tbody tr:last-child{border-bottom:none}
.pym-table tbody tr:hover{background:rgba(255,255,255,.02)}
[data-theme="light"] .pym-table tbody tr:hover{background:rgba(0,0,0,.02)}

.pym-table tbody td{
  padding:10px 12px;
  vertical-align:top;
  color:var(--pym-color-text);
}
.pym-table tbody td.right{text-align:right}
.pym-table tbody td.center{text-align:center}

/* ===== ROW STATES ===== */
.pym-table tbody tr.pym-tr--warn{background:rgba(245,185,85,.04)}
.pym-table tbody tr.pym-tr--warn:hover{background:rgba(245,185,85,.08)}
.pym-table tbody tr.pym-tr--danger{background:rgba(255,141,123,.04)}
.pym-table tbody tr.pym-tr--danger:hover{background:rgba(255,141,123,.08)}
.pym-table tbody tr.pym-tr--success{background:rgba(125,208,109,.03)}
.pym-table tbody tr.pym-tr--selected{background:var(--pym-color-accent-dim)}

/* ===== CELL HELPERS ===== */
.pym-td-primary{
  font-weight:var(--pym-fw-medium);
  color:var(--pym-color-text);
}
.pym-td-sub{
  font-size:var(--pym-fs-sm);
  color:var(--pym-color-text-muted);
  margin-top:2px;
}
.pym-td-mono{font-family:var(--pym-font-mono);font-feature-settings:"tnum"}
.pym-td-mono-sm{font-family:var(--pym-font-mono);font-size:11px;color:var(--pym-color-text-dim)}
.pym-td-idx{
  color:var(--pym-color-text-subtle);
  font-family:var(--pym-font-mono);
  font-size:11px;
  width:36px;
}
.pym-td-empty{color:var(--pym-color-text-muted);font-style:italic;font-size:11px}
.pym-td-tag{display:inline-block;font-size:10px;color:var(--pym-color-text-muted);background:var(--pym-color-surface-2);padding:1px 6px;border-radius:var(--pym-radius-xs);margin-left:6px;font-family:var(--pym-font-mono)}

/* Acciones de fila (botones icono-only) */
.pym-row-actions{display:flex;gap:4px;justify-content:flex-end}
/* v6.8.0: layout vertical para >2 acciones (cotizador con 📦/➗/✎).
   Iconos más chicos (28px vs 32px) para que 3 botones en columna no inflen
   demasiado el alto de la fila. 28×3 + 2×2 gap = 88px — cabe en filas con
   nombre + 1-2 líneas de subtexto. */
.pym-row-actions--vertical{
  flex-direction:column;
  gap:2px;
  align-items:flex-end;
}
.pym-row-actions--vertical .pym-row-icon-btn{
  width:28px;height:28px;font-size:14px;
}
.pym-row-icon-btn{
  /* SUG-013: 26px era pequeño para click target — bumped a 32px (WCAG-friendly) */
  width:32px;height:32px;
  border-radius:var(--pym-radius-sm);
  background:transparent;
  border:1px solid transparent;
  color:var(--pym-color-text-muted);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition:all var(--pym-trans-fast);
  font-family:inherit;
  font-size:16px;
}
.pym-row-icon-btn:hover{
  background:var(--pym-color-surface-2);
  border-color:var(--pym-color-border);
  color:var(--pym-color-text);
}
.pym-row-icon-btn--accent{color:var(--pym-color-accent-2)}
.pym-row-icon-btn--accent:hover{background:var(--pym-color-accent-dim)}
.pym-row-icon-btn--danger{color:var(--pym-color-danger)}
.pym-row-icon-btn--danger:hover{background:var(--pym-color-danger-dim)}

/* BUG-090: cuando el sidebar esta abierto la tabla se comprime y la columna
   de acciones puede salir del viewport. Sticky-right la mantiene visible. */
.pym-th-actions,
.pym-td-actions{
  position:sticky;
  right:0;
  z-index:1;
  width:84px;
  min-width:84px;
  background:var(--pym-color-surface);
  box-shadow:-2px 0 6px rgba(0,0,0,.05);
}
[data-theme="light"] .pym-th-actions,
[data-theme="light"] .pym-td-actions{box-shadow:-2px 0 6px rgba(0,0,0,.04)}
/* En filas con tinte (warn/danger), heredar background para que la columna
   sticky no rompa visualmente la fila. */
.pym-table tbody tr.pym-tr--warn .pym-td-actions{background:rgba(245,185,85,.04)}
.pym-table tbody tr.pym-tr--warn:hover .pym-td-actions{background:rgba(245,185,85,.08)}
.pym-table tbody tr.pym-tr--danger .pym-td-actions{background:rgba(255,141,123,.04)}
.pym-table tbody tr.pym-tr--danger:hover .pym-td-actions{background:rgba(255,141,123,.08)}
.pym-table tbody tr:hover .pym-td-actions{background:var(--pym-color-surface-2,var(--pym-color-surface))}

/* ===== EMPTY / LOADING ROW ===== */
.pym-table-empty{
  padding:var(--pym-space-6);
  text-align:center;
  color:var(--pym-color-text-muted);
  font-size:var(--pym-fs-md);
}

/* ===== COMPACT ===== */
.pym-table--compact tbody td,
.pym-table--compact thead th{padding:6px 10px}

/* ===== ZEBRA ===== */
.pym-table--zebra tbody tr:nth-child(even){background:rgba(255,255,255,.015)}
[data-theme="light"] .pym-table--zebra tbody tr:nth-child(even){background:rgba(0,0,0,.02)}