:host { display: block; } .tenant-card { min-width: 0; padding: 20px; border: 1px solid var(--border); border-radius: 22px; background: var(--surface); } .tenant-identity { display: flex; align-items: center; gap: 14px; } .tenant-identity h2 { margin: 0; font-size: 1.25rem; letter-spacing: -0.03em; } .tenant-avatar { display: grid; width: 46px; height: 46px; flex: 0 0 46px; place-items: center; border-radius: 15px; background: var(--surface-accent); color: var(--accent); font-weight: 800; } .contact-list { display: grid; gap: 11px; margin: 22px 0; } .contact-list div { min-width: 0; } .contact-list dt { color: var(--text-subtle); font-size: 0.7rem; font-weight: 750; text-transform: uppercase; } .contact-list dd { overflow-wrap: anywhere; margin: 3px 0 0; font-size: 0.88rem; } .attachments { padding: 15px; border-radius: 15px; background: var(--surface-soft); } .section-title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; font-size: 0.82rem; } .section-title span { display: grid; min-width: 24px; height: 24px; place-items: center; border-radius: 50%; background: var(--surface); color: var(--text-muted); } .attachment-item { min-width: 0; } .attachment-actions { display: flex; align-items: center; gap: 4px; } .attachment-row.mat-mdc-button { --mdc-text-button-label-text-color: var(--text); flex: 1; min-width: 0; justify-content: flex-start; padding: 0 5px; font-size: 0.78rem; } .attachment-delete.mat-mdc-button { --mdc-text-button-label-text-color: var(--danger); flex: 0 0 auto; min-width: 32px; padding: 0 5px; font-size: 0.9rem; } .upload-action { display: block; min-height: 40px; padding: 11px 5px 4px; color: var(--accent); cursor: pointer; font-size: 0.78rem; font-weight: 750; } .upload-action input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } .upload-action small { color: var(--text-muted); font-weight: 500; } .upload-progress { display: grid; gap: 8px; margin-top: 12px; color: var(--text-muted); font-size: 0.82rem; } .attachment-row mat-spinner, .card-actions mat-spinner { display: inline-block; margin-right: 6px; vertical-align: middle; } .attachment-error { margin: 8px 0 0; color: var(--danger); font-size: 0.78rem; } .card-actions { display: flex; justify-content: flex-end; margin-top: 12px; } .card-actions .mat-mdc-button { --mdc-text-button-label-text-color: var(--accent); } .card-actions .danger-action.mat-mdc-button { --mdc-text-button-label-text-color: var(--danger); }