:is(#modalenviado, #modaldataerror, #modalresperror) .modal-dialog {
  width: min(calc(100% - 32px), 480px);
  margin-inline: auto;
}

:is(#modalenviado, #modaldataerror, #modalresperror) .modal-content {
  overflow: hidden;
  background-color: var(--color-surface);
  color: var(--color-text);
  border: 0;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
}

#modalenviado .modal-content {
  border-top: 5px solid var(--color-success);
}

:is(#modaldataerror, #modalresperror) .modal-content {
  border-top: 5px solid var(--color-error);
}

:is(#modalenviado, #modaldataerror, #modalresperror) .modal-header {
  align-items: center;
  padding: var(--space-5) var(--space-5) var(--space-4);
  border-bottom: 1px solid var(--color-border);
}

:is(#modalenviado, #modaldataerror, #modalresperror) .modal-title {
  margin: 0;
  color: var(--color-text);
  font-family: var(--font-family-heading);
  font-size: 1.5rem !important;
  font-weight: 700;
}

:is(#modalenviado, #modaldataerror, #modalresperror) .btn-close {
  width: 36px;
  height: 36px;
  margin: 0;
  padding: 0;
  background-color: var(--color-surface-muted);
  background-size: 12px;
  border-radius: var(--radius-pill);
  opacity: 0.72;
}

:is(#modalenviado, #modaldataerror, #modalresperror) .btn-close:hover {
  opacity: 1;
  transform: rotate(4deg);
}

:is(#modalenviado, #modaldataerror, #modalresperror) .modal-body {
  padding: var(--space-6) var(--space-5);
  background-color: var(--color-surface);
  color: var(--color-text-muted);
  font-family: var(--font-family-body);
  font-size: 1.333rem;
  line-height: 1.6;
}

:is(#modalenviado, #modaldataerror, #modalresperror) .modal-footer {
  padding: var(--space-4) var(--space-5) var(--space-5);
  background-color: var(--color-surface);
  border-top: 0;
}

:is(#modalenviado, #modaldataerror, #modalresperror) .modal-footer .btn {
  min-width: 112px;
  min-height: 44px;
  padding: var(--space-2) var(--space-5);
  background-color: var(--color-primary);
  color: var(--color-surface);
  border: 1px solid var(--color-primary);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  font-family: var(--font-family-body);
  font-size: 1.167rem;
  font-weight: 600;
}

:is(#modalenviado, #modaldataerror, #modalresperror) .modal-footer .btn:hover {
  background-color: var(--color-primary-hover);
  border-color: var(--color-primary-hover);
  box-shadow: var(--shadow-md);
  transform: translateY(-1px);
}

:is(#modalenviado, #modaldataerror, #modalresperror) .modal-footer .btn:active {
  background-color: var(--color-primary-active);
  border-color: var(--color-primary-active);
  box-shadow: var(--shadow-sm);
  transform: translateY(0);
}

.modal-backdrop.show {
  opacity: 0.56;
  backdrop-filter: blur(3px);
}

@media (max-width: 575px) {
  :is(#modalenviado, #modaldataerror, #modalresperror) .modal-header {
    padding: var(--space-4);
  }

  :is(#modalenviado, #modaldataerror, #modalresperror) .modal-body {
    padding: var(--space-5) var(--space-4);
  }

  :is(#modalenviado, #modaldataerror, #modalresperror) .modal-footer {
    padding: var(--space-3) var(--space-4) var(--space-4);
  }

  :is(#modalenviado, #modaldataerror, #modalresperror) .modal-footer .btn {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  :is(#modalenviado, #modaldataerror, #modalresperror) .modal-dialog,
  :is(#modalenviado, #modaldataerror, #modalresperror) .btn {
    transition: none;
  }
}