/* Edit Bazar Frontend Theme CSS - Dark UI with purple gradient */
:root {
  --eb-bg: #0A0A0B;
  --eb-surface: #111827;
  --eb-card: rgba(255,255,255,0.05);
  --eb-border: rgba(255,255,255,0.10);
  --eb-text: #F9FAFB;
  --eb-muted: #9CA3AF;
  --eb-primary: linear-gradient(90deg,#a855f7,#6366f1);
  --eb-gold: linear-gradient(90deg,#fbbf24,#f97316);
}
.eb-scope { color: var(--eb-text); font-family: 'Inter', system-ui, sans-serif; }
.eb-scope * { box-sizing: border-box; }
.eb-h1 { font-size: 2rem; font-weight: 800; letter-spacing: -0.02em; margin: 0 0 12px; }
.eb-h2 { font-size: 1.5rem; font-weight: 700; letter-spacing: -0.01em; margin: 0; }
.eb-h3 { font-size: 1.15rem; font-weight: 700; margin: 0; }
.eb-h4 { font-size: 0.95rem; font-weight: 700; margin: 0 0 6px; color: var(--eb-muted); }
.eb-muted { color: var(--eb-muted); }
.eb-text-xs { font-size: 12px; } .eb-text-sm { font-size: 14px; }
.eb-text-emerald{color:#34d399;}.eb-text-red{color:#f87171;}.eb-text-amber{color:#fbbf24;}.eb-text-indigo{color:#818cf8;}.eb-text-fuchsia{color:#e879f9;}
.eb-text-center{text-align:center;}.eb-text-right{text-align:right;}
.eb-uppercase{text-transform:uppercase;letter-spacing:0.1em;}
.eb-bold{font-weight:700;}

.eb-row { display:flex; align-items:center; gap:8px; }
.eb-col { display:flex; flex-direction:column; gap:8px; }
.eb-flex-1 { flex: 1 1 auto; min-width: 0; }
.eb-flex-wrap { flex-wrap: wrap; }
.eb-justify-between{justify-content:space-between;}.eb-justify-center{justify-content:center;}
.eb-items-center{align-items:center;}.eb-items-start{align-items:flex-start;}.eb-items-end{align-items:flex-end;}
.eb-gap-2{gap:8px;}.eb-gap-3{gap:12px;}.eb-gap-4{gap:16px;}
.eb-min-w-0{min-width:0;}
.eb-mt-2{margin-top:8px;}.eb-mt-3{margin-top:12px;}.eb-mt-4{margin-top:16px;}.eb-mt-6{margin-top:24px;}
.eb-mb-1{margin-bottom:4px;}.eb-mb-2{margin-bottom:8px;}.eb-mb-3{margin-bottom:12px;}.eb-mb-4{margin-bottom:16px;}.eb-mb-6{margin-bottom:24px;}
.eb-p-2{padding:8px;}.eb-p-3{padding:12px;}.eb-p-4{padding:16px;}.eb-p-6{padding:24px;}.eb-p-8{padding:32px;}
.eb-w-full{width:100%;}
.eb-rounded{border-radius:8px;}
.eb-overflow-hidden{overflow:hidden;}
.eb-border-t{border-top:1px solid var(--eb-border);}
.eb-bg-slate{background:rgba(255,255,255,0.05);}

.eb-grid { display: grid; gap: 16px; }
.eb-grid-1 { grid-template-columns: 1fr; }
.eb-grid-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
.eb-grid-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.eb-grid-4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
@media (max-width: 900px) { .eb-grid-4, .eb-grid-3 { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 600px) { .eb-grid-4, .eb-grid-3, .eb-grid-2 { grid-template-columns: 1fr; } }

.eb-card { background: var(--eb-card); border: 1px solid var(--eb-border); border-radius: 14px; backdrop-filter: blur(12px); }
.eb-border-emerald{border-color:rgba(52,211,153,0.35);background:linear-gradient(135deg,rgba(52,211,153,0.15),rgba(20,184,166,0.05));}
.eb-border-indigo{border-color:rgba(129,140,248,0.35);background:linear-gradient(135deg,rgba(129,140,248,0.15),rgba(232,121,249,0.05));}

.eb-btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:10px 16px; border-radius:10px; font-weight:600; border:0; cursor:pointer; text-decoration:none; transition:all .15s; font-size:14px; color:#fff; }
.eb-btn:disabled { opacity:.5; cursor:not-allowed; }
.eb-btn-primary { background: var(--eb-primary); box-shadow:0 6px 20px -8px rgba(168,85,247,.55); }
.eb-btn-primary:hover { filter:brightness(1.1); }
.eb-btn-outline { background:transparent; border:1px solid var(--eb-border); }
.eb-btn-outline:hover { background:rgba(255,255,255,0.08); }
.eb-btn-ghost { background:rgba(255,255,255,0.06); }
.eb-btn-ghost:hover { background:rgba(255,255,255,0.12); }
.eb-btn-white { background:#fff; color:#000; }
.eb-btn-gold { background: var(--eb-gold); color:#000; box-shadow:0 6px 20px -8px rgba(251,146,60,.5); }
.eb-btn-emerald{background:linear-gradient(90deg,#10b981,#14b8a6);}
.eb-btn-fuchsia{background:linear-gradient(90deg,#e879f9,#a855f7);}
.eb-btn-success{background:#10b981;}
.eb-btn-lg{padding:14px 22px;font-size:16px;border-radius:12px;}
.eb-pulse { animation: ebPulse 1.4s infinite; }
@keyframes ebPulse { 0%,100%{transform:scale(1);}50%{transform:scale(1.04);} }

.eb-input { width:100%; padding:10px 12px; background:rgba(255,255,255,0.05); border:1px solid var(--eb-border); border-radius:10px; color:var(--eb-text); font-size:14px; outline:none; }
.eb-input:focus { border-color:#a855f7; box-shadow:0 0 0 3px rgba(168,85,247,0.2); }
.eb-label { display:block; font-size:13px; font-weight:600; color:#E5E7EB; margin-top:12px; }
.eb-label .eb-input, .eb-label input, .eb-label select, .eb-label textarea { margin-top:4px; }

.eb-badge { display:inline-flex; align-items:center; padding:3px 8px; border-radius:999px; font-size:11px; font-weight:600; background:rgba(255,255,255,0.08); border:1px solid var(--eb-border); }
.eb-badge-primary { background: var(--eb-primary); color:#fff; border:0; }
.eb-badge-gold { background:rgba(251,191,36,.9); color:#000; border:0; }
.eb-badge-outline { background:rgba(0,0,0,0.3); }
.eb-badge-success,.eb-badge-active,.eb-badge-resolved{background:rgba(52,211,153,.2);color:#6ee7b7;}
.eb-badge-danger,.eb-badge-rejected,.eb-badge-failed{background:rgba(239,68,68,.2);color:#fca5a5;}
.eb-badge-paused,.eb-badge-in_progress,.eb-badge-pending{background:rgba(251,191,36,.2);color:#fbbf24;}
.eb-badge-completed{background:rgba(129,140,248,.2);color:#a5b4fc;}
.eb-badge-open{background:rgba(59,130,246,.2);color:#93c5fd;}
.eb-badge-fuchsia{background:linear-gradient(90deg,#e879f9,#a855f7);color:#fff;border:0;}

.eb-pill { padding:6px 12px; border-radius:999px; font-size:13px; background:rgba(255,255,255,0.05); border:1px solid var(--eb-border); }
.eb-bg-amber-glow { background:linear-gradient(90deg,rgba(251,191,36,.15),rgba(249,115,22,.15)); border-color:rgba(251,191,36,.35); }
.eb-chip { display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:999px; background:rgba(255,255,255,.06); border:1px solid var(--eb-border); font-size:13px; }

.eb-progress { height:6px; background:rgba(255,255,255,0.1); border-radius:999px; overflow:hidden; }
.eb-progress > div { height:100%; background: var(--eb-primary); border-radius:999px; transition:width .3s; }
.eb-daily-progress { height:4px; background:rgba(255,255,255,0.08); border-radius:2px; overflow:hidden; }
.eb-daily-progress > div { height:100%; background: var(--eb-gold); transition:width .5s; }

.eb-stat { padding:16px; border-radius:14px; background: rgba(255,255,255,0.03); border:1px solid var(--eb-border); }
.eb-stat-label { font-size:12px; color:var(--eb-muted); }
.eb-stat-value { font-size:1.7rem; font-weight:700; margin-top:4px; }
.eb-stat-fuchsia{background:linear-gradient(135deg,rgba(232,121,249,.15),rgba(232,121,249,.03));border-color:rgba(232,121,249,.35);}
.eb-stat-indigo{background:linear-gradient(135deg,rgba(129,140,248,.15),rgba(129,140,248,.03));border-color:rgba(129,140,248,.35);}
.eb-stat-amber{background:linear-gradient(135deg,rgba(251,191,36,.15),rgba(251,191,36,.03));border-color:rgba(251,191,36,.35);}
.eb-stat-emerald{background:linear-gradient(135deg,rgba(52,211,153,.15),rgba(52,211,153,.03));border-color:rgba(52,211,153,.35);}

.eb-num-lg { font-size:2.2rem; font-weight:800; letter-spacing:-.02em; margin-top:4px; }

.eb-thumb { width: 128px; height: 80px; border-radius: 8px; object-fit: cover; }
@media (max-width: 480px) { .eb-thumb { width: 96px; height: 60px; } }
.eb-title-1line { font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* Snap feed */
.eb-snap-container { height: calc(100vh - 220px); overflow-y: scroll; scroll-snap-type: y mandatory; border-radius: 16px; border: 1px solid var(--eb-border); background:#000; scroll-behavior: smooth; }
.eb-snap-slide { height: calc(100vh - 220px); scroll-snap-align: start; scroll-snap-stop: always; display:flex; align-items:center; justify-content:center; }
.scrollbar-hide::-webkit-scrollbar{display:none;} .scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none;}
.eb-player-wrap { position: relative; width: 100%; max-width: 460px; height: 100%; }
.eb-player-iframe { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; border:0; }
.eb-player-shield { position:absolute; inset:0; z-index:10; }
.eb-player-top { position:absolute; top:16px; left:16px; right:16px; z-index:20; display:flex; align-items:center; gap:12px; }
.eb-timer { display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:999px; background:rgba(0,0,0,0.6); border:1px solid rgba(255,255,255,0.2); font-family: monospace; font-weight:700; backdrop-filter:blur(8px); }
.eb-timer-fail { background:rgba(239,68,68,.35); border-color:rgba(239,68,68,.55); }
.eb-timer-ok { background:rgba(52,211,153,.35); border-color:rgba(52,211,153,.55); }
.eb-invalid-overlay { position:absolute; inset:0; z-index:30; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.7); backdrop-filter:blur(8px); text-align:center; padding:16px; }
.eb-player-bottom { position:absolute; bottom:0; left:0; right:0; z-index:20; padding:16px 16px 24px; display:flex; align-items:flex-end; gap:12px; background:linear-gradient(to top, #000, rgba(0,0,0,.8), transparent); }
.eb-side-nav { position: fixed; right: 20px; top: 50%; transform: translateY(-50%); display:flex; flex-direction:column; align-items:center; gap:8px; z-index:35; }
.eb-nav-btn { width:40px; height:40px; border-radius:999px; background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.2); color:#fff; cursor:pointer; }
.eb-nav-btn:disabled { opacity: .3; }
.eb-nav-count { font-family: monospace; font-size:12px; color:#cbd5e1; }
@media (max-width: 900px) { .eb-side-nav { display:none; } }

/* Modal */
.eb-modal-backdrop { position: fixed; inset:0; background: rgba(0,0,0,.7); z-index:80; display:flex; align-items:center; justify-content:center; padding:16px; backdrop-filter: blur(6px); }
.eb-modal { background:#0f172a; border:1px solid var(--eb-border); border-radius:16px; width:100%; max-width:560px; max-height:90vh; overflow-y:auto; padding:20px; }
.eb-modal-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.eb-close { background:none; border:0; color:#9ca3af; font-size:20px; cursor:pointer; }
.eb-cost-card { padding:14px; background:linear-gradient(135deg,rgba(168,85,247,.1),rgba(99,102,241,.05)); border:1px solid rgba(168,85,247,.25); border-radius:12px; margin-top:12px; font-size:13px; }
.eb-cost-card .eb-total { padding-top:8px; margin-top:8px; border-top:1px solid rgba(255,255,255,.1); font-weight:700; font-size:15px; }

/* Tabs */
.eb-tabs { display:flex; gap:4px; background:rgba(255,255,255,.05); border:1px solid var(--eb-border); border-radius:10px; padding:4px; }
.eb-tab { flex:1; padding:8px 12px; border-radius:8px; background:transparent; border:0; color:var(--eb-muted); font-weight:600; font-size:14px; cursor:pointer; }
.eb-tab.active { background: rgba(255,255,255,.1); color:#fff; }

/* Info boxes */
.eb-info-box { padding:10px 12px; border-radius:10px; border:1px solid; font-size:13px; }
.eb-info-box ul { margin:6px 0 0; padding-left:18px; }
.eb-info-emerald{background:rgba(52,211,153,.1);border-color:rgba(52,211,153,.25);color:#a7f3d0;}
.eb-info-amber{background:rgba(251,191,36,.1);border-color:rgba(251,191,36,.25);color:#fde68a;}
.eb-info-indigo{background:rgba(129,140,248,.1);border-color:rgba(129,140,248,.25);color:#c7d2fe;}
.eb-info-fuchsia{background:rgba(232,121,249,.1);border-color:rgba(232,121,249,.25);color:#f5d0fe;}
.eb-info-red{background:rgba(239,68,68,.1);border-color:rgba(239,68,68,.25);color:#fecaca;}
.eb-info-slate{background:rgba(148,163,184,.1);border-color:rgba(148,163,184,.25);color:#cbd5e1;}

/* Hero */
.eb-hero { padding: 80px 20px 60px; position: relative; overflow: hidden; }
.eb-hero::before, .eb-hero::after { content:''; position:absolute; border-radius:999px; filter: blur(80px); z-index:0; }
.eb-hero::before { top:-100px; left:-100px; width:400px; height:400px; background:rgba(168,85,247,.2); }
.eb-hero::after { bottom:-100px; right:-100px; width:500px; height:500px; background:rgba(99,102,241,.2); }
.eb-hero-inner { position:relative; z-index:1; max-width:900px; margin:0 auto; text-align:center; }
.eb-hero-title { font-size: clamp(2.5rem, 7vw, 5rem); font-weight: 900; line-height:1; letter-spacing:-.03em; margin: 20px 0; }
.eb-hero-sub { font-size: clamp(1rem, 2.2vw, 1.2rem); color: var(--eb-muted); max-width: 640px; margin: 0 auto; }
.eb-gradient-text { background: linear-gradient(90deg,#e879f9,#f472b6,#fbbf24); -webkit-background-clip:text; background-clip:text; color: transparent; }
.eb-section { padding: 60px 20px; }
.eb-section-title { font-size: clamp(1.8rem, 4vw, 2.5rem); font-weight: 800; text-align:center; margin: 0 0 40px; }
.eb-icon-lg { font-size:2.5rem; margin-bottom:10px; }
.eb-price { padding:24px; border-radius:16px; background: var(--eb-card); border:1px solid var(--eb-border); text-align:center; }
.eb-price-featured { border-color:rgba(168,85,247,.5); background:linear-gradient(135deg,rgba(168,85,247,.15),transparent); }
.eb-price-dur { font-size: 1.2rem; color: var(--eb-muted); }
.eb-price-inr { font-size: 2.5rem; font-weight: 800; margin: 8px 0; }

/* Help widget */
.eb-help-fab { position: fixed; bottom: 20px; right: 20px; width: 56px; height: 56px; border-radius: 999px; background: var(--eb-primary); color:#fff; font-size: 22px; border: 0; cursor: pointer; box-shadow: 0 10px 30px -10px rgba(168,85,247,.6); z-index: 60; }
.eb-help-panel { position: fixed; bottom: 90px; right: 20px; width: 340px; max-width: calc(100vw - 40px); background: #0f172a; border:1px solid var(--eb-border); border-radius: 16px; padding: 16px; z-index: 61; box-shadow: 0 20px 60px -20px rgba(0,0,0,.7); }
.eb-help-header { display:flex; justify-content:space-between; align-items:center; margin-bottom: 10px; }

.eb-code { background: rgba(255,255,255,.08); padding: 2px 6px; border-radius: 4px; font-family: monospace; font-size: 12px; }
.eb-refer-card { background: linear-gradient(135deg, rgba(232,121,249,.15), rgba(99,102,241,.08)); border-color: rgba(232,121,249,.35); }
.eb-refer-code { font-family: monospace; font-size: 2.5rem; font-weight: 900; letter-spacing: .3em; margin: 12px 0; color: #fff; }

.eb-loading { text-align:center; padding: 60px 20px; color: var(--eb-muted); }
.eb-legal { max-width: 800px; margin: 0 auto; padding: 40px 20px; }
.eb-legal h1 { font-size: 2rem; margin-bottom: 20px; }
.eb-legal h2 { font-size: 1.2rem; margin-top: 24px; margin-bottom: 8px; color: #e879f9; }
.eb-legal ul { padding-left: 20px; color: var(--eb-muted); }
.eb-legal p { color: #d1d5db; line-height: 1.7; }

.eb-scroll { max-height: 200px; overflow-y: auto; }

/* Toast */
.eb-toast-container { position: fixed; top: 20px; left: 50%; transform: translateX(-50%); z-index: 100; display:flex; flex-direction:column; gap:8px; }
.eb-toast { padding: 12px 18px; border-radius: 10px; background: #1f2937; border:1px solid var(--eb-border); color:#fff; font-size: 14px; box-shadow: 0 10px 30px -10px rgba(0,0,0,.6); min-width: 260px; animation: ebSlideDown .3s ease; }
.eb-toast-success { border-color: rgba(52,211,153,.5); }
.eb-toast-error { border-color: rgba(239,68,68,.5); }
@keyframes ebSlideDown { from { opacity:0; transform: translateY(-20px); } to { opacity:1; transform: translateY(0); } }

/* Maintenance banner */
.eb-maintenance-banner { position: sticky; top: 0; z-index: 90; }

/* PWA Install prompt */
.eb-pwa-prompt { position: fixed; bottom: 90px; left: 20px; right: 20px; max-width: 400px; margin: 0 auto; background: #0f172a; border:1px solid var(--eb-border); border-radius: 14px; padding: 14px 16px; display:flex; gap:12px; align-items:center; z-index: 70; box-shadow: 0 20px 60px -20px rgba(0,0,0,.7); }
.eb-pwa-prompt img { width: 44px; height: 44px; border-radius: 10px; }
@media (max-width: 500px) { .eb-pwa-prompt { left: 12px; right: 12px; bottom: 80px; } }
