/* Custom Styles & Color Palette Definitions */
:root {
  /* Primary Purple Palette (Disesuaikan dengan gambar referensi) */
  --primary-dark: #3b0066;
  --primary: #5b00ab;
  --primary-hover: #4a008c;
  --primary-light: #8e24aa;
  --primary-container: #7b1fa2;
  --on-primary-container: #f3e5f5;
  --primary-fixed-dim: #ba68c8;
  --primary-fixed-bg: #f3e5f5;
  
  /* Neutral / Surface Colors */
  --bg-canvas: #f8fafc;
  --text-main: #1e293b;
  --text-muted: #64748b;
  --border-color: #e2e8f0;
}

body {
  font-family: 'Inter', sans-serif;
  background-color: var(--bg-canvas);
  color: var(--text-main);
}

.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  vertical-align: middle;
}

/* Background Pattern untuk Login */
.bg-grid-pattern {
  background-image: radial-gradient(circle, #cbd5e1 1px, transparent 1px);
  background-size: 32px 32px;
}

/* Custom Shadow */
.custom-shadow-l2 {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.login-card-shadow {
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1);
}

.btn-hover-effect:active {
  transform: scale(0.98);
  transition: transform 0.1s ease;
}

.data-table-container {
  scrollbar-width: thin;
}