/* ELIXR React concept theme preview. Loaded after concept-public.css. */
:root {
  --theme-bg: #000;
  --theme-panel: #0a0a0a;
  --theme-panel-2: #111113;
  --theme-line: #262626;
  --theme-line-strong: #404040;
  --theme-text: #fff;
  --theme-muted: #a3a3a3;
  --theme-soft: #737373;
  --theme-purple: #a855f7;
  --theme-indigo: #6366f1;
  --theme-pink: #ec4899;
  --theme-green: #34d399;
  --theme-container: min(100% - 48px, 1152px);
}
@keyframes theme-bar-flow { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
@keyframes theme-border-flow { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
html, body { background: var(--theme-bg) !important; color: var(--theme-text) !important; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important; letter-spacing: 0 !important; }
body { min-height: 100vh; }
body::before, .concept-home-page::before { display: none !important; }
body::after { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(circle at 18% 10%, rgba(168, 85, 247, 0.14), transparent 30%), radial-gradient(circle at 82% 18%, rgba(99, 102, 241, 0.09), transparent 28%), #000; }
.concept-navbar { height: auto !important; min-height: 68px !important; border-bottom: 1px solid var(--theme-line) !important; background: rgba(0, 0, 0, 0.74) !important; backdrop-filter: blur(16px) !important; }
.concept-navbar::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, var(--theme-purple), var(--theme-indigo), var(--theme-pink), var(--theme-purple)); background-size: 300% 100%; animation: theme-bar-flow 6s ease-in-out infinite; }
.concept-nav-inner { width: var(--theme-container) !important; height: auto !important; min-height: 68px !important; padding-top: 4px !important; grid-template-columns: 170px minmax(0, 1fr) 170px !important; }
.concept-brand { gap: 10px !important; color: var(--theme-text) !important; font-size: 18px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: 0 !important; text-transform: lowercase !important; }
.concept-brand::after { content: "elixr"; }
.concept-brand img { width: 36px !important; height: 36px !important; object-fit: contain !important; filter: drop-shadow(0 0 10px rgba(168, 85, 247, 0.45)); }
.concept-nav-links { gap: clamp(22px, 4vw, 42px) !important; }
.concept-nav-links a { color: var(--theme-muted) !important; font-size: 14px !important; font-weight: 700 !important; }
.concept-nav-links a:hover, .concept-nav-links a.active { color: #c084fc !important; }
.concept-nav-links a.active::after { height: 2px !important; background: var(--theme-purple) !important; box-shadow: none !important; }
.concept-login { min-width: 112px !important; height: auto !important; min-height: 38px !important; border: 1px solid var(--theme-line-strong) !important; border-radius: 999px !important; background: transparent !important; box-shadow: none !important; color: var(--theme-text) !important; font-size: 14px !important; font-weight: 800 !important; }
.concept-login:hover { border-color: rgba(168, 85, 247, 0.8) !important; background: rgba(168, 85, 247, 0.1) !important; }
.concept-main, .page > main, .download-only-main, .simple-auth-main, .simple-support-main, .showcase-main, .shop-preview-main { width: var(--theme-container) !important; margin: 0 auto !important; padding: 48px 0 72px !important; }
.concept-home-page .concept-main { min-height: auto !important; display: grid !important; gap: 40px !important; overflow: visible !important; }
.concept-hero { position: relative !important; min-height: 420px !important; display: grid !important; align-content: center !important; justify-items: start !important; gap: 0 !important; overflow: hidden !important; padding: clamp(34px, 6vw, 56px) !important; border: 1px solid var(--theme-line) !important; border-radius: 16px !important; background: radial-gradient(circle at 20% 20%, rgba(168, 85, 247, 0.16), transparent 45%), linear-gradient(135deg, rgba(88, 28, 135, 0.42), rgba(0, 0, 0, 0.96) 48%, #000) !important; box-shadow: 0 24px 70px rgba(0, 0, 0, 0.42) !important; text-align: left !important; }
.concept-title { position: relative !important; z-index: 1 !important; margin: 0 !important; color: var(--theme-text) !important; font-size: clamp(54px, 9vw, 96px) !important; font-weight: 900 !important; line-height: 0.92 !important; letter-spacing: 0 !important; text-transform: lowercase !important; text-shadow: none !important; }
.concept-title strong { color: #c084fc !important; }
.concept-hero p { position: relative !important; z-index: 1 !important; display: block !important; margin: 14px 0 0 !important; color: var(--theme-muted) !important; font-size: 14px !important; font-weight: 800 !important; letter-spacing: 0.22em !important; text-transform: uppercase !important; }
.concept-hero-actions { position: relative !important; z-index: 1 !important; display: flex !important; flex-wrap: wrap !important; gap: 14px !important; margin-top: 32px !important; }
.concept-hero-button, .btn, .download-button, button[type="submit"], .shop-button { min-height: 44px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; padding: 0 18px !important; border-radius: 8px !important; font-size: 14px !important; font-weight: 850 !important; transition: filter 160ms ease, border-color 160ms ease, background 160ms ease !important; }
.concept-hero-button.primary, .btn, .download-button.primary, button[type="submit"], .shop-button.primary { border: 1px solid rgba(255, 255, 255, 0.08) !important; background: linear-gradient(135deg, var(--theme-purple), var(--theme-indigo)) !important; color: #fff !important; box-shadow: 0 16px 36px rgba(116, 71, 232, 0.24) !important; }
.concept-hero-button.secondary, .download-button:not(.primary), .btn-secondary, .shop-button.secondary { border: 1px solid rgba(168, 85, 247, 0.66) !important; background: rgba(168, 85, 247, 0.08) !important; color: #d8b4fe !important; }
.concept-hero-button:hover, .btn:hover, .download-button:hover, .shop-button:hover, button[type="submit"]:hover { filter: brightness(1.08); }
.concept-wave { display: none !important; }
.theme-grid, .theme-feature-grid, .theme-shop-grid, .download-grid, .form-grid { display: grid !important; gap: 20px !important; }
.theme-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.theme-feature-grid, .theme-shop-grid, .download-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
.theme-card, .theme-feature-card, .theme-shop-card, .download-card, .login-card, .support-card, .card, .public-product-card, .products-status, .products-toolbar, .showcase-feature, .showcase-thumb { border: 1px solid var(--theme-line) !important; border-radius: 12px !important; background: var(--theme-panel) !important; box-shadow: none !important; }
.theme-card { min-height: 136px; display: grid; place-items: center; gap: 10px; padding: 20px; color: var(--theme-muted); font-size: 13px; font-weight: 750; text-align: center; }
.theme-card:hover, .theme-inside-item:hover { border-color: rgba(168, 85, 247, 0.56) !important; background: var(--theme-panel-2) !important; }
.theme-icon, .icon-tile, .shop-icon { width: 40px !important; height: 40px !important; display: grid !important; place-items: center !important; border: 1px solid rgba(168, 85, 247, 0.32) !important; border-radius: 8px !important; background: rgba(168, 85, 247, 0.1) !important; color: #c084fc !important; }
.theme-feature-card, .theme-shop-card, .download-card, .login-card, .support-card, .card { padding: 24px !important; }
.theme-feature-card h2, .theme-shop-card h2, .download-card h3, .login-card h2, .support-card h2, .card h2 { margin: 14px 0 8px !important; color: var(--theme-text) !important; font-size: 19px !important; line-height: 1.2 !important; font-weight: 850 !important; }
.theme-feature-card p, .theme-shop-card p, .download-card p, .login-card > p, .support-card > p, .card > p, .subtitle, .note { display: block !important; color: var(--theme-muted) !important; font-size: 14px !important; line-height: 1.65 !important; }
.theme-section-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.theme-kicker, .kicker { display: inline-flex !important; color: #c084fc !important; font-size: 12px !important; font-weight: 900 !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; }
.theme-count { color: #525252; font-size: 12px; font-weight: 700; }
.theme-inside-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.theme-inside-item { min-height: 82px; display: grid; place-items: center; padding: 12px 10px; border: 1px solid var(--theme-line); border-radius: 8px; background: var(--theme-panel); color: var(--theme-muted); font-size: 12px; font-weight: 650; text-align: center; }
input, select, textarea { border-color: var(--theme-line-strong) !important; border-radius: 8px !important; background: #000 !important; }
input:focus, select:focus, textarea:focus { border-color: rgba(168, 85, 247, 0.82) !important; box-shadow: 0 0 0 3px rgba(168, 85, 247, 0.14) !important; }
.showcase-main { width: min(100% - 48px, 1024px) !important; }
.showcase-feature-wrap { padding: 4px; border-radius: 16px; background: linear-gradient(90deg, var(--theme-purple), var(--theme-indigo), var(--theme-pink), var(--theme-purple)); background-size: 300% 100%; animation: theme-border-flow 6s ease-in-out infinite; }
.showcase-grid { gap: 20px !important; }
.shop-preview-main { display: grid; gap: 34px; }
.shop-preview-intro { max-width: 560px; margin: 0 auto; text-align: center; }
.shop-preview-intro h1 { margin: 12px 0 10px; font-size: clamp(30px, 5vw, 42px); line-height: 1.05; font-weight: 900; }
.shop-preview-intro p { margin: 0; color: var(--theme-muted); font-size: 14px; line-height: 1.65; }
.theme-shop-card { position: relative; display: flex; flex-direction: column; }
.theme-shop-card.popular { border-color: rgba(168, 85, 247, 0.82) !important; background: linear-gradient(180deg, rgba(88, 28, 135, 0.42), rgba(10, 10, 10, 1)) !important; }
.popular-pill { position: absolute; top: -13px; left: 50%; transform: translateX(-50%); min-height: 26px; display: inline-flex; align-items: center; padding: 0 12px; border-radius: 999px; background: linear-gradient(135deg, var(--theme-purple), var(--theme-indigo)); color: #fff; font-size: 12px; font-weight: 900; white-space: nowrap; }
.shop-price { margin: 18px 0 22px; }
.shop-price strong { font-size: 34px; line-height: 1; font-weight: 900; }
.shop-price span { color: var(--theme-muted); font-size: 14px; }
.shop-features { flex: 1; display: grid; gap: 10px; margin: 0 0 26px; padding: 0; list-style: none; }
.shop-features li { color: var(--theme-muted); font-size: 14px; line-height: 1.45; }
footer, .showcase-footer { border-top-color: var(--theme-line) !important; }
@media (max-width: 900px) {
  :root { --theme-container: min(100% - 28px, 1152px); }
  .concept-nav-inner { grid-template-columns: auto auto !important; gap: 12px !important; padding: 12px 0 10px !important; }
  .concept-nav-links { grid-column: 1 / -1 !important; justify-content: flex-start !important; gap: 22px !important; overflow-x: auto !important; padding-bottom: 4px !important; }
  .concept-nav-links a { white-space: nowrap !important; }
  .concept-main, .page > main, .download-only-main, .simple-auth-main, .simple-support-main, .showcase-main, .shop-preview-main { width: var(--theme-container) !important; min-height: auto !important; padding: 28px 0 50px !important; }
  .concept-hero { min-height: 360px !important; padding: 30px !important; }
  .theme-grid, .theme-feature-grid, .theme-shop-grid, .download-grid, .form-grid, .public-products-grid, .products-toolbar, .showcase-grid { grid-template-columns: 1fr !important; }
  .theme-inside-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}