/* fs-employee-sessions-v2 — Dark Skin unificado (selector v2, tarjetas, tablas, export) */

:root{
  --brand-primary:#0097CE; --brand-accent:#FF5B56;
  --fs-text:#E9EEF3; --fs-muted:#B8C2CC;
  --fs-invert:#0A0A0A; --fs-surface:#0F141A; --fs-surface-2:#121920;
  --fs-border:#1F2A33; --fs-radius:12px; --fs-shadow:0 10px 28px rgba(0,0,0,.55);
}

#fs-emp-sessions-v2{ background:transparent; color:var(--fs-text); box-sizing:border-box; width:100%; }

/* Selector como tarjeta */
#fs-emp-sessions-v2 .fs-sel{
  position:relative; margin-bottom:12px; z-index:10;
  background: var(--fs-surface); border:1px solid var(--fs-border);
  padding:10px; border-radius:10px; display:flex; flex-direction:column; gap:8px; box-shadow:0 6px 16px rgba(0, 96, 139,.24);
}
#fs-emp-sessions-v2 .fs-sel-label{ font-size:13px; color:var(--fs-muted); }
#fs-emp-sessions-v2 .fs-sel-input-wrap{ display:flex; gap:8px; align-items:center; }

/* Input + toggle */
#fs-emp-sessions-v2 #fs-emp-sel-search{
  flex:1; min-width:160px; padding:10px 12px; font-size:14px;
  border:1px solid var(--fs-border); border-radius:10px;
  background:#0E1319; color:var(--fs-text);
  transition:border-color .2s, box-shadow .2s;
}
#fs-emp-sessions-v2 #fs-emp-sel-search:focus{
  outline:none; border-color: var(--brand-primary);
  box-shadow:0 6px 16px rgba(0, 96, 139,.24);
}
#fs-emp-sessions-v2 .fs-sel-toggle{
  padding:8px 10px; border:1px solid var(--fs-border);
  border-radius:10px; background: var(--fs-surface-2);
  color: var(--fs-text); cursor:pointer; line-height:1;
}

/* Acciones */
#fs-emp-sessions-v2 .fs-sel-actions{ margin-top:6px; }

/* Dropdown */
#fs-emp-sessions-v2 .fs-sel-dd{
  position:absolute; left:0; right:0; top: calc(100% + 8px);
  background: var(--fs-surface); border:1px solid var(--fs-border);
  border-radius:10px; box-shadow: var(--fs-shadow);
  max-height:360px; overflow:auto; padding:8px; display:none; z-index:12000; color: var(--fs-text);
}
#fs-emp-sessions-v2 .fs-sel.open .fs-sel-dd{ display:block; }
#fs-emp-sel-dd .fs-dd-item[style*="display: none"] {
  display: none !important;
}
#fs-emp-sessions-v2 .fs-dd-item{
  display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:8px; cursor:pointer; margin:0 !important;
}
#fs-emp-sessions-v2 .fs-dd-item:hover{ background:#18222B; }
#fs-emp-sessions-v2 .fs-dd-item input{ pointer-events:none; margin:0; }
#fs-emp-sessions-v2 .fs-dd-name{ color:#E9EEF3; font-weight:600; }
#fs-emp-sessions-v2 .fs-dd-meta{ margin-left:auto; font-size:12px; color:var(--fs-muted); white-space:nowrap; }
#fs-emp-sessions-v2 .fs-dd-empty{ padding:10px; text-align:center; color:var(--fs-muted); }

/* Resultados */
#fs-emp-sessions-v2 .fs-emp-results{ display:flex; flex-direction:column; gap:12px; margin-top:10px; }
#fs-emp-sessions-v2 .fs-emp-block{
  border:1px solid var(--fs-border); border-radius:10px; overflow:hidden;
  background: var(--fs-surface); box-shadow: var(--fs-shadow);
}
#fs-emp-sessions-v2 .fs-emp-block-hd{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:10px 12px; background: linear-gradient(180deg, rgba(0, 151, 206, 0.18), rgba(0, 151, 206, 0.10)); border-bottom:1px solid var(--fs-border);
}
#fs-emp-sessions-v2 .fs-emp-title{ display:flex; flex-direction:column; gap:2px; }
#fs-emp-sessions-v2 .fs-emp-sub{ font-size:12px; color:var(--fs-muted); }
#fs-emp-sessions-v2 .fs-emp-block-bd{ padding:12px; }

/* Tabla dentro de la tarjeta */
#fs-emp-sessions-v2 .fs-tabla{ width:100%; border-collapse:collapse; table-layout:auto; min-width:0; color:var(--fs-text); }
#fs-emp-sessions-v2 .fs-tabla th, #fs-emp-sessions-v2 .fs-tabla td{
  padding:10px 12px; border-bottom:1px solid var(--fs-border); white-space:normal; word-break:break-word;
}
#fs-emp-sessions-v2 .fs-tabla th{ background: linear-gradient(180deg,#111923,#0F141A); color:#D8E7F1; font-weight:600; }

/* Botón exportar coherente */
.fs-emp-sessions-export{
  background: var(--brand-accent); color:#fff;
  border:1px solid var(--brand-accent);
  border-radius:999px; padding:10px 12px; cursor:pointer; font-weight:600;
  box-shadow:0 6px 16px rgba(0, 96, 139,.24);
}
.fs-emp-sessions-export:hover{ background:#ff6d68; }

/* Mensajes y overflow */
#fs-emp-sessions-v2 .fs-msg{ margin-top:8px; font-size:13px; color:var(--fs-muted); }
#fs-emp-sessions-v2{ overflow:visible; }

/* Resaltado de columnas "Totales" (si usas resumen) — conserva tu regla pero en dark */
.fs-aggregado .fs-tabla th:nth-child(2),
#resumen-sesiones .fs-tabla th:nth-child(2),
.fs-wrapper .fs-tabla th:nth-child(2),
.fs-aggregado .fs-tabla th:nth-child(3),
#resumen-sesiones .fs-tabla th:nth-child(3),
.fs-wrapper .fs-tabla th:nth-child(3){
  background: linear-gradient(180deg,#111923,#0F141A);
  color:#D8E7F1; font-weight:700; text-align:center; border-left:1px solid rgba(255,255,255,.06);
}
.fs-aggregado .fs-tabla td:nth-child(2),
#resumen-sesiones .fs-tabla td:nth-child(2),
.fs-wrapper .fs-tabla td:nth-child(2),
.fs-aggregado .fs-tabla td:nth-child(3),
#resumen-sesiones .fs-tabla td:nth-child(3),
.fs-wrapper .fs-tabla td:nth-child(3){
  text-align:center; font-weight:700; color:#bfe9ff; white-space:nowrap;
  border-left:1px solid rgba(255,255,255,.04); border-right:1px solid rgba(255,255,255,.04);
  padding:10px 12px; box-sizing:border-box;
}
.fs-aggregado .fs-tabla tbody tr:hover td:nth-child(2),
#resumen-sesiones .fs-tabla tbody tr:hover td:nth-child(2),
.fs-aggregado .fs-tabla tbody tr:hover td:nth-child(3),
#resumen-sesiones .fs-tabla tbody tr:hover td:nth-child(3){ background: rgba(0,151,206,.08); color:#e9f7ff; }

/* Responsive */
@media (max-width:900px){
  #fs-emp-sessions-v2 .fs-emp-block-hd{ flex-direction:column; align-items:flex-start; gap:6px; }
  #fs-emp-sessions-v2 .fs-sel{ padding:10px; }
  #fs-emp-results .fs-emp-block{ padding:8px; }
  #fs-emp-results .fs-tabla th, #fs-emp-results .fs-tabla td{ padding:8px; }
}

/*Graficos*/

.grafico-usuario {
    display: block;
    margin: 0 auto;
    width: 900px;
    height: 1000px;
}