/* P3.10 API keys and P.1 Activity (keys-activity-ui in app.js). DS components
   (.h-table, .h-chart, .h-filter, .h-modal, .h-seg...) live in homla-shell.css;
   this file only places them. */

/* A menu anchored to its trigger: ⋯ on a key row, the Activity filters. */
.hka-pop { position: relative; display: inline-flex; }
.hka-menu { min-width: 180px; }
.hka-menu--left { left: 0; right: auto; }
.hka-menu .h-menu__search .h-input { width: 100%; }
.hka-menu [data-hka-vals] { max-height: 280px; overflow: auto; }

/* Create key modal: the "N more" link at the end of the connector list. */
.hka-more { border: 0; background: none; padding: 0; cursor: pointer; color: var(--text-2); text-decoration: none; }
.hka-more:hover { color: var(--text); text-decoration: underline; text-underline-offset: 2px; }
.hka-error { color: var(--danger); margin: 0; }
.hka-backdrop .h-modal { max-height: calc(100dvh - 32px); overflow: auto; }
.hka-backdrop .h-seg__btn:disabled { opacity: .4; cursor: not-allowed; }

/* Activity table: the status cell holds only a "Failed" pill, never an "OK". */
#view-activity .h-table td:last-child { text-align: right; }
#view-activity .hka-skel-head .h-skel { height: 8px; }
#view-activity .hka-skel-head { padding: 12px 16px; }

@media (max-width: 720px) {
  #view-activity .h-page-head, #view-apikeys .h-page-head { gap: var(--s-3); }
  #view-activity .h-filters { flex-wrap: wrap; }
  #view-activity .h-table td:last-child { text-align: left; }
  #view-activity .h-table--cards td:last-child:empty, #view-activity .h-table--cards td:last-child:not(:has(*)) { display: none; }
}