/* assets/css/app.css */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap');

:root {
    --pkb-50: #f0fdf4;
    --pkb-100: #dcfce7;
    --pkb-500: #22c55e;
    --pkb-600: #16a34a;
    --pkb-700: #15803d;
    --pkb-900: #14532d;
}

body {
    font-family: 'Outfit', sans-serif;
    background-color: #f8fafc;
    color: #1e293b;
    -webkit-font-smoothing: antialiased;
}

/* Glassmorphism Cards */
.glass-card {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03);
    border-radius: 1rem;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* Toast Animations */
.toast-enter {
    animation: slideInRight 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
.toast-exit {
    animation: slideOutRight 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes slideInRight {
    from { transform: translateX(100%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

@keyframes slideOutRight {
    from { transform: translateX(0); opacity: 1; }
    to { transform: translateX(100%); opacity: 0; }
}

/* Form Controls Focus Ring Customization */
input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: var(--pkb-500) !important;
    box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.2) !important;
}

/* Sidebar Active Link Transition */
.nav-link {
    transition: all 0.2s ease;
}
.nav-link:hover, .nav-link.active {
    background-color: var(--pkb-50);
    color: var(--pkb-700);
}
.nav-link.active {
    font-weight: 600;
    border-right: 3px solid var(--pkb-600);
}