.sipades-portal{padding:32px;background:linear-gradient(135deg,#0b1f3a,#0d6efd);color:#fff;border-radius:18px}
.petugas-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.petugas-card{background:rgba(255,255,255,.15);padding:16px;border-radius:16px;text-align:center}
.petugas-card img{width:72px;height:72px;border-radius:50%;object-fit:cover;border:3px solid #4ade80}
.sipades-portal h2 span{color:#4ade80}
.sipades-admin-grid{display:grid;grid-template-columns:1fr 2fr;gap:24px}
/* ===== FRONTEND PORTAL ===== */
.sipades-portal{
  padding:36px;
  background:linear-gradient(
    135deg,
    #7cc8ff 0%,
    #5faeff 50%,
    #4fc3f7 100%
  );
  color:#0b1f3a; /* teks gelap agar kontras */
  border-radius:20px;
  font-family:Inter,system-ui,Arial,sans-serif;
  box-shadow:0 16px 40px rgba(0,0,0,.12);
}


.sipades-header{
  max-width:560px;
}

.badge{
  display:inline-block;
  padding:6px 14px;
  background:rgba(255,255,255,.18);
  border-radius:999px;
  font-size:13px;
  font-weight:700;
}

.sipades-portal h2{
  color:#0b1f3a;
}

.sipades-portal p{
  color:#1e3a8a;
}

.badge{
  background:rgba(11,31,58,.1);
  color:#0b1f3a;
}



/* CTA */
.actions .btn.primary{
  display:inline-block;
  padding:12px 22px;
  border-radius:14px;
  background:linear-gradient(90deg,#4ade80,#22c55e);
  color:#053321;
  font-weight:800;
  text-decoration:none;
  box-shadow:0 12px 30px rgba(0,0,0,.35);
}
.actions .btn.primary:hover{
  transform:translateY(-3px);
}

/* ===== PETUGAS ===== */
.petugas-title{
  margin:32px 0 16px;
  font-size:20px;
}

.petugas-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:18px;
}

.petugas-card{
  background:rgba(255,255,255,.45);
  padding:20px 16px;
  border-radius:18px;
  text-align:center;
  box-shadow:0 10px 24px rgba(0,0,0,.1);
  backdrop-filter:none;
}


.petugas-card img{
  width:72px;
  height:72px;
  border-radius:50%;
  object-fit:cover;
  border:3px solid #4ade80;
  margin-bottom:10px;
}

.petugas-card strong{
  display:block;
  font-size:16px;
}

.petugas-card span{
  display:block;
  font-size:13px;
  opacity:.85;
  margin-bottom:8px;
}

.petugas-card .wa-btn{
  display:inline-block;
  padding:8px 14px;
  border-radius:999px;
   background:#22c55e;
  color:#ffffff;
  font-weight:700;
  text-decoration:none;
}

/* responsive */
@media(max-width:768px){
  .sipades-portal h2{font-size:24px}
}
.actions{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-top:8px;
}

/* tombol utama */
.btn.primary{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:12px 22px;
  border-radius:14px;
  background:linear-gradient(90deg,#4ade80,#22c55e);
  color:#053321;
  font-weight:800;
  text-decoration:none;
  box-shadow:0 12px 30px rgba(0,0,0,.35);
}

/* tombol PBH */
.btn.secondary{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:12px 22px;
  border-radius:14px;
  background:transparent;
  border:2px solid rgba(11,31,58,.25);
  color:#0b1f3a;
  font-weight:800;
  text-decoration:none;
  transition:.2s ease;
}

.btn.secondary:hover{
  background:rgba(255,255,255,.6);
}


/* ukuran icon */
.sipades-admin .dashicons {
  font-size: 18px;
  vertical-align: middle;
}

/* warna hover edit */
.sipades-admin a:hover .dashicons-edit {
  color: #2271b1; /* biru WP */
}

/* warna hover hapus */
.sipades-admin a:hover .dashicons-trash {
  color: #d63638; /* merah WP */
}