/* FinBestie Design Theme
   Single source of truth for fonts, colors, and spacing.
   To switch fonts: change --font-family and the @import URL. */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
  /* Font */
  --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Type scale */
  --text-xs: 13px;
  --text-sm: 14px;
  --text-base: 16px;
  --text-lg: 18px;
  --text-xl: 24px;
  --text-2xl: 32px;
  --text-hero: 48px;

  /* Font weights */
  --font-normal: 400;
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;

  /* Colors */
  --primary: #10b981;
  --primary-dark: #059669;
  --danger: #ef4444;
  --text: #1a1a2e;
  --text-muted: #6b7280;
  --bg: #ffffff;
  --bg-subtle: #f9fafb;
  --border: #e5e7eb;
}

*, *::before, *::after {
  font-family: var(--font-family);
}

body {
  font-family: var(--font-family);
  font-size: var(--text-base);
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Common Components */
.tag-green { background: #dcfce7; color: #166534; }
.tag-yellow { background: #fef9c3; color: #854d0e; }
.tag-red { background: #fee2e2; color: #991b1b; }
.tag-blue { background: #dbeafe; color: #1e40af; }

/* Scrollbars */
.custom-scrollbar::-webkit-scrollbar { width: 4px; }
.custom-scrollbar::-webkit-scrollbar-track { background: transparent; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: #e5e7eb; border-radius: 10px; }
.custom-scrollbar::-webkit-scrollbar-thumb:hover { background: #d1d5db; }

/* Chat Styles */
.chat-msg { white-space: pre-wrap; word-break: break-word; }
.chat-msg.prose { white-space: normal; }
.chat-msg.prose h1,.chat-msg.prose h2,.chat-msg.prose h3 { font-size: 0.95rem; font-weight: 700; margin: 0.75em 0 0.4em; }
.chat-msg.prose p { margin: 0.5em 0; }
.chat-msg.prose ul,.chat-msg.prose ol { margin: 0.5em 0; padding-left: 1.5em; }
.chat-msg.prose li { margin: 0.25em 0; }
.chat-msg.prose strong { font-weight: 700; color: #111827; }
.chat-msg.prose code { background: #f3f4f6; padding: 0.2em 0.4em; border-radius: 4px; font-size: 0.85em; font-family: ui-monospace, monospace; }
.chat-msg.prose table { border-collapse: collapse; margin: 1em 0; width: 100%; font-size: 0.85em; }
.chat-msg.prose th,.chat-msg.prose td { border: 1px solid #e5e7eb; padding: 0.5em 0.75em; text-align: left; }
.chat-msg.prose th { background: #f9fafb; font-weight: 600; }

.thinking-dots span { animation: blink 1.4s infinite; opacity: 0; }
.thinking-dots span:nth-child(1) { animation-delay: 0s; }
.thinking-dots span:nth-child(2) { animation-delay: 0.2s; }
.thinking-dots span:nth-child(3) { animation-delay: 0.4s; }
@keyframes blink { 0%,20% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; } }

/* Tab Buttons */
.tab-btn { transition: all 0.2s ease; cursor: pointer; }

/* Icon Buttons with labels */
.icon-btn-label { position: absolute; bottom: -20px; left: 50%; transform: translateX(-50%); white-space: nowrap; font-size: 9px; font-weight: 800; text-transform: uppercase; color: #94a3b8; opacity: 0; pointer-events: none; transition: all 0.2s; }
.icon-btn:hover .icon-btn-label { opacity: 1; bottom: -14px; }