/* RisaPay P3 - tema dasar ungu. Dimuat setelah app.min.css agar menimpa default. */
:root {
  --ungu: #6D28D9;
  --ungu-900: #2A0A5E;
  --bg: #F5F3FF;
  --ungu-100: #EDE9FE;
  --ungu-700: #5B21B6;
}

/* Latar dashboard */
body,
.content,
.container-fluid,
#wrapper {
  background-color: var(--bg);
}

/* Kartu */
.card,
.card-box,
.widget-box-three {
  border-top: 3px solid var(--ungu);
  border-radius: 12px;
}

/* Judul halaman */
.header-title,
.page-title {
  color: var(--ungu-900);
}

/* Tombol primer -> ungu */
.btn-primary,
.btn-try {
  background-color: var(--ungu);
  border-color: var(--ungu);
  color: #fff;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-try:hover {
  background-color: var(--ungu-700);
  border-color: var(--ungu-700);
  color: #fff;
}
.text-primary {
  color: var(--ungu) !important;
}
.bg-primary {
  background-color: var(--ungu) !important;
}
.badge-primary {
  background-color: var(--ungu);
}
a {
  color: var(--ungu-700);
}
a:hover {
  color: var(--ungu-900);
}

/* Navigasi vertikal (hamburger) */
#menu_vertikal ul li a {
  background-color: var(--ungu-100);
  color: var(--ungu-900);
}
#menu_vertikal ul li a:hover {
  background-color: var(--ungu);
  color: #fff;
}
#hamburger {
  background-color: var(--ungu-100);
  color: var(--ungu-900);
}
#hamburger:hover {
  background-color: var(--ungu);
  color: #fff;
}

/* Judul brand di header */
body h1 {
  color: var(--ungu-900) !important;
}

/* Sticky menu bawah (mobile) */
.sticky-menu {
  border-top: 3px solid var(--ungu);
}

/* ===== P11 premium polish (CSS only, tanpa ubah logika) ===== */
/* Kartu: radius 16px + bayangan lembut */
.card, .card-box, .widget-box-three, .modal-content {
  border-radius: 16px !important;
  box-shadow: 0 10px 28px rgba(42, 10, 94, .09) !important;
  border: 1px solid #ede9fe !important;
  overflow: hidden;
}
.card-body { padding: 1.25rem; }

/* Tombol ungu gradient */
.btn-ungu, .btn-try {
  background: linear-gradient(135deg, #6D28D9, #8B5CF6) !important;
  border: 0 !important;
  color: #fff !important;
  border-radius: 999px !important;
  font-weight: 700;
  box-shadow: 0 6px 16px rgba(109, 40, 217, .35);
}
.btn-ungu:hover, .btn-try:hover {
  filter: brightness(1.08);
  color: #fff !important;
}

/* Badge status */
.rp-badge {
  display: inline-block; padding: 3px 12px; border-radius: 999px;
  font-size: 12px; font-weight: 700; letter-spacing: .3px;
}
.rp-paid, .rp-success { background: #dcfce7; color: #15803d; }
.rp-unpaid, .rp-pending { background: #fef9c3; color: #a16207; }
.rp-expired, .rp-failed, .rp-error, .rp-refund { background: #f1f5f9; color: #475569; }
.badge-success { background-color: #16a34a !important; }
.badge-warning { background-color: #eab308 !important; color: #422006 !important; }

/* Tabel responsif */
.table-responsive { border-radius: 12px; -webkit-overflow-scrolling: touch; }
.table thead th {
  background: #2A0A5E; color: #fff; border: 0 !important;
  font-size: 12px; text-transform: uppercase; letter-spacing: .4px; white-space: nowrap;
}
.table tbody tr:hover { background: #f5f3ff; }

/* Sticky menu mobile */
.sticky-menu {
  border-top: 3px solid var(--ungu);
  border-radius: 16px 16px 0 0;
  box-shadow: 0 -6px 20px rgba(42, 10, 94, .12);
  padding-bottom: env(safe-area-inset-bottom);
}

/* Brand */
.rp-brand { display: inline-flex; align-items: center; gap: 10px; }
.rp-brand img { height: 38px; width: auto; }
.rp-brand span { font-weight: 800; color: var(--ungu-900); font-size: 20px; }

/* Anti-overflow global */
html, body { overflow-x: hidden; }
img { max-width: 100%; height: auto; }

/* 360px: rapatkan padding, kecilkan judul */
@media (max-width: 480px) {
  .card-body { padding: .9rem; }
  .header-title { font-size: 15px !important; }
  .table { font-size: 12px; }
  .btn { white-space: normal; }
}