// BitcoinPurple – Bootswatch overrides
// Handles everything Bootstrap's SCSS variables can't reach

@use "sass:color";

// ── Web font ──────────────────────────────────────────────────────────────────
$web-font-path: "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" !default;
@if $web-font-path {
  @import url($web-font-path);
}

// ── Mixins ────────────────────────────────────────────────────────────────────
@mixin purple-glow($size: 8px) {
  box-shadow: 0 0 $size rgba(168, 85, 247, .55), 0 0 #{$size * 3} rgba(168, 85, 247, .2);
}

// ── Body ──────────────────────────────────────────────────────────────────────
body {
  background: #06000f !important;
}

// ── Headings ─────────────────────────────────────────────────────────────────
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  color: #fff;
}

// ── Navbar ────────────────────────────────────────────────────────────────────
.navbar {
  background: #110028 !important;
  border-bottom: 2px solid #7c3aed;
  box-shadow: 0 2px 20px rgba(0, 0, 0, .8);
}

.navbar-brand { color: #fff !important; font-weight: 700; }

.nav-link {
  color: rgba(236, 224, 255, .65) !important;
  border-radius: .35rem;
  transition: color .15s, background .15s;

  &:hover, &.active {
    color: #fff !important;
    background: rgba(168, 85, 247, .2) !important;
  }
}

// ── Sidebar ───────────────────────────────────────────────────────────────────
#sidebar,
.sidebar,
[id*="sidebar"],
.nav-sidebar,
.col-sidebar {
  background: #110028 !important;
  border-right: 2px solid #7c3aed;
}

// ── Cards ─────────────────────────────────────────────────────────────────────
.card {
  background: #1d0845 !important;
  border: 1px solid rgba(124, 58, 237, .55) !important;
}

.card-header {
  background: #3a158a !important;
  border-bottom: 2px solid rgba(124, 58, 237, .7) !important;
  color: #fff !important;
  font-weight: 600;
}

// ── Tables ────────────────────────────────────────────────────────────────────
.table {
  color: #ece0ff;

  thead th {
    background: #3a158a !important;
    color: #fff !important;
    border-bottom: 2px solid #7c3aed !important;
    border-top: none !important;
    font-weight: 700;
    text-transform: uppercase;
    font-size: .78rem;
    letter-spacing: .07em;
    white-space: nowrap;
  }

  td { border-color: rgba(124, 58, 237, .3) !important; }

  tbody tr:nth-child(odd) td  { background: rgba(58, 21, 138, .2)   !important; }
  tbody tr:nth-child(even) td { background: rgba(17, 0, 40, .15)    !important; }
  tbody tr:hover td           { background: rgba(168, 85, 247, .15) !important; }

  // Monospace hash links
  td a {
    color: #c084fc;
    &:hover { color: #fff; text-shadow: 0 0 8px rgba(192, 132, 252, .8); }
  }
}

// ── Buttons ───────────────────────────────────────────────────────────────────
.btn-primary {
  background: linear-gradient(135deg, #7c3aed, #9333ea) !important;
  border: none !important;

  &:hover, &:focus {
    background: linear-gradient(135deg, #9333ea, #a855f7) !important;
    @include purple-glow(10px);
  }
}

.btn-secondary {
  background: #3a158a !important;
  border: 1px solid #7c3aed !important;
  color: #ece0ff !important;
}

// ── Badges ────────────────────────────────────────────────────────────────────
.badge.bg-primary    { background: #7c3aed !important; }
.badge.bg-secondary  { background: #3a158a !important; }

.badge.bg-success {
  background: rgba(74, 222, 128, .18) !important;
  color: #4ade80 !important;
  border: 1px solid rgba(74, 222, 128, .4) !important;
}

.badge.bg-danger {
  background: rgba(248, 113, 113, .18) !important;
  color: #f87171 !important;
  border: 1px solid rgba(248, 113, 113, .4) !important;
}

// ── Inputs ───────────────────────────────────────────────────────────────────
.form-control,
.form-select {
  background: #110028 !important;
  border-color: rgba(124, 58, 237, .55) !important;
  color: #ece0ff !important;

  &::placeholder { color: rgba(192, 132, 252, .6); }

  &:focus {
    background: #110028 !important;
    border-color: #9333ea !important;
    box-shadow: 0 0 0 3px rgba(147, 51, 234, .25) !important;
    color: #fff !important;
  }
}

// ── Pagination ────────────────────────────────────────────────────────────────
.page-link {
  background: #1d0845 !important;
  border-color: rgba(124, 58, 237, .5) !important;
  color: #c084fc !important;
  transition: all .15s;

  &:hover {
    background: #7c3aed !important;
    border-color: #7c3aed !important;
    color: #fff !important;
    @include purple-glow(6px);
  }
}

.page-item.active .page-link {
  background: linear-gradient(135deg, #7c3aed, #9333ea) !important;
  border-color: transparent !important;
  color: #fff !important;
  @include purple-glow(6px);
}

// ── Scrollbar ─────────────────────────────────────────────────────────────────
::-webkit-scrollbar         { width: 6px; height: 6px; }
::-webkit-scrollbar-track   { background: #06000f; }
::-webkit-scrollbar-thumb   { background: #7c3aed; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #9333ea; }

// ── Breadcrumbs ───────────────────────────────────────────────────────────────
.breadcrumb         { background: #1d0845 !important; }
.breadcrumb-item a  { color: #c084fc !important; }

// ── Code / pre ────────────────────────────────────────────────────────────────
code {
  color: #f0abfc;
  background: rgba(58, 21, 138, .5);
  padding: .1em .3em;
  border-radius: .2em;
}

pre {
  background: #110028;
  border: 1px solid rgba(124, 58, 237, .4);
  color: #ece0ff;
}

// ── Footer ────────────────────────────────────────────────────────────────────
footer,
.footer {
  background: #110028 !important;
  border-top: 2px solid #7c3aed !important;
  color: rgba(168, 85, 247, .8) !important;
}

// ── Alerts ───────────────────────────────────────────────────────────────────
.alert {
  border: none;
  color: $white;
}

// ── Misc ──────────────────────────────────────────────────────────────────────
.text-muted { color: #9d6ae8 !important; }

hr {
  border-color: rgba(124, 58, 237, .4);
  opacity: .6;
}
