@charset "UTF-8";
/* HostsPilot — Light Theme */

/* Theme Switcher */
.theme-switcher {
  display: flex;
  align-items: center;
  gap: 2px;
  background: rgba(255,255,255,0.05);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 3px;
}
.theme-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  background: transparent;
  border: none;
  border-radius: 7px;
  padding: 5px 9px;
  cursor: pointer;
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-muted);
  transition: var(--transition);
  white-space: nowrap;
}
.theme-btn:hover { color: var(--text-primary); background: rgba(255,255,255,0.07); }
.theme-btn.active { background: rgba(14,165,233,0.15); color: var(--blue); }
.theme-code { letter-spacing: 0.03em; }
@media (max-width: 1024px) { .theme-code { display: none; } }
@media (max-width: 768px) { .theme-switcher { display: none; } }

/* Light theme variables */
[data-theme="light"] {
  --bg-dark:    #F0F4F8;
  --bg-card:    #FFFFFF;
  --bg-card2:   #EBF0F7;
  --border:     rgba(15,23,42,0.09);
  --border-glow: rgba(14,165,233,0.35);
  --text-primary:   #0F172A;
  --text-secondary: #334155;
  --text-muted:     #64748B;
  --shadow-sm:  0 2px 8px rgba(15,23,42,0.08);
  --shadow-md:  0 8px 32px rgba(15,23,42,0.10);
  --shadow-lg:  0 24px 64px rgba(15,23,42,0.12);
  --shadow-glow: 0 0 40px rgba(14,165,233,0.10);
}

/* Header */
[data-theme="light"] .header.scrolled {
  background: rgba(240,244,248,0.92);
  border-bottom-color: rgba(15,23,42,0.08);
}
[data-theme="light"] .header:not(.scrolled) {
  background: rgba(240,244,248,0.5);
}

/* Nav */
[data-theme="light"] .nav-link { color: #475569; }
[data-theme="light"] .nav-link:hover { color: #0F172A; background: rgba(15,23,42,0.05); }
[data-theme="light"] .btn-text { color: #475569; }

/* Switchers */
[data-theme="light"] .lang-switcher,
[data-theme="light"] .theme-switcher {
  background: rgba(15,23,42,0.04);
  border-color: rgba(15,23,42,0.1);
}
[data-theme="light"] .lang-btn,
[data-theme="light"] .theme-btn { color: #64748B; }
[data-theme="light"] .lang-btn:hover,
[data-theme="light"] .theme-btn:hover { background: rgba(15,23,42,0.06); color: #0F172A; }
[data-theme="light"] .lang-btn.active,
[data-theme="light"] .theme-btn.active { background: rgba(14,165,233,0.12); color: #0EA5E9; }

/* Buttons */
[data-theme="light"] .btn-outline { border-color: rgba(15,23,42,0.15); color: #0F172A; }
[data-theme="light"] .btn-outline:hover { border-color: rgba(14,165,233,0.5); background: rgba(14,165,233,0.06); color: #0EA5E9; }
[data-theme="light"] .btn-ghost { background: rgba(15,23,42,0.07); border-color: rgba(15,23,42,0.12); color: #0F172A; }
[data-theme="light"] .btn-ghost:hover { background: rgba(15,23,42,0.1); }
[data-theme="light"] .btn-primary.btn-white { background: #0F172A; color: #FFFFFF; }
[data-theme="light"] .btn-primary.btn-white:hover { box-shadow: 0 8px 24px rgba(15,23,42,0.25); }

/* Hero */
[data-theme="light"] .hero-subtitle { color: #475569; }
[data-theme="light"] .hero-orb-1 { background: radial-gradient(circle, rgba(14,165,233,0.1), transparent 70%); }
[data-theme="light"] .hero-orb-2 { background: radial-gradient(circle, rgba(99,102,241,0.08), transparent 70%); }
[data-theme="light"] .hero-orb-3 { background: radial-gradient(circle, rgba(14,165,233,0.06), transparent 70%); }

/* Dashboard mockup */
[data-theme="light"] .dashboard-mockup {
  border-color: rgba(15,23,42,0.12);
  box-shadow: 0 24px 64px rgba(15,23,42,0.12);
}
[data-theme="light"] .mockup-header,
[data-theme="light"] .mockup-sidebar { background: #F8FAFC; border-color: rgba(15,23,42,0.08); }
[data-theme="light"] .sidebar-item { color: #94A3B8; }
[data-theme="light"] .sidebar-item.active { background: rgba(14,165,233,0.1); color: #0EA5E9; }
[data-theme="light"] .mockup-stat-card,
[data-theme="light"] .mockup-calendar { background: #F8FAFC; border-color: rgba(15,23,42,0.08); }
[data-theme="light"] .cal-blocks { background: rgba(15,23,42,0.04); }

/* Logos */
[data-theme="light"] .logos-bar { background: rgba(15,23,42,0.02); border-color: rgba(15,23,42,0.07); }
[data-theme="light"] .logos-label { color: #94A3B8; }
[data-theme="light"] .partner-logo { color: #94A3B8; }

/* Features tabs */
[data-theme="light"] .features-tabs { background: #FFFFFF; border-color: rgba(15,23,42,0.1); }
[data-theme="light"] .tab-nav { background: rgba(15,23,42,0.02); border-color: rgba(15,23,42,0.08); }
[data-theme="light"] .tab-btn { color: #64748B; }
[data-theme="light"] .tab-btn:hover { background: rgba(15,23,42,0.05); color: #0F172A; }
[data-theme="light"] .tab-btn.active { background: rgba(14,165,233,0.1); color: #0EA5E9; }
[data-theme="light"] .panel-content h3 { color: #0F172A; }
[data-theme="light"] .panel-content > p { color: #475569; }
[data-theme="light"] .feature-list li { color: #475569; }
[data-theme="light"] .panel-visual { background: rgba(15,23,42,0.02); border-color: rgba(15,23,42,0.08); }
[data-theme="light"] .task-item { background: #F1F5F9; border-color: rgba(15,23,42,0.08); }
[data-theme="light"] .task-name { color: #475569; }
[data-theme="light"] .mini-calendar,
[data-theme="light"] .chart-mock { background: #FFFFFF; }
[data-theme="light"] .chart-bar { background: rgba(14,165,233,0.15); }
[data-theme="light"] .cs-item { color: #475569; }
[data-theme="light"] .cs-item strong { color: #0F172A; }
[data-theme="light"] .am-metric { border-color: rgba(15,23,42,0.08); }
[data-theme="light"] .am-label { color: #64748B; }
[data-theme="light"] .am-val { color: #0F172A; }
[data-theme="light"] .lock-code { background: rgba(14,165,233,0.06); border-color: rgba(14,165,233,0.15); }

/* How it works */
[data-theme="light"] .step-card { background: #FFFFFF; border-color: rgba(15,23,42,0.1); }
[data-theme="light"] .step-card h3 { color: #0F172A; }
[data-theme="light"] .step-card p { color: #475569; }
[data-theme="light"] .step-icon { background: rgba(14,165,233,0.08); border-color: rgba(14,165,233,0.12); color: #0EA5E9; }

/* Tiers */
[data-theme="light"] .tier-card { background: #FFFFFF; border-color: rgba(15,23,42,0.1); }
[data-theme="light"] .tier-card.popular { border-color: rgba(14,165,233,0.35); background: linear-gradient(160deg, rgba(14,165,233,0.05), rgba(99,102,241,0.03)); }
[data-theme="light"] .tier-card h3 { color: #0F172A; }
[data-theme="light"] .tier-range { color: #64748B; }
[data-theme="light"] .tier-desc { color: #475569; }
[data-theme="light"] .tier-features li { color: #475569; }

/* Pricing */
[data-theme="light"] .price-card { background: #FFFFFF; border-color: rgba(15,23,42,0.1); }
[data-theme="light"] .price-card.featured { border-color: rgba(14,165,233,0.35); background: linear-gradient(160deg, rgba(14,165,233,0.05), rgba(99,102,241,0.03)); }
[data-theme="light"] .price-card h4 { color: #0F172A; }
[data-theme="light"] .price-amount { color: #0F172A; }
[data-theme="light"] .price-period { color: #64748B; }
[data-theme="light"] .price-note,
[data-theme="light"] .pricing-footer-note { color: #94A3B8; }
[data-theme="light"] .toggle-label { color: #94A3B8; }
[data-theme="light"] .toggle-label.active { color: #0F172A; }
[data-theme="light"] .toggle-switch { background: #E2E8F0; border-color: rgba(15,23,42,0.12); }

/* Tools */
[data-theme="light"] .tool-card { background: #FFFFFF; border-color: rgba(15,23,42,0.1); }
[data-theme="light"] .tool-card h4 { color: #0F172A; }
[data-theme="light"] .tool-card p { color: #475569; }

/* Testimonials */
[data-theme="light"] .testimonial-card { background: #FFFFFF; border-color: rgba(15,23,42,0.1); }
[data-theme="light"] .testimonial-quote p { color: #475569; }
[data-theme="light"] .author-info strong { color: #0F172A; }
[data-theme="light"] .author-info span { color: #94A3B8; }

/* OTA */
[data-theme="light"] .ota-200-badge { background: rgba(14,165,233,0.06); border-color: rgba(14,165,233,0.18); }
[data-theme="light"] .ota-col-card { background: #FFFFFF; border-color: rgba(15,23,42,0.1); }
[data-theme="light"] .ota-col-header { background: rgba(15,23,42,0.02); border-color: rgba(15,23,42,0.08); }
[data-theme="light"] .ota-col-title { color: #64748B; }
[data-theme="light"] .ota-row:hover { background: rgba(15,23,42,0.03); }
[data-theme="light"] .ota-row.featured { background: rgba(14,165,233,0.04); }
[data-theme="light"] .ota-row.key { background: rgba(14,165,233,0.05); }
[data-theme="light"] .ota-row-name { color: #475569; }
[data-theme="light"] .ota-row.featured .ota-row-name,
[data-theme="light"] .ota-row.key .ota-row-name { color: #0F172A; }
[data-theme="light"] .ota-divider,
[data-theme="light"] .ota-region-sep { background: rgba(15,23,42,0.07); }
[data-theme="light"] .ota-region-name { color: #0F172A; }
[data-theme="light"] .ota-region-count { color: #94A3B8; }
[data-theme="light"] .ota-region-footnote { background: rgba(15,23,42,0.02); border-color: rgba(14,165,233,0.2); color: #64748B; }
[data-theme="light"] .ota-row.tech-row .ota-row-name { color: #0F172A; }
[data-theme="light"] .ota-tech-desc { color: #64748B; }

/* Platform caps */
[data-theme="light"] .caps-card { background: #FFFFFF; border-color: rgba(15,23,42,0.1); }
[data-theme="light"] .caps-header { border-color: rgba(15,23,42,0.08); }
[data-theme="light"] .caps-title { color: #0F172A; }
[data-theme="light"] .caps-sub { color: #64748B; }
[data-theme="light"] .caps-feat-name { color: #0F172A; }
[data-theme="light"] .caps-feat-desc { color: #64748B; }
[data-theme="light"] .caps-feature { border-color: rgba(14,165,233,0.15); }

/* Why */
[data-theme="light"] .why-card { background: #FFFFFF; border-color: rgba(15,23,42,0.1); }
[data-theme="light"] .why-label { color: #0F172A; }
[data-theme="light"] .why-card p { color: #64748B; }

/* Comparison */
[data-theme="light"] .comparison-table-wrap { border-color: rgba(15,23,42,0.1); }
[data-theme="light"] .comparison-table { background: #FFFFFF; }
[data-theme="light"] .comparison-table th { background: rgba(15,23,42,0.03); color: #64748B; }
[data-theme="light"] .comparison-table td { color: #475569; border-color: rgba(15,23,42,0.07); }
[data-theme="light"] .comparison-table tr:hover td { background: rgba(15,23,42,0.02); }
[data-theme="light"] .highlight-col { background: rgba(14,165,233,0.05) !important; border-color: rgba(14,165,233,0.25) !important; }

/* Blog */
[data-theme="light"] .blog-card { background: #FFFFFF; border-color: rgba(15,23,42,0.1); }
[data-theme="light"] .bc-cover-1 { background: linear-gradient(135deg, rgba(14,165,233,0.08), rgba(99,102,241,0.12)); border-color: rgba(14,165,233,0.1); }
[data-theme="light"] .bc-cover-2 { background: linear-gradient(135deg, rgba(16,185,129,0.07), rgba(14,165,233,0.1)); border-color: rgba(16,185,129,0.1); }
[data-theme="light"] .blog-card-title { color: #0F172A; }
[data-theme="light"] .blog-card-desc { color: #64748B; }
[data-theme="light"] .blog-card-footer { border-color: rgba(15,23,42,0.08); }
[data-theme="light"] .bc-read { color: #94A3B8; }

/* CTA */
[data-theme="light"] .cta-card { background: linear-gradient(135deg, rgba(14,165,233,0.07), rgba(99,102,241,0.07)); border-color: rgba(14,165,233,0.2); }
[data-theme="light"] .cta-card h2 { color: #0F172A; }
[data-theme="light"] .cta-card p { color: #475569; }
[data-theme="light"] .cta-note { color: #94A3B8; }

/* Footer */
[data-theme="light"] .footer { background: rgba(15,23,42,0.03); border-color: rgba(15,23,42,0.08); }
[data-theme="light"] .footer-tagline { color: #64748B; }
[data-theme="light"] .footer-col a { color: #64748B; }
[data-theme="light"] .footer-col a:hover { color: #0EA5E9; }
[data-theme="light"] .footer-col h5 { color: #0F172A; }
[data-theme="light"] .footer-social a { background: #FFFFFF; border-color: rgba(15,23,42,0.1); color: #64748B; }
[data-theme="light"] .footer-bottom { border-color: rgba(15,23,42,0.08); color: #94A3B8; }

/* Modal */
[data-theme="light"] .modal-overlay { background: rgba(15,23,42,0.5); }
[data-theme="light"] .modal-card { background: #FFFFFF; border-color: rgba(14,165,233,0.2); }
[data-theme="light"] .modal-close { background: rgba(15,23,42,0.05); border-color: rgba(15,23,42,0.1); color: #64748B; }
[data-theme="light"] .modal-close:hover { background: rgba(15,23,42,0.08); color: #0F172A; }
[data-theme="light"] .modal-header { border-color: rgba(15,23,42,0.08); }
[data-theme="light"] .modal-title { color: #0F172A; }
[data-theme="light"] .modal-sub { color: #64748B; }
[data-theme="light"] .form-group label { color: #475569; }
[data-theme="light"] .form-group input,
[data-theme="light"] .form-group select { background: #F8FAFC; border-color: rgba(15,23,42,0.12); color: #0F172A; }
[data-theme="light"] .form-group input::placeholder { color: #94A3B8; }
[data-theme="light"] .form-group input:focus,
[data-theme="light"] .form-group select:focus { border-color: rgba(14,165,233,0.5); background: #FFFFFF; }
[data-theme="light"] .form-group select option { background: #FFFFFF; color: #0F172A; }

/* Chat */
[data-theme="light"] .hp-chat-window { background: #FFFFFF; border-color: rgba(14,165,233,0.2); }
[data-theme="light"] .hp-chat-header { background: linear-gradient(135deg, rgba(14,165,233,0.08), rgba(99,102,241,0.06)); border-color: rgba(15,23,42,0.08); }
[data-theme="light"] .hp-chat-header-name { color: #0F172A; }
[data-theme="light"] .hp-chat-close { background: rgba(15,23,42,0.05); color: #64748B; }
[data-theme="light"] .hp-msg.agent .hp-msg-bubble { background: #F1F5F9; border-color: rgba(15,23,42,0.08); color: #334155; }
[data-theme="light"] .hp-msg.agent .hp-msg-bubble strong { color: #0F172A; }
[data-theme="light"] .hp-chat-input-row { background: rgba(15,23,42,0.02); border-color: rgba(15,23,42,0.07); }
[data-theme="light"] .hp-chat-input { background: #F8FAFC; border-color: rgba(15,23,42,0.12); color: #0F172A; }
[data-theme="light"] .hp-chat-input::placeholder { color: #94A3B8; }
[data-theme="light"] .hp-quick-btn { background: rgba(14,165,233,0.06); border-color: rgba(14,165,233,0.15); color: #0EA5E9; }
[data-theme="light"] .hp-welcome-banner { background: #FFFFFF; border-color: rgba(14,165,233,0.25); }
[data-theme="light"] .hp-welcome-banner p { color: #64748B; }
[data-theme="light"] .hp-welcome-banner strong { color: #0F172A; }

/* Misc */
[data-theme="light"] .section-tag { background: rgba(14,165,233,0.08); border-color: rgba(14,165,233,0.18); }
[data-theme="light"] .section-desc { color: #475569; }
[data-theme="light"] .author-website { color: #14B8A6; }
