@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
body { font-family: 'Inter', sans-serif; }

/* Sidebar */
.sidebar-link.active { background: rgba(184,150,12,0.12); color: #B8960C; font-weight: 600; }
.sidebar-link:hover { background: rgba(184,150,12,0.08); }
.sidebar-section-title { font-size: 0.6rem; text-transform: uppercase; letter-spacing: 0.1em; color: rgba(255,255,255,0.3); padding: 12px 12px 4px; font-weight: 600; }
#sidebar.open { transform: translateX(0) !important; }

/* Cards & KPIs */
.kpi-card { transition: transform 0.15s; }
.kpi-card:hover { transform: translateY(-2px); }
.table-row:hover { background: #faf7f0; }

/* Badges */
.badge { font-size: 0.65rem; padding: 2px 8px; border-radius: 9999px; font-weight: 600; text-transform: uppercase; }
.badge-active { background: #dcfce7; color: #166534; }
.badge-paid { background: #dbeafe; color: #1e40af; }
.badge-open { background: #fef9c3; color: #854d0e; }
.badge-overdue { background: #fee2e2; color: #991b1b; }
.badge-credit { background: #f3e8ff; color: #6b21a8; }
.badge-shipped { background: #d1fae5; color: #065f46; }
.badge-pill { display: inline-block; font-size: 10px; font-weight: 600; padding: 2px 8px; border-radius: 10px; white-space: nowrap; }
.bg-green { background: #EDF5E5; color: #27500A; }
.bg-amber { background: #FDF3E3; color: #8B7132; }
.bg-red { background: #FCF0F0; color: #8B2020; }
.bg-blue { background: #EEF4FA; color: #1A4D80; }
.bg-gray { background: #F1EFE8; color: #555550; }
.bg-gold { background: #F5EEDC; color: #8B7132; }
.bg-teal { background: #EBF5F0; color: #1A5C3C; }
.bg-purple { background: #F2F0F8; color: #4A3F8F; }

/* Progress bars */
.progress-bar { height: 8px; border-radius: 4px; background: #e5e7eb; overflow: hidden; }
.progress-fill { height: 100%; border-radius: 4px; transition: width 0.6s ease; }
.bar-fill { transition: width 0.6s ease; }

/* Credit hold banner */
.credit-hold-banner { background: linear-gradient(90deg, #fef2f2, #fee2e2); border-left: 4px solid #ef4444; }

/* Tooltips */
.tooltip { position: relative; }
.tooltip:hover::after { content: attr(data-tip); position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); background: #1a1a1a; color: white; padding: 4px 8px; border-radius: 4px; font-size: 0.7rem; white-space: nowrap; z-index: 999; }
.info-tip { display: inline-flex; align-items: center; justify-content: center; width: 15px; height: 15px; border-radius: 50%; background: #F5EEDC; color: #8B7132; font-size: 9px; font-weight: 700; cursor: help; position: relative; margin-left: 4px; font-style: italic; font-family: Georgia, serif; border: 1px solid rgba(184,150,12,0.4); }
.info-tip:hover::after { content: attr(data-tip); position: absolute; bottom: 120%; left: 50%; transform: translateX(-50%); background: #1a1a1a; color: #fff; padding: 8px 12px; border-radius: 8px; font-size: 11px; font-weight: 400; white-space: normal; max-width: 300px; z-index: 100; font-family: 'Inter', sans-serif; font-style: normal; box-shadow: 0 4px 16px rgba(0,0,0,0.3); border: 1px solid #B8960C; }

/* Tab buttons */
.tab-btn { padding: 6px 16px; border-radius: 8px; font-size: 0.8rem; font-weight: 500; cursor: pointer; transition: all 0.15s; border: none; }
.tab-btn.active { background: #B8960C; color: white; }
.tab-btn:not(.active) { background: #f3f4f6; color: #6b7280; }
.tab-btn:not(.active):hover { background: #e5e7eb; }

/* Notes */
.note-text { white-space: pre-line; }

/* Loading */
.loading-pulse { animation: pulse 1.5s infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:0.4} }

/* Kanban */
.kanban { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 8px; }
.kanban-col { flex: 1; min-width: 220px; background: #f3f4f6; border-radius: 12px; padding: 12px; }
.kanban-header { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: #8B7132; margin-bottom: 10px; padding-bottom: 6px; border-bottom: 2px solid #B8960C; }
.kanban-card { background: white; border: 1px solid rgba(0,0,0,0.1); border-radius: 8px; padding: 12px; margin-bottom: 8px; transition: border-color 0.15s; }
.kanban-card:hover { border-color: #B8960C; }

/* Calendar */
.cal-chip { font-size: 11px; padding: 6px 8px; border-radius: 6px; margin-bottom: 4px; border-left: 3px solid #B8960C; background: #faf7f0; }
.chip-call { background: #EEF4FA; border-color: #3D7BBF; }
.chip-visit { background: #EDF5E5; border-color: #5A8A2A; }
.chip-video { background: #F2F0F8; border-color: #6B5DC2; }
.chip-email { background: #FAF7F0; border-color: #B8960C; }
.chip-meeting { background: #EBF5F0; border-color: #2B8A5E; }

/* Chat messages */
.chat-msg { margin-bottom: 10px; max-width: 80%; }
.chat-msg.user { margin-left: auto; background: #1a1a1a; color: #fff; border-radius: 12px 12px 0 12px; padding: 10px 14px; font-size: 13px; }
.chat-msg.ai { background: #FAF7F0; border: 1px solid rgba(184,150,12,0.2); border-radius: 12px 12px 12px 0; padding: 10px 14px; font-size: 13px; }

/* Quick questions */
.quick-q { background: #FAF7F0; border: 1px solid rgba(184,150,12,0.3); padding: 8px 14px; border-radius: 20px; font-size: 12px; cursor: pointer; color: #8B7132; transition: all 0.15s; font-weight: 500; }
.quick-q:hover { background: #F5EEDC; border-color: #B8960C; }

/* Forecast grid */
.fc-grid { width: 100%; border-collapse: collapse; font-size: 12px; }
.fc-grid th { position: sticky; top: 0; background: white; z-index: 2; padding: 6px 4px; font-size: 9px; text-transform: uppercase; letter-spacing: 0.8px; color: #6b7280; font-weight: 600; border-bottom: 2px solid #B8960C; text-align: center; white-space: nowrap; }
.fc-grid td { padding: 2px; border-bottom: 0.5px solid rgba(0,0,0,0.1); vertical-align: middle; text-align: center; }
.fc-grid .fc-cell input { width: 100%; padding: 4px 2px; border: 0.5px solid transparent; border-radius: 3px; text-align: center; font-size: 11px; font-family: 'SF Mono', 'Fira Code', monospace; background: transparent; outline: none; transition: all 0.15s; }
.fc-grid .fc-cell input:hover { border-color: rgba(0,0,0,0.1); background: #f3f4f6; }
.fc-grid .fc-cell input:focus { border-color: #B8960C; background: #FAF7F0; box-shadow: 0 0 0 2px rgba(184,150,12,0.15); }

/* Exec banner */
.exec-banner { background: #1a1a1a; border: 2px solid #B8960C; border-radius: 12px; padding: 14px 20px; display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }

/* Star rating */
.star-rating { display: flex; gap: 2px; }
.star { cursor: pointer; font-size: 18px; color: #e5e7eb; transition: color 0.1s; }
.star.filled { color: #B8960C; }

/* Heatmap */
.heatmap-cell { border-radius: 3px; display: flex; align-items: center; justify-content: center; font-size: 10px; font-family: 'SF Mono', monospace; min-height: 28px; }

/* Mobile responsive */
@media (max-width: 768px) {
  .kanban { flex-direction: column; }
  .fc-grid { font-size: 10px; }
  .fc-grid th { font-size: 8px; }
}

/* Print styles */
@media print {
  #sidebar, #mobileHeader, #overlay { display: none !important; }
  #mainContent { margin-left: 0 !important; padding-top: 0 !important; }
}