/* SSH Access page. Reuses the .backup-ssh-key-card / button styles from backup.css for the cards; this file only adds page chrome + the key list. */ .ssh-page { padding: 4px 2px 40px; } /* "Tools" group heading in the Admin (config) sidebar, above SSH Access. */ .sidebar-group-label { margin: 14px 8px 4px; padding-top: 10px; border-top: 1px solid rgba(var(--text-rgb), 0.08); font-size: 0.7rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(var(--text-rgb), 0.45); } /* SSH Access uses the config page's section layout (.config-category / .domains-wrapper); these just space the content inside each section. */ .ssh-section-body { display: flex; flex-direction: column; gap: 10px; padding: 2px 0; } .ssh-section-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 2px; } /* Login + Add-a-key are light on content, so sit them side by side (50/50) on tablet/desktop; stack on mobile. Authorized keys stays full width below. */ .ssh-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: stretch; } @media (max-width: 640px) { .ssh-cols { grid-template-columns: 1fr; } } .ssh-key-list { display: flex; flex-direction: column; gap: 8px; } .ssh-key-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 1px solid rgba(var(--text-rgb), 0.10); border-radius: 8px; background: var(--card-bg); } .ssh-key-row-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; } .ssh-key-type { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--accent); } .ssh-key-comment { font-size: 0.9rem; font-weight: 600; color: var(--text-primary); } .ssh-key-fp { font-family: var(--font-mono, monospace); font-size: 0.74rem; color: rgba(var(--text-rgb), 0.6); word-break: break-all; }