.cd-body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #0b1120; color: #e2e8f0; min-height: 100vh; }
.cd-shell { max-width: 1100px; margin: 0 auto; padding: 2rem; }
.cd-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 2rem; position: relative; }
.cd-header-left { display: flex; align-items: center; gap: 1rem; }
.cd-header h1 { margin: 0; font-size: 1.75rem; }
.cd-nav { display: flex; gap: 1rem; align-items: center; }
.cd-nav a { color: #94a3b8; text-decoration: none; font-size: .9rem; }
.cd-nav a:hover { color: #fff; }

/* Product Switcher */
.cd-product-switcher { background: #1e293b; border: 1px solid #334155; color: #94a3b8; padding: .5rem; border-radius: 6px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.cd-product-switcher:hover { background: #334155; color: #f8fafc; }
.cd-product-menu { position: absolute; top: 4.5rem; left: 0; background: #1e293b; border: 1px solid #334155; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.3); min-width: 200px; z-index: 1000; }
.cd-product-item { display: flex; align-items: center; gap: .75rem; padding: .75rem 1rem; color: #94a3b8; text-decoration: none; border-bottom: 1px solid #334155; }
.cd-product-item:last-child { border-bottom: none; }
.cd-product-item:hover { background: #334155; color: #f8fafc; }
.cd-product-item.active { background: #3b82f6; color: #fff; }
.cd-product-icon { font-size: 1.25rem; }
.cd-product-name { font-size: .95rem; font-weight: 500; }

/* Sync Button */
.cd-sync-btn { background: #1e293b; border: 1px solid #334155; color: #94a3b8; padding: .5rem 1rem; border-radius: 6px; cursor: pointer; display: flex; align-items: center; gap: .5rem; font-size: .9rem; }
.cd-sync-btn:hover { background: #334155; color: #f8fafc; }
.cd-sync-btn:disabled { opacity: 0.6; cursor: not-allowed; }
.cd-spin { animation: spin 1s linear infinite; }
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

/* User Avatar */
.cd-user-avatar-container { position: relative; }
.cd-user-avatar { width: 36px; height: 36px; border-radius: 50%; background: #3b82f6; color: #fff; border: 2px solid #334155; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: .85rem; font-weight: 600; transition: all 0.2s; }
.cd-user-avatar:hover { transform: scale(1.05); border-color: #3b82f6; }
.cd-user-menu { position: absolute; top: 3rem; right: 0; background: #1e293b; border: 1px solid #334155; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.3); min-width: 250px; z-index: 1000; }
.cd-user-menu-header { padding: 1rem; display: flex; gap: .75rem; align-items: center; }
.cd-user-menu-avatar { width: 48px; height: 48px; border-radius: 50%; background: #3b82f6; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 1.1rem; font-weight: 600; flex-shrink: 0; }
.cd-user-menu-info { flex: 1; min-width: 0; }
.cd-user-menu-name { color: #f8fafc; font-weight: 600; font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cd-user-menu-email { color: #94a3b8; font-size: .8rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cd-user-menu-divider { height: 1px; background: #334155; }
.cd-user-menu-item { display: flex; align-items: center; gap: .75rem; padding: .75rem 1rem; color: #94a3b8; text-decoration: none; border: none; background: none; width: 100%; text-align: left; cursor: pointer; font-size: .9rem; }
.cd-user-menu-item:hover { background: #334155; color: #f8fafc; }
.cd-user-menu-item svg { flex-shrink: 0; }

.sections { display: flex; flex-direction: column; gap: 2rem; }
.cd-section { background: #1e293b; border-radius: 16px; padding: 1.5rem; }
.cd-section-title { font-size: 1.1rem; color: #94a3b8; margin: 0 0 1rem; text-transform: uppercase; letter-spacing: .05em; }

.cd-global-controls { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.5rem; background: #1e293b; border-radius: 16px; padding: 1.25rem; }
.cd-range-switch { display: flex; gap: .5rem; flex-wrap: wrap; }
.cd-range-btn { padding: .5rem 1rem; border: 1px solid #334155; background: #0f172a; color: #94a3b8; border-radius: 8px; cursor: pointer; font-size: .9rem; }
.cd-range-btn:hover { border-color: #3b82f6; color: #fff; }
.cd-range-btn.active { background: #3b82f6; color: #fff; border-color: #3b82f6; }

.cd-kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; }
.cd-kpi-card { background: #0f172a; border-radius: 12px; padding: 1.25rem; position: relative; border: 1px solid transparent; }
.cd-kpi-card[data-status="pending"] { border-color: #ca8a04; }
.cd-kpi-card[data-status="configured"] { border-color: #16a34a; }
.cd-kpi-card[data-status="error"] { border-color: #dc2626; }
.cd-kpi-card[data-status="loading"] { opacity: .7; }
.cd-kpi-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: .5rem; }
.cd-kpi-status { width: 8px; height: 8px; border-radius: 50%; }
.cd-kpi-status[data-status="pending"] { background: #ca8a04; }
.cd-kpi-status[data-status="configured"] { background: #16a34a; }
.cd-kpi-status[data-status="error"] { background: #dc2626; }
.cd-kpi-status[data-status="loading"] { background: #3b82f6; animation: pulse 1s infinite; }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }
.cd-kpi-link { background: transparent; border: 1px solid #334155; color: #94a3b8; border-radius: 6px; width: 26px; height: 26px; cursor: pointer; font-size: 1rem; display: flex; align-items: center; justify-content: center; }
.cd-kpi-link:hover { border-color: #3b82f6; color: #fff; }
.cd-kpi-label { font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; color: #64748b; margin-bottom: .4rem; }
.cd-kpi-value { font-size: 1.6rem; font-weight: 700; color: #f8fafc; }
.cd-kpi-value.green { color: #4ade80; }
.cd-kpi-value.red { color: #f87171; }
.cd-kpi-value.blue { color: #60a5fa; }

/* Modal */
.cd-modal { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; }
.cd-modal-backdrop { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,.6); }
.cd-modal-content { position: relative; background: #1e293b; border-radius: 16px; padding: 2rem; width: 90%; max-width: 600px; max-height: 80vh; overflow-y: auto; box-shadow: 0 25px 50px rgba(0,0,0,.5); }
.cd-modal-content h3 { margin-top: 0; margin-bottom: 1.5rem; }
.cd-modal-actions { display: flex; justify-content: flex-end; gap: .75rem; margin-top: 1.5rem; }
.cd-select { width: 100%; padding: .75rem; border: 1px solid #334155; border-radius: 8px; background: #0f172a; color: #f8fafc; font-size: .95rem; margin-top: .3rem; }
.cd-btn { padding: .6rem 1.2rem; border-radius: 8px; border: none; cursor: pointer; font-size: .9rem; font-weight: 600; }
.cd-btn-primary { background: #3b82f6; color: #fff; }
.cd-btn-primary:disabled { background: #334155; cursor: not-allowed; }
.cd-btn-secondary { background: #334155; color: #e2e8f0; }
.cd-preview { background: #0f172a; border-radius: 8px; padding: 1rem; overflow-x: auto; }
.cd-preview-table { width: 100%; border-collapse: collapse; font-size: .8rem; }
.cd-preview-table th, .cd-preview-table td { padding: .4rem; text-align: left; border-bottom: 1px solid #334155; }
.cd-preview-table th { color: #94a3b8; font-weight: 600; }
#kpi-chart { width: 100%; height: 300px; }

/* Error */
.cd-error { background: #7f1d1d; color: #fecaca; padding: 1rem; border-radius: 8px; }

/* Drive files */
.cd-file-list { list-style: none; padding: 0; margin: 1rem 0 0; }
.cd-file-item { display: flex; justify-content: space-between; align-items: center; padding: .75rem 1rem; background: #0f172a; border-radius: 8px; margin-bottom: .5rem; }
.cd-file-item[data-type="folder"] .cd-file-name { color: #60a5fa; }
.cd-file-item[data-type="pdf"] .cd-file-name { color: #f87171; }
.cd-file-item[data-type="sheet"] .cd-file-name { color: #4ade80; }
.cd-file-item[data-type="excel"] .cd-file-name { color: #34d399; }
.cd-file-name { font-weight: 500; }
.cd-file-link { color: #94a3b8; text-decoration: none; font-size: .85rem; }
.cd-file-link:hover { color: #fff; }

/* CFO Chat */
.cd-cfo-chat { display: flex; flex-direction: column; gap: 1rem; }
.cd-chat-history { background: #0f172a; border-radius: 12px; padding: 1.5rem; min-height: 300px; max-height: 500px; overflow-y: auto; display: flex; flex-direction: column; gap: 1rem; }
.cd-chat-history:empty::before { content: '💬 Stelle mir eine Frage über dein Unternehmen...'; color: #64748b; font-style: italic; }
.cd-chat-message { display: flex; gap: 1rem; align-items: flex-start; }
.cd-chat-user { justify-content: flex-end; }
.cd-chat-assistant { justify-content: flex-start; }
.cd-chat-avatar { width: 32px; height: 32px; border-radius: 50%; background: #334155; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; flex-shrink: 0; }
.cd-chat-user .cd-chat-avatar { background: #3b82f6; }
.cd-chat-content { flex: 1; max-width: 80%; }
.cd-chat-user .cd-chat-content { text-align: right; }
.cd-chat-label { font-size: .75rem; color: #64748b; margin-bottom: .25rem; text-transform: uppercase; letter-spacing: .05em; }
.cd-chat-text { background: #1e293b; padding: .75rem 1rem; border-radius: 12px; line-height: 1.6; word-wrap: break-word; }
.cd-chat-user .cd-chat-text { background: #3b82f6; color: #fff; }
.cd-chat-input-area { display: flex; gap: .75rem; flex-wrap: wrap; }
.cd-chat-input { flex: 1; min-width: 200px; padding: .75rem 1rem; border: 1px solid #334155; border-radius: 8px; background: #0f172a; color: #f8fafc; font-size: .95rem; }
.cd-chat-input:focus { outline: none; border-color: #3b82f6; }
.cd-chat-input-area .cd-btn { white-space: nowrap; }
.cd-chat-options { margin: .5rem 0; }
.cd-checkbox-label { display: flex; align-items: center; gap: .5rem; color: #94a3b8; font-size: .85rem; cursor: pointer; }
.cd-checkbox-label:hover { color: #e2e8f0; }
.cd-checkbox { width: 16px; height: 16px; cursor: pointer; }
.cd-chat-examples { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.cd-example-btn { padding: .4rem .8rem; border: 1px solid #334155; background: #0f172a; color: #94a3b8; border-radius: 6px; cursor: pointer; font-size: .8rem; }
.cd-example-btn:hover { border-color: #3b82f6; color: #fff; }

/* Responsive */
@media (max-width: 768px) {
  .cd-chat-input-area { flex-direction: column; }
  .cd-chat-input { width: 100%; min-width: 100%; }
  .cd-chat-input-area .cd-btn { width: 100%; }
  .cd-chat-content { max-width: 90%; }
  .cd-example-btn { font-size: .75rem; padding: .35rem .6rem; }
}
