/* ================================================================
   styles-companies.css — Companies page (HubSpot-style list view)
   ================================================================ */

/* ── "All filters" link pill ── */
.btn-link-filters {
  background: none; border: none; cursor: pointer;
  color: var(--teal); font-size: 12.5px; font-weight: 600;
  font-family: 'DM Sans', sans-serif;
  padding: 8px 4px;
  white-space: nowrap;
}
.btn-link-filters:hover { text-decoration: underline; }

/* ── Row checkbox ── */
.row-check {
  width: 15px; height: 15px; cursor: pointer;
  accent-color: var(--teal);
}

/* ── Company name cell ── */
.company-name-cell {
  display: flex; align-items: center; gap: 4px;
  color: var(--teal); font-weight: 600; cursor: pointer;
}
.company-name-cell:hover { text-decoration: underline; }

/* ── Associations: avatar stack ── */
.avatar-stack {
  display: flex; align-items: center;
}
.avatar-chip {
  width: 26px; height: 26px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 10px; font-weight: 700; color: #fff;
  font-family: 'Syne', sans-serif;
  border: 2px solid var(--card-bg);
  margin-left: -8px;
  flex-shrink: 0;
}
.avatar-stack .avatar-chip:first-child { margin-left: 0; }
.avatar-chip.more {
  background: var(--off-white) !important;
  color: var(--muted) !important;
  font-size: 9.5px;
}
.associations-empty { color: var(--muted); font-size: 12px; }

/* ── Type text ── */
.company-type { color: var(--page-title-color); }
.company-type.empty { color: var(--muted); }

/* ── Last updated / Added by cells ── */
.company-updated-main { color: var(--page-title-color); font-size: 12.5px; }
.company-updated-sub { color: var(--muted); font-size: 11px; margin-top: 2px; }
.company-added-by { color: var(--page-title-color); font-size: 12.5px; }
.company-added-sub { color: var(--muted); font-size: 11px; margin-top: 2px; }

/* ── Row actions dropdown ── */
.dropdown { position: relative; display: inline-block; }
.dropdown-menu {
  display: none;
  position: absolute; right: 0; top: calc(100% + 6px);
  min-width: 168px;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 12px 28px rgba(0,0,0,0.16);
  padding: 6px;
  z-index: 40;
}
.dropdown.open .dropdown-menu { display: block; }
.dropdown-menu button,
.dropdown-menu a {
  display: block; width: 100%; text-align: left;
  background: none; border: none; cursor: pointer;
  padding: 8px 10px; border-radius: 7px;
  font-size: 12.5px; color: var(--page-title-color);
  font-family: 'DM Sans', sans-serif;
  text-decoration: none;
}
.dropdown-menu button:hover,
.dropdown-menu a:hover { background: var(--teal-dim); color: var(--teal); }
.dropdown-menu .danger:hover { background: rgba(220,38,38,0.08); color: var(--danger); }

.row-actions-cell { text-align: right; }
.row-actions-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 10px; border-radius: 7px;
  border: 1px solid var(--btn-secondary-border, var(--border));
  background: var(--btn-secondary-bg, transparent);
  color: var(--btn-secondary-color, var(--page-title-color));
  font-size: 12px; font-family: 'DM Sans', sans-serif;
  cursor: pointer;
}
.row-actions-btn:hover { border-color: var(--teal-border); color: var(--teal); }
.row-actions-btn svg { width: 12px; height: 12px; }

/* ── Company detail modal: association list ── */
.company-modal-section { margin-bottom: 18px; }
.company-modal-section:last-child { margin-bottom: 0; }
.company-modal-label {
  font-size: 10.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--muted); margin-bottom: 8px;
}
.company-modal-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 12px; border-radius: 8px;
  border: 1px solid var(--border);
  margin-bottom: 6px;
  font-size: 12.5px;
}
.company-modal-row:last-child { margin-bottom: 0; }
.company-modal-row-title { color: var(--page-title-color); font-weight: 600; }
.company-modal-row-sub { color: var(--muted); font-size: 11.5px; margin-top: 2px; }

/* ── Inline "add association" form inside the company modal ── */
.add-association-form {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin-bottom: 12px; padding: 10px;
  border: 1px dashed var(--border); border-radius: 8px;
}
.field-input-sm {
  flex: 1 1 120px; min-width: 100px;
  padding: 8px 10px; border-radius: 7px;
  border: 1px solid var(--field-input-border, var(--border));
  background: var(--field-input-bg, transparent);
  color: var(--field-input-color, var(--page-title-color));
  font-size: 12.5px; font-family: 'DM Sans', sans-serif; outline: none;
}
.field-input-sm:focus { border-color: var(--teal-border); }

@media (max-width: 900px) {
  .companies-table th:nth-child(4),
  .companies-table td:nth-child(4) { display: none; }
}

  .companies-table th:nth-child(1), .companies-table td:nth-child(1) { width: 1%; min-width: 10px; } /* checkbox */
  .companies-table th:nth-child(2), .companies-table td:nth-child(2) { width: 17%; min-width: 10px; } /* location */
  .companies-table th:nth-child(3), .companies-table td:nth-child(3) { width: 14%; min-width: 10px; } /* associations */
  .companies-table th:nth-child(4), .companies-table td:nth-child(4) { width: 12%; min-width: 10px; } /* associations */
  .companies-table th:nth-child(5), .companies-table td:nth-child(5) { width: 14%; min-width: 10px} /* associations */
  .companies-table th:nth-child(6), .companies-table td:nth-child(6) { width: 14%; min-width: 10px} /* associations */
  .companies-table th:nth-child(7), .companies-table td:nth-child(7) { width: 10%; min-width: 80px; } /* products */

.companies-table {
    table-layout: auto !important;
}