/* Utility Classes */ /* Visibility Utilities */ .hidden { display: none !important; } .show { display: block !important; } .show-flex { display: flex !important; } .show-inline { display: inline !important; } .show-inline-block { display: inline-block !important; } /* Positioning Utilities */ .position-absolute { position: absolute; } .position-relative { position: relative; } .position-fixed { position: fixed; } /* Z-index Utilities */ .z-1 { z-index: 1; } .z-2 { z-index: 2; } .z-3 { z-index: 3; } .z-1000 { z-index: 1000; } /* Color Utilities */ .success-border { border: 2px solid #00ff00 !important; } .error-border { border: 2px solid #ff0000 !important; } .warning-border { border: 2px solid #ffaa00 !important; } /* Progress Utilities */ .progress-0 { width: 0% !important; } .progress-25 { width: 25% !important; } .progress-50 { width: 50% !important; } .progress-75 { width: 75% !important; } .progress-100 { width: 100% !important; } /* Background Utilities */ .bg-success { background-color: #2ecc71 !important; } .bg-error { background-color: #e74c3c !important; } .bg-warning { background-color: #f39c12 !important; } .bg-info { background-color: #3498db !important; } .bg-dark { background-color: #2c3e50 !important; } /* Text Color Utilities */ .text-success { color: #2ecc71 !important; } .text-error { color: #e74c3c !important; } .text-warning { color: #f39c12 !important; } .text-info { color: #3498db !important; } .text-muted { color: #95a5a6 !important; } .text-white { color: #ffffff !important; } /* Pointer Events */ .pointer-events-none { pointer-events: none !important; } .pointer-events-auto { pointer-events: auto !important; } /* Transition Utilities */ .transition-fast { transition: all 0.15s ease; } .transition-normal { transition: all 0.3s ease; } .transition-slow { transition: all 0.5s ease; } /* Transform Utilities */ .scale-105 { transform: scale(1.05); } .scale-110 { transform: scale(1.1); } /* Box Shadow Utilities */ .shadow-glow { box-shadow: 0 0 8px rgba(255, 255, 255, 0.3); } .shadow-glow-strong { box-shadow: 0 0 15px rgba(255, 255, 255, 0.5); } .shadow-success { box-shadow: 0 0 10px rgba(46, 204, 113, 0.5); } .shadow-error { box-shadow: 0 0 10px rgba(231, 76, 60, 0.5); }