/* ==============================================
   NEXORA — DARK MODE + MOBILE + CONTRAST FIXES
   ============================================== */

/* ===== CONTRAST FIXES (light theme) ===== */
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Ensure hero text is always readable */
.hero-home .hero__headline,
.hero__headline {
  color: #0F172A !important;
  text-shadow: none;
}
.hero-home .hero__sub,
.hero__sub {
  color: #475569 !important;
}
.hero-home .hero__badge {
  color: #4F46E5 !important;
}

/* Ticker text always visible */
.ticker-wrap .ticker-item {
  color: rgba(255,255,255,0.95) !important;
  font-weight: 600;
}

/* Trust bar text */
.trust-item strong { color: #0F172A !important; }
.trust-item span { color: #64748B !important; }

/* Service cards */
.service-card__body h3 { color: #0F172A !important; }
.service-card__body p { color: #475569 !important; }
.service-card__price { color: #4F46E5 !important; font-weight: 700; }

/* Steps */
.step-card h3 { color: #0F172A !important; }
.step-card p { color: #475569 !important; }

/* Blog cards */
.blog-card h3 { color: #0F172A !important; }
.blog-card p { color: #475569 !important; }

/* Reviews */
.review-card__text { color: #374151 !important; }

/* Footer - ensure text readable on dark background */
footer { background: #0F172A; }
footer p, footer span, footer li { color: rgba(255,255,255,0.7); }
footer strong { color: rgba(255,255,255,0.9); }
footer a { color: rgba(255,255,255,0.6); }
footer a:hover { color: white; }
.footer-bottom p { color: rgba(255,255,255,0.4) !important; }

/* Page header text always clear */
.page-header h1 { color: #0F172A !important; }

/* Section headers */
.section-header h2 { color: #0F172A !important; }
.section-header p { color: #475569 !important; }

/* Auth pages */
.auth-title { color: #0F172A !important; }
.auth-subtitle { color: #64748B !important; }

/* ===== DARK MODE ===== */
[data-theme="dark"] {
  --bg-primary: #0F172A;
  --bg-secondary: #1E293B;
  --bg-tertiary: #243044;
  --text-primary: #F1F5F9;
  --text-secondary: #94A3B8;
  --text-tertiary: #64748B;
  --border-color: #334155;
  --border-light: #1E293B;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.4);
  --shadow-md: 0 4px 6px rgba(0,0,0,0.4);
  --shadow-lg: 0 10px 15px rgba(0,0,0,0.5);
  --shadow-xl: 0 20px 25px rgba(0,0,0,0.6);
}

[data-theme="dark"] body {
  background: #0F172A;
  color: #F1F5F9;
}

[data-theme="dark"] #mainNav {
  background: rgba(15,23,42,0.95);
  border-bottom-color: #334155;
}

[data-theme="dark"] .nav-logo-text { color: #F1F5F9; }
[data-theme="dark"] .nav-link { color: #94A3B8; }
[data-theme="dark"] .nav-link:hover, [data-theme="dark"] .nav-link.active { color: #818CF8; background: rgba(99,102,241,0.12); }

[data-theme="dark"] .nav-dropdown-menu {
  background: #1E293B;
  border-color: #334155;
  box-shadow: 0 16px 40px rgba(0,0,0,0.5);
}
[data-theme="dark"] .nav-dropdown-item { color: #94A3B8; }
[data-theme="dark"] .nav-dropdown-item:hover { color: #818CF8; background: rgba(99,102,241,0.12); }

[data-theme="dark"] .mobile-nav { background: #0F172A; }
[data-theme="dark"] .mobile-nav-link { color: #E2E8F0; border-bottom-color: #334155; }

[data-theme="dark"] .hero-home { background: linear-gradient(135deg, #0F172A 0%, #1E2A3A 50%, #0F1E30 100%) !important; }
[data-theme="dark"] .hero__headline { color: #F1F5F9 !important; }
[data-theme="dark"] .hero__sub { color: #94A3B8 !important; }
[data-theme="dark"] .hero__badge { background: rgba(99,102,241,0.15) !important; border-color: rgba(99,102,241,0.3) !important; color: #818CF8 !important; }
[data-theme="dark"] .hero__mini-stats .hero-mini-stat span { color: #64748B; }
[data-theme="dark"] .hero-float { background: #1E293B; border-color: #334155; color: #E2E8F0; }

[data-theme="dark"] .trust-bar { background: #1E293B; border-bottom-color: #334155; }
[data-theme="dark"] .trust-item strong { color: #F1F5F9 !important; }
[data-theme="dark"] .trust-item span { color: #64748B !important; }
[data-theme="dark"] .trust-item__icon { filter: brightness(0.9); }

[data-theme="dark"] .section { background: #0F172A; }
[data-theme="dark"] .section--gray { background: #1E293B; }
[data-theme="dark"] .section-header h2 { color: #F1F5F9 !important; }
[data-theme="dark"] .section-header p { color: #94A3B8 !important; }
[data-theme="dark"] .section-tag { background: rgba(99,102,241,0.15); border-color: rgba(99,102,241,0.25); color: #818CF8; }

[data-theme="dark"] .stat-card { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .stat-card__label { color: #64748B; }

[data-theme="dark"] .service-card { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .service-card__icon { background: rgba(99,102,241,0.15); }
[data-theme="dark"] .service-card__body h3 { color: #F1F5F9 !important; }
[data-theme="dark"] .service-card__body p { color: #94A3B8 !important; }
[data-theme="dark"] .service-card__price { color: #818CF8 !important; }
[data-theme="dark"] .service-card__deadline { color: #64748B; }
[data-theme="dark"] .service-card__tags { border-top-color: #334155; }
[data-theme="dark"] .tag { background: rgba(99,102,241,0.12); color: #94A3B8; }
[data-theme="dark"] .service-card:hover .tag { background: rgba(99,102,241,0.2); color: #818CF8; }

[data-theme="dark"] .step-card { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .step-card h3 { color: #F1F5F9 !important; }
[data-theme="dark"] .step-card p { color: #94A3B8 !important; }

[data-theme="dark"] .portfolio-card { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .portfolio-card__img { background: #243044; }
[data-theme="dark"] .portfolio-card__body h3 { color: #F1F5F9 !important; }
[data-theme="dark"] .portfolio-card__body p { color: #94A3B8 !important; }
[data-theme="dark"] .portfolio-card__cat { color: #818CF8; }

[data-theme="dark"] .review-card { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .review-card__text { color: #94A3B8 !important; }
[data-theme="dark"] .review-card__author strong { color: #F1F5F9; }
[data-theme="dark"] .review-card__author span { color: #64748B; }

[data-theme="dark"] .discount-card { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .discount-card h3 { color: #F1F5F9; }
[data-theme="dark"] .discount-card p { color: #94A3B8; }

[data-theme="dark"] .blog-card { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .blog-card h3 { color: #F1F5F9 !important; }
[data-theme="dark"] .blog-card p { color: #94A3B8 !important; }
[data-theme="dark"] .blog-card__meta { color: #64748B; }
[data-theme="dark"] .blog-card:hover h3 { color: #818CF8 !important; }

[data-theme="dark"] .calc-wrapper { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .calc-form { border-right-color: #334155; }
[data-theme="dark"] .calc-result { background: #243044; }
[data-theme="dark"] .calc-step-label { color: #E2E8F0; }
[data-theme="dark"] .calc-opt { background: #1E293B; border-color: #334155; color: #94A3B8; }
[data-theme="dark"] .calc-opt:hover { border-color: rgba(99,102,241,0.5); color: #818CF8; background: rgba(99,102,241,0.08); }
[data-theme="dark"] .calc-opt.active { background: #4F46E5; border-color: #4F46E5; color: white; }
[data-theme="dark"] .calc-breakdown { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .calc-row { border-bottom-color: #334155; }
[data-theme="dark"] .calc-row .lbl { color: #64748B; }
[data-theme="dark"] .calc-row .val { color: #E2E8F0; }
[data-theme="dark"] .form-input, [data-theme="dark"] .form-textarea, [data-theme="dark"] .form-select {
  background: #243044; border-color: #334155; color: #E2E8F0;
}
[data-theme="dark"] .form-input:focus, [data-theme="dark"] .form-textarea:focus { border-color: #818CF8; }

[data-theme="dark"] .auth-page { background: linear-gradient(135deg, rgba(99,102,241,0.07) 0%, #0F172A 50%, rgba(139,92,246,0.07) 100%); }
[data-theme="dark"] .auth-card { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .auth-title { color: #F1F5F9 !important; }
[data-theme="dark"] .auth-subtitle { color: #94A3B8 !important; }
[data-theme="dark"] .social-btn { background: #243044; border-color: #334155; color: #E2E8F0; }
[data-theme="dark"] .social-btn:hover { border-color: #818CF8; }
[data-theme="dark"] .form-label { color: #94A3B8; }
[data-theme="dark"] .form-divider { color: #475569; }
[data-theme="dark"] .form-divider::before, [data-theme="dark"] .form-divider::after { background: #334155; }
[data-theme="dark"] .auth-footer-text { color: #64748B; }

[data-theme="dark"] .dashboard-page { background: #0F172A; }
[data-theme="dark"] .dash-sidebar, [data-theme="dark"] .dash-card { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .dash-menu-item { color: #94A3B8; }
[data-theme="dark"] .dash-menu-item:hover, [data-theme="dark"] .dash-menu-item.active { background: rgba(99,102,241,0.12); color: #818CF8; }
[data-theme="dark"] .dash-name { color: #F1F5F9; }
[data-theme="dark"] .dash-email { color: #64748B; }
[data-theme="dark"] .dash-stat { background: #243044; }
[data-theme="dark"] .order-row { border-bottom-color: #334155; }
[data-theme="dark"] .dash-card h3 { color: #F1F5F9; }

[data-theme="dark"] .page-header { background: linear-gradient(135deg, rgba(99,102,241,0.08) 0%, #1E293B 60%, rgba(139,92,246,0.08) 100%); border-bottom-color: #334155; }
[data-theme="dark"] .page-header h1 { color: #F1F5F9 !important; }
[data-theme="dark"] .breadcrumb span { color: #64748B; }

[data-theme="dark"] .faq-item { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .faq-question { color: #E2E8F0; }
[data-theme="dark"] .faq-question:hover { background: #243044; }
[data-theme="dark"] .faq-item.open .faq-question { color: #818CF8; background: rgba(99,102,241,0.08); }
[data-theme="dark"] .faq-answer { color: #94A3B8; }

[data-theme="dark"] .plan-card { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .plan-card.popular { border-color: #6366F1; }

[data-theme="dark"] .contact-form { background: #1E293B; border-color: #334155; }

[data-theme="dark"] .article-wrapper h2, [data-theme="dark"] .article-wrapper h3 { color: #F1F5F9; }
[data-theme="dark"] .article-wrapper p, [data-theme="dark"] .article-wrapper li { color: #94A3B8; }
[data-theme="dark"] .article-wrapper blockquote { background: rgba(99,102,241,0.1); }

[data-theme="dark"] .legal-page h2 { color: #F1F5F9; }
[data-theme="dark"] .legal-page p, [data-theme="dark"] .legal-page li { color: #94A3B8; }

[data-theme="dark"] .modal { background: #1E293B; }
[data-theme="dark"] .modal-close { background: #243044; color: #94A3B8; }
[data-theme="dark"] .pay-amount-box { background: #243044; border-color: #334155; }
[data-theme="dark"] .pay-method { background: #243044; border-color: #334155; color: #94A3B8; }
[data-theme="dark"] .pay-method:hover, [data-theme="dark"] .pay-method.active { border-color: #818CF8; color: #818CF8; background: rgba(99,102,241,0.1); }
[data-theme="dark"] .yukassa-badge { background: #243044; border-color: #334155; color: #64748B; }

[data-theme="dark"] .back-to-top { background: #1E293B; border-color: #334155; color: #94A3B8; }
[data-theme="dark"] .cookie-bar { background: #1E293B; border-top-color: #334155; }
[data-theme="dark"] .cookie-bar p { color: #94A3B8; }

[data-theme="dark"] .filter-btn { background: #1E293B; border-color: #334155; color: #94A3B8; }
[data-theme="dark"] .filter-btn:hover, [data-theme="dark"] .filter-btn.active { background: #4F46E5; border-color: #4F46E5; color: white; }

[data-theme="dark"] .team-card, [data-theme="dark"] .value-card { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .team-name, [data-theme="dark"] .value-card h4 { color: #F1F5F9; }
[data-theme="dark"] .team-role { color: #818CF8; }
[data-theme="dark"] .team-skill { background: #243044; color: #64748B; }
[data-theme="dark"] .value-card p { color: #94A3B8; }

/* ===== THEME TOGGLE BUTTON ===== */
.theme-toggle {
  width: 38px; height: 38px;
  border-radius: 50%;
  border: 1.5px solid var(--border-color);
  background: var(--bg-secondary);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: 17px;
  transition: all 0.25s;
  flex-shrink: 0;
}
.theme-toggle:hover {
  border-color: var(--primary);
  background: rgba(99,102,241,0.08);
  transform: rotate(20deg);
}
[data-theme="dark"] .theme-toggle {
  background: #243044;
  border-color: #334155;
  color: #F1F5F9;
}

/* ===== MOBILE RESPONSIVENESS ===== */
@media (max-width: 768px) {
  /* Container */
  .container { padding: 0 16px; }

  /* Hero */
  .hero-home { padding: 48px 0 !important; min-height: auto; }
  .hero__inner { grid-template-columns: 1fr !important; gap: 32px !important; text-align: center; }
  .hero__visual { display: none; }
  .hero__headline { font-size: clamp(1.8rem, 6vw, 2.6rem) !important; }
  .hero__sub { font-size: 15px !important; margin: 0 auto 24px !important; }
  .hero__badge { margin: 0 auto 20px !important; }
  .hero__mini-stats { justify-content: center; gap: 20px; }
  .hero__buttons { justify-content: center; flex-direction: column; align-items: center; }
  .hero__buttons .btn { width: 100%; max-width: 300px; justify-content: center; }

  /* Sections */
  .section { padding: 48px 0; }
  .section-header { margin-bottom: 36px; }
  .section-header h2 { font-size: 1.6rem; }

  /* Grids collapse to 1 col */
  .services-grid { grid-template-columns: 1fr !important; }
  .stats-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .steps-grid { grid-template-columns: 1fr !important; }
  .portfolio-grid { grid-template-columns: 1fr !important; }
  .reviews-grid { grid-template-columns: 1fr !important; }
  .discounts-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .blog-grid { grid-template-columns: 1fr !important; }
  .plans-grid { grid-template-columns: 1fr !important; }
  .counters-grid { grid-template-columns: repeat(2, 1fr); }

  /* Trust bar */
  .trust-bar__grid { gap: 16px; justify-content: flex-start; padding: 0 16px; }
  .trust-item { flex: 0 0 calc(50% - 8px); }

  /* Ticker */
  .ticker-wrap { display: block; }

  /* Calculator */
  .calc-layout { grid-template-columns: 1fr !important; }
  .calc-form { border-right: none !important; border-bottom: 1px solid var(--border-color); padding: 24px 16px; }
  .calc-result { padding: 24px 16px; }
  .calc-pay-btns .calc-pay-full,
  .calc-pay-btns .calc-pay-advance { font-size: 13px; padding: 12px 14px; }

  /* Auth */
  .auth-card { padding: 28px 20px !important; }
  .auth-title { font-size: 20px; }

  /* Dashboard */
  .dashboard-grid { grid-template-columns: 1fr !important; }
  .dash-stats { grid-template-columns: 1fr !important; }

  /* Contact */
  .contact-grid { grid-template-columns: 1fr !important; gap: 32px; }

  /* Footer */
  .footer-grid { grid-template-columns: 1fr !important; gap: 28px !important; }

  /* Page header */
  .page-header h1 { font-size: 1.8rem !important; }
  .page-header { padding: 48px 0 36px; }

  /* CTA section */
  .cta-section__btns { flex-direction: column; align-items: center; }
  .cta-section__btns .btn,
  .cta-section__btns .btn-outline-white { width: 100%; max-width: 300px; justify-content: center; }

  /* Team / values */
  .team-grid { grid-template-columns: 1fr 1fr !important; }
  .values-grid { grid-template-columns: 1fr !important; }

  /* Buttons */
  .btn-lg { padding: 13px 22px; font-size: 14px; }

  /* Floating elements - reposition on mobile */
  .chat-fab { bottom: 80px; right: 16px; }
  .back-to-top { bottom: 140px; right: 16px; }
  .callback-fab { bottom: 16px; right: 16px; }

  /* Blog article */
  .article-wrapper { padding: 32px 16px; }
  .article-wrapper h2 { font-size: 1.4rem; }

  /* Discount cards */
  .discount-card { padding: 20px; }
  .discount-card__badge { font-size: 2.5rem; }
}

@media (max-width: 480px) {
  .discounts-grid { grid-template-columns: 1fr !important; }
  .trust-item { flex: 0 0 100%; }
  .hero__mini-stats { flex-direction: row; flex-wrap: wrap; }
  .stat-card { padding: 18px 12px; }
  .stat-card__num { font-size: 2rem; }
}

/* ===== CALLBACK BUTTON ===== */
.callback-fab {
  position: fixed;
  bottom: 24px;
  left: 24px;
  z-index: 900;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 20px;
  background: linear-gradient(135deg, #10B981, #059669);
  color: white;
  border: none;
  border-radius: 100px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 8px 30px rgba(16,185,129,0.4);
  transition: all 0.3s;
  font-family: inherit;
  text-decoration: none;
  white-space: nowrap;
}
.callback-fab:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 40px rgba(16,185,129,0.5);
  color: white !important;
}
.callback-fab .cb-icon { font-size: 18px; flex-shrink: 0; }
.callback-fab .cb-pulse {
  width: 8px; height: 8px; border-radius: 50%;
  background: white;
  animation: cbPulse 1.8s ease-in-out infinite;
  flex-shrink: 0;
}
@keyframes cbPulse {
  0%,100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(1.3); }
}
@media (max-width: 480px) {
  .callback-fab .cb-text { display: none; }
  .callback-fab { padding: 13px; border-radius: 50%; width: 48px; height: 48px; justify-content: center; left: 16px; bottom: 16px; }
}

/* Callback modal */
.callback-modal-overlay {
  position: fixed; inset: 0; z-index: 3000;
  background: rgba(15,23,42,0.6); backdrop-filter: blur(6px);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  opacity: 0; visibility: hidden; transition: all 0.3s;
}
.callback-modal-overlay.open { opacity: 1; visibility: visible; }
.callback-modal {
  background: white; border-radius: 20px;
  box-shadow: 0 30px 80px rgba(0,0,0,0.2);
  padding: 36px; width: 100%; max-width: 420px;
  transform: translateY(24px) scale(0.97);
  transition: all 0.3s; position: relative;
}
.callback-modal-overlay.open .callback-modal { transform: translateY(0) scale(1); }
.callback-modal-close {
  position: absolute; top: 16px; right: 16px;
  width: 30px; height: 30px; border-radius: 50%;
  background: #F1F5F9; border: none; cursor: pointer;
  font-size: 14px; color: #64748B;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.2s;
}
.callback-modal-close:hover { background: #E2E8F0; }
.callback-modal h3 { font-size: 20px; font-weight: 800; margin-bottom: 6px; color: #0F172A; }
.callback-modal p { font-size: 14px; color: #64748B; margin-bottom: 24px; }
.callback-form { display: flex; flex-direction: column; gap: 14px; }
.callback-success {
  text-align: center; padding: 20px 0;
  display: none;
}
.callback-success .cb-ok { font-size: 48px; margin-bottom: 12px; }
.callback-success h4 { font-size: 18px; font-weight: 700; color: #0F172A; margin-bottom: 8px; }
.callback-success p { font-size: 14px; color: #64748B; }
[data-theme="dark"] .callback-modal { background: #1E293B; }
[data-theme="dark"] .callback-modal h3 { color: #F1F5F9; }
[data-theme="dark"] .callback-modal p { color: #94A3B8; }
[data-theme="dark"] .callback-modal-close { background: #243044; color: #94A3B8; }
[data-theme="dark"] .callback-success h4 { color: #F1F5F9; }

/* ===== CHAT WIDGET ===== */
.chat-widget {
  position: fixed; bottom: 90px; right: 24px; z-index: 1000;
  width: 360px;
  background: white;
  border-radius: 20px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.2);
  border: 1px solid var(--border-color);
  display: flex; flex-direction: column;
  overflow: hidden;
  transform: translateY(20px) scale(0.95);
  opacity: 0; visibility: hidden;
  transition: all 0.3s cubic-bezier(0.34,1.56,0.64,1);
}
.chat-widget.open {
  transform: translateY(0) scale(1);
  opacity: 1; visibility: visible;
}
.chat-header {
  background: linear-gradient(135deg, var(--primary), #8B5CF6);
  padding: 16px 18px;
  display: flex; align-items: center; gap: 12px;
}
.chat-header-avatar {
  width: 40px; height: 40px; border-radius: 50%;
  background: rgba(255,255,255,0.2);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; flex-shrink: 0;
}
.chat-header-info { flex: 1; }
.chat-header-name { font-size: 14px; font-weight: 700; color: white; }
.chat-header-status { font-size: 12px; color: rgba(255,255,255,0.8); display: flex; align-items: center; gap: 5px; }
.chat-online-dot { width: 6px; height: 6px; border-radius: 50%; background: #4ADE80; animation: onlinePulse 2s infinite; }
.chat-header-close { background: rgba(255,255,255,0.15); border: none; border-radius: 50%; width: 28px; height: 28px; cursor: pointer; color: white; font-size: 14px; display: flex; align-items: center; justify-content: center; transition: all 0.2s; }
.chat-header-close:hover { background: rgba(255,255,255,0.25); }
.chat-messages { height: 320px; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 12px; scroll-behavior: smooth; }
.chat-messages::-webkit-scrollbar { width: 4px; }
.chat-messages::-webkit-scrollbar-thumb { background: var(--border-color); border-radius: 4px; }
.chat-msg { display: flex; gap: 8px; max-width: 85%; }
.chat-msg.user { align-self: flex-end; flex-direction: row-reverse; }
.chat-msg-avatar { width: 28px; height: 28px; border-radius: 50%; background: linear-gradient(135deg, var(--primary), #8B5CF6); display: flex; align-items: center; justify-content: center; font-size: 12px; color: white; flex-shrink: 0; margin-top: auto; }
.chat-msg.user .chat-msg-avatar { background: linear-gradient(135deg, #10B981, #059669); }
.chat-bubble { padding: 10px 14px; border-radius: 14px; font-size: 13px; line-height: 1.5; }
.chat-msg:not(.user) .chat-bubble { background: var(--bg-secondary); color: var(--text-primary); border-radius: 4px 14px 14px 14px; }
.chat-msg.user .chat-bubble { background: linear-gradient(135deg, var(--primary), #8B5CF6); color: white; border-radius: 14px 4px 14px 14px; }
.chat-msg-time { font-size: 10px; color: var(--text-tertiary); margin-top: 4px; text-align: right; }
.chat-msg.user .chat-msg-time { text-align: left; }
.chat-msg-file { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: rgba(255,255,255,0.15); border-radius: 8px; font-size: 12px; font-weight: 600; cursor: pointer; }
.chat-typing { display: flex; gap: 4px; align-items: center; padding: 10px 14px; background: var(--bg-secondary); border-radius: 4px 14px 14px 14px; width: fit-content; }
.chat-typing span { width: 6px; height: 6px; border-radius: 50%; background: var(--text-tertiary); animation: typingDot 1.4s ease-in-out infinite; }
.chat-typing span:nth-child(2) { animation-delay: 0.2s; }
.chat-typing span:nth-child(3) { animation-delay: 0.4s; }
@keyframes typingDot { 0%,100%{transform:translateY(0);opacity:0.5} 50%{transform:translateY(-4px);opacity:1} }
.chat-input-area { padding: 12px 14px; border-top: 1px solid var(--border-color); }
.chat-input-row { display: flex; gap: 8px; align-items: flex-end; }
.chat-input {
  flex: 1; padding: 10px 14px;
  border: 1.5px solid var(--border-color); border-radius: 100px;
  background: var(--bg-secondary); color: var(--text-primary);
  font-size: 13px; font-family: inherit;
  outline: none; transition: border-color 0.2s;
  resize: none; max-height: 100px; overflow-y: auto;
}
.chat-input:focus { border-color: var(--primary); }
.chat-send-btn, .chat-attach-btn {
  width: 36px; height: 36px; border-radius: 50%;
  border: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; transition: all 0.2s; flex-shrink: 0;
}
.chat-send-btn { background: linear-gradient(135deg, var(--primary), #8B5CF6); color: white; }
.chat-send-btn:hover { transform: scale(1.1); box-shadow: 0 4px 14px rgba(99,102,241,0.4); }
.chat-attach-btn { background: var(--bg-secondary); color: var(--text-secondary); border: 1.5px solid var(--border-color); }
.chat-attach-btn:hover { border-color: var(--primary); color: var(--primary); }
.chat-file-preview { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.chat-file-chip { display: flex; align-items: center; gap: 5px; padding: 4px 10px; background: rgba(99,102,241,0.1); border: 1px solid rgba(99,102,241,0.2); border-radius: 100px; font-size: 11px; color: var(--primary); font-weight: 600; }
.chat-file-chip button { background: none; border: none; cursor: pointer; color: var(--primary); font-size: 12px; padding: 0; line-height: 1; }
.chat-welcome { text-align: center; padding: 20px; }
.chat-welcome-icon { font-size: 40px; margin-bottom: 10px; }
.chat-welcome h4 { font-size: 15px; font-weight: 700; margin-bottom: 6px; color: var(--text-primary); }
.chat-welcome p { font-size: 12px; color: var(--text-secondary); margin-bottom: 14px; }
.chat-quick-btns { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; }
.chat-quick-btn { padding: 6px 12px; border: 1.5px solid var(--border-color); border-radius: 100px; background: white; font-size: 11px; font-weight: 600; color: var(--text-secondary); cursor: pointer; transition: all 0.15s; font-family: inherit; }
.chat-quick-btn:hover { border-color: var(--primary); color: var(--primary); }
[data-theme="dark"] .chat-widget { background: #1E293B; border-color: #334155; }
[data-theme="dark"] .chat-msg:not(.user) .chat-bubble { background: #243044; color: #E2E8F0; }
[data-theme="dark"] .chat-input-area { border-top-color: #334155; }
[data-theme="dark"] .chat-input { background: #243044; border-color: #334155; color: #E2E8F0; }
[data-theme="dark"] .chat-attach-btn { background: #243044; border-color: #334155; color: #94A3B8; }
[data-theme="dark"] .chat-typing { background: #243044; }
[data-theme="dark"] .chat-quick-btn { background: #243044; border-color: #334155; color: #94A3B8; }
[data-theme="dark"] .chat-welcome h4 { color: #F1F5F9; }
[data-theme="dark"] .chat-welcome p { color: #64748B; }
@media (max-width: 480px) {
  .chat-widget { width: calc(100vw - 32px); right: 16px; bottom: 80px; }
  .chat-messages { height: 260px; }
}

/* ===== CHAT FAB ACTIVE STATE ===== */
.chat-fab.active { background: linear-gradient(135deg, #EF4444, #DC2626); }