/* Component-Specific Styles */

/* Card Enhancements */
.card {
    border: none;
    border-radius: var(--border-radius);
    box-shadow: var(--card-shadow);
    transition: var(--transition);
    background: var(--card-bg);
    backdrop-filter: blur(10px);
    overflow: hidden;
}

.card:hover {
    /* Removed raise effect */
    transform: none;
    box-shadow: var(--card-shadow-hover);
}

.card-header {
    background: var(--primary-gradient);
    color: white;
    border: none;
    font-weight: 600;
    padding: 1.25rem 1.5rem;
    min-height: 80px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.card-header h5 {
    margin: 0;
    flex: 1;
}

/* Force all card headers to have the same structure */
.card-header:not(.d-flex) {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.card-body {
    padding: 1.5rem;
}

/* Buttons - consolidated with CSS variables */
.btn {
    border-radius: 10px;
    font-weight: 600;
    padding: 0.75rem 1.5rem;
    transition: var(--transition);
    border: none;
    position: relative;
    overflow: hidden;
}

.btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: var(--transition);
}

.btn:hover::before {
    left: 100%;
}

/* Shared hover effect for all buttons */
.btn:hover {
    background: var(--purple-darker) !important;
    transform: translateY(-2px) !important;
    color: white !important;
}

/* Button-specific hover colors - consolidated */
.btn-primary:hover,
.btn-outline-primary:hover,
.btn-light:hover {
    border: 2px solid #a855f7 !important;
    box-shadow: 0 0 20px rgba(168, 85, 247, 0.4) !important;
}

.btn-success:hover,
.btn-outline-success:hover {
    border: 2px solid #10b981 !important;
    box-shadow: 0 0 20px rgba(16, 185, 129, 0.4) !important;
}

.btn-outline-secondary:hover {
    border: 2px solid #6b7280 !important;
    box-shadow: 0 0 20px rgba(107, 114, 128, 0.4) !important;
}

.btn-outline-info:hover {
    border: 2px solid #06b6d4 !important;
    box-shadow: 0 0 20px rgba(6, 182, 212, 0.4) !important;
}

.btn-danger:hover {
    border: 2px solid #ef4444 !important;
    box-shadow: 0 0 20px rgba(239, 68, 68, 0.4) !important;
}

/* Button base styles - using CSS variables */
.btn-primary {
    background: var(--purple-primary);
    box-shadow: 0 4px 15px rgba(124, 58, 237, 0.4);
    color: white;
}

.btn-success {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    box-shadow: 0 4px 15px rgba(16, 185, 129, 0.4);
}

.btn-outline-secondary {
    border: 2px solid #e9ecef;
    color: #6c757d;
    background: transparent;
}

.btn-outline-primary {
    border: 2px solid #667eea;
    color: #667eea;
    background: transparent;
}

.btn-outline-success {
    border: 2px solid #4facfe;
    color: #4facfe;
    background: transparent;
}

.btn-outline-info {
    border: 2px solid #17a2b8;
    color: #17a2b8;
    background: transparent;
}

.btn-danger {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    box-shadow: 0 4px 15px rgba(220, 53, 69, 0.3);
}

/* Light button styling for hero sections - using CSS variables */
.btn-light {
    background: var(--purple-primary);
    box-shadow: 0 4px 15px rgba(124, 58, 237, 0.4);
    color: white;
    border: none;
}

/* Outline light button styling for hero sections */
.btn-outline-light {
    border: 2px solid rgba(255, 255, 255, 0.8);
    color: rgba(255, 255, 255, 0.9);
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    padding: 0.75rem 1.5rem;
    height: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-outline-light:hover {
    background: rgba(255, 255, 255, 0.2) !important;
    border: 2px solid rgba(255, 255, 255, 1) !important;
    color: rgba(255, 255, 255, 1) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 15px rgba(255, 255, 255, 0.3) !important;
}

/* Navigation Pills */
.nav-pills .nav-link {
    border-radius: 10px;
    font-weight: 500;
    padding: 0.75rem 1.25rem;
    transition: var(--transition);
    color: var(--text-secondary);
}

.nav-pills .nav-link.active {
    background: var(--primary-gradient);
    color: white;
}

.nav-pills .nav-link:hover:not(.active) {
    background: rgba(102, 126, 234, 0.1);
    color: var(--text-primary);
}

/* Form Controls */
.form-control {
    border-radius: 10px;
    border: 2px solid var(--border-color);
    padding: 0.75rem 1rem;
    transition: var(--transition);
}

.form-control:focus {
    border-color: #667eea;
    box-shadow: 0 0 0 0.2rem rgba(102, 126, 234, 0.25);
}

/* Text Utilities */
.welcome-text {
    font-size: 1.1rem;
    line-height: 1.6;
    color: var(--text-secondary);
}

.dark-purple-text {
    color: #4c1d95;
    font-weight: 700;
}

.bright-subtext {
    color: #6b7280;
    font-size: 1.1rem;
}