@font-face {
font-family: 'inter';
font-style: normal;
font-weight: 100 900;
font-display: swap;
src: url('/fonts/inter.woff2') format('woff2');
}
@tailwind base;
@tailwind components;
@tailwind utilities;
@layer base {
body {
@apply bg-gray-50 dark:bg-gray-900 text-gray-900 dark:text-gray-100 transition-colors;
}
}
@layer components {
select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3E%3C/svg%3E");
background-position: right 0.5rem center;
background-repeat: no-repeat;
background-size: 1.5em 1.5em;
padding-right: 2.5rem;
}
select:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.dark select {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%239ca3af' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3E%3C/svg%3E");
}
.card {
@apply bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-6 transition-colors;
}
.status-badge {
@apply inline-flex items-center px-3 py-1 rounded-full text-sm font-medium;
}
.status-ready {
@apply bg-green-100 dark:bg-green-900/30 text-green-800 dark:text-green-300;
}
.status-not-ready {
@apply bg-red-100 dark:bg-red-900/30 text-red-800 dark:text-red-300;
}
.status-warning {
@apply bg-yellow-100 dark:bg-yellow-900/30 text-yellow-800 dark:text-yellow-300;
}
.border-success {
@apply border-green-500 dark:border-green-400;
}
.border-danger {
@apply border-red-500 dark:border-red-400;
}
.border-warning {
@apply border-yellow-500 dark:border-yellow-400;
}
.border-info {
@apply border-blue-500 dark:border-blue-400;
}
/* Animation for QuickSearch slide-in */
.animate-slide-in-right {
animation: slideInRight 0.2s ease-out;
}
@keyframes slideInRight {
from {
opacity: 0;
transform: translateX(20px);
}
to {
opacity: 1;
transform: translateX(0);
}
}
/* Animation for Progressing status - pulse effect */
.animate-progressing {
animation: progressingPulse 2s ease-in-out infinite;
}
@keyframes progressingPulse {
0%, 100% {
box-shadow: 0 0 0 0 rgba(59, 130, 246, 0);
}
50% {
box-shadow: 0 0 8px 2px rgba(59, 130, 246, 0.4);
}
}
.dark .animate-progressing {
animation: progressingPulseDark 2s ease-in-out infinite;
}
@keyframes progressingPulseDark {
0%, 100% {
box-shadow: 0 0 0 0 rgba(96, 165, 250, 0);
}
50% {
box-shadow: 0 0 8px 2px rgba(96, 165, 250, 0.4);
}
}
}
