/* CSS styles for unified admin design based on admin/dashboard page */

body {
 background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
 color: white;
 font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.glass-card {
 background: rgba(255, 255, 255, 0.1);
 backdrop-filter: blur(20px);
 border: 1px solid rgba(255, 255, 255, 0.2);
 border-radius: 20px;
 padding: 1.5rem;
 margin-bottom: 1.5rem;
 transition: all 0.3s ease;
 position: relative;
 overflow: hidden;
 color: white;
}

.glass-card::before {
 content: '';
 position: absolute;
 top: 0;
 left: -100%;
 width: 100%;
 height: 100%;
 background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
 transition: left 0.5s;
}

.glass-card:hover::before {
 left: 100%;
}

.glass-card:hover {
 transform: translateY(-5px);
 box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.btn-glass {
 background: rgba(255, 255, 255, 0.1);
 backdrop-filter: blur(20px);
 border: 1px solid rgba(255, 255, 255, 0.2);
 border-radius: 10px;
 color: white;
 padding: 0.5rem 1rem;
 transition: all 0.3s ease;
}

.btn-glass:hover {
 background: rgba(255, 255, 255, 0.2);
 transform: translateY(-2px);
 color: white;
}

.stats-card {
 background: rgba(255, 255, 255, 0.1);
 backdrop-filter: blur(20px);
 border: 1px solid rgba(255, 255, 255, 0.2);
 border-radius: 15px;
 padding: 1.5rem;
 text-align: center;
 color: white;
 transition: all 0.3s ease;
}

.stats-card:hover {
 transform: translateY(-3px);
 background: rgba(255, 255, 255, 0.15);
}

.stats-number {
 font-size: 2.5rem;
 font-weight: bold;
 margin-bottom: 0.5rem;
 color: #ffd700;
}

.stats-label {
 font-size: 1rem;
 margin-bottom: 0.5rem;
 opacity: 0.9;
}

.user-card {
 background: rgba(255, 255, 255, 0.1);
 backdrop-filter: blur(20px);
 border: 1px solid rgba(255, 255, 255, 0.2);
 border-radius: 15px;
 padding: 1.5rem;
 margin-bottom: 1rem;
 transition: all 0.3s ease;
 position: relative;
}

.user-card:hover {
 transform: translateY(-3px);
 background: rgba(255, 255, 255, 0.15);
}

.user-avatar {
 width: 80px;
 height: 80px;
 border-radius: 50%;
 background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
 display: flex;
 align-items: center;
 justify-content: center;
 color: white;
 font-size: 2rem;
 font-weight: bold;
 position: relative;
 overflow: hidden;
}

.user-avatar img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 border-radius: 50%;
}

.avatar-upload {
 position: absolute;
 bottom: -5px;
 right: -5px;
 background: #ffd700;
 border-radius: 50%;
 width: 25px;
 height: 25px;
 display: flex;
 align-items: center;
 justify-content: center;
 cursor: pointer;
 font-size: 0.8rem;
 color: #333;
}

.status-badge {
 padding: 0.25rem 0.75rem;
 border-radius: 20px;
 font-size: 0.8rem;
 font-weight: 500;
 display: inline-block;
}

.status-active {
 background: rgba(40, 167, 69, 0.2);
 color: #28a745;
 border: 1px solid rgba(40, 167, 69, 0.3);
}

.status-inactive {
 background: rgba(220, 53, 69, 0.2);
 color: #dc3545;
 border: 1px solid rgba(220, 53, 69, 0.3);
}

.status-pending {
 background: rgba(255, 193, 7, 0.2);
 color: #ffc107;
 border: 1px solid rgba(255, 193, 7, 0.3);
}

.role-badge {
 padding: 0.25rem 0.75rem;
 border-radius: 20px;
 font-size: 0.8rem;
 font-weight: 500;
 margin-left: 0.5rem;
}

.role-admin {
 background: rgba(255, 193, 7, 0.2);
 color: #ffc107;
 border: 1px solid rgba(255, 193, 7, 0.3);
}

.role-user {
 background: rgba(23, 162, 184, 0.2);
 color: #17a2b8;
 border: 1px solid rgba(23, 162, 184, 0.3);
}

/* Form Controls */
.form-control, .form-select {
 background: rgba(255, 255, 255, 0.1);
 border: 1px solid rgba(255, 255, 255, 0.2);
 color: white;
 border-radius: 10px;
}

.form-control:focus, .form-select:focus {
 background: rgba(255, 255, 255, 0.15);
 border-color: #ffd700;
 box-shadow: 0 0 0 0.2rem rgba(255, 215, 0, 0.25);
 color: white;
}

.form-control::placeholder {
 color: rgba(255, 255, 255, 0.6);
}

.form-label {
 color: white;
 font-weight: 600;
}

/* Buttons */
.btn-primary {
 background: linear-gradient(45deg, #667eea, #764ba2);
 border: none;
 border-radius: 10px;
 padding: 0.75rem 1.5rem;
 font-weight: 600;
 transition: all 0.3s ease;
}

.btn-primary:hover {
 transform: translateY(-2px);
 box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
}

.btn-success {
 background: linear-gradient(45deg, #28a745, #20c997);
 border: none;
 border-radius: 10px;
}

.btn-warning {
 background: linear-gradient(45deg, #ffc107, #fd7e14);
 border: none;
 border-radius: 10px;
}

.btn-danger {
 background: linear-gradient(45deg, #dc3545, #fd7e14);
 border: none;
 border-radius: 10px;
}

.btn-glass {
 background: rgba(255, 255, 255, 0.1);
 backdrop-filter: blur(20px);
 border: 1px solid rgba(255, 255, 255, 0.2);
 border-radius: 10px;
 color: white;
 transition: all 0.3s ease;
}

.btn-glass:hover {
 background: rgba(255, 255, 255, 0.2);
 transform: translateY(-2px);
 color: white;
}

/* Responsive */
@media (max-width: 768px) {
 .admin-hero {
 min-height: 30vh;
 }

 .stats-number {
 font-size: 2rem;
 }
}