/* ============================================================
   ViraCut — единый ЧБ стиль
   Правило: ЧЁРНЫЙ фон + БЕЛЫЕ акценты + синий только как glow
   ============================================================ */

/* ── ЛОГОТИП ─────────────────────────────────────────────── */
.logo, .auth-logo {
  background: linear-gradient(135deg, #fff 0%, #93c5fd 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
[data-theme="light"] .logo,
[data-theme="light"] .auth-logo {
  background: linear-gradient(135deg, #1d4ed8, #0ea5e9) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* ── NAV активный пункт ───────────────────────────────────── */
.vc-nav-link.active {
  color: #fff !important;
  background: rgba(255,255,255,.09) !important;
}
[data-theme="light"] .vc-nav-link.active {
  color: #0d0d12 !important;
  background: rgba(0,0,0,.07) !important;
}

/* ── ПЕРЕКЛЮЧАТЕЛЬ ТАРИФОВ ────────────────────────────────── */
.billing-tabs {
  border-color: #2c2c2c !important;
  box-shadow: none !important;
}
.billing-tab.active {
  background: #fff !important;
  color: #000 !important;
  box-shadow: 0 2px 10px rgba(255,255,255,.1) !important;
}
[data-theme="light"] .billing-tabs { border-color: var(--border) !important; }
[data-theme="light"] .billing-tab.active {
  background: #0d0d12 !important;
  color: #fff !important;
  box-shadow: none !important;
}

/* ── КАРТОЧКИ ТАРИФОВ ─────────────────────────────────────── */
.plan-card.pro {
  border-color: #fff !important;
  box-shadow: 0 0 50px rgba(255,255,255,.06) !important;
}
.plan-card.max {
  border-color: rgba(255,255,255,.4) !important;
  box-shadow: 0 0 50px rgba(255,255,255,.03) !important;
}
[data-theme="light"] .plan-card.pro { border-color: #0d0d12 !important; box-shadow: 0 8px 40px rgba(0,0,0,.12) !important; }
[data-theme="light"] .plan-card.max { border-color: #7c3aed !important; }

/* ── БЕЙДЖИ (Популярный / Max) ────────────────────────────── */
.badge-pro {
  background: #fff !important;
  color: #000 !important;
  box-shadow: none !important;
}
.badge-max {
  background: #fff !important;
  color: #000 !important;
  box-shadow: none !important;
}
[data-theme="light"] .badge-pro { background: #0d0d12 !important; color: #fff !important; }
[data-theme="light"] .badge-max { background: #0d0d12 !important; color: #fff !important; }

/* ── ТЕКСТ ФИЧ (feat-highlight) ───────────────────────────── */
.feat-highlight { color: #fff !important; font-weight: 700 !important; }
[data-theme="light"] .feat-highlight { color: #0d0d12 !important; }

/* ── КНОПКИ CTA ───────────────────────────────────────────── */
.btn-new {
  background: #fff !important; color: #000 !important;
  border: none !important; box-shadow: 0 4px 20px rgba(255,255,255,.08) !important;
}
.btn-new:hover { background: #e8e8e8 !important; transform: translateY(-1px) !important; box-shadow: 0 6px 28px rgba(255,255,255,.13) !important; }
.btn-new svg { stroke: #000 !important; }
[data-theme="light"] .btn-new { background: #0d0d12 !important; color: #fff !important; box-shadow: 0 4px 16px rgba(0,0,0,.15) !important; }
[data-theme="light"] .btn-new:hover { background: #1a1a24 !important; }
[data-theme="light"] .btn-new svg { stroke: #fff !important; }

.btn-generate {
  background: #fff !important; color: #000 !important;
  box-shadow: 0 4px 24px rgba(255,255,255,.1) !important;
}
.btn-generate:hover { background: #ececec !important; }
.btn-generate:disabled { background: #fff !important; opacity: .35 !important; }
[data-theme="light"] .btn-generate { background: #0d0d12 !important; color: #fff !important; }
[data-theme="light"] .btn-generate:hover { background: #1a1a24 !important; }

.btn-pro {
  background: #fff !important; color: #000 !important;
  box-shadow: 0 4px 20px rgba(255,255,255,.09) !important;
}
.btn-pro:hover { background: #e8e8e8 !important; transform: translateY(-1px) !important; }
.btn-pro:disabled { opacity: .35 !important; background: #fff !important; box-shadow: none !important; transform: none !important; }
[data-theme="light"] .btn-pro { background: #0d0d12 !important; color: #fff !important; box-shadow: 0 4px 20px rgba(0,0,0,.12) !important; }
[data-theme="light"] .btn-pro:hover { background: #1a1a24 !important; }

.btn-max {
  background: #fff !important; color: #000 !important;
  box-shadow: 0 4px 20px rgba(255,255,255,.09) !important;
}
.btn-max:hover { background: #e8e8e8 !important; transform: translateY(-1px) !important; }
.btn-max:disabled { opacity: .35 !important; background: #fff !important; box-shadow: none !important; transform: none !important; }
[data-theme="light"] .btn-max { background: #0d0d12 !important; color: #fff !important; }
[data-theme="light"] .btn-max:hover { background: #1a1a24 !important; }

.btn-upgrade {
  background: #fff !important; color: #000 !important;
  box-shadow: 0 4px 16px rgba(255,255,255,.08) !important;
  border: none !important;
}
.btn-upgrade:hover { background: #e8e8e8 !important; transform: translateY(-1px) !important; }
[data-theme="light"] .btn-upgrade { background: #0d0d12 !important; color: #fff !important; box-shadow: 0 4px 16px rgba(0,0,0,.12) !important; }
[data-theme="light"] .btn-upgrade:hover { background: #1a1a24 !important; }

.btn-save {
  background: #fff !important; color: #000 !important;
  box-shadow: 0 2px 12px rgba(255,255,255,.07) !important;
}
.btn-save:hover { background: #e8e8e8 !important; transform: translateY(-1px) !important; }
[data-theme="light"] .btn-save { background: #0d0d12 !important; color: #fff !important; }
[data-theme="light"] .btn-save:hover { background: #1a1a24 !important; }

.btn-send {
  background: #fff !important; color: #000 !important;
  box-shadow: 0 0 16px rgba(255,255,255,.07) !important;
}
.btn-send svg { stroke: #000 !important; }
.btn-send:hover { opacity: .88 !important; }
[data-theme="light"] .btn-send { background: #0d0d12 !important; color: #fff !important; }
[data-theme="light"] .btn-send svg { stroke: #fff !important; }

.btn-plan-submit {
  background: #fff !important; color: #000 !important;
  box-shadow: 0 4px 20px rgba(255,255,255,.09) !important;
}
.btn-plan-submit:hover { background: #e8e8e8 !important; opacity: 1 !important; }
[data-theme="light"] .btn-plan-submit { background: #0d0d12 !important; color: #fff !important; }

.btn-submit {
  background: #fff !important; color: #000 !important;
  box-shadow: 0 4px 20px rgba(255,255,255,.08) !important;
}
.btn-submit:hover { background: #e8e8e8 !important; transform: translateY(-1px) !important; }
.btn-submit:disabled { opacity: .4 !important; background: #fff !important; }
[data-theme="light"] .btn-submit { background: #0d0d12 !important; color: #fff !important; }
[data-theme="light"] .btn-submit:hover { background: #1a1a24 !important; }

.btn-primary {
  background: #fff !important; color: #000 !important;
  box-shadow: 0 4px 20px rgba(255,255,255,.08) !important;
}
.btn-primary:hover { background: #e8e8e8 !important; opacity: 1 !important; transform: translateY(-1px) !important; }
[data-theme="light"] .btn-primary { background: #0d0d12 !important; color: #fff !important; }
[data-theme="light"] .btn-primary:hover { background: #1a1a24 !important; }

/* ── UPGRADE БАННЕР ───────────────────────────────────────── */
.upgrade-banner {
  background: rgba(255,255,255,.02) !important;
  border-color: rgba(255,255,255,.1) !important;
}
.upgrade-icon {
  background: rgba(255,255,255,.07) !important;
}
.upgrade-icon svg { stroke: #fff !important; }

/* ── ПРОГРЕСС БАР ─────────────────────────────────────────── */
.progress-fill {
  background: linear-gradient(90deg, #fff, rgba(255,255,255,.55)) !important;
}
[data-theme="light"] .progress-fill {
  background: linear-gradient(90deg, #0d0d12, #374151) !important;
}

/* ── ПЛАН БЕЙДЖ (dashboard) ───────────────────────────────── */
.plan-pro {
  background: rgba(255,255,255,.08) !important;
  color: #e2e8f0 !important;
}
[data-theme="light"] .plan-pro { background: rgba(0,0,0,.07) !important; color: #0d0d12 !important; }

/* ── ИКОНКИ В КАРТОЧКАХ СТАТИСТИКИ ───────────────────────── */
.stat-card-icon {
  background: rgba(255,255,255,.06) !important;
}
.stat-card-icon svg { stroke: #e2e8f0 !important; }
[data-theme="light"] .stat-card-icon { background: rgba(0,0,0,.05) !important; }
[data-theme="light"] .stat-card-icon svg { stroke: #0d0d12 !important; }

/* ── СЧЁТЧИК КЛИПОВ В ИСТОРИИ ─────────────────────────────── */
.history-clips-count {
  background: rgba(255,255,255,.07) !important;
  color: #e2e8f0 !important;
}
.history-clips-more { color: rgba(255,255,255,.5) !important; }
[data-theme="light"] .history-clips-count { background: rgba(0,0,0,.05) !important; color: #374151 !important; }
[data-theme="light"] .history-clips-more { color: #6b7280 !important; }

/* ── CHAT SIDEBAR КНОПКИ ─────────────────────────────────── */
.btn-new-chat {
  background: #fff !important; color: #000 !important;
  box-shadow: 0 4px 16px rgba(255,255,255,.08) !important;
}
.btn-new-chat:hover { background: #e8e8e8 !important; }
.btn-new-chat svg { stroke: #000 !important; }
[data-theme="light"] .btn-new-chat { background: #0d0d12 !important; color: #fff !important; }
[data-theme="light"] .btn-new-chat:hover { background: #1a1a24 !important; }
[data-theme="light"] .btn-new-chat svg { stroke: #fff !important; }

.btn-script {
  background: rgba(255,255,255,.06) !important; color: #fff !important;
  border: 1px solid rgba(255,255,255,.14) !important;
}
.btn-script:hover { background: rgba(255,255,255,.12) !important; }
.btn-script svg { stroke: #fff !important; }
[data-theme="light"] .btn-script { background: rgba(0,0,0,.06) !important; color: #0d0d12 !important; border-color: rgba(0,0,0,.12) !important; }
[data-theme="light"] .btn-script:hover { background: rgba(0,0,0,.1) !important; }
[data-theme="light"] .btn-script svg { stroke: #0d0d12 !important; }

.btn-plan {
  background: rgba(255,255,255,.04) !important; color: rgba(255,255,255,.7) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
}
.btn-plan:hover { background: rgba(255,255,255,.08) !important; }
.btn-plan svg { stroke: currentColor !important; }
[data-theme="light"] .btn-plan { background: rgba(0,0,0,.04) !important; color: #374151 !important; border-color: rgba(0,0,0,.08) !important; }
[data-theme="light"] .btn-plan:hover { background: rgba(0,0,0,.08) !important; }

/* Чат — пузыри пользователя */
.msg.user .msg-bubble {
  background: #fff !important; color: #000 !important;
  box-shadow: 0 2px 10px rgba(255,255,255,.08) !important;
}
.msg.user .msg-avatar {
  background: #fff !important; color: #000 !important;
}
[data-theme="light"] .msg.user .msg-bubble { background: #0d0d12 !important; color: #fff !important; }
[data-theme="light"] .msg.user .msg-avatar { background: #0d0d12 !important; color: #fff !important; }

/* ── КНОПКИ СКАЧИВАНИЯ / ПУБЛИКАЦИИ ──────────────────────── */
.btn-dl {
  background: #fff !important; color: #000 !important;
  box-shadow: none !important;
}
.btn-dl:hover { opacity: .85 !important; }
[data-theme="light"] .btn-dl { background: #0d0d12 !important; color: #fff !important; }

.btn-upload {
  background: #fff !important; color: #000 !important;
}
.btn-upload svg { stroke: #000 !important; }
[data-theme="light"] .btn-upload { background: #0d0d12 !important; color: #fff !important; }
[data-theme="light"] .btn-upload svg { stroke: #fff !important; }

.btn-publish {
  background: #fff !important; color: #000 !important;
}
.btn-publish svg { stroke: #000 !important; }
[data-theme="light"] .btn-publish { background: #0d0d12 !important; color: #fff !important; }

.btn-do-publish {
  background: #fff !important; color: #000 !important;
}
[data-theme="light"] .btn-do-publish { background: #0d0d12 !important; color: #fff !important; }

.btn-connect {
  background: #fff !important; color: #000 !important;
  box-shadow: none !important;
}
.btn-connect svg { stroke: #000 !important; }
[data-theme="light"] .btn-connect { background: #0d0d12 !important; color: #fff !important; }
[data-theme="light"] .btn-connect svg { stroke: #fff !important; }

/* ── APP.HTML СПЕЦИФИЧНЫЕ КНОПКИ ──────────────────────────── */
.cm-gen {
  background: #fff !important; color: #000 !important;
  box-shadow: none !important;
}
[data-theme="light"] .cm-gen { background: #0d0d12 !important; color: #fff !important; }

.clip-lock-btn {
  background: #fff !important; color: #000 !important;
  box-shadow: none !important;
}
[data-theme="light"] .clip-lock-btn { background: #0d0d12 !important; color: #fff !important; }

.btn-upgrade-inline {
  background: #fff !important; color: #000 !important;
  box-shadow: none !important;
}
[data-theme="light"] .btn-upgrade-inline { background: #0d0d12 !important; color: #fff !important; }

/* ── ADMIN ────────────────────────────────────────────────── */
.login-btn {
  background: #fff !important; color: #000 !important;
}
[data-theme="light"] .login-btn { background: #0d0d12 !important; color: #fff !important; }

.btn-grant {
  background: #fff !important; color: #000 !important;
}
[data-theme="light"] .btn-grant { background: #0d0d12 !important; color: #fff !important; }

/* ── ПРОГРЕСС-БАРЫ ОБРАБОТКИ ──────────────────────────────── */
.progress-bar {
  background: linear-gradient(90deg, #fff, rgba(255,255,255,.55)) !important;
}
.tokens-fill {
  background: linear-gradient(90deg, #fff, rgba(255,255,255,.5)) !important;
}
[data-theme="light"] .progress-bar { background: linear-gradient(90deg, #0d0d12, #374151) !important; }
[data-theme="light"] .tokens-fill { background: linear-gradient(90deg, #0d0d12, #374151) !important; }

/* ── ТЕКСТ "ТОКЕНЫ" ───────────────────────────────────────── */
.tokens-num {
  background: linear-gradient(135deg, #fff, rgba(255,255,255,.65)) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
[data-theme="light"] .tokens-num { background: linear-gradient(135deg, #0d0d12, #374151) !important; }

/* ── INPUT TAB ACTIVE (app.html) ──────────────────────────── */
.input-tab.active {
  border-color: #fff !important;
  color: #fff !important;
  background: rgba(255,255,255,.07) !important;
}
[data-theme="light"] .input-tab.active {
  border-color: #0d0d12 !important;
  color: #0d0d12 !important;
  background: rgba(0,0,0,.05) !important;
}

/* ── IDEAS PAGE ──────────────────────────────────────────── */
.hero h1 span {
  background: linear-gradient(135deg, #fff 0%, #93c5fd 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
[data-theme="light"] .hero h1 span {
  background: linear-gradient(135deg, #0f172a, #1e40af) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

.hero-badge {
  background: rgba(255,255,255,.07) !important;
  border-color: rgba(255,255,255,.14) !important;
  color: rgba(255,255,255,.75) !important;
}
[data-theme="light"] .hero-badge {
  background: rgba(0,0,0,.04) !important;
  border-color: rgba(0,0,0,.1) !important;
  color: #374151 !important;
}

.hero-reward {
  background: rgba(255,255,255,.05) !important;
  border-color: rgba(255,255,255,.12) !important;
}
.hero-reward svg { color: rgba(255,255,255,.55) !important; }
[data-theme="light"] .hero-reward {
  background: rgba(0,0,0,.03) !important;
  border-color: rgba(0,0,0,.08) !important;
}
[data-theme="light"] .hero-reward svg { color: #6b7280 !important; }

.submit-block h2 svg { color: rgba(255,255,255,.5) !important; }
[data-theme="light"] .submit-block h2 svg { color: #6b7280 !important; }

/* ── SIDEBAR ACTIVE (settings.html) ──────────────────────── */
.sidebar-link.active {
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
}
.sidebar-link.active svg { stroke: #fff !important; }
[data-theme="light"] .sidebar-link.active { background: rgba(0,0,0,.06) !important; color: #0d0d12 !important; }
[data-theme="light"] .sidebar-link.active svg { stroke: #0d0d12 !important; }
