/*
 * Minimal look. Every rule is wrapped in :where() so it has zero specificity:
 * any theme rule wins without !important. Turn this file off with the cf7ac_enqueue_style filter.
 */
:where(.cf7ac-confirm[hidden]) {
  display: none;
}

:where(.cf7ac-confirm__lead) {
  margin: 0 0 1.5em;
}

:where(.cf7ac-confirm__lead:focus) {
  outline: none;
}

:where(.cf7ac-confirm__list) {
  margin: 0 0 2em;
}

:where(.cf7ac-confirm__row) {
  display: grid;
  grid-template-columns: minmax(8em, 14em) 1fr;
  gap: 0.5em 1.5em;
  padding: 0.9em 0;
  border-bottom: 1px solid rgba(127, 127, 127, 0.3);
}

:where(.cf7ac-confirm__label) {
  margin: 0;
  font-weight: bold;
}

:where(.cf7ac-confirm__value) {
  margin: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

:where(.cf7ac-confirm__value.is-empty) {
  opacity: 0.6;
}

:where(.cf7ac-confirm__status:empty) {
  display: none;
}

:where(.cf7ac-confirm__actions) {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch; /* buttons on one line share a height */
  gap: 1em;
}

:where(.cf7ac-confirm__actions button) {
  min-width: min(100%, 12em);
  padding: 0.9em 1.8em;
  font: inherit;
  border-radius: 4px;
  cursor: pointer;
}

/* The back button is a quiet outline; the send button uses the theme's submit classes when it has them. */
:where(.cf7ac-confirm__back),
:where(.cf7ac-confirm__send:not(.cf7ac-themed)) {
  color: inherit;
  background: transparent;
  border: 1px solid currentColor;
}

:where(.cf7ac-confirm__send:not(.cf7ac-themed)) {
  font-weight: bold;
}

:where(.cf7ac-confirm__actions button:disabled) {
  cursor: default;
  opacity: 0.6;
}

@media (max-width: 600px) {
  :where(.cf7ac-confirm__row) {
    grid-template-columns: 1fr;
    gap: 0.25em;
  }
}