.metrics-cancellation-export__toggle,
.metrics-cancellation-export__cancel,
.metrics-cancellation-export__submit {
  min-height: 38px;
  padding: 0 13px;
  border: 1px solid var(--border-color, #ded8d0);
  border-radius: 10px;
  color: var(--text-primary, #25252b);
  background: var(--surface-primary, #fffdfa);
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.metrics-cancellation-export__toggle:hover,
.metrics-cancellation-export__cancel:hover {
  border-color: var(--brand-orange, #ff6900);
  color: var(--brand-orange-deep, #c54c00);
}
.metrics-cancellation-export__toggle:focus-visible,
.metrics-cancellation-export__cancel:focus-visible,
.metrics-cancellation-export__submit:focus-visible,
.metrics-cancellation-export__field input:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--brand-orange, #ff6900) 30%, transparent);
  outline-offset: 2px;
}
.metrics-cancellation-export__panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 14px;
  margin: 0 0 16px;
  padding: 14px;
  border: 1px solid var(--border-color, #ded8d0);
  border-radius: 12px;
  background: var(--surface-secondary, #f7f3ed);
}
.metrics-cancellation-export__panel,
.metrics-cancellation-export__panel * { box-sizing: border-box; }
.metrics-cancellation-export__panel[hidden] { display: none; }
.metrics-cancellation-export__fields { display: grid; grid-template-columns: repeat(2, minmax(150px, 220px)); gap: 10px; }
.metrics-cancellation-export__field { display: grid; gap: 5px; color: var(--text-secondary, #667085); font-size: 11px; font-weight: 700; }
.metrics-cancellation-export__field input { width: 100%; min-height: 38px; padding: 0 9px; border: 1px solid var(--border-color, #ded8d0); border-radius: 8px; color: var(--text-primary, #25252b); background: var(--surface-primary, #fffdfa); font: inherit; font-size: 12px; }
.metrics-cancellation-export__controls { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px; }
.metrics-cancellation-export__status { flex: 1 1 230px; margin: 0 auto 0 0; color: var(--text-secondary, #667085); font-size: 11px; line-height: 1.45; }
.metrics-cancellation-export__status[data-state="error"] { color: var(--danger, #b42318); }
.metrics-cancellation-export__status[data-state="success"] { color: var(--success, #16845b); }
.metrics-cancellation-export__submit { border-color: var(--brand-orange, #ff6900); color: #fff; background: var(--brand-orange, #ff6900); }
.metrics-cancellation-export__submit:hover { filter: brightness(.96); }
.metrics-cancellation-export__submit:disabled,
.metrics-cancellation-export__cancel:disabled { cursor: wait; opacity: .65; }
@media (max-width: 640px) {
  .metrics-page .cancellation-insights__header { align-items: flex-start; }
  .metrics-cancellation-export__toggle { flex: 0 0 auto; min-height: 42px; padding-inline: 10px; }
  .metrics-cancellation-export__panel { grid-template-columns: minmax(0, 1fr); }
  .metrics-cancellation-export__fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metrics-cancellation-export__controls { justify-content: stretch; }
  .metrics-cancellation-export__status { flex-basis: 100%; }
  .metrics-cancellation-export__cancel,
  .metrics-cancellation-export__submit { flex: 1; min-height: 44px; }
}
