.pattern-bg {
  background-image: radial-gradient(#ffffff 2px, transparent 2px);
  background-size: 32px 32px;
}

@keyframes glowPulse {
  0%, 100% { opacity: 1; text-shadow: 0 0 15px rgba(255, 255, 255, 0.4), 0 0 30px rgba(255, 255, 255, 0.2); }
  50% { opacity: 0.8; text-shadow: 0 0 5px rgba(255, 255, 255, 0.1); }
}
.efek-kelap-kelip { animation: glowPulse 2.5s infinite ease-in-out; }

@keyframes floatBox {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}
.animate-float { animation: floatBox 4s infinite ease-in-out; }

.table-container {
  overflow-x: auto;
  background: white;
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
  border: 1px solid #e5e7eb;
  -webkit-overflow-scrolling: touch;
}
.table-modern { width: 100%; border-collapse: collapse; text-align: left; min-width: 800px; }
.table-modern thead th { background-color: #11224E; color: white; padding: 12px 16px; font-size: 0.7rem; text-transform: uppercase; font-weight: 600; letter-spacing: 0.05em; white-space: nowrap; }
.table-modern tbody td { padding: 14px 16px; border-bottom: 1px solid #f3f4f6; font-size: 0.8rem; color: #374151; vertical-align: top; line-height: 1.5; }
.table-modern tbody tr:last-child td { border-bottom: none; }
.table-modern tbody tr:hover { background-color: #f8fafc; }

.badge { padding: 4px 10px; border-radius: 6px; font-weight: 600; font-size: 0.7rem; display: inline-block; white-space: nowrap; }
.badge-diproses { background-color: #fef9c3; color: #a16207; border: 1px solid #fde047; }
.badge-disetujui { background-color: #dcfce3; color: #15803d; border: 1px solid #bbf7d0; }
.badge-ditolak { background-color: #fee2e2; color: #b91c1c; border: 1px solid #fecaca; }

.input-inline { width: 100%; min-width: 130px; padding: 8px 10px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 0.75rem; outline: none; background: white; transition: all 0.2s; }
.input-inline:focus { border-color: #11224E; box-shadow: 0 0 0 3px rgba(17, 34, 78, 0.1); }
textarea.input-inline { resize: vertical; min-height: 40px; }

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }