/**
 * BeMyNet — modales alignées dashboard Metronic / Bootstrap.
 */
:root {
  --bmn-modal-z: 10550;
  --bmn-modal-width: min(32rem, calc(100vw - 2rem));
  --bmn-modal-card-width: min(28rem, calc(100vw - 2rem));
  --bmn-pay-card-shadow: 0 10px 40px rgba(15, 23, 42, 0.08);
  --bmn-pay-card-radius: 1rem;
}

/* ── SweetAlert2 ─────────────────────────────────────────────── */
.swal2-container {
  z-index: var(--bmn-modal-z) !important;
}

.swal2-container.swal2-backdrop-show {
  background: rgba(0, 0, 0, 0.2) !important;
}

.swal2-popup.bmn-modal,
.swal2-popup.bmn-swal-popup {
  width: var(--bmn-modal-width) !important;
  max-width: calc(100vw - 2rem) !important;
  padding: 2rem !important;
  border-radius: var(--bs-border-radius-lg, 0.625rem) !important;
  background: var(--bs-body-bg) !important;
  font-family: Inter, Helvetica, sans-serif !important;
}

.swal2-popup.bmn-modal .swal2-title,
.swal2-popup.bmn-swal-popup .swal2-title {
  font-size: 1.3rem !important;
  font-weight: 500 !important;
  color: var(--bs-gray-900, var(--bs-emphasis-color)) !important;
  text-align: left;
  padding: 0;
  margin: 0 0 0.5rem !important;
}

.swal2-popup.bmn-modal .swal2-html-container,
.swal2-popup.bmn-swal-popup .swal2-html-container {
  font-size: 1rem !important;
  font-weight: 400 !important;
  color: var(--bs-gray-800, var(--bs-body-color)) !important;
  text-align: left;
  margin: 0 !important;
  padding: 0 !important;
  max-height: min(55dvh, 28rem);
  overflow-y: auto;
}

.swal2-popup.bmn-modal .swal2-icon,
.swal2-popup.bmn-swal-popup .swal2-icon {
  border: none;
  margin: 0 0 1.25rem;
  width: auto;
  height: auto;
  min-height: 0;
  transform: none !important;
}

.swal2-popup.bmn-modal .swal2-icon .bmn-modal-ki,
.swal2-popup.bmn-swal-popup .swal2-icon .bmn-modal-ki {
  display: block;
  font-size: 3rem !important;
  line-height: 1;
}

.swal2-popup.bmn-modal .swal2-actions,
.swal2-popup.bmn-swal-popup .swal2-actions {
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 0.5rem;
  margin: 1.5rem 0 0 !important;
  padding: 0;
  width: 100%;
  border-top: 0;
}

.swal2-popup.bmn-modal .swal2-actions button,
.swal2-popup.bmn-swal-popup .swal2-actions button {
  width: auto;
  min-height: auto;
  margin: 0 !important;
}

.swal2-popup.bmn-modal--progress,
.swal2-popup.bmn-swal-progress-popup {
  text-align: center;
}

.swal2-popup.bmn-modal--progress .swal2-title,
.swal2-popup.bmn-modal--progress .swal2-html-container,
.swal2-popup.bmn-swal-progress-popup .swal2-html-container {
  text-align: center;
}

.swal2-popup.bmn-modal--loading .swal2-loader,
.swal2-popup.bmn-swal-loading .swal2-loader {
  display: none !important;
}

/* ── Carte pay (charte pay.bemynet.fr / success.php) ──────────── */
.swal2-popup.bmn-modal--pay-card {
  width: min(28rem, calc(100vw - 2rem)) !important;
  max-width: calc(100vw - 2rem) !important;
  border: 0 !important;
  border-radius: var(--bmn-pay-card-radius) !important;
  box-shadow: var(--bmn-pay-card-shadow) !important;
  padding: 2rem !important;
}

.swal2-popup.bmn-modal--pay-confirm,
.swal2-popup.bmn-modal--pay-success,
.swal2-popup.bmn-modal--pay-error {
  text-align: center;
}

.swal2-popup.bmn-modal--pay-confirm .swal2-title,
.swal2-popup.bmn-modal--pay-success .swal2-title,
.swal2-popup.bmn-modal--pay-error .swal2-title {
  display: none !important;
}

.swal2-popup.bmn-modal--pay-confirm .swal2-html-container,
.swal2-popup.bmn-modal--pay-success .swal2-html-container,
.swal2-popup.bmn-modal--pay-error .swal2-html-container {
  text-align: center;
  max-height: none;
  overflow: visible;
  margin: 0 !important;
  padding: 0 !important;
}

.bmn-pay-sheet__icon {
  font-size: 5rem;
  line-height: 1;
}

.bmn-pay-sheet code {
  font-size: 0.75rem;
  word-break: break-word;
}

.bmn-pay-total {
  font-size: 2rem;
  font-weight: 700;
  color: #0f172a;
  font-variant-numeric: tabular-nums;
}

/* ── Carte modale legacy (alertes simples) ───────────────────── */
.swal2-popup.bmn-modal--card {
  width: var(--bmn-modal-card-width) !important;
  max-width: calc(100vw - 2rem) !important;
  padding: 1.75rem !important;
  border-radius: 1rem !important;
  box-shadow: 0 10px 40px rgba(15, 23, 42, 0.08) !important;
}

.swal2-popup.bmn-modal--card.bmn-modal--with-icon .swal2-icon {
  margin: 0 0 1rem !important;
}

.swal2-popup.bmn-modal--card-success,
.swal2-popup.bmn-modal--card-error {
  text-align: center;
}

.swal2-popup.bmn-modal--card-success .swal2-title,
.swal2-popup.bmn-modal--card-error .swal2-title {
  display: none !important;
}

.swal2-popup.bmn-modal--card-success .swal2-html-container,
.swal2-popup.bmn-modal--card-error .swal2-html-container {
  text-align: center;
  max-height: none;
  overflow: visible;
}

/* ── Bootstrap modal ─────────────────────────────────────────── */
.modal.bmn-modal {
  --bs-modal-border-radius: var(--bs-border-radius-lg, 0.625rem);
  z-index: var(--bmn-modal-z);
}

.modal.bmn-modal .modal-dialog {
  max-width: var(--bmn-modal-width);
}

.modal.bmn-modal .modal-content {
  border: 1px solid var(--bs-border-color);
  box-shadow: var(--bs-box-shadow);
}

.modal.bmn-modal .modal-header {
  border-bottom: 1px solid var(--bs-border-color);
}

.modal.bmn-modal .modal-title {
  font-weight: 600;
  color: var(--bs-gray-900, var(--bs-emphasis-color));
}

.modal.bmn-modal .modal-body {
  color: var(--bs-gray-800, var(--bs-body-color));
}

.modal.bmn-modal .modal-footer {
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
  border-top: 1px solid var(--bs-border-color);
}

/* ── Cookies ─────────────────────────────────────────────────── */
.cookie-modal {
  z-index: var(--bmn-modal-z);
}

.cookie-modal__backdrop {
  background: rgba(0, 0, 0, 0.2);
}

.cookie-modal__panel {
  width: var(--bmn-modal-width);
  max-width: calc(100vw - 2rem);
  border-radius: var(--bs-border-radius-lg, 0.625rem);
  border: 1px solid var(--bs-border-color);
  background: var(--bs-body-bg);
  color: var(--bs-gray-900, var(--bs-emphasis-color));
  box-shadow: var(--bs-box-shadow);
  padding: 1.75rem;
}

.cookie-modal__title {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--bs-gray-900, var(--bs-emphasis-color));
  margin: 0 0 0.75rem;
}

.cookie-modal__text {
  font-size: 1rem;
  color: var(--bs-gray-800, var(--bs-body-color));
  line-height: 1.6;
  margin: 0 0 1rem;
}

.cookie-modal__text a {
  color: var(--bs-primary);
}

.cookie-modal__note {
  font-size: 0.925rem;
  color: var(--bs-primary);
  margin: 0 0 1rem;
}

.cookie-modal__actions {
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
  margin: 0;
  padding-top: 1rem;
  border-top: 1px solid var(--bs-border-color);
}

.cookie-modal__actions--intro {
  margin-top: 0.25rem;
}

.cookie-modal__actions .btn {
  width: auto;
  min-height: auto;
}

.cookie-modal__btn-wide {
  flex: 0 1 auto;
}

.cookie-modal__close.btn-close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 2;
}

/* ── Recap document (dashboard) ──────────────────────────────── */
.bmn-doc-recap-wrap.alert {
  text-align: left;
  margin-bottom: 0;
}

.bmn-doc-recap {
  display: grid;
  grid-template-columns: minmax(0, 38%) 1fr;
  gap: 0.35rem 1rem;
  margin: 0;
}

.bmn-doc-recap-label {
  margin: 0;
  font-size: 0.8rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--bs-text-muted, var(--bs-secondary-color));
}

.bmn-doc-recap-value {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--bs-gray-900, var(--bs-emphasis-color));
  word-break: break-word;
  font-variant-numeric: tabular-nums;
}

/* ── Progress ────────────────────────────────────────────────── */
.bmn-modal-progress {
  padding: 0.5rem 0;
  text-align: center;
}

@media (max-width: 575.98px) {
  .swal2-popup.bmn-modal,
  .swal2-popup.bmn-swal-popup {
    width: calc(100vw - 2rem) !important;
    max-width: calc(100vw - 2rem) !important;
    padding: 1.5rem !important;
  }

  .bmn-doc-recap {
    grid-template-columns: 1fr;
    gap: 0.15rem 0;
  }

  .bmn-doc-recap-value {
    margin-bottom: 0.65rem;
  }

  .bmn-pay-sheet__icon {
    font-size: 4rem;
  }

  .cookie-modal__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .cookie-modal__actions .btn {
    width: 100%;
  }
}
