/* Compact account actions and active subscription metadata. */
.trendy-table.matrix-table { min-width: calc(512px + var(--matrix-service-count, 6) * 156px); }
.matrix-service-column--gpt { width: 216px; }
.matrix-board-panel .account-meta { flex: 1 1 0; }
.matrix-board-panel .tag-row.inline { flex: 0 1 auto; max-width: 96px; }
.matrix-board-panel .account-meta .account-name-row {
  display: flex; align-items: center; gap: 5px; min-width: 0; overflow: visible;
}
.account-name-row > strong { min-width: 0; flex: 0 1 auto; }
.account-copy-action {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; flex: 0 0 28px; padding: 5px;
  border: 0; border-radius: 7px; background: transparent; color: var(--text-dim);
  cursor: pointer; transition: color .15s, background .15s;
}
.account-copy-action svg { width: 15px; height: 15px; }
.account-copy-action:hover { color: var(--text-main); background: var(--white-op-hover); }
.account-copy-action:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.matrix-table .service-badge-inline--dates { gap: 7px; vertical-align: middle; }
.matrix-service-dates { display: flex; flex: 0 0 auto; flex-direction: column; gap: 4px; text-align: left; }
.matrix-service-dates > span { display: grid; grid-template-columns: 22px 30px; align-items: baseline; gap: 4px; white-space: nowrap; }
.matrix-service-dates small { color: var(--text-dim); font-size: 10px; font-weight: 400; line-height: 1.2; }
.matrix-service-dates time { color: var(--text-muted); font-size: 11px; font-weight: 500; line-height: 1.2; font-variant-numeric: tabular-nums; }

/* Meaning remains visible on every choice, not only the selected one. */
.service-editor-dialog--brand .status-btn[data-status="inactive"] { --status-color: #b7c3d4; }
.service-editor-dialog--brand .status-btn[data-status="active"] { --status-color: #45d4a3; }
.service-editor-dialog--brand .status-btn[data-status="completed"] { --status-color: #a1aaff; }
[data-theme="light"] .service-editor-dialog--brand .status-btn[data-status="inactive"] { --status-color: #526379; }
[data-theme="light"] .service-editor-dialog--brand .status-btn[data-status="active"] { --status-color: #087b52; }
[data-theme="light"] .service-editor-dialog--brand .status-btn[data-status="completed"] { --status-color: #4f57bd; }
.service-editor-popover.service-editor-dialog.service-editor-dialog--brand .status-btn {
  color: var(--status-color); border: 1px solid transparent; border-radius: 9px;
}
.service-editor-popover.service-editor-dialog.service-editor-dialog--brand .status-btn + .status-btn { border-left-color: transparent; }
.service-editor-popover.service-editor-dialog.service-editor-dialog--brand .status-btn.active {
  color: var(--status-color);
  background: color-mix(in srgb, var(--status-color) 15%, transparent);
  border-color: color-mix(in srgb, var(--status-color) 38%, transparent);
}
.service-editor-popover.service-editor-dialog.service-editor-dialog--brand .status-btn:hover:not(.active) {
  color: var(--status-color); background: color-mix(in srgb, var(--status-color) 7%, transparent);
}
.service-editor-dialog--brand[data-usage-state="inactive"] .service-brand-status { color: #b7c3d4; }
.service-editor-dialog--brand[data-usage-state="active"] .service-brand-status { color: #45d4a3; }
.service-editor-dialog--brand[data-usage-state="completed"] .service-brand-status { color: #a1aaff; }
[data-theme="light"] .service-editor-dialog--brand[data-usage-state="inactive"] .service-brand-status { color: #526379; }
[data-theme="light"] .service-editor-dialog--brand[data-usage-state="active"] .service-brand-status { color: #087b52; }
[data-theme="light"] .service-editor-dialog--brand[data-usage-state="completed"] .service-brand-status { color: #4f57bd; }

/* A field editor owns its footer; the overview save returns after apply/close. */
.service-editor-dialog--brand .service-editor-content.is-editing {
  grid-template-rows: auto minmax(0, 1fr);
}
.service-editor-dialog--brand .is-flat-stage .service-editor-stage-body--date {
  grid-template-rows: auto auto minmax(0, 1fr);
  overflow: visible;
}
.service-editor-dialog--brand .is-flat-stage .service-editor-stage-body--date-input {
  grid-template-rows: auto auto auto minmax(0, 1fr);
}
.service-editor-dialog--brand .is-flat-stage .service-inline-days {
  min-height: 0;
  grid-template-rows: repeat(6, minmax(32px, 1fr));
}
.service-editor-dialog--brand .is-flat-stage .service-editor-stage-footer {
  display: flex;
}
.service-editor-dialog--brand .is-flat-stage .service-stage-apply {
  width: 112px;
  flex: 0 0 auto;
  margin-left: auto;
}

@media (max-height: 720px) {
  html[data-layout-profile="phone"] .service-editor-dialog--brand .service-editor-content.is-editing {
    padding: 12px 16px max(12px, env(safe-area-inset-bottom, 0px));
    gap: 12px;
  }
  html[data-layout-profile="phone"] .service-editor-content.is-editing :is(.service-editor-status-hint, .service-editor-dialog-label) { display: none; }
  html[data-layout-profile="phone"] .service-editor-dialog--brand .is-flat-stage .service-editor-stage-panel--flat { gap: 8px; }
  html[data-layout-profile="phone"] .service-editor-dialog--brand .is-flat-stage .service-editor-stage-header { padding-bottom: 8px; }
  html[data-layout-profile="phone"] .service-editor-dialog--brand .is-flat-stage .service-editor-stage-footer { padding-top: 10px; }
  html[data-layout-profile="phone"] .service-editor-dialog--brand .is-flat-stage .service-editor-stage-body--date { gap: 6px; }
}
