/*
 * Address Book panel. Prefixed `address-book-`.
 * Shared chrome: Section / KeyValueRow / EmptyState / .charter-section.
 * Do not redefine .section-header / .empty-state / .back-btn / .action-btn.
 *
 * What-it-is body uses shared primitives. Longer copy lives in
 * Section.hint / native title= tooltips (`.m-tip`). Commit
 * affordances live on the panel bar, not in section bodies.
 */

.address-book-panel {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-height: 0;
}

.address-book-panel > .panel-scrollable {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
    padding-inline: var(--panel-edge-pad);
    padding-block: var(--panel-edge-pad);
}

.address-book-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: var(--spacing-sm);
}

.address-book-toolbar__search {
    flex: 1;
    min-width: 0;
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--radius-sm);
    border: 1px solid color-mix(in srgb, var(--text-accent) 35%, transparent);
    background: color-mix(in srgb, var(--card-bg) 80%, transparent);
    color: var(--text-primary);
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.85rem;
}

.address-book-toolbar__search:focus {
    outline: none;
    border-color: var(--text-accent);
}

.address-book-list,
.address-book-detail {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.address-book-list-rows {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.address-book-list-row {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--radius-sm);
    border: 1px solid color-mix(in srgb, var(--anviz-accent-secondary) 16%, transparent);
    background: color-mix(in srgb, var(--anviz-bg-panel) 100%, transparent);
    cursor: pointer;
}

.address-book-list-row:hover {
    background: var(--interactive-hover-bg);
    outline: var(--interactive-hover-outline);
}

.address-book-list-row:focus-visible {
    outline: var(--interactive-focus-outline);
    outline-offset: var(--interactive-focus-offset);
}

.address-book-list-row__main {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
    min-width: 0;
}

.address-book-list-row__name {
    display: flex;
    align-items: baseline;
    gap: var(--spacing-sm);
    font-family: 'IBM Plex Sans', system-ui, sans-serif;
    font-size: 0.85rem;
    font-weight: 650;
    color: var(--text-primary);
}

.address-book-list-row__lifecycle {
    font-size: 0.72rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text-muted);
}

.address-book-list-row__identifier {
    margin: 0;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.78rem;
    color: var(--text-secondary);
    overflow-wrap: anywhere;
}

.address-book-list-row__meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
}

.address-book-list-row__tags,
.address-book-detail__tags {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-xs);
}

.address-book-list-row__tag,
.address-book-detail__tag {
    padding: 0 var(--spacing-sm);
    border-radius: var(--radius-pill);
    border: 1px solid color-mix(in srgb, var(--anviz-accent-secondary) 28%, transparent);
    color: var(--text-muted);
    font-size: 0.72rem;
    letter-spacing: 0.04em;
}

.address-book-detail__header {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.address-book-detail__title {
    margin: 0;
    font-family: 'IBM Plex Sans', system-ui, sans-serif;
    font-size: 0.95rem;
    font-weight: 650;
    letter-spacing: 0.02em;
    color: var(--text-primary);
}

.address-book-detail__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.address-book-detail__identifier-row,
.address-book-detail__address-row,
.address-book-detail__credential-row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--spacing-sm);
    min-width: 0;
}

.address-book-detail__identifier-kind {
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-muted);
}

.address-book-detail__identifier-value {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.8rem;
    color: var(--text-primary);
    overflow-wrap: anywhere;
}

.address-book-detail__identifier-verified {
    font-size: 0.72rem;
    color: var(--text-success);
}

.address-book-detail__identifier-unverified {
    font-size: 0.72rem;
    color: var(--text-muted);
}

.address-book-contact-modal,
.address-book-credential-modal {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.address-book-contact-modal__field-group,
.address-book-credential-modal__field-group {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.address-book-contact-modal__field-row,
.address-book-credential-modal__field-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    gap: var(--spacing-sm);
}

.address-book-status {
    margin: 0;
    font-size: 0.78rem;
    color: var(--text-muted);
}