.user-admin { --user-navy:#17365d; --user-blue:#2563eb; --user-soft:#f4f7fb; --user-line:#dfe7f1; }
.users-heading { align-items:flex-start; }
.users-heading h1 { margin:5px 0 3px; }
.users-heading p,.user-modal-header p,.permission-heading p { margin:0; color:#64748b; font-size:.9rem; }
.section-kicker { color:var(--user-blue); font-size:.78rem; font-weight:800; letter-spacing:.02em; }
.user-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:20px; }
.user-summary article { display:flex; align-items:center; gap:12px; padding:17px; background:#fff; border:1px solid var(--user-line); border-radius:14px; box-shadow:0 5px 16px rgba(23,54,93,.05); }
.user-summary article>i { display:grid; place-items:center; width:42px; height:42px; flex:0 0 42px; border-radius:12px; color:var(--user-blue); background:#eaf1ff; }
.user-summary strong,.user-summary span { display:block; }
.user-summary strong { color:var(--user-navy); font-size:1.35rem; line-height:1.1; }
.user-summary span { color:#64748b; font-size:.77rem; margin-top:4px; }
.users-toolbar { display:grid; grid-template-columns:minmax(260px,1fr) 180px 180px; gap:12px; padding:14px; margin-bottom:14px; background:#fff; border:1px solid var(--user-line); border-radius:14px; }
.users-toolbar label { display:flex; align-items:center; gap:8px; color:#64748b; font-size:.8rem; }
.users-toolbar select,.users-toolbar input { width:100%; min-height:42px; border:1px solid #d7e0eb; border-radius:9px; background:#fff; padding:8px 10px; font-family:inherit; }
.users-search { position:relative; }
.users-search i { position:absolute; right:13px; z-index:1; }
.users-search input { padding-right:38px; }
.users-alert { padding:12px 14px; margin-bottom:12px; border-radius:10px; background:#eef6ff; color:#1e4e8c; border:1px solid #bfdbfe; }
.users-alert.error { background:#fff1f2; color:#9f1239; border-color:#fecdd3; }
.users-table-wrap { border:1px solid var(--user-line); border-radius:14px; }
.users-table td { vertical-align:middle; }
.user-identity { display:flex; gap:10px; align-items:center; min-width:210px; }
.user-avatar-initials { display:grid; place-items:center; width:40px; height:40px; flex:0 0 40px; border-radius:50%; background:linear-gradient(135deg,#17365d,#3678c8); color:#fff; font-size:.78rem; font-weight:800; }
.user-identity strong,.user-identity small { display:block; }
.user-identity strong { color:#17365d; }
.user-identity small { color:#64748b; direction:ltr; text-align:right; }
.role-chip,.account-chip,.permission-count { display:inline-flex; align-items:center; gap:5px; padding:5px 9px; border-radius:999px; font-size:.75rem; font-weight:700; white-space:nowrap; }
.role-super_admin { background:#fff4cc; color:#8a5b00; }.role-admin { background:#e8f0ff; color:#174ea6; }.role-employee { background:#eef2f6; color:#46566a; }
.account-active { background:#e8f8ef; color:#167044; }.account-suspended { background:#fff0f1; color:#a51d2d; }
.permission-count { background:#f3f6fa; color:#4b5f77; }
.user-actions { display:flex; gap:6px; flex-wrap:wrap; }
.user-actions button { width:34px; height:34px; display:grid; place-items:center; border:1px solid #dbe3ed; border-radius:8px; background:#fff; color:#345; cursor:pointer; transition:.18s; }
.user-actions button:hover { border-color:#8bb5ed; color:#145ab4; transform:translateY(-1px); }
.user-actions button.danger:hover { border-color:#f2a6ad; color:#b42332; }
.protected-note { color:#7c8797; font-size:.76rem; }
.empty-users { padding:35px!important; text-align:center; color:#64748b; }
.user-modal-content { width:min(900px,calc(100vw - 32px)); max-height:92vh; padding:0; overflow:auto; border-radius:18px; }
.user-modal-close { z-index:2; border:0; background:transparent; }
.user-modal-header { display:flex; align-items:center; gap:13px; padding:22px 26px; border-bottom:1px solid #e7edf5; background:linear-gradient(135deg,#f7faff,#fff); }
.user-modal-header>i { display:grid; place-items:center; width:46px; height:46px; border-radius:13px; color:#fff; background:linear-gradient(135deg,#17365d,#2563eb); }
.user-modal-header h2 { margin:0 0 4px; color:#17365d; }
#userForm { padding:23px 26px 26px; }
.password-field { display:flex; position:relative; }.password-field input { padding-left:44px; }
.password-toggle { position:absolute; left:5px; top:5px; width:34px; height:34px; border:0; background:transparent; color:#64748b; cursor:pointer; }
.secure-check { display:flex; gap:10px; align-items:flex-start; padding:13px; margin:4px 0 17px; border:1px solid #d9e3ef; border-radius:11px; background:#f8fafc; }
.secure-check input { margin-top:4px; }.secure-check strong,.secure-check small { display:block; }.secure-check small { color:#64748b; margin-top:3px; }
.current-password-confirm { padding:13px; border:1px solid #f0cf85; border-radius:11px; background:#fffaf0; }
.permission-panel { margin-top:18px; border:1px solid #dce5f0; border-radius:14px; overflow:hidden; }
.permission-panel[hidden],[data-permission][hidden] { display:none!important; }
.permission-heading { display:flex; justify-content:space-between; gap:15px; align-items:center; padding:15px 17px; background:#f6f9fd; border-bottom:1px solid #e2e8f0; }
.permission-heading h3 { margin:0 0 3px; color:#17365d; font-size:1rem; }
.permission-actions { display:flex; gap:7px; }.permission-actions button { border:1px solid #cbd8e7; border-radius:8px; background:#fff; padding:7px 10px; color:#35506f; cursor:pointer; font-family:inherit; }
.permission-groups { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:15px; }
.permission-group { border:1px solid #e1e8f0; border-radius:11px; overflow:hidden; }
.permission-group h4 { margin:0; padding:10px 12px; color:#294b73; background:#f8fafc; border-bottom:1px solid #e7edf4; font-size:.9rem; }
.permission-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; padding:11px; }
.permission-option { display:flex; gap:7px; align-items:center; min-height:34px; font-size:.8rem; color:#43546a; cursor:pointer; }
.permission-option input { accent-color:#2563eb; }
.role-explanation { display:flex; gap:9px; padding:13px; border-radius:10px; background:#eef6ff; color:#31577f; font-size:.84rem; }
.user-form-footer { display:flex; justify-content:space-between; align-items:center; gap:18px; margin-top:20px; padding-top:17px; border-top:1px solid #e5ebf2; }
.user-form-footer p { margin:0; color:#64748b; font-size:.78rem; }.user-form-footer button { flex:0 0 auto; }
@media(max-width:900px){.user-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.users-toolbar{grid-template-columns:1fr 1fr}.users-search{grid-column:1/-1}.permission-groups{grid-template-columns:1fr}}
@media(max-width:600px){.user-summary{grid-template-columns:1fr 1fr;gap:8px}.user-summary article{padding:12px}.users-toolbar{grid-template-columns:1fr}.users-search{grid-column:auto}.user-modal-content{width:100%;max-height:calc(100dvh - 16px)}#userForm,.user-modal-header{padding:18px 14px}.permission-heading,.user-form-footer{align-items:stretch;flex-direction:column}.permission-options{grid-template-columns:1fr}}