94 lines
2.4 KiB
CSS
94 lines
2.4 KiB
CSS
@import 'tailwindcss';
|
|
|
|
@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
|
|
@source '../../storage/framework/views/*.php';
|
|
@source '../**/*.blade.php';
|
|
@source '../**/*.js';
|
|
|
|
/* ========== DESIGN SYSTEM ========== */
|
|
@theme {
|
|
/* Typography - Inter */
|
|
--font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
|
|
|
|
/* Primary - Indigo / Sky soft */
|
|
--color-primary-50: #eef2ff;
|
|
--color-primary-100: #e0e7ff;
|
|
--color-primary-200: #c7d2fe;
|
|
--color-primary-300: #a5b4fc;
|
|
--color-primary-400: #818cf8;
|
|
--color-primary-500: #6366f1;
|
|
--color-primary-600: #4f46e5;
|
|
--color-primary-700: #4338ca;
|
|
--color-primary-800: #3730a3;
|
|
--color-primary-900: #312e81;
|
|
|
|
/* Secondary - Emerald / Teal */
|
|
--color-secondary-50: #ecfdf5;
|
|
--color-secondary-100: #d1fae5;
|
|
--color-secondary-200: #a7f3d0;
|
|
--color-secondary-300: #6ee7b7;
|
|
--color-secondary-400: #34d399;
|
|
--color-secondary-500: #10b981;
|
|
--color-secondary-600: #059669;
|
|
--color-secondary-700: #047857;
|
|
--color-secondary-800: #065f46;
|
|
--color-secondary-900: #064e3b;
|
|
}
|
|
|
|
/* Base */
|
|
body {
|
|
@apply text-gray-600 antialiased;
|
|
line-height: 1.6;
|
|
}
|
|
|
|
/* Sidebar overlay */
|
|
.sidebar-overlay {
|
|
@apply fixed inset-0 z-40 bg-gray-900/50 backdrop-blur-sm opacity-0 pointer-events-none transition-opacity duration-300;
|
|
}
|
|
.sidebar-overlay.active {
|
|
@apply opacity-100 pointer-events-auto;
|
|
}
|
|
|
|
/* Nav drawer (mobile) */
|
|
.nav-drawer {
|
|
@apply fixed top-0 right-0 z-50 h-full w-full max-w-sm bg-white shadow-xl transform translate-x-full transition-transform duration-300 ease-out;
|
|
}
|
|
.nav-drawer.open {
|
|
@apply translate-x-0;
|
|
}
|
|
|
|
/* Fade-in animation for result cards */
|
|
@keyframes fade-in-up {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(12px);
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
.animate-fade-in-up {
|
|
animation: fade-in-up 0.4s ease-out forwards;
|
|
}
|
|
|
|
/* Stagger children */
|
|
.stagger-1 { animation-delay: 0.05s; }
|
|
.stagger-2 { animation-delay: 0.1s; }
|
|
.stagger-3 { animation-delay: 0.15s; }
|
|
.stagger-4 { animation-delay: 0.2s; }
|
|
.stagger-5 { animation-delay: 0.25s; }
|
|
|
|
/* Sidebar collapsed (desktop) */
|
|
.sidebar.sidebar-collapsed {
|
|
width: 5rem;
|
|
}
|
|
.sidebar.sidebar-collapsed .sidebar-label {
|
|
display: none;
|
|
}
|
|
.sidebar.sidebar-collapsed .sidebar-user {
|
|
justify-content: center;
|
|
padding-left: 0.75rem;
|
|
padding-right: 0.75rem;
|
|
}
|