CIEK Solutions - AI-Powered CLV Analytics

Ask Your Data

AI POWERED

Analyzing your query...

Analysis Results

🧠 AI Insights

💡 Try asking:

Oops!

Example Questions You Can Ask

View Traditional Dashboard

.query-input:focus { border-color: #667eea; background: white; box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1); } .query-input::placeholder { color: #9ca3af; } .query-actions { display: flex; gap: 1rem; margin-top: 1rem; align-items: center; } .btn { padding: 0.7rem 1.5rem; border: none; border-radius: 8px; font-size: 0.9rem; font-weight: 600; cursor: pointer; transition: all 0.3s ease; display: inline-flex; align-items: center; gap: 0.5rem; } .btn-primary { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; } .btn-primary:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3); } .btn-secondary { background: #f3f4f6; color: #374151; border: 1px solid #d1d5db; } .btn-secondary:hover { background: #e5e7eb; } .loading { display: none; align-items: center; gap: 0.5rem; color: #667eea; font-weight: 500; } .spinner { width: 16px; height: 16px; border: 2px solid #e5e7eb; border-top: 2px solid #667eea; border-radius: 50%; animation: spin 1s linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /* Suggestions */ .suggestions { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1rem; } .suggestion-chip { background: #f0f4ff; color: #667eea; padding: 0.4rem 0.8rem; border-radius: 15px; font-size: 0.8rem; cursor: pointer; transition: all 0.2s ease; border: 1px solid #e0e7ff; } .suggestion-chip:hover { background: #667eea; color: white; } /* Results Section */ .results-section { display: none; background: white; border-radius: 12px; padding: 2rem; margin-bottom: 2rem; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); } .results-header { display: flex; justify-content: between; align-items: center; margin-bottom: 1.5rem; padding-bottom: 1rem; border-bottom: 2px solid #f3f4f6; } .results-title { color: #1f2937; font-size: 1.3rem; margin-bottom: 0.5rem; } .query-echo { color: #6b7280; font-style: italic; } .results-content { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin-bottom: 2rem; } .chart-container { background: #f9fafb; border-radius: 8px; padding: 1.5rem; height: 400px; position: relative; } .insights-container { background: #f0f9ff; border-left: 4px solid #0ea5e9; padding: 1.5rem; border-radius: 8px; } .insights-title { color: #0c4a6e; font-size: 1.1rem; margin-bottom: 1rem; display: flex; align-items: center; gap: 0.5rem; } .insights-content { color: #374151; line-height: 1.7; } .insights-content h4 { color: #1f2937; margin-top: 1rem; margin-bottom: 0.5rem; } .insights-content ul { margin-left: 1rem; } .insights-content li { margin-bottom: 0.3rem; } /* Follow-up suggestions */ .followup-section { background: #fefce8; border-left: 4px solid #eab308; padding: 1rem; border-radius: 8px; margin-top: 1.5rem; } .followup-title { color: #92400e; font-weight: 600; margin-bottom: 0.5rem; } .followup-suggestions { display: flex; flex-wrap: wrap; gap: 0.5rem; } .followup-chip { background: white; color: #92400e; padding: 0.3rem 0.6rem; border-radius: 12px; font-size: 0.8rem; cursor: pointer; transition: all 0.2s ease; border: 1px solid #fbbf24; } .followup-chip:hover { background: #fbbf24; color: white; } /* Error handling */ .error-container { background: #fef2f2; border-left: 4px solid #ef4444; padding: 1rem; border-radius: 8px; color: #991b1b; display: none; } /* Traditional Dashboard Toggle */ .dashboard-toggle { text-align: center; margin: 2rem 0; } .toggle-link { color: #667eea; text-decoration: none; font-weight: 500; padding: 0.5rem 1rem; border: 1px solid #667eea; border-radius: 8px; transition: all 0.3s ease; } .toggle-link:hover { background: #667eea; color: white; } /* Responsive design */ @media (max-width: 768px) { .results-content { grid-template-columns: 1fr; } .query-actions { flex-direction: column; align-items: stretch; } .btn { justify-content: center; } } /* Examples section */ .examples-section { background: white; border-radius: 12px; padding: 2rem; margin-bottom: 2rem; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); } .examples-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1.5rem; margin-top: 1rem; } .example-category { background: #f9fafb; border-radius: 8px; padding: 1.5rem; } .example-category h4 { color: #374151; margin-bottom: 1rem; } .example-query { background: white; padding: 0.8rem; border-radius: 6px; margin-bottom: 0.5rem; cursor: pointer; transition: all 0.2s ease; border: 1px solid #e5e7eb; font-size: 0.9rem; } .example-query:hover { border-color: #667eea; background: #f0f4ff; }