:root {
    /* 
       Global Color Variables 
    */
    --color-primary: #FF122E;
    --color-primary-dark: #D90022;
    --color-secondary: #6c757d;
    --color-accent: #fff1f2;
    --color-success: #28a745;
    --color-info: #17a2b8;
    --color-warning: #ffc107;
    --color-danger: #dc3545;
    
    --bg-color: #f8f9fa;
    --text-color: #333;
    
    /* Shadows */
    --shadow-sm: 0 2px 4px rgba(0,0,0,0.05);
    --shadow-md: 0 4px 6px rgba(0,0,0,0.1);
    --shadow-lg: 0 10px 15px rgba(0,0,0,0.1);
    
    /* Transitions */
    --transition-fast: all 0.2s ease;
    --transition-normal: all 0.3s ease-in-out;
}

/* Global Component Enhancements */
.btn {
    transition: var(--transition-fast);
    border: none;
    box-shadow: var(--shadow-sm);
}
.btn:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.card {
    border: none;
    border-radius: 12px;
    box-shadow: var(--shadow-sm);
    transition: var(--transition-normal);
}
.card:hover {
    box-shadow: var(--shadow-md);
}

.table-hover tbody tr {
    transition: var(--transition-fast);
}
.table-hover tbody tr:hover {
    background-color: var(--color-accent) !important;
    transform: scale(1.002);
}

/* Custom Utilities */
.text-primary-custom { color: var(--color-primary); }
.bg-primary-custom { background-color: var(--color-primary); }