:root { --p-50:#F0F9F8; --p-100:#D9F0ED; --p-200:#B5DFDA; --p-300:#87C6C0; --p-400:#5BA9A2; --p-500:#388E86; --p-600:#23736C; --p-700:#0B6F67; --p-800:#085952; --p-900:#06403A; }

        .table-container::-webkit-scrollbar { height: 8px; }
        .table-container::-webkit-scrollbar-track { background: var(--p-100); border-radius: 4px; }
        .table-container::-webkit-scrollbar-thumb { background: var(--p-400); border-radius: 4px; }
        .table-container::-webkit-scrollbar-thumb:hover { background: var(--p-600); }
        .dark .table-container::-webkit-scrollbar-track { background: #374151; }
        .dark .table-container::-webkit-scrollbar-thumb { background: var(--p-600); }
        
        .smooth-transition { transition: all 0.7s cubic-bezier(0.16, 1, 0.3, 1); }
        .transition-expo { transition: all 1.2s cubic-bezier(0.16, 1, 0.3, 1); }

        .hover-lift { transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.6s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.4s ease; }
        .hover-lift:hover { transform: translateY(-4px); box-shadow: 0 12px 24px -6px rgba(0, 0, 0, 0.08); }

        .accordion-wrapper { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.7s cubic-bezier(0.16, 1, 0.3, 1); }
        .accordion-wrapper.open { grid-template-rows: 1fr; }
        .accordion-inner { overflow: hidden; }
        
        .no-scrollbar::-webkit-scrollbar { display: none; }
        .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

        /* Toast Notification Animations */
        @keyframes toastSlideIn {
            from { opacity: 0; transform: translateX(100%) scale(0.95); }
            to { opacity: 1; transform: translateX(0) scale(1); }
        }
        @keyframes toastSlideOut {
            from { opacity: 1; transform: translateX(0) scale(1); }
            to { opacity: 0; transform: translateX(100%) scale(0.95); }
        }
        .toast-enter { animation: toastSlideIn 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
        .toast-exit { animation: toastSlideOut 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards; }

        /* Mobile Card Layout for Tables */
        @media (max-width: 768px) {
            .table-container table { display: block; border: none; min-width: 0 !important; }
            .table-container thead { display: none; }
            .table-container tbody { display: block; width: 100%; }
            .table-container tr { 
                display: flex;
                flex-direction: column;
                margin-bottom: 1rem; 
                border: 1px solid var(--p-200); 
                border-radius: 0.75rem; 
                background: white; 
                overflow: hidden; 
            }
            .dark .table-container tr { background: #1f2937; border-color: #374151; }
            
            .table-container td { 
                display: flex;
                flex-direction: column;
                padding: 1rem !important; 
                border-bottom: 1px solid #f3f4f6; 
                width: 100% !important;
                align-items: flex-start;
                text-align: left !important;
            }
            .dark .table-container td { border-bottom-color: #374151; }
            .table-container td:last-child { border-bottom: none; }
            
            .table-container td[data-label]::before {
                content: attr(data-label);
                display: block;
                font-size: 0.75rem;
                font-weight: 700;
                text-transform: uppercase;
                color: #6b7280;
                margin-bottom: 0.5rem;
                width: 100%;
            }
            .dark .table-container td[data-label]::before { color: #9ca3af; }
            
            .table-container input[type="number"] { width: 100% !important; max-width: none; }
            .table-container td > div.flex-col { width: 100%; }
        }