/*!
 * BUSYTAP — Cosmic Glass Landing Theme
 *
 * Light/glass variant of the cosmic palette used across the platform.
 * Loaded on top of busyglass.css / landing-redesign.css to ensure
 * the public landing page matches the admin login & dashboard aesthetic.
 *
 * Scoped via `body.bt3d-landing` to avoid clashing with class names
 * defined in landing-polish.css / landing-redesign.css.
 *
 * Version: 1.0 — 2026-10-01
 */

:root {
    --bt3d-l-primary: #6366F1;
    --bt3d-l-primary-2: #8B5CF6;
    --bt3d-l-primary-3: #A78BFA;
    --bt3d-l-cyan: #22D3EE;
    --bt3d-l-pink: #F472B6;
    --bt3d-l-text: #1B1F3A;
    --bt3d-l-text-soft: #4F5B6B;
    --bt3d-l-text-muted: #8A93A4;

    --bt3d-l-glass: rgba(255, 255, 255, 0.55);
    --bt3d-l-glass-strong: rgba(255, 255, 255, 0.78);
    --bt3d-l-glass-border: rgba(255, 255, 255, 0.65);
    --bt3d-l-glass-border-strong: rgba(99, 102, 241, 0.18);

    --bt3d-l-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

/* ============================================================
 * Body — soft cosmic gradient backdrop
 * ============================================================ */
body.bt3d-landing {
    background:
        radial-gradient(ellipse at 12% 8%, rgba(99, 102, 241, 0.18) 0%, transparent 50%),
        radial-gradient(ellipse at 88% 18%, rgba(139, 92, 246, 0.16) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 100%, rgba(34, 211, 238, 0.14) 0%, transparent 60%),
        linear-gradient(180deg, #F5F7FF 0%, #ECEEFC 100%);
    color: var(--bt3d-l-text);
    min-height: 100vh;
}

/* ============================================================
 * Top bar
 * ============================================================ */
body.bt3d-landing .navbar-top {
    background: rgba(255, 255, 255, 0.65) !important;
    backdrop-filter: blur(14px) saturate(160%);
    -webkit-backdrop-filter: blur(14px) saturate(160%);
    border-bottom: 1px solid var(--bt3d-l-glass-border-strong);
    box-shadow: 0 4px 20px rgba(99, 102, 241, 0.06);
}

body.bt3d-landing .neu-theme-toggle {
    background: rgba(255, 255, 255, 0.65);
    border: 1px solid var(--bt3d-l-glass-border-strong);
    color: var(--bt3d-l-text);
    border-radius: 999px;
    padding: 6px 14px;
    display: inline-flex;
    gap: 6px;
    align-items: center;
    cursor: pointer;
    transition: all 200ms var(--bt3d-l-ease);
}

body.bt3d-landing .neu-theme-toggle:hover {
    background: rgba(99, 102, 241, 0.10);
    border-color: var(--bt3d-l-primary);
}

body.bt3d-landing .topbar-link {
    color: var(--bt3d-l-text) !important;
    font-weight: 500;
}

/* ============================================================
 * Header / Navigation
 * ============================================================ */
body.bt3d-landing .header,
body.bt3d-landing .neu-header {
    background: rgba(255, 255, 255, 0.55) !important;
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    border-bottom: 1px solid var(--bt3d-l-glass-border-strong);
    box-shadow: 0 6px 28px rgba(99, 102, 241, 0.06);
}

body.bt3d-landing .header .nav-link,
body.bt3d-landing .neu-header .nav-link,
body.bt3d-landing .navbar-nav .nav-link {
    color: var(--bt3d-l-text) !important;
    font-weight: 500;
    transition: color 200ms var(--bt3d-l-ease);
}

body.bt3d-landing .header .nav-link:hover,
body.bt3d-landing .neu-header .nav-link:hover,
body.bt3d-landing .navbar-nav .nav-link:hover {
    color: var(--bt3d-l-primary) !important;
}

/* CTA buttons in header */
body.bt3d-landing .header .neu-store-btn,
body.bt3d-landing .neu-header .neu-store-btn,
body.bt3d-landing .header .glass-btn {
    background: linear-gradient(135deg, var(--bt3d-l-primary), var(--bt3d-l-primary-2)) !important;
    border: 0 !important;
    color: #fff !important;
    border-radius: 999px !important;
    padding: 8px 18px !important;
    font-weight: 600 !important;
    box-shadow: 0 8px 22px rgba(99, 102, 241, 0.35) !important;
}

/* ============================================================
 * Hero
 * ============================================================ */
body.bt3d-landing .neu-hero,
body.bt3d-landing .hero-section {
    background: transparent !important;
    color: var(--bt3d-l-text);
}

body.bt3d-landing .glass-hero-title {
    background: linear-gradient(120deg, #1B1F3A 0%, var(--bt3d-l-primary) 50%, var(--bt3d-l-primary-2) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-weight: 800;
    letter-spacing: -0.5px;
}

body.bt3d-landing .neu-gradient-text {
    background: linear-gradient(120deg, var(--bt3d-l-primary-3), var(--bt3d-l-cyan)) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
}

body.bt3d-landing .glass-hero-subtitle {
    color: var(--bt3d-l-text-soft) !important;
    font-size: 17px;
    line-height: 1.65;
}

body.bt3d-landing .neu-chip,
body.bt3d-landing .glass-badge {
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.14), rgba(34, 211, 238, 0.10)) !important;
    color: var(--bt3d-l-primary) !important;
    border: 1px solid rgba(99, 102, 241, 0.25);
    border-radius: 999px !important;
    padding: 6px 14px !important;
    font-weight: 600 !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* Hero CTAs */
body.bt3d-landing .neu-store-buttons .neu-store-btn,
body.bt3d-landing .glass-hero-cta a {
    background: rgba(255, 255, 255, 0.78) !important;
    border: 1px solid var(--bt3d-l-glass-border-strong) !important;
    color: var(--bt3d-l-text) !important;
    border-radius: 999px !important;
    padding: 10px 22px !important;
    font-weight: 600 !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    transition: transform 200ms var(--bt3d-l-ease), box-shadow 200ms var(--bt3d-l-ease);
    box-shadow: 0 6px 18px rgba(99, 102, 241, 0.10);
}

body.bt3d-landing .neu-store-buttons .neu-store-btn:hover,
body.bt3d-landing .glass-hero-cta a:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 30px rgba(99, 102, 241, 0.25);
    color: var(--bt3d-l-primary) !important;
}

/* Hero stat pills */
body.bt3d-landing .neu-stat-pill {
    background: rgba(255, 255, 255, 0.72) !important;
    border: 1px solid var(--bt3d-l-glass-border-strong) !important;
    border-radius: 16px !important;
    padding: 10px 16px !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 4px 14px rgba(99, 102, 241, 0.08);
    color: var(--bt3d-l-text);
}

body.bt3d-landing .neu-stat-pill b {
    color: var(--bt3d-l-primary);
    font-weight: 700;
}

body.bt3d-landing .neu-stat-pill span {
    color: var(--bt3d-l-text-soft);
    font-size: 13px;
}

/* ============================================================
 * Phone mock + visual
 * ============================================================ */
body.bt3d-landing .neu-phone-frame {
    background: rgba(255, 255, 255, 0.78) !important;
    border: 1px solid var(--bt3d-l-glass-border-strong) !important;
    border-radius: 32px !important;
    padding: 14px !important;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    box-shadow: 0 30px 80px rgba(99, 102, 241, 0.25),
                inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

body.bt3d-landing .neu-app-mock {
    background: linear-gradient(180deg, #F5F7FF 0%, #ECEEFC 100%);
    border-radius: 22px;
}

/* ============================================================
 * Sections (cards / content blocks)
 * ============================================================ */
body.bt3d-landing section[class*="section"],
body.bt3d-landing .neu-section {
    background: transparent !important;
    color: var(--bt3d-l-text);
}

body.bt3d-landing .neu-card,
body.bt3d-landing .glass-card {
    background: rgba(255, 255, 255, 0.72) !important;
    backdrop-filter: blur(14px) saturate(160%);
    -webkit-backdrop-filter: blur(14px) saturate(160%);
    border: 1px solid var(--bt3d-l-glass-border-strong) !important;
    border-radius: 18px !important;
    box-shadow: 0 12px 36px rgba(99, 102, 241, 0.10) !important;
    color: var(--bt3d-l-text);
}

body.bt3d-landing .neu-card:hover,
body.bt3d-landing .glass-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 20px 50px rgba(99, 102, 241, 0.20) !important;
}

body.bt3d-landing .neu-card h3,
body.bt3d-landing .neu-card h4,
body.bt3d-landing .glass-card h3,
body.bt3d-landing .glass-card h4 {
    color: var(--bt3d-l-text) !important;
}

body.bt3d-landing .neu-card p,
body.bt3d-landing .glass-card p {
    color: var(--bt3d-l-text-soft) !important;
}

/* ============================================================
 * Orbs / decorative blobs
 * ============================================================ */
body.bt3d-landing .neu-orb {
    filter: blur(60px);
    opacity: 0.55;
}

body.bt3d-landing .neu-orb--1 {
    background: radial-gradient(circle, rgba(99, 102, 241, 0.5), transparent 70%);
}

body.bt3d-landing .neu-orb--2 {
    background: radial-gradient(circle, rgba(34, 211, 238, 0.45), transparent 70%);
}

/* ============================================================
 * Forms (subscribe / contact)
 * ============================================================ */
body.bt3d-landing .form-control,
body.bt3d-landing .neu-input {
    background: rgba(255, 255, 255, 0.78) !important;
    border: 1px solid var(--bt3d-l-glass-border-strong) !important;
    color: var(--bt3d-l-text) !important;
    border-radius: 12px !important;
    height: 48px;
}

body.bt3d-landing .form-control:focus,
body.bt3d-landing .neu-input:focus {
    background: rgba(255, 255, 255, 0.92) !important;
    border-color: var(--bt3d-l-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.18) !important;
    outline: none;
}

body.bt3d-landing textarea.form-control {
    min-height: 120px;
}

body.bt3d-landing .btn,
body.bt3d-landing .neu-btn,
body.bt3d-landing .neu-submit-btn,
body.bt3d-landing .glass-btn {
    border-radius: 12px !important;
    font-weight: 600 !important;
    transition: all 200ms var(--bt3d-l-ease);
}

body.bt3d-landing .btn-primary,
body.bt3d-landing .neu-submit-btn,
body.bt3d-landing .glass-btn:not(.neu-store-btn) {
    background: linear-gradient(135deg, var(--bt3d-l-primary), var(--bt3d-l-primary-2)) !important;
    border-color: transparent !important;
    color: #fff !important;
    box-shadow: 0 10px 28px rgba(99, 102, 241, 0.35) !important;
    height: 48px;
    padding: 0 24px;
}

body.bt3d-landing .btn-primary:hover,
body.bt3d-landing .neu-submit-btn:hover {
    filter: brightness(1.10);
    transform: translateY(-1px);
}

/* ============================================================
 * Footer
 * ============================================================ */
body.bt3d-landing footer,
body.bt3d-landing .footer,
body.bt3d-landing .neu-footer {
    background: rgba(15, 21, 56, 0.92) !important;
    color: var(--bt3d-l-text-soft) !important;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

body.bt3d-landing footer h5,
body.bt3d-landing footer h4,
body.bt3d-landing .footer-title {
    color: #fff !important;
}

body.bt3d-landing footer a,
body.bt3d-landing .footer a {
    color: rgba(255, 255, 255, 0.78) !important;
    transition: color 200ms var(--bt3d-l-ease);
}

body.bt3d-landing footer a:hover,
body.bt3d-landing .footer a:hover {
    color: var(--bt3d-l-primary-3) !important;
}

/* ============================================================
 * Section headings
 * ============================================================ */
body.bt3d-landing .section-title,
body.bt3d-landing .neu-title {
    color: var(--bt3d-l-text) !important;
    font-weight: 700;
}

body.bt3d-landing .section-subtitle,
body.bt3d-landing .neu-subtitle {
    color: var(--bt3d-l-text-soft) !important;
}

/* ============================================================
 * Stats counter / odometer
 * ============================================================ */
body.bt3d-landing .odometer,
body.bt3d-landing .neu-odometer {
    background: linear-gradient(135deg, var(--bt3d-l-primary-3), var(--bt3d-l-cyan));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-weight: 700;
}

/* ============================================================
 * Swiper / owl carousel arrows
 * ============================================================ */
body.bt3d-landing .swiper-button-next,
body.bt3d-landing .swiper-button-prev,
body.bt3d-landing .owl-nav button {
    background: rgba(255, 255, 255, 0.85) !important;
    border: 1px solid var(--bt3d-l-glass-border-strong) !important;
    color: var(--bt3d-l-primary) !important;
    border-radius: 50% !important;
    width: 40px !important;
    height: 40px !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 6px 16px rgba(99, 102, 241, 0.15);
}

body.bt3d-landing .swiper-button-next::after,
body.bt3d-landing .swiper-button-prev::after {
    color: var(--bt3d-l-primary) !important;
    font-weight: 700;
}

/* ============================================================
 * Loader
 * ============================================================ */
body.bt3d-landing #landing-loader {
    background: linear-gradient(180deg, #F5F7FF 0%, #ECEEFC 100%) !important;
}

/* ============================================================
 * Glass preset utility (drop-in)
 * ============================================================ */
.bt3d-landing .glass-pill {
    background: rgba(255, 255, 255, 0.78) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--bt3d-l-glass-border-strong);
    border-radius: 999px;
    padding: 6px 14px;
    color: var(--bt3d-l-text);
    box-shadow: 0 4px 14px rgba(99, 102, 241, 0.08);
}

/* Dark theme overrides (when html.dark-theme) */
html.dark-theme body.bt3d-landing {
    background:
        radial-gradient(ellipse at 12% 8%, rgba(99, 102, 241, 0.30) 0%, transparent 50%),
        radial-gradient(ellipse at 88% 18%, rgba(139, 92, 246, 0.25) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 100%, rgba(34, 211, 238, 0.20) 0%, transparent 60%),
        linear-gradient(180deg, #0A0E27 0%, #0F1538 100%);
    color: #E5E7FF;
}

html.dark-theme body.bt3d-landing .navbar-top,
html.dark-theme body.bt3d-landing .header,
html.dark-theme body.bt3d-landing .neu-header {
    background: rgba(15, 21, 56, 0.72) !important;
    border-color: rgba(255, 255, 255, 0.10) !important;
}

html.dark-theme body.bt3d-landing .glass-hero-title {
    background: linear-gradient(120deg, #FFFFFF 0%, var(--bt3d-l-primary-3) 50%, var(--bt3d-l-cyan) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

html.dark-theme body.bt3d-landing .neu-card,
html.dark-theme body.bt3d-landing .glass-card {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.10) !important;
    color: #E5E7FF;
}

html.dark-theme body.bt3d-landing .neu-card h3,
html.dark-theme body.bt3d-landing .neu-card h4,
html.dark-theme body.bt3d-landing .glass-card h3,
html.dark-theme body.bt3d-landing .glass-card h4,
html.dark-theme body.bt3d-landing .section-title,
html.dark-theme body.bt3d-landing .neu-title {
    color: #E5E7FF !important;
}

html.dark-theme body.bt3d-landing .neu-card p,
html.dark-theme body.bt3d-landing .glass-card p,
html.dark-theme body.bt3d-landing .section-subtitle,
html.dark-theme body.bt3d-landing .neu-subtitle,
html.dark-theme body.bt3d-landing .glass-hero-subtitle {
    color: #B4B8E3 !important;
}

html.dark-theme body.bt3d-landing .neu-stat-pill,
html.dark-theme body.bt3d-landing .neu-chip,
html.dark-theme body.bt3d-landing .glass-badge {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    color: var(--bt3d-l-primary-3) !important;
}

html.dark-theme body.bt3d-landing .neu-store-buttons .neu-store-btn,
html.dark-theme body.bt3d-landing .glass-hero-cta a {
    background: rgba(255, 255, 255, 0.08) !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    color: #E5E7FF !important;
}

html.dark-theme body.bt3d-landing .form-control,
html.dark-theme body.bt3d-landing .neu-input {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    color: #E5E7FF !important;
}

html.dark-theme body.bt3d-landing .neu-phone-frame {
    background: rgba(15, 21, 56, 0.85) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

html.dark-theme body.bt3d-landing .neu-app-mock {
    background: linear-gradient(180deg, #0F1538 0%, #1A1F4A 100%);
}

html.dark-theme body.bt3d-landing .neu-theme-toggle,
html.dark-theme body.bt3d-landing .glass-pill {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    color: #E5E7FF !important;
}
/* ============================================================
 * Sub-pages — terms / privacy / refund / cancellation / contact /
 * about — extend layouts.landing.app so .bt3d-landing applies.
 * Below: scoped overrides for their native classes.
 * ============================================================ */
body.bt3d-landing .page-header {
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.16) 0%, rgba(34, 211, 238, 0.10) 100%) !important;
    border: 1px solid rgba(99, 102, 241, 0.20);
    border-radius: 18px;
    padding: 60px 28px;
    text-align: center;
    box-shadow: 0 20px 50px rgba(99, 102, 241, 0.12);
    color: var(--bt3d-l-text);
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    position: relative;
    overflow: hidden;
}

body.bt3d-landing .page-header::before {
    content: "";
    position: absolute;
    inset: -50% -50% auto auto;
    width: 320px;
    height: 320px;
    background: radial-gradient(circle, rgba(167, 139, 250, 0.35), transparent 70%);
    filter: blur(30px);
    pointer-events: none;
}

body.bt3d-landing .page-header .title,
body.bt3d-landing .page-header h3 {
    font-size: 30px !important;
    font-weight: 700 !important;
    color: var(--bt3d-l-text) !important;
    margin: 0;
    position: relative;
    background: linear-gradient(120deg, #1B1F3A 0%, var(--bt3d-l-primary) 50%, var(--bt3d-l-primary-2) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

html.dark-theme body.bt3d-landing .page-header .title,
html.dark-theme body.bt3d-landing .page-header h3 {
    background: linear-gradient(120deg, #FFFFFF 0%, var(--bt3d-l-primary-3) 50%, var(--bt3d-l-cyan) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

body.bt3d-landing .privacy-section,
body.bt3d-landing section[class*="-section"] {
    background: rgba(255, 255, 255, 0.65);
    backdrop-filter: blur(14px) saturate(160%);
    -webkit-backdrop-filter: blur(14px) saturate(160%);
    border: 1px solid var(--bt3d-l-glass-border-strong);
    border-radius: 18px;
    margin: 28px auto;
    max-width: 960px;
    padding: 40px 36px !important;
    box-shadow: 0 12px 36px rgba(99, 102, 241, 0.08);
    color: var(--bt3d-l-text);
}

body.bt3d-landing .privacy-section h1,
body.bt3d-landing .privacy-section h2,
body.bt3d-landing .privacy-section h3,
body.bt3d-landing .privacy-section h4 {
    color: var(--bt3d-l-text) !important;
    margin-top: 1.4em;
}

body.bt3d-landing .privacy-section p,
body.bt3d-landing .privacy-section li {
    color: var(--bt3d-l-text-soft) !important;
    line-height: 1.75;
}

body.bt3d-landing .privacy-section a {
    color: var(--bt3d-l-primary) !important;
    text-decoration: none;
}

body.bt3d-landing .privacy-section a:hover {
    color: var(--bt3d-l-cyan) !important;
    text-decoration: underline;
}

html.dark-theme body.bt3d-landing .privacy-section,
html.dark-theme body.bt3d-landing section[class*="-section"] {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    color: #E5E7FF;
}

html.dark-theme body.bt3d-landing .privacy-section h1,
html.dark-theme body.bt3d-landing .privacy-section h2,
html.dark-theme body.bt3d-landing .privacy-section h3,
html.dark-theme body.bt3d-landing .privacy-section h4 {
    color: #E5E7FF !important;
}

html.dark-theme body.bt3d-landing .privacy-section p,
html.dark-theme body.bt3d-landing .privacy-section li {
    color: #B4B8E3 !important;
}

/* Contact form wrapper */
body.bt3d-landing .contact-form,
body.bt3d-landing .form-card {
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(14px) saturate(160%);
    -webkit-backdrop-filter: blur(14px) saturate(160%);
    border: 1px solid var(--bt3d-l-glass-border-strong);
    border-radius: 18px;
    padding: 32px;
    box-shadow: 0 12px 36px rgba(99, 102, 241, 0.10);
}

html.dark-theme body.bt3d-landing .contact-form,
html.dark-theme body.bt3d-landing .form-card {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

/* Maintenance-mode body variant (scoped) */
body.bt3d-maintenance .material-icons {
    color: inherit;
}
