/* ============================================================
   OPERARIOS.CSS — SISTEMAS › Operarios
   Lenguaje visual Atlas (tokens de atlas-tokens.css). Replica el patrón
   de las páginas de taller (panel / data-table / kpi) scopeado aquí.
   ============================================================ */
#page-operarios { padding:var(--s-5) var(--s-6) var(--s-6); max-width:var(--page-max); margin:0 auto; }

/* Cabecera */
#page-operarios .op-head { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:var(--s-4); }
#page-operarios .op-head__title { font-size:22px; font-weight:700; letter-spacing:-.01em; color:var(--text); }
#page-operarios .op-head__sub { font-size:12.5px; color:var(--text-3); margin-top:3px; }

/* Botón de acción */
#page-operarios .op-btn { font-family:var(--font-sans); font-size:13px; font-weight:600; border-radius:var(--radius-pill);
  padding:9px 18px; border:1px solid var(--border-strong); background:var(--surface); color:var(--text-2); cursor:pointer; transition:.15s var(--ease); }
#page-operarios .op-btn:hover { background:var(--hover); color:var(--text); }
#page-operarios .op-btn--accent { background:var(--accent); border-color:var(--accent); color:var(--accent-on); }
#page-operarios .op-btn--accent:hover { background:var(--accent-strong); color:var(--accent-on); }
#page-operarios .op-btn--sm { padding:6px 13px; font-size:12px; }

/* Barra de filtros (tarjeta) */
#page-operarios .op-toolbar { display:flex; align-items:flex-end; gap:var(--s-3); flex-wrap:wrap;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow-card);
  padding:var(--s-3) var(--s-4); margin-bottom:var(--s-4); }
#page-operarios .op-field { display:flex; flex-direction:column; gap:5px; }
#page-operarios .op-field__lbl { font-size:10px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--text-3); }
#page-operarios .op-field--grow { flex:1; min-width:200px; }
#page-operarios .op-count { font-size:11.5px; color:var(--text-3); font-family:var(--font-num); margin-left:auto; padding-bottom:9px; }

/* Inputs / selects Atlas */
#page-operarios .op-input, #page-operarios .op-select {
  font-family:var(--font-sans); font-size:13px; color:var(--text); background:var(--surface);
  border:1px solid var(--border-strong); border-radius:var(--radius-sm); padding:8px 11px; height:36px; outline:none; transition:.15s var(--ease); }
#page-operarios .op-input:focus, #page-operarios .op-select:focus { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-weak); }
#page-operarios .op-input::placeholder { color:var(--text-3); }
#page-operarios .op-select { appearance:none; -webkit-appearance:none; background-image:var(--select-arrow);
  background-repeat:no-repeat; background-position:right 11px center; padding-right:28px; cursor:pointer; }
#page-operarios .op-num { font-family:var(--font-num); font-variant-numeric:tabular-nums; text-align:right; }

/* Panel con tabla */
#page-operarios .op-panel { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); overflow:hidden; }
#page-operarios .op-table { width:100%; border-collapse:collapse; font-size:13px; }
#page-operarios .op-table thead th { background:var(--thead-bg); color:var(--text-3); font-size:10px; font-weight:600;
  letter-spacing:.05em; text-transform:uppercase; text-align:left; padding:11px 14px; white-space:nowrap; border-bottom:1px solid var(--border-strong); }
#page-operarios .op-table thead th.num { text-align:right; }
#page-operarios .op-table thead th.center { text-align:center; }
#page-operarios .op-table tbody td { padding:8px 14px; border-bottom:1px solid var(--row-border); color:var(--text-2); vertical-align:middle; }
#page-operarios .op-table tbody tr:last-child td { border-bottom:none; }
#page-operarios .op-table tbody tr:hover { background:var(--row-hover); }
#page-operarios .op-table td.op-cod { font-family:var(--font-num); color:var(--text-3); font-size:12px; }
#page-operarios .op-table td.op-name { font-weight:600; color:var(--text); }
#page-operarios .op-table td.num { text-align:right; }
#page-operarios .op-table td.center { text-align:center; }
#page-operarios .op-table .op-input, #page-operarios .op-table .op-select { height:32px; padding:5px 9px; font-size:12.5px; }
#page-operarios .op-table .op-select { padding-right:26px; }

/* €/h destacado */
#page-operarios .op-eurh { font-family:var(--font-num); font-variant-numeric:tabular-nums; font-weight:600; color:var(--accent-strong); }
#page-operarios .op-eurh.is-empty { color:var(--text-3); font-weight:400; }

/* Checkbox activo */
#page-operarios .op-chk { width:17px; height:17px; accent-color:var(--accent); cursor:pointer; }

/* Estados (cargando / error / vacío) */
#page-operarios .op-state { padding:48px 24px; text-align:center; color:var(--text-3); font-size:13px; }
#page-operarios .op-state--err { color:var(--neg); }