/* Name card + trait pills + badges. Shared by search, archives, favorites. */

.abn-card {
	position: relative; background: #fff; border: 1px solid var(--abn-border);
	border-radius: var(--abn-radius-lg); padding: 1.5rem 1.35rem 1.35rem;
	transition: transform var(--abn-transition), box-shadow var(--abn-transition), border-color var(--abn-transition);
	display: flex; flex-direction: column; min-height: 100%;
}
.abn-card:hover { transform: translateY(-4px); box-shadow: var(--abn-shadow); border-color: transparent; }
.abn-card::before {
	content: ""; position: absolute; left: 0; top: 1.5rem; bottom: 1.5rem; width: 4px;
	border-radius: 4px; background: var(--abn-secondary);
}
.abn-card[data-gender="girl"]::before { background: var(--abn-girl); }
.abn-card[data-gender="boy"]::before { background: var(--abn-boy); }
.abn-card[data-gender="unisex"]::before { background: var(--abn-unisex); }

.abn-card__name { font-family: var(--abn-font-display); font-size: 1.55rem; font-weight: 700; color: var(--abn-dark); margin: 0 0 0.15rem; line-height: 1.1; }
.abn-card__name a { color: inherit; }
.abn-card__name a:hover { color: var(--abn-primary); }
.abn-card__meta { display: flex; align-items: center; gap: 0.5rem; font-size: 0.9rem; color: var(--abn-muted); margin-bottom: 0.6rem; }
.abn-card__flag { font-size: 1.15rem; }
.abn-card__meaning { color: var(--abn-text); font-size: 0.98rem; margin: 0 0 1rem; flex: 1; }

.abn-gender-icon { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font-size: 0.7rem; color: #fff; font-weight: 800; }
.abn-gender-icon[data-gender="girl"] { background: var(--abn-girl); }
.abn-gender-icon[data-gender="boy"] { background: var(--abn-boy); }
.abn-gender-icon[data-gender="unisex"] { background: var(--abn-unisex); }

.abn-badge { display: inline-flex; align-items: center; gap: 0.3rem; font-family: var(--abn-font-heading); font-weight: 800; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; padding: 0.25rem 0.6rem; border-radius: var(--abn-radius-pill); }
.abn-badge--trending { background: var(--abn-accent); color: var(--abn-dark); position: absolute; top: 0.9rem; right: 0.9rem; }

/* Heart / save button */
.abn-save {
	background: none; border: 0; cursor: pointer; color: var(--abn-muted);
	display: inline-flex; align-items: center; gap: 0.35rem; font-family: var(--abn-font-heading); font-weight: 700; font-size: 0.9rem;
	padding: 0.3rem 0; transition: color var(--abn-transition), transform var(--abn-transition);
}
.abn-save:hover { color: var(--abn-girl); }
.abn-save svg { width: 20px; height: 20px; }
.abn-save[aria-pressed="true"] { color: var(--abn-girl); }
.abn-save[aria-pressed="true"] svg { fill: var(--abn-girl); }
.abn-save.is-bumping { transform: scale(1.25); }

.abn-card__foot { display: flex; align-items: center; justify-content: space-between; margin-top: auto; }

/* Trait pills */
.abn-traits { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.abn-trait-pill { font-size: 0.82rem; font-weight: 700; font-family: var(--abn-font-heading); padding: 0.28rem 0.7rem; border-radius: var(--abn-radius-pill); background: rgba(78,205,196,0.16); color: var(--abn-secondary-dark); }
.abn-trait-pill:hover { background: var(--abn-secondary); color: #fff; }

/* Trend delta arrow */
.abn-delta { font-weight: 800; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.2rem; }
.abn-delta--up { color: #1f9d6b; }
.abn-delta--down { color: #d4503e; }
.abn-delta--flat { color: var(--abn-muted); }