.material-symbols-outlined {
  font-variation-settings: 'FILL' 1;
}

/* Custom scrollbar for webkit */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: #f1f3fc; /* surface-container-low */
}

::-webkit-scrollbar-thumb {
  background: #c1c6d5; /* outline-variant */
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #717785; /* outline */
}

body {
  min-height: max(884px, 100dvh);
}

/* Thu nhỏ giao diện PC thêm 25% (tức hiển thị ở tỉ lệ 75%) trên Desktop */
@media (min-width: 1024px) {
  html {
    zoom: 0.75;
  }
}

/* Modal Animations & Backdrop */
.modal-backdrop {
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

@keyframes modalFadeIn {
  from {
    opacity: 0;
    transform: scale(0.96) translateY(12px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

.modal-animate-in {
  animation: modalFadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}