/* HD Research Hub — "Sunrise Hope" Design System
   Designed via Google Stitch. No teal. Warm, inspirational, readable.
   Primary Gold (#F59E0B), Secondary Amber (#92400E), Accent Coral (#FB7185)
*/

:root {
  --primary: #F59E0B;
  --primary-dark: #D97706;
  --primary-light: #FEF3C7;
  --secondary: #92400E;
  --secondary-light: #FBBF24;
  --accent: #FB7185;
  --accent-light: #FFE4E6;
  --surface: #FFFBEB;
  --surface-white: #FFFFFF;
  --on-surface: #1E293B;
  --on-surface-light: #475569;
  --outline: #94A3B8;
  --outline-light: #E2E8F0;
}

body {
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  line-height: 1.7;
  color: var(--on-surface);
  background: var(--surface);
}

/* Google Translate: hide cruft */
.goog-te-banner-frame { display: none !important; }
body { top: 0 !important; position: static !important; }
.goog-te-gadget { font-size: 0 !important; }
.goog-te-gadget .goog-te-combo {
  font-size: 13px !important;
  padding: 4px 8px;
  border: 1px solid var(--outline-light);
  border-radius: 8px;
  background: white;
  color: var(--on-surface);
  outline: none;
  cursor: pointer;
}
.goog-te-gadget > span { display: none !important; }
.goog-te-gadget img { display: none !important; }
#google_translate_element { line-height: 0; }
body > .skiptranslate { display: none !important; }
iframe.skiptranslate { display: none !important; }
#google_translate_element .skiptranslate { display: block !important; }

/* Mobile nav */
@media (max-width: 768px) {
  body { font-size: 16px; }
  .mobile-menu { display: none; }
  .mobile-menu.active {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 56px;
    left: 0;
    right: 0;
    background: white;
    padding: 12px 16px;
    border-bottom: 1px solid var(--outline-light);
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    z-index: 100;
    gap: 4px;
  }
  .mobile-menu a { padding: 10px 8px !important; border-radius: 8px; }
  .mobile-menu a:hover { background: var(--primary-light); }
  .desktop-only { display: none !important; }
}

/* Mobile tables */
@media (max-width: 768px) {
  table { font-size: 12px; }
  th, td { padding: 6px 8px !important; }
  th { font-size: 10px; }
}

/* Mobile typography */
@media (max-width: 768px) {
  h1 { font-size: 2rem !important; }
  h2 { font-size: 1.4rem !important; }
  section { padding-left: 1rem !important; padding-right: 1rem !important; }
  .rounded-2xl { border-radius: 1rem; }
  .rounded-3xl { border-radius: 1rem; }
  main { padding-left: 0.75rem !important; padding-right: 0.75rem !important; }
}

/* Touch targets */
@media (max-width: 768px) {
  a, button { min-height: 44px; display: inline-flex; align-items: center; }
  input { min-height: 48px; font-size: 16px !important; }
  /* Prevent horizontal scroll */
  body { overflow-x: hidden; }
  .overflow-x-auto { -webkit-overflow-scrolling: touch; }
}

/* Stat cards */
.stat-card {
  transition: transform 0.2s, box-shadow 0.2s;
  border-radius: 12px;
}
.stat-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 30px rgba(0,0,0,0.06);
}

/* Chat bubbles */
.chat-bubble { animation: fadeIn 0.3s ease-in; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.typing-dots span { animation: blink 1.4s infinite both; }
.typing-dots span:nth-child(2) { animation-delay: 0.2s; }
.typing-dots span:nth-child(3) { animation-delay: 0.4s; }
@keyframes blink { 0%, 80%, 100% { opacity: 0.3; } 40% { opacity: 1; } }