/* BetterCurseForge — Purple Night Theme */
/* A rich, sleek, fully-integrated dark purple theme for CurseForge Launcher */

:root,
.cf-app,
.base-skin,
.dark-skin,
.cf-classic,
.theme-purple-night {
  /* ── Accent & Brand ── */
  --surface-brand-brand: #8b5cf6 !important;
  --surface-brand-brand-hover: #9d74f7 !important;
  --color-primary: #8b5cf6 !important;
  --color-primary-hover: #9d74f7 !important;
  --color-primary-active: #7c3aed !important;
  --color-accent: #a78bfa !important;
  --color-highlight: #8b5cf6 !important;
  --border-primary: #8b5cf6 !important;
  --border-highlight: #8b5cf6 !important;
  --selected-item-border: 3px solid #8b5cf6 !important;

  /* ── Backgrounds & Surfaces ── */
  --color-background: #0d0818 !important;
  --surface-base: #07040d !important;
  --surface-base-half: rgba(7, 4, 13, 0.5) !important;
  --surface-primary: #110b20 !important;
  --surface-secondary: #170e2b !important;
  --surface-tertiery: #21153d !important;
  --surface-tertiery-hover: #2c1c52 !important;
  --surface-quartinery: #382468 !important;
  --surface-on-surface: rgba(255, 255, 255, 0.08) !important;
  --surface-on-surface-hover: rgba(255, 255, 255, 0.14) !important;

  /* ── Cards (Modpack / Project) ── */
  --surface-card: #170e2b !important;
  --surface-card-hover: #221540 !important;
  --color-surface-card: #170e2b !important;
  --color-surface-card-hover: #221540 !important;
  --color-surface-card-active: #2b1b50 !important;
  --color-surface-card-active-hover: #352163 !important;
  --color-surface-card-disabled: #100a1e !important;
  --color-surface-info-block: #21153d !important;
  --color-surface-folder-view-item: #21153d !important;

  /* ── Tables & Lists ── */
  --color-surface-table: #170e2b !important;
  --color-surface-table-hover: #21153d !important;
  --color-surface-table-head: #1c1134 !important;
  --color-surface-table-head-hover: #261747 !important;

  /* ── Modals & Dialogs ── */
  --color-surface-modal: #170e2b !important;
  --color-surface-modal-footer: #110b20 !important;
  --color-modal-border: #2c1c52 !important;
  --color-modal-backdrop: rgba(7, 4, 13, 0.85) !important;
  --color-modal-backdrop-low: rgba(7, 4, 13, 0.5) !important;

  /* ── Title Bar ── */
  --title-bar-background: linear-gradient(90deg, #110b20 0%, #1a1032 50%, #110b20 100%) !important;
  --btn-window-action: #a78bfa !important;
  --btn-window-action-hover: #2c1c52 !important;

  /* ── Typography & Text ── */
  --text-pure: #ffffff !important;
  --text-primary: #f1f5f9 !important;
  --color-text-title: #f8fafc !important;
  --color-text-title-hover: #ffffff !important;
  --color-text-primary: #e2e8f0 !important;
  --color-text-body: #cbd5e1 !important;
  --color-text-secondary: #94a3b8 !important;
  --color-text-secondary-icon: #94a3b8 !important;
  --color-text-dropdown: #e2e8f0 !important;
  --color-text-tooltip: #ede9fe !important;

  /* ── Buttons ── */
  --btn-primary-text: #ffffff !important;
  --btn-secondary-hover: rgba(139, 92, 246, 0.16) !important;
  --btn-secondary-border: rgba(139, 92, 246, 0.35) !important;
  --btn-clean-hover: #21153d !important;
  --btn-tertiary-background: #21153d !important;
  --btn-tertiary-hover-background: #2c1c52 !important;
  --btn-tertiary-text: #f1f5f9 !important;
  --btn-tertiary-hover-text: #ffffff !important;

  /* ── Borders & Dividers ── */
  --border-tertiery: rgba(139, 92, 246, 0.18) !important;
  --color-divider-1: #21153d !important;
  --color-divider-2: #2c1c52 !important;

  /* ── Scrollbars ── */
  --color-scrollbar-thumb: #3b2266 !important;

  /* ── Theme Thumbnail Preview ── */
  --color-thumb-primary: #8b5cf6 !important;
  --color-thumb-title: #3b2266 !important;
  --color-thumb-body: #241442 !important;
  --color-thumb-name: #ffffff !important;
  --color-thumb-icon-bg: #8b5cf6 !important;
  --color-thumb-check-color: #ffffff !important;
}

/* ── Element-Specific Polish ── */

/* Title bar */
.title-bar,
[class*="title-bar"],
[class*="TitleBar"] {
  background: var(--title-bar-background) !important;
}

/* Sidenav / left navigation */
.sidenav,
[class*="sidenav"] {
  background-color: var(--surface-secondary) !important;
}

/* Sidebar game icon active indicator bar */
.games-side-menu li a:after {
  background-color: var(--surface-brand-brand) !important;
}

/* User profile button & avatar border */
#user-login-menu .user-profile-button:before,
.user-profile-button:before {
  border-color: var(--surface-brand-brand) !important;
}
#user-login-menu .user-profile-button:hover:before,
#user-login-menu.is-open .user-profile-button:before,
.user-profile-button:hover:before {
  border-color: var(--surface-brand-brand-hover) !important;
}

/* Sidebar active tab indicator (settings, etc.) */
.system-side-menu ul.user-menu .user-menu-item > a.tab.is-active:before,
.system-side-menu ul.user-menu .user-menu-item > button.tab.is-active:before,
.system-side-menu ul.user-menu .user-menu-item > .subscription-tooltip > a.tab.is-active:before {
  border-left-color: var(--surface-brand-brand) !important;
}
.system-side-menu ul.user-menu .user-menu-item > a.tab.is-active,
.system-side-menu ul.user-menu .user-menu-item > button.tab.is-active {
  color: var(--surface-brand-brand) !important;
}

/* Active tab indicator and line in horizontal tabs */
.tabs-menu ul .line,
.tabs-menu ul li a:before,
.tabs-menu ul li .tab-control:before {
  background-color: var(--surface-brand-brand) !important;
}
.tabs-menu ul li a.is-active,
.tabs-menu ul li.is-active a {
  color: var(--color-text-title, #ffffff) !important;
}

/* Notification badges and dots */
.highlight-indicator {
  background-color: #8b5cf6 !important;
  box-shadow: 0 0 6px rgba(139, 92, 246, 0.6) !important;
}
.badge-active:before,
.count-badge-wrapper .count-badge,
.popover-button button.btn-clean.btn-with-icon.has-badge:after {
  background: var(--surface-brand-brand) !important;
}

/* Primary buttons */
.btn-primary:not(.btn-secondary),
button[class*="primary"]:not([class*="secondary"]) {
  background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%) !important;
  border: none !important;
  color: #ffffff !important;
}

.btn-primary:not(.btn-secondary):hover,
button[class*="primary"]:not([class*="secondary"]):hover {
  background: linear-gradient(135deg, #9d74f7 0%, #8b5cf6 100%) !important;
}


/* Modpack card typography */
.tile-view-item .title,
.tile-view-item .title .name-container .mod-name {
  color: var(--color-text-title, #ffffff) !important;
}

.tile-view-item .author {
  color: var(--color-text-secondary, #94a3b8) !important;
}

/* Modpack card version badge */
.tile-view-item .art .modpack-version:before {
  background-color: rgba(23, 14, 43, 0.85) !important;
}

.tile-view-item .art .modpack-version {
  border-radius: 4px;
}

/* Selection */
::selection {
  background: rgba(139, 92, 246, 0.4) !important;
  color: #ffffff !important;
}

/* Scrollbars */
::-webkit-scrollbar-track {
  background: var(--surface-base);
}
::-webkit-scrollbar-thumb {
  background: var(--color-scrollbar-thumb);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #52318c;
}