/* ==========================================================================
   Barantum Confirm System (.brtm-cf) — standar tunggal modal konfirmasi
   Dipakai via helper global $confirm() (src/plugins/confirm.js) di atas
   SweetAlert2 (buttonsStyling:false + customClass). Additive & ternamespace:
   TIDAK mengubah .brtm-swal-delete / .swal-btn-* lama.
   Prototipe: dummypreview/confirm-modal-system.html
   Nada: danger · warn · primary · ok · info
   ========================================================================== */

.brtm-cf.swal2-popup {
  width: 460px !important;
  max-width: 92vw !important;
  border-radius: 16px !important;
  padding: 36px 36px 28px !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.16) !important;
  font-family: 'Inter', sans-serif !important;
}

/* ---- icon (bulat tinted 80px, gradient + halo + pop-in) ---- */
@keyframes brtm-cf-icon-pop {
  0%   { transform: scale(.55); opacity: 0; }
  70%  { transform: scale(1.08); opacity: 1; }
  100% { transform: scale(1); }
}
.brtm-cf .brtm-cf-icon.swal2-icon {
  border: none !important;
  margin: 0 auto 22px !important;
  width: 60px !important;
  height: 60px !important;
  border-radius: 30% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  animation: brtm-cf-icon-pop .45s cubic-bezier(.34, 1.56, .64, 1) both !important;
}
.brtm-cf .brtm-cf-icon.swal2-icon::before,
.brtm-cf .brtm-cf-icon.swal2-icon::after { display: none !important; }
.brtm-cf .brtm-cf-icon .swal2-icon-content {
  font-size: 30px !important;
  line-height: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
}
.brtm-cf .brtm-cf-icon .swal2-icon-content i {
  font-size: inherit !important;
  line-height: 1 !important;
  filter: drop-shadow(0 1px 1.5px rgba(0, 0, 0, .12)) !important;
}

/* ---- title & body ---- */
.brtm-cf .brtm-cf-title.swal2-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #1E293B !important;
  padding: 0 !important;
  margin: 0 0 9px !important;
  line-height: 1.35 !important;
}
.brtm-cf .brtm-cf-body.swal2-html-container {
  font-size: 13.5px !important;
  color: #64748B !important;
  margin: 0 !important;
  line-height: 1.65 !important;
  padding: 0 6px !important;
}
.brtm-cf .brtm-cf-body b,
.brtm-cf .brtm-cf-body strong { color: #3A4557; font-weight: 700; }

/* ---- actions row (Batal kiri, aksi utama kanan) ---- */
.brtm-cf .swal2-actions {
  width: 100% !important;
  display: flex !important;
  flex-direction: row !important;   /* confirm dulu di DOM, cancel kedua */
  gap: 10px !important;
  padding: 0 !important;
  margin: 26px 0 0 !important;
}
/* Batal kiri, konfirmasi kanan tanpa revertButtons: cancel = order 0 */
.brtm-cf .brtm-cf-cancel { order: 0; }
.brtm-cf .brtm-cf-confirm,
.brtm-cf .brtm-cf-deny { order: 1; }

/* ---- buttons ---- */
.brtm-cf .brtm-cf-btn,
.brtm-cf .swal2-styled.brtm-cf-btn {
  flex: 1 1 0 !important;
  height: 44px !important;
  border-radius: 10px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  font-family: 'Inter', sans-serif !important;
  cursor: pointer !important;
  border: 1px solid transparent !important;
  margin: 0 !important;
  padding: 0 16px !important;
  box-shadow: none !important;
  transition: background .13s ease, border-color .13s ease !important;
  /* NB: display TANPA !important — biar SweetAlert bisa menyembunyikan
     tombol deny/cancel yang tak dipakai lewat inline style="display:none". */
  display: inline-flex;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
}
.brtm-cf .brtm-cf-cancel,
.brtm-cf .swal2-styled.brtm-cf-cancel {
  background: #FFFFFF !important;
  color: #3A4557 !important;
  border-color: #DBE3EE !important;
}
.brtm-cf .brtm-cf-cancel:hover { background: #F5F8FC !important; border-color: #94A3B8 !important; }

/* secondary/deny (tombol ketiga, mis. "Ya, dan Pindah") = outline primary */
.brtm-cf .brtm-cf-deny,
.brtm-cf .swal2-styled.brtm-cf-deny {
  background: #FFFFFF !important;
  color: #1B6FBE !important;
  border-color: #1B6FBE !important;
}
.brtm-cf .brtm-cf-deny:hover { background: #E7F1FB !important; }

/* ==== tone: danger ==== */
.brtm-cf--danger .brtm-cf-icon {
  background: linear-gradient(135deg, #FEF2F2 0%, #FDD8D8 100%) !important;
  box-shadow: 0 0 0 4px rgba(239, 68, 68, .10), 0 10px 22px -8px rgba(239, 68, 68, .38), inset 0 1px 1px rgba(255, 255, 255, .7) !important;
}
.brtm-cf--danger .brtm-cf-icon .swal2-icon-content { color: #EF4444 !important; }
.brtm-cf--danger .brtm-cf-confirm { background: #EF4444 !important; color: #fff !important; }
.brtm-cf--danger .brtm-cf-confirm:hover { background: #DC2626 !important; }

/* ==== tone: warn ==== */
.brtm-cf--warn .brtm-cf-icon {
  background: linear-gradient(135deg, #FFFBEB 0%, #FEEEB8 100%) !important;
  box-shadow: 0 0 0 4px rgba(217, 119, 6, .10), 0 10px 22px -8px rgba(217, 119, 6, .34), inset 0 1px 1px rgba(255, 255, 255, .7) !important;
}
.brtm-cf--warn .brtm-cf-icon .swal2-icon-content { color: #D97706 !important; }
.brtm-cf--warn .brtm-cf-confirm { background: #D97706 !important; color: #fff !important; }
.brtm-cf--warn .brtm-cf-confirm:hover { filter: brightness(0.94); }

/* ==== tone: primary ==== */
.brtm-cf--primary .brtm-cf-icon {
  background: linear-gradient(135deg, #E7F1FB 0%, #CFE4F7 100%) !important;
  box-shadow: 0 0 0 4px rgba(27, 111, 190, .10), 0 10px 22px -8px rgba(27, 111, 190, .36), inset 0 1px 1px rgba(255, 255, 255, .7) !important;
}
.brtm-cf--primary .brtm-cf-icon .swal2-icon-content { color: #1B6FBE !important; }
.brtm-cf--primary .brtm-cf-confirm { background: #1B6FBE !important; color: #fff !important; }
.brtm-cf--primary .brtm-cf-confirm:hover { background: #155A9C !important; }

/* ==== tone: ok ==== */
.brtm-cf--ok .brtm-cf-icon {
  background: linear-gradient(135deg, #F0FDF4 0%, #CFF3D8 100%) !important;
  box-shadow: 0 0 0 4px rgba(22, 163, 74, .10), 0 10px 22px -8px rgba(22, 163, 74, .34), inset 0 1px 1px rgba(255, 255, 255, .7) !important;
}
.brtm-cf--ok .brtm-cf-icon .swal2-icon-content { color: #16A34A !important; }
.brtm-cf--ok .brtm-cf-confirm { background: #1B6FBE !important; color: #fff !important; }
.brtm-cf--ok .brtm-cf-confirm:hover { background: #155A9C !important; }

/* ==== tone: info ==== */
.brtm-cf--info .brtm-cf-icon {
  background: linear-gradient(135deg, #E7F1FB 0%, #CFE4F7 100%) !important;
  box-shadow: 0 0 0 4px rgba(27, 111, 190, .10), 0 10px 22px -8px rgba(27, 111, 190, .36), inset 0 1px 1px rgba(255, 255, 255, .7) !important;
}
.brtm-cf--info .brtm-cf-icon .swal2-icon-content { color: #1B6FBE !important; }
.brtm-cf--info .brtm-cf-confirm { background: #1B6FBE !important; color: #fff !important; }
.brtm-cf--info .brtm-cf-confirm:hover { background: #155A9C !important; }

/* ---- input ekstensi (alasan / rename) ---- */
.brtm-cf .swal2-input,
.brtm-cf .swal2-textarea {
  margin: 16px 0 0 !important;
  border: 1px solid #DBE3EE !important;
  border-radius: 9px !important;
  font-size: 13.5px !important;
  font-family: 'Inter', sans-serif !important;
  color: #17202E !important;
  background: #F5F8FC !important;
  box-shadow: none !important;
}
.brtm-cf .swal2-input { height: 42px !important; padding: 0 12px !important; }
.brtm-cf .swal2-textarea { min-height: 84px !important; padding: 10px 12px !important; }
.brtm-cf .swal2-input:focus,
.brtm-cf .swal2-textarea:focus {
  border-color: #1B6FBE !important;
  background: #fff !important;
  box-shadow: 0 0 0 2px rgba(27, 111, 190, .18) !important;
}
.brtm-cf .swal2-validation-message { border-radius: 8px !important; font-size: 12.5px !important; }

/* ---- blok html ekstensi (callout / amount / choice) ---- */
.brtm-cf .brtm-cf-callout {
  margin-top: 16px; text-align: left; border-radius: 11px; padding: 13px 15px;
  font-size: 12.5px; line-height: 1.55;
}
.brtm-cf .brtm-cf-callout--danger { background: #FEF2F2; border: 1px solid #FECACA; color: #DC2626; }
.brtm-cf .brtm-cf-callout--warn { background: #FFFBEB; border: 1px solid #FDE68A; color: #B45309; }
.brtm-cf .brtm-cf-callout ul { margin: 6px 0 0; padding-left: 18px; }
.brtm-cf .brtm-cf-callout li { margin: 3px 0; }

.brtm-cf .brtm-cf-amount {
  margin-top: 16px; background: #F5F8FC; border: 1px solid #DBE3EE; border-radius: 12px;
  padding: 12px 16px; text-align: left;
}
.brtm-cf .brtm-cf-amount .row { display: flex; justify-content: space-between; font-size: 12.5px; color: #64748B; padding: 4px 0; }
.brtm-cf .brtm-cf-amount .row.tot { border-top: 1px dashed #DBE3EE; margin-top: 6px; padding-top: 9px; font-size: 15px; font-weight: 800; color: #17202E; }
.brtm-cf .brtm-cf-amount .row.tot span:last-child { color: #1B6FBE; }

/* type-to-confirm hint */
.brtm-cf .brtm-cf-typehint { margin-top: 14px; text-align: left; font-size: 12px; color: #64748B; }
.brtm-cf .brtm-cf-typehint b { color: #DC2626; font-weight: 700; }

/* ==== Export report dialog (Swal.fire polos) — tombol sama lebar & sejajar ==== */
.rep-export-actions { align-items: center !important; }
.swal2-styled.rep-export-btn { flex: 1 1 0 !important; margin: 0 !important; }