/* Contacts Module Styles (Odoo Enterprise) */

/* ─── Contact Detail ─── */
.contact-detail { padding-bottom: var(--space-xl); }

/* Contact header with avatar area */
.contact-header {
  text-align: center;
  padding: var(--space-lg) var(--space-md);
  margin-bottom: var(--space-md);
}
.contact-header__avatar {
  width: 64px; height: 64px;
  border-radius: var(--radius-full);
  background: var(--o-brand-primary);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: var(--font-size-2xl); font-weight: var(--font-weight-bold);
  margin: 0 auto var(--space-sm);
}
.contact-header__name {
  font-size: var(--font-size-xl); font-weight: var(--font-weight-bold);
  margin-bottom: var(--space-xs);
}

/* Quick action buttons row (Call, Email, etc.) */
.contact-actions-row {
  display: flex; justify-content: center;
  gap: var(--space-md);
  padding: var(--space-md) 0;
  margin-bottom: var(--space-md);
}

/* ─── Contacts List ─── */
.contacts-list { position: relative; }
.contacts-list__items { display: flex; flex-direction: column; }

.contact-card .card__body {
  display: flex; align-items: center; justify-content: space-between;
}
.contact-card__info {
  display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0;
}
.contact-card__meta {
  display: flex; flex-direction: column; align-items: flex-end; gap: var(--space-xs);
  flex-shrink: 0; margin-left: var(--space-sm);
}

/* Contact name & location */
.contact-name {
  font-weight: var(--font-weight-semibold); font-size: var(--font-size-base);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.contact-location {
  font-size: var(--font-size-xs); color: var(--color-text-muted);
}
.contact-email, .contact-phone {
  color: var(--o-brand-primary); text-decoration: none; font-size: var(--font-size-sm);
}

/* Filter tabs */
.filter-tabs { display: flex; gap: var(--space-xs); }
.filter-btn {
  padding: 4px var(--space-sm);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-full);
  background: var(--color-surface);
  color: var(--color-text-secondary);
  font-size: var(--font-size-xs);
  cursor: pointer;
  transition: all var(--transition-fast);
}
.filter-btn:active { background: var(--color-gray-200); }
.filter-btn.active {
  background: var(--o-brand-primary);
  color: #fff;
  border-color: var(--o-brand-primary);
}

/* ─── Contact Form ─── */
.form-radio-group { display: flex; gap: var(--space-md); }
.form-radio {
  display: flex; align-items: center; gap: var(--space-xs);
  cursor: pointer; font-size: var(--font-size-sm);
}
.form-radio input { margin: 0; accent-color: var(--o-brand-primary); }

/* ─── Responsive ─── */
@media (max-width: 480px) {
  .filter-tabs { overflow-x: auto; }
  .contact-actions-row { gap: var(--space-sm); }
}