/* Landing Metronic-based overrides */
:root {
  /* Allow slight rounding & shadow consistent with Metronic */
  --app-radius: .75rem;
  --neon-green: #22c55e;
  --neon-blue: #60a5fa;
  --neon-purple: #a78bfa;
  --neon-cyan: #22d3ee;
}

/* Strong dark palette for public pages */
[data-bs-theme="dark"] {
  --bs-body-bg: #0b0f14;
  --bs-body-color: #e5e9f0;
  --bs-border-color: rgba(255,255,255,.12);
  --bs-gray-100: #141922;
  --bs-gray-200: #1a2230;
  --bs-gray-800: #e5e9f0;
  --bs-primary: var(--neon-green);
  --bs-primary-rgb: 34,197,94;
  --bs-success: var(--neon-green);
  --bs-success-rgb: 34,197,94;
}

/* Background purely from Metronic tokens */
body { background: var(--bs-body-bg) !important; color: var(--bs-body-color) !important; }

/* Buttons: improve success contrast on dark */
[data-bs-theme="dark"] .btn-success {
  background-color: #16a34a; /* slightly deeper green */
  border-color: #16a34a;
  color: #fff; font-weight: 600;
}
[data-bs-theme="dark"] .btn-success:hover {
  background-color: #22c55e; border-color: #22c55e; color: #fff;
}
[data-bs-theme="dark"] .btn-success.btn-cta { color: #fff; }
[data-bs-theme="dark"] .btn-success.btn-cta:hover { color: #fff; }
[data-bs-theme="dark"] .btn-light { font-weight: 600; }

/* Futuristic header with gradient + glow */
.site-header {
  position: sticky; top: 0; z-index: 1040;
  background:
    radial-gradient(1000px 300px at 10% 0%, rgba(34,197,94,.10), transparent),
    radial-gradient(800px 300px at 90% 0%, rgba(59,130,246,.10), transparent),
    rgba(7,10,14,.75);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--bs-border-color);
  box-shadow: 0 10px 25px rgba(0,0,0,.35);
}
.site-header::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
  background: linear-gradient(90deg, rgba(34,197,94,.0) 0%, rgba(34,197,94,.9) 25%, rgba(59,130,246,.9) 75%, rgba(59,130,246,.0) 100%);
  filter: drop-shadow(0 0 8px rgba(34,197,94,.4));
}
.brand { color: #dbeafe; }
.brand-text { letter-spacing: .3px; background: linear-gradient(90deg, var(--neon-green), var(--neon-blue), var(--neon-purple)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.brand-pulse {
  width: 8px; height: 8px; border-radius: 999px; background: #22c55e; box-shadow: 0 0 0 0 rgba(34,197,94,.6);
  animation: pulseGlow 2s infinite;
}
@keyframes pulseGlow { 0% { box-shadow: 0 0 0 0 rgba(34,197,94,.6);} 70% { box-shadow: 0 0 0 10px rgba(34,197,94,0);} 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0);} }
.nav-link-ghost { color: #cbd5e1; text-decoration: none; padding: .35rem .5rem; border-radius: .5rem; transition: all .2s ease; }
.nav-link-ghost:hover { color: #a7f3d0; background: rgba(34,197,94,.08); text-shadow: 0 0 6px rgba(34,197,94,.4); }
.btn-ai { background: rgba(34,197,94,.15); color: #7CE0B0; border: 1px solid rgba(124,224,176,.35); }
.btn-ai:hover { background: rgba(34,197,94,.22); color: #b9f9d0; border-color: rgba(124,224,176,.6); }

/* CTA glow button */
.btn-cta {
  position: relative; overflow: hidden; border: 1px solid rgba(255,255,255,.15); background: rgba(255,255,255,.04);
  color: #e5e9f0;
}
.btn-cta::before {
  content: ""; position: absolute; inset: -2px; z-index: -1;
  background: conic-gradient(from 0deg, var(--neon-green), var(--neon-blue), var(--neon-purple), var(--neon-green));
  filter: blur(10px); opacity: .25; animation: spin 6s linear infinite;
}
.btn-cta:hover::before { opacity: .45; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Cards & surfaces using Bootstrap/Metronic variables */
.card-surface, .cart-card, .card-item {
  background: var(--bs-body-bg);
  border: 1px solid var(--bs-border-color);
  border-radius: var(--app-radius);
  box-shadow: var(--bs-box-shadow-sm, 0 4px 12px rgba(0,0,0,.06));
}

/* Colored info boxes with subtle tints */
.glass { position: relative; }
.box-accent-green { background: linear-gradient(180deg, rgba(34,197,94,.12), rgba(34,197,94,.04)); border-color: rgba(34,197,94,.4) !important; }
.box-accent-blue { background: linear-gradient(180deg, rgba(96,165,250,.12), rgba(96,165,250,.04)); border-color: rgba(96,165,250,.4) !important; }
.box-accent-purple { background: linear-gradient(180deg, rgba(167,139,250,.12), rgba(167,139,250,.04)); border-color: rgba(167,139,250,.4) !important; }
.box-accent-cyan { background: linear-gradient(180deg, rgba(34,211,238,.12), rgba(34,211,238,.04)); border-color: rgba(34,211,238,.4) !important; }
.glass[class*="box-accent-"]::before {
  content: ""; position: absolute; left:0; right:0; top:0; height: 3px; border-top-left-radius: 12px; border-top-right-radius: 12px;
  background: linear-gradient(90deg, var(--neon-green), var(--neon-blue), var(--neon-purple));
  opacity: .5;
}
.item-row { padding: .95rem 1rem; border-bottom: 1px dashed var(--bs-border-color); }
.item-row:last-child { border-bottom: 0; }

/* Sticky subnav */
.subnav { position: sticky; top: 0; z-index: 1010; background: var(--bs-body-bg); border-bottom: 1px solid var(--bs-border-color); }
.subnav .chips { overflow-x: auto; white-space: nowrap; scrollbar-width: none; }
.subnav .chips::-webkit-scrollbar { display: none; }

/* Chips styled to feel like Metronic badges */
.chip { display:inline-block; padding:.35rem .7rem; border-radius: 999px; border:1px solid var(--bs-border-color); color: var(--bs-gray-800); background: var(--bs-gray-100); font-weight: 500; }
.chip:hover { background: var(--bs-gray-200); text-decoration: none; }
[data-bs-theme="dark"] .chip { color: #e5e9f0; background: #141922; }
[data-bs-theme="dark"] .chip:hover { background: #1a2230; }
.chip.active { background: var(--bs-primary-light, rgba(34,197,94,.16)); border-color: var(--bs-primary); color: var(--bs-primary); }
[data-bs-theme="dark"] .chip.active { color: #aefcc4; border-color: rgba(34,197,94,.4); background: rgba(34,197,94,.15); }

/* Prices pop with primary color */
.price { color: var(--bs-primary); font-weight: 700; }

/* Buttons mapping */
[data-bs-theme="dark"] .btn-light { background: #1a2230; color:#e5e9f0; border-color: var(--bs-border-color); }
[data-bs-theme="dark"] .btn-light:hover { background: #232d3f; }
[data-bs-theme="dark"] .btn-light-danger { background: rgba(220,53,69,.12); color:#ff6b6b; border-color: rgba(220,53,69,.35); }
[data-bs-theme="dark"] .btn-light-danger:hover { background: rgba(220,53,69,.18); }
[data-bs-theme="dark"] .btn-primary { color: #051014; }

/* Floating cart button */
.floating-cart { position: fixed; right: 20px; bottom: 80px; z-index: 1030; }
[data-bs-theme="dark"] .floating-cart { background: #0f151d; color:#e5e9f0; border:1px solid var(--bs-border-color); border-radius: 999px; padding:.6rem 1rem; box-shadow: 0 8px 22px rgba(0,0,0,.35); }
.floating-cart:hover { filter: brightness(1.05); }

/* Toasts use Metronic's card look */
.toast-wrap { position: fixed; right: 20px; top: 20px; z-index: 2000; display:flex; flex-direction:column; gap:8px; }
.toast { background: var(--bs-body-bg); color: var(--bs-body-color); border:1px solid var(--bs-border-color); border-radius: .5rem; padding:.6rem .8rem; min-width: 220px; box-shadow: var(--bs-box-shadow-sm, 0 8px 22px rgba(0,0,0,.05)); }
/* Search input group */
.search { border:1px solid var(--bs-border-color); border-radius: .75rem; background: transparent; }
[data-bs-theme="dark"] .search { background: #11161f; }
.search .form-control, .search .input-group-text { background: transparent !important; color: var(--bs-body-color); }
.search .form-control::placeholder { color: var(--bs-gray-500, #6b7280); opacity: .85; }
.search:focus-within { border-color: rgba(var(--bs-primary-rgb), .5); box-shadow: 0 0 0 .2rem rgba(var(--bs-primary-rgb), .15); }

.toast.success { border-color: rgba(var(--bs-success-rgb), .45); }
.toast.error { border-color: rgba(var(--bs-danger-rgb), .45); }

/* Subtle animated grid background utility (use on hero sections) */
.ai-grid-bg {
  position: relative;
}
.ai-grid-bg::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: 24px 24px, 24px 24px;
  mask-image: radial-gradient(60% 50% at 50% 0%, rgba(0,0,0,.8), transparent 70%);
}

/* Gradient text utility */
.text-gradient {
  background: linear-gradient(90deg, #22c55e, #60a5fa);
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
}

/* Code card */
.code-card { background: #0f151d; border: 1px solid var(--bs-border-color); border-radius: 12px; padding: 1rem; }
.code-card .code-sample { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size:.9rem; white-space: pre-wrap; }

/* Logos strip */
.logo-strip { opacity: .85; filter: grayscale(1); }
.logo-strip img, .logo-strip svg { height: 26px; opacity: .7; transition: opacity .2s ease, filter .2s ease; }
.logo-strip img:hover, .logo-strip svg:hover { opacity: 1; filter: grayscale(0); }

/* Use-cases cards */
.use-case { background: rgba(255,255,255,.03); border: 1px solid var(--bs-border-color); border-radius: 12px; }
.use-case .icon { width: 64px; height: 64px; display:grid; place-items:center; border-radius: 12px; background: rgba(255,255,255,.06); border:1px solid var(--bs-border-color); }
.use-case .icon i { color: #fff; font-size: 2rem; }

/* Feature icons */
.feature-icon {
  width: 56px; height: 56px; border-radius: 14px; display:grid; place-items:center;
  background:
    radial-gradient(200px 80px at 30% 0%, rgba(34,197,94,.25), transparent),
    radial-gradient(180px 70px at 70% 120%, rgba(96,165,250,.22), transparent),
    rgba(255,255,255,.04);
  border: 1px solid var(--bs-border-color);
}
.feature-icon i { color: #fff !important; font-size: 1.8rem; }

/* Roomier card padding */
.box-roomy { padding: 2rem !important; }

/* Section eyebrow label */
.eyebrow { display:inline-block; font-size:.75rem; letter-spacing:.06em; text-transform:uppercase; color:#a3e635; background: rgba(163,230,53,.12); border:1px solid rgba(163,230,53,.35); border-radius:999px; padding:.25rem .6rem; }

/* FAQ */
.faq-q { font-weight: 600; }
.faq-a { color: #94a3b8; }

/* Consistent vertical spacing between stacked rows */
.vspace-rows > .row + .row { margin-top: 1.25rem; }
@media (min-width: 768px) {
  .vspace-rows > .row + .row { margin-top: 2rem; }
}

/* Spacious sections */
.section-spacious { padding-top: 4rem; padding-bottom: 4rem; }

/* Reduce motion accessibility */
@media (prefers-reduced-motion: reduce) {
  .brand-pulse { animation: none !important; }
  .btn-cta::before { animation: none !important; }
}
