/* ============================================================
   Command palette (Global Search) + Settings/RBAC
   ============================================================ */
.cmdk-overlay{ position:fixed; inset:0; z-index:80; background:rgba(35,33,27,.40); backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px); display:flex; align-items:flex-start; justify-content:center; padding:12vh 16px 16px; }
[data-theme="dark"] .cmdk-overlay{ background:rgba(0,0,0,.58); }
.cmdk{ width:100%; max-width:580px; background:var(--surface); border:1px solid var(--line); border-radius:16px;
  box-shadow:var(--shadow-lg); overflow:hidden; display:flex; flex-direction:column; max-height:72vh; }
.cmdk-input{ display:flex; align-items:center; gap:12px; padding:16px 18px; border-bottom:1px solid var(--line); }
.cmdk-input svg{ width:19px; height:19px; color:var(--muted); flex:none; }
.cmdk-input input{ flex:1; border:0; background:none; outline:none; font:inherit; font-size:16px; color:var(--ink); }
.cmdk-input .kbd{ font-family:var(--mono); font-size:10.5px; font-weight:600; color:var(--muted); background:var(--raised2); border:1px solid var(--line); border-radius:6px; padding:2px 7px; }
.cmdk-body{ overflow-y:auto; padding:8px; }
.cmdk-grp{ margin-bottom:6px; }
.cmdk-grp-h{ display:flex; align-items:center; gap:8px; font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--faint); padding:9px 12px 6px; }
.cmdk-grp-ct{ font-size:10.5px; font-weight:700; color:var(--muted); background:var(--raised2); padding:0 7px; border-radius:99px; }
.cmdk-item{ display:flex; align-items:center; gap:12px; width:100%; padding:11px 12px; border-radius:10px; border:0; background:none; font:inherit; cursor:pointer; text-align:left; }
.cmdk-item.on{ background:var(--accent-tint); }
.cmdk-ic{ width:34px; height:34px; border-radius:9px; background:var(--raised); display:grid; place-items:center; color:var(--muted); flex:none; }
.cmdk-item.on .cmdk-ic{ background:var(--accent-soft); color:var(--accent); }
.cmdk-ic svg{ width:17px; height:17px; }
.cmdk-t{ display:block; font-size:14.5px; font-weight:600; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cmdk-sub{ display:block; font-size:12px; color:var(--muted); margin-top:1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cmdk-go{ margin-left:auto; color:var(--faint); flex:none; opacity:0; }
.cmdk-item.on .cmdk-go{ opacity:1; }
.cmdk-go svg{ width:16px; height:16px; }
.cmdk-empty{ padding:34px 18px; text-align:center; color:var(--faint); font-size:14px; }
.cmdk-foot{ display:flex; gap:18px; padding:11px 18px; border-top:1px solid var(--line); font-size:12px; color:var(--muted); }
.cmdk-foot .kbd{ font-family:var(--mono); font-size:10.5px; font-weight:600; background:var(--raised2); border:1px solid var(--line); border-radius:5px; padding:1px 6px; margin-right:5px; }

/* ---------- Settings / RBAC ---------- */
.set-tabs{ display:flex; gap:3px; overflow-x:auto; margin:18px 0 0; border-bottom:1px solid var(--line); }
.set-tab{ white-space:nowrap; padding:11px 15px; font-size:14px; font-weight:600; color:var(--muted); border:0; background:none; border-bottom:2px solid transparent; margin-bottom:-1px; display:flex; align-items:center; gap:7px; }
.set-tab.on{ color:var(--accent); border-bottom-color:var(--accent); }
.set-tab svg{ width:16px; height:16px; }

/* role cards */
.role-grid{ display:grid; grid-template-columns:1fr; gap:13px; }
@media (min-width:680px){ .role-grid{ grid-template-columns:1fr 1fr; } }
@media (min-width:1200px){ .role-grid{ grid-template-columns:repeat(4,1fr); } }
.role-card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow); padding:18px; }
.role-card.active-role{ border-color:var(--accent); box-shadow:0 0 0 2px var(--accent-tint), var(--shadow); }
.role-card .rc-top{ display:flex; align-items:center; gap:10px; }
.role-card .rc-badge{ width:38px; height:38px; border-radius:11px; display:grid; place-items:center; font-weight:700; font-size:13px; flex:none; }
.role-card .rc-name{ font-size:15px; font-weight:600; }
.role-card .rc-en{ font-size:11.5px; color:var(--faint); }
.role-card .rc-desc{ font-size:13px; color:var(--ink2); margin-top:12px; line-height:1.5; min-height:58px; }
.role-card .rc-scope{ font-size:12px; color:var(--muted); margin-top:10px; padding-top:11px; border-top:1px solid var(--line-soft); display:flex; align-items:center; gap:7px; }
.role-card .rc-scope b{ color:var(--ink2); font-weight:600; }
.role-card .rc-cur{ font-size:11px; font-weight:700; color:var(--accent); margin-top:11px; }
.role-card .rc-try{ margin-top:11px; }

/* permission matrix */
.perm-wrap{ overflow-x:auto; border:1px solid var(--line); border-radius:var(--r); background:var(--surface); box-shadow:var(--shadow); }
.perm-table{ width:100%; border-collapse:collapse; min-width:620px; }
.perm-table th{ text-align:center; font-size:12px; font-weight:700; color:var(--ink2); padding:13px 12px; border-bottom:1px solid var(--line); background:var(--raised); }
.perm-table th:first-child{ text-align:left; }
.perm-table th .pth-en{ display:block; font-size:10.5px; font-weight:600; color:var(--faint); margin-top:2px; }
.perm-table td{ padding:11px 12px; text-align:center; border-bottom:1px solid var(--line-soft); font-size:13px; }
.perm-table td:first-child{ text-align:left; font-weight:500; color:var(--ink); }
.perm-table tr:last-child td{ border-bottom:0; }
.perm-table tr.hl td{ background:var(--accent-tint); }
.perm-dot{ display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; padding:3px 9px; border-radius:99px; }
.perm-dot i{ width:6px; height:6px; border-radius:50%; }

/* users table */
.user-row{ display:flex; align-items:center; gap:14px; padding:14px 16px; border-bottom:1px solid var(--line-soft); }
.user-row:last-child{ border-bottom:0; }
.user-row .un{ font-size:14.5px; font-weight:600; }
.user-row .ut{ font-size:12.5px; color:var(--muted); margin-top:2px; }
.user-row .u-role{ flex:none; }
.user-row .u-meta{ flex:none; text-align:right; font-size:12px; color:var(--muted); min-width:90px; }
.user-row .u-meta b{ display:block; color:var(--ink2); font-weight:600; font-size:12.5px; }
@media (max-width:680px){ .user-row .u-meta{ display:none; } }
.status-pill{ font-size:11.5px; font-weight:600; padding:2px 9px; border-radius:99px; }
.status-pill.active{ background:var(--ok-bg); color:var(--ok); }
.status-pill.invited{ background:var(--warn-bg); color:var(--warn); }

/* audit log */
.audit-row{ display:flex; align-items:flex-start; gap:13px; padding:13px 16px; border-bottom:1px solid var(--line-soft); }
.audit-row:last-child{ border-bottom:0; }
.audit-ic{ width:32px; height:32px; border-radius:9px; display:grid; place-items:center; flex:none; }
.audit-ic.ok{ background:var(--ok-bg); color:var(--ok); } .audit-ic.info{ background:var(--info-bg); color:var(--info); }
.audit-ic.danger{ background:var(--danger-bg); color:var(--danger); } .audit-ic.warn{ background:var(--warn-bg); color:var(--warn); }
.audit-ic.neutral{ background:var(--neutral-bg); color:var(--neutral); }
.audit-row .a-main{ flex:1; min-width:0; }
.audit-row .a-act{ font-size:13.5px; }
.audit-row .a-act b{ font-weight:600; }
.audit-row .a-tgt{ font-size:12.5px; color:var(--muted); margin-top:2px; }
.audit-row .a-time{ font-size:11.5px; color:var(--faint); white-space:nowrap; flex:none; }

/* role name lock + 2-col role grid */
.ro-lock{ display:inline-flex; vertical-align:middle; margin-left:6px; color:var(--warn); }
.ro-lock svg{ width:14px; height:14px; }
.role-grid-2{ grid-template-columns:1fr; }
@media (min-width:760px){ .role-grid-2{ grid-template-columns:1fr 1fr; } }

/* ---------- Admin login modal ---------- */
.login-overlay{ position:fixed; inset:0; z-index:90; background:rgba(35,33,27,.46); backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px); display:flex; align-items:center; justify-content:center; padding:18px; }
[data-theme="dark"] .login-overlay{ background:rgba(0,0,0,.62); }
.login-card{ position:relative; width:100%; max-width:420px; background:var(--surface); border:1px solid var(--line);
  border-radius:20px; box-shadow:var(--shadow-lg); padding:30px 26px 22px; text-align:center; }
.login-x{ position:absolute; top:12px; right:12px; width:36px; height:36px; }
.login-badge{ width:60px; height:60px; border-radius:17px; background:var(--accent-soft); color:var(--accent);
  display:grid; place-items:center; margin:0 auto 16px; }
.login-badge svg{ width:30px; height:30px; }
.login-card h2{ font-family:var(--serif); font-size:21px; font-weight:600; }
.login-card > p{ font-size:13.5px; color:var(--muted); margin-top:9px; line-height:1.55; }
.login-field{ display:block; text-align:left; margin-top:16px; }
.login-field > span{ display:block; font-size:12.5px; font-weight:600; color:var(--ink2); margin-bottom:7px; }
.login-input{ display:flex; align-items:center; gap:10px; border:1px solid var(--line-strong); border-radius:11px;
  background:var(--bg); padding:0 13px; height:48px; transition:border-color .15s, box-shadow .15s; }
.login-input:focus-within{ border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-tint); }
.login-input.err{ border-color:var(--danger); }
.login-input svg{ width:18px; height:18px; color:var(--muted); flex:none; }
.login-input input{ flex:1; border:0; background:none; outline:none; font:inherit; font-size:15px; color:var(--ink); height:100%; }
.login-eye{ border:0; background:none; color:var(--faint); display:grid; place-items:center; padding:4px; }
.login-err{ display:flex; align-items:center; gap:8px; justify-content:center; margin-top:14px; font-size:13px;
  font-weight:600; color:var(--danger); background:var(--danger-bg); border-radius:10px; padding:10px; }
.login-err svg{ width:16px; height:16px; flex:none; }
.login-acts{ display:flex; gap:10px; margin-top:20px; }
.login-acts .btn{ flex:1; }