@import url('https://fonts.googleapis.com/css2?family=Sarabun:wght@300;400;600;700&display=swap');

.font-sarabun { font-family: 'Sarabun', sans-serif; }

/* Custom Scrollbar */
.hide-scrollbar::-webkit-scrollbar { display: none; }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Button Styles */
.btn-primary { @apply bg-blue-600 text-white font-bold py-2 px-4 rounded-xl hover:bg-blue-700 transition shadow-md active:scale-95; }
.btn-secondary { @apply bg-gray-200 text-gray-700 font-bold py-2 px-4 rounded-xl hover:bg-gray-300 transition active:scale-95; }
.btn-success { @apply bg-green-600 text-white font-bold py-2 px-4 rounded-xl hover:bg-green-700 transition shadow-md active:scale-95; }
.btn-danger { @apply bg-red-500 text-white font-bold py-1 px-3 rounded-lg hover:bg-red-600 transition text-xs; }

.input-field { @apply w-full p-3 border border-gray-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-gray-50 transition; }
.label { @apply block text-xs font-bold text-gray-600 mb-1 ml-1; }

.site-btn.active { @apply border-blue-600 bg-blue-50 text-blue-700 shadow-md transform scale-105; }
.site-btn { @apply border-gray-200 text-gray-400 hover:bg-gray-50; }

/* Factory Themes */
body.theme-cpc .bg-theme { @apply bg-blue-600; }
body.theme-cpg .bg-theme { @apply bg-purple-700; }
body.theme-cpg .btn-primary { @apply bg-purple-600 hover:bg-purple-700; }
body.theme-cpg .text-theme { @apply text-purple-700; }

/* View Transitions */
.view-section { animation: fadeIn 0.3s ease-in-out; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

.stat-card { @apply p-4 rounded-xl shadow-sm border border-opacity-50 text-center; }