/* main-menu.css — gegroepeerd off-canvas hoofdmenu. Tokens uit body.beta-ui (--rds-*). */
.mm-backdrop{position:fixed;inset:0;z-index:1089;background:rgba(2,4,8,.5);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
  opacity:0;visibility:hidden;transition:opacity var(--rds-dur-slow) var(--rds-ease),visibility var(--rds-dur-slow)}
.mm-backdrop.open{opacity:1;visibility:visible}

.main-menu{position:fixed;z-index:1090;top:0;right:0;bottom:0;width:88%;max-width:340px;
  background:var(--rds-sheet);-webkit-backdrop-filter:var(--rds-blur-strong);backdrop-filter:var(--rds-blur-strong);
  border-left:1px solid var(--rds-line-strong);box-shadow:var(--rds-shadow-3);
  display:flex;flex-direction:column;overflow:hidden;color:var(--rds-text);
  border-radius:var(--rds-r-4) 0 0 var(--rds-r-4);transform:translateX(105%);
  transition:transform var(--rds-dur-slow) var(--rds-ease);padding-bottom:var(--rds-safe)}
.main-menu.open{transform:translateX(0)}
@media (min-width:768px){ .main-menu{width:360px;padding-bottom:0} }
@media (prefers-reduced-motion:reduce){ .main-menu,.mm-backdrop{transition:none} }

.mm-grab{display:none}
@media (max-width:767.98px){ .mm-grab{display:block;padding:10px 0 2px;flex:0 0 auto;touch-action:none;cursor:grab}
  .mm-grab span{display:block;width:40px;height:5px;margin:0 auto;border-radius:var(--rds-r-pill);background:rgba(235,240,250,.28)} }

.mm-head{flex:0 0 auto;display:flex;align-items:center;gap:10px;padding:10px 16px 12px;border-bottom:1px solid var(--rds-line)}
.mm-title{margin:0;font-size:17px;font-weight:var(--rds-fw-bold)}
.mm-close{all:unset;display:grid;place-items:center;width:40px;height:40px;border-radius:var(--rds-r-2);margin-left:auto;
  border:1px solid var(--rds-line);background:var(--rds-surface-2);color:var(--rds-muted);cursor:pointer}
.mm-close:hover{color:var(--rds-text);box-shadow:inset 0 0 0 1px var(--rds-accent-line)}

.mm-body{flex:1 1 auto;overflow:auto;padding:12px 14px 22px;-webkit-overflow-scrolling:touch}

.mm-id{display:flex;align-items:center;gap:12px;padding:8px 8px 14px;text-decoration:none;color:var(--rds-text);
  border-bottom:1px solid var(--rds-line);border-radius:var(--rds-r-3)}
.mm-id:hover{background:var(--rds-surface-2)}
.mm-id-av img{width:48px;height:48px;border-radius:50%;object-fit:cover;display:block;background:var(--rds-surface-2)}
.mm-id-meta{flex:1;min-width:0}
.mm-id-nm{font-weight:var(--rds-fw-bold);font-size:16px;display:flex;align-items:center;gap:8px}
.mm-pro{font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--rds-accent-ink);
  background:var(--rds-accent);padding:2px 7px;border-radius:var(--rds-r-pill);font-weight:var(--rds-fw-bold)}
.mm-id-sub{font-size:12.5px;color:var(--rds-muted);margin-top:2px}
.mm-chev{width:18px;height:18px;color:var(--rds-muted);flex:0 0 auto}

.mm-seclabel{font-size:var(--rds-fs-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--rds-muted);
  font-weight:var(--rds-fw-semi);margin:16px 4px 6px}
.mm-row{display:flex;align-items:center;gap:13px;min-height:50px;padding:10px 12px;border-radius:var(--rds-r-3);
  text-decoration:none;color:var(--rds-text);font-size:15px;font-weight:var(--rds-fw-med)}
.mm-row:hover{background:var(--rds-surface-2)}
.mm-row .mm-ic{width:21px;height:21px;flex:0 0 auto;color:var(--rds-muted)}
.mm-row:hover .mm-ic{color:var(--rds-text)}
.mm-lbl{flex:1}
.mm-row--danger .mm-ic,.mm-row--danger .mm-lbl{color:var(--rds-danger)}

.mm-foot{margin-top:18px;padding-top:14px;border-top:1px solid var(--rds-line);display:flex;flex-wrap:wrap;gap:8px 16px;
  font-size:var(--rds-fs-sm)}
.mm-foot a{color:var(--rds-muted);text-decoration:none}
.mm-foot a:hover{color:var(--rds-text)}