/* Flagville CTF – Breakpointing Bad palette and canvas background.
   Designed as an override loaded AFTER Lingonberry or core CSS.
   Source colors and visual behavior adapted from the supplied website archive. */
:root {
  color-scheme: dark;
  --bpb-bg: #000000;
  --bpb-surface: rgba(8, 14, 18, .91);
  --bpb-surface-raised: rgba(14, 22, 27, .96);
  --bpb-border: rgba(53, 229, 230, .24);
  --bpb-cyan: #35e5e6;
  --bpb-pink: #f200e4;
  --bpb-text: #e0e7eb;
  --bpb-muted: #9eafb7;
  --bs-body-bg: #000;
  --bs-body-color: #e0e7eb;
  --bs-primary: #35e5e6;
  --bs-primary-rgb: 53, 229, 230;
  --bs-secondary-color: #9eafb7;
  --bs-border-color: rgba(53, 229, 230, .24);
  --bs-link-color: #35e5e6;
  --bs-link-hover-color: #f200e4;
}
html, body { min-height: 100%; background: var(--bpb-bg) !important; color: var(--bpb-text); }
body { position: relative; isolation: isolate; }
/* Background is decorative, behind all UI and never captures input. */
#bpb-ctf-bits {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  z-index: -1;
  pointer-events: none;
  display: block;
}
/* Override opaque framework wrappers so the 1/0 field remains visible. */
body > .container, body > .container-fluid, main, .main, #main,
.jumbotron, .bg-light, .bg-white, .bg-body, .bg-body-tertiary {
  background-color: transparent !important;
}
/* Keep navigation and interactive panels legible over animation. */
.navbar, nav.navbar, .navbar.bg-dark, .navbar.bg-light {
  background: rgba(0, 0, 0, .94) !important;
  border-bottom: 1px solid var(--bpb-border);
  backdrop-filter: blur(8px);
}
.navbar a, .navbar .nav-link, .navbar-brand { color: var(--bpb-text) !important; }
.navbar a:hover, .navbar .nav-link.active { color: var(--bpb-cyan) !important; }
.card, .modal-content, .dropdown-menu, .list-group-item,
.challenge-button, .challenge-window, .challenge-modal,
.accordion-item, .offcanvas, .toast, .alert,
.table, .pagination .page-link {
  background-color: var(--bpb-surface) !important;
  color: var(--bpb-text) !important;
  border-color: var(--bpb-border) !important;
}
.card, .modal-content, .dropdown-menu, .accordion-item { border: 1px solid var(--bpb-border); }
.card-header, .card-footer, .modal-header, .modal-footer, .accordion-button {
  background: var(--bpb-surface-raised) !important;
  color: var(--bpb-text) !important;
  border-color: var(--bpb-border) !important;
}
.table { --bs-table-bg: transparent; --bs-table-color: var(--bpb-text); --bs-table-border-color: var(--bpb-border); }
.table > :not(caption) > * > * { background-color: rgba(8,14,18,.9) !important; color: var(--bpb-text); }
.table-striped > tbody > tr:nth-of-type(odd) > * { background-color: rgba(18,29,34,.95) !important; }
a:not(.btn) { color: var(--bpb-cyan); }
a:not(.btn):hover { color: var(--bpb-pink); }
h1, h2, h3, h4, h5, h6 { color: var(--bpb-text); }
h1, .display-1, .display-2, .display-3 { text-shadow: 0 0 20px rgba(53,229,230,.10); }
.text-muted, .text-secondary, .form-text { color: var(--bpb-muted) !important; }
.form-control, .form-select, textarea, input[type="text"], input[type="password"], input[type="email"] {
  background: #10191e !important;
  color: var(--bpb-text) !important;
  border: 1px solid rgba(53,229,230,.33) !important;
}
.form-control:focus, .form-select:focus, textarea:focus {
  border-color: var(--bpb-cyan) !important;
  box-shadow: 0 0 0 .2rem rgba(53,229,230,.16) !important;
}
.form-control::placeholder, textarea::placeholder { color: #8d9aa2; }
.btn-primary, .btn-success, .btn-info {
  color: #001315 !important;
  background: var(--bpb-cyan) !important;
  border-color: var(--bpb-cyan) !important;
}
.btn-primary:hover, .btn-success:hover, .btn-info:hover {
  background: #92fcfb !important;
  border-color: #92fcfb !important;
}
.btn-outline-primary { border-color: var(--bpb-cyan) !important; color: var(--bpb-cyan) !important; }
.btn-outline-primary:hover { background: var(--bpb-cyan) !important; color: #001315 !important; }
.btn-danger, .btn-outline-danger:hover { background: var(--bpb-pink) !important; border-color: var(--bpb-pink) !important; color: #08000b !important; }
.badge.bg-primary, .badge.bg-info { background: var(--bpb-cyan) !important; color: #001315 !important; }
::selection { background: rgba(53,229,230,.45); color: #fff; }
@media (prefers-reduced-motion: reduce) {
  #bpb-ctf-bits { opacity: .55; }
}

/* Remove CTFd footer */
footer, .footer, #footer {
    display: none !important;
}

/* Flagville navigation — Breakpointing Bad colors */

.navbar {
    background: #000 !important;
    border-bottom: 1px solid rgba(53, 229, 230, 0.3);
}

.navbar .navbar-brand,
.navbar .navbar-brand:hover {
    color: #fff !important;
}

.navbar .navbar-nav .nav-link {
    color: #f200e4 !important;
    transition: color 0.15s ease;
}

.navbar .navbar-nav .nav-link:hover,
.navbar .navbar-nav .nav-link:focus-visible,
.navbar .navbar-nav .nav-link.bpb-current {
    color: #35e5e6 !important;
}

.navbar .navbar-nav .nav-link.bpb-current {
    box-shadow: inset 0 -2px 0 #35e5e6;
}
