/* Eterano v1.21.1 — Session Security & Devices + Account & appearance polish */

/* Clear hierarchy: security/session controls first, appearance + team next, plan last. */
#settingsAccountPanel #securityCenter1210,
#settingsAccountPanel #activeSessions1211{grid-column:1/-1}
#settingsAccountPanel #securityCenter1210{margin-bottom:0}

.active-sessions1211{display:grid;gap:16px}
.sessions-head1211{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.sessions-head1211 h2{margin:.18rem 0 .4rem}
.session-count1211{display:inline-flex;align-items:center;white-space:nowrap;padding:7px 10px;border:1px solid var(--line);background:var(--surface-soft);border-radius:999px;color:var(--muted);font-size:.76rem;font-weight:850}
.sessions-list1211{display:grid;gap:9px}
.session-row1211{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;border:1px solid var(--line);background:var(--surface-soft);border-radius:14px;padding:13px 14px}
.session-row1211.current{border-color:color-mix(in srgb,var(--success) 45%,var(--line));background:color-mix(in srgb,var(--surface-soft) 94%,var(--success) 6%)}
.session-icon1211{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--surface);border:1px solid var(--line);color:var(--muted);font-size:.76rem}
.session-row1211.current .session-icon1211{color:var(--success)}
.session-main1211{min-width:0}.session-title1211{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.session-title1211 strong{font-size:.92rem}.session-current1211,.session-safe1211{display:inline-flex;align-items:center;padding:4px 7px;border-radius:999px;font-size:.68rem;font-weight:900;background:rgba(20,166,112,.13);color:#18a874}.session-meta1211{display:flex;gap:12px;flex-wrap:wrap;margin-top:5px;color:var(--muted);font-size:.75rem}.session-revoke1211{white-space:nowrap}.sessions-loading1211{color:var(--muted);padding:12px 0}.sessions-footer1211{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:4px}.sessions-footer1211>div{display:grid;gap:3px;max-width:760px}.sessions-footer1211 small{color:var(--muted);line-height:1.45}

/* Suppress stale hidden-subtab state in hover previews. The actual active section still
   gets exactly the active state produced by v1.14.2. */
.sidebar-nav-group1142:not(.expanded)>.sidebar-subnav1142 .sidebar-subitem1142.active:not(:hover){background:transparent!important;color:#91a9d0!important}
.sidebar-nav-group1142:not(.expanded)>.sidebar-subnav1142 .sidebar-subitem1142.level-2.active:not(:hover){color:#7894bf!important}
.sidebar-nav-group1142:not(.expanded)>.sidebar-subnav1142 .sidebar-subentry1142.nested-open>.sidebar-subnested1142{display:none!important}

/* Larger, readable MFA enrollment flow. */
.mfa-modal1211{width:min(760px,calc(100vw - 32px));max-width:760px;max-height:min(900px,92vh);padding:0;overflow:hidden}
.mfa-shell1211{display:flex;flex-direction:column;max-height:90vh;padding:20px 22px 0}
.mfa-shell1211>.modal-header{flex:0 0 auto}.mfa-shell1211>.modal-header p{margin:.35rem 0 0}
.mfa-steps1211{display:grid;gap:14px;overflow:auto;padding:4px 3px 18px;margin-top:12px}
.mfa-step1211{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;align-items:start;border:1px solid var(--line);border-radius:15px;background:var(--surface-soft);padding:14px}
.mfa-step-no1211{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 16%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 42%,var(--line));color:var(--accent-strong,#3aa7ff);font-weight:900}
.mfa-step1211 p{margin:.35rem 0 .75rem}.mfa-step-body1211{min-width:0}.mfa-qr1211{display:grid;place-items:center;width:min(270px,100%);min-height:230px;margin-top:8px;border:1px solid var(--line);border-radius:14px;background:#fff;padding:12px}.mfa-qr1211 img{display:block;width:210px;height:210px;max-width:100%;object-fit:contain}.mfa-step1211 code{display:block;margin-top:9px;padding:12px;border-radius:11px;background:var(--surface);border:1px solid var(--line);word-break:break-all;font-size:.86rem;line-height:1.45;user-select:all}.mfa-step1211 label{margin:0}.mfa-actions1211{flex:0 0 auto;display:flex;justify-content:flex-end;gap:8px;padding:14px 0 18px;border-top:1px solid var(--line);background:var(--surface)}

/* Account page vertical rhythm after the security block becomes full width. */
#settingsAccountPanel{align-items:start}
#settingsAccountPanel>#securityCenter1210+#activeSessions1211{margin-top:0}
#settingsAccountPanel #themeSettingsCard,#settingsAccountPanel section:has(#inviteCode){height:100%}

@media(max-width:900px){
  #settingsAccountPanel{grid-template-columns:1fr!important}
  #settingsAccountPanel #securityCenter1210,#settingsAccountPanel #activeSessions1211,#settingsAccountPanel .plan-card{grid-column:1!important}
  .sessions-footer1211{align-items:stretch;flex-direction:column}.sessions-footer1211 button{width:100%}
}
@media(max-width:620px){
  .sessions-head1211{flex-direction:column}.session-row1211{grid-template-columns:auto minmax(0,1fr)}.session-row1211>.session-revoke1211,.session-row1211>.session-safe1211{grid-column:2;width:max-content}.session-meta1211{display:grid;gap:3px}
  .mfa-modal1211{width:calc(100vw - 16px);max-height:94vh}.mfa-shell1211{max-height:92vh;padding:16px 15px 0}.mfa-step1211{grid-template-columns:30px minmax(0,1fr);padding:12px}.mfa-qr1211{width:100%;min-height:190px}.mfa-qr1211 img{width:180px;height:180px}.mfa-actions1211{position:sticky;bottom:0}.mfa-actions1211 button{flex:1}
}
