.idiba-dialog[hidden] {
  display: none !important;
}

.idiba-dialog {
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: grid;
  place-items: center;
  padding: 20px;
}

.idiba-dialog__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .7);
  backdrop-filter: blur(5px);
}

.idiba-dialog__panel {
  position: relative;
  width: min(430px, 100%);
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 13px;
  padding: 20px;
  border: 1px solid rgba(148, 163, 184, .24);
  border-radius: 15px;
  color: var(--portal-text, var(--admin-text, #f5f7fa));
  background: var(--portal-surface, var(--admin-surface, #0b131c));
  box-shadow: 0 24px 75px rgba(0, 0, 0, .46);
}

.idiba-dialog__icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: #d84c5a;
}

.idiba-dialog[data-tone="success"] .idiba-dialog__icon { background: #24b47e; }
.idiba-dialog[data-tone="warning"] .idiba-dialog__icon { color: #372604; background: #e7ad2d; }
.idiba-dialog[data-tone="info"] .idiba-dialog__icon { color: #021117; background: #14c7e8; }

.idiba-dialog__copy h2 {
  margin: 1px 0 7px;
  color: inherit;
  font-size: 18px;
}

.idiba-dialog__copy p {
  margin: 0;
  color: var(--portal-muted, var(--admin-text-muted, #aab4c0));
  font-size: 13px;
  line-height: 1.55;
}

.idiba-dialog__close {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 9px;
  color: var(--portal-muted, var(--admin-text-muted, #aab4c0));
  background: transparent;
  cursor: pointer;
}

.idiba-dialog__actions {
  grid-column: 2 / -1;
  display: flex;
  justify-content: flex-end;
  gap: 9px;
  margin-top: 7px;
}

.idiba-dialog__field {
  grid-column: 2 / -1;
  display: grid;
  gap: 7px;
}

.idiba-dialog__field[hidden] { display: none; }

.idiba-dialog__field label {
  color: var(--portal-text, var(--admin-text, #f5f7fa));
  font-size: 12px;
  font-weight: 700;
}

.idiba-dialog__field input,
.idiba-dialog__field textarea {
  width: 100%;
  min-height: 42px;
  padding: 10px 12px;
  resize: vertical;
  border: 1px solid rgba(148, 163, 184, .3);
  border-radius: 9px;
  color: inherit;
  background: rgba(148, 163, 184, .08);
  font: inherit;
}

.idiba-dialog__field input:focus,
.idiba-dialog__field textarea:focus {
  outline: 0;
  border-color: #14c7e8;
  box-shadow: 0 0 0 3px rgba(20, 199, 232, .13);
}

.idiba-dialog__field p {
  margin: 0;
  color: #ef5b67;
  font-size: 12px;
}

.idiba-dialog__actions button {
  min-height: 40px;
  padding: 0 15px;
  border: 1px solid rgba(148, 163, 184, .28);
  border-radius: 9px;
  color: inherit;
  background: transparent;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.idiba-dialog__actions .idiba-dialog__retry {
  border-color: #14c7e8;
  color: #021117;
  background: #14c7e8;
}

body.idiba-dialog-open {
  overflow: hidden !important;
}

@media (max-width: 520px) {
  .idiba-dialog__panel {
    grid-template-columns: 38px minmax(0, 1fr) auto;
    padding: 16px;
  }

  .idiba-dialog__actions {
    grid-column: 1 / -1;
  }
}