.uf-employees { box-sizing:border-box; color:var(--uf-text); background:var(--uf-page); border:1px solid var(--uf-edge); border-radius:22px; width:min(1580px,calc(100% - 32px)); max-width:none; height:calc(100dvh - 32px); max-height:none; margin:auto; padding:24px; overflow:auto; box-shadow:var(--uf-shadow-lg); font:inherit; }
.uf-employees::backdrop { background:var(--uf-backdrop); backdrop-filter:blur(8px); }
.uf-employees * { box-sizing:border-box; }
.uf-employees h2 { font-size:26px; font-weight:850; margin:0; letter-spacing:-.04em; }
.uf-employees h3 { font-size:18px; font-weight:800; margin:0; }
.uf-employees p { margin:4px 0; color:var(--uf-text-muted); }
.uf-emp-heading,.uf-emp-toolbar,.uf-emp-person,.uf-emp-actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.uf-emp-heading { justify-content:space-between; margin-bottom:20px; }
.uf-emp-stats { display:flex; flex-wrap:wrap; gap:10px; padding-bottom:20px; border-bottom:1px solid var(--uf-edge); margin-bottom:20px; }
.uf-emp-stats span { padding:10px 16px; border:1px solid var(--uf-edge); border-radius:11px; background:var(--uf-surface); font-weight:700; }
.uf-emp-layout { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(340px,1fr); gap:20px; align-items:start; }
.uf-emp-panel { border:1px solid var(--uf-edge); border-radius:18px; padding:20px; background:var(--uf-surface); min-width:0; box-shadow:var(--uf-shadow-sm); }
.uf-emp-toolbar { margin:16px 0; }
.uf-emp-toolbar input { flex:1; min-width:130px; }
.uf-employees input:not([type=checkbox]),.uf-employees select { color:var(--uf-text); background:var(--uf-field); border:1px solid var(--uf-edge); border-radius:9px; padding:10px 12px; min-height:42px; font:inherit; max-width:100%; }
.uf-employees input:focus,.uf-employees select:focus,.uf-employees button:focus-visible { outline:2px solid var(--uf-accent); outline-offset:2px; }
html.dark .uf-employees :is(input:not([type=checkbox]),select,thead,th) { color:var(--uf-text)!important; background:var(--uf-field)!important; border-color:var(--uf-edge)!important; }
.uf-employees input[type=checkbox] { width:18px; height:18px; accent-color:var(--uf-accent); }
.uf-employees .buttonBase { border:1px solid var(--uf-edge); border-radius:10px; padding:10px 14px; min-height:42px; color:var(--uf-text); background:var(--uf-surface-2); font:inherit; font-weight:750; cursor:pointer; }
.uf-employees .uf-emp-primary { background:var(--uf-accent); color:var(--uf-on-accent); border-color:var(--uf-accent); }
.uf-employees .uf-emp-warning { color:var(--uf-warning); }
.uf-employees .uf-emp-danger { color:var(--uf-danger); }
.uf-employees button:disabled,.uf-employees input:disabled,.uf-employees select:disabled { opacity:.55; cursor:not-allowed; }
.uf-emp-table-wrap { overflow-x:auto; }
.uf-employees table { width:100%; border-collapse:collapse; text-align:left; }
.uf-employees th { font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--uf-text-muted); padding:12px 9px; background:var(--uf-surface-2); }
.uf-employees td { padding:14px 9px; border-bottom:1px solid var(--uf-edge-soft); vertical-align:middle; }
.uf-employees tr[data-selected=true] td { background:var(--uf-accent-soft); }
.uf-employees .uf-emp-name { text-align:left; background:transparent; border:0; padding:0; min-height:42px; color:var(--uf-text); cursor:pointer; }
.uf-emp-name small { display:block; color:var(--uf-text-muted); font-weight:400; }
.uf-emp-avatar { display:inline-grid; place-items:center; height:44px; width:44px; flex-shrink:0; border-radius:50%; color:var(--uf-on-accent); background:var(--uf-accent); font-size:18px; font-weight:800; }
.uf-emp-badge { display:inline-block; border:1px solid currentColor; color:var(--uf-text-muted); border-radius:8px; padding:4px 8px; font-size:11px; white-space:nowrap; }
.uf-emp-badge.active { color:var(--uf-success); }
.uf-emp-badge.pending { color:var(--uf-warning); }
.uf-emp-section { padding:18px 0; border-bottom:1px solid var(--uf-edge-soft); }
.uf-emp-section h4 { font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; margin:0 0 12px; color:var(--uf-text-muted); }
.uf-emp-fields { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; }
.uf-employees .uf-emp-fields label { position:static; min-width:0; width:auto; height:auto; margin:0; display:flex; flex-direction:column; align-items:stretch; gap:8px; font-size:12px; font-weight:650; line-height:1.5; }
.uf-employees .uf-emp-fields :is(input:not([type=checkbox]),select) { position:static; display:block; width:100%; min-width:0; height:auto; margin:0; flex:none; line-height:1.5; }
.uf-employees .uf-emp-section > p { margin:10px 0; line-height:1.5; overflow-wrap:anywhere; }
.uf-emp-fields .wide { grid-column:1/-1; }
.uf-employees .uf-emp-fields .uf-emp-check { flex-direction:row; align-items:center; gap:10px; }
.uf-emp-actions { justify-content:flex-end; padding-top:18px; }
.uf-emp-message { padding:12px 16px; margin-bottom:16px; border:1px solid var(--uf-edge); background:var(--uf-accent-soft); border-radius:10px; }
.uf-emp-message.error { color:var(--uf-danger); }
.uf-emp-empty { padding:36px 16px; color:var(--uf-text-muted); text-align:center; }
.uf-emp-pagination { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:18px; }
@media(max-width:1050px) { .uf-emp-layout { grid-template-columns:1fr; } }
@media(max-width:600px) { .uf-employees { width:100%; height:100dvh; border-radius:0; padding:14px; } .uf-emp-panel { padding:14px; } .uf-emp-fields { grid-template-columns:1fr; } .uf-employees h2 { font-size:22px; } .uf-emp-toolbar>* { width:100%; } .uf-emp-avatar { display:none; } }
