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

:root {
  --primary: #4F46E5;
  --primary-hover: #4338CA;
  --secondary: #ec4899;
  --bg-gradient-start: #e0e7ff;
  --bg-gradient-end: #fce7f3;
  --glass-bg: rgba(255, 255, 255, 0.7);
  --glass-border: rgba(255, 255, 255, 0.5);
  --glass-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.07);
}

body {
    font-family: 'Outfit', sans-serif;
    background: linear-gradient(135deg, var(--bg-gradient-start) 0%, var(--bg-gradient-end) 100%);
    background-attachment: fixed;
    min-height: 100vh;
    color: #1e293b;
}

/* Glassmorphism Classes */
.glass-panel {
    background: var(--glass-bg);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    border-radius: 1.5rem;
}

.glass-nav {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.4);
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
}

/* Inputs and Selects */
input, select {
    transition: all 0.3s ease;
    background: rgba(255, 255, 255, 0.8) !important;
}

input:focus, select:focus {
    transform: translateY(-1px);
    box-shadow: 0 4px 20px rgba(79, 70, 229, 0.15) !important;
    border-color: var(--primary) !important;
}

/* Buttons */
.btn-primary {
    background: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%);
    box-shadow: 0 4px 15px rgba(79, 70, 229, 0.3);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-primary:hover {
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 6px 20px rgba(79, 70, 229, 0.4);
}

.btn-secondary {
    background: linear-gradient(135deg, #ec4899 0%, #f43f5e 100%);
    box-shadow: 0 4px 15px rgba(236, 72, 153, 0.3);
    transition: all 0.3s ease;
}
.btn-secondary:hover {
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 6px 20px rgba(236, 72, 153, 0.4);
}

/* Micro animations */
.tab-content {
    animation: fadeIn 0.4s ease-out forwards;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Table styling */
table {
    border-spacing: 0 8px;
    border-collapse: separate;
}

tbody tr {
    background: rgba(255, 255, 255, 0.6);
    transition: all 0.2s;
    border-radius: 0.5rem;
}

tbody tr:hover {
    background: rgba(255, 255, 255, 0.9);
    transform: scale(1.01);
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

td:first-child { border-top-left-radius: 0.5rem; border-bottom-left-radius: 0.5rem; }
td:last-child { border-top-right-radius: 0.5rem; border-bottom-right-radius: 0.5rem; }

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.1); 
}
::-webkit-scrollbar-thumb {
    background: rgba(79, 70, 229, 0.3); 
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: rgba(79, 70, 229, 0.5); 
}