/* Dedicated app styling, independent of the hosted website. */
body.theme-light {
  --text-primary: #201a34;
  --text-muted: #777187;
  --font-display: 'Inter', system-ui, sans-serif;
  background: #f7f5fb;
  color: var(--text-primary);
  -webkit-font-smoothing: antialiased;
}
body.theme-light .screen { background-color: #f7f5fb !important; }
body.theme-light h2, body.theme-light h3 { letter-spacing: -.035em; }
body.theme-light .header { background: #fff; border-bottom: 1px solid #eee9f5; box-shadow: 0 4px 24px #29134b08; }
body.theme-light .bottom-nav { background: #ffffffed; backdrop-filter: blur(18px); border-top: 1px solid #ece6f4; box-shadow: 0 -8px 30px #29134b07; }
body.theme-light .nav-item.active { color: #6731ba; }
body.theme-light .search-bar { background: #f5f2fa; border: 1px solid #e9e2f2; border-radius: 16px; }
body.theme-light .product-card, body.theme-light .real-product,
body.theme-light .order-card-new, body.theme-light .settings-list {
  background: #fff; border: 1px solid #ece7f3; border-radius: 20px;
  box-shadow: 0 5px 18px #29134b05;
}
body.theme-light .product-card img, body.theme-light .real-product img { border-radius: 16px; }
body.theme-light .section-title { margin-bottom: 16px; }
body.theme-light .section-title h3 { font-size: 21px; font-weight: 750; }
body.theme-light .section-title button { color: #6731ba; font-weight: 650; }
body.theme-light .primary, body.theme-light .detail-buy-btn,
body.theme-light .checkout-btn, body.theme-light .login-btn {
  background: linear-gradient(135deg, #773ed0, #53249a); color: #fff;
  border: 0; border-radius: 15px; box-shadow: 0 6px 16px #6731ba20;
}
body.theme-light .detail-add-btn { border-radius: 15px; border-color: #daceea; }
body.theme-light .real-review { border: 1px solid #eee8f5; border-radius: 16px; background: #fff; padding: 16px; }
body.theme-light .detail-desc { line-height: 1.75; color: #71697f; }
body.theme-light input, body.theme-light select { font-family: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible { outline: 3px solid #c7a8f0; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }
