/* LiteQuant Silicon Valley Unified Theme Overrides */

:root {
  --sv-bg-0: #060d1f;
  --sv-bg-1: #0e1a3c;
  --sv-cyan: #20b9ff;
  --sv-blue: #3148ff;
  --sv-indigo: #1b2568;
  --sv-text: #0f1e33;
  --sv-muted: #5b6f8c;
  --sv-card: rgba(255, 255, 255, 0.84);
  --sv-border: rgba(116, 147, 189, 0.28);
}

body {
  color: var(--sv-text);
  background:
    radial-gradient(circle at 8% -10%, rgba(32, 185, 255, 0.18) 0%, transparent 34%),
    radial-gradient(circle at 92% 0%, rgba(49, 72, 255, 0.14) 0%, transparent 30%),
    linear-gradient(160deg, #f8fbff 0%, #eff5fd 52%, #e9f0fa 100%);
}

.card,
.section-card,
.subscription-card,
.profile-card,
.feature-item,
.pricing-card {
  background: var(--sv-card) !important;
  border: 1px solid var(--sv-border) !important;
  box-shadow: 0 14px 40px rgba(15, 30, 51, 0.11) !important;
  backdrop-filter: blur(14px);
}

/* Generic modal + popup enhancement */
.modal-overlay,
.login-modal-overlay {
  backdrop-filter: blur(9px) saturate(150%);
  background: rgba(5, 12, 24, 0.58) !important;
}

.modal,
.modal-content,
.login-modal,
.user-dropdown-menu,
.dropdown-menu,
.toast {
  border: 1px solid var(--sv-border) !important;
  box-shadow: 0 24px 70px rgba(10, 22, 42, 0.22) !important;
  background: rgba(255, 255, 255, 0.92) !important;
  backdrop-filter: blur(16px);
}

.modal-header h3,
.login-header h2,
.section-header h2,
.profile-page .page-header h1,
.subscription-card .card-header h1 {
  letter-spacing: -0.02em;
}

.btn,
.btn-login,
.btn-pay,
.api-key-action-btn,
.btn-verify {
  border-radius: 12px !important;
}

.btn-primary,
.btn-pay,
.subscription-api-card {
  background: linear-gradient(126deg, var(--sv-cyan) 0%, #16a9f1 38%, var(--sv-blue) 100%) !important;
  color: #fff !important;
}

.btn-outline,
.btn-verify,
.modal-close,
.api-key-btn {
  border-color: rgba(61, 134, 238, 0.33) !important;
  background: rgba(255, 255, 255, 0.75) !important;
  color: #264163 !important;
}

.form-control,
select.form-control,
textarea.form-control {
  background: rgba(255, 255, 255, 0.9) !important;
  border-color: rgba(121, 155, 201, 0.35) !important;
  color: var(--sv-text) !important;
}

.form-control:focus {
  border-color: #2f97df !important;
  box-shadow: 0 0 0 4px rgba(32, 185, 255, 0.17) !important;
}

/* Subscription page */
.subscription-card .card-header {
  background: linear-gradient(132deg, #0f1742 0%, #182a78 56%, #2547ce 100%) !important;
}

.subscription-card .plan-badge {
  background: rgba(255, 255, 255, 0.15) !important;
  border-color: rgba(206, 228, 255, 0.3) !important;
}

.subscription-card .price-display {
  background: linear-gradient(135deg, rgba(236, 247, 255, 0.85), rgba(233, 239, 255, 0.85)) !important;
  border-color: rgba(58, 128, 225, 0.35) !important;
}

/* Profile page + drawers + API areas */
.profile-avatar-section {
  background: linear-gradient(140deg, rgba(32, 185, 255, 0.14) 0%, rgba(49, 72, 255, 0.08) 100%) !important;
}

.api-key-section-merged,
.api-key-value-box {
  background: rgba(13, 23, 53, 0.38) !important;
  border: 1px solid rgba(148, 189, 255, 0.24);
}

.profile-nav-item.active {
  background: linear-gradient(100deg, rgba(32, 185, 255, 0.18), rgba(49, 72, 255, 0.14)) !important;
  border-left-color: #1ea3e7 !important;
  color: #1a3673 !important;
}

/* Toasts and notification bars */
.toast-success,
.notice.success,
.alert-success {
  background: linear-gradient(120deg, rgba(16, 175, 106, 0.15), rgba(255, 255, 255, 0.86)) !important;
  border-color: rgba(16, 175, 106, 0.35) !important;
}

.toast-info,
.notice.info,
.alert-info {
  background: linear-gradient(120deg, rgba(32, 185, 255, 0.2), rgba(255, 255, 255, 0.86)) !important;
  border-color: rgba(32, 185, 255, 0.35) !important;
}

/* SweetAlert 使用与共享弹窗一致的视觉语言 */
.swal2-container {
  backdrop-filter: blur(9px) saturate(145%);
}

.swal2-popup {
  border: 1px solid rgba(116, 147, 189, 0.28) !important;
  border-radius: 24px !important;
  background: rgba(251, 253, 255, 0.96) !important;
  box-shadow: 0 30px 90px rgba(7, 18, 38, 0.28) !important;
}

.swal2-title {
  color: var(--sv-text) !important;
  font-size: 1.55rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em;
}

.swal2-html-container {
  color: var(--sv-muted) !important;
  line-height: 1.7 !important;
}

.swal2-actions {
  gap: 10px !important;
}

.swal2-styled.swal2-confirm,
.swal2-styled.swal2-cancel {
  min-width: 112px;
  padding: 11px 22px !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
}

.swal2-styled.swal2-confirm {
  background: linear-gradient(126deg, var(--sv-cyan), var(--sv-blue)) !important;
  box-shadow: 0 10px 24px rgba(49, 72, 255, 0.24) !important;
}

.swal2-styled.swal2-cancel {
  color: #264163 !important;
  background: #edf2f8 !important;
  box-shadow: none !important;
}

/* Intro page refinements */
.intro-page {
  background:
    radial-gradient(circle at 15% 15%, rgba(26, 169, 233, 0.36) 0%, transparent 38%),
    radial-gradient(circle at 90% 10%, rgba(95, 124, 255, 0.26) 0%, transparent 40%),
    linear-gradient(145deg, #08122a 0%, #0c1a3e 40%, #112d68 100%) !important;
}

body.intro-theme .user-avatar-btn {
  border-color: rgba(125, 188, 255, 0.28);
  color: #eaf4ff;
  background:
    linear-gradient(135deg, rgba(31, 59, 108, 0.88), rgba(13, 28, 61, 0.82));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 10px 26px rgba(2, 9, 25, 0.28);
  backdrop-filter: blur(18px) saturate(1.18);
}

body.intro-theme .user-avatar-btn:hover,
body.intro-theme .user-avatar-btn:focus-visible {
  border-color: rgba(105, 216, 255, 0.58);
  background:
    linear-gradient(135deg, rgba(38, 74, 132, 0.94), rgba(17, 35, 75, 0.9));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.12),
    0 0 0 4px rgba(32, 185, 255, 0.11),
    0 14px 32px rgba(2, 9, 25, 0.36);
}

body.intro-theme .user-avatar-btn img {
  border: 2px solid rgba(160, 213, 255, 0.58);
  box-shadow: 0 0 0 3px rgba(32, 185, 255, 0.1);
}

body.intro-theme .user-avatar-btn #navUserName {
  color: #edf7ff;
}

body.intro-theme .user-avatar-chevron {
  color: #b7d4f2;
  background: rgba(139, 190, 239, 0.13);
}

body.intro-theme .user-menu-dropdown.open .user-avatar-chevron {
  color: #8ce6ff;
  background: rgba(32, 185, 255, 0.18);
}

body.intro-theme .nav-user-plan.plan-free {
  color: #d2e5f8;
  border-color: rgba(159, 193, 228, 0.27);
  background: rgba(159, 193, 228, 0.12);
}

body.intro-theme .nav-user-plan.plan-basic {
  color: #91f0cb;
  border-color: rgba(74, 222, 164, 0.34);
  background: rgba(16, 185, 129, 0.16);
}

body.intro-theme .nav-user-plan.plan-pro,
body.intro-theme .nav-user-plan.plan-enterprise {
  color: #c6d5ff;
  border-color: rgba(136, 158, 255, 0.34);
  background: linear-gradient(120deg, rgba(32, 185, 255, 0.16), rgba(100, 111, 255, 0.2));
}

body.intro-theme .user-dropdown-menu {
  border-color: rgba(125, 188, 255, 0.24) !important;
  background:
    linear-gradient(155deg, rgba(17, 36, 74, 0.97), rgba(8, 20, 46, 0.97)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 24px 54px rgba(2, 9, 25, 0.5) !important;
  backdrop-filter: blur(24px) saturate(1.2);
}

body.intro-theme .user-dropdown-header {
  border-color: rgba(105, 216, 255, 0.2);
  background: linear-gradient(125deg, rgba(32, 185, 255, 0.13), rgba(93, 105, 255, 0.11));
}

body.intro-theme .user-dropdown-header img {
  border: 2px solid rgba(160, 213, 255, 0.48);
}

body.intro-theme .user-dropdown-menu .user-name {
  color: #edf7ff;
}

body.intro-theme .user-dropdown-menu .user-status.plan-free {
  color: #d2e5f8;
  border-color: rgba(159, 193, 228, 0.27);
  background: rgba(159, 193, 228, 0.12);
}

body.intro-theme .user-dropdown-menu .user-status.plan-basic {
  color: #91f0cb;
  border-color: rgba(74, 222, 164, 0.34);
  background: rgba(16, 185, 129, 0.16);
}

body.intro-theme .user-dropdown-menu .user-status.plan-pro,
body.intro-theme .user-dropdown-menu .user-status.plan-enterprise {
  color: #c6d5ff;
  border-color: rgba(136, 158, 255, 0.34);
  background: linear-gradient(120deg, rgba(32, 185, 255, 0.16), rgba(100, 111, 255, 0.2));
}

body.intro-theme .user-dropdown-divider {
  background: linear-gradient(90deg, transparent, rgba(151, 190, 232, 0.24), transparent);
}

body.intro-theme .user-dropdown-item {
  color: #c7d9ed;
}

body.intro-theme .user-dropdown-item i {
  color: #89a9ca;
}

body.intro-theme .user-dropdown-item:hover {
  color: #8ce6ff;
  background: rgba(32, 185, 255, 0.11);
}

body.intro-theme .user-dropdown-item:hover i {
  color: #8ce6ff;
}

body.intro-theme .user-dropdown-item.text-danger {
  color: #ff9fa8;
}

body.intro-theme .user-dropdown-item.text-danger:hover {
  color: #ffc1c7;
  background: rgba(255, 85, 99, 0.12);
}

@media (max-width: 768px) {
  .modal,
  .modal-content,
  .login-modal {
    width: calc(100% - 22px) !important;
    margin: 0 11px;
  }
}
