/* SuperAndy — « Rôles Andy » (assets/roles/view.js). Préfixe rl-. */

.rl-ico{ flex:none; width:32px; height:32px; border-radius:8px; display:grid; place-items:center;
  background:var(--panel2); color:var(--soft); font-size:16px; }
.rl-ico--sov{ background:rgba(59,130,246,.16); color:var(--accent); }

.rl-check{ display:flex; align-items:flex-start; gap:10px; padding:8px 0; cursor:pointer; }
.rl-check input{ margin-top:3px; flex:none; }
.rl-check .field-hint{ color:var(--soft); font-size:12.5px; }

.rl-sovnote{ margin:0 0 12px; padding:10px 12px; border-radius:8px; font-size:13px;
  background:rgba(59,130,246,.10); color:var(--text); border:1px solid rgba(59,130,246,.35); }

/* ---- Sélecteur de permissions ---- */
.rl-tools{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.rl-tools .sp{ flex:1; }
.rl-tools .search{ min-width:min(320px,100%); flex:1 1 280px; }
.rl-tools .search input[type=search]{ appearance:none; }
.rl-tree{ display:flex; flex-direction:column; gap:8px; }
.rl-picker--off .rl-tree{ opacity:.45; pointer-events:none; }
.rl-cat{ border:1px solid var(--border); border-radius:9px; background:var(--panel); }
.rl-cat-h{ display:flex; align-items:center; gap:10px; padding:10px 12px; cursor:pointer; user-select:none; }
.rl-cat-h:hover{ background:var(--panel2); border-radius:9px; }
.rl-cat-h .sp{ flex:1; }
.rl-cat-d{ color:var(--soft); font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; flex:0 1 auto; }
.rl-caret{ color:var(--soft); width:12px; text-align:center; }
.rl-n{ color:var(--soft); font-size:12px; font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap; }
.rl-cat-b{ padding:2px 12px 10px 34px; border-top:1px solid var(--border); }
.rl-subwrap{ padding-top:8px; }
.rl-sub{ display:flex; align-items:center; gap:8px; font-weight:700; font-size:12.5px; color:var(--soft);
  text-transform:uppercase; letter-spacing:.03em; padding:4px 0; cursor:pointer; }
.rl-sub .rl-n{ text-transform:none; letter-spacing:0; }
.rl-perm{ display:grid; grid-template-columns:auto 1fr auto; align-items:baseline; gap:4px 10px;
  padding:5px 6px; border-radius:6px; cursor:pointer; }
.rl-perm:hover{ background:var(--panel2); }
.rl-perm input{ align-self:center; }
.rl-desc{ font-size:13px; min-width:0; }
.rl-key{ font:11.5px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace; color:var(--soft); white-space:nowrap; }
@media (max-width:720px){
  .rl-perm{ grid-template-columns:auto 1fr; }
  .rl-key{ grid-column:2; white-space:normal; word-break:break-all; }
  .rl-cat-d{ display:none; }
  .rl-cat-b{ padding-left:14px; }
}