/* ===============================
   Custom Utility Classes
   Para complementar o Tailwind
   =============================== */

/* ===== Colors ===== */
.bg-primary    { background-color: #242424; }
.bg-secondary  { background-color: #7D7D7C; }
.bg-terciary   { background-color: #E4E5E3; }

.text-primary   { color: #242424; }
.text-secondary { color: #7D7D7C; }
.text-terciary  { color: #E4E5E3; }

.text-success { color: #009A93; }
.text-warning { color: #F9B000; }
.text-error   { color: #BD1224; }
.text-info    { color: #006598; }

.bg-success { background-color: #009A93; }
.bg-warning { background-color: #F9B000; }
.bg-error   { background-color: #BD1224; }
.bg-info    { background-color: #006598; }

/* ===== Fonts ===== */
.font-sans, .font-body {
  font-family: 'Kanit', 'ui-sans-serif', 'system-ui',
    '-apple-system', 'Segoe UI', 'Roboto', 'Helvetica Neue',
    'Arial', 'Noto Sans', 'sans-serif',
    'Apple Color Emoji', 'Segoe UI Emoji',
    'Segoe UI Symbol', 'Noto Color Emoji';
}

/* ===== Extras ===== */
.animated-gradient {
  background: linear-gradient(116deg, #480880 0%, #902DE5 50%, #DB3CBB 100%);
  background-size: 200% 200%;
  animation: gradient-move 6s ease infinite;
}

@keyframes gradient-move {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
