/* R2 user administration: operational access, clear identity and guarded actions. */
.account-center { --account-danger: var(--danger-text,#f08080); --account-border: var(--line,rgba(148,163,184,.2)); }
.account-heading { display:flex; justify-content:space-between; align-items:center; gap:24px; margin:0 0 24px; }
.account-heading h2 { margin:0 0 8px; font-size:24px; }
.account-heading p,.account-footnote { color:var(--muted,#aab3c2); margin:0; line-height:1.5; }
.account-heading .btn { flex-shrink:0; }
.account-overview { display:flex; flex-wrap:wrap; gap:16px 32px; padding:16px 0 24px; color:var(--muted,#aab3c2); }
.account-overview strong { color:var(--text,#edf0f6); font-size:20px; margin-right:6px; }
.account-toolbar { display:flex; justify-content:space-between; align-items:flex-end; gap:16px; padding:24px; border-bottom:1px solid var(--account-border); }
.account-toolbar label { display:grid; gap:8px; width:min(440px,100%); font-size:13px; }
.account-toolbar input { width:100%; min-height:44px; }
.account-count { color:var(--muted,#aab3c2); white-space:nowrap; padding-bottom:12px; font-size:13px; }
.view-shell .account-table { width:100%; min-width:0!important; table-layout:fixed; }
.view-shell .account-table th:nth-child(1) { width:29%; }
.view-shell .account-table th:nth-child(2) { width:29%; }
.view-shell .account-table th:nth-child(3) { width:18%; }
.view-shell .account-table th:nth-child(4) { width:24%; }
.view-shell .account-table td,.view-shell .account-table th { padding:20px 16px; white-space:normal; overflow-wrap:anywhere; vertical-align:middle; }
.account-identity { display:flex; align-items:center; gap:12px; }
.account-identity .avatar-sm { width:44px; height:44px; flex:0 0 44px; }
.account-identity strong { line-height:1.5; font-size:14px; }
.account-email { display:block; font-size:14px; line-height:1.5; }
.account-job,.account-access,.account-self { display:block; color:var(--muted,#aab3c2); margin-top:6px; line-height:1.4; font-size:12px; }
.account-self { color:#44c5aa; }
.account-actions { display:flex; flex-wrap:wrap; gap:8px; }
.account-actions .action-btn { min-height:36px; padding:8px 12px; font-size:12px; }
.account-actions .account-delete { color:var(--account-danger); }
.account-actions button:disabled { opacity:.35; cursor:not-allowed; }
.account-empty { padding:24px; text-align:center; color:var(--muted,#aab3c2); }
.account-footnote { margin:16px 0; font-size:12px; }
.account-dialog { --account-border:var(--line,rgba(148,163,184,.22)); width:min(760px,calc(100vw - 32px)); max-height:calc(100dvh - 48px); padding:0; border:1px solid var(--account-border); border-radius:16px; background:var(--panel,#292b31); color:var(--text,#edf0f6); overflow:hidden; }
.account-dialog::backdrop { background:rgba(6,10,16,.72); }
.account-dialog form { display:flex; flex-direction:column; max-height:calc(100dvh - 50px); }
.account-dialog-head { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; padding:24px; border-bottom:1px solid var(--account-border); flex-shrink:0; }
.account-dialog h2 { margin:0 0 8px; font-size:22px; }
.account-dialog-head p { margin:0; color:var(--muted,#aab3c2); line-height:1.5; }
.account-close { background:transparent; border:1px solid var(--account-border); color:inherit; border-radius:8px; font-size:24px; width:36px; height:36px; cursor:pointer; flex-shrink:0; }
.account-dialog-body { padding:24px; overflow-y:auto; display:grid; gap:24px; }
.account-dialog label { display:grid; gap:8px; font-size:14px; }
.account-dialog input:not([type=checkbox]),.account-dialog select { width:100%; min-width:0; min-height:44px; padding:10px 12px; background:var(--bg,#22252a); border:1px solid var(--account-border); color:inherit; border-radius:8px; font:inherit; box-sizing:border-box; }
.account-dialog :is(input,select,button):focus-visible,.account-center :is(input,button):focus-visible { outline:2px solid #35bea0; outline-offset:2px; }
.account-dialog small { color:var(--muted,#aab3c2); font-size:12px; line-height:1.6; }
.account-fieldset { margin:0; padding:0; border:0; min-width:0; }
.account-fieldset legend { font-size:15px; font-weight:700; margin-bottom:16px; }
.account-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.account-full { grid-column:1/-1; }
.account-info { padding:16px; background:rgba(20,184,150,.09); border-radius:8px; color:inherit; line-height:1.6; margin-bottom:0; }
.account-permission-label { margin:20px 0 12px; font-size:13px; font-weight:600; }
.account-permission-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:12px; }
.account-permission-grid label { display:flex; align-items:center; gap:8px; padding:10px; border:1px solid var(--account-border); border-radius:8px; cursor:pointer; font-size:13px; }
.account-permission-grid input { width:16px; height:16px; accent-color:#12ac8d; flex-shrink:0; }
.account-dialog-footer { display:flex; justify-content:flex-end; gap:12px; padding:16px 24px; border-top:1px solid var(--account-border); flex-shrink:0; }
.account-dialog-footer .btn { min-height:44px; }
.account-dialog-footer .account-cancel { background:var(--panel-soft,#30343b); color:var(--text,#edf0f6); border:1px solid var(--account-border); }
.account-error { margin:0; padding:12px; border:1px solid #c86363; border-radius:8px; color:var(--danger-text,#ffb3b3); background:rgba(164,44,44,.12); line-height:1.5; }
.account-delete-notice { line-height:1.65; border-left:3px solid #ce6161; padding-left:16px; }
.account-delete-notice p { margin-bottom:0; }
.account-danger-btn { background:#a53737!important; color:white!important; border:1px solid #c95353!important; }
.account-dialog [hidden],.account-center [hidden] { display:none!important; }
@media(max-width:1100px) { .view-shell .account-table th:nth-child(1){width:29%}.view-shell .account-table th:nth-child(2){width:29%}.view-shell .account-table th:nth-child(3){width:22%}.view-shell .account-table th:nth-child(4){width:20%}.account-actions{flex-direction:column;align-items:stretch}.account-actions .action-btn{width:100%} }
@media(max-width:760px) { .account-heading{align-items:flex-start;flex-direction:column;gap:16px}.account-toolbar{padding:16px;align-items:stretch;flex-direction:column}.account-count{padding:0}.account-table thead{display:none}.view-shell .account-table,.view-shell .account-table tbody,.view-shell .account-table tr,.view-shell .account-table td{display:block;width:100%!important}.view-shell .account-table tr{padding:16px;border-bottom:1px solid var(--account-border)}.view-shell .account-table td{padding:6px 0;border:0}.account-actions{flex-direction:row;margin-top:8px}.account-actions .action-btn{width:auto;flex:1}.account-dialog-body,.account-dialog-head{padding:20px}.account-form-grid,.account-permission-grid{grid-template-columns:1fr}.account-dialog-footer{padding:16px}.account-dialog-footer .btn{flex:1} }

/* Personal account: compact form, shared theme and accessible entry points. */
.my-account-name { border:0; background:transparent; padding:0; color:inherit; font:inherit; text-align:inherit; cursor:pointer; }
.my-account-name:focus-visible,[data-my-account]:focus-visible { outline:2px solid #35bea0; outline-offset:4px; }
button.profile-avatar { padding:0; cursor:pointer; overflow:hidden; }
.my-account-photo { width:100%; height:100%; object-fit:cover; border-radius:inherit; display:block; }
.account-identity .avatar-sm { overflow:hidden; }
.my-account-dialog { width:min(520px,calc(100vw - 24px)); }
.my-account-photo-row { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.my-account-preview { display:grid; place-items:center; flex:0 0 64px; width:64px; height:64px; border-radius:50%; overflow:hidden; background:var(--bg); font-size:22px; font-weight:700; }
.my-account-upload { position:relative; cursor:pointer; overflow:hidden; }
.my-account-upload input { position:absolute; inset:0; opacity:0; cursor:pointer; }
.my-account-upload:focus-within { outline:2px solid #35bea0; outline-offset:3px; }
.my-account-dialog [hidden] { display:none!important; }
.r2-mobile .header-user.my-account-name { display:block!important; max-width:110px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:12px; }

/* Uploaded portraits must not inherit the old monochrome icon treatment. */
#profileAvatar img.my-account-photo { width:100%; height:100%; object-fit:cover; filter:none; }
html .profile-card .profile-meta h2,
html .profile-card .profile-meta p,
#profileName { white-space:normal; overflow:visible; text-overflow:clip; overflow-wrap:anywhere; }
#profileName { display:block; width:100%; }
