spdniloy/anycoder-380d34cb

1@tailwind base;2@tailwind components;3@tailwind utilities;4 5@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');6 7@layer base {8  html {9    font-family: 'Inter', system-ui, -apple-system, sans-serif;10    -webkit-font-smoothing: antialiased;11    -moz-osx-font-smoothing: grayscale;12  }13  14  body {15    @apply bg-neutral-50 text-neutral-800;16  }17}18 19@layer components {20  .btn-primary {21    @apply px-4 py-2 bg-primary-600 text-white rounded-lg font-medium22           hover:bg-primary-700 transition-all duration-20023           focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-224           disabled:opacity-50 disabled:cursor-not-allowed;25  }26  27  .btn-secondary {28    @apply px-4 py-2 bg-neutral-100 text-neutral-700 rounded-lg font-medium29           hover:bg-neutral-200 transition-all duration-20030           focus:outline-none focus:ring-2 focus:ring-neutral-400 focus:ring-offset-231           disabled:opacity-50 disabled:cursor-not-allowed;32  }33  34  .btn-success {35    @apply px-4 py-2 bg-income-light text-income-dark rounded-lg font-medium36           border border-income-DEFAULT/3037           hover:bg-income-DEFAULT hover:text-white transition-all duration-20038           focus:outline-none focus:ring-2 focus:ring-income-DEFAULT focus:ring-offset-2;39  }40  41  .btn-danger {42    @apply px-4 py-2 bg-expense-light text-expense-dark rounded-lg font-medium43           border border-expense-DEFAULT/3044           hover:bg-expense-DEFAULT hover:text-white transition-all duration-20045           focus:outline-none focus:ring-2 focus:ring-expense-DEFAULT focus:ring-offset-2;46  }47  48  .card {49    @apply bg-white rounded-xl shadow-sm border border-neutral-10050           transition-shadow duration-200 hover:shadow-md;51  }52  53  .input-field {54    @apply w-full px-4 py-2.5 border border-neutral-200 rounded-lg55           text-neutral-800 placeholder-neutral-40056           focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent57           transition-all duration-200;58  }59  60  .label {61    @apply block text-sm font-medium text-neutral-700 mb-1.5;62  }63  64  .stat-card {65    @apply card p-6 flex flex-col;66  }67  68  .stat-value {69    @apply text-2xl font-semibold text-neutral-900;70  }71  72  .stat-label {73    @apply text-sm text-neutral-500 mt-1;74  }75  76  .table-header {77    @apply px-4 py-3 text-left text-xs font-semibold text-neutral-500 uppercase tracking-wider;78  }79  80  .table-cell {81    @apply px-4 py-3 text-sm text-neutral-700;82  }83}84 85@layer utilities {86  .text-balance {87    text-wrap: balance;88  }89}90 91/* Smooth scroll behavior */92html {93  scroll-behavior: smooth;94}95 96/* Custom scrollbar */97::-webkit-scrollbar {98  width: 8px;99  height: 8px;100}101 102::-webkit-scrollbar-track {103  @apply bg-neutral-100 rounded-full;104}105 106::-webkit-scrollbar-thumb {107  @apply bg-neutral-300 rounded-full hover:bg-neutral-400;108}109 110/* Animation keyframes */111@keyframes fadeIn {112  from {113    opacity: 0;114    transform: translateY(10px);115  }116  to {117    opacity: 1;118    transform: translateY(0);119  }120}121 122@keyframes slideIn {123  from {124    opacity: 0;125    transform: translateX(-10px);126  }127  to {128    opacity: 1;129    transform: translateX(0);130  }131}132 133.animate-fadeIn {134  animation: fadeIn 0.3s ease-out forwards;135}136 137.animate-slideIn {138  animation: slideIn 0.3s ease-out forwards;139}